fix(disabled-dates): update docs

docs/config.md

@@ -22,6 +22,13 @@ Upper limit (not inclusive) for available dates for picking. All dates above tha
 
 Lower limit (not inclusive) for available dates for picking. All dates below that limit will not be selectable.
 
+### `disabledDates`
+
+- Type: `{ dates: Date[] }`
+- Required: no
+
+All dates listed in the dates array will not be selectable.
+
 ### `startingView`
 
 - Type: `'day' | 'month' | 'year'`
@@ -157,4 +164,4 @@ const styleObj = computed(() =>
   <div class="language-json">
     <pre><code>{{ styleObj }}</code></pre>
   </div>
-</details>
+</details>

docs/examples.md

@@ -11,6 +11,10 @@ const example2 = ref(new Date())
 const example2_from = ref(add(new Date(), { days: -7 }))
 const example2_to = ref(add(new Date(), { days: 7 }))
 
+// Disabled dates example
+const pickedDate = ref(new Date())
+const disabledDate = ref(add(new Date(), { days: 1 }))
+
 // Ex 3
 const example3 = ref(new Date())
 const startingView = ref('day')
@@ -81,6 +85,37 @@ Result:
   ```
 </details>
 
+## Disabled dates
+
+Settings: 
+
+- Disabled date: <datepicker v-model="disabledDate" />
+
+Result:
+
+<datepicker v-model="pickedDate" :disabledDates="{ dates: [disabledDate] }" />
+
+<details>
+  <summary>Code for this example</summary>
+
+  ```vue
+  <script setup>
+  import Datepicker from '../src/datepicker/Datepicker.vue'
+  import { ref } from 'vue'
+  import { add } from 'date-fns'
+  const pickedDate = ref(new Date())
+  const disabledDate = ref(add(new Date(), { days: 1 }))
+  </script>
+
+  <template>
+    <datepicker
+      v-model="pickedDate"
+      :disabledDates="{ dates: [disabledDate] }"
+    />
+  </template>
+  ```
+</details>
+
 ## Starting view
 Settings: 
 
@@ -89,4 +124,4 @@ Settings:
 - <label>Starting view: <code>year</code> <input type="radio" v-model="startingView" value="year"></label>
 
 Result:
-<datepicker v-model="example3" :starting-view="startingView" />
+<datepicker v-model="example3" :starting-view="startingView" />

docs/index.md

@@ -60,6 +60,7 @@ More in-depth documentation of the props, as well as examples, can be found in [
 |---|---|---|---|
 |`upperLimit`|`Date`||Upper limit for available dates for picking|
 |`lowerLimit`|`Date`||Lower limit for available dates for picking|
+|`disabledDates`|`{ dates: Date[] }`||Dates not available for picking|
 |`startingView`| `'day' | 'month' | 'year'` | `'day'` |View on which the date picker should open. Can be either `year`, `month`, or `day` |
 | `monthHeadingFormat` | `String` | `LLLL yyyy` | `date-fns`-type formatting for a month view heading
 | `weekdayFormat` | `String` | `EE` | `date-fns`-type formatting for a line of weekdays on day view
@@ -69,4 +70,4 @@ More in-depth documentation of the props, as well as examples, can be found in [
 
 ## Styling
 
-Styling is done via CSS variables, which control colors used in the popup. All variables, as well as styling example and playground can be found in [Configuration section](/config#styling-example-and-playground)
+Styling is done via CSS variables, which control colors used in the popup. All variables, as well as styling example and playground can be found in [Configuration section](/config#styling-example-and-playground)