@synerise/ds-date-range-picker 0.21.6 → 0.21.8

package/CHANGELOG.md

@@ -3,6 +3,27 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.21.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.21.7...@synerise/ds-date-range-picker@0.21.8) (2023-05-23)
+
+
+### Bug Fixes
+
+* **date-range-picker:** fixes custom range values persistance ([0252358](https://github.com/Synerise/synerise-design/commit/025235894be3633e975144765f9c97ab91a55d9d))
+* **date-range-picker:** fixes mode button resetting values ([3499e88](https://github.com/Synerise/synerise-design/commit/3499e8882787b21d5b3aa4839fae6c167fc5a024))
+* **date-range-picker:** revert to not rendering closed addon ([5414e4f](https://github.com/Synerise/synerise-design/commit/5414e4f877f08ef50d3622ef059e250845cd9491))
+
+
+
+
+
+## [0.21.7](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.21.6...@synerise/ds-date-range-picker@0.21.7) (2023-05-20)
+
+**Note:** Version bump only for package @synerise/ds-date-range-picker
+
+
+
+
+
 ## [0.21.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.21.5...@synerise/ds-date-range-picker@0.21.6) (2023-05-16)
 
 

package/dist/RelativeRangePicker/Elements/CustomRangeForm/CustomRangeForm.js

@@ -50,7 +50,6 @@ var CustomRangeForm = function CustomRangeForm(_ref) {
     return /*#__PURE__*/React.createElement(S.RangeFormColumn, null, /*#__PURE__*/React.createElement(TimestampRange, {
       handleModeChange: handleModeChange,
       currentRange: currentRange,
-      currentGroup: currentGroup,
       handleChange: handleChange,
       onTimestampChange: handleTimestampChange,
       timestamp: timestamp,

package/dist/RelativeRangePicker/Elements/TimestampRange/TimestampDuration/TimestampDuration.types.d.ts

@@ -2,7 +2,6 @@ import { RelativeDateRange } from '../../../../date.types';
 import { Texts } from '../../../../DateRangePicker.types';
 export declare type Props = {
     currentRange: RelativeDateRange;
-    currentGroup: string | null;
     handleDurationValueChange: (value?: string | number) => void;
     onDurationModifierChange: (modifier: string) => void;
     durationModifier: string;

package/dist/RelativeRangePicker/Elements/TimestampRange/TimestampRange.js

@@ -9,19 +9,13 @@ import * as React from 'react';
 import { DatePicker } from '@synerise/ds-date-picker';
 import * as S from '../../RelativeRangePicker.styles';
 import TimestampDuration from './TimestampDuration/TimestampDuration';
-import ADD from '../../../dateUtils/add';
-import START_OF from '../../../dateUtils/startOf';
-import END_OF from '../../../dateUtils/endOf';
-import DIFFERENCE from '../../../dateUtils/difference';
-import { DURATION_MODIFIERS } from '../../../constants';
-import { fnsIsAfter } from '../../../fns';
+import { CUSTOM_RANGE_KEY, DURATION_MODIFIERS } from '../../../constants';
 import { DEFAULT_RANGE } from '../../../utils';
 
 var TimestampRange = function TimestampRange(_ref) {
   var _currentRange$duratio, _currentRange$duratio2;
 
   var currentRange = _ref.currentRange,
-      currentGroup = _ref.currentGroup,
       handleChange = _ref.handleChange,
       texts = _ref.texts,
       onTimestampChange = _ref.onTimestampChange,
@@ -36,12 +30,13 @@ var TimestampRange = function TimestampRange(_ref) {
       duration: {
         type: 'DAYS',
         value: 30
-      }
+      },
+      translationKey: CUSTOM_RANGE_KEY
     });
   } : _ref$getValueOnReset,
       timestamp = _ref.timestamp;
 
-  var _React$useState = React.useState(DURATION_MODIFIERS.LAST),
+  var _React$useState = React.useState(currentRange != null && currentRange.future ? DURATION_MODIFIERS.NEXT : DURATION_MODIFIERS.LAST),
       durationModifier = _React$useState[0],
       setDurationModifier = _React$useState[1];
 
@@ -63,59 +58,20 @@ var TimestampRange = function TimestampRange(_ref) {
 
   var handleRangeChange = function handleRangeChange(date, duration) {
     if (date) {
-      var NOW = new Date();
-      var rangeStart, newOffset, offsetToTimestamp;
-      var future = fnsIsAfter(NOW, date);
-      var isSince = currentGroup === 'SINCE';
-
-      if (isSince) {
-        offsetToTimestamp = {
-          future: durationModifier === DURATION_MODIFIERS.NEXT,
-          duration: {
-            type: duration.type,
-            value: duration.value
-          },
-          offset: {
-            type: 'SINCE',
-            value: timestamp
-          },
-          key: undefined
-        };
-      } else if (durationModifier === DURATION_MODIFIERS.NEXT) {
-        rangeStart = END_OF[duration.type](ADD[duration.type](date, -Number(future)));
-        newOffset = DIFFERENCE[duration.type](NOW, rangeStart);
-        offsetToTimestamp = _objectSpread({
-          future: true
-        }, currentRange, {
-          duration: {
-            type: duration.type,
-            value: duration.value
-          },
-          offset: {
-            type: duration.type,
-            value: newOffset - duration.value
-          },
-          key: undefined
-        });
-      } else if (durationModifier === DURATION_MODIFIERS.LAST) {
-        rangeStart = START_OF[duration.type](ADD[duration.type](date, -Number(future)));
-        newOffset = DIFFERENCE[duration.type](NOW, rangeStart);
-        offsetToTimestamp = _objectSpread({
-          future: false
-        }, currentRange, {
-          duration: {
-            type: duration.type,
-            value: duration.value
-          },
-          offset: {
-            type: duration.type,
-            value: newOffset
-          },
-          key: undefined
-        });
-      }
-
-      offsetToTimestamp && handleChange(offsetToTimestamp); // FIXME
+      var offsetToTimestamp = {
+        future: durationModifier === DURATION_MODIFIERS.NEXT,
+        duration: {
+          type: duration.type,
+          value: duration.value
+        },
+        offset: {
+          type: 'SINCE',
+          value: timestamp
+        },
+        key: undefined,
+        translationKey: CUSTOM_RANGE_KEY
+      };
+      handleChange(offsetToTimestamp); // FIXME
     }
   };
 
@@ -165,7 +121,6 @@ var TimestampRange = function TimestampRange(_ref) {
 
   return /*#__PURE__*/React.createElement(S.RangeFormColumn, null, renderDatePicker(), /*#__PURE__*/React.createElement(TimestampDuration, {
     currentRange: currentRange,
-    currentGroup: currentGroup,
     value: durationValue,
     handleDurationValueChange: function handleDurationValueChange(val) {
       val && setDurationValue(Number(val));

package/dist/RelativeRangePicker/Elements/TimestampRange/TimestampRange.types.d.ts

@@ -2,7 +2,6 @@ import { RelativeDateRange } from '../../../date.types';
 import { RelativeMode, Texts } from '../../../DateRangePicker.types';
 export declare type TimestampRangeProps = {
     currentRange: RelativeDateRange;
-    currentGroup: string | null;
     handleChange: (value: RelativeDateRange) => void;
     handleModeChange: (mode: RelativeMode | null) => void;
     onTimestampChange?: (timestamp: Date | undefined) => void;

package/dist/RelativeRangePicker/RelativeRangePicker.js

@@ -32,11 +32,18 @@ var RelativeRangePicker = /*#__PURE__*/function (_React$PureComponent) {
     // eslint-disable-next-line
 
     _defineProperty(_assertThisInitialized(_this), "onModeChange", function (mode) {
-      _this.setState({
-        currentGroup: mode
-      }, function () {
-        return _this.onChange(DEFAULT_RANGE);
-      });
+      var currentGroup = _this.state.currentGroup;
+
+      if (mode !== currentGroup) {
+        _this.setState({
+          currentGroup: mode,
+          lastCustomRange: undefined,
+          sinceTimestamp: new Date()
+        });
+
+        var onChange = _this.props.onChange;
+        onChange(DEFAULT_RANGE);
+      }
     });
 
     _defineProperty(_assertThisInitialized(_this), "onTimestampChange", function (timestamp) {
@@ -57,15 +64,13 @@ var RelativeRangePicker = /*#__PURE__*/function (_React$PureComponent) {
     _defineProperty(_assertThisInitialized(_this), "handleCustomClick", function () {
       var onChange = _this.props.onChange;
       var _this$state = _this.state,
-          currentGroup = _this$state.currentGroup,
-          currentRange = _this$state.currentRange;
+          lastCustomRange = _this$state.lastCustomRange,
+          currentGroup = _this$state.currentGroup;
 
-      if (currentGroup === RANGES_MODE.SINCE) {
-        onChange(_objectSpread({}, currentRange, {
-          type: 'RELATIVE',
-          key: undefined,
-          translationKey: CUSTOM_RANGE_KEY
-        })); // FIXME: make currentGroup rely on value rather than state
+      if (lastCustomRange && lastCustomRange.translationKey === CUSTOM_RANGE_KEY) {
+        onChange(_objectSpread({}, lastCustomRange, {
+          key: undefined
+        }));
       } else {
         var sourceRange = getDefaultCustomRange(currentGroup);
         onChange(_objectSpread({}, sourceRange, {
@@ -86,7 +91,15 @@ var RelativeRangePicker = /*#__PURE__*/function (_React$PureComponent) {
       }); // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 
-      onChange(normalizeRange(changes));
+      var resultRange = normalizeRange(changes);
+
+      if ((resultRange == null ? void 0 : resultRange.translationKey) === CUSTOM_RANGE_KEY) {
+        _this.setState({
+          lastCustomRange: resultRange
+        });
+      }
+
+      onChange(resultRange);
     });
 
     _defineProperty(_assertThisInitialized(_this), "renderRanges", function (ranges) {

package/dist/RelativeRangePicker/RelativeRangePicker.types.d.ts

@@ -23,6 +23,7 @@ export declare type State = {
     currentRange: RelativeDateRange;
     groupedRanges?: DateRange[];
     sinceTimestamp?: Date | undefined;
+    lastCustomRange?: RelativeDateRange;
 };
 /**
  * @deprecated use `RelativeRangePickerProps`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-date-range-picker",
-  "version": "0.21.6",
+  "version": "0.21.8",
   "description": "Date-Range-Picker UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -33,12 +33,12 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@date-fns/upgrade": "^1.0.3",
-    "@synerise/ds-button": "^0.17.14",
-    "@synerise/ds-date-picker": "^0.9.9",
+    "@synerise/ds-button": "^0.17.16",
+    "@synerise/ds-date-picker": "^0.9.11",
     "@synerise/ds-icon": "^0.56.0",
-    "@synerise/ds-manageable-list": "^0.25.3",
-    "@synerise/ds-time-picker": "^0.7.7",
-    "@synerise/ds-tooltip": "^0.13.2",
+    "@synerise/ds-manageable-list": "^0.25.5",
+    "@synerise/ds-time-picker": "^0.7.9",
+    "@synerise/ds-tooltip": "^0.13.4",
     "@synerise/ds-utils": "^0.19.0",
     "date-fns": "^2.16.1",
     "dayjs": "^1.8.35",
@@ -54,5 +54,5 @@
   "devDependencies": {
     "@types/ramda": "^0.27.14"
   },
-  "gitHead": "71daf94c4b480a9b8f675537a7894ad5d7db4ff9"
+  "gitHead": "9a0fe37374409f1830fa642965975a26a72116c8"
 }