@wslyhbb/vuejs-datepicker - npm Package Compare versions

Comparing version 3.1.0 to 3.1.1

package.json

 {
   "name": "@wslyhbb/vuejs-datepicker",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "publishConfig": {
@@ -5,0 +5,0 @@ "access": "public"

README.md

@@ -177,2 +177,3 @@ [![@wslyhbb/vuejs-datepicker](https://badgen.net/bundlephobia/min/@wslyhbb/vuejs-datepicker)](https://bundlephobia.com/result?p=@wslyhbb/vuejs-datepicker)
 | maxlength                     | String          |             | Sets html `maxlength` attribute on input                       |
+| disabled                      | Boolean         | false       | If true, disable Datepicker on screen                          |
 | disabled-dates                | Object          |             | See below for configuration                                    |
@@ -184,3 +185,4 @@ | placeholder                   | String          |             | Input placeholder text                                         |
 | wrapper-class                 | String\|Object  |             | CSS class applied to the outer div                             |
-| monday-first                  | Boolean         | false       | To start the week on Monday                                    |
+| monday-first                  | Boolean         | false       | (Deprecated for first-day-of-week) To start the week           |
+| first-day-of-week             | String          | sun         | Sets the first day of the week.                                |
 | two-letter-abbr               |                 | false       | Show day abbreviations in two letters                          |
@@ -195,4 +197,5 @@ | clear-button                  | Boolean         | false       | Show an icon for clearing the date                             |
 | initial-view                  | String          | minimumView | If set, open on that view                                      |
-| disabled                      | Boolean         | false       | If true, disable Datepicker on screen                          |
 | required                      | Boolean         | false       | Sets html required attribute on input                          |
+| show-edge-dates               | Boolean         | false       | If `false`, dates from previous/next months won't show         |
+| tabindex                      | String\|Number  |             | Tabindex for the input                                         |
 | typeable                      | Boolean         | false       | If true, allow the user to type the date                       |
@@ -199,0 +202,0 @@ | use-utc                       | Boolean         | false       | use UTC for time calculations                                  |

src/mixins/inputProps.js

@@ -79,2 +79,6 @@ export default {
     },
+    tabindex: {
+      type: [Number, String],
+      default: null
+    },
     typeable: {
@@ -81,0 +85,0 @@ type: Boolean,

src/utils/DateUtils.js

@@ -30,2 +30,10 @@ import { toDate, format, setMonth, setDay, parse } from 'date-fns'
   /**
+   * Returns the number of days in the month, using UTC or not
+   * @param {Date} date
+   */
+  getDaysInMonth (date) {
+    return this.daysInMonth(this.getFullYear(date), this.getMonth(date))
+  },
+
+  /**
    * Returns the date, using UTC or not
@@ -123,3 +131,3 @@ * @param {Date} date
    * Return abbreviated week day name
-   * @param {Date}
+   * @param {Date} date
    * @return {String}
@@ -135,5 +143,23 @@ */
   /**
+   * Return day number from abbreviated week day name
+   * @param {String} abbr
+   * @return {Number}
+   */
+  getDayFromAbbr (abbr) {
+    const now = new Date()
+    const dates = [0, 1, 2, 3, 4, 5, 6]
+    const days = dates.map((day) => format(
+      setDay(now, day), 'ccc',
+      { locale: this.language }))
+    for (let i = 0; i < days.length; i++) {
+      if (abbr.toLowerCase() === days[i].toLowerCase()) {
+        return i
+      }
+    }
+    throw TypeError('Invalid week day')
+  },
+
+  /**
    * Return name of the month
-   * @param {Number|Date}
-   * @param {Array}
+   * @param {Number|Date} date
    * @return {String}
@@ -153,3 +179,3 @@ */
    * Return an abbreviated version of the month
-   * @param {Number|Date}
+   * @param {Number|Date} date
    * @return {String}
@@ -170,3 +196,3 @@ */
    * @param {Number} year
-   * @param {Number} m
+   * @param {Number} month
    * @return {Number}
@@ -202,8 +228,8 @@ */
    * Return abbreviated week day name
-   * @param {Boolean} mondayFirst
+   * @param {Number} firstDayOfWeek
    * @param {Boolean} twoLetter
    * @returns {Array}
    */
-  getDaysOfWeek (mondayFirst, twoLetter = false) {
-    const plainDate = new Date()
+  getDaysStartingOn (firstDayOfWeek, twoLetter = false) {
+    const now = new Date()
     const dates = [0, 1, 2, 3, 4, 5, 6]
@@ -214,4 +240,4 @@ let formatString = 'ccc'
     }
-    return dates.map((v) => format(
-      setDay(plainDate, mondayFirst ? v + 1 : v),
+    return dates.map((day) => format(
+      setDay(now, day + firstDayOfWeek),
       formatString,
@@ -224,5 +250,4 @@ { locale: this.language }
    * Formats date object
-   * @param {Date}
-   * @param {String}
-   * @param {Object}
+   * @param {Date} date
+   * @param {String} formatString
    * @return {String}
@@ -234,2 +259,8 @@ */
 
+  /**
+   * Parses a date from a string
+   * @param {String}          dateStr
+   * @param {Strin}           formatString
+   * @return {Date}
+   */
   parseDate (dateValue, formatString = 'yyyy-MM-dd') {
@@ -236,0 +267,0 @@ if (typeof dateValue === 'string') {

No alert changes

Improved metrics

Total package byte prevSize

924891

increased by13.3%

Number of package files

23

increased by43.75%

Lines of code

22604

increased by20.84%

Number of lines in readme file

413

increased by0.73%

No dependency changes