@synerise/ds-date-range-picker 0.21.4 → 0.21.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -0
- package/dist/DateRangePicker.types.d.ts +1 -1
- package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.d.ts +10 -0
- package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.js +19 -2
- package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.types.d.ts +4 -0
- package/dist/RangeFilter/Shared/TimeWindow/TimeWindow.js +2 -2
- package/dist/RangeFilter/Shared/TimeWindow/TimeWindow.types.d.ts +2 -0
- package/dist/RawDateRangePicker.js +8 -1
- package/dist/RelativeRangePicker/Elements/TimestampRange/TimestampRange.js +1 -1
- package/dist/utils.js +5 -3
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,29 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [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)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **date-range-picker:** fixes incorrect range calculation for months ([30405fb](https://github.com/Synerise/synerise-design/commit/30405fba917d3c70b1719cc95fafcfb90296b52d))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## [0.21.5](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.21.4...@synerise/ds-date-range-picker@0.21.5) (2023-04-26)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Bug Fixes
|
|
21
|
+
|
|
22
|
+
* **date-range-picker:** adds missing translation keys and texts ([8b9c454](https://github.com/Synerise/synerise-design/commit/8b9c454590aac1fd49f5cac9a7eb3f05a5f70822))
|
|
23
|
+
* **date-range-picker:** fixes filter limit mode change for multiple days ([713a8e2](https://github.com/Synerise/synerise-design/commit/713a8e2b19a8e224b0ba696e93ac260639b590e4))
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
6
29
|
## [0.21.4](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.21.3...@synerise/ds-date-range-picker@0.21.4) (2023-04-19)
|
|
7
30
|
|
|
8
31
|
|
|
@@ -85,7 +85,7 @@ export declare type Texts = {
|
|
|
85
85
|
[k in TranslationsPlaceholders]: string;
|
|
86
86
|
};
|
|
87
87
|
export declare type TranslationsPlaceholders = 'endDatePlaceholder' | 'startDatePlaceholder' | 'selectDate' | 'selectTime';
|
|
88
|
-
export declare type Translations = 'custom' | 'today' | 'yesterday' | 'apply' | 'clear' | 'now' | 'emptyDateError' | 'last7Days' | 'thisWeek' | 'lastWeek' | 'thisMonth' | 'lastMonth' | 'last3Months' | 'last6Months' | 'lastYear' | 'allTime' | 'tomorrow' | 'next7Days' | 'nextWeek' | 'nextMonth' | 'next3Months' | 'next6Months' | 'nextYear' | 'more' | 'relativeDateRange' | 'last' | 'before' | 'after' | 'since' | 'next' | 'seconds' | 'minutes' | 'hours' | 'days' | 'weeks' | 'months' | 'years' | 'timestampLast' | 'timestampNext' | 'timestampTill' | 'filter' | 'startDate' | 'endDate' | 'remove' | 'savedFiltersTrigger' | 'clearRange' | 'copyRange' | 'pasteRange';
|
|
88
|
+
export declare type Translations = 'custom' | 'today' | 'yesterday' | 'apply' | 'clear' | 'now' | 'emptyDateError' | 'last7Days' | 'thisWeek' | 'lastWeek' | 'thisMonth' | 'lastMonth' | 'last3Months' | 'last6Months' | 'lastYear' | 'allTime' | 'tomorrow' | 'next7Days' | 'nextWeek' | 'nextMonth' | 'next3Months' | 'next6Months' | 'nextYear' | 'more' | 'relativeDateRange' | 'last' | 'before' | 'after' | 'since' | 'next' | 'seconds' | 'minutes' | 'hours' | 'days' | 'weeks' | 'months' | 'years' | 'timestampLast' | 'timestampNext' | 'timestampTill' | 'filter' | 'startDate' | 'endDate' | 'remove' | 'savedFiltersTrigger' | 'clearRange' | 'copyRange' | 'pasteRange' | 'range' | 'hour';
|
|
89
89
|
export declare type WithTranslations = {
|
|
90
90
|
texts?: Texts;
|
|
91
91
|
};
|
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { DateLimitMode, RangeFormProps } from './RangeForm.types';
|
|
3
3
|
export declare const FORM_MODES: Record<string, DateLimitMode>;
|
|
4
|
+
export declare const RANGE_FORM_INTL_KEYS: {
|
|
5
|
+
Hour: {
|
|
6
|
+
id: string;
|
|
7
|
+
defaultMessage: string;
|
|
8
|
+
};
|
|
9
|
+
Range: {
|
|
10
|
+
id: string;
|
|
11
|
+
defaultMessage: string;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
4
14
|
declare const RangeForm: React.FC<RangeFormProps>;
|
|
5
15
|
export default RangeForm;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign || 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); }
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
|
+
import { useIntl } from 'react-intl';
|
|
4
5
|
import Select from '@synerise/ds-select';
|
|
5
6
|
import Icon, { CloseS } from '@synerise/ds-icon';
|
|
6
7
|
import { useDataFormat } from '@synerise/ds-data-format';
|
|
@@ -12,6 +13,16 @@ export var FORM_MODES = {
|
|
|
12
13
|
HOUR: 'Hour',
|
|
13
14
|
RANGE: 'Range'
|
|
14
15
|
};
|
|
16
|
+
export var RANGE_FORM_INTL_KEYS = {
|
|
17
|
+
Hour: {
|
|
18
|
+
id: 'DS.DATE-RANGE-PICKER.HOUR',
|
|
19
|
+
defaultMessage: 'Hour'
|
|
20
|
+
},
|
|
21
|
+
Range: {
|
|
22
|
+
id: 'DS.DATE-RANGE-PICKER.RANGE',
|
|
23
|
+
defaultMessage: 'Range'
|
|
24
|
+
}
|
|
25
|
+
};
|
|
15
26
|
|
|
16
27
|
var RangeForm = function RangeForm(_ref) {
|
|
17
28
|
var onModeChange = _ref.onModeChange,
|
|
@@ -33,6 +44,8 @@ var RangeForm = function RangeForm(_ref) {
|
|
|
33
44
|
var _useDataFormat = useDataFormat(),
|
|
34
45
|
is12HoursClock = _useDataFormat.is12HoursClock;
|
|
35
46
|
|
|
47
|
+
var intl = useIntl();
|
|
48
|
+
|
|
36
49
|
var _React$useState = React.useState(startDate),
|
|
37
50
|
start = _React$useState[0],
|
|
38
51
|
setStart = _React$useState[1];
|
|
@@ -102,6 +115,10 @@ var RangeForm = function RangeForm(_ref) {
|
|
|
102
115
|
use12HourClock: is12HoursClock
|
|
103
116
|
}, timePickerProps)));
|
|
104
117
|
}, [start, end, onStartChange, onEndChange, setStart, setEnd, getPopupContainer, texts, timePickerProps, disabled, is12HoursClock, valueFormatOptions]);
|
|
118
|
+
var getModeLabel = React.useCallback(function (modeName) {
|
|
119
|
+
if (texts && texts[modeName]) return texts[modeName];
|
|
120
|
+
return intl.formatMessage(RANGE_FORM_INTL_KEYS[modeName]);
|
|
121
|
+
}, [texts, intl]);
|
|
105
122
|
var limitModeSelect = React.useMemo(function () {
|
|
106
123
|
return valueSelectionModes.length > 1 ? /*#__PURE__*/React.createElement(Select, {
|
|
107
124
|
value: mode,
|
|
@@ -114,9 +131,9 @@ var RangeForm = function RangeForm(_ref) {
|
|
|
114
131
|
return /*#__PURE__*/React.createElement(Select.Option, {
|
|
115
132
|
key: modeName,
|
|
116
133
|
value: modeName
|
|
117
|
-
}, modeName);
|
|
134
|
+
}, getModeLabel(modeName));
|
|
118
135
|
})) : null;
|
|
119
|
-
}, [mode, onModeChange, getPopupContainer, valueSelectionModes, disabled]);
|
|
136
|
+
}, [mode, onModeChange, getPopupContainer, valueSelectionModes, disabled, getModeLabel]);
|
|
120
137
|
return /*#__PURE__*/React.createElement(S.Container, null, /*#__PURE__*/React.createElement(S.Row, {
|
|
121
138
|
justifyContent: "flex-start"
|
|
122
139
|
}, limitModeSelect, mode === FORM_MODES.HOUR ? singleHourPicker : renderRangePicker(), !!onRangeDelete && !disabled && /*#__PURE__*/React.createElement(S.RemoveIconWrapper, {
|
package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.types.d.ts
CHANGED
|
@@ -15,3 +15,7 @@ export declare type RangeFormProps = {
|
|
|
15
15
|
onRangeDelete?: () => void;
|
|
16
16
|
valueSelectionModes: DateLimitMode[];
|
|
17
17
|
} & WithTranslations & WithDisabledProp & Pick<RangeFormContainerProps, 'timePickerProps' | 'valueFormatOptions'>;
|
|
18
|
+
export declare type RangeFormTexts = {
|
|
19
|
+
range: React.ReactNode | string;
|
|
20
|
+
hour: React.ReactNode | string;
|
|
21
|
+
};
|
|
@@ -165,12 +165,12 @@ var TimeWindowBase = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
165
165
|
var activeDays = _this.state.activeDays;
|
|
166
166
|
var updatedDays = {};
|
|
167
167
|
activeDays.forEach(function (k) {
|
|
168
|
-
updatedDays[k] = {
|
|
168
|
+
updatedDays[k] = _objectSpread({}, _this.getDayValue(k), {
|
|
169
169
|
day: k,
|
|
170
170
|
start: dayjs(value[0]).format(TIME_FORMAT),
|
|
171
171
|
stop: dayjs(value[1]).format(TIME_FORMAT),
|
|
172
172
|
restricted: true
|
|
173
|
-
};
|
|
173
|
+
});
|
|
174
174
|
});
|
|
175
175
|
onChange(_objectSpread({}, days, {}, updatedDays));
|
|
176
176
|
});
|
|
@@ -28,6 +28,8 @@ export declare type TimeWindowTexts = {
|
|
|
28
28
|
clearRange: React.ReactNode | string;
|
|
29
29
|
copyRange: React.ReactNode | string;
|
|
30
30
|
pasteRange: React.ReactNode | string;
|
|
31
|
+
range: React.ReactNode | string;
|
|
32
|
+
hour: React.ReactNode | string;
|
|
31
33
|
};
|
|
32
34
|
export declare type TimeWindowProps = {
|
|
33
35
|
days: Days;
|
|
@@ -258,13 +258,20 @@ export var RawDateRangePicker = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
258
258
|
var _value$filter, _value$filter2;
|
|
259
259
|
|
|
260
260
|
var _addonKey = 'filter';
|
|
261
|
+
var label = value != null && value.filter ? intl.formatMessage({
|
|
262
|
+
id: "DS.DATE-RANGE-PICKER.FILTER-ENABLED",
|
|
263
|
+
defaultMessage: 'Filter enabled'
|
|
264
|
+
}) : intl.formatMessage({
|
|
265
|
+
id: "DS.DATE-RANGE-PICKER.ADD-FILTER",
|
|
266
|
+
defaultMessage: 'Add filter'
|
|
267
|
+
});
|
|
261
268
|
addons.push({
|
|
262
269
|
content: /*#__PURE__*/React.createElement(AddonCollapse, {
|
|
263
270
|
content: /*#__PURE__*/React.createElement(RangeFilterStatus, {
|
|
264
271
|
onFilterRemove: _this.handleRemoveFilterClick,
|
|
265
272
|
filter: value.filter,
|
|
266
273
|
disabled: !value.from || !value.to,
|
|
267
|
-
label:
|
|
274
|
+
label: label,
|
|
268
275
|
onClick: _this.handleModalOpenClick
|
|
269
276
|
}),
|
|
270
277
|
title: texts == null ? void 0 : texts.filter,
|
|
@@ -6,7 +6,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
6
6
|
|
|
7
7
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
8
8
|
import * as React from 'react';
|
|
9
|
-
import DatePicker from '@synerise/ds-date-picker
|
|
9
|
+
import { DatePicker } from '@synerise/ds-date-picker';
|
|
10
10
|
import * as S from '../../RelativeRangePicker.styles';
|
|
11
11
|
import TimestampDuration from './TimestampDuration/TimestampDuration';
|
|
12
12
|
import ADD from '../../../dateUtils/add';
|
package/dist/utils.js
CHANGED
|
@@ -47,9 +47,9 @@ export var normalizeRange = function normalizeRange(range) {
|
|
|
47
47
|
|
|
48
48
|
if (future) {
|
|
49
49
|
left = ADD[offset.type](START_OF[offset.type](now), offset.value);
|
|
50
|
-
right =
|
|
50
|
+
right = END_OF[duration.type](ADD[duration.type](left, duration.value - 1));
|
|
51
51
|
} else {
|
|
52
|
-
right = ADD[offset.type](
|
|
52
|
+
right = END_OF[rightBoundaryRoundingUnit](ADD[offset.type](now, -offset.value));
|
|
53
53
|
left = ADD[duration.type](START_OF[duration.type](right), 1 - duration.value);
|
|
54
54
|
}
|
|
55
55
|
}
|
|
@@ -149,7 +149,9 @@ export var getDefaultTexts = function getDefaultTexts(intl, disableDefault, text
|
|
|
149
149
|
clearRange: (texts == null ? void 0 : texts.clearRange) || getIntlMessage("DS.DATE-RANGE-PICKER.CLEAR-RANGE", intl, disableDefault),
|
|
150
150
|
copyRange: (texts == null ? void 0 : texts.copyRange) || getIntlMessage("DS.DATE-RANGE-PICKER.COPY-RANGE", intl, disableDefault),
|
|
151
151
|
remove: (texts == null ? void 0 : texts.remove) || getIntlMessage("DS.DATE-RANGE-PICKER.REMOVE", intl, disableDefault),
|
|
152
|
-
savedFiltersTrigger: (texts == null ? void 0 : texts.savedFiltersTrigger) || getIntlMessage("DS.DATE-RANGE-PICKER.SAVED-FILTERS", intl, disableDefault)
|
|
152
|
+
savedFiltersTrigger: (texts == null ? void 0 : texts.savedFiltersTrigger) || getIntlMessage("DS.DATE-RANGE-PICKER.SAVED-FILTERS", intl, disableDefault),
|
|
153
|
+
range: (texts == null ? void 0 : texts.range) || getIntlMessage("DS.DATE-RANGE-PICKER.RANGE", intl, disableDefault),
|
|
154
|
+
hour: (texts == null ? void 0 : texts.hour) || getIntlMessage("DS.DATE-RANGE-PICKER.HOUR", intl, disableDefault)
|
|
153
155
|
};
|
|
154
156
|
};
|
|
155
157
|
export var DEFAULT_RANGE = normalizeRange({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-date-range-picker",
|
|
3
|
-
"version": "0.21.
|
|
3
|
+
"version": "0.21.6",
|
|
4
4
|
"description": "Date-Range-Picker UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
"types": "dist/index.d.ts",
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@date-fns/upgrade": "^1.0.3",
|
|
36
|
-
"@synerise/ds-button": "^0.17.
|
|
37
|
-
"@synerise/ds-date-picker": "^0.9.
|
|
38
|
-
"@synerise/ds-icon": "^0.
|
|
39
|
-
"@synerise/ds-manageable-list": "^0.25.
|
|
40
|
-
"@synerise/ds-time-picker": "^0.7.
|
|
41
|
-
"@synerise/ds-tooltip": "^0.13.
|
|
36
|
+
"@synerise/ds-button": "^0.17.14",
|
|
37
|
+
"@synerise/ds-date-picker": "^0.9.9",
|
|
38
|
+
"@synerise/ds-icon": "^0.56.0",
|
|
39
|
+
"@synerise/ds-manageable-list": "^0.25.3",
|
|
40
|
+
"@synerise/ds-time-picker": "^0.7.7",
|
|
41
|
+
"@synerise/ds-tooltip": "^0.13.2",
|
|
42
42
|
"@synerise/ds-utils": "^0.19.0",
|
|
43
43
|
"date-fns": "^2.16.1",
|
|
44
44
|
"dayjs": "^1.8.35",
|
|
@@ -54,5 +54,5 @@
|
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@types/ramda": "^0.27.14"
|
|
56
56
|
},
|
|
57
|
-
"gitHead": "
|
|
57
|
+
"gitHead": "71daf94c4b480a9b8f675537a7894ad5d7db4ff9"
|
|
58
58
|
}
|