@commercetools-uikit/date-range-input 13.0.0 → 13.0.4

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 (6) hide show
  1. package/README.md +2 -10
  2. package/dist/commercetools-uikit-date-range-input.cjs.dev.js +7 -7
  3. package/dist/commercetools-uikit-date-range-input.cjs.prod.js +5 -3
  4. package/dist/commercetools-uikit-date-range-input.esm.js +7 -7
  5. package/dist/declarations/src/date-range-input.d.ts +28 -2
  6. package/package.json +13 -15
package/README.md CHANGED
@@ -47,9 +47,10 @@ export default Example;
47
47
 
48
48
  | Props | Type | Required | Default | Description |
49
49
  | ---------------------- | -------------------------------------------------------------------------------------------- | :------: | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
50
- | `intl` | `Object`<br/>[See signature.](#signature-intl) | ✅ | | |
51
50
  | `horizontalConstraint` | `union`<br/>Possible values:<br/>`, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto'` | | | Horizontal size limit of the input field. |
52
51
  | `value` | `Array: MomentInput[]` | ✅ | | The selected date range, must either be an empty array or an array of two strings holding dates formatted as "YYYY-MM-DD". |
52
+ | `aria-invalid` | `boolean` | | | Indicate if the value entered in the input is invalid. |
53
+ | `aria-errormessage` | `string` | | | HTML ID of an element containing an error message related to the input. |
53
54
  | `onChange` | `Function`<br/>[See signature.](#signature-onChange) | ✅ | | Called when the date range changes. Called with an event containing either an empty array (no value) or an array holding two string in this format: "YYYY-MM-DD".&#xA;<br />&#xA;Signature: `(event) => void` |
54
55
  | `isClearable` | `boolean` | | `true` | Allows the range to be cleared |
55
56
  | `onFocus` | `Function`<br/>[See signature.](#signature-onFocus) | | | Called when the date input gains focus. |
@@ -64,15 +65,6 @@ export default Example;
64
65
 
65
66
  ## Signatures
66
67
 
67
- ### Signature `intl`
68
-
69
- ```ts
70
- {
71
- locale: string;
72
- formatMessage: (message: MessageDescriptor) => void;
73
- }
74
- ```
75
-
76
68
  ### Signature `onChange`
77
69
 
78
70
  ```ts
package/dist/commercetools-uikit-date-range-input.cjs.dev.js CHANGED
@@ -352,6 +352,9 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
352
352
  children: [jsxRuntime.jsx(calendarUtils.CalendarBody, {
353
353
  inputRef: _this2.inputRef,
354
354
  inputProps: getInputProps(_objectSpread({
355
+ /* ARIA */
356
+ 'aria-invalid': _this2.props['aria-invalid'],
357
+ 'aria-errormessage': _this2.props['aria-errormessage'],
355
358
  // Unset the aria-labelledby as it interfers with the link
356
359
  // between the <label for> and the <input id>.
357
360
  'aria-labelledby': undefined,
@@ -509,8 +512,7 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
509
512
  }]);
510
513
 
511
514
  return DateRangeCalendar;
512
- }(react.Component); // @ts-ignore
513
-
515
+ }(react.Component);
514
516
 
515
517
  DateRangeCalendar.displayName = 'DateRangeCalendar';
516
518
  DateRangeCalendar.defaultProps = {
@@ -522,12 +524,10 @@ DateRangeCalendar.isEmpty = function (range) {
522
524
  };
523
525
 
524
526
  DateRangeCalendar.propTypes = process.env.NODE_ENV !== "production" ? {
525
- intl: _pt__default["default"].shape({
526
- locale: _pt__default["default"].string.isRequired,
527
- formatMessage: _pt__default["default"].func.isRequired
528
- }).isRequired,
529
527
  horizontalConstraint: _pt__default["default"].oneOf([6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
530
528
  value: _pt__default["default"].arrayOf(_pt__default["default"].any).isRequired,
529
+ 'aria-invalid': _pt__default["default"].bool,
530
+ 'aria-errormessage': _pt__default["default"].string,
531
531
  onChange: _pt__default["default"].func.isRequired,
532
532
  isClearable: _pt__default["default"].bool,
533
533
  onFocus: _pt__default["default"].func,
@@ -543,7 +543,7 @@ DateRangeCalendar.propTypes = process.env.NODE_ENV !== "production" ? {
543
543
  var dateRangeInput = reactIntl.injectIntl(DateRangeCalendar);
544
544
 
545
545
  // NOTE: This string will be replaced on build time with the package version.
546
- var version = "13.0.0";
546
+ var version = "13.0.4";
547
547
 
548
548
  exports["default"] = dateRangeInput;
549
549
  exports.version = version;
package/dist/commercetools-uikit-date-range-input.cjs.prod.js CHANGED
@@ -351,6 +351,9 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
351
351
  children: [jsxRuntime.jsx(calendarUtils.CalendarBody, {
352
352
  inputRef: _this2.inputRef,
353
353
  inputProps: getInputProps(_objectSpread({
354
+ /* ARIA */
355
+ 'aria-invalid': _this2.props['aria-invalid'],
356
+ 'aria-errormessage': _this2.props['aria-errormessage'],
354
357
  // Unset the aria-labelledby as it interfers with the link
355
358
  // between the <label for> and the <input id>.
356
359
  'aria-labelledby': undefined,
@@ -508,8 +511,7 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
508
511
  }]);
509
512
 
510
513
  return DateRangeCalendar;
511
- }(react.Component); // @ts-ignore
512
-
514
+ }(react.Component);
513
515
 
514
516
  DateRangeCalendar.displayName = 'DateRangeCalendar';
515
517
  DateRangeCalendar.defaultProps = {
@@ -524,7 +526,7 @@ DateRangeCalendar.propTypes = {};
524
526
  var dateRangeInput = reactIntl.injectIntl(DateRangeCalendar);
525
527
 
526
528
  // NOTE: This string will be replaced on build time with the package version.
527
- var version = "13.0.0";
529
+ var version = "13.0.4";
528
530
 
529
531
  exports["default"] = dateRangeInput;
530
532
  exports.version = version;
package/dist/commercetools-uikit-date-range-input.esm.js CHANGED
@@ -328,6 +328,9 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
328
328
  children: [jsx(CalendarBody, {
329
329
  inputRef: _this2.inputRef,
330
330
  inputProps: getInputProps(_objectSpread({
331
+ /* ARIA */
332
+ 'aria-invalid': _this2.props['aria-invalid'],
333
+ 'aria-errormessage': _this2.props['aria-errormessage'],
331
334
  // Unset the aria-labelledby as it interfers with the link
332
335
  // between the <label for> and the <input id>.
333
336
  'aria-labelledby': undefined,
@@ -485,8 +488,7 @@ var DateRangeCalendar = /*#__PURE__*/function (_Component) {
485
488
  }]);
486
489
 
487
490
  return DateRangeCalendar;
488
- }(Component); // @ts-ignore
489
-
491
+ }(Component);
490
492
 
491
493
  DateRangeCalendar.displayName = 'DateRangeCalendar';
492
494
  DateRangeCalendar.defaultProps = {
@@ -498,12 +500,10 @@ DateRangeCalendar.isEmpty = function (range) {
498
500
  };
499
501
 
500
502
  DateRangeCalendar.propTypes = process.env.NODE_ENV !== "production" ? {
501
- intl: _pt.shape({
502
- locale: _pt.string.isRequired,
503
- formatMessage: _pt.func.isRequired
504
- }).isRequired,
505
503
  horizontalConstraint: _pt.oneOf([6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
506
504
  value: _pt.arrayOf(_pt.any).isRequired,
505
+ 'aria-invalid': _pt.bool,
506
+ 'aria-errormessage': _pt.string,
507
507
  onChange: _pt.func.isRequired,
508
508
  isClearable: _pt.bool,
509
509
  onFocus: _pt.func,
@@ -519,6 +519,6 @@ DateRangeCalendar.propTypes = process.env.NODE_ENV !== "production" ? {
519
519
  var dateRangeInput = injectIntl(DateRangeCalendar);
520
520
 
521
521
  // NOTE: This string will be replaced on build time with the package version.
522
- var version = "13.0.0";
522
+ var version = "13.0.4";
523
523
 
524
524
  export { dateRangeInput as default, version };
package/dist/declarations/src/date-range-input.d.ts CHANGED
@@ -1,5 +1,31 @@
1
1
  /// <reference types="react" />
2
- declare const _default: import("react").FC<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<"intl">>> & {
3
- WrappedComponent: import("react").ComponentType<import("react-intl").WrappedComponentProps<"intl">>;
2
+ import { type WrappedComponentProps } from 'react-intl';
3
+ import type { MomentInput } from 'moment';
4
+ declare type TEvent = {
5
+ target: {
6
+ id?: string;
7
+ name?: string;
8
+ value?: MomentInput[];
9
+ };
10
+ };
11
+ declare type TDateRangeCalendarProps = {
12
+ horizontalConstraint?: 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 'scale' | 'auto';
13
+ value: MomentInput[];
14
+ 'aria-invalid'?: boolean;
15
+ 'aria-errormessage'?: string;
16
+ onChange: (event: TEvent) => void;
17
+ isClearable?: boolean;
18
+ onFocus?: (event: TEvent) => void;
19
+ onBlur?: (event: TEvent) => void;
20
+ id?: string;
21
+ name?: string;
22
+ placeholder?: string;
23
+ isDisabled?: boolean;
24
+ isReadOnly?: boolean;
25
+ hasError?: boolean;
26
+ hasWarning?: boolean;
27
+ } & WrappedComponentProps;
28
+ declare const _default: import("react").FC<import("react-intl").WithIntlProps<TDateRangeCalendarProps>> & {
29
+ WrappedComponent: import("react").ComponentType<TDateRangeCalendarProps>;
4
30
  };
5
31
  export default _default;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/date-range-input",
3
3
  "description": "The `DateRangeInput` component allows the user to select a date range.",
4
- "version": "13.0.0",
4
+ "version": "13.0.4",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,31 +21,29 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "7.17.2",
23
23
  "@babel/runtime-corejs3": "7.17.2",
24
- "@commercetools-uikit/accessible-button": "13.0.0",
25
- "@commercetools-uikit/calendar-utils": "13.0.0",
26
- "@commercetools-uikit/constraints": "13.0.0",
24
+ "@commercetools-uikit/accessible-button": "13.0.4",
25
+ "@commercetools-uikit/calendar-utils": "13.0.4",
26
+ "@commercetools-uikit/constraints": "13.0.2",
27
27
  "@commercetools-uikit/design-system": "13.0.0",
28
- "@commercetools-uikit/hooks": "12.2.9",
29
- "@commercetools-uikit/icons": "13.0.0",
30
- "@commercetools-uikit/secondary-icon-button": "13.0.0",
31
- "@commercetools-uikit/select-utils": "13.0.0",
32
- "@commercetools-uikit/spacings-inline": "13.0.0",
33
- "@commercetools-uikit/text": "13.0.0",
34
- "@commercetools-uikit/tooltip": "13.0.0",
35
- "@commercetools-uikit/utils": "12.2.9",
28
+ "@commercetools-uikit/hooks": "13.0.2",
29
+ "@commercetools-uikit/icons": "13.0.2",
30
+ "@commercetools-uikit/secondary-icon-button": "13.0.4",
31
+ "@commercetools-uikit/select-utils": "13.0.4",
32
+ "@commercetools-uikit/spacings-inline": "13.0.2",
33
+ "@commercetools-uikit/text": "13.0.4",
34
+ "@commercetools-uikit/tooltip": "13.0.2",
35
+ "@commercetools-uikit/utils": "13.0.2",
36
36
  "@emotion/react": "^11.4.0",
37
37
  "@emotion/styled": "^11.3.0",
38
- "common-tags": "1.8.2",
39
38
  "downshift": "6.1.7",
40
39
  "prop-types": "15.8.1",
41
40
  "react-is": "17.0.2",
42
- "react-required-if": "1.0.3",
43
41
  "warning": "4.0.3"
44
42
  },
45
43
  "devDependencies": {
46
44
  "moment": "2.29.1",
47
45
  "react": "17.0.2",
48
- "react-intl": "5.24.6"
46
+ "react-intl": "^5.24.6"
49
47
  },
50
48
  "peerDependencies": {
51
49
  "moment": "2.x",