react-persian-dates - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

package.json

 {
   "name": "react-persian-dates",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "",
@@ -5,0 +5,0 @@ "author": "majid-amiri",

README.md

@@ -18,3 +18,3 @@ # react-persian-dates
 
-import MyComponent from 'react-persian-dates'
+import Datepicker from 'react-persian-dates'
 
@@ -24,3 +24,5 @@ class Example extends Component {
     return (
-      <MyComponent />
+      <Datepicker
+        onSelect={this.handleChange}
+      />
     )
@@ -31,4 +33,65 @@ }
 
+## Props
+
+|Props name|Desciption|Values|Default value|
+|--------------------|--------------------|------------------|-----------------|
+|monthsCount|Number of months shown in date picker|(Number)|12
+|startDate|The date that calendar use to start generating|(Date)|```new Date()```|
+|selectFrom|The date that is marked when date picker appears|(Date)|```new Date()```|
+|selectTo|The date that is marked as second date (usable in range date picker)|(Date)|null|
+|onSelect|Function that returns a value when marked dates are changed in date picker|(Function)|null|
+|rangeSelect|Specify if date picker is single or range|(Boolean)|false|
+|scrollToSelectedDay|A function that returns the selected date element. (#1. Refer to examples) (#2. You can use it for scrolling to selected day)|(Function)|undefined|
+
+## Example
+
+```jsx
+import React, { Component } from 'react'
+
+import Datepicker from 'react-persian-dates'
+
+class Example extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      from: new Date(),
+      to: null,
+    };
+  }
+  
+  handleChange = value => {
+    this.setState({
+      from: value.from,
+      to: value.to,
+    });
+  };
+  
+  render () {
+    const { from, to } = this.state;
+    return (
+      <Datepicker
+        rangeSelect={true}
+        startDate={new Date()}
+        selectFrom={from}
+        selectTo={to}
+        onSelect={this.handleChange}
+        scrollToSelectedDay={day =>
+          setTimeout(
+            () =>
+              window.scrollTo({
+                top: day.offsetTop - 200,
+                left: 0,
+                behavior: 'smooth',
+              }),
+            500,
+          )
+        }
+      />
+    )
+  }
+}
+```
+
 ## License
 
 MIT © [majid-amiri](https://github.com/majid-amiri)

No alert changes

Improved metrics

Total package byte prevSize

82505

2.14%

Number of lines in readme file

95

196.88%

No dependency changes