intelicoreact 0.0.61 → 0.0.65

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

@@ -62,6 +62,7 @@ var InputDateRange = function InputDateRange(props) {
       hideArrows = _props$hideArrows === void 0 ? false : _props$hideArrows,
       isOptionsRight = props.isOptionsRight,
       limitRange = props.limitRange,
+      isShortWeekNames = props.isShortWeekNames,
       isUseAbs = props.isUseAbs,
       absTooltip = props.absTooltip;
   var actualValues = (0, _dependencies.getActualDateRange)(value);
@@ -86,6 +87,25 @@ var InputDateRange = function InputDateRange(props) {
   var internalContainerRef = (0, _react.useRef)(null);
   var isEndDateNearFuture = (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).isSameOrAfter((0, _momentTimezone.default)());
 
+  var handleChange = function handleChange(input) {
+    var newValue = (0, _dependencies.getActualDateRange)(input);
+
+    var formatedValue = _objectSpread(_objectSpread(_objectSpread({
+      intervalKey: newValue.intervalKey,
+      start: newValue.start ? (0, _momentTimezone.default)(newValue.start).format('YYYY-MM-DDTHH:mm') : newValue.start,
+      end: newValue.end ? (0, _momentTimezone.default)(newValue.end).format('YYYY-MM-DDTHH:mm') : newValue.end
+    }, newValue.compare ? {
+      compare: newValue.compare
+    } : {}), newValue.startPrevDate ? {
+      startPrevDate: (0, _momentTimezone.default)(newValue.startPrevDate).format('YYYY-MM-DDTHH:mm')
+    } : {}), newValue.endPrevDate ? {
+      endPrevDate: (0, _momentTimezone.default)(newValue.endPrevDate).format('YYYY-MM-DDTHH:mm')
+    } : {});
+
+    onChange(formatedValue);
+    return formatedValue;
+  };
+
   var Range = function Range() {
     var SYMBOLS_QUANTITY_IF_TIME_ADDED = 13;
     var start = actualValues.start,
@@ -116,8 +136,7 @@ var InputDateRange = function InputDateRange(props) {
     var start = actualValues.start,
         end = actualValues.end;
     var intervalHoursCount = (0, _momentTimezone.default)(end).diff(start, 'hours');
-    var newEnd;
-    var newStart;
+    var newEnd, newStart;
     var endHours = (0, _momentTimezone.default)(end).hours();
     var startHours = (0, _momentTimezone.default)(start).hours();
 
@@ -131,7 +150,7 @@ var InputDateRange = function InputDateRange(props) {
 
     var startPrevDate = (0, _momentTimezone.default)(newStart).subtract(intervalHoursCount, 'hours').subtract(1, 'seconds');
     var endPrevDate = (0, _momentTimezone.default)(newEnd).subtract(1, 'seconds');
-    onChange(_objectSpread(_objectSpread({}, value), {}, {
+    handleChange(_objectSpread(_objectSpread({}, value), {}, {
       intervalKey: (_getActualDateRange = (0, _dependencies.getActualDateRange)({
         start: newStart,
         end: newEnd
@@ -146,36 +165,34 @@ var InputDateRange = function InputDateRange(props) {
   var handleArrowClick = function handleArrowClick(type) {
     slideInterval(type === 'right' ? 'forward' : 'back');
     toggleOff();
-  };
+  }; // const absData = useMemo(
+  //     () => ({
+  //         body: OpenedPart,
+  //         props: {
+  //             ...props,
+  //             key: `${actualValues.start}-${actualValues.end}-${actualValues.intervalKey}-${current}-${isCompare}`,
+  //             actualValues,
+  //             current,
+  //             setCurrent,
+  //             isCompare,
+  //             setIsCompare,
+  //             toggleOff,
+  //             onChange,
+  //         },
+  //         clickOutsideCallback: () => toggleOff(),
+  //         top: internalContainerRef.current?.getBoundingClientRect()?.bottom || 0,
+  //         left: internalContainerRef.current?.getBoundingClientRect()?.left || 0,
+  //     }),
+  //     [isToggled, value, actualValues, current, isCompare],
+  // );
+  // useEffect(() => {
+  //     if (current && isUseAbs && absTooltip) onChange(current, 'absTooltip/props/current');
+  // }, [current]);
+  // useEffect(() => {
+  //     if (isUseAbs) onChange(isToggled ? absData : null, 'absTooltip');
+  // }, [isToggled]);
+
 
-  var absData = (0, _react.useMemo)(function () {
-    var _internalContainerRef, _internalContainerRef2, _internalContainerRef3, _internalContainerRef4;
-
-    return {
-      body: _OpenedPart.default,
-      props: _objectSpread(_objectSpread({}, props), {}, {
-        key: "".concat(actualValues.start, "-").concat(actualValues.end, "-").concat(actualValues.intervalKey, "-").concat(current, "-").concat(isCompare),
-        actualValues: actualValues,
-        current: current,
-        setCurrent: setCurrent,
-        isCompare: isCompare,
-        setIsCompare: setIsCompare,
-        toggleOff: toggleOff,
-        onChange: onChange
-      }),
-      clickOutsideCallback: function clickOutsideCallback() {
-        return toggleOff();
-      },
-      top: ((_internalContainerRef = internalContainerRef.current) === null || _internalContainerRef === void 0 ? void 0 : (_internalContainerRef2 = _internalContainerRef.getBoundingClientRect()) === null || _internalContainerRef2 === void 0 ? void 0 : _internalContainerRef2.bottom) || 0,
-      left: ((_internalContainerRef3 = internalContainerRef.current) === null || _internalContainerRef3 === void 0 ? void 0 : (_internalContainerRef4 = _internalContainerRef3.getBoundingClientRect()) === null || _internalContainerRef4 === void 0 ? void 0 : _internalContainerRef4.left) || 0
-    };
-  }, [isToggled, value, actualValues, current, isCompare]);
-  (0, _react.useEffect)(function () {
-    if (current && isUseAbs && absTooltip) onChange(current, 'absTooltip/props/current');
-  }, [current]);
-  (0, _react.useEffect)(function () {
-    if (isUseAbs) onChange(isToggled ? absData : null, 'absTooltip');
-  }, [isToggled]);
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: internalContainerRef,
     className: (0, _classnames.default)('date-range-input', className, {
@@ -200,14 +217,7 @@ var InputDateRange = function InputDateRange(props) {
     className: (0, _classnames.default)('date-range-input__static-part')
   }, /*#__PURE__*/_react.default.createElement("button", {
     id: id,
-    className: (0, _classnames.default)('date-range-input__toggle-button') // className={cn(
-    //     'date-range-input__toggle-button',
-    //     { 'form-select__input--disabled': disabled },
-    //     { 'form-select__input--opened': isToggled },
-    //     { 'form-select__input--focused': isToggled },
-    //     className,
-    // )}
-    ,
+    className: (0, _classnames.default)('date-range-input__toggle-button'),
     disabled: disabled,
     onClick: !disabled && !isHoverable ? toggle : undefined
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -220,14 +230,14 @@ var InputDateRange = function InputDateRange(props) {
     type: "left",
     className: "date-range-input__arrow",
     onClick: function onClick() {
-      return handleArrowClick('left');
+      return handleArrowClick("left");
     },
     disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY
   }), /*#__PURE__*/_react.default.createElement(_Arrow.default, {
     type: "right",
     className: "date-range-input__arrow",
     onClick: function onClick() {
-      return handleArrowClick('right');
+      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'))
   }))), isToggled && !isUseAbs && /*#__PURE__*/_react.default.createElement(_OpenedPart.default, (0, _extends2.default)({}, props, {
@@ -238,7 +248,7 @@ var InputDateRange = function InputDateRange(props) {
     isCompare: isCompare,
     setIsCompare: setIsCompare,
     toggleOff: toggleOff,
-    onChange: onChange
+    onChange: handleChange
   })))), error && /*#__PURE__*/_react.default.createElement("span", {
     className: "date-range-input__error-block"
   }, error));

package/dist/Atomic/FormElements/InputDateRange/InputDateRange.scss

@@ -6,6 +6,7 @@
   --calendar-range-point-color: #6b81dd;
   --font-size: 12px;
   --line-height: 20px;
+  --border-radius: 4px;
 }
 
 .date-range-input {
@@ -63,7 +64,7 @@
     box-sizing: border-box;
     width: 100%;
     height: var(--input-height);
-    border-radius: 4px;
+    border-radius: var(--border-radius);
 
     display: flex;
     flex-flow: row nowrap;
@@ -200,7 +201,7 @@
     justify-content: flex-start;
     align-items: stretch;
     border: 1px solid var(--border-color);
-    border-radius: 4px;
+    border-radius: var(--border-radius);
     background: #FFFFFF;
 
     &_right-position-once-element {
@@ -297,7 +298,7 @@
       &.input__wrap {
         box-sizing: border-box;
         box-shadow: none;
-        border-radius: 4px;
+        border-radius: var(--border-radius);
 
         &_focus {
           border: 1px solid blue;
@@ -329,7 +330,7 @@
   &__hour-select-input {
     width: 70px;
     height: fit-content;
-    border-radius: 4px;
+    border-radius: var(--border-radius);
     
     &>.dropdown__trigger {
       width: 100%;
@@ -507,7 +508,7 @@
     
         &--prev-range-end {
           background: #E2E5EC;
-          border-radius: 4px;
+          border-radius: var(--border-radius);
         }
     
         &--prev-range-inside {
@@ -530,7 +531,7 @@
     box-sizing: border-box;
     width: 100%;
     padding: 8px 16px;
-    border-radius: 0 0 16px 0;
+    border-radius: 0 0 var(--border-radius) 0;
     border: none;
 
     display: flex;

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

@@ -11,6 +11,8 @@ exports.InputDateRangeTemplate = exports.default = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -19,12 +21,18 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _InputDateRange = _interopRequireDefault(require("./InputDateRange"));
 
+var _Table = _interopRequireDefault(require("../Table/Table"));
+
 var _excluded = ["dateRange"];
 
 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 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) { (0, _defineProperty2.default)(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; }
+
 global.lng = 'en';
 var _default = {
   title: 'Form Elements/InputDateRange',
@@ -38,23 +46,171 @@ var _default = {
   }
 };
 exports.default = _default;
+var tableData = {
+  header: [{
+    id: 1,
+    label: 'state'
+  }, {
+    id: 2,
+    label: 'Tags'
+  }, {
+    id: 3,
+    label: 'status'
+  }, {
+    id: 4,
+    label: 'loanAmountApproved'
+  }, {
+    id: 5,
+    label: 'loanAmountRejected'
+  }, {
+    id: 6,
+    label: 'approveRate'
+  }, {
+    id: 7,
+    label: 'actions',
+    type: 'actions'
+  }],
+  rows: [{
+    id: 1,
+    link: {
+      label: 'CA',
+      link: '#s'
+    },
+    tags: [{
+      label: 'Label 1'
+    }],
+    status: {
+      value: '90',
+      status: 'active'
+    },
+    loanAmountApproved: {
+      value: '$70,000'
+    },
+    loanAmountRejected: {
+      value: '$30,000'
+    },
+    approveRate: {
+      value: '70%'
+    }
+  }, {
+    id: 2,
+    link: {
+      label: 'NY',
+      link: '#s'
+    },
+    advancedTags: [{
+      labelLeft: 'home',
+      labelRight: 'hoods',
+      active: 3,
+      pause: 1,
+      merchants: 5
+    }, {
+      labelRight: 'jewelry',
+      active: 3,
+      pause: 1,
+      merchants: 5
+    }, {
+      labelLeft: 'home',
+      labelRight: 'improvement',
+      active: 0,
+      pause: 0,
+      warnLeft: true,
+      warnLeftMsg: 'landerNotIncluded',
+      warnRightMsg: 'noMerchants'
+    }, {
+      labelLeft: 'home',
+      labelRight: 'hoods',
+      active: 3,
+      pause: 1,
+      merchants: 5
+    }, {
+      labelRight: 'jewelry',
+      active: 3,
+      pause: 1,
+      merchants: 5
+    }],
+    status: {
+      label: 'Active',
+      className: 'color--green-haze'
+    },
+    loanAmountApproved: {
+      value: '$3,000'
+    },
+    loanAmountRejected: {
+      value: '$7,000'
+    },
+    approveRate: {
+      value: '30%'
+    }
+  }, {
+    id: 3,
+    link: {
+      label: 'NH',
+      link: '#s'
+    },
+    tags: [{
+      label: 'Label 1'
+    }, {
+      label: 'Label 2'
+    }, {
+      label: 'Label 3'
+    }],
+    status: {
+      status: 'error'
+    },
+    loanAmountApproved: {
+      value: '$70,000'
+    },
+    loanAmountRejected: {
+      value: '$30,000'
+    },
+    approveRate: {
+      value: '70%'
+    }
+  }]
+};
 
 var Template = function Template(args) {
+  var _state$rows;
+
   var dateRange = args.dateRange,
       restOfProps = (0, _objectWithoutProperties2.default)(args, _excluded);
 
   var _useState = (0, _react.useState)(dateRange),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       value = _useState2[0],
-      setValue = _useState2[1]; // return <InputDateRange {...restOfProps} value={value} onChange={setValue} />;
-
+      setValue = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(tableData),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      state = _useState4[0],
+      setState = _useState4[1];
+
+  var rowsWithActions = state === null || state === void 0 ? void 0 : (_state$rows = state.rows) === null || _state$rows === void 0 ? void 0 : _state$rows.map(function (row) {
+    return _objectSpread(_objectSpread({}, row), {}, {
+      actions: row.isDeleted ? [{
+        type: 'undo'
+      }] : [{
+        type: 'download'
+      }, {
+        type: 'edit'
+      }, {
+        type: 'delete'
+      }]
+    });
+  }); // useEffect(() => console.log(value), [value]);
+  // return <InputDateRange {...restOfProps} value={value} onChange={setValue} />;
 
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
     className: "mb20"
   }, /*#__PURE__*/_react.default.createElement(_InputDateRange.default, (0, _extends2.default)({}, restOfProps, {
     value: value,
     onChange: setValue
-  }))));
+  }))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Table.default, {
+    header: state.header,
+    rows: rowsWithActions,
+    onChange: setState
+  })));
 };
 
 var InputDateRangeTemplate = Template.bind({});
@@ -80,7 +236,8 @@ InputDateRangeTemplate.args = {
   isIntervalsHidden: false,
   isCompareHidden: true,
   hideArrows: false,
-  isOptionsRight: false // limitRange,
+  isOptionsRight: false,
+  isShortWeekNames: false // limitRange,
   // isUseAbs,
   // absTooltip
 

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

@@ -66,7 +66,8 @@ var Datepicker = function Datepicker(props) {
       isCompareHidden = props.isCompareHidden,
       limitRange = props.limitRange,
       handleItemClick = props.handleItemClick,
-      setActiveInterval = props.setActiveInterval;
+      setActiveInterval = props.setActiveInterval,
+      isShortWeekNames = props.isShortWeekNames;
   var _values$start = values.start,
       start = _values$start === void 0 ? null : _values$start,
       _values$end = values.end,
@@ -461,7 +462,8 @@ var Datepicker = function Datepicker(props) {
     endPrevDate: endPrevDate,
     onClick: handleClick,
     onHover: handleHover,
-    limitRange: limitRange
+    limitRange: limitRange,
+    isShortWeekNames: isShortWeekNames
   }), /*#__PURE__*/_react.default.createElement(_RangeCalendar.default, {
     className: "date-picker__calendar",
     date: date2,
@@ -472,7 +474,8 @@ var Datepicker = function Datepicker(props) {
     startPrevDate: startPrevDate,
     endPrevDate: endPrevDate,
     onClick: handleClick,
-    onHover: handleHover
+    onHover: handleHover,
+    isShortWeekNames: isShortWeekNames
   }))), /*#__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

@@ -55,7 +55,8 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       setCurrent = props.setCurrent,
       isCompare = props.isCompare,
       setIsCompare = props.setIsCompare,
-      toggleOff = props.toggleOff;
+      toggleOff = props.toggleOff,
+      isShortWeekNames = props.isShortWeekNames;
 
   var items = isCompact ? (0, _toConsumableArray2.default)(Object.keys(_dependencies.INTERVALS)) : [].concat((0, _toConsumableArray2.default)(Object.keys(_dependencies.INTERVALS)), [_dependencies.CUSTOM_INTERVAL_KEY]);
 
@@ -118,7 +119,7 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     return /*#__PURE__*/_react.default.createElement(_SelectItem.default, {
       key: index,
       item: item,
-      label: (txt === null || txt === void 0 ? void 0 : txt.labels) && (txt === null || txt === void 0 ? void 0 : txt.labels[item]) || ((_intervals$item = _dependencies.INTERVALS[item]) === null || _intervals$item === void 0 ? void 0 : _intervals$item.label) || item,
+      label: (txt === null || txt === void 0 ? void 0 : txt.labels) && (txt === null || txt === void 0 ? void 0 : txt.labels[item]) || ((_intervals$item = _dependencies.INTERVALS[item]) === null || _intervals$item === void 0 ? void 0 : _intervals$item.label) || (item === _dependencies.CUSTOM_INTERVAL_KEY ? _dependencies.CUSTOM_INTERVAL_KEY_TEXT : item),
       isActive: activeInterval === item,
       onItemClick: function onItemClick() {
         return handleItemClick(item.value || item);
@@ -146,7 +147,8 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     onCancel: toggleOff,
     isCompareHidden: isCompareHidden,
     limitRange: limitRange,
-    setActiveInterval: setActiveInterval
+    setActiveInterval: setActiveInterval,
+    isShortWeekNames: isShortWeekNames
   })));
 });
 

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

@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _check = _interopRequireDefault(require("../../../../../../assets/icons/check.svg"));
-
 var SelectItem = function SelectItem(_ref) {
   var item = _ref.item,
       label = _ref.label,
@@ -28,10 +26,20 @@ var SelectItem = function SelectItem(_ref) {
     onClick: onItemClick,
     onMouseEnter: onMouseEnter,
     "data-item": item
-  }, isActive && /*#__PURE__*/_react.default.createElement("object", {
-    data: _check.default,
-    className: (0, _classnames.default)('opened-part__intervals-item-icon-active')
-  }), label);
+  }, isActive && /*#__PURE__*/_react.default.createElement("svg", {
+    className: (0, _classnames.default)('opened-part__intervals-item-icon-active'),
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M13.3333 4L5.99999 11.3333L2.66666 8",
+    stroke: "black",
+    "stroke-width": "1.33333",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  })), label);
 };
 
 var _default = SelectItem;

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

@@ -221,6 +221,14 @@ var getActualDateRange = function getActualDateRange(inputDateRange) {
     return null;
   }();
 
+  if (actualIntervalKey === ALL_TIME_KEY) return {
+    intervalKey: ALL_TIME_KEY,
+    start: null,
+    end: null,
+    compare: inputDateRange.compare,
+    startPrevDate: null,
+    endPrevDate: null
+  };
   var actualValues = {
     // intervalKey: inputDateRange.intervalKey || customIntervalKey,
     intervalKey: actualIntervalKey || CUSTOM_INTERVAL_KEY,

package/dist/Atomic/FormElements/RangeCalendar/RangeCalendar.js

@@ -43,7 +43,8 @@ var RangeCalendar = function RangeCalendar(props) {
       onHover = _props$onHover === void 0 ? function () {} : _props$onHover,
       startPrevDate = props.startPrevDate,
       endPrevDate = props.endPrevDate,
-      limitRange = props.limitRange;
+      limitRange = props.limitRange,
+      isShortWeekNames = props.isShortWeekNames;
 
   var _useState = (0, _react.useState)({}),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -125,6 +126,10 @@ var RangeCalendar = function RangeCalendar(props) {
     setDate((0, _momentTimezone.default)(date).add(1, 'month').toDate());
   };
 
+  var getFormatedWeekName = function getFormatedWeekName(input) {
+    return isShortWeekNames ? input.charAt(0) : input;
+  };
+
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('range-calendar', className)
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -147,7 +152,7 @@ var RangeCalendar = function RangeCalendar(props) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: "day-of-week_".concat(dayOfWeek),
       className: "range-calendar__day range-calendar__day--title"
-    }, (0, _momentTimezone.default)().weekday(dayOfWeek).format('dd').charAt(0));
+    }, getFormatedWeekName((0, _momentTimezone.default)().weekday(dayOfWeek).format('dd')));
   })), Object.keys(days).map(function (week, index) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: "week_".concat(index),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "0.0.61",
+  "version": "0.0.65",
   "description": "Range selector fixes",
   "main": "dist/index.js",
   "scripts": {