@quasar/quasar-ui-qcalendar - npm Package Compare versions

Comparing version 2.2.0 to 2.2.1

dist/api/timestamp.json

@@ -7,2 +7,10 @@ {
   "methods": {
+    "today": {
+      "addedIn": "v2.2.1",
+      "desc": "Returns today's date in YYYY-MM-DD format",
+      "returns": {
+        "type": "String",
+        "desc": "Returns today's date in YYYY-MM-DD format"
+      }
+    },
     "getStartOfWeek": {
@@ -116,3 +124,3 @@ "desc": "Returns the start of the week based on the passed in arguments",
     "validateTimestamp": {
-      "desc": "Validates the passed in date/time string (YYYY-mm-dd hh:mm:ss)",
+      "desc": "Validates the passed in date/time string (YYYY-MM-DD hh:mm:ss)",
       "params": {
@@ -122,3 +130,3 @@ "input": {
           "required": true,
-          "desc": "A date/time string in the form `YYYY-mm-dd hh:mm:ss` (seconds are optional)",
+          "desc": "A date/time string in the form `YYYY-MM-DD hh:mm:ss` (seconds are optional)",
           "examples": [
@@ -140,3 +148,3 @@ "2020-10-02 15:00"
           "required": true,
-          "desc": "A date/time string in the form `YYYY-mm-dd hh:mm:ss` (seconds are optional)",
+          "desc": "A date/time string in the form `YYYY-MM-DD hh:mm:ss` (seconds are optional)",
           "examples": [
@@ -161,3 +169,3 @@ "2020-10-02 15:00"
           "required": true,
-          "desc": "A date/time string in the form `YYYY-mm-dd hh:mm:ss` (seconds are optional)",
+          "desc": "A date/time string in the form `YYYY-MM-DD hh:mm:ss` (seconds are optional)",
           "examples": [
@@ -375,7 +383,7 @@ "2020-10-02 15:00"
           "type": "String",
-          "desc": "A date in the form `YYYY-mm-dd` where all dates before, and including, will be disabled"
+          "desc": "A date in the form `YYYY-MM-DD` where all dates before, and including, will be disabled"
         },
         "disabledAfter": {
           "type": "String",
-          "desc": "A date in the form `YYYY-mm-dd` where all dates after, and including, will be disabled"
+          "desc": "A date in the form `YYYY-MM-DD` where all dates after, and including, will be disabled"
         },
@@ -393,5 +401,6 @@ "disabledWeekdays": {
           "required": true,
-          "desc": "An array of disabled days",
+          "desc": "An array of disabled days. If an array is contained within the array with a start and end date, it will be treated as a range",
           "examples": [
-            "['2020-01-01', '2020-07-04']"
+            "['2020-01-01', '2020-07-04']",
+            "['2020-01-01', ['2020-07-04', '2020-07-11']]"
           ]
@@ -550,3 +559,3 @@ }
         "type": "String",
-        "desc": "A date as a padded value in the form `YYYY-mm-dd`. Instead of `2020-1-2`, this function formats it as `2020-01-02`"
+        "desc": "A date as a padded value in the form `YYYY-MM-DD`. Instead of `2020-1-2`, this function formats it as `2020-01-02`"
       }
@@ -580,3 +589,3 @@ },
         "type": "String",
-        "desc": "A date and time as a padded value in the form `YYYY-mm-dd hh:mm`. Instead of `2020-1-2`, this function formats it as `2020-01-02`"
+        "desc": "A date and time as a padded value in the form `YYYY-MM-DD hh:mm`. Instead of `2020-1-2`, this function formats it as `2020-01-02`"
       }
@@ -782,7 +791,7 @@ },
           "type": "String",
-          "desc": "A date in the form `YYYY-mm-dd` where all dates before, and including, will be disabled"
+          "desc": "A date in the form `YYYY-MM-DD` where all dates before, and including, will be disabled"
         },
         "disabledAfter": {
           "type": "String",
-          "desc": "A date in the form `YYYY-mm-dd` where all dates after, and including, will be disabled"
+          "desc": "A date in the form `YYYY-MM-DD` where all dates after, and including, will be disabled"
         },
@@ -800,3 +809,3 @@ "disabledWeekdays": {
           "default": "[]",
-          "desc": "An array of string dates in the form `YYYY-mm-dd` that representing disabled days"
+          "desc": "An array of string dates in the form `YYYY-MM-DD` that representing disabled days"
         },
@@ -803,0 +812,0 @@ "max": {

dist/vetur/attributes.json

 {
   "q-calendar/value": {
     "type": "string",
-    "description": "v-model; When set as `YYYY-mm-dd`, the calendar will display the current view on this date. If empty, then it will be changed to the current date which will be emitted"
+    "description": "v-model; When set as `YYYY-MM-DD`, the calendar will display the current view on this date. If empty, then it will be changed to the current date which will be emitted"
   },
@@ -32,11 +32,11 @@ "q-calendar/view": {
     "type": "array",
-    "description": "An array of string dates in the form `YYYY-mm-dd` that will be disabled"
+    "description": "An array of string dates in the form `YYYY-MM-DD` that will be disabled. If an array is contained within the array with a start and end date, it will be treated as a range"
   },
   "q-calendar/disabled-before": {
     "type": "string",
-    "description": "A date in the form `YYYY-mm-dd` where all dates before, and including, will be disabled"
+    "description": "A date in the form `YYYY-MM-DD` where all dates before, and including, will be disabled"
   },
   "q-calendar/disabled-after": {
     "type": "string",
-    "description": "A date in the form `YYYY-mm-dd` where all dates after, and including, will be disabled"
+    "description": "A date in the form `YYYY-MM-DD` where all dates after, and including, will be disabled"
   },
@@ -217,7 +217,7 @@ "q-calendar/locale": {
     "type": "array",
-    "description": "An array of two dates in format `YYYY-mm-dd` for selection purposes"
+    "description": "An array of two dates in format `YYYY-MM-DD` for selection purposes"
   },
   "q-calendar/selected-dates": {
     "type": "array",
-    "description": "An array of string dates in the form `YYYY-mm-dd` that will be selected"
+    "description": "An array of string dates in the form `YYYY-MM-DD` that will be selected"
   },
@@ -224,0 +224,0 @@ "q-calendar/mini-mode": {

package.json

 {
   "name": "@quasar/quasar-ui-qcalendar",
-  "version": "2.2.0",
+  "version": "2.2.1",
   "author": "Jeff Galbraith <[e-mail]>",
@@ -5,0 +5,0 @@ "description": "QCalendar - Day/Month/Week Calendars, Popups, Schedules, Agendas and Planners for your Quasar Apps",

README.md

@@ -7,6 +7,42 @@ QCalendar
 
+## Everything you need for a complete Calendar solution.
+
 QCalendar is a [Quasar](https://quasar.dev) component. It is a powerful calendar that plugs right into your Quasar application and allows for viewing of **day** (1-7 days for a week), **monthly**, **scheduler** and **agenda** views. Painstaking care has been given to make almost every aspect of QCalendar configurable and/or modifiable in some way and control given to the developer.
 
-![QCalendar example month view](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/src/public/qcalendar-month-view.png)
+**Month view with events**
 
+![QCalendar example month view](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-month-view.png)
+
+**Planner example**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-agenda-view--planner.png)
+
+**Monthly Mini-mode**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/q-calendar-month-view-mini-mode-with-selection.png)
+
+**Multi-month selector (mini-mode)**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-month-view-mini-mode-multi-month-selection.png)
+
+**Agenda view with custom content**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-agenda-view.png)
+
+**Day view with events**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-day-view.png)
+
+**Resource view with events**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-resource-view.png)
+
+**Scheduler view**
+
+![QCalendar example planner](https://raw.githubusercontent.com/quasarframework/quasar-ui-qcalendar/dev/demo/public/qcalendar-scheduler-view.png)
+
+Including support for locales, optional theming, 1st day Monday, 5-day work weeks, work week numbers, selected days, disabled days, day of year...
+
+...and many more!
+
 # Examples and Documentation
@@ -158,3 +194,3 @@ Can be found [here](https://quasarframework.github.io/quasar-ui-qcalendar)
           const now = new Date()
-          // set initially to today's date (YYYY-mm-dd)
+          // set initially to today's date (YYYY-MM-DD)
           this.date = now.getFullYear() + '-' + (this.padNumber(now.getMonth() + 1, 2)) + '-' + this.padNumber(now.getDay(), 2)
@@ -161,0 +197,0 @@ },

src/components/QCalendar.js

@@ -9,2 +9,3 @@ // Mixins
   DAY_MIN,
+  today,
   parseTimestamp,
@@ -184,2 +185,6 @@ relativeDays,
     move (amount = 1) {
+      if (amount === 0) {
+        this.moveToToday()
+        return
+      }
       const moved = copyTimestamp(this.parsedValue)
@@ -271,2 +276,6 @@ const forward = amount > 0
 
+    moveToToday () {
+      this.$emit('input', today())
+    },
+
     next (amount = 1) {
@@ -273,0 +282,0 @@ this.move(amount)

src/components/QCalendarWeekly.js

@@ -370,2 +370,3 @@ // Quasar
       )
+
       const activeDate = this.value === day.date
@@ -372,0 +373,0 @@

src/index.js

@@ -22,2 +22,3 @@ import { version } from '../package.json'
   TimeObject,
+  today,
   getStartOfWeek,
@@ -98,2 +99,3 @@ getEndOfWeek,
   TimeObject,
+  today,
   getStartOfWeek,
@@ -172,2 +174,3 @@ getEndOfWeek,
   TimeObject,
+  today,
   getStartOfWeek,
@@ -174,0 +177,0 @@ getEndOfWeek,

src/utils/timestamp.js

@@ -23,3 +23,3 @@ import { date } from 'quasar'
 export const Timestamp = {
-  date: '',       // YYYY-mm-dd
+  date: '',       // YYYY-MM-DD
   time: '',       // 00:00:00 (optional)
@@ -48,2 +48,11 @@ year: 0,        // YYYY
 
+export function today () {
+  const d = new Date(),
+    month = '' + (d.getMonth() + 1),
+    day = '' + d.getDate(),
+    year = d.getFullYear()
+
+  return [year, padNumber(month, 2), padNumber(day, 2)].join('-')
+}
+
 // get the start of the week (based on weekdays)
@@ -131,5 +140,5 @@ export function getStartOfWeek (timestamp, weekdays, today) {
 
-// low-level parser (fast) for YYYY-mm-dd hh:mm:ss, use 'parseTimestamp' for formatted and relative updates
+// low-level parser (fast) for YYYY-MM-DD hh:mm:ss, use 'parseTimestamp' for formatted and relative updates
 export function parsed (input) {
-  // YYYY-mm-dd hh:mm:ss
+  // YYYY-MM-DD hh:mm:ss
   const parts = PARSE_REGEX.exec(input)
@@ -159,3 +168,3 @@
 
-// high-level parser (slower) for YYYY-mm-dd hh:mm:ss
+// high-level parser (slower) for YYYY-MM-DD hh:mm:ss
 export function parseTimestamp (input, now) {
@@ -296,6 +305,15 @@ const timestamp = parsed(input)
     for (const day in disabledDays) {
-      const d = getDayIdentifier(parseTimestamp(disabledDays[day] + ' 00:00'))
-      if (d === t) {
-        timestamp.disabled = true
-        break
+      if (Array.isArray(disabledDays[day]) && disabledDays[day].length === 2) {
+        const start = parsed(disabledDays[day][0])
+        const end = parsed(disabledDays[day][1])
+        if (isBetweenDates(timestamp, start, end)) {
+          timestamp.disabled = true
+          break
+        }
+      } else {
+        const d = getDayIdentifier(parseTimestamp(disabledDays[day] + ' 00:00'))
+        if (d === t) {
+          timestamp.disabled = true
+          break
+        }
       }
@@ -372,3 +390,3 @@ }
 
-// get date in YYY-mm-dd format
+// get date in YYYY-MM-DD format
 export function getDate (timestamp) {
@@ -391,3 +409,3 @@ let str = `${padNumber(timestamp.year, 4)}-${padNumber(timestamp.month, 2)}`
 
-// get date/time in "YYYY-mm-dd HH:mm" format
+// get date/time in "YYYY-MM-DD HH:mm" format
 export function getDateTime (timestamp) {
@@ -735,2 +753,3 @@ return getDate(timestamp) + (timestamp.hasTime ? ' ' + getTime(timestamp) : '')
   TimeObject,
+  today,
   getStartOfWeek,
@@ -737,0 +756,0 @@ getEndOfWeek,

No alert changes

Improved metrics

Total package byte prevSize

1020860

increased by0.48%

Lines of code

17952

increased by0.4%

Number of lines in readme file

275

increased by15.06%

No dependency changes