@wojtekmaj/react-daterange-picker - npm Package Compare versions

Comparing version 5.2.1 to 5.3.0

dist/cjs/DateRangePicker.js

 "use strict";
+'use client';
 var __assign = (this && this.__assign) || function () {
@@ -3,0 +4,0 @@ __assign = Object.assign || function(t) {

dist/esm/DateRangePicker.js

@@ -0,1 +1,2 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
@@ -2,0 +3,0 @@ __assign = Object.assign || function(t) {

package.json

 {
   "name": "@wojtekmaj/react-daterange-picker",
-  "version": "5.2.1",
+  "version": "5.3.0",
   "description": "A date range picker for your React app.",
@@ -44,5 +44,5 @@ "main": "dist/cjs/index.js",
     "prop-types": "^15.6.0",
-    "react-calendar": "^4.4.0",
+    "react-calendar": "^4.5.0",
     "react-date-picker": "^10.2.1",
-    "react-fit": "^1.5.1"
+    "react-fit": "^1.6.0"
   },
@@ -55,2 +55,3 @@ "devDependencies": {
     "@types/node": "*",
+    "@types/react": "*",
     "eslint": "^8.26.0",
@@ -71,5 +72,11 @@ "eslint-config-wojtekmaj": "^0.9.0",
   "peerDependencies": {
+    "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
   },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    }
+  },
   "publishConfig": {
@@ -76,0 +83,0 @@ "access": "public",

README.md

@@ -52,8 +52,12 @@ [![npm](https://img.shields.io/npm/v/@wojtekmaj/react-daterange-picker.svg)](https://www.npmjs.com/package/@wojtekmaj/react-daterange-picker) ![downloads](https://img.shields.io/npm/dt/@wojtekmaj/react-daterange-picker.svg) [![CI](https://github.com/wojtekmaj/react-daterange-picker/workflows/CI/badge.svg)](https://github.com/wojtekmaj/react-daterange-picker/actions)
 
-```js
-import React, { useState } from 'react';
+```tsx
+import { useState } from 'react';
 import DateRangePicker from '@wojtekmaj/react-daterange-picker';
 
+type ValuePiece = Date | null;
+
+type Value = ValuePiece | [ValuePiece, ValuePiece];
+
 function MyApp() {
-  const [value, onChange] = useState([new Date(), new Date()]);
+  const [value, onChange] = useState<Value>([new Date(), new Date()]);
 
@@ -72,3 +76,3 @@ return (
 
-```js
+```ts
 import '@wojtekmaj/react-daterange-picker/dist/DateRangePicker.css';
@@ -95,3 +99,3 @@ import 'react-calendar/dist/Calendar.css';
 | clearIcon            | Content of the clear button. Setting the value explicitly to `null` will hide the icon.                                                                                                                                                      | (default icon)          | <ul><li>String: `"Clear"`</li><li>React element: `<ClearIcon />`</li><li>React function: `ClearIcon`</li></ul>                                                                                                      |
-| closeCalendar        | Whether to close the calendar on value selection. Note: It's recommended to use shouldCloseCalendar function instead.                                                                                                                        | `true`                  | `false`                                                                                                                                                                                                             |
+| closeCalendar        | Whether to close the calendar on value selection. **Note**: It's recommended to use shouldCloseCalendar function instead.                                                                                                                    | `true`                  | `false`                                                                                                                                                                                                             |
 | data-testid          | `data-testid` attribute for the main React-DateRange-Picker `<div>` element.                                                                                                                                                                 | n/a                     | `"date-picker"`                                                                                                                                                                                                     |
@@ -118,3 +122,3 @@ | dayAriaLabel         | `aria-label` for the day input.                                                                                                                                                                                                              | n/a                     | `"Day"`                                                                                                                                                                                                             |
 | onInvalidChange      | Function called when the user picks an invalid date.                                                                                                                                                                                         | n/a                     | `() => alert('Invalid date')`                                                                                                                                                                                       |
-| openCalendarOnFocus  | Whether to open the calendar on input focus. Note: It's recommended to use shouldOpenCalendar function instead.                                                                                                                              | `true`                  | `false`                                                                                                                                                                                                             |
+| openCalendarOnFocus  | Whether to open the calendar on input focus. **Note**: It's recommended to use shouldOpenCalendar function instead.                                                                                                                          | `true`                  | `false`                                                                                                                                                                                                             |
 | portalContainer      | Element to render the calendar in using portal.                                                                                                                                                                                              | n/a                     | `document.getElementById('my-div')`                                                                                                                                                                                 |
@@ -121,0 +125,0 @@ | rangeDivider         | Divider between date inputs.                                                                                                                                                                                                                 | `"–"`                   | `" to "`                                                                                                                                                                                                            |

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

125003

increased by0.23%

Lines of code

2180

increased by0.14%

Number of lines in readme file

152

increased by2.7%

Worsened metrics

Dependency count

9

increased by12.5%

Dev dependency count

19

increased by5.56%

Dependency changes

• + Added@types/prop-types@15.7.13(transitive)

• + Added@types/react@18.3.8(transitive)

• + Addedcsstype@3.1.3(transitive)

• Updatedreact-calendar@^4.5.0

• Updatedreact-fit@^1.6.0