@synerise/ds-date-range-picker 0.26.4 → 0.26.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.
Files changed (37) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/README.md +94 -0
  3. package/dist/DateRangePicker.types.d.ts +4 -4
  4. package/dist/RangeFilter/Filters/DailyFilter/DailyFilter.js +1 -5
  5. package/dist/RangeFilter/Filters/MonthlyFilter/MonthlyFilter.js +3 -16
  6. package/dist/RangeFilter/Filters/new/Daily/Daily.d.ts +1 -1
  7. package/dist/RangeFilter/Filters/new/Daily/Daily.js +8 -6
  8. package/dist/RangeFilter/Filters/new/Daily/Daily.types.d.ts +2 -0
  9. package/dist/RangeFilter/Filters/new/Monthly/Monthly.d.ts +1 -1
  10. package/dist/RangeFilter/Filters/new/Monthly/Monthly.js +15 -23
  11. package/dist/RangeFilter/Filters/new/Monthly/Monthly.types.d.ts +2 -0
  12. package/dist/RangeFilter/Filters/new/Weekly/Weekly.d.ts +1 -1
  13. package/dist/RangeFilter/Filters/new/Weekly/Weekly.js +44 -52
  14. package/dist/RangeFilter/Filters/new/Weekly/Weekly.types.d.ts +2 -0
  15. package/dist/RangeFilter/RangeFilter.js +7 -18
  16. package/dist/RangeFilter/RangeFilter.types.d.ts +2 -2
  17. package/dist/RangeFilter/Shared/RangeFilterStatus/RangeFilterStatus.js +5 -12
  18. package/dist/RangeFilter/Shared/RangeFilterStatus/RangeFilterStatus.types.d.ts +3 -2
  19. package/dist/RangeFilter/Shared/SaveFilterForm/SaveFilterForm.js +4 -11
  20. package/dist/RangeFilter/Shared/SaveFilterForm/SaveFilterForm.types.d.ts +2 -0
  21. package/dist/RangeFilter/Shared/TimeWindow/Day/Day.js +1 -1
  22. package/dist/RangeFilter/Shared/TimeWindow/Day/Day.types.d.ts +1 -1
  23. package/dist/RangeFilter/Shared/TimeWindow/Grid/Grid.js +3 -9
  24. package/dist/RangeFilter/Shared/TimeWindow/Grid/Grid.types.d.ts +3 -4
  25. package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.js +4 -4
  26. package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeForm/RangeForm.types.d.ts +3 -2
  27. package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.js +4 -8
  28. package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.types.d.ts +1 -1
  29. package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.js +3 -7
  30. package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.types.d.ts +2 -0
  31. package/dist/RangeFilter/Shared/TimeWindow/TimeWindow.js +4 -12
  32. package/dist/RangeFilter/Shared/TimeWindow/TimeWindow.types.d.ts +3 -8
  33. package/dist/RawDateRangePicker.d.ts +10 -6
  34. package/dist/RawDateRangePicker.js +58 -56
  35. package/dist/RelativeRangePicker/Elements/CustomRangeForm/CustomRangeForm.types.d.ts +1 -1
  36. package/dist/utils.js +86 -57
  37. package/package.json +19 -19
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
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.26.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.26.5...@synerise/ds-date-range-picker@0.26.6) (2024-01-31)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **date-range-picker:** added texts over translations ([7131f8c](https://github.com/Synerise/synerise-design/commit/7131f8c5c923527544fb54b5bb9eb15585bec442))
12
+
13
+
14
+
15
+
16
+
17
+ ## [0.26.5](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.26.4...@synerise/ds-date-range-picker@0.26.5) (2024-01-24)
18
+
19
+ **Note:** Version bump only for package @synerise/ds-date-range-picker
20
+
21
+
22
+
23
+
24
+
6
25
  ## [0.26.4](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.26.3...@synerise/ds-date-range-picker@0.26.4) (2024-01-17)
7
26
 
8
27
  **Note:** Version bump only for package @synerise/ds-date-range-picker
package/README.md CHANGED
@@ -64,6 +64,8 @@ const value = {
64
64
  | onVisibleChange | Callback executed when popover with dateRangePicker changes its visibility | (visible: boolean) => void | - |
65
65
  | filterValueSelectionModes | Allowed modes to display in filter | DateLimitMode[] | ["Range", "Hour"] |
66
66
  | getPopupContainer | Function used to set the container of the date range picker. | Function(triggerNode) | `() => document.body` |
67
+ | texts | custom translations | Texts | undefined |
68
+ | disableDefaultTexts | disable DS translations fallback | boolean | false
67
69
 
68
70
  ### DateRange
69
71
 
@@ -77,6 +79,98 @@ const value = {
77
79
 
78
80
  `RelativeUnit = 'SECONDS' | 'MINUTES' | 'HOURS' | 'DAYS' | 'WEEKS' | 'MONTHS' | 'YEARS'`
79
81
 
82
+ ### Texts
83
+
84
+ - `texts` prop is now optional
85
+ - all keys in `texts` is now also optional
86
+ - if `texts` is `undefined` or if a key in `texts` is `undefined` default DS translations will appear in the component
87
+ - `disableDefaultTexts` disables the above fallback, i.e. if any key is missing in `texts` then an empty string is used as a translation (this prop is provided for testing custom translation completeness)
88
+
89
+
90
+ | translation key | Type | Default |
91
+ | ------------------------ | ----------------- | -------- |
92
+ | endDatePlaceholder | string | -------- |
93
+ | startDatePlaceholder | string | -------- |
94
+ | selectDate | string | -------- |
95
+ | selectTime | string | -------- |
96
+ | filterName | string | -------- |
97
+ | custom | ReactNode | -------- |
98
+ | today | ReactNode | -------- |
99
+ | yesterday | ReactNode | -------- |
100
+ | apply | ReactNode | -------- |
101
+ | clear | ReactNode | -------- |
102
+ | now | ReactNode | -------- |
103
+ | emptyDateError | ReactNode | -------- |
104
+ | last7Days | ReactNode | -------- |
105
+ | thisWeek | ReactNode | -------- |
106
+ | lastWeek | ReactNode | -------- |
107
+ | thisMonth | ReactNode | -------- |
108
+ | lastMonth | ReactNode | -------- |
109
+ | last3Months | ReactNode | -------- |
110
+ | last6Months | ReactNode | -------- |
111
+ | lastYear | ReactNode | -------- |
112
+ | allTime | ReactNode | -------- |
113
+ | tomorrow | ReactNode | -------- |
114
+ | next7Days | ReactNode | -------- |
115
+ | nextWeek | ReactNode | -------- |
116
+ | nextMonth | ReactNode | -------- |
117
+ | next3Months | ReactNode | -------- |
118
+ | next6Months | ReactNode | -------- |
119
+ | nextYear | ReactNode | -------- |
120
+ | more | ReactNode | -------- |
121
+ | relativeDateRange | ReactNode | -------- |
122
+ | last | ReactNode | -------- |
123
+ | before | ReactNode | -------- |
124
+ | after | ReactNode | -------- |
125
+ | since | ReactNode | -------- |
126
+ | next | ReactNode | -------- |
127
+ | seconds | ReactNode | -------- |
128
+ | minutes | ReactNode | -------- |
129
+ | hours | ReactNode | -------- |
130
+ | days | ReactNode | -------- |
131
+ | weeks | ReactNode | -------- |
132
+ | months | ReactNode | -------- |
133
+ | years | ReactNode | -------- |
134
+ | timestampLast | ReactNode | -------- |
135
+ | timestampNext | ReactNode | -------- |
136
+ | timestampTill | ReactNode | -------- |
137
+ | filter | ReactNode | -------- |
138
+ | startDate | ReactNode | -------- |
139
+ | endDate | ReactNode | -------- |
140
+ | remove | ReactNode | -------- |
141
+ | savedFiltersTrigger | ReactNode | -------- |
142
+ | clearRange | ReactNode | -------- |
143
+ | copyRange | ReactNode | -------- |
144
+ | pasteRange | ReactNode | -------- |
145
+ | range | ReactNode | -------- |
146
+ | hour | ReactNode | -------- |
147
+ | filterEnabled | ReactNode | -------- |
148
+ | selectDateFilter | ReactNode | -------- |
149
+ | datesFilter | ReactNode | -------- |
150
+ | cancel | ReactNode | -------- |
151
+ | everyDay | ReactNode | -------- |
152
+ | nthDayOfMonth | ReactNode | -------- |
153
+ | daysOf | ReactNode | -------- |
154
+ | countedFrom | ReactNode | -------- |
155
+ | addRule | ReactNode | -------- |
156
+ | addTime | ReactNode | -------- |
157
+ | change | ReactNode | -------- |
158
+ | weekly | ReactNode | -------- |
159
+ | monthly | ReactNode | -------- |
160
+ | daily | ReactNode | -------- |
161
+ | saveFilter | ReactNode | -------- |
162
+ | selected | ReactNode | -------- |
163
+ | selectDaysDescription | ReactNode | -------- |
164
+ | selectAll | ReactNode | -------- |
165
+ | unselectAll | ReactNode | -------- |
166
+ | inverseSelection | ReactNode | -------- |
167
+ | setTimeFor | ReactNode | -------- |
168
+ | week | ReactNode | -------- |
169
+ | month | ReactNode | -------- |
170
+ | beginning | ReactNode | -------- |
171
+ | ending | ReactNode | -------- |
172
+ | maximumRanges | ReactNode | -------- |
173
+
80
174
  ### Undocumented props
81
175
 
82
176
  - min in `MonthlyFilter` - controls minimal amount of entires in monthly filter, disable with `undefined`, default is `1`
@@ -53,7 +53,7 @@ export interface DateRangePickerProps extends WrappedComponentProps {
53
53
  showTime?: boolean;
54
54
  showCustomRange?: boolean;
55
55
  showNowButton?: boolean;
56
- texts: Texts;
56
+ texts?: Partial<Texts>;
57
57
  validate?: (value: DateRange) => {
58
58
  valid: boolean;
59
59
  message?: string;
@@ -90,10 +90,10 @@ export type Texts = {
90
90
  } & {
91
91
  [k in TranslationsPlaceholders]: string;
92
92
  };
93
- export type TranslationsPlaceholders = 'endDatePlaceholder' | 'startDatePlaceholder' | 'selectDate' | 'selectTime';
94
- export 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';
93
+ export type TranslationsPlaceholders = 'endDatePlaceholder' | 'startDatePlaceholder' | 'selectDate' | 'selectTime' | 'everyDay' | 'filterName';
94
+ export 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' | 'filterEnabled' | 'selectDateFilter' | 'datesFilter' | 'cancel' | 'nthDayOfMonth' | 'daysOf' | 'countedFrom' | 'addRule' | 'addTime' | 'change' | 'weekly' | 'monthly' | 'daily' | 'saveFilter' | 'selected' | 'selectDaysDescription' | 'selectAll' | 'unselectAll' | 'inverseSelection' | 'setTimeFor' | 'week' | 'month' | 'beginning' | 'ending' | 'maximumRanges';
95
95
  export type WithTranslations = {
96
- texts?: Texts;
96
+ texts: Texts;
97
97
  };
98
98
  export type AddonType = {
99
99
  content: ReactNode;
@@ -11,7 +11,6 @@ var DailyFilter = function DailyFilter(props) {
11
11
  };
12
12
 
13
13
  var value = props.value,
14
- intl = props.intl,
15
14
  onRangeCopy = props.onRangeCopy,
16
15
  onRangePaste = props.onRangePaste,
17
16
  onRangeClear = props.onRangeClear,
@@ -32,10 +31,7 @@ var DailyFilter = function DailyFilter(props) {
32
31
  numberOfDays: 0,
33
32
  customDays: {
34
33
  0: {
35
- label: intl.formatMessage({
36
- id: 'DS.DATE-RANGE-PICKER.EVERY_DAY',
37
- defaultMessage: 'Every day'
38
- })
34
+ label: texts.everyDay
39
35
  }
40
36
  } // @ts-expect-error: Type 'string' is not assignable to type 'Days'.ts(2322)
41
37
  ,
@@ -326,7 +326,6 @@ var MonthlyFilter = /*#__PURE__*/function (_React$PureComponent) {
326
326
  onRangePaste = _this$props4.onRangePaste,
327
327
  onRangeClear = _this$props4.onRangeClear,
328
328
  rangeClipboard = _this$props4.rangeClipboard,
329
- intl = _this$props4.intl,
330
329
  texts = _this$props4.texts,
331
330
  valueSelectionModes = _this$props4.valueSelectionModes,
332
331
  timePickerProps = _this$props4.timePickerProps,
@@ -372,13 +371,7 @@ var MonthlyFilter = /*#__PURE__*/function (_React$PureComponent) {
372
371
  return event.stopPropagation();
373
372
  },
374
373
  className: visible[item.id] ? 'dropdown-header-visible' : 'dropdown-header'
375
- }, /*#__PURE__*/React.createElement(S.DropdownLabel, null, /*#__PURE__*/React.createElement(FormattedMessage, {
376
- id: "DS.DATE-RANGE-PICKER.DAYS-OF",
377
- defaultMessage: "Days of"
378
- }), SPACE_UNICODE), _this2.renderDaysOfField(item, key), /*#__PURE__*/React.createElement(S.DropdownLabel, null, SPACE_UNICODE, /*#__PURE__*/React.createElement(FormattedMessage, {
379
- id: "DS.DATE-RANGE-PICKER.COUNTED-FROM",
380
- defaultMessage: "counted from"
381
- }), SPACE_UNICODE), _this2.renderCountedFromField(item, key)),
374
+ }, /*#__PURE__*/React.createElement(S.DropdownLabel, null, texts.daysOf, SPACE_UNICODE), _this2.renderDaysOfField(item, key), /*#__PURE__*/React.createElement(S.DropdownLabel, null, SPACE_UNICODE, texts.countedFrom, SPACE_UNICODE), _this2.renderCountedFromField(item, key)),
382
375
  nameWrapperClassNames: ['full-width'],
383
376
  content: visible[item.id] ? /*#__PURE__*/React.createElement(S.ContentWrapper, null, /*#__PURE__*/React.createElement(TimeWindow, _extends({
384
377
  disabled: disabled,
@@ -411,17 +404,11 @@ var MonthlyFilter = /*#__PURE__*/function (_React$PureComponent) {
411
404
  }))) : /*#__PURE__*/React.createElement("div", null)
412
405
  },
413
406
  texts: {
414
- itemActionDeleteTooltip: intl.formatMessage({
415
- id: 'DS.DATE-RANGE-PICKER.REMOVE',
416
- defaultMessage: 'Remove'
417
- })
407
+ itemActionDeleteTooltip: texts.remove
418
408
  }
419
409
  });
420
410
  }), /*#__PURE__*/React.createElement(S.AddContainer, null, !disabled && value.length < Number(maxEntries) && /*#__PURE__*/React.createElement(Button.Creator, {
421
- label: intl.formatMessage({
422
- id: 'DS.DATE-RANGE-PICKER.ADD-RULE',
423
- defaultMessage: 'Add rule'
424
- }),
411
+ label: texts == null ? void 0 : texts.addRule,
425
412
  onClick: this.handleAddRow,
426
413
  block: true
427
414
  })));
@@ -1,3 +1,3 @@
1
1
  import { DailyProps } from './Daily.types';
2
- declare const Daily: ({ maxEntries, disabled, value, onChange, valueSelectionMode, timeFormat, timePickerProps, errorTexts, }: DailyProps) => JSX.Element;
2
+ declare const Daily: ({ maxEntries, disabled, value, onChange, valueSelectionMode, timeFormat, timePickerProps, texts, errorTexts, }: DailyProps) => JSX.Element;
3
3
  export default Daily;
@@ -5,12 +5,13 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
5
5
  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; }
6
6
 
7
7
  import React, { useMemo, useCallback } from 'react';
8
- import dayjs from 'dayjs';
9
8
  import { useIntl } from 'react-intl';
9
+ import dayjs from 'dayjs';
10
10
  import { DEFAULT_RANGE_END, DEFAULT_RANGE_START, DEFAULT_TIME_FORMAT, DEFAULT_MAX_ENTRIES, NOOP, EMPTY_OBJECT, RENDER_EMPTY_NODE_FN } from '../constants';
11
11
  import * as S from '../../../RangeFilter.styles';
12
12
  import RangeFormContainer from '../../../Shared/TimeWindow/RangeFormContainer/RangeFormContainer';
13
13
  import { AddButton } from '../../../Shared';
14
+ import { getDefaultTexts } from '../../../../utils';
14
15
 
15
16
  var Daily = function Daily(_ref) {
16
17
  var _ref$maxEntries = _ref.maxEntries,
@@ -24,9 +25,13 @@ var Daily = function Daily(_ref) {
24
25
  valueSelectionMode = _ref$valueSelectionMo === void 0 ? ['Hour', 'Range'] : _ref$valueSelectionMo,
25
26
  timeFormat = _ref.timeFormat,
26
27
  timePickerProps = _ref.timePickerProps,
28
+ texts = _ref.texts,
27
29
  _ref$errorTexts = _ref.errorTexts,
28
30
  errorTexts = _ref$errorTexts === void 0 ? [] : _ref$errorTexts;
29
31
  var intl = useIntl();
32
+ var allTexts = React.useMemo(function () {
33
+ return getDefaultTexts(intl, false, texts);
34
+ }, [texts, intl]);
30
35
  var defaultDayValue = useMemo(function () {
31
36
  return {
32
37
  start: DEFAULT_RANGE_START,
@@ -85,7 +90,7 @@ var Daily = function Daily(_ref) {
85
90
  handleDayTimeChange(dateValueArray, index);
86
91
  },
87
92
  dayKeys: [0],
88
- texts: EMPTY_OBJECT,
93
+ texts: allTexts,
89
94
  activeDays: [0],
90
95
  getDayValue: function getDayValue() {
91
96
  return _getDayValue(index);
@@ -104,10 +109,7 @@ var Daily = function Daily(_ref) {
104
109
  hideHeader: true
105
110
  });
106
111
  }), value.length < maxEntries && !disabled && /*#__PURE__*/React.createElement(AddButton, {
107
- label: intl.formatMessage({
108
- id: 'DS.DATE-RANGE-PICKER.ADD-TIME',
109
- defaultMessage: 'Add range'
110
- }),
112
+ label: allTexts.addTime,
111
113
  onClick: handleRangeAdd
112
114
  }));
113
115
  };
@@ -3,11 +3,13 @@ import { DateLimitMode } from '../../../Shared/TimeWindow/RangeFormContainer/Ran
3
3
  import { DayOptions } from '../../../Shared/TimeWindow/TimeWindow.types';
4
4
  import { WithDisabledProp } from '../../../RangeFilter.types';
5
5
  import { FilterErrorType } from '../../../Shared/TimeWindow/RangeFormContainer/RangeFormContainer.types';
6
+ import { Texts } from '../../../../DateRangePicker.types';
6
7
  export type DailySchedule = DayOptions & {
7
8
  mode: DateLimitMode;
8
9
  };
9
10
  export type DailyProps = {
10
11
  value: DailySchedule[];
11
12
  errorTexts?: FilterErrorType[];
13
+ texts?: Partial<Texts>;
12
14
  onChange: (value: DailyProps['value']) => void;
13
15
  } & FilterBaseProps & WithDisabledProp;
@@ -1,3 +1,3 @@
1
1
  import { MonthlyProps } from './Monthly.types';
2
- declare const Monthly: ({ maxEntries, valueSelectionMode, onChange, timeFormat, valueFormatOptions, value, timePickerProps, disabled, periodType, countedFrom, errorTexts, }: MonthlyProps) => JSX.Element;
2
+ declare const Monthly: ({ maxEntries, valueSelectionMode, onChange, timeFormat, valueFormatOptions, value, timePickerProps, disabled, texts, periodType, countedFrom, errorTexts, }: MonthlyProps) => JSX.Element;
3
3
  export default Monthly;
@@ -21,6 +21,7 @@ import { canAddAnotherRange, haveActiveDaysCommonRange, range } from './utils';
21
21
  import { DEFAULT_RANGE_START, DEFAULT_RANGE_END, DEFAULT_TIME_FORMAT, EMPTY_OBJECT, DEFAULT_MAX_ENTRIES, RENDER_EMPTY_NODE_FN, NOOP } from '../constants';
22
22
  import { MONTH_DAYS, DAYS_OF_PERIOD_ENUM, COUNTED_FROM_ENUM, MONTHLY_SCHEDULER_INTL_KEYS_NTH_WEEK, MONTHLY_SCHEDULER_INTL_KEYS_WEEKDAYS_LONG, MONTHLY_SCHEDULER_INTL_KEYS_WEEKDAYS_SHORT } from '../../../constants';
23
23
  import { US_NOTATION_WEEK_DAYS_INDEXES } from '../../../Shared/TimeWindow/constants/timeWindow.constants';
24
+ import { getDefaultTexts } from '../../../../utils';
24
25
 
25
26
  var Monthly = function Monthly(_ref) {
26
27
  var _ref$maxEntries = _ref.maxEntries,
@@ -34,11 +35,16 @@ var Monthly = function Monthly(_ref) {
34
35
  value = _ref.value,
35
36
  timePickerProps = _ref.timePickerProps,
36
37
  disabled = _ref.disabled,
38
+ texts = _ref.texts,
37
39
  _ref$periodType = _ref.periodType,
38
40
  periodType = _ref$periodType === void 0 ? DAYS_OF_PERIOD_ENUM.DAY_OF_MONTH : _ref$periodType,
39
41
  _ref$countedFrom = _ref.countedFrom,
40
42
  countedFrom = _ref$countedFrom === void 0 ? COUNTED_FROM_ENUM.BEGINNING : _ref$countedFrom,
41
43
  errorTexts = _ref.errorTexts;
44
+ var intl = useIntl();
45
+ var allTexts = React.useMemo(function () {
46
+ return getDefaultTexts(intl, false, texts);
47
+ }, [texts, intl]);
42
48
  var defaultDayValue = React.useMemo(function () {
43
49
  return {
44
50
  start: DEFAULT_RANGE_START,
@@ -64,8 +70,6 @@ var Monthly = function Monthly(_ref) {
64
70
  controlKeyPressed = _useShiftAndControlKe[0],
65
71
  shiftKeyPressed = _useShiftAndControlKe[1];
66
72
 
67
- var intl = useIntl();
68
-
69
73
  var _useDataFormat = useDataFormat(),
70
74
  isSundayFirstWeekDay = _useDataFormat.isSundayFirstWeekDay;
71
75
 
@@ -272,9 +276,9 @@ var Monthly = function Monthly(_ref) {
272
276
  intl: intl,
273
277
  onToggle: handleToggleDay,
274
278
  onClear: removeDaySelection,
275
- texts: EMPTY_OBJECT
279
+ texts: allTexts
276
280
  });
277
- }, [activeDays, intl, getDayLabel, handleToggleDay, removeDaySelection, isDayRestricted, disabled]);
281
+ }, [activeDays, getDayLabel, isDayRestricted, disabled, intl, handleToggleDay, removeDaySelection, allTexts]);
278
282
  var handleRangeAdd = React.useCallback(function () {
279
283
  var _objectSpread2;
280
284
 
@@ -296,12 +300,9 @@ var Monthly = function Monthly(_ref) {
296
300
  var renderGridTitle = React.useCallback(function (count) {
297
301
  return /*#__PURE__*/React.createElement(SelectionCount, {
298
302
  selectedDayCount: count,
299
- label: intl.formatMessage({
300
- id: 'DS.DATE-RANGE-PICKER.SELECTED',
301
- defaultMessage: 'Selected'
302
- })
303
+ label: allTexts.selected
303
304
  });
304
- }, [intl]);
305
+ }, [allTexts.selected]);
305
306
  var canAddRange = canAddAnotherRange(value, activeDays, maxEntries);
306
307
  var isAnyDaySelected = activeDays.length > 0;
307
308
  var shouldRenderAddButton = isAnyDaySelected && filteredSchedule.length < maxEntries && canAddRange && !disabled;
@@ -324,7 +325,7 @@ var Monthly = function Monthly(_ref) {
324
325
  intl: intl,
325
326
  numberOfDays: 7,
326
327
  numberOfDaysPerRow: 7,
327
- texts: EMPTY_OBJECT,
328
+ texts: allTexts,
328
329
  title: renderGridTitle(activeDays.length)
329
330
  }, getGridSettings())), isAnyDaySelected && filteredSchedule.map(function (guid, index) {
330
331
  return /*#__PURE__*/React.createElement(RangeFormContainer, {
@@ -335,7 +336,7 @@ var Monthly = function Monthly(_ref) {
335
336
  onDayTimeChange: function onDayTimeChange(dayValue, dayKey) {
336
337
  handleDayTimeChange(dayValue, dayKey, guid);
337
338
  },
338
- texts: EMPTY_OBJECT,
339
+ texts: allTexts,
339
340
  onMultipleDayTimeChange: function onMultipleDayTimeChange(dates) {
340
341
  return handleDayTimeChange(dates, activeDays, guid);
341
342
  },
@@ -362,21 +363,12 @@ var Monthly = function Monthly(_ref) {
362
363
  monthlyFilterPeriod: periodType
363
364
  });
364
365
  }), isAnyDaySelected && !canAddRange && /*#__PURE__*/React.createElement(SelectionHint, {
365
- message: intl.formatMessage({
366
- id: 'DS.DATE-RANGE-PICKER.MAXIMUM-RANGES-MESSAGE',
367
- defaultMessage: 'The maximum amount of ranges have been selected.'
368
- })
366
+ message: allTexts.maximumRanges
369
367
  }), shouldRenderAddButton && /*#__PURE__*/React.createElement(AddButton, {
370
- label: intl.formatMessage({
371
- id: 'DS.DATE-RANGE-PICKER.ADD-TIME',
372
- defaultMessage: 'Add range'
373
- }),
368
+ label: allTexts.addTime,
374
369
  onClick: handleRangeAdd
375
370
  }), !isAnyDaySelected && !disabled && /*#__PURE__*/React.createElement(SelectionHint, {
376
- message: intl.formatMessage({
377
- id: 'DS.DATE-RANGE-PICKER.SELECT-DAYS-DESCRIPTION',
378
- defaultMessage: 'Select range.'
379
- })
371
+ message: allTexts.selectDaysDescription
380
372
  }));
381
373
  };
382
374
 
@@ -4,6 +4,7 @@ import { DateLimitMode } from '../../../Shared/TimeWindow/RangeFormContainer/Ran
4
4
  import { FilterBaseProps } from '../Filters.types';
5
5
  import { WithDisabledProp } from '../../../RangeFilter.types';
6
6
  import { FilterErrorType } from '../../../Shared/TimeWindow/RangeFormContainer/RangeFormContainer.types';
7
+ import { Texts } from '../../../../DateRangePicker.types';
7
8
  export type MonthlyScheduleDayValue = DayOptions & {
8
9
  mode: DateLimitMode;
9
10
  };
@@ -19,4 +20,5 @@ export type MonthlyProps = {
19
20
  periodType: DAYS_OF_PERIOD_ENUM;
20
21
  countedFrom: COUNTED_FROM_ENUM;
21
22
  onChange: (value: MonthlyProps['value']) => void;
23
+ texts?: Partial<Texts>;
22
24
  } & FilterBaseProps & WithDisabledProp;
@@ -1,3 +1,3 @@
1
1
  import { WeeklyProps } from './Weekly.types';
2
- declare const Weekly: ({ maxEntries, valueSelectionMode, onChange, timeFormat, valueFormatOptions, value, timePickerProps, disabled, errorTexts, }: WeeklyProps) => JSX.Element;
2
+ declare const Weekly: ({ maxEntries, valueSelectionMode, onChange, timeFormat, valueFormatOptions, value, texts, timePickerProps, disabled, errorTexts, }: WeeklyProps) => JSX.Element;
3
3
  export default Weekly;