From 5ab06a8931170622ae75e22aeb5f5064b06216f3 Mon Sep 17 00:00:00 2001
From: Jasenko Karovic <karovicm995@gmail.com>
Date: Sat, 9 Apr 2022 21:44:21 +0200
Subject: [PATCH] chore: Update documentation

---
 docs/404.html                                 |  10 +-
 docs/api/components/index.html                |  14 +-
 docs/api/events/index.html                    | 274 +++++++++++++++++-
 docs/api/methods/index.html                   |  35 ++-
 docs/api/props/index.html                     | 260 +++++++++++------
 docs/api/slots/index.html                     |  54 ++--
 docs/assets/404.cadb687d.js                   |   1 -
 docs/assets/404.fcd2b20d.js                   |   1 +
 docs/assets/404.html.bee13de6.js              |   1 -
 docs/assets/404.html.e8e82ae7.js              |   1 +
 docs/assets/ActionRowCmp.c89aff1b.js          |   1 +
 docs/assets/ActionRowCmp.e7f86045.js          |   1 -
 docs/assets/ChevronLeftIcon.ccfcd0b6.js       |   1 +
 docs/assets/ChevronLeftIcon.ce5da71b.js       |   1 -
 docs/assets/ChevronRightIcon.ca308293.js      |   1 -
 docs/assets/ChevronRightIcon.d8c47dcc.js      |   1 +
 docs/assets/CustomComponentsDemo.6ffe54b1.js  |   1 -
 docs/assets/CustomComponentsDemo.f24f5159.js  |   1 +
 docs/assets/DarkDemo.978c50ac.js              |   1 -
 docs/assets/DarkDemo.ff1cd9e5.js              |   1 +
 docs/assets/Demo.b00e7c96.js                  |   1 -
 docs/assets/Demo.ff9daba9.js                  |   1 +
 docs/assets/DemoMarkers.a0dd891d.js           |   1 -
 docs/assets/DemoMarkers.a7c0bac9.js           |   1 +
 docs/assets/DemoSlots.3a91cfc5.js             |   1 -
 docs/assets/DemoSlots.994a1a00.js             |   1 +
 docs/assets/DisabledDatesDemo.19da2ab4.js     |   1 -
 docs/assets/DisabledDatesDemo.b0dc77ec.js     |   1 +
 docs/assets/EmptyDemo.3ce9ae38.js             |   1 +
 docs/assets/EmptyDemo.405dd01b.js             |   1 -
 docs/assets/FiltersDemo.343240a4.js           |   1 -
 docs/assets/FiltersDemo.ab03492c.js           |   1 +
 docs/assets/FormatDemo.ab6ffbb0.js            |   1 -
 docs/assets/FormatDemo.c36ba3a2.js            |   1 +
 docs/assets/Layout.30deb01a.js                |   1 -
 docs/assets/Layout.397f0655.js                |   1 +
 docs/assets/LocalizedOutput.518408aa.js       |   1 +
 docs/assets/LocalizedOutput.a49834bc.js       |   1 -
 docs/assets/MinMaxDemo.0c419d16.js            |   1 -
 docs/assets/MinMaxDemo.32364bfe.js            |   1 +
 docs/assets/MonthYearCmp.03a1bd41.js          |   1 +
 docs/assets/MonthYearCmp.eb12c806.js          |   1 -
 docs/assets/PresetRange.38ff6d1d.js           |   1 -
 docs/assets/PresetRange.b207f627.js           |   1 +
 docs/assets/PreviewFormatDemo.711e0d27.js     |   1 -
 docs/assets/PreviewFormatDemo.b4be84be.js     |   1 +
 docs/assets/RequiredDemo.59726618.js          |   1 -
 docs/assets/RequiredDemo.b9086538.js          |   1 +
 docs/assets/TextInputDemo.5620e83c.js         |   1 -
 docs/assets/TextInputDemo.d8669300.js         |   1 +
 docs/assets/TimePickerCmp.212d1a54.js         |   1 -
 docs/assets/TimePickerCmp.48345a7c.js         |   1 +
 docs/assets/TimezoneDemo.5861241f.js          |   1 +
 docs/assets/TimezoneDemo.a5f28a5a.js          |   1 -
 docs/assets/app.46c9efaa.js                   |  20 ++
 docs/assets/app.519dac2e.js                   |  20 --
 .../{index.fb659316.js => index.e7c299e1.js}  |   2 +-
 docs/assets/index.html.055fb78f.js            | 265 +++++++++++++++++
 ...tml.53c86478.js => index.html.46debbc6.js} |   2 +-
 docs/assets/index.html.5ab90608.js            |   1 +
 ...tml.9ea49862.js => index.html.5c620bdc.js} |   2 +-
 docs/assets/index.html.6d23c620.js            |   1 +
 ...tml.1b6f9115.js => index.html.77270580.js} |   2 +-
 docs/assets/index.html.7d9f5387.js            |   1 -
 docs/assets/index.html.a6269bf4.js            |  26 ++
 ...tml.256dcdde.js => index.html.b1d7c8d2.js} |   2 +-
 docs/assets/index.html.b3eef111.js            |   1 -
 ...tml.6b18d5e2.js => index.html.b4665819.js} |   6 +-
 ...tml.7514c62a.js => index.html.bead136d.js} |   4 +-
 ...tml.b5876d91.js => index.html.c2cc26a6.js} |   4 +-
 ...tml.3a5189cb.js => index.html.ceb36e17.js} |   8 +-
 docs/assets/index.html.d713def1.js            |   1 -
 docs/assets/index.html.e796e241.js            |   1 -
 ...tml.ae7c0acf.js => index.html.f42a93ce.js} |  20 +-
 ...tml.4d000d1b.js => index.html.fb7d3767.js} | 240 +++++++++------
 .../plugin-vue_export-helper.21dcd24c.js      |   1 -
 ...{style.3b68b3c3.css => style.8c8e2d0d.css} |   2 +-
 docs/assets/vue-datepicker.es.9f3b8378.js     |   1 +
 docs/assets/vue-datepicker.es.e0a9f9bf.js     |   1 -
 docs/customization/scss/index.html            |   8 +-
 docs/customization/theming/index.html         |   8 +-
 docs/index.html                               |  10 +-
 docs/installation/index.html                  |  16 +-
 83 files changed, 1044 insertions(+), 327 deletions(-)
 delete mode 100644 docs/assets/404.cadb687d.js
 create mode 100644 docs/assets/404.fcd2b20d.js
 delete mode 100644 docs/assets/404.html.bee13de6.js
 create mode 100644 docs/assets/404.html.e8e82ae7.js
 create mode 100644 docs/assets/ActionRowCmp.c89aff1b.js
 delete mode 100644 docs/assets/ActionRowCmp.e7f86045.js
 create mode 100644 docs/assets/ChevronLeftIcon.ccfcd0b6.js
 delete mode 100644 docs/assets/ChevronLeftIcon.ce5da71b.js
 delete mode 100644 docs/assets/ChevronRightIcon.ca308293.js
 create mode 100644 docs/assets/ChevronRightIcon.d8c47dcc.js
 delete mode 100644 docs/assets/CustomComponentsDemo.6ffe54b1.js
 create mode 100644 docs/assets/CustomComponentsDemo.f24f5159.js
 delete mode 100644 docs/assets/DarkDemo.978c50ac.js
 create mode 100644 docs/assets/DarkDemo.ff1cd9e5.js
 delete mode 100644 docs/assets/Demo.b00e7c96.js
 create mode 100644 docs/assets/Demo.ff9daba9.js
 delete mode 100644 docs/assets/DemoMarkers.a0dd891d.js
 create mode 100644 docs/assets/DemoMarkers.a7c0bac9.js
 delete mode 100644 docs/assets/DemoSlots.3a91cfc5.js
 create mode 100644 docs/assets/DemoSlots.994a1a00.js
 delete mode 100644 docs/assets/DisabledDatesDemo.19da2ab4.js
 create mode 100644 docs/assets/DisabledDatesDemo.b0dc77ec.js
 create mode 100644 docs/assets/EmptyDemo.3ce9ae38.js
 delete mode 100644 docs/assets/EmptyDemo.405dd01b.js
 delete mode 100644 docs/assets/FiltersDemo.343240a4.js
 create mode 100644 docs/assets/FiltersDemo.ab03492c.js
 delete mode 100644 docs/assets/FormatDemo.ab6ffbb0.js
 create mode 100644 docs/assets/FormatDemo.c36ba3a2.js
 delete mode 100644 docs/assets/Layout.30deb01a.js
 create mode 100644 docs/assets/Layout.397f0655.js
 create mode 100644 docs/assets/LocalizedOutput.518408aa.js
 delete mode 100644 docs/assets/LocalizedOutput.a49834bc.js
 delete mode 100644 docs/assets/MinMaxDemo.0c419d16.js
 create mode 100644 docs/assets/MinMaxDemo.32364bfe.js
 create mode 100644 docs/assets/MonthYearCmp.03a1bd41.js
 delete mode 100644 docs/assets/MonthYearCmp.eb12c806.js
 delete mode 100644 docs/assets/PresetRange.38ff6d1d.js
 create mode 100644 docs/assets/PresetRange.b207f627.js
 delete mode 100644 docs/assets/PreviewFormatDemo.711e0d27.js
 create mode 100644 docs/assets/PreviewFormatDemo.b4be84be.js
 delete mode 100644 docs/assets/RequiredDemo.59726618.js
 create mode 100644 docs/assets/RequiredDemo.b9086538.js
 delete mode 100644 docs/assets/TextInputDemo.5620e83c.js
 create mode 100644 docs/assets/TextInputDemo.d8669300.js
 delete mode 100644 docs/assets/TimePickerCmp.212d1a54.js
 create mode 100644 docs/assets/TimePickerCmp.48345a7c.js
 create mode 100644 docs/assets/TimezoneDemo.5861241f.js
 delete mode 100644 docs/assets/TimezoneDemo.a5f28a5a.js
 create mode 100644 docs/assets/app.46c9efaa.js
 delete mode 100644 docs/assets/app.519dac2e.js
 rename docs/assets/{index.fb659316.js => index.e7c299e1.js} (98%)
 create mode 100644 docs/assets/index.html.055fb78f.js
 rename docs/assets/{index.html.53c86478.js => index.html.46debbc6.js} (86%)
 create mode 100644 docs/assets/index.html.5ab90608.js
 rename docs/assets/{index.html.9ea49862.js => index.html.5c620bdc.js} (91%)
 create mode 100644 docs/assets/index.html.6d23c620.js
 rename docs/assets/{index.html.1b6f9115.js => index.html.77270580.js} (86%)
 delete mode 100644 docs/assets/index.html.7d9f5387.js
 create mode 100644 docs/assets/index.html.a6269bf4.js
 rename docs/assets/{index.html.256dcdde.js => index.html.b1d7c8d2.js} (93%)
 delete mode 100644 docs/assets/index.html.b3eef111.js
 rename docs/assets/{index.html.6b18d5e2.js => index.html.b4665819.js} (96%)
 rename docs/assets/{index.html.7514c62a.js => index.html.bead136d.js} (93%)
 rename docs/assets/{index.html.b5876d91.js => index.html.c2cc26a6.js} (90%)
 rename docs/assets/{index.html.3a5189cb.js => index.html.ceb36e17.js} (96%)
 delete mode 100644 docs/assets/index.html.d713def1.js
 delete mode 100644 docs/assets/index.html.e796e241.js
 rename docs/assets/{index.html.ae7c0acf.js => index.html.f42a93ce.js} (98%)
 rename docs/assets/{index.html.4d000d1b.js => index.html.fb7d3767.js} (92%)
 delete mode 100644 docs/assets/plugin-vue_export-helper.21dcd24c.js
 rename docs/assets/{style.3b68b3c3.css => style.8c8e2d0d.css} (70%)
 create mode 100644 docs/assets/vue-datepicker.es.9f3b8378.js
 delete mode 100644 docs/assets/vue-datepicker.es.e0a9f9bf.js

diff --git a/docs/404.html b/docs/404.html
index 80a8e29ae..7c51c3517 100644
--- a/docs/404.html
+++ b/docs/404.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,11 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/404.html.f166316b.js"><link rel="modulepreload" href="/assets/404.html.bee13de6.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/404.html.f166316b.js"><link rel="modulepreload" href="/assets/404.html.e8e82ae7.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><div class="theme-default-content"><h1>404</h1><blockquote>There&#39;s nothing here.</blockquote><a href="/" class="">Take me home</a></div></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <div id="app"><!--[--><div class="theme-container"><div class="theme-default-content"><h1>404</h1><blockquote>That&#39;s a Four-Oh-Four.</blockquote><a href="/" class="">Take me home</a></div></div><!----><!--]--></div>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/api/components/index.html b/docs/api/components/index.html
index b59b2f329..f03119024 100644
--- a/docs/api/components/index.html
+++ b/docs/api/components/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,11 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Components | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.d53513ec.js"><link rel="modulepreload" href="/assets/index.html.3a5189cb.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.d53513ec.js"><link rel="modulepreload" href="/assets/index.html.ceb36e17.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/components/#monthyearcomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthYearComponent"><!--[--><!--]--> monthYearComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#timepickercomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="timePickerComponent"><!--[--><!--]--> timePickerComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#actionrowcomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="actionRowComponent"><!--[--><!--]--> actionRowComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#customprops" class="router-link-active router-link-exact-active sidebar-item" aria-label="customProps"><!--[--><!--]--> customProps <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="components" tabindex="-1"><a class="header-anchor" href="#components" aria-hidden="true">#</a> Components</h1><p>Customize the datepicker with your custom components</p><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong>Make sure to properly read the documentation and check the examples on how to pass and configure a custom component. Wrong implementation may result in errors</strong></p></div><div class="custom-container tip"><p class="custom-container-title">TIP</p><p><strong>You can use <code>css</code> variables inside custom components if you need to style for the theme</strong></p></div><h2 id="monthyearcomponent" tabindex="-1"><a class="header-anchor" href="#monthyearcomponent" aria-hidden="true">#</a> monthYearComponent</h2><p>Create and use a custom component in the header for month/year select</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>months</code>: <code>{ value: number; text: string }[]</code> -&gt; value: <code>0-11</code>, text: name of the month</li><li><code>years</code>: <code>{ value: number; text: string }[]</code> -&gt; generated array of years based on provided range, text and value are the same</li><li><code>filters</code>: <a href="/api/props/#filters" class="">filters prop</a></li><li><code>monthPicker</code>: <a href="/api/props/#monthpicker" class="">monthPicker prop</a></li><li><code>month</code>: <code>number</code> -&gt; This is the value of the selected month</li><li><code>year</code> : <code>number</code> -&gt; This is the value of the selected year</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>instance</code>: <code>number</code> -&gt; In case you are using <a href="/api/props/#multicalendars" class="">multiCalendars prop</a>, it will be 1 or 2</li><li><code>minDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">minDate prop</a></li><li><code>maxDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">maxDate prop</a></li></ul><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the month and the year value make sure to <code>emit</code> the following:</p><ul><li>Month <ul><li>Event: <code>update:month</code></li><li>Value: <code>number</code></li></ul></li><li>Year <ul><li>Event: <code>update:year</code></li><li>Value: <code>number</code></li></ul></li><li>Handler event <ul><li>Event: <code>updateMonthYear</code></li><li>Value: <code>boolean</code> (only when updating year)</li></ul></li></ul></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">MonthYearCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/components/#monthyearcomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthYearComponent"><!--[--><!--]--> monthYearComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#timepickercomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="timePickerComponent"><!--[--><!--]--> timePickerComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#actionrowcomponent" class="router-link-active router-link-exact-active sidebar-item" aria-label="actionRowComponent"><!--[--><!--]--> actionRowComponent <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/components/#customprops" class="router-link-active router-link-exact-active sidebar-item" aria-label="customProps"><!--[--><!--]--> customProps <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="components" tabindex="-1"><a class="header-anchor" href="#components" aria-hidden="true">#</a> Components</h1><p>Customize the datepicker with your custom components</p><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong>Make sure to properly read the documentation and check the examples on how to pass and configure a custom component. Wrong implementation may result in errors</strong></p></div><div class="custom-container tip"><p class="custom-container-title">TIP</p><p><strong>You can use <code>css</code> variables inside custom components if you need to style for the theme</strong></p></div><h2 id="monthyearcomponent" tabindex="-1"><a class="header-anchor" href="#monthyearcomponent" aria-hidden="true">#</a> monthYearComponent</h2><p>Create and use a custom component in the header for month/year select</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>months</code>: <code>{ value: number; text: string }[]</code> -&gt; value: <code>0-11</code>, text: name of the month</li><li><code>years</code>: <code>{ value: number; text: string }[]</code> -&gt; generated array of years based on provided range, text and value are the same</li><li><code>filters</code>: <a href="/api/props/#filters" class="">filters prop</a></li><li><code>monthPicker</code>: <a href="/api/props/#monthpicker" class="">monthPicker prop</a></li><li><code>month</code>: <code>number</code> -&gt; This is the value of the selected month</li><li><code>year</code> : <code>number</code> -&gt; This is the value of the selected year</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>instance</code>: <code>number</code> -&gt; In case you are using <a href="/api/props/#multicalendars" class="">multiCalendars prop</a>, it will be 1 or 2</li><li><code>minDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">minDate prop</a></li><li><code>maxDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">maxDate prop</a></li></ul><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the month and the year value make sure to <code>emit</code> the following:</p><ul><li>Month <ul><li>Event: <code>update:month</code></li><li>Value: <code>number</code></li></ul></li><li>Year <ul><li>Event: <code>update:year</code></li><li>Value: <code>number</code></li></ul></li><li>Handler event <ul><li>Event: <code>updateMonthYear</code></li><li>Value: <code>boolean</code> (only when updating year)</li></ul></li></ul></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">MonthYearCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:month-year-component</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>monthYear<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -185,7 +185,7 @@
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br><span class="line-number">84</span><br><span class="line-number">85</span><br><span class="line-number">86</span><br><span class="line-number">87</span><br><span class="line-number">88</span><br><span class="line-number">89</span><br><span class="line-number">90</span><br><span class="line-number">91</span><br><span class="line-number">92</span><br><span class="line-number">93</span><br><span class="line-number">94</span><br><span class="line-number">95</span><br><span class="line-number">96</span><br><span class="line-number">97</span><br><span class="line-number">98</span><br><span class="line-number">99</span><br><span class="line-number">100</span><br><span class="line-number">101</span><br><span class="line-number">102</span><br><span class="line-number">103</span><br><span class="line-number">104</span><br><span class="line-number">105</span><br><span class="line-number">106</span><br><span class="line-number">107</span><br><span class="line-number">108</span><br><span class="line-number">109</span><br><span class="line-number">110</span><br><span class="line-number">111</span><br><span class="line-number">112</span><br><span class="line-number">113</span><br><span class="line-number">114</span><br><span class="line-number">115</span><br><span class="line-number">116</span><br><span class="line-number">117</span><br><span class="line-number">118</span><br><span class="line-number">119</span><br><span class="line-number">120</span><br><span class="line-number">121</span><br><span class="line-number">122</span><br><span class="line-number">123</span><br><span class="line-number">124</span><br><span class="line-number">125</span><br><span class="line-number">126</span><br><span class="line-number">127</span><br><span class="line-number">128</span><br><span class="line-number">129</span><br><span class="line-number">130</span><br><span class="line-number">131</span><br><span class="line-number">132</span><br><span class="line-number">133</span><br><span class="line-number">134</span><br></div></div><!--]--></div><!--]--></div></details><h2 id="timepickercomponent" tabindex="-1"><a class="header-anchor" href="#timepickercomponent" aria-hidden="true">#</a> timePickerComponent</h2><p>Create and use a custom component for the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>hoursIncrement</code>: <a href="/api/props/#hoursincrement" class="">hoursIncrement prop</a></li><li><code>minutesIncrement</code>: <a href="/api/props/#minutesincrement" class="">minutesIncrement prop</a></li><li><code>secondsIncrement</code>: <a href="/api/props/#secondsincrement" class="">minutesIncrement prop</a></li><li><code>is24</code>: <a href="/api/props/#is24" class="">is24 prop</a></li><li><code>hoursGridIncrement</code>: <a href="/api/props/#hoursgridincrement" class="">hoursGridIncrement prop</a></li><li><code>minutesGridIncrement</code>: <a href="/api/props/#minutesgridincrement" class="">minutesGridIncrement prop</a></li><li><code>secondsGridIncrement</code>: <a href="/api/props/#secondsgridincrement" class="">secondsGridIncrement prop</a></li><li><code>filters</code> : <a href="/api/props/#filters" class="">filters prop</a></li><li><code>timePicker</code>: <a href="/api/props/#timepicker" class="">timePicker prop</a></li><li><code>hours</code>: <code>number | [number, number]</code> -&gt; This is the hours value</li><li><code>minutes</code>: <code>number | [number, number]</code> -&gt; This is the minutes value</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>noHoursOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nohoursoverlay" class="">noHoursOverlay prop</a></li><li><code>noMinutesOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nominutesoverlay" class="">noMinutesOverlay prop</a></li><li><code>noSecondsOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nosecondsoverlay" class="">noSecondsOverlay prop</a></li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>enableSeconds</code>: <code>boolean</code> -&gt; <a href="/api/props/#enableseconds" class="">enableSeconds prop</a></li></ul><p><strong>Note:</strong> <code>hours</code> and <code>minutes</code> values will be arrays if range picker mode is active.</p><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the hours and the minutes values make sure to <code>emit</code> the following:</p><ul><li>Hours <ul><li>Event: <code>update:hours</code></li><li>Value: <code>number | [number, number]</code></li></ul></li><li>Minutes <ul><li>Event: <code>update:minutes</code></li><li>Value: <code>number | [number, number]</code></li></ul></li></ul><p><strong>Note:</strong> Keep in mind that when you are using the range picker, both values for the time must be emitted. For example if you want to update the second date hours, you will <code>emit</code> something like this <code>emit(&#39;update:hours&#39;, [firstValueSaved, newSecondValue])</code></p></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">TimePickerCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br><span class="line-number">84</span><br><span class="line-number">85</span><br><span class="line-number">86</span><br><span class="line-number">87</span><br><span class="line-number">88</span><br><span class="line-number">89</span><br><span class="line-number">90</span><br><span class="line-number">91</span><br><span class="line-number">92</span><br><span class="line-number">93</span><br><span class="line-number">94</span><br><span class="line-number">95</span><br><span class="line-number">96</span><br><span class="line-number">97</span><br><span class="line-number">98</span><br><span class="line-number">99</span><br><span class="line-number">100</span><br><span class="line-number">101</span><br><span class="line-number">102</span><br><span class="line-number">103</span><br><span class="line-number">104</span><br><span class="line-number">105</span><br><span class="line-number">106</span><br><span class="line-number">107</span><br><span class="line-number">108</span><br><span class="line-number">109</span><br><span class="line-number">110</span><br><span class="line-number">111</span><br><span class="line-number">112</span><br><span class="line-number">113</span><br><span class="line-number">114</span><br><span class="line-number">115</span><br><span class="line-number">116</span><br><span class="line-number">117</span><br><span class="line-number">118</span><br><span class="line-number">119</span><br><span class="line-number">120</span><br><span class="line-number">121</span><br><span class="line-number">122</span><br><span class="line-number">123</span><br><span class="line-number">124</span><br><span class="line-number">125</span><br><span class="line-number">126</span><br><span class="line-number">127</span><br><span class="line-number">128</span><br><span class="line-number">129</span><br><span class="line-number">130</span><br><span class="line-number">131</span><br><span class="line-number">132</span><br><span class="line-number">133</span><br><span class="line-number">134</span><br></div></div><!--]--></div><!--]--></div></details><h2 id="timepickercomponent" tabindex="-1"><a class="header-anchor" href="#timepickercomponent" aria-hidden="true">#</a> timePickerComponent</h2><p>Create and use a custom component for the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>hoursIncrement</code>: <a href="/api/props/#hoursincrement" class="">hoursIncrement prop</a></li><li><code>minutesIncrement</code>: <a href="/api/props/#minutesincrement" class="">minutesIncrement prop</a></li><li><code>secondsIncrement</code>: <a href="/api/props/#secondsincrement" class="">minutesIncrement prop</a></li><li><code>is24</code>: <a href="/api/props/#is24" class="">is24 prop</a></li><li><code>hoursGridIncrement</code>: <a href="/api/props/#hoursgridincrement" class="">hoursGridIncrement prop</a></li><li><code>minutesGridIncrement</code>: <a href="/api/props/#minutesgridincrement" class="">minutesGridIncrement prop</a></li><li><code>secondsGridIncrement</code>: <a href="/api/props/#secondsgridincrement" class="">secondsGridIncrement prop</a></li><li><code>filters</code> : <a href="/api/props/#filters" class="">filters prop</a></li><li><code>timePicker</code>: <a href="/api/props/#timepicker" class="">timePicker prop</a></li><li><code>hours</code>: <code>number | [number, number]</code> -&gt; This is the hours value</li><li><code>minutes</code>: <code>number | [number, number]</code> -&gt; This is the minutes value</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>noHoursOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nohoursoverlay" class="">noHoursOverlay prop</a></li><li><code>noMinutesOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nominutesoverlay" class="">noMinutesOverlay prop</a></li><li><code>noSecondsOverlay</code>: <code>boolean</code> -&gt; <a href="/api/props/#nosecondsoverlay" class="">noSecondsOverlay prop</a></li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>enableSeconds</code>: <code>boolean</code> -&gt; <a href="/api/props/#enableseconds" class="">enableSeconds prop</a></li></ul><p><strong>Note:</strong> <code>hours</code> and <code>minutes</code> values will be arrays if range picker mode is active.</p><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the hours and the minutes values make sure to <code>emit</code> the following:</p><ul><li>Hours <ul><li>Event: <code>update:hours</code></li><li>Value: <code>number | [number, number]</code></li></ul></li><li>Minutes <ul><li>Event: <code>update:minutes</code></li><li>Value: <code>number | [number, number]</code></li></ul></li></ul><p><strong>Note:</strong> Keep in mind that when you are using the range picker, both values for the time must be emitted. For example if you want to update the second date hours, you will <code>emit</code> something like this <code>emit(&#39;update:hours&#39;, [firstValueSaved, newSecondValue])</code></p></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">TimePickerCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:time-picker-component</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>timePicker<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -295,7 +295,7 @@
         <span class="token property">outline</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br><span class="line-number">84</span><br><span class="line-number">85</span><br><span class="line-number">86</span><br></div></div><!--]--></div><!--]--></div></details><h2 id="actionrowcomponent" tabindex="-1"><a class="header-anchor" href="#actionrowcomponent" aria-hidden="true">#</a> actionRowComponent</h2><p>Create and use a custom component for action row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>selectText</code>: <a href="/api/props/#selecttext" class="">selectText prop</a></li><li><code>cancelText</code>: <a href="/api/props/#canceltext" class="">cancelText prop</a></li><li><code>internalModelValue</code>: <code>Date | [Date, Date]</code> -&gt; Internal value, will be array if range is active</li><li><code>range</code>: <a href="/api/props/#range" class="">range prop</a></li><li><code>previewFormat</code>: <a href="/api/props/#previewformat" class="">previewFormat prop</a></li><li><code>monthPicker</code> : <a href="/api/props/#monthpicker" class="">monthPicker prop</a></li><li><code>timePicker</code>: <a href="/api/props/#timepicker" class="">timePicker prop</a></li><li><code>multiCalendars</code>: <code>boolean</code> -&gt; <a href="/api/props/#multicalendars" class="">multiCalendars prop</a></li><li><code>calendarWidth</code>: <code>number</code> -&gt; Calendar width</li><li><code>menuMount</code>: <code>boolean</code> -&gt; True when the parent menu component is mounted</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>minDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">minDate prop</a></li><li><code>maxDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">maxDate prop</a></li><li><code>enableTimePicker</code>: <code>boolean</code> -&gt; <a href="/api/props/#enabletimepicker" class="">enableTimePicker prop</a></li><li><code>maxTime</code>: <code>{ hours: number | string; minutes: number |stirng; seconds: number | string }</code> -&gt; <a href="/api/props/#maxtime" class="">maxTime prop</a></li><li><code>minTime</code>: <code>{ hours: number | string; minutes: number |stirng; seconds: number | string }</code> -&gt; <a href="/api/props/#mintime" class="">minTime prop</a></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Two events are available from this component to <code>emit</code>:</p><ul><li><code>selectDate</code>: Selects the current selection</li><li><code>closePicker</code>: Closes the datepicker menu</li></ul></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">ActionRowCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br><span class="line-number">84</span><br><span class="line-number">85</span><br><span class="line-number">86</span><br></div></div><!--]--></div><!--]--></div></details><h2 id="actionrowcomponent" tabindex="-1"><a class="header-anchor" href="#actionrowcomponent" aria-hidden="true">#</a> actionRowComponent</h2><p>Create and use a custom component for action row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><p>The component will receive the following <code>props</code>:</p><ul><li><code>selectText</code>: <a href="/api/props/#selecttext" class="">selectText prop</a></li><li><code>cancelText</code>: <a href="/api/props/#canceltext" class="">cancelText prop</a></li><li><code>internalModelValue</code>: <code>Date | [Date, Date]</code> -&gt; Internal value, will be array if range is active</li><li><code>range</code>: <a href="/api/props/#range" class="">range prop</a></li><li><code>previewFormat</code>: <a href="/api/props/#previewformat" class="">previewFormat prop</a></li><li><code>monthPicker</code> : <a href="/api/props/#monthpicker" class="">monthPicker prop</a></li><li><code>timePicker</code>: <a href="/api/props/#timepicker" class="">timePicker prop</a></li><li><code>multiCalendars</code>: <code>boolean</code> -&gt; <a href="/api/props/#multicalendars" class="">multiCalendars prop</a></li><li><code>calendarWidth</code>: <code>number</code> -&gt; Calendar width</li><li><code>menuMount</code>: <code>boolean</code> -&gt; True when the parent menu component is mounted</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li><li><code>minDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">minDate prop</a></li><li><code>maxDate</code>: <code>Date | string</code> -&gt; <a href="/api/props/#mindate" class="">maxDate prop</a></li><li><code>enableTimePicker</code>: <code>boolean</code> -&gt; <a href="/api/props/#enabletimepicker" class="">enableTimePicker prop</a></li><li><code>maxTime</code>: <code>{ hours: number | string; minutes: number |stirng; seconds: number | string }</code> -&gt; <a href="/api/props/#maxtime" class="">maxTime prop</a></li><li><code>minTime</code>: <code>{ hours: number | string; minutes: number |stirng; seconds: number | string }</code> -&gt; <a href="/api/props/#mintime" class="">minTime prop</a></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Two events are available from this component to <code>emit</code>:</p><ul><li><code>selectDate</code>: Selects the current selection</li><li><code>closePicker</code>: Closes the datepicker menu</li></ul></div><details class="custom-container details"><summary>Code Example</summary><div class="code-group"><div class="code-group__nav"><ul class="code-group__ul"><li class="code-group__li"><button class="code-group__nav-tab code-group__nav-tab-active" ariapressed="true" ariaexpanded="true">Parent Component</button></li><li class="code-group__li"><button class="code-group__nav-tab" ariapressed="false" ariaexpanded="false">ActionRowCustom</button></li></ul></div><!--[--><div class="code-group-item code-group-item__active" aria-selected="true"><!--[--><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:action-row-component</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>actionRow<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -411,6 +411,6 @@
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/slots/" class="" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a></span><span class="next"><a href="/api/events/" class="" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/api/events/index.html b/docs/api/events/index.html
index 9bae363de..42e0b2df7 100644
--- a/docs/api/events/index.html
+++ b/docs/api/events/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,275 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Events | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.256dcdde.js"><link rel="modulepreload" href="/assets/index.html.b3eef111.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.b1d7c8d2.js"><link rel="modulepreload" href="/assets/index.html.055fb78f.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/events/#update-modelvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="@update:modelValue"><!--[--><!--]--> @update:modelValue <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#textsubmit" class="router-link-active router-link-exact-active sidebar-item" aria-label="@textSubmit"><!--[--><!--]--> @textSubmit <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#open" class="router-link-active router-link-exact-active sidebar-item" aria-label="@open"><!--[--><!--]--> @open <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#closed" class="router-link-active router-link-exact-active sidebar-item" aria-label="@closed"><!--[--><!--]--> @closed <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#cleared" class="router-link-active router-link-exact-active sidebar-item" aria-label="@cleared"><!--[--><!--]--> @cleared <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#focus" class="router-link-active router-link-exact-active sidebar-item" aria-label="@focus"><!--[--><!--]--> @focus <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#blur" class="router-link-active router-link-exact-active sidebar-item" aria-label="@blur"><!--[--><!--]--> @blur <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#internalmodelchange" class="router-link-active router-link-exact-active sidebar-item" aria-label="@internalModelChange"><!--[--><!--]--> @internalModelChange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#recalculateposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="@recalculatePosition"><!--[--><!--]--> @recalculatePosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#flowstep" class="router-link-active router-link-exact-active sidebar-item" aria-label="@flowStep"><!--[--><!--]--> @flowStep <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#updatemonthyear" class="router-link-active router-link-exact-active sidebar-item" aria-label="@updateMonthYear"><!--[--><!--]--> @updateMonthYear <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="events" tabindex="-1"><a class="header-anchor" href="#events" aria-hidden="true">#</a> Events</h1><p>List of available events that are emitted on some action</p><h2 id="update-modelvalue" tabindex="-1"><a class="header-anchor" href="#update-modelvalue" aria-hidden="true">#</a> @update:modelValue</h2><p>This event is emitted when the value is selected. This is a <code>v-model</code> binding event</p><h2 id="textsubmit" tabindex="-1"><a class="header-anchor" href="#textsubmit" aria-hidden="true">#</a> @textSubmit</h2><p>When <a href="/api/props/#textinput" class="">textInput</a> prop is set to <code>true</code> and <code>enterSubmit</code> is set to <code>true</code> in <a href="/api/props/#textinputoptions" class="">textInputOptions</a>, when enter button is pressed, this event will be emitted</p><h2 id="open" tabindex="-1"><a class="header-anchor" href="#open" aria-hidden="true">#</a> @open</h2><p>Emitted when the datepicker menu is opened</p><h2 id="closed" tabindex="-1"><a class="header-anchor" href="#closed" aria-hidden="true">#</a> @closed</h2><p>Emitted when the datepicker menu is closed</p><h2 id="cleared" tabindex="-1"><a class="header-anchor" href="#cleared" aria-hidden="true">#</a> @cleared</h2><p>Emitted when the value is cleared on clear button</p><h2 id="focus" tabindex="-1"><a class="header-anchor" href="#focus" aria-hidden="true">#</a> @focus</h2><p>Emitted when the datepicker menu is open</p><h2 id="blur" tabindex="-1"><a class="header-anchor" href="#blur" aria-hidden="true">#</a> @blur</h2><p>Emitted when the datepicker menu is closed</p><h2 id="internalmodelchange" tabindex="-1"><a class="header-anchor" href="#internalmodelchange" aria-hidden="true">#</a> @internalModelChange</h2><p>Emitted when the internal <code>modelValue</code> is changed before selecting this date that will be set to <code>v-model</code></p><h2 id="recalculateposition" tabindex="-1"><a class="header-anchor" href="#recalculateposition" aria-hidden="true">#</a> @recalculatePosition</h2><p>Emitted when the menu position is recalculated</p><h2 id="flowstep" tabindex="-1"><a class="header-anchor" href="#flowstep" aria-hidden="true">#</a> @flowStep</h2><p>Emitted when the flow step is triggered</p><p>Will have one param</p><ul><li><code>step</code>: Executed flow step</li></ul><h2 id="updatemonthyear" tabindex="-1"><a class="header-anchor" href="#updatemonthyear" aria-hidden="true">#</a> @updateMonthYear</h2><p>Emitted when the month or year is changed</p><p>Will have one param</p><ul><li><code>{ instance: number, value: number, isMonth: boolean }</code>: The received parameter is an object containing <code>instance</code> (in case of multiple calendars), <code>value</code> is selected value, and <code>isMonth</code> indicating if it is month or year</li></ul><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/components/" class="" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a></span><span class="next"><a href="/api/methods/" class="" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/events/#update-modelvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="@update:modelValue"><!--[--><!--]--> @update:modelValue <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#textsubmit" class="router-link-active router-link-exact-active sidebar-item" aria-label="@textSubmit"><!--[--><!--]--> @textSubmit <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#open" class="router-link-active router-link-exact-active sidebar-item" aria-label="@open"><!--[--><!--]--> @open <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#closed" class="router-link-active router-link-exact-active sidebar-item" aria-label="@closed"><!--[--><!--]--> @closed <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#cleared" class="router-link-active router-link-exact-active sidebar-item" aria-label="@cleared"><!--[--><!--]--> @cleared <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#focus" class="router-link-active router-link-exact-active sidebar-item" aria-label="@focus"><!--[--><!--]--> @focus <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#blur" class="router-link-active router-link-exact-active sidebar-item" aria-label="@blur"><!--[--><!--]--> @blur <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#internalmodelchange" class="router-link-active router-link-exact-active sidebar-item" aria-label="@internalModelChange"><!--[--><!--]--> @internalModelChange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#recalculateposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="@recalculatePosition"><!--[--><!--]--> @recalculatePosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#flowstep" class="router-link-active router-link-exact-active sidebar-item" aria-label="@flowStep"><!--[--><!--]--> @flowStep <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/events/#updatemonthyear" class="router-link-active router-link-exact-active sidebar-item" aria-label="@updateMonthYear"><!--[--><!--]--> @updateMonthYear <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="events" tabindex="-1"><a class="header-anchor" href="#events" aria-hidden="true">#</a> Events</h1><p>List of available events that are emitted on some action</p><h2 id="update-modelvalue" tabindex="-1"><a class="header-anchor" href="#update-modelvalue" aria-hidden="true">#</a> @update:modelValue</h2><p>This event is emitted when the value is selected. This is a <code>v-model</code> binding event</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">:value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name"><span class="token namespace">@update:</span>modelValue</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleDate<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token comment">// Make sure to check modelData type here https://vue3datepicker.com/api/props/#modelvalue</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleDate</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">modelData</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">.</span>value <span class="token operator">=</span> modelData<span class="token punctuation">;</span>
+          <span class="token comment">// do something else with the data</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleDate<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h2 id="textsubmit" tabindex="-1"><a class="header-anchor" href="#textsubmit" aria-hidden="true">#</a> @textSubmit</h2><p>When <a href="/api/props/#textinput" class="">textInput</a> prop is set to <code>true</code> and <code>enterSubmit</code> is set to <code>true</code> in <a href="/api/props/#textinputoptions" class="">textInputOptions</a>, when enter button is pressed, this event will be emitted</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">textInput</span> <span class="token attr-name">@textSubmit</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertDate<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertDate</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span>date<span class="token punctuation">.</span>value<span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertDate<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="open" tabindex="-1"><a class="header-anchor" href="#open" aria-hidden="true">#</a> @open</h2><p>Emitted when the datepicker menu is opened</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@open</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Menu open&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="closed" tabindex="-1"><a class="header-anchor" href="#closed" aria-hidden="true">#</a> @closed</h2><p>Emitted when the datepicker menu is closed</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@closed</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Menu closed&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="cleared" tabindex="-1"><a class="header-anchor" href="#cleared" aria-hidden="true">#</a> @cleared</h2><p>Emitted when the value is cleared on clear button</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@cleared</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Value cleared&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><code>@focus</code> and <code>@blur</code> events are not native events. Those events are handled internally in the component in order to handle proper focusing</p></div><h2 id="focus" tabindex="-1"><a class="header-anchor" href="#focus" aria-hidden="true">#</a> @focus</h2><p>Emitted when the datepicker menu is open</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@focus</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Input focus&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="blur" tabindex="-1"><a class="header-anchor" href="#blur" aria-hidden="true">#</a> @blur</h2><p>Emitted when the datepicker menu is closed</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@blur</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Input unfocused&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="internalmodelchange" tabindex="-1"><a class="header-anchor" href="#internalmodelchange" aria-hidden="true">#</a> @internalModelChange</h2><p>Emitted when the internal <code>modelValue</code> is changed before selecting this date that will be set to <code>v-model</code></p><p>Will have one param</p><ul><li><code>Date | Date[]</code>: Current state of the internal <code>modelValue</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@internalModelChange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleInternal<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+      <span class="token doc-comment comment">/**
+       * If you don&#39;t use `autoApply` prop
+       * with this event you can always get the current selection in the component
+       * 
+       * Note: Value will always be date object 
+       * or array of date objects if you use `multiDates` or `range`
+       * unlike v-model binding
+       */</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleInternal</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">date</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">Current selection - </span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>date<span class="token interpolation-punctuation punctuation">}</span></span><span class="token template-punctuation string">`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleInternal<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h2 id="recalculateposition" tabindex="-1"><a class="header-anchor" href="#recalculateposition" aria-hidden="true">#</a> @recalculatePosition</h2><p>Emitted when the menu position is recalculated</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@recalculatePosition</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Position recalculated&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="flowstep" tabindex="-1"><a class="header-anchor" href="#flowstep" aria-hidden="true">#</a> @flowStep</h2><p>Emitted when the flow step is triggered</p><p>Will have one param</p><ul><li><code>number</code>: Executed flow step</li></ul><div class="custom-container tip"><p class="custom-container-title">Points to keep in mind</p><ul><li>Current logic will not emit an event on the first flow step</li><li>Flow step will keep emitting even tho there are no more steps and just keep incrementing</li></ul><p>Both of these will be handled in one of the upcoming releases</p></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:flow</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>flow<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@flowStep</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleFlowStep<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> flow <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">&#39;month&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;year&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;calendar&#39;</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">handleFlowStep</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">step</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>step <span class="token operator">===</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">Select year</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>step <span class="token operator">===</span> <span class="token number">2</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Select date&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          flow<span class="token punctuation">,</span>
+          handleFlowStep<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h2 id="updatemonthyear" tabindex="-1"><a class="header-anchor" href="#updatemonthyear" aria-hidden="true">#</a> @updateMonthYear</h2><p>Emitted when the month or year is changed</p><p>Will have one param</p><ul><li><code>{ instance: number, value: number, isMonth: boolean }</code>: The received parameter is an object containing <code>instance</code> (in case of multiple calendars), <code>value</code> is selected value, and <code>isMonth</code> indicating if it is month or year</li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@updateMonthYear</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleMonthYear<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token comment">// For multiCalendars, instance will be the index of the calendar where the value is changed</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleMonthYear</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> instance<span class="token punctuation">,</span> value<span class="token punctuation">,</span> isMonth <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>value <span class="token operator">===</span> <span class="token number">0</span> <span class="token operator">&amp;&amp;</span> isMonth<span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Selected January&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleMonthYear<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/components/" class="" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a></span><span class="next"><a href="/api/methods/" class="" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/api/methods/index.html b/docs/api/methods/index.html
index 747912e9e..6483d59e0 100644
--- a/docs/api/methods/index.html
+++ b/docs/api/methods/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,36 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Methods | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.1b6f9115.js"><link rel="modulepreload" href="/assets/index.html.7d9f5387.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.77270580.js"><link rel="modulepreload" href="/assets/index.html.a6269bf4.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/methods/#selectdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="selectDate"><!--[--><!--]--> selectDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#closemenu" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeMenu"><!--[--><!--]--> closeMenu <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#openmenu" class="router-link-active router-link-exact-active sidebar-item" aria-label="openMenu"><!--[--><!--]--> openMenu <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#clearvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="clearValue"><!--[--><!--]--> clearValue <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="methods" tabindex="-1"><a class="header-anchor" href="#methods" aria-hidden="true">#</a> Methods</h1><p>List of available methods that you can call on the datepicker from the external code</p><p>Add a <code>ref</code> to the component, and call the method on that ref</p><h2 id="selectdate" tabindex="-1"><a class="header-anchor" href="#selectdate" aria-hidden="true">#</a> selectDate</h2><p>When called and there is an active selection, it will select that date.</p><h2 id="closemenu" tabindex="-1"><a class="header-anchor" href="#closemenu" aria-hidden="true">#</a> closeMenu</h2><p>Closes the datepicker menu</p><h2 id="openmenu" tabindex="-1"><a class="header-anchor" href="#openmenu" aria-hidden="true">#</a> openMenu</h2><p>Opens the datepicker menu</p><h2 id="clearvalue" tabindex="-1"><a class="header-anchor" href="#clearvalue" aria-hidden="true">#</a> clearValue</h2><p>Clears the selected value</p><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/events/" class="" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a></span><!----></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/methods/#selectdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="selectDate"><!--[--><!--]--> selectDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#closemenu" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeMenu"><!--[--><!--]--> closeMenu <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#openmenu" class="router-link-active router-link-exact-active sidebar-item" aria-label="openMenu"><!--[--><!--]--> openMenu <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/methods/#clearvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="clearValue"><!--[--><!--]--> clearValue <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="methods" tabindex="-1"><a class="header-anchor" href="#methods" aria-hidden="true">#</a> Methods</h1><p>List of available methods that you can call on the datepicker from the external code</p><p>Add a <code>ref</code> to the component, and call the method on that ref</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>datepicker<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> datepicker <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">yourCustomMethod</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>datepicker<span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token comment">// Close the menu programmatically</span>
+            datepicker<span class="token punctuation">.</span>value<span class="token punctuation">.</span><span class="token function">closeMenu</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h2 id="selectdate" tabindex="-1"><a class="header-anchor" href="#selectdate" aria-hidden="true">#</a> selectDate</h2><p>When called and there is an active selection, it will select that date.</p><h2 id="closemenu" tabindex="-1"><a class="header-anchor" href="#closemenu" aria-hidden="true">#</a> closeMenu</h2><p>Closes the datepicker menu</p><h2 id="openmenu" tabindex="-1"><a class="header-anchor" href="#openmenu" aria-hidden="true">#</a> openMenu</h2><p>Opens the datepicker menu</p><h2 id="clearvalue" tabindex="-1"><a class="header-anchor" href="#clearvalue" aria-hidden="true">#</a> clearValue</h2><p>Clears the selected value</p><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/events/" class="" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a></span><!----></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/api/props/index.html b/docs/api/props/index.html
index c7144f294..902ba2e81 100644
--- a/docs/api/props/index.html
+++ b/docs/api/props/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,11 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Props | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.d713def1.js"><link rel="modulepreload" href="/assets/index.html.4d000d1b.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.6d23c620.js"><link rel="modulepreload" href="/assets/index.html.fb7d3767.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#modes" class="router-link-active router-link-exact-active sidebar-item" aria-label="Modes"><!--[--><!--]--> Modes <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#range" class="router-link-active router-link-exact-active sidebar-item" aria-label="range"><!--[--><!--]--> range <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autorange" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoRange"><!--[--><!--]--> autoRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multicalendars" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiCalendars"><!--[--><!--]--> multiCalendars <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthpicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthPicker"><!--[--><!--]--> monthPicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#timepicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="timePicker"><!--[--><!--]--> timePicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#textinput" class="router-link-active router-link-exact-active sidebar-item" aria-label="textInput"><!--[--><!--]--> textInput <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inline" class="router-link-active router-link-exact-active sidebar-item" aria-label="inline"><!--[--><!--]--> inline <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multidates" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiDates"><!--[--><!--]--> multiDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#flow" class="router-link-active router-link-exact-active sidebar-item" aria-label="flow"><!--[--><!--]--> flow <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#utc" class="router-link-active router-link-exact-active sidebar-item" aria-label="utc"><!--[--><!--]--> utc <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weekpicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekPicker"><!--[--><!--]--> weekPicker <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#modes-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Modes configuration"><!--[--><!--]--> Modes configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#partialrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="partialRange"><!--[--><!--]--> partialRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#presetranges" class="router-link-active router-link-exact-active sidebar-item" aria-label="presetRanges"><!--[--><!--]--> presetRanges <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="minRange"><!--[--><!--]--> minRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxRange"><!--[--><!--]--> maxRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#fixedstart" class="router-link-active router-link-exact-active sidebar-item" aria-label="fixedStart"><!--[--><!--]--> fixedStart <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#fixedend" class="router-link-active router-link-exact-active sidebar-item" aria-label="fixedEnd"><!--[--><!--]--> fixedEnd <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multicalendarssolo" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiCalendarsSolo"><!--[--><!--]--> multiCalendarsSolo <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#textinputoptions" class="router-link-active router-link-exact-active sidebar-item" aria-label="textInputOptions"><!--[--><!--]--> textInputOptions <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#modeheight" class="router-link-active router-link-exact-active sidebar-item" aria-label="modeHeight"><!--[--><!--]--> modeHeight <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inlinewithinput" class="router-link-active router-link-exact-active sidebar-item" aria-label="inlineWithInput"><!--[--><!--]--> inlineWithInput <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multidateslimit" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiDatesLimit"><!--[--><!--]--> multiDatesLimit <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#formatting" class="router-link-active router-link-exact-active sidebar-item" aria-label="Formatting"><!--[--><!--]--> Formatting <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#format" class="router-link-active router-link-exact-active sidebar-item" aria-label="format"><!--[--><!--]--> format <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#previewformat" class="router-link-active router-link-exact-active sidebar-item" aria-label="previewFormat"><!--[--><!--]--> previewFormat <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthnameformat" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthNameFormat"><!--[--><!--]--> monthNameFormat <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#localization" class="router-link-active router-link-exact-active sidebar-item" aria-label="Localization"><!--[--><!--]--> Localization <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#locale" class="router-link-active router-link-exact-active sidebar-item" aria-label="locale"><!--[--><!--]--> locale <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#formatlocale" class="router-link-active router-link-exact-active sidebar-item" aria-label="formatLocale"><!--[--><!--]--> formatLocale <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#selecttext" class="router-link-active router-link-exact-active sidebar-item" aria-label="selectText"><!--[--><!--]--> selectText <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#canceltext" class="router-link-active router-link-exact-active sidebar-item" aria-label="cancelText"><!--[--><!--]--> cancelText <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nowbuttonlabel" class="router-link-active router-link-exact-active sidebar-item" aria-label="nowButtonLabel"><!--[--><!--]--> nowButtonLabel <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weeknumname" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekNumName"><!--[--><!--]--> weekNumName <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#general-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="General configuration"><!--[--><!--]--> General configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#uid" class="router-link-active router-link-exact-active sidebar-item" aria-label="uid"><!--[--><!--]--> uid <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthchangeonscroll" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthChangeOnScroll"><!--[--><!--]--> monthChangeOnScroll <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#modelvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="modelValue"><!--[--><!--]--> modelValue <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#clearable" class="router-link-active router-link-exact-active sidebar-item" aria-label="clearable"><!--[--><!--]--> clearable <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#closeonscroll" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeOnScroll"><!--[--><!--]--> closeOnScroll <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autoapply" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoApply"><!--[--><!--]--> autoApply <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#placeholder" class="router-link-active router-link-exact-active sidebar-item" aria-label="placeholder"><!--[--><!--]--> placeholder <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#notoday" class="router-link-active router-link-exact-active sidebar-item" aria-label="noToday"><!--[--><!--]--> noToday <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#closeonautoapply" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeOnAutoApply"><!--[--><!--]--> closeOnAutoApply <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#markers" class="router-link-active router-link-exact-active sidebar-item" aria-label="markers"><!--[--><!--]--> markers <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#shownowbutton" class="router-link-active router-link-exact-active sidebar-item" aria-label="showNowButton"><!--[--><!--]--> showNowButton <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disabled" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabled"><!--[--><!--]--> disabled <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#readonly" class="router-link-active router-link-exact-active sidebar-item" aria-label="readonly"><!--[--><!--]--> readonly <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#required" class="router-link-active router-link-exact-active sidebar-item" aria-label="required"><!--[--><!--]--> required <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#name" class="router-link-active router-link-exact-active sidebar-item" aria-label="name"><!--[--><!--]--> name <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autocomplete" class="router-link-active router-link-exact-active sidebar-item" aria-label="autocomplete"><!--[--><!--]--> autocomplete <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#keepactionrow" class="router-link-active router-link-exact-active sidebar-item" aria-label="keepActionRow"><!--[--><!--]--> keepActionRow <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#calendar-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Calendar configuration"><!--[--><!--]--> Calendar configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#weeknumbers" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekNumbers"><!--[--><!--]--> weekNumbers <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hideoffsetdates" class="router-link-active router-link-exact-active sidebar-item" aria-label="hideOffsetDates"><!--[--><!--]--> hideOffsetDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#mindate" class="router-link-active router-link-exact-active sidebar-item" aria-label="minDate"><!--[--><!--]--> minDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxDate"><!--[--><!--]--> maxDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#preventminmaxnavigation" class="router-link-active router-link-exact-active sidebar-item" aria-label="preventMinMaxNavigation"><!--[--><!--]--> preventMinMaxNavigation <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#startdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="startDate"><!--[--><!--]--> startDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weekstart" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekStart"><!--[--><!--]--> weekStart <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#filters" class="router-link-active router-link-exact-active sidebar-item" aria-label="filters"><!--[--><!--]--> filters <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disablemonthyearselect" class="router-link-active router-link-exact-active sidebar-item" aria-label="disableMonthYearSelect"><!--[--><!--]--> disableMonthYearSelect <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#yearrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="yearRange"><!--[--><!--]--> yearRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#reverseyears" class="router-link-active router-link-exact-active sidebar-item" aria-label="reverseYears"><!--[--><!--]--> reverseYears <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#alloweddates" class="router-link-active router-link-exact-active sidebar-item" aria-label="allowedDates"><!--[--><!--]--> allowedDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disableddates" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabledDates"><!--[--><!--]--> disabledDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disabledweekdays" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabledWeekDays"><!--[--><!--]--> disabledWeekDays <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#time-picker-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Time picker configuration"><!--[--><!--]--> Time picker configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#enabletimepicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="enableTimePicker"><!--[--><!--]--> enableTimePicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#is24" class="router-link-active router-link-exact-active sidebar-item" aria-label="is24"><!--[--><!--]--> is24 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#enableseconds" class="router-link-active router-link-exact-active sidebar-item" aria-label="enableSeconds"><!--[--><!--]--> enableSeconds <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hoursincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="hoursIncrement"><!--[--><!--]--> hoursIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minutesincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutesIncrement"><!--[--><!--]--> minutesIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#secondsincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="secondsIncrement"><!--[--><!--]--> secondsIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hoursgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="hoursGridIncrement"><!--[--><!--]--> hoursGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minutesgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutesGridIncrement"><!--[--><!--]--> minutesGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#secondsgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="secondsGridIncrement"><!--[--><!--]--> secondsGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nohoursoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noHoursOverlay"><!--[--><!--]--> noHoursOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nominutesoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noMinutesOverlay"><!--[--><!--]--> noMinutesOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nosecondsoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noSecondsOverlay"><!--[--><!--]--> noSecondsOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#mintime" class="router-link-active router-link-exact-active sidebar-item" aria-label="minTime"><!--[--><!--]--> minTime <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxtime" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxTime"><!--[--><!--]--> maxTime <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#starttime" class="router-link-active router-link-exact-active sidebar-item" aria-label="startTime"><!--[--><!--]--> startTime <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#positioning" class="router-link-active router-link-exact-active sidebar-item" aria-label="Positioning"><!--[--><!--]--> Positioning <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#position" class="router-link-active router-link-exact-active sidebar-item" aria-label="position"><!--[--><!--]--> position <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autoposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoPosition"><!--[--><!--]--> autoPosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#altposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="altPosition"><!--[--><!--]--> altPosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#teleport" class="router-link-active router-link-exact-active sidebar-item" aria-label="teleport"><!--[--><!--]--> teleport <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#keyboard" class="router-link-active router-link-exact-active sidebar-item" aria-label="Keyboard"><!--[--><!--]--> Keyboard <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#openmenuonfocus" class="router-link-active router-link-exact-active sidebar-item" aria-label="openMenuOnFocus"><!--[--><!--]--> openMenuOnFocus <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#escclose" class="router-link-active router-link-exact-active sidebar-item" aria-label="escClose"><!--[--><!--]--> escClose <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#spaceconfirm" class="router-link-active router-link-exact-active sidebar-item" aria-label="spaceConfirm"><!--[--><!--]--> spaceConfirm <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthchangeonarrows" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthChangeOnArrows"><!--[--><!--]--> monthChangeOnArrows <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#look-and-feel" class="router-link-active router-link-exact-active sidebar-item" aria-label="Look and feel"><!--[--><!--]--> Look and feel <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#transitions" class="router-link-active router-link-exact-active sidebar-item" aria-label="transitions"><!--[--><!--]--> transitions <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#dark" class="router-link-active router-link-exact-active sidebar-item" aria-label="dark"><!--[--><!--]--> dark <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hideinputicon" class="router-link-active router-link-exact-active sidebar-item" aria-label="hideInputIcon"><!--[--><!--]--> hideInputIcon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#state" class="router-link-active router-link-exact-active sidebar-item" aria-label="state"><!--[--><!--]--> state <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inputclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="inputClassName"><!--[--><!--]--> inputClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#menuclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="menuClassName"><!--[--><!--]--> menuClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#calendarclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendarClassName"><!--[--><!--]--> calendarClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#calendarcellclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendarCellClassName"><!--[--><!--]--> calendarCellClassName <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="props" tabindex="-1"><a class="header-anchor" href="#props" aria-hidden="true">#</a> Props</h1><div style="text-align:center;" markdown="1"><div class="custom-container tip"><p class="custom-container-title">⚠️ Important ⚠️</p><p><strong>If you come from <a href="https://github.com/Vuepic/vue3-date-time-picker" target="_blank" rel="noopener noreferrer"><code>vue3-date-time-picker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>, the library is moved to the new repository with the new name: <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><code>@vuepic/vue-datepicker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>. If you haven&#39;t updated yet, please switch to the new package.</strong></p></div></div><p>List of available props</p><div class="custom-container tip"><p class="custom-container-title">Info</p><ul><li>When checking the examples, for <code>boolean</code> prop types, the example will show the behavior opposite of what is set for the default value</li><li>If you use the component in the browser <code>&lt;script&gt;</code> tag, make sure to pass multi-word props with <code>-</code>, for example, <code>is24</code> as <code>is-24</code> and so on</li></ul></div><h2 id="modes" tabindex="-1"><a class="header-anchor" href="#modes" aria-hidden="true">#</a> Modes</h2><p>Set the default mode for the datepicker</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Depending on the mode, <a href="#modelvalue"><code>v-model</code></a> might be different, so make sure to use the proper configuration</p></div><h3 id="range" tabindex="-1"><a class="header-anchor" href="#range" aria-hidden="true">#</a> range</h3><p>Range picker mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#modes" class="router-link-active router-link-exact-active sidebar-item" aria-label="Modes"><!--[--><!--]--> Modes <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#range" class="router-link-active router-link-exact-active sidebar-item" aria-label="range"><!--[--><!--]--> range <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autorange" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoRange"><!--[--><!--]--> autoRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multicalendars" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiCalendars"><!--[--><!--]--> multiCalendars <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthpicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthPicker"><!--[--><!--]--> monthPicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#timepicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="timePicker"><!--[--><!--]--> timePicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#textinput" class="router-link-active router-link-exact-active sidebar-item" aria-label="textInput"><!--[--><!--]--> textInput <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inline" class="router-link-active router-link-exact-active sidebar-item" aria-label="inline"><!--[--><!--]--> inline <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multidates" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiDates"><!--[--><!--]--> multiDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#flow" class="router-link-active router-link-exact-active sidebar-item" aria-label="flow"><!--[--><!--]--> flow <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#utc" class="router-link-active router-link-exact-active sidebar-item" aria-label="utc"><!--[--><!--]--> utc <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weekpicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekPicker"><!--[--><!--]--> weekPicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#vertical" class="router-link-active router-link-exact-active sidebar-item" aria-label="vertical"><!--[--><!--]--> vertical <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#modes-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Modes configuration"><!--[--><!--]--> Modes configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#partialrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="partialRange"><!--[--><!--]--> partialRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#presetranges" class="router-link-active router-link-exact-active sidebar-item" aria-label="presetRanges"><!--[--><!--]--> presetRanges <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="minRange"><!--[--><!--]--> minRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxRange"><!--[--><!--]--> maxRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#fixedstart" class="router-link-active router-link-exact-active sidebar-item" aria-label="fixedStart"><!--[--><!--]--> fixedStart <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#fixedend" class="router-link-active router-link-exact-active sidebar-item" aria-label="fixedEnd"><!--[--><!--]--> fixedEnd <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multicalendarssolo" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiCalendarsSolo"><!--[--><!--]--> multiCalendarsSolo <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#textinputoptions" class="router-link-active router-link-exact-active sidebar-item" aria-label="textInputOptions"><!--[--><!--]--> textInputOptions <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#modeheight" class="router-link-active router-link-exact-active sidebar-item" aria-label="modeHeight"><!--[--><!--]--> modeHeight <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inlinewithinput" class="router-link-active router-link-exact-active sidebar-item" aria-label="inlineWithInput"><!--[--><!--]--> inlineWithInput <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#multidateslimit" class="router-link-active router-link-exact-active sidebar-item" aria-label="multiDatesLimit"><!--[--><!--]--> multiDatesLimit <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#formatting" class="router-link-active router-link-exact-active sidebar-item" aria-label="Formatting"><!--[--><!--]--> Formatting <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#format" class="router-link-active router-link-exact-active sidebar-item" aria-label="format"><!--[--><!--]--> format <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#previewformat" class="router-link-active router-link-exact-active sidebar-item" aria-label="previewFormat"><!--[--><!--]--> previewFormat <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthnameformat" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthNameFormat"><!--[--><!--]--> monthNameFormat <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#localization" class="router-link-active router-link-exact-active sidebar-item" aria-label="Localization"><!--[--><!--]--> Localization <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#locale" class="router-link-active router-link-exact-active sidebar-item" aria-label="locale"><!--[--><!--]--> locale <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#formatlocale" class="router-link-active router-link-exact-active sidebar-item" aria-label="formatLocale"><!--[--><!--]--> formatLocale <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#selecttext" class="router-link-active router-link-exact-active sidebar-item" aria-label="selectText"><!--[--><!--]--> selectText <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#canceltext" class="router-link-active router-link-exact-active sidebar-item" aria-label="cancelText"><!--[--><!--]--> cancelText <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nowbuttonlabel" class="router-link-active router-link-exact-active sidebar-item" aria-label="nowButtonLabel"><!--[--><!--]--> nowButtonLabel <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weeknumname" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekNumName"><!--[--><!--]--> weekNumName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#arialabels" class="router-link-active router-link-exact-active sidebar-item" aria-label="ariaLabels"><!--[--><!--]--> ariaLabels <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#general-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="General configuration"><!--[--><!--]--> General configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#uid" class="router-link-active router-link-exact-active sidebar-item" aria-label="uid"><!--[--><!--]--> uid <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthchangeonscroll" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthChangeOnScroll"><!--[--><!--]--> monthChangeOnScroll <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#modelvalue" class="router-link-active router-link-exact-active sidebar-item" aria-label="modelValue"><!--[--><!--]--> modelValue <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#clearable" class="router-link-active router-link-exact-active sidebar-item" aria-label="clearable"><!--[--><!--]--> clearable <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#closeonscroll" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeOnScroll"><!--[--><!--]--> closeOnScroll <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autoapply" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoApply"><!--[--><!--]--> autoApply <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#placeholder" class="router-link-active router-link-exact-active sidebar-item" aria-label="placeholder"><!--[--><!--]--> placeholder <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#notoday" class="router-link-active router-link-exact-active sidebar-item" aria-label="noToday"><!--[--><!--]--> noToday <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#closeonautoapply" class="router-link-active router-link-exact-active sidebar-item" aria-label="closeOnAutoApply"><!--[--><!--]--> closeOnAutoApply <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#markers" class="router-link-active router-link-exact-active sidebar-item" aria-label="markers"><!--[--><!--]--> markers <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#shownowbutton" class="router-link-active router-link-exact-active sidebar-item" aria-label="showNowButton"><!--[--><!--]--> showNowButton <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disabled" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabled"><!--[--><!--]--> disabled <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#readonly" class="router-link-active router-link-exact-active sidebar-item" aria-label="readonly"><!--[--><!--]--> readonly <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#required" class="router-link-active router-link-exact-active sidebar-item" aria-label="required"><!--[--><!--]--> required <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#name" class="router-link-active router-link-exact-active sidebar-item" aria-label="name"><!--[--><!--]--> name <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autocomplete" class="router-link-active router-link-exact-active sidebar-item" aria-label="autocomplete"><!--[--><!--]--> autocomplete <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#keepactionrow" class="router-link-active router-link-exact-active sidebar-item" aria-label="keepActionRow"><!--[--><!--]--> keepActionRow <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#noswipe" class="router-link-active router-link-exact-active sidebar-item" aria-label="noSwipe"><!--[--><!--]--> noSwipe <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#calendar-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Calendar configuration"><!--[--><!--]--> Calendar configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#weeknumbers" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekNumbers"><!--[--><!--]--> weekNumbers <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hideoffsetdates" class="router-link-active router-link-exact-active sidebar-item" aria-label="hideOffsetDates"><!--[--><!--]--> hideOffsetDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#mindate" class="router-link-active router-link-exact-active sidebar-item" aria-label="minDate"><!--[--><!--]--> minDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxDate"><!--[--><!--]--> maxDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#preventminmaxnavigation" class="router-link-active router-link-exact-active sidebar-item" aria-label="preventMinMaxNavigation"><!--[--><!--]--> preventMinMaxNavigation <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#startdate" class="router-link-active router-link-exact-active sidebar-item" aria-label="startDate"><!--[--><!--]--> startDate <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#weekstart" class="router-link-active router-link-exact-active sidebar-item" aria-label="weekStart"><!--[--><!--]--> weekStart <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#filters" class="router-link-active router-link-exact-active sidebar-item" aria-label="filters"><!--[--><!--]--> filters <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disablemonthyearselect" class="router-link-active router-link-exact-active sidebar-item" aria-label="disableMonthYearSelect"><!--[--><!--]--> disableMonthYearSelect <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#yearrange" class="router-link-active router-link-exact-active sidebar-item" aria-label="yearRange"><!--[--><!--]--> yearRange <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#reverseyears" class="router-link-active router-link-exact-active sidebar-item" aria-label="reverseYears"><!--[--><!--]--> reverseYears <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#alloweddates" class="router-link-active router-link-exact-active sidebar-item" aria-label="allowedDates"><!--[--><!--]--> allowedDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disableddates" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabledDates"><!--[--><!--]--> disabledDates <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#disabledweekdays" class="router-link-active router-link-exact-active sidebar-item" aria-label="disabledWeekDays"><!--[--><!--]--> disabledWeekDays <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#time-picker-configuration" class="router-link-active router-link-exact-active sidebar-item" aria-label="Time picker configuration"><!--[--><!--]--> Time picker configuration <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#enabletimepicker" class="router-link-active router-link-exact-active sidebar-item" aria-label="enableTimePicker"><!--[--><!--]--> enableTimePicker <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#is24" class="router-link-active router-link-exact-active sidebar-item" aria-label="is24"><!--[--><!--]--> is24 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#enableseconds" class="router-link-active router-link-exact-active sidebar-item" aria-label="enableSeconds"><!--[--><!--]--> enableSeconds <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hoursincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="hoursIncrement"><!--[--><!--]--> hoursIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minutesincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutesIncrement"><!--[--><!--]--> minutesIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#secondsincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="secondsIncrement"><!--[--><!--]--> secondsIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hoursgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="hoursGridIncrement"><!--[--><!--]--> hoursGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#minutesgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutesGridIncrement"><!--[--><!--]--> minutesGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#secondsgridincrement" class="router-link-active router-link-exact-active sidebar-item" aria-label="secondsGridIncrement"><!--[--><!--]--> secondsGridIncrement <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nohoursoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noHoursOverlay"><!--[--><!--]--> noHoursOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nominutesoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noMinutesOverlay"><!--[--><!--]--> noMinutesOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#nosecondsoverlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="noSecondsOverlay"><!--[--><!--]--> noSecondsOverlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#mintime" class="router-link-active router-link-exact-active sidebar-item" aria-label="minTime"><!--[--><!--]--> minTime <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#maxtime" class="router-link-active router-link-exact-active sidebar-item" aria-label="maxTime"><!--[--><!--]--> maxTime <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#starttime" class="router-link-active router-link-exact-active sidebar-item" aria-label="startTime"><!--[--><!--]--> startTime <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#positioning" class="router-link-active router-link-exact-active sidebar-item" aria-label="Positioning"><!--[--><!--]--> Positioning <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#position" class="router-link-active router-link-exact-active sidebar-item" aria-label="position"><!--[--><!--]--> position <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#autoposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="autoPosition"><!--[--><!--]--> autoPosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#altposition" class="router-link-active router-link-exact-active sidebar-item" aria-label="altPosition"><!--[--><!--]--> altPosition <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#teleport" class="router-link-active router-link-exact-active sidebar-item" aria-label="teleport"><!--[--><!--]--> teleport <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#keyboard" class="router-link-active router-link-exact-active sidebar-item" aria-label="Keyboard"><!--[--><!--]--> Keyboard <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#openmenuonfocus" class="router-link-active router-link-exact-active sidebar-item" aria-label="openMenuOnFocus"><!--[--><!--]--> openMenuOnFocus <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#escclose" class="router-link-active router-link-exact-active sidebar-item" aria-label="escClose"><!--[--><!--]--> escClose <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#spaceconfirm" class="router-link-active router-link-exact-active sidebar-item" aria-label="spaceConfirm"><!--[--><!--]--> spaceConfirm <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#monthchangeonarrows" class="router-link-active router-link-exact-active sidebar-item" aria-label="monthChangeOnArrows"><!--[--><!--]--> monthChangeOnArrows <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/props/#look-and-feel" class="router-link-active router-link-exact-active sidebar-item" aria-label="Look and feel"><!--[--><!--]--> Look and feel <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/props/#transitions" class="router-link-active router-link-exact-active sidebar-item" aria-label="transitions"><!--[--><!--]--> transitions <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#dark" class="router-link-active router-link-exact-active sidebar-item" aria-label="dark"><!--[--><!--]--> dark <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#hideinputicon" class="router-link-active router-link-exact-active sidebar-item" aria-label="hideInputIcon"><!--[--><!--]--> hideInputIcon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#state" class="router-link-active router-link-exact-active sidebar-item" aria-label="state"><!--[--><!--]--> state <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#inputclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="inputClassName"><!--[--><!--]--> inputClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#menuclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="menuClassName"><!--[--><!--]--> menuClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#calendarclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendarClassName"><!--[--><!--]--> calendarClassName <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/props/#calendarcellclassname" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendarCellClassName"><!--[--><!--]--> calendarCellClassName <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="props" tabindex="-1"><a class="header-anchor" href="#props" aria-hidden="true">#</a> Props</h1><div style="text-align:center;" markdown="1"><div class="custom-container tip"><p class="custom-container-title">⚠️ Important ⚠️</p><p><strong>If you come from <a href="https://github.com/Vuepic/vue3-date-time-picker" target="_blank" rel="noopener noreferrer"><code>vue3-date-time-picker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>, the library is moved to the new repository with the new name: <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><code>@vuepic/vue-datepicker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>. If you haven&#39;t updated yet, please switch to the new package.</strong></p></div></div><p>List of available props</p><div class="custom-container tip"><p class="custom-container-title">Info</p><ul><li>When checking the examples, for <code>boolean</code> prop types, the example will show the behavior opposite of what is set for the default value</li><li>If you use the component in the browser <code>&lt;script&gt;</code> tag, make sure to pass multi-word props with <code>-</code>, for example, <code>is24</code> as <code>is-24</code> and so on</li></ul></div><h2 id="modes" tabindex="-1"><a class="header-anchor" href="#modes" aria-hidden="true">#</a> Modes</h2><p>Set the default mode for the datepicker</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Depending on the mode, <a href="#modelvalue"><code>v-model</code></a> might be different, so make sure to use the proper configuration</p></div><h3 id="range" tabindex="-1"><a class="header-anchor" href="#range" aria-hidden="true">#</a> range</h3><p>Range picker mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -51,7 +51,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="autorange" tabindex="-1"><a class="header-anchor" href="#autorange" aria-hidden="true">#</a> autoRange</h3><p>Predefine range to select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="autorange" tabindex="-1"><a class="header-anchor" href="#autorange" aria-hidden="true">#</a> autoRange</h3><p>Predefine range to select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">auto-range</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -68,7 +68,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multicalendars" tabindex="-1"><a class="header-anchor" href="#multicalendars" aria-hidden="true">#</a> multiCalendars</h3><p>Enabling this prop will show multiple calendars side by side (on mobile devices, they will be in a column layout) for range picker. You can also pass a number to show more calendars. If you pass <code>true</code>, 2 calendars will be shown automatically.</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>boolean | number | string</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multicalendars" tabindex="-1"><a class="header-anchor" href="#multicalendars" aria-hidden="true">#</a> multiCalendars</h3><p>Enabling this prop will show multiple calendars side by side (on mobile devices, they will be in a column layout) for range picker. You can also pass a number to show more calendars. If you pass <code>true</code>, 2 calendars will be shown automatically.</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>boolean | number | string</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">multiCalendars</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -91,7 +91,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="monthpicker" tabindex="-1"><a class="header-anchor" href="#monthpicker" aria-hidden="true">#</a> monthPicker</h3><p>Change datepicker mode to select only month and year</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="monthpicker" tabindex="-1"><a class="header-anchor" href="#monthpicker" aria-hidden="true">#</a> monthPicker</h3><p>Change datepicker mode to select only month and year</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>month<span class="token punctuation">&quot;</span></span> <span class="token attr-name">monthPicker</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -111,7 +111,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="timepicker" tabindex="-1"><a class="header-anchor" href="#timepicker" aria-hidden="true">#</a> timePicker</h3><p>Change datepicker mode to select only time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="timepicker" tabindex="-1"><a class="header-anchor" href="#timepicker" aria-hidden="true">#</a> timePicker</h3><p>Change datepicker mode to select only time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>time<span class="token punctuation">&quot;</span></span> <span class="token attr-name">timePicker</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -131,7 +131,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="textinput" tabindex="-1"><a class="header-anchor" href="#textinput" aria-hidden="true">#</a> textInput</h3><p>When enabled, will try to parse the date from the user input. You can also adjust the default behavior by providing <a href="#textinputoptions">text input options</a></p><p>Text input works with all picker modes.</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><p><strong>Drawbacks:</strong></p><ul><li>Validation properties will not work in the text input</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" placeholder="Start Typing ..." value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="textinput" tabindex="-1"><a class="header-anchor" href="#textinput" aria-hidden="true">#</a> textInput</h3><p>When enabled, will try to parse the date from the user input. You can also adjust the default behavior by providing <a href="#textinputoptions">text input options</a></p><p>Text input works with all picker modes.</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><p><strong>Drawbacks:</strong></p><ul><li>Validation properties will not work in the text input</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" placeholder="Start Typing ..." value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Start Typing ...<span class="token punctuation">&quot;</span></span> <span class="token attr-name">textInput</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -165,7 +165,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidates" tabindex="-1"><a class="header-anchor" href="#multidates" aria-hidden="true">#</a> multiDates</h3><p>Allow selecting multiple single dates. When changing time, the latest selected date is affected. To deselect the date, click on the selected value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Multiple Dates" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidates" tabindex="-1"><a class="header-anchor" href="#multidates" aria-hidden="true">#</a> multiDates</h3><p>Allow selecting multiple single dates. When changing time, the latest selected date is affected. To deselect the date, click on the selected value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Multiple Dates" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">multiDates</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -182,7 +182,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="flow" tabindex="-1"><a class="header-anchor" href="#flow" aria-hidden="true">#</a> flow</h3><p>Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset</p><ul><li>Type: <code>(&#39;month&#39; | &#39;year&#39; | &#39;calendar&#39; | &#39;time&#39; | &#39;minutes&#39; | &#39;hours&#39; | &#39;seconds&#39;)[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Month &gt; Year &gt; Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="flow" tabindex="-1"><a class="header-anchor" href="#flow" aria-hidden="true">#</a> flow</h3><p>Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset</p><ul><li>Type: <code>(&#39;month&#39; | &#39;year&#39; | &#39;calendar&#39; | &#39;time&#39; | &#39;minutes&#39; | &#39;hours&#39; | &#39;seconds&#39;)[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Month &gt; Year &gt; Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:flow</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>flow<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -201,7 +201,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="utc" tabindex="-1"><a class="header-anchor" href="#utc" aria-hidden="true">#</a> utc</h3><p>Output date(s) will be in UTC timezone string. You can use this if you gather dates from different timezones and want to send the date directly to the server</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div><!----></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="utc" tabindex="-1"><a class="header-anchor" href="#utc" aria-hidden="true">#</a> utc</h3><p>Output date(s) will be in UTC timezone string. You can use this if you gather dates from different timezones and want to send the date directly to the server</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div><!----></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">utc</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -218,7 +218,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weekpicker" tabindex="-1"><a class="header-anchor" href="#weekpicker" aria-hidden="true">#</a> weekPicker</h3><p>Select a specific week range</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select week" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weekpicker" tabindex="-1"><a class="header-anchor" href="#weekpicker" aria-hidden="true">#</a> weekPicker</h3><p>Select a specific week range</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select week" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekPicker</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -236,7 +236,24 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></details><h2 id="modes-configuration" tabindex="-1"><a class="header-anchor" href="#modes-configuration" aria-hidden="true">#</a> Modes configuration</h2><p>Props for configuring and extending the datepicker when using a specific mode</p><h3 id="partialrange" tabindex="-1"><a class="header-anchor" href="#partialrange" aria-hidden="true">#</a> partialRange</h3><p>This prop is enabled by default, meaning, two dates are not required for range input. If no second date is selected, the value will be <code>null</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></details><h3 id="vertical" tabindex="-1"><a class="header-anchor" href="#vertical" aria-hidden="true">#</a> vertical</h3><p>Sets the datepicker orientation in the vertical mode. This mode will change the arrow action from left/right to the top/bottom, transitions will also be vertical</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">vertical</span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="modes-configuration" tabindex="-1"><a class="header-anchor" href="#modes-configuration" aria-hidden="true">#</a> Modes configuration</h2><p>Props for configuring and extending the datepicker when using a specific mode</p><h3 id="partialrange" tabindex="-1"><a class="header-anchor" href="#partialrange" aria-hidden="true">#</a> partialRange</h3><p>This prop is enabled by default, meaning, two dates are not required for range input. If no second date is selected, the value will be <code>null</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">:partialRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -253,7 +270,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="presetranges" tabindex="-1"><a class="header-anchor" href="#presetranges" aria-hidden="true">#</a> presetRanges</h3><p>When configured, it will provide a sidebar with configured range that user can select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>{ label: string; range: Date[] | string[] }[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="presetranges" tabindex="-1"><a class="header-anchor" href="#presetranges" aria-hidden="true">#</a> presetRanges</h3><p>When configured, it will provide a sidebar with configured range that user can select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>{ label: string; range: Date[] | string[] }[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">:presetRanges</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>presetRanges<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -282,7 +299,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><h3 id="minrange" tabindex="-1"><a class="header-anchor" href="#minrange" aria-hidden="true">#</a> minRange</h3><p>Set minimal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="At least 3 days in between" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><h3 id="minrange" tabindex="-1"><a class="header-anchor" href="#minrange" aria-hidden="true">#</a> minRange</h3><p>Set minimal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="At least 3 days in between" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">minRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>3<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -299,7 +316,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxrange" tabindex="-1"><a class="header-anchor" href="#maxrange" aria-hidden="true">#</a> maxRange</h3><p>Set maximal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Can&#39;t have more than 7 days in between" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxrange" tabindex="-1"><a class="header-anchor" href="#maxrange" aria-hidden="true">#</a> maxRange</h3><p>Set maximal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Can&#39;t have more than 7 days in between" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">maxRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>7<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -316,7 +333,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="fixedstart" tabindex="-1"><a class="header-anchor" href="#fixedstart" aria-hidden="true">#</a> fixedStart</h3><p>Allows only adjustment of the second date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedEnd</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="fixedstart" tabindex="-1"><a class="header-anchor" href="#fixedstart" aria-hidden="true">#</a> fixedStart</h3><p>Allows only adjustment of the second date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedEnd</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">fixedStart</span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -340,7 +357,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="fixedend" tabindex="-1"><a class="header-anchor" href="#fixedend" aria-hidden="true">#</a> fixedEnd</h3><p>Allows only adjustment of the first date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedStart</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="fixedend" tabindex="-1"><a class="header-anchor" href="#fixedend" aria-hidden="true">#</a> fixedEnd</h3><p>Allows only adjustment of the first date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedStart</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">fixedEnd</span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -364,7 +381,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="multicalendarssolo" tabindex="-1"><a class="header-anchor" href="#multicalendarssolo" aria-hidden="true">#</a> multiCalendarsSolo</h3><p>When enabled, both calendars will be independent of each other</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> and <a href="#multicalendars">multiCalendars</a> props must be enabled</p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="multicalendarssolo" tabindex="-1"><a class="header-anchor" href="#multicalendarssolo" aria-hidden="true">#</a> multiCalendarsSolo</h3><p>When enabled, both calendars will be independent of each other</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> and <a href="#multicalendars">multiCalendars</a> props must be enabled</p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">multiCalendars</span> <span class="token attr-name">multiCalendarsSolo</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -387,7 +404,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="textinputoptions" tabindex="-1"><a class="header-anchor" href="#textinputoptions" aria-hidden="true">#</a> textInputOptions</h3><p>Configuration for <a href="#textinput">textInput</a> prop</p><ul><li>Type: <code>{ enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }</code></li><li>Default: <code>{ enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: &#39;-&#39; }</code></li></ul><p>Properties explanation:</p><ul><li><code>enterSubmit</code>: When enabled, pressing enter will select a date if the input value is a valid date object</li><li><code>tabSubmit</code>: When enabled, pressing tab will select a date if the input value is a valid date object</li><li><code>openMenu</code>: When enabled, opens the menu when clicking on the input field</li><li><code>format</code>: Override the default parsing format. Default is the string value from <a href="#format">format</a></li><li><code>rangeSeparator</code>: If you use <code>range</code> mode, the default separator is <code>-</code>, you can change it here</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" placeholder="Start Typing ..." value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="textinputoptions" tabindex="-1"><a class="header-anchor" href="#textinputoptions" aria-hidden="true">#</a> textInputOptions</h3><p>Configuration for <a href="#textinput">textInput</a> prop</p><ul><li>Type: <code>{ enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }</code></li><li>Default: <code>{ enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: &#39;-&#39; }</code></li></ul><p>Properties explanation:</p><ul><li><code>enterSubmit</code>: When enabled, pressing enter will select a date if the input value is a valid date object</li><li><code>tabSubmit</code>: When enabled, pressing tab will select a date if the input value is a valid date object</li><li><code>openMenu</code>: When enabled, opens the menu when clicking on the input field</li><li><code>format</code>: Override the default parsing format. Default is the string value from <a href="#format">format</a></li><li><code>rangeSeparator</code>: If you use <code>range</code> mode, the default separator is <code>-</code>, you can change it here</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" placeholder="Start Typing ..." value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> 
       <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span>
       <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Start Typing ...<span class="token punctuation">&quot;</span></span>
@@ -412,7 +429,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="modeheight" tabindex="-1"><a class="header-anchor" href="#modeheight" aria-hidden="true">#</a> modeHeight</h3><p>If you use <code>monthPicker</code> and <code>timePicker</code>, set custom height of the picker in <code>px</code></p><ul><li>Type: <code>number | string</code></li><li>Default: <code>255</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="modeheight" tabindex="-1"><a class="header-anchor" href="#modeheight" aria-hidden="true">#</a> modeHeight</h3><p>If you use <code>monthPicker</code> and <code>timePicker</code>, set custom height of the picker in <code>px</code></p><ul><li>Type: <code>number | string</code></li><li>Default: <code>255</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>time<span class="token punctuation">&quot;</span></span> <span class="token attr-name">timePicker</span> <span class="token attr-name">modeHeight</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>120<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -432,7 +449,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="inlinewithinput" tabindex="-1"><a class="header-anchor" href="#inlinewithinput" aria-hidden="true">#</a> inlineWithInput</h3><p>Use input with the inline mode, useful if you enable <code>textInput</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark dp__flex_display dp__flex_display_with_input"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="inlinewithinput" tabindex="-1"><a class="header-anchor" href="#inlinewithinput" aria-hidden="true">#</a> inlineWithInput</h3><p>Use input with the inline mode, useful if you enable <code>textInput</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark dp__flex_display dp__flex_display_with_input"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">inline</span> <span class="token attr-name">inlineWithInput</span> <span class="token attr-name">autoApply</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -449,7 +466,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidateslimit" tabindex="-1"><a class="header-anchor" href="#multidateslimit" aria-hidden="true">#</a> multiDatesLimit</h3><p>Limit the number of dates to select when <code>multiDates</code> is enabled</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Multiple Dates" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidateslimit" tabindex="-1"><a class="header-anchor" href="#multidateslimit" aria-hidden="true">#</a> multiDatesLimit</h3><p>Limit the number of dates to select when <code>multiDates</code> is enabled</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Multiple Dates" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">multiDates</span> <span class="token attr-name">multiDatesLimit</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>3<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -466,7 +483,7 @@
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="formatting" tabindex="-1"><a class="header-anchor" href="#formatting" aria-hidden="true">#</a> Formatting</h2><p>Format options for the value displayed in the input or preview</p><h3 id="format" tabindex="-1"><a class="header-anchor" href="#format" aria-hidden="true">#</a> format</h3><p>Format the value of the date(s) in the input field. Formatting is done automatically via provided string format. However, you can override the default format by providing a custom formatter function</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <ul><li>Single picker: <code>&#39;MM/dd/yyyy HH:mm&#39;</code></li><li>Range picker: <code>&#39;MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm&#39;</code></li><li>Month picker: <code>&#39;MM/yyyy&#39;</code></li><li>Time picker: <code>&#39;HH:mm&#39;</code></li><li>Time picker range: <code>&#39;HH:mm - HH:mm&#39;</code></li></ul></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>If <a href="#is24">is24</a> prop is set to <code>false</code>, hours format will be changed to <code>&#39;hh:mm aa&#39;</code></p></div><p>For additional information on how to pass custom string format you can check <a href="https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table" target="_blank" rel="noopener noreferrer">Unicode tokens<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="formatting" tabindex="-1"><a class="header-anchor" href="#formatting" aria-hidden="true">#</a> Formatting</h2><p>Format options for the value displayed in the input or preview</p><h3 id="format" tabindex="-1"><a class="header-anchor" href="#format" aria-hidden="true">#</a> format</h3><p>Format the value of the date(s) in the input field. Formatting is done automatically via provided string format. However, you can override the default format by providing a custom formatter function</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <ul><li>Single picker: <code>&#39;MM/dd/yyyy HH:mm&#39;</code></li><li>Range picker: <code>&#39;MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm&#39;</code></li><li>Month picker: <code>&#39;MM/yyyy&#39;</code></li><li>Time picker: <code>&#39;HH:mm&#39;</code></li><li>Time picker range: <code>&#39;HH:mm - HH:mm&#39;</code></li></ul></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>If <a href="#is24">is24</a> prop is set to <code>false</code>, hours format will be changed to <code>&#39;hh:mm aa&#39;</code></p></div><p>For additional information on how to pass custom string format you can check <a href="https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table" target="_blank" rel="noopener noreferrer">Unicode tokens<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:format</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>format<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -493,7 +510,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="previewformat" tabindex="-1"><a class="header-anchor" href="#previewformat" aria-hidden="true">#</a> previewFormat</h3><p>Format the value of the date(s) in the action row</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <code>null</code></li></ul><p>Same configuration as in <a href="#format">format</a> prop</p><p><strong>Note:</strong> If not provided, it will auto inherit data from the <a href="#format">format</a> prop</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="previewformat" tabindex="-1"><a class="header-anchor" href="#previewformat" aria-hidden="true">#</a> previewFormat</h3><p>Format the value of the date(s) in the action row</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <code>null</code></li></ul><p>Same configuration as in <a href="#format">format</a> prop</p><p><strong>Note:</strong> If not provided, it will auto inherit data from the <a href="#format">format</a> prop</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:previewFormat</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>format<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -520,7 +537,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="monthnameformat" tabindex="-1"><a class="header-anchor" href="#monthnameformat" aria-hidden="true">#</a> monthNameFormat</h3><p>Set the month name format</p><ul><li>Type: <code>&#39;short&#39; | &#39;long&#39;</code></li><li>Default: <code>&#39;short&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="monthnameformat" tabindex="-1"><a class="header-anchor" href="#monthnameformat" aria-hidden="true">#</a> monthNameFormat</h3><p>Set the month name format</p><ul><li>Type: <code>&#39;short&#39; | &#39;long&#39;</code></li><li>Default: <code>&#39;short&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">monthNameFormat</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>long<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -537,7 +554,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="localization" tabindex="-1"><a class="header-anchor" href="#localization" aria-hidden="true">#</a> Localization</h2><p>Localization options and label props</p><h3 id="locale" tabindex="-1"><a class="header-anchor" href="#locale" aria-hidden="true">#</a> locale</h3><p>Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;en-US&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="localization" tabindex="-1"><a class="header-anchor" href="#localization" aria-hidden="true">#</a> Localization</h2><p>Localization options and label props</p><h3 id="locale" tabindex="-1"><a class="header-anchor" href="#locale" aria-hidden="true">#</a> locale</h3><p>Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;en-US&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>de<span class="token punctuation">&quot;</span></span> <span class="token attr-name">cancelText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>abbrechen<span class="token punctuation">&quot;</span></span> <span class="token attr-name">selectText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>auswählen<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -554,7 +571,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="formatlocale" tabindex="-1"><a class="header-anchor" href="#formatlocale" aria-hidden="true">#</a> formatLocale</h3><p>Specify localized format output. This prop uses <code>Locale</code> object from <code>date-fns</code> library</p><p>For more info about supported locales or adding a custom locale object, please visit <a href="https://date-fns.org/v2.27.0/docs/I18n" target="_blank" rel="noopener noreferrer"><code>date-fns documentation</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><ul><li>Type: <code>Locale</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="formatlocale" tabindex="-1"><a class="header-anchor" href="#formatlocale" aria-hidden="true">#</a> formatLocale</h3><p>Specify localized format output. This prop uses <code>Locale</code> object from <code>date-fns</code> library</p><p>For more info about supported locales or adding a custom locale object, please visit <a href="https://date-fns.org/v2.27.0/docs/I18n" target="_blank" rel="noopener noreferrer"><code>date-fns documentation</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><ul><li>Type: <code>Locale</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:format-locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>ja<span class="token punctuation">&quot;</span></span> <span class="token attr-name">format</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>E<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -573,7 +590,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="selecttext" tabindex="-1"><a class="header-anchor" href="#selecttext" aria-hidden="true">#</a> selectText</h3><p>Select text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Select&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="selecttext" tabindex="-1"><a class="header-anchor" href="#selecttext" aria-hidden="true">#</a> selectText</h3><p>Select text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Select&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">selectText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Pick<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -590,7 +607,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="canceltext" tabindex="-1"><a class="header-anchor" href="#canceltext" aria-hidden="true">#</a> cancelText</h3><p>Cancel text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Cancel&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="canceltext" tabindex="-1"><a class="header-anchor" href="#canceltext" aria-hidden="true">#</a> cancelText</h3><p>Cancel text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Cancel&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">cancelText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Close<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -607,7 +624,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nowbuttonlabel" tabindex="-1"><a class="header-anchor" href="#nowbuttonlabel" aria-hidden="true">#</a> nowButtonLabel</h3><p>Change the text for now button</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Now&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nowbuttonlabel" tabindex="-1"><a class="header-anchor" href="#nowbuttonlabel" aria-hidden="true">#</a> nowButtonLabel</h3><p>Change the text for now button</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Now&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">showNowButton</span> <span class="token attr-name">nowButtonLabel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Current<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -624,7 +641,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weeknumname" tabindex="-1"><a class="header-anchor" href="#weeknumname" aria-hidden="true">#</a> weekNumName</h3><p>Sets the label for the week numbers column</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;W&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weeknumname" tabindex="-1"><a class="header-anchor" href="#weeknumname" aria-hidden="true">#</a> weekNumName</h3><p>Sets the label for the week numbers column</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;W&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekNumbers</span> <span class="token attr-name">weekNumName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>We<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -641,7 +658,43 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="general-configuration" tabindex="-1"><a class="header-anchor" href="#general-configuration" aria-hidden="true">#</a> General configuration</h2><p>General behavior props configuration</p><h3 id="uid" tabindex="-1"><a class="header-anchor" href="#uid" aria-hidden="true">#</a> uid</h3><p>Pass an <code>id</code> to the input and menu elements. If provided, you can select menu id as <code>dp-menu-${uid}</code> and input id as <code>dp-input-${uid}</code></p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" id="dp-input-demo" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="arialabels" tabindex="-1"><a class="header-anchor" href="#arialabels" aria-hidden="true">#</a> ariaLabels</h3><p>Customize the language of the HTML <code>aria-labels</code> for localized accessibility</p><ul><li>Type</li></ul><div class="language-typescript ext-ts line-numbers-mode"><pre class="language-typescript"><code><span class="token keyword">interface</span> <span class="token class-name">AriaLabels</span> <span class="token punctuation">{</span>
+  toggleOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  menu<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  input<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  calendarWrap<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  calendarDays<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openTimePicker<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  closeTimePicker<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  incrementValue<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  decrementValue<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openTpOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  amPmButton<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openYearsOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openMonthsOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  nextMonth<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  prevMonth<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div><ul><li>Default: <code>{}</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:ariaLabels</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>ariaLabels<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> ariaLabels <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">menu</span><span class="token operator">:</span> <span class="token string">&#39;Some custom menu label&#39;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          ariaLabels<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="general-configuration" tabindex="-1"><a class="header-anchor" href="#general-configuration" aria-hidden="true">#</a> General configuration</h2><p>General behavior props configuration</p><h3 id="uid" tabindex="-1"><a class="header-anchor" href="#uid" aria-hidden="true">#</a> uid</h3><p>Pass an <code>id</code> to the input and menu elements. If provided, you can select menu id as <code>dp-menu-${uid}</code> and input id as <code>dp-input-${uid}</code></p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" id="dp-input-demo" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">uid</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>demo<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -658,7 +711,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonscroll" tabindex="-1"><a class="header-anchor" href="#monthchangeonscroll" aria-hidden="true">#</a> monthChangeOnScroll</h3><p>Scrolling the mouse wheel over the calendar will change the month. Scroll up for next month and vice versa</p><p>You can also set the value to &#39;inverse&#39;, so that scroll up will go to the previous month and down on the next</p><ul><li>Type: <code>boolean | &#39;inverse&#39;</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonscroll" tabindex="-1"><a class="header-anchor" href="#monthchangeonscroll" aria-hidden="true">#</a> monthChangeOnScroll</h3><p>Scrolling the mouse wheel over the calendar will change the month. Scroll down for next month and vice versa</p><p>You can also set the value to <code>&#39;inverse&#39;</code>, so that scrolling down will go to the previous month and up on the next</p><ul><li>Type: <code>boolean | &#39;inverse&#39;</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:monthChangeOnScroll</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -700,7 +753,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="clearable" tabindex="-1"><a class="header-anchor" href="#clearable" aria-hidden="true">#</a> clearable</h3><p>Add a clear icon to the input field where you can set the value to null</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="clearable" tabindex="-1"><a class="header-anchor" href="#clearable" aria-hidden="true">#</a> clearable</h3><p>Add a clear icon to the input field where you can set the value to null</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -717,7 +770,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonscroll" tabindex="-1"><a class="header-anchor" href="#closeonscroll" aria-hidden="true">#</a> closeOnScroll</h3><p>Close datepicker menu on page scroll</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonscroll" tabindex="-1"><a class="header-anchor" href="#closeonscroll" aria-hidden="true">#</a> closeOnScroll</h3><p>Close datepicker menu on page scroll</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">closeOnScroll</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -734,7 +787,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoapply" tabindex="-1"><a class="header-anchor" href="#autoapply" aria-hidden="true">#</a> autoApply</h3><p>If set to <code>true</code>, clicking on a date value will automatically select the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoapply" tabindex="-1"><a class="header-anchor" href="#autoapply" aria-hidden="true">#</a> autoApply</h3><p>If set to <code>true</code>, clicking on a date value will automatically select the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -751,7 +804,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="placeholder" tabindex="-1"><a class="header-anchor" href="#placeholder" aria-hidden="true">#</a> placeholder</h3><p>Input placeholder</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="placeholder" tabindex="-1"><a class="header-anchor" href="#placeholder" aria-hidden="true">#</a> placeholder</h3><p>Input placeholder</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -768,7 +821,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="notoday" tabindex="-1"><a class="header-anchor" href="#notoday" aria-hidden="true">#</a> noToday</h3><p>Hide today mark from the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="notoday" tabindex="-1"><a class="header-anchor" href="#notoday" aria-hidden="true">#</a> noToday</h3><p>Hide today mark from the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noToday</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -785,7 +838,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonautoapply" tabindex="-1"><a class="header-anchor" href="#closeonautoapply" aria-hidden="true">#</a> closeOnAutoApply</h3><p>If set to <code>false</code>, clicking on a date value will automatically select the value but will not close the datepicker menu. Closing will be available on a click-away or clicking on the input again</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonautoapply" tabindex="-1"><a class="header-anchor" href="#closeonautoapply" aria-hidden="true">#</a> closeOnAutoApply</h3><p>If set to <code>false</code>, clicking on a date value will automatically select the value but will not close the datepicker menu. Closing will be available on a click-away or clicking on the input again</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token attr-name">:closeOnAutoApply</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -808,7 +861,7 @@
 tooltip<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">{</span> text<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span> color<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span> <span class="token punctuation">}</span><span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">;</span>
 color<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
 <span class="token punctuation">}</span><span class="token punctuation">[</span><span class="token punctuation">]</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><ul><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><ul><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:markers</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>markers<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -847,7 +900,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br></div></div></details><h3 id="shownowbutton" tabindex="-1"><a class="header-anchor" href="#shownowbutton" aria-hidden="true">#</a> showNowButton</h3><p>Enable button to select current date and time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br></div></div></details><h3 id="shownowbutton" tabindex="-1"><a class="header-anchor" href="#shownowbutton" aria-hidden="true">#</a> showNowButton</h3><p>Enable button to select current date and time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">showNowButton</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -864,7 +917,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="disabled" tabindex="-1"><a class="header-anchor" href="#disabled" aria-hidden="true">#</a> disabled</h3><p>Disables the input</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="true" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__disabled dp__input dp__input_icon_pad" disabled value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="disabled" tabindex="-1"><a class="header-anchor" href="#disabled" aria-hidden="true">#</a> disabled</h3><p>Disables the input</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="true" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__disabled dp__input dp__input_icon_pad" placeholder disabled value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">disabled</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -881,7 +934,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="readonly" tabindex="-1"><a class="header-anchor" href="#readonly" aria-hidden="true">#</a> readonly</h3><p>Sets the input in readonly state</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="true"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" readonly value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="readonly" tabindex="-1"><a class="header-anchor" href="#readonly" aria-hidden="true">#</a> readonly</h3><p>Sets the input in readonly state</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="true"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__input dp__input_icon_pad" placeholder readonly value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">readonly</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -898,7 +951,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="required" tabindex="-1"><a class="header-anchor" href="#required" aria-hidden="true">#</a> required</h3><p>Add <code>required</code> flag to the input field. Use with form tag for built-in validation</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap" required><form><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" required value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div><button class="submit-btn" type="submit">Submit form</button></form></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="required" tabindex="-1"><a class="header-anchor" href="#required" aria-hidden="true">#</a> required</h3><p>Add <code>required</code> flag to the input field. Use with form tag for built-in validation</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap" required><form><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" required value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div><button class="submit-btn" type="submit">Submit form</button></form></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>form</span> <span class="token attr-name">@submit.prevent</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>submitForm<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">required</span> <span class="token punctuation">/&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>submit<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>Submit form<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">&gt;</span></span>
@@ -923,7 +976,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="name" tabindex="-1"><a class="header-anchor" href="#name" aria-hidden="true">#</a> name</h3><p>Sets the input name attribute</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" name="date-picker" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="name" tabindex="-1"><a class="header-anchor" href="#name" aria-hidden="true">#</a> name</h3><p>Sets the input name attribute</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" name="date-picker" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date-picker<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -940,7 +993,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autocomplete" tabindex="-1"><a class="header-anchor" href="#autocomplete" aria-hidden="true">#</a> autocomplete</h3><p>Sets the input autocomplete attribute</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autocomplete" tabindex="-1"><a class="header-anchor" href="#autocomplete" aria-hidden="true">#</a> autocomplete</h3><p>Sets the input autocomplete attribute</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autocomplete</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>off<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -957,7 +1010,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="keepactionrow" tabindex="-1"><a class="header-anchor" href="#keepactionrow" aria-hidden="true">#</a> keepActionRow</h3><p>When enabled, it will keep the action row even if the <code>autoApply</code> prop is enabled</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="keepactionrow" tabindex="-1"><a class="header-anchor" href="#keepactionrow" aria-hidden="true">#</a> keepActionRow</h3><p>When enabled, it will keep the action row even if the <code>autoApply</code> prop is enabled</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token attr-name">keepActionRow</span> <span class="token attr-name">:closeOnAutoApply</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -974,7 +1027,24 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="calendar-configuration" tabindex="-1"><a class="header-anchor" href="#calendar-configuration" aria-hidden="true">#</a> Calendar configuration</h2><p>Configure calendar options such as behavior or available dates</p><h3 id="weeknumbers" tabindex="-1"><a class="header-anchor" href="#weeknumbers" aria-hidden="true">#</a> weekNumbers</h3><p>Display week numbers in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="noswipe" tabindex="-1"><a class="header-anchor" href="#noswipe" aria-hidden="true">#</a> noSwipe</h3><p>Disable touch events on the calendar</p><ul><li>Type: <code>Boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noSwipe</span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+            date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="calendar-configuration" tabindex="-1"><a class="header-anchor" href="#calendar-configuration" aria-hidden="true">#</a> Calendar configuration</h2><p>Configure calendar options such as behavior or available dates</p><h3 id="weeknumbers" tabindex="-1"><a class="header-anchor" href="#weeknumbers" aria-hidden="true">#</a> weekNumbers</h3><p>Display week numbers in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekNumbers</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -991,7 +1061,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideoffsetdates" tabindex="-1"><a class="header-anchor" href="#hideoffsetdates" aria-hidden="true">#</a> hideOffsetDates</h3><p>Hide dates from the previous/next month in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideoffsetdates" tabindex="-1"><a class="header-anchor" href="#hideoffsetdates" aria-hidden="true">#</a> hideOffsetDates</h3><p>Hide dates from the previous/next month in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hideOffsetDates</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1008,7 +1078,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mindate" tabindex="-1"><a class="header-anchor" href="#mindate" aria-hidden="true">#</a> minDate</h3><p>All dates before the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mindate" tabindex="-1"><a class="header-anchor" href="#mindate" aria-hidden="true">#</a> minDate</h3><p>All dates before the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>new Date()<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1025,7 +1095,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxdate" tabindex="-1"><a class="header-anchor" href="#maxdate" aria-hidden="true">#</a> maxDate</h3><p>All dates after the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxdate" tabindex="-1"><a class="header-anchor" href="#maxdate" aria-hidden="true">#</a> maxDate</h3><p>All dates after the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>new Date()<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1042,7 +1112,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="preventminmaxnavigation" tabindex="-1"><a class="header-anchor" href="#preventminmaxnavigation" aria-hidden="true">#</a> preventMinMaxNavigation</h3><p>Prevent navigation after or before the <code>minDate</code> or <code>mixDate</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="preventminmaxnavigation" tabindex="-1"><a class="header-anchor" href="#preventminmaxnavigation" aria-hidden="true">#</a> preventMinMaxNavigation</h3><p>Prevent navigation after or before the <code>minDate</code> or <code>mixDate</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>minDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>maxDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">preventMinMaxNavigation</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1065,7 +1135,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="startdate" tabindex="-1"><a class="header-anchor" href="#startdate" aria-hidden="true">#</a> startDate</h3><p>Open the datepicker to some preselected month and year</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="startdate" tabindex="-1"><a class="header-anchor" href="#startdate" aria-hidden="true">#</a> startDate</h3><p>Open the datepicker to some preselected month and year</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:startDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>startDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1084,7 +1154,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="weekstart" tabindex="-1"><a class="header-anchor" href="#weekstart" aria-hidden="true">#</a> weekStart</h3><p>Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="weekstart" tabindex="-1"><a class="header-anchor" href="#weekstart" aria-hidden="true">#</a> weekStart</h3><p>Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekStart</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>0<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1110,7 +1180,7 @@
     seconds<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">number</span><span class="token punctuation">[</span><span class="token punctuation">]</span> <span class="token comment">// disable specific seconds</span>
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><ul><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><ul><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_light"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:filters</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>filters<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1138,7 +1208,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="disablemonthyearselect" tabindex="-1"><a class="header-anchor" href="#disablemonthyearselect" aria-hidden="true">#</a> disableMonthYearSelect</h3><p>Removes the month and year picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="disablemonthyearselect" tabindex="-1"><a class="header-anchor" href="#disablemonthyearselect" aria-hidden="true">#</a> disableMonthYearSelect</h3><p>Removes the month and year picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">disableMonthYearSelect</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1155,7 +1225,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="yearrange" tabindex="-1"><a class="header-anchor" href="#yearrange" aria-hidden="true">#</a> yearRange</h3><p>Specify start and end year for years to generate</p><ul><li>Type: <code>[number, number]</code></li><li>Default: <code>[1900, 2100]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="yearrange" tabindex="-1"><a class="header-anchor" href="#yearrange" aria-hidden="true">#</a> yearRange</h3><p>Specify start and end year for years to generate</p><ul><li>Type: <code>[number, number]</code></li><li>Default: <code>[1900, 2100]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:yearRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[2020, 2040]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1172,7 +1242,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="reverseyears" tabindex="-1"><a class="header-anchor" href="#reverseyears" aria-hidden="true">#</a> reverseYears</h3><p>Reverse the order of the years in years overlay</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="reverseyears" tabindex="-1"><a class="header-anchor" href="#reverseyears" aria-hidden="true">#</a> reverseYears</h3><p>Reverse the order of the years in years overlay</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">reverseYears</span> <span class="token attr-name">:yearRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[2020, 2040]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1189,7 +1259,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="alloweddates" tabindex="-1"><a class="header-anchor" href="#alloweddates" aria-hidden="true">#</a> allowedDates</h3><p>Allow only specific dates</p><ul><li>Type: <code>string[] | Date[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="alloweddates" tabindex="-1"><a class="header-anchor" href="#alloweddates" aria-hidden="true">#</a> allowedDates</h3><p>Allow only specific dates</p><ul><li>Type: <code>string[] | Date[]</code></li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:allowedDates</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>allowedDates<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1215,7 +1285,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details><h3 id="disableddates" tabindex="-1"><a class="header-anchor" href="#disableddates" aria-hidden="true">#</a> disabledDates</h3><p>Disable specific dates</p><ul><li>Type: <code>Date[] | string[] | (date: Date) =&gt; boolean</code></li><li>Default: <code>[]</code></li></ul><p><strong>Note:</strong> If you use a custom function, make sure to return <code>true</code> for a disabled date and <code>false</code> for enabled</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details><h3 id="disableddates" tabindex="-1"><a class="header-anchor" href="#disableddates" aria-hidden="true">#</a> disabledDates</h3><p>Disable specific dates</p><ul><li>Type: <code>Date[] | string[] | (date: Date) =&gt; boolean</code></li><li>Default: <code>[]</code></li></ul><p><strong>Note:</strong> If you use a custom function, make sure to return <code>true</code> for a disabled date and <code>false</code> for enabled</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:disabledDates</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>disabledDates<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1246,7 +1316,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="disabledweekdays" tabindex="-1"><a class="header-anchor" href="#disabledweekdays" aria-hidden="true">#</a> disabledWeekDays</h3><p>Disable specific days from the week</p><ul><li>Type: <code>string[] | number[]</code> - 0-6, 0 is Sunday, 6 is Saturday</li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="disabledweekdays" tabindex="-1"><a class="header-anchor" href="#disabledweekdays" aria-hidden="true">#</a> disabledWeekDays</h3><p>Disable specific days from the week</p><ul><li>Type: <code>string[] | number[]</code> - 0-6, 0 is Sunday, 6 is Saturday</li><li>Default: <code>[]</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:disabledWeekDays</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[6, 0]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1263,7 +1333,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="time-picker-configuration" tabindex="-1"><a class="header-anchor" href="#time-picker-configuration" aria-hidden="true">#</a> Time picker configuration</h2><p>Props to configure time picker, whether using it only as time picker or alongside the datepicker</p><h3 id="enabletimepicker" tabindex="-1"><a class="header-anchor" href="#enabletimepicker" aria-hidden="true">#</a> enableTimePicker</h3><p>Enable or disable time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="time-picker-configuration" tabindex="-1"><a class="header-anchor" href="#time-picker-configuration" aria-hidden="true">#</a> Time picker configuration</h2><p>Props to configure time picker, whether using it only as time picker or alongside the datepicker</p><h3 id="enabletimepicker" tabindex="-1"><a class="header-anchor" href="#enabletimepicker" aria-hidden="true">#</a> enableTimePicker</h3><p>Enable or disable time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:enableTimePicker</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1280,7 +1350,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="is24" tabindex="-1"><a class="header-anchor" href="#is24" aria-hidden="true">#</a> is24</h3><p>Whether to use 24H or 12H mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="is24" tabindex="-1"><a class="header-anchor" href="#is24" aria-hidden="true">#</a> is24</h3><p>Whether to use 24H or 12H mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:is24</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1297,7 +1367,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="enableseconds" tabindex="-1"><a class="header-anchor" href="#enableseconds" aria-hidden="true">#</a> enableSeconds</h3><p>Enable seconds in the time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="enableseconds" tabindex="-1"><a class="header-anchor" href="#enableseconds" aria-hidden="true">#</a> enableSeconds</h3><p>Enable seconds in the time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1314,7 +1384,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursincrement" tabindex="-1"><a class="header-anchor" href="#hoursincrement" aria-hidden="true">#</a> hoursIncrement</h3><p>The value which is used to increment hours via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursincrement" tabindex="-1"><a class="header-anchor" href="#hoursincrement" aria-hidden="true">#</a> hoursIncrement</h3><p>The value which is used to increment hours via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hoursIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1331,7 +1401,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesincrement" tabindex="-1"><a class="header-anchor" href="#minutesincrement" aria-hidden="true">#</a> minutesIncrement</h3><p>The value which is used to increment minutes via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesincrement" tabindex="-1"><a class="header-anchor" href="#minutesincrement" aria-hidden="true">#</a> minutesIncrement</h3><p>The value which is used to increment minutes via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">minutesIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1348,7 +1418,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsincrement" tabindex="-1"><a class="header-anchor" href="#secondsincrement" aria-hidden="true">#</a> secondsIncrement</h3><p>The value which is used to increment seconds via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsincrement" tabindex="-1"><a class="header-anchor" href="#secondsincrement" aria-hidden="true">#</a> secondsIncrement</h3><p>The value which is used to increment seconds via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token attr-name">secondsIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1365,7 +1435,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursgridincrement" tabindex="-1"><a class="header-anchor" href="#hoursgridincrement" aria-hidden="true">#</a> hoursGridIncrement</h3><p>The value which is used to increment hours when showing hours overlay</p><p>It will always start from 0 until it reaches 24 or 12 depending on the <code>is24</code> prop</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursgridincrement" tabindex="-1"><a class="header-anchor" href="#hoursgridincrement" aria-hidden="true">#</a> hoursGridIncrement</h3><p>The value which is used to increment hours when showing hours overlay</p><p>It will always start from 0 until it reaches 24 or 12 depending on the <code>is24</code> prop</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hoursGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1382,7 +1452,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesgridincrement" tabindex="-1"><a class="header-anchor" href="#minutesgridincrement" aria-hidden="true">#</a> minutesGridIncrement</h3><p>The value which is used to increment minutes when showing minutes overlay</p><p>It will always start from 0 to 60 minutes</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesgridincrement" tabindex="-1"><a class="header-anchor" href="#minutesgridincrement" aria-hidden="true">#</a> minutesGridIncrement</h3><p>The value which is used to increment minutes when showing minutes overlay</p><p>It will always start from 0 to 60 minutes</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">minutesGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1399,7 +1469,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsgridincrement" tabindex="-1"><a class="header-anchor" href="#secondsgridincrement" aria-hidden="true">#</a> secondsGridIncrement</h3><p>The value which is used to increment seconds when showing seconds overlay</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsgridincrement" tabindex="-1"><a class="header-anchor" href="#secondsgridincrement" aria-hidden="true">#</a> secondsGridIncrement</h3><p>The value which is used to increment seconds when showing seconds overlay</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token attr-name">secondsGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1416,7 +1486,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nohoursoverlay" tabindex="-1"><a class="header-anchor" href="#nohoursoverlay" aria-hidden="true">#</a> noHoursOverlay</h3><p>Disable overlay for the hours, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nohoursoverlay" tabindex="-1"><a class="header-anchor" href="#nohoursoverlay" aria-hidden="true">#</a> noHoursOverlay</h3><p>Disable overlay for the hours, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noHoursOverlay</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1433,7 +1503,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nominutesoverlay" tabindex="-1"><a class="header-anchor" href="#nominutesoverlay" aria-hidden="true">#</a> noMinutesOverlay</h3><p>Disable overlay for the minutes, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nominutesoverlay" tabindex="-1"><a class="header-anchor" href="#nominutesoverlay" aria-hidden="true">#</a> noMinutesOverlay</h3><p>Disable overlay for the minutes, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noMinutesOverlay</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1450,7 +1520,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nosecondsoverlay" tabindex="-1"><a class="header-anchor" href="#nosecondsoverlay" aria-hidden="true">#</a> noSecondsOverlay</h3><p>Disable overlay for the seconds, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nosecondsoverlay" tabindex="-1"><a class="header-anchor" href="#nosecondsoverlay" aria-hidden="true">#</a> noSecondsOverlay</h3><p>Disable overlay for the seconds, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noSecondsOverlay</span> <span class="token attr-name">enableSeconds</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1467,7 +1537,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mintime" tabindex="-1"><a class="header-anchor" href="#mintime" aria-hidden="true">#</a> minTime</h3><p>Sets the minimal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mintime" tabindex="-1"><a class="header-anchor" href="#mintime" aria-hidden="true">#</a> minTime</h3><p>Sets the minimal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ hours: 11, minutes: 30 }<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1484,7 +1554,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxtime" tabindex="-1"><a class="header-anchor" href="#maxtime" aria-hidden="true">#</a> maxTime</h3><p>Sets the maximal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxtime" tabindex="-1"><a class="header-anchor" href="#maxtime" aria-hidden="true">#</a> maxTime</h3><p>Sets the maximal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ hours: 11, minutes: 30 }<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1501,7 +1571,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="starttime" tabindex="-1"><a class="header-anchor" href="#starttime" aria-hidden="true">#</a> startTime</h3><p>Set some default starting time</p><ul><li>Type: <ul><li>Single picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Range picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }[]</code></li></ul></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="starttime" tabindex="-1"><a class="header-anchor" href="#starttime" aria-hidden="true">#</a> startTime</h3><p>Set some default starting time</p><ul><li>Type: <ul><li>Single picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Range picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }[]</code></li></ul></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:startTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>startTime<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1520,7 +1590,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="positioning" tabindex="-1"><a class="header-anchor" href="#positioning" aria-hidden="true">#</a> Positioning</h2><p>Configure datepicker menu positioning</p><h3 id="position" tabindex="-1"><a class="header-anchor" href="#position" aria-hidden="true">#</a> position</h3><p>Datepicker menu position</p><ul><li>Type: <code>&#39;left&#39; | &#39;center&#39; | &#39;right&#39;</code></li><li>Default: <code>&#39;center&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="positioning" tabindex="-1"><a class="header-anchor" href="#positioning" aria-hidden="true">#</a> Positioning</h2><p>Configure datepicker menu positioning</p><h3 id="position" tabindex="-1"><a class="header-anchor" href="#position" aria-hidden="true">#</a> position</h3><p>Datepicker menu position</p><ul><li>Type: <code>&#39;left&#39; | &#39;center&#39; | &#39;right&#39;</code></li><li>Default: <code>&#39;center&#39;</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">position</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>left<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1537,7 +1607,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoposition" tabindex="-1"><a class="header-anchor" href="#autoposition" aria-hidden="true">#</a> autoPosition</h3><p>When enabled, based on viewport space available it will automatically position the menu above or bellow input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoposition" tabindex="-1"><a class="header-anchor" href="#autoposition" aria-hidden="true">#</a> autoPosition</h3><p>When enabled, based on viewport space available it will automatically position the menu above or bellow input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:autoPosition</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1554,7 +1624,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="altposition" tabindex="-1"><a class="header-anchor" href="#altposition" aria-hidden="true">#</a> altPosition</h3><p>If you have issues with the menu being miss-placed, you can enable this prop to use an alternative positioning method. By default, if passed <code>true</code>, datepicker will use an alternative function to recalculate position, but you can also pass a custom function that can position the menu to your liking.</p><ul><li>Type: <code>boolean | ((el: HTMLElement | undefined) =&gt; { top: string; left: string; transform: string })</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="altposition" tabindex="-1"><a class="header-anchor" href="#altposition" aria-hidden="true">#</a> altPosition</h3><p>If you have issues with the menu being miss-placed, you can enable this prop to use an alternative positioning method. By default, if passed <code>true</code>, datepicker will use an alternative function to recalculate position, but you can also pass a custom function that can position the menu to your liking.</p><ul><li>Type: <code>boolean | ((el: HTMLElement | undefined) =&gt; { top: string; left: string; transform: string })</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">altPosition</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1571,7 +1641,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="teleport" tabindex="-1"><a class="header-anchor" href="#teleport" aria-hidden="true">#</a> teleport</h3><p>Set teleport target</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;body&#39;</code></li></ul><p>You can inspect the page and check the menu placement</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="teleport" tabindex="-1"><a class="header-anchor" href="#teleport" aria-hidden="true">#</a> teleport</h3><p>Set teleport target</p><ul><li>Type: <code>string | HTMLElement</code></li><li>Default: <code>&#39;body&#39;</code></li></ul><p>You can inspect the page and check the menu placement</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">teleport</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>#app<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1588,7 +1658,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="keyboard" tabindex="-1"><a class="header-anchor" href="#keyboard" aria-hidden="true">#</a> Keyboard</h2><p>Configure keyboard actions</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>You can press <code>tab</code> key in the menu, and it will autofocus elements, pressing <code>enter</code> will do a <code>click</code> action like open overlay or select a date.</p><p>All keyboard events are enabled by default</p></div><h3 id="openmenuonfocus" tabindex="-1"><a class="header-anchor" href="#openmenuonfocus" aria-hidden="true">#</a> openMenuOnFocus</h3><p>Pressing <code>tab</code> in the form, datepicker menu will open</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="keyboard" tabindex="-1"><a class="header-anchor" href="#keyboard" aria-hidden="true">#</a> Keyboard</h2><p>Configure keyboard actions</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>You can press <code>tab</code> key in the menu, and it will autofocus elements, pressing <code>enter</code> will do a <code>click</code> action like open overlay or select a date.</p><p>All keyboard events are enabled by default</p></div><h3 id="openmenuonfocus" tabindex="-1"><a class="header-anchor" href="#openmenuonfocus" aria-hidden="true">#</a> openMenuOnFocus</h3><p>Pressing <code>tab</code> in the form, datepicker menu will open</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:openMenuOnFocus</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1605,7 +1675,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="escclose" tabindex="-1"><a class="header-anchor" href="#escclose" aria-hidden="true">#</a> escClose</h3><p><code>Esc</code> key closes the menu</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="escclose" tabindex="-1"><a class="header-anchor" href="#escclose" aria-hidden="true">#</a> escClose</h3><p><code>Esc</code> key closes the menu</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:escClose</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1622,7 +1692,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="spaceconfirm" tabindex="-1"><a class="header-anchor" href="#spaceconfirm" aria-hidden="true">#</a> spaceConfirm</h3><p><code>space</code> key selects the date (like you pressed the select button)</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="spaceconfirm" tabindex="-1"><a class="header-anchor" href="#spaceconfirm" aria-hidden="true">#</a> spaceConfirm</h3><p><code>space</code> key selects the date (like you pressed the select button)</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:spaceConfirm</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1639,7 +1709,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonarrows" tabindex="-1"><a class="header-anchor" href="#monthchangeonarrows" aria-hidden="true">#</a> monthChangeOnArrows</h3><p>Change months via arrow keys</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonarrows" tabindex="-1"><a class="header-anchor" href="#monthchangeonarrows" aria-hidden="true">#</a> monthChangeOnArrows</h3><p>Change months via arrow keys</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:monthChangeOnArrows</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1656,7 +1726,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="look-and-feel" tabindex="-1"><a class="header-anchor" href="#look-and-feel" aria-hidden="true">#</a> Look and feel</h2><p>Customization options</p><h3 id="transitions" tabindex="-1"><a class="header-anchor" href="#transitions" aria-hidden="true">#</a> transitions</h3><p>Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in <a href="https://v3.vuejs.org/guide/transitions-overview.html" target="_blank" rel="noopener noreferrer">transitions<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop</p><ul><li>Type: <code>boolean | {open?: string; close?: string; next?: string; previous?: string}</code></li><li>Default: <code>true</code></li></ul><p><code>open</code> and <code>close</code> are added on overlays show/hide</p><p><code>next</code> and <code>previous</code> are added when switching months in the calendar</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="look-and-feel" tabindex="-1"><a class="header-anchor" href="#look-and-feel" aria-hidden="true">#</a> Look and feel</h2><p>Customization options</p><h3 id="transitions" tabindex="-1"><a class="header-anchor" href="#transitions" aria-hidden="true">#</a> transitions</h3><p>Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in <a href="https://v3.vuejs.org/guide/transitions-overview.html" target="_blank" rel="noopener noreferrer">transitions<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop</p><ul><li>Type: <code>boolean | {open?: string; close?: string; next?: string; previous?: string; menuAppear?: string; vNext?: string; vPrevious?: string; }</code></li><li>Default: <code>true</code></li></ul><p><code>menuAppear</code> is added on menu open</p><p><code>open</code> and <code>close</code> are added on overlays show/hide</p><p><code>next</code> and <code>previous</code> are added when switching months in the calendar</p><p><code>vNext</code> and <code>vPrevious</code> are added when switching months in the calendar in the <code>vertical</code> mode</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:transitions</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1673,7 +1743,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="dark" tabindex="-1"><a class="header-anchor" href="#dark" aria-hidden="true">#</a> dark</h3><p>Theme switch between the dark and light mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="dark" tabindex="-1"><a class="header-anchor" href="#dark" aria-hidden="true">#</a> dark</h3><p>Theme switch between the dark and light mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">dark</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1690,7 +1760,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideinputicon" tabindex="-1"><a class="header-anchor" href="#hideinputicon" aria-hidden="true">#</a> hideInputIcon</h3><p>Hide calendar icon in the input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input" value><!----><!----><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideinputicon" tabindex="-1"><a class="header-anchor" href="#hideinputicon" aria-hidden="true">#</a> hideInputIcon</h3><p>Hide calendar icon in the input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input" placeholder value autocomplete="off"><!----><!----><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hideInputIcon</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1707,7 +1777,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="state" tabindex="-1"><a class="header-anchor" href="#state" aria-hidden="true">#</a> state</h3><p>Validation state of the calendar value. Sets the green/red border depending on the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad dp__input_invalid" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="state" tabindex="-1"><a class="header-anchor" href="#state" aria-hidden="true">#</a> state</h3><p>Validation state of the calendar value. Sets the green/red border depending on the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad dp__input_invalid" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:state</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1724,7 +1794,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inputclassname" tabindex="-1"><a class="header-anchor" href="#inputclassname" aria-hidden="true">#</a> inputClassName</h3><p>Add a custom class to the input field</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad dp-custom-input" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inputclassname" tabindex="-1"><a class="header-anchor" href="#inputclassname" aria-hidden="true">#</a> inputClassName</h3><p>Add a custom class to the input field</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad dp-custom-input" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">inputClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-input<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1752,7 +1822,7 @@
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="menuclassname" tabindex="-1"><a class="header-anchor" href="#menuclassname" aria-hidden="true">#</a> menuClassName</h3><p>Add a custom class to the datepicker menu wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="menuclassname" tabindex="-1"><a class="header-anchor" href="#menuclassname" aria-hidden="true">#</a> menuClassName</h3><p>Add a custom class to the datepicker menu wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">menuClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-menu<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1775,7 +1845,7 @@
   <span class="token property">box-shadow</span><span class="token punctuation">:</span> 0 0 6px #1976d2<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="calendarclassname" tabindex="-1"><a class="header-anchor" href="#calendarclassname" aria-hidden="true">#</a> calendarClassName</h3><p>Add a custom class to the calendar wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="calendarclassname" tabindex="-1"><a class="header-anchor" href="#calendarclassname" aria-hidden="true">#</a> calendarClassName</h3><p>Add a custom class to the calendar wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">calendarClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-calendar<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1800,7 +1870,7 @@
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="calendarcellclassname" tabindex="-1"><a class="header-anchor" href="#calendarcellclassname" aria-hidden="true">#</a> calendarCellClassName</h3><p>Add a custom class to the calendar cell wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="calendarcellclassname" tabindex="-1"><a class="header-anchor" href="#calendarcellclassname" aria-hidden="true">#</a> calendarCellClassName</h3><p>Add a custom class to the calendar cell wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">calendarCellClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-cell<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1824,6 +1894,6 @@
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><!----><span class="next"><a href="/api/slots/" class="" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/api/slots/index.html b/docs/api/slots/index.html
index 44163e2e4..8c52acc1f 100644
--- a/docs/api/slots/index.html
+++ b/docs/api/slots/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,11 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Slots | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.94c6d9be.js"><link rel="modulepreload" href="/assets/index.html.ae7c0acf.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.94c6d9be.js"><link rel="modulepreload" href="/assets/index.html.f42a93ce.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#content" class="router-link-active router-link-exact-active sidebar-item" aria-label="Content"><!--[--><!--]--> Content <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#calendar-header" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendar-header"><!--[--><!--]--> calendar-header <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#day" class="router-link-active router-link-exact-active sidebar-item" aria-label="day"><!--[--><!--]--> day <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#action-select" class="router-link-active router-link-exact-active sidebar-item" aria-label="action-select"><!--[--><!--]--> action-select <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#action-preview" class="router-link-active router-link-exact-active sidebar-item" aria-label="action-preview"><!--[--><!--]--> action-preview <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#now-button" class="router-link-active router-link-exact-active sidebar-item" aria-label="now-button"><!--[--><!--]--> now-button <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#am-pm-button" class="router-link-active router-link-exact-active sidebar-item" aria-label="am-pm-button"><!--[--><!--]--> am-pm-button <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#trigger-and-input" class="router-link-active router-link-exact-active sidebar-item" aria-label="Trigger and input"><!--[--><!--]--> Trigger and input <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#trigger" class="router-link-active router-link-exact-active sidebar-item" aria-label="trigger"><!--[--><!--]--> trigger <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#dp-input" class="router-link-active router-link-exact-active sidebar-item" aria-label="dp-input"><!--[--><!--]--> dp-input <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#icons" class="router-link-active router-link-exact-active sidebar-item" aria-label="Icons"><!--[--><!--]--> Icons <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#input-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="input-icon"><!--[--><!--]--> input-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#clear-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="clear-icon"><!--[--><!--]--> clear-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#clock-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="clock-icon"><!--[--><!--]--> clock-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-left" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-left"><!--[--><!--]--> arrow-left <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-right" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-right"><!--[--><!--]--> arrow-right <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-up" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-up"><!--[--><!--]--> arrow-up <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-down" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-down"><!--[--><!--]--> arrow-down <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#calendar-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendar-icon"><!--[--><!--]--> calendar-icon <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="Overlay"><!--[--><!--]--> Overlay <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#time-picker-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="time-picker-overlay"><!--[--><!--]--> time-picker-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#hours" class="router-link-active router-link-exact-active sidebar-item" aria-label="hours"><!--[--><!--]--> hours <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#minutes" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutes"><!--[--><!--]--> minutes <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#hours-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="hours-overlay"><!--[--><!--]--> hours-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#minutes-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutes-overlay"><!--[--><!--]--> minutes-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#month" class="router-link-active router-link-exact-active sidebar-item" aria-label="month"><!--[--><!--]--> month <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#year" class="router-link-active router-link-exact-active sidebar-item" aria-label="year"><!--[--><!--]--> year <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#month-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="month-overlay"><!--[--><!--]--> month-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#year-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="year-overlay"><!--[--><!--]--> year-overlay <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="slots" tabindex="-1"><a class="header-anchor" href="#slots" aria-hidden="true">#</a> Slots</h1><p>Below is a list of available slots which you can use to change some default elements of the datepicker</p><h2 id="content" tabindex="-1"><a class="header-anchor" href="#content" aria-hidden="true">#</a> Content</h2><p>Customize parts in the datepicker menu</p><h3 id="calendar-header" tabindex="-1"><a class="header-anchor" href="#calendar-header" aria-hidden="true">#</a> calendar-header</h3><p>Replace the content in the calendar header cells</p><p>Available props are:</p><ul><li><code>day</code>: Displayed value in the header cell</li><li><code>index</code>: Column index it is rendered by</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#content" class="router-link-active router-link-exact-active sidebar-item" aria-label="Content"><!--[--><!--]--> Content <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#calendar-header" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendar-header"><!--[--><!--]--> calendar-header <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#day" class="router-link-active router-link-exact-active sidebar-item" aria-label="day"><!--[--><!--]--> day <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#action-select" class="router-link-active router-link-exact-active sidebar-item" aria-label="action-select"><!--[--><!--]--> action-select <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#action-preview" class="router-link-active router-link-exact-active sidebar-item" aria-label="action-preview"><!--[--><!--]--> action-preview <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#now-button" class="router-link-active router-link-exact-active sidebar-item" aria-label="now-button"><!--[--><!--]--> now-button <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#am-pm-button" class="router-link-active router-link-exact-active sidebar-item" aria-label="am-pm-button"><!--[--><!--]--> am-pm-button <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#trigger-and-input" class="router-link-active router-link-exact-active sidebar-item" aria-label="Trigger and input"><!--[--><!--]--> Trigger and input <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#trigger" class="router-link-active router-link-exact-active sidebar-item" aria-label="trigger"><!--[--><!--]--> trigger <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#dp-input" class="router-link-active router-link-exact-active sidebar-item" aria-label="dp-input"><!--[--><!--]--> dp-input <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#icons" class="router-link-active router-link-exact-active sidebar-item" aria-label="Icons"><!--[--><!--]--> Icons <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#input-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="input-icon"><!--[--><!--]--> input-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#clear-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="clear-icon"><!--[--><!--]--> clear-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#clock-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="clock-icon"><!--[--><!--]--> clock-icon <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-left" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-left"><!--[--><!--]--> arrow-left <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-right" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-right"><!--[--><!--]--> arrow-right <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-up" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-up"><!--[--><!--]--> arrow-up <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#arrow-down" class="router-link-active router-link-exact-active sidebar-item" aria-label="arrow-down"><!--[--><!--]--> arrow-down <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#calendar-icon" class="router-link-active router-link-exact-active sidebar-item" aria-label="calendar-icon"><!--[--><!--]--> calendar-icon <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><a aria-current="page" href="/api/slots/#overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="Overlay"><!--[--><!--]--> Overlay <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/api/slots/#time-picker-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="time-picker-overlay"><!--[--><!--]--> time-picker-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#hours" class="router-link-active router-link-exact-active sidebar-item" aria-label="hours"><!--[--><!--]--> hours <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#minutes" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutes"><!--[--><!--]--> minutes <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#hours-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="hours-overlay"><!--[--><!--]--> hours-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#minutes-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="minutes-overlay"><!--[--><!--]--> minutes-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#month" class="router-link-active router-link-exact-active sidebar-item" aria-label="month"><!--[--><!--]--> month <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#year" class="router-link-active router-link-exact-active sidebar-item" aria-label="year"><!--[--><!--]--> year <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#month-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="month-overlay"><!--[--><!--]--> month-overlay <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/api/slots/#year-overlay" class="router-link-active router-link-exact-active sidebar-item" aria-label="year-overlay"><!--[--><!--]--> year-overlay <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="slots" tabindex="-1"><a class="header-anchor" href="#slots" aria-hidden="true">#</a> Slots</h1><p>Below is a list of available slots which you can use to change some default elements of the datepicker</p><h2 id="content" tabindex="-1"><a class="header-anchor" href="#content" aria-hidden="true">#</a> Content</h2><p>Customize parts in the datepicker menu</p><h3 id="calendar-header" tabindex="-1"><a class="header-anchor" href="#calendar-header" aria-hidden="true">#</a> calendar-header</h3><p>Replace the content in the calendar header cells</p><p>Available props are:</p><ul><li><code>day</code>: Displayed value in the header cell</li><li><code>index</code>: Column index it is rendered by</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#calendar-header</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ index, day }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">:class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>index === 5 || index === 6 ? <span class="token punctuation">&#39;</span>red-color<span class="token punctuation">&#39;</span> : <span class="token punctuation">&#39;</span><span class="token punctuation">&#39;</span><span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -56,7 +56,7 @@
         <span class="token property">color</span><span class="token punctuation">:</span> red<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="day" tabindex="-1"><a class="header-anchor" href="#day" aria-hidden="true">#</a> day</h3><p>This slot allows you to place custom content in the calendar</p><p>This slot will also provide 2 props when used</p><ul><li><code>day</code>: This is the day number displayed in the calendar</li><li><code>date</code>: This is the date value from that day</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="day" tabindex="-1"><a class="header-anchor" href="#day" aria-hidden="true">#</a> day</h3><p>This slot allows you to place custom content in the calendar</p><p>This slot will also provide 2 props when used</p><ul><li><code>day</code>: This is the day number displayed in the calendar</li><li><code>date</code>: This is the date value from that day</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#day</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ day, date }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>temlplate</span> <span class="token attr-name">v-if</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>day === tomorrow<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -91,7 +91,7 @@
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></details><h3 id="action-select" tabindex="-1"><a class="header-anchor" href="#action-select" aria-hidden="true">#</a> action-select</h3><p>This slot replaces the select and cancel button section in the action row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></details><h3 id="action-select" tabindex="-1"><a class="header-anchor" href="#action-select" aria-hidden="true">#</a> action-select</h3><p>This slot replaces the select and cancel button section in the action row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#action-select</span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>custom-select<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>selectDate<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>Select<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">&gt;</span></span>
@@ -128,7 +128,7 @@
       <span class="token property">display</span><span class="token punctuation">:</span> inline-block<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br></div></div></details><h3 id="action-preview" tabindex="-1"><a class="header-anchor" href="#action-preview" aria-hidden="true">#</a> action-preview</h3><p>This slot replaces the date preview section in the action row</p><p>This slot will provide one prop</p><ul><li><code>value</code>: Current selection in the picker, this can be <code>Date</code> object, or in case of range, <code>Date</code> array</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br></div></div></details><h3 id="action-preview" tabindex="-1"><a class="header-anchor" href="#action-preview" aria-hidden="true">#</a> action-preview</h3><p>This slot replaces the date preview section in the action row</p><p>This slot will provide one prop</p><ul><li><code>value</code>: Current selection in the picker, this can be <code>Date</code> object, or in case of range, <code>Date</code> array</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#action-preview</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ getDate(value) }}
@@ -158,7 +158,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h3 id="now-button" tabindex="-1"><a class="header-anchor" href="#now-button" aria-hidden="true">#</a> now-button</h3><p>This slot replaces the content in the now button wrapper</p><div class="custom-container tip"><p class="custom-container-title">TIP</p><p>To use this slot, make sure that <a href="/api/props/#shownowbutton" class="">showNowButton prop</a> is enabled</p></div><p>One prop is available:</p><ul><li><code>selectCurrentDate</code> - Function to call to select the date</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h3 id="now-button" tabindex="-1"><a class="header-anchor" href="#now-button" aria-hidden="true">#</a> now-button</h3><p>This slot replaces the content in the now button wrapper</p><div class="custom-container tip"><p class="custom-container-title">TIP</p><p>To use this slot, make sure that <a href="/api/props/#shownowbutton" class="">showNowButton prop</a> is enabled</p></div><p>One prop is available:</p><ul><li><code>selectCurrentDate</code> - Function to call to select the date</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">showNowButton</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#now-button</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ selectCurrentDate }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>selectCurrentDate()<span class="token punctuation">&quot;</span></span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select current date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -189,7 +189,7 @@
     <span class="token property">cursor</span><span class="token punctuation">:</span> pointer<span class="token punctuation">;</span>
   <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="am-pm-button" tabindex="-1"><a class="header-anchor" href="#am-pm-button" aria-hidden="true">#</a> am-pm-button</h3><p>This slot replaces the am-pm button in the time picker when the <code>is24</code> prop is set to <code>false</code></p><p>Two props are available:</p><ul><li><code>toggle</code> - Function to call to switch AM/PM</li><li><code>value</code> - Currently active mode, AM or PM</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="am-pm-button" tabindex="-1"><a class="header-anchor" href="#am-pm-button" aria-hidden="true">#</a> am-pm-button</h3><p>This slot replaces the am-pm button in the time picker when the <code>is24</code> prop is set to <code>false</code></p><p>Two props are available:</p><ul><li><code>toggle</code> - Function to call to switch AM/PM</li><li><code>value</code> - Currently active mode, AM or PM</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder="Select Date" value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">showNowButton</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#am-pm-button</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ toggle, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>toggle<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>{{ value }}<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">&gt;</span></span>
@@ -259,7 +259,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h2 id="icons" tabindex="-1"><a class="header-anchor" href="#icons" aria-hidden="true">#</a> Icons</h2><p>Change datepicker icons</p><h3 id="input-icon" tabindex="-1"><a class="header-anchor" href="#input-icon" aria-hidden="true">#</a> input-icon</h3><p>This slot replaces the calendar icon in the input element with your custom element</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><span class="dp__input_icon"><!--[--><!--[--><img class="input-slot-image" src="/logo.png"><!--]--><!--]--></span><!----><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h2 id="icons" tabindex="-1"><a class="header-anchor" href="#icons" aria-hidden="true">#</a> Icons</h2><p>Change datepicker icons</p><h3 id="input-icon" tabindex="-1"><a class="header-anchor" href="#input-icon" aria-hidden="true">#</a> input-icon</h3><p>This slot replaces the calendar icon in the input element with your custom element</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><span class="dp__input_icon"><!--[--><!--[--><img class="input-slot-image" src="/logo.png"><!--]--><!--]--></span><!----><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#input-icon</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>input-slot-image<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -288,7 +288,7 @@
         <span class="token property">margin-left</span><span class="token punctuation">:</span> 5px<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="clear-icon" tabindex="-1"><a class="header-anchor" href="#clear-icon" aria-hidden="true">#</a> clear-icon</h3><p>This slot replaces the clear icon in the input element with your custom element</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><span class="dp__clear_icon"><!--[--><!--[--><img class="input-slot-image-clear" src="/logo.png"><!--]--><!--]--></span><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="clear-icon" tabindex="-1"><a class="header-anchor" href="#clear-icon" aria-hidden="true">#</a> clear-icon</h3><p>This slot replaces the clear icon in the input element with your custom element</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><span class="dp__clear_icon"><!--[--><!--[--><img class="input-slot-image-clear" src="/logo.png"><!--]--><!--]--></span><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#clear-icon</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ clear }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>input-slot-image<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>clear<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
@@ -317,7 +317,7 @@
         <span class="token property">margin-right</span><span class="token punctuation">:</span> 5px<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="clock-icon" tabindex="-1"><a class="header-anchor" href="#clock-icon" aria-hidden="true">#</a> clock-icon</h3><p>This slot replaces the default clock icon used to select the time</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="clock-icon" tabindex="-1"><a class="header-anchor" href="#clock-icon" aria-hidden="true">#</a> clock-icon</h3><p>This slot replaces the default clock icon used to select the time</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#clock-icon</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -345,7 +345,7 @@
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-left" tabindex="-1"><a class="header-anchor" href="#arrow-left" aria-hidden="true">#</a> arrow-left</h3><p>This slot replaces the arrow left icon on the month/year select row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-left" tabindex="-1"><a class="header-anchor" href="#arrow-left" aria-hidden="true">#</a> arrow-left</h3><p>This slot replaces the arrow left icon on the month/year select row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-left</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -373,7 +373,7 @@
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-right" tabindex="-1"><a class="header-anchor" href="#arrow-right" aria-hidden="true">#</a> arrow-right</h3><p>This slot replaces the arrow right icon on the month/year select row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-right" tabindex="-1"><a class="header-anchor" href="#arrow-right" aria-hidden="true">#</a> arrow-right</h3><p>This slot replaces the arrow right icon on the month/year select row</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-right</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -401,7 +401,7 @@
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-up" tabindex="-1"><a class="header-anchor" href="#arrow-up" aria-hidden="true">#</a> arrow-up</h3><p>This slot replaces the arrow up icon in the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-up" tabindex="-1"><a class="header-anchor" href="#arrow-up" aria-hidden="true">#</a> arrow-up</h3><p>This slot replaces the arrow up icon in the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-up</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -430,7 +430,7 @@
        <span class="token property">margin</span><span class="token punctuation">:</span> 0 auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="arrow-down" tabindex="-1"><a class="header-anchor" href="#arrow-down" aria-hidden="true">#</a> arrow-down</h3><p>This slot replaces the arrow down icon in the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="arrow-down" tabindex="-1"><a class="header-anchor" href="#arrow-down" aria-hidden="true">#</a> arrow-down</h3><p>This slot replaces the arrow down icon in the time picker</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-down</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -459,7 +459,7 @@
         <span class="token property">margin</span><span class="token punctuation">:</span> 0 auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="calendar-icon" tabindex="-1"><a class="header-anchor" href="#calendar-icon" aria-hidden="true">#</a> calendar-icon</h3><p>This slot replaces the back to calendar icon</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="calendar-icon" tabindex="-1"><a class="header-anchor" href="#calendar-icon" aria-hidden="true">#</a> calendar-icon</h3><p>This slot replaces the back to calendar icon</p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#calendar-icon</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -487,7 +487,7 @@
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h2 id="overlay" tabindex="-1"><a class="header-anchor" href="#overlay" aria-hidden="true">#</a> Overlay</h2><p>Customize overlay and overlay triggers</p><h3 id="time-picker-overlay" tabindex="-1"><a class="header-anchor" href="#time-picker-overlay" aria-hidden="true">#</a> time-picker-overlay</h3><p>This slot replaces the full overlay in the timepicker</p><p>Several props are available:</p><ul><li><code>range</code>: Value passed from general props</li><li><code>hours</code>: Selected hours value</li><li><code>minutes</code>: Selected minutes value</li><li><code>seconds</code>: Selected seconds value</li><li><code>setHours</code>: Function to call to set hours, <code>(hours: number | number[]) =&gt; void</code></li><li><code>setMinutes</code>: Function to call to set minutes, <code>(minutes: number | number[]) =&gt; void</code></li><li><code>setSeconds</code>: Function to call to set seconds, <code>(seconds: number | number[]) =&gt; void</code></li></ul><p><strong>If you are using range mode, make sure to pass number arrays in functions</strong></p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h2 id="overlay" tabindex="-1"><a class="header-anchor" href="#overlay" aria-hidden="true">#</a> Overlay</h2><p>Customize overlay and overlay triggers</p><h3 id="time-picker-overlay" tabindex="-1"><a class="header-anchor" href="#time-picker-overlay" aria-hidden="true">#</a> time-picker-overlay</h3><p>This slot replaces the full overlay in the timepicker</p><p>Several props are available:</p><ul><li><code>range</code>: Value passed from general props</li><li><code>hours</code>: Selected hours value</li><li><code>minutes</code>: Selected minutes value</li><li><code>seconds</code>: Selected seconds value</li><li><code>setHours</code>: Function to call to set hours, <code>(hours: number | number[]) =&gt; void</code></li><li><code>setMinutes</code>: Function to call to set minutes, <code>(minutes: number | number[]) =&gt; void</code></li><li><code>setSeconds</code>: Function to call to set seconds, <code>(seconds: number | number[]) =&gt; void</code></li></ul><p><strong>If you are using range mode, make sure to pass number arrays in functions</strong></p><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#time-picker-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ hours, minutes, setHours, setMinutes }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>time-picker-overlay<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -541,7 +541,7 @@
   <span class="token property">flex-direction</span><span class="token punctuation">:</span> column<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br></div></div></details><h3 id="hours" tabindex="-1"><a class="header-anchor" href="#hours" aria-hidden="true">#</a> hours</h3><p>This slot replaces the hours text between the arrows in the time picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br></div></div></details><h3 id="hours" tabindex="-1"><a class="header-anchor" href="#hours" aria-hidden="true">#</a> hours</h3><p>This slot replaces the hours text between the arrows in the time picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#hours</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -562,7 +562,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes" tabindex="-1"><a class="header-anchor" href="#minutes" aria-hidden="true">#</a> minutes</h3><p>This slot replaces the minutes text between the arrows in the time picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes" tabindex="-1"><a class="header-anchor" href="#minutes" aria-hidden="true">#</a> minutes</h3><p>This slot replaces the minutes text between the arrows in the time picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#minutes</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -583,7 +583,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="hours-overlay" tabindex="-1"><a class="header-anchor" href="#hours-overlay" aria-hidden="true">#</a> hours-overlay</h3><p>This slot replaces the text in the hours overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="hours-overlay" tabindex="-1"><a class="header-anchor" href="#hours-overlay" aria-hidden="true">#</a> hours-overlay</h3><p>This slot replaces the text in the hours overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#hours-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -604,7 +604,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes-overlay" tabindex="-1"><a class="header-anchor" href="#minutes-overlay" aria-hidden="true">#</a> minutes-overlay</h3><p>This slot replaces the text in the minutes overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes-overlay" tabindex="-1"><a class="header-anchor" href="#minutes-overlay" aria-hidden="true">#</a> minutes-overlay</h3><p>This slot replaces the text in the minutes overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#minutes-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -625,7 +625,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month" tabindex="-1"><a class="header-anchor" href="#month" aria-hidden="true">#</a> month</h3><p>This slot replaces the text in the month picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month" tabindex="-1"><a class="header-anchor" href="#month" aria-hidden="true">#</a> month</h3><p>This slot replaces the text in the month picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#month</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -646,7 +646,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year" tabindex="-1"><a class="header-anchor" href="#year" aria-hidden="true">#</a> year</h3><p>This slot replaces the text in the year picker</p><p>One props is available</p><ul><li><code>year</code>: Displayed year</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year" tabindex="-1"><a class="header-anchor" href="#year" aria-hidden="true">#</a> year</h3><p>This slot replaces the text in the year picker</p><p>One props is available</p><ul><li><code>year</code>: Displayed year</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#year</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ year }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ year }}
@@ -667,7 +667,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month-overlay" tabindex="-1"><a class="header-anchor" href="#month-overlay" aria-hidden="true">#</a> month-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month-overlay" tabindex="-1"><a class="header-anchor" href="#month-overlay" aria-hidden="true">#</a> month-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#month-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -688,7 +688,7 @@
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year-overlay" tabindex="-1"><a class="header-anchor" href="#year-overlay" aria-hidden="true">#</a> year-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available, although for the year, text and value are the same</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" value><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year-overlay" tabindex="-1"><a class="header-anchor" href="#year-overlay" aria-hidden="true">#</a> year-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available, although for the year, text and value are the same</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul><div class="demo-wrap"><div class="dp__main dp__theme_dark"><div aria-label="Datepicker input" role="textbox" aria-multiline="false" aria-disabled="false" aria-readonly="false"><!----><div class="dp__input_wrap"><!----><input ref_key="inputRef" class="dp__pointer dp__input dp__input_icon_pad" placeholder value autocomplete="off"><!----><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewbox="0 0 32 32" class="dp__icon dp__input_icon dp__input_icons"><path d="M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"></path><path d="M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"></path><path d="M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"></path></svg><!----><!----></div></div><span tabindex="-1" ref_key="focusRef"></span><!----></div></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#year-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -710,6 +710,6 @@
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/api/props/" class="" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a></span><span class="next"><a href="/api/components/" class="" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/assets/404.cadb687d.js b/docs/assets/404.cadb687d.js
deleted file mode 100644
index 0be18ef49..000000000
--- a/docs/assets/404.cadb687d.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as i,R as _,S as p,r as k,o as f,c as v,b as o,x as c,a as L,z as x,k as l,B as g}from"./app.519dac2e.js";const B={class:"theme-container"},N={class:"theme-default-content"},R=o("h1",null,"404",-1),V=i({setup(T){var a,s,n;const r=_(),e=p(),t=(a=e.value.notFound)!=null?a:["Not Found"],u=()=>t[Math.floor(Math.random()*t.length)],m=(s=e.value.home)!=null?s:r.value,h=(n=e.value.backToHome)!=null?n:"Back to home";return(b,C)=>{const d=k("RouterLink");return f(),v("div",B,[o("div",N,[R,o("blockquote",null,c(u()),1),L(d,{to:l(m)},{default:x(()=>[g(c(l(h)),1)]),_:1},8,["to"])])])}}});export{V as default};
diff --git a/docs/assets/404.fcd2b20d.js b/docs/assets/404.fcd2b20d.js
new file mode 100644
index 000000000..2ad34f9ce
--- /dev/null
+++ b/docs/assets/404.fcd2b20d.js
@@ -0,0 +1 @@
+import{_ as i,f as d,S as f,U as p,r as v,o as k,c as x,e as o,t as c,b as L,x as g,m as l,z as B}from"./app.46c9efaa.js";const N={class:"theme-container"},T={class:"theme-default-content"},b=o("h1",null,"404",-1),C=d({setup(M){var a,s,n;const r=f(),e=p(),t=(a=e.value.notFound)!=null?a:["Not Found"],u=()=>t[Math.floor(Math.random()*t.length)],_=(s=e.value.home)!=null?s:r.value,m=(n=e.value.backToHome)!=null?n:"Back to home";return(R,V)=>{const h=v("RouterLink");return k(),x("div",N,[o("div",T,[b,o("blockquote",null,c(u()),1),L(h,{to:l(_)},{default:g(()=>[B(c(l(m)),1)]),_:1},8,["to"])])])}}});var F=i(C,[["__file","404.vue"]]);export{F as default};
diff --git a/docs/assets/404.html.bee13de6.js b/docs/assets/404.html.bee13de6.js
deleted file mode 100644
index 88b1d3390..000000000
--- a/docs/assets/404.html.bee13de6.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as r}from"./plugin-vue_export-helper.21dcd24c.js";const _={};function e(t,c){return null}var a=r(_,[["render",e]]);export{a as default};
diff --git a/docs/assets/404.html.e8e82ae7.js b/docs/assets/404.html.e8e82ae7.js
new file mode 100644
index 000000000..b7a1e1c7e
--- /dev/null
+++ b/docs/assets/404.html.e8e82ae7.js
@@ -0,0 +1 @@
+import{_}from"./app.46c9efaa.js";const e={};function r(t,c){return null}var f=_(e,[["render",r],["__file","404.html.vue"]]);export{f as default};
diff --git a/docs/assets/ActionRowCmp.c89aff1b.js b/docs/assets/ActionRowCmp.c89aff1b.js
new file mode 100644
index 000000000..7de90358d
--- /dev/null
+++ b/docs/assets/ActionRowCmp.c89aff1b.js
@@ -0,0 +1 @@
+import{_ as c,f as i,j as u,o as d,c as f,e as r,t as _}from"./app.46c9efaa.js";const m=i({emits:["selectDate","cancel"],props:{selectText:{type:String,default:"Select"},cancelText:{type:String,default:"Cancel"},internalModelValue:{type:[Date,Array],default:null},range:{type:Boolean,default:!1},previewFormat:{type:[String,Function],default:()=>""},monthPicker:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1}},setup(e){return{date:u(()=>{if(e.internalModelValue){const n=e.internalModelValue.getDate(),a=e.internalModelValue.getMonth()+1,l=e.internalModelValue.getFullYear(),o=e.internalModelValue.getHours(),s=e.internalModelValue.getMinutes();return`${a}/${n}/${l}, ${o}:${s}`}return""})}}}),p={class:"custom-action-row"},y={class:"current-selection"};function g(e,t,n,a,l,o){return d(),f("div",p,[r("p",y,_(e.date),1),r("button",{class:"select-button",onClick:t[0]||(t[0]=s=>e.$emit("selectDate"))},"Select Date")])}var M=c(m,[["render",g],["__file","ActionRowCmp.vue"]]);export{M as default};
diff --git a/docs/assets/ActionRowCmp.e7f86045.js b/docs/assets/ActionRowCmp.e7f86045.js
deleted file mode 100644
index 205e321fd..000000000
--- a/docs/assets/ActionRowCmp.e7f86045.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as c,h as i,o as u,c as d,b as r,x as f}from"./app.519dac2e.js";import{_ as m}from"./plugin-vue_export-helper.21dcd24c.js";const p=c({emits:["selectDate","cancel"],props:{selectText:{type:String,default:"Select"},cancelText:{type:String,default:"Cancel"},internalModelValue:{type:[Date,Array],default:null},range:{type:Boolean,default:!1},previewFormat:{type:[String,Function],default:()=>""},monthPicker:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1}},setup(e){return{date:i(()=>{if(e.internalModelValue){const n=e.internalModelValue.getDate(),a=e.internalModelValue.getMonth()+1,l=e.internalModelValue.getFullYear(),o=e.internalModelValue.getHours(),s=e.internalModelValue.getMinutes();return`${a}/${n}/${l}, ${o}:${s}`}return""})}}}),_={class:"custom-action-row"},y={class:"current-selection"};function g(e,t,n,a,l,o){return u(),d("div",_,[r("p",y,f(e.date),1),r("button",{class:"select-button",onClick:t[0]||(t[0]=s=>e.$emit("selectDate"))},"Select Date")])}var V=m(p,[["render",g]]);export{V as default};
diff --git a/docs/assets/ChevronLeftIcon.ccfcd0b6.js b/docs/assets/ChevronLeftIcon.ccfcd0b6.js
new file mode 100644
index 000000000..7bb77ed90
--- /dev/null
+++ b/docs/assets/ChevronLeftIcon.ccfcd0b6.js
@@ -0,0 +1 @@
+import{_ as e,o,c as s,e as t}from"./app.46c9efaa.js";const c={},n={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},_=t("path",{d:"M20.943 23.057l-7.057-7.057c0 0 7.057-7.057 7.057-7.057 0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-8 8c-0.521 0.521-0.521 1.365 0 1.885l8 8c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),r=[_];function a(i,l){return o(),s("svg",n,r)}var d=e(c,[["render",a],["__file","ChevronLeftIcon.vue"]]);export{d as default};
diff --git a/docs/assets/ChevronLeftIcon.ce5da71b.js b/docs/assets/ChevronLeftIcon.ce5da71b.js
deleted file mode 100644
index 256f0c2a0..000000000
--- a/docs/assets/ChevronLeftIcon.ce5da71b.js
+++ /dev/null
@@ -1 +0,0 @@
-import{o as e,c as o,b as s}from"./app.519dac2e.js";import{_ as t}from"./plugin-vue_export-helper.21dcd24c.js";const c={},n={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},r=s("path",{d:"M20.943 23.057l-7.057-7.057c0 0 7.057-7.057 7.057-7.057 0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-8 8c-0.521 0.521-0.521 1.365 0 1.885l8 8c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),_=[r];function a(i,l){return e(),o("svg",n,_)}var f=t(c,[["render",a]]);export{f as default};
diff --git a/docs/assets/ChevronRightIcon.ca308293.js b/docs/assets/ChevronRightIcon.ca308293.js
deleted file mode 100644
index 710cd822d..000000000
--- a/docs/assets/ChevronRightIcon.ca308293.js
+++ /dev/null
@@ -1 +0,0 @@
-import{o as e,c as o,b as s}from"./app.519dac2e.js";import{_ as t}from"./plugin-vue_export-helper.21dcd24c.js";const c={},n={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},r=s("path",{d:"M12.943 24.943l8-8c0.521-0.521 0.521-1.365 0-1.885l-8-8c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885l7.057 7.057c0 0-7.057 7.057-7.057 7.057-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0z"},null,-1),_=[r];function a(i,h){return e(),o("svg",n,_)}var p=t(c,[["render",a]]);export{p as default};
diff --git a/docs/assets/ChevronRightIcon.d8c47dcc.js b/docs/assets/ChevronRightIcon.d8c47dcc.js
new file mode 100644
index 000000000..79932af9c
--- /dev/null
+++ b/docs/assets/ChevronRightIcon.d8c47dcc.js
@@ -0,0 +1 @@
+import{_ as e,o,c as s,e as t}from"./app.46c9efaa.js";const c={},n={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},_=t("path",{d:"M12.943 24.943l8-8c0.521-0.521 0.521-1.365 0-1.885l-8-8c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885l7.057 7.057c0 0-7.057 7.057-7.057 7.057-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0z"},null,-1),r=[_];function a(i,h){return o(),s("svg",n,r)}var d=e(c,[["render",a],["__file","ChevronRightIcon.vue"]]);export{d as default};
diff --git a/docs/assets/CustomComponentsDemo.6ffe54b1.js b/docs/assets/CustomComponentsDemo.6ffe54b1.js
deleted file mode 100644
index aac03a9f6..000000000
--- a/docs/assets/CustomComponentsDemo.6ffe54b1.js
+++ /dev/null
@@ -1 +0,0 @@
-import{d as t,_ as r,u as a,r as c,o as i,c as p,a as u}from"./app.519dac2e.js";import{U as _}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as d}from"./plugin-vue_export-helper.21dcd24c.js";const l=t(()=>r(()=>import("./MonthYearCmp.eb12c806.js"),["assets/MonthYearCmp.eb12c806.js","assets/ChevronLeftIcon.ce5da71b.js","assets/app.519dac2e.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/ChevronRightIcon.ca308293.js"])),k=t(()=>r(()=>import("./TimePickerCmp.212d1a54.js"),["assets/TimePickerCmp.212d1a54.js","assets/app.519dac2e.js","assets/plugin-vue_export-helper.21dcd24c.js"])),C=t(()=>r(()=>import("./ActionRowCmp.e7f86045.js"),["assets/ActionRowCmp.e7f86045.js","assets/app.519dac2e.js","assets/plugin-vue_export-helper.21dcd24c.js"])),h={components:{Datepicker:_},props:["useCustomMonthYear","useCustomTimePicker","useCustomActionRow"],data(){return{date:new Date,dark:!0}},mounted(){this.dark=a()},computed:{monthYearCmp(){return this.useCustomMonthYear?l:null},timePickerCmp(){return this.useCustomTimePicker?k:null},actionRowCmp(){return this.useCustomActionRow?C:null}}},f={class:"demo-wrap"};function w(D,n,P,R,e,o){const m=c("Datepicker");return i(),p("div",f,[u(m,{modelValue:e.date,"onUpdate:modelValue":n[0]||(n[0]=s=>e.date=s),dark:e.dark,"month-year-component":o.monthYearCmp,"time-picker-component":o.timePickerCmp,"action-row-component":o.actionRowCmp},null,8,["modelValue","dark","month-year-component","time-picker-component","action-row-component"])])}var V=d(h,[["render",w]]);export{V as default};
diff --git a/docs/assets/CustomComponentsDemo.f24f5159.js b/docs/assets/CustomComponentsDemo.f24f5159.js
new file mode 100644
index 000000000..96ca19b4b
--- /dev/null
+++ b/docs/assets/CustomComponentsDemo.f24f5159.js
@@ -0,0 +1 @@
+import{_ as a,d as t,a as n,u as c,r as i,o as u,c as p,b as _}from"./app.46c9efaa.js";import{Q as d}from"./vue-datepicker.es.9f3b8378.js";const l=t(()=>n(()=>import("./MonthYearCmp.03a1bd41.js"),["assets/MonthYearCmp.03a1bd41.js","assets/ChevronLeftIcon.ccfcd0b6.js","assets/app.46c9efaa.js","assets/ChevronRightIcon.d8c47dcc.js"])),k=t(()=>n(()=>import("./TimePickerCmp.48345a7c.js"),["assets/TimePickerCmp.48345a7c.js","assets/app.46c9efaa.js"])),C=t(()=>n(()=>import("./ActionRowCmp.c89aff1b.js"),["assets/ActionRowCmp.c89aff1b.js","assets/app.46c9efaa.js"])),h={components:{Datepicker:d},props:["useCustomMonthYear","useCustomTimePicker","useCustomActionRow"],data(){return{date:new Date,dark:!0}},mounted(){this.dark=c()},computed:{monthYearCmp(){return this.useCustomMonthYear?l:null},timePickerCmp(){return this.useCustomTimePicker?k:null},actionRowCmp(){return this.useCustomActionRow?C:null}}},D={class:"demo-wrap"};function f(w,r,P,v,e,o){const m=i("Datepicker");return u(),p("div",D,[_(m,{modelValue:e.date,"onUpdate:modelValue":r[0]||(r[0]=s=>e.date=s),dark:e.dark,"month-year-component":o.monthYearCmp,"time-picker-component":o.timePickerCmp,"action-row-component":o.actionRowCmp},null,8,["modelValue","dark","month-year-component","time-picker-component","action-row-component"])])}var E=a(h,[["render",f],["__file","CustomComponentsDemo.vue"]]);export{E as default};
diff --git a/docs/assets/DarkDemo.978c50ac.js b/docs/assets/DarkDemo.978c50ac.js
deleted file mode 100644
index b386ad1b9..000000000
--- a/docs/assets/DarkDemo.978c50ac.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as l}from"./vue-datepicker.es.e0a9f9bf.js";import{r as n,o as p,c,a as s}from"./app.519dac2e.js";import{_ as d}from"./plugin-vue_export-helper.21dcd24c.js";const m={components:{Datepicker:l},props:["placeholder"],data(){return{date:new Date}}},i={class:"demo-wrap"};function _(u,e,r,f,o,k){const a=n("Datepicker");return p(),c("div",i,[s(a,{modelValue:o.date,"onUpdate:modelValue":e[0]||(e[0]=t=>o.date=t),placeholder:r.placeholder,dark:""},null,8,["modelValue","placeholder"])])}var v=d(m,[["render",_]]);export{v as default};
diff --git a/docs/assets/DarkDemo.ff1cd9e5.js b/docs/assets/DarkDemo.ff1cd9e5.js
new file mode 100644
index 000000000..0a0f70755
--- /dev/null
+++ b/docs/assets/DarkDemo.ff1cd9e5.js
@@ -0,0 +1 @@
+import{Q as l}from"./vue-datepicker.es.9f3b8378.js";import{_ as n,r as c,o as p,c as s,b as d}from"./app.46c9efaa.js";const m={components:{Datepicker:l},props:["placeholder"],data(){return{date:new Date}}},_={class:"demo-wrap"};function i(u,e,a,f,o,k){const r=c("Datepicker");return p(),s("div",_,[d(r,{modelValue:o.date,"onUpdate:modelValue":e[0]||(e[0]=t=>o.date=t),placeholder:a.placeholder,dark:""},null,8,["modelValue","placeholder"])])}var v=n(m,[["render",i],["__file","DarkDemo.vue"]]);export{v as default};
diff --git a/docs/assets/Demo.b00e7c96.js b/docs/assets/Demo.b00e7c96.js
deleted file mode 100644
index 5ed729066..000000000
--- a/docs/assets/Demo.b00e7c96.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as o}from"./vue-datepicker.es.e0a9f9bf.js";import{u as i,r as l,o as m,c as d,a as c,E as u}from"./app.519dac2e.js";import{_ as p}from"./plugin-vue_export-helper.21dcd24c.js";const h={components:{Datepicker:o},props:["uid","is24","enableTimePicker","locale","cancelText","selectText","range","position","weekNumbers","placeholder","hoursIncrement","minutesIncrement","hoursGridIncrement","minutesGridIncrement","minDate","maxDate","minTime","maxTime","weekStart","disabled","readonly","inputClassName","menuClassName","hideInputIcon","state","clearable","closeOnScroll","autoApply","filters","disableMonthYearSelect","yearRange","disabledDates","inline","weekNumName","autoPosition","monthPicker","timePicker","closeOnAutoApply","calendarClassName","calendarCellClassName","teleport","startDate","startTime","monthNameFormat","autoRange","hideOffsetDates","noHoursOverlay","noMinutesOverlay","altPosition","multiCalendars","multiCalendarsSolo","partialRange","monthChangeOnScroll","transitions","modeHeight","enableSeconds","secondsIncrement","secondsGridIncrement","noSecondsOverlay","openMenuOnFocus","escClose","spaceConfirm","monthChangeOnArrows","inlineWithInput","name","autocomplete","preventMinMaxNavigation","fixedEnd","fixedStart","keepActionRow","reverseYears"],data(){return{date:null,dateReset:!1,dark:!0}},computed:{value:{get(){if(this.dateReset||this.maxTime||this.minTime||this.startDate||this.startTime)return null;if(this.date)return this.date;if(this.monthPicker)return{month:new Date().getMonth(),year:new Date().getFullYear()};if(this.timePicker){const e=new Date;return{hours:e.getHours(),minutes:e.getMinutes()}}if(this.range){const e=new Date,t=new Date(new Date().setDate(e.getDate()+7));return[e,t]}return new Date},set(e){this.dateReset=!e,this.date=e}}},mounted(){this.dark=i()}},D={class:"demo-wrap"};function f(e,t,k,g,n,a){const r=l("Datepicker");return m(),d("div",D,[c(r,u({modelValue:a.value,"onUpdate:modelValue":t[0]||(t[0]=s=>a.value=s)},e.$props,{dark:n.dark}),null,16,["modelValue","dark"])])}var C=p(h,[["render",f]]);export{C as default};
diff --git a/docs/assets/Demo.ff9daba9.js b/docs/assets/Demo.ff9daba9.js
new file mode 100644
index 000000000..d253b94e4
--- /dev/null
+++ b/docs/assets/Demo.ff9daba9.js
@@ -0,0 +1 @@
+import{Q as o}from"./vue-datepicker.es.9f3b8378.js";import{_ as i,u as l,r as m,o as c,c as d,b as u,D as p}from"./app.46c9efaa.js";const h={components:{Datepicker:o},props:["uid","is24","enableTimePicker","locale","cancelText","selectText","range","position","weekNumbers","placeholder","hoursIncrement","minutesIncrement","hoursGridIncrement","minutesGridIncrement","minDate","maxDate","minTime","maxTime","weekStart","disabled","readonly","inputClassName","menuClassName","hideInputIcon","state","clearable","closeOnScroll","autoApply","filters","disableMonthYearSelect","yearRange","disabledDates","inline","weekNumName","autoPosition","monthPicker","timePicker","closeOnAutoApply","calendarClassName","calendarCellClassName","teleport","startDate","startTime","monthNameFormat","autoRange","hideOffsetDates","noHoursOverlay","noMinutesOverlay","altPosition","multiCalendars","multiCalendarsSolo","partialRange","monthChangeOnScroll","transitions","modeHeight","enableSeconds","secondsIncrement","secondsGridIncrement","noSecondsOverlay","openMenuOnFocus","escClose","spaceConfirm","monthChangeOnArrows","inlineWithInput","name","autocomplete","preventMinMaxNavigation","fixedEnd","fixedStart","keepActionRow","reverseYears","vertical","noSwipe"],data(){return{date:null,dateReset:!1,dark:!0}},computed:{value:{get(){if(this.dateReset||this.maxTime||this.minTime||this.startDate||this.startTime)return null;if(this.date)return this.date;if(this.monthPicker)return{month:new Date().getMonth(),year:new Date().getFullYear()};if(this.timePicker){const e=new Date;return{hours:e.getHours(),minutes:e.getMinutes()}}if(this.range){const e=new Date,t=new Date(new Date().setDate(e.getDate()+7));return[e,t]}return new Date},set(e){this.dateReset=!e,this.date=e}}},mounted(){this.dark=l()}},D={class:"demo-wrap"};function f(e,t,k,_,n,a){const r=m("Datepicker");return c(),d("div",D,[u(r,p({modelValue:a.value,"onUpdate:modelValue":t[0]||(t[0]=s=>a.value=s)},e.$props,{dark:n.dark}),null,16,["modelValue","dark"])])}var w=i(h,[["render",f],["__file","Demo.vue"]]);export{w as default};
diff --git a/docs/assets/DemoMarkers.a0dd891d.js b/docs/assets/DemoMarkers.a0dd891d.js
deleted file mode 100644
index feff64b33..000000000
--- a/docs/assets/DemoMarkers.a0dd891d.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as d,a as t}from"./vue-datepicker.es.e0a9f9bf.js";import{u as l,r as n,o as p,c,a as m}from"./app.519dac2e.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:d},data(){return{date:new Date,dark:!0}},mounted(){this.dark=l()},computed:{markers(){return[{date:t(new Date,1),type:"dot",tooltip:[{text:"Dot with tooltip",color:"green"}]},{date:t(new Date,2),type:"line",tooltip:[{text:"First tooltip",color:"blue"},{text:"Second tooltip",color:"yellow"}]},{date:t(new Date,3),type:"dot",color:"yellow"}]}}},u={class:"demo-wrap"};function D(_,o,f,w,e,r){const a=n("Datepicker");return p(),c("div",u,[m(a,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=s=>e.date=s),dark:e.dark,markers:r.markers},null,8,["modelValue","dark","markers"])])}var v=i(k,[["render",D]]);export{v as default};
diff --git a/docs/assets/DemoMarkers.a7c0bac9.js b/docs/assets/DemoMarkers.a7c0bac9.js
new file mode 100644
index 000000000..a3577cc9d
--- /dev/null
+++ b/docs/assets/DemoMarkers.a7c0bac9.js
@@ -0,0 +1 @@
+import{Q as l,a as t}from"./vue-datepicker.es.9f3b8378.js";import{_ as d,u as n,r as p,o as c,c as m,b as i}from"./app.46c9efaa.js";const k={components:{Datepicker:l},data(){return{date:new Date,dark:!0}},mounted(){this.dark=n()},computed:{markers(){return[{date:t(new Date,1),type:"dot",tooltip:[{text:"Dot with tooltip",color:"green"}]},{date:t(new Date,2),type:"line",tooltip:[{text:"First tooltip",color:"blue"},{text:"Second tooltip",color:"yellow"}]},{date:t(new Date,3),type:"dot",color:"yellow"}]}}},u={class:"demo-wrap"};function _(D,o,f,w,e,r){const a=p("Datepicker");return c(),m("div",u,[i(a,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=s=>e.date=s),dark:e.dark,markers:r.markers},null,8,["modelValue","dark","markers"])])}var v=d(k,[["render",_],["__file","DemoMarkers.vue"]]);export{v as default};
diff --git a/docs/assets/DemoSlots.3a91cfc5.js b/docs/assets/DemoSlots.3a91cfc5.js
deleted file mode 100644
index 0e837e90e..000000000
--- a/docs/assets/DemoSlots.3a91cfc5.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as k}from"./vue-datepicker.es.e0a9f9bf.js";import{u as D,r as C,o as c,c as d,a as A,D as x,z as n,b as l,F as _,B as u,x as s,n as h,y as v}from"./app.519dac2e.js";import{_ as B}from"./plugin-vue_export-helper.21dcd24c.js";var i="/logo.png";const I={components:{Datepicker:k},props:["placeholder","useTriggerSlot","position","useInputIconSlot","useClearIconSlot","useClockIconSlot","useArrowLeftSlot","useArrowRightSlot","useArrowUpSlot","useArrowDownSlot","useCalendarIconSlot","useDaySlot","useActionButtonSlot","useActionPreviewSlot","useHoursSlot","useMinutesSlot","useMonthSlot","useYearSlot","useHoursOverlaySlot","useMinutesOverlaySlot","useMonthOverlaySlot","useYearOverlaySlot","useDpInputSlot","useCalendarHeaderSlot","useNowButtonSlot","showNowButton","is24","useAmPmButtonSlot","useTimePickerOverlay"],data(){return{date:this.showNowButton?null:new Date,dark:!0}},computed:{todayDay(){return new Date().getDate()+1},getDate(){return r=>`Selected ${new Date(r).getDate()}`},hoursArray(){const r=[];for(let o=0;o<24;o++)r.push({text:o<10?`0${o}`:o,value:o});return r},minutesArray(){const r=[];for(let o=0;o<60;o++)r.push({text:o<10?`0${o}`:o,value:o});return r}},mounted(){this.dark=D()},methods:{selectDate(){this.$refs.dpSlotDemo.selectDate()}}},O=l("p",{class:"clickable-text"},"This is some custom clickable text that will open datepicker",-1),M=["value"],b=l("img",{class:"input-slot-image",src:i},null,-1),N=["onClick"],T=l("img",{class:"slot-icon",src:i},null,-1),H=l("img",{class:"slot-icon",src:i},null,-1),P=l("img",{class:"slot-icon",src:i},null,-1),V=l("img",{class:"slot-icon-m",src:i},null,-1),U=l("img",{class:"slot-icon-m",src:i},null,-1),Y=l("img",{class:"slot-icon",src:i},null,-1),L={key:0,class:"slot-icon",src:i},p=["onClick"],z=l("img",{class:"slot-icon",src:i},null,-1),F=[z],R=["onClick"],E={class:"time-picker-overlay"},j=["value","onChange"],q=["value"],G=["value","onChange"],J=["value"];function K(r,o,t,Q,S,m){const g=C("Datepicker");return c(),d("div",{class:h(["demo-wrap",t.useDpInputSlot||t.useTriggerSlot?"demo-wrap-inline":""])},[A(g,{modelValue:S.date,"onUpdate:modelValue":o[1]||(o[1]=e=>S.date=e),placeholder:t.placeholder,dark:S.dark,position:t.position,is24:t.is24,ref:"dpSlotDemo","show-now-button":t.showNowButton},x({_:2},[t.useTriggerSlot?{name:"trigger",fn:n(()=>[O])}:void 0,t.useDpInputSlot?{name:"dp-input",fn:n(({value:e})=>[l("input",{type:"text",value:e},null,8,M)])}:void 0,t.useInputIconSlot?{name:"input-icon",fn:n(()=>[b])}:void 0,t.useClearIconSlot?{name:"clear-icon",fn:n(({clear:e})=>[l("img",{class:"input-slot-image-clear",src:i,onClick:e},null,8,N)])}:void 0,t.useClockIconSlot?{name:"clock-icon",fn:n(()=>[T])}:void 0,t.useArrowLeftSlot?{name:"arrow-left",fn:n(()=>[H])}:void 0,t.useArrowRightSlot?{name:"arrow-right",fn:n(()=>[P])}:void 0,t.useArrowUpSlot?{name:"arrow-up",fn:n(()=>[V])}:void 0,t.useArrowDownSlot?{name:"arrow-down",fn:n(()=>[U])}:void 0,t.useCalendarIconSlot?{name:"calendar-icon",fn:n(()=>[Y])}:void 0,t.useDaySlot?{name:"day",fn:n(({day:e})=>[e===m.todayDay?(c(),d("img",L)):(c(),d(_,{key:1},[u(s(e),1)],64))])}:void 0,t.useActionButtonSlot?{name:"action-select",fn:n(()=>[l("p",{class:"custom-select",onClick:o[0]||(o[0]=(...e)=>m.selectDate&&m.selectDate(...e))},"Select")])}:void 0,t.useActionPreviewSlot?{name:"action-preview",fn:n(({value:e})=>[u(s(m.getDate(e)),1)])}:void 0,t.useHoursSlot?{name:"hours",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMinutesSlot?{name:"minutes",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMonthSlot?{name:"month",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useYearSlot?{name:"year",fn:n(({year:e})=>[u(s(e),1)])}:void 0,t.useHoursOverlaySlot?{name:"hours-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMinutesOverlaySlot?{name:"minutes-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMonthOverlaySlot?{name:"month-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useYearOverlaySlot?{name:"year-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useCalendarHeaderSlot?{name:"calendar-header",fn:n(({index:e,day:f})=>[l("div",{class:h(e===5||e===6?"red-color":"")},s(f),3)])}:void 0,t.useNowButtonSlot?{name:"now-button",fn:n(({selectCurrentDate:e})=>[l("span",{onClick:f=>e(),title:"Select current date",class:"pointer"},F,8,p)])}:void 0,t.useAmPmButtonSlot?{name:"am-pm-button",fn:n(({toggle:e,value:f})=>[l("button",{onClick:e},s(f),9,R)])}:void 0,t.useTimePickerOverlay?{name:"time-picker-overlay",fn:n(({hours:e,minutes:f,setHours:w,setMinutes:y})=>[l("div",E,[l("select",{class:"select-input",value:e,onChange:a=>w(+a.target.value)},[(c(!0),d(_,null,v(m.hoursArray,a=>(c(),d("option",{key:a.value,value:a.value},s(a.text),9,q))),128))],40,j),l("select",{class:"select-input",value:f,onChange:a=>y(+a.target.value)},[(c(!0),d(_,null,v(m.minutesArray,a=>(c(),d("option",{key:a.value,value:a.value},s(a.text),9,J))),128))],40,G)])])}:void 0]),1032,["modelValue","placeholder","dark","position","is24","show-now-button"])],2)}var $=B(I,[["render",K]]);export{$ as default};
diff --git a/docs/assets/DemoSlots.994a1a00.js b/docs/assets/DemoSlots.994a1a00.js
new file mode 100644
index 000000000..4d29f3ed3
--- /dev/null
+++ b/docs/assets/DemoSlots.994a1a00.js
@@ -0,0 +1 @@
+import{Q as k}from"./vue-datepicker.es.9f3b8378.js";import{_ as D,u as C,r as A,o as c,c as d,b as x,C as I,x as n,e as l,F as _,z as u,t as s,n as h,v}from"./app.46c9efaa.js";var i="/logo.png";const B={components:{Datepicker:k},props:["placeholder","useTriggerSlot","position","useInputIconSlot","useClearIconSlot","useClockIconSlot","useArrowLeftSlot","useArrowRightSlot","useArrowUpSlot","useArrowDownSlot","useCalendarIconSlot","useDaySlot","useActionButtonSlot","useActionPreviewSlot","useHoursSlot","useMinutesSlot","useMonthSlot","useYearSlot","useHoursOverlaySlot","useMinutesOverlaySlot","useMonthOverlaySlot","useYearOverlaySlot","useDpInputSlot","useCalendarHeaderSlot","useNowButtonSlot","showNowButton","is24","useAmPmButtonSlot","useTimePickerOverlay"],data(){return{date:this.showNowButton?null:new Date,dark:!0}},computed:{todayDay(){return new Date().getDate()+1},getDate(){return r=>`Selected ${new Date(r).getDate()}`},hoursArray(){const r=[];for(let o=0;o<24;o++)r.push({text:o<10?`0${o}`:o,value:o});return r},minutesArray(){const r=[];for(let o=0;o<60;o++)r.push({text:o<10?`0${o}`:o,value:o});return r}},mounted(){this.dark=C()},methods:{selectDate(){this.$refs.dpSlotDemo.selectDate()}}},O=l("p",{class:"clickable-text"},"This is some custom clickable text that will open datepicker",-1),M=["value"],b=l("img",{class:"input-slot-image",src:i},null,-1),N=["onClick"],T=l("img",{class:"slot-icon",src:i},null,-1),H=l("img",{class:"slot-icon",src:i},null,-1),P=l("img",{class:"slot-icon",src:i},null,-1),V=l("img",{class:"slot-icon-m",src:i},null,-1),Y=l("img",{class:"slot-icon-m",src:i},null,-1),L=l("img",{class:"slot-icon",src:i},null,-1),U={key:0,class:"slot-icon",src:i},z=["onClick"],F=l("img",{class:"slot-icon",src:i},null,-1),Q=[F],R=["onClick"],p={class:"time-picker-overlay"},E=["value","onChange"],j=["value"],q=["value","onChange"],G=["value"];function J(r,o,t,K,S,m){const g=A("Datepicker");return c(),d("div",{class:h(["demo-wrap",t.useDpInputSlot||t.useTriggerSlot?"demo-wrap-inline":""])},[x(g,{modelValue:S.date,"onUpdate:modelValue":o[1]||(o[1]=e=>S.date=e),placeholder:t.placeholder,dark:S.dark,position:t.position,is24:t.is24,ref:"dpSlotDemo","show-now-button":t.showNowButton},I({_:2},[t.useTriggerSlot?{name:"trigger",fn:n(()=>[O])}:void 0,t.useDpInputSlot?{name:"dp-input",fn:n(({value:e})=>[l("input",{type:"text",value:e},null,8,M)])}:void 0,t.useInputIconSlot?{name:"input-icon",fn:n(()=>[b])}:void 0,t.useClearIconSlot?{name:"clear-icon",fn:n(({clear:e})=>[l("img",{class:"input-slot-image-clear",src:i,onClick:e},null,8,N)])}:void 0,t.useClockIconSlot?{name:"clock-icon",fn:n(()=>[T])}:void 0,t.useArrowLeftSlot?{name:"arrow-left",fn:n(()=>[H])}:void 0,t.useArrowRightSlot?{name:"arrow-right",fn:n(()=>[P])}:void 0,t.useArrowUpSlot?{name:"arrow-up",fn:n(()=>[V])}:void 0,t.useArrowDownSlot?{name:"arrow-down",fn:n(()=>[Y])}:void 0,t.useCalendarIconSlot?{name:"calendar-icon",fn:n(()=>[L])}:void 0,t.useDaySlot?{name:"day",fn:n(({day:e})=>[e===m.todayDay?(c(),d("img",U)):(c(),d(_,{key:1},[u(s(e),1)],64))])}:void 0,t.useActionButtonSlot?{name:"action-select",fn:n(()=>[l("p",{class:"custom-select",onClick:o[0]||(o[0]=(...e)=>m.selectDate&&m.selectDate(...e))},"Select")])}:void 0,t.useActionPreviewSlot?{name:"action-preview",fn:n(({value:e})=>[u(s(m.getDate(e)),1)])}:void 0,t.useHoursSlot?{name:"hours",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMinutesSlot?{name:"minutes",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMonthSlot?{name:"month",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useYearSlot?{name:"year",fn:n(({year:e})=>[u(s(e),1)])}:void 0,t.useHoursOverlaySlot?{name:"hours-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMinutesOverlaySlot?{name:"minutes-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useMonthOverlaySlot?{name:"month-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useYearOverlaySlot?{name:"year-overlay",fn:n(({value:e})=>[u(s(e),1)])}:void 0,t.useCalendarHeaderSlot?{name:"calendar-header",fn:n(({index:e,day:f})=>[l("div",{class:h(e===5||e===6?"red-color":"")},s(f),3)])}:void 0,t.useNowButtonSlot?{name:"now-button",fn:n(({selectCurrentDate:e})=>[l("span",{onClick:f=>e(),title:"Select current date",class:"pointer"},Q,8,z)])}:void 0,t.useAmPmButtonSlot?{name:"am-pm-button",fn:n(({toggle:e,value:f})=>[l("button",{onClick:e},s(f),9,R)])}:void 0,t.useTimePickerOverlay?{name:"time-picker-overlay",fn:n(({hours:e,minutes:f,setHours:w,setMinutes:y})=>[l("div",p,[l("select",{class:"select-input",value:e,onChange:a=>w(+a.target.value)},[(c(!0),d(_,null,v(m.hoursArray,a=>(c(),d("option",{key:a.value,value:a.value},s(a.text),9,j))),128))],40,E),l("select",{class:"select-input",value:f,onChange:a=>y(+a.target.value)},[(c(!0),d(_,null,v(m.minutesArray,a=>(c(),d("option",{key:a.value,value:a.value},s(a.text),9,G))),128))],40,q)])])}:void 0]),1032,["modelValue","placeholder","dark","position","is24","show-now-button"])],2)}var Z=D(B,[["render",J],["__file","DemoSlots.vue"]]);export{Z as default};
diff --git a/docs/assets/DisabledDatesDemo.19da2ab4.js b/docs/assets/DisabledDatesDemo.19da2ab4.js
deleted file mode 100644
index b8c86d5e5..000000000
--- a/docs/assets/DisabledDatesDemo.19da2ab4.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as n}from"./vue-datepicker.es.e0a9f9bf.js";import{u as c,r as m,o as l,c as p,a as D}from"./app.519dac2e.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const u={components:{Datepicker:n},data(){return{date:new Date,dark:!0}},computed:{disabledDates(){const o=new Date,e=new Date(o);e.setDate(e.getDate()+1);const t=new Date(e);return t.setDate(e.getDate()+1),[e,t]}},mounted(){this.dark=c()}},k={class:"demo-wrap"};function _(o,e,t,f,a,r){const s=m("Datepicker");return l(),p("div",k,[D(s,{modelValue:a.date,"onUpdate:modelValue":e[0]||(e[0]=d=>a.date=d),dark:a.dark,"disabled-dates":r.disabledDates},null,8,["modelValue","dark","disabled-dates"])])}var v=i(u,[["render",_]]);export{v as default};
diff --git a/docs/assets/DisabledDatesDemo.b0dc77ec.js b/docs/assets/DisabledDatesDemo.b0dc77ec.js
new file mode 100644
index 000000000..14672356f
--- /dev/null
+++ b/docs/assets/DisabledDatesDemo.b0dc77ec.js
@@ -0,0 +1 @@
+import{Q as n}from"./vue-datepicker.es.9f3b8378.js";import{_ as c,u as l,r as D,o as m,c as i,b as p}from"./app.46c9efaa.js";const u={components:{Datepicker:n},data(){return{date:new Date,dark:!0}},computed:{disabledDates(){const o=new Date,e=new Date(o);e.setDate(e.getDate()+1);const t=new Date(e);return t.setDate(e.getDate()+1),[e,t]}},mounted(){this.dark=l()}},_={class:"demo-wrap"};function k(o,e,t,f,a,s){const r=D("Datepicker");return m(),i("div",_,[p(r,{modelValue:a.date,"onUpdate:modelValue":e[0]||(e[0]=d=>a.date=d),dark:a.dark,"disabled-dates":s.disabledDates},null,8,["modelValue","dark","disabled-dates"])])}var v=c(u,[["render",k],["__file","DisabledDatesDemo.vue"]]);export{v as default};
diff --git a/docs/assets/EmptyDemo.3ce9ae38.js b/docs/assets/EmptyDemo.3ce9ae38.js
new file mode 100644
index 000000000..0173dfdc5
--- /dev/null
+++ b/docs/assets/EmptyDemo.3ce9ae38.js
@@ -0,0 +1 @@
+import{Q as i}from"./vue-datepicker.es.9f3b8378.js";import{_ as l,u as d,r,o as s,c as u,b as w}from"./app.46c9efaa.js";const c={components:{Datepicker:i},props:["placeholder","noToday","minTime","maxTime","startDate","startTime","disabledWeekDays","allowedDates","showNowButton","nowButtonLabel","multiDates","flow","minRange","maxRange","range","multiDatesLimit","weekPicker","monthPicker"],data(){return{date:null,dark:!0}},mounted(){this.dark=d()},computed:{hasAllowedDates(){return this.allowedDates?[new Date,new Date(new Date().setDate(new Date().getDate()+1))]:[]}}},k={class:"demo-wrap"};function D(h,a,e,b,t,n){const o=r("Datepicker");return s(),u("div",k,[w(o,{modelValue:t.date,"onUpdate:modelValue":a[0]||(a[0]=m=>t.date=m),placeholder:e.placeholder,dark:t.dark,"no-today":e.noToday,"min-time":e.minTime,"max-time":e.maxTime,"start-date":e.startDate,"start-time":e.startTime,"disabled-week-days":e.disabledWeekDays,"allowed-dates":n.hasAllowedDates,"show-now-button":e.showNowButton,"now-button-label":e.nowButtonLabel,"multi-dates":e.multiDates,"min-range":e.minRange,"max-range":e.maxRange,range:e.range,flow:e.flow,"multi-dates-limit":e.multiDatesLimit,"week-picker":e.weekPicker,"month-picker":e.monthPicker},null,8,["modelValue","placeholder","dark","no-today","min-time","max-time","start-date","start-time","disabled-week-days","allowed-dates","show-now-button","now-button-label","multi-dates","min-range","max-range","range","flow","multi-dates-limit","week-picker","month-picker"])])}var _=l(c,[["render",D],["__file","EmptyDemo.vue"]]);export{_ as default};
diff --git a/docs/assets/EmptyDemo.405dd01b.js b/docs/assets/EmptyDemo.405dd01b.js
deleted file mode 100644
index f90b0e0e0..000000000
--- a/docs/assets/EmptyDemo.405dd01b.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as i}from"./vue-datepicker.es.e0a9f9bf.js";import{u as l,r as d,o as r,c as s,a as u}from"./app.519dac2e.js";import{_ as w}from"./plugin-vue_export-helper.21dcd24c.js";const c={components:{Datepicker:i},props:["placeholder","noToday","minTime","maxTime","startDate","startTime","disabledWeekDays","allowedDates","showNowButton","nowButtonLabel","multiDates","flow","minRange","maxRange","range","multiDatesLimit","weekPicker","monthPicker"],data(){return{date:null,dark:!0}},mounted(){this.dark=l()},computed:{hasAllowedDates(){return this.allowedDates?[new Date,new Date(new Date().setDate(new Date().getDate()+1))]:[]}}},k={class:"demo-wrap"};function D(h,a,e,f,t,n){const o=d("Datepicker");return r(),s("div",k,[u(o,{modelValue:t.date,"onUpdate:modelValue":a[0]||(a[0]=m=>t.date=m),placeholder:e.placeholder,dark:t.dark,"no-today":e.noToday,"min-time":e.minTime,"max-time":e.maxTime,"start-date":e.startDate,"start-time":e.startTime,"disabled-week-days":e.disabledWeekDays,"allowed-dates":n.hasAllowedDates,"show-now-button":e.showNowButton,"now-button-label":e.nowButtonLabel,"multi-dates":e.multiDates,"min-range":e.minRange,"max-range":e.maxRange,range:e.range,flow:e.flow,"multi-dates-limit":e.multiDatesLimit,"week-picker":e.weekPicker,"month-picker":e.monthPicker},null,8,["modelValue","placeholder","dark","no-today","min-time","max-time","start-date","start-time","disabled-week-days","allowed-dates","show-now-button","now-button-label","multi-dates","min-range","max-range","range","flow","multi-dates-limit","week-picker","month-picker"])])}var _=w(c,[["render",D]]);export{_ as default};
diff --git a/docs/assets/FiltersDemo.343240a4.js b/docs/assets/FiltersDemo.343240a4.js
deleted file mode 100644
index a10405286..000000000
--- a/docs/assets/FiltersDemo.343240a4.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as d,f as l,u as p,h as m,r as c,o as i,c as f,a as u}from"./app.519dac2e.js";import{U as _,g as k,b as D}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as v}from"./plugin-vue_export-helper.21dcd24c.js";const h=d({components:{Datepicker:_},setup(){const e=l(new Date),t=p();return{filters:m(()=>{const r=new Date;return{months:Array.from(Array(3).keys()).map(a=>k(D(r,a+1)))}}),date:e,dark:t}}}),y={class:"demo-wrap"};function V(e,t,o,r,a,$){const s=c("Datepicker");return i(),f("div",y,[u(s,{modelValue:e.date,"onUpdate:modelValue":t[0]||(t[0]=n=>e.date=n),dark:e.dark,placeholder:"Select Date",filters:e.filters},null,8,["modelValue","dark","filters"])])}var U=v(h,[["render",V]]);export{U as default};
diff --git a/docs/assets/FiltersDemo.ab03492c.js b/docs/assets/FiltersDemo.ab03492c.js
new file mode 100644
index 000000000..18bf016d6
--- /dev/null
+++ b/docs/assets/FiltersDemo.ab03492c.js
@@ -0,0 +1 @@
+import{_ as l,f as d,g as p,u as c,j as i,r as m,o as u,c as f,b as _}from"./app.46c9efaa.js";import{Q as k,g as D,b as v}from"./vue-datepicker.es.9f3b8378.js";const y=d({components:{Datepicker:k},setup(){const e=p(new Date),t=c();return{filters:i(()=>{const r=new Date;return{months:Array.from(Array(3).keys()).map(a=>D(v(r,a+1)))}}),date:e,dark:t}}}),g={class:"demo-wrap"};function h(e,t,o,r,a,V){const s=m("Datepicker");return u(),f("div",g,[_(s,{modelValue:e.date,"onUpdate:modelValue":t[0]||(t[0]=n=>e.date=n),dark:e.dark,placeholder:"Select Date",filters:e.filters},null,8,["modelValue","dark","filters"])])}var F=l(y,[["render",h],["__file","FiltersDemo.vue"]]);export{F as default};
diff --git a/docs/assets/FormatDemo.ab6ffbb0.js b/docs/assets/FormatDemo.ab6ffbb0.js
deleted file mode 100644
index 1becb47e0..000000000
--- a/docs/assets/FormatDemo.ab6ffbb0.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as c}from"./vue-datepicker.es.e0a9f9bf.js";import{u as l,r as m,o as p,c as u,a as f}from"./app.519dac2e.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:c},props:["placeholder"],data(){return{date:new Date,dark:!0}},methods:{format(e){const o=e.getDate(),t=e.getMonth()+1,a=e.getFullYear();return`Selected date is ${o}/${t}/${a}`}},mounted(){this.dark=l()}},_={class:"demo-wrap"};function h(e,o,t,a,r,n){const s=m("Datepicker");return p(),u("div",_,[f(s,{modelValue:r.date,"onUpdate:modelValue":o[0]||(o[0]=d=>r.date=d),placeholder:t.placeholder,format:n.format,dark:r.dark},null,8,["modelValue","placeholder","format","dark"])])}var v=i(k,[["render",h]]);export{v as default};
diff --git a/docs/assets/FormatDemo.c36ba3a2.js b/docs/assets/FormatDemo.c36ba3a2.js
new file mode 100644
index 000000000..b64291ae4
--- /dev/null
+++ b/docs/assets/FormatDemo.c36ba3a2.js
@@ -0,0 +1 @@
+import{Q as l}from"./vue-datepicker.es.9f3b8378.js";import{_ as c,u as m,r as p,o as u,c as _,b as f}from"./app.46c9efaa.js";const i={components:{Datepicker:l},props:["placeholder"],data(){return{date:new Date,dark:!0}},methods:{format(e){const o=e.getDate(),t=e.getMonth()+1,a=e.getFullYear();return`Selected date is ${o}/${t}/${a}`}},mounted(){this.dark=m()}},k={class:"demo-wrap"};function h(e,o,t,a,r,n){const s=p("Datepicker");return u(),_("div",k,[f(s,{modelValue:r.date,"onUpdate:modelValue":o[0]||(o[0]=d=>r.date=d),placeholder:t.placeholder,format:n.format,dark:r.dark},null,8,["modelValue","placeholder","format","dark"])])}var V=c(i,[["render",h],["__file","FormatDemo.vue"]]);export{V as default};
diff --git a/docs/assets/Layout.30deb01a.js b/docs/assets/Layout.30deb01a.js
deleted file mode 100644
index fe7ad685e..000000000
--- a/docs/assets/Layout.30deb01a.js
+++ /dev/null
@@ -1 +0,0 @@
-var Be=Object.defineProperty,Me=Object.defineProperties;var De=Object.getOwnPropertyDescriptors;var de=Object.getOwnPropertySymbols;var Ee=Object.prototype.hasOwnProperty,Ne=Object.prototype.propertyIsEnumerable;var ve=(l,t,e)=>t in l?Be(l,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):l[t]=e,X=(l,t)=>{for(var e in t||(t={}))Ee.call(t,e)&&ve(l,e,t[e]);if(de)for(var e of de(t))Ne.call(t,e)&&ve(l,e,t[e]);return l},Y=(l,t)=>Me(l,De(t));import{r as R,o as a,c,a as $,e as x,U as I,h as p,V as _e,k as n,F as D,y as A,b as g,x as T,j as w,W as G,X as Q,l as C,z as B,E as pe,i as y,B as U,Y as q,Z as Ie,$ as Pe,a0 as Re,a1 as Z,u as J,n as P,a2 as V,a3 as fe,a4 as me,R as be,S as M,T as ge,f as O,s as Ae,a5 as j,a6 as K,a7 as He,a8 as Oe,a9 as ee,aa as ke,ab as $e,Q as ze,q as Le,A as Fe,ac as W,ad as te,ae as We,w as Ue,H as Ve,af as je}from"./app.519dac2e.js";import{_ as Ke}from"./plugin-vue_export-helper.21dcd24c.js";const Ge={},qe={class:"theme-default-content custom"};function Xe(l,t){const e=R("Content");return a(),c("div",qe,[$(e)])}var Ye=Ke(Ge,[["render",Xe]]);const Qe={key:0,class:"features"},Ze=x({setup(l){const t=I(),e=p(()=>_e(t.value.features)?t.value.features:[]);return(i,r)=>n(e).length?(a(),c("div",Qe,[(a(!0),c(D,null,A(n(e),_=>(a(),c("div",{key:_.title,class:"feature"},[g("h2",null,T(_.title),1),g("p",null,T(_.details),1)]))),128))])):w("",!0)}}),Je=["innerHTML"],et=["textContent"],tt=x({setup(l){const t=I(),e=p(()=>t.value.footer),i=p(()=>t.value.footerHtml);return(r,_)=>n(e)?(a(),c(D,{key:0},[n(i)?(a(),c("div",{key:0,class:"footer",innerHTML:n(e)},null,8,Je)):(a(),c("div",{key:1,class:"footer",textContent:T(n(e))},null,8,et))],64)):w("",!0)}}),nt=["href","rel","target","aria-label"],at=x({inheritAttrs:!1}),N=x(Y(X({},at),{props:{item:{type:Object,required:!0}},setup(l){const t=l,e=G(),i=Re(),{item:r}=Q(t),_=p(()=>q(r.value.link)),f=p(()=>Ie(r.value.link)||Pe(r.value.link)),h=p(()=>{if(!f.value){if(r.value.target)return r.value.target;if(_.value)return"_blank"}}),s=p(()=>h.value==="_blank"),o=p(()=>!_.value&&!f.value&&!s.value),u=p(()=>{if(!f.value){if(r.value.rel)return r.value.rel;if(s.value)return"noopener noreferrer"}}),d=p(()=>r.value.ariaLabel||r.value.text),v=p(()=>{const L=Object.keys(i.value.locales);return L.length?!L.some(m=>m===r.value.link):r.value.link!=="/"}),b=p(()=>v.value?e.path.startsWith(r.value.link):!1),k=p(()=>o.value?r.value.activeMatch?new RegExp(r.value.activeMatch).test(e.path):b.value:!1);return(L,m)=>{const S=R("RouterLink"),E=R("ExternalLinkIcon");return n(o)?(a(),C(S,pe({key:0,class:{"router-link-active":n(k)},to:n(r).link,"aria-label":n(d)},L.$attrs),{default:B(()=>[y(L.$slots,"before"),U(" "+T(n(r).text)+" ",1),y(L.$slots,"after")]),_:3},16,["class","to","aria-label"])):(a(),c("a",pe({key:1,class:"external-link",href:n(r).link,rel:n(u),target:n(h),"aria-label":n(d)},L.$attrs),[y(L.$slots,"before"),U(" "+T(n(r).text)+" ",1),n(s)?(a(),C(E,{key:0})):w("",!0),y(L.$slots,"after")],16,nt))}}})),st={class:"hero"},rt={key:0,id:"main-title"},ot={key:1,class:"description"},lt={key:2,class:"actions"},ut=x({setup(l){const t=I(),e=Z(),i=J(),r=p(()=>i.value&&t.value.heroImageDark!==void 0?t.value.heroImageDark:t.value.heroImage),_=p(()=>t.value.heroText===null?null:t.value.heroText||e.value.title||"Hello"),f=p(()=>t.value.heroAlt||_.value||"hero"),h=p(()=>t.value.tagline===null?null:t.value.tagline||e.value.description||"Welcome to your VuePress site"),s=p(()=>_e(t.value.actions)?t.value.actions.map(({text:u,link:d,type:v="primary"})=>({text:u,link:d,type:v})):[]),o=()=>{if(!r.value)return null;const u=V("img",{src:fe(r.value),alt:f.value});return t.value.heroImageDark===void 0?u:V(me,()=>u)};return(u,d)=>(a(),c("header",st,[$(o),n(_)?(a(),c("h1",rt,T(n(_)),1)):w("",!0),n(h)?(a(),c("p",ot,T(n(h)),1)):w("",!0),n(s).length?(a(),c("p",lt,[(a(!0),c(D,null,A(n(s),v=>(a(),C(N,{key:v.text,class:P(["action-button",[v.type]]),item:v},null,8,["class","item"]))),128))])):w("",!0)]))}}),it={class:"home"},ct=x({setup(l){return(t,e)=>(a(),c("main",it,[$(ut),$(Ze),$(Ye),$(tt)]))}}),dt=x({setup(l){const t=be(),e=Z(),i=M(),r=J(),_=p(()=>i.value.home||t.value),f=p(()=>e.value.title),h=p(()=>r.value&&i.value.logoDark!==void 0?i.value.logoDark:i.value.logo),s=()=>{if(!h.value)return null;const o=V("img",{class:"logo",src:fe(h.value),alt:f.value});return i.value.logoDark===void 0?o:V(me,()=>o)};return(o,u)=>{const d=R("RouterLink");return a(),C(d,{to:n(_)},{default:B(()=>[$(s),n(f)?(a(),c("span",{key:0,class:P(["site-name",{"can-hide":n(h)}])},T(n(f)),3)):w("",!0)]),_:1},8,["to"])}}}),ye=x({setup(l){const t=i=>{i.style.height=i.scrollHeight+"px"},e=i=>{i.style.height=""};return(i,r)=>(a(),C(ge,{name:"dropdown",onEnter:t,onAfterEnter:e,onBeforeLeave:t},{default:B(()=>[y(i.$slots,"default")]),_:3}))}}),vt=["aria-label"],pt={class:"title"},ht=g("span",{class:"arrow down"},null,-1),_t=["aria-label"],ft={class:"title"},mt={class:"navbar-dropdown"},bt={class:"navbar-dropdown-subtitle"},gt={key:1},kt={class:"navbar-dropdown-subitem-wrapper"},$t=x({props:{item:{type:Object,required:!0}},setup(l){const t=l,{item:e}=Q(t),i=p(()=>e.value.ariaLabel||e.value.text),r=O(!1),_=G();Ae(()=>_.path,()=>{r.value=!1});const f=s=>{s.detail===0?r.value=!r.value:r.value=!1},h=(s,o)=>o[o.length-1]===s;return(s,o)=>(a(),c("div",{class:P(["navbar-dropdown-wrapper",{open:r.value}])},[g("button",{class:"navbar-dropdown-title",type:"button","aria-label":n(i),onClick:f},[g("span",pt,T(n(e).text),1),ht],8,vt),g("button",{class:"navbar-dropdown-title-mobile",type:"button","aria-label":n(i),onClick:o[0]||(o[0]=u=>r.value=!r.value)},[g("span",ft,T(n(e).text),1),g("span",{class:P(["arrow",r.value?"down":"right"])},null,2)],8,_t),$(ye,null,{default:B(()=>[j(g("ul",mt,[(a(!0),c(D,null,A(n(e).children,u=>(a(),c("li",{key:u.text,class:"navbar-dropdown-item"},[u.children?(a(),c(D,{key:0},[g("h4",bt,[u.link?(a(),C(N,{key:0,item:u,onFocusout:d=>h(u,n(e).children)&&u.children.length===0&&(r.value=!1)},null,8,["item","onFocusout"])):(a(),c("span",gt,T(u.text),1))]),g("ul",kt,[(a(!0),c(D,null,A(u.children,d=>(a(),c("li",{key:d.link,class:"navbar-dropdown-subitem"},[$(N,{item:d,onFocusout:v=>h(d,u.children)&&h(u,n(e).children)&&(r.value=!1)},null,8,["item","onFocusout"])]))),128))])],64)):(a(),C(N,{key:1,item:u,onFocusout:d=>h(u,n(e).children)&&(r.value=!1)},null,8,["item","onFocusout"]))]))),128))],512),[[K,r.value]])]),_:1})],2))}}),he=l=>decodeURI(l).replace(/#.*$/,"").replace(/(index)?\.(md|html)$/,""),Lt=(l,t)=>{if(t.hash===l)return!0;const e=he(t.path),i=he(l);return e===i},we=(l,t)=>l.link&&Lt(l.link,t)?!0:l.children?l.children.some(e=>we(e,t)):!1,xe=l=>!q(l)||/github\.com/.test(l)?"GitHub":/bitbucket\.org/.test(l)?"Bitbucket":/gitlab\.com/.test(l)?"GitLab":/gitee\.com/.test(l)?"Gitee":null,yt={GitHub:":repo/edit/:branch/:path",GitLab:":repo/-/edit/:branch/:path",Gitee:":repo/edit/:branch/:path",Bitbucket:":repo/src/:branch/:path?mode=edit&spa=0&at=:branch&fileviewer=file-view-default"},wt=({docsRepo:l,editLinkPattern:t})=>{if(t)return t;const e=xe(l);return e!==null?yt[e]:null},xt=({docsRepo:l,docsBranch:t,docsDir:e,filePathRelative:i,editLinkPattern:r})=>{if(!i)return null;const _=wt({docsRepo:l,editLinkPattern:r});return _?_.replace(/:repo/,q(l)?l:`https://github.com/${l}`).replace(/:branch/,t).replace(/:path/,He(`${Oe(e)}/${i}`)):null},Ct={key:0,class:"navbar-items"},Ce=x({setup(l){const t=()=>{const o=ee(),u=be(),d=Z(),v=M();return p(()=>{var S,E;const b=Object.keys(d.value.locales);if(b.length<2)return[];const k=o.currentRoute.value.path,L=o.currentRoute.value.fullPath;return[{text:(S=v.value.selectLanguageText)!=null?S:"unknown language",ariaLabel:(E=v.value.selectLanguageAriaLabel)!=null?E:"unkown language",children:b.map(H=>{var se,re,oe,le,ue,ie;const z=(re=(se=d.value.locales)==null?void 0:se[H])!=null?re:{},ne=(le=(oe=v.value.locales)==null?void 0:oe[H])!=null?le:{},ae=`${z.lang}`,Te=(ue=ne.selectLanguageName)!=null?ue:ae;let F;if(ae===d.value.lang)F=L;else{const ce=k.replace(u.value,H);o.getRoutes().some(Se=>Se.path===ce)?F=ce:F=(ie=ne.home)!=null?ie:H}return{text:Te,link:F}})}]})},e=()=>{const o=M(),u=p(()=>o.value.repo),d=p(()=>u.value?xe(u.value):null),v=p(()=>u.value&&!q(u.value)?`https://github.com/${u.value}`:u.value),b=p(()=>v.value?o.value.repoLabel?o.value.repoLabel:d.value===null?"Source":d.value:null);return p(()=>!v.value||!b.value?[]:[{text:b.value,link:v.value}])},i=o=>ke(o)?$e(o):o.children?Y(X({},o),{children:o.children.map(i)}):o,_=(()=>{const o=M();return p(()=>(o.value.navbar||[]).map(i))})(),f=t(),h=e(),s=p(()=>[..._.value,...f.value,...h.value]);return(o,u)=>n(s).length?(a(),c("nav",Ct,[(a(!0),c(D,null,A(n(s),d=>(a(),c("div",{key:d.text,class:"navbar-item"},[d.children?(a(),C($t,{key:0,item:d},null,8,["item"])):(a(),C(N,{key:1,item:d},null,8,["item"]))]))),128))])):w("",!0)}}),Tt=["title"],St={class:"icon",focusable:"false",viewBox:"0 0 32 32"},Bt=ze('<path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path>',9),Mt=[Bt],Dt={class:"icon",focusable:"false",viewBox:"0 0 32 32"},Et=g("path",{d:"M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z",fill:"currentColor"},null,-1),Nt=[Et],It=x({setup(l){const t=M(),e=J(),i=()=>{e.value=!e.value};return(r,_)=>(a(),c("button",{class:"toggle-dark-button",title:n(t).toggleDarkMode,onClick:i},[j((a(),c("svg",St,Mt,512)),[[K,!n(e)]]),j((a(),c("svg",Dt,Nt,512)),[[K,n(e)]])],8,Tt))}}),Pt=["title"],Rt=g("div",{class:"icon","aria-hidden":"true"},[g("span"),g("span"),g("span")],-1),At=[Rt],Ht=x({emits:["toggle"],setup(l){const t=M();return(e,i)=>(a(),c("div",{class:"toggle-sidebar-button",title:n(t).toggleSidebar,"aria-expanded":"false",role:"button",tabindex:"0",onClick:i[0]||(i[0]=r=>e.$emit("toggle"))},At,8,Pt))}}),Ot=x({emits:["toggle-sidebar"],setup(l){const t=M(),e=O(null),i=O(null),r=O(0),_=p(()=>r.value?{maxWidth:r.value+"px"}:{}),f=p(()=>t.value.darkMode);Le(()=>{const o=h(e.value,"paddingLeft")+h(e.value,"paddingRight"),u=()=>{var d;window.innerWidth<=719?r.value=0:r.value=e.value.offsetWidth-o-(((d=i.value)==null?void 0:d.offsetWidth)||0)};u(),window.addEventListener("resize",u,!1),window.addEventListener("orientationchange",u,!1)});function h(s,o){var v,b,k;const u=(k=(b=(v=s==null?void 0:s.ownerDocument)==null?void 0:v.defaultView)==null?void 0:b.getComputedStyle(s,null))==null?void 0:k[o],d=Number.parseInt(u,10);return Number.isNaN(d)?0:d}return(s,o)=>{const u=R("NavbarSearch");return a(),c("header",{ref_key:"navbar",ref:e,class:"navbar"},[$(Ht,{onToggle:o[0]||(o[0]=d=>s.$emit("toggle-sidebar"))}),g("span",{ref_key:"navbarBrand",ref:i},[$(dt)],512),g("div",{class:"navbar-items-wrapper",style:Fe(n(_))},[y(s.$slots,"before"),$(Ce,{class:"can-hide"}),y(s.$slots,"after"),n(f)?(a(),C(It,{key:0})):w("",!0),$(u)],4)],512)}}}),zt={class:"page-meta"},Ft={key:0,class:"meta-item edit-link"},Wt={key:1,class:"meta-item last-updated"},Ut={class:"meta-item-label"},Vt={class:"meta-item-info"},jt={key:2,class:"meta-item contributors"},Kt={class:"meta-item-label"},Gt={class:"meta-item-info"},qt=["title"],Xt=U(", "),Yt=x({setup(l){const t=()=>{const s=M(),o=W(),u=I();return p(()=>{var E,H,z;if(!((H=(E=u.value.editLink)!=null?E:s.value.editLink)!=null?H:!0))return null;const{repo:v,docsRepo:b=v,docsBranch:k="main",docsDir:L="",editLinkText:m}=s.value;if(!b)return null;const S=xt({docsRepo:b,docsBranch:k,docsDir:L,filePathRelative:o.value.filePathRelative,editLinkPattern:(z=u.value.editLinkPattern)!=null?z:s.value.editLinkPattern});return S?{text:m!=null?m:"Edit this page",link:S}:null})},e=()=>{const s=M(),o=W(),u=I();return p(()=>{var b,k,L,m;return!((k=(b=u.value.lastUpdated)!=null?b:s.value.lastUpdated)!=null?k:!0)||!((L=o.value.git)!=null&&L.updatedTime)?null:new Date((m=o.value.git)==null?void 0:m.updatedTime).toLocaleString()})},i=()=>{const s=M(),o=W(),u=I();return p(()=>{var v,b,k,L;return((b=(v=u.value.contributors)!=null?v:s.value.contributors)!=null?b:!0)&&(L=(k=o.value.git)==null?void 0:k.contributors)!=null?L:null})},r=M(),_=t(),f=e(),h=i();return(s,o)=>{const u=R("ClientOnly");return a(),c("footer",zt,[n(_)?(a(),c("div",Ft,[$(N,{class:"meta-item-label",item:n(_)},null,8,["item"])])):w("",!0),n(f)?(a(),c("div",Wt,[g("span",Ut,T(n(r).lastUpdatedText)+": ",1),$(u,null,{default:B(()=>[g("span",Vt,T(n(f)),1)]),_:1})])):w("",!0),n(h)&&n(h).length?(a(),c("div",jt,[g("span",Kt,T(n(r).contributorsText)+": ",1),g("span",Gt,[(a(!0),c(D,null,A(n(h),(d,v)=>(a(),c(D,{key:v},[g("span",{class:"contributor",title:`email: ${d.email}`},T(d.name),9,qt),v!==n(h).length-1?(a(),c(D,{key:0},[Xt],64)):w("",!0)],64))),128))])])):w("",!0)])}}}),Qt={key:0,class:"page-nav"},Zt={class:"inner"},Jt={key:0,class:"prev"},en={key:1,class:"next"},tn=x({setup(l){const t=s=>s===!1?null:ke(s)?$e(s):We(s)?s:!1,e=(s,o,u)=>{const d=s.findIndex(v=>v.link===o);if(d!==-1){const v=s[d+u];return v!=null&&v.link?v:null}for(const v of s)if(v.children){const b=e(v.children,o,u);if(b)return b}return null},i=I(),r=te(),_=G(),f=p(()=>{const s=t(i.value.prev);return s!==!1?s:e(r.value,_.path,-1)}),h=p(()=>{const s=t(i.value.next);return s!==!1?s:e(r.value,_.path,1)});return(s,o)=>n(f)||n(h)?(a(),c("nav",Qt,[g("p",Zt,[n(f)?(a(),c("span",Jt,[$(N,{item:n(f)},null,8,["item"])])):w("",!0),n(h)?(a(),c("span",en,[$(N,{item:n(h)},null,8,["item"])])):w("",!0)])])):w("",!0)}}),nn={class:"page"},an={class:"theme-default-content"},sn=x({setup(l){return(t,e)=>{const i=R("Content");return a(),c("main",nn,[y(t.$slots,"top"),g("div",an,[$(i)]),$(Yt),$(tn),y(t.$slots,"bottom")])}}}),rn={class:"sidebar-item-children"},on=x({props:{item:{type:Object,required:!0},depth:{type:Number,required:!1,default:0}},setup(l){const t=l,{item:e,depth:i}=Q(t),r=G(),_=ee(),f=p(()=>we(e.value,r)),h=p(()=>({"sidebar-item":!0,"sidebar-heading":i.value===0,active:f.value,collapsible:e.value.collapsible})),s=O(!0),o=O(void 0);return e.value.collapsible&&(s.value=f.value,o.value=()=>{s.value=!s.value},_.afterEach(()=>{s.value=f.value})),(u,d)=>{var b;const v=R("SidebarItem",!0);return a(),c("li",null,[n(e).link?(a(),C(N,{key:0,class:P(n(h)),item:n(e)},null,8,["class","item"])):(a(),c("p",{key:1,tabindex:"0",class:P(n(h)),onClick:d[0]||(d[0]=(...k)=>o.value&&o.value(...k)),onKeydown:d[1]||(d[1]=Ue((...k)=>o.value&&o.value(...k),["enter"]))},[U(T(n(e).text)+" ",1),n(e).collapsible?(a(),c("span",{key:0,class:P(["arrow",s.value?"down":"right"])},null,2)):w("",!0)],34)),(b=n(e).children)!=null&&b.length?(a(),C(ye,{key:2},{default:B(()=>[j(g("ul",rn,[(a(!0),c(D,null,A(n(e).children,k=>(a(),C(v,{key:`${n(i)}${k.text}${k.link}`,item:k,depth:n(i)+1},null,8,["item","depth"]))),128))],512),[[K,s.value]])]),_:1})):w("",!0)])}}}),ln={key:0,class:"sidebar-items"},un=x({setup(l){const t=te();return(e,i)=>n(t).length?(a(),c("ul",ln,[(a(!0),c(D,null,A(n(t),r=>(a(),C(on,{key:r.link||r.text,item:r},null,8,["item"]))),128))])):w("",!0)}}),cn={class:"sidebar"},dn=x({setup(l){return(t,e)=>(a(),c("aside",cn,[$(Ce),y(t.$slots,"top"),$(un),y(t.$slots,"bottom")]))}}),_n=x({setup(l){const t=W(),e=I(),i=M(),r=p(()=>e.value.navbar!==!1&&i.value.navbar!==!1),_=te(),f=O(!1),h=m=>{f.value=typeof m=="boolean"?m:!f.value},s={x:0,y:0},o=m=>{s.x=m.changedTouches[0].clientX,s.y=m.changedTouches[0].clientY},u=m=>{const S=m.changedTouches[0].clientX-s.x,E=m.changedTouches[0].clientY-s.y;Math.abs(S)>Math.abs(E)&&Math.abs(S)>40&&(S>0&&s.x<=80?h(!0):h(!1))},d=p(()=>[{"no-navbar":!r.value,"no-sidebar":!_.value.length,"sidebar-open":f.value},e.value.pageClass]);let v;Le(()=>{v=ee().afterEach(()=>{h(!1)})}),Ve(()=>{v()});const b=je(),k=b.resolve,L=b.pending;return(m,S)=>(a(),c("div",{class:P(["theme-container",n(d)]),onTouchstart:o,onTouchend:u},[y(m.$slots,"navbar",{},()=>[n(r)?(a(),C(Ot,{key:0,onToggleSidebar:h},{before:B(()=>[y(m.$slots,"navbar-before")]),after:B(()=>[y(m.$slots,"navbar-after")]),_:3})):w("",!0)]),g("div",{class:"sidebar-mask",onClick:S[0]||(S[0]=E=>h(!1))}),y(m.$slots,"sidebar",{},()=>[$(dn,null,{top:B(()=>[y(m.$slots,"sidebar-top")]),bottom:B(()=>[y(m.$slots,"sidebar-bottom")]),_:3})]),y(m.$slots,"page",{},()=>[n(e).home?(a(),C(ct,{key:0})):(a(),C(ge,{key:1,name:"fade-slide-y",mode:"out-in",onBeforeEnter:n(k),onBeforeLeave:n(L)},{default:B(()=>[(a(),C(sn,{key:n(t).path},{top:B(()=>[y(m.$slots,"page-top")]),bottom:B(()=>[y(m.$slots,"page-bottom")]),_:3}))]),_:3},8,["onBeforeEnter","onBeforeLeave"]))])],34))}});export{_n as default};
diff --git a/docs/assets/Layout.397f0655.js b/docs/assets/Layout.397f0655.js
new file mode 100644
index 000000000..9e6bac854
--- /dev/null
+++ b/docs/assets/Layout.397f0655.js
@@ -0,0 +1 @@
+var De=Object.defineProperty,Ie=Object.defineProperties;var Me=Object.getOwnPropertyDescriptors;var de=Object.getOwnPropertySymbols;var He=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable;var pe=(l,t,e)=>t in l?De(l,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):l[t]=e,Y=(l,t)=>{for(var e in t||(t={}))He.call(t,e)&&pe(l,e,t[e]);if(de)for(var e of de(t))Pe.call(t,e)&&pe(l,e,t[e]);return l},Z=(l,t)=>Ie(l,Me(t));import{_ as C,r as R,o as r,c,b as $,f as S,V as P,j as h,W as fe,m as a,F as I,v as A,e as g,t as T,l as w,X as z,Y as J,p as x,x as N,D as he,k as y,z as j,Z as X,$ as Ee,a0 as Re,a1 as Ae,a2 as Q,u as ee,n as E,a3 as K,a4 as me,a5 as be,S as ge,U as D,T as ke,g as F,L as $e,a6 as q,a7 as G,a8 as Oe,a9 as Fe,aa as te,ab as Le,ac as ye,R as ze,s as we,y as We,ad as U,ae,af as Ve,w as Ue,I as je,ag as Ke}from"./app.46c9efaa.js";const qe={},Ge={class:"theme-default-content custom"};function Xe(l,t){const e=R("Content");return r(),c("div",Ge,[$(e)])}var Ye=C(qe,[["render",Xe],["__file","HomeContent.vue"]]);const Ze={key:0,class:"features"},Je=S({setup(l){const t=P(),e=h(()=>fe(t.value.features)?t.value.features:[]);return(i,o)=>a(e).length?(r(),c("div",Ze,[(r(!0),c(I,null,A(a(e),d=>(r(),c("div",{key:d.title,class:"feature"},[g("h2",null,T(d.title),1),g("p",null,T(d.details),1)]))),128))])):w("",!0)}});var Qe=C(Je,[["__file","HomeFeatures.vue"]]);const et=["innerHTML"],tt=["textContent"],at=S({setup(l){const t=P(),e=h(()=>t.value.footer),i=h(()=>t.value.footerHtml);return(o,d)=>a(e)?(r(),c(I,{key:0},[a(i)?(r(),c("div",{key:0,class:"footer",innerHTML:a(e)},null,8,et)):(r(),c("div",{key:1,class:"footer",textContent:T(a(e))},null,8,tt))],64)):w("",!0)}});var nt=C(at,[["__file","HomeFooter.vue"]]);const rt=["href","rel","target","aria-label"],ot=S({inheritAttrs:!1}),st=S(Z(Y({},ot),{props:{item:{type:Object,required:!0}},setup(l){const t=l,e=z(),i=Ae(),{item:o}=J(t),d=h(()=>X(o.value.link)),f=h(()=>Ee(o.value.link)||Re(o.value.link)),_=h(()=>{if(!f.value){if(o.value.target)return o.value.target;if(d.value)return"_blank"}}),n=h(()=>_.value==="_blank"),s=h(()=>!d.value&&!f.value&&!n.value),u=h(()=>{if(!f.value){if(o.value.rel)return o.value.rel;if(n.value)return"noopener noreferrer"}}),v=h(()=>o.value.ariaLabel||o.value.text),p=h(()=>{const L=Object.keys(i.value.locales);return L.length?!L.some(m=>m===o.value.link):o.value.link!=="/"}),b=h(()=>p.value?e.path.startsWith(o.value.link):!1),k=h(()=>s.value?o.value.activeMatch?new RegExp(o.value.activeMatch).test(e.path):b.value:!1);return(L,m)=>{const B=R("RouterLink"),M=R("AutoLinkExternalIcon");return a(s)?(r(),x(B,he({key:0,class:{"router-link-active":a(k)},to:a(o).link,"aria-label":a(v)},L.$attrs),{default:N(()=>[y(L.$slots,"before"),j(" "+T(a(o).text)+" ",1),y(L.$slots,"after")]),_:3},16,["class","to","aria-label"])):(r(),c("a",he({key:1,class:"external-link",href:a(o).link,rel:a(u),target:a(_),"aria-label":a(v)},L.$attrs),[y(L.$slots,"before"),j(" "+T(a(o).text)+" ",1),a(n)?(r(),x(M,{key:0})):w("",!0),y(L.$slots,"after")],16,rt))}}}));var H=C(st,[["__file","AutoLink.vue"]]);const lt={class:"hero"},ut={key:0,id:"main-title"},it={key:1,class:"description"},ct={key:2,class:"actions"},vt=S({setup(l){const t=P(),e=Q(),i=ee(),o=h(()=>i.value&&t.value.heroImageDark!==void 0?t.value.heroImageDark:t.value.heroImage),d=h(()=>t.value.heroText===null?null:t.value.heroText||e.value.title||"Hello"),f=h(()=>t.value.heroAlt||d.value||"hero"),_=h(()=>t.value.tagline===null?null:t.value.tagline||e.value.description||"Welcome to your VuePress site"),n=h(()=>fe(t.value.actions)?t.value.actions.map(({text:u,link:v,type:p="primary"})=>({text:u,link:v,type:p})):[]),s=()=>{if(!o.value)return null;const u=K("img",{src:me(o.value),alt:f.value});return t.value.heroImageDark===void 0?u:K(be,()=>u)};return(u,v)=>(r(),c("header",lt,[$(s),a(d)?(r(),c("h1",ut,T(a(d)),1)):w("",!0),a(_)?(r(),c("p",it,T(a(_)),1)):w("",!0),a(n).length?(r(),c("p",ct,[(r(!0),c(I,null,A(a(n),p=>(r(),x(H,{key:p.text,class:E(["action-button",[p.type]]),item:p},null,8,["class","item"]))),128))])):w("",!0)]))}});var dt=C(vt,[["__file","HomeHero.vue"]]);const pt={class:"home"},ht=S({setup(l){return(t,e)=>(r(),c("main",pt,[$(dt),$(Qe),$(Ye),$(nt)]))}});var _t=C(ht,[["__file","Home.vue"]]);const ft=S({setup(l){const t=ge(),e=Q(),i=D(),o=ee(),d=h(()=>i.value.home||t.value),f=h(()=>e.value.title),_=h(()=>o.value&&i.value.logoDark!==void 0?i.value.logoDark:i.value.logo),n=()=>{if(!_.value)return null;const s=K("img",{class:"logo",src:me(_.value),alt:f.value});return i.value.logoDark===void 0?s:K(be,()=>s)};return(s,u)=>{const v=R("RouterLink");return r(),x(v,{to:a(d)},{default:N(()=>[$(n),a(f)?(r(),c("span",{key:0,class:E(["site-name",{"can-hide":a(_)}])},T(a(f)),3)):w("",!0)]),_:1},8,["to"])}}});var mt=C(ft,[["__file","NavbarBrand.vue"]]);const bt=S({setup(l){const t=i=>{i.style.height=i.scrollHeight+"px"},e=i=>{i.style.height=""};return(i,o)=>(r(),x(ke,{name:"dropdown",onEnter:t,onAfterEnter:e,onBeforeLeave:t},{default:N(()=>[y(i.$slots,"default")]),_:3}))}});var Ce=C(bt,[["__file","DropdownTransition.vue"]]);const gt=["aria-label"],kt={class:"title"},$t=g("span",{class:"arrow down"},null,-1),Lt=["aria-label"],yt={class:"title"},wt={class:"navbar-dropdown"},Ct={class:"navbar-dropdown-subtitle"},St={key:1},xt={class:"navbar-dropdown-subitem-wrapper"},Tt=S({props:{item:{type:Object,required:!0}},setup(l){const t=l,{item:e}=J(t),i=h(()=>e.value.ariaLabel||e.value.text),o=F(!1),d=z();$e(()=>d.path,()=>{o.value=!1});const f=n=>{n.detail===0?o.value=!o.value:o.value=!1},_=(n,s)=>s[s.length-1]===n;return(n,s)=>(r(),c("div",{class:E(["navbar-dropdown-wrapper",{open:o.value}])},[g("button",{class:"navbar-dropdown-title",type:"button","aria-label":a(i),onClick:f},[g("span",kt,T(a(e).text),1),$t],8,gt),g("button",{class:"navbar-dropdown-title-mobile",type:"button","aria-label":a(i),onClick:s[0]||(s[0]=u=>o.value=!o.value)},[g("span",yt,T(a(e).text),1),g("span",{class:E(["arrow",o.value?"down":"right"])},null,2)],8,Lt),$(Ce,null,{default:N(()=>[q(g("ul",wt,[(r(!0),c(I,null,A(a(e).children,u=>(r(),c("li",{key:u.text,class:"navbar-dropdown-item"},[u.children?(r(),c(I,{key:0},[g("h4",Ct,[u.link?(r(),x(H,{key:0,item:u,onFocusout:v=>_(u,a(e).children)&&u.children.length===0&&(o.value=!1)},null,8,["item","onFocusout"])):(r(),c("span",St,T(u.text),1))]),g("ul",xt,[(r(!0),c(I,null,A(u.children,v=>(r(),c("li",{key:v.link,class:"navbar-dropdown-subitem"},[$(H,{item:v,onFocusout:p=>_(v,u.children)&&_(u,a(e).children)&&(o.value=!1)},null,8,["item","onFocusout"])]))),128))])],64)):(r(),x(H,{key:1,item:u,onFocusout:v=>_(u,a(e).children)&&(o.value=!1)},null,8,["item","onFocusout"]))]))),128))],512),[[G,o.value]])]),_:1})],2))}});var Bt=C(Tt,[["__file","NavbarDropdown.vue"]]);const _e=l=>decodeURI(l).replace(/#.*$/,"").replace(/(index)?\.(md|html)$/,""),Nt=(l,t)=>{if(t.hash===l)return!0;const e=_e(t.path),i=_e(l);return e===i},Se=(l,t)=>l.link&&Nt(l.link,t)?!0:l.children?l.children.some(e=>Se(e,t)):!1,xe=l=>!X(l)||/github\.com/.test(l)?"GitHub":/bitbucket\.org/.test(l)?"Bitbucket":/gitlab\.com/.test(l)?"GitLab":/gitee\.com/.test(l)?"Gitee":null,Dt={GitHub:":repo/edit/:branch/:path",GitLab:":repo/-/edit/:branch/:path",Gitee:":repo/edit/:branch/:path",Bitbucket:":repo/src/:branch/:path?mode=edit&spa=0&at=:branch&fileviewer=file-view-default"},It=({docsRepo:l,editLinkPattern:t})=>{if(t)return t;const e=xe(l);return e!==null?Dt[e]:null},Mt=({docsRepo:l,docsBranch:t,docsDir:e,filePathRelative:i,editLinkPattern:o})=>{if(!i)return null;const d=It({docsRepo:l,editLinkPattern:o});return d?d.replace(/:repo/,X(l)?l:`https://github.com/${l}`).replace(/:branch/,t).replace(/:path/,Oe(`${Fe(e)}/${i}`)):null},Ht={key:0,class:"navbar-items"},Pt=S({setup(l){const t=()=>{const s=te(),u=ge(),v=Q(),p=D();return h(()=>{var B,M;const b=Object.keys(v.value.locales);if(b.length<2)return[];const k=s.currentRoute.value.path,L=s.currentRoute.value.fullPath;return[{text:(B=p.value.selectLanguageText)!=null?B:"unknown language",ariaLabel:(M=p.value.selectLanguageAriaLabel)!=null?M:"unkown language",children:b.map(O=>{var oe,se,le,ue,ie,ce;const W=(se=(oe=v.value.locales)==null?void 0:oe[O])!=null?se:{},ne=(ue=(le=p.value.locales)==null?void 0:le[O])!=null?ue:{},re=`${W.lang}`,Be=(ie=ne.selectLanguageName)!=null?ie:re;let V;if(re===v.value.lang)V=L;else{const ve=k.replace(u.value,O);s.getRoutes().some(Ne=>Ne.path===ve)?V=ve:V=(ce=ne.home)!=null?ce:O}return{text:Be,link:V}})}]})},e=()=>{const s=D(),u=h(()=>s.value.repo),v=h(()=>u.value?xe(u.value):null),p=h(()=>u.value&&!X(u.value)?`https://github.com/${u.value}`:u.value),b=h(()=>p.value?s.value.repoLabel?s.value.repoLabel:v.value===null?"Source":v.value:null);return h(()=>!p.value||!b.value?[]:[{text:b.value,link:p.value}])},i=s=>Le(s)?ye(s):s.children?Z(Y({},s),{children:s.children.map(i)}):s,d=(()=>{const s=D();return h(()=>(s.value.navbar||[]).map(i))})(),f=t(),_=e(),n=h(()=>[...d.value,...f.value,..._.value]);return(s,u)=>a(n).length?(r(),c("nav",Ht,[(r(!0),c(I,null,A(a(n),v=>(r(),c("div",{key:v.text,class:"navbar-item"},[v.children?(r(),x(Bt,{key:0,item:v},null,8,["item"])):(r(),x(H,{key:1,item:v},null,8,["item"]))]))),128))])):w("",!0)}});var Te=C(Pt,[["__file","NavbarItems.vue"]]);const Et=["title"],Rt={class:"icon",focusable:"false",viewBox:"0 0 32 32"},At=ze('<path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path>',9),Ot=[At],Ft={class:"icon",focusable:"false",viewBox:"0 0 32 32"},zt=g("path",{d:"M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z",fill:"currentColor"},null,-1),Wt=[zt],Vt=S({setup(l){const t=D(),e=ee(),i=()=>{e.value=!e.value};return(o,d)=>(r(),c("button",{class:"toggle-dark-button",title:a(t).toggleDarkMode,onClick:i},[q((r(),c("svg",Rt,Ot,512)),[[G,!a(e)]]),q((r(),c("svg",Ft,Wt,512)),[[G,a(e)]])],8,Et))}});var Ut=C(Vt,[["__file","ToggleDarkModeButton.vue"]]);const jt=["title"],Kt=g("div",{class:"icon","aria-hidden":"true"},[g("span"),g("span"),g("span")],-1),qt=[Kt],Gt=S({emits:["toggle"],setup(l){const t=D();return(e,i)=>(r(),c("div",{class:"toggle-sidebar-button",title:a(t).toggleSidebar,"aria-expanded":"false",role:"button",tabindex:"0",onClick:i[0]||(i[0]=o=>e.$emit("toggle"))},qt,8,jt))}});var Xt=C(Gt,[["__file","ToggleSidebarButton.vue"]]);const Yt=S({emits:["toggle-sidebar"],setup(l){const t=D(),e=F(null),i=F(null),o=F(0),d=h(()=>o.value?{maxWidth:o.value+"px"}:{}),f=h(()=>t.value.darkMode);we(()=>{const s=_(e.value,"paddingLeft")+_(e.value,"paddingRight"),u=()=>{var v;window.innerWidth<=719?o.value=0:o.value=e.value.offsetWidth-s-(((v=i.value)==null?void 0:v.offsetWidth)||0)};u(),window.addEventListener("resize",u,!1),window.addEventListener("orientationchange",u,!1)});function _(n,s){var p,b,k;const u=(k=(b=(p=n==null?void 0:n.ownerDocument)==null?void 0:p.defaultView)==null?void 0:b.getComputedStyle(n,null))==null?void 0:k[s],v=Number.parseInt(u,10);return Number.isNaN(v)?0:v}return(n,s)=>{const u=R("NavbarSearch");return r(),c("header",{ref_key:"navbar",ref:e,class:"navbar"},[$(Xt,{onToggle:s[0]||(s[0]=v=>n.$emit("toggle-sidebar"))}),g("span",{ref_key:"navbarBrand",ref:i},[$(mt)],512),g("div",{class:"navbar-items-wrapper",style:We(a(d))},[y(n.$slots,"before"),$(Te,{class:"can-hide"}),y(n.$slots,"after"),a(f)?(r(),x(Ut,{key:0})):w("",!0),$(u)],4)],512)}}});var Zt=C(Yt,[["__file","Navbar.vue"]]);const Jt={class:"page-meta"},Qt={key:0,class:"meta-item edit-link"},ea={key:1,class:"meta-item last-updated"},ta={class:"meta-item-label"},aa={class:"meta-item-info"},na={key:2,class:"meta-item contributors"},ra={class:"meta-item-label"},oa={class:"meta-item-info"},sa=["title"],la=j(", "),ua=S({setup(l){const t=()=>{const n=D(),s=U(),u=P();return h(()=>{var M,O,W;if(!((O=(M=u.value.editLink)!=null?M:n.value.editLink)!=null?O:!0))return null;const{repo:p,docsRepo:b=p,docsBranch:k="main",docsDir:L="",editLinkText:m}=n.value;if(!b)return null;const B=Mt({docsRepo:b,docsBranch:k,docsDir:L,filePathRelative:s.value.filePathRelative,editLinkPattern:(W=u.value.editLinkPattern)!=null?W:n.value.editLinkPattern});return B?{text:m!=null?m:"Edit this page",link:B}:null})},e=()=>{const n=D(),s=U(),u=P();return h(()=>{var b,k,L,m;return!((k=(b=u.value.lastUpdated)!=null?b:n.value.lastUpdated)!=null?k:!0)||!((L=s.value.git)!=null&&L.updatedTime)?null:new Date((m=s.value.git)==null?void 0:m.updatedTime).toLocaleString()})},i=()=>{const n=D(),s=U(),u=P();return h(()=>{var p,b,k,L;return((b=(p=u.value.contributors)!=null?p:n.value.contributors)!=null?b:!0)&&(L=(k=s.value.git)==null?void 0:k.contributors)!=null?L:null})},o=D(),d=t(),f=e(),_=i();return(n,s)=>{const u=R("ClientOnly");return r(),c("footer",Jt,[a(d)?(r(),c("div",Qt,[$(H,{class:"meta-item-label",item:a(d)},null,8,["item"])])):w("",!0),a(f)?(r(),c("div",ea,[g("span",ta,T(a(o).lastUpdatedText)+": ",1),$(u,null,{default:N(()=>[g("span",aa,T(a(f)),1)]),_:1})])):w("",!0),a(_)&&a(_).length?(r(),c("div",na,[g("span",ra,T(a(o).contributorsText)+": ",1),g("span",oa,[(r(!0),c(I,null,A(a(_),(v,p)=>(r(),c(I,{key:p},[g("span",{class:"contributor",title:`email: ${v.email}`},T(v.name),9,sa),p!==a(_).length-1?(r(),c(I,{key:0},[la],64)):w("",!0)],64))),128))])])):w("",!0)])}}});var ia=C(ua,[["__file","PageMeta.vue"]]);const ca={key:0,class:"page-nav"},va={class:"inner"},da={key:0,class:"prev"},pa={key:1,class:"next"},ha=S({setup(l){const t=n=>n===!1?null:Le(n)?ye(n):Ve(n)?n:!1,e=(n,s,u)=>{const v=n.findIndex(p=>p.link===s);if(v!==-1){const p=n[v+u];return p!=null&&p.link?p:null}for(const p of n)if(p.children){const b=e(p.children,s,u);if(b)return b}return null},i=P(),o=ae(),d=z(),f=h(()=>{const n=t(i.value.prev);return n!==!1?n:e(o.value,d.path,-1)}),_=h(()=>{const n=t(i.value.next);return n!==!1?n:e(o.value,d.path,1)});return(n,s)=>a(f)||a(_)?(r(),c("nav",ca,[g("p",va,[a(f)?(r(),c("span",da,[$(H,{item:a(f)},null,8,["item"])])):w("",!0),a(_)?(r(),c("span",pa,[$(H,{item:a(_)},null,8,["item"])])):w("",!0)])])):w("",!0)}});var _a=C(ha,[["__file","PageNav.vue"]]);const fa={class:"page"},ma={class:"theme-default-content"},ba=S({setup(l){return(t,e)=>{const i=R("Content");return r(),c("main",fa,[y(t.$slots,"top"),g("div",ma,[$(i)]),$(ia),$(_a),y(t.$slots,"bottom")])}}});var ga=C(ba,[["__file","Page.vue"]]);const ka={class:"sidebar-item-children"},$a=S({props:{item:{type:Object,required:!0},depth:{type:Number,required:!1,default:0}},setup(l){const t=l,{item:e,depth:i}=J(t),o=z(),d=te(),f=h(()=>Se(e.value,o)),_=h(()=>({"sidebar-item":!0,"sidebar-heading":i.value===0,active:f.value,collapsible:e.value.collapsible})),n=F(!0),s=F(void 0);return e.value.collapsible&&(n.value=f.value,s.value=()=>{n.value=!n.value},d.afterEach(()=>{n.value=f.value})),(u,v)=>{var b;const p=R("SidebarItem",!0);return r(),c("li",null,[a(e).link?(r(),x(H,{key:0,class:E(a(_)),item:a(e)},null,8,["class","item"])):(r(),c("p",{key:1,tabindex:"0",class:E(a(_)),onClick:v[0]||(v[0]=(...k)=>s.value&&s.value(...k)),onKeydown:v[1]||(v[1]=Ue((...k)=>s.value&&s.value(...k),["enter"]))},[j(T(a(e).text)+" ",1),a(e).collapsible?(r(),c("span",{key:0,class:E(["arrow",n.value?"down":"right"])},null,2)):w("",!0)],34)),(b=a(e).children)!=null&&b.length?(r(),x(Ce,{key:2},{default:N(()=>[q(g("ul",ka,[(r(!0),c(I,null,A(a(e).children,k=>(r(),x(p,{key:`${a(i)}${k.text}${k.link}`,item:k,depth:a(i)+1},null,8,["item","depth"]))),128))],512),[[G,n.value]])]),_:1})):w("",!0)])}}});var La=C($a,[["__file","SidebarItem.vue"]]);const ya={key:0,class:"sidebar-items"},wa=S({setup(l){const t=z(),e=ae();return $e(()=>t.hash,i=>{const o=document.querySelector(".sidebar");if(!o)return;const d=document.querySelector(`.sidebar a.sidebar-item[href="${t.path}${i}"]`);if(!d)return;const f=o.getBoundingClientRect().top,_=o.getBoundingClientRect().height,n=d.getBoundingClientRect().top,s=d.getBoundingClientRect().height;n<f?d.scrollIntoView(!0):n+s>f+_&&d.scrollIntoView(!1)}),(i,o)=>a(e).length?(r(),c("ul",ya,[(r(!0),c(I,null,A(a(e),d=>(r(),x(La,{key:d.link||d.text,item:d},null,8,["item"]))),128))])):w("",!0)}});var Ca=C(wa,[["__file","SidebarItems.vue"]]);const Sa={class:"sidebar"},xa=S({setup(l){return(t,e)=>(r(),c("aside",Sa,[$(Te),y(t.$slots,"top"),$(Ca),y(t.$slots,"bottom")]))}});var Ta=C(xa,[["__file","Sidebar.vue"]]);const Ba=S({setup(l){const t=U(),e=P(),i=D(),o=h(()=>e.value.navbar!==!1&&i.value.navbar!==!1),d=ae(),f=F(!1),_=m=>{f.value=typeof m=="boolean"?m:!f.value},n={x:0,y:0},s=m=>{n.x=m.changedTouches[0].clientX,n.y=m.changedTouches[0].clientY},u=m=>{const B=m.changedTouches[0].clientX-n.x,M=m.changedTouches[0].clientY-n.y;Math.abs(B)>Math.abs(M)&&Math.abs(B)>40&&(B>0&&n.x<=80?_(!0):_(!1))},v=h(()=>[{"no-navbar":!o.value,"no-sidebar":!d.value.length,"sidebar-open":f.value},e.value.pageClass]);let p;we(()=>{p=te().afterEach(()=>{_(!1)})}),je(()=>{p()});const b=Ke(),k=b.resolve,L=b.pending;return(m,B)=>(r(),c("div",{class:E(["theme-container",a(v)]),onTouchstart:s,onTouchend:u},[y(m.$slots,"navbar",{},()=>[a(o)?(r(),x(Zt,{key:0,onToggleSidebar:_},{before:N(()=>[y(m.$slots,"navbar-before")]),after:N(()=>[y(m.$slots,"navbar-after")]),_:3})):w("",!0)]),g("div",{class:"sidebar-mask",onClick:B[0]||(B[0]=M=>_(!1))}),y(m.$slots,"sidebar",{},()=>[$(Ta,null,{top:N(()=>[y(m.$slots,"sidebar-top")]),bottom:N(()=>[y(m.$slots,"sidebar-bottom")]),_:3})]),y(m.$slots,"page",{},()=>[a(e).home?(r(),x(_t,{key:0})):(r(),x(ke,{key:1,name:"fade-slide-y",mode:"out-in",onBeforeEnter:a(k),onBeforeLeave:a(L)},{default:N(()=>[(r(),x(ga,{key:a(t).path},{top:N(()=>[y(m.$slots,"page-top")]),bottom:N(()=>[y(m.$slots,"page-bottom")]),_:3}))]),_:3},8,["onBeforeEnter","onBeforeLeave"]))])],34))}});var Ia=C(Ba,[["__file","Layout.vue"]]);export{Ia as default};
diff --git a/docs/assets/LocalizedOutput.518408aa.js b/docs/assets/LocalizedOutput.518408aa.js
new file mode 100644
index 000000000..76654824c
--- /dev/null
+++ b/docs/assets/LocalizedOutput.518408aa.js
@@ -0,0 +1 @@
+import{_ as r,f as s,g as n,u as d,r as l,o as p,c,b as m}from"./app.46c9efaa.js";import{Q as u}from"./vue-datepicker.es.9f3b8378.js";import{j as f}from"./index.e7c299e1.js";const i=s({components:{Datepicker:u},setup(){const e=n(new Date),a=d();return{date:e,dark:a,ja:f}}}),k={class:"demo-wrap"};function _(e,a,D,v,V,$){const o=l("Datepicker");return p(),c("div",k,[m(o,{modelValue:e.date,"onUpdate:modelValue":a[0]||(a[0]=t=>e.date=t),dark:e.dark,placeholder:"Select Date","format-locale":e.ja,format:"E"},null,8,["modelValue","dark","format-locale"])])}var B=r(i,[["render",_],["__file","LocalizedOutput.vue"]]);export{B as default};
diff --git a/docs/assets/LocalizedOutput.a49834bc.js b/docs/assets/LocalizedOutput.a49834bc.js
deleted file mode 100644
index eb21720c9..000000000
--- a/docs/assets/LocalizedOutput.a49834bc.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as r,f as s,u as n,r as d,o as p,c as l,a as m}from"./app.519dac2e.js";import{U as c}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as f}from"./plugin-vue_export-helper.21dcd24c.js";import{j as i}from"./index.fb659316.js";const u=r({components:{Datepicker:c},setup(){const e=s(new Date),o=n();return{date:e,dark:o,ja:i}}}),k={class:"demo-wrap"};function _(e,o,D,V,$,j){const a=d("Datepicker");return p(),l("div",k,[m(a,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=t=>e.date=t),dark:e.dark,placeholder:"Select Date","format-locale":e.ja,format:"E"},null,8,["modelValue","dark","format-locale"])])}var C=f(u,[["render",_]]);export{C as default};
diff --git a/docs/assets/MinMaxDemo.0c419d16.js b/docs/assets/MinMaxDemo.0c419d16.js
deleted file mode 100644
index 3120bcc50..000000000
--- a/docs/assets/MinMaxDemo.0c419d16.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as p,f as i,u as c,h as o,r as l,o as D,c as u,a as f}from"./app.519dac2e.js";import{U as k,s as w,h as s,g as r,b as h}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as M}from"./plugin-vue_export-helper.21dcd24c.js";const _=p({components:{Datepicker:k},setup(){const e=i(new Date),a=c(),t=o(()=>w(new Date(s(new Date),r(new Date)),2)),n=o(()=>h(new Date(s(new Date),r(new Date)),2));return{date:e,dark:a,minDate:t,maxDate:n}}}),v={class:"demo-wrap"};function g(e,a,t,n,x,V){const d=l("Datepicker");return D(),u("div",v,[f(d,{modelValue:e.date,"onUpdate:modelValue":a[0]||(a[0]=m=>e.date=m),placeholder:"Select Date",dark:e.dark,"min-date":e.minDate,"max-date":e.maxDate,"prevent-min-max-navigation":""},null,8,["modelValue","dark","min-date","max-date"])])}var B=M(_,[["render",g]]);export{B as default};
diff --git a/docs/assets/MinMaxDemo.32364bfe.js b/docs/assets/MinMaxDemo.32364bfe.js
new file mode 100644
index 000000000..8cb0365c6
--- /dev/null
+++ b/docs/assets/MinMaxDemo.32364bfe.js
@@ -0,0 +1 @@
+import{_ as p,f as i,g as c,u as l,j as o,r as D,o as u,c as f,b as k}from"./app.46c9efaa.js";import{Q as w,s as M,h as s,g as r,b as _}from"./vue-datepicker.es.9f3b8378.js";const v=i({components:{Datepicker:w},setup(){const e=c(new Date),a=l(),t=o(()=>M(new Date(s(new Date),r(new Date)),2)),n=o(()=>_(new Date(s(new Date),r(new Date)),2));return{date:e,dark:a,minDate:t,maxDate:n}}}),g={class:"demo-wrap"};function h(e,a,t,n,x,V){const d=D("Datepicker");return u(),f("div",g,[k(d,{modelValue:e.date,"onUpdate:modelValue":a[0]||(a[0]=m=>e.date=m),placeholder:"Select Date",dark:e.dark,"min-date":e.minDate,"max-date":e.maxDate,"prevent-min-max-navigation":""},null,8,["modelValue","dark","min-date","max-date"])])}var B=p(v,[["render",h],["__file","MinMaxDemo.vue"]]);export{B as default};
diff --git a/docs/assets/MonthYearCmp.03a1bd41.js b/docs/assets/MonthYearCmp.03a1bd41.js
new file mode 100644
index 000000000..6e8ce42e7
--- /dev/null
+++ b/docs/assets/MonthYearCmp.03a1bd41.js
@@ -0,0 +1 @@
+import f from"./ChevronLeftIcon.ccfcd0b6.js";import _ from"./ChevronRightIcon.d8c47dcc.js";import{_ as C,f as g,r as i,o as r,c as l,e as s,F as m,v,b as d,t as c}from"./app.46c9efaa.js";const N=g({components:{ChevronLeftIcon:f,ChevronRightIcon:_},emits:["update:month","update:year"],props:{months:{type:Array,default:()=>[]},years:{type:Array,default:()=>[]},filters:{type:Object,default:null},monthPicker:{type:Boolean,default:!1},month:{type:Number,default:0},year:{type:Number,default:0}},setup(e,{emit:n}){const u=(o,a)=>{n("update:month",o),n("update:year",a)};return{onNext:()=>{let o=e.month,a=e.year;e.month===11?(o=0,a=e.year+1):o+=1,u(o,a)},onPrev:()=>{let o=e.month,a=e.year;e.month===0?(o=11,a=e.year-1):o-=1,u(o,a)}}}}),k={class:"month-year-wrapper"},I={class:"custom-month-year-component"},$=["value"],P=["value"],b=["value"],B=["value"],L={class:"icons"};function M(e,n,u,h,p,o){const a=i("ChevronLeftIcon"),y=i("ChevronRightIcon");return r(),l("div",k,[s("div",I,[s("select",{class:"select-input",value:e.month,onChange:n[0]||(n[0]=t=>e.$emit("update:month",+t.target.value))},[(r(!0),l(m,null,v(e.months,t=>(r(),l("option",{key:t.value,value:t.value},c(t.text),9,P))),128))],40,$),s("select",{class:"select-input",value:e.year,onChange:n[1]||(n[1]=t=>e.$emit("update:year",+t.target.value))},[(r(!0),l(m,null,v(e.years,t=>(r(),l("option",{key:t.value,value:t.value},c(t.text),9,B))),128))],40,b)]),s("div",L,[s("span",{class:"custom-icon",onClick:n[2]||(n[2]=(...t)=>e.onPrev&&e.onPrev(...t))},[d(a)]),s("span",{class:"custom-icon",onClick:n[3]||(n[3]=(...t)=>e.onNext&&e.onNext(...t))},[d(y)])])])}var F=C(N,[["render",M],["__file","MonthYearCmp.vue"]]);export{F as default};
diff --git a/docs/assets/MonthYearCmp.eb12c806.js b/docs/assets/MonthYearCmp.eb12c806.js
deleted file mode 100644
index 1ed37fcb8..000000000
--- a/docs/assets/MonthYearCmp.eb12c806.js
+++ /dev/null
@@ -1 +0,0 @@
-import f from"./ChevronLeftIcon.ce5da71b.js";import _ from"./ChevronRightIcon.ca308293.js";import{e as C,r as i,o as r,c as l,b as s,F as m,y as d,a as v,x as c}from"./app.519dac2e.js";import{_ as g}from"./plugin-vue_export-helper.21dcd24c.js";const N=C({components:{ChevronLeftIcon:f,ChevronRightIcon:_},emits:["update:month","update:year"],props:{months:{type:Array,default:()=>[]},years:{type:Array,default:()=>[]},filters:{type:Object,default:null},monthPicker:{type:Boolean,default:!1},month:{type:Number,default:0},year:{type:Number,default:0}},setup(e,{emit:o}){const u=(n,a)=>{o("update:month",n),o("update:year",a)};return{onNext:()=>{let n=e.month,a=e.year;e.month===11?(n=0,a=e.year+1):n+=1,u(n,a)},onPrev:()=>{let n=e.month,a=e.year;e.month===0?(n=11,a=e.year-1):n-=1,u(n,a)}}}}),k={class:"month-year-wrapper"},I={class:"custom-month-year-component"},$=["value"],P=["value"],b=["value"],B=["value"],L={class:"icons"};function M(e,o,u,p,h,n){const a=i("ChevronLeftIcon"),y=i("ChevronRightIcon");return r(),l("div",k,[s("div",I,[s("select",{class:"select-input",value:e.month,onChange:o[0]||(o[0]=t=>e.$emit("update:month",+t.target.value))},[(r(!0),l(m,null,d(e.months,t=>(r(),l("option",{key:t.value,value:t.value},c(t.text),9,P))),128))],40,$),s("select",{class:"select-input",value:e.year,onChange:o[1]||(o[1]=t=>e.$emit("update:year",+t.target.value))},[(r(!0),l(m,null,d(e.years,t=>(r(),l("option",{key:t.value,value:t.value},c(t.text),9,B))),128))],40,b)]),s("div",L,[s("span",{class:"custom-icon",onClick:o[2]||(o[2]=(...t)=>e.onPrev&&e.onPrev(...t))},[v(a)]),s("span",{class:"custom-icon",onClick:o[3]||(o[3]=(...t)=>e.onNext&&e.onNext(...t))},[v(y)])])])}var V=g(N,[["render",M]]);export{V as default};
diff --git a/docs/assets/PresetRange.38ff6d1d.js b/docs/assets/PresetRange.38ff6d1d.js
deleted file mode 100644
index a62bd8974..000000000
--- a/docs/assets/PresetRange.38ff6d1d.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as c,f as s,u as m,r as f,o as g,c as i,a as D}from"./app.519dac2e.js";import{r,t as n,U as h,s as o}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as k}from"./plugin-vue_export-helper.21dcd24c.js";function l(a){r(1,arguments);var e=n(a),t=e.getMonth();return e.setFullYear(e.getFullYear(),t+1,0),e.setHours(23,59,59,999),e}function u(a){r(1,arguments);var e=n(a);return e.setDate(1),e.setHours(0,0,0,0),e}function v(a){r(1,arguments);var e=n(a),t=new Date(0);return t.setFullYear(e.getFullYear(),0,1),t.setHours(0,0,0,0),t}function w(a){r(1,arguments);var e=n(a),t=e.getFullYear();return e.setFullYear(t+1,0,0),e.setHours(23,59,59,999),e}const Y=c({components:{Datepicker:h},setup(){const a=s(),e=m(),t=s([{label:"Today",range:[new Date,new Date]},{label:"This month",range:[u(new Date),l(new Date)]},{label:"Last month",range:[u(o(new Date,1)),l(o(new Date,1))]},{label:"This year",range:[v(new Date),w(new Date)]}]);return{date:a,dark:e,presetRanges:t}}}),_={class:"demo-wrap"};function F(a,e,t,b,M,H){const d=f("Datepicker");return g(),i("div",_,[D(d,{modelValue:a.date,"onUpdate:modelValue":e[0]||(e[0]=p=>a.date=p),placeholder:"Select Date",dark:a.dark,range:"","preset-ranges":a.presetRanges},null,8,["modelValue","dark","preset-ranges"])])}var y=k(Y,[["render",F]]);export{y as default};
diff --git a/docs/assets/PresetRange.b207f627.js b/docs/assets/PresetRange.b207f627.js
new file mode 100644
index 000000000..8de789578
--- /dev/null
+++ b/docs/assets/PresetRange.b207f627.js
@@ -0,0 +1 @@
+import{_ as c,f as g,g as s,u as m,r as f,o as i,c as D,b as v}from"./app.46c9efaa.js";import{r,t as n,Q as h,s as o}from"./vue-datepicker.es.9f3b8378.js";function l(a){r(1,arguments);var e=n(a),t=e.getMonth();return e.setFullYear(e.getFullYear(),t+1,0),e.setHours(23,59,59,999),e}function u(a){r(1,arguments);var e=n(a);return e.setDate(1),e.setHours(0,0,0,0),e}function k(a){r(1,arguments);var e=n(a),t=new Date(0);return t.setFullYear(e.getFullYear(),0,1),t.setHours(0,0,0,0),t}function w(a){r(1,arguments);var e=n(a),t=e.getFullYear();return e.setFullYear(t+1,0,0),e.setHours(23,59,59,999),e}const _=g({components:{Datepicker:h},setup(){const a=s(),e=m(),t=s([{label:"Today",range:[new Date,new Date]},{label:"This month",range:[u(new Date),l(new Date)]},{label:"Last month",range:[u(o(new Date,1)),l(o(new Date,1))]},{label:"This year",range:[k(new Date),w(new Date)]}]);return{date:a,dark:e,presetRanges:t}}}),Y={class:"demo-wrap"};function b(a,e,t,F,M,H){const d=f("Datepicker");return i(),D("div",Y,[v(d,{modelValue:a.date,"onUpdate:modelValue":e[0]||(e[0]=p=>a.date=p),placeholder:"Select Date",dark:a.dark,range:"","preset-ranges":a.presetRanges},null,8,["modelValue","dark","preset-ranges"])])}var V=c(_,[["render",b],["__file","PresetRange.vue"]]);export{V as default};
diff --git a/docs/assets/PreviewFormatDemo.711e0d27.js b/docs/assets/PreviewFormatDemo.711e0d27.js
deleted file mode 100644
index 93605de10..000000000
--- a/docs/assets/PreviewFormatDemo.711e0d27.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as c}from"./vue-datepicker.es.e0a9f9bf.js";import{u as l,r as m,o as p,c as i,a as u}from"./app.519dac2e.js";import{_ as f}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:c},props:["placeholder"],data(){return{date:new Date,dark:!0}},methods:{format(e){const o=e.getDate(),r=e.getMonth()+1,a=e.getFullYear();return`Selected date is ${o}/${r}/${a}`}},mounted(){this.dark=l()}},_={class:"demo-wrap"};function h(e,o,r,a,t,n){const s=m("Datepicker");return p(),i("div",_,[u(s,{modelValue:t.date,"onUpdate:modelValue":o[0]||(o[0]=d=>t.date=d),placeholder:r.placeholder,"preview-format":n.format,dark:t.dark},null,8,["modelValue","placeholder","preview-format","dark"])])}var V=f(k,[["render",h]]);export{V as default};
diff --git a/docs/assets/PreviewFormatDemo.b4be84be.js b/docs/assets/PreviewFormatDemo.b4be84be.js
new file mode 100644
index 000000000..eebebd22a
--- /dev/null
+++ b/docs/assets/PreviewFormatDemo.b4be84be.js
@@ -0,0 +1 @@
+import{Q as l}from"./vue-datepicker.es.9f3b8378.js";import{_ as c,u as m,r as p,o as i,c as u,b as _}from"./app.46c9efaa.js";const f={components:{Datepicker:l},props:["placeholder"],data(){return{date:new Date,dark:!0}},methods:{format(e){const o=e.getDate(),r=e.getMonth()+1,a=e.getFullYear();return`Selected date is ${o}/${r}/${a}`}},mounted(){this.dark=m()}},k={class:"demo-wrap"};function h(e,o,r,a,t,n){const s=p("Datepicker");return i(),u("div",k,[_(s,{modelValue:t.date,"onUpdate:modelValue":o[0]||(o[0]=d=>t.date=d),placeholder:r.placeholder,"preview-format":n.format,dark:t.dark},null,8,["modelValue","placeholder","preview-format","dark"])])}var w=c(f,[["render",h],["__file","PreviewFormatDemo.vue"]]);export{w as default};
diff --git a/docs/assets/RequiredDemo.59726618.js b/docs/assets/RequiredDemo.59726618.js
deleted file mode 100644
index bb883509f..000000000
--- a/docs/assets/RequiredDemo.59726618.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as m,f as n,u as d,r as i,o as u,c as p,b as r,a as l,m as c}from"./app.519dac2e.js";import{U as f}from"./vue-datepicker.es.e0a9f9bf.js";import{_}from"./plugin-vue_export-helper.21dcd24c.js";import{j as b}from"./index.fb659316.js";const k=m({components:{Datepicker:f},setup(){const e=n(),o=d();return{submitForm:()=>{alert("Form submitted")},date:e,dark:o,ja:b}}}),v={class:"demo-wrap"},D=r("button",{class:"submit-btn",type:"submit"},"Submit form",-1);function F(e,o,s,V,$,q){const a=i("Datepicker");return u(),p("div",v,[r("form",{onSubmit:o[1]||(o[1]=c((...t)=>e.submitForm&&e.submitForm(...t),["prevent"]))},[l(a,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=t=>e.date=t),dark:e.dark,placeholder:"Select Date",required:""},null,8,["modelValue","dark"]),D],32)])}var j=_(k,[["render",F]]);export{j as default};
diff --git a/docs/assets/RequiredDemo.b9086538.js b/docs/assets/RequiredDemo.b9086538.js
new file mode 100644
index 000000000..b0979d90d
--- /dev/null
+++ b/docs/assets/RequiredDemo.b9086538.js
@@ -0,0 +1 @@
+import{_ as m,f as n,g as d,u as i,r as u,o as p,c as l,e as r,b as c,q as f}from"./app.46c9efaa.js";import{Q as _}from"./vue-datepicker.es.9f3b8378.js";import{j as b}from"./index.e7c299e1.js";const k=n({components:{Datepicker:_},setup(){const e=d(),o=i();return{submitForm:()=>{alert("Form submitted")},date:e,dark:o,ja:b}}}),v={class:"demo-wrap"},D=r("button",{class:"submit-btn",type:"submit"},"Submit form",-1);function q(e,o,s,F,V,$){const a=u("Datepicker");return p(),l("div",v,[r("form",{onSubmit:o[1]||(o[1]=f((...t)=>e.submitForm&&e.submitForm(...t),["prevent"]))},[c(a,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=t=>e.date=t),dark:e.dark,placeholder:"Select Date",required:""},null,8,["modelValue","dark"]),D],32)])}var S=m(k,[["render",q],["__file","RequiredDemo.vue"]]);export{S as default};
diff --git a/docs/assets/TextInputDemo.5620e83c.js b/docs/assets/TextInputDemo.5620e83c.js
deleted file mode 100644
index 3039846af..000000000
--- a/docs/assets/TextInputDemo.5620e83c.js
+++ /dev/null
@@ -1 +0,0 @@
-import{U as a}from"./vue-datepicker.es.e0a9f9bf.js";import{u as p,r as s,o as u,c as d,a as i}from"./app.519dac2e.js";import{_ as c}from"./plugin-vue_export-helper.21dcd24c.js";const l={components:{Datepicker:a},props:["textInput","textInputOptions"],data(){return{date:null,dark:!0}},mounted(){this.dark=p()}},m={class:"demo-wrap"};function x(k,e,o,_,t,f){const n=s("Datepicker");return u(),d("div",m,[i(n,{modelValue:t.date,"onUpdate:modelValue":e[0]||(e[0]=r=>t.date=r),dark:t.dark,"text-input":o.textInput,"text-input-options":o.textInputOptions,placeholder:"Start Typing ..."},null,8,["modelValue","dark","text-input","text-input-options"])])}var v=c(l,[["render",x]]);export{v as default};
diff --git a/docs/assets/TextInputDemo.d8669300.js b/docs/assets/TextInputDemo.d8669300.js
new file mode 100644
index 000000000..69bcdf39b
--- /dev/null
+++ b/docs/assets/TextInputDemo.d8669300.js
@@ -0,0 +1 @@
+import{Q as p}from"./vue-datepicker.es.9f3b8378.js";import{_ as a,u as s,r as u,o as d,c as i,b as l}from"./app.46c9efaa.js";const c={components:{Datepicker:p},props:["textInput","textInputOptions"],data(){return{date:null,dark:!0}},mounted(){this.dark=s()}},m={class:"demo-wrap"};function x(_,e,o,k,t,f){const n=u("Datepicker");return d(),i("div",m,[l(n,{modelValue:t.date,"onUpdate:modelValue":e[0]||(e[0]=r=>t.date=r),dark:t.dark,"text-input":o.textInput,"text-input-options":o.textInputOptions,placeholder:"Start Typing ..."},null,8,["modelValue","dark","text-input","text-input-options"])])}var v=a(c,[["render",x],["__file","TextInputDemo.vue"]]);export{v as default};
diff --git a/docs/assets/TimePickerCmp.212d1a54.js b/docs/assets/TimePickerCmp.212d1a54.js
deleted file mode 100644
index efa12f328..000000000
--- a/docs/assets/TimePickerCmp.212d1a54.js
+++ /dev/null
@@ -1 +0,0 @@
-import{e as d,h as o,o as s,c as n,b as l,F as i,y as p,x as m}from"./app.519dac2e.js";import{_ as c}from"./plugin-vue_export-helper.21dcd24c.js";const f=d({emits:["update:hours","update:minutes"],props:{hoursIncrement:{type:[Number,String],default:1},minutesIncrement:{type:[Number,String],default:1},is24:{type:Boolean,default:!0},hoursGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},range:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})},minTime:{type:Object,default:()=>({})},maxTime:{type:Object,default:()=>({})},timePicker:{type:Boolean,default:!1},hours:{type:[Number,Array],default:0},minutes:{type:[Number,Array],default:0}},setup(){const r=o(()=>{const a=[];for(let e=0;e<24;e++)a.push({text:e<10?`0${e}`:e,value:e});return a}),u=o(()=>{const a=[];for(let e=0;e<60;e++)a.push({text:e<10?`0${e}`:e,value:e});return a});return{hoursArray:r,minutesArray:u}}}),y={class:"custom-time-picker-component"},v=["value"],_=["value"],h=["value"],g=["value"];function b(r,u,a,e,k,$){return s(),n("div",y,[l("select",{class:"select-input",value:r.hours,onChange:u[0]||(u[0]=t=>r.$emit("update:hours",+t.target.value))},[(s(!0),n(i,null,p(r.hoursArray,t=>(s(),n("option",{key:t.value,value:t.value},m(t.text),9,_))),128))],40,v),l("select",{class:"select-input",value:r.minutes,onChange:u[1]||(u[1]=t=>r.$emit("update:minutes",+t.target.value))},[(s(!0),n(i,null,p(r.minutesArray,t=>(s(),n("option",{key:t.value,value:t.value},m(t.text),9,g))),128))],40,h)])}var B=c(f,[["render",b]]);export{B as default};
diff --git a/docs/assets/TimePickerCmp.48345a7c.js b/docs/assets/TimePickerCmp.48345a7c.js
new file mode 100644
index 000000000..f765ff488
--- /dev/null
+++ b/docs/assets/TimePickerCmp.48345a7c.js
@@ -0,0 +1 @@
+import{_ as d,f as c,j as o,o as s,c as n,e as l,F as i,v as p,t as m}from"./app.46c9efaa.js";const f=c({emits:["update:hours","update:minutes"],props:{hoursIncrement:{type:[Number,String],default:1},minutesIncrement:{type:[Number,String],default:1},is24:{type:Boolean,default:!0},hoursGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},range:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})},minTime:{type:Object,default:()=>({})},maxTime:{type:Object,default:()=>({})},timePicker:{type:Boolean,default:!1},hours:{type:[Number,Array],default:0},minutes:{type:[Number,Array],default:0}},setup(){const r=o(()=>{const a=[];for(let e=0;e<24;e++)a.push({text:e<10?`0${e}`:e,value:e});return a}),u=o(()=>{const a=[];for(let e=0;e<60;e++)a.push({text:e<10?`0${e}`:e,value:e});return a});return{hoursArray:r,minutesArray:u}}}),v={class:"custom-time-picker-component"},y=["value"],_=["value"],g=["value"],h=["value"];function b(r,u,a,e,k,$){return s(),n("div",v,[l("select",{class:"select-input",value:r.hours,onChange:u[0]||(u[0]=t=>r.$emit("update:hours",+t.target.value))},[(s(!0),n(i,null,p(r.hoursArray,t=>(s(),n("option",{key:t.value,value:t.value},m(t.text),9,_))),128))],40,y),l("select",{class:"select-input",value:r.minutes,onChange:u[1]||(u[1]=t=>r.$emit("update:minutes",+t.target.value))},[(s(!0),n(i,null,p(r.minutesArray,t=>(s(),n("option",{key:t.value,value:t.value},m(t.text),9,h))),128))],40,g)])}var A=d(f,[["render",b],["__file","TimePickerCmp.vue"]]);export{A as default};
diff --git a/docs/assets/TimezoneDemo.5861241f.js b/docs/assets/TimezoneDemo.5861241f.js
new file mode 100644
index 000000000..2ef7772d2
--- /dev/null
+++ b/docs/assets/TimezoneDemo.5861241f.js
@@ -0,0 +1 @@
+import{_ as s,g as c,u as l,r as m,o as a,c as r,b as i,t as p,l as _}from"./app.46c9efaa.js";import{Q as k}from"./vue-datepicker.es.9f3b8378.js";const f={components:{Datepicker:k},setup(){const t=c(),o=l();return{date:t,dark:o}}},u={class:"demo-wrap"},D={key:0};function V(t,o,v,e,x,C){const n=m("Datepicker");return a(),r("div",u,[i(n,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=d=>e.date=d),dark:e.dark,utc:"",placeholder:"Select Date"},null,8,["modelValue","dark"]),e.date?(a(),r("p",D,"Selected date in UTC format: "+p(e.date),1)):_("",!0)])}var g=s(f,[["render",V],["__file","TimezoneDemo.vue"]]);export{g as default};
diff --git a/docs/assets/TimezoneDemo.a5f28a5a.js b/docs/assets/TimezoneDemo.a5f28a5a.js
deleted file mode 100644
index 7c5151b21..000000000
--- a/docs/assets/TimezoneDemo.a5f28a5a.js
+++ /dev/null
@@ -1 +0,0 @@
-import{f as s,u as c,r as m,o as a,c as r,a as l,x as p,j as i}from"./app.519dac2e.js";import{U as _}from"./vue-datepicker.es.e0a9f9bf.js";import{_ as f}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:_},setup(){const t=s(),o=c();return{date:t,dark:o}}},u={class:"demo-wrap"},D={key:0};function V(t,o,x,e,U,v){const n=m("Datepicker");return a(),r("div",u,[l(n,{modelValue:e.date,"onUpdate:modelValue":o[0]||(o[0]=d=>e.date=d),dark:e.dark,utc:"",placeholder:"Select Date"},null,8,["modelValue","dark"]),e.date?(a(),r("p",D,"Selected date in UTC format: "+p(e.date),1)):i("",!0)])}var y=f(k,[["render",V]]);export{y as default};
diff --git a/docs/assets/app.46c9efaa.js b/docs/assets/app.46c9efaa.js
new file mode 100644
index 000000000..36c5db32b
--- /dev/null
+++ b/docs/assets/app.46c9efaa.js
@@ -0,0 +1,20 @@
+var Lu=Object.defineProperty,Nu=Object.defineProperties;var Mu=Object.getOwnPropertyDescriptors;var es=Object.getOwnPropertySymbols;var Hu=Object.prototype.hasOwnProperty,Fu=Object.prototype.propertyIsEnumerable;var ts=(e,t,n)=>t in e?Lu(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,De=(e,t)=>{for(var n in t||(t={}))Hu.call(t,n)&&ts(e,n,t[n]);if(es)for(var n of es(t))Fu.call(t,n)&&ts(e,n,t[n]);return e},ht=(e,t)=>Nu(e,Mu(t));const Yi={};function fi(e,t){const n=Object.create(null),r=e.split(",");for(let o=0;o<r.length;o++)n[r[o]]=!0;return t?o=>!!n[o.toLowerCase()]:o=>!!n[o]}const zu="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",$u=fi(zu);function ul(e){return!!e||e===""}function er(e){if(Z(e)){const t={};for(let n=0;n<e.length;n++){const r=e[n],o=me(r)?qu(r):er(r);if(o)for(const i in o)t[i]=o[i]}return t}else{if(me(e))return e;if(Ce(e))return e}}const Bu=/;(?![^(]*\))/g,Uu=/:(.+)/;function qu(e){const t={};return e.split(Bu).forEach(n=>{if(n){const r=n.split(Uu);r.length>1&&(t[r[0].trim()]=r[1].trim())}}),t}function mn(e){let t="";if(me(e))t=e;else if(Z(e))for(let n=0;n<e.length;n++){const r=mn(e[n]);r&&(t+=r+" ")}else if(Ce(e))for(const n in e)e[n]&&(t+=n+" ");return t.trim()}function M0(e){if(!e)return null;let{class:t,style:n}=e;return t&&!me(t)&&(e.class=mn(t)),n&&(e.style=er(n)),e}const Vu=e=>me(e)?e:e==null?"":Z(e)||Ce(e)&&(e.toString===ml||!oe(e.toString))?JSON.stringify(e,fl,2):String(e),fl=(e,t)=>t&&t.__v_isRef?fl(e,t.value):sn(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[r,o])=>(n[`${r} =>`]=o,n),{})}:dl(t)?{[`Set(${t.size})`]:[...t.values()]}:Ce(t)&&!Z(t)&&!hl(t)?String(t):t,ge={},on=[],Xe=()=>{},Ku=()=>!1,Wu=/^on[^a-z]/,tr=e=>Wu.test(e),di=e=>e.startsWith("onUpdate:"),ke=Object.assign,pi=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},Ju=Object.prototype.hasOwnProperty,ue=(e,t)=>Ju.call(e,t),Z=Array.isArray,sn=e=>Zr(e)==="[object Map]",dl=e=>Zr(e)==="[object Set]",oe=e=>typeof e=="function",me=e=>typeof e=="string",mi=e=>typeof e=="symbol",Ce=e=>e!==null&&typeof e=="object",pl=e=>Ce(e)&&oe(e.then)&&oe(e.catch),ml=Object.prototype.toString,Zr=e=>ml.call(e),Qu=e=>Zr(e).slice(8,-1),hl=e=>Zr(e)==="[object Object]",hi=e=>me(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,kn=fi(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Xr=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},Yu=/-(\w)/g,st=Xr(e=>e.replace(Yu,(t,n)=>n?n.toUpperCase():"")),Gu=/\B([A-Z])/g,qt=Xr(e=>e.replace(Gu,"-$1").toLowerCase()),eo=Xr(e=>e.charAt(0).toUpperCase()+e.slice(1)),uo=Xr(e=>e?`on${eo(e)}`:""),Un=(e,t)=>!Object.is(e,t),fo=(e,t)=>{for(let n=0;n<e.length;n++)e[n](t)},jr=(e,t,n)=>{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},vl=e=>{const t=parseFloat(e);return isNaN(t)?e:t};let ns;const Zu=()=>ns||(ns=typeof globalThis!="undefined"?globalThis:typeof self!="undefined"?self:typeof window!="undefined"?window:typeof global!="undefined"?global:{});let We;class Xu{constructor(t=!1){this.active=!0,this.effects=[],this.cleanups=[],!t&&We&&(this.parent=We,this.index=(We.scopes||(We.scopes=[])).push(this)-1)}run(t){if(this.active)try{return We=this,t()}finally{We=this.parent}}on(){We=this}off(){We=this.parent}stop(t){if(this.active){let n,r;for(n=0,r=this.effects.length;n<r;n++)this.effects[n].stop();for(n=0,r=this.cleanups.length;n<r;n++)this.cleanups[n]();if(this.scopes)for(n=0,r=this.scopes.length;n<r;n++)this.scopes[n].stop(!0);if(this.parent&&!t){const o=this.parent.scopes.pop();o&&o!==this&&(this.parent.scopes[this.index]=o,o.index=this.index)}this.active=!1}}}function ef(e,t=We){t&&t.active&&t.effects.push(e)}function tf(){return We}function nf(e){We&&We.cleanups.push(e)}const vi=e=>{const t=new Set(e);return t.w=0,t.n=0,t},gl=e=>(e.w&At)>0,_l=e=>(e.n&At)>0,rf=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=At},of=e=>{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r<t.length;r++){const o=t[r];gl(o)&&!_l(o)?o.delete(e):t[n++]=o,o.w&=~At,o.n&=~At}t.length=n}},To=new WeakMap;let In=0,At=1;const ko=30;let rt;const Ft=Symbol(""),Do=Symbol("");class gi{constructor(t,n=null,r){this.fn=t,this.scheduler=n,this.active=!0,this.deps=[],this.parent=void 0,ef(this,r)}run(){if(!this.active)return this.fn();let t=rt,n=Pt;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=rt,rt=this,Pt=!0,At=1<<++In,In<=ko?rf(this):rs(this),this.fn()}finally{In<=ko&&of(this),At=1<<--In,rt=this.parent,Pt=n,this.parent=void 0}}stop(){this.active&&(rs(this),this.onStop&&this.onStop(),this.active=!1)}}function rs(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}let Pt=!0;const yl=[];function hn(){yl.push(Pt),Pt=!1}function vn(){const e=yl.pop();Pt=e===void 0?!0:e}function qe(e,t,n){if(Pt&&rt){let r=To.get(e);r||To.set(e,r=new Map);let o=r.get(n);o||r.set(n,o=vi()),bl(o)}}function bl(e,t){let n=!1;In<=ko?_l(e)||(e.n|=At,n=!gl(e)):n=!e.has(rt),n&&(e.add(rt),rt.deps.push(e))}function dt(e,t,n,r,o,i){const s=To.get(e);if(!s)return;let a=[];if(t==="clear")a=[...s.values()];else if(n==="length"&&Z(e))s.forEach((l,c)=>{(c==="length"||c>=r)&&a.push(l)});else switch(n!==void 0&&a.push(s.get(n)),t){case"add":Z(e)?hi(n)&&a.push(s.get("length")):(a.push(s.get(Ft)),sn(e)&&a.push(s.get(Do)));break;case"delete":Z(e)||(a.push(s.get(Ft)),sn(e)&&a.push(s.get(Do)));break;case"set":sn(e)&&a.push(s.get(Ft));break}if(a.length===1)a[0]&&Ro(a[0]);else{const l=[];for(const c of a)c&&l.push(...c);Ro(vi(l))}}function Ro(e,t){for(const n of Z(e)?e:[...e])(n!==rt||n.allowRecurse)&&(n.scheduler?n.scheduler():n.run())}const sf=fi("__proto__,__v_isRef,__isVue"),El=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(mi)),af=_i(),lf=_i(!1,!0),cf=_i(!0),os=uf();function uf(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=de(this);for(let i=0,s=this.length;i<s;i++)qe(r,"get",i+"");const o=r[t](...n);return o===-1||o===!1?r[t](...n.map(de)):o}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){hn();const r=de(this)[t].apply(this,n);return vn(),r}}),e}function _i(e=!1,t=!1){return function(r,o,i){if(o==="__v_isReactive")return!e;if(o==="__v_isReadonly")return e;if(o==="__v_isShallow")return t;if(o==="__v_raw"&&i===(e?t?Cf:Cl:t?Pl:Sl).get(r))return r;const s=Z(r);if(!e&&s&&ue(os,o))return Reflect.get(os,o,i);const a=Reflect.get(r,o,i);return(mi(o)?El.has(o):sf(o))||(e||qe(r,"get",o),t)?a:xe(a)?!s||!hi(o)?a.value:a:Ce(a)?e?Ei(a):gn(a):a}}const ff=Ol(),df=Ol(!0);function Ol(e=!1){return function(n,r,o,i){let s=n[r];if(qn(s)&&xe(s)&&!xe(o))return!1;if(!e&&!qn(o)&&(Al(o)||(o=de(o),s=de(s)),!Z(n)&&xe(s)&&!xe(o)))return s.value=o,!0;const a=Z(n)&&hi(r)?Number(r)<n.length:ue(n,r),l=Reflect.set(n,r,o,i);return n===de(i)&&(a?Un(o,s)&&dt(n,"set",r,o):dt(n,"add",r,o)),l}}function pf(e,t){const n=ue(e,t);e[t];const r=Reflect.deleteProperty(e,t);return r&&n&&dt(e,"delete",t,void 0),r}function mf(e,t){const n=Reflect.has(e,t);return(!mi(t)||!El.has(t))&&qe(e,"has",t),n}function hf(e){return qe(e,"iterate",Z(e)?"length":Ft),Reflect.ownKeys(e)}const wl={get:af,set:ff,deleteProperty:pf,has:mf,ownKeys:hf},vf={get:cf,set(e,t){return!0},deleteProperty(e,t){return!0}},gf=ke({},wl,{get:lf,set:df}),yi=e=>e,to=e=>Reflect.getPrototypeOf(e);function sr(e,t,n=!1,r=!1){e=e.__v_raw;const o=de(e),i=de(t);t!==i&&!n&&qe(o,"get",t),!n&&qe(o,"get",i);const{has:s}=to(o),a=r?yi:n?wi:Vn;if(s.call(o,t))return a(e.get(t));if(s.call(o,i))return a(e.get(i));e!==o&&e.get(t)}function ar(e,t=!1){const n=this.__v_raw,r=de(n),o=de(e);return e!==o&&!t&&qe(r,"has",e),!t&&qe(r,"has",o),e===o?n.has(e):n.has(e)||n.has(o)}function lr(e,t=!1){return e=e.__v_raw,!t&&qe(de(e),"iterate",Ft),Reflect.get(e,"size",e)}function is(e){e=de(e);const t=de(this);return to(t).has.call(t,e)||(t.add(e),dt(t,"add",e,e)),this}function ss(e,t){t=de(t);const n=de(this),{has:r,get:o}=to(n);let i=r.call(n,e);i||(e=de(e),i=r.call(n,e));const s=o.call(n,e);return n.set(e,t),i?Un(t,s)&&dt(n,"set",e,t):dt(n,"add",e,t),this}function as(e){const t=de(this),{has:n,get:r}=to(t);let o=n.call(t,e);o||(e=de(e),o=n.call(t,e)),r&&r.call(t,e);const i=t.delete(e);return o&&dt(t,"delete",e,void 0),i}function ls(){const e=de(this),t=e.size!==0,n=e.clear();return t&&dt(e,"clear",void 0,void 0),n}function cr(e,t){return function(r,o){const i=this,s=i.__v_raw,a=de(s),l=t?yi:e?wi:Vn;return!e&&qe(a,"iterate",Ft),s.forEach((c,u)=>r.call(o,l(c),l(u),i))}}function ur(e,t,n){return function(...r){const o=this.__v_raw,i=de(o),s=sn(i),a=e==="entries"||e===Symbol.iterator&&s,l=e==="keys"&&s,c=o[e](...r),u=n?yi:t?wi:Vn;return!t&&qe(i,"iterate",l?Do:Ft),{next(){const{value:d,done:f}=c.next();return f?{value:d,done:f}:{value:a?[u(d[0]),u(d[1])]:u(d),done:f}},[Symbol.iterator](){return this}}}}function vt(e){return function(...t){return e==="delete"?!1:this}}function _f(){const e={get(i){return sr(this,i)},get size(){return lr(this)},has:ar,add:is,set:ss,delete:as,clear:ls,forEach:cr(!1,!1)},t={get(i){return sr(this,i,!1,!0)},get size(){return lr(this)},has:ar,add:is,set:ss,delete:as,clear:ls,forEach:cr(!1,!0)},n={get(i){return sr(this,i,!0)},get size(){return lr(this,!0)},has(i){return ar.call(this,i,!0)},add:vt("add"),set:vt("set"),delete:vt("delete"),clear:vt("clear"),forEach:cr(!0,!1)},r={get(i){return sr(this,i,!0,!0)},get size(){return lr(this,!0)},has(i){return ar.call(this,i,!0)},add:vt("add"),set:vt("set"),delete:vt("delete"),clear:vt("clear"),forEach:cr(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(i=>{e[i]=ur(i,!1,!1),n[i]=ur(i,!0,!1),t[i]=ur(i,!1,!0),r[i]=ur(i,!0,!0)}),[e,n,t,r]}const[yf,bf,Ef,Of]=_f();function bi(e,t){const n=t?e?Of:Ef:e?bf:yf;return(r,o,i)=>o==="__v_isReactive"?!e:o==="__v_isReadonly"?e:o==="__v_raw"?r:Reflect.get(ue(n,o)&&o in r?n:r,o,i)}const wf={get:bi(!1,!1)},Sf={get:bi(!1,!0)},Pf={get:bi(!0,!1)},Sl=new WeakMap,Pl=new WeakMap,Cl=new WeakMap,Cf=new WeakMap;function Af(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function If(e){return e.__v_skip||!Object.isExtensible(e)?0:Af(Qu(e))}function gn(e){return qn(e)?e:Oi(e,!1,wl,wf,Sl)}function xf(e){return Oi(e,!1,gf,Sf,Pl)}function Ei(e){return Oi(e,!0,vf,Pf,Cl)}function Oi(e,t,n,r,o){if(!Ce(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const i=o.get(e);if(i)return i;const s=If(e);if(s===0)return e;const a=new Proxy(e,s===2?r:n);return o.set(e,a),a}function an(e){return qn(e)?an(e.__v_raw):!!(e&&e.__v_isReactive)}function qn(e){return!!(e&&e.__v_isReadonly)}function Al(e){return!!(e&&e.__v_isShallow)}function Il(e){return an(e)||qn(e)}function de(e){const t=e&&e.__v_raw;return t?de(t):e}function xl(e){return jr(e,"__v_skip",!0),e}const Vn=e=>Ce(e)?gn(e):e,wi=e=>Ce(e)?Ei(e):e;function jl(e){Pt&&rt&&(e=de(e),bl(e.dep||(e.dep=vi())))}function Tl(e,t){e=de(e),e.dep&&Ro(e.dep)}function xe(e){return!!(e&&e.__v_isRef===!0)}function Le(e){return Dl(e,!1)}function kl(e){return Dl(e,!0)}function Dl(e,t){return xe(e)?e:new jf(e,t)}class jf{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:de(t),this._value=n?t:Vn(t)}get value(){return jl(this),this._value}set value(t){t=this.__v_isShallow?t:de(t),Un(t,this._rawValue)&&(this._rawValue=t,this._value=this.__v_isShallow?t:Vn(t),Tl(this))}}function zt(e){return xe(e)?e.value:e}const Tf={get:(e,t,n)=>zt(Reflect.get(e,t,n)),set:(e,t,n,r)=>{const o=e[t];return xe(o)&&!xe(n)?(o.value=n,!0):Reflect.set(e,t,n,r)}};function Rl(e){return an(e)?e:new Proxy(e,Tf)}function H0(e){const t=Z(e)?new Array(e.length):{};for(const n in e)t[n]=Df(e,n);return t}class kf{constructor(t,n,r){this._object=t,this._key=n,this._defaultValue=r,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}}function Df(e,t,n){const r=e[t];return xe(r)?r:new kf(e,t,n)}class Rf{constructor(t,n,r,o){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this._dirty=!0,this.effect=new gi(t,()=>{this._dirty||(this._dirty=!0,Tl(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!o,this.__v_isReadonly=r}get value(){const t=de(this);return jl(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function Lf(e,t,n=!1){let r,o;const i=oe(e);return i?(r=e,o=Xe):(r=e.get,o=e.set),new Rf(r,o,i||!o,n)}Promise.resolve();function Ct(e,t,n,r){let o;try{o=r?e(...r):e()}catch(i){nr(i,t,n)}return o}function Je(e,t,n,r){if(oe(e)){const i=Ct(e,t,n,r);return i&&pl(i)&&i.catch(s=>{nr(s,t,n)}),i}const o=[];for(let i=0;i<e.length;i++)o.push(Je(e[i],t,n,r));return o}function nr(e,t,n,r=!0){const o=t?t.vnode:null;if(t){let i=t.parent;const s=t.proxy,a=n;for(;i;){const c=i.ec;if(c){for(let u=0;u<c.length;u++)if(c[u](e,s,a)===!1)return}i=i.parent}const l=t.appContext.config.errorHandler;if(l){Ct(l,null,10,[e,s,a]);return}}Nf(e,n,o,r)}function Nf(e,t,n,r=!0){console.error(e)}let Tr=!1,Lo=!1;const Be=[];let lt=0;const Dn=[];let xn=null,Gt=0;const Rn=[];let Et=null,Zt=0;const Ll=Promise.resolve();let Si=null,No=null;function Pi(e){const t=Si||Ll;return e?t.then(this?e.bind(this):e):t}function Mf(e){let t=lt+1,n=Be.length;for(;t<n;){const r=t+n>>>1;Kn(Be[r])<e?t=r+1:n=r}return t}function Ci(e){(!Be.length||!Be.includes(e,Tr&&e.allowRecurse?lt+1:lt))&&e!==No&&(e.id==null?Be.push(e):Be.splice(Mf(e.id),0,e),Nl())}function Nl(){!Tr&&!Lo&&(Lo=!0,Si=Ll.then(Hl))}function Hf(e){const t=Be.indexOf(e);t>lt&&Be.splice(t,1)}function Ml(e,t,n,r){Z(e)?n.push(...e):(!t||!t.includes(e,e.allowRecurse?r+1:r))&&n.push(e),Nl()}function Ff(e){Ml(e,xn,Dn,Gt)}function zf(e){Ml(e,Et,Rn,Zt)}function Ai(e,t=null){if(Dn.length){for(No=t,xn=[...new Set(Dn)],Dn.length=0,Gt=0;Gt<xn.length;Gt++)xn[Gt]();xn=null,Gt=0,No=null,Ai(e,t)}}function kr(e){if(Rn.length){const t=[...new Set(Rn)];if(Rn.length=0,Et){Et.push(...t);return}for(Et=t,Et.sort((n,r)=>Kn(n)-Kn(r)),Zt=0;Zt<Et.length;Zt++)Et[Zt]();Et=null,Zt=0}}const Kn=e=>e.id==null?1/0:e.id;function Hl(e){Lo=!1,Tr=!0,Ai(e),Be.sort((n,r)=>Kn(n)-Kn(r));const t=Xe;try{for(lt=0;lt<Be.length;lt++){const n=Be[lt];n&&n.active!==!1&&Ct(n,null,14)}}finally{lt=0,Be.length=0,kr(),Tr=!1,Si=null,(Be.length||Dn.length||Rn.length)&&Hl(e)}}function $f(e,t,...n){const r=e.vnode.props||ge;let o=n;const i=t.startsWith("update:"),s=i&&t.slice(7);if(s&&s in r){const u=`${s==="modelValue"?"model":s}Modifiers`,{number:d,trim:f}=r[u]||ge;f?o=n.map(h=>h.trim()):d&&(o=n.map(vl))}let a,l=r[a=uo(t)]||r[a=uo(st(t))];!l&&i&&(l=r[a=uo(qt(t))]),l&&Je(l,e,6,o);const c=r[a+"Once"];if(c){if(!e.emitted)e.emitted={};else if(e.emitted[a])return;e.emitted[a]=!0,Je(c,e,6,o)}}function Fl(e,t,n=!1){const r=t.emitsCache,o=r.get(e);if(o!==void 0)return o;const i=e.emits;let s={},a=!1;if(!oe(e)){const l=c=>{const u=Fl(c,t,!0);u&&(a=!0,ke(s,u))};!n&&t.mixins.length&&t.mixins.forEach(l),e.extends&&l(e.extends),e.mixins&&e.mixins.forEach(l)}return!i&&!a?(r.set(e,null),null):(Z(i)?i.forEach(l=>s[l]=null):ke(s,i),r.set(e,s),s)}function Ii(e,t){return!e||!tr(t)?!1:(t=t.slice(2).replace(/Once$/,""),ue(e,t[0].toLowerCase()+t.slice(1))||ue(e,qt(t))||ue(e,t))}let Ue=null,zl=null;function Dr(e){const t=Ue;return Ue=e,zl=e&&e.type.__scopeId||null,t}function Bf(e,t=Ue,n){if(!t||e._n)return e;const r=(...o)=>{r._d&&bs(-1);const i=Dr(t),s=e(...o);return Dr(i),r._d&&bs(1),s};return r._n=!0,r._c=!0,r._d=!0,r}function po(e){const{type:t,vnode:n,proxy:r,withProxy:o,props:i,propsOptions:[s],slots:a,attrs:l,emit:c,render:u,renderCache:d,data:f,setupState:h,ctx:p,inheritAttrs:g}=e;let v,_;const E=Dr(e);try{if(n.shapeFlag&4){const w=o||r;v=Ze(u.call(w,w,d,i,h,f,p)),_=l}else{const w=t;v=Ze(w.length>1?w(i,{attrs:l,slots:a,emit:c}):w(i,null)),_=t.props?l:Uf(l)}}catch(w){Mn.length=0,nr(w,e,1),v=Se(Qe)}let S=v;if(_&&g!==!1){const w=Object.keys(_),{shapeFlag:I}=S;w.length&&I&7&&(s&&w.some(di)&&(_=qf(_,s)),S=ln(S,_))}return n.dirs&&(S.dirs=S.dirs?S.dirs.concat(n.dirs):n.dirs),n.transition&&(S.transition=n.transition),v=S,Dr(E),v}const Uf=e=>{let t;for(const n in e)(n==="class"||n==="style"||tr(n))&&((t||(t={}))[n]=e[n]);return t},qf=(e,t)=>{const n={};for(const r in e)(!di(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function Vf(e,t,n){const{props:r,children:o,component:i}=e,{props:s,children:a,patchFlag:l}=t,c=i.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&l>=0){if(l&1024)return!0;if(l&16)return r?cs(r,s,c):!!s;if(l&8){const u=t.dynamicProps;for(let d=0;d<u.length;d++){const f=u[d];if(s[f]!==r[f]&&!Ii(c,f))return!0}}}else return(o||a)&&(!a||!a.$stable)?!0:r===s?!1:r?s?cs(r,s,c):!0:!!s;return!1}function cs(e,t,n){const r=Object.keys(t);if(r.length!==Object.keys(e).length)return!0;for(let o=0;o<r.length;o++){const i=r[o];if(t[i]!==e[i]&&!Ii(n,i))return!0}return!1}function Kf({vnode:e,parent:t},n){for(;t&&t.subTree===e;)(e=t.vnode).el=n,t=t.parent}const Wf=e=>e.__isSuspense;function $l(e,t){t&&t.pendingBranch?Z(e)?t.effects.push(...e):t.effects.push(e):zf(e)}function $t(e,t){if(Ie){let n=Ie.provides;const r=Ie.parent&&Ie.parent.provides;r===n&&(n=Ie.provides=Object.create(r)),n[e]=t}}function je(e,t,n=!1){const r=Ie||Ue;if(r){const o=r.parent==null?r.vnode.appContext&&r.vnode.appContext.provides:r.parent.provides;if(o&&e in o)return o[e];if(arguments.length>1)return n&&oe(t)?t.call(r.proxy):t}}const us={};function et(e,t,n){return Bl(e,t,n)}function Bl(e,t,{immediate:n,deep:r,flush:o,onTrack:i,onTrigger:s}=ge){const a=Ie;let l,c=!1,u=!1;if(xe(e)?(l=()=>e.value,c=Al(e)):an(e)?(l=()=>e,r=!0):Z(e)?(u=!0,c=e.some(an),l=()=>e.map(_=>{if(xe(_))return _.value;if(an(_))return Ht(_);if(oe(_))return Ct(_,a,2)})):oe(e)?t?l=()=>Ct(e,a,2):l=()=>{if(!(a&&a.isUnmounted))return d&&d(),Je(e,a,3,[f])}:l=Xe,t&&r){const _=l;l=()=>Ht(_())}let d,f=_=>{d=v.onStop=()=>{Ct(_,a,4)}};if(un)return f=Xe,t?n&&Je(t,a,3,[l(),u?[]:void 0,f]):l(),Xe;let h=u?[]:us;const p=()=>{if(!!v.active)if(t){const _=v.run();(r||c||(u?_.some((E,S)=>Un(E,h[S])):Un(_,h)))&&(d&&d(),Je(t,a,3,[_,h===us?void 0:h,f]),h=_)}else v.run()};p.allowRecurse=!!t;let g;o==="sync"?g=p:o==="post"?g=()=>He(p,a&&a.suspense):g=()=>{!a||a.isMounted?Ff(p):p()};const v=new gi(l,g);return t?n?p():h=v.run():o==="post"?He(v.run.bind(v),a&&a.suspense):v.run(),()=>{v.stop(),a&&a.scope&&pi(a.scope.effects,v)}}function Jf(e,t,n){const r=this.proxy,o=me(e)?e.includes(".")?Ul(r,e):()=>r[e]:e.bind(r,r);let i;oe(t)?i=t:(i=t.handler,n=t);const s=Ie;cn(this);const a=Bl(o,i.bind(r),n);return s?cn(s):Ut(),a}function Ul(e,t){const n=t.split(".");return()=>{let r=e;for(let o=0;o<n.length&&r;o++)r=r[n[o]];return r}}function Ht(e,t){if(!Ce(e)||e.__v_skip||(t=t||new Set,t.has(e)))return e;if(t.add(e),xe(e))Ht(e.value,t);else if(Z(e))for(let n=0;n<e.length;n++)Ht(e[n],t);else if(dl(e)||sn(e))e.forEach(n=>{Ht(n,t)});else if(hl(e))for(const n in e)Ht(e[n],t);return e}function Qf(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return mt(()=>{e.isMounted=!0}),xi(()=>{e.isUnmounting=!0}),e}const Ve=[Function,Array],Yf={name:"BaseTransition",props:{mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:Ve,onEnter:Ve,onAfterEnter:Ve,onEnterCancelled:Ve,onBeforeLeave:Ve,onLeave:Ve,onAfterLeave:Ve,onLeaveCancelled:Ve,onBeforeAppear:Ve,onAppear:Ve,onAfterAppear:Ve,onAppearCancelled:Ve},setup(e,{slots:t}){const n=Ni(),r=Qf();let o;return()=>{const i=t.default&&Kl(t.default(),!0);if(!i||!i.length)return;const s=de(e),{mode:a}=s,l=i[0];if(r.isLeaving)return mo(l);const c=fs(l);if(!c)return mo(l);const u=Mo(c,s,r,n);Ho(c,u);const d=n.subTree,f=d&&fs(d);let h=!1;const{getTransitionKey:p}=c.type;if(p){const g=p();o===void 0?o=g:g!==o&&(o=g,h=!0)}if(f&&f.type!==Qe&&(!Nt(c,f)||h)){const g=Mo(f,s,r,n);if(Ho(f,g),a==="out-in")return r.isLeaving=!0,g.afterLeave=()=>{r.isLeaving=!1,n.update()},mo(l);a==="in-out"&&c.type!==Qe&&(g.delayLeave=(v,_,E)=>{const S=Vl(r,f);S[String(f.key)]=f,v._leaveCb=()=>{_(),v._leaveCb=void 0,delete u.delayedLeave},u.delayedLeave=E})}return l}}},ql=Yf;function Vl(e,t){const{leavingVNodes:n}=e;let r=n.get(t.type);return r||(r=Object.create(null),n.set(t.type,r)),r}function Mo(e,t,n,r){const{appear:o,mode:i,persisted:s=!1,onBeforeEnter:a,onEnter:l,onAfterEnter:c,onEnterCancelled:u,onBeforeLeave:d,onLeave:f,onAfterLeave:h,onLeaveCancelled:p,onBeforeAppear:g,onAppear:v,onAfterAppear:_,onAppearCancelled:E}=t,S=String(e.key),w=Vl(n,e),I=(C,P)=>{C&&Je(C,r,9,P)},k={mode:i,persisted:s,beforeEnter(C){let P=a;if(!n.isMounted)if(o)P=g||a;else return;C._leaveCb&&C._leaveCb(!0);const H=w[S];H&&Nt(e,H)&&H.el._leaveCb&&H.el._leaveCb(),I(P,[C])},enter(C){let P=l,H=c,$=u;if(!n.isMounted)if(o)P=v||l,H=_||c,$=E||u;else return;let B=!1;const A=C._enterCb=z=>{B||(B=!0,z?I($,[C]):I(H,[C]),k.delayedLeave&&k.delayedLeave(),C._enterCb=void 0)};P?(P(C,A),P.length<=1&&A()):A()},leave(C,P){const H=String(e.key);if(C._enterCb&&C._enterCb(!0),n.isUnmounting)return P();I(d,[C]);let $=!1;const B=C._leaveCb=A=>{$||($=!0,P(),A?I(p,[C]):I(h,[C]),C._leaveCb=void 0,w[H]===e&&delete w[H])};w[H]=e,f?(f(C,B),f.length<=1&&B()):B()},clone(C){return Mo(C,t,n,r)}};return k}function mo(e){if(rr(e))return e=ln(e),e.children=null,e}function fs(e){return rr(e)?e.children?e.children[0]:void 0:e}function Ho(e,t){e.shapeFlag&6&&e.component?Ho(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function Kl(e,t=!1){let n=[],r=0;for(let o=0;o<e.length;o++){const i=e[o];i.type===Fe?(i.patchFlag&128&&r++,n=n.concat(Kl(i.children,t))):(t||i.type!==Qe)&&n.push(i)}if(r>1)for(let o=0;o<n.length;o++)n[o].patchFlag=-2;return n}function Ye(e){return oe(e)?{setup:e,name:e.name}:e}const Rr=e=>!!e.type.__asyncLoader;function ce(e){oe(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:r,delay:o=200,timeout:i,suspensible:s=!0,onError:a}=e;let l=null,c,u=0;const d=()=>(u++,l=null,f()),f=()=>{let h;return l||(h=l=t().catch(p=>{if(p=p instanceof Error?p:new Error(String(p)),a)return new Promise((g,v)=>{a(p,()=>g(d()),()=>v(p),u+1)});throw p}).then(p=>h!==l&&l?l:(p&&(p.__esModule||p[Symbol.toStringTag]==="Module")&&(p=p.default),c=p,p)))};return Ye({name:"AsyncComponentWrapper",__asyncLoader:f,get __asyncResolved(){return c},setup(){const h=Ie;if(c)return()=>ho(c,h);const p=E=>{l=null,nr(E,h,13,!r)};if(s&&h.suspense||un)return f().then(E=>()=>ho(E,h)).catch(E=>(p(E),()=>r?Se(r,{error:E}):null));const g=Le(!1),v=Le(),_=Le(!!o);return o&&setTimeout(()=>{_.value=!1},o),i!=null&&setTimeout(()=>{if(!g.value&&!v.value){const E=new Error(`Async component timed out after ${i}ms.`);p(E),v.value=E}},i),f().then(()=>{g.value=!0,h.parent&&rr(h.parent.vnode)&&Ci(h.parent.update)}).catch(E=>{p(E),v.value=E}),()=>{if(g.value&&c)return ho(c,h);if(v.value&&r)return Se(r,{error:v.value});if(n&&!_.value)return Se(n)}}})}function ho(e,{vnode:{ref:t,props:n,children:r}}){const o=Se(e,n,r);return o.ref=t,o}const rr=e=>e.type.__isKeepAlive;function Gf(e,t){Wl(e,"a",t)}function Zf(e,t){Wl(e,"da",t)}function Wl(e,t,n=Ie){const r=e.__wdc||(e.__wdc=()=>{let o=n;for(;o;){if(o.isDeactivated)return;o=o.parent}return e()});if(no(t,r,n),n){let o=n.parent;for(;o&&o.parent;)rr(o.parent.vnode)&&Xf(r,t,n,o),o=o.parent}}function Xf(e,t,n,r){const o=no(t,e,r,!0);ji(()=>{pi(r[t],o)},n)}function no(e,t,n=Ie,r=!1){if(n){const o=n[e]||(n[e]=[]),i=t.__weh||(t.__weh=(...s)=>{if(n.isUnmounted)return;hn(),cn(n);const a=Je(t,n,e,s);return Ut(),vn(),a});return r?o.unshift(i):o.push(i),i}}const pt=e=>(t,n=Ie)=>(!un||e==="sp")&&no(e,t,n),Jl=pt("bm"),mt=pt("m"),ed=pt("bu"),td=pt("u"),xi=pt("bum"),ji=pt("um"),nd=pt("sp"),rd=pt("rtg"),od=pt("rtc");function id(e,t=Ie){no("ec",e,t)}let Fo=!0;function sd(e){const t=Yl(e),n=e.proxy,r=e.ctx;Fo=!1,t.beforeCreate&&ds(t.beforeCreate,e,"bc");const{data:o,computed:i,methods:s,watch:a,provide:l,inject:c,created:u,beforeMount:d,mounted:f,beforeUpdate:h,updated:p,activated:g,deactivated:v,beforeDestroy:_,beforeUnmount:E,destroyed:S,unmounted:w,render:I,renderTracked:k,renderTriggered:C,errorCaptured:P,serverPrefetch:H,expose:$,inheritAttrs:B,components:A,directives:z,filters:Q}=t;if(c&&ad(c,r,null,e.appContext.config.unwrapInjectedRef),s)for(const ee in s){const te=s[ee];oe(te)&&(r[ee]=te.bind(n))}if(o){const ee=o.call(n,n);Ce(ee)&&(e.data=gn(ee))}if(Fo=!0,i)for(const ee in i){const te=i[ee],Ee=oe(te)?te.bind(n,n):oe(te.get)?te.get.bind(n,n):Xe,Pe=!oe(te)&&oe(te.set)?te.set.bind(n):Xe,Ae=Oe({get:Ee,set:Pe});Object.defineProperty(r,ee,{enumerable:!0,configurable:!0,get:()=>Ae.value,set:we=>Ae.value=we})}if(a)for(const ee in a)Ql(a[ee],r,n,ee);if(l){const ee=oe(l)?l.call(n):l;Reflect.ownKeys(ee).forEach(te=>{$t(te,ee[te])})}u&&ds(u,e,"c");function W(ee,te){Z(te)?te.forEach(Ee=>ee(Ee.bind(n))):te&&ee(te.bind(n))}if(W(Jl,d),W(mt,f),W(ed,h),W(td,p),W(Gf,g),W(Zf,v),W(id,P),W(od,k),W(rd,C),W(xi,E),W(ji,w),W(nd,H),Z($))if($.length){const ee=e.exposed||(e.exposed={});$.forEach(te=>{Object.defineProperty(ee,te,{get:()=>n[te],set:Ee=>n[te]=Ee})})}else e.exposed||(e.exposed={});I&&e.render===Xe&&(e.render=I),B!=null&&(e.inheritAttrs=B),A&&(e.components=A),z&&(e.directives=z)}function ad(e,t,n=Xe,r=!1){Z(e)&&(e=zo(e));for(const o in e){const i=e[o];let s;Ce(i)?"default"in i?s=je(i.from||o,i.default,!0):s=je(i.from||o):s=je(i),xe(s)&&r?Object.defineProperty(t,o,{enumerable:!0,configurable:!0,get:()=>s.value,set:a=>s.value=a}):t[o]=s}}function ds(e,t,n){Je(Z(e)?e.map(r=>r.bind(t.proxy)):e.bind(t.proxy),t,n)}function Ql(e,t,n,r){const o=r.includes(".")?Ul(n,r):()=>n[r];if(me(e)){const i=t[e];oe(i)&&et(o,i)}else if(oe(e))et(o,e.bind(n));else if(Ce(e))if(Z(e))e.forEach(i=>Ql(i,t,n,r));else{const i=oe(e.handler)?e.handler.bind(n):t[e.handler];oe(i)&&et(o,i,e)}}function Yl(e){const t=e.type,{mixins:n,extends:r}=t,{mixins:o,optionsCache:i,config:{optionMergeStrategies:s}}=e.appContext,a=i.get(t);let l;return a?l=a:!o.length&&!n&&!r?l=t:(l={},o.length&&o.forEach(c=>Lr(l,c,s,!0)),Lr(l,t,s)),i.set(t,l),l}function Lr(e,t,n,r=!1){const{mixins:o,extends:i}=t;i&&Lr(e,i,n,!0),o&&o.forEach(s=>Lr(e,s,n,!0));for(const s in t)if(!(r&&s==="expose")){const a=ld[s]||n&&n[s];e[s]=a?a(e[s],t[s]):t[s]}return e}const ld={data:ps,props:Dt,emits:Dt,methods:Dt,computed:Dt,beforeCreate:Ne,created:Ne,beforeMount:Ne,mounted:Ne,beforeUpdate:Ne,updated:Ne,beforeDestroy:Ne,beforeUnmount:Ne,destroyed:Ne,unmounted:Ne,activated:Ne,deactivated:Ne,errorCaptured:Ne,serverPrefetch:Ne,components:Dt,directives:Dt,watch:ud,provide:ps,inject:cd};function ps(e,t){return t?e?function(){return ke(oe(e)?e.call(this,this):e,oe(t)?t.call(this,this):t)}:t:e}function cd(e,t){return Dt(zo(e),zo(t))}function zo(e){if(Z(e)){const t={};for(let n=0;n<e.length;n++)t[e[n]]=e[n];return t}return e}function Ne(e,t){return e?[...new Set([].concat(e,t))]:t}function Dt(e,t){return e?ke(ke(Object.create(null),e),t):t}function ud(e,t){if(!e)return t;if(!t)return e;const n=ke(Object.create(null),e);for(const r in t)n[r]=Ne(e[r],t[r]);return n}function fd(e,t,n,r=!1){const o={},i={};jr(i,oo,1),e.propsDefaults=Object.create(null),Gl(e,t,o,i);for(const s in e.propsOptions[0])s in o||(o[s]=void 0);n?e.props=r?o:xf(o):e.type.props?e.props=o:e.props=i,e.attrs=i}function dd(e,t,n,r){const{props:o,attrs:i,vnode:{patchFlag:s}}=e,a=de(o),[l]=e.propsOptions;let c=!1;if((r||s>0)&&!(s&16)){if(s&8){const u=e.vnode.dynamicProps;for(let d=0;d<u.length;d++){let f=u[d];const h=t[f];if(l)if(ue(i,f))h!==i[f]&&(i[f]=h,c=!0);else{const p=st(f);o[p]=$o(l,a,p,h,e,!1)}else h!==i[f]&&(i[f]=h,c=!0)}}}else{Gl(e,t,o,i)&&(c=!0);let u;for(const d in a)(!t||!ue(t,d)&&((u=qt(d))===d||!ue(t,u)))&&(l?n&&(n[d]!==void 0||n[u]!==void 0)&&(o[d]=$o(l,a,d,void 0,e,!0)):delete o[d]);if(i!==a)for(const d in i)(!t||!ue(t,d)&&!0)&&(delete i[d],c=!0)}c&&dt(e,"set","$attrs")}function Gl(e,t,n,r){const[o,i]=e.propsOptions;let s=!1,a;if(t)for(let l in t){if(kn(l))continue;const c=t[l];let u;o&&ue(o,u=st(l))?!i||!i.includes(u)?n[u]=c:(a||(a={}))[u]=c:Ii(e.emitsOptions,l)||(!(l in r)||c!==r[l])&&(r[l]=c,s=!0)}if(i){const l=de(n),c=a||ge;for(let u=0;u<i.length;u++){const d=i[u];n[d]=$o(o,l,d,c[d],e,!ue(c,d))}}return s}function $o(e,t,n,r,o,i){const s=e[n];if(s!=null){const a=ue(s,"default");if(a&&r===void 0){const l=s.default;if(s.type!==Function&&oe(l)){const{propsDefaults:c}=o;n in c?r=c[n]:(cn(o),r=c[n]=l.call(null,t),Ut())}else r=l}s[0]&&(i&&!a?r=!1:s[1]&&(r===""||r===qt(n))&&(r=!0))}return r}function Zl(e,t,n=!1){const r=t.propsCache,o=r.get(e);if(o)return o;const i=e.props,s={},a=[];let l=!1;if(!oe(e)){const u=d=>{l=!0;const[f,h]=Zl(d,t,!0);ke(s,f),h&&a.push(...h)};!n&&t.mixins.length&&t.mixins.forEach(u),e.extends&&u(e.extends),e.mixins&&e.mixins.forEach(u)}if(!i&&!l)return r.set(e,on),on;if(Z(i))for(let u=0;u<i.length;u++){const d=st(i[u]);ms(d)&&(s[d]=ge)}else if(i)for(const u in i){const d=st(u);if(ms(d)){const f=i[u],h=s[d]=Z(f)||oe(f)?{type:f}:f;if(h){const p=gs(Boolean,h.type),g=gs(String,h.type);h[0]=p>-1,h[1]=g<0||p<g,(p>-1||ue(h,"default"))&&a.push(d)}}}const c=[s,a];return r.set(e,c),c}function ms(e){return e[0]!=="$"}function hs(e){const t=e&&e.toString().match(/^\s*function (\w+)/);return t?t[1]:e===null?"null":""}function vs(e,t){return hs(e)===hs(t)}function gs(e,t){return Z(t)?t.findIndex(n=>vs(n,e)):oe(t)&&vs(t,e)?0:-1}const Xl=e=>e[0]==="_"||e==="$stable",Ti=e=>Z(e)?e.map(Ze):[Ze(e)],pd=(e,t,n)=>{const r=Bf((...o)=>Ti(t(...o)),n);return r._c=!1,r},ec=(e,t,n)=>{const r=e._ctx;for(const o in e){if(Xl(o))continue;const i=e[o];if(oe(i))t[o]=pd(o,i,r);else if(i!=null){const s=Ti(i);t[o]=()=>s}}},tc=(e,t)=>{const n=Ti(t);e.slots.default=()=>n},md=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=de(t),jr(t,"_",n)):ec(t,e.slots={})}else e.slots={},t&&tc(e,t);jr(e.slots,oo,1)},hd=(e,t,n)=>{const{vnode:r,slots:o}=e;let i=!0,s=ge;if(r.shapeFlag&32){const a=t._;a?n&&a===1?i=!1:(ke(o,t),!n&&a===1&&delete o._):(i=!t.$stable,ec(t,o)),s=t}else t&&(tc(e,t),s={default:1});if(i)for(const a in o)!Xl(a)&&!(a in s)&&delete o[a]};function F0(e,t){const n=Ue;if(n===null)return e;const r=n.proxy,o=e.dirs||(e.dirs=[]);for(let i=0;i<t.length;i++){let[s,a,l,c=ge]=t[i];oe(s)&&(s={mounted:s,updated:s}),s.deep&&Ht(a),o.push({dir:s,instance:r,value:a,oldValue:void 0,arg:l,modifiers:c})}return e}function nt(e,t,n,r){const o=e.dirs,i=t&&t.dirs;for(let s=0;s<o.length;s++){const a=o[s];i&&(a.oldValue=i[s].value);let l=a.dir[r];l&&(hn(),Je(l,n,8,[e.el,a,e,t]),vn())}}function nc(){return{app:null,config:{isNativeTag:Ku,performance:!1,globalProperties:{},optionMergeStrategies:{},errorHandler:void 0,warnHandler:void 0,compilerOptions:{}},mixins:[],components:{},directives:{},provides:Object.create(null),optionsCache:new WeakMap,propsCache:new WeakMap,emitsCache:new WeakMap}}let vd=0;function gd(e,t){return function(r,o=null){o!=null&&!Ce(o)&&(o=null);const i=nc(),s=new Set;let a=!1;const l=i.app={_uid:vd++,_component:r,_props:o,_container:null,_context:i,_instance:null,version:zd,get config(){return i.config},set config(c){},use(c,...u){return s.has(c)||(c&&oe(c.install)?(s.add(c),c.install(l,...u)):oe(c)&&(s.add(c),c(l,...u))),l},mixin(c){return i.mixins.includes(c)||i.mixins.push(c),l},component(c,u){return u?(i.components[c]=u,l):i.components[c]},directive(c,u){return u?(i.directives[c]=u,l):i.directives[c]},mount(c,u,d){if(!a){const f=Se(r,o);return f.appContext=i,u&&t?t(f,c):e(f,c,d),a=!0,l._container=c,c.__vue_app__=l,Mi(f.component)||f.component.proxy}},unmount(){a&&(e(null,l._container),delete l._container.__vue_app__)},provide(c,u){return i.provides[c]=u,l}};return l}}function Nr(e,t,n,r,o=!1){if(Z(e)){e.forEach((f,h)=>Nr(f,t&&(Z(t)?t[h]:t),n,r,o));return}if(Rr(r)&&!o)return;const i=r.shapeFlag&4?Mi(r.component)||r.component.proxy:r.el,s=o?null:i,{i:a,r:l}=e,c=t&&t.r,u=a.refs===ge?a.refs={}:a.refs,d=a.setupState;if(c!=null&&c!==l&&(me(c)?(u[c]=null,ue(d,c)&&(d[c]=null)):xe(c)&&(c.value=null)),oe(l))Ct(l,a,12,[s,u]);else{const f=me(l),h=xe(l);if(f||h){const p=()=>{if(e.f){const g=f?u[l]:l.value;o?Z(g)&&pi(g,i):Z(g)?g.includes(i)||g.push(i):f?u[l]=[i]:(l.value=[i],e.k&&(u[e.k]=l.value))}else f?(u[l]=s,ue(d,l)&&(d[l]=s)):xe(l)&&(l.value=s,e.k&&(u[e.k]=s))};s?(p.id=-1,He(p,n)):p()}}}let gt=!1;const fr=e=>/svg/.test(e.namespaceURI)&&e.tagName!=="foreignObject",vo=e=>e.nodeType===8;function _d(e){const{mt:t,p:n,o:{patchProp:r,nextSibling:o,parentNode:i,remove:s,insert:a,createComment:l}}=e,c=(v,_)=>{if(!_.hasChildNodes()){n(null,v,_),kr();return}gt=!1,u(_.firstChild,v,null,null,null),kr(),gt&&console.error("Hydration completed but contains mismatches.")},u=(v,_,E,S,w,I=!1)=>{const k=vo(v)&&v.data==="[",C=()=>p(v,_,E,S,w,k),{type:P,ref:H,shapeFlag:$}=_,B=v.nodeType;_.el=v;let A=null;switch(P){case Wn:B!==3?A=C():(v.data!==_.children&&(gt=!0,v.data=_.children),A=o(v));break;case Qe:B!==8||k?A=C():A=o(v);break;case Nn:if(B!==1)A=C();else{A=v;const z=!_.children.length;for(let Q=0;Q<_.staticCount;Q++)z&&(_.children+=A.outerHTML),Q===_.staticCount-1&&(_.anchor=A),A=o(A);return A}break;case Fe:k?A=h(v,_,E,S,w,I):A=C();break;default:if($&1)B!==1||_.type.toLowerCase()!==v.tagName.toLowerCase()?A=C():A=d(v,_,E,S,w,I);else if($&6){_.slotScopeIds=w;const z=i(v);if(t(_,z,null,E,S,fr(z),I),A=k?g(v):o(v),Rr(_)){let Q;k?(Q=Se(Fe),Q.anchor=A?A.previousSibling:z.lastChild):Q=v.nodeType===3?Ri(""):Se("div"),Q.el=v,_.component.subTree=Q}}else $&64?B!==8?A=C():A=_.type.hydrate(v,_,E,S,w,I,e,f):$&128&&(A=_.type.hydrate(v,_,E,S,fr(i(v)),w,I,e,u))}return H!=null&&Nr(H,null,S,_),A},d=(v,_,E,S,w,I)=>{I=I||!!_.dynamicChildren;const{type:k,props:C,patchFlag:P,shapeFlag:H,dirs:$}=_,B=k==="input"&&$||k==="option";if(B||P!==-1){if($&&nt(_,null,E,"created"),C)if(B||!I||P&48)for(const z in C)(B&&z.endsWith("value")||tr(z)&&!kn(z))&&r(v,z,null,C[z],!1,void 0,E);else C.onClick&&r(v,"onClick",null,C.onClick,!1,void 0,E);let A;if((A=C&&C.onVnodeBeforeMount)&&Ke(A,E,_),$&&nt(_,null,E,"beforeMount"),((A=C&&C.onVnodeMounted)||$)&&$l(()=>{A&&Ke(A,E,_),$&&nt(_,null,E,"mounted")},S),H&16&&!(C&&(C.innerHTML||C.textContent))){let z=f(v.firstChild,_,v,E,S,w,I);for(;z;){gt=!0;const Q=z;z=z.nextSibling,s(Q)}}else H&8&&v.textContent!==_.children&&(gt=!0,v.textContent=_.children)}return v.nextSibling},f=(v,_,E,S,w,I,k)=>{k=k||!!_.dynamicChildren;const C=_.children,P=C.length;for(let H=0;H<P;H++){const $=k?C[H]:C[H]=Ze(C[H]);if(v)v=u(v,$,S,w,I,k);else{if($.type===Wn&&!$.children)continue;gt=!0,n(null,$,E,null,S,w,fr(E),I)}}return v},h=(v,_,E,S,w,I)=>{const{slotScopeIds:k}=_;k&&(w=w?w.concat(k):k);const C=i(v),P=f(o(v),_,C,E,S,w,I);return P&&vo(P)&&P.data==="]"?o(_.anchor=P):(gt=!0,a(_.anchor=l("]"),C,P),P)},p=(v,_,E,S,w,I)=>{if(gt=!0,_.el=null,I){const P=g(v);for(;;){const H=o(v);if(H&&H!==P)s(H);else break}}const k=o(v),C=i(v);return s(v),n(null,_,C,k,E,S,fr(C),w),k},g=v=>{let _=0;for(;v;)if(v=o(v),v&&vo(v)&&(v.data==="["&&_++,v.data==="]")){if(_===0)return o(v);_--}return v};return[c,u]}const He=$l;function yd(e){return bd(e,_d)}function bd(e,t){const n=Zu();n.__VUE__=!0;const{insert:r,remove:o,patchProp:i,createElement:s,createText:a,createComment:l,setText:c,setElementText:u,parentNode:d,nextSibling:f,setScopeId:h=Xe,cloneNode:p,insertStaticContent:g}=e,v=(m,y,O,x=null,T=null,D=null,M=!1,R=null,F=!!y.dynamicChildren)=>{if(m===y)return;m&&!Nt(m,y)&&(x=q(m),Te(m,T,D,!0),m=null),y.patchFlag===-2&&(F=!1,y.dynamicChildren=null);const{type:L,ref:J,shapeFlag:K}=y;switch(L){case Wn:_(m,y,O,x);break;case Qe:E(m,y,O,x);break;case Nn:m==null&&S(y,O,x,M);break;case Fe:z(m,y,O,x,T,D,M,R,F);break;default:K&1?k(m,y,O,x,T,D,M,R,F):K&6?Q(m,y,O,x,T,D,M,R,F):(K&64||K&128)&&L.process(m,y,O,x,T,D,M,R,F,pe)}J!=null&&T&&Nr(J,m&&m.ref,D,y||m,!y)},_=(m,y,O,x)=>{if(m==null)r(y.el=a(y.children),O,x);else{const T=y.el=m.el;y.children!==m.children&&c(T,y.children)}},E=(m,y,O,x)=>{m==null?r(y.el=l(y.children||""),O,x):y.el=m.el},S=(m,y,O,x)=>{[m.el,m.anchor]=g(m.children,y,O,x,m.el,m.anchor)},w=({el:m,anchor:y},O,x)=>{let T;for(;m&&m!==y;)T=f(m),r(m,O,x),m=T;r(y,O,x)},I=({el:m,anchor:y})=>{let O;for(;m&&m!==y;)O=f(m),o(m),m=O;o(y)},k=(m,y,O,x,T,D,M,R,F)=>{M=M||y.type==="svg",m==null?C(y,O,x,T,D,M,R,F):$(m,y,T,D,M,R,F)},C=(m,y,O,x,T,D,M,R)=>{let F,L;const{type:J,props:K,shapeFlag:V,transition:G,patchFlag:ie,dirs:be}=m;if(m.el&&p!==void 0&&ie===-1)F=m.el=p(m.el);else{if(F=m.el=s(m.type,D,K&&K.is,K),V&8?u(F,m.children):V&16&&H(m.children,F,null,x,T,D&&J!=="foreignObject",M,R),be&&nt(m,null,x,"created"),K){for(const _e in K)_e!=="value"&&!kn(_e)&&i(F,_e,null,K[_e],D,m.children,x,T,N);"value"in K&&i(F,"value",null,K.value),(L=K.onVnodeBeforeMount)&&Ke(L,x,m)}P(F,m,m.scopeId,M,x)}be&&nt(m,null,x,"beforeMount");const he=(!T||T&&!T.pendingBranch)&&G&&!G.persisted;he&&G.beforeEnter(F),r(F,y,O),((L=K&&K.onVnodeMounted)||he||be)&&He(()=>{L&&Ke(L,x,m),he&&G.enter(F),be&&nt(m,null,x,"mounted")},T)},P=(m,y,O,x,T)=>{if(O&&h(m,O),x)for(let D=0;D<x.length;D++)h(m,x[D]);if(T){let D=T.subTree;if(y===D){const M=T.vnode;P(m,M,M.scopeId,M.slotScopeIds,T.parent)}}},H=(m,y,O,x,T,D,M,R,F=0)=>{for(let L=F;L<m.length;L++){const J=m[L]=R?Ot(m[L]):Ze(m[L]);v(null,J,y,O,x,T,D,M,R)}},$=(m,y,O,x,T,D,M)=>{const R=y.el=m.el;let{patchFlag:F,dynamicChildren:L,dirs:J}=y;F|=m.patchFlag&16;const K=m.props||ge,V=y.props||ge;let G;O&&xt(O,!1),(G=V.onVnodeBeforeUpdate)&&Ke(G,O,y,m),J&&nt(y,m,O,"beforeUpdate"),O&&xt(O,!0);const ie=T&&y.type!=="foreignObject";if(L?B(m.dynamicChildren,L,R,O,x,ie,D):M||Ee(m,y,R,null,O,x,ie,D,!1),F>0){if(F&16)A(R,y,K,V,O,x,T);else if(F&2&&K.class!==V.class&&i(R,"class",null,V.class,T),F&4&&i(R,"style",K.style,V.style,T),F&8){const be=y.dynamicProps;for(let he=0;he<be.length;he++){const _e=be[he],Ge=K[_e],Vt=V[_e];(Vt!==Ge||_e==="value")&&i(R,_e,Ge,Vt,T,m.children,O,x,N)}}F&1&&m.children!==y.children&&u(R,y.children)}else!M&&L==null&&A(R,y,K,V,O,x,T);((G=V.onVnodeUpdated)||J)&&He(()=>{G&&Ke(G,O,y,m),J&&nt(y,m,O,"updated")},x)},B=(m,y,O,x,T,D,M)=>{for(let R=0;R<y.length;R++){const F=m[R],L=y[R],J=F.el&&(F.type===Fe||!Nt(F,L)||F.shapeFlag&70)?d(F.el):O;v(F,L,J,null,x,T,D,M,!0)}},A=(m,y,O,x,T,D,M)=>{if(O!==x){for(const R in x){if(kn(R))continue;const F=x[R],L=O[R];F!==L&&R!=="value"&&i(m,R,L,F,M,y.children,T,D,N)}if(O!==ge)for(const R in O)!kn(R)&&!(R in x)&&i(m,R,O[R],null,M,y.children,T,D,N);"value"in x&&i(m,"value",O.value,x.value)}},z=(m,y,O,x,T,D,M,R,F)=>{const L=y.el=m?m.el:a(""),J=y.anchor=m?m.anchor:a("");let{patchFlag:K,dynamicChildren:V,slotScopeIds:G}=y;G&&(R=R?R.concat(G):G),m==null?(r(L,O,x),r(J,O,x),H(y.children,O,J,T,D,M,R,F)):K>0&&K&64&&V&&m.dynamicChildren?(B(m.dynamicChildren,V,O,T,D,M,R),(y.key!=null||T&&y===T.subTree)&&ki(m,y,!0)):Ee(m,y,O,J,T,D,M,R,F)},Q=(m,y,O,x,T,D,M,R,F)=>{y.slotScopeIds=R,m==null?y.shapeFlag&512?T.ctx.activate(y,O,x,M,F):se(y,O,x,T,D,M,F):W(m,y,F)},se=(m,y,O,x,T,D,M)=>{const R=m.component=Dd(m,x,T);if(rr(m)&&(R.ctx.renderer=pe),Rd(R),R.asyncDep){if(T&&T.registerDep(R,ee),!m.el){const F=R.subTree=Se(Qe);E(null,F,y,O)}return}ee(R,m,y,O,T,D,M)},W=(m,y,O)=>{const x=y.component=m.component;if(Vf(m,y,O))if(x.asyncDep&&!x.asyncResolved){te(x,y,O);return}else x.next=y,Hf(x.update),x.update();else y.component=m.component,y.el=m.el,x.vnode=y},ee=(m,y,O,x,T,D,M)=>{const R=()=>{if(m.isMounted){let{next:J,bu:K,u:V,parent:G,vnode:ie}=m,be=J,he;xt(m,!1),J?(J.el=ie.el,te(m,J,M)):J=ie,K&&fo(K),(he=J.props&&J.props.onVnodeBeforeUpdate)&&Ke(he,G,J,ie),xt(m,!0);const _e=po(m),Ge=m.subTree;m.subTree=_e,v(Ge,_e,d(Ge.el),q(Ge),m,T,D),J.el=_e.el,be===null&&Kf(m,_e.el),V&&He(V,T),(he=J.props&&J.props.onVnodeUpdated)&&He(()=>Ke(he,G,J,ie),T)}else{let J;const{el:K,props:V}=y,{bm:G,m:ie,parent:be}=m,he=Rr(y);if(xt(m,!1),G&&fo(G),!he&&(J=V&&V.onVnodeBeforeMount)&&Ke(J,be,y),xt(m,!0),K&&X){const _e=()=>{m.subTree=po(m),X(K,m.subTree,m,T,null)};he?y.type.__asyncLoader().then(()=>!m.isUnmounted&&_e()):_e()}else{const _e=m.subTree=po(m);v(null,_e,O,x,m,T,D),y.el=_e.el}if(ie&&He(ie,T),!he&&(J=V&&V.onVnodeMounted)){const _e=y;He(()=>Ke(J,be,_e),T)}y.shapeFlag&256&&m.a&&He(m.a,T),m.isMounted=!0,y=O=x=null}},F=m.effect=new gi(R,()=>Ci(m.update),m.scope),L=m.update=F.run.bind(F);L.id=m.uid,xt(m,!0),L()},te=(m,y,O)=>{y.component=m;const x=m.vnode.props;m.vnode=y,m.next=null,dd(m,y.props,x,O),hd(m,y.children,O),hn(),Ai(void 0,m.update),vn()},Ee=(m,y,O,x,T,D,M,R,F=!1)=>{const L=m&&m.children,J=m?m.shapeFlag:0,K=y.children,{patchFlag:V,shapeFlag:G}=y;if(V>0){if(V&128){Ae(L,K,O,x,T,D,M,R,F);return}else if(V&256){Pe(L,K,O,x,T,D,M,R,F);return}}G&8?(J&16&&N(L,T,D),K!==L&&u(O,K)):J&16?G&16?Ae(L,K,O,x,T,D,M,R,F):N(L,T,D,!0):(J&8&&u(O,""),G&16&&H(K,O,x,T,D,M,R,F))},Pe=(m,y,O,x,T,D,M,R,F)=>{m=m||on,y=y||on;const L=m.length,J=y.length,K=Math.min(L,J);let V;for(V=0;V<K;V++){const G=y[V]=F?Ot(y[V]):Ze(y[V]);v(m[V],G,O,null,T,D,M,R,F)}L>J?N(m,T,D,!0,!1,K):H(y,O,x,T,D,M,R,F,K)},Ae=(m,y,O,x,T,D,M,R,F)=>{let L=0;const J=y.length;let K=m.length-1,V=J-1;for(;L<=K&&L<=V;){const G=m[L],ie=y[L]=F?Ot(y[L]):Ze(y[L]);if(Nt(G,ie))v(G,ie,O,null,T,D,M,R,F);else break;L++}for(;L<=K&&L<=V;){const G=m[K],ie=y[V]=F?Ot(y[V]):Ze(y[V]);if(Nt(G,ie))v(G,ie,O,null,T,D,M,R,F);else break;K--,V--}if(L>K){if(L<=V){const G=V+1,ie=G<J?y[G].el:x;for(;L<=V;)v(null,y[L]=F?Ot(y[L]):Ze(y[L]),O,ie,T,D,M,R,F),L++}}else if(L>V)for(;L<=K;)Te(m[L],T,D,!0),L++;else{const G=L,ie=L,be=new Map;for(L=ie;L<=V;L++){const $e=y[L]=F?Ot(y[L]):Ze(y[L]);$e.key!=null&&be.set($e.key,L)}let he,_e=0;const Ge=V-ie+1;let Vt=!1,Gi=0;const bn=new Array(Ge);for(L=0;L<Ge;L++)bn[L]=0;for(L=G;L<=K;L++){const $e=m[L];if(_e>=Ge){Te($e,T,D,!0);continue}let tt;if($e.key!=null)tt=be.get($e.key);else for(he=ie;he<=V;he++)if(bn[he-ie]===0&&Nt($e,y[he])){tt=he;break}tt===void 0?Te($e,T,D,!0):(bn[tt-ie]=L+1,tt>=Gi?Gi=tt:Vt=!0,v($e,y[tt],O,null,T,D,M,R,F),_e++)}const Zi=Vt?Ed(bn):on;for(he=Zi.length-1,L=Ge-1;L>=0;L--){const $e=ie+L,tt=y[$e],Xi=$e+1<J?y[$e+1].el:x;bn[L]===0?v(null,tt,O,Xi,T,D,M,R,F):Vt&&(he<0||L!==Zi[he]?we(tt,O,Xi,2):he--)}}},we=(m,y,O,x,T=null)=>{const{el:D,type:M,transition:R,children:F,shapeFlag:L}=m;if(L&6){we(m.component.subTree,y,O,x);return}if(L&128){m.suspense.move(y,O,x);return}if(L&64){M.move(m,y,O,pe);return}if(M===Fe){r(D,y,O);for(let K=0;K<F.length;K++)we(F[K],y,O,x);r(m.anchor,y,O);return}if(M===Nn){w(m,y,O);return}if(x!==2&&L&1&&R)if(x===0)R.beforeEnter(D),r(D,y,O),He(()=>R.enter(D),T);else{const{leave:K,delayLeave:V,afterLeave:G}=R,ie=()=>r(D,y,O),be=()=>{K(D,()=>{ie(),G&&G()})};V?V(D,ie,be):be()}else r(D,y,O)},Te=(m,y,O,x=!1,T=!1)=>{const{type:D,props:M,ref:R,children:F,dynamicChildren:L,shapeFlag:J,patchFlag:K,dirs:V}=m;if(R!=null&&Nr(R,null,O,m,!0),J&256){y.ctx.deactivate(m);return}const G=J&1&&V,ie=!Rr(m);let be;if(ie&&(be=M&&M.onVnodeBeforeUnmount)&&Ke(be,y,m),J&6)U(m.component,O,x);else{if(J&128){m.suspense.unmount(O,x);return}G&&nt(m,null,y,"beforeUnmount"),J&64?m.type.remove(m,y,O,T,pe,x):L&&(D!==Fe||K>0&&K&64)?N(L,y,O,!1,!0):(D===Fe&&K&384||!T&&J&16)&&N(F,y,O),x&&ze(m)}(ie&&(be=M&&M.onVnodeUnmounted)||G)&&He(()=>{be&&Ke(be,y,m),G&&nt(m,null,y,"unmounted")},O)},ze=m=>{const{type:y,el:O,anchor:x,transition:T}=m;if(y===Fe){j(O,x);return}if(y===Nn){I(m);return}const D=()=>{o(O),T&&!T.persisted&&T.afterLeave&&T.afterLeave()};if(m.shapeFlag&1&&T&&!T.persisted){const{leave:M,delayLeave:R}=T,F=()=>M(O,D);R?R(m.el,D,F):F()}else D()},j=(m,y)=>{let O;for(;m!==y;)O=f(m),o(m),m=O;o(y)},U=(m,y,O)=>{const{bum:x,scope:T,update:D,subTree:M,um:R}=m;x&&fo(x),T.stop(),D&&(D.active=!1,Te(M,m,y,O)),R&&He(R,y),He(()=>{m.isUnmounted=!0},y),y&&y.pendingBranch&&!y.isUnmounted&&m.asyncDep&&!m.asyncResolved&&m.suspenseId===y.pendingId&&(y.deps--,y.deps===0&&y.resolve())},N=(m,y,O,x=!1,T=!1,D=0)=>{for(let M=D;M<m.length;M++)Te(m[M],y,O,x,T)},q=m=>m.shapeFlag&6?q(m.component.subTree):m.shapeFlag&128?m.suspense.next():f(m.anchor||m.el),le=(m,y,O)=>{m==null?y._vnode&&Te(y._vnode,null,null,!0):v(y._vnode||null,m,y,null,null,null,O),kr(),y._vnode=m},pe={p:v,um:Te,m:we,r:ze,mt:se,mc:H,pc:Ee,pbc:B,n:q,o:e};let re,X;return t&&([re,X]=t(pe)),{render:le,hydrate:re,createApp:gd(le,re)}}function xt({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function ki(e,t,n=!1){const r=e.children,o=t.children;if(Z(r)&&Z(o))for(let i=0;i<r.length;i++){const s=r[i];let a=o[i];a.shapeFlag&1&&!a.dynamicChildren&&((a.patchFlag<=0||a.patchFlag===32)&&(a=o[i]=Ot(o[i]),a.el=s.el),n||ki(s,a))}}function Ed(e){const t=e.slice(),n=[0];let r,o,i,s,a;const l=e.length;for(r=0;r<l;r++){const c=e[r];if(c!==0){if(o=n[n.length-1],e[o]<c){t[r]=o,n.push(r);continue}for(i=0,s=n.length-1;i<s;)a=i+s>>1,e[n[a]]<c?i=a+1:s=a;c<e[n[i]]&&(i>0&&(t[r]=n[i-1]),n[i]=r)}}for(i=n.length,s=n[i-1];i-- >0;)n[i]=s,s=t[s];return n}const Od=e=>e.__isTeleport,Ln=e=>e&&(e.disabled||e.disabled===""),_s=e=>typeof SVGElement!="undefined"&&e instanceof SVGElement,Bo=(e,t)=>{const n=e&&e.to;return me(n)?t?t(n):null:n},wd={__isTeleport:!0,process(e,t,n,r,o,i,s,a,l,c){const{mc:u,pc:d,pbc:f,o:{insert:h,querySelector:p,createText:g,createComment:v}}=c,_=Ln(t.props);let{shapeFlag:E,children:S,dynamicChildren:w}=t;if(e==null){const I=t.el=g(""),k=t.anchor=g("");h(I,n,r),h(k,n,r);const C=t.target=Bo(t.props,p),P=t.targetAnchor=g("");C&&(h(P,C),s=s||_s(C));const H=($,B)=>{E&16&&u(S,$,B,o,i,s,a,l)};_?H(n,k):C&&H(C,P)}else{t.el=e.el;const I=t.anchor=e.anchor,k=t.target=e.target,C=t.targetAnchor=e.targetAnchor,P=Ln(e.props),H=P?n:k,$=P?I:C;if(s=s||_s(k),w?(f(e.dynamicChildren,w,H,o,i,s,a),ki(e,t,!0)):l||d(e,t,H,$,o,i,s,a,!1),_)P||dr(t,n,I,c,1);else if((t.props&&t.props.to)!==(e.props&&e.props.to)){const B=t.target=Bo(t.props,p);B&&dr(t,B,null,c,0)}else P&&dr(t,k,C,c,1)}},remove(e,t,n,r,{um:o,o:{remove:i}},s){const{shapeFlag:a,children:l,anchor:c,targetAnchor:u,target:d,props:f}=e;if(d&&i(u),(s||!Ln(f))&&(i(c),a&16))for(let h=0;h<l.length;h++){const p=l[h];o(p,t,n,!0,!!p.dynamicChildren)}},move:dr,hydrate:Sd};function dr(e,t,n,{o:{insert:r},m:o},i=2){i===0&&r(e.targetAnchor,t,n);const{el:s,anchor:a,shapeFlag:l,children:c,props:u}=e,d=i===2;if(d&&r(s,t,n),(!d||Ln(u))&&l&16)for(let f=0;f<c.length;f++)o(c[f],t,n,2);d&&r(a,t,n)}function Sd(e,t,n,r,o,i,{o:{nextSibling:s,parentNode:a,querySelector:l}},c){const u=t.target=Bo(t.props,l);if(u){const d=u._lpa||u.firstChild;t.shapeFlag&16&&(Ln(t.props)?(t.anchor=c(s(e),t,a(e),n,r,o,i),t.targetAnchor=d):(t.anchor=s(e),t.targetAnchor=c(d,t,u,n,r,o,i)),u._lpa=t.targetAnchor&&s(t.targetAnchor))}return t.anchor&&s(t.anchor)}const z0=wd,Di="components";function Pd(e,t){return oc(Di,e,!0,t)||e}const rc=Symbol();function $0(e){return me(e)?oc(Di,e,!1)||e:e||rc}function oc(e,t,n=!0,r=!1){const o=Ue||Ie;if(o){const i=o.type;if(e===Di){const a=Md(i);if(a&&(a===t||a===st(t)||a===eo(st(t))))return i}const s=ys(o[e]||i[e],t)||ys(o.appContext[e],t);return!s&&r?i:s}}function ys(e,t){return e&&(e[t]||e[st(t)]||e[eo(st(t))])}const Fe=Symbol(void 0),Wn=Symbol(void 0),Qe=Symbol(void 0),Nn=Symbol(void 0),Mn=[];let Bt=null;function ro(e=!1){Mn.push(Bt=e?null:[])}function Cd(){Mn.pop(),Bt=Mn[Mn.length-1]||null}let Mr=1;function bs(e){Mr+=e}function ic(e){return e.dynamicChildren=Mr>0?Bt||on:null,Cd(),Mr>0&&Bt&&Bt.push(e),e}function sc(e,t,n,r,o,i){return ic(cc(e,t,n,r,o,i,!0))}function ac(e,t,n,r,o){return ic(Se(e,t,n,r,o,!0))}function Hr(e){return e?e.__v_isVNode===!0:!1}function Nt(e,t){return e.type===t.type&&e.key===t.key}const oo="__vInternal",lc=({key:e})=>e!=null?e:null,Or=({ref:e,ref_key:t,ref_for:n})=>e!=null?me(e)||xe(e)||oe(e)?{i:Ue,r:e,k:t,f:!!n}:e:null;function cc(e,t=null,n=null,r=0,o=null,i=e===Fe?0:1,s=!1,a=!1){const l={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&lc(t),ref:t&&Or(t),scopeId:zl,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:i,patchFlag:r,dynamicProps:o,dynamicChildren:null,appContext:null};return a?(Li(l,n),i&128&&e.normalize(l)):n&&(l.shapeFlag|=me(n)?8:16),Mr>0&&!s&&Bt&&(l.patchFlag>0||i&6)&&l.patchFlag!==32&&Bt.push(l),l}const Se=Ad;function Ad(e,t=null,n=null,r=0,o=null,i=!1){if((!e||e===rc)&&(e=Qe),Hr(e)){const a=ln(e,t,!0);return n&&Li(a,n),a}if(Hd(e)&&(e=e.__vccOpts),t){t=Id(t);let{class:a,style:l}=t;a&&!me(a)&&(t.class=mn(a)),Ce(l)&&(Il(l)&&!Z(l)&&(l=ke({},l)),t.style=er(l))}const s=me(e)?1:Wf(e)?128:Od(e)?64:Ce(e)?4:oe(e)?2:0;return cc(e,t,n,r,o,s,i,!0)}function Id(e){return e?Il(e)||oo in e?ke({},e):e:null}function ln(e,t,n=!1){const{props:r,ref:o,patchFlag:i,children:s}=e,a=t?xd(r||{},t):r;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:a,key:a&&lc(a),ref:t&&t.ref?n&&o?Z(o)?o.concat(Or(t)):[o,Or(t)]:Or(t):o,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:s,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==Fe?i===-1?16:i|16:i,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&ln(e.ssContent),ssFallback:e.ssFallback&&ln(e.ssFallback),el:e.el,anchor:e.anchor}}function Ri(e=" ",t=0){return Se(Wn,null,e,t)}function B0(e,t){const n=Se(Nn,null,e);return n.staticCount=t,n}function U0(e="",t=!1){return t?(ro(),ac(Qe,null,e)):Se(Qe,null,e)}function Ze(e){return e==null||typeof e=="boolean"?Se(Qe):Z(e)?Se(Fe,null,e.slice()):typeof e=="object"?Ot(e):Se(Wn,null,String(e))}function Ot(e){return e.el===null||e.memo?e:ln(e)}function Li(e,t){let n=0;const{shapeFlag:r}=e;if(t==null)t=null;else if(Z(t))n=16;else if(typeof t=="object")if(r&65){const o=t.default;o&&(o._c&&(o._d=!1),Li(e,o()),o._c&&(o._d=!0));return}else{n=32;const o=t._;!o&&!(oo in t)?t._ctx=Ue:o===3&&Ue&&(Ue.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else oe(t)?(t={default:t,_ctx:Ue},n=32):(t=String(t),r&64?(n=16,t=[Ri(t)]):n=8);e.children=t,e.shapeFlag|=n}function xd(...e){const t={};for(let n=0;n<e.length;n++){const r=e[n];for(const o in r)if(o==="class")t.class!==r.class&&(t.class=mn([t.class,r.class]));else if(o==="style")t.style=er([t.style,r.style]);else if(tr(o)){const i=t[o],s=r[o];s&&i!==s&&!(Z(i)&&i.includes(s))&&(t[o]=i?[].concat(i,s):s)}else o!==""&&(t[o]=r[o])}return t}function Ke(e,t,n,r=null){Je(e,t,7,[n,r])}function q0(e,t,n,r){let o;const i=n&&n[r];if(Z(e)||me(e)){o=new Array(e.length);for(let s=0,a=e.length;s<a;s++)o[s]=t(e[s],s,void 0,i&&i[s])}else if(typeof e=="number"){o=new Array(e);for(let s=0;s<e;s++)o[s]=t(s+1,s,void 0,i&&i[s])}else if(Ce(e))if(e[Symbol.iterator])o=Array.from(e,(s,a)=>t(s,a,void 0,i&&i[a]));else{const s=Object.keys(e);o=new Array(s.length);for(let a=0,l=s.length;a<l;a++){const c=s[a];o[a]=t(e[c],c,a,i&&i[a])}}else o=[];return n&&(n[r]=o),o}function V0(e,t){for(let n=0;n<t.length;n++){const r=t[n];if(Z(r))for(let o=0;o<r.length;o++)e[r[o].name]=r[o].fn;else r&&(e[r.name]=r.fn)}return e}function uc(e,t,n={},r,o){if(Ue.isCE)return Se("slot",t==="default"?null:{name:t},r&&r());let i=e[t];i&&i._c&&(i._d=!1),ro();const s=i&&fc(i(n)),a=ac(Fe,{key:n.key||`_${t}`},s||(r?r():[]),s&&e._===1?64:-2);return!o&&a.scopeId&&(a.slotScopeIds=[a.scopeId+"-s"]),i&&i._c&&(i._d=!0),a}function fc(e){return e.some(t=>Hr(t)?!(t.type===Qe||t.type===Fe&&!fc(t.children)):!0)?e:null}const Uo=e=>e?dc(e)?Mi(e)||e.proxy:Uo(e.parent):null,Fr=ke(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>Uo(e.parent),$root:e=>Uo(e.root),$emit:e=>e.emit,$options:e=>Yl(e),$forceUpdate:e=>()=>Ci(e.update),$nextTick:e=>Pi.bind(e.proxy),$watch:e=>Jf.bind(e)}),jd={get({_:e},t){const{ctx:n,setupState:r,data:o,props:i,accessCache:s,type:a,appContext:l}=e;let c;if(t[0]!=="$"){const h=s[t];if(h!==void 0)switch(h){case 1:return r[t];case 2:return o[t];case 4:return n[t];case 3:return i[t]}else{if(r!==ge&&ue(r,t))return s[t]=1,r[t];if(o!==ge&&ue(o,t))return s[t]=2,o[t];if((c=e.propsOptions[0])&&ue(c,t))return s[t]=3,i[t];if(n!==ge&&ue(n,t))return s[t]=4,n[t];Fo&&(s[t]=0)}}const u=Fr[t];let d,f;if(u)return t==="$attrs"&&qe(e,"get",t),u(e);if((d=a.__cssModules)&&(d=d[t]))return d;if(n!==ge&&ue(n,t))return s[t]=4,n[t];if(f=l.config.globalProperties,ue(f,t))return f[t]},set({_:e},t,n){const{data:r,setupState:o,ctx:i}=e;return o!==ge&&ue(o,t)?(o[t]=n,!0):r!==ge&&ue(r,t)?(r[t]=n,!0):ue(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(i[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:r,appContext:o,propsOptions:i}},s){let a;return!!n[s]||e!==ge&&ue(e,s)||t!==ge&&ue(t,s)||(a=i[0])&&ue(a,s)||ue(r,s)||ue(Fr,s)||ue(o.config.globalProperties,s)},defineProperty(e,t,n){return n.get!=null?this.set(e,t,n.get(),null):n.value!=null&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}},Td=nc();let kd=0;function Dd(e,t,n){const r=e.type,o=(t?t.appContext:e.appContext)||Td,i={uid:kd++,vnode:e,type:r,parent:t,appContext:o,root:null,next:null,subTree:null,effect:null,update:null,scope:new Xu(!0),render:null,proxy:null,exposed:null,exposeProxy:null,withProxy:null,provides:t?t.provides:Object.create(o.provides),accessCache:null,renderCache:[],components:null,directives:null,propsOptions:Zl(r,o),emitsOptions:Fl(r,o),emit:null,emitted:null,propsDefaults:ge,inheritAttrs:r.inheritAttrs,ctx:ge,data:ge,props:ge,attrs:ge,slots:ge,refs:ge,setupState:ge,setupContext:null,suspense:n,suspenseId:n?n.pendingId:0,asyncDep:null,asyncResolved:!1,isMounted:!1,isUnmounted:!1,isDeactivated:!1,bc:null,c:null,bm:null,m:null,bu:null,u:null,um:null,bum:null,da:null,a:null,rtg:null,rtc:null,ec:null,sp:null};return i.ctx={_:i},i.root=t?t.root:i,i.emit=$f.bind(null,i),e.ce&&e.ce(i),i}let Ie=null;const Ni=()=>Ie||Ue,cn=e=>{Ie=e,e.scope.on()},Ut=()=>{Ie&&Ie.scope.off(),Ie=null};function dc(e){return e.vnode.shapeFlag&4}let un=!1;function Rd(e,t=!1){un=t;const{props:n,children:r}=e.vnode,o=dc(e);fd(e,n,o,t),md(e,r);const i=o?Ld(e,t):void 0;return un=!1,i}function Ld(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=xl(new Proxy(e.ctx,jd));const{setup:r}=n;if(r){const o=e.setupContext=r.length>1?mc(e):null;cn(e),hn();const i=Ct(r,e,0,[e.props,o]);if(vn(),Ut(),pl(i)){if(i.then(Ut,Ut),t)return i.then(s=>{Es(e,s,t)}).catch(s=>{nr(s,e,0)});e.asyncDep=i}else Es(e,i,t)}else pc(e,t)}function Es(e,t,n){oe(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:Ce(t)&&(e.setupState=Rl(t)),pc(e,n)}let Os;function pc(e,t,n){const r=e.type;if(!e.render){if(!t&&Os&&!r.render){const o=r.template;if(o){const{isCustomElement:i,compilerOptions:s}=e.appContext.config,{delimiters:a,compilerOptions:l}=r,c=ke(ke({isCustomElement:i,delimiters:a},s),l);r.render=Os(o,c)}}e.render=r.render||Xe}cn(e),hn(),sd(e),vn(),Ut()}function Nd(e){return new Proxy(e.attrs,{get(t,n){return qe(e,"get","$attrs"),t[n]}})}function mc(e){const t=r=>{e.exposed=r||{}};let n;return{get attrs(){return n||(n=Nd(e))},slots:e.slots,emit:e.emit,expose:t}}function Mi(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(Rl(xl(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Fr)return Fr[n](e)}}))}function Md(e){return oe(e)&&e.displayName||e.name}function Hd(e){return oe(e)&&"__vccOpts"in e}const Oe=(e,t)=>Lf(e,t,un);function K0(){return Fd().slots}function Fd(){const e=Ni();return e.setupContext||(e.setupContext=mc(e))}function ye(e,t,n){const r=arguments.length;return r===2?Ce(t)&&!Z(t)?Hr(t)?Se(e,null,[t]):Se(e,t):Se(e,null,t):(r>3?n=Array.prototype.slice.call(arguments,2):r===3&&Hr(n)&&(n=[n]),Se(e,t,n))}const zd="3.2.31",$d="http://www.w3.org/2000/svg",Mt=typeof document!="undefined"?document:null,ws=Mt&&Mt.createElement("template"),Bd={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{const o=t?Mt.createElementNS($d,e):Mt.createElement(e,n?{is:n}:void 0);return e==="select"&&r&&r.multiple!=null&&o.setAttribute("multiple",r.multiple),o},createText:e=>Mt.createTextNode(e),createComment:e=>Mt.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Mt.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},cloneNode(e){const t=e.cloneNode(!0);return"_value"in e&&(t._value=e._value),t},insertStaticContent(e,t,n,r,o,i){const s=n?n.previousSibling:t.lastChild;if(o&&(o===i||o.nextSibling))for(;t.insertBefore(o.cloneNode(!0),n),!(o===i||!(o=o.nextSibling)););else{ws.innerHTML=r?`<svg>${e}</svg>`:e;const a=ws.content;if(r){const l=a.firstChild;for(;l.firstChild;)a.appendChild(l.firstChild);a.removeChild(l)}t.insertBefore(a,n)}return[s?s.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}};function Ud(e,t,n){const r=e._vtc;r&&(t=(t?[t,...r]:[...r]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}function qd(e,t,n){const r=e.style,o=me(n);if(n&&!o){for(const i in n)qo(r,i,n[i]);if(t&&!me(t))for(const i in t)n[i]==null&&qo(r,i,"")}else{const i=r.display;o?t!==n&&(r.cssText=n):t&&e.removeAttribute("style"),"_vod"in e&&(r.display=i)}}const Ss=/\s*!important$/;function qo(e,t,n){if(Z(n))n.forEach(r=>qo(e,t,r));else if(t.startsWith("--"))e.setProperty(t,n);else{const r=Vd(e,t);Ss.test(n)?e.setProperty(qt(r),n.replace(Ss,""),"important"):e[r]=n}}const Ps=["Webkit","Moz","ms"],go={};function Vd(e,t){const n=go[t];if(n)return n;let r=st(t);if(r!=="filter"&&r in e)return go[t]=r;r=eo(r);for(let o=0;o<Ps.length;o++){const i=Ps[o]+r;if(i in e)return go[t]=i}return t}const Cs="http://www.w3.org/1999/xlink";function Kd(e,t,n,r,o){if(r&&t.startsWith("xlink:"))n==null?e.removeAttributeNS(Cs,t.slice(6,t.length)):e.setAttributeNS(Cs,t,n);else{const i=$u(t);n==null||i&&!ul(n)?e.removeAttribute(t):e.setAttribute(t,i?"":n)}}function Wd(e,t,n,r,o,i,s){if(t==="innerHTML"||t==="textContent"){r&&s(r,o,i),e[t]=n==null?"":n;return}if(t==="value"&&e.tagName!=="PROGRESS"&&!e.tagName.includes("-")){e._value=n;const a=n==null?"":n;(e.value!==a||e.tagName==="OPTION")&&(e.value=a),n==null&&e.removeAttribute(t);return}if(n===""||n==null){const a=typeof e[t];if(a==="boolean"){e[t]=ul(n);return}else if(n==null&&a==="string"){e[t]="",e.removeAttribute(t);return}else if(a==="number"){try{e[t]=0}catch{}e.removeAttribute(t);return}}try{e[t]=n}catch{}}let zr=Date.now,hc=!1;if(typeof window!="undefined"){zr()>document.createEvent("Event").timeStamp&&(zr=()=>performance.now());const e=navigator.userAgent.match(/firefox\/(\d+)/i);hc=!!(e&&Number(e[1])<=53)}let Vo=0;const Jd=Promise.resolve(),Qd=()=>{Vo=0},Yd=()=>Vo||(Jd.then(Qd),Vo=zr());function Gd(e,t,n,r){e.addEventListener(t,n,r)}function Zd(e,t,n,r){e.removeEventListener(t,n,r)}function Xd(e,t,n,r,o=null){const i=e._vei||(e._vei={}),s=i[t];if(r&&s)s.value=r;else{const[a,l]=ep(t);if(r){const c=i[t]=tp(r,o);Gd(e,a,c,l)}else s&&(Zd(e,a,s,l),i[t]=void 0)}}const As=/(?:Once|Passive|Capture)$/;function ep(e){let t;if(As.test(e)){t={};let n;for(;n=e.match(As);)e=e.slice(0,e.length-n[0].length),t[n[0].toLowerCase()]=!0}return[qt(e.slice(2)),t]}function tp(e,t){const n=r=>{const o=r.timeStamp||zr();(hc||o>=n.attached-1)&&Je(np(r,n.value),t,5,[r])};return n.value=e,n.attached=Yd(),n}function np(e,t){if(Z(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(r=>o=>!o._stopped&&r&&r(o))}else return t}const Is=/^on[a-z]/,rp=(e,t,n,r,o=!1,i,s,a,l)=>{t==="class"?Ud(e,r,o):t==="style"?qd(e,n,r):tr(t)?di(t)||Xd(e,t,n,r,s):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):op(e,t,r,o))?Wd(e,t,r,i,s,a,l):(t==="true-value"?e._trueValue=r:t==="false-value"&&(e._falseValue=r),Kd(e,t,r,o))};function op(e,t,n,r){return r?!!(t==="innerHTML"||t==="textContent"||t in e&&Is.test(t)&&oe(n)):t==="spellcheck"||t==="draggable"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Is.test(t)&&me(n)?!1:t in e}const _t="transition",En="animation",Hi=(e,{slots:t})=>ye(ql,ip(e),t);Hi.displayName="Transition";const vc={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};Hi.props=ke({},ql.props,vc);const jt=(e,t=[])=>{Z(e)?e.forEach(n=>n(...t)):e&&e(...t)},xs=e=>e?Z(e)?e.some(t=>t.length>1):e.length>1:!1;function ip(e){const t={};for(const A in e)A in vc||(t[A]=e[A]);if(e.css===!1)return t;const{name:n="v",type:r,duration:o,enterFromClass:i=`${n}-enter-from`,enterActiveClass:s=`${n}-enter-active`,enterToClass:a=`${n}-enter-to`,appearFromClass:l=i,appearActiveClass:c=s,appearToClass:u=a,leaveFromClass:d=`${n}-leave-from`,leaveActiveClass:f=`${n}-leave-active`,leaveToClass:h=`${n}-leave-to`}=e,p=sp(o),g=p&&p[0],v=p&&p[1],{onBeforeEnter:_,onEnter:E,onEnterCancelled:S,onLeave:w,onLeaveCancelled:I,onBeforeAppear:k=_,onAppear:C=E,onAppearCancelled:P=S}=t,H=(A,z,Q)=>{Kt(A,z?u:a),Kt(A,z?c:s),Q&&Q()},$=(A,z)=>{Kt(A,h),Kt(A,f),z&&z()},B=A=>(z,Q)=>{const se=A?C:E,W=()=>H(z,A,Q);jt(se,[z,W]),js(()=>{Kt(z,A?l:i),yt(z,A?u:a),xs(se)||Ts(z,r,g,W)})};return ke(t,{onBeforeEnter(A){jt(_,[A]),yt(A,i),yt(A,s)},onBeforeAppear(A){jt(k,[A]),yt(A,l),yt(A,c)},onEnter:B(!1),onAppear:B(!0),onLeave(A,z){const Q=()=>$(A,z);yt(A,d),cp(),yt(A,f),js(()=>{Kt(A,d),yt(A,h),xs(w)||Ts(A,r,v,Q)}),jt(w,[A,Q])},onEnterCancelled(A){H(A,!1),jt(S,[A])},onAppearCancelled(A){H(A,!0),jt(P,[A])},onLeaveCancelled(A){$(A),jt(I,[A])}})}function sp(e){if(e==null)return null;if(Ce(e))return[_o(e.enter),_o(e.leave)];{const t=_o(e);return[t,t]}}function _o(e){return vl(e)}function yt(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e._vtc||(e._vtc=new Set)).add(t)}function Kt(e,t){t.split(/\s+/).forEach(r=>r&&e.classList.remove(r));const{_vtc:n}=e;n&&(n.delete(t),n.size||(e._vtc=void 0))}function js(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let ap=0;function Ts(e,t,n,r){const o=e._endId=++ap,i=()=>{o===e._endId&&r()};if(n)return setTimeout(i,n);const{type:s,timeout:a,propCount:l}=lp(e,t);if(!s)return r();const c=s+"end";let u=0;const d=()=>{e.removeEventListener(c,f),i()},f=h=>{h.target===e&&++u>=l&&d()};setTimeout(()=>{u<l&&d()},a+1),e.addEventListener(c,f)}function lp(e,t){const n=window.getComputedStyle(e),r=p=>(n[p]||"").split(", "),o=r(_t+"Delay"),i=r(_t+"Duration"),s=ks(o,i),a=r(En+"Delay"),l=r(En+"Duration"),c=ks(a,l);let u=null,d=0,f=0;t===_t?s>0&&(u=_t,d=s,f=i.length):t===En?c>0&&(u=En,d=c,f=l.length):(d=Math.max(s,c),u=d>0?s>c?_t:En:null,f=u?u===_t?i.length:l.length:0);const h=u===_t&&/\b(transform|all)(,|$)/.test(n[_t+"Property"]);return{type:u,timeout:d,propCount:f,hasTransform:h}}function ks(e,t){for(;e.length<t.length;)e=e.concat(e);return Math.max(...t.map((n,r)=>Ds(n)+Ds(e[r])))}function Ds(e){return Number(e.slice(0,-1).replace(",","."))*1e3}function cp(){return document.body.offsetHeight}const up=["ctrl","shift","alt","meta"],fp={stop:e=>e.stopPropagation(),prevent:e=>e.preventDefault(),self:e=>e.target!==e.currentTarget,ctrl:e=>!e.ctrlKey,shift:e=>!e.shiftKey,alt:e=>!e.altKey,meta:e=>!e.metaKey,left:e=>"button"in e&&e.button!==0,middle:e=>"button"in e&&e.button!==1,right:e=>"button"in e&&e.button!==2,exact:(e,t)=>up.some(n=>e[`${n}Key`]&&!t.includes(n))},W0=(e,t)=>(n,...r)=>{for(let o=0;o<t.length;o++){const i=fp[t[o]];if(i&&i(n,t))return}return e(n,...r)},dp={esc:"escape",space:" ",up:"arrow-up",left:"arrow-left",right:"arrow-right",down:"arrow-down",delete:"backspace"},J0=(e,t)=>n=>{if(!("key"in n))return;const r=qt(n.key);if(t.some(o=>o===r||dp[o]===r))return e(n)},Q0={beforeMount(e,{value:t},{transition:n}){e._vod=e.style.display==="none"?"":e.style.display,n&&t?n.beforeEnter(e):On(e,t)},mounted(e,{value:t},{transition:n}){n&&t&&n.enter(e)},updated(e,{value:t,oldValue:n},{transition:r}){!t!=!n&&(r?t?(r.beforeEnter(e),On(e,!0),r.enter(e)):r.leave(e,()=>{On(e,!1)}):On(e,t))},beforeUnmount(e,{value:t}){On(e,t)}};function On(e,t){e.style.display=t?e._vod:"none"}const pp=ke({patchProp:rp},Bd);let yo,Rs=!1;function mp(){return yo=Rs?yo:yd(pp),Rs=!0,yo}const hp=(...e)=>{const t=mp().createApp(...e),{mount:n}=t;return t.mount=r=>{const o=vp(r);if(o)return n(o,!0,o instanceof SVGElement)},t};function vp(e){return me(e)?document.querySelector(e):e}/*!
+  * vue-router v4.0.14
+  * (c) 2022 Eduardo San Martin Morote
+  * @license MIT
+  */const gc=typeof Symbol=="function"&&typeof Symbol.toStringTag=="symbol",_n=e=>gc?Symbol(e):"_vr_"+e,gp=_n("rvlm"),Ls=_n("rvd"),io=_n("r"),Fi=_n("rl"),Ko=_n("rvl"),Xt=typeof window!="undefined";function _p(e){return e.__esModule||gc&&e[Symbol.toStringTag]==="Module"}const ve=Object.assign;function bo(e,t){const n={};for(const r in t){const o=t[r];n[r]=Array.isArray(o)?o.map(e):e(o)}return n}const Hn=()=>{},yp=/\/$/,bp=e=>e.replace(yp,"");function Eo(e,t,n="/"){let r,o={},i="",s="";const a=t.indexOf("?"),l=t.indexOf("#",a>-1?a:0);return a>-1&&(r=t.slice(0,a),i=t.slice(a+1,l>-1?l:t.length),o=e(i)),l>-1&&(r=r||t.slice(0,l),s=t.slice(l,t.length)),r=Sp(r!=null?r:t,n),{fullPath:r+(i&&"?")+i+s,path:r,query:o,hash:s}}function Ep(e,t){const n=t.query?e(t.query):"";return t.path+(n&&"?")+n+(t.hash||"")}function Ns(e,t){return!t||!e.toLowerCase().startsWith(t.toLowerCase())?e:e.slice(t.length)||"/"}function Op(e,t,n){const r=t.matched.length-1,o=n.matched.length-1;return r>-1&&r===o&&fn(t.matched[r],n.matched[o])&&_c(t.params,n.params)&&e(t.query)===e(n.query)&&t.hash===n.hash}function fn(e,t){return(e.aliasOf||e)===(t.aliasOf||t)}function _c(e,t){if(Object.keys(e).length!==Object.keys(t).length)return!1;for(const n in e)if(!wp(e[n],t[n]))return!1;return!0}function wp(e,t){return Array.isArray(e)?Ms(e,t):Array.isArray(t)?Ms(t,e):e===t}function Ms(e,t){return Array.isArray(t)?e.length===t.length&&e.every((n,r)=>n===t[r]):e.length===1&&e[0]===t}function Sp(e,t){if(e.startsWith("/"))return e;if(!e)return t;const n=t.split("/"),r=e.split("/");let o=n.length-1,i,s;for(i=0;i<r.length;i++)if(s=r[i],!(o===1||s==="."))if(s==="..")o--;else break;return n.slice(0,o).join("/")+"/"+r.slice(i-(i===r.length?1:0)).join("/")}var Jn;(function(e){e.pop="pop",e.push="push"})(Jn||(Jn={}));var Fn;(function(e){e.back="back",e.forward="forward",e.unknown=""})(Fn||(Fn={}));function Pp(e){if(!e)if(Xt){const t=document.querySelector("base");e=t&&t.getAttribute("href")||"/",e=e.replace(/^\w+:\/\/[^\/]+/,"")}else e="/";return e[0]!=="/"&&e[0]!=="#"&&(e="/"+e),bp(e)}const Cp=/^[^#]+#/;function Ap(e,t){return e.replace(Cp,"#")+t}function Ip(e,t){const n=document.documentElement.getBoundingClientRect(),r=e.getBoundingClientRect();return{behavior:t.behavior,left:r.left-n.left-(t.left||0),top:r.top-n.top-(t.top||0)}}const so=()=>({left:window.pageXOffset,top:window.pageYOffset});function xp(e){let t;if("el"in e){const n=e.el,r=typeof n=="string"&&n.startsWith("#"),o=typeof n=="string"?r?document.getElementById(n.slice(1)):document.querySelector(n):n;if(!o)return;t=Ip(o,e)}else t=e;"scrollBehavior"in document.documentElement.style?window.scrollTo(t):window.scrollTo(t.left!=null?t.left:window.pageXOffset,t.top!=null?t.top:window.pageYOffset)}function Hs(e,t){return(history.state?history.state.position-t:-1)+e}const Wo=new Map;function jp(e,t){Wo.set(e,t)}function Tp(e){const t=Wo.get(e);return Wo.delete(e),t}let kp=()=>location.protocol+"//"+location.host;function yc(e,t){const{pathname:n,search:r,hash:o}=t,i=e.indexOf("#");if(i>-1){let a=o.includes(e.slice(i))?e.slice(i).length:1,l=o.slice(a);return l[0]!=="/"&&(l="/"+l),Ns(l,"")}return Ns(n,e)+r+o}function Dp(e,t,n,r){let o=[],i=[],s=null;const a=({state:f})=>{const h=yc(e,location),p=n.value,g=t.value;let v=0;if(f){if(n.value=h,t.value=f,s&&s===p){s=null;return}v=g?f.position-g.position:0}else r(h);o.forEach(_=>{_(n.value,p,{delta:v,type:Jn.pop,direction:v?v>0?Fn.forward:Fn.back:Fn.unknown})})};function l(){s=n.value}function c(f){o.push(f);const h=()=>{const p=o.indexOf(f);p>-1&&o.splice(p,1)};return i.push(h),h}function u(){const{history:f}=window;!f.state||f.replaceState(ve({},f.state,{scroll:so()}),"")}function d(){for(const f of i)f();i=[],window.removeEventListener("popstate",a),window.removeEventListener("beforeunload",u)}return window.addEventListener("popstate",a),window.addEventListener("beforeunload",u),{pauseListeners:l,listen:c,destroy:d}}function Fs(e,t,n,r=!1,o=!1){return{back:e,current:t,forward:n,replaced:r,position:window.history.length,scroll:o?so():null}}function Rp(e){const{history:t,location:n}=window,r={value:yc(e,n)},o={value:t.state};o.value||i(r.value,{back:null,current:r.value,forward:null,position:t.length-1,replaced:!0,scroll:null},!0);function i(l,c,u){const d=e.indexOf("#"),f=d>-1?(n.host&&document.querySelector("base")?e:e.slice(d))+l:kp()+e+l;try{t[u?"replaceState":"pushState"](c,"",f),o.value=c}catch(h){console.error(h),n[u?"replace":"assign"](f)}}function s(l,c){const u=ve({},t.state,Fs(o.value.back,l,o.value.forward,!0),c,{position:o.value.position});i(l,u,!0),r.value=l}function a(l,c){const u=ve({},o.value,t.state,{forward:l,scroll:so()});i(u.current,u,!0);const d=ve({},Fs(r.value,l,null),{position:u.position+1},c);i(l,d,!1),r.value=l}return{location:r,state:o,push:a,replace:s}}function Lp(e){e=Pp(e);const t=Rp(e),n=Dp(e,t.state,t.location,t.replace);function r(i,s=!0){s||n.pauseListeners(),history.go(i)}const o=ve({location:"",base:e,go:r,createHref:Ap.bind(null,e)},t,n);return Object.defineProperty(o,"location",{enumerable:!0,get:()=>t.location.value}),Object.defineProperty(o,"state",{enumerable:!0,get:()=>t.state.value}),o}function Np(e){return typeof e=="string"||e&&typeof e=="object"}function bc(e){return typeof e=="string"||typeof e=="symbol"}const at={path:"/",name:void 0,params:{},query:{},hash:"",fullPath:"/",matched:[],meta:{},redirectedFrom:void 0},Ec=_n("nf");var zs;(function(e){e[e.aborted=4]="aborted",e[e.cancelled=8]="cancelled",e[e.duplicated=16]="duplicated"})(zs||(zs={}));function dn(e,t){return ve(new Error,{type:e,[Ec]:!0},t)}function bt(e,t){return e instanceof Error&&Ec in e&&(t==null||!!(e.type&t))}const $s="[^/]+?",Mp={sensitive:!1,strict:!1,start:!0,end:!0},Hp=/[.+*?^${}()[\]/\\]/g;function Fp(e,t){const n=ve({},Mp,t),r=[];let o=n.start?"^":"";const i=[];for(const c of e){const u=c.length?[]:[90];n.strict&&!c.length&&(o+="/");for(let d=0;d<c.length;d++){const f=c[d];let h=40+(n.sensitive?.25:0);if(f.type===0)d||(o+="/"),o+=f.value.replace(Hp,"\\$&"),h+=40;else if(f.type===1){const{value:p,repeatable:g,optional:v,regexp:_}=f;i.push({name:p,repeatable:g,optional:v});const E=_||$s;if(E!==$s){h+=10;try{new RegExp(`(${E})`)}catch(w){throw new Error(`Invalid custom RegExp for param "${p}" (${E}): `+w.message)}}let S=g?`((?:${E})(?:/(?:${E}))*)`:`(${E})`;d||(S=v&&c.length<2?`(?:/${S})`:"/"+S),v&&(S+="?"),o+=S,h+=20,v&&(h+=-8),g&&(h+=-20),E===".*"&&(h+=-50)}u.push(h)}r.push(u)}if(n.strict&&n.end){const c=r.length-1;r[c][r[c].length-1]+=.7000000000000001}n.strict||(o+="/?"),n.end?o+="$":n.strict&&(o+="(?:/|$)");const s=new RegExp(o,n.sensitive?"":"i");function a(c){const u=c.match(s),d={};if(!u)return null;for(let f=1;f<u.length;f++){const h=u[f]||"",p=i[f-1];d[p.name]=h&&p.repeatable?h.split("/"):h}return d}function l(c){let u="",d=!1;for(const f of e){(!d||!u.endsWith("/"))&&(u+="/"),d=!1;for(const h of f)if(h.type===0)u+=h.value;else if(h.type===1){const{value:p,repeatable:g,optional:v}=h,_=p in c?c[p]:"";if(Array.isArray(_)&&!g)throw new Error(`Provided param "${p}" is an array but it is not repeatable (* or + modifiers)`);const E=Array.isArray(_)?_.join("/"):_;if(!E)if(v)f.length<2&&(u.endsWith("/")?u=u.slice(0,-1):d=!0);else throw new Error(`Missing required param "${p}"`);u+=E}}return u}return{re:s,score:r,keys:i,parse:a,stringify:l}}function zp(e,t){let n=0;for(;n<e.length&&n<t.length;){const r=t[n]-e[n];if(r)return r;n++}return e.length<t.length?e.length===1&&e[0]===40+40?-1:1:e.length>t.length?t.length===1&&t[0]===40+40?1:-1:0}function $p(e,t){let n=0;const r=e.score,o=t.score;for(;n<r.length&&n<o.length;){const i=zp(r[n],o[n]);if(i)return i;n++}return o.length-r.length}const Bp={type:0,value:""},Up=/[a-zA-Z0-9_]/;function qp(e){if(!e)return[[]];if(e==="/")return[[Bp]];if(!e.startsWith("/"))throw new Error(`Invalid path "${e}"`);function t(h){throw new Error(`ERR (${n})/"${c}": ${h}`)}let n=0,r=n;const o=[];let i;function s(){i&&o.push(i),i=[]}let a=0,l,c="",u="";function d(){!c||(n===0?i.push({type:0,value:c}):n===1||n===2||n===3?(i.length>1&&(l==="*"||l==="+")&&t(`A repeatable param (${c}) must be alone in its segment. eg: '/:ids+.`),i.push({type:1,value:c,regexp:u,repeatable:l==="*"||l==="+",optional:l==="*"||l==="?"})):t("Invalid state to consume buffer"),c="")}function f(){c+=l}for(;a<e.length;){if(l=e[a++],l==="\\"&&n!==2){r=n,n=4;continue}switch(n){case 0:l==="/"?(c&&d(),s()):l===":"?(d(),n=1):f();break;case 4:f(),n=r;break;case 1:l==="("?n=2:Up.test(l)?f():(d(),n=0,l!=="*"&&l!=="?"&&l!=="+"&&a--);break;case 2:l===")"?u[u.length-1]=="\\"?u=u.slice(0,-1)+l:n=3:u+=l;break;case 3:d(),n=0,l!=="*"&&l!=="?"&&l!=="+"&&a--,u="";break;default:t("Unknown state");break}}return n===2&&t(`Unfinished custom RegExp for param "${c}"`),d(),s(),o}function Vp(e,t,n){const r=Fp(qp(e.path),n),o=ve(r,{record:e,parent:t,children:[],alias:[]});return t&&!o.record.aliasOf==!t.record.aliasOf&&t.children.push(o),o}function Kp(e,t){const n=[],r=new Map;t=Us({strict:!1,end:!0,sensitive:!1},t);function o(u){return r.get(u)}function i(u,d,f){const h=!f,p=Jp(u);p.aliasOf=f&&f.record;const g=Us(t,u),v=[p];if("alias"in u){const S=typeof u.alias=="string"?[u.alias]:u.alias;for(const w of S)v.push(ve({},p,{components:f?f.record.components:p.components,path:w,aliasOf:f?f.record:p}))}let _,E;for(const S of v){const{path:w}=S;if(d&&w[0]!=="/"){const I=d.record.path,k=I[I.length-1]==="/"?"":"/";S.path=d.record.path+(w&&k+w)}if(_=Vp(S,d,g),f?f.alias.push(_):(E=E||_,E!==_&&E.alias.push(_),h&&u.name&&!Bs(_)&&s(u.name)),"children"in p){const I=p.children;for(let k=0;k<I.length;k++)i(I[k],_,f&&f.children[k])}f=f||_,l(_)}return E?()=>{s(E)}:Hn}function s(u){if(bc(u)){const d=r.get(u);d&&(r.delete(u),n.splice(n.indexOf(d),1),d.children.forEach(s),d.alias.forEach(s))}else{const d=n.indexOf(u);d>-1&&(n.splice(d,1),u.record.name&&r.delete(u.record.name),u.children.forEach(s),u.alias.forEach(s))}}function a(){return n}function l(u){let d=0;for(;d<n.length&&$p(u,n[d])>=0&&(u.record.path!==n[d].record.path||!Oc(u,n[d]));)d++;n.splice(d,0,u),u.record.name&&!Bs(u)&&r.set(u.record.name,u)}function c(u,d){let f,h={},p,g;if("name"in u&&u.name){if(f=r.get(u.name),!f)throw dn(1,{location:u});g=f.record.name,h=ve(Wp(d.params,f.keys.filter(E=>!E.optional).map(E=>E.name)),u.params),p=f.stringify(h)}else if("path"in u)p=u.path,f=n.find(E=>E.re.test(p)),f&&(h=f.parse(p),g=f.record.name);else{if(f=d.name?r.get(d.name):n.find(E=>E.re.test(d.path)),!f)throw dn(1,{location:u,currentLocation:d});g=f.record.name,h=ve({},d.params,u.params),p=f.stringify(h)}const v=[];let _=f;for(;_;)v.unshift(_.record),_=_.parent;return{name:g,path:p,params:h,matched:v,meta:Yp(v)}}return e.forEach(u=>i(u)),{addRoute:i,resolve:c,removeRoute:s,getRoutes:a,getRecordMatcher:o}}function Wp(e,t){const n={};for(const r of t)r in e&&(n[r]=e[r]);return n}function Jp(e){return{path:e.path,redirect:e.redirect,name:e.name,meta:e.meta||{},aliasOf:void 0,beforeEnter:e.beforeEnter,props:Qp(e),children:e.children||[],instances:{},leaveGuards:new Set,updateGuards:new Set,enterCallbacks:{},components:"components"in e?e.components||{}:{default:e.component}}}function Qp(e){const t={},n=e.props||!1;if("component"in e)t.default=n;else for(const r in e.components)t[r]=typeof n=="boolean"?n:n[r];return t}function Bs(e){for(;e;){if(e.record.aliasOf)return!0;e=e.parent}return!1}function Yp(e){return e.reduce((t,n)=>ve(t,n.meta),{})}function Us(e,t){const n={};for(const r in e)n[r]=r in t?t[r]:e[r];return n}function Oc(e,t){return t.children.some(n=>n===e||Oc(e,n))}const wc=/#/g,Gp=/&/g,Zp=/\//g,Xp=/=/g,em=/\?/g,Sc=/\+/g,tm=/%5B/g,nm=/%5D/g,Pc=/%5E/g,rm=/%60/g,Cc=/%7B/g,om=/%7C/g,Ac=/%7D/g,im=/%20/g;function zi(e){return encodeURI(""+e).replace(om,"|").replace(tm,"[").replace(nm,"]")}function sm(e){return zi(e).replace(Cc,"{").replace(Ac,"}").replace(Pc,"^")}function Jo(e){return zi(e).replace(Sc,"%2B").replace(im,"+").replace(wc,"%23").replace(Gp,"%26").replace(rm,"`").replace(Cc,"{").replace(Ac,"}").replace(Pc,"^")}function am(e){return Jo(e).replace(Xp,"%3D")}function lm(e){return zi(e).replace(wc,"%23").replace(em,"%3F")}function cm(e){return e==null?"":lm(e).replace(Zp,"%2F")}function $r(e){try{return decodeURIComponent(""+e)}catch{}return""+e}function um(e){const t={};if(e===""||e==="?")return t;const r=(e[0]==="?"?e.slice(1):e).split("&");for(let o=0;o<r.length;++o){const i=r[o].replace(Sc," "),s=i.indexOf("="),a=$r(s<0?i:i.slice(0,s)),l=s<0?null:$r(i.slice(s+1));if(a in t){let c=t[a];Array.isArray(c)||(c=t[a]=[c]),c.push(l)}else t[a]=l}return t}function qs(e){let t="";for(let n in e){const r=e[n];if(n=am(n),r==null){r!==void 0&&(t+=(t.length?"&":"")+n);continue}(Array.isArray(r)?r.map(i=>i&&Jo(i)):[r&&Jo(r)]).forEach(i=>{i!==void 0&&(t+=(t.length?"&":"")+n,i!=null&&(t+="="+i))})}return t}function fm(e){const t={};for(const n in e){const r=e[n];r!==void 0&&(t[n]=Array.isArray(r)?r.map(o=>o==null?null:""+o):r==null?r:""+r)}return t}function wn(){let e=[];function t(r){return e.push(r),()=>{const o=e.indexOf(r);o>-1&&e.splice(o,1)}}function n(){e=[]}return{add:t,list:()=>e,reset:n}}function wt(e,t,n,r,o){const i=r&&(r.enterCallbacks[o]=r.enterCallbacks[o]||[]);return()=>new Promise((s,a)=>{const l=d=>{d===!1?a(dn(4,{from:n,to:t})):d instanceof Error?a(d):Np(d)?a(dn(2,{from:t,to:d})):(i&&r.enterCallbacks[o]===i&&typeof d=="function"&&i.push(d),s())},c=e.call(r&&r.instances[o],t,n,l);let u=Promise.resolve(c);e.length<3&&(u=u.then(l)),u.catch(d=>a(d))})}function Oo(e,t,n,r){const o=[];for(const i of e)for(const s in i.components){let a=i.components[s];if(!(t!=="beforeRouteEnter"&&!i.instances[s]))if(dm(a)){const c=(a.__vccOpts||a)[t];c&&o.push(wt(c,n,r,i,s))}else{let l=a();o.push(()=>l.then(c=>{if(!c)return Promise.reject(new Error(`Couldn't resolve component "${s}" at "${i.path}"`));const u=_p(c)?c.default:c;i.components[s]=u;const f=(u.__vccOpts||u)[t];return f&&wt(f,n,r,i,s)()}))}}return o}function dm(e){return typeof e=="object"||"displayName"in e||"props"in e||"__vccOpts"in e}function Vs(e){const t=je(io),n=je(Fi),r=Oe(()=>t.resolve(zt(e.to))),o=Oe(()=>{const{matched:l}=r.value,{length:c}=l,u=l[c-1],d=n.matched;if(!u||!d.length)return-1;const f=d.findIndex(fn.bind(null,u));if(f>-1)return f;const h=Ks(l[c-2]);return c>1&&Ks(u)===h&&d[d.length-1].path!==h?d.findIndex(fn.bind(null,l[c-2])):f}),i=Oe(()=>o.value>-1&&vm(n.params,r.value.params)),s=Oe(()=>o.value>-1&&o.value===n.matched.length-1&&_c(n.params,r.value.params));function a(l={}){return hm(l)?t[zt(e.replace)?"replace":"push"](zt(e.to)).catch(Hn):Promise.resolve()}return{route:r,href:Oe(()=>r.value.href),isActive:i,isExactActive:s,navigate:a}}const pm=Ye({name:"RouterLink",props:{to:{type:[String,Object],required:!0},replace:Boolean,activeClass:String,exactActiveClass:String,custom:Boolean,ariaCurrentValue:{type:String,default:"page"}},useLink:Vs,setup(e,{slots:t}){const n=gn(Vs(e)),{options:r}=je(io),o=Oe(()=>({[Ws(e.activeClass,r.linkActiveClass,"router-link-active")]:n.isActive,[Ws(e.exactActiveClass,r.linkExactActiveClass,"router-link-exact-active")]:n.isExactActive}));return()=>{const i=t.default&&t.default(n);return e.custom?i:ye("a",{"aria-current":n.isExactActive?e.ariaCurrentValue:null,href:n.href,onClick:n.navigate,class:o.value},i)}}}),mm=pm;function hm(e){if(!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)&&!e.defaultPrevented&&!(e.button!==void 0&&e.button!==0)){if(e.currentTarget&&e.currentTarget.getAttribute){const t=e.currentTarget.getAttribute("target");if(/\b_blank\b/i.test(t))return}return e.preventDefault&&e.preventDefault(),!0}}function vm(e,t){for(const n in t){const r=t[n],o=e[n];if(typeof r=="string"){if(r!==o)return!1}else if(!Array.isArray(o)||o.length!==r.length||r.some((i,s)=>i!==o[s]))return!1}return!0}function Ks(e){return e?e.aliasOf?e.aliasOf.path:e.path:""}const Ws=(e,t,n)=>e!=null?e:t!=null?t:n,gm=Ye({name:"RouterView",inheritAttrs:!1,props:{name:{type:String,default:"default"},route:Object},setup(e,{attrs:t,slots:n}){const r=je(Ko),o=Oe(()=>e.route||r.value),i=je(Ls,0),s=Oe(()=>o.value.matched[i]);$t(Ls,i+1),$t(gp,s),$t(Ko,o);const a=Le();return et(()=>[a.value,s.value,e.name],([l,c,u],[d,f,h])=>{c&&(c.instances[u]=l,f&&f!==c&&l&&l===d&&(c.leaveGuards.size||(c.leaveGuards=f.leaveGuards),c.updateGuards.size||(c.updateGuards=f.updateGuards))),l&&c&&(!f||!fn(c,f)||!d)&&(c.enterCallbacks[u]||[]).forEach(p=>p(l))},{flush:"post"}),()=>{const l=o.value,c=s.value,u=c&&c.components[e.name],d=e.name;if(!u)return Js(n.default,{Component:u,route:l});const f=c.props[e.name],h=f?f===!0?l.params:typeof f=="function"?f(l):f:null,g=ye(u,ve({},h,t,{onVnodeUnmounted:v=>{v.component.isUnmounted&&(c.instances[d]=null)},ref:a}));return Js(n.default,{Component:g,route:l})||g}}});function Js(e,t){if(!e)return null;const n=e(t);return n.length===1?n[0]:n}const Ic=gm;function _m(e){const t=Kp(e.routes,e),n=e.parseQuery||um,r=e.stringifyQuery||qs,o=e.history,i=wn(),s=wn(),a=wn(),l=kl(at);let c=at;Xt&&e.scrollBehavior&&"scrollRestoration"in history&&(history.scrollRestoration="manual");const u=bo.bind(null,j=>""+j),d=bo.bind(null,cm),f=bo.bind(null,$r);function h(j,U){let N,q;return bc(j)?(N=t.getRecordMatcher(j),q=U):q=j,t.addRoute(q,N)}function p(j){const U=t.getRecordMatcher(j);U&&t.removeRoute(U)}function g(){return t.getRoutes().map(j=>j.record)}function v(j){return!!t.getRecordMatcher(j)}function _(j,U){if(U=ve({},U||l.value),typeof j=="string"){const X=Eo(n,j,U.path),m=t.resolve({path:X.path},U),y=o.createHref(X.fullPath);return ve(X,m,{params:f(m.params),hash:$r(X.hash),redirectedFrom:void 0,href:y})}let N;if("path"in j)N=ve({},j,{path:Eo(n,j.path,U.path).path});else{const X=ve({},j.params);for(const m in X)X[m]==null&&delete X[m];N=ve({},j,{params:d(j.params)}),U.params=d(U.params)}const q=t.resolve(N,U),le=j.hash||"";q.params=u(f(q.params));const pe=Ep(r,ve({},j,{hash:sm(le),path:q.path})),re=o.createHref(pe);return ve({fullPath:pe,hash:le,query:r===qs?fm(j.query):j.query||{}},q,{redirectedFrom:void 0,href:re})}function E(j){return typeof j=="string"?Eo(n,j,l.value.path):ve({},j)}function S(j,U){if(c!==j)return dn(8,{from:U,to:j})}function w(j){return C(j)}function I(j){return w(ve(E(j),{replace:!0}))}function k(j){const U=j.matched[j.matched.length-1];if(U&&U.redirect){const{redirect:N}=U;let q=typeof N=="function"?N(j):N;return typeof q=="string"&&(q=q.includes("?")||q.includes("#")?q=E(q):{path:q},q.params={}),ve({query:j.query,hash:j.hash,params:j.params},q)}}function C(j,U){const N=c=_(j),q=l.value,le=j.state,pe=j.force,re=j.replace===!0,X=k(N);if(X)return C(ve(E(X),{state:le,force:pe,replace:re}),U||N);const m=N;m.redirectedFrom=U;let y;return!pe&&Op(r,q,N)&&(y=dn(16,{to:m,from:q}),Pe(q,q,!0,!1)),(y?Promise.resolve(y):H(m,q)).catch(O=>bt(O)?bt(O,2)?O:Ee(O):ee(O,m,q)).then(O=>{if(O){if(bt(O,2))return C(ve(E(O.to),{state:le,force:pe,replace:re}),U||m)}else O=B(m,q,!0,re,le);return $(m,q,O),O})}function P(j,U){const N=S(j,U);return N?Promise.reject(N):Promise.resolve()}function H(j,U){let N;const[q,le,pe]=ym(j,U);N=Oo(q.reverse(),"beforeRouteLeave",j,U);for(const X of q)X.leaveGuards.forEach(m=>{N.push(wt(m,j,U))});const re=P.bind(null,j,U);return N.push(re),Wt(N).then(()=>{N=[];for(const X of i.list())N.push(wt(X,j,U));return N.push(re),Wt(N)}).then(()=>{N=Oo(le,"beforeRouteUpdate",j,U);for(const X of le)X.updateGuards.forEach(m=>{N.push(wt(m,j,U))});return N.push(re),Wt(N)}).then(()=>{N=[];for(const X of j.matched)if(X.beforeEnter&&!U.matched.includes(X))if(Array.isArray(X.beforeEnter))for(const m of X.beforeEnter)N.push(wt(m,j,U));else N.push(wt(X.beforeEnter,j,U));return N.push(re),Wt(N)}).then(()=>(j.matched.forEach(X=>X.enterCallbacks={}),N=Oo(pe,"beforeRouteEnter",j,U),N.push(re),Wt(N))).then(()=>{N=[];for(const X of s.list())N.push(wt(X,j,U));return N.push(re),Wt(N)}).catch(X=>bt(X,8)?X:Promise.reject(X))}function $(j,U,N){for(const q of a.list())q(j,U,N)}function B(j,U,N,q,le){const pe=S(j,U);if(pe)return pe;const re=U===at,X=Xt?history.state:{};N&&(q||re?o.replace(j.fullPath,ve({scroll:re&&X&&X.scroll},le)):o.push(j.fullPath,le)),l.value=j,Pe(j,U,N,re),Ee()}let A;function z(){A=o.listen((j,U,N)=>{const q=_(j),le=k(q);if(le){C(ve(le,{replace:!0}),q).catch(Hn);return}c=q;const pe=l.value;Xt&&jp(Hs(pe.fullPath,N.delta),so()),H(q,pe).catch(re=>bt(re,12)?re:bt(re,2)?(C(re.to,q).then(X=>{bt(X,20)&&!N.delta&&N.type===Jn.pop&&o.go(-1,!1)}).catch(Hn),Promise.reject()):(N.delta&&o.go(-N.delta,!1),ee(re,q,pe))).then(re=>{re=re||B(q,pe,!1),re&&(N.delta?o.go(-N.delta,!1):N.type===Jn.pop&&bt(re,20)&&o.go(-1,!1)),$(q,pe,re)}).catch(Hn)})}let Q=wn(),se=wn(),W;function ee(j,U,N){Ee(j);const q=se.list();return q.length?q.forEach(le=>le(j,U,N)):console.error(j),Promise.reject(j)}function te(){return W&&l.value!==at?Promise.resolve():new Promise((j,U)=>{Q.add([j,U])})}function Ee(j){return W||(W=!j,z(),Q.list().forEach(([U,N])=>j?N(j):U()),Q.reset()),j}function Pe(j,U,N,q){const{scrollBehavior:le}=e;if(!Xt||!le)return Promise.resolve();const pe=!N&&Tp(Hs(j.fullPath,0))||(q||!N)&&history.state&&history.state.scroll||null;return Pi().then(()=>le(j,U,pe)).then(re=>re&&xp(re)).catch(re=>ee(re,j,U))}const Ae=j=>o.go(j);let we;const Te=new Set;return{currentRoute:l,addRoute:h,removeRoute:p,hasRoute:v,getRoutes:g,resolve:_,options:e,push:w,replace:I,go:Ae,back:()=>Ae(-1),forward:()=>Ae(1),beforeEach:i.add,beforeResolve:s.add,afterEach:a.add,onError:se.add,isReady:te,install(j){const U=this;j.component("RouterLink",mm),j.component("RouterView",Ic),j.config.globalProperties.$router=U,Object.defineProperty(j.config.globalProperties,"$route",{enumerable:!0,get:()=>zt(l)}),Xt&&!we&&l.value===at&&(we=!0,w(o.location).catch(le=>{}));const N={};for(const le in at)N[le]=Oe(()=>l.value[le]);j.provide(io,U),j.provide(Fi,gn(N)),j.provide(Ko,l);const q=j.unmount;Te.add(j),j.unmount=function(){Te.delete(j),Te.size<1&&(c=at,A&&A(),l.value=at,we=!1,W=!1),q()}}}}function Wt(e){return e.reduce((t,n)=>t.then(()=>n()),Promise.resolve())}function ym(e,t){const n=[],r=[],o=[],i=Math.max(t.matched.length,e.matched.length);for(let s=0;s<i;s++){const a=t.matched[s];a&&(e.matched.find(c=>fn(c,a))?r.push(a):n.push(a));const l=e.matched[s];l&&(t.matched.find(c=>fn(c,l))||o.push(l))}return[n,r,o]}function ao(){return je(io)}function $i(){return je(Fi)}const bm=Ye({setup(e,t){const n=Le(!1);return mt(()=>{n.value=!0}),()=>{var r,o;return n.value?(o=(r=t.slots).default)===null||o===void 0?void 0:o.call(r):null}}}),Em="modulepreload",Qs={},Om="/",ne=function(t,n){return!n||n.length===0?t():Promise.all(n.map(r=>{if(r=`${Om}${r}`,r in Qs)return;Qs[r]=!0;const o=r.endsWith(".css"),i=o?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${i}`))return;const s=document.createElement("link");if(s.rel=o?"stylesheet":Em,o||(s.as="script",s.crossOrigin=""),s.href=r,document.head.appendChild(s),o)return new Promise((a,l)=>{s.addEventListener("load",a),s.addEventListener("error",()=>l(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>t())},xc={"v-8daa1a0e":ce(()=>ne(()=>import("./index.html.5ab90608.js"),[])),"v-08a5d2dc":ce(()=>ne(()=>import("./index.html.b4665819.js"),[])),"v-9014096a":ce(()=>ne(()=>import("./index.html.ceb36e17.js"),[])),"v-0dd9e6a8":ce(()=>ne(()=>import("./index.html.055fb78f.js"),[])),"v-fb37d6ea":ce(()=>ne(()=>import("./index.html.a6269bf4.js"),[])),"v-55146a0d":ce(()=>ne(()=>import("./index.html.fb7d3767.js"),[])),"v-59de75e8":ce(()=>ne(()=>import("./index.html.f42a93ce.js"),[])),"v-d446beac":ce(()=>ne(()=>import("./index.html.bead136d.js"),[])),"v-241ec4c4":ce(()=>ne(()=>import("./index.html.c2cc26a6.js"),[])),"v-3706649a":ce(()=>ne(()=>import("./404.html.e8e82ae7.js"),[]))},wm={"v-8daa1a0e":()=>ne(()=>import("./index.html.5c620bdc.js"),[]).then(({data:e})=>e),"v-08a5d2dc":()=>ne(()=>import("./index.html.46debbc6.js"),[]).then(({data:e})=>e),"v-9014096a":()=>ne(()=>import("./index.html.d53513ec.js"),[]).then(({data:e})=>e),"v-0dd9e6a8":()=>ne(()=>import("./index.html.b1d7c8d2.js"),[]).then(({data:e})=>e),"v-fb37d6ea":()=>ne(()=>import("./index.html.77270580.js"),[]).then(({data:e})=>e),"v-55146a0d":()=>ne(()=>import("./index.html.6d23c620.js"),[]).then(({data:e})=>e),"v-59de75e8":()=>ne(()=>import("./index.html.94c6d9be.js"),[]).then(({data:e})=>e),"v-d446beac":()=>ne(()=>import("./index.html.1f688541.js"),[]).then(({data:e})=>e),"v-241ec4c4":()=>ne(()=>import("./index.html.61d313f8.js"),[]).then(({data:e})=>e),"v-3706649a":()=>ne(()=>import("./404.html.f166316b.js"),[]).then(({data:e})=>e)},jc=Le(wm),Tc=Ei({key:"",path:"",title:"",lang:"",frontmatter:{},excerpt:"",headers:[]}),ct=Le(Tc),or=()=>ct;Yi.webpackHot&&(__VUE_HMR_RUNTIME__.updatePageData=e=>{jc.value[e.key]=()=>Promise.resolve(e),e.key===ct.value.key&&(ct.value=e)});const kc=Symbol(""),Sm=()=>{const e=je(kc);if(!e)throw new Error("usePageFrontmatter() is called without provider.");return e},Dc=Symbol(""),Pm=()=>{const e=je(Dc);if(!e)throw new Error("usePageHead() is called without provider.");return e},Cm=Symbol(""),Rc=Symbol(""),Lc=()=>{const e=je(Rc);if(!e)throw new Error("usePageLang() is called without provider.");return e},Bi=Symbol(""),Nc=()=>{const e=je(Bi);if(!e)throw new Error("useRouteLocale() is called without provider.");return e},Am={base:"/",lang:"en-US",title:"Vue 3 Datepicker",description:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available",head:[["link",{rel:"icon",href:"/logo.png"}],["meta",{name:"description",content:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"}]],locales:{}},St=Le(Am),Mc=()=>St;Yi.webpackHot&&(__VUE_HMR_RUNTIME__.updateSiteData=e=>{St.value=e});const Hc=Symbol(""),Y0=()=>{const e=je(Hc);if(!e)throw new Error("useSiteLocaleData() is called without provider.");return e},Im=Symbol(""),Ui=e=>{let t;e.pageKey?t=e.pageKey:t=or().value.key;const n=xc[t];return n?ye(n):ye("div","404 Not Found")};Ui.displayName="Content";Ui.props={pageKey:{type:String,required:!1}};const xm={"404":ce(()=>ne(()=>import("./404.fcd2b20d.js"),[])),Layout:ce(()=>ne(()=>import("./Layout.397f0655.js"),[]))},jm=([e,t,n])=>e==="meta"&&t.name?`${e}.${t.name}`:["title","base"].includes(e)?e:e==="template"&&t.id?`${e}.${t.id}`:JSON.stringify([e,t,n]),Tm=e=>{const t=new Set,n=[];return e.forEach(r=>{const o=jm(r);t.has(o)||(t.add(o),n.push(r))}),n},km=e=>/^(https?:)?\/\//.test(e),G0=e=>/^mailto:/.test(e),Z0=e=>/^tel:/.test(e),Fc=e=>Object.prototype.toString.call(e)==="[object Object]",Dm=e=>e.replace(/\/$/,""),Rm=e=>e.replace(/^\//,""),zc=(e,t)=>{const n=Object.keys(e).sort((r,o)=>{const i=o.split("/").length-r.split("/").length;return i!==0?i:o.length-r.length});for(const r of n)if(t.startsWith(r))return r;return"/"},Lm=(e,t="/")=>e.replace(/^(https?:)?\/\/[^/]*/,"").replace(new RegExp(`^${t}`),"/"),Ys=Ye({name:"Vuepress",setup(){const e=or(),t=Oe(()=>{let n;if(e.value.path){const r=e.value.frontmatter.layout;me(r)?n=r:n="Layout"}else n="404";return xm[n]||Pd(n,!1)});return()=>ye(t.value)}}),yn=e=>e,qi=e=>e,Nm=e=>km(e)?e:`${Mc().value.base}${Rm(e)}`,Rt=gn({resolvePageData:async e=>{const t=jc.value[e],n=await(t==null?void 0:t());return n!=null?n:Tc},resolvePageFrontmatter:e=>e.frontmatter,resolvePageHead:(e,t,n)=>{const r=me(t.description)?t.description:n.description,o=[...Z(t.head)?t.head:[],...n.head,["title",{},e],["meta",{name:"description",content:r}]];return Tm(o)},resolvePageHeadTitle:(e,t)=>`${e.title?`${e.title} | `:""}${t.title}`,resolvePageLang:e=>e.lang||"en",resolveRouteLocale:(e,t)=>zc(e,t),resolveSiteLocaleData:(e,t)=>De(De({},e),e.locales[t])});const Mm=ye("svg",{class:"external-link-icon",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",x:"0px",y:"0px",viewBox:"0 0 100 100",width:"15",height:"15"},[ye("path",{fill:"currentColor",d:"M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"}),ye("polygon",{fill:"currentColor",points:"45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"})]),Hm=Ye({name:"ExternalLinkIcon",props:{locales:{type:Object,required:!1,default:()=>({})}},setup(e){const t=Nc(),n=Oe(()=>{var r;return(r=e.locales[t.value])!==null&&r!==void 0?r:{openInNewWindow:"open in new window"}});return()=>ye("span",[Mm,ye("span",{class:"external-link-icon-sr-only"},n.value.openInNewWindow)])}}),Fm={"/":{openInNewWindow:"open in new window"}};var zm=yn(({app:e})=>{e.component("ExternalLinkIcon",ye(Hm,{locales:Fm}))});/*! medium-zoom 1.0.6 | MIT License | https://github.com/francoischalifour/medium-zoom */var Lt=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},pr=function(t){return t.tagName==="IMG"},$m=function(t){return NodeList.prototype.isPrototypeOf(t)},wr=function(t){return t&&t.nodeType===1},Gs=function(t){var n=t.currentSrc||t.src;return n.substr(-4).toLowerCase()===".svg"},Zs=function(t){try{return Array.isArray(t)?t.filter(pr):$m(t)?[].slice.call(t).filter(pr):wr(t)?[t].filter(pr):typeof t=="string"?[].slice.call(document.querySelectorAll(t)).filter(pr):[]}catch{throw new TypeError(`The provided selector is invalid.
+Expects a CSS selector, a Node element, a NodeList or an array.
+See: https://github.com/francoischalifour/medium-zoom`)}},Bm=function(t){var n=document.createElement("div");return n.classList.add("medium-zoom-overlay"),n.style.background=t,n},Um=function(t){var n=t.getBoundingClientRect(),r=n.top,o=n.left,i=n.width,s=n.height,a=t.cloneNode(),l=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,c=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return a.removeAttribute("id"),a.style.position="absolute",a.style.top=r+l+"px",a.style.left=o+c+"px",a.style.width=i+"px",a.style.height=s+"px",a.style.transform="",a},Jt=function(t,n){var r=Lt({bubbles:!1,cancelable:!1,detail:void 0},n);if(typeof window.CustomEvent=="function")return new CustomEvent(t,r);var o=document.createEvent("CustomEvent");return o.initCustomEvent(t,r.bubbles,r.cancelable,r.detail),o},qm=function e(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},r=window.Promise||function(A){function z(){}A(z,z)},o=function(A){var z=A.target;if(z===H){p();return}S.indexOf(z)!==-1&&g({target:z})},i=function(){if(!(I||!P.original)){var A=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0;Math.abs(k-A)>C.scrollOffset&&setTimeout(p,150)}},s=function(A){var z=A.key||A.keyCode;(z==="Escape"||z==="Esc"||z===27)&&p()},a=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},z=A;if(A.background&&(H.style.background=A.background),A.container&&A.container instanceof Object&&(z.container=Lt({},C.container,A.container)),A.template){var Q=wr(A.template)?A.template:document.querySelector(A.template);z.template=Q}return C=Lt({},C,z),S.forEach(function(se){se.dispatchEvent(Jt("medium-zoom:update",{detail:{zoom:$}}))}),$},l=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return e(Lt({},C,A))},c=function(){for(var A=arguments.length,z=Array(A),Q=0;Q<A;Q++)z[Q]=arguments[Q];var se=z.reduce(function(W,ee){return[].concat(W,Zs(ee))},[]);return se.filter(function(W){return S.indexOf(W)===-1}).forEach(function(W){S.push(W),W.classList.add("medium-zoom-image")}),w.forEach(function(W){var ee=W.type,te=W.listener,Ee=W.options;se.forEach(function(Pe){Pe.addEventListener(ee,te,Ee)})}),$},u=function(){for(var A=arguments.length,z=Array(A),Q=0;Q<A;Q++)z[Q]=arguments[Q];P.zoomed&&p();var se=z.length>0?z.reduce(function(W,ee){return[].concat(W,Zs(ee))},[]):S;return se.forEach(function(W){W.classList.remove("medium-zoom-image"),W.dispatchEvent(Jt("medium-zoom:detach",{detail:{zoom:$}}))}),S=S.filter(function(W){return se.indexOf(W)===-1}),$},d=function(A,z){var Q=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return S.forEach(function(se){se.addEventListener("medium-zoom:"+A,z,Q)}),w.push({type:"medium-zoom:"+A,listener:z,options:Q}),$},f=function(A,z){var Q=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return S.forEach(function(se){se.removeEventListener("medium-zoom:"+A,z,Q)}),w=w.filter(function(se){return!(se.type==="medium-zoom:"+A&&se.listener.toString()===z.toString())}),$},h=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},z=A.target,Q=function(){var W={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight,left:0,top:0,right:0,bottom:0},ee=void 0,te=void 0;if(C.container)if(C.container instanceof Object)W=Lt({},W,C.container),ee=W.width-W.left-W.right-C.margin*2,te=W.height-W.top-W.bottom-C.margin*2;else{var Ee=wr(C.container)?C.container:document.querySelector(C.container),Pe=Ee.getBoundingClientRect(),Ae=Pe.width,we=Pe.height,Te=Pe.left,ze=Pe.top;W=Lt({},W,{width:Ae,height:we,left:Te,top:ze})}ee=ee||W.width-C.margin*2,te=te||W.height-C.margin*2;var j=P.zoomedHd||P.original,U=Gs(j)?ee:j.naturalWidth||ee,N=Gs(j)?te:j.naturalHeight||te,q=j.getBoundingClientRect(),le=q.top,pe=q.left,re=q.width,X=q.height,m=Math.min(U,ee)/re,y=Math.min(N,te)/X,O=Math.min(m,y),x=(-pe+(ee-re)/2+C.margin+W.left)/O,T=(-le+(te-X)/2+C.margin+W.top)/O,D="scale("+O+") translate3d("+x+"px, "+T+"px, 0)";P.zoomed.style.transform=D,P.zoomedHd&&(P.zoomedHd.style.transform=D)};return new r(function(se){if(z&&S.indexOf(z)===-1){se($);return}var W=function Ae(){I=!1,P.zoomed.removeEventListener("transitionend",Ae),P.original.dispatchEvent(Jt("medium-zoom:opened",{detail:{zoom:$}})),se($)};if(P.zoomed){se($);return}if(z)P.original=z;else if(S.length>0){var ee=S;P.original=ee[0]}else{se($);return}if(P.original.dispatchEvent(Jt("medium-zoom:open",{detail:{zoom:$}})),k=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,I=!0,P.zoomed=Um(P.original),document.body.appendChild(H),C.template){var te=wr(C.template)?C.template:document.querySelector(C.template);P.template=document.createElement("div"),P.template.appendChild(te.content.cloneNode(!0)),document.body.appendChild(P.template)}if(document.body.appendChild(P.zoomed),window.requestAnimationFrame(function(){document.body.classList.add("medium-zoom--opened")}),P.original.classList.add("medium-zoom-image--hidden"),P.zoomed.classList.add("medium-zoom-image--opened"),P.zoomed.addEventListener("click",p),P.zoomed.addEventListener("transitionend",W),P.original.getAttribute("data-zoom-src")){P.zoomedHd=P.zoomed.cloneNode(),P.zoomedHd.removeAttribute("srcset"),P.zoomedHd.removeAttribute("sizes"),P.zoomedHd.src=P.zoomed.getAttribute("data-zoom-src"),P.zoomedHd.onerror=function(){clearInterval(Ee),console.warn("Unable to reach the zoom image target "+P.zoomedHd.src),P.zoomedHd=null,Q()};var Ee=setInterval(function(){P.zoomedHd.complete&&(clearInterval(Ee),P.zoomedHd.classList.add("medium-zoom-image--opened"),P.zoomedHd.addEventListener("click",p),document.body.appendChild(P.zoomedHd),Q())},10)}else if(P.original.hasAttribute("srcset")){P.zoomedHd=P.zoomed.cloneNode(),P.zoomedHd.removeAttribute("sizes"),P.zoomedHd.removeAttribute("loading");var Pe=P.zoomedHd.addEventListener("load",function(){P.zoomedHd.removeEventListener("load",Pe),P.zoomedHd.classList.add("medium-zoom-image--opened"),P.zoomedHd.addEventListener("click",p),document.body.appendChild(P.zoomedHd),Q()})}else Q()})},p=function(){return new r(function(A){if(I||!P.original){A($);return}var z=function Q(){P.original.classList.remove("medium-zoom-image--hidden"),document.body.removeChild(P.zoomed),P.zoomedHd&&document.body.removeChild(P.zoomedHd),document.body.removeChild(H),P.zoomed.classList.remove("medium-zoom-image--opened"),P.template&&document.body.removeChild(P.template),I=!1,P.zoomed.removeEventListener("transitionend",Q),P.original.dispatchEvent(Jt("medium-zoom:closed",{detail:{zoom:$}})),P.original=null,P.zoomed=null,P.zoomedHd=null,P.template=null,A($)};I=!0,document.body.classList.remove("medium-zoom--opened"),P.zoomed.style.transform="",P.zoomedHd&&(P.zoomedHd.style.transform=""),P.template&&(P.template.style.transition="opacity 150ms",P.template.style.opacity=0),P.original.dispatchEvent(Jt("medium-zoom:close",{detail:{zoom:$}})),P.zoomed.addEventListener("transitionend",z)})},g=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},z=A.target;return P.original?p():h({target:z})},v=function(){return C},_=function(){return S},E=function(){return P.original},S=[],w=[],I=!1,k=0,C=n,P={original:null,zoomed:null,zoomedHd:null,template:null};Object.prototype.toString.call(t)==="[object Object]"?C=t:(t||typeof t=="string")&&c(t),C=Lt({margin:0,background:"#fff",scrollOffset:40,container:null,template:null},C);var H=Bm(C.background);document.addEventListener("click",o),document.addEventListener("keyup",s),document.addEventListener("scroll",i),window.addEventListener("resize",p);var $={open:h,close:p,toggle:g,update:a,clone:l,attach:c,detach:u,on:d,off:f,getOptions:v,getImages:_,getZoomedImage:E};return $};function Vm(e,t){t===void 0&&(t={});var n=t.insertAt;if(!(!e||typeof document=="undefined")){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",n==="top"&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}var Km=".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";Vm(Km);var Wm=qm;const Jm=Symbol("mediumZoom");const Qm=".theme-default-content > img, .theme-default-content :not(a) > img",Ym={},Gm=300;var Zm=yn(({app:e,router:t})=>{const n=Wm(Ym);n.refresh=(r=Qm)=>{n.detach(),n.attach(r)},e.provide(Jm,n),t.afterEach(()=>{setTimeout(()=>n.refresh(),Gm)})});const Xm={logo:"/logo.png",contributors:!1,navbar:[{text:"Home",link:"/"},{text:"GitHub",link:"https://github.com/Vuepic/vue-datepicker"},{text:"Changelog",link:"https://github.com/Vuepic/vue-datepicker/releases"}],sidebar:[{text:"Getting Started",children:[{text:"Installation",link:"/installation/"}]},{text:"API",children:[{text:"Props",link:"/api/props/"},{text:"Slots",link:"/api/slots/"},{text:"Components",link:"/api/components/"},{text:"Events",link:"/api/events/"},{text:"Methods",link:"/api/methods/"}]},{text:"Customization",children:[{text:"Theming",link:"/customization/theming/"},{text:"Scss",link:"/customization/scss/"}]}],locales:{"/":{selectLanguageName:"English"}},darkMode:!0,repo:null,selectLanguageText:"Languages",selectLanguageAriaLabel:"Select language",sidebarDepth:2,editLink:!0,editLinkText:"Edit this page",lastUpdated:!0,lastUpdatedText:"Last Updated",contributorsText:"Contributors",notFound:["There's nothing here.","How did we get here?","That's a Four-Oh-Four.","Looks like we've got some broken links."],backToHome:"Take me home",openInNewWindow:"open in new window",toggleDarkMode:"toggle dark mode",toggleSidebar:"toggle sidebar"},$c=Le(Xm),eh=()=>$c;Yi.webpackHot&&(__VUE_HMR_RUNTIME__.updateThemeData=e=>{$c.value=e});const Bc=Symbol(""),th=()=>{const e=je(Bc);if(!e)throw new Error("useThemeLocaleData() is called without provider.");return e},nh=(e,t)=>{var n;return De(De({},e),(n=e.locales)===null||n===void 0?void 0:n[t])};var rh=yn(({app:e})=>{const t=eh(),n=e._context.provides[Bi],r=Oe(()=>nh(t.value,n.value));e.provide(Bc,r),Object.defineProperties(e.config.globalProperties,{$theme:{get(){return t.value}},$themeLocale:{get(){return r.value}}})}),Uc=(e,t)=>{const n=e.__vccOpts||e;for(const[r,o]of t)n[r]=o;return n};const oh=Ye({props:{type:{type:String,required:!1,default:"tip"},text:{type:String,required:!1,default:""},vertical:{type:String,required:!1,default:void 0}},setup(e){return(t,n)=>(ro(),sc("span",{class:mn(["badge",e.type]),style:er({verticalAlign:e.vertical})},[uc(t.$slots,"default",{},()=>[Ri(Vu(e.text),1)])],6))}});var ih=Uc(oh,[["__file","Badge.vue"]]),sh=Ye({name:"CodeGroup",setup(e,{slots:t}){const n=Le(-1),r=Le([]),o=(a=n.value)=>{a<r.value.length-1?n.value=a+1:n.value=0,r.value[n.value].focus()},i=(a=n.value)=>{a>0?n.value=a-1:n.value=r.value.length-1,r.value[n.value].focus()},s=(a,l)=>{a.key===" "||a.key==="Enter"?(a.preventDefault(),n.value=l):a.key==="ArrowRight"?(a.preventDefault(),o(l)):a.key==="ArrowLeft"&&(a.preventDefault(),i(l))};return()=>{var a;const l=(((a=t.default)===null||a===void 0?void 0:a.call(t))||[]).filter(c=>c.type.name==="CodeGroupItem").map(c=>(c.props===null&&(c.props={}),c));return l.length===0?null:(n.value<0||n.value>l.length-1?(n.value=l.findIndex(c=>c.props.active===""||c.props.active===!0),n.value===-1&&(n.value=0)):l.forEach((c,u)=>{c.props.active=u===n.value}),ye("div",{class:"code-group"},[ye("div",{class:"code-group__nav"},ye("ul",{class:"code-group__ul"},l.map((c,u)=>{const d=u===n.value;return ye("li",{class:"code-group__li"},ye("button",{ref:f=>{f&&(r.value[u]=f)},class:{"code-group__nav-tab":!0,"code-group__nav-tab-active":d},ariaPressed:d,ariaExpanded:d,onClick:()=>n.value=u,onKeydown:f=>s(f,u)},c.props.title))}))),l]))}}});const ah=["aria-selected"],lh=Ye({name:"CodeGroupItem"}),ch=Ye(ht(De({},lh),{props:{title:{type:String,required:!0},active:{type:Boolean,required:!1,default:!1}},setup(e){return(t,n)=>(ro(),sc("div",{class:mn(["code-group-item",{"code-group-item__active":e.active}]),"aria-selected":e.active},[uc(t.$slots,"default")],10,ah))}}));var uh=Uc(ch,[["__file","CodeGroupItem.vue"]]);function qc(e){return tf()?(nf(e),!0):!1}const ir=typeof window!="undefined",fh=e=>typeof e=="string",wo=()=>{};function dh(e,t){function n(...r){e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})}return n}const Vc=e=>e();function ph(e=Vc){const t=Le(!0);function n(){t.value=!1}function r(){t.value=!0}return{isActive:t,pause:n,resume:r,eventFilter:(...i)=>{t.value&&e(...i)}}}function mh(e,t=!0){Ni()?Jl(e):t?e():Pi(e)}var Xs=Object.getOwnPropertySymbols,hh=Object.prototype.hasOwnProperty,vh=Object.prototype.propertyIsEnumerable,gh=(e,t)=>{var n={};for(var r in e)hh.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&Xs)for(var r of Xs(e))t.indexOf(r)<0&&vh.call(e,r)&&(n[r]=e[r]);return n};function _h(e,t,n={}){const r=n,{eventFilter:o=Vc}=r,i=gh(r,["eventFilter"]);return et(e,dh(o,t),i)}var yh=Object.defineProperty,bh=Object.defineProperties,Eh=Object.getOwnPropertyDescriptors,Br=Object.getOwnPropertySymbols,Kc=Object.prototype.hasOwnProperty,Wc=Object.prototype.propertyIsEnumerable,ea=(e,t,n)=>t in e?yh(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,Oh=(e,t)=>{for(var n in t||(t={}))Kc.call(t,n)&&ea(e,n,t[n]);if(Br)for(var n of Br(t))Wc.call(t,n)&&ea(e,n,t[n]);return e},wh=(e,t)=>bh(e,Eh(t)),Sh=(e,t)=>{var n={};for(var r in e)Kc.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&Br)for(var r of Br(e))t.indexOf(r)<0&&Wc.call(e,r)&&(n[r]=e[r]);return n};function Ph(e,t,n={}){const r=n,{eventFilter:o}=r,i=Sh(r,["eventFilter"]),{eventFilter:s,pause:a,resume:l,isActive:c}=ph(o);return{stop:_h(e,t,wh(Oh({},i),{eventFilter:s})),pause:a,resume:l,isActive:c}}function Ch(e){var t;const n=zt(e);return(t=n==null?void 0:n.$el)!=null?t:n}const Ur=ir?window:void 0;ir&&window.document;ir&&window.navigator;ir&&window.location;function Ah(...e){let t,n,r,o;if(fh(e[0])?([n,r,o]=e,t=Ur):[t,n,r,o]=e,!t)return wo;let i=wo;const s=et(()=>Ch(t),l=>{i(),l&&(l.addEventListener(n,r,o),i=()=>{l.removeEventListener(n,r,o),i=wo})},{immediate:!0,flush:"post"}),a=()=>{s(),i()};return qc(a),a}function Ih(e,t={}){const{window:n=Ur}=t;let r;const o=Le(!1),i=()=>{!n||(r||(r=n.matchMedia(e)),o.value=r.matches)};return mh(()=>{i(),r&&("addEventListener"in r?r.addEventListener("change",i):r.addListener(i),qc(()=>{"removeEventListener"in r?r.removeEventListener("change",i):r.removeListener(i)}))}),o}const Qo=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},Yo="__vueuse_ssr_handlers__";Qo[Yo]=Qo[Yo]||{};const xh=Qo[Yo];function jh(e,t){return xh[e]||t}function Th(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"||Array.isArray(e)?"object":Number.isNaN(e)?"any":"number"}const kh={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}};function Dh(e,t,n,r={}){var o;const{flush:i="pre",deep:s=!0,listenToStorageChanges:a=!0,writeDefaults:l=!0,shallow:c,window:u=Ur,eventFilter:d,onError:f=k=>{console.error(k)}}=r,h=(c?kl:Le)(t);if(!n)try{n=jh("getDefaultStorage",()=>{var k;return(k=Ur)==null?void 0:k.localStorage})()}catch(k){f(k)}if(!n)return h;const p=zt(t),g=Th(p),v=(o=r.serializer)!=null?o:kh[g],{pause:_,resume:E}=Ph(h,()=>S(h.value),{flush:i,deep:s,eventFilter:d});return u&&a&&Ah(u,"storage",I),I(),h;function S(k){try{k==null?n.removeItem(e):n.setItem(e,v.write(k))}catch(C){f(C)}}function w(k){if(!(k&&k.key!==e)){_();try{const C=k?k.newValue:n.getItem(e);return C==null?(l&&p!==null&&n.setItem(e,v.write(p)),p):typeof C!="string"?C:v.read(C)}catch(C){f(C)}finally{E()}}}function I(k){k&&k.key!==e||(h.value=w(k))}}function Rh(e){return Ih("(prefers-color-scheme: dark)",e)}var ta,na;ir&&(window==null?void 0:window.navigator)&&((ta=window==null?void 0:window.navigator)==null?void 0:ta.platform)&&/iP(ad|hone|od)/.test((na=window==null?void 0:window.navigator)==null?void 0:na.platform);const Jc=Symbol(""),X0=()=>{const e=je(Jc);if(!e)throw new Error("useDarkMode() is called without provider.");return e},Lh=()=>{const e=Zc(),t=Rh(),n=Dh("vuepress-color-scheme","auto"),r=Oe({get(){return e.value.darkMode?n.value==="auto"?t.value:n.value==="dark":!1},set(o){o===t.value?n.value="auto":n.value=o?"dark":"light"}});$t(Jc,r),Nh(r)},Nh=e=>{const t=(n=e.value)=>{const r=window==null?void 0:window.document.querySelector("html");r==null||r.classList.toggle("dark",n)};mt(()=>{et(e,t,{immediate:!0})}),ji(()=>t())},Qc=(...e)=>{const n=ao().resolve(...e),r=n.matched[n.matched.length-1];if(!(r!=null&&r.redirect))return n;const{redirect:o}=r,i=oe(o)?o(n):o,s=me(i)?{path:i}:i;return Qc(De({hash:n.hash,query:n.query,params:n.params},s))},Mh=e=>{const t=Qc(e);return{text:t.meta.title||e,link:t.name==="404"?e:t.fullPath}};let So=null,Sn=null;const Hh={wait:()=>So,pending:()=>{So=new Promise(e=>Sn=e)},resolve:()=>{Sn==null||Sn(),So=null,Sn=null}},Fh=()=>Hh,Yc=Symbol("sidebarItems"),e_=()=>{const e=je(Yc);if(!e)throw new Error("useSidebarItems() is called without provider.");return e},zh=()=>{const e=Zc(),t=Sm(),n=Oe(()=>$h(t.value,e.value));$t(Yc,n)},$h=(e,t)=>{var n,r,o,i;const s=(r=(n=e.sidebar)!==null&&n!==void 0?n:t.sidebar)!==null&&r!==void 0?r:"auto",a=(i=(o=e.sidebarDepth)!==null&&o!==void 0?o:t.sidebarDepth)!==null&&i!==void 0?i:2;return e.home||s===!1?[]:s==="auto"?Uh(a):Z(s)?Gc(s,a):Fc(s)?qh(s,a):[]},Bh=(e,t)=>({text:e.title,link:`#${e.slug}`,children:Vi(e.children,t)}),Vi=(e,t)=>t>0?e.map(n=>Bh(n,t-1)):[],Uh=e=>{const t=or();return[{text:t.value.title,children:Vi(t.value.headers,e)}]},Gc=(e,t)=>{const n=$i(),r=or(),o=i=>{var s;let a;if(me(i)?a=Mh(i):a=i,a.children)return ht(De({},a),{children:a.children.map(l=>o(l))});if(a.link===n.path){const l=((s=r.value.headers[0])===null||s===void 0?void 0:s.level)===1?r.value.headers[0].children:r.value.headers;return ht(De({},a),{children:Vi(l,t)})}return a};return e.map(i=>o(i))},qh=(e,t)=>{var n;const r=$i(),o=zc(e,r.path),i=(n=e[o])!==null&&n!==void 0?n:[];return Gc(i,t)},Zc=()=>th();var Vh=yn(({app:e,router:t})=>{e.component("Badge",ih),e.component("CodeGroup",sh),e.component("CodeGroupItem",uh),e.component("AutoLinkExternalIcon",()=>{const r=e.component("ExternalLinkIcon");return r?ye(r):null}),e.component("NavbarSearch",()=>{const r=e.component("Docsearch")||e.component("SearchBox");return r?ye(r):null});const n=t.options.scrollBehavior;t.options.scrollBehavior=async(...r)=>(await Fh().wait(),n(...r))}),Kh=({app:e})=>{e.component("CustomComponentsDemo",ce(()=>ne(()=>import("./CustomComponentsDemo.f24f5159.js"),["assets/CustomComponentsDemo.f24f5159.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("DarkDemo",ce(()=>ne(()=>import("./DarkDemo.ff1cd9e5.js"),["assets/DarkDemo.ff1cd9e5.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("Demo",ce(()=>ne(()=>import("./Demo.ff9daba9.js"),["assets/Demo.ff9daba9.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("DemoMarkers",ce(()=>ne(()=>import("./DemoMarkers.a7c0bac9.js"),["assets/DemoMarkers.a7c0bac9.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("DemoSlots",ce(()=>ne(()=>import("./DemoSlots.994a1a00.js"),["assets/DemoSlots.994a1a00.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("DisabledDatesDemo",ce(()=>ne(()=>import("./DisabledDatesDemo.b0dc77ec.js"),["assets/DisabledDatesDemo.b0dc77ec.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("EmptyDemo",ce(()=>ne(()=>import("./EmptyDemo.3ce9ae38.js"),["assets/EmptyDemo.3ce9ae38.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("FiltersDemo",ce(()=>ne(()=>import("./FiltersDemo.ab03492c.js"),["assets/FiltersDemo.ab03492c.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("FormatDemo",ce(()=>ne(()=>import("./FormatDemo.c36ba3a2.js"),["assets/FormatDemo.c36ba3a2.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("LocalizedOutput",ce(()=>ne(()=>import("./LocalizedOutput.518408aa.js"),["assets/LocalizedOutput.518408aa.js","assets/vue-datepicker.es.9f3b8378.js","assets/index.e7c299e1.js"]))),e.component("MinMaxDemo",ce(()=>ne(()=>import("./MinMaxDemo.32364bfe.js"),["assets/MinMaxDemo.32364bfe.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("PresetRange",ce(()=>ne(()=>import("./PresetRange.b207f627.js"),["assets/PresetRange.b207f627.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("PreviewFormatDemo",ce(()=>ne(()=>import("./PreviewFormatDemo.b4be84be.js"),["assets/PreviewFormatDemo.b4be84be.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("RequiredDemo",ce(()=>ne(()=>import("./RequiredDemo.b9086538.js"),["assets/RequiredDemo.b9086538.js","assets/vue-datepicker.es.9f3b8378.js","assets/index.e7c299e1.js"]))),e.component("TextInputDemo",ce(()=>ne(()=>import("./TextInputDemo.d8669300.js"),["assets/TextInputDemo.d8669300.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("TimezoneDemo",ce(()=>ne(()=>import("./TimezoneDemo.5861241f.js"),["assets/TimezoneDemo.5861241f.js","assets/vue-datepicker.es.9f3b8378.js"]))),e.component("customComponents-ActionRowCmp",ce(()=>ne(()=>import("./ActionRowCmp.c89aff1b.js"),[]))),e.component("customComponents-ChevronLeftIcon",ce(()=>ne(()=>import("./ChevronLeftIcon.ccfcd0b6.js"),[]))),e.component("customComponents-ChevronRightIcon",ce(()=>ne(()=>import("./ChevronRightIcon.d8c47dcc.js"),[]))),e.component("customComponents-MonthYearCmp",ce(()=>ne(()=>import("./MonthYearCmp.03a1bd41.js"),["assets/MonthYearCmp.03a1bd41.js","assets/ChevronLeftIcon.ccfcd0b6.js","assets/ChevronRightIcon.d8c47dcc.js"]))),e.component("customComponents-TimePickerCmp",ce(()=>ne(()=>import("./TimePickerCmp.48345a7c.js"),[])))};const Wh=e=>{if(window.dataLayer&&window.gtag)return;const t=document.createElement("script");t.src=`https://www.googletagmanager.com/gtag/js?id=${e}`,t.async=!0,document.head.appendChild(t),window.dataLayer=window.dataLayer||[],window.gtag=function(){dataLayer.push(arguments)},gtag("js",new Date),gtag("config",e)},Jh="G-MZXYGY1ZVV";var Qh=yn(()=>{Wh(Jh)});/*! @docsearch/js 3.0.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */function ra(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function fe(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?ra(Object(n),!0).forEach(function(r){Yh(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ra(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Qn(e){return Qn=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(t){return typeof t}:function(t){return t&&typeof Symbol=="function"&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},Qn(e)}function Yh(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Go(){return Go=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Go.apply(this,arguments)}function Gh(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function qr(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){var o=n==null?null:typeof Symbol!="undefined"&&n[Symbol.iterator]||n["@@iterator"];if(o!=null){var i,s,a=[],l=!0,c=!1;try{for(o=o.call(n);!(l=(i=o.next()).done)&&(a.push(i.value),!r||a.length!==r);l=!0);}catch(u){c=!0,s=u}finally{try{l||o.return==null||o.return()}finally{if(c)throw s}}return a}}(e,t)||Xc(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Vr(e){return function(t){if(Array.isArray(t))return Zo(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||Xc(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Xc(e,t){if(e){if(typeof e=="string")return Zo(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return n==="Object"&&e.constructor&&(n=e.constructor.name),n==="Map"||n==="Set"?Array.from(e):n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?Zo(e,t):void 0}}function Zo(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var Y,zn,eu,oa,tu,Kr={},Ki=[],Zh=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function ut(e,t){for(var n in t)e[n]=t[n];return e}function nu(e){var t=e.parentNode;t&&t.removeChild(e)}function ot(e,t,n){var r,o,i,s=arguments,a={};for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:a[i]=t[i];if(arguments.length>3)for(n=[n],i=3;i<arguments.length;i++)n.push(s[i]);if(n!=null&&(a.children=n),typeof e=="function"&&e.defaultProps!=null)for(i in e.defaultProps)a[i]===void 0&&(a[i]=e.defaultProps[i]);return $n(e,a,r,o,null)}function $n(e,t,n,r,o){var i={type:e,props:t,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:o==null?++Y.__v:o};return Y.vnode!=null&&Y.vnode(i),i}function It(e){return e.children}function it(e,t){this.props=e,this.context=t}function Yn(e,t){if(t==null)return e.__?Yn(e.__,e.__.__k.indexOf(e)+1):null;for(var n;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null)return n.__e;return typeof e.type=="function"?Yn(e):null}function ru(e){var t,n;if((e=e.__)!=null&&e.__c!=null){for(e.__e=e.__c.base=null,t=0;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null){e.__e=e.__c.base=n.__e;break}return ru(e)}}function Xo(e){(!e.__d&&(e.__d=!0)&&zn.push(e)&&!Wr.__r++||oa!==Y.debounceRendering)&&((oa=Y.debounceRendering)||eu)(Wr)}function Wr(){for(var e;Wr.__r=zn.length;)e=zn.sort(function(t,n){return t.__v.__b-n.__v.__b}),zn=[],e.some(function(t){var n,r,o,i,s,a;t.__d&&(s=(i=(n=t).__v).__e,(a=n.__P)&&(r=[],(o=ut({},i)).__v=i.__v+1,Wi(a,i,o,n.__n,a.ownerSVGElement!==void 0,i.__h!=null?[s]:null,r,s==null?Yn(i):s,i.__h),au(r,i),i.__e!=s&&ru(i)))})}function ou(e,t,n,r,o,i,s,a,l,c){var u,d,f,h,p,g,v,_=r&&r.__k||Ki,E=_.length;for(n.__k=[],u=0;u<t.length;u++)if((h=n.__k[u]=(h=t[u])==null||typeof h=="boolean"?null:typeof h=="string"||typeof h=="number"?$n(null,h,null,null,h):Array.isArray(h)?$n(It,{children:h},null,null,null):h.__b>0?$n(h.type,h.props,h.key,null,h.__v):h)!=null){if(h.__=n,h.__b=n.__b+1,(f=_[u])===null||f&&h.key==f.key&&h.type===f.type)_[u]=void 0;else for(d=0;d<E;d++){if((f=_[d])&&h.key==f.key&&h.type===f.type){_[d]=void 0;break}f=null}Wi(e,h,f=f||Kr,o,i,s,a,l,c),p=h.__e,(d=h.ref)&&f.ref!=d&&(v||(v=[]),f.ref&&v.push(f.ref,null,h),v.push(d,h.__c||p,h)),p!=null?(g==null&&(g=p),typeof h.type=="function"&&h.__k!=null&&h.__k===f.__k?h.__d=l=iu(h,l,e):l=su(e,h,f,_,p,l),c||n.type!=="option"?typeof n.type=="function"&&(n.__d=l):e.value=""):l&&f.__e==l&&l.parentNode!=e&&(l=Yn(f))}for(n.__e=g,u=E;u--;)_[u]!=null&&(typeof n.type=="function"&&_[u].__e!=null&&_[u].__e==n.__d&&(n.__d=Yn(r,u+1)),cu(_[u],_[u]));if(v)for(u=0;u<v.length;u++)lu(v[u],v[++u],v[++u])}function iu(e,t,n){var r,o;for(r=0;r<e.__k.length;r++)(o=e.__k[r])&&(o.__=e,t=typeof o.type=="function"?iu(o,t,n):su(n,o,o,e.__k,o.__e,t));return t}function ft(e,t){return t=t||[],e==null||typeof e=="boolean"||(Array.isArray(e)?e.some(function(n){ft(n,t)}):t.push(e)),t}function su(e,t,n,r,o,i){var s,a,l;if(t.__d!==void 0)s=t.__d,t.__d=void 0;else if(n==null||o!=i||o.parentNode==null)e:if(i==null||i.parentNode!==e)e.appendChild(o),s=null;else{for(a=i,l=0;(a=a.nextSibling)&&l<r.length;l+=2)if(a==o)break e;e.insertBefore(o,i),s=i}return s!==void 0?s:o.nextSibling}function ia(e,t,n){t[0]==="-"?e.setProperty(t,n):e[t]=n==null?"":typeof n!="number"||Zh.test(t)?n:n+"px"}function mr(e,t,n,r,o){var i;e:if(t==="style")if(typeof n=="string")e.style.cssText=n;else{if(typeof r=="string"&&(e.style.cssText=r=""),r)for(t in r)n&&t in n||ia(e.style,t,"");if(n)for(t in n)r&&n[t]===r[t]||ia(e.style,t,n[t])}else if(t[0]==="o"&&t[1]==="n")i=t!==(t=t.replace(/Capture$/,"")),t=t.toLowerCase()in e?t.toLowerCase().slice(2):t.slice(2),e.l||(e.l={}),e.l[t+i]=n,n?r||e.addEventListener(t,i?aa:sa,i):e.removeEventListener(t,i?aa:sa,i);else if(t!=="dangerouslySetInnerHTML"){if(o)t=t.replace(/xlink[H:h]/,"h").replace(/sName$/,"s");else if(t!=="href"&&t!=="list"&&t!=="form"&&t!=="download"&&t in e)try{e[t]=n==null?"":n;break e}catch{}typeof n=="function"||(n!=null&&(n!==!1||t[0]==="a"&&t[1]==="r")?e.setAttribute(t,n):e.removeAttribute(t))}}function sa(e){this.l[e.type+!1](Y.event?Y.event(e):e)}function aa(e){this.l[e.type+!0](Y.event?Y.event(e):e)}function Wi(e,t,n,r,o,i,s,a,l){var c,u,d,f,h,p,g,v,_,E,S,w=t.type;if(t.constructor!==void 0)return null;n.__h!=null&&(l=n.__h,a=t.__e=n.__e,t.__h=null,i=[a]),(c=Y.__b)&&c(t);try{e:if(typeof w=="function"){if(v=t.props,_=(c=w.contextType)&&r[c.__c],E=c?_?_.props.value:c.__:r,n.__c?g=(u=t.__c=n.__c).__=u.__E:("prototype"in w&&w.prototype.render?t.__c=u=new w(v,E):(t.__c=u=new it(v,E),u.constructor=w,u.render=ev),_&&_.sub(u),u.props=v,u.state||(u.state={}),u.context=E,u.__n=r,d=u.__d=!0,u.__h=[]),u.__s==null&&(u.__s=u.state),w.getDerivedStateFromProps!=null&&(u.__s==u.state&&(u.__s=ut({},u.__s)),ut(u.__s,w.getDerivedStateFromProps(v,u.__s))),f=u.props,h=u.state,d)w.getDerivedStateFromProps==null&&u.componentWillMount!=null&&u.componentWillMount(),u.componentDidMount!=null&&u.__h.push(u.componentDidMount);else{if(w.getDerivedStateFromProps==null&&v!==f&&u.componentWillReceiveProps!=null&&u.componentWillReceiveProps(v,E),!u.__e&&u.shouldComponentUpdate!=null&&u.shouldComponentUpdate(v,u.__s,E)===!1||t.__v===n.__v){u.props=v,u.state=u.__s,t.__v!==n.__v&&(u.__d=!1),u.__v=t,t.__e=n.__e,t.__k=n.__k,u.__h.length&&s.push(u);break e}u.componentWillUpdate!=null&&u.componentWillUpdate(v,u.__s,E),u.componentDidUpdate!=null&&u.__h.push(function(){u.componentDidUpdate(f,h,p)})}u.context=E,u.props=v,u.state=u.__s,(c=Y.__r)&&c(t),u.__d=!1,u.__v=t,u.__P=e,c=u.render(u.props,u.state,u.context),u.state=u.__s,u.getChildContext!=null&&(r=ut(ut({},r),u.getChildContext())),d||u.getSnapshotBeforeUpdate==null||(p=u.getSnapshotBeforeUpdate(f,h)),S=c!=null&&c.type===It&&c.key==null?c.props.children:c,ou(e,Array.isArray(S)?S:[S],t,n,r,o,i,s,a,l),u.base=t.__e,t.__h=null,u.__h.length&&s.push(u),g&&(u.__E=u.__=null),u.__e=!1}else i==null&&t.__v===n.__v?(t.__k=n.__k,t.__e=n.__e):t.__e=Xh(n.__e,t,n,r,o,i,s,l);(c=Y.diffed)&&c(t)}catch(I){t.__v=null,(l||i!=null)&&(t.__e=a,t.__h=!!l,i[i.indexOf(a)]=null),Y.__e(I,t,n)}}function au(e,t){Y.__c&&Y.__c(t,e),e.some(function(n){try{e=n.__h,n.__h=[],e.some(function(r){r.call(n)})}catch(r){Y.__e(r,n.__v)}})}function Xh(e,t,n,r,o,i,s,a){var l,c,u,d,f=n.props,h=t.props,p=t.type,g=0;if(p==="svg"&&(o=!0),i!=null){for(;g<i.length;g++)if((l=i[g])&&(l===e||(p?l.localName==p:l.nodeType==3))){e=l,i[g]=null;break}}if(e==null){if(p===null)return document.createTextNode(h);e=o?document.createElementNS("http://www.w3.org/2000/svg",p):document.createElement(p,h.is&&h),i=null,a=!1}if(p===null)f===h||a&&e.data===h||(e.data=h);else{if(i=i&&Ki.slice.call(e.childNodes),c=(f=n.props||Kr).dangerouslySetInnerHTML,u=h.dangerouslySetInnerHTML,!a){if(i!=null)for(f={},d=0;d<e.attributes.length;d++)f[e.attributes[d].name]=e.attributes[d].value;(u||c)&&(u&&(c&&u.__html==c.__html||u.__html===e.innerHTML)||(e.innerHTML=u&&u.__html||""))}if(function(v,_,E,S,w){var I;for(I in E)I==="children"||I==="key"||I in _||mr(v,I,null,E[I],S);for(I in _)w&&typeof _[I]!="function"||I==="children"||I==="key"||I==="value"||I==="checked"||E[I]===_[I]||mr(v,I,_[I],E[I],S)}(e,h,f,o,a),u)t.__k=[];else if(g=t.props.children,ou(e,Array.isArray(g)?g:[g],t,n,r,o&&p!=="foreignObject",i,s,e.firstChild,a),i!=null)for(g=i.length;g--;)i[g]!=null&&nu(i[g]);a||("value"in h&&(g=h.value)!==void 0&&(g!==e.value||p==="progress"&&!g)&&mr(e,"value",g,f.value,!1),"checked"in h&&(g=h.checked)!==void 0&&g!==e.checked&&mr(e,"checked",g,f.checked,!1))}return e}function lu(e,t,n){try{typeof e=="function"?e(t):e.current=t}catch(r){Y.__e(r,n)}}function cu(e,t,n){var r,o,i;if(Y.unmount&&Y.unmount(e),(r=e.ref)&&(r.current&&r.current!==e.__e||lu(r,null,t)),n||typeof e.type=="function"||(n=(o=e.__e)!=null),e.__e=e.__d=void 0,(r=e.__c)!=null){if(r.componentWillUnmount)try{r.componentWillUnmount()}catch(s){Y.__e(s,t)}r.base=r.__P=null}if(r=e.__k)for(i=0;i<r.length;i++)r[i]&&cu(r[i],t,n);o!=null&&nu(o)}function ev(e,t,n){return this.constructor(e,n)}function Gn(e,t,n){var r,o,i;Y.__&&Y.__(e,t),o=(r=typeof n=="function")?null:n&&n.__k||t.__k,i=[],Wi(t,e=(!r&&n||t).__k=ot(It,null,[e]),o||Kr,Kr,t.ownerSVGElement!==void 0,!r&&n?[n]:o?null:t.firstChild?Ki.slice.call(t.childNodes):null,i,!r&&n?n:o?o.__e:t.firstChild,r),au(i,e)}function uu(e,t){Gn(e,t,uu)}function tv(e,t,n){var r,o,i,s=arguments,a=ut({},e.props);for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:a[i]=t[i];if(arguments.length>3)for(n=[n],i=3;i<arguments.length;i++)n.push(s[i]);return n!=null&&(a.children=n),$n(e.type,a,r||e.key,o||e.ref,null)}Y={__e:function(e,t){for(var n,r,o;t=t.__;)if((n=t.__c)&&!n.__)try{if((r=n.constructor)&&r.getDerivedStateFromError!=null&&(n.setState(r.getDerivedStateFromError(e)),o=n.__d),n.componentDidCatch!=null&&(n.componentDidCatch(e),o=n.__d),o)return n.__E=n}catch(i){e=i}throw e},__v:0},it.prototype.setState=function(e,t){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=ut({},this.state),typeof e=="function"&&(e=e(ut({},n),this.props)),e&&ut(n,e),e!=null&&this.__v&&(t&&this.__h.push(t),Xo(this))},it.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),Xo(this))},it.prototype.render=It,zn=[],eu=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,Wr.__r=0,tu=0;var pn,Me,la,tn=0,ei=[],ca=Y.__b,ua=Y.__r,fa=Y.diffed,da=Y.__c,pa=Y.unmount;function Zn(e,t){Y.__h&&Y.__h(Me,e,tn||t),tn=0;var n=Me.__H||(Me.__H={__:[],__h:[]});return e>=n.__.length&&n.__.push({}),n.__[e]}function ma(e,t,n){var r=Zn(pn++,2);return r.t=e,r.__c||(r.__=[n?n(t):fu(void 0,t),function(o){var i=r.t(r.__[0],o);r.__[0]!==i&&(r.__=[i,r.__[1]],r.__c.setState({}))}],r.__c=Me),r.__}function ha(e,t){var n=Zn(pn++,4);!Y.__s&&Ji(n.__H,t)&&(n.__=e,n.__H=t,Me.__h.push(n))}function Sr(e,t){var n=Zn(pn++,7);return Ji(n.__H,t)&&(n.__=e(),n.__H=t,n.__h=e),n.__}function nv(){ei.forEach(function(e){if(e.__P)try{e.__H.__h.forEach(Pr),e.__H.__h.forEach(ti),e.__H.__h=[]}catch(t){e.__H.__h=[],Y.__e(t,e.__v)}}),ei=[]}Y.__b=function(e){Me=null,ca&&ca(e)},Y.__r=function(e){ua&&ua(e),pn=0;var t=(Me=e.__c).__H;t&&(t.__h.forEach(Pr),t.__h.forEach(ti),t.__h=[])},Y.diffed=function(e){fa&&fa(e);var t=e.__c;t&&t.__H&&t.__H.__h.length&&(ei.push(t)!==1&&la===Y.requestAnimationFrame||((la=Y.requestAnimationFrame)||function(n){var r,o=function(){clearTimeout(i),va&&cancelAnimationFrame(r),setTimeout(n)},i=setTimeout(o,100);va&&(r=requestAnimationFrame(o))})(nv)),Me=void 0},Y.__c=function(e,t){t.some(function(n){try{n.__h.forEach(Pr),n.__h=n.__h.filter(function(r){return!r.__||ti(r)})}catch(r){t.some(function(o){o.__h&&(o.__h=[])}),t=[],Y.__e(r,n.__v)}}),da&&da(e,t)},Y.unmount=function(e){pa&&pa(e);var t=e.__c;if(t&&t.__H)try{t.__H.__.forEach(Pr)}catch(n){Y.__e(n,t.__v)}};var va=typeof requestAnimationFrame=="function";function Pr(e){var t=Me;typeof e.__c=="function"&&e.__c(),Me=t}function ti(e){var t=Me;e.__c=e.__(),Me=t}function Ji(e,t){return!e||e.length!==t.length||t.some(function(n,r){return n!==e[r]})}function fu(e,t){return typeof t=="function"?t(e):t}function du(e,t){for(var n in t)e[n]=t[n];return e}function ni(e,t){for(var n in e)if(n!=="__source"&&!(n in t))return!0;for(var r in t)if(r!=="__source"&&e[r]!==t[r])return!0;return!1}function ri(e){this.props=e}(ri.prototype=new it).isPureReactComponent=!0,ri.prototype.shouldComponentUpdate=function(e,t){return ni(this.props,e)||ni(this.state,t)};var ga=Y.__b;Y.__b=function(e){e.type&&e.type.__f&&e.ref&&(e.props.ref=e.ref,e.ref=null),ga&&ga(e)};var rv=typeof Symbol!="undefined"&&Symbol.for&&Symbol.for("react.forward_ref")||3911,_a=function(e,t){return e==null?null:ft(ft(e).map(t))},ov={map:_a,forEach:_a,count:function(e){return e?ft(e).length:0},only:function(e){var t=ft(e);if(t.length!==1)throw"Children.only";return t[0]},toArray:ft},iv=Y.__e;function Cr(){this.__u=0,this.t=null,this.__b=null}function pu(e){var t=e.__.__c;return t&&t.__e&&t.__e(e)}function jn(){this.u=null,this.o=null}Y.__e=function(e,t,n){if(e.then){for(var r,o=t;o=o.__;)if((r=o.__c)&&r.__c)return t.__e==null&&(t.__e=n.__e,t.__k=n.__k),r.__c(e,t)}iv(e,t,n)},(Cr.prototype=new it).__c=function(e,t){var n=t.__c,r=this;r.t==null&&(r.t=[]),r.t.push(n);var o=pu(r.__v),i=!1,s=function(){i||(i=!0,n.componentWillUnmount=n.__c,o?o(a):a())};n.__c=n.componentWillUnmount,n.componentWillUnmount=function(){s(),n.__c&&n.__c()};var a=function(){if(!--r.__u){if(r.state.__e){var c=r.state.__e;r.__v.__k[0]=function d(f,h,p){return f&&(f.__v=null,f.__k=f.__k&&f.__k.map(function(g){return d(g,h,p)}),f.__c&&f.__c.__P===h&&(f.__e&&p.insertBefore(f.__e,f.__d),f.__c.__e=!0,f.__c.__P=p)),f}(c,c.__c.__P,c.__c.__O)}var u;for(r.setState({__e:r.__b=null});u=r.t.pop();)u.forceUpdate()}},l=t.__h===!0;r.__u++||l||r.setState({__e:r.__b=r.__v.__k[0]}),e.then(s,s)},Cr.prototype.componentWillUnmount=function(){this.t=[]},Cr.prototype.render=function(e,t){if(this.__b){if(this.__v.__k){var n=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=function i(s,a,l){return s&&(s.__c&&s.__c.__H&&(s.__c.__H.__.forEach(function(c){typeof c.__c=="function"&&c.__c()}),s.__c.__H=null),(s=du({},s)).__c!=null&&(s.__c.__P===l&&(s.__c.__P=a),s.__c=null),s.__k=s.__k&&s.__k.map(function(c){return i(c,a,l)})),s}(this.__b,n,r.__O=r.__P)}this.__b=null}var o=t.__e&&ot(It,null,e.fallback);return o&&(o.__h=null),[ot(It,null,t.__e?null:e.children),o]};var ya=function(e,t,n){if(++n[1]===n[0]&&e.o.delete(t),e.props.revealOrder&&(e.props.revealOrder[0]!=="t"||!e.o.size))for(n=e.u;n;){for(;n.length>3;)n.pop()();if(n[1]<n[0])break;e.u=n=n[2]}};function sv(e){return this.getChildContext=function(){return e.context},e.children}function av(e){var t=this,n=e.i;t.componentWillUnmount=function(){Gn(null,t.l),t.l=null,t.i=null},t.i&&t.i!==n&&t.componentWillUnmount(),e.__v?(t.l||(t.i=n,t.l={nodeType:1,parentNode:n,childNodes:[],appendChild:function(r){this.childNodes.push(r),t.i.appendChild(r)},insertBefore:function(r,o){this.childNodes.push(r),t.i.appendChild(r)},removeChild:function(r){this.childNodes.splice(this.childNodes.indexOf(r)>>>1,1),t.i.removeChild(r)}}),Gn(ot(sv,{context:t.context},e.__v),t.l)):t.l&&t.componentWillUnmount()}function mu(e,t){return ot(av,{__v:e,i:t})}(jn.prototype=new it).__e=function(e){var t=this,n=pu(t.__v),r=t.o.get(e);return r[0]++,function(o){var i=function(){t.props.revealOrder?(r.push(o),ya(t,e,r)):o()};n?n(i):i()}},jn.prototype.render=function(e){this.u=null,this.o=new Map;var t=ft(e.children);e.revealOrder&&e.revealOrder[0]==="b"&&t.reverse();for(var n=t.length;n--;)this.o.set(t[n],this.u=[1,0,this.u]);return e.children},jn.prototype.componentDidUpdate=jn.prototype.componentDidMount=function(){var e=this;this.o.forEach(function(t,n){ya(e,n,t)})};var hu=typeof Symbol!="undefined"&&Symbol.for&&Symbol.for("react.element")||60103,lv=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,cv=function(e){return(typeof Symbol!="undefined"&&Qn(Symbol())=="symbol"?/fil|che|rad/i:/fil|che|ra/i).test(e)};function vu(e,t,n){return t.__k==null&&(t.textContent=""),Gn(e,t),typeof n=="function"&&n(),e?e.__c:null}it.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(e){Object.defineProperty(it.prototype,e,{configurable:!0,get:function(){return this["UNSAFE_"+e]},set:function(t){Object.defineProperty(this,e,{configurable:!0,writable:!0,value:t})}})});var ba=Y.event;function uv(){}function fv(){return this.cancelBubble}function dv(){return this.defaultPrevented}Y.event=function(e){return ba&&(e=ba(e)),e.persist=uv,e.isPropagationStopped=fv,e.isDefaultPrevented=dv,e.nativeEvent=e};var gu,Ea={configurable:!0,get:function(){return this.class}},Oa=Y.vnode;Y.vnode=function(e){var t=e.type,n=e.props,r=n;if(typeof t=="string"){for(var o in r={},n){var i=n[o];o==="value"&&"defaultValue"in n&&i==null||(o==="defaultValue"&&"value"in n&&n.value==null?o="value":o==="download"&&i===!0?i="":/ondoubleclick/i.test(o)?o="ondblclick":/^onchange(textarea|input)/i.test(o+t)&&!cv(n.type)?o="oninput":/^on(Ani|Tra|Tou|BeforeInp)/.test(o)?o=o.toLowerCase():lv.test(o)?o=o.replace(/[A-Z0-9]/,"-$&").toLowerCase():i===null&&(i=void 0),r[o]=i)}t=="select"&&r.multiple&&Array.isArray(r.value)&&(r.value=ft(n.children).forEach(function(s){s.props.selected=r.value.indexOf(s.props.value)!=-1})),t=="select"&&r.defaultValue!=null&&(r.value=ft(n.children).forEach(function(s){s.props.selected=r.multiple?r.defaultValue.indexOf(s.props.value)!=-1:r.defaultValue==s.props.value})),e.props=r}t&&n.class!=n.className&&(Ea.enumerable="className"in n,n.className!=null&&(r.class=n.className),Object.defineProperty(r,"className",Ea)),e.$$typeof=hu,Oa&&Oa(e)};var wa=Y.__r;Y.__r=function(e){wa&&wa(e),gu=e.__c};var pv={ReactCurrentDispatcher:{current:{readContext:function(e){return gu.__n[e.__c].props.value}}}};(typeof performance=="undefined"?"undefined":Qn(performance))=="object"&&typeof performance.now=="function"&&performance.now.bind(performance);function Sa(e){return!!e&&e.$$typeof===hu}var b={useState:function(e){return tn=1,ma(fu,e)},useReducer:ma,useEffect:function(e,t){var n=Zn(pn++,3);!Y.__s&&Ji(n.__H,t)&&(n.__=e,n.__H=t,Me.__H.__h.push(n))},useLayoutEffect:ha,useRef:function(e){return tn=5,Sr(function(){return{current:e}},[])},useImperativeHandle:function(e,t,n){tn=6,ha(function(){typeof e=="function"?e(t()):e&&(e.current=t())},n==null?n:n.concat(e))},useMemo:Sr,useCallback:function(e,t){return tn=8,Sr(function(){return e},t)},useContext:function(e){var t=Me.context[e.__c],n=Zn(pn++,9);return n.__c=e,t?(n.__==null&&(n.__=!0,t.sub(Me)),t.props.value):e.__},useDebugValue:function(e,t){Y.useDebugValue&&Y.useDebugValue(t?t(e):e)},version:"16.8.0",Children:ov,render:vu,hydrate:function(e,t,n){return uu(e,t),typeof n=="function"&&n(),e?e.__c:null},unmountComponentAtNode:function(e){return!!e.__k&&(Gn(null,e),!0)},createPortal:mu,createElement:ot,createContext:function(e,t){var n={__c:t="__cC"+tu++,__:e,Consumer:function(r,o){return r.children(o)},Provider:function(r){var o,i;return this.getChildContext||(o=[],(i={})[t]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(s){this.props.value!==s.value&&o.some(Xo)},this.sub=function(s){o.push(s);var a=s.componentWillUnmount;s.componentWillUnmount=function(){o.splice(o.indexOf(s),1),a&&a.call(s)}}),r.children}};return n.Provider.__=n.Consumer.contextType=n},createFactory:function(e){return ot.bind(null,e)},cloneElement:function(e){return Sa(e)?tv.apply(null,arguments):e},createRef:function(){return{current:null}},Fragment:It,isValidElement:Sa,findDOMNode:function(e){return e&&(e.base||e.nodeType===1&&e)||null},Component:it,PureComponent:ri,memo:function(e,t){function n(o){var i=this.props.ref,s=i==o.ref;return!s&&i&&(i.call?i(null):i.current=null),t?!t(this.props,o)||!s:ni(this.props,o)}function r(o){return this.shouldComponentUpdate=n,ot(e,o)}return r.displayName="Memo("+(e.displayName||e.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r},forwardRef:function(e){function t(n,r){var o=du({},n);return delete o.ref,e(o,(r=n.ref||r)&&(Qn(r)!="object"||"current"in r)?r:null)}return t.$$typeof=rv,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(e.displayName||e.name)+")",t},unstable_batchedUpdates:function(e,t){return e(t)},StrictMode:It,Suspense:Cr,SuspenseList:jn,lazy:function(e){var t,n,r;function o(i){if(t||(t=e()).then(function(s){n=s.default||s},function(s){r=s}),r)throw r;if(!n)throw t;return ot(n,i)}return o.displayName="Lazy",o.__f=!0,o},__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:pv};function mv(){return b.createElement("svg",{width:"15",height:"15",className:"DocSearch-Control-Key-Icon"},b.createElement("path",{d:"M4.505 4.496h2M5.505 5.496v5M8.216 4.496l.055 5.993M10 7.5c.333.333.5.667.5 1v2M12.326 4.5v5.996M8.384 4.496c1.674 0 2.116 0 2.116 1.5s-.442 1.5-2.116 1.5M3.205 9.303c-.09.448-.277 1.21-1.241 1.203C1 10.5.5 9.513.5 8V7c0-1.57.5-2.5 1.464-2.494.964.006 1.134.598 1.24 1.342M12.553 10.5h1.953",strokeWidth:"1.2",stroke:"currentColor",fill:"none",strokeLinecap:"square"}))}function _u(){return b.createElement("svg",{width:"20",height:"20",className:"DocSearch-Search-Icon",viewBox:"0 0 20 20"},b.createElement("path",{d:"M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}var hv=["translations"];function oi(){return oi=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},oi.apply(this,arguments)}function vv(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var gv=b.forwardRef(function(e,t){var n=e.translations,r=n===void 0?{}:n,o=vv(e,hv),i=r.buttonText,s=i===void 0?"Search":i,a=r.buttonAriaLabel,l=a===void 0?"Search":a,c=Sr(function(){return typeof navigator!="undefined"?/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)?"\u2318":"Ctrl":null},[]);return b.createElement("button",oi({type:"button",className:"DocSearch DocSearch-Button","aria-label":l},o,{ref:t}),b.createElement("span",{className:"DocSearch-Button-Container"},b.createElement(_u,null),b.createElement("span",{className:"DocSearch-Button-Placeholder"},s)),b.createElement("span",{className:"DocSearch-Button-Keys"},c!==null&&b.createElement(b.Fragment,null,b.createElement("span",{className:"DocSearch-Button-Key"},c==="Ctrl"?b.createElement(mv,null):c),b.createElement("span",{className:"DocSearch-Button-Key"},"K"))))});function Xn(e){return e.reduce(function(t,n){return t.concat(n)},[])}var _v=0;function ii(e){return e.collections.length===0?0:e.collections.reduce(function(t,n){return t+n.items.length},0)}var yv=function(){},bv=[{segment:"autocomplete-core",version:"1.5.2"}];function Ar(e,t){var n=t;return{then:function(r,o){return Ar(e.then(hr(r,n,e),hr(o,n,e)),n)},catch:function(r){return Ar(e.catch(hr(r,n,e)),n)},finally:function(r){return r&&n.onCancelList.push(r),Ar(e.finally(hr(r&&function(){return n.onCancelList=[],r()},n,e)),n)},cancel:function(){n.isCanceled=!0;var r=n.onCancelList;n.onCancelList=[],r.forEach(function(o){o()})},isCanceled:function(){return n.isCanceled===!0}}}function Pa(e){return Ar(e,{isCanceled:!1,onCancelList:[]})}function hr(e,t,n){return e?function(r){return t.isCanceled?r:e(r)}:n}function Ca(e,t,n,r){if(!n)return null;if(e<0&&(t===null||r!==null&&t===0))return n+e;var o=(t===null?-1:t)+e;return o<=-1||o>=n?r===null?null:0:o}function Aa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Ev(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Ov(e,t){var n=[];return Promise.resolve(e(t)).then(function(r){return Promise.all(r.filter(function(o){return Boolean(o)}).map(function(o){if(o.sourceId,n.includes(o.sourceId))throw new Error("[Autocomplete] The `sourceId` ".concat(JSON.stringify(o.sourceId)," is not unique."));n.push(o.sourceId);var i=function(s){for(var a=1;a<arguments.length;a++){var l=arguments[a]!=null?arguments[a]:{};a%2?Aa(Object(l),!0).forEach(function(c){Ev(s,c,l[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(l)):Aa(Object(l)).forEach(function(c){Object.defineProperty(s,c,Object.getOwnPropertyDescriptor(l,c))})}return s}({getItemInputValue:function(s){return s.state.query},getItemUrl:function(){},onSelect:function(s){(0,s.setIsOpen)(!1)},onActive:yv},o);return Promise.resolve(i)}))})}function nn(e){var t=function(o){var i=o.collections.map(function(s){return s.items.length}).reduce(function(s,a,l){var c=(s[l-1]||0)+a;return s.push(c),s},[]).reduce(function(s,a){return a<=o.activeItemId?s+1:s},0);return o.collections[i]}(e);if(!t)return null;var n=t.items[function(o){for(var i=o.state,s=o.collection,a=!1,l=0,c=0;a===!1;){var u=i.collections[l];if(u===s){a=!0;break}c+=u.items.length,l++}return i.activeItemId-c}({state:e,collection:t})],r=t.source;return{item:n,itemInputValue:r.getItemInputValue({item:n,state:e}),itemUrl:r.getItemUrl({item:n,state:e}),source:r}}function Ia(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function vr(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ia(Object(n),!0).forEach(function(r){wv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ia(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function wv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function xa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Sv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Pv(e,t,n){var r,o=t.initialState;return{getState:function(){return o},dispatch:function(i,s){var a=function(l){for(var c=1;c<arguments.length;c++){var u=arguments[c]!=null?arguments[c]:{};c%2?xa(Object(u),!0).forEach(function(d){Sv(l,d,u[d])}):Object.getOwnPropertyDescriptors?Object.defineProperties(l,Object.getOwnPropertyDescriptors(u)):xa(Object(u)).forEach(function(d){Object.defineProperty(l,d,Object.getOwnPropertyDescriptor(u,d))})}return l}({},o);o=e(o,{type:i,props:t,payload:s}),n({state:o,prevState:a})},pendingRequests:(r=[],{add:function(i){return r.push(i),i.finally(function(){r=r.filter(function(s){return s!==i})})},cancelAll:function(){r.forEach(function(i){return i.cancel()})},isEmpty:function(){return r.length===0}})}}function ja(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function gr(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?ja(Object(n),!0).forEach(function(r){Cv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ja(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Cv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Av(e){return function(t){if(Array.isArray(t))return Po(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return Po(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return Po(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Po(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Ta(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Qt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ta(Object(n),!0).forEach(function(r){Iv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ta(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Iv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function ka(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function _r(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?ka(Object(n),!0).forEach(function(r){yu(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ka(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function yu(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function xv(e){return function(t){if(Array.isArray(t))return Co(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return Co(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return Co(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Co(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Da(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Ra(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Da(Object(n),!0).forEach(function(r){jv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Da(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function jv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function yr(e){return Boolean(e.execute)}function Tv(e,t){return n=e,Boolean(n==null?void 0:n.execute)?Ra(Ra({},e),{},{requests:e.queries.map(function(r){return{query:r,sourceId:t,transformResponse:e.transformResponse}})}):{items:e,sourceId:t};var n}function kv(e){var t=e.reduce(function(n,r){if(!yr(r))return n.push(r),n;var o=r.searchClient,i=r.execute,s=r.requests,a=n.find(function(u){return yr(r)&&yr(u)&&u.searchClient===o&&u.execute===i});if(a){var l;(l=a.items).push.apply(l,xv(s))}else{var c={execute:i,items:s,searchClient:o};n.push(c)}return n},[]).map(function(n){if(!yr(n))return Promise.resolve(n);var r=n,o=r.execute,i=r.items;return o({searchClient:r.searchClient,requests:i})});return Promise.all(t).then(function(n){return Xn(n)})}function Dv(e,t){return t.map(function(n){var r=e.filter(function(a){return a.sourceId===n.sourceId}),o=r.map(function(a){return a.items}),i=r[0].transformResponse,s=i?i(function(a){var l=a.map(function(c){var u;return vr(vr({},c),{},{hits:(u=c.hits)===null||u===void 0?void 0:u.map(function(d){return vr(vr({},d),{},{__autocomplete_indexName:c.index,__autocomplete_queryID:c.queryID})})})});return{results:l,hits:l.map(function(c){return c.hits}).filter(Boolean),facetHits:l.map(function(c){var u;return(u=c.facetHits)===null||u===void 0?void 0:u.map(function(d){return{label:d.value,count:d.count,_highlightResult:{label:{value:d.highlighted}}}})}).filter(Boolean)}}(o)):o;return s.every(Boolean),'The `getItems` function from source "'.concat(n.sourceId,'" must return an array of items but returned ').concat(JSON.stringify(void 0),`.
+
+Did you forget to return items?
+
+See: https://www.algolia.com/doc/ui-libraries/autocomplete/core-concepts/sources/#param-getitems`),{source:n,items:s}})}var Rv=["event","nextState","props","query","refresh","store"];function La(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Pn(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?La(Object(n),!0).forEach(function(r){Lv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):La(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Lv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Nv(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var Na,Ao,br,Cn=null,Ma=(Na=-1,Ao=-1,br=void 0,function(e){var t=++Na;return Promise.resolve(e).then(function(n){return br&&t<Ao?br:(Ao=t,br=n,n)})});function en(e){var t=e.event,n=e.nextState,r=n===void 0?{}:n,o=e.props,i=e.query,s=e.refresh,a=e.store,l=Nv(e,Rv);Cn&&o.environment.clearTimeout(Cn);var c=l.setCollections,u=l.setIsOpen,d=l.setQuery,f=l.setActiveItemId,h=l.setStatus;if(d(i),f(o.defaultActiveItemId),!i&&o.openOnFocus===!1){var p,g=a.getState().collections.map(function(E){return Pn(Pn({},E),{},{items:[]})});h("idle"),c(g),u((p=r.isOpen)!==null&&p!==void 0?p:o.shouldPanelOpen({state:a.getState()}));var v=Pa(Ma(g).then(function(){return Promise.resolve()}));return a.pendingRequests.add(v)}h("loading"),Cn=o.environment.setTimeout(function(){h("stalled")},o.stallThreshold);var _=Pa(Ma(o.getSources(Pn({query:i,refresh:s,state:a.getState()},l)).then(function(E){return Promise.all(E.map(function(S){return Promise.resolve(S.getItems(Pn({query:i,refresh:s,state:a.getState()},l))).then(function(w){return Tv(w,S.sourceId)})})).then(kv).then(function(S){return Dv(S,E)}).then(function(S){return function(w){var I=w.collections,k=w.props,C=w.state,P=I.reduce(function(H,$){return _r(_r({},H),{},yu({},$.source.sourceId,_r(_r({},$.source),{},{getItems:function(){return Xn($.items)}})))},{});return Xn(k.reshape({sources:Object.values(P),sourcesBySourceId:P,state:C})).filter(Boolean).map(function(H){return{source:H,items:H.getItems()}})}({collections:S,props:o,state:a.getState()})})}))).then(function(E){var S;h("idle"),c(E);var w=o.shouldPanelOpen({state:a.getState()});u((S=r.isOpen)!==null&&S!==void 0?S:o.openOnFocus&&!i&&w||w);var I=nn(a.getState());if(a.getState().activeItemId!==null&&I){var k=I.item,C=I.itemInputValue,P=I.itemUrl,H=I.source;H.onActive(Pn({event:t,item:k,itemInputValue:C,itemUrl:P,refresh:s,source:H,state:a.getState()},l))}}).finally(function(){h("idle"),Cn&&o.environment.clearTimeout(Cn)});return a.pendingRequests.add(_)}var Mv=["event","props","refresh","store"];function Ha(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Tt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ha(Object(n),!0).forEach(function(r){Hv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ha(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Hv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Fv(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var zv=["props","refresh","store"],$v=["inputElement","formElement","panelElement"],Bv=["inputElement"],Uv=["inputElement","maxLength"],qv=["item","source"];function Fa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Re(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Fa(Object(n),!0).forEach(function(r){Vv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Fa(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Vv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function An(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Kv(e){var t=e.props,n=e.refresh,r=e.store,o=An(e,zv);return{getEnvironmentProps:function(i){var s=i.inputElement,a=i.formElement,l=i.panelElement;return Re({onTouchStart:function(c){!r.getState().isOpen&&r.pendingRequests.isEmpty()||c.target===s||[a,l].some(function(u){return d=u,f=c.target,d===f||d.contains(f);var d,f})===!1&&(r.dispatch("blur",null),t.debug||r.pendingRequests.cancelAll())},onTouchMove:function(c){r.getState().isOpen!==!1&&s===t.environment.document.activeElement&&c.target!==s&&s.blur()}},An(i,$v))},getRootProps:function(i){return Re({role:"combobox","aria-expanded":r.getState().isOpen,"aria-haspopup":"listbox","aria-owns":r.getState().isOpen?"".concat(t.id,"-list"):void 0,"aria-labelledby":"".concat(t.id,"-label")},i)},getFormProps:function(i){return i.inputElement,Re({action:"",noValidate:!0,role:"search",onSubmit:function(s){var a;s.preventDefault(),t.onSubmit(Re({event:s,refresh:n,state:r.getState()},o)),r.dispatch("submit",null),(a=i.inputElement)===null||a===void 0||a.blur()},onReset:function(s){var a;s.preventDefault(),t.onReset(Re({event:s,refresh:n,state:r.getState()},o)),r.dispatch("reset",null),(a=i.inputElement)===null||a===void 0||a.focus()}},An(i,Bv))},getLabelProps:function(i){return Re({htmlFor:"".concat(t.id,"-input"),id:"".concat(t.id,"-label")},i)},getInputProps:function(i){function s(h){(t.openOnFocus||Boolean(r.getState().query))&&en(Re({event:h,props:t,query:r.getState().completion||r.getState().query,refresh:n,store:r},o)),r.dispatch("focus",null)}var a="ontouchstart"in t.environment,l=i||{},c=(l.inputElement,l.maxLength),u=c===void 0?512:c,d=An(l,Uv),f=nn(r.getState());return Re({"aria-autocomplete":"both","aria-activedescendant":r.getState().isOpen&&r.getState().activeItemId!==null?"".concat(t.id,"-item-").concat(r.getState().activeItemId):void 0,"aria-controls":r.getState().isOpen?"".concat(t.id,"-list"):void 0,"aria-labelledby":"".concat(t.id,"-label"),value:r.getState().completion||r.getState().query,id:"".concat(t.id,"-input"),autoComplete:"off",autoCorrect:"off",autoCapitalize:"off",enterKeyHint:f!=null&&f.itemUrl?"go":"search",spellCheck:"false",autoFocus:t.autoFocus,placeholder:t.placeholder,maxLength:u,type:"search",onChange:function(h){en(Re({event:h,props:t,query:h.currentTarget.value.slice(0,u),refresh:n,store:r},o))},onKeyDown:function(h){(function(p){var g=p.event,v=p.props,_=p.refresh,E=p.store,S=Fv(p,Mv);if(g.key==="ArrowUp"||g.key==="ArrowDown"){var w=function(){var B=v.environment.document.getElementById("".concat(v.id,"-item-").concat(E.getState().activeItemId));B&&(B.scrollIntoViewIfNeeded?B.scrollIntoViewIfNeeded(!1):B.scrollIntoView(!1))},I=function(){var B=nn(E.getState());if(E.getState().activeItemId!==null&&B){var A=B.item,z=B.itemInputValue,Q=B.itemUrl,se=B.source;se.onActive(Tt({event:g,item:A,itemInputValue:z,itemUrl:Q,refresh:_,source:se,state:E.getState()},S))}};g.preventDefault(),E.getState().isOpen===!1&&(v.openOnFocus||Boolean(E.getState().query))?en(Tt({event:g,props:v,query:E.getState().query,refresh:_,store:E},S)).then(function(){E.dispatch(g.key,{nextActiveItemId:v.defaultActiveItemId}),I(),setTimeout(w,0)}):(E.dispatch(g.key,{}),I(),w())}else if(g.key==="Escape")g.preventDefault(),E.dispatch(g.key,null),E.pendingRequests.cancelAll();else if(g.key==="Enter"){if(E.getState().activeItemId===null||E.getState().collections.every(function(B){return B.items.length===0}))return;g.preventDefault();var k=nn(E.getState()),C=k.item,P=k.itemInputValue,H=k.itemUrl,$=k.source;if(g.metaKey||g.ctrlKey)H!==void 0&&($.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:H,refresh:_,source:$,state:E.getState()},S)),v.navigator.navigateNewTab({itemUrl:H,item:C,state:E.getState()}));else if(g.shiftKey)H!==void 0&&($.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:H,refresh:_,source:$,state:E.getState()},S)),v.navigator.navigateNewWindow({itemUrl:H,item:C,state:E.getState()}));else if(!g.altKey){if(H!==void 0)return $.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:H,refresh:_,source:$,state:E.getState()},S)),void v.navigator.navigate({itemUrl:H,item:C,state:E.getState()});en(Tt({event:g,nextState:{isOpen:!1},props:v,query:P,refresh:_,store:E},S)).then(function(){$.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:H,refresh:_,source:$,state:E.getState()},S))})}}})(Re({event:h,props:t,refresh:n,store:r},o))},onFocus:s,onBlur:function(){a||(r.dispatch("blur",null),t.debug||r.pendingRequests.cancelAll())},onClick:function(h){i.inputElement!==t.environment.document.activeElement||r.getState().isOpen||s(h)}},d)},getPanelProps:function(i){return Re({onMouseDown:function(s){s.preventDefault()},onMouseLeave:function(){r.dispatch("mouseleave",null)}},i)},getListProps:function(i){return Re({role:"listbox","aria-labelledby":"".concat(t.id,"-label"),id:"".concat(t.id,"-list")},i)},getItemProps:function(i){var s=i.item,a=i.source,l=An(i,qv);return Re({id:"".concat(t.id,"-item-").concat(s.__autocomplete_id),role:"option","aria-selected":r.getState().activeItemId===s.__autocomplete_id,onMouseMove:function(c){if(s.__autocomplete_id!==r.getState().activeItemId){r.dispatch("mousemove",s.__autocomplete_id);var u=nn(r.getState());if(r.getState().activeItemId!==null&&u){var d=u.item,f=u.itemInputValue,h=u.itemUrl,p=u.source;p.onActive(Re({event:c,item:d,itemInputValue:f,itemUrl:h,refresh:n,source:p,state:r.getState()},o))}}},onMouseDown:function(c){c.preventDefault()},onClick:function(c){var u=a.getItemInputValue({item:s,state:r.getState()}),d=a.getItemUrl({item:s,state:r.getState()});(d?Promise.resolve():en(Re({event:c,nextState:{isOpen:!1},props:t,query:u,refresh:n,store:r},o))).then(function(){a.onSelect(Re({event:c,item:s,itemInputValue:u,itemUrl:d,refresh:n,source:a,state:r.getState()},o))})}},l)}}}function za(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Wv(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?za(Object(n),!0).forEach(function(r){bu(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):za(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function bu(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Jv(e){var t,n,r,o,i=e.plugins,s=e.options,a=(t=(((n=s.__autocomplete_metadata)===null||n===void 0?void 0:n.userAgents)||[])[0])===null||t===void 0?void 0:t.segment,l=a?bu({},a,Object.keys(((r=s.__autocomplete_metadata)===null||r===void 0?void 0:r.options)||{})):{};return{plugins:i.map(function(c){return{name:c.name,options:Object.keys(c.__autocomplete_pluginOptions||[])}}),options:Wv({"autocomplete-core":Object.keys(s)},l),ua:bv.concat(((o=s.__autocomplete_metadata)===null||o===void 0?void 0:o.userAgents)||[])}}function $a(e){var t,n=e.state;return n.isOpen===!1||n.activeItemId===null?null:((t=nn(n))===null||t===void 0?void 0:t.itemInputValue)||null}function Ba(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function ae(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ba(Object(n),!0).forEach(function(r){Qv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ba(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Qv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var Yv=function(e,t){switch(t.type){case"setActiveItemId":case"mousemove":return ae(ae({},e),{},{activeItemId:t.payload});case"setQuery":return ae(ae({},e),{},{query:t.payload,completion:null});case"setCollections":return ae(ae({},e),{},{collections:t.payload});case"setIsOpen":return ae(ae({},e),{},{isOpen:t.payload});case"setStatus":return ae(ae({},e),{},{status:t.payload});case"setContext":return ae(ae({},e),{},{context:ae(ae({},e.context),t.payload)});case"ArrowDown":var n=ae(ae({},e),{},{activeItemId:t.payload.hasOwnProperty("nextActiveItemId")?t.payload.nextActiveItemId:Ca(1,e.activeItemId,ii(e),t.props.defaultActiveItemId)});return ae(ae({},n),{},{completion:$a({state:n})});case"ArrowUp":var r=ae(ae({},e),{},{activeItemId:Ca(-1,e.activeItemId,ii(e),t.props.defaultActiveItemId)});return ae(ae({},r),{},{completion:$a({state:r})});case"Escape":return e.isOpen?ae(ae({},e),{},{activeItemId:null,isOpen:!1,completion:null}):ae(ae({},e),{},{activeItemId:null,query:"",status:"idle",collections:[]});case"submit":return ae(ae({},e),{},{activeItemId:null,isOpen:!1,status:"idle"});case"reset":return ae(ae({},e),{},{activeItemId:t.props.openOnFocus===!0?t.props.defaultActiveItemId:null,status:"idle",query:""});case"focus":return ae(ae({},e),{},{activeItemId:t.props.defaultActiveItemId,isOpen:(t.props.openOnFocus||Boolean(e.query))&&t.props.shouldPanelOpen({state:e})});case"blur":return t.props.debug?e:ae(ae({},e),{},{isOpen:!1,activeItemId:null});case"mouseleave":return ae(ae({},e),{},{activeItemId:t.props.defaultActiveItemId});default:return"The reducer action ".concat(JSON.stringify(t.type)," is not supported."),e}};function Ua(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function kt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ua(Object(n),!0).forEach(function(r){Gv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ua(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Gv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Zv(e){var t=[],n=function(a,l){var c,u=typeof window!="undefined"?window:{},d=a.plugins||[];return Qt(Qt({debug:!1,openOnFocus:!1,placeholder:"",autoFocus:!1,defaultActiveItemId:null,stallThreshold:300,environment:u,shouldPanelOpen:function(f){return ii(f.state)>0},reshape:function(f){return f.sources}},a),{},{id:(c=a.id)!==null&&c!==void 0?c:"autocomplete-".concat(_v++),plugins:d,initialState:Qt({activeItemId:null,query:"",completion:null,collections:[],isOpen:!1,status:"idle",context:{}},a.initialState),onStateChange:function(f){var h;(h=a.onStateChange)===null||h===void 0||h.call(a,f),d.forEach(function(p){var g;return(g=p.onStateChange)===null||g===void 0?void 0:g.call(p,f)})},onSubmit:function(f){var h;(h=a.onSubmit)===null||h===void 0||h.call(a,f),d.forEach(function(p){var g;return(g=p.onSubmit)===null||g===void 0?void 0:g.call(p,f)})},onReset:function(f){var h;(h=a.onReset)===null||h===void 0||h.call(a,f),d.forEach(function(p){var g;return(g=p.onReset)===null||g===void 0?void 0:g.call(p,f)})},getSources:function(f){return Promise.all([].concat(Av(d.map(function(h){return h.getSources})),[a.getSources]).filter(Boolean).map(function(h){return Ov(h,f)})).then(function(h){return Xn(h)}).then(function(h){return h.map(function(p){return Qt(Qt({},p),{},{onSelect:function(g){p.onSelect(g),l.forEach(function(v){var _;return(_=v.onSelect)===null||_===void 0?void 0:_.call(v,g)})},onActive:function(g){p.onActive(g),l.forEach(function(v){var _;return(_=v.onActive)===null||_===void 0?void 0:_.call(v,g)})}})})})},navigator:Qt({navigate:function(f){var h=f.itemUrl;u.location.assign(h)},navigateNewTab:function(f){var h=f.itemUrl,p=u.open(h,"_blank","noopener");p==null||p.focus()},navigateNewWindow:function(f){var h=f.itemUrl;u.open(h,"_blank","noopener")}},a.navigator)})}(e,t),r=Pv(Yv,n,function(a){var l=a.prevState,c=a.state;n.onStateChange(kt({prevState:l,state:c,refresh:s},o))}),o=function(a){var l=a.store;return{setActiveItemId:function(c){l.dispatch("setActiveItemId",c)},setQuery:function(c){l.dispatch("setQuery",c)},setCollections:function(c){var u=0,d=c.map(function(f){return gr(gr({},f),{},{items:Xn(f.items).map(function(h){return gr(gr({},h),{},{__autocomplete_id:u++})})})});l.dispatch("setCollections",d)},setIsOpen:function(c){l.dispatch("setIsOpen",c)},setStatus:function(c){l.dispatch("setStatus",c)},setContext:function(c){l.dispatch("setContext",c)}}}({store:r}),i=Kv(kt({props:n,refresh:s,store:r},o));function s(){return en(kt({event:new Event("input"),nextState:{isOpen:r.getState().isOpen},props:n,query:r.getState().query,refresh:s,store:r},o))}return n.plugins.forEach(function(a){var l;return(l=a.subscribe)===null||l===void 0?void 0:l.call(a,kt(kt({},o),{},{refresh:s,onSelect:function(c){t.push({onSelect:c})},onActive:function(c){t.push({onActive:c})}}))}),function(a){var l,c=a.metadata,u=a.environment;if(!((l=u.navigator)===null||l===void 0)&&l.userAgent.includes("Algolia Crawler")){var d=u.document.createElement("meta"),f=u.document.querySelector("head");d.name="algolia:metadata",setTimeout(function(){d.content=JSON.stringify(c),f.appendChild(d)},0)}}({metadata:Jv({plugins:n.plugins,options:e}),environment:n.environment}),kt(kt({refresh:s},i),o)}function Xv(e){var t=e.translations,n=(t===void 0?{}:t).searchByText,r=n===void 0?"Search by":n;return b.createElement("a",{href:"https://www.algolia.com/ref/docsearch/?utm_source=".concat(window.location.hostname,"&utm_medium=referral&utm_content=powered_by&utm_campaign=docsearch"),target:"_blank",rel:"noopener noreferrer"},b.createElement("span",{className:"DocSearch-Label"},r),b.createElement("svg",{width:"77",height:"19","aria-label":"Algolia",role:"img"},b.createElement("path",{d:"M2.5067 0h14.0245c1.384.001 2.5058 1.1205 2.5068 2.5017V16.5c-.0014 1.3808-1.1232 2.4995-2.5068 2.5H2.5067C1.1232 18.9995.0014 17.8808 0 16.5V2.4958A2.495 2.495 0 01.735.7294 2.505 2.505 0 012.5068 0zM37.95 15.0695c-3.7068.0168-3.7068-2.986-3.7068-3.4634L34.2372.3576 36.498 0v11.1794c0 .2715 0 1.9889 1.452 1.994v1.8961zm-9.1666-1.8388c.694 0 1.2086-.0397 1.5678-.1088v-2.2934a5.3639 5.3639 0 00-1.3303-.1679 4.8283 4.8283 0 00-.758.0582 2.2845 2.2845 0 00-.688.2024c-.2029.0979-.371.2362-.4919.4142-.1268.1788-.185.2826-.185.5533 0 .5297.185.8359.5205 1.0375.3355.2016.7928.3053 1.365.3053v-.0008zm-.1969-8.1817c.7463 0 1.3768.092 1.8856.2767.5088.1838.9195.4428 1.2204.7717.3068.334.5147.7777.6423 1.251.1327.4723.196.991.196 1.5603v5.798c-.5235.1036-1.05.192-1.5787.2649-.7048.1037-1.4976.156-2.3774.156-.5832 0-1.1215-.0582-1.6016-.167a3.385 3.385 0 01-1.2432-.5364 2.6034 2.6034 0 01-.8037-.9565c-.191-.3922-.29-.9447-.29-1.5208 0-.5533.11-.905.3246-1.2863a2.7351 2.7351 0 01.8849-.9329c.376-.242.8029-.415 1.2948-.5187a7.4517 7.4517 0 011.5381-.156 7.1162 7.1162 0 011.6667.2024V8.886c0-.259-.0296-.5061-.093-.7372a1.5847 1.5847 0 00-.3245-.6158 1.5079 1.5079 0 00-.6119-.4158 2.6788 2.6788 0 00-.966-.173c-.5206 0-.9948.0634-1.4283.1384a6.5481 6.5481 0 00-1.065.259l-.2712-1.849c.2831-.0986.7048-.1964 1.2491-.2943a9.2979 9.2979 0 011.752-.1501v.0008zm44.6597 8.1193c.6947 0 1.2086-.0405 1.567-.1097v-2.2942a5.3743 5.3743 0 00-1.3303-.1679c-.2485 0-.503.0177-.7573.0582a2.2853 2.2853 0 00-.688.2024 1.2333 1.2333 0 00-.4918.4142c-.1268.1788-.1843.2826-.1843.5533 0 .5297.1843.8359.5198 1.0375.3414.2066.7927.3053 1.365.3053v.0009zm-.191-8.1767c.7463 0 1.3768.0912 1.8856.2759.5087.1847.9195.4436 1.2204.7717.3.329.5147.7786.6414 1.251a5.7248 5.7248 0 01.197 1.562v5.7972c-.3466.0742-.874.1602-1.5788.2648-.7049.1038-1.4976.1552-2.3774.1552-.5832 0-1.1215-.0573-1.6016-.167a3.385 3.385 0 01-1.2432-.5356 2.6034 2.6034 0 01-.8038-.9565c-.191-.3922-.2898-.9447-.2898-1.5216 0-.5533.1098-.905.3245-1.2854a2.7373 2.7373 0 01.8849-.9338c.376-.2412.8029-.4141 1.2947-.5178a7.4545 7.4545 0 012.325-.1097c.2781.0287.5672.081.879.156v-.3686a2.7781 2.7781 0 00-.092-.738 1.5788 1.5788 0 00-.3246-.6166 1.5079 1.5079 0 00-.612-.415 2.6797 2.6797 0 00-.966-.1729c-.5205 0-.9947.0633-1.4282.1384a6.5608 6.5608 0 00-1.065.259l-.2712-1.8498c.283-.0979.7048-.1957 1.2491-.2935a9.8597 9.8597 0 011.752-.1494zm-6.79-1.072c-.7576.001-1.373-.6103-1.3759-1.3664 0-.755.6128-1.3664 1.376-1.3664.764 0 1.3775.6115 1.3775 1.3664s-.6195 1.3664-1.3776 1.3664zm1.1393 11.1507h-2.2726V5.3409l2.2734-.3568v10.0845l-.0008.0017zm-3.984 0c-3.707.0168-3.707-2.986-3.707-3.4642L59.7069.3576 61.9685 0v11.1794c0 .2715 0 1.9889 1.452 1.994V15.0703zm-7.3512-4.979c0-.975-.2138-1.7873-.6305-2.3516-.4167-.571-.9998-.852-1.747-.852-.7454 0-1.3302.281-1.7452.852-.4166.5702-.6195 1.3765-.6195 2.3516 0 .9851.208 1.6473.6254 2.2183.4158.576.9998.8587 1.7461.8587.7454 0 1.3303-.2885 1.747-.8595.4158-.5761.6237-1.2315.6237-2.2184v.0009zm2.3132-.006c0 .7609-.1099 1.3361-.3356 1.9654a4.654 4.654 0 01-.9533 1.6076A4.214 4.214 0 0155.613 14.69c-.579.2412-1.4697.3795-1.9143.3795-.4462-.005-1.3303-.1324-1.9033-.3795a4.307 4.307 0 01-1.474-1.0316c-.4115-.4445-.7293-.9801-.9609-1.6076a5.3423 5.3423 0 01-.3465-1.9653c0-.7608.104-1.493.3356-2.1155a4.683 4.683 0 01.9719-1.5958 4.3383 4.3383 0 011.479-1.0257c.5739-.242 1.2043-.3567 1.8864-.3567.6829 0 1.3125.1197 1.8906.3567a4.1245 4.1245 0 011.4816 1.0257 4.7587 4.7587 0 01.9592 1.5958c.2426.6225.3643 1.3547.3643 2.1155zm-17.0198 0c0 .9448.208 1.9932.6238 2.431.4166.4386.955.6579 1.6142.6579.3584 0 .6998-.0523 1.0176-.1502.3186-.0978.5721-.2134.775-.3517V7.0784a8.8706 8.8706 0 00-1.4926-.1906c-.8206-.0236-1.4452.312-1.8847.8468-.4335.5365-.6533 1.476-.6533 2.3516v-.0008zm6.2863 4.4485c0 1.5385-.3938 2.662-1.1866 3.3773-.791.7136-2.0005 1.0712-3.6308 1.0712-.5958 0-1.834-.1156-2.8228-.334l.3643-1.7865c.8282.173 1.9202.2193 2.4932.2193.9077 0 1.555-.1847 1.943-.5533.388-.3686.578-.916.578-1.643v-.3687a6.8289 6.8289 0 01-.8848.3349c-.3634.1096-.786.167-1.261.167-.6246 0-1.1917-.0979-1.7055-.2944a3.5554 3.5554 0 01-1.3244-.8645c-.3642-.3796-.6541-.8579-.8561-1.4289-.2028-.571-.3068-1.59-.3068-2.339 0-.7034.1099-1.5856.3245-2.1735.2198-.5871.5316-1.0949.9542-1.515.4167-.42.9255-.743 1.5213-.98a5.5923 5.5923 0 012.052-.3855c.7353 0 1.4114.092 2.0707.2024.6592.1088 1.2204.2236 1.6776.35v8.945-.0008zM11.5026 4.2418v-.6511c-.0005-.4553-.3704-.8241-.8266-.8241H8.749c-.4561 0-.826.3688-.8265.824v.669c0 .0742.0693.1264.1445.1096a6.0346 6.0346 0 011.6768-.2362 6.125 6.125 0 011.6202.2185.1116.1116 0 00.1386-.1097zm-5.2806.852l-.3296-.3282a.8266.8266 0 00-1.168 0l-.393.3922a.8199.8199 0 000 1.164l.3237.323c.0524.0515.1268.0397.1733-.0117.191-.259.3989-.507.6305-.7372.2374-.2362.48-.4437.7462-.6335.0575-.0354.0634-.1155.017-.1687zm3.5159 2.069v2.818c0 .081.0879.1392.1622.0987l2.5102-1.2964c.0574-.0287.0752-.0987.0464-.1552a3.1237 3.1237 0 00-2.603-1.574c-.0575 0-.115.0456-.115.1097l-.0008-.0009zm.0008 6.789c-2.0933.0005-3.7915-1.6912-3.7947-3.7804C5.9468 8.0821 7.6452 6.39 9.7387 6.391c2.0932-.0005 3.7911 1.6914 3.794 3.7804a3.7783 3.7783 0 01-1.1124 2.675 3.7936 3.7936 0 01-2.6824 1.1054h.0008zM9.738 4.8002c-1.9218 0-3.6975 1.0232-4.6584 2.6841a5.359 5.359 0 000 5.3683c.9609 1.661 2.7366 2.6841 4.6584 2.6841a5.3891 5.3891 0 003.8073-1.5725 5.3675 5.3675 0 001.578-3.7987 5.3574 5.3574 0 00-1.5771-3.797A5.379 5.379 0 009.7387 4.801l-.0008-.0008z",fill:"currentColor",fillRule:"evenodd"})))}function Er(e){return b.createElement("svg",{width:"15",height:"15","aria-label":e.ariaLabel,role:"img"},b.createElement("g",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.2"},e.children))}function eg(e){var t=e.translations,n=t===void 0?{}:t,r=n.selectText,o=r===void 0?"to select":r,i=n.selectKeyAriaLabel,s=i===void 0?"Enter key":i,a=n.navigateText,l=a===void 0?"to navigate":a,c=n.navigateUpKeyAriaLabel,u=c===void 0?"Arrow up":c,d=n.navigateDownKeyAriaLabel,f=d===void 0?"Arrow down":d,h=n.closeText,p=h===void 0?"to close":h,g=n.closeKeyAriaLabel,v=g===void 0?"Escape key":g,_=n.searchByText,E=_===void 0?"Search by":_;return b.createElement(b.Fragment,null,b.createElement("div",{className:"DocSearch-Logo"},b.createElement(Xv,{translations:{searchByText:E}})),b.createElement("ul",{className:"DocSearch-Commands"},b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(Er,{ariaLabel:s},b.createElement("path",{d:"M12 3.53088v3c0 1-1 2-2 2H4M7 11.53088l-3-3 3-3"}))),b.createElement("span",{className:"DocSearch-Label"},o)),b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(Er,{ariaLabel:f},b.createElement("path",{d:"M7.5 3.5v8M10.5 8.5l-3 3-3-3"}))),b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(Er,{ariaLabel:u},b.createElement("path",{d:"M7.5 11.5v-8M10.5 6.5l-3-3-3 3"}))),b.createElement("span",{className:"DocSearch-Label"},l)),b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(Er,{ariaLabel:v},b.createElement("path",{d:"M13.6167 8.936c-.1065.3583-.6883.962-1.4875.962-.7993 0-1.653-.9165-1.653-2.1258v-.5678c0-1.2548.7896-2.1016 1.653-2.1016.8634 0 1.3601.4778 1.4875 1.0724M9 6c-.1352-.4735-.7506-.9219-1.46-.8972-.7092.0246-1.344.57-1.344 1.2166s.4198.8812 1.3445.9805C8.465 7.3992 8.968 7.9337 9 8.5c.032.5663-.454 1.398-1.4595 1.398C6.6593 9.898 6 9 5.963 8.4851m-1.4748.5368c-.2635.5941-.8099.876-1.5443.876s-1.7073-.6248-1.7073-2.204v-.4603c0-1.0416.721-2.131 1.7073-2.131.9864 0 1.6425 1.031 1.5443 2.2492h-2.956"}))),b.createElement("span",{className:"DocSearch-Label"},p))))}function tg(e){var t=e.hit,n=e.children;return b.createElement("a",{href:t.url},n)}function ng(){return b.createElement("svg",{viewBox:"0 0 38 38",stroke:"currentColor",strokeOpacity:".5"},b.createElement("g",{fill:"none",fillRule:"evenodd"},b.createElement("g",{transform:"translate(1 1)",strokeWidth:"2"},b.createElement("circle",{strokeOpacity:".3",cx:"18",cy:"18",r:"18"}),b.createElement("path",{d:"M36 18c0-9.94-8.06-18-18-18"},b.createElement("animateTransform",{attributeName:"transform",type:"rotate",from:"0 18 18",to:"360 18 18",dur:"1s",repeatCount:"indefinite"})))))}function rg(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M3.18 6.6a8.23 8.23 0 1112.93 9.94h0a8.23 8.23 0 01-11.63 0"}),b.createElement("path",{d:"M6.44 7.25H2.55V3.36M10.45 6v5.6M10.45 11.6L13 13"})))}function si(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M10 10l5.09-5.09L10 10l5.09 5.09L10 10zm0 0L4.91 4.91 10 10l-5.09 5.09L10 10z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}function og(){return b.createElement("svg",{className:"DocSearch-Hit-Select-Icon",width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M18 3v4c0 2-2 4-4 4H2"}),b.createElement("path",{d:"M8 17l-6-6 6-6"})))}var ig=function(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M17 6v12c0 .52-.2 1-1 1H4c-.7 0-1-.33-1-1V2c0-.55.42-1 1-1h8l5 5zM14 8h-3.13c-.51 0-.87-.34-.87-.87V4",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))};function sg(e){switch(e.type){case"lvl1":return b.createElement(ig,null);case"content":return b.createElement(lg,null);default:return b.createElement(ag,null)}}function ag(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M13 13h4-4V8H7v5h6v4-4H7V8H3h4V3v5h6V3v5h4-4v5zm-6 0v4-4H3h4z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}function lg(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M17 5H3h14zm0 5H3h14zm0 5H3h14z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))}function qa(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M10 14.2L5 17l1-5.6-4-4 5.5-.7 2.5-5 2.5 5 5.6.8-4 4 .9 5.5z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))}function cg(){return b.createElement("svg",{width:"40",height:"40",viewBox:"0 0 20 20",fill:"none",fillRule:"evenodd",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M19 4.8a16 16 0 00-2-1.2m-3.3-1.2A16 16 0 001.1 4.7M16.7 8a12 12 0 00-2.8-1.4M10 6a12 12 0 00-6.7 2M12.3 14.7a4 4 0 00-4.5 0M14.5 11.4A8 8 0 0010 10M3 16L18 2M10 18h0"}))}function ug(){return b.createElement("svg",{width:"40",height:"40",viewBox:"0 0 20 20",fill:"none",fillRule:"evenodd",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M15.5 4.8c2 3 1.7 7-1 9.7h0l4.3 4.3-4.3-4.3a7.8 7.8 0 01-9.8 1m-2.2-2.2A7.8 7.8 0 0113.2 2.4M2 18L18 2"}))}function fg(e){var t=e.translations,n=t===void 0?{}:t,r=n.titleText,o=r===void 0?"Unable to fetch results":r,i=n.helpText,s=i===void 0?"You might want to check your network connection.":i;return b.createElement("div",{className:"DocSearch-ErrorScreen"},b.createElement("div",{className:"DocSearch-Screen-Icon"},b.createElement(cg,null)),b.createElement("p",{className:"DocSearch-Title"},o),b.createElement("p",{className:"DocSearch-Help"},s))}var dg=["translations"];function pg(e){return function(t){if(Array.isArray(t))return Io(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return Io(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return Io(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Io(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function mg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function hg(e){var t=e.translations,n=t===void 0?{}:t,r=mg(e,dg),o=n.noResultsText,i=o===void 0?"No results for":o,s=n.suggestedQueryText,a=s===void 0?"Try searching for":s,l=n.reportMissingResultsText,c=l===void 0?"Believe this query should return results?":l,u=n.reportMissingResultsLinkText,d=u===void 0?"Let us know.":u,f=r.state.context.searchSuggestions;return b.createElement("div",{className:"DocSearch-NoResults"},b.createElement("div",{className:"DocSearch-Screen-Icon"},b.createElement(ug,null)),b.createElement("p",{className:"DocSearch-Title"},i,' "',b.createElement("strong",null,r.state.query),'"'),f&&f.length>0&&b.createElement("div",{className:"DocSearch-NoResults-Prefill-List"},b.createElement("p",{className:"DocSearch-Help"},a,":"),b.createElement("ul",null,f.slice(0,3).reduce(function(h,p){return[].concat(pg(h),[b.createElement("li",{key:p},b.createElement("button",{className:"DocSearch-Prefill",key:p,type:"button",onClick:function(){r.setQuery(p.toLowerCase()+" "),r.refresh(),r.inputRef.current.focus()}},p))])},[]))),r.getMissingResultsUrl&&b.createElement("p",{className:"DocSearch-Help"},"".concat(c," "),b.createElement("a",{href:r.getMissingResultsUrl({query:r.state.query}),target:"_blank",rel:"noopener noreferrer"},d)))}var vg=["hit","attribute","tagName"];function Va(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Ka(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Va(Object(n),!0).forEach(function(r){gg(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Va(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function gg(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function _g(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Wa(e,t){return t.split(".").reduce(function(n,r){return n!=null&&n[r]?n[r]:null},e)}function Yt(e){var t=e.hit,n=e.attribute,r=e.tagName;return ot(r===void 0?"span":r,Ka(Ka({},_g(e,vg)),{},{dangerouslySetInnerHTML:{__html:Wa(t,"_snippetResult.".concat(n,".value"))||Wa(t,n)}}))}function Ja(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){var o=n==null?null:typeof Symbol!="undefined"&&n[Symbol.iterator]||n["@@iterator"];if(o!=null){var i,s,a=[],l=!0,c=!1;try{for(o=o.call(n);!(l=(i=o.next()).done)&&(a.push(i.value),!r||a.length!==r);l=!0);}catch(u){c=!0,s=u}finally{try{l||o.return==null||o.return()}finally{if(c)throw s}}return a}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return Qa(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return Qa(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Qa(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Jr(){return Jr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Jr.apply(this,arguments)}function ai(e){return e.collection&&e.collection.items.length!==0?b.createElement("section",{className:"DocSearch-Hits"},b.createElement("div",{className:"DocSearch-Hit-source"},e.title),b.createElement("ul",e.getListProps(),e.collection.items.map(function(t,n){return b.createElement(yg,Jr({key:[e.title,t.objectID].join(":"),item:t,index:n},e))}))):null}function yg(e){var t=e.item,n=e.index,r=e.renderIcon,o=e.renderAction,i=e.getItemProps,s=e.onItemClick,a=e.collection,l=e.hitComponent,c=Ja(b.useState(!1),2),u=c[0],d=c[1],f=Ja(b.useState(!1),2),h=f[0],p=f[1],g=b.useRef(null),v=l;return b.createElement("li",Jr({className:["DocSearch-Hit",t.__docsearch_parent&&"DocSearch-Hit--Child",u&&"DocSearch-Hit--deleting",h&&"DocSearch-Hit--favoriting"].filter(Boolean).join(" "),onTransitionEnd:function(){g.current&&g.current()}},i({item:t,source:a.source,onClick:function(){s(t)}})),b.createElement(v,{hit:t},b.createElement("div",{className:"DocSearch-Hit-Container"},r({item:t,index:n}),t.hierarchy[t.type]&&t.type==="lvl1"&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"hierarchy.lvl1"}),t.content&&b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"content"})),t.hierarchy[t.type]&&(t.type==="lvl2"||t.type==="lvl3"||t.type==="lvl4"||t.type==="lvl5"||t.type==="lvl6")&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"hierarchy.".concat(t.type)}),b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"hierarchy.lvl1"})),t.type==="content"&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"content"}),b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"hierarchy.lvl1"})),o({item:t,runDeleteTransition:function(_){d(!0),g.current=_},runFavoriteTransition:function(_){p(!0),g.current=_}}))))}function Ya(e,t){return e.reduce(function(n,r){var o=t(r);return n.hasOwnProperty(o)||(n[o]=[]),n[o].length<5&&n[o].push(r),n},{})}function Ga(e){return e}function bg(){}var Eu=/(<mark>|<\/mark>)/g,Eg=RegExp(Eu.source);function Ou(e){var t,n,r,o,i,s=e;if(!s.__docsearch_parent&&!e._highlightResult)return e.hierarchy.lvl0;var a=((s.__docsearch_parent?(t=s.__docsearch_parent)===null||t===void 0||(n=t._highlightResult)===null||n===void 0||(r=n.hierarchy)===null||r===void 0?void 0:r.lvl0:(o=e._highlightResult)===null||o===void 0||(i=o.hierarchy)===null||i===void 0?void 0:i.lvl0)||{}).value;return a&&Eg.test(a)?a.replace(Eu,""):a}function li(){return li=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},li.apply(this,arguments)}function Og(e){return b.createElement("div",{className:"DocSearch-Dropdown-Container"},e.state.collections.map(function(t){if(t.items.length===0)return null;var n=Ou(t.items[0]);return b.createElement(ai,li({},e,{key:t.source.sourceId,title:n,collection:t,renderIcon:function(r){var o,i=r.item,s=r.index;return b.createElement(b.Fragment,null,i.__docsearch_parent&&b.createElement("svg",{className:"DocSearch-Hit-Tree",viewBox:"0 0 24 54"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},i.__docsearch_parent!==((o=t.items[s+1])===null||o===void 0?void 0:o.__docsearch_parent)?b.createElement("path",{d:"M8 6v21M20 27H8.3"}):b.createElement("path",{d:"M8 6v42M20 27H8.3"}))),b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(sg,{type:i.type})))},renderAction:function(){return b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement(og,null))}}))}),e.resultsFooterComponent&&b.createElement("section",{className:"DocSearch-HitsFooter"},b.createElement(e.resultsFooterComponent,{state:e.state})))}var wg=["translations"];function Qr(){return Qr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Qr.apply(this,arguments)}function Sg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Pg(e){var t=e.translations,n=t===void 0?{}:t,r=Sg(e,wg),o=n.recentSearchesTitle,i=o===void 0?"Recent":o,s=n.noRecentSearchesText,a=s===void 0?"No recent searches":s,l=n.saveRecentSearchButtonTitle,c=l===void 0?"Save this search":l,u=n.removeRecentSearchButtonTitle,d=u===void 0?"Remove this search from history":u,f=n.favoriteSearchesTitle,h=f===void 0?"Favorite":f,p=n.removeFavoriteSearchButtonTitle,g=p===void 0?"Remove this search from favorites":p;return r.state.status==="idle"&&r.hasCollections===!1?r.disableUserPersonalization?null:b.createElement("div",{className:"DocSearch-StartScreen"},b.createElement("p",{className:"DocSearch-Help"},a)):r.hasCollections===!1?null:b.createElement("div",{className:"DocSearch-Dropdown-Container"},b.createElement(ai,Qr({},r,{title:i,collection:r.state.collections[0],renderIcon:function(){return b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(rg,null))},renderAction:function(v){var _=v.item,E=v.runFavoriteTransition,S=v.runDeleteTransition;return b.createElement(b.Fragment,null,b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:c,type:"submit",onClick:function(w){w.preventDefault(),w.stopPropagation(),E(function(){r.favoriteSearches.add(_),r.recentSearches.remove(_),r.refresh()})}},b.createElement(qa,null))),b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:d,type:"submit",onClick:function(w){w.preventDefault(),w.stopPropagation(),S(function(){r.recentSearches.remove(_),r.refresh()})}},b.createElement(si,null))))}})),b.createElement(ai,Qr({},r,{title:h,collection:r.state.collections[1],renderIcon:function(){return b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(qa,null))},renderAction:function(v){var _=v.item,E=v.runDeleteTransition;return b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:g,type:"submit",onClick:function(S){S.preventDefault(),S.stopPropagation(),E(function(){r.favoriteSearches.remove(_),r.refresh()})}},b.createElement(si,null)))}})))}var Cg=["translations"];function Yr(){return Yr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Yr.apply(this,arguments)}function Ag(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var Ig=b.memo(function(e){var t=e.translations,n=t===void 0?{}:t,r=Ag(e,Cg);if(r.state.status==="error")return b.createElement(fg,{translations:n==null?void 0:n.errorScreen});var o=r.state.collections.some(function(i){return i.items.length>0});return r.state.query?o===!1?b.createElement(hg,Yr({},r,{translations:n==null?void 0:n.noResultsScreen})):b.createElement(Og,r):b.createElement(Pg,Yr({},r,{hasCollections:o,translations:n==null?void 0:n.startScreen}))},function(e,t){return t.state.status==="loading"||t.state.status==="stalled"}),xg=["translations"];function Gr(){return Gr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Gr.apply(this,arguments)}function jg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Tg(e){var t=e.translations,n=t===void 0?{}:t,r=jg(e,xg),o=n.resetButtonTitle,i=o===void 0?"Clear the query":o,s=n.resetButtonAriaLabel,a=s===void 0?"Clear the query":s,l=n.cancelButtonText,c=l===void 0?"Cancel":l,u=n.cancelButtonAriaLabel,d=u===void 0?"Cancel":u,f=r.getFormProps({inputElement:r.inputRef.current}).onReset;return b.useEffect(function(){r.autoFocus&&r.inputRef.current&&r.inputRef.current.focus()},[r.autoFocus,r.inputRef]),b.useEffect(function(){r.isFromSelection&&r.inputRef.current&&r.inputRef.current.select()},[r.isFromSelection,r.inputRef]),b.createElement(b.Fragment,null,b.createElement("form",{className:"DocSearch-Form",onSubmit:function(h){h.preventDefault()},onReset:f},b.createElement("label",Gr({className:"DocSearch-MagnifierLabel"},r.getLabelProps()),b.createElement(_u,null)),b.createElement("div",{className:"DocSearch-LoadingIndicator"},b.createElement(ng,null)),b.createElement("input",Gr({className:"DocSearch-Input",ref:r.inputRef},r.getInputProps({inputElement:r.inputRef.current,autoFocus:r.autoFocus,maxLength:64}))),b.createElement("button",{type:"reset",title:i,className:"DocSearch-Reset","aria-label":a,hidden:!r.state.query},b.createElement(si,null))),b.createElement("button",{className:"DocSearch-Cancel",type:"reset","aria-label":d,onClick:r.onClose},c))}var kg=["_highlightResult","_snippetResult"];function Dg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Rg(e){return function(){var t="__TEST_KEY__";try{return localStorage.setItem(t,""),localStorage.removeItem(t),!0}catch{return!1}}()===!1?{setItem:function(){},getItem:function(){return[]}}:{setItem:function(t){return window.localStorage.setItem(e,JSON.stringify(t))},getItem:function(){var t=window.localStorage.getItem(e);return t?JSON.parse(t):[]}}}function Za(e){var t=e.key,n=e.limit,r=n===void 0?5:n,o=Rg(t),i=o.getItem().slice(0,r);return{add:function(s){var a=s,l=(a._highlightResult,a._snippetResult,Dg(a,kg)),c=i.findIndex(function(u){return u.objectID===l.objectID});c>-1&&i.splice(c,1),i.unshift(l),i=i.slice(0,r),o.setItem(i)},remove:function(s){i=i.filter(function(a){return a.objectID!==s.objectID}),o.setItem(i)},getAll:function(){return i}}}var Lg=["facetName","facetQuery"];function Ng(e){var t,n="algoliasearch-client-js-".concat(e.key),r=function(){return t===void 0&&(t=e.localStorage||window.localStorage),t},o=function(){return JSON.parse(r().getItem(n)||"{}")};return{get:function(i,s){var a=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return Promise.resolve().then(function(){var l=JSON.stringify(i),c=o()[l];return Promise.all([c||s(),c!==void 0])}).then(function(l){var c=qr(l,2),u=c[0],d=c[1];return Promise.all([u,d||a.miss(u)])}).then(function(l){return qr(l,1)[0]})},set:function(i,s){return Promise.resolve().then(function(){var a=o();return a[JSON.stringify(i)]=s,r().setItem(n,JSON.stringify(a)),s})},delete:function(i){return Promise.resolve().then(function(){var s=o();delete s[JSON.stringify(i)],r().setItem(n,JSON.stringify(s))})},clear:function(){return Promise.resolve().then(function(){r().removeItem(n)})}}}function Tn(e){var t=Vr(e.caches),n=t.shift();return n===void 0?{get:function(r,o){var i=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return o().then(function(s){return Promise.all([s,i.miss(s)])}).then(function(s){return qr(s,1)[0]})},set:function(r,o){return Promise.resolve(o)},delete:function(r){return Promise.resolve()},clear:function(){return Promise.resolve()}}:{get:function(r,o){var i=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return n.get(r,o,i).catch(function(){return Tn({caches:t}).get(r,o,i)})},set:function(r,o){return n.set(r,o).catch(function(){return Tn({caches:t}).set(r,o)})},delete:function(r){return n.delete(r).catch(function(){return Tn({caches:t}).delete(r)})},clear:function(){return n.clear().catch(function(){return Tn({caches:t}).clear()})}}}function xo(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{serializable:!0},t={};return{get:function(n,r){var o=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}},i=JSON.stringify(n);if(i in t)return Promise.resolve(e.serializable?JSON.parse(t[i]):t[i]);var s=r(),a=o&&o.miss||function(){return Promise.resolve()};return s.then(function(l){return a(l)}).then(function(){return s})},set:function(n,r){return t[JSON.stringify(n)]=e.serializable?JSON.stringify(r):r,Promise.resolve(r)},delete:function(n){return delete t[JSON.stringify(n)],Promise.resolve()},clear:function(){return t={},Promise.resolve()}}}function Mg(e){for(var t=e.length-1;t>0;t--){var n=Math.floor(Math.random()*(t+1)),r=e[t];e[t]=e[n],e[n]=r}return e}function wu(e,t){return t&&Object.keys(t).forEach(function(n){e[n]=t[n](e)}),e}function lo(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];var o=0;return e.replace(/%s/g,function(){return encodeURIComponent(n[o++])})}var Ir={WithinQueryParameters:0,WithinHeaders:1};function Xa(e,t){var n=e||{},r=n.data||{};return Object.keys(n).forEach(function(o){["timeout","headers","queryParameters","data","cacheable"].indexOf(o)===-1&&(r[o]=n[o])}),{data:Object.entries(r).length>0?r:void 0,timeout:n.timeout||t,headers:n.headers||{},queryParameters:n.queryParameters||{},cacheable:n.cacheable}}var rn={Read:1,Write:2,Any:3},Su=1,Hg=2,Pu=3;function Cu(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Su;return fe(fe({},e),{},{status:t,lastUpdate:Date.now()})}function Au(e){return typeof e=="string"?{protocol:"https",url:e,accept:rn.Any}:{protocol:e.protocol||"https",url:e.url,accept:e.accept||rn.Any}}var el="GET",co="POST";function Fg(e,t){return Promise.all(t.map(function(n){return e.get(n,function(){return Promise.resolve(Cu(n))})})).then(function(n){var r=n.filter(function(s){return function(a){return a.status===Su||Date.now()-a.lastUpdate>12e4}(s)}),o=n.filter(function(s){return function(a){return a.status===Pu&&Date.now()-a.lastUpdate<=12e4}(s)}),i=[].concat(Vr(r),Vr(o));return{getTimeout:function(s,a){return(o.length===0&&s===0?1:o.length+3+s)*a},statelessHosts:i.length>0?i.map(function(s){return Au(s)}):t}})}function tl(e,t,n,r){var o=[],i=function(f,h){if(!(f.method===el||f.data===void 0&&h.data===void 0)){var p=Array.isArray(f.data)?f.data:fe(fe({},f.data),h.data);return JSON.stringify(p)}}(n,r),s=function(f,h){var p=fe(fe({},f.headers),h.headers),g={};return Object.keys(p).forEach(function(v){var _=p[v];g[v.toLowerCase()]=_}),g}(e,r),a=n.method,l=n.method!==el?{}:fe(fe({},n.data),r.data),c=fe(fe(fe({"x-algolia-agent":e.userAgent.value},e.queryParameters),l),r.queryParameters),u=0,d=function f(h,p){var g=h.pop();if(g===void 0)throw{name:"RetryError",message:"Unreachable hosts - your application id may be incorrect. If the error persists, contact support@algolia.com.",transporterStackTrace:nl(o)};var v={data:i,headers:s,method:a,url:$g(g,n.path,c),connectTimeout:p(u,e.timeouts.connect),responseTimeout:p(u,r.timeout)},_=function(S){var w={request:v,response:S,host:g,triesLeft:h.length};return o.push(w),w},E={onSucess:function(S){return function(w){try{return JSON.parse(w.content)}catch(I){throw function(k,C){return{name:"DeserializationError",message:k,response:C}}(I.message,w)}}(S)},onRetry:function(S){var w=_(S);return S.isTimedOut&&u++,Promise.all([e.logger.info("Retryable failure",xu(w)),e.hostsCache.set(g,Cu(g,S.isTimedOut?Pu:Hg))]).then(function(){return f(h,p)})},onFail:function(S){throw _(S),function(w,I){var k=w.content,C=w.status,P=k;try{P=JSON.parse(k).message}catch{}return function(H,$,B){return{name:"ApiError",message:H,status:$,transporterStackTrace:B}}(P,C,I)}(S,nl(o))}};return e.requester.send(v).then(function(S){return function(w,I){return function(k){var C=k.status;return k.isTimedOut||function(P){var H=P.isTimedOut,$=P.status;return!H&&~~$==0}(k)||~~(C/100)!=2&&~~(C/100)!=4}(w)?I.onRetry(w):~~(w.status/100)==2?I.onSucess(w):I.onFail(w)}(S,E)})};return Fg(e.hostsCache,t).then(function(f){return d(Vr(f.statelessHosts).reverse(),f.getTimeout)})}function zg(e){var t={value:"Algolia for JavaScript (".concat(e,")"),add:function(n){var r="; ".concat(n.segment).concat(n.version!==void 0?" (".concat(n.version,")"):"");return t.value.indexOf(r)===-1&&(t.value="".concat(t.value).concat(r)),t}};return t}function $g(e,t,n){var r=Iu(n),o="".concat(e.protocol,"://").concat(e.url,"/").concat(t.charAt(0)==="/"?t.substr(1):t);return r.length&&(o+="?".concat(r)),o}function Iu(e){return Object.keys(e).map(function(t){return lo("%s=%s",t,(n=e[t],Object.prototype.toString.call(n)==="[object Object]"||Object.prototype.toString.call(n)==="[object Array]"?JSON.stringify(e[t]):e[t]));var n}).join("&")}function nl(e){return e.map(function(t){return xu(t)})}function xu(e){var t=e.request.headers["x-algolia-api-key"]?{"x-algolia-api-key":"*****"}:{};return fe(fe({},e),{},{request:fe(fe({},e.request),{},{headers:fe(fe({},e.request.headers),t)})})}var Bg=function(e){var t=e.appId,n=function(i,s,a){var l={"x-algolia-api-key":a,"x-algolia-application-id":s};return{headers:function(){return i===Ir.WithinHeaders?l:{}},queryParameters:function(){return i===Ir.WithinQueryParameters?l:{}}}}(e.authMode!==void 0?e.authMode:Ir.WithinHeaders,t,e.apiKey),r=function(i){var s=i.hostsCache,a=i.logger,l=i.requester,c=i.requestsCache,u=i.responsesCache,d=i.timeouts,f=i.userAgent,h=i.hosts,p=i.queryParameters,g={hostsCache:s,logger:a,requester:l,requestsCache:c,responsesCache:u,timeouts:d,userAgent:f,headers:i.headers,queryParameters:p,hosts:h.map(function(v){return Au(v)}),read:function(v,_){var E=Xa(_,g.timeouts.read),S=function(){return tl(g,g.hosts.filter(function(I){return(I.accept&rn.Read)!=0}),v,E)};if((E.cacheable!==void 0?E.cacheable:v.cacheable)!==!0)return S();var w={request:v,mappedRequestOptions:E,transporter:{queryParameters:g.queryParameters,headers:g.headers}};return g.responsesCache.get(w,function(){return g.requestsCache.get(w,function(){return g.requestsCache.set(w,S()).then(function(I){return Promise.all([g.requestsCache.delete(w),I])},function(I){return Promise.all([g.requestsCache.delete(w),Promise.reject(I)])}).then(function(I){var k=qr(I,2);return k[0],k[1]})})},{miss:function(I){return g.responsesCache.set(w,I)}})},write:function(v,_){return tl(g,g.hosts.filter(function(E){return(E.accept&rn.Write)!=0}),v,Xa(_,g.timeouts.write))}};return g}(fe(fe({hosts:[{url:"".concat(t,"-dsn.algolia.net"),accept:rn.Read},{url:"".concat(t,".algolia.net"),accept:rn.Write}].concat(Mg([{url:"".concat(t,"-1.algolianet.com")},{url:"".concat(t,"-2.algolianet.com")},{url:"".concat(t,"-3.algolianet.com")}]))},e),{},{headers:fe(fe(fe({},n.headers()),{"content-type":"application/x-www-form-urlencoded"}),e.headers),queryParameters:fe(fe({},n.queryParameters()),e.queryParameters)})),o={transporter:r,appId:t,addAlgoliaAgent:function(i,s){r.userAgent.add({segment:i,version:s})},clearCache:function(){return Promise.all([r.requestsCache.clear(),r.responsesCache.clear()]).then(function(){})}};return wu(o,e.methods)},ju=function(e){return function(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},r={transporter:e.transporter,appId:e.appId,indexName:t};return wu(r,n.methods)}},rl=function(e){return function(t,n){var r=t.map(function(o){return fe(fe({},o),{},{params:Iu(o.params||{})})});return e.transporter.read({method:co,path:"1/indexes/*/queries",data:{requests:r},cacheable:!0},n)}},ol=function(e){return function(t,n){return Promise.all(t.map(function(r){var o=r.params,i=o.facetName,s=o.facetQuery,a=Gh(o,Lg);return ju(e)(r.indexName,{methods:{searchForFacetValues:Tu}}).searchForFacetValues(i,s,fe(fe({},n),a))}))}},Ug=function(e){return function(t,n,r){return e.transporter.read({method:co,path:lo("1/answers/%s/prediction",e.indexName),data:{query:t,queryLanguages:n},cacheable:!0},r)}},qg=function(e){return function(t,n){return e.transporter.read({method:co,path:lo("1/indexes/%s/query",e.indexName),data:{query:t},cacheable:!0},n)}},Tu=function(e){return function(t,n,r){return e.transporter.read({method:co,path:lo("1/indexes/%s/facets/%s/query",e.indexName,t),data:{facetQuery:n},cacheable:!0},r)}},Vg=1,Kg=2,Wg=3;function ku(e,t,n){var r,o={appId:e,apiKey:t,timeouts:{connect:1,read:2,write:30},requester:{send:function(i){return new Promise(function(s){var a=new XMLHttpRequest;a.open(i.method,i.url,!0),Object.keys(i.headers).forEach(function(d){return a.setRequestHeader(d,i.headers[d])});var l,c=function(d,f){return setTimeout(function(){a.abort(),s({status:0,content:f,isTimedOut:!0})},1e3*d)},u=c(i.connectTimeout,"Connection timeout");a.onreadystatechange=function(){a.readyState>a.OPENED&&l===void 0&&(clearTimeout(u),l=c(i.responseTimeout,"Socket timeout"))},a.onerror=function(){a.status===0&&(clearTimeout(u),clearTimeout(l),s({content:a.responseText||"Network request failed",status:a.status,isTimedOut:!1}))},a.onload=function(){clearTimeout(u),clearTimeout(l),s({content:a.responseText,status:a.status,isTimedOut:!1})},a.send(i.data)})}},logger:(r=Wg,{debug:function(i,s){return Vg>=r&&console.debug(i,s),Promise.resolve()},info:function(i,s){return Kg>=r&&console.info(i,s),Promise.resolve()},error:function(i,s){return console.error(i,s),Promise.resolve()}}),responsesCache:xo(),requestsCache:xo({serializable:!1}),hostsCache:Tn({caches:[Ng({key:"".concat("4.8.5","-").concat(e)}),xo()]}),userAgent:zg("4.8.5").add({segment:"Browser",version:"lite"}),authMode:Ir.WithinQueryParameters};return Bg(fe(fe(fe({},o),n),{},{methods:{search:rl,searchForFacetValues:ol,multipleQueries:rl,multipleSearchForFacetValues:ol,initIndex:function(i){return function(s){return ju(i)(s,{methods:{search:qg,searchForFacetValues:Tu,findAnswers:Ug}})}}}}))}ku.version="4.8.5";var Jg=["footer","searchBox"];function Bn(){return Bn=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Bn.apply(this,arguments)}function il(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function jo(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?il(Object(n),!0).forEach(function(r){Qg(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):il(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Qg(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Yg(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){var o=n==null?null:typeof Symbol!="undefined"&&n[Symbol.iterator]||n["@@iterator"];if(o!=null){var i,s,a=[],l=!0,c=!1;try{for(o=o.call(n);!(l=(i=o.next()).done)&&(a.push(i.value),!r||a.length!==r);l=!0);}catch(u){c=!0,s=u}finally{try{l||o.return==null||o.return()}finally{if(c)throw s}}return a}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return sl(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return sl(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function sl(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Gg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Zg(e){var t=e.appId,n=e.apiKey,r=e.indexName,o=e.placeholder,i=o===void 0?"Search docs":o,s=e.searchParameters,a=e.onClose,l=a===void 0?bg:a,c=e.transformItems,u=c===void 0?Ga:c,d=e.hitComponent,f=d===void 0?tg:d,h=e.resultsFooterComponent,p=h===void 0?function(){return null}:h,g=e.navigator,v=e.initialScrollY,_=v===void 0?0:v,E=e.transformSearchClient,S=E===void 0?Ga:E,w=e.disableUserPersonalization,I=w!==void 0&&w,k=e.initialQuery,C=k===void 0?"":k,P=e.translations,H=P===void 0?{}:P,$=e.getMissingResultsUrl,B=H.footer,A=H.searchBox,z=Gg(H,Jg),Q=Yg(b.useState({query:"",collections:[],completion:null,context:{},isOpen:!1,activeItemId:null,status:"idle"}),2),se=Q[0],W=Q[1],ee=b.useRef(null),te=b.useRef(null),Ee=b.useRef(null),Pe=b.useRef(null),Ae=b.useRef(null),we=b.useRef(10),Te=b.useRef(typeof window!="undefined"?window.getSelection().toString().slice(0,64):"").current,ze=b.useRef(C||Te).current,j=function(m,y,O){return b.useMemo(function(){var x=ku(m,y);return x.addAlgoliaAgent("docsearch","3.0.0"),/docsearch.js \(.*\)/.test(x.transporter.userAgent.value)===!1&&x.addAlgoliaAgent("docsearch-react","3.0.0"),O(x)},[m,y,O])}(t,n,S),U=b.useRef(Za({key:"__DOCSEARCH_FAVORITE_SEARCHES__".concat(r),limit:10})).current,N=b.useRef(Za({key:"__DOCSEARCH_RECENT_SEARCHES__".concat(r),limit:U.getAll().length===0?7:4})).current,q=b.useCallback(function(m){if(!I){var y=m.type==="content"?m.__docsearch_parent:m;y&&U.getAll().findIndex(function(O){return O.objectID===y.objectID})===-1&&N.add(y)}},[U,N,I]),le=b.useMemo(function(){return Zv({id:"docsearch",defaultActiveItemId:0,placeholder:i,openOnFocus:!0,initialState:{query:ze,context:{searchSuggestions:[]}},navigator:g,onStateChange:function(m){W(m.state)},getSources:function(m){var y=m.query,O=m.state,x=m.setContext,T=m.setStatus;return y?j.search([{query:y,indexName:r,params:jo({attributesToRetrieve:["hierarchy.lvl0","hierarchy.lvl1","hierarchy.lvl2","hierarchy.lvl3","hierarchy.lvl4","hierarchy.lvl5","hierarchy.lvl6","content","type","url"],attributesToSnippet:["hierarchy.lvl1:".concat(we.current),"hierarchy.lvl2:".concat(we.current),"hierarchy.lvl3:".concat(we.current),"hierarchy.lvl4:".concat(we.current),"hierarchy.lvl5:".concat(we.current),"hierarchy.lvl6:".concat(we.current),"content:".concat(we.current)],snippetEllipsisText:"\u2026",highlightPreTag:"<mark>",highlightPostTag:"</mark>",hitsPerPage:20},s)}]).catch(function(D){throw D.name==="RetryError"&&T("error"),D}).then(function(D){var M=D.results[0],R=M.hits,F=M.nbHits,L=Ya(R,function(J){return Ou(J)});return O.context.searchSuggestions.length<Object.keys(L).length&&x({searchSuggestions:Object.keys(L)}),x({nbHits:F}),Object.values(L).map(function(J,K){return{sourceId:"hits".concat(K),onSelect:function(V){var G=V.item,ie=V.event;q(G),ie.shiftKey||ie.ctrlKey||ie.metaKey||l()},getItemUrl:function(V){return V.item.url},getItems:function(){return Object.values(Ya(J,function(V){return V.hierarchy.lvl1})).map(u).map(function(V){return V.map(function(G){return jo(jo({},G),{},{__docsearch_parent:G.type!=="lvl1"&&V.find(function(ie){return ie.type==="lvl1"&&ie.hierarchy.lvl1===G.hierarchy.lvl1})})})}).flat()}}})}):I?[]:[{sourceId:"recentSearches",onSelect:function(D){var M=D.item,R=D.event;q(M),R.shiftKey||R.ctrlKey||R.metaKey||l()},getItemUrl:function(D){return D.item.url},getItems:function(){return N.getAll()}},{sourceId:"favoriteSearches",onSelect:function(D){var M=D.item,R=D.event;q(M),R.shiftKey||R.ctrlKey||R.metaKey||l()},getItemUrl:function(D){return D.item.url},getItems:function(){return U.getAll()}}]}})},[r,s,j,l,N,U,q,ze,i,g,u,I]),pe=le.getEnvironmentProps,re=le.getRootProps,X=le.refresh;return function(m){var y=m.getEnvironmentProps,O=m.panelElement,x=m.formElement,T=m.inputElement;b.useEffect(function(){if(O&&x&&T){var D=y({panelElement:O,formElement:x,inputElement:T}),M=D.onTouchStart,R=D.onTouchMove;return window.addEventListener("touchstart",M),window.addEventListener("touchmove",R),function(){window.removeEventListener("touchstart",M),window.removeEventListener("touchmove",R)}}},[y,O,x,T])}({getEnvironmentProps:pe,panelElement:Pe.current,formElement:Ee.current,inputElement:Ae.current}),function(m){var y=m.container;b.useEffect(function(){if(y){var O=y.querySelectorAll("a[href]:not([disabled]), button:not([disabled]), input:not([disabled])"),x=O[0],T=O[O.length-1];return y.addEventListener("keydown",D),function(){y.removeEventListener("keydown",D)}}function D(M){M.key==="Tab"&&(M.shiftKey?document.activeElement===x&&(M.preventDefault(),T.focus()):document.activeElement===T&&(M.preventDefault(),x.focus()))}},[y])}({container:ee.current}),b.useEffect(function(){return document.body.classList.add("DocSearch--active"),function(){var m,y;document.body.classList.remove("DocSearch--active"),(m=(y=window).scrollTo)===null||m===void 0||m.call(y,0,_)}},[]),b.useEffect(function(){window.matchMedia("(max-width: 750px)").matches&&(we.current=5)},[]),b.useEffect(function(){Pe.current&&(Pe.current.scrollTop=0)},[se.query]),b.useEffect(function(){ze.length>0&&(X(),Ae.current&&Ae.current.focus())},[ze,X]),b.useEffect(function(){function m(){if(te.current){var y=.01*window.innerHeight;te.current.style.setProperty("--docsearch-vh","".concat(y,"px"))}}return m(),window.addEventListener("resize",m),function(){window.removeEventListener("resize",m)}},[]),b.createElement("div",Bn({ref:ee},re({"aria-expanded":!0}),{className:["DocSearch","DocSearch-Container",se.status==="stalled"&&"DocSearch-Container--Stalled",se.status==="error"&&"DocSearch-Container--Errored"].filter(Boolean).join(" "),role:"button",tabIndex:0,onMouseDown:function(m){m.target===m.currentTarget&&l()}}),b.createElement("div",{className:"DocSearch-Modal",ref:te},b.createElement("header",{className:"DocSearch-SearchBar",ref:Ee},b.createElement(Tg,Bn({},le,{state:se,autoFocus:ze.length===0,inputRef:Ae,isFromSelection:Boolean(ze)&&ze===Te,translations:A,onClose:l}))),b.createElement("div",{className:"DocSearch-Dropdown",ref:Pe},b.createElement(Ig,Bn({},le,{indexName:r,state:se,hitComponent:f,resultsFooterComponent:p,disableUserPersonalization:I,recentSearches:N,favoriteSearches:U,inputRef:Ae,translations:z,getMissingResultsUrl:$,onItemClick:function(m){q(m),l()}}))),b.createElement("footer",{className:"DocSearch-Footer"},b.createElement(eg,{translations:B}))))}function ci(){return ci=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},ci.apply(this,arguments)}function al(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){var o=n==null?null:typeof Symbol!="undefined"&&n[Symbol.iterator]||n["@@iterator"];if(o!=null){var i,s,a=[],l=!0,c=!1;try{for(o=o.call(n);!(l=(i=o.next()).done)&&(a.push(i.value),!r||a.length!==r);l=!0);}catch(u){c=!0,s=u}finally{try{l||o.return==null||o.return()}finally{if(c)throw s}}return a}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return ll(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return ll(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function ll(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Xg(e){var t,n,r=b.useRef(null),o=al(b.useState(!1),2),i=o[0],s=o[1],a=al(b.useState((e==null?void 0:e.initialQuery)||void 0),2),l=a[0],c=a[1],u=b.useCallback(function(){s(!0)},[s]),d=b.useCallback(function(){s(!1)},[s]);return function(f){var h=f.isOpen,p=f.onOpen,g=f.onClose,v=f.onInput,_=f.searchButtonRef;b.useEffect(function(){function E(S){(S.keyCode===27&&h||S.key==="k"&&(S.metaKey||S.ctrlKey)||!function(w){var I=w.target,k=I.tagName;return I.isContentEditable||k==="INPUT"||k==="SELECT"||k==="TEXTAREA"}(S)&&S.key==="/"&&!h)&&(S.preventDefault(),h?g():document.body.classList.contains("DocSearch--active")||document.body.classList.contains("DocSearch--active")||p()),_&&_.current===document.activeElement&&v&&/[a-zA-Z0-9]/.test(String.fromCharCode(S.keyCode))&&v(S)}return window.addEventListener("keydown",E),function(){window.removeEventListener("keydown",E)}},[h,p,g,v,_])}({isOpen:i,onOpen:u,onClose:d,onInput:b.useCallback(function(f){s(!0),c(f.key)},[s,c]),searchButtonRef:r}),b.createElement(b.Fragment,null,b.createElement(gv,{ref:r,translations:e==null||(t=e.translations)===null||t===void 0?void 0:t.button,onClick:u}),i&&mu(b.createElement(Zg,ci({},e,{initialScrollY:window.scrollY,initialQuery:l,translations:e==null||(n=e.translations)===null||n===void 0?void 0:n.modal,onClose:d})),document.body))}function e0(e){vu(b.createElement(Xg,Go({},e,{transformSearchClient:function(t){return t.addAlgoliaAgent("docsearch.js","3.0.0"),e.transformSearchClient?e.transformSearchClient(t):t}})),function(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:window;return typeof t=="string"?n.document.querySelector(t):t}(e.container,e.environment))}var Du,ui,Ru,t0=[];function n0(e,t,n){var r,o,i,s={};for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:s[i]=t[i];if(arguments.length>2&&(s.children=arguments.length>3?Du.call(arguments,2):n),typeof e=="function"&&e.defaultProps!=null)for(i in e.defaultProps)s[i]===void 0&&(s[i]=e.defaultProps[i]);return r0(e,s,r,o,null)}function r0(e,t,n,r,o){var i={type:e,props:t,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:o==null?++Ru:o};return o==null&&ui.vnode!=null&&ui.vnode(i),i}Du=t0.slice,ui={__e:function(e,t,n,r){for(var o,i,s;t=t.__;)if((o=t.__c)&&!o.__)try{if((i=o.constructor)&&i.getDerivedStateFromError!=null&&(o.setState(i.getDerivedStateFromError(e)),s=o.__d),o.componentDidCatch!=null&&(o.componentDidCatch(e,r||{}),s=o.__d),s)return o.__E=o}catch(a){e=a}throw e}},Ru=0,typeof Promise=="function"&&Promise.prototype.then.bind(Promise.resolve());function Qi(e,t,n){var r,o,i;t===void 0&&(t=50),n===void 0&&(n={});var s=(r=n.isImmediate)!=null&&r,a=(o=n.callback)!=null&&o,l=n.maxWait,c=Date.now(),u=[];function d(){if(l!==void 0){var h=Date.now()-c;if(h+t>=l)return l-h}return t}var f=function(){var h=[].slice.call(arguments),p=this;return new Promise(function(g,v){var _=s&&i===void 0;if(i!==void 0&&clearTimeout(i),i=setTimeout(function(){if(i=void 0,c=Date.now(),!s){var S=e.apply(p,h);a&&a(S),u.forEach(function(w){return(0,w.resolve)(S)}),u=[]}},d()),_){var E=e.apply(p,h);return a&&a(E),g(E)}u.push({resolve:g,reject:v})})};return f.cancel=function(h){i!==void 0&&clearTimeout(i),u.forEach(function(p){return(0,p.reject)(h)}),u=[]},f}const o0=e=>e.button===1||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey,i0=()=>{const e=ao(),t=Mc();return{transformItems:n=>n.map(r=>ht(De({},r),{url:Lm(r.url,t.value.base)})),hitComponent:({hit:n,children:r})=>n0("a",{href:n.url,onClick:o=>{o0(o)||(o.preventDefault(),e.push(n.url))}},r),navigator:{navigate:({itemUrl:n})=>{e.push(n)}},transformSearchClient:n=>{const r=Qi(n.search,500);return ht(De({},n),{search:async(...o)=>r(...o)})}}};const s0=Ye({name:"Docsearch",props:{options:{type:Object,required:!0}},setup(e){const t=Nc(),n=Lc(),r=i0(),o=Oe(()=>{var a;return De(De({},e.options),(a=e.options.locales)===null||a===void 0?void 0:a[t.value])}),i=[],s=()=>{var a,l;const c=(l=(a=o.value.searchParameters)===null||a===void 0?void 0:a.facetFilters)!==null&&l!==void 0?l:[];i.splice(0,i.length,`lang:${n.value}`,...Z(c)?c:[c]),e0(ht(De(De({},r),o.value),{container:"#docsearch-container",searchParameters:ht(De({},o.value.searchParameters),{facetFilters:i})}))};return mt(()=>{s(),et([t,o],([a,l],[c,u])=>{a!==c&&JSON.stringify(l)!==JSON.stringify(u)&&s()}),et(n,(a,l)=>{if(a!==l){const c=i.findIndex(u=>u===`lang:${l}`);c>-1&&i.splice(c,1,`lang:${a}`)}})}),()=>ye("div",{id:"docsearch-container"})}}),a0={apiKey:"43f53c241d1cfae00618363083251da3",indexName:"vue3-date-time-picker",locales:{"/":{placeholder:"Search"}}};var l0=yn(({app:e})=>{e.component("Docsearch",()=>ye(s0,{options:a0}))});const c0=[zm,Zm,rh,Vh,Kh,Qh,l0],cl=()=>window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,u0=()=>window.scrollTo({top:0,behavior:"smooth"});const f0=Ye({name:"BackToTop",setup(){const e=Le(0),t=Oe(()=>e.value>300),n=Qi(()=>{e.value=cl()},100);mt(()=>{e.value=cl(),window.addEventListener("scroll",()=>n())});const r=ye("div",{class:"back-to-top",onClick:u0});return()=>ye(Hi,{name:"back-to-top"},()=>t.value?r:null)}}),d0=[f0],p0=({headerLinkSelector:e,headerAnchorSelector:t,delay:n,offset:r=5})=>{const o=ao(),i=or(),a=Qi(()=>{var l,c,u,d;const f=Array.from(document.querySelectorAll(e)),p=Array.from(document.querySelectorAll(t)).filter(S=>f.some(w=>w.hash===S.hash)),g=Math.max(window.pageYOffset,document.documentElement.scrollTop,document.body.scrollTop),v=window.innerHeight+g,_=Math.max(document.documentElement.scrollHeight,document.body.scrollHeight),E=Math.abs(_-v)<r;for(let S=0;S<p.length;S++){const w=p[S],I=p[S+1],k=S===0&&g===0,C=g>=((c=(l=w.parentElement)===null||l===void 0?void 0:l.offsetTop)!==null&&c!==void 0?c:0)-r,P=!I||g<((d=(u=I.parentElement)===null||u===void 0?void 0:u.offsetTop)!==null&&d!==void 0?d:0)-r;if(!(k||C&&P))continue;const $=decodeURIComponent(o.currentRoute.value.hash),B=decodeURIComponent(w.hash);if($===B)return;if(E){for(let A=S+1;A<p.length;A++)if($===decodeURIComponent(p[A].hash))return}m0(o,{hash:B,force:!0});return}},n);mt(()=>{a(),window.addEventListener("scroll",a)}),xi(()=>{window.removeEventListener("scroll",a)}),et(()=>i.value.path,a)},m0=async(e,...t)=>{const{scrollBehavior:n}=e.options;e.options.scrollBehavior=void 0,await e.replace(...t).finally(()=>e.options.scrollBehavior=n)},h0="a.sidebar-item",v0=".header-anchor",g0=300,_0=5;var y0=qi(()=>{p0({headerLinkSelector:h0,headerAnchorSelector:v0,delay:g0,offset:_0})}),b0=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},xr={exports:{}};/* NProgress, (c) 2013, 2014 Rico Sta. Cruz - http://ricostacruz.com/nprogress
+ * @license MIT */(function(e,t){(function(n,r){e.exports=r()})(b0,function(){var n={};n.version="0.2.0";var r=n.settings={minimum:.08,easing:"ease",positionUsing:"",speed:200,trickle:!0,trickleRate:.02,trickleSpeed:800,showSpinner:!0,barSelector:'[role="bar"]',spinnerSelector:'[role="spinner"]',parent:"body",template:'<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>'};n.configure=function(p){var g,v;for(g in p)v=p[g],v!==void 0&&p.hasOwnProperty(g)&&(r[g]=v);return this},n.status=null,n.set=function(p){var g=n.isStarted();p=o(p,r.minimum,1),n.status=p===1?null:p;var v=n.render(!g),_=v.querySelector(r.barSelector),E=r.speed,S=r.easing;return v.offsetWidth,a(function(w){r.positionUsing===""&&(r.positionUsing=n.getPositioningCSS()),l(_,s(p,E,S)),p===1?(l(v,{transition:"none",opacity:1}),v.offsetWidth,setTimeout(function(){l(v,{transition:"all "+E+"ms linear",opacity:0}),setTimeout(function(){n.remove(),w()},E)},E)):setTimeout(w,E)}),this},n.isStarted=function(){return typeof n.status=="number"},n.start=function(){n.status||n.set(0);var p=function(){setTimeout(function(){!n.status||(n.trickle(),p())},r.trickleSpeed)};return r.trickle&&p(),this},n.done=function(p){return!p&&!n.status?this:n.inc(.3+.5*Math.random()).set(1)},n.inc=function(p){var g=n.status;return g?(typeof p!="number"&&(p=(1-g)*o(Math.random()*g,.1,.95)),g=o(g+p,0,.994),n.set(g)):n.start()},n.trickle=function(){return n.inc(Math.random()*r.trickleRate)},function(){var p=0,g=0;n.promise=function(v){return!v||v.state()==="resolved"?this:(g===0&&n.start(),p++,g++,v.always(function(){g--,g===0?(p=0,n.done()):n.set((p-g)/p)}),this)}}(),n.render=function(p){if(n.isRendered())return document.getElementById("nprogress");u(document.documentElement,"nprogress-busy");var g=document.createElement("div");g.id="nprogress",g.innerHTML=r.template;var v=g.querySelector(r.barSelector),_=p?"-100":i(n.status||0),E=document.querySelector(r.parent),S;return l(v,{transition:"all 0 linear",transform:"translate3d("+_+"%,0,0)"}),r.showSpinner||(S=g.querySelector(r.spinnerSelector),S&&h(S)),E!=document.body&&u(E,"nprogress-custom-parent"),E.appendChild(g),g},n.remove=function(){d(document.documentElement,"nprogress-busy"),d(document.querySelector(r.parent),"nprogress-custom-parent");var p=document.getElementById("nprogress");p&&h(p)},n.isRendered=function(){return!!document.getElementById("nprogress")},n.getPositioningCSS=function(){var p=document.body.style,g="WebkitTransform"in p?"Webkit":"MozTransform"in p?"Moz":"msTransform"in p?"ms":"OTransform"in p?"O":"";return g+"Perspective"in p?"translate3d":g+"Transform"in p?"translate":"margin"};function o(p,g,v){return p<g?g:p>v?v:p}function i(p){return(-1+p)*100}function s(p,g,v){var _;return r.positionUsing==="translate3d"?_={transform:"translate3d("+i(p)+"%,0,0)"}:r.positionUsing==="translate"?_={transform:"translate("+i(p)+"%,0)"}:_={"margin-left":i(p)+"%"},_.transition="all "+g+"ms "+v,_}var a=function(){var p=[];function g(){var v=p.shift();v&&v(g)}return function(v){p.push(v),p.length==1&&g()}}(),l=function(){var p=["Webkit","O","Moz","ms"],g={};function v(w){return w.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,function(I,k){return k.toUpperCase()})}function _(w){var I=document.body.style;if(w in I)return w;for(var k=p.length,C=w.charAt(0).toUpperCase()+w.slice(1),P;k--;)if(P=p[k]+C,P in I)return P;return w}function E(w){return w=v(w),g[w]||(g[w]=_(w))}function S(w,I,k){I=E(I),w.style[I]=k}return function(w,I){var k=arguments,C,P;if(k.length==2)for(C in I)P=I[C],P!==void 0&&I.hasOwnProperty(C)&&S(w,C,P);else S(w,k[1],k[2])}}();function c(p,g){var v=typeof p=="string"?p:f(p);return v.indexOf(" "+g+" ")>=0}function u(p,g){var v=f(p),_=v+g;c(v,g)||(p.className=_.substring(1))}function d(p,g){var v=f(p),_;!c(p,g)||(_=v.replace(" "+g+" "," "),p.className=_.substring(1,_.length-1))}function f(p){return(" "+(p.className||"")+" ").replace(/\s+/gi," ")}function h(p){p&&p.parentNode&&p.parentNode.removeChild(p)}return n})})(xr);const E0=()=>{mt(()=>{const e=ao(),t=new Set;t.add(e.currentRoute.value.path),xr.exports.configure({showSpinner:!1}),e.beforeEach(n=>{t.has(n.path)||xr.exports.start()}),e.afterEach(n=>{t.add(n.path),xr.exports.done()})})};var O0=qi(()=>{E0()}),w0=qi(()=>{Lh(),zh()});const S0=[y0,O0,w0],P0=[["v-8daa1a0e","/",{title:"Vue 3 Datepicker"},["/index.html","/README.md"]],["v-08a5d2dc","/installation/",{title:"Installation"},["/installation/index.html","/installation/README.md"]],["v-9014096a","/api/components/",{title:"Components"},["/api/components/index.html","/api/components/README.md"]],["v-0dd9e6a8","/api/events/",{title:"Events"},["/api/events/index.html","/api/events/README.md"]],["v-fb37d6ea","/api/methods/",{title:"Methods"},["/api/methods/index.html","/api/methods/README.md"]],["v-55146a0d","/api/props/",{title:"Props"},["/api/props/index.html","/api/props/README.md"]],["v-59de75e8","/api/slots/",{title:"Slots"},["/api/slots/index.html","/api/slots/README.md"]],["v-d446beac","/customization/scss/",{title:"SCSS"},["/customization/scss/index.html","/customization/scss/README.md"]],["v-241ec4c4","/customization/theming/",{title:"Theming"},["/customization/theming/index.html","/customization/theming/README.md"]],["v-3706649a","/404.html",{title:""},["/404"]]],C0=P0.reduce((e,[t,n,r,o])=>(e.push({name:t,path:n,component:Ys,meta:r},...o.map(i=>({path:i,redirect:n}))),e),[{name:"404",path:"/:catchAll(.*)",component:Ys}]),A0=Lp,I0=()=>{const e=_m({history:A0(Dm(St.value.base)),routes:C0,scrollBehavior:(t,n,r)=>r||(t.hash?{el:t.hash}:{top:0})});return e.beforeResolve(async(t,n)=>{var r;(t.path!==n.path||n===at)&&([ct.value]=await Promise.all([Rt.resolvePageData(t.name),(r=xc[t.name])===null||r===void 0?void 0:r.__asyncLoader()]))}),e},x0=e=>{e.component("ClientOnly",bm),e.component("Content",Ui)},j0=(e,t)=>{const n=Oe(()=>Rt.resolveRouteLocale(St.value.locales,t.currentRoute.value.path)),r=Oe(()=>Rt.resolveSiteLocaleData(St.value,n.value)),o=Oe(()=>Rt.resolvePageFrontmatter(ct.value)),i=Oe(()=>Rt.resolvePageHeadTitle(ct.value,r.value)),s=Oe(()=>Rt.resolvePageHead(i.value,o.value,r.value)),a=Oe(()=>Rt.resolvePageLang(ct.value));return e.provide(Bi,n),e.provide(Hc,r),e.provide(kc,o),e.provide(Cm,i),e.provide(Dc,s),e.provide(Rc,a),Object.defineProperties(e.config.globalProperties,{$frontmatter:{get:()=>o.value},$head:{get:()=>s.value},$headTitle:{get:()=>i.value},$lang:{get:()=>a.value},$page:{get:()=>ct.value},$routeLocale:{get:()=>n.value},$site:{get:()=>St.value},$siteLocale:{get:()=>r.value},$withBase:{get:()=>Nm}}),{pageData:ct,pageFrontmatter:o,pageHead:s,pageHeadTitle:i,pageLang:a,routeLocale:n,siteData:St,siteLocaleData:r}},T0=()=>{const e=$i(),t=Pm(),n=Lc(),r=Le([]),o=()=>{t.value.forEach(s=>{const a=k0(s);a&&r.value.push(a)})},i=()=>{document.documentElement.lang=n.value,r.value.forEach(s=>{s.parentNode===document.head&&document.head.removeChild(s)}),r.value.splice(0,r.value.length),t.value.forEach(s=>{const a=D0(s);a!==null&&(document.head.appendChild(a),r.value.push(a))})};$t(Im,i),mt(()=>{o(),i(),et(()=>e.path,()=>i())})},k0=([e,t,n=""])=>{const r=Object.entries(t).map(([a,l])=>me(l)?`[${a}="${l}"]`:l===!0?`[${a}]`:"").join(""),o=`head > ${e}${r}`;return Array.from(document.querySelectorAll(o)).find(a=>a.innerText===n)||null},D0=([e,t,n])=>{if(!me(e))return null;const r=document.createElement(e);return Fc(t)&&Object.entries(t).forEach(([o,i])=>{me(i)?r.setAttribute(o,i):i===!0&&r.setAttribute(o,"")}),me(n)&&r.appendChild(document.createTextNode(n)),r},R0=hp,L0=async()=>{const e=R0({name:"VuepressApp",setup(){T0();for(const n of S0)n();return()=>[ye(Ic),...d0.map(n=>ye(n))]}}),t=I0();x0(e),j0(e,t);for(const n of c0)await n({app:e,router:t,siteData:St});return e.use(t),{app:e,router:t}};L0().then(({app:e,router:t})=>{t.isReady().then(()=>{e.mount("#app")})});export{G0 as $,ed as A,gn as B,V0 as C,xd as D,M0 as E,Fe as F,xe as G,$0 as H,ji as I,Df as J,$t as K,et as L,z0 as M,Pi as N,Id as O,tf as P,nf as Q,B0 as R,Nc as S,Hi as T,Zc as U,Sm as V,Z as W,$i as X,H0 as Y,km as Z,Uc as _,ne as a,Z0 as a0,Mc as a1,Y0 as a2,ye as a3,Nm as a4,bm as a5,F0 as a6,Q0 as a7,Rm as a8,Dm as a9,ao as aa,me as ab,Mh as ac,or as ad,e_ as ae,Fc as af,Fh as ag,Se as b,sc as c,L0 as createVueApp,ce as d,cc as e,Ye as f,Le as g,K0 as h,je as i,Oe as j,uc as k,U0 as l,zt as m,mn as n,ro as o,ac as p,W0 as q,Pd as r,mt as s,Vu as t,X0 as u,q0 as v,J0 as w,Bf as x,er as y,Ri as z};
diff --git a/docs/assets/app.519dac2e.js b/docs/assets/app.519dac2e.js
deleted file mode 100644
index da255a330..000000000
--- a/docs/assets/app.519dac2e.js
+++ /dev/null
@@ -1,20 +0,0 @@
-var Au=Object.defineProperty,Iu=Object.defineProperties;var xu=Object.getOwnPropertyDescriptors;var Yi=Object.getOwnPropertySymbols;var ju=Object.prototype.hasOwnProperty,Tu=Object.prototype.propertyIsEnumerable;var Zi=(e,t,n)=>t in e?Au(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,Re=(e,t)=>{for(var n in t||(t={}))ju.call(t,n)&&Zi(e,n,t[n]);if(Yi)for(var n of Yi(t))Tu.call(t,n)&&Zi(e,n,t[n]);return e},It=(e,t)=>Iu(e,xu(t));const Ki={};function li(e,t){const n=Object.create(null),r=e.split(",");for(let o=0;o<r.length;o++)n[r[o]]=!0;return t?o=>!!n[o.toLowerCase()]:o=>!!n[o]}const ku="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",Du=li(ku);function sl(e){return!!e||e===""}function er(e){if(G(e)){const t={};for(let n=0;n<e.length;n++){const r=e[n],o=me(r)?Nu(r):er(r);if(o)for(const i in o)t[i]=o[i]}return t}else{if(me(e))return e;if(Ce(e))return e}}const Ru=/;(?![^(]*\))/g,Lu=/:(.+)/;function Nu(e){const t={};return e.split(Ru).forEach(n=>{if(n){const r=n.split(Lu);r.length>1&&(t[r[0].trim()]=r[1].trim())}}),t}function mn(e){let t="";if(me(e))t=e;else if(G(e))for(let n=0;n<e.length;n++){const r=mn(e[n]);r&&(t+=r+" ")}else if(Ce(e))for(const n in e)e[n]&&(t+=n+" ");return t.trim()}function P0(e){if(!e)return null;let{class:t,style:n}=e;return t&&!me(t)&&(e.class=mn(t)),n&&(e.style=er(n)),e}const Mu=e=>me(e)?e:e==null?"":G(e)||Ce(e)&&(e.toString===ul||!oe(e.toString))?JSON.stringify(e,al,2):String(e),al=(e,t)=>t&&t.__v_isRef?al(e,t.value):sn(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[r,o])=>(n[`${r} =>`]=o,n),{})}:ll(t)?{[`Set(${t.size})`]:[...t.values()]}:Ce(t)&&!G(t)&&!fl(t)?String(t):t,ge={},on=[],Xe=()=>{},Hu=()=>!1,Fu=/^on[^a-z]/,tr=e=>Fu.test(e),ci=e=>e.startsWith("onUpdate:"),ke=Object.assign,ui=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},zu=Object.prototype.hasOwnProperty,ue=(e,t)=>zu.call(e,t),G=Array.isArray,sn=e=>Qr(e)==="[object Map]",ll=e=>Qr(e)==="[object Set]",oe=e=>typeof e=="function",me=e=>typeof e=="string",fi=e=>typeof e=="symbol",Ce=e=>e!==null&&typeof e=="object",cl=e=>Ce(e)&&oe(e.then)&&oe(e.catch),ul=Object.prototype.toString,Qr=e=>ul.call(e),Bu=e=>Qr(e).slice(8,-1),fl=e=>Qr(e)==="[object Object]",di=e=>me(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,kn=li(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Yr=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},$u=/-(\w)/g,st=Yr(e=>e.replace($u,(t,n)=>n?n.toUpperCase():"")),Uu=/\B([A-Z])/g,qt=Yr(e=>e.replace(Uu,"-$1").toLowerCase()),Zr=Yr(e=>e.charAt(0).toUpperCase()+e.slice(1)),ao=Yr(e=>e?`on${Zr(e)}`:""),Un=(e,t)=>!Object.is(e,t),lo=(e,t)=>{for(let n=0;n<e.length;n++)e[n](t)},Ir=(e,t,n)=>{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},dl=e=>{const t=parseFloat(e);return isNaN(t)?e:t};let Gi;const qu=()=>Gi||(Gi=typeof globalThis!="undefined"?globalThis:typeof self!="undefined"?self:typeof window!="undefined"?window:typeof global!="undefined"?global:{});let We;class Vu{constructor(t=!1){this.active=!0,this.effects=[],this.cleanups=[],!t&&We&&(this.parent=We,this.index=(We.scopes||(We.scopes=[])).push(this)-1)}run(t){if(this.active)try{return We=this,t()}finally{We=this.parent}}on(){We=this}off(){We=this.parent}stop(t){if(this.active){let n,r;for(n=0,r=this.effects.length;n<r;n++)this.effects[n].stop();for(n=0,r=this.cleanups.length;n<r;n++)this.cleanups[n]();if(this.scopes)for(n=0,r=this.scopes.length;n<r;n++)this.scopes[n].stop(!0);if(this.parent&&!t){const o=this.parent.scopes.pop();o&&o!==this&&(this.parent.scopes[this.index]=o,o.index=this.index)}this.active=!1}}}function Ku(e,t=We){t&&t.active&&t.effects.push(e)}function Wu(){return We}function Ju(e){We&&We.cleanups.push(e)}const pi=e=>{const t=new Set(e);return t.w=0,t.n=0,t},pl=e=>(e.w&Ct)>0,ml=e=>(e.n&Ct)>0,Qu=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=Ct},Yu=e=>{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r<t.length;r++){const o=t[r];pl(o)&&!ml(o)?o.delete(e):t[n++]=o,o.w&=~Ct,o.n&=~Ct}t.length=n}},Io=new WeakMap;let In=0,Ct=1;const xo=30;let rt;const Ft=Symbol(""),jo=Symbol("");class mi{constructor(t,n=null,r){this.fn=t,this.scheduler=n,this.active=!0,this.deps=[],this.parent=void 0,Ku(this,r)}run(){if(!this.active)return this.fn();let t=rt,n=St;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=rt,rt=this,St=!0,Ct=1<<++In,In<=xo?Qu(this):Xi(this),this.fn()}finally{In<=xo&&Yu(this),Ct=1<<--In,rt=this.parent,St=n,this.parent=void 0}}stop(){this.active&&(Xi(this),this.onStop&&this.onStop(),this.active=!1)}}function Xi(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}let St=!0;const hl=[];function hn(){hl.push(St),St=!1}function vn(){const e=hl.pop();St=e===void 0?!0:e}function qe(e,t,n){if(St&&rt){let r=Io.get(e);r||Io.set(e,r=new Map);let o=r.get(n);o||r.set(n,o=pi()),vl(o)}}function vl(e,t){let n=!1;In<=xo?ml(e)||(e.n|=Ct,n=!pl(e)):n=!e.has(rt),n&&(e.add(rt),rt.deps.push(e))}function pt(e,t,n,r,o,i){const s=Io.get(e);if(!s)return;let a=[];if(t==="clear")a=[...s.values()];else if(n==="length"&&G(e))s.forEach((l,c)=>{(c==="length"||c>=r)&&a.push(l)});else switch(n!==void 0&&a.push(s.get(n)),t){case"add":G(e)?di(n)&&a.push(s.get("length")):(a.push(s.get(Ft)),sn(e)&&a.push(s.get(jo)));break;case"delete":G(e)||(a.push(s.get(Ft)),sn(e)&&a.push(s.get(jo)));break;case"set":sn(e)&&a.push(s.get(Ft));break}if(a.length===1)a[0]&&To(a[0]);else{const l=[];for(const c of a)c&&l.push(...c);To(pi(l))}}function To(e,t){for(const n of G(e)?e:[...e])(n!==rt||n.allowRecurse)&&(n.scheduler?n.scheduler():n.run())}const Zu=li("__proto__,__v_isRef,__isVue"),gl=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(fi)),Gu=hi(),Xu=hi(!1,!0),ef=hi(!0),es=tf();function tf(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=de(this);for(let i=0,s=this.length;i<s;i++)qe(r,"get",i+"");const o=r[t](...n);return o===-1||o===!1?r[t](...n.map(de)):o}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){hn();const r=de(this)[t].apply(this,n);return vn(),r}}),e}function hi(e=!1,t=!1){return function(r,o,i){if(o==="__v_isReactive")return!e;if(o==="__v_isReadonly")return e;if(o==="__v_isShallow")return t;if(o==="__v_raw"&&i===(e?t?_f:Ol:t?El:bl).get(r))return r;const s=G(r);if(!e&&s&&ue(es,o))return Reflect.get(es,o,i);const a=Reflect.get(r,o,i);return(fi(o)?gl.has(o):Zu(o))||(e||qe(r,"get",o),t)?a:xe(a)?!s||!di(o)?a.value:a:Ce(a)?e?_i(a):gn(a):a}}const nf=_l(),rf=_l(!0);function _l(e=!1){return function(n,r,o,i){let s=n[r];if(qn(s)&&xe(s)&&!xe(o))return!1;if(!e&&!qn(o)&&(wl(o)||(o=de(o),s=de(s)),!G(n)&&xe(s)&&!xe(o)))return s.value=o,!0;const a=G(n)&&di(r)?Number(r)<n.length:ue(n,r),l=Reflect.set(n,r,o,i);return n===de(i)&&(a?Un(o,s)&&pt(n,"set",r,o):pt(n,"add",r,o)),l}}function of(e,t){const n=ue(e,t);e[t];const r=Reflect.deleteProperty(e,t);return r&&n&&pt(e,"delete",t,void 0),r}function sf(e,t){const n=Reflect.has(e,t);return(!fi(t)||!gl.has(t))&&qe(e,"has",t),n}function af(e){return qe(e,"iterate",G(e)?"length":Ft),Reflect.ownKeys(e)}const yl={get:Gu,set:nf,deleteProperty:of,has:sf,ownKeys:af},lf={get:ef,set(e,t){return!0},deleteProperty(e,t){return!0}},cf=ke({},yl,{get:Xu,set:rf}),vi=e=>e,Gr=e=>Reflect.getPrototypeOf(e);function sr(e,t,n=!1,r=!1){e=e.__v_raw;const o=de(e),i=de(t);t!==i&&!n&&qe(o,"get",t),!n&&qe(o,"get",i);const{has:s}=Gr(o),a=r?vi:n?bi:Vn;if(s.call(o,t))return a(e.get(t));if(s.call(o,i))return a(e.get(i));e!==o&&e.get(t)}function ar(e,t=!1){const n=this.__v_raw,r=de(n),o=de(e);return e!==o&&!t&&qe(r,"has",e),!t&&qe(r,"has",o),e===o?n.has(e):n.has(e)||n.has(o)}function lr(e,t=!1){return e=e.__v_raw,!t&&qe(de(e),"iterate",Ft),Reflect.get(e,"size",e)}function ts(e){e=de(e);const t=de(this);return Gr(t).has.call(t,e)||(t.add(e),pt(t,"add",e,e)),this}function ns(e,t){t=de(t);const n=de(this),{has:r,get:o}=Gr(n);let i=r.call(n,e);i||(e=de(e),i=r.call(n,e));const s=o.call(n,e);return n.set(e,t),i?Un(t,s)&&pt(n,"set",e,t):pt(n,"add",e,t),this}function rs(e){const t=de(this),{has:n,get:r}=Gr(t);let o=n.call(t,e);o||(e=de(e),o=n.call(t,e)),r&&r.call(t,e);const i=t.delete(e);return o&&pt(t,"delete",e,void 0),i}function os(){const e=de(this),t=e.size!==0,n=e.clear();return t&&pt(e,"clear",void 0,void 0),n}function cr(e,t){return function(r,o){const i=this,s=i.__v_raw,a=de(s),l=t?vi:e?bi:Vn;return!e&&qe(a,"iterate",Ft),s.forEach((c,u)=>r.call(o,l(c),l(u),i))}}function ur(e,t,n){return function(...r){const o=this.__v_raw,i=de(o),s=sn(i),a=e==="entries"||e===Symbol.iterator&&s,l=e==="keys"&&s,c=o[e](...r),u=n?vi:t?bi:Vn;return!t&&qe(i,"iterate",l?jo:Ft),{next(){const{value:d,done:f}=c.next();return f?{value:d,done:f}:{value:a?[u(d[0]),u(d[1])]:u(d),done:f}},[Symbol.iterator](){return this}}}}function ht(e){return function(...t){return e==="delete"?!1:this}}function uf(){const e={get(i){return sr(this,i)},get size(){return lr(this)},has:ar,add:ts,set:ns,delete:rs,clear:os,forEach:cr(!1,!1)},t={get(i){return sr(this,i,!1,!0)},get size(){return lr(this)},has:ar,add:ts,set:ns,delete:rs,clear:os,forEach:cr(!1,!0)},n={get(i){return sr(this,i,!0)},get size(){return lr(this,!0)},has(i){return ar.call(this,i,!0)},add:ht("add"),set:ht("set"),delete:ht("delete"),clear:ht("clear"),forEach:cr(!0,!1)},r={get(i){return sr(this,i,!0,!0)},get size(){return lr(this,!0)},has(i){return ar.call(this,i,!0)},add:ht("add"),set:ht("set"),delete:ht("delete"),clear:ht("clear"),forEach:cr(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(i=>{e[i]=ur(i,!1,!1),n[i]=ur(i,!0,!1),t[i]=ur(i,!1,!0),r[i]=ur(i,!0,!0)}),[e,n,t,r]}const[ff,df,pf,mf]=uf();function gi(e,t){const n=t?e?mf:pf:e?df:ff;return(r,o,i)=>o==="__v_isReactive"?!e:o==="__v_isReadonly"?e:o==="__v_raw"?r:Reflect.get(ue(n,o)&&o in r?n:r,o,i)}const hf={get:gi(!1,!1)},vf={get:gi(!1,!0)},gf={get:gi(!0,!1)},bl=new WeakMap,El=new WeakMap,Ol=new WeakMap,_f=new WeakMap;function yf(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function bf(e){return e.__v_skip||!Object.isExtensible(e)?0:yf(Bu(e))}function gn(e){return qn(e)?e:yi(e,!1,yl,hf,bl)}function Ef(e){return yi(e,!1,cf,vf,El)}function _i(e){return yi(e,!0,lf,gf,Ol)}function yi(e,t,n,r,o){if(!Ce(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const i=o.get(e);if(i)return i;const s=bf(e);if(s===0)return e;const a=new Proxy(e,s===2?r:n);return o.set(e,a),a}function an(e){return qn(e)?an(e.__v_raw):!!(e&&e.__v_isReactive)}function qn(e){return!!(e&&e.__v_isReadonly)}function wl(e){return!!(e&&e.__v_isShallow)}function Sl(e){return an(e)||qn(e)}function de(e){const t=e&&e.__v_raw;return t?de(t):e}function Pl(e){return Ir(e,"__v_skip",!0),e}const Vn=e=>Ce(e)?gn(e):e,bi=e=>Ce(e)?_i(e):e;function Cl(e){St&&rt&&(e=de(e),vl(e.dep||(e.dep=pi())))}function Al(e,t){e=de(e),e.dep&&To(e.dep)}function xe(e){return!!(e&&e.__v_isRef===!0)}function Ne(e){return xl(e,!1)}function Il(e){return xl(e,!0)}function xl(e,t){return xe(e)?e:new Of(e,t)}class Of{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:de(t),this._value=n?t:Vn(t)}get value(){return Cl(this),this._value}set value(t){t=this.__v_isShallow?t:de(t),Un(t,this._rawValue)&&(this._rawValue=t,this._value=this.__v_isShallow?t:Vn(t),Al(this))}}function zt(e){return xe(e)?e.value:e}const wf={get:(e,t,n)=>zt(Reflect.get(e,t,n)),set:(e,t,n,r)=>{const o=e[t];return xe(o)&&!xe(n)?(o.value=n,!0):Reflect.set(e,t,n,r)}};function jl(e){return an(e)?e:new Proxy(e,wf)}function C0(e){const t=G(e)?new Array(e.length):{};for(const n in e)t[n]=Pf(e,n);return t}class Sf{constructor(t,n,r){this._object=t,this._key=n,this._defaultValue=r,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}}function Pf(e,t,n){const r=e[t];return xe(r)?r:new Sf(e,t,n)}class Cf{constructor(t,n,r,o){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this._dirty=!0,this.effect=new mi(t,()=>{this._dirty||(this._dirty=!0,Al(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!o,this.__v_isReadonly=r}get value(){const t=de(this);return Cl(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function Af(e,t,n=!1){let r,o;const i=oe(e);return i?(r=e,o=Xe):(r=e.get,o=e.set),new Cf(r,o,i||!o,n)}Promise.resolve();function Pt(e,t,n,r){let o;try{o=r?e(...r):e()}catch(i){nr(i,t,n)}return o}function Je(e,t,n,r){if(oe(e)){const i=Pt(e,t,n,r);return i&&cl(i)&&i.catch(s=>{nr(s,t,n)}),i}const o=[];for(let i=0;i<e.length;i++)o.push(Je(e[i],t,n,r));return o}function nr(e,t,n,r=!0){const o=t?t.vnode:null;if(t){let i=t.parent;const s=t.proxy,a=n;for(;i;){const c=i.ec;if(c){for(let u=0;u<c.length;u++)if(c[u](e,s,a)===!1)return}i=i.parent}const l=t.appContext.config.errorHandler;if(l){Pt(l,null,10,[e,s,a]);return}}If(e,n,o,r)}function If(e,t,n,r=!0){console.error(e)}let xr=!1,ko=!1;const $e=[];let ct=0;const Dn=[];let xn=null,Zt=0;const Rn=[];let bt=null,Gt=0;const Tl=Promise.resolve();let Ei=null,Do=null;function Oi(e){const t=Ei||Tl;return e?t.then(this?e.bind(this):e):t}function xf(e){let t=ct+1,n=$e.length;for(;t<n;){const r=t+n>>>1;Kn($e[r])<e?t=r+1:n=r}return t}function wi(e){(!$e.length||!$e.includes(e,xr&&e.allowRecurse?ct+1:ct))&&e!==Do&&(e.id==null?$e.push(e):$e.splice(xf(e.id),0,e),kl())}function kl(){!xr&&!ko&&(ko=!0,Ei=Tl.then(Rl))}function jf(e){const t=$e.indexOf(e);t>ct&&$e.splice(t,1)}function Dl(e,t,n,r){G(e)?n.push(...e):(!t||!t.includes(e,e.allowRecurse?r+1:r))&&n.push(e),kl()}function Tf(e){Dl(e,xn,Dn,Zt)}function kf(e){Dl(e,bt,Rn,Gt)}function Si(e,t=null){if(Dn.length){for(Do=t,xn=[...new Set(Dn)],Dn.length=0,Zt=0;Zt<xn.length;Zt++)xn[Zt]();xn=null,Zt=0,Do=null,Si(e,t)}}function jr(e){if(Rn.length){const t=[...new Set(Rn)];if(Rn.length=0,bt){bt.push(...t);return}for(bt=t,bt.sort((n,r)=>Kn(n)-Kn(r)),Gt=0;Gt<bt.length;Gt++)bt[Gt]();bt=null,Gt=0}}const Kn=e=>e.id==null?1/0:e.id;function Rl(e){ko=!1,xr=!0,Si(e),$e.sort((n,r)=>Kn(n)-Kn(r));const t=Xe;try{for(ct=0;ct<$e.length;ct++){const n=$e[ct];n&&n.active!==!1&&Pt(n,null,14)}}finally{ct=0,$e.length=0,jr(),xr=!1,Ei=null,($e.length||Dn.length||Rn.length)&&Rl(e)}}function Df(e,t,...n){const r=e.vnode.props||ge;let o=n;const i=t.startsWith("update:"),s=i&&t.slice(7);if(s&&s in r){const u=`${s==="modelValue"?"model":s}Modifiers`,{number:d,trim:f}=r[u]||ge;f?o=n.map(h=>h.trim()):d&&(o=n.map(dl))}let a,l=r[a=ao(t)]||r[a=ao(st(t))];!l&&i&&(l=r[a=ao(qt(t))]),l&&Je(l,e,6,o);const c=r[a+"Once"];if(c){if(!e.emitted)e.emitted={};else if(e.emitted[a])return;e.emitted[a]=!0,Je(c,e,6,o)}}function Ll(e,t,n=!1){const r=t.emitsCache,o=r.get(e);if(o!==void 0)return o;const i=e.emits;let s={},a=!1;if(!oe(e)){const l=c=>{const u=Ll(c,t,!0);u&&(a=!0,ke(s,u))};!n&&t.mixins.length&&t.mixins.forEach(l),e.extends&&l(e.extends),e.mixins&&e.mixins.forEach(l)}return!i&&!a?(r.set(e,null),null):(G(i)?i.forEach(l=>s[l]=null):ke(s,i),r.set(e,s),s)}function Pi(e,t){return!e||!tr(t)?!1:(t=t.slice(2).replace(/Once$/,""),ue(e,t[0].toLowerCase()+t.slice(1))||ue(e,qt(t))||ue(e,t))}let Ue=null,Nl=null;function Tr(e){const t=Ue;return Ue=e,Nl=e&&e.type.__scopeId||null,t}function Rf(e,t=Ue,n){if(!t||e._n)return e;const r=(...o)=>{r._d&&vs(-1);const i=Tr(t),s=e(...o);return Tr(i),r._d&&vs(1),s};return r._n=!0,r._c=!0,r._d=!0,r}function co(e){const{type:t,vnode:n,proxy:r,withProxy:o,props:i,propsOptions:[s],slots:a,attrs:l,emit:c,render:u,renderCache:d,data:f,setupState:h,ctx:m,inheritAttrs:g}=e;let v,_;const E=Tr(e);try{if(n.shapeFlag&4){const S=o||r;v=Ge(u.call(S,S,d,i,h,f,m)),_=l}else{const S=t;v=Ge(S.length>1?S(i,{attrs:l,slots:a,emit:c}):S(i,null)),_=t.props?l:Lf(l)}}catch(S){Mn.length=0,nr(S,e,1),v=Se(Qe)}let O=v;if(_&&g!==!1){const S=Object.keys(_),{shapeFlag:I}=O;S.length&&I&7&&(s&&S.some(ci)&&(_=Nf(_,s)),O=ln(O,_))}return n.dirs&&(O.dirs=O.dirs?O.dirs.concat(n.dirs):n.dirs),n.transition&&(O.transition=n.transition),v=O,Tr(E),v}const Lf=e=>{let t;for(const n in e)(n==="class"||n==="style"||tr(n))&&((t||(t={}))[n]=e[n]);return t},Nf=(e,t)=>{const n={};for(const r in e)(!ci(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function Mf(e,t,n){const{props:r,children:o,component:i}=e,{props:s,children:a,patchFlag:l}=t,c=i.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&l>=0){if(l&1024)return!0;if(l&16)return r?is(r,s,c):!!s;if(l&8){const u=t.dynamicProps;for(let d=0;d<u.length;d++){const f=u[d];if(s[f]!==r[f]&&!Pi(c,f))return!0}}}else return(o||a)&&(!a||!a.$stable)?!0:r===s?!1:r?s?is(r,s,c):!0:!!s;return!1}function is(e,t,n){const r=Object.keys(t);if(r.length!==Object.keys(e).length)return!0;for(let o=0;o<r.length;o++){const i=r[o];if(t[i]!==e[i]&&!Pi(n,i))return!0}return!1}function Hf({vnode:e,parent:t},n){for(;t&&t.subTree===e;)(e=t.vnode).el=n,t=t.parent}const Ff=e=>e.__isSuspense;function Ml(e,t){t&&t.pendingBranch?G(e)?t.effects.push(...e):t.effects.push(e):kf(e)}function Bt(e,t){if(Ie){let n=Ie.provides;const r=Ie.parent&&Ie.parent.provides;r===n&&(n=Ie.provides=Object.create(r)),n[e]=t}}function je(e,t,n=!1){const r=Ie||Ue;if(r){const o=r.parent==null?r.vnode.appContext&&r.vnode.appContext.provides:r.parent.provides;if(o&&e in o)return o[e];if(arguments.length>1)return n&&oe(t)?t.call(r.proxy):t}}const ss={};function et(e,t,n){return Hl(e,t,n)}function Hl(e,t,{immediate:n,deep:r,flush:o,onTrack:i,onTrigger:s}=ge){const a=Ie;let l,c=!1,u=!1;if(xe(e)?(l=()=>e.value,c=wl(e)):an(e)?(l=()=>e,r=!0):G(e)?(u=!0,c=e.some(an),l=()=>e.map(_=>{if(xe(_))return _.value;if(an(_))return Ht(_);if(oe(_))return Pt(_,a,2)})):oe(e)?t?l=()=>Pt(e,a,2):l=()=>{if(!(a&&a.isUnmounted))return d&&d(),Je(e,a,3,[f])}:l=Xe,t&&r){const _=l;l=()=>Ht(_())}let d,f=_=>{d=v.onStop=()=>{Pt(_,a,4)}};if(un)return f=Xe,t?n&&Je(t,a,3,[l(),u?[]:void 0,f]):l(),Xe;let h=u?[]:ss;const m=()=>{if(!!v.active)if(t){const _=v.run();(r||c||(u?_.some((E,O)=>Un(E,h[O])):Un(_,h)))&&(d&&d(),Je(t,a,3,[_,h===ss?void 0:h,f]),h=_)}else v.run()};m.allowRecurse=!!t;let g;o==="sync"?g=m:o==="post"?g=()=>He(m,a&&a.suspense):g=()=>{!a||a.isMounted?Tf(m):m()};const v=new mi(l,g);return t?n?m():h=v.run():o==="post"?He(v.run.bind(v),a&&a.suspense):v.run(),()=>{v.stop(),a&&a.scope&&ui(a.scope.effects,v)}}function zf(e,t,n){const r=this.proxy,o=me(e)?e.includes(".")?Fl(r,e):()=>r[e]:e.bind(r,r);let i;oe(t)?i=t:(i=t.handler,n=t);const s=Ie;cn(this);const a=Hl(o,i.bind(r),n);return s?cn(s):Ut(),a}function Fl(e,t){const n=t.split(".");return()=>{let r=e;for(let o=0;o<n.length&&r;o++)r=r[n[o]];return r}}function Ht(e,t){if(!Ce(e)||e.__v_skip||(t=t||new Set,t.has(e)))return e;if(t.add(e),xe(e))Ht(e.value,t);else if(G(e))for(let n=0;n<e.length;n++)Ht(e[n],t);else if(ll(e)||sn(e))e.forEach(n=>{Ht(n,t)});else if(fl(e))for(const n in e)Ht(e[n],t);return e}function Bf(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return at(()=>{e.isMounted=!0}),Ci(()=>{e.isUnmounting=!0}),e}const Ve=[Function,Array],$f={name:"BaseTransition",props:{mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:Ve,onEnter:Ve,onAfterEnter:Ve,onEnterCancelled:Ve,onBeforeLeave:Ve,onLeave:Ve,onAfterLeave:Ve,onLeaveCancelled:Ve,onBeforeAppear:Ve,onAppear:Ve,onAfterAppear:Ve,onAppearCancelled:Ve},setup(e,{slots:t}){const n=Di(),r=Bf();let o;return()=>{const i=t.default&&$l(t.default(),!0);if(!i||!i.length)return;const s=de(e),{mode:a}=s,l=i[0];if(r.isLeaving)return uo(l);const c=as(l);if(!c)return uo(l);const u=Ro(c,s,r,n);Lo(c,u);const d=n.subTree,f=d&&as(d);let h=!1;const{getTransitionKey:m}=c.type;if(m){const g=m();o===void 0?o=g:g!==o&&(o=g,h=!0)}if(f&&f.type!==Qe&&(!Nt(c,f)||h)){const g=Ro(f,s,r,n);if(Lo(f,g),a==="out-in")return r.isLeaving=!0,g.afterLeave=()=>{r.isLeaving=!1,n.update()},uo(l);a==="in-out"&&c.type!==Qe&&(g.delayLeave=(v,_,E)=>{const O=Bl(r,f);O[String(f.key)]=f,v._leaveCb=()=>{_(),v._leaveCb=void 0,delete u.delayedLeave},u.delayedLeave=E})}return l}}},zl=$f;function Bl(e,t){const{leavingVNodes:n}=e;let r=n.get(t.type);return r||(r=Object.create(null),n.set(t.type,r)),r}function Ro(e,t,n,r){const{appear:o,mode:i,persisted:s=!1,onBeforeEnter:a,onEnter:l,onAfterEnter:c,onEnterCancelled:u,onBeforeLeave:d,onLeave:f,onAfterLeave:h,onLeaveCancelled:m,onBeforeAppear:g,onAppear:v,onAfterAppear:_,onAppearCancelled:E}=t,O=String(e.key),S=Bl(n,e),I=(C,P)=>{C&&Je(C,r,9,P)},L={mode:i,persisted:s,beforeEnter(C){let P=a;if(!n.isMounted)if(o)P=g||a;else return;C._leaveCb&&C._leaveCb(!0);const B=S[O];B&&Nt(e,B)&&B.el._leaveCb&&B.el._leaveCb(),I(P,[C])},enter(C){let P=l,B=c,z=u;if(!n.isMounted)if(o)P=v||l,B=_||c,z=E||u;else return;let $=!1;const A=C._enterCb=F=>{$||($=!0,F?I(z,[C]):I(B,[C]),L.delayedLeave&&L.delayedLeave(),C._enterCb=void 0)};P?(P(C,A),P.length<=1&&A()):A()},leave(C,P){const B=String(e.key);if(C._enterCb&&C._enterCb(!0),n.isUnmounting)return P();I(d,[C]);let z=!1;const $=C._leaveCb=A=>{z||(z=!0,P(),A?I(m,[C]):I(h,[C]),C._leaveCb=void 0,S[B]===e&&delete S[B])};S[B]=e,f?(f(C,$),f.length<=1&&$()):$()},clone(C){return Ro(C,t,n,r)}};return L}function uo(e){if(rr(e))return e=ln(e),e.children=null,e}function as(e){return rr(e)?e.children?e.children[0]:void 0:e}function Lo(e,t){e.shapeFlag&6&&e.component?Lo(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function $l(e,t=!1){let n=[],r=0;for(let o=0;o<e.length;o++){const i=e[o];i.type===Fe?(i.patchFlag&128&&r++,n=n.concat($l(i.children,t))):(t||i.type!==Qe)&&n.push(i)}if(r>1)for(let o=0;o<n.length;o++)n[o].patchFlag=-2;return n}function Ye(e){return oe(e)?{setup:e,name:e.name}:e}const kr=e=>!!e.type.__asyncLoader;function ce(e){oe(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:r,delay:o=200,timeout:i,suspensible:s=!0,onError:a}=e;let l=null,c,u=0;const d=()=>(u++,l=null,f()),f=()=>{let h;return l||(h=l=t().catch(m=>{if(m=m instanceof Error?m:new Error(String(m)),a)return new Promise((g,v)=>{a(m,()=>g(d()),()=>v(m),u+1)});throw m}).then(m=>h!==l&&l?l:(m&&(m.__esModule||m[Symbol.toStringTag]==="Module")&&(m=m.default),c=m,m)))};return Ye({name:"AsyncComponentWrapper",__asyncLoader:f,get __asyncResolved(){return c},setup(){const h=Ie;if(c)return()=>fo(c,h);const m=E=>{l=null,nr(E,h,13,!r)};if(s&&h.suspense||un)return f().then(E=>()=>fo(E,h)).catch(E=>(m(E),()=>r?Se(r,{error:E}):null));const g=Ne(!1),v=Ne(),_=Ne(!!o);return o&&setTimeout(()=>{_.value=!1},o),i!=null&&setTimeout(()=>{if(!g.value&&!v.value){const E=new Error(`Async component timed out after ${i}ms.`);m(E),v.value=E}},i),f().then(()=>{g.value=!0,h.parent&&rr(h.parent.vnode)&&wi(h.parent.update)}).catch(E=>{m(E),v.value=E}),()=>{if(g.value&&c)return fo(c,h);if(v.value&&r)return Se(r,{error:v.value});if(n&&!_.value)return Se(n)}}})}function fo(e,{vnode:{ref:t,props:n,children:r}}){const o=Se(e,n,r);return o.ref=t,o}const rr=e=>e.type.__isKeepAlive;function Uf(e,t){Ul(e,"a",t)}function qf(e,t){Ul(e,"da",t)}function Ul(e,t,n=Ie){const r=e.__wdc||(e.__wdc=()=>{let o=n;for(;o;){if(o.isDeactivated)return;o=o.parent}return e()});if(Xr(t,r,n),n){let o=n.parent;for(;o&&o.parent;)rr(o.parent.vnode)&&Vf(r,t,n,o),o=o.parent}}function Vf(e,t,n,r){const o=Xr(t,e,r,!0);Ai(()=>{ui(r[t],o)},n)}function Xr(e,t,n=Ie,r=!1){if(n){const o=n[e]||(n[e]=[]),i=t.__weh||(t.__weh=(...s)=>{if(n.isUnmounted)return;hn(),cn(n);const a=Je(t,n,e,s);return Ut(),vn(),a});return r?o.unshift(i):o.push(i),i}}const mt=e=>(t,n=Ie)=>(!un||e==="sp")&&Xr(e,t,n),Kf=mt("bm"),at=mt("m"),Wf=mt("bu"),Jf=mt("u"),Ci=mt("bum"),Ai=mt("um"),Qf=mt("sp"),Yf=mt("rtg"),Zf=mt("rtc");function Gf(e,t=Ie){Xr("ec",e,t)}let No=!0;function Xf(e){const t=Vl(e),n=e.proxy,r=e.ctx;No=!1,t.beforeCreate&&ls(t.beforeCreate,e,"bc");const{data:o,computed:i,methods:s,watch:a,provide:l,inject:c,created:u,beforeMount:d,mounted:f,beforeUpdate:h,updated:m,activated:g,deactivated:v,beforeDestroy:_,beforeUnmount:E,destroyed:O,unmounted:S,render:I,renderTracked:L,renderTriggered:C,errorCaptured:P,serverPrefetch:B,expose:z,inheritAttrs:$,components:A,directives:F,filters:Q}=t;if(c&&ed(c,r,null,e.appContext.config.unwrapInjectedRef),s)for(const ee in s){const te=s[ee];oe(te)&&(r[ee]=te.bind(n))}if(o){const ee=o.call(n,n);Ce(ee)&&(e.data=gn(ee))}if(No=!0,i)for(const ee in i){const te=i[ee],Ee=oe(te)?te.bind(n,n):oe(te.get)?te.get.bind(n,n):Xe,Pe=!oe(te)&&oe(te.set)?te.set.bind(n):Xe,Ae=Oe({get:Ee,set:Pe});Object.defineProperty(r,ee,{enumerable:!0,configurable:!0,get:()=>Ae.value,set:we=>Ae.value=we})}if(a)for(const ee in a)ql(a[ee],r,n,ee);if(l){const ee=oe(l)?l.call(n):l;Reflect.ownKeys(ee).forEach(te=>{Bt(te,ee[te])})}u&&ls(u,e,"c");function W(ee,te){G(te)?te.forEach(Ee=>ee(Ee.bind(n))):te&&ee(te.bind(n))}if(W(Kf,d),W(at,f),W(Wf,h),W(Jf,m),W(Uf,g),W(qf,v),W(Gf,P),W(Zf,L),W(Yf,C),W(Ci,E),W(Ai,S),W(Qf,B),G(z))if(z.length){const ee=e.exposed||(e.exposed={});z.forEach(te=>{Object.defineProperty(ee,te,{get:()=>n[te],set:Ee=>n[te]=Ee})})}else e.exposed||(e.exposed={});I&&e.render===Xe&&(e.render=I),$!=null&&(e.inheritAttrs=$),A&&(e.components=A),F&&(e.directives=F)}function ed(e,t,n=Xe,r=!1){G(e)&&(e=Mo(e));for(const o in e){const i=e[o];let s;Ce(i)?"default"in i?s=je(i.from||o,i.default,!0):s=je(i.from||o):s=je(i),xe(s)&&r?Object.defineProperty(t,o,{enumerable:!0,configurable:!0,get:()=>s.value,set:a=>s.value=a}):t[o]=s}}function ls(e,t,n){Je(G(e)?e.map(r=>r.bind(t.proxy)):e.bind(t.proxy),t,n)}function ql(e,t,n,r){const o=r.includes(".")?Fl(n,r):()=>n[r];if(me(e)){const i=t[e];oe(i)&&et(o,i)}else if(oe(e))et(o,e.bind(n));else if(Ce(e))if(G(e))e.forEach(i=>ql(i,t,n,r));else{const i=oe(e.handler)?e.handler.bind(n):t[e.handler];oe(i)&&et(o,i,e)}}function Vl(e){const t=e.type,{mixins:n,extends:r}=t,{mixins:o,optionsCache:i,config:{optionMergeStrategies:s}}=e.appContext,a=i.get(t);let l;return a?l=a:!o.length&&!n&&!r?l=t:(l={},o.length&&o.forEach(c=>Dr(l,c,s,!0)),Dr(l,t,s)),i.set(t,l),l}function Dr(e,t,n,r=!1){const{mixins:o,extends:i}=t;i&&Dr(e,i,n,!0),o&&o.forEach(s=>Dr(e,s,n,!0));for(const s in t)if(!(r&&s==="expose")){const a=td[s]||n&&n[s];e[s]=a?a(e[s],t[s]):t[s]}return e}const td={data:cs,props:Dt,emits:Dt,methods:Dt,computed:Dt,beforeCreate:Le,created:Le,beforeMount:Le,mounted:Le,beforeUpdate:Le,updated:Le,beforeDestroy:Le,beforeUnmount:Le,destroyed:Le,unmounted:Le,activated:Le,deactivated:Le,errorCaptured:Le,serverPrefetch:Le,components:Dt,directives:Dt,watch:rd,provide:cs,inject:nd};function cs(e,t){return t?e?function(){return ke(oe(e)?e.call(this,this):e,oe(t)?t.call(this,this):t)}:t:e}function nd(e,t){return Dt(Mo(e),Mo(t))}function Mo(e){if(G(e)){const t={};for(let n=0;n<e.length;n++)t[e[n]]=e[n];return t}return e}function Le(e,t){return e?[...new Set([].concat(e,t))]:t}function Dt(e,t){return e?ke(ke(Object.create(null),e),t):t}function rd(e,t){if(!e)return t;if(!t)return e;const n=ke(Object.create(null),e);for(const r in t)n[r]=Le(e[r],t[r]);return n}function od(e,t,n,r=!1){const o={},i={};Ir(i,to,1),e.propsDefaults=Object.create(null),Kl(e,t,o,i);for(const s in e.propsOptions[0])s in o||(o[s]=void 0);n?e.props=r?o:Ef(o):e.type.props?e.props=o:e.props=i,e.attrs=i}function id(e,t,n,r){const{props:o,attrs:i,vnode:{patchFlag:s}}=e,a=de(o),[l]=e.propsOptions;let c=!1;if((r||s>0)&&!(s&16)){if(s&8){const u=e.vnode.dynamicProps;for(let d=0;d<u.length;d++){let f=u[d];const h=t[f];if(l)if(ue(i,f))h!==i[f]&&(i[f]=h,c=!0);else{const m=st(f);o[m]=Ho(l,a,m,h,e,!1)}else h!==i[f]&&(i[f]=h,c=!0)}}}else{Kl(e,t,o,i)&&(c=!0);let u;for(const d in a)(!t||!ue(t,d)&&((u=qt(d))===d||!ue(t,u)))&&(l?n&&(n[d]!==void 0||n[u]!==void 0)&&(o[d]=Ho(l,a,d,void 0,e,!0)):delete o[d]);if(i!==a)for(const d in i)(!t||!ue(t,d)&&!0)&&(delete i[d],c=!0)}c&&pt(e,"set","$attrs")}function Kl(e,t,n,r){const[o,i]=e.propsOptions;let s=!1,a;if(t)for(let l in t){if(kn(l))continue;const c=t[l];let u;o&&ue(o,u=st(l))?!i||!i.includes(u)?n[u]=c:(a||(a={}))[u]=c:Pi(e.emitsOptions,l)||(!(l in r)||c!==r[l])&&(r[l]=c,s=!0)}if(i){const l=de(n),c=a||ge;for(let u=0;u<i.length;u++){const d=i[u];n[d]=Ho(o,l,d,c[d],e,!ue(c,d))}}return s}function Ho(e,t,n,r,o,i){const s=e[n];if(s!=null){const a=ue(s,"default");if(a&&r===void 0){const l=s.default;if(s.type!==Function&&oe(l)){const{propsDefaults:c}=o;n in c?r=c[n]:(cn(o),r=c[n]=l.call(null,t),Ut())}else r=l}s[0]&&(i&&!a?r=!1:s[1]&&(r===""||r===qt(n))&&(r=!0))}return r}function Wl(e,t,n=!1){const r=t.propsCache,o=r.get(e);if(o)return o;const i=e.props,s={},a=[];let l=!1;if(!oe(e)){const u=d=>{l=!0;const[f,h]=Wl(d,t,!0);ke(s,f),h&&a.push(...h)};!n&&t.mixins.length&&t.mixins.forEach(u),e.extends&&u(e.extends),e.mixins&&e.mixins.forEach(u)}if(!i&&!l)return r.set(e,on),on;if(G(i))for(let u=0;u<i.length;u++){const d=st(i[u]);us(d)&&(s[d]=ge)}else if(i)for(const u in i){const d=st(u);if(us(d)){const f=i[u],h=s[d]=G(f)||oe(f)?{type:f}:f;if(h){const m=ps(Boolean,h.type),g=ps(String,h.type);h[0]=m>-1,h[1]=g<0||m<g,(m>-1||ue(h,"default"))&&a.push(d)}}}const c=[s,a];return r.set(e,c),c}function us(e){return e[0]!=="$"}function fs(e){const t=e&&e.toString().match(/^\s*function (\w+)/);return t?t[1]:e===null?"null":""}function ds(e,t){return fs(e)===fs(t)}function ps(e,t){return G(t)?t.findIndex(n=>ds(n,e)):oe(t)&&ds(t,e)?0:-1}const Jl=e=>e[0]==="_"||e==="$stable",Ii=e=>G(e)?e.map(Ge):[Ge(e)],sd=(e,t,n)=>{const r=Rf((...o)=>Ii(t(...o)),n);return r._c=!1,r},Ql=(e,t,n)=>{const r=e._ctx;for(const o in e){if(Jl(o))continue;const i=e[o];if(oe(i))t[o]=sd(o,i,r);else if(i!=null){const s=Ii(i);t[o]=()=>s}}},Yl=(e,t)=>{const n=Ii(t);e.slots.default=()=>n},ad=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=de(t),Ir(t,"_",n)):Ql(t,e.slots={})}else e.slots={},t&&Yl(e,t);Ir(e.slots,to,1)},ld=(e,t,n)=>{const{vnode:r,slots:o}=e;let i=!0,s=ge;if(r.shapeFlag&32){const a=t._;a?n&&a===1?i=!1:(ke(o,t),!n&&a===1&&delete o._):(i=!t.$stable,Ql(t,o)),s=t}else t&&(Yl(e,t),s={default:1});if(i)for(const a in o)!Jl(a)&&!(a in s)&&delete o[a]};function A0(e,t){const n=Ue;if(n===null)return e;const r=n.proxy,o=e.dirs||(e.dirs=[]);for(let i=0;i<t.length;i++){let[s,a,l,c=ge]=t[i];oe(s)&&(s={mounted:s,updated:s}),s.deep&&Ht(a),o.push({dir:s,instance:r,value:a,oldValue:void 0,arg:l,modifiers:c})}return e}function nt(e,t,n,r){const o=e.dirs,i=t&&t.dirs;for(let s=0;s<o.length;s++){const a=o[s];i&&(a.oldValue=i[s].value);let l=a.dir[r];l&&(hn(),Je(l,n,8,[e.el,a,e,t]),vn())}}function Zl(){return{app:null,config:{isNativeTag:Hu,performance:!1,globalProperties:{},optionMergeStrategies:{},errorHandler:void 0,warnHandler:void 0,compilerOptions:{}},mixins:[],components:{},directives:{},provides:Object.create(null),optionsCache:new WeakMap,propsCache:new WeakMap,emitsCache:new WeakMap}}let cd=0;function ud(e,t){return function(r,o=null){o!=null&&!Ce(o)&&(o=null);const i=Zl(),s=new Set;let a=!1;const l=i.app={_uid:cd++,_component:r,_props:o,_container:null,_context:i,_instance:null,version:Dd,get config(){return i.config},set config(c){},use(c,...u){return s.has(c)||(c&&oe(c.install)?(s.add(c),c.install(l,...u)):oe(c)&&(s.add(c),c(l,...u))),l},mixin(c){return i.mixins.includes(c)||i.mixins.push(c),l},component(c,u){return u?(i.components[c]=u,l):i.components[c]},directive(c,u){return u?(i.directives[c]=u,l):i.directives[c]},mount(c,u,d){if(!a){const f=Se(r,o);return f.appContext=i,u&&t?t(f,c):e(f,c,d),a=!0,l._container=c,c.__vue_app__=l,Ri(f.component)||f.component.proxy}},unmount(){a&&(e(null,l._container),delete l._container.__vue_app__)},provide(c,u){return i.provides[c]=u,l}};return l}}function Rr(e,t,n,r,o=!1){if(G(e)){e.forEach((f,h)=>Rr(f,t&&(G(t)?t[h]:t),n,r,o));return}if(kr(r)&&!o)return;const i=r.shapeFlag&4?Ri(r.component)||r.component.proxy:r.el,s=o?null:i,{i:a,r:l}=e,c=t&&t.r,u=a.refs===ge?a.refs={}:a.refs,d=a.setupState;if(c!=null&&c!==l&&(me(c)?(u[c]=null,ue(d,c)&&(d[c]=null)):xe(c)&&(c.value=null)),oe(l))Pt(l,a,12,[s,u]);else{const f=me(l),h=xe(l);if(f||h){const m=()=>{if(e.f){const g=f?u[l]:l.value;o?G(g)&&ui(g,i):G(g)?g.includes(i)||g.push(i):f?u[l]=[i]:(l.value=[i],e.k&&(u[e.k]=l.value))}else f?(u[l]=s,ue(d,l)&&(d[l]=s)):xe(l)&&(l.value=s,e.k&&(u[e.k]=s))};s?(m.id=-1,He(m,n)):m()}}}let vt=!1;const fr=e=>/svg/.test(e.namespaceURI)&&e.tagName!=="foreignObject",po=e=>e.nodeType===8;function fd(e){const{mt:t,p:n,o:{patchProp:r,nextSibling:o,parentNode:i,remove:s,insert:a,createComment:l}}=e,c=(v,_)=>{if(!_.hasChildNodes()){n(null,v,_),jr();return}vt=!1,u(_.firstChild,v,null,null,null),jr(),vt&&console.error("Hydration completed but contains mismatches.")},u=(v,_,E,O,S,I=!1)=>{const L=po(v)&&v.data==="[",C=()=>m(v,_,E,O,S,L),{type:P,ref:B,shapeFlag:z}=_,$=v.nodeType;_.el=v;let A=null;switch(P){case Wn:$!==3?A=C():(v.data!==_.children&&(vt=!0,v.data=_.children),A=o(v));break;case Qe:$!==8||L?A=C():A=o(v);break;case Nn:if($!==1)A=C();else{A=v;const F=!_.children.length;for(let Q=0;Q<_.staticCount;Q++)F&&(_.children+=A.outerHTML),Q===_.staticCount-1&&(_.anchor=A),A=o(A);return A}break;case Fe:L?A=h(v,_,E,O,S,I):A=C();break;default:if(z&1)$!==1||_.type.toLowerCase()!==v.tagName.toLowerCase()?A=C():A=d(v,_,E,O,S,I);else if(z&6){_.slotScopeIds=S;const F=i(v);if(t(_,F,null,E,O,fr(F),I),A=L?g(v):o(v),kr(_)){let Q;L?(Q=Se(Fe),Q.anchor=A?A.previousSibling:F.lastChild):Q=v.nodeType===3?Ti(""):Se("div"),Q.el=v,_.component.subTree=Q}}else z&64?$!==8?A=C():A=_.type.hydrate(v,_,E,O,S,I,e,f):z&128&&(A=_.type.hydrate(v,_,E,O,fr(i(v)),S,I,e,u))}return B!=null&&Rr(B,null,O,_),A},d=(v,_,E,O,S,I)=>{I=I||!!_.dynamicChildren;const{type:L,props:C,patchFlag:P,shapeFlag:B,dirs:z}=_,$=L==="input"&&z||L==="option";if($||P!==-1){if(z&&nt(_,null,E,"created"),C)if($||!I||P&48)for(const F in C)($&&F.endsWith("value")||tr(F)&&!kn(F))&&r(v,F,null,C[F],!1,void 0,E);else C.onClick&&r(v,"onClick",null,C.onClick,!1,void 0,E);let A;if((A=C&&C.onVnodeBeforeMount)&&Ke(A,E,_),z&&nt(_,null,E,"beforeMount"),((A=C&&C.onVnodeMounted)||z)&&Ml(()=>{A&&Ke(A,E,_),z&&nt(_,null,E,"mounted")},O),B&16&&!(C&&(C.innerHTML||C.textContent))){let F=f(v.firstChild,_,v,E,O,S,I);for(;F;){vt=!0;const Q=F;F=F.nextSibling,s(Q)}}else B&8&&v.textContent!==_.children&&(vt=!0,v.textContent=_.children)}return v.nextSibling},f=(v,_,E,O,S,I,L)=>{L=L||!!_.dynamicChildren;const C=_.children,P=C.length;for(let B=0;B<P;B++){const z=L?C[B]:C[B]=Ge(C[B]);if(v)v=u(v,z,O,S,I,L);else{if(z.type===Wn&&!z.children)continue;vt=!0,n(null,z,E,null,O,S,fr(E),I)}}return v},h=(v,_,E,O,S,I)=>{const{slotScopeIds:L}=_;L&&(S=S?S.concat(L):L);const C=i(v),P=f(o(v),_,C,E,O,S,I);return P&&po(P)&&P.data==="]"?o(_.anchor=P):(vt=!0,a(_.anchor=l("]"),C,P),P)},m=(v,_,E,O,S,I)=>{if(vt=!0,_.el=null,I){const P=g(v);for(;;){const B=o(v);if(B&&B!==P)s(B);else break}}const L=o(v),C=i(v);return s(v),n(null,_,C,L,E,O,fr(C),S),L},g=v=>{let _=0;for(;v;)if(v=o(v),v&&po(v)&&(v.data==="["&&_++,v.data==="]")){if(_===0)return o(v);_--}return v};return[c,u]}const He=Ml;function dd(e){return pd(e,fd)}function pd(e,t){const n=qu();n.__VUE__=!0;const{insert:r,remove:o,patchProp:i,createElement:s,createText:a,createComment:l,setText:c,setElementText:u,parentNode:d,nextSibling:f,setScopeId:h=Xe,cloneNode:m,insertStaticContent:g}=e,v=(p,y,w,x=null,T=null,k=null,M=!1,D=null,H=!!y.dynamicChildren)=>{if(p===y)return;p&&!Nt(p,y)&&(x=q(p),Te(p,T,k,!0),p=null),y.patchFlag===-2&&(H=!1,y.dynamicChildren=null);const{type:R,ref:J,shapeFlag:K}=y;switch(R){case Wn:_(p,y,w,x);break;case Qe:E(p,y,w,x);break;case Nn:p==null&&O(y,w,x,M);break;case Fe:F(p,y,w,x,T,k,M,D,H);break;default:K&1?L(p,y,w,x,T,k,M,D,H):K&6?Q(p,y,w,x,T,k,M,D,H):(K&64||K&128)&&R.process(p,y,w,x,T,k,M,D,H,pe)}J!=null&&T&&Rr(J,p&&p.ref,k,y||p,!y)},_=(p,y,w,x)=>{if(p==null)r(y.el=a(y.children),w,x);else{const T=y.el=p.el;y.children!==p.children&&c(T,y.children)}},E=(p,y,w,x)=>{p==null?r(y.el=l(y.children||""),w,x):y.el=p.el},O=(p,y,w,x)=>{[p.el,p.anchor]=g(p.children,y,w,x,p.el,p.anchor)},S=({el:p,anchor:y},w,x)=>{let T;for(;p&&p!==y;)T=f(p),r(p,w,x),p=T;r(y,w,x)},I=({el:p,anchor:y})=>{let w;for(;p&&p!==y;)w=f(p),o(p),p=w;o(y)},L=(p,y,w,x,T,k,M,D,H)=>{M=M||y.type==="svg",p==null?C(y,w,x,T,k,M,D,H):z(p,y,T,k,M,D,H)},C=(p,y,w,x,T,k,M,D)=>{let H,R;const{type:J,props:K,shapeFlag:V,transition:Z,patchFlag:ie,dirs:ye}=p;if(p.el&&m!==void 0&&ie===-1)H=p.el=m(p.el);else{if(H=p.el=s(p.type,k,K&&K.is,K),V&8?u(H,p.children):V&16&&B(p.children,H,null,x,T,k&&J!=="foreignObject",M,D),ye&&nt(p,null,x,"created"),K){for(const _e in K)_e!=="value"&&!kn(_e)&&i(H,_e,null,K[_e],k,p.children,x,T,N);"value"in K&&i(H,"value",null,K.value),(R=K.onVnodeBeforeMount)&&Ke(R,x,p)}P(H,p,p.scopeId,M,x)}ye&&nt(p,null,x,"beforeMount");const he=(!T||T&&!T.pendingBranch)&&Z&&!Z.persisted;he&&Z.beforeEnter(H),r(H,y,w),((R=K&&K.onVnodeMounted)||he||ye)&&He(()=>{R&&Ke(R,x,p),he&&Z.enter(H),ye&&nt(p,null,x,"mounted")},T)},P=(p,y,w,x,T)=>{if(w&&h(p,w),x)for(let k=0;k<x.length;k++)h(p,x[k]);if(T){let k=T.subTree;if(y===k){const M=T.vnode;P(p,M,M.scopeId,M.slotScopeIds,T.parent)}}},B=(p,y,w,x,T,k,M,D,H=0)=>{for(let R=H;R<p.length;R++){const J=p[R]=D?Et(p[R]):Ge(p[R]);v(null,J,y,w,x,T,k,M,D)}},z=(p,y,w,x,T,k,M)=>{const D=y.el=p.el;let{patchFlag:H,dynamicChildren:R,dirs:J}=y;H|=p.patchFlag&16;const K=p.props||ge,V=y.props||ge;let Z;w&&xt(w,!1),(Z=V.onVnodeBeforeUpdate)&&Ke(Z,w,y,p),J&&nt(y,p,w,"beforeUpdate"),w&&xt(w,!0);const ie=T&&y.type!=="foreignObject";if(R?$(p.dynamicChildren,R,D,w,x,ie,k):M||Ee(p,y,D,null,w,x,ie,k,!1),H>0){if(H&16)A(D,y,K,V,w,x,T);else if(H&2&&K.class!==V.class&&i(D,"class",null,V.class,T),H&4&&i(D,"style",K.style,V.style,T),H&8){const ye=y.dynamicProps;for(let he=0;he<ye.length;he++){const _e=ye[he],Ze=K[_e],Vt=V[_e];(Vt!==Ze||_e==="value")&&i(D,_e,Ze,Vt,T,p.children,w,x,N)}}H&1&&p.children!==y.children&&u(D,y.children)}else!M&&R==null&&A(D,y,K,V,w,x,T);((Z=V.onVnodeUpdated)||J)&&He(()=>{Z&&Ke(Z,w,y,p),J&&nt(y,p,w,"updated")},x)},$=(p,y,w,x,T,k,M)=>{for(let D=0;D<y.length;D++){const H=p[D],R=y[D],J=H.el&&(H.type===Fe||!Nt(H,R)||H.shapeFlag&70)?d(H.el):w;v(H,R,J,null,x,T,k,M,!0)}},A=(p,y,w,x,T,k,M)=>{if(w!==x){for(const D in x){if(kn(D))continue;const H=x[D],R=w[D];H!==R&&D!=="value"&&i(p,D,R,H,M,y.children,T,k,N)}if(w!==ge)for(const D in w)!kn(D)&&!(D in x)&&i(p,D,w[D],null,M,y.children,T,k,N);"value"in x&&i(p,"value",w.value,x.value)}},F=(p,y,w,x,T,k,M,D,H)=>{const R=y.el=p?p.el:a(""),J=y.anchor=p?p.anchor:a("");let{patchFlag:K,dynamicChildren:V,slotScopeIds:Z}=y;Z&&(D=D?D.concat(Z):Z),p==null?(r(R,w,x),r(J,w,x),B(y.children,w,J,T,k,M,D,H)):K>0&&K&64&&V&&p.dynamicChildren?($(p.dynamicChildren,V,w,T,k,M,D),(y.key!=null||T&&y===T.subTree)&&xi(p,y,!0)):Ee(p,y,w,J,T,k,M,D,H)},Q=(p,y,w,x,T,k,M,D,H)=>{y.slotScopeIds=D,p==null?y.shapeFlag&512?T.ctx.activate(y,w,x,M,H):se(y,w,x,T,k,M,H):W(p,y,H)},se=(p,y,w,x,T,k,M)=>{const D=p.component=Cd(p,x,T);if(rr(p)&&(D.ctx.renderer=pe),Ad(D),D.asyncDep){if(T&&T.registerDep(D,ee),!p.el){const H=D.subTree=Se(Qe);E(null,H,y,w)}return}ee(D,p,y,w,T,k,M)},W=(p,y,w)=>{const x=y.component=p.component;if(Mf(p,y,w))if(x.asyncDep&&!x.asyncResolved){te(x,y,w);return}else x.next=y,jf(x.update),x.update();else y.component=p.component,y.el=p.el,x.vnode=y},ee=(p,y,w,x,T,k,M)=>{const D=()=>{if(p.isMounted){let{next:J,bu:K,u:V,parent:Z,vnode:ie}=p,ye=J,he;xt(p,!1),J?(J.el=ie.el,te(p,J,M)):J=ie,K&&lo(K),(he=J.props&&J.props.onVnodeBeforeUpdate)&&Ke(he,Z,J,ie),xt(p,!0);const _e=co(p),Ze=p.subTree;p.subTree=_e,v(Ze,_e,d(Ze.el),q(Ze),p,T,k),J.el=_e.el,ye===null&&Hf(p,_e.el),V&&He(V,T),(he=J.props&&J.props.onVnodeUpdated)&&He(()=>Ke(he,Z,J,ie),T)}else{let J;const{el:K,props:V}=y,{bm:Z,m:ie,parent:ye}=p,he=kr(y);if(xt(p,!1),Z&&lo(Z),!he&&(J=V&&V.onVnodeBeforeMount)&&Ke(J,ye,y),xt(p,!0),K&&X){const _e=()=>{p.subTree=co(p),X(K,p.subTree,p,T,null)};he?y.type.__asyncLoader().then(()=>!p.isUnmounted&&_e()):_e()}else{const _e=p.subTree=co(p);v(null,_e,w,x,p,T,k),y.el=_e.el}if(ie&&He(ie,T),!he&&(J=V&&V.onVnodeMounted)){const _e=y;He(()=>Ke(J,ye,_e),T)}y.shapeFlag&256&&p.a&&He(p.a,T),p.isMounted=!0,y=w=x=null}},H=p.effect=new mi(D,()=>wi(p.update),p.scope),R=p.update=H.run.bind(H);R.id=p.uid,xt(p,!0),R()},te=(p,y,w)=>{y.component=p;const x=p.vnode.props;p.vnode=y,p.next=null,id(p,y.props,x,w),ld(p,y.children,w),hn(),Si(void 0,p.update),vn()},Ee=(p,y,w,x,T,k,M,D,H=!1)=>{const R=p&&p.children,J=p?p.shapeFlag:0,K=y.children,{patchFlag:V,shapeFlag:Z}=y;if(V>0){if(V&128){Ae(R,K,w,x,T,k,M,D,H);return}else if(V&256){Pe(R,K,w,x,T,k,M,D,H);return}}Z&8?(J&16&&N(R,T,k),K!==R&&u(w,K)):J&16?Z&16?Ae(R,K,w,x,T,k,M,D,H):N(R,T,k,!0):(J&8&&u(w,""),Z&16&&B(K,w,x,T,k,M,D,H))},Pe=(p,y,w,x,T,k,M,D,H)=>{p=p||on,y=y||on;const R=p.length,J=y.length,K=Math.min(R,J);let V;for(V=0;V<K;V++){const Z=y[V]=H?Et(y[V]):Ge(y[V]);v(p[V],Z,w,null,T,k,M,D,H)}R>J?N(p,T,k,!0,!1,K):B(y,w,x,T,k,M,D,H,K)},Ae=(p,y,w,x,T,k,M,D,H)=>{let R=0;const J=y.length;let K=p.length-1,V=J-1;for(;R<=K&&R<=V;){const Z=p[R],ie=y[R]=H?Et(y[R]):Ge(y[R]);if(Nt(Z,ie))v(Z,ie,w,null,T,k,M,D,H);else break;R++}for(;R<=K&&R<=V;){const Z=p[K],ie=y[V]=H?Et(y[V]):Ge(y[V]);if(Nt(Z,ie))v(Z,ie,w,null,T,k,M,D,H);else break;K--,V--}if(R>K){if(R<=V){const Z=V+1,ie=Z<J?y[Z].el:x;for(;R<=V;)v(null,y[R]=H?Et(y[R]):Ge(y[R]),w,ie,T,k,M,D,H),R++}}else if(R>V)for(;R<=K;)Te(p[R],T,k,!0),R++;else{const Z=R,ie=R,ye=new Map;for(R=ie;R<=V;R++){const Be=y[R]=H?Et(y[R]):Ge(y[R]);Be.key!=null&&ye.set(Be.key,R)}let he,_e=0;const Ze=V-ie+1;let Vt=!1,Wi=0;const bn=new Array(Ze);for(R=0;R<Ze;R++)bn[R]=0;for(R=Z;R<=K;R++){const Be=p[R];if(_e>=Ze){Te(Be,T,k,!0);continue}let tt;if(Be.key!=null)tt=ye.get(Be.key);else for(he=ie;he<=V;he++)if(bn[he-ie]===0&&Nt(Be,y[he])){tt=he;break}tt===void 0?Te(Be,T,k,!0):(bn[tt-ie]=R+1,tt>=Wi?Wi=tt:Vt=!0,v(Be,y[tt],w,null,T,k,M,D,H),_e++)}const Ji=Vt?md(bn):on;for(he=Ji.length-1,R=Ze-1;R>=0;R--){const Be=ie+R,tt=y[Be],Qi=Be+1<J?y[Be+1].el:x;bn[R]===0?v(null,tt,w,Qi,T,k,M,D,H):Vt&&(he<0||R!==Ji[he]?we(tt,w,Qi,2):he--)}}},we=(p,y,w,x,T=null)=>{const{el:k,type:M,transition:D,children:H,shapeFlag:R}=p;if(R&6){we(p.component.subTree,y,w,x);return}if(R&128){p.suspense.move(y,w,x);return}if(R&64){M.move(p,y,w,pe);return}if(M===Fe){r(k,y,w);for(let K=0;K<H.length;K++)we(H[K],y,w,x);r(p.anchor,y,w);return}if(M===Nn){S(p,y,w);return}if(x!==2&&R&1&&D)if(x===0)D.beforeEnter(k),r(k,y,w),He(()=>D.enter(k),T);else{const{leave:K,delayLeave:V,afterLeave:Z}=D,ie=()=>r(k,y,w),ye=()=>{K(k,()=>{ie(),Z&&Z()})};V?V(k,ie,ye):ye()}else r(k,y,w)},Te=(p,y,w,x=!1,T=!1)=>{const{type:k,props:M,ref:D,children:H,dynamicChildren:R,shapeFlag:J,patchFlag:K,dirs:V}=p;if(D!=null&&Rr(D,null,w,p,!0),J&256){y.ctx.deactivate(p);return}const Z=J&1&&V,ie=!kr(p);let ye;if(ie&&(ye=M&&M.onVnodeBeforeUnmount)&&Ke(ye,y,p),J&6)U(p.component,w,x);else{if(J&128){p.suspense.unmount(w,x);return}Z&&nt(p,null,y,"beforeUnmount"),J&64?p.type.remove(p,y,w,T,pe,x):R&&(k!==Fe||K>0&&K&64)?N(R,y,w,!1,!0):(k===Fe&&K&384||!T&&J&16)&&N(H,y,w),x&&ze(p)}(ie&&(ye=M&&M.onVnodeUnmounted)||Z)&&He(()=>{ye&&Ke(ye,y,p),Z&&nt(p,null,y,"unmounted")},w)},ze=p=>{const{type:y,el:w,anchor:x,transition:T}=p;if(y===Fe){j(w,x);return}if(y===Nn){I(p);return}const k=()=>{o(w),T&&!T.persisted&&T.afterLeave&&T.afterLeave()};if(p.shapeFlag&1&&T&&!T.persisted){const{leave:M,delayLeave:D}=T,H=()=>M(w,k);D?D(p.el,k,H):H()}else k()},j=(p,y)=>{let w;for(;p!==y;)w=f(p),o(p),p=w;o(y)},U=(p,y,w)=>{const{bum:x,scope:T,update:k,subTree:M,um:D}=p;x&&lo(x),T.stop(),k&&(k.active=!1,Te(M,p,y,w)),D&&He(D,y),He(()=>{p.isUnmounted=!0},y),y&&y.pendingBranch&&!y.isUnmounted&&p.asyncDep&&!p.asyncResolved&&p.suspenseId===y.pendingId&&(y.deps--,y.deps===0&&y.resolve())},N=(p,y,w,x=!1,T=!1,k=0)=>{for(let M=k;M<p.length;M++)Te(p[M],y,w,x,T)},q=p=>p.shapeFlag&6?q(p.component.subTree):p.shapeFlag&128?p.suspense.next():f(p.anchor||p.el),le=(p,y,w)=>{p==null?y._vnode&&Te(y._vnode,null,null,!0):v(y._vnode||null,p,y,null,null,null,w),jr(),y._vnode=p},pe={p:v,um:Te,m:we,r:ze,mt:se,mc:B,pc:Ee,pbc:$,n:q,o:e};let re,X;return t&&([re,X]=t(pe)),{render:le,hydrate:re,createApp:ud(le,re)}}function xt({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function xi(e,t,n=!1){const r=e.children,o=t.children;if(G(r)&&G(o))for(let i=0;i<r.length;i++){const s=r[i];let a=o[i];a.shapeFlag&1&&!a.dynamicChildren&&((a.patchFlag<=0||a.patchFlag===32)&&(a=o[i]=Et(o[i]),a.el=s.el),n||xi(s,a))}}function md(e){const t=e.slice(),n=[0];let r,o,i,s,a;const l=e.length;for(r=0;r<l;r++){const c=e[r];if(c!==0){if(o=n[n.length-1],e[o]<c){t[r]=o,n.push(r);continue}for(i=0,s=n.length-1;i<s;)a=i+s>>1,e[n[a]]<c?i=a+1:s=a;c<e[n[i]]&&(i>0&&(t[r]=n[i-1]),n[i]=r)}}for(i=n.length,s=n[i-1];i-- >0;)n[i]=s,s=t[s];return n}const hd=e=>e.__isTeleport,Ln=e=>e&&(e.disabled||e.disabled===""),ms=e=>typeof SVGElement!="undefined"&&e instanceof SVGElement,Fo=(e,t)=>{const n=e&&e.to;return me(n)?t?t(n):null:n},vd={__isTeleport:!0,process(e,t,n,r,o,i,s,a,l,c){const{mc:u,pc:d,pbc:f,o:{insert:h,querySelector:m,createText:g,createComment:v}}=c,_=Ln(t.props);let{shapeFlag:E,children:O,dynamicChildren:S}=t;if(e==null){const I=t.el=g(""),L=t.anchor=g("");h(I,n,r),h(L,n,r);const C=t.target=Fo(t.props,m),P=t.targetAnchor=g("");C&&(h(P,C),s=s||ms(C));const B=(z,$)=>{E&16&&u(O,z,$,o,i,s,a,l)};_?B(n,L):C&&B(C,P)}else{t.el=e.el;const I=t.anchor=e.anchor,L=t.target=e.target,C=t.targetAnchor=e.targetAnchor,P=Ln(e.props),B=P?n:L,z=P?I:C;if(s=s||ms(L),S?(f(e.dynamicChildren,S,B,o,i,s,a),xi(e,t,!0)):l||d(e,t,B,z,o,i,s,a,!1),_)P||dr(t,n,I,c,1);else if((t.props&&t.props.to)!==(e.props&&e.props.to)){const $=t.target=Fo(t.props,m);$&&dr(t,$,null,c,0)}else P&&dr(t,L,C,c,1)}},remove(e,t,n,r,{um:o,o:{remove:i}},s){const{shapeFlag:a,children:l,anchor:c,targetAnchor:u,target:d,props:f}=e;if(d&&i(u),(s||!Ln(f))&&(i(c),a&16))for(let h=0;h<l.length;h++){const m=l[h];o(m,t,n,!0,!!m.dynamicChildren)}},move:dr,hydrate:gd};function dr(e,t,n,{o:{insert:r},m:o},i=2){i===0&&r(e.targetAnchor,t,n);const{el:s,anchor:a,shapeFlag:l,children:c,props:u}=e,d=i===2;if(d&&r(s,t,n),(!d||Ln(u))&&l&16)for(let f=0;f<c.length;f++)o(c[f],t,n,2);d&&r(a,t,n)}function gd(e,t,n,r,o,i,{o:{nextSibling:s,parentNode:a,querySelector:l}},c){const u=t.target=Fo(t.props,l);if(u){const d=u._lpa||u.firstChild;t.shapeFlag&16&&(Ln(t.props)?(t.anchor=c(s(e),t,a(e),n,r,o,i),t.targetAnchor=d):(t.anchor=s(e),t.targetAnchor=c(d,t,u,n,r,o,i)),u._lpa=t.targetAnchor&&s(t.targetAnchor))}return t.anchor&&s(t.anchor)}const I0=vd,ji="components";function _d(e,t){return Xl(ji,e,!0,t)||e}const Gl=Symbol();function x0(e){return me(e)?Xl(ji,e,!1)||e:e||Gl}function Xl(e,t,n=!0,r=!1){const o=Ue||Ie;if(o){const i=o.type;if(e===ji){const a=jd(i);if(a&&(a===t||a===st(t)||a===Zr(st(t))))return i}const s=hs(o[e]||i[e],t)||hs(o.appContext[e],t);return!s&&r?i:s}}function hs(e,t){return e&&(e[t]||e[st(t)]||e[Zr(st(t))])}const Fe=Symbol(void 0),Wn=Symbol(void 0),Qe=Symbol(void 0),Nn=Symbol(void 0),Mn=[];let $t=null;function eo(e=!1){Mn.push($t=e?null:[])}function yd(){Mn.pop(),$t=Mn[Mn.length-1]||null}let Lr=1;function vs(e){Lr+=e}function ec(e){return e.dynamicChildren=Lr>0?$t||on:null,yd(),Lr>0&&$t&&$t.push(e),e}function tc(e,t,n,r,o,i){return ec(oc(e,t,n,r,o,i,!0))}function nc(e,t,n,r,o){return ec(Se(e,t,n,r,o,!0))}function Nr(e){return e?e.__v_isVNode===!0:!1}function Nt(e,t){return e.type===t.type&&e.key===t.key}const to="__vInternal",rc=({key:e})=>e!=null?e:null,Er=({ref:e,ref_key:t,ref_for:n})=>e!=null?me(e)||xe(e)||oe(e)?{i:Ue,r:e,k:t,f:!!n}:e:null;function oc(e,t=null,n=null,r=0,o=null,i=e===Fe?0:1,s=!1,a=!1){const l={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&rc(t),ref:t&&Er(t),scopeId:Nl,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:i,patchFlag:r,dynamicProps:o,dynamicChildren:null,appContext:null};return a?(ki(l,n),i&128&&e.normalize(l)):n&&(l.shapeFlag|=me(n)?8:16),Lr>0&&!s&&$t&&(l.patchFlag>0||i&6)&&l.patchFlag!==32&&$t.push(l),l}const Se=bd;function bd(e,t=null,n=null,r=0,o=null,i=!1){if((!e||e===Gl)&&(e=Qe),Nr(e)){const a=ln(e,t,!0);return n&&ki(a,n),a}if(Td(e)&&(e=e.__vccOpts),t){t=Ed(t);let{class:a,style:l}=t;a&&!me(a)&&(t.class=mn(a)),Ce(l)&&(Sl(l)&&!G(l)&&(l=ke({},l)),t.style=er(l))}const s=me(e)?1:Ff(e)?128:hd(e)?64:Ce(e)?4:oe(e)?2:0;return oc(e,t,n,r,o,s,i,!0)}function Ed(e){return e?Sl(e)||to in e?ke({},e):e:null}function ln(e,t,n=!1){const{props:r,ref:o,patchFlag:i,children:s}=e,a=t?Od(r||{},t):r;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:a,key:a&&rc(a),ref:t&&t.ref?n&&o?G(o)?o.concat(Er(t)):[o,Er(t)]:Er(t):o,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:s,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==Fe?i===-1?16:i|16:i,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&ln(e.ssContent),ssFallback:e.ssFallback&&ln(e.ssFallback),el:e.el,anchor:e.anchor}}function Ti(e=" ",t=0){return Se(Wn,null,e,t)}function j0(e,t){const n=Se(Nn,null,e);return n.staticCount=t,n}function T0(e="",t=!1){return t?(eo(),nc(Qe,null,e)):Se(Qe,null,e)}function Ge(e){return e==null||typeof e=="boolean"?Se(Qe):G(e)?Se(Fe,null,e.slice()):typeof e=="object"?Et(e):Se(Wn,null,String(e))}function Et(e){return e.el===null||e.memo?e:ln(e)}function ki(e,t){let n=0;const{shapeFlag:r}=e;if(t==null)t=null;else if(G(t))n=16;else if(typeof t=="object")if(r&65){const o=t.default;o&&(o._c&&(o._d=!1),ki(e,o()),o._c&&(o._d=!0));return}else{n=32;const o=t._;!o&&!(to in t)?t._ctx=Ue:o===3&&Ue&&(Ue.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else oe(t)?(t={default:t,_ctx:Ue},n=32):(t=String(t),r&64?(n=16,t=[Ti(t)]):n=8);e.children=t,e.shapeFlag|=n}function Od(...e){const t={};for(let n=0;n<e.length;n++){const r=e[n];for(const o in r)if(o==="class")t.class!==r.class&&(t.class=mn([t.class,r.class]));else if(o==="style")t.style=er([t.style,r.style]);else if(tr(o)){const i=t[o],s=r[o];s&&i!==s&&!(G(i)&&i.includes(s))&&(t[o]=i?[].concat(i,s):s)}else o!==""&&(t[o]=r[o])}return t}function Ke(e,t,n,r=null){Je(e,t,7,[n,r])}function k0(e,t,n,r){let o;const i=n&&n[r];if(G(e)||me(e)){o=new Array(e.length);for(let s=0,a=e.length;s<a;s++)o[s]=t(e[s],s,void 0,i&&i[s])}else if(typeof e=="number"){o=new Array(e);for(let s=0;s<e;s++)o[s]=t(s+1,s,void 0,i&&i[s])}else if(Ce(e))if(e[Symbol.iterator])o=Array.from(e,(s,a)=>t(s,a,void 0,i&&i[a]));else{const s=Object.keys(e);o=new Array(s.length);for(let a=0,l=s.length;a<l;a++){const c=s[a];o[a]=t(e[c],c,a,i&&i[a])}}else o=[];return n&&(n[r]=o),o}function D0(e,t){for(let n=0;n<t.length;n++){const r=t[n];if(G(r))for(let o=0;o<r.length;o++)e[r[o].name]=r[o].fn;else r&&(e[r.name]=r.fn)}return e}function ic(e,t,n={},r,o){if(Ue.isCE)return Se("slot",t==="default"?null:{name:t},r&&r());let i=e[t];i&&i._c&&(i._d=!1),eo();const s=i&&sc(i(n)),a=nc(Fe,{key:n.key||`_${t}`},s||(r?r():[]),s&&e._===1?64:-2);return!o&&a.scopeId&&(a.slotScopeIds=[a.scopeId+"-s"]),i&&i._c&&(i._d=!0),a}function sc(e){return e.some(t=>Nr(t)?!(t.type===Qe||t.type===Fe&&!sc(t.children)):!0)?e:null}const zo=e=>e?ac(e)?Ri(e)||e.proxy:zo(e.parent):null,Mr=ke(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>zo(e.parent),$root:e=>zo(e.root),$emit:e=>e.emit,$options:e=>Vl(e),$forceUpdate:e=>()=>wi(e.update),$nextTick:e=>Oi.bind(e.proxy),$watch:e=>zf.bind(e)}),wd={get({_:e},t){const{ctx:n,setupState:r,data:o,props:i,accessCache:s,type:a,appContext:l}=e;let c;if(t[0]!=="$"){const h=s[t];if(h!==void 0)switch(h){case 1:return r[t];case 2:return o[t];case 4:return n[t];case 3:return i[t]}else{if(r!==ge&&ue(r,t))return s[t]=1,r[t];if(o!==ge&&ue(o,t))return s[t]=2,o[t];if((c=e.propsOptions[0])&&ue(c,t))return s[t]=3,i[t];if(n!==ge&&ue(n,t))return s[t]=4,n[t];No&&(s[t]=0)}}const u=Mr[t];let d,f;if(u)return t==="$attrs"&&qe(e,"get",t),u(e);if((d=a.__cssModules)&&(d=d[t]))return d;if(n!==ge&&ue(n,t))return s[t]=4,n[t];if(f=l.config.globalProperties,ue(f,t))return f[t]},set({_:e},t,n){const{data:r,setupState:o,ctx:i}=e;return o!==ge&&ue(o,t)?(o[t]=n,!0):r!==ge&&ue(r,t)?(r[t]=n,!0):ue(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(i[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:r,appContext:o,propsOptions:i}},s){let a;return!!n[s]||e!==ge&&ue(e,s)||t!==ge&&ue(t,s)||(a=i[0])&&ue(a,s)||ue(r,s)||ue(Mr,s)||ue(o.config.globalProperties,s)},defineProperty(e,t,n){return n.get!=null?this.set(e,t,n.get(),null):n.value!=null&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}},Sd=Zl();let Pd=0;function Cd(e,t,n){const r=e.type,o=(t?t.appContext:e.appContext)||Sd,i={uid:Pd++,vnode:e,type:r,parent:t,appContext:o,root:null,next:null,subTree:null,effect:null,update:null,scope:new Vu(!0),render:null,proxy:null,exposed:null,exposeProxy:null,withProxy:null,provides:t?t.provides:Object.create(o.provides),accessCache:null,renderCache:[],components:null,directives:null,propsOptions:Wl(r,o),emitsOptions:Ll(r,o),emit:null,emitted:null,propsDefaults:ge,inheritAttrs:r.inheritAttrs,ctx:ge,data:ge,props:ge,attrs:ge,slots:ge,refs:ge,setupState:ge,setupContext:null,suspense:n,suspenseId:n?n.pendingId:0,asyncDep:null,asyncResolved:!1,isMounted:!1,isUnmounted:!1,isDeactivated:!1,bc:null,c:null,bm:null,m:null,bu:null,u:null,um:null,bum:null,da:null,a:null,rtg:null,rtc:null,ec:null,sp:null};return i.ctx={_:i},i.root=t?t.root:i,i.emit=Df.bind(null,i),e.ce&&e.ce(i),i}let Ie=null;const Di=()=>Ie||Ue,cn=e=>{Ie=e,e.scope.on()},Ut=()=>{Ie&&Ie.scope.off(),Ie=null};function ac(e){return e.vnode.shapeFlag&4}let un=!1;function Ad(e,t=!1){un=t;const{props:n,children:r}=e.vnode,o=ac(e);od(e,n,o,t),ad(e,r);const i=o?Id(e,t):void 0;return un=!1,i}function Id(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=Pl(new Proxy(e.ctx,wd));const{setup:r}=n;if(r){const o=e.setupContext=r.length>1?cc(e):null;cn(e),hn();const i=Pt(r,e,0,[e.props,o]);if(vn(),Ut(),cl(i)){if(i.then(Ut,Ut),t)return i.then(s=>{gs(e,s,t)}).catch(s=>{nr(s,e,0)});e.asyncDep=i}else gs(e,i,t)}else lc(e,t)}function gs(e,t,n){oe(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:Ce(t)&&(e.setupState=jl(t)),lc(e,n)}let _s;function lc(e,t,n){const r=e.type;if(!e.render){if(!t&&_s&&!r.render){const o=r.template;if(o){const{isCustomElement:i,compilerOptions:s}=e.appContext.config,{delimiters:a,compilerOptions:l}=r,c=ke(ke({isCustomElement:i,delimiters:a},s),l);r.render=_s(o,c)}}e.render=r.render||Xe}cn(e),hn(),Xf(e),vn(),Ut()}function xd(e){return new Proxy(e.attrs,{get(t,n){return qe(e,"get","$attrs"),t[n]}})}function cc(e){const t=r=>{e.exposed=r||{}};let n;return{get attrs(){return n||(n=xd(e))},slots:e.slots,emit:e.emit,expose:t}}function Ri(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(jl(Pl(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Mr)return Mr[n](e)}}))}function jd(e){return oe(e)&&e.displayName||e.name}function Td(e){return oe(e)&&"__vccOpts"in e}const Oe=(e,t)=>Af(e,t,un);function R0(){return kd().slots}function kd(){const e=Di();return e.setupContext||(e.setupContext=cc(e))}function be(e,t,n){const r=arguments.length;return r===2?Ce(t)&&!G(t)?Nr(t)?Se(e,null,[t]):Se(e,t):Se(e,null,t):(r>3?n=Array.prototype.slice.call(arguments,2):r===3&&Nr(n)&&(n=[n]),Se(e,t,n))}const Dd="3.2.31",Rd="http://www.w3.org/2000/svg",Mt=typeof document!="undefined"?document:null,ys=Mt&&Mt.createElement("template"),Ld={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{const o=t?Mt.createElementNS(Rd,e):Mt.createElement(e,n?{is:n}:void 0);return e==="select"&&r&&r.multiple!=null&&o.setAttribute("multiple",r.multiple),o},createText:e=>Mt.createTextNode(e),createComment:e=>Mt.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Mt.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},cloneNode(e){const t=e.cloneNode(!0);return"_value"in e&&(t._value=e._value),t},insertStaticContent(e,t,n,r,o,i){const s=n?n.previousSibling:t.lastChild;if(o&&(o===i||o.nextSibling))for(;t.insertBefore(o.cloneNode(!0),n),!(o===i||!(o=o.nextSibling)););else{ys.innerHTML=r?`<svg>${e}</svg>`:e;const a=ys.content;if(r){const l=a.firstChild;for(;l.firstChild;)a.appendChild(l.firstChild);a.removeChild(l)}t.insertBefore(a,n)}return[s?s.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}};function Nd(e,t,n){const r=e._vtc;r&&(t=(t?[t,...r]:[...r]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}function Md(e,t,n){const r=e.style,o=me(n);if(n&&!o){for(const i in n)Bo(r,i,n[i]);if(t&&!me(t))for(const i in t)n[i]==null&&Bo(r,i,"")}else{const i=r.display;o?t!==n&&(r.cssText=n):t&&e.removeAttribute("style"),"_vod"in e&&(r.display=i)}}const bs=/\s*!important$/;function Bo(e,t,n){if(G(n))n.forEach(r=>Bo(e,t,r));else if(t.startsWith("--"))e.setProperty(t,n);else{const r=Hd(e,t);bs.test(n)?e.setProperty(qt(r),n.replace(bs,""),"important"):e[r]=n}}const Es=["Webkit","Moz","ms"],mo={};function Hd(e,t){const n=mo[t];if(n)return n;let r=st(t);if(r!=="filter"&&r in e)return mo[t]=r;r=Zr(r);for(let o=0;o<Es.length;o++){const i=Es[o]+r;if(i in e)return mo[t]=i}return t}const Os="http://www.w3.org/1999/xlink";function Fd(e,t,n,r,o){if(r&&t.startsWith("xlink:"))n==null?e.removeAttributeNS(Os,t.slice(6,t.length)):e.setAttributeNS(Os,t,n);else{const i=Du(t);n==null||i&&!sl(n)?e.removeAttribute(t):e.setAttribute(t,i?"":n)}}function zd(e,t,n,r,o,i,s){if(t==="innerHTML"||t==="textContent"){r&&s(r,o,i),e[t]=n==null?"":n;return}if(t==="value"&&e.tagName!=="PROGRESS"&&!e.tagName.includes("-")){e._value=n;const a=n==null?"":n;(e.value!==a||e.tagName==="OPTION")&&(e.value=a),n==null&&e.removeAttribute(t);return}if(n===""||n==null){const a=typeof e[t];if(a==="boolean"){e[t]=sl(n);return}else if(n==null&&a==="string"){e[t]="",e.removeAttribute(t);return}else if(a==="number"){try{e[t]=0}catch{}e.removeAttribute(t);return}}try{e[t]=n}catch{}}let Hr=Date.now,uc=!1;if(typeof window!="undefined"){Hr()>document.createEvent("Event").timeStamp&&(Hr=()=>performance.now());const e=navigator.userAgent.match(/firefox\/(\d+)/i);uc=!!(e&&Number(e[1])<=53)}let $o=0;const Bd=Promise.resolve(),$d=()=>{$o=0},Ud=()=>$o||(Bd.then($d),$o=Hr());function qd(e,t,n,r){e.addEventListener(t,n,r)}function Vd(e,t,n,r){e.removeEventListener(t,n,r)}function Kd(e,t,n,r,o=null){const i=e._vei||(e._vei={}),s=i[t];if(r&&s)s.value=r;else{const[a,l]=Wd(t);if(r){const c=i[t]=Jd(r,o);qd(e,a,c,l)}else s&&(Vd(e,a,s,l),i[t]=void 0)}}const ws=/(?:Once|Passive|Capture)$/;function Wd(e){let t;if(ws.test(e)){t={};let n;for(;n=e.match(ws);)e=e.slice(0,e.length-n[0].length),t[n[0].toLowerCase()]=!0}return[qt(e.slice(2)),t]}function Jd(e,t){const n=r=>{const o=r.timeStamp||Hr();(uc||o>=n.attached-1)&&Je(Qd(r,n.value),t,5,[r])};return n.value=e,n.attached=Ud(),n}function Qd(e,t){if(G(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(r=>o=>!o._stopped&&r&&r(o))}else return t}const Ss=/^on[a-z]/,Yd=(e,t,n,r,o=!1,i,s,a,l)=>{t==="class"?Nd(e,r,o):t==="style"?Md(e,n,r):tr(t)?ci(t)||Kd(e,t,n,r,s):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Zd(e,t,r,o))?zd(e,t,r,i,s,a,l):(t==="true-value"?e._trueValue=r:t==="false-value"&&(e._falseValue=r),Fd(e,t,r,o))};function Zd(e,t,n,r){return r?!!(t==="innerHTML"||t==="textContent"||t in e&&Ss.test(t)&&oe(n)):t==="spellcheck"||t==="draggable"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Ss.test(t)&&me(n)?!1:t in e}const gt="transition",En="animation",Li=(e,{slots:t})=>be(zl,Gd(e),t);Li.displayName="Transition";const fc={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};Li.props=ke({},zl.props,fc);const jt=(e,t=[])=>{G(e)?e.forEach(n=>n(...t)):e&&e(...t)},Ps=e=>e?G(e)?e.some(t=>t.length>1):e.length>1:!1;function Gd(e){const t={};for(const A in e)A in fc||(t[A]=e[A]);if(e.css===!1)return t;const{name:n="v",type:r,duration:o,enterFromClass:i=`${n}-enter-from`,enterActiveClass:s=`${n}-enter-active`,enterToClass:a=`${n}-enter-to`,appearFromClass:l=i,appearActiveClass:c=s,appearToClass:u=a,leaveFromClass:d=`${n}-leave-from`,leaveActiveClass:f=`${n}-leave-active`,leaveToClass:h=`${n}-leave-to`}=e,m=Xd(o),g=m&&m[0],v=m&&m[1],{onBeforeEnter:_,onEnter:E,onEnterCancelled:O,onLeave:S,onLeaveCancelled:I,onBeforeAppear:L=_,onAppear:C=E,onAppearCancelled:P=O}=t,B=(A,F,Q)=>{Kt(A,F?u:a),Kt(A,F?c:s),Q&&Q()},z=(A,F)=>{Kt(A,h),Kt(A,f),F&&F()},$=A=>(F,Q)=>{const se=A?C:E,W=()=>B(F,A,Q);jt(se,[F,W]),Cs(()=>{Kt(F,A?l:i),_t(F,A?u:a),Ps(se)||As(F,r,g,W)})};return ke(t,{onBeforeEnter(A){jt(_,[A]),_t(A,i),_t(A,s)},onBeforeAppear(A){jt(L,[A]),_t(A,l),_t(A,c)},onEnter:$(!1),onAppear:$(!0),onLeave(A,F){const Q=()=>z(A,F);_t(A,d),np(),_t(A,f),Cs(()=>{Kt(A,d),_t(A,h),Ps(S)||As(A,r,v,Q)}),jt(S,[A,Q])},onEnterCancelled(A){B(A,!1),jt(O,[A])},onAppearCancelled(A){B(A,!0),jt(P,[A])},onLeaveCancelled(A){z(A),jt(I,[A])}})}function Xd(e){if(e==null)return null;if(Ce(e))return[ho(e.enter),ho(e.leave)];{const t=ho(e);return[t,t]}}function ho(e){return dl(e)}function _t(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e._vtc||(e._vtc=new Set)).add(t)}function Kt(e,t){t.split(/\s+/).forEach(r=>r&&e.classList.remove(r));const{_vtc:n}=e;n&&(n.delete(t),n.size||(e._vtc=void 0))}function Cs(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let ep=0;function As(e,t,n,r){const o=e._endId=++ep,i=()=>{o===e._endId&&r()};if(n)return setTimeout(i,n);const{type:s,timeout:a,propCount:l}=tp(e,t);if(!s)return r();const c=s+"end";let u=0;const d=()=>{e.removeEventListener(c,f),i()},f=h=>{h.target===e&&++u>=l&&d()};setTimeout(()=>{u<l&&d()},a+1),e.addEventListener(c,f)}function tp(e,t){const n=window.getComputedStyle(e),r=m=>(n[m]||"").split(", "),o=r(gt+"Delay"),i=r(gt+"Duration"),s=Is(o,i),a=r(En+"Delay"),l=r(En+"Duration"),c=Is(a,l);let u=null,d=0,f=0;t===gt?s>0&&(u=gt,d=s,f=i.length):t===En?c>0&&(u=En,d=c,f=l.length):(d=Math.max(s,c),u=d>0?s>c?gt:En:null,f=u?u===gt?i.length:l.length:0);const h=u===gt&&/\b(transform|all)(,|$)/.test(n[gt+"Property"]);return{type:u,timeout:d,propCount:f,hasTransform:h}}function Is(e,t){for(;e.length<t.length;)e=e.concat(e);return Math.max(...t.map((n,r)=>xs(n)+xs(e[r])))}function xs(e){return Number(e.slice(0,-1).replace(",","."))*1e3}function np(){return document.body.offsetHeight}const rp=["ctrl","shift","alt","meta"],op={stop:e=>e.stopPropagation(),prevent:e=>e.preventDefault(),self:e=>e.target!==e.currentTarget,ctrl:e=>!e.ctrlKey,shift:e=>!e.shiftKey,alt:e=>!e.altKey,meta:e=>!e.metaKey,left:e=>"button"in e&&e.button!==0,middle:e=>"button"in e&&e.button!==1,right:e=>"button"in e&&e.button!==2,exact:(e,t)=>rp.some(n=>e[`${n}Key`]&&!t.includes(n))},L0=(e,t)=>(n,...r)=>{for(let o=0;o<t.length;o++){const i=op[t[o]];if(i&&i(n,t))return}return e(n,...r)},ip={esc:"escape",space:" ",up:"arrow-up",left:"arrow-left",right:"arrow-right",down:"arrow-down",delete:"backspace"},N0=(e,t)=>n=>{if(!("key"in n))return;const r=qt(n.key);if(t.some(o=>o===r||ip[o]===r))return e(n)},M0={beforeMount(e,{value:t},{transition:n}){e._vod=e.style.display==="none"?"":e.style.display,n&&t?n.beforeEnter(e):On(e,t)},mounted(e,{value:t},{transition:n}){n&&t&&n.enter(e)},updated(e,{value:t,oldValue:n},{transition:r}){!t!=!n&&(r?t?(r.beforeEnter(e),On(e,!0),r.enter(e)):r.leave(e,()=>{On(e,!1)}):On(e,t))},beforeUnmount(e,{value:t}){On(e,t)}};function On(e,t){e.style.display=t?e._vod:"none"}const sp=ke({patchProp:Yd},Ld);let vo,js=!1;function ap(){return vo=js?vo:dd(sp),js=!0,vo}const lp=(...e)=>{const t=ap().createApp(...e),{mount:n}=t;return t.mount=r=>{const o=cp(r);if(o)return n(o,!0,o instanceof SVGElement)},t};function cp(e){return me(e)?document.querySelector(e):e}/*!
-  * vue-router v4.0.14
-  * (c) 2022 Eduardo San Martin Morote
-  * @license MIT
-  */const dc=typeof Symbol=="function"&&typeof Symbol.toStringTag=="symbol",_n=e=>dc?Symbol(e):"_vr_"+e,up=_n("rvlm"),Ts=_n("rvd"),no=_n("r"),Ni=_n("rl"),Uo=_n("rvl"),Xt=typeof window!="undefined";function fp(e){return e.__esModule||dc&&e[Symbol.toStringTag]==="Module"}const ve=Object.assign;function go(e,t){const n={};for(const r in t){const o=t[r];n[r]=Array.isArray(o)?o.map(e):e(o)}return n}const Hn=()=>{},dp=/\/$/,pp=e=>e.replace(dp,"");function _o(e,t,n="/"){let r,o={},i="",s="";const a=t.indexOf("?"),l=t.indexOf("#",a>-1?a:0);return a>-1&&(r=t.slice(0,a),i=t.slice(a+1,l>-1?l:t.length),o=e(i)),l>-1&&(r=r||t.slice(0,l),s=t.slice(l,t.length)),r=gp(r!=null?r:t,n),{fullPath:r+(i&&"?")+i+s,path:r,query:o,hash:s}}function mp(e,t){const n=t.query?e(t.query):"";return t.path+(n&&"?")+n+(t.hash||"")}function ks(e,t){return!t||!e.toLowerCase().startsWith(t.toLowerCase())?e:e.slice(t.length)||"/"}function hp(e,t,n){const r=t.matched.length-1,o=n.matched.length-1;return r>-1&&r===o&&fn(t.matched[r],n.matched[o])&&pc(t.params,n.params)&&e(t.query)===e(n.query)&&t.hash===n.hash}function fn(e,t){return(e.aliasOf||e)===(t.aliasOf||t)}function pc(e,t){if(Object.keys(e).length!==Object.keys(t).length)return!1;for(const n in e)if(!vp(e[n],t[n]))return!1;return!0}function vp(e,t){return Array.isArray(e)?Ds(e,t):Array.isArray(t)?Ds(t,e):e===t}function Ds(e,t){return Array.isArray(t)?e.length===t.length&&e.every((n,r)=>n===t[r]):e.length===1&&e[0]===t}function gp(e,t){if(e.startsWith("/"))return e;if(!e)return t;const n=t.split("/"),r=e.split("/");let o=n.length-1,i,s;for(i=0;i<r.length;i++)if(s=r[i],!(o===1||s==="."))if(s==="..")o--;else break;return n.slice(0,o).join("/")+"/"+r.slice(i-(i===r.length?1:0)).join("/")}var Jn;(function(e){e.pop="pop",e.push="push"})(Jn||(Jn={}));var Fn;(function(e){e.back="back",e.forward="forward",e.unknown=""})(Fn||(Fn={}));function _p(e){if(!e)if(Xt){const t=document.querySelector("base");e=t&&t.getAttribute("href")||"/",e=e.replace(/^\w+:\/\/[^\/]+/,"")}else e="/";return e[0]!=="/"&&e[0]!=="#"&&(e="/"+e),pp(e)}const yp=/^[^#]+#/;function bp(e,t){return e.replace(yp,"#")+t}function Ep(e,t){const n=document.documentElement.getBoundingClientRect(),r=e.getBoundingClientRect();return{behavior:t.behavior,left:r.left-n.left-(t.left||0),top:r.top-n.top-(t.top||0)}}const ro=()=>({left:window.pageXOffset,top:window.pageYOffset});function Op(e){let t;if("el"in e){const n=e.el,r=typeof n=="string"&&n.startsWith("#"),o=typeof n=="string"?r?document.getElementById(n.slice(1)):document.querySelector(n):n;if(!o)return;t=Ep(o,e)}else t=e;"scrollBehavior"in document.documentElement.style?window.scrollTo(t):window.scrollTo(t.left!=null?t.left:window.pageXOffset,t.top!=null?t.top:window.pageYOffset)}function Rs(e,t){return(history.state?history.state.position-t:-1)+e}const qo=new Map;function wp(e,t){qo.set(e,t)}function Sp(e){const t=qo.get(e);return qo.delete(e),t}let Pp=()=>location.protocol+"//"+location.host;function mc(e,t){const{pathname:n,search:r,hash:o}=t,i=e.indexOf("#");if(i>-1){let a=o.includes(e.slice(i))?e.slice(i).length:1,l=o.slice(a);return l[0]!=="/"&&(l="/"+l),ks(l,"")}return ks(n,e)+r+o}function Cp(e,t,n,r){let o=[],i=[],s=null;const a=({state:f})=>{const h=mc(e,location),m=n.value,g=t.value;let v=0;if(f){if(n.value=h,t.value=f,s&&s===m){s=null;return}v=g?f.position-g.position:0}else r(h);o.forEach(_=>{_(n.value,m,{delta:v,type:Jn.pop,direction:v?v>0?Fn.forward:Fn.back:Fn.unknown})})};function l(){s=n.value}function c(f){o.push(f);const h=()=>{const m=o.indexOf(f);m>-1&&o.splice(m,1)};return i.push(h),h}function u(){const{history:f}=window;!f.state||f.replaceState(ve({},f.state,{scroll:ro()}),"")}function d(){for(const f of i)f();i=[],window.removeEventListener("popstate",a),window.removeEventListener("beforeunload",u)}return window.addEventListener("popstate",a),window.addEventListener("beforeunload",u),{pauseListeners:l,listen:c,destroy:d}}function Ls(e,t,n,r=!1,o=!1){return{back:e,current:t,forward:n,replaced:r,position:window.history.length,scroll:o?ro():null}}function Ap(e){const{history:t,location:n}=window,r={value:mc(e,n)},o={value:t.state};o.value||i(r.value,{back:null,current:r.value,forward:null,position:t.length-1,replaced:!0,scroll:null},!0);function i(l,c,u){const d=e.indexOf("#"),f=d>-1?(n.host&&document.querySelector("base")?e:e.slice(d))+l:Pp()+e+l;try{t[u?"replaceState":"pushState"](c,"",f),o.value=c}catch(h){console.error(h),n[u?"replace":"assign"](f)}}function s(l,c){const u=ve({},t.state,Ls(o.value.back,l,o.value.forward,!0),c,{position:o.value.position});i(l,u,!0),r.value=l}function a(l,c){const u=ve({},o.value,t.state,{forward:l,scroll:ro()});i(u.current,u,!0);const d=ve({},Ls(r.value,l,null),{position:u.position+1},c);i(l,d,!1),r.value=l}return{location:r,state:o,push:a,replace:s}}function Ip(e){e=_p(e);const t=Ap(e),n=Cp(e,t.state,t.location,t.replace);function r(i,s=!0){s||n.pauseListeners(),history.go(i)}const o=ve({location:"",base:e,go:r,createHref:bp.bind(null,e)},t,n);return Object.defineProperty(o,"location",{enumerable:!0,get:()=>t.location.value}),Object.defineProperty(o,"state",{enumerable:!0,get:()=>t.state.value}),o}function xp(e){return typeof e=="string"||e&&typeof e=="object"}function hc(e){return typeof e=="string"||typeof e=="symbol"}const lt={path:"/",name:void 0,params:{},query:{},hash:"",fullPath:"/",matched:[],meta:{},redirectedFrom:void 0},vc=_n("nf");var Ns;(function(e){e[e.aborted=4]="aborted",e[e.cancelled=8]="cancelled",e[e.duplicated=16]="duplicated"})(Ns||(Ns={}));function dn(e,t){return ve(new Error,{type:e,[vc]:!0},t)}function yt(e,t){return e instanceof Error&&vc in e&&(t==null||!!(e.type&t))}const Ms="[^/]+?",jp={sensitive:!1,strict:!1,start:!0,end:!0},Tp=/[.+*?^${}()[\]/\\]/g;function kp(e,t){const n=ve({},jp,t),r=[];let o=n.start?"^":"";const i=[];for(const c of e){const u=c.length?[]:[90];n.strict&&!c.length&&(o+="/");for(let d=0;d<c.length;d++){const f=c[d];let h=40+(n.sensitive?.25:0);if(f.type===0)d||(o+="/"),o+=f.value.replace(Tp,"\\$&"),h+=40;else if(f.type===1){const{value:m,repeatable:g,optional:v,regexp:_}=f;i.push({name:m,repeatable:g,optional:v});const E=_||Ms;if(E!==Ms){h+=10;try{new RegExp(`(${E})`)}catch(S){throw new Error(`Invalid custom RegExp for param "${m}" (${E}): `+S.message)}}let O=g?`((?:${E})(?:/(?:${E}))*)`:`(${E})`;d||(O=v&&c.length<2?`(?:/${O})`:"/"+O),v&&(O+="?"),o+=O,h+=20,v&&(h+=-8),g&&(h+=-20),E===".*"&&(h+=-50)}u.push(h)}r.push(u)}if(n.strict&&n.end){const c=r.length-1;r[c][r[c].length-1]+=.7000000000000001}n.strict||(o+="/?"),n.end?o+="$":n.strict&&(o+="(?:/|$)");const s=new RegExp(o,n.sensitive?"":"i");function a(c){const u=c.match(s),d={};if(!u)return null;for(let f=1;f<u.length;f++){const h=u[f]||"",m=i[f-1];d[m.name]=h&&m.repeatable?h.split("/"):h}return d}function l(c){let u="",d=!1;for(const f of e){(!d||!u.endsWith("/"))&&(u+="/"),d=!1;for(const h of f)if(h.type===0)u+=h.value;else if(h.type===1){const{value:m,repeatable:g,optional:v}=h,_=m in c?c[m]:"";if(Array.isArray(_)&&!g)throw new Error(`Provided param "${m}" is an array but it is not repeatable (* or + modifiers)`);const E=Array.isArray(_)?_.join("/"):_;if(!E)if(v)f.length<2&&(u.endsWith("/")?u=u.slice(0,-1):d=!0);else throw new Error(`Missing required param "${m}"`);u+=E}}return u}return{re:s,score:r,keys:i,parse:a,stringify:l}}function Dp(e,t){let n=0;for(;n<e.length&&n<t.length;){const r=t[n]-e[n];if(r)return r;n++}return e.length<t.length?e.length===1&&e[0]===40+40?-1:1:e.length>t.length?t.length===1&&t[0]===40+40?1:-1:0}function Rp(e,t){let n=0;const r=e.score,o=t.score;for(;n<r.length&&n<o.length;){const i=Dp(r[n],o[n]);if(i)return i;n++}return o.length-r.length}const Lp={type:0,value:""},Np=/[a-zA-Z0-9_]/;function Mp(e){if(!e)return[[]];if(e==="/")return[[Lp]];if(!e.startsWith("/"))throw new Error(`Invalid path "${e}"`);function t(h){throw new Error(`ERR (${n})/"${c}": ${h}`)}let n=0,r=n;const o=[];let i;function s(){i&&o.push(i),i=[]}let a=0,l,c="",u="";function d(){!c||(n===0?i.push({type:0,value:c}):n===1||n===2||n===3?(i.length>1&&(l==="*"||l==="+")&&t(`A repeatable param (${c}) must be alone in its segment. eg: '/:ids+.`),i.push({type:1,value:c,regexp:u,repeatable:l==="*"||l==="+",optional:l==="*"||l==="?"})):t("Invalid state to consume buffer"),c="")}function f(){c+=l}for(;a<e.length;){if(l=e[a++],l==="\\"&&n!==2){r=n,n=4;continue}switch(n){case 0:l==="/"?(c&&d(),s()):l===":"?(d(),n=1):f();break;case 4:f(),n=r;break;case 1:l==="("?n=2:Np.test(l)?f():(d(),n=0,l!=="*"&&l!=="?"&&l!=="+"&&a--);break;case 2:l===")"?u[u.length-1]=="\\"?u=u.slice(0,-1)+l:n=3:u+=l;break;case 3:d(),n=0,l!=="*"&&l!=="?"&&l!=="+"&&a--,u="";break;default:t("Unknown state");break}}return n===2&&t(`Unfinished custom RegExp for param "${c}"`),d(),s(),o}function Hp(e,t,n){const r=kp(Mp(e.path),n),o=ve(r,{record:e,parent:t,children:[],alias:[]});return t&&!o.record.aliasOf==!t.record.aliasOf&&t.children.push(o),o}function Fp(e,t){const n=[],r=new Map;t=Fs({strict:!1,end:!0,sensitive:!1},t);function o(u){return r.get(u)}function i(u,d,f){const h=!f,m=Bp(u);m.aliasOf=f&&f.record;const g=Fs(t,u),v=[m];if("alias"in u){const O=typeof u.alias=="string"?[u.alias]:u.alias;for(const S of O)v.push(ve({},m,{components:f?f.record.components:m.components,path:S,aliasOf:f?f.record:m}))}let _,E;for(const O of v){const{path:S}=O;if(d&&S[0]!=="/"){const I=d.record.path,L=I[I.length-1]==="/"?"":"/";O.path=d.record.path+(S&&L+S)}if(_=Hp(O,d,g),f?f.alias.push(_):(E=E||_,E!==_&&E.alias.push(_),h&&u.name&&!Hs(_)&&s(u.name)),"children"in m){const I=m.children;for(let L=0;L<I.length;L++)i(I[L],_,f&&f.children[L])}f=f||_,l(_)}return E?()=>{s(E)}:Hn}function s(u){if(hc(u)){const d=r.get(u);d&&(r.delete(u),n.splice(n.indexOf(d),1),d.children.forEach(s),d.alias.forEach(s))}else{const d=n.indexOf(u);d>-1&&(n.splice(d,1),u.record.name&&r.delete(u.record.name),u.children.forEach(s),u.alias.forEach(s))}}function a(){return n}function l(u){let d=0;for(;d<n.length&&Rp(u,n[d])>=0&&(u.record.path!==n[d].record.path||!gc(u,n[d]));)d++;n.splice(d,0,u),u.record.name&&!Hs(u)&&r.set(u.record.name,u)}function c(u,d){let f,h={},m,g;if("name"in u&&u.name){if(f=r.get(u.name),!f)throw dn(1,{location:u});g=f.record.name,h=ve(zp(d.params,f.keys.filter(E=>!E.optional).map(E=>E.name)),u.params),m=f.stringify(h)}else if("path"in u)m=u.path,f=n.find(E=>E.re.test(m)),f&&(h=f.parse(m),g=f.record.name);else{if(f=d.name?r.get(d.name):n.find(E=>E.re.test(d.path)),!f)throw dn(1,{location:u,currentLocation:d});g=f.record.name,h=ve({},d.params,u.params),m=f.stringify(h)}const v=[];let _=f;for(;_;)v.unshift(_.record),_=_.parent;return{name:g,path:m,params:h,matched:v,meta:Up(v)}}return e.forEach(u=>i(u)),{addRoute:i,resolve:c,removeRoute:s,getRoutes:a,getRecordMatcher:o}}function zp(e,t){const n={};for(const r of t)r in e&&(n[r]=e[r]);return n}function Bp(e){return{path:e.path,redirect:e.redirect,name:e.name,meta:e.meta||{},aliasOf:void 0,beforeEnter:e.beforeEnter,props:$p(e),children:e.children||[],instances:{},leaveGuards:new Set,updateGuards:new Set,enterCallbacks:{},components:"components"in e?e.components||{}:{default:e.component}}}function $p(e){const t={},n=e.props||!1;if("component"in e)t.default=n;else for(const r in e.components)t[r]=typeof n=="boolean"?n:n[r];return t}function Hs(e){for(;e;){if(e.record.aliasOf)return!0;e=e.parent}return!1}function Up(e){return e.reduce((t,n)=>ve(t,n.meta),{})}function Fs(e,t){const n={};for(const r in e)n[r]=r in t?t[r]:e[r];return n}function gc(e,t){return t.children.some(n=>n===e||gc(e,n))}const _c=/#/g,qp=/&/g,Vp=/\//g,Kp=/=/g,Wp=/\?/g,yc=/\+/g,Jp=/%5B/g,Qp=/%5D/g,bc=/%5E/g,Yp=/%60/g,Ec=/%7B/g,Zp=/%7C/g,Oc=/%7D/g,Gp=/%20/g;function Mi(e){return encodeURI(""+e).replace(Zp,"|").replace(Jp,"[").replace(Qp,"]")}function Xp(e){return Mi(e).replace(Ec,"{").replace(Oc,"}").replace(bc,"^")}function Vo(e){return Mi(e).replace(yc,"%2B").replace(Gp,"+").replace(_c,"%23").replace(qp,"%26").replace(Yp,"`").replace(Ec,"{").replace(Oc,"}").replace(bc,"^")}function em(e){return Vo(e).replace(Kp,"%3D")}function tm(e){return Mi(e).replace(_c,"%23").replace(Wp,"%3F")}function nm(e){return e==null?"":tm(e).replace(Vp,"%2F")}function Fr(e){try{return decodeURIComponent(""+e)}catch{}return""+e}function rm(e){const t={};if(e===""||e==="?")return t;const r=(e[0]==="?"?e.slice(1):e).split("&");for(let o=0;o<r.length;++o){const i=r[o].replace(yc," "),s=i.indexOf("="),a=Fr(s<0?i:i.slice(0,s)),l=s<0?null:Fr(i.slice(s+1));if(a in t){let c=t[a];Array.isArray(c)||(c=t[a]=[c]),c.push(l)}else t[a]=l}return t}function zs(e){let t="";for(let n in e){const r=e[n];if(n=em(n),r==null){r!==void 0&&(t+=(t.length?"&":"")+n);continue}(Array.isArray(r)?r.map(i=>i&&Vo(i)):[r&&Vo(r)]).forEach(i=>{i!==void 0&&(t+=(t.length?"&":"")+n,i!=null&&(t+="="+i))})}return t}function om(e){const t={};for(const n in e){const r=e[n];r!==void 0&&(t[n]=Array.isArray(r)?r.map(o=>o==null?null:""+o):r==null?r:""+r)}return t}function wn(){let e=[];function t(r){return e.push(r),()=>{const o=e.indexOf(r);o>-1&&e.splice(o,1)}}function n(){e=[]}return{add:t,list:()=>e,reset:n}}function Ot(e,t,n,r,o){const i=r&&(r.enterCallbacks[o]=r.enterCallbacks[o]||[]);return()=>new Promise((s,a)=>{const l=d=>{d===!1?a(dn(4,{from:n,to:t})):d instanceof Error?a(d):xp(d)?a(dn(2,{from:t,to:d})):(i&&r.enterCallbacks[o]===i&&typeof d=="function"&&i.push(d),s())},c=e.call(r&&r.instances[o],t,n,l);let u=Promise.resolve(c);e.length<3&&(u=u.then(l)),u.catch(d=>a(d))})}function yo(e,t,n,r){const o=[];for(const i of e)for(const s in i.components){let a=i.components[s];if(!(t!=="beforeRouteEnter"&&!i.instances[s]))if(im(a)){const c=(a.__vccOpts||a)[t];c&&o.push(Ot(c,n,r,i,s))}else{let l=a();o.push(()=>l.then(c=>{if(!c)return Promise.reject(new Error(`Couldn't resolve component "${s}" at "${i.path}"`));const u=fp(c)?c.default:c;i.components[s]=u;const f=(u.__vccOpts||u)[t];return f&&Ot(f,n,r,i,s)()}))}}return o}function im(e){return typeof e=="object"||"displayName"in e||"props"in e||"__vccOpts"in e}function Bs(e){const t=je(no),n=je(Ni),r=Oe(()=>t.resolve(zt(e.to))),o=Oe(()=>{const{matched:l}=r.value,{length:c}=l,u=l[c-1],d=n.matched;if(!u||!d.length)return-1;const f=d.findIndex(fn.bind(null,u));if(f>-1)return f;const h=$s(l[c-2]);return c>1&&$s(u)===h&&d[d.length-1].path!==h?d.findIndex(fn.bind(null,l[c-2])):f}),i=Oe(()=>o.value>-1&&cm(n.params,r.value.params)),s=Oe(()=>o.value>-1&&o.value===n.matched.length-1&&pc(n.params,r.value.params));function a(l={}){return lm(l)?t[zt(e.replace)?"replace":"push"](zt(e.to)).catch(Hn):Promise.resolve()}return{route:r,href:Oe(()=>r.value.href),isActive:i,isExactActive:s,navigate:a}}const sm=Ye({name:"RouterLink",props:{to:{type:[String,Object],required:!0},replace:Boolean,activeClass:String,exactActiveClass:String,custom:Boolean,ariaCurrentValue:{type:String,default:"page"}},useLink:Bs,setup(e,{slots:t}){const n=gn(Bs(e)),{options:r}=je(no),o=Oe(()=>({[Us(e.activeClass,r.linkActiveClass,"router-link-active")]:n.isActive,[Us(e.exactActiveClass,r.linkExactActiveClass,"router-link-exact-active")]:n.isExactActive}));return()=>{const i=t.default&&t.default(n);return e.custom?i:be("a",{"aria-current":n.isExactActive?e.ariaCurrentValue:null,href:n.href,onClick:n.navigate,class:o.value},i)}}}),am=sm;function lm(e){if(!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)&&!e.defaultPrevented&&!(e.button!==void 0&&e.button!==0)){if(e.currentTarget&&e.currentTarget.getAttribute){const t=e.currentTarget.getAttribute("target");if(/\b_blank\b/i.test(t))return}return e.preventDefault&&e.preventDefault(),!0}}function cm(e,t){for(const n in t){const r=t[n],o=e[n];if(typeof r=="string"){if(r!==o)return!1}else if(!Array.isArray(o)||o.length!==r.length||r.some((i,s)=>i!==o[s]))return!1}return!0}function $s(e){return e?e.aliasOf?e.aliasOf.path:e.path:""}const Us=(e,t,n)=>e!=null?e:t!=null?t:n,um=Ye({name:"RouterView",inheritAttrs:!1,props:{name:{type:String,default:"default"},route:Object},setup(e,{attrs:t,slots:n}){const r=je(Uo),o=Oe(()=>e.route||r.value),i=je(Ts,0),s=Oe(()=>o.value.matched[i]);Bt(Ts,i+1),Bt(up,s),Bt(Uo,o);const a=Ne();return et(()=>[a.value,s.value,e.name],([l,c,u],[d,f,h])=>{c&&(c.instances[u]=l,f&&f!==c&&l&&l===d&&(c.leaveGuards.size||(c.leaveGuards=f.leaveGuards),c.updateGuards.size||(c.updateGuards=f.updateGuards))),l&&c&&(!f||!fn(c,f)||!d)&&(c.enterCallbacks[u]||[]).forEach(m=>m(l))},{flush:"post"}),()=>{const l=o.value,c=s.value,u=c&&c.components[e.name],d=e.name;if(!u)return qs(n.default,{Component:u,route:l});const f=c.props[e.name],h=f?f===!0?l.params:typeof f=="function"?f(l):f:null,g=be(u,ve({},h,t,{onVnodeUnmounted:v=>{v.component.isUnmounted&&(c.instances[d]=null)},ref:a}));return qs(n.default,{Component:g,route:l})||g}}});function qs(e,t){if(!e)return null;const n=e(t);return n.length===1?n[0]:n}const wc=um;function fm(e){const t=Fp(e.routes,e),n=e.parseQuery||rm,r=e.stringifyQuery||zs,o=e.history,i=wn(),s=wn(),a=wn(),l=Il(lt);let c=lt;Xt&&e.scrollBehavior&&"scrollRestoration"in history&&(history.scrollRestoration="manual");const u=go.bind(null,j=>""+j),d=go.bind(null,nm),f=go.bind(null,Fr);function h(j,U){let N,q;return hc(j)?(N=t.getRecordMatcher(j),q=U):q=j,t.addRoute(q,N)}function m(j){const U=t.getRecordMatcher(j);U&&t.removeRoute(U)}function g(){return t.getRoutes().map(j=>j.record)}function v(j){return!!t.getRecordMatcher(j)}function _(j,U){if(U=ve({},U||l.value),typeof j=="string"){const X=_o(n,j,U.path),p=t.resolve({path:X.path},U),y=o.createHref(X.fullPath);return ve(X,p,{params:f(p.params),hash:Fr(X.hash),redirectedFrom:void 0,href:y})}let N;if("path"in j)N=ve({},j,{path:_o(n,j.path,U.path).path});else{const X=ve({},j.params);for(const p in X)X[p]==null&&delete X[p];N=ve({},j,{params:d(j.params)}),U.params=d(U.params)}const q=t.resolve(N,U),le=j.hash||"";q.params=u(f(q.params));const pe=mp(r,ve({},j,{hash:Xp(le),path:q.path})),re=o.createHref(pe);return ve({fullPath:pe,hash:le,query:r===zs?om(j.query):j.query||{}},q,{redirectedFrom:void 0,href:re})}function E(j){return typeof j=="string"?_o(n,j,l.value.path):ve({},j)}function O(j,U){if(c!==j)return dn(8,{from:U,to:j})}function S(j){return C(j)}function I(j){return S(ve(E(j),{replace:!0}))}function L(j){const U=j.matched[j.matched.length-1];if(U&&U.redirect){const{redirect:N}=U;let q=typeof N=="function"?N(j):N;return typeof q=="string"&&(q=q.includes("?")||q.includes("#")?q=E(q):{path:q},q.params={}),ve({query:j.query,hash:j.hash,params:j.params},q)}}function C(j,U){const N=c=_(j),q=l.value,le=j.state,pe=j.force,re=j.replace===!0,X=L(N);if(X)return C(ve(E(X),{state:le,force:pe,replace:re}),U||N);const p=N;p.redirectedFrom=U;let y;return!pe&&hp(r,q,N)&&(y=dn(16,{to:p,from:q}),Pe(q,q,!0,!1)),(y?Promise.resolve(y):B(p,q)).catch(w=>yt(w)?yt(w,2)?w:Ee(w):ee(w,p,q)).then(w=>{if(w){if(yt(w,2))return C(ve(E(w.to),{state:le,force:pe,replace:re}),U||p)}else w=$(p,q,!0,re,le);return z(p,q,w),w})}function P(j,U){const N=O(j,U);return N?Promise.reject(N):Promise.resolve()}function B(j,U){let N;const[q,le,pe]=dm(j,U);N=yo(q.reverse(),"beforeRouteLeave",j,U);for(const X of q)X.leaveGuards.forEach(p=>{N.push(Ot(p,j,U))});const re=P.bind(null,j,U);return N.push(re),Wt(N).then(()=>{N=[];for(const X of i.list())N.push(Ot(X,j,U));return N.push(re),Wt(N)}).then(()=>{N=yo(le,"beforeRouteUpdate",j,U);for(const X of le)X.updateGuards.forEach(p=>{N.push(Ot(p,j,U))});return N.push(re),Wt(N)}).then(()=>{N=[];for(const X of j.matched)if(X.beforeEnter&&!U.matched.includes(X))if(Array.isArray(X.beforeEnter))for(const p of X.beforeEnter)N.push(Ot(p,j,U));else N.push(Ot(X.beforeEnter,j,U));return N.push(re),Wt(N)}).then(()=>(j.matched.forEach(X=>X.enterCallbacks={}),N=yo(pe,"beforeRouteEnter",j,U),N.push(re),Wt(N))).then(()=>{N=[];for(const X of s.list())N.push(Ot(X,j,U));return N.push(re),Wt(N)}).catch(X=>yt(X,8)?X:Promise.reject(X))}function z(j,U,N){for(const q of a.list())q(j,U,N)}function $(j,U,N,q,le){const pe=O(j,U);if(pe)return pe;const re=U===lt,X=Xt?history.state:{};N&&(q||re?o.replace(j.fullPath,ve({scroll:re&&X&&X.scroll},le)):o.push(j.fullPath,le)),l.value=j,Pe(j,U,N,re),Ee()}let A;function F(){A=o.listen((j,U,N)=>{const q=_(j),le=L(q);if(le){C(ve(le,{replace:!0}),q).catch(Hn);return}c=q;const pe=l.value;Xt&&wp(Rs(pe.fullPath,N.delta),ro()),B(q,pe).catch(re=>yt(re,12)?re:yt(re,2)?(C(re.to,q).then(X=>{yt(X,20)&&!N.delta&&N.type===Jn.pop&&o.go(-1,!1)}).catch(Hn),Promise.reject()):(N.delta&&o.go(-N.delta,!1),ee(re,q,pe))).then(re=>{re=re||$(q,pe,!1),re&&(N.delta?o.go(-N.delta,!1):N.type===Jn.pop&&yt(re,20)&&o.go(-1,!1)),z(q,pe,re)}).catch(Hn)})}let Q=wn(),se=wn(),W;function ee(j,U,N){Ee(j);const q=se.list();return q.length?q.forEach(le=>le(j,U,N)):console.error(j),Promise.reject(j)}function te(){return W&&l.value!==lt?Promise.resolve():new Promise((j,U)=>{Q.add([j,U])})}function Ee(j){return W||(W=!j,F(),Q.list().forEach(([U,N])=>j?N(j):U()),Q.reset()),j}function Pe(j,U,N,q){const{scrollBehavior:le}=e;if(!Xt||!le)return Promise.resolve();const pe=!N&&Sp(Rs(j.fullPath,0))||(q||!N)&&history.state&&history.state.scroll||null;return Oi().then(()=>le(j,U,pe)).then(re=>re&&Op(re)).catch(re=>ee(re,j,U))}const Ae=j=>o.go(j);let we;const Te=new Set;return{currentRoute:l,addRoute:h,removeRoute:m,hasRoute:v,getRoutes:g,resolve:_,options:e,push:S,replace:I,go:Ae,back:()=>Ae(-1),forward:()=>Ae(1),beforeEach:i.add,beforeResolve:s.add,afterEach:a.add,onError:se.add,isReady:te,install(j){const U=this;j.component("RouterLink",am),j.component("RouterView",wc),j.config.globalProperties.$router=U,Object.defineProperty(j.config.globalProperties,"$route",{enumerable:!0,get:()=>zt(l)}),Xt&&!we&&l.value===lt&&(we=!0,S(o.location).catch(le=>{}));const N={};for(const le in lt)N[le]=Oe(()=>l.value[le]);j.provide(no,U),j.provide(Ni,gn(N)),j.provide(Uo,l);const q=j.unmount;Te.add(j),j.unmount=function(){Te.delete(j),Te.size<1&&(c=lt,A&&A(),l.value=lt,we=!1,W=!1),q()}}}}function Wt(e){return e.reduce((t,n)=>t.then(()=>n()),Promise.resolve())}function dm(e,t){const n=[],r=[],o=[],i=Math.max(t.matched.length,e.matched.length);for(let s=0;s<i;s++){const a=t.matched[s];a&&(e.matched.find(c=>fn(c,a))?r.push(a):n.push(a));const l=e.matched[s];l&&(t.matched.find(c=>fn(c,l))||o.push(l))}return[n,r,o]}function oo(){return je(no)}function Hi(){return je(Ni)}const pm=Ye({setup(e,t){const n=Ne(!1);return at(()=>{n.value=!0}),()=>{var r,o;return n.value?(o=(r=t.slots).default)===null||o===void 0?void 0:o.call(r):null}}}),mm="modulepreload",Vs={},hm="/",ne=function(t,n){return!n||n.length===0?t():Promise.all(n.map(r=>{if(r=`${hm}${r}`,r in Vs)return;Vs[r]=!0;const o=r.endsWith(".css"),i=o?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${i}`))return;const s=document.createElement("link");if(s.rel=o?"stylesheet":mm,o||(s.as="script",s.crossOrigin=""),s.href=r,document.head.appendChild(s),o)return new Promise((a,l)=>{s.addEventListener("load",a),s.addEventListener("error",()=>l(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>t())},Sc={"v-8daa1a0e":ce(()=>ne(()=>import("./index.html.e796e241.js"),["assets/index.html.e796e241.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-08a5d2dc":ce(()=>ne(()=>import("./index.html.6b18d5e2.js"),["assets/index.html.6b18d5e2.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-9014096a":ce(()=>ne(()=>import("./index.html.3a5189cb.js"),["assets/index.html.3a5189cb.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-0dd9e6a8":ce(()=>ne(()=>import("./index.html.b3eef111.js"),["assets/index.html.b3eef111.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-fb37d6ea":ce(()=>ne(()=>import("./index.html.7d9f5387.js"),["assets/index.html.7d9f5387.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-55146a0d":ce(()=>ne(()=>import("./index.html.4d000d1b.js"),["assets/index.html.4d000d1b.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-59de75e8":ce(()=>ne(()=>import("./index.html.ae7c0acf.js"),["assets/index.html.ae7c0acf.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-d446beac":ce(()=>ne(()=>import("./index.html.7514c62a.js"),["assets/index.html.7514c62a.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-241ec4c4":ce(()=>ne(()=>import("./index.html.b5876d91.js"),["assets/index.html.b5876d91.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-3706649a":ce(()=>ne(()=>import("./404.html.bee13de6.js"),["assets/404.html.bee13de6.js","assets/plugin-vue_export-helper.21dcd24c.js"]))},vm={"v-8daa1a0e":()=>ne(()=>import("./index.html.9ea49862.js"),[]).then(({data:e})=>e),"v-08a5d2dc":()=>ne(()=>import("./index.html.53c86478.js"),[]).then(({data:e})=>e),"v-9014096a":()=>ne(()=>import("./index.html.d53513ec.js"),[]).then(({data:e})=>e),"v-0dd9e6a8":()=>ne(()=>import("./index.html.256dcdde.js"),[]).then(({data:e})=>e),"v-fb37d6ea":()=>ne(()=>import("./index.html.1b6f9115.js"),[]).then(({data:e})=>e),"v-55146a0d":()=>ne(()=>import("./index.html.d713def1.js"),[]).then(({data:e})=>e),"v-59de75e8":()=>ne(()=>import("./index.html.94c6d9be.js"),[]).then(({data:e})=>e),"v-d446beac":()=>ne(()=>import("./index.html.1f688541.js"),[]).then(({data:e})=>e),"v-241ec4c4":()=>ne(()=>import("./index.html.61d313f8.js"),[]).then(({data:e})=>e),"v-3706649a":()=>ne(()=>import("./404.html.f166316b.js"),[]).then(({data:e})=>e)},Pc=Ne(vm),Cc=_i({key:"",path:"",title:"",lang:"",frontmatter:{},excerpt:"",headers:[]}),ut=Ne(Cc),or=()=>ut;Ki.webpackHot&&(__VUE_HMR_RUNTIME__.updatePageData=e=>{Pc.value[e.key]=()=>Promise.resolve(e),e.key===ut.value.key&&(ut.value=e)});const Ac=Symbol(""),gm=()=>{const e=je(Ac);if(!e)throw new Error("usePageFrontmatter() is called without provider.");return e},Ic=Symbol(""),_m=()=>{const e=je(Ic);if(!e)throw new Error("usePageHead() is called without provider.");return e},ym=Symbol(""),xc=Symbol(""),jc=()=>{const e=je(xc);if(!e)throw new Error("usePageLang() is called without provider.");return e},Fi=Symbol(""),Tc=()=>{const e=je(Fi);if(!e)throw new Error("useRouteLocale() is called without provider.");return e},bm={base:"/",lang:"en-US",title:"Vue 3 Datepicker",description:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available",head:[["link",{rel:"icon",href:"/logo.png"}],["meta",{name:"description",content:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"}]],locales:{}},wt=Ne(bm),kc=()=>wt;Ki.webpackHot&&(__VUE_HMR_RUNTIME__.updateSiteData=e=>{wt.value=e});const Dc=Symbol(""),H0=()=>{const e=je(Dc);if(!e)throw new Error("useSiteLocaleData() is called without provider.");return e},Em=Symbol(""),zi=e=>{let t;e.pageKey?t=e.pageKey:t=or().value.key;const n=Sc[t];return n?be(n):be("div","404 Not Found")};zi.displayName="Content";zi.props={pageKey:{type:String,required:!1}};const Om={"404":ce(()=>ne(()=>import("./404.cadb687d.js"),[])),Layout:ce(()=>ne(()=>import("./Layout.30deb01a.js"),["assets/Layout.30deb01a.js","assets/plugin-vue_export-helper.21dcd24c.js"]))},wm=([e,t,n])=>e==="meta"&&t.name?`${e}.${t.name}`:["title","base"].includes(e)?e:e==="template"&&t.id?`${e}.${t.id}`:JSON.stringify([e,t,n]),Sm=e=>{const t=new Set,n=[];return e.forEach(r=>{const o=wm(r);t.has(o)||(t.add(o),n.push(r))}),n},Pm=e=>/^(https?:)?\/\//.test(e),F0=e=>/^mailto:/.test(e),z0=e=>/^tel:/.test(e),Rc=e=>Object.prototype.toString.call(e)==="[object Object]",Cm=e=>e.replace(/\/$/,""),Am=e=>e.replace(/^\//,""),Lc=(e,t)=>{const n=Object.keys(e).sort((r,o)=>{const i=o.split("/").length-r.split("/").length;return i!==0?i:o.length-r.length});for(const r of n)if(t.startsWith(r))return r;return"/"},Im=(e,t="/")=>e.replace(/^(https?:)?\/\/[^/]*/,"").replace(new RegExp(`^${t}`),"/"),Ks=Ye({name:"Vuepress",setup(){const e=or(),t=Oe(()=>{let n;if(e.value.path){const r=e.value.frontmatter.layout;me(r)?n=r:n="Layout"}else n="404";return Om[n]||_d(n,!1)});return()=>be(t.value)}}),yn=e=>e,Bi=e=>e,xm=e=>Pm(e)?e:`${kc().value.base}${Am(e)}`,Rt=gn({resolvePageData:async e=>{const t=Pc.value[e],n=await(t==null?void 0:t());return n!=null?n:Cc},resolvePageFrontmatter:e=>e.frontmatter,resolvePageHead:(e,t,n)=>{const r=me(t.description)?t.description:n.description,o=[...G(t.head)?t.head:[],...n.head,["title",{},e],["meta",{name:"description",content:r}]];return Sm(o)},resolvePageHeadTitle:(e,t)=>`${e.title?`${e.title} | `:""}${t.title}`,resolvePageLang:e=>e.lang||"en",resolveRouteLocale:(e,t)=>Lc(e,t),resolveSiteLocaleData:(e,t)=>Re(Re({},e),e.locales[t])});const jm=be("svg",{class:"external-link-icon",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",x:"0px",y:"0px",viewBox:"0 0 100 100",width:"15",height:"15"},[be("path",{fill:"currentColor",d:"M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"}),be("polygon",{fill:"currentColor",points:"45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"})]),Tm=Ye({name:"ExternalLinkIcon",props:{locales:{type:Object,required:!1,default:()=>({})}},setup(e){const t=Tc(),n=Oe(()=>{var r;return(r=e.locales[t.value])!==null&&r!==void 0?r:{openInNewWindow:"open in new window"}});return()=>be("span",[jm,be("span",{class:"external-link-icon-sr-only"},n.value.openInNewWindow)])}}),km={"/":{openInNewWindow:"open in new window"}};var Dm=yn(({app:e})=>{e.component("ExternalLinkIcon",be(Tm,{locales:km}))});/*! medium-zoom 1.0.6 | MIT License | https://github.com/francoischalifour/medium-zoom */var Lt=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},pr=function(t){return t.tagName==="IMG"},Rm=function(t){return NodeList.prototype.isPrototypeOf(t)},Or=function(t){return t&&t.nodeType===1},Ws=function(t){var n=t.currentSrc||t.src;return n.substr(-4).toLowerCase()===".svg"},Js=function(t){try{return Array.isArray(t)?t.filter(pr):Rm(t)?[].slice.call(t).filter(pr):Or(t)?[t].filter(pr):typeof t=="string"?[].slice.call(document.querySelectorAll(t)).filter(pr):[]}catch{throw new TypeError(`The provided selector is invalid.
-Expects a CSS selector, a Node element, a NodeList or an array.
-See: https://github.com/francoischalifour/medium-zoom`)}},Lm=function(t){var n=document.createElement("div");return n.classList.add("medium-zoom-overlay"),n.style.background=t,n},Nm=function(t){var n=t.getBoundingClientRect(),r=n.top,o=n.left,i=n.width,s=n.height,a=t.cloneNode(),l=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,c=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return a.removeAttribute("id"),a.style.position="absolute",a.style.top=r+l+"px",a.style.left=o+c+"px",a.style.width=i+"px",a.style.height=s+"px",a.style.transform="",a},Jt=function(t,n){var r=Lt({bubbles:!1,cancelable:!1,detail:void 0},n);if(typeof window.CustomEvent=="function")return new CustomEvent(t,r);var o=document.createEvent("CustomEvent");return o.initCustomEvent(t,r.bubbles,r.cancelable,r.detail),o},Mm=function e(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},r=window.Promise||function(A){function F(){}A(F,F)},o=function(A){var F=A.target;if(F===B){m();return}O.indexOf(F)!==-1&&g({target:F})},i=function(){if(!(I||!P.original)){var A=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0;Math.abs(L-A)>C.scrollOffset&&setTimeout(m,150)}},s=function(A){var F=A.key||A.keyCode;(F==="Escape"||F==="Esc"||F===27)&&m()},a=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},F=A;if(A.background&&(B.style.background=A.background),A.container&&A.container instanceof Object&&(F.container=Lt({},C.container,A.container)),A.template){var Q=Or(A.template)?A.template:document.querySelector(A.template);F.template=Q}return C=Lt({},C,F),O.forEach(function(se){se.dispatchEvent(Jt("medium-zoom:update",{detail:{zoom:z}}))}),z},l=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return e(Lt({},C,A))},c=function(){for(var A=arguments.length,F=Array(A),Q=0;Q<A;Q++)F[Q]=arguments[Q];var se=F.reduce(function(W,ee){return[].concat(W,Js(ee))},[]);return se.filter(function(W){return O.indexOf(W)===-1}).forEach(function(W){O.push(W),W.classList.add("medium-zoom-image")}),S.forEach(function(W){var ee=W.type,te=W.listener,Ee=W.options;se.forEach(function(Pe){Pe.addEventListener(ee,te,Ee)})}),z},u=function(){for(var A=arguments.length,F=Array(A),Q=0;Q<A;Q++)F[Q]=arguments[Q];P.zoomed&&m();var se=F.length>0?F.reduce(function(W,ee){return[].concat(W,Js(ee))},[]):O;return se.forEach(function(W){W.classList.remove("medium-zoom-image"),W.dispatchEvent(Jt("medium-zoom:detach",{detail:{zoom:z}}))}),O=O.filter(function(W){return se.indexOf(W)===-1}),z},d=function(A,F){var Q=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return O.forEach(function(se){se.addEventListener("medium-zoom:"+A,F,Q)}),S.push({type:"medium-zoom:"+A,listener:F,options:Q}),z},f=function(A,F){var Q=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return O.forEach(function(se){se.removeEventListener("medium-zoom:"+A,F,Q)}),S=S.filter(function(se){return!(se.type==="medium-zoom:"+A&&se.listener.toString()===F.toString())}),z},h=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},F=A.target,Q=function(){var W={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight,left:0,top:0,right:0,bottom:0},ee=void 0,te=void 0;if(C.container)if(C.container instanceof Object)W=Lt({},W,C.container),ee=W.width-W.left-W.right-C.margin*2,te=W.height-W.top-W.bottom-C.margin*2;else{var Ee=Or(C.container)?C.container:document.querySelector(C.container),Pe=Ee.getBoundingClientRect(),Ae=Pe.width,we=Pe.height,Te=Pe.left,ze=Pe.top;W=Lt({},W,{width:Ae,height:we,left:Te,top:ze})}ee=ee||W.width-C.margin*2,te=te||W.height-C.margin*2;var j=P.zoomedHd||P.original,U=Ws(j)?ee:j.naturalWidth||ee,N=Ws(j)?te:j.naturalHeight||te,q=j.getBoundingClientRect(),le=q.top,pe=q.left,re=q.width,X=q.height,p=Math.min(U,ee)/re,y=Math.min(N,te)/X,w=Math.min(p,y),x=(-pe+(ee-re)/2+C.margin+W.left)/w,T=(-le+(te-X)/2+C.margin+W.top)/w,k="scale("+w+") translate3d("+x+"px, "+T+"px, 0)";P.zoomed.style.transform=k,P.zoomedHd&&(P.zoomedHd.style.transform=k)};return new r(function(se){if(F&&O.indexOf(F)===-1){se(z);return}var W=function Ae(){I=!1,P.zoomed.removeEventListener("transitionend",Ae),P.original.dispatchEvent(Jt("medium-zoom:opened",{detail:{zoom:z}})),se(z)};if(P.zoomed){se(z);return}if(F)P.original=F;else if(O.length>0){var ee=O;P.original=ee[0]}else{se(z);return}if(P.original.dispatchEvent(Jt("medium-zoom:open",{detail:{zoom:z}})),L=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,I=!0,P.zoomed=Nm(P.original),document.body.appendChild(B),C.template){var te=Or(C.template)?C.template:document.querySelector(C.template);P.template=document.createElement("div"),P.template.appendChild(te.content.cloneNode(!0)),document.body.appendChild(P.template)}if(document.body.appendChild(P.zoomed),window.requestAnimationFrame(function(){document.body.classList.add("medium-zoom--opened")}),P.original.classList.add("medium-zoom-image--hidden"),P.zoomed.classList.add("medium-zoom-image--opened"),P.zoomed.addEventListener("click",m),P.zoomed.addEventListener("transitionend",W),P.original.getAttribute("data-zoom-src")){P.zoomedHd=P.zoomed.cloneNode(),P.zoomedHd.removeAttribute("srcset"),P.zoomedHd.removeAttribute("sizes"),P.zoomedHd.src=P.zoomed.getAttribute("data-zoom-src"),P.zoomedHd.onerror=function(){clearInterval(Ee),console.warn("Unable to reach the zoom image target "+P.zoomedHd.src),P.zoomedHd=null,Q()};var Ee=setInterval(function(){P.zoomedHd.complete&&(clearInterval(Ee),P.zoomedHd.classList.add("medium-zoom-image--opened"),P.zoomedHd.addEventListener("click",m),document.body.appendChild(P.zoomedHd),Q())},10)}else if(P.original.hasAttribute("srcset")){P.zoomedHd=P.zoomed.cloneNode(),P.zoomedHd.removeAttribute("sizes"),P.zoomedHd.removeAttribute("loading");var Pe=P.zoomedHd.addEventListener("load",function(){P.zoomedHd.removeEventListener("load",Pe),P.zoomedHd.classList.add("medium-zoom-image--opened"),P.zoomedHd.addEventListener("click",m),document.body.appendChild(P.zoomedHd),Q()})}else Q()})},m=function(){return new r(function(A){if(I||!P.original){A(z);return}var F=function Q(){P.original.classList.remove("medium-zoom-image--hidden"),document.body.removeChild(P.zoomed),P.zoomedHd&&document.body.removeChild(P.zoomedHd),document.body.removeChild(B),P.zoomed.classList.remove("medium-zoom-image--opened"),P.template&&document.body.removeChild(P.template),I=!1,P.zoomed.removeEventListener("transitionend",Q),P.original.dispatchEvent(Jt("medium-zoom:closed",{detail:{zoom:z}})),P.original=null,P.zoomed=null,P.zoomedHd=null,P.template=null,A(z)};I=!0,document.body.classList.remove("medium-zoom--opened"),P.zoomed.style.transform="",P.zoomedHd&&(P.zoomedHd.style.transform=""),P.template&&(P.template.style.transition="opacity 150ms",P.template.style.opacity=0),P.original.dispatchEvent(Jt("medium-zoom:close",{detail:{zoom:z}})),P.zoomed.addEventListener("transitionend",F)})},g=function(){var A=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},F=A.target;return P.original?m():h({target:F})},v=function(){return C},_=function(){return O},E=function(){return P.original},O=[],S=[],I=!1,L=0,C=n,P={original:null,zoomed:null,zoomedHd:null,template:null};Object.prototype.toString.call(t)==="[object Object]"?C=t:(t||typeof t=="string")&&c(t),C=Lt({margin:0,background:"#fff",scrollOffset:40,container:null,template:null},C);var B=Lm(C.background);document.addEventListener("click",o),document.addEventListener("keyup",s),document.addEventListener("scroll",i),window.addEventListener("resize",m);var z={open:h,close:m,toggle:g,update:a,clone:l,attach:c,detach:u,on:d,off:f,getOptions:v,getImages:_,getZoomedImage:E};return z};function Hm(e,t){t===void 0&&(t={});var n=t.insertAt;if(!(!e||typeof document=="undefined")){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",n==="top"&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}var Fm=".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";Hm(Fm);var zm=Mm;const Bm=Symbol("mediumZoom");const $m=".theme-default-content > img, .theme-default-content :not(a) > img",Um={},qm=300;var Vm=yn(({app:e,router:t})=>{const n=zm(Um);n.refresh=(r=$m)=>{n.detach(),n.attach(r)},e.provide(Bm,n),t.afterEach(()=>{setTimeout(()=>n.refresh(),qm)})});const Km={logo:"/logo.png",contributors:!1,navbar:[{text:"Home",link:"/"},{text:"GitHub",link:"https://github.com/Vuepic/vue-datepicker"},{text:"Changelog",link:"https://github.com/Vuepic/vue-datepicker/releases"}],sidebar:[{text:"Getting Started",children:[{text:"Installation",link:"/installation/"}]},{text:"API",children:[{text:"Props",link:"/api/props/"},{text:"Slots",link:"/api/slots/"},{text:"Components",link:"/api/components/"},{text:"Events",link:"/api/events/"},{text:"Methods",link:"/api/methods/"}]},{text:"Customization",children:[{text:"Theming",link:"/customization/theming/"},{text:"Scss",link:"/customization/scss/"}]}],locales:{"/":{selectLanguageName:"English"}},darkMode:!0,repo:null,selectLanguageText:"Languages",selectLanguageAriaLabel:"Select language",sidebarDepth:2,editLink:!0,editLinkText:"Edit this page",lastUpdated:!0,lastUpdatedText:"Last Updated",contributorsText:"Contributors",notFound:["There's nothing here.","How did we get here?","That's a Four-Oh-Four.","Looks like we've got some broken links."],backToHome:"Take me home",openInNewWindow:"open in new window",toggleDarkMode:"toggle dark mode",toggleSidebar:"toggle sidebar"},Nc=Ne(Km),Wm=()=>Nc;Ki.webpackHot&&(__VUE_HMR_RUNTIME__.updateThemeData=e=>{Nc.value=e});const Mc=Symbol(""),Jm=()=>{const e=je(Mc);if(!e)throw new Error("useThemeLocaleData() is called without provider.");return e},Qm=(e,t)=>{var n;return Re(Re({},e),(n=e.locales)===null||n===void 0?void 0:n[t])};var Ym=yn(({app:e})=>{const t=Wm(),n=e._context.provides[Fi],r=Oe(()=>Qm(t.value,n.value));e.provide(Mc,r),Object.defineProperties(e.config.globalProperties,{$theme:{get(){return t.value}},$themeLocale:{get(){return r.value}}})});const Zm=Ye({props:{type:{type:String,required:!1,default:"tip"},text:{type:String,required:!1,default:""},vertical:{type:String,required:!1,default:void 0}},setup(e){return(t,n)=>(eo(),tc("span",{class:mn(["badge",e.type]),style:er({verticalAlign:e.vertical})},[ic(t.$slots,"default",{},()=>[Ti(Mu(e.text),1)])],6))}});var Gm=Ye({name:"CodeGroup",setup(e,{slots:t}){const n=Ne(-1),r=Ne([]),o=(a=n.value)=>{a<r.value.length-1?n.value=a+1:n.value=0,r.value[n.value].focus()},i=(a=n.value)=>{a>0?n.value=a-1:n.value=r.value.length-1,r.value[n.value].focus()},s=(a,l)=>{a.key===" "||a.key==="Enter"?(a.preventDefault(),n.value=l):a.key==="ArrowRight"?(a.preventDefault(),o(l)):a.key==="ArrowLeft"&&(a.preventDefault(),i(l))};return()=>{var a;const l=(((a=t.default)===null||a===void 0?void 0:a.call(t))||[]).filter(c=>c.type.name==="CodeGroupItem").map(c=>(c.props===null&&(c.props={}),c));return l.length===0?null:(n.value<0||n.value>l.length-1?(n.value=l.findIndex(c=>c.props.active===""||c.props.active===!0),n.value===-1&&(n.value=0)):l.forEach((c,u)=>{c.props.active=u===n.value}),be("div",{class:"code-group"},[be("div",{class:"code-group__nav"},be("ul",{class:"code-group__ul"},l.map((c,u)=>{const d=u===n.value;return be("li",{class:"code-group__li"},be("button",{ref:f=>{f&&(r.value[u]=f)},class:{"code-group__nav-tab":!0,"code-group__nav-tab-active":d},ariaPressed:d,ariaExpanded:d,onClick:()=>n.value=u,onKeydown:f=>s(f,u)},c.props.title))}))),l]))}}});const Xm=["aria-selected"],eh=Ye({name:"CodeGroupItem"}),th=Ye(It(Re({},eh),{props:{title:{type:String,required:!0},active:{type:Boolean,required:!1,default:!1}},setup(e){return(t,n)=>(eo(),tc("div",{class:mn(["code-group-item",{"code-group-item__active":e.active}]),"aria-selected":e.active},[ic(t.$slots,"default")],10,Xm))}}));function Hc(e){return Wu()?(Ju(e),!0):!1}const ir=typeof window!="undefined",nh=e=>typeof e=="string",bo=()=>{};function rh(e,t){function n(...r){e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})}return n}const oh=e=>e();var Qs=Object.getOwnPropertySymbols,ih=Object.prototype.hasOwnProperty,sh=Object.prototype.propertyIsEnumerable,ah=(e,t)=>{var n={};for(var r in e)ih.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&Qs)for(var r of Qs(e))t.indexOf(r)<0&&sh.call(e,r)&&(n[r]=e[r]);return n};function lh(e,t,n={}){const r=n,{eventFilter:o=oh}=r,i=ah(r,["eventFilter"]);return et(e,rh(o,t),i)}function ch(e,t=!0){Di()?at(e):t?e():Oi(e)}const zr=ir?window:void 0;ir&&window.document;ir&&window.navigator;ir&&window.location;function uh(...e){let t,n,r,o;if(nh(e[0])?([n,r,o]=e,t=zr):[t,n,r,o]=e,!t)return bo;let i=bo;const s=et(()=>zt(t),l=>{i(),l&&(l.addEventListener(n,r,o),i=()=>{l.removeEventListener(n,r,o),i=bo})},{immediate:!0,flush:"post"}),a=()=>{s(),i()};return Hc(a),a}function fh(e,t={}){const{window:n=zr}=t;let r;const o=Ne(!1),i=()=>{!n||(r||(r=n.matchMedia(e)),o.value=r.matches)};return ch(()=>{i(),r&&("addEventListener"in r?r.addEventListener("change",i):r.addListener(i),Hc(()=>{"removeEventListener"in i?r.removeEventListener("change",i):r.removeListener(i)}))}),o}const Ko=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},Wo="__vueuse_ssr_handlers__";Ko[Wo]=Ko[Wo]||{};const dh=Ko[Wo];function ph(e,t){return dh[e]||t}function mh(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"||Array.isArray(e)?"object":Number.isNaN(e)?"any":"number"}const hh={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))}};function vh(e,t,n,r={}){var o;const{flush:i="pre",deep:s=!0,listenToStorageChanges:a=!0,writeDefaults:l=!0,shallow:c,window:u=zr,eventFilter:d,onError:f=E=>{console.error(E)}}=r,h=zt(t),m=mh(h),g=(c?Il:Ne)(t),v=(o=r.serializer)!=null?o:hh[m];if(!n)try{n=ph("getDefaultStorage",()=>{var E;return(E=zr)==null?void 0:E.localStorage})()}catch(E){f(E)}function _(E){if(!(!n||E&&E.key!==e))try{const O=E?E.newValue:n.getItem(e);O==null?(g.value=h,l&&h!==null&&n.setItem(e,v.write(h))):typeof O!="string"?g.value=O:g.value=v.read(O)}catch(O){f(O)}}return _(),u&&a&&uh(u,"storage",E=>setTimeout(()=>_(E),0)),n&&lh(g,()=>{try{g.value==null?n.removeItem(e):n.setItem(e,v.write(g.value))}catch(E){f(E)}},{flush:i,deep:s,eventFilter:d}),g}function gh(e){return fh("(prefers-color-scheme: dark)",e)}var Ys,Zs;ir&&(window==null?void 0:window.navigator)&&((Ys=window==null?void 0:window.navigator)==null?void 0:Ys.platform)&&/iP(ad|hone|od)/.test((Zs=window==null?void 0:window.navigator)==null?void 0:Zs.platform);var _h=Object.defineProperty,Gs=Object.getOwnPropertySymbols,yh=Object.prototype.hasOwnProperty,bh=Object.prototype.propertyIsEnumerable,Xs=(e,t,n)=>t in e?_h(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,Eh=(e,t)=>{for(var n in t||(t={}))yh.call(t,n)&&Xs(e,n,t[n]);if(Gs)for(var n of Gs(t))bh.call(t,n)&&Xs(e,n,t[n]);return e};const Oh={top:0,left:0,bottom:0,right:0,height:0,width:0};Eh({text:""},Oh);const Fc=Symbol(""),B0=()=>{const e=je(Fc);if(!e)throw new Error("useDarkMode() is called without provider.");return e},wh=()=>{const e=Uc(),t=gh(),n=vh("vuepress-color-scheme","auto"),r=Oe({get(){return e.value.darkMode?n.value==="auto"?t.value:n.value==="dark":!1},set(o){o===t.value?n.value="auto":n.value=o?"dark":"light"}});Bt(Fc,r),Sh(r)},Sh=e=>{const t=(n=e.value)=>{const r=window==null?void 0:window.document.querySelector("html");r==null||r.classList.toggle("dark",n)};at(()=>{et(e,t,{immediate:!0})}),Ai(()=>t())},zc=(...e)=>{const n=oo().resolve(...e),r=n.matched[n.matched.length-1];if(!(r!=null&&r.redirect))return n;const{redirect:o}=r,i=oe(o)?o(n):o,s=me(i)?{path:i}:i;return zc(Re({hash:n.hash,query:n.query,params:n.params},s))},Ph=e=>{const t=zc(e);return{text:t.meta.title||e,link:t.name==="404"?e:t.fullPath}};let Eo=null,Sn=null;const Ch={wait:()=>Eo,pending:()=>{Eo=new Promise(e=>Sn=e)},resolve:()=>{Sn==null||Sn(),Eo=null,Sn=null}},Ah=()=>Ch,Bc=Symbol("sidebarItems"),$0=()=>{const e=je(Bc);if(!e)throw new Error("useSidebarItems() is called without provider.");return e},Ih=()=>{const e=Uc(),t=gm(),n=Oe(()=>xh(t.value,e.value));Bt(Bc,n)},xh=(e,t)=>{var n,r,o,i;const s=(r=(n=e.sidebar)!==null&&n!==void 0?n:t.sidebar)!==null&&r!==void 0?r:"auto",a=(i=(o=e.sidebarDepth)!==null&&o!==void 0?o:t.sidebarDepth)!==null&&i!==void 0?i:2;return e.home||s===!1?[]:s==="auto"?Th(a):G(s)?$c(s,a):Rc(s)?kh(s,a):[]},jh=(e,t)=>({text:e.title,link:`#${e.slug}`,children:$i(e.children,t)}),$i=(e,t)=>t>0?e.map(n=>jh(n,t-1)):[],Th=e=>{const t=or();return[{text:t.value.title,children:$i(t.value.headers,e)}]},$c=(e,t)=>{const n=Hi(),r=or(),o=i=>{var s;let a;if(me(i)?a=Ph(i):a=i,a.children)return It(Re({},a),{children:a.children.map(l=>o(l))});if(a.link===n.path){const l=((s=r.value.headers[0])===null||s===void 0?void 0:s.level)===1?r.value.headers[0].children:r.value.headers;return It(Re({},a),{children:$i(l,t)})}return a};return e.map(i=>o(i))},kh=(e,t)=>{var n;const r=Hi(),o=Lc(e,r.path),i=(n=e[o])!==null&&n!==void 0?n:[];return $c(i,t)},Uc=()=>Jm();var Dh=yn(({app:e,router:t})=>{e.component("Badge",Zm),e.component("CodeGroup",Gm),e.component("CodeGroupItem",th),e.component("NavbarSearch",()=>{const r=e.component("Docsearch")||e.component("SearchBox");return r?be(r):null});const n=t.options.scrollBehavior;t.options.scrollBehavior=async(...r)=>(await Ah().wait(),n(...r))}),Rh=({app:e})=>{e.component("CustomComponentsDemo",ce(()=>ne(()=>import("./CustomComponentsDemo.6ffe54b1.js"),["assets/CustomComponentsDemo.6ffe54b1.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DarkDemo",ce(()=>ne(()=>import("./DarkDemo.978c50ac.js"),["assets/DarkDemo.978c50ac.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("Demo",ce(()=>ne(()=>import("./Demo.b00e7c96.js"),["assets/Demo.b00e7c96.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DemoMarkers",ce(()=>ne(()=>import("./DemoMarkers.a0dd891d.js"),["assets/DemoMarkers.a0dd891d.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DemoSlots",ce(()=>ne(()=>import("./DemoSlots.3a91cfc5.js"),["assets/DemoSlots.3a91cfc5.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DisabledDatesDemo",ce(()=>ne(()=>import("./DisabledDatesDemo.19da2ab4.js"),["assets/DisabledDatesDemo.19da2ab4.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("EmptyDemo",ce(()=>ne(()=>import("./EmptyDemo.405dd01b.js"),["assets/EmptyDemo.405dd01b.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("FiltersDemo",ce(()=>ne(()=>import("./FiltersDemo.343240a4.js"),["assets/FiltersDemo.343240a4.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("FormatDemo",ce(()=>ne(()=>import("./FormatDemo.ab6ffbb0.js"),["assets/FormatDemo.ab6ffbb0.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("LocalizedOutput",ce(()=>ne(()=>import("./LocalizedOutput.a49834bc.js"),["assets/LocalizedOutput.a49834bc.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/index.fb659316.js"]))),e.component("MinMaxDemo",ce(()=>ne(()=>import("./MinMaxDemo.0c419d16.js"),["assets/MinMaxDemo.0c419d16.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("PresetRange",ce(()=>ne(()=>import("./PresetRange.38ff6d1d.js"),["assets/PresetRange.38ff6d1d.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("PreviewFormatDemo",ce(()=>ne(()=>import("./PreviewFormatDemo.711e0d27.js"),["assets/PreviewFormatDemo.711e0d27.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("RequiredDemo",ce(()=>ne(()=>import("./RequiredDemo.59726618.js"),["assets/RequiredDemo.59726618.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/index.fb659316.js"]))),e.component("TextInputDemo",ce(()=>ne(()=>import("./TextInputDemo.5620e83c.js"),["assets/TextInputDemo.5620e83c.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("TimezoneDemo",ce(()=>ne(()=>import("./TimezoneDemo.a5f28a5a.js"),["assets/TimezoneDemo.a5f28a5a.js","assets/vue-datepicker.es.e0a9f9bf.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ActionRowCmp",ce(()=>ne(()=>import("./ActionRowCmp.e7f86045.js"),["assets/ActionRowCmp.e7f86045.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ChevronLeftIcon",ce(()=>ne(()=>import("./ChevronLeftIcon.ce5da71b.js"),["assets/ChevronLeftIcon.ce5da71b.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ChevronRightIcon",ce(()=>ne(()=>import("./ChevronRightIcon.ca308293.js"),["assets/ChevronRightIcon.ca308293.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-MonthYearCmp",ce(()=>ne(()=>import("./MonthYearCmp.eb12c806.js"),["assets/MonthYearCmp.eb12c806.js","assets/ChevronLeftIcon.ce5da71b.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/ChevronRightIcon.ca308293.js"]))),e.component("customComponents-TimePickerCmp",ce(()=>ne(()=>import("./TimePickerCmp.212d1a54.js"),["assets/TimePickerCmp.212d1a54.js","assets/plugin-vue_export-helper.21dcd24c.js"])))};const Lh=e=>{if(window.dataLayer&&window.gtag)return;const t=document.createElement("script");t.src=`https://www.googletagmanager.com/gtag/js?id=${e}`,t.async=!0,document.head.appendChild(t),window.dataLayer=window.dataLayer||[],window.gtag=function(){dataLayer.push(arguments)},gtag("js",new Date),gtag("config",e)},Nh="G-MZXYGY1ZVV";var Mh=yn(()=>{Lh(Nh)});/*! @docsearch/js 3.0.0-alpha.42 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */function Qn(e){return Qn=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(t){return typeof t}:function(t){return t&&typeof Symbol=="function"&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},Qn(e)}function Hh(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Jo(){return Jo=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Jo.apply(this,arguments)}function ea(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function fe(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?ea(Object(n),!0).forEach(function(r){Hh(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ea(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Fh(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Br(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){if(!(typeof Symbol=="undefined"||!(Symbol.iterator in Object(n)))){var o=[],i=!0,s=!1,a=void 0;try{for(var l,c=n[Symbol.iterator]();!(i=(l=c.next()).done)&&(o.push(l.value),!r||o.length!==r);i=!0);}catch(u){s=!0,a=u}finally{try{i||c.return==null||c.return()}finally{if(s)throw a}}return o}}(e,t)||qc(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function $r(e){return function(t){if(Array.isArray(t))return Qo(t)}(e)||function(t){if(typeof Symbol!="undefined"&&Symbol.iterator in Object(t))return Array.from(t)}(e)||qc(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function qc(e,t){if(e){if(typeof e=="string")return Qo(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return n==="Object"&&e.constructor&&(n=e.constructor.name),n==="Map"||n==="Set"?Array.from(e):n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?Qo(e,t):void 0}}function Qo(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var Y,zn,Vc,ta,Kc,Ur={},Ui=[],zh=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function ft(e,t){for(var n in t)e[n]=t[n];return e}function Wc(e){var t=e.parentNode;t&&t.removeChild(e)}function ot(e,t,n){var r,o,i,s=arguments,a={};for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:a[i]=t[i];if(arguments.length>3)for(n=[n],i=3;i<arguments.length;i++)n.push(s[i]);if(n!=null&&(a.children=n),typeof e=="function"&&e.defaultProps!=null)for(i in e.defaultProps)a[i]===void 0&&(a[i]=e.defaultProps[i]);return Bn(e,a,r,o,null)}function Bn(e,t,n,r,o){var i={type:e,props:t,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:o==null?++Y.__v:o};return Y.vnode!=null&&Y.vnode(i),i}function At(e){return e.children}function it(e,t){this.props=e,this.context=t}function Yn(e,t){if(t==null)return e.__?Yn(e.__,e.__.__k.indexOf(e)+1):null;for(var n;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null)return n.__e;return typeof e.type=="function"?Yn(e):null}function Jc(e){var t,n;if((e=e.__)!=null&&e.__c!=null){for(e.__e=e.__c.base=null,t=0;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null){e.__e=e.__c.base=n.__e;break}return Jc(e)}}function Yo(e){(!e.__d&&(e.__d=!0)&&zn.push(e)&&!qr.__r++||ta!==Y.debounceRendering)&&((ta=Y.debounceRendering)||Vc)(qr)}function qr(){for(var e;qr.__r=zn.length;)e=zn.sort(function(t,n){return t.__v.__b-n.__v.__b}),zn=[],e.some(function(t){var n,r,o,i,s,a;t.__d&&(s=(i=(n=t).__v).__e,(a=n.__P)&&(r=[],(o=ft({},i)).__v=i.__v+1,qi(a,i,o,n.__n,a.ownerSVGElement!==void 0,i.__h!=null?[s]:null,r,s==null?Yn(i):s,i.__h),Gc(r,i),i.__e!=s&&Jc(i)))})}function Qc(e,t,n,r,o,i,s,a,l,c){var u,d,f,h,m,g,v,_=r&&r.__k||Ui,E=_.length;for(n.__k=[],u=0;u<t.length;u++)if((h=n.__k[u]=(h=t[u])==null||typeof h=="boolean"?null:typeof h=="string"||typeof h=="number"?Bn(null,h,null,null,h):Array.isArray(h)?Bn(At,{children:h},null,null,null):h.__b>0?Bn(h.type,h.props,h.key,null,h.__v):h)!=null){if(h.__=n,h.__b=n.__b+1,(f=_[u])===null||f&&h.key==f.key&&h.type===f.type)_[u]=void 0;else for(d=0;d<E;d++){if((f=_[d])&&h.key==f.key&&h.type===f.type){_[d]=void 0;break}f=null}qi(e,h,f=f||Ur,o,i,s,a,l,c),m=h.__e,(d=h.ref)&&f.ref!=d&&(v||(v=[]),f.ref&&v.push(f.ref,null,h),v.push(d,h.__c||m,h)),m!=null?(g==null&&(g=m),typeof h.type=="function"&&h.__k!=null&&h.__k===f.__k?h.__d=l=Yc(h,l,e):l=Zc(e,h,f,_,m,l),c||n.type!=="option"?typeof n.type=="function"&&(n.__d=l):e.value=""):l&&f.__e==l&&l.parentNode!=e&&(l=Yn(f))}for(n.__e=g,u=E;u--;)_[u]!=null&&(typeof n.type=="function"&&_[u].__e!=null&&_[u].__e==n.__d&&(n.__d=Yn(r,u+1)),eu(_[u],_[u]));if(v)for(u=0;u<v.length;u++)Xc(v[u],v[++u],v[++u])}function Yc(e,t,n){var r,o;for(r=0;r<e.__k.length;r++)(o=e.__k[r])&&(o.__=e,t=typeof o.type=="function"?Yc(o,t,n):Zc(n,o,o,e.__k,o.__e,t));return t}function dt(e,t){return t=t||[],e==null||typeof e=="boolean"||(Array.isArray(e)?e.some(function(n){dt(n,t)}):t.push(e)),t}function Zc(e,t,n,r,o,i){var s,a,l;if(t.__d!==void 0)s=t.__d,t.__d=void 0;else if(n==null||o!=i||o.parentNode==null)e:if(i==null||i.parentNode!==e)e.appendChild(o),s=null;else{for(a=i,l=0;(a=a.nextSibling)&&l<r.length;l+=2)if(a==o)break e;e.insertBefore(o,i),s=i}return s!==void 0?s:o.nextSibling}function na(e,t,n){t[0]==="-"?e.setProperty(t,n):e[t]=n==null?"":typeof n!="number"||zh.test(t)?n:n+"px"}function mr(e,t,n,r,o){var i;e:if(t==="style")if(typeof n=="string")e.style.cssText=n;else{if(typeof r=="string"&&(e.style.cssText=r=""),r)for(t in r)n&&t in n||na(e.style,t,"");if(n)for(t in n)r&&n[t]===r[t]||na(e.style,t,n[t])}else if(t[0]==="o"&&t[1]==="n")i=t!==(t=t.replace(/Capture$/,"")),t=t.toLowerCase()in e?t.toLowerCase().slice(2):t.slice(2),e.l||(e.l={}),e.l[t+i]=n,n?r||e.addEventListener(t,i?oa:ra,i):e.removeEventListener(t,i?oa:ra,i);else if(t!=="dangerouslySetInnerHTML"){if(o)t=t.replace(/xlink[H:h]/,"h").replace(/sName$/,"s");else if(t!=="href"&&t!=="list"&&t!=="form"&&t!=="download"&&t in e)try{e[t]=n==null?"":n;break e}catch{}typeof n=="function"||(n!=null&&(n!==!1||t[0]==="a"&&t[1]==="r")?e.setAttribute(t,n):e.removeAttribute(t))}}function ra(e){this.l[e.type+!1](Y.event?Y.event(e):e)}function oa(e){this.l[e.type+!0](Y.event?Y.event(e):e)}function qi(e,t,n,r,o,i,s,a,l){var c,u,d,f,h,m,g,v,_,E,O,S=t.type;if(t.constructor!==void 0)return null;n.__h!=null&&(l=n.__h,a=t.__e=n.__e,t.__h=null,i=[a]),(c=Y.__b)&&c(t);try{e:if(typeof S=="function"){if(v=t.props,_=(c=S.contextType)&&r[c.__c],E=c?_?_.props.value:c.__:r,n.__c?g=(u=t.__c=n.__c).__=u.__E:("prototype"in S&&S.prototype.render?t.__c=u=new S(v,E):(t.__c=u=new it(v,E),u.constructor=S,u.render=$h),_&&_.sub(u),u.props=v,u.state||(u.state={}),u.context=E,u.__n=r,d=u.__d=!0,u.__h=[]),u.__s==null&&(u.__s=u.state),S.getDerivedStateFromProps!=null&&(u.__s==u.state&&(u.__s=ft({},u.__s)),ft(u.__s,S.getDerivedStateFromProps(v,u.__s))),f=u.props,h=u.state,d)S.getDerivedStateFromProps==null&&u.componentWillMount!=null&&u.componentWillMount(),u.componentDidMount!=null&&u.__h.push(u.componentDidMount);else{if(S.getDerivedStateFromProps==null&&v!==f&&u.componentWillReceiveProps!=null&&u.componentWillReceiveProps(v,E),!u.__e&&u.shouldComponentUpdate!=null&&u.shouldComponentUpdate(v,u.__s,E)===!1||t.__v===n.__v){u.props=v,u.state=u.__s,t.__v!==n.__v&&(u.__d=!1),u.__v=t,t.__e=n.__e,t.__k=n.__k,u.__h.length&&s.push(u);break e}u.componentWillUpdate!=null&&u.componentWillUpdate(v,u.__s,E),u.componentDidUpdate!=null&&u.__h.push(function(){u.componentDidUpdate(f,h,m)})}u.context=E,u.props=v,u.state=u.__s,(c=Y.__r)&&c(t),u.__d=!1,u.__v=t,u.__P=e,c=u.render(u.props,u.state,u.context),u.state=u.__s,u.getChildContext!=null&&(r=ft(ft({},r),u.getChildContext())),d||u.getSnapshotBeforeUpdate==null||(m=u.getSnapshotBeforeUpdate(f,h)),O=c!=null&&c.type===At&&c.key==null?c.props.children:c,Qc(e,Array.isArray(O)?O:[O],t,n,r,o,i,s,a,l),u.base=t.__e,t.__h=null,u.__h.length&&s.push(u),g&&(u.__E=u.__=null),u.__e=!1}else i==null&&t.__v===n.__v?(t.__k=n.__k,t.__e=n.__e):t.__e=Bh(n.__e,t,n,r,o,i,s,l);(c=Y.diffed)&&c(t)}catch(I){t.__v=null,(l||i!=null)&&(t.__e=a,t.__h=!!l,i[i.indexOf(a)]=null),Y.__e(I,t,n)}}function Gc(e,t){Y.__c&&Y.__c(t,e),e.some(function(n){try{e=n.__h,n.__h=[],e.some(function(r){r.call(n)})}catch(r){Y.__e(r,n.__v)}})}function Bh(e,t,n,r,o,i,s,a){var l,c,u,d,f=n.props,h=t.props,m=t.type,g=0;if(m==="svg"&&(o=!0),i!=null){for(;g<i.length;g++)if((l=i[g])&&(l===e||(m?l.localName==m:l.nodeType==3))){e=l,i[g]=null;break}}if(e==null){if(m===null)return document.createTextNode(h);e=o?document.createElementNS("http://www.w3.org/2000/svg",m):document.createElement(m,h.is&&h),i=null,a=!1}if(m===null)f===h||a&&e.data===h||(e.data=h);else{if(i=i&&Ui.slice.call(e.childNodes),c=(f=n.props||Ur).dangerouslySetInnerHTML,u=h.dangerouslySetInnerHTML,!a){if(i!=null)for(f={},d=0;d<e.attributes.length;d++)f[e.attributes[d].name]=e.attributes[d].value;(u||c)&&(u&&(c&&u.__html==c.__html||u.__html===e.innerHTML)||(e.innerHTML=u&&u.__html||""))}if(function(v,_,E,O,S){var I;for(I in E)I==="children"||I==="key"||I in _||mr(v,I,null,E[I],O);for(I in _)S&&typeof _[I]!="function"||I==="children"||I==="key"||I==="value"||I==="checked"||E[I]===_[I]||mr(v,I,_[I],E[I],O)}(e,h,f,o,a),u)t.__k=[];else if(g=t.props.children,Qc(e,Array.isArray(g)?g:[g],t,n,r,o&&m!=="foreignObject",i,s,e.firstChild,a),i!=null)for(g=i.length;g--;)i[g]!=null&&Wc(i[g]);a||("value"in h&&(g=h.value)!==void 0&&(g!==e.value||m==="progress"&&!g)&&mr(e,"value",g,f.value,!1),"checked"in h&&(g=h.checked)!==void 0&&g!==e.checked&&mr(e,"checked",g,f.checked,!1))}return e}function Xc(e,t,n){try{typeof e=="function"?e(t):e.current=t}catch(r){Y.__e(r,n)}}function eu(e,t,n){var r,o,i;if(Y.unmount&&Y.unmount(e),(r=e.ref)&&(r.current&&r.current!==e.__e||Xc(r,null,t)),n||typeof e.type=="function"||(n=(o=e.__e)!=null),e.__e=e.__d=void 0,(r=e.__c)!=null){if(r.componentWillUnmount)try{r.componentWillUnmount()}catch(s){Y.__e(s,t)}r.base=r.__P=null}if(r=e.__k)for(i=0;i<r.length;i++)r[i]&&eu(r[i],t,n);o!=null&&Wc(o)}function $h(e,t,n){return this.constructor(e,n)}function Zn(e,t,n){var r,o,i;Y.__&&Y.__(e,t),o=(r=typeof n=="function")?null:n&&n.__k||t.__k,i=[],qi(t,e=(!r&&n||t).__k=ot(At,null,[e]),o||Ur,Ur,t.ownerSVGElement!==void 0,!r&&n?[n]:o?null:t.firstChild?Ui.slice.call(t.childNodes):null,i,!r&&n?n:o?o.__e:t.firstChild,r),Gc(i,e)}function tu(e,t){Zn(e,t,tu)}function Uh(e,t,n){var r,o,i,s=arguments,a=ft({},e.props);for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:a[i]=t[i];if(arguments.length>3)for(n=[n],i=3;i<arguments.length;i++)n.push(s[i]);return n!=null&&(a.children=n),Bn(e.type,a,r||e.key,o||e.ref,null)}Y={__e:function(e,t){for(var n,r,o;t=t.__;)if((n=t.__c)&&!n.__)try{if((r=n.constructor)&&r.getDerivedStateFromError!=null&&(n.setState(r.getDerivedStateFromError(e)),o=n.__d),n.componentDidCatch!=null&&(n.componentDidCatch(e),o=n.__d),o)return n.__E=n}catch(i){e=i}throw e},__v:0},it.prototype.setState=function(e,t){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=ft({},this.state),typeof e=="function"&&(e=e(ft({},n),this.props)),e&&ft(n,e),e!=null&&this.__v&&(t&&this.__h.push(t),Yo(this))},it.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),Yo(this))},it.prototype.render=At,zn=[],Vc=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,qr.__r=0,Kc=0;var pn,Me,ia,tn=0,Zo=[],sa=Y.__b,aa=Y.__r,la=Y.diffed,ca=Y.__c,ua=Y.unmount;function Gn(e,t){Y.__h&&Y.__h(Me,e,tn||t),tn=0;var n=Me.__H||(Me.__H={__:[],__h:[]});return e>=n.__.length&&n.__.push({}),n.__[e]}function fa(e,t,n){var r=Gn(pn++,2);return r.t=e,r.__c||(r.__=[n?n(t):nu(void 0,t),function(o){var i=r.t(r.__[0],o);r.__[0]!==i&&(r.__=[i,r.__[1]],r.__c.setState({}))}],r.__c=Me),r.__}function da(e,t){var n=Gn(pn++,4);!Y.__s&&Vi(n.__H,t)&&(n.__=e,n.__H=t,Me.__h.push(n))}function wr(e,t){var n=Gn(pn++,7);return Vi(n.__H,t)&&(n.__=e(),n.__H=t,n.__h=e),n.__}function qh(){Zo.forEach(function(e){if(e.__P)try{e.__H.__h.forEach(Sr),e.__H.__h.forEach(Go),e.__H.__h=[]}catch(t){e.__H.__h=[],Y.__e(t,e.__v)}}),Zo=[]}Y.__b=function(e){Me=null,sa&&sa(e)},Y.__r=function(e){aa&&aa(e),pn=0;var t=(Me=e.__c).__H;t&&(t.__h.forEach(Sr),t.__h.forEach(Go),t.__h=[])},Y.diffed=function(e){la&&la(e);var t=e.__c;t&&t.__H&&t.__H.__h.length&&(Zo.push(t)!==1&&ia===Y.requestAnimationFrame||((ia=Y.requestAnimationFrame)||function(n){var r,o=function(){clearTimeout(i),pa&&cancelAnimationFrame(r),setTimeout(n)},i=setTimeout(o,100);pa&&(r=requestAnimationFrame(o))})(qh)),Me=void 0},Y.__c=function(e,t){t.some(function(n){try{n.__h.forEach(Sr),n.__h=n.__h.filter(function(r){return!r.__||Go(r)})}catch(r){t.some(function(o){o.__h&&(o.__h=[])}),t=[],Y.__e(r,n.__v)}}),ca&&ca(e,t)},Y.unmount=function(e){ua&&ua(e);var t=e.__c;if(t&&t.__H)try{t.__H.__.forEach(Sr)}catch(n){Y.__e(n,t.__v)}};var pa=typeof requestAnimationFrame=="function";function Sr(e){var t=Me;typeof e.__c=="function"&&e.__c(),Me=t}function Go(e){var t=Me;e.__c=e.__(),Me=t}function Vi(e,t){return!e||e.length!==t.length||t.some(function(n,r){return n!==e[r]})}function nu(e,t){return typeof t=="function"?t(e):t}function ru(e,t){for(var n in t)e[n]=t[n];return e}function Xo(e,t){for(var n in e)if(n!=="__source"&&!(n in t))return!0;for(var r in t)if(r!=="__source"&&e[r]!==t[r])return!0;return!1}function ei(e){this.props=e}(ei.prototype=new it).isPureReactComponent=!0,ei.prototype.shouldComponentUpdate=function(e,t){return Xo(this.props,e)||Xo(this.state,t)};var ma=Y.__b;Y.__b=function(e){e.type&&e.type.__f&&e.ref&&(e.props.ref=e.ref,e.ref=null),ma&&ma(e)};var Vh=typeof Symbol!="undefined"&&Symbol.for&&Symbol.for("react.forward_ref")||3911,ha=function(e,t){return e==null?null:dt(dt(e).map(t))},Kh={map:ha,forEach:ha,count:function(e){return e?dt(e).length:0},only:function(e){var t=dt(e);if(t.length!==1)throw"Children.only";return t[0]},toArray:dt},Wh=Y.__e;function Pr(){this.__u=0,this.t=null,this.__b=null}function ou(e){var t=e.__.__c;return t&&t.__e&&t.__e(e)}function jn(){this.u=null,this.o=null}Y.__e=function(e,t,n){if(e.then){for(var r,o=t;o=o.__;)if((r=o.__c)&&r.__c)return t.__e==null&&(t.__e=n.__e,t.__k=n.__k),r.__c(e,t)}Wh(e,t,n)},(Pr.prototype=new it).__c=function(e,t){var n=t.__c,r=this;r.t==null&&(r.t=[]),r.t.push(n);var o=ou(r.__v),i=!1,s=function(){i||(i=!0,n.componentWillUnmount=n.__c,o?o(a):a())};n.__c=n.componentWillUnmount,n.componentWillUnmount=function(){s(),n.__c&&n.__c()};var a=function(){if(!--r.__u){if(r.state.__e){var c=r.state.__e;r.__v.__k[0]=function d(f,h,m){return f&&(f.__v=null,f.__k=f.__k&&f.__k.map(function(g){return d(g,h,m)}),f.__c&&f.__c.__P===h&&(f.__e&&m.insertBefore(f.__e,f.__d),f.__c.__e=!0,f.__c.__P=m)),f}(c,c.__c.__P,c.__c.__O)}var u;for(r.setState({__e:r.__b=null});u=r.t.pop();)u.forceUpdate()}},l=t.__h===!0;r.__u++||l||r.setState({__e:r.__b=r.__v.__k[0]}),e.then(s,s)},Pr.prototype.componentWillUnmount=function(){this.t=[]},Pr.prototype.render=function(e,t){if(this.__b){if(this.__v.__k){var n=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=function i(s,a,l){return s&&(s.__c&&s.__c.__H&&(s.__c.__H.__.forEach(function(c){typeof c.__c=="function"&&c.__c()}),s.__c.__H=null),(s=ru({},s)).__c!=null&&(s.__c.__P===l&&(s.__c.__P=a),s.__c=null),s.__k=s.__k&&s.__k.map(function(c){return i(c,a,l)})),s}(this.__b,n,r.__O=r.__P)}this.__b=null}var o=t.__e&&ot(At,null,e.fallback);return o&&(o.__h=null),[ot(At,null,t.__e?null:e.children),o]};var va=function(e,t,n){if(++n[1]===n[0]&&e.o.delete(t),e.props.revealOrder&&(e.props.revealOrder[0]!=="t"||!e.o.size))for(n=e.u;n;){for(;n.length>3;)n.pop()();if(n[1]<n[0])break;e.u=n=n[2]}};function Jh(e){return this.getChildContext=function(){return e.context},e.children}function Qh(e){var t=this,n=e.i;t.componentWillUnmount=function(){Zn(null,t.l),t.l=null,t.i=null},t.i&&t.i!==n&&t.componentWillUnmount(),e.__v?(t.l||(t.i=n,t.l={nodeType:1,parentNode:n,childNodes:[],appendChild:function(r){this.childNodes.push(r),t.i.appendChild(r)},insertBefore:function(r,o){this.childNodes.push(r),t.i.appendChild(r)},removeChild:function(r){this.childNodes.splice(this.childNodes.indexOf(r)>>>1,1),t.i.removeChild(r)}}),Zn(ot(Jh,{context:t.context},e.__v),t.l)):t.l&&t.componentWillUnmount()}function iu(e,t){return ot(Qh,{__v:e,i:t})}(jn.prototype=new it).__e=function(e){var t=this,n=ou(t.__v),r=t.o.get(e);return r[0]++,function(o){var i=function(){t.props.revealOrder?(r.push(o),va(t,e,r)):o()};n?n(i):i()}},jn.prototype.render=function(e){this.u=null,this.o=new Map;var t=dt(e.children);e.revealOrder&&e.revealOrder[0]==="b"&&t.reverse();for(var n=t.length;n--;)this.o.set(t[n],this.u=[1,0,this.u]);return e.children},jn.prototype.componentDidUpdate=jn.prototype.componentDidMount=function(){var e=this;this.o.forEach(function(t,n){va(e,n,t)})};var su=typeof Symbol!="undefined"&&Symbol.for&&Symbol.for("react.element")||60103,Yh=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,Zh=function(e){return(typeof Symbol!="undefined"&&Qn(Symbol())=="symbol"?/fil|che|rad/i:/fil|che|ra/i).test(e)};function au(e,t,n){return t.__k==null&&(t.textContent=""),Zn(e,t),typeof n=="function"&&n(),e?e.__c:null}it.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(e){Object.defineProperty(it.prototype,e,{configurable:!0,get:function(){return this["UNSAFE_"+e]},set:function(t){Object.defineProperty(this,e,{configurable:!0,writable:!0,value:t})}})});var ga=Y.event;function Gh(){}function Xh(){return this.cancelBubble}function ev(){return this.defaultPrevented}Y.event=function(e){return ga&&(e=ga(e)),e.persist=Gh,e.isPropagationStopped=Xh,e.isDefaultPrevented=ev,e.nativeEvent=e};var lu,_a={configurable:!0,get:function(){return this.class}},ya=Y.vnode;Y.vnode=function(e){var t=e.type,n=e.props,r=n;if(typeof t=="string"){for(var o in r={},n){var i=n[o];o==="value"&&"defaultValue"in n&&i==null||(o==="defaultValue"&&"value"in n&&n.value==null?o="value":o==="download"&&i===!0?i="":/ondoubleclick/i.test(o)?o="ondblclick":/^onchange(textarea|input)/i.test(o+t)&&!Zh(n.type)?o="oninput":/^on(Ani|Tra|Tou|BeforeInp)/.test(o)?o=o.toLowerCase():Yh.test(o)?o=o.replace(/[A-Z0-9]/,"-$&").toLowerCase():i===null&&(i=void 0),r[o]=i)}t=="select"&&r.multiple&&Array.isArray(r.value)&&(r.value=dt(n.children).forEach(function(s){s.props.selected=r.value.indexOf(s.props.value)!=-1})),t=="select"&&r.defaultValue!=null&&(r.value=dt(n.children).forEach(function(s){s.props.selected=r.multiple?r.defaultValue.indexOf(s.props.value)!=-1:r.defaultValue==s.props.value})),e.props=r}t&&n.class!=n.className&&(_a.enumerable="className"in n,n.className!=null&&(r.class=n.className),Object.defineProperty(r,"className",_a)),e.$$typeof=su,ya&&ya(e)};var ba=Y.__r;Y.__r=function(e){ba&&ba(e),lu=e.__c};var tv={ReactCurrentDispatcher:{current:{readContext:function(e){return lu.__n[e.__c].props.value}}}};(typeof performance=="undefined"?"undefined":Qn(performance))=="object"&&typeof performance.now=="function"&&performance.now.bind(performance);function Ea(e){return!!e&&e.$$typeof===su}var b={useState:function(e){return tn=1,fa(nu,e)},useReducer:fa,useEffect:function(e,t){var n=Gn(pn++,3);!Y.__s&&Vi(n.__H,t)&&(n.__=e,n.__H=t,Me.__H.__h.push(n))},useLayoutEffect:da,useRef:function(e){return tn=5,wr(function(){return{current:e}},[])},useImperativeHandle:function(e,t,n){tn=6,da(function(){typeof e=="function"?e(t()):e&&(e.current=t())},n==null?n:n.concat(e))},useMemo:wr,useCallback:function(e,t){return tn=8,wr(function(){return e},t)},useContext:function(e){var t=Me.context[e.__c],n=Gn(pn++,9);return n.__c=e,t?(n.__==null&&(n.__=!0,t.sub(Me)),t.props.value):e.__},useDebugValue:function(e,t){Y.useDebugValue&&Y.useDebugValue(t?t(e):e)},version:"16.8.0",Children:Kh,render:au,hydrate:function(e,t,n){return tu(e,t),typeof n=="function"&&n(),e?e.__c:null},unmountComponentAtNode:function(e){return!!e.__k&&(Zn(null,e),!0)},createPortal:iu,createElement:ot,createContext:function(e,t){var n={__c:t="__cC"+Kc++,__:e,Consumer:function(r,o){return r.children(o)},Provider:function(r){var o,i;return this.getChildContext||(o=[],(i={})[t]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(s){this.props.value!==s.value&&o.some(Yo)},this.sub=function(s){o.push(s);var a=s.componentWillUnmount;s.componentWillUnmount=function(){o.splice(o.indexOf(s),1),a&&a.call(s)}}),r.children}};return n.Provider.__=n.Consumer.contextType=n},createFactory:function(e){return ot.bind(null,e)},cloneElement:function(e){return Ea(e)?Uh.apply(null,arguments):e},createRef:function(){return{current:null}},Fragment:At,isValidElement:Ea,findDOMNode:function(e){return e&&(e.base||e.nodeType===1&&e)||null},Component:it,PureComponent:ei,memo:function(e,t){function n(o){var i=this.props.ref,s=i==o.ref;return!s&&i&&(i.call?i(null):i.current=null),t?!t(this.props,o)||!s:Xo(this.props,o)}function r(o){return this.shouldComponentUpdate=n,ot(e,o)}return r.displayName="Memo("+(e.displayName||e.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r},forwardRef:function(e){function t(n,r){var o=ru({},n);return delete o.ref,e(o,(r=n.ref||r)&&(Qn(r)!="object"||"current"in r)?r:null)}return t.$$typeof=Vh,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(e.displayName||e.name)+")",t},unstable_batchedUpdates:function(e,t){return e(t)},StrictMode:At,Suspense:Pr,SuspenseList:jn,lazy:function(e){var t,n,r;function o(i){if(t||(t=e()).then(function(s){n=s.default||s},function(s){r=s}),r)throw r;if(!n)throw t;return ot(n,i)}return o.displayName="Lazy",o.__f=!0,o},__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:tv};function nv(){return b.createElement("svg",{width:"15",height:"15",className:"DocSearch-Control-Key-Icon"},b.createElement("path",{d:"M4.505 4.496h2M5.505 5.496v5M8.216 4.496l.055 5.993M10 7.5c.333.333.5.667.5 1v2M12.326 4.5v5.996M8.384 4.496c1.674 0 2.116 0 2.116 1.5s-.442 1.5-2.116 1.5M3.205 9.303c-.09.448-.277 1.21-1.241 1.203C1 10.5.5 9.513.5 8V7c0-1.57.5-2.5 1.464-2.494.964.006 1.134.598 1.24 1.342M12.553 10.5h1.953",strokeWidth:"1.2",stroke:"currentColor",fill:"none",strokeLinecap:"square"}))}function cu(){return b.createElement("svg",{width:"20",height:"20",className:"DocSearch-Search-Icon",viewBox:"0 0 20 20"},b.createElement("path",{d:"M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}var rv=["translations"];function ti(){return ti=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},ti.apply(this,arguments)}function ov(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var iv=b.forwardRef(function(e,t){var n=e.translations,r=n===void 0?{}:n,o=ov(e,rv),i=r.buttonText,s=i===void 0?"Search":i,a=r.buttonAriaLabel,l=a===void 0?"Search":a,c=wr(function(){return typeof navigator!="undefined"?/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)?"\u2318":"Ctrl":null},[]);return b.createElement("button",ti({type:"button",className:"DocSearch DocSearch-Button","aria-label":l},o,{ref:t}),b.createElement("span",{className:"DocSearch-Button-Container"},b.createElement(cu,null),b.createElement("span",{className:"DocSearch-Button-Placeholder"},s)),b.createElement("span",{className:"DocSearch-Button-Keys"},c!==null&&b.createElement(b.Fragment,null,b.createElement("span",{className:"DocSearch-Button-Key"},c==="Ctrl"?b.createElement(nv,null):c),b.createElement("span",{className:"DocSearch-Button-Key"},"K"))))});function Xn(e){return e.reduce(function(t,n){return t.concat(n)},[])}var sv=0;function ni(e){return e.collections.length===0?0:e.collections.reduce(function(t,n){return t+n.items.length},0)}var av=function(){},lv=[{segment:"autocomplete-core",version:"1.5.0"}];function Oa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function cv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function uv(e,t,n){var r=t.initialState;return{getState:function(){return r},dispatch:function(o,i){var s=function(a){for(var l=1;l<arguments.length;l++){var c=arguments[l]!=null?arguments[l]:{};l%2?Oa(Object(c),!0).forEach(function(u){cv(a,u,c[u])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(c)):Oa(Object(c)).forEach(function(u){Object.defineProperty(a,u,Object.getOwnPropertyDescriptor(c,u))})}return a}({},r);r=e(r,{type:o,props:t,payload:i}),n({state:r,prevState:s})}}}function wa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function hr(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?wa(Object(n),!0).forEach(function(r){fv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):wa(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function fv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Sa(e,t,n,r){if(!n)return null;if(e<0&&(t===null||r!==null&&t===0))return n+e;var o=(t===null?-1:t)+e;return o<=-1||o>=n?r===null?null:0:o}function Pa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function dv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function pv(e,t){var n=[];return Promise.resolve(e(t)).then(function(r){return Promise.all(r.filter(function(o){return Boolean(o)}).map(function(o){if(o.sourceId,n.includes(o.sourceId))throw new Error("[Autocomplete] The `sourceId` ".concat(JSON.stringify(o.sourceId)," is not unique."));n.push(o.sourceId);var i=function(s){for(var a=1;a<arguments.length;a++){var l=arguments[a]!=null?arguments[a]:{};a%2?Pa(Object(l),!0).forEach(function(c){dv(s,c,l[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(l)):Pa(Object(l)).forEach(function(c){Object.defineProperty(s,c,Object.getOwnPropertyDescriptor(l,c))})}return s}({getItemInputValue:function(s){return s.state.query},getItemUrl:function(){},onSelect:function(s){(0,s.setIsOpen)(!1)},onActive:av},o);return Promise.resolve(i)}))})}function nn(e){var t=function(o){var i=o.collections.map(function(s){return s.items.length}).reduce(function(s,a,l){var c=(s[l-1]||0)+a;return s.push(c),s},[]).reduce(function(s,a){return a<=o.activeItemId?s+1:s},0);return o.collections[i]}(e);if(!t)return null;var n=t.items[function(o){for(var i=o.state,s=o.collection,a=!1,l=0,c=0;a===!1;){var u=i.collections[l];if(u===s){a=!0;break}c+=u.items.length,l++}return i.activeItemId-c}({state:e,collection:t})],r=t.source;return{item:n,itemInputValue:r.getItemInputValue({item:n,state:e}),itemUrl:r.getItemUrl({item:n,state:e}),source:r}}function Ca(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function vr(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ca(Object(n),!0).forEach(function(r){mv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ca(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function mv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function hv(e){return function(t){if(Array.isArray(t))return Oo(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return Oo(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return Oo(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Oo(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Aa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Qt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Aa(Object(n),!0).forEach(function(r){vv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Aa(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function vv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Ia(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function gr(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ia(Object(n),!0).forEach(function(r){uu(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ia(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function uu(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function gv(e){return function(t){if(Array.isArray(t))return wo(t)}(e)||function(t){if(typeof Symbol!="undefined"&&t[Symbol.iterator]!=null||t["@@iterator"]!=null)return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return wo(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return wo(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function wo(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function xa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function ja(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?xa(Object(n),!0).forEach(function(r){_v(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):xa(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function _v(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function _r(e){return Boolean(e.execute)}function yv(e,t){return n=e,Boolean(n==null?void 0:n.execute)?ja(ja({},e),{},{requests:e.queries.map(function(r){return{query:r,sourceId:t,transformResponse:e.transformResponse}})}):{items:e,sourceId:t};var n}function bv(e){var t=e.reduce(function(n,r){if(!_r(r))return n.push(r),n;var o=r.searchClient,i=r.execute,s=r.requests,a=n.find(function(u){return _r(r)&&_r(u)&&u.searchClient===o&&u.execute===i});if(a){var l;(l=a.items).push.apply(l,gv(s))}else{var c={execute:i,items:s,searchClient:o};n.push(c)}return n},[]).map(function(n){if(!_r(n))return Promise.resolve(n);var r=n,o=r.execute,i=r.items;return o({searchClient:r.searchClient,requests:i})});return Promise.all(t).then(function(n){return Xn(n)})}function Ev(e,t){return t.map(function(n){var r=e.filter(function(a){return a.sourceId===n.sourceId}),o=r.map(function(a){return a.items}),i=r[0].transformResponse,s=i?i(function(a){var l=a.map(function(c){var u;return vr(vr({},c),{},{hits:(u=c.hits)===null||u===void 0?void 0:u.map(function(d){return vr(vr({},d),{},{__autocomplete_indexName:c.index,__autocomplete_queryID:c.queryID})})})});return{results:l,hits:l.map(function(c){return c.hits}).filter(Boolean),facetHits:l.map(function(c){var u;return(u=c.facetHits)===null||u===void 0?void 0:u.map(function(d){return{label:d.value,count:d.count,_highlightResult:{label:{value:d.highlighted}}}})}).filter(Boolean)}}(o)):o;return s.every(Boolean),'The `getItems` function from source "'.concat(n.sourceId,'" must return an array of items but returned ').concat(JSON.stringify(void 0),`.
-
-Did you forget to return items?
-
-See: https://www.algolia.com/doc/ui-libraries/autocomplete/core-concepts/sources/#param-getitems`),{source:n,items:s}})}var Ov=["event","nextState","props","query","refresh","store"];function Ta(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Pn(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ta(Object(n),!0).forEach(function(r){wv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ta(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function wv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Sv(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var ka,So,yr,Cn=null,Da=(ka=-1,So=-1,yr=void 0,function(e){var t=++ka;return Promise.resolve(e).then(function(n){return yr&&t<So?yr:(So=t,yr=n,n)})});function en(e){var t=e.event,n=e.nextState,r=n===void 0?{}:n,o=e.props,i=e.query,s=e.refresh,a=e.store,l=Sv(e,Ov);Cn&&o.environment.clearTimeout(Cn);var c=l.setCollections,u=l.setIsOpen,d=l.setQuery,f=l.setActiveItemId,h=l.setStatus;if(d(i),f(o.defaultActiveItemId),!i&&o.openOnFocus===!1){var m,g=a.getState().collections.map(function(v){return Pn(Pn({},v),{},{items:[]})});return h("idle"),c(g),u((m=r.isOpen)!==null&&m!==void 0?m:o.shouldPanelOpen({state:a.getState()})),Da(g).then(function(){return Promise.resolve()})}return h("loading"),Cn=o.environment.setTimeout(function(){h("stalled")},o.stallThreshold),Da(o.getSources(Pn({query:i,refresh:s,state:a.getState()},l)).then(function(v){return Promise.all(v.map(function(_){return Promise.resolve(_.getItems(Pn({query:i,refresh:s,state:a.getState()},l))).then(function(E){return yv(E,_.sourceId)})})).then(bv).then(function(_){return Ev(_,v)}).then(function(_){return function(E){var O=E.collections,S=E.props,I=E.state,L=O.reduce(function(C,P){return gr(gr({},C),{},uu({},P.source.sourceId,gr(gr({},P.source),{},{getItems:function(){return Xn(P.items)}})))},{});return Xn(S.reshape({sources:Object.values(L),sourcesBySourceId:L,state:I})).filter(Boolean).map(function(C){return{source:C,items:C.getItems()}})}({collections:_,props:o,state:a.getState()})})})).then(function(v){var _;h("idle"),c(v);var E=o.shouldPanelOpen({state:a.getState()});u((_=r.isOpen)!==null&&_!==void 0?_:o.openOnFocus&&!i&&E||E);var O=nn(a.getState());if(a.getState().activeItemId!==null&&O){var S=O.item,I=O.itemInputValue,L=O.itemUrl,C=O.source;C.onActive(Pn({event:t,item:S,itemInputValue:I,itemUrl:L,refresh:s,source:C,state:a.getState()},l))}}).finally(function(){Cn&&o.environment.clearTimeout(Cn)})}var Pv=["event","props","refresh","store"];function Ra(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Tt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ra(Object(n),!0).forEach(function(r){Cv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ra(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Cv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Av(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var Iv=["props","refresh","store"],xv=["inputElement","formElement","panelElement"],jv=["inputElement"],Tv=["inputElement","maxLength"],kv=["item","source"];function La(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function De(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?La(Object(n),!0).forEach(function(r){Dv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):La(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Dv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function An(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Rv(e){var t=e.props,n=e.refresh,r=e.store,o=An(e,Iv);return{getEnvironmentProps:function(i){var s=i.inputElement,a=i.formElement,l=i.panelElement;return De({onTouchStart:function(c){r.getState().isOpen!==!1&&c.target!==s&&[a,l].some(function(u){return d=u,f=c.target,d===f||d.contains(f);var d,f})===!1&&r.dispatch("blur",null)},onTouchMove:function(c){r.getState().isOpen!==!1&&s===t.environment.document.activeElement&&c.target!==s&&s.blur()}},An(i,xv))},getRootProps:function(i){return De({role:"combobox","aria-expanded":r.getState().isOpen,"aria-haspopup":"listbox","aria-owns":r.getState().isOpen?"".concat(t.id,"-list"):void 0,"aria-labelledby":"".concat(t.id,"-label")},i)},getFormProps:function(i){return i.inputElement,De({action:"",noValidate:!0,role:"search",onSubmit:function(s){var a;s.preventDefault(),t.onSubmit(De({event:s,refresh:n,state:r.getState()},o)),r.dispatch("submit",null),(a=i.inputElement)===null||a===void 0||a.blur()},onReset:function(s){var a;s.preventDefault(),t.onReset(De({event:s,refresh:n,state:r.getState()},o)),r.dispatch("reset",null),(a=i.inputElement)===null||a===void 0||a.focus()}},An(i,jv))},getLabelProps:function(i){return De({htmlFor:"".concat(t.id,"-input"),id:"".concat(t.id,"-label")},i)},getInputProps:function(i){function s(h){(t.openOnFocus||Boolean(r.getState().query))&&en(De({event:h,props:t,query:r.getState().completion||r.getState().query,refresh:n,store:r},o)),r.dispatch("focus",null)}var a="ontouchstart"in t.environment,l=i||{},c=(l.inputElement,l.maxLength),u=c===void 0?512:c,d=An(l,Tv),f=nn(r.getState());return De({"aria-autocomplete":"both","aria-activedescendant":r.getState().isOpen&&r.getState().activeItemId!==null?"".concat(t.id,"-item-").concat(r.getState().activeItemId):void 0,"aria-controls":r.getState().isOpen?"".concat(t.id,"-list"):void 0,"aria-labelledby":"".concat(t.id,"-label"),value:r.getState().completion||r.getState().query,id:"".concat(t.id,"-input"),autoComplete:"off",autoCorrect:"off",autoCapitalize:"off",enterKeyHint:f!=null&&f.itemUrl?"go":"search",spellCheck:"false",autoFocus:t.autoFocus,placeholder:t.placeholder,maxLength:u,type:"search",onChange:function(h){en(De({event:h,props:t,query:h.currentTarget.value.slice(0,u),refresh:n,store:r},o))},onKeyDown:function(h){(function(m){var g=m.event,v=m.props,_=m.refresh,E=m.store,O=Av(m,Pv);if(g.key==="ArrowUp"||g.key==="ArrowDown"){var S=function(){var $=v.environment.document.getElementById("".concat(v.id,"-item-").concat(E.getState().activeItemId));$&&($.scrollIntoViewIfNeeded?$.scrollIntoViewIfNeeded(!1):$.scrollIntoView(!1))},I=function(){var $=nn(E.getState());if(E.getState().activeItemId!==null&&$){var A=$.item,F=$.itemInputValue,Q=$.itemUrl,se=$.source;se.onActive(Tt({event:g,item:A,itemInputValue:F,itemUrl:Q,refresh:_,source:se,state:E.getState()},O))}};g.preventDefault(),E.getState().isOpen===!1&&(v.openOnFocus||Boolean(E.getState().query))?en(Tt({event:g,props:v,query:E.getState().query,refresh:_,store:E},O)).then(function(){E.dispatch(g.key,{nextActiveItemId:v.defaultActiveItemId}),I(),setTimeout(S,0)}):(E.dispatch(g.key,{}),I(),S())}else if(g.key==="Escape")g.preventDefault(),E.dispatch(g.key,null);else if(g.key==="Enter"){if(E.getState().activeItemId===null||E.getState().collections.every(function($){return $.items.length===0}))return;g.preventDefault();var L=nn(E.getState()),C=L.item,P=L.itemInputValue,B=L.itemUrl,z=L.source;if(g.metaKey||g.ctrlKey)B!==void 0&&(z.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:B,refresh:_,source:z,state:E.getState()},O)),v.navigator.navigateNewTab({itemUrl:B,item:C,state:E.getState()}));else if(g.shiftKey)B!==void 0&&(z.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:B,refresh:_,source:z,state:E.getState()},O)),v.navigator.navigateNewWindow({itemUrl:B,item:C,state:E.getState()}));else if(!g.altKey){if(B!==void 0)return z.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:B,refresh:_,source:z,state:E.getState()},O)),void v.navigator.navigate({itemUrl:B,item:C,state:E.getState()});en(Tt({event:g,nextState:{isOpen:!1},props:v,query:P,refresh:_,store:E},O)).then(function(){z.onSelect(Tt({event:g,item:C,itemInputValue:P,itemUrl:B,refresh:_,source:z,state:E.getState()},O))})}}})(De({event:h,props:t,refresh:n,store:r},o))},onFocus:s,onBlur:function(){a||r.dispatch("blur",null)},onClick:function(h){i.inputElement!==t.environment.document.activeElement||r.getState().isOpen||s(h)}},d)},getPanelProps:function(i){return De({onMouseDown:function(s){s.preventDefault()},onMouseLeave:function(){r.dispatch("mouseleave",null)}},i)},getListProps:function(i){return De({role:"listbox","aria-labelledby":"".concat(t.id,"-label"),id:"".concat(t.id,"-list")},i)},getItemProps:function(i){var s=i.item,a=i.source,l=An(i,kv);return De({id:"".concat(t.id,"-item-").concat(s.__autocomplete_id),role:"option","aria-selected":r.getState().activeItemId===s.__autocomplete_id,onMouseMove:function(c){if(s.__autocomplete_id!==r.getState().activeItemId){r.dispatch("mousemove",s.__autocomplete_id);var u=nn(r.getState());if(r.getState().activeItemId!==null&&u){var d=u.item,f=u.itemInputValue,h=u.itemUrl,m=u.source;m.onActive(De({event:c,item:d,itemInputValue:f,itemUrl:h,refresh:n,source:m,state:r.getState()},o))}}},onMouseDown:function(c){c.preventDefault()},onClick:function(c){var u=a.getItemInputValue({item:s,state:r.getState()}),d=a.getItemUrl({item:s,state:r.getState()});(d?Promise.resolve():en(De({event:c,nextState:{isOpen:!1},props:t,query:u,refresh:n,store:r},o))).then(function(){a.onSelect(De({event:c,item:s,itemInputValue:u,itemUrl:d,refresh:n,source:a,state:r.getState()},o))})}},l)}}}function Na(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Lv(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Na(Object(n),!0).forEach(function(r){fu(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Na(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function fu(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Nv(e){var t,n,r,o,i=e.plugins,s=e.options,a=(t=(((n=s.__autocomplete_metadata)===null||n===void 0?void 0:n.userAgents)||[])[0])===null||t===void 0?void 0:t.segment,l=a?fu({},a,Object.keys(((r=s.__autocomplete_metadata)===null||r===void 0?void 0:r.options)||{})):{};return{plugins:i.map(function(c){return{name:c.name,options:Object.keys(c.__autocomplete_pluginOptions||[])}}),options:Lv({"autocomplete-core":Object.keys(s)},l),ua:lv.concat(((o=s.__autocomplete_metadata)===null||o===void 0?void 0:o.userAgents)||[])}}function Ma(e){var t,n=e.state;return n.isOpen===!1||n.activeItemId===null?null:((t=nn(n))===null||t===void 0?void 0:t.itemInputValue)||null}function Ha(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function ae(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ha(Object(n),!0).forEach(function(r){Mv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ha(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Mv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var Hv=function(e,t){switch(t.type){case"setActiveItemId":case"mousemove":return ae(ae({},e),{},{activeItemId:t.payload});case"setQuery":return ae(ae({},e),{},{query:t.payload,completion:null});case"setCollections":return ae(ae({},e),{},{collections:t.payload});case"setIsOpen":return ae(ae({},e),{},{isOpen:t.payload});case"setStatus":return ae(ae({},e),{},{status:t.payload});case"setContext":return ae(ae({},e),{},{context:ae(ae({},e.context),t.payload)});case"ArrowDown":var n=ae(ae({},e),{},{activeItemId:t.payload.hasOwnProperty("nextActiveItemId")?t.payload.nextActiveItemId:Sa(1,e.activeItemId,ni(e),t.props.defaultActiveItemId)});return ae(ae({},n),{},{completion:Ma({state:n})});case"ArrowUp":var r=ae(ae({},e),{},{activeItemId:Sa(-1,e.activeItemId,ni(e),t.props.defaultActiveItemId)});return ae(ae({},r),{},{completion:Ma({state:r})});case"Escape":return e.isOpen?ae(ae({},e),{},{activeItemId:null,isOpen:!1,completion:null}):ae(ae({},e),{},{activeItemId:null,query:"",status:"idle",collections:[]});case"submit":return ae(ae({},e),{},{activeItemId:null,isOpen:!1,status:"idle"});case"reset":return ae(ae({},e),{},{activeItemId:t.props.openOnFocus===!0?t.props.defaultActiveItemId:null,status:"idle",query:""});case"focus":return ae(ae({},e),{},{activeItemId:t.props.defaultActiveItemId,isOpen:(t.props.openOnFocus||Boolean(e.query))&&t.props.shouldPanelOpen({state:e})});case"blur":return t.props.debug?e:ae(ae({},e),{},{isOpen:!1,activeItemId:null});case"mouseleave":return ae(ae({},e),{},{activeItemId:t.props.defaultActiveItemId});default:return"The reducer action ".concat(JSON.stringify(t.type)," is not supported."),e}};function Fa(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function kt(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Fa(Object(n),!0).forEach(function(r){Fv(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Fa(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Fv(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function zv(e){var t=[],n=function(a,l){var c,u=typeof window!="undefined"?window:{},d=a.plugins||[];return Qt(Qt({debug:!1,openOnFocus:!1,placeholder:"",autoFocus:!1,defaultActiveItemId:null,stallThreshold:300,environment:u,shouldPanelOpen:function(f){return ni(f.state)>0},reshape:function(f){return f.sources}},a),{},{id:(c=a.id)!==null&&c!==void 0?c:"autocomplete-".concat(sv++),plugins:d,initialState:Qt({activeItemId:null,query:"",completion:null,collections:[],isOpen:!1,status:"idle",context:{}},a.initialState),onStateChange:function(f){var h;(h=a.onStateChange)===null||h===void 0||h.call(a,f),d.forEach(function(m){var g;return(g=m.onStateChange)===null||g===void 0?void 0:g.call(m,f)})},onSubmit:function(f){var h;(h=a.onSubmit)===null||h===void 0||h.call(a,f),d.forEach(function(m){var g;return(g=m.onSubmit)===null||g===void 0?void 0:g.call(m,f)})},onReset:function(f){var h;(h=a.onReset)===null||h===void 0||h.call(a,f),d.forEach(function(m){var g;return(g=m.onReset)===null||g===void 0?void 0:g.call(m,f)})},getSources:function(f){return Promise.all([].concat(hv(d.map(function(h){return h.getSources})),[a.getSources]).filter(Boolean).map(function(h){return pv(h,f)})).then(function(h){return Xn(h)}).then(function(h){return h.map(function(m){return Qt(Qt({},m),{},{onSelect:function(g){m.onSelect(g),l.forEach(function(v){var _;return(_=v.onSelect)===null||_===void 0?void 0:_.call(v,g)})},onActive:function(g){m.onActive(g),l.forEach(function(v){var _;return(_=v.onActive)===null||_===void 0?void 0:_.call(v,g)})}})})})},navigator:Qt({navigate:function(f){var h=f.itemUrl;u.location.assign(h)},navigateNewTab:function(f){var h=f.itemUrl,m=u.open(h,"_blank","noopener");m==null||m.focus()},navigateNewWindow:function(f){var h=f.itemUrl;u.open(h,"_blank","noopener")}},a.navigator)})}(e,t),r=uv(Hv,n,function(a){var l=a.prevState,c=a.state;n.onStateChange(kt({prevState:l,state:c,refresh:s},o))}),o=function(a){var l=a.store;return{setActiveItemId:function(c){l.dispatch("setActiveItemId",c)},setQuery:function(c){l.dispatch("setQuery",c)},setCollections:function(c){var u=0,d=c.map(function(f){return hr(hr({},f),{},{items:Xn(f.items).map(function(h){return hr(hr({},h),{},{__autocomplete_id:u++})})})});l.dispatch("setCollections",d)},setIsOpen:function(c){l.dispatch("setIsOpen",c)},setStatus:function(c){l.dispatch("setStatus",c)},setContext:function(c){l.dispatch("setContext",c)}}}({store:r}),i=Rv(kt({props:n,refresh:s,store:r},o));function s(){return en(kt({event:new Event("input"),nextState:{isOpen:r.getState().isOpen},props:n,query:r.getState().query,refresh:s,store:r},o))}return n.plugins.forEach(function(a){var l;return(l=a.subscribe)===null||l===void 0?void 0:l.call(a,kt(kt({},o),{},{refresh:s,onSelect:function(c){t.push({onSelect:c})},onActive:function(c){t.push({onActive:c})}}))}),function(a){var l,c=a.metadata,u=a.environment;if(!((l=u.navigator)===null||l===void 0)&&l.userAgent.includes("Algolia Crawler")){var d=u.document.createElement("meta"),f=u.document.querySelector("head");d.name="algolia:metadata",setTimeout(function(){d.content=JSON.stringify(c),f.appendChild(d)},0)}}({metadata:Nv({plugins:n.plugins,options:e}),environment:n.environment}),kt(kt({refresh:s},i),o)}function Bv(e){var t=e.translations,n=(t===void 0?{}:t).searchByText,r=n===void 0?"Search by":n;return b.createElement("a",{href:"https://www.algolia.com/docsearch",target:"_blank",rel:"noopener noreferrer"},b.createElement("span",{className:"DocSearch-Label"},r),b.createElement("svg",{width:"77",height:"19"},b.createElement("path",{d:"M2.5067 0h14.0245c1.384.001 2.5058 1.1205 2.5068 2.5017V16.5c-.0014 1.3808-1.1232 2.4995-2.5068 2.5H2.5067C1.1232 18.9995.0014 17.8808 0 16.5V2.4958A2.495 2.495 0 01.735.7294 2.505 2.505 0 012.5068 0zM37.95 15.0695c-3.7068.0168-3.7068-2.986-3.7068-3.4634L34.2372.3576 36.498 0v11.1794c0 .2715 0 1.9889 1.452 1.994v1.8961zm-9.1666-1.8388c.694 0 1.2086-.0397 1.5678-.1088v-2.2934a5.3639 5.3639 0 00-1.3303-.1679 4.8283 4.8283 0 00-.758.0582 2.2845 2.2845 0 00-.688.2024c-.2029.0979-.371.2362-.4919.4142-.1268.1788-.185.2826-.185.5533 0 .5297.185.8359.5205 1.0375.3355.2016.7928.3053 1.365.3053v-.0008zm-.1969-8.1817c.7463 0 1.3768.092 1.8856.2767.5088.1838.9195.4428 1.2204.7717.3068.334.5147.7777.6423 1.251.1327.4723.196.991.196 1.5603v5.798c-.5235.1036-1.05.192-1.5787.2649-.7048.1037-1.4976.156-2.3774.156-.5832 0-1.1215-.0582-1.6016-.167a3.385 3.385 0 01-1.2432-.5364 2.6034 2.6034 0 01-.8037-.9565c-.191-.3922-.29-.9447-.29-1.5208 0-.5533.11-.905.3246-1.2863a2.7351 2.7351 0 01.8849-.9329c.376-.242.8029-.415 1.2948-.5187a7.4517 7.4517 0 011.5381-.156 7.1162 7.1162 0 011.6667.2024V8.886c0-.259-.0296-.5061-.093-.7372a1.5847 1.5847 0 00-.3245-.6158 1.5079 1.5079 0 00-.6119-.4158 2.6788 2.6788 0 00-.966-.173c-.5206 0-.9948.0634-1.4283.1384a6.5481 6.5481 0 00-1.065.259l-.2712-1.849c.2831-.0986.7048-.1964 1.2491-.2943a9.2979 9.2979 0 011.752-.1501v.0008zm44.6597 8.1193c.6947 0 1.2086-.0405 1.567-.1097v-2.2942a5.3743 5.3743 0 00-1.3303-.1679c-.2485 0-.503.0177-.7573.0582a2.2853 2.2853 0 00-.688.2024 1.2333 1.2333 0 00-.4918.4142c-.1268.1788-.1843.2826-.1843.5533 0 .5297.1843.8359.5198 1.0375.3414.2066.7927.3053 1.365.3053v.0009zm-.191-8.1767c.7463 0 1.3768.0912 1.8856.2759.5087.1847.9195.4436 1.2204.7717.3.329.5147.7786.6414 1.251a5.7248 5.7248 0 01.197 1.562v5.7972c-.3466.0742-.874.1602-1.5788.2648-.7049.1038-1.4976.1552-2.3774.1552-.5832 0-1.1215-.0573-1.6016-.167a3.385 3.385 0 01-1.2432-.5356 2.6034 2.6034 0 01-.8038-.9565c-.191-.3922-.2898-.9447-.2898-1.5216 0-.5533.1098-.905.3245-1.2854a2.7373 2.7373 0 01.8849-.9338c.376-.2412.8029-.4141 1.2947-.5178a7.4545 7.4545 0 012.325-.1097c.2781.0287.5672.081.879.156v-.3686a2.7781 2.7781 0 00-.092-.738 1.5788 1.5788 0 00-.3246-.6166 1.5079 1.5079 0 00-.612-.415 2.6797 2.6797 0 00-.966-.1729c-.5205 0-.9947.0633-1.4282.1384a6.5608 6.5608 0 00-1.065.259l-.2712-1.8498c.283-.0979.7048-.1957 1.2491-.2935a9.8597 9.8597 0 011.752-.1494zm-6.79-1.072c-.7576.001-1.373-.6103-1.3759-1.3664 0-.755.6128-1.3664 1.376-1.3664.764 0 1.3775.6115 1.3775 1.3664s-.6195 1.3664-1.3776 1.3664zm1.1393 11.1507h-2.2726V5.3409l2.2734-.3568v10.0845l-.0008.0017zm-3.984 0c-3.707.0168-3.707-2.986-3.707-3.4642L59.7069.3576 61.9685 0v11.1794c0 .2715 0 1.9889 1.452 1.994V15.0703zm-7.3512-4.979c0-.975-.2138-1.7873-.6305-2.3516-.4167-.571-.9998-.852-1.747-.852-.7454 0-1.3302.281-1.7452.852-.4166.5702-.6195 1.3765-.6195 2.3516 0 .9851.208 1.6473.6254 2.2183.4158.576.9998.8587 1.7461.8587.7454 0 1.3303-.2885 1.747-.8595.4158-.5761.6237-1.2315.6237-2.2184v.0009zm2.3132-.006c0 .7609-.1099 1.3361-.3356 1.9654a4.654 4.654 0 01-.9533 1.6076A4.214 4.214 0 0155.613 14.69c-.579.2412-1.4697.3795-1.9143.3795-.4462-.005-1.3303-.1324-1.9033-.3795a4.307 4.307 0 01-1.474-1.0316c-.4115-.4445-.7293-.9801-.9609-1.6076a5.3423 5.3423 0 01-.3465-1.9653c0-.7608.104-1.493.3356-2.1155a4.683 4.683 0 01.9719-1.5958 4.3383 4.3383 0 011.479-1.0257c.5739-.242 1.2043-.3567 1.8864-.3567.6829 0 1.3125.1197 1.8906.3567a4.1245 4.1245 0 011.4816 1.0257 4.7587 4.7587 0 01.9592 1.5958c.2426.6225.3643 1.3547.3643 2.1155zm-17.0198 0c0 .9448.208 1.9932.6238 2.431.4166.4386.955.6579 1.6142.6579.3584 0 .6998-.0523 1.0176-.1502.3186-.0978.5721-.2134.775-.3517V7.0784a8.8706 8.8706 0 00-1.4926-.1906c-.8206-.0236-1.4452.312-1.8847.8468-.4335.5365-.6533 1.476-.6533 2.3516v-.0008zm6.2863 4.4485c0 1.5385-.3938 2.662-1.1866 3.3773-.791.7136-2.0005 1.0712-3.6308 1.0712-.5958 0-1.834-.1156-2.8228-.334l.3643-1.7865c.8282.173 1.9202.2193 2.4932.2193.9077 0 1.555-.1847 1.943-.5533.388-.3686.578-.916.578-1.643v-.3687a6.8289 6.8289 0 01-.8848.3349c-.3634.1096-.786.167-1.261.167-.6246 0-1.1917-.0979-1.7055-.2944a3.5554 3.5554 0 01-1.3244-.8645c-.3642-.3796-.6541-.8579-.8561-1.4289-.2028-.571-.3068-1.59-.3068-2.339 0-.7034.1099-1.5856.3245-2.1735.2198-.5871.5316-1.0949.9542-1.515.4167-.42.9255-.743 1.5213-.98a5.5923 5.5923 0 012.052-.3855c.7353 0 1.4114.092 2.0707.2024.6592.1088 1.2204.2236 1.6776.35v8.945-.0008zM11.5026 4.2418v-.6511c-.0005-.4553-.3704-.8241-.8266-.8241H8.749c-.4561 0-.826.3688-.8265.824v.669c0 .0742.0693.1264.1445.1096a6.0346 6.0346 0 011.6768-.2362 6.125 6.125 0 011.6202.2185.1116.1116 0 00.1386-.1097zm-5.2806.852l-.3296-.3282a.8266.8266 0 00-1.168 0l-.393.3922a.8199.8199 0 000 1.164l.3237.323c.0524.0515.1268.0397.1733-.0117.191-.259.3989-.507.6305-.7372.2374-.2362.48-.4437.7462-.6335.0575-.0354.0634-.1155.017-.1687zm3.5159 2.069v2.818c0 .081.0879.1392.1622.0987l2.5102-1.2964c.0574-.0287.0752-.0987.0464-.1552a3.1237 3.1237 0 00-2.603-1.574c-.0575 0-.115.0456-.115.1097l-.0008-.0009zm.0008 6.789c-2.0933.0005-3.7915-1.6912-3.7947-3.7804C5.9468 8.0821 7.6452 6.39 9.7387 6.391c2.0932-.0005 3.7911 1.6914 3.794 3.7804a3.7783 3.7783 0 01-1.1124 2.675 3.7936 3.7936 0 01-2.6824 1.1054h.0008zM9.738 4.8002c-1.9218 0-3.6975 1.0232-4.6584 2.6841a5.359 5.359 0 000 5.3683c.9609 1.661 2.7366 2.6841 4.6584 2.6841a5.3891 5.3891 0 003.8073-1.5725 5.3675 5.3675 0 001.578-3.7987 5.3574 5.3574 0 00-1.5771-3.797A5.379 5.379 0 009.7387 4.801l-.0008-.0008z",fill:"currentColor",fillRule:"evenodd"})))}function br(e){return b.createElement("svg",{width:"15",height:"15"},b.createElement("g",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.2"},e.children))}function $v(e){var t=e.translations,n=t===void 0?{}:t,r=n.selectText,o=r===void 0?"to select":r,i=n.navigateText,s=i===void 0?"to navigate":i,a=n.closeText,l=a===void 0?"to close":a,c=n.searchByText,u=c===void 0?"Search by":c;return b.createElement(b.Fragment,null,b.createElement("div",{className:"DocSearch-Logo"},b.createElement(Bv,{translations:{searchByText:u}})),b.createElement("ul",{className:"DocSearch-Commands"},b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(br,null,b.createElement("path",{d:"M12 3.53088v3c0 1-1 2-2 2H4M7 11.53088l-3-3 3-3"}))),b.createElement("span",{className:"DocSearch-Label"},o)),b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(br,null,b.createElement("path",{d:"M7.5 3.5v8M10.5 8.5l-3 3-3-3"}))),b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(br,null,b.createElement("path",{d:"M7.5 11.5v-8M10.5 6.5l-3-3-3 3"}))),b.createElement("span",{className:"DocSearch-Label"},s)),b.createElement("li",null,b.createElement("span",{className:"DocSearch-Commands-Key"},b.createElement(br,null,b.createElement("path",{d:"M13.6167 8.936c-.1065.3583-.6883.962-1.4875.962-.7993 0-1.653-.9165-1.653-2.1258v-.5678c0-1.2548.7896-2.1016 1.653-2.1016.8634 0 1.3601.4778 1.4875 1.0724M9 6c-.1352-.4735-.7506-.9219-1.46-.8972-.7092.0246-1.344.57-1.344 1.2166s.4198.8812 1.3445.9805C8.465 7.3992 8.968 7.9337 9 8.5c.032.5663-.454 1.398-1.4595 1.398C6.6593 9.898 6 9 5.963 8.4851m-1.4748.5368c-.2635.5941-.8099.876-1.5443.876s-1.7073-.6248-1.7073-2.204v-.4603c0-1.0416.721-2.131 1.7073-2.131.9864 0 1.6425 1.031 1.5443 2.2492h-2.956"}))),b.createElement("span",{className:"DocSearch-Label"},l))))}function Uv(e){var t=e.hit,n=e.children;return b.createElement("a",{href:t.url},n)}function qv(){return b.createElement("svg",{viewBox:"0 0 38 38",stroke:"currentColor",strokeOpacity:".5"},b.createElement("g",{fill:"none",fillRule:"evenodd"},b.createElement("g",{transform:"translate(1 1)",strokeWidth:"2"},b.createElement("circle",{strokeOpacity:".3",cx:"18",cy:"18",r:"18"}),b.createElement("path",{d:"M36 18c0-9.94-8.06-18-18-18"},b.createElement("animateTransform",{attributeName:"transform",type:"rotate",from:"0 18 18",to:"360 18 18",dur:"1s",repeatCount:"indefinite"})))))}function Vv(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M3.18 6.6a8.23 8.23 0 1112.93 9.94h0a8.23 8.23 0 01-11.63 0"}),b.createElement("path",{d:"M6.44 7.25H2.55V3.36M10.45 6v5.6M10.45 11.6L13 13"})))}function ri(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M10 10l5.09-5.09L10 10l5.09 5.09L10 10zm0 0L4.91 4.91 10 10l-5.09 5.09L10 10z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}function Kv(){return b.createElement("svg",{className:"DocSearch-Hit-Select-Icon",width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M18 3v4c0 2-2 4-4 4H2"}),b.createElement("path",{d:"M8 17l-6-6 6-6"})))}var Wv=function(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M17 6v12c0 .52-.2 1-1 1H4c-.7 0-1-.33-1-1V2c0-.55.42-1 1-1h8l5 5zM14 8h-3.13c-.51 0-.87-.34-.87-.87V4",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))};function Jv(e){switch(e.type){case"lvl1":return b.createElement(Wv,null);case"content":return b.createElement(Yv,null);default:return b.createElement(Qv,null)}}function Qv(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M13 13h4-4V8H7v5h6v4-4H7V8H3h4V3v5h6V3v5h4-4v5zm-6 0v4-4H3h4z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"}))}function Yv(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M17 5H3h14zm0 5H3h14zm0 5H3h14z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))}function za(){return b.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20"},b.createElement("path",{d:"M10 14.2L5 17l1-5.6-4-4 5.5-.7 2.5-5 2.5 5 5.6.8-4 4 .9 5.5z",stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinejoin:"round"}))}function Zv(){return b.createElement("svg",{width:"40",height:"40",viewBox:"0 0 20 20",fill:"none",fillRule:"evenodd",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M19 4.8a16 16 0 00-2-1.2m-3.3-1.2A16 16 0 001.1 4.7M16.7 8a12 12 0 00-2.8-1.4M10 6a12 12 0 00-6.7 2M12.3 14.7a4 4 0 00-4.5 0M14.5 11.4A8 8 0 0010 10M3 16L18 2M10 18h0"}))}function Gv(){return b.createElement("svg",{width:"40",height:"40",viewBox:"0 0 20 20",fill:"none",fillRule:"evenodd",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"},b.createElement("path",{d:"M15.5 4.8c2 3 1.7 7-1 9.7h0l4.3 4.3-4.3-4.3a7.8 7.8 0 01-9.8 1m-2.2-2.2A7.8 7.8 0 0113.2 2.4M2 18L18 2"}))}function Xv(e){var t=e.translations,n=t===void 0?{}:t,r=n.titleText,o=r===void 0?"Unable to fetch results":r,i=n.helpText,s=i===void 0?"You might want to check your network connection.":i;return b.createElement("div",{className:"DocSearch-ErrorScreen"},b.createElement("div",{className:"DocSearch-Screen-Icon"},b.createElement(Zv,null)),b.createElement("p",{className:"DocSearch-Title"},o),b.createElement("p",{className:"DocSearch-Help"},s))}var eg=["translations"];function tg(e){return function(t){if(Array.isArray(t))return Po(t)}(e)||function(t){if(typeof Symbol!="undefined"&&Symbol.iterator in Object(t))return Array.from(t)}(e)||function(t,n){if(!!t){if(typeof t=="string")return Po(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor&&(r=t.constructor.name),r==="Map"||r==="Set")return Array.from(t);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return Po(t,n)}}(e)||function(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Po(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function ng(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function rg(e){var t=e.translations,n=t===void 0?{}:t,r=ng(e,eg),o=n.noResultsText,i=o===void 0?"No results for":o,s=n.suggestedQueryText,a=s===void 0?"Try searching for":s,l=n.openIssueText,c=l===void 0?"Believe this query should return results?":l,u=n.openIssueLinkText,d=u===void 0?"Let us know":u,f=r.state.context.searchSuggestions;return b.createElement("div",{className:"DocSearch-NoResults"},b.createElement("div",{className:"DocSearch-Screen-Icon"},b.createElement(Gv,null)),b.createElement("p",{className:"DocSearch-Title"},i,' "',b.createElement("strong",null,r.state.query),'"'),f&&f.length>0&&b.createElement("div",{className:"DocSearch-NoResults-Prefill-List"},b.createElement("p",{className:"DocSearch-Help"},a,":"),b.createElement("ul",null,f.slice(0,3).reduce(function(h,m){return[].concat(tg(h),[b.createElement("li",{key:m},b.createElement("button",{className:"DocSearch-Prefill",key:m,type:"button",onClick:function(){r.setQuery(m.toLowerCase()+" "),r.refresh(),r.inputRef.current.focus()}},m))])},[]))),b.createElement("p",{className:"DocSearch-Help"},"".concat(c," "),b.createElement("a",{href:"https://github.com/algolia/docsearch-configs/issues/new?template=Missing_results.md&title=[".concat(r.indexName,']+Missing+results+for+query+"').concat(r.state.query,'"'),target:"_blank",rel:"noopener noreferrer"},d),"."))}var og=["hit","attribute","tagName"];function Ba(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function $a(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Ba(Object(n),!0).forEach(function(r){ig(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ba(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function ig(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function sg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Ua(e,t){return t.split(".").reduce(function(n,r){return n!=null&&n[r]?n[r]:null},e)}function Yt(e){var t=e.hit,n=e.attribute,r=e.tagName;return ot(r===void 0?"span":r,$a($a({},sg(e,og)),{},{dangerouslySetInnerHTML:{__html:Ua(t,"_snippetResult.".concat(n,".value"))||Ua(t,n)}}))}function qa(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){if(!(typeof Symbol=="undefined"||!(Symbol.iterator in Object(n)))){var o=[],i=!0,s=!1,a=void 0;try{for(var l,c=n[Symbol.iterator]();!(i=(l=c.next()).done)&&(o.push(l.value),!r||o.length!==r);i=!0);}catch(u){s=!0,a=u}finally{try{i||c.return==null||c.return()}finally{if(s)throw a}}return o}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return Va(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return Va(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function Va(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Vr(){return Vr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Vr.apply(this,arguments)}function oi(e){return e.collection&&e.collection.items.length!==0?b.createElement("section",{className:"DocSearch-Hits"},b.createElement("div",{className:"DocSearch-Hit-source"},e.title),b.createElement("ul",e.getListProps(),e.collection.items.map(function(t,n){return b.createElement(ag,Vr({key:[e.title,t.objectID].join(":"),item:t,index:n},e))}))):null}function ag(e){var t=e.item,n=e.index,r=e.renderIcon,o=e.renderAction,i=e.getItemProps,s=e.onItemClick,a=e.collection,l=e.hitComponent,c=qa(b.useState(!1),2),u=c[0],d=c[1],f=qa(b.useState(!1),2),h=f[0],m=f[1],g=b.useRef(null),v=l;return b.createElement("li",Vr({className:["DocSearch-Hit",t.__docsearch_parent&&"DocSearch-Hit--Child",u&&"DocSearch-Hit--deleting",h&&"DocSearch-Hit--favoriting"].filter(Boolean).join(" "),onTransitionEnd:function(){g.current&&g.current()}},i({item:t,source:a.source,onClick:function(){s(t)}})),b.createElement(v,{hit:t},b.createElement("div",{className:"DocSearch-Hit-Container"},r({item:t,index:n}),t.hierarchy[t.type]&&t.type==="lvl1"&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"hierarchy.lvl1"}),t.content&&b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"content"})),t.hierarchy[t.type]&&(t.type==="lvl2"||t.type==="lvl3"||t.type==="lvl4"||t.type==="lvl5"||t.type==="lvl6")&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"hierarchy.".concat(t.type)}),b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"hierarchy.lvl1"})),t.type==="content"&&b.createElement("div",{className:"DocSearch-Hit-content-wrapper"},b.createElement(Yt,{className:"DocSearch-Hit-title",hit:t,attribute:"content"}),b.createElement(Yt,{className:"DocSearch-Hit-path",hit:t,attribute:"hierarchy.lvl1"})),o({item:t,runDeleteTransition:function(_){d(!0),g.current=_},runFavoriteTransition:function(_){m(!0),g.current=_}}))))}function Ka(e,t){return e.reduce(function(n,r){var o=t(r);return n.hasOwnProperty(o)||(n[o]=[]),n[o].length<5&&n[o].push(r),n},{})}function Wa(e){return e}function lg(){}var du=/(<mark>|<\/mark>)/g,cg=RegExp(du.source);function pu(e){var t,n,r,o,i,s=e;if(!s.__docsearch_parent&&!e._highlightResult)return e.hierarchy.lvl0;var a=((s.__docsearch_parent?(t=s.__docsearch_parent)===null||t===void 0||(n=t._highlightResult)===null||n===void 0||(r=n.hierarchy)===null||r===void 0?void 0:r.lvl0:(o=e._highlightResult)===null||o===void 0||(i=o.hierarchy)===null||i===void 0?void 0:i.lvl0)||{}).value;return a&&cg.test(a)?a.replace(du,""):a}function ii(){return ii=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},ii.apply(this,arguments)}function ug(e){return b.createElement("div",{className:"DocSearch-Dropdown-Container"},e.state.collections.map(function(t){if(t.items.length===0)return null;var n=pu(t.items[0]);return b.createElement(oi,ii({},e,{key:t.source.sourceId,title:n,collection:t,renderIcon:function(r){var o,i=r.item,s=r.index;return b.createElement(b.Fragment,null,i.__docsearch_parent&&b.createElement("svg",{className:"DocSearch-Hit-Tree",viewBox:"0 0 24 54"},b.createElement("g",{stroke:"currentColor",fill:"none",fillRule:"evenodd",strokeLinecap:"round",strokeLinejoin:"round"},i.__docsearch_parent!==((o=t.items[s+1])===null||o===void 0?void 0:o.__docsearch_parent)?b.createElement("path",{d:"M8 6v21M20 27H8.3"}):b.createElement("path",{d:"M8 6v42M20 27H8.3"}))),b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(Jv,{type:i.type})))},renderAction:function(){return b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement(Kv,null))}}))}),e.resultsFooterComponent&&b.createElement("section",{className:"DocSearch-HitsFooter"},b.createElement(e.resultsFooterComponent,{state:e.state})))}var fg=["translations"];function Kr(){return Kr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Kr.apply(this,arguments)}function dg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function pg(e){var t=e.translations,n=t===void 0?{}:t,r=dg(e,fg),o=n.recentSearchesTitle,i=o===void 0?"Recent":o,s=n.noRecentSearchesText,a=s===void 0?"No recent searches":s,l=n.saveRecentSearchButtonTitle,c=l===void 0?"Save this search":l,u=n.removeRecentSearchButtonTitle,d=u===void 0?"Remove this search from history":u,f=n.favoriteSearchesTitle,h=f===void 0?"Favorite":f,m=n.removeFavoriteSearchButtonTitle,g=m===void 0?"Remove this search from favorites":m;return r.state.status==="idle"&&r.hasCollections===!1?r.disableUserPersonalization?null:b.createElement("div",{className:"DocSearch-StartScreen"},b.createElement("p",{className:"DocSearch-Help"},a)):r.hasCollections===!1?null:b.createElement("div",{className:"DocSearch-Dropdown-Container"},b.createElement(oi,Kr({},r,{title:i,collection:r.state.collections[0],renderIcon:function(){return b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(Vv,null))},renderAction:function(v){var _=v.item,E=v.runFavoriteTransition,O=v.runDeleteTransition;return b.createElement(b.Fragment,null,b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:c,type:"submit",onClick:function(S){S.preventDefault(),S.stopPropagation(),E(function(){r.favoriteSearches.add(_),r.recentSearches.remove(_),r.refresh()})}},b.createElement(za,null))),b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:d,type:"submit",onClick:function(S){S.preventDefault(),S.stopPropagation(),O(function(){r.recentSearches.remove(_),r.refresh()})}},b.createElement(ri,null))))}})),b.createElement(oi,Kr({},r,{title:h,collection:r.state.collections[1],renderIcon:function(){return b.createElement("div",{className:"DocSearch-Hit-icon"},b.createElement(za,null))},renderAction:function(v){var _=v.item,E=v.runDeleteTransition;return b.createElement("div",{className:"DocSearch-Hit-action"},b.createElement("button",{className:"DocSearch-Hit-action-button",title:g,type:"submit",onClick:function(O){O.preventDefault(),O.stopPropagation(),E(function(){r.favoriteSearches.remove(_),r.refresh()})}},b.createElement(ri,null)))}})))}var mg=["translations"];function Wr(){return Wr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Wr.apply(this,arguments)}function hg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var vg=b.memo(function(e){var t=e.translations,n=t===void 0?{}:t,r=hg(e,mg);if(r.state.status==="error")return b.createElement(Xv,{translations:n==null?void 0:n.errorScreen});var o=r.state.collections.some(function(i){return i.items.length>0});return r.state.query?o===!1?b.createElement(rg,Wr({},r,{translations:n==null?void 0:n.noResultsScreen})):b.createElement(ug,r):b.createElement(pg,Wr({},r,{hasCollections:o,translations:n==null?void 0:n.startScreen}))},function(e,t){return t.state.status==="loading"||t.state.status==="stalled"}),gg=["translations"];function Jr(){return Jr=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},Jr.apply(this,arguments)}function _g(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function yg(e){var t=e.translations,n=t===void 0?{}:t,r=_g(e,gg),o=n.resetButtonTitle,i=o===void 0?"Clear the query":o,s=n.resetButtonAriaLabel,a=s===void 0?"Clear the query":s,l=n.cancelButtonText,c=l===void 0?"Cancel":l,u=n.cancelButtonAriaLabel,d=u===void 0?"Cancel":u,f=r.getFormProps({inputElement:r.inputRef.current}).onReset;return b.useEffect(function(){r.autoFocus&&r.inputRef.current&&r.inputRef.current.focus()},[r.autoFocus,r.inputRef]),b.useEffect(function(){r.isFromSelection&&r.inputRef.current&&r.inputRef.current.select()},[r.isFromSelection,r.inputRef]),b.createElement(b.Fragment,null,b.createElement("form",{className:"DocSearch-Form",onSubmit:function(h){h.preventDefault()},onReset:f},b.createElement("label",Jr({className:"DocSearch-MagnifierLabel"},r.getLabelProps()),b.createElement(cu,null)),b.createElement("div",{className:"DocSearch-LoadingIndicator"},b.createElement(qv,null)),b.createElement("input",Jr({className:"DocSearch-Input",ref:r.inputRef},r.getInputProps({inputElement:r.inputRef.current,autoFocus:r.autoFocus,maxLength:64}))),b.createElement("button",{type:"reset",title:i,className:"DocSearch-Reset","aria-label":a,hidden:!r.state.query},b.createElement(ri,null))),b.createElement("button",{className:"DocSearch-Cancel",type:"reset","aria-label":d,onClick:r.onClose},c))}var bg=["_highlightResult","_snippetResult"];function Eg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function Og(e){return function(){var t="__TEST_KEY__";try{return localStorage.setItem(t,""),localStorage.removeItem(t),!0}catch{return!1}}()===!1?{setItem:function(){},getItem:function(){return[]}}:{setItem:function(t){return window.localStorage.setItem(e,JSON.stringify(t))},getItem:function(){var t=window.localStorage.getItem(e);return t?JSON.parse(t):[]}}}function Ja(e){var t=e.key,n=e.limit,r=n===void 0?5:n,o=Og(t),i=o.getItem().slice(0,r);return{add:function(s){var a=s,l=(a._highlightResult,a._snippetResult,Eg(a,bg)),c=i.findIndex(function(u){return u.objectID===l.objectID});c>-1&&i.splice(c,1),i.unshift(l),i=i.slice(0,r),o.setItem(i)},remove:function(s){i=i.filter(function(a){return a.objectID!==s.objectID}),o.setItem(i)},getAll:function(){return i}}}var wg=["facetName","facetQuery"];function Sg(e){var t,n="algoliasearch-client-js-".concat(e.key),r=function(){return t===void 0&&(t=e.localStorage||window.localStorage),t},o=function(){return JSON.parse(r().getItem(n)||"{}")};return{get:function(i,s){var a=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return Promise.resolve().then(function(){var l=JSON.stringify(i),c=o()[l];return Promise.all([c||s(),c!==void 0])}).then(function(l){var c=Br(l,2),u=c[0],d=c[1];return Promise.all([u,d||a.miss(u)])}).then(function(l){return Br(l,1)[0]})},set:function(i,s){return Promise.resolve().then(function(){var a=o();return a[JSON.stringify(i)]=s,r().setItem(n,JSON.stringify(a)),s})},delete:function(i){return Promise.resolve().then(function(){var s=o();delete s[JSON.stringify(i)],r().setItem(n,JSON.stringify(s))})},clear:function(){return Promise.resolve().then(function(){r().removeItem(n)})}}}function Tn(e){var t=$r(e.caches),n=t.shift();return n===void 0?{get:function(r,o){var i=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return o().then(function(s){return Promise.all([s,i.miss(s)])}).then(function(s){return Br(s,1)[0]})},set:function(r,o){return Promise.resolve(o)},delete:function(r){return Promise.resolve()},clear:function(){return Promise.resolve()}}:{get:function(r,o){var i=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}};return n.get(r,o,i).catch(function(){return Tn({caches:t}).get(r,o,i)})},set:function(r,o){return n.set(r,o).catch(function(){return Tn({caches:t}).set(r,o)})},delete:function(r){return n.delete(r).catch(function(){return Tn({caches:t}).delete(r)})},clear:function(){return n.clear().catch(function(){return Tn({caches:t}).clear()})}}}function Co(){var e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{serializable:!0},t={};return{get:function(n,r){var o=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{miss:function(){return Promise.resolve()}},i=JSON.stringify(n);if(i in t)return Promise.resolve(e.serializable?JSON.parse(t[i]):t[i]);var s=r(),a=o&&o.miss||function(){return Promise.resolve()};return s.then(function(l){return a(l)}).then(function(){return s})},set:function(n,r){return t[JSON.stringify(n)]=e.serializable?JSON.stringify(r):r,Promise.resolve(r)},delete:function(n){return delete t[JSON.stringify(n)],Promise.resolve()},clear:function(){return t={},Promise.resolve()}}}function Pg(e){for(var t=e.length-1;t>0;t--){var n=Math.floor(Math.random()*(t+1)),r=e[t];e[t]=e[n],e[n]=r}return e}function mu(e,t){return t&&Object.keys(t).forEach(function(n){e[n]=t[n](e)}),e}function io(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];var o=0;return e.replace(/%s/g,function(){return encodeURIComponent(n[o++])})}var Cr={WithinQueryParameters:0,WithinHeaders:1};function Qa(e,t){var n=e||{},r=n.data||{};return Object.keys(n).forEach(function(o){["timeout","headers","queryParameters","data","cacheable"].indexOf(o)===-1&&(r[o]=n[o])}),{data:Object.entries(r).length>0?r:void 0,timeout:n.timeout||t,headers:n.headers||{},queryParameters:n.queryParameters||{},cacheable:n.cacheable}}var rn={Read:1,Write:2,Any:3},hu=1,Cg=2,vu=3;function gu(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:hu;return fe(fe({},e),{},{status:t,lastUpdate:Date.now()})}function _u(e){return typeof e=="string"?{protocol:"https",url:e,accept:rn.Any}:{protocol:e.protocol||"https",url:e.url,accept:e.accept||rn.Any}}var Ya="GET",so="POST";function Ag(e,t){return Promise.all(t.map(function(n){return e.get(n,function(){return Promise.resolve(gu(n))})})).then(function(n){var r=n.filter(function(s){return function(a){return a.status===hu||Date.now()-a.lastUpdate>12e4}(s)}),o=n.filter(function(s){return function(a){return a.status===vu&&Date.now()-a.lastUpdate<=12e4}(s)}),i=[].concat($r(r),$r(o));return{getTimeout:function(s,a){return(o.length===0&&s===0?1:o.length+3+s)*a},statelessHosts:i.length>0?i.map(function(s){return _u(s)}):t}})}function Za(e,t,n,r){var o=[],i=function(f,h){if(!(f.method===Ya||f.data===void 0&&h.data===void 0)){var m=Array.isArray(f.data)?f.data:fe(fe({},f.data),h.data);return JSON.stringify(m)}}(n,r),s=function(f,h){var m=fe(fe({},f.headers),h.headers),g={};return Object.keys(m).forEach(function(v){var _=m[v];g[v.toLowerCase()]=_}),g}(e,r),a=n.method,l=n.method!==Ya?{}:fe(fe({},n.data),r.data),c=fe(fe(fe({"x-algolia-agent":e.userAgent.value},e.queryParameters),l),r.queryParameters),u=0,d=function f(h,m){var g=h.pop();if(g===void 0)throw{name:"RetryError",message:"Unreachable hosts - your application id may be incorrect. If the error persists, contact support@algolia.com.",transporterStackTrace:Ga(o)};var v={data:i,headers:s,method:a,url:xg(g,n.path,c),connectTimeout:m(u,e.timeouts.connect),responseTimeout:m(u,r.timeout)},_=function(O){var S={request:v,response:O,host:g,triesLeft:h.length};return o.push(S),S},E={onSucess:function(O){return function(S){try{return JSON.parse(S.content)}catch(I){throw function(L,C){return{name:"DeserializationError",message:L,response:C}}(I.message,S)}}(O)},onRetry:function(O){var S=_(O);return O.isTimedOut&&u++,Promise.all([e.logger.info("Retryable failure",bu(S)),e.hostsCache.set(g,gu(g,O.isTimedOut?vu:Cg))]).then(function(){return f(h,m)})},onFail:function(O){throw _(O),function(S,I){var L=S.content,C=S.status,P=L;try{P=JSON.parse(L).message}catch{}return function(B,z,$){return{name:"ApiError",message:B,status:z,transporterStackTrace:$}}(P,C,I)}(O,Ga(o))}};return e.requester.send(v).then(function(O){return function(S,I){return function(L){var C=L.status;return L.isTimedOut||function(P){var B=P.isTimedOut,z=P.status;return!B&&~~z==0}(L)||~~(C/100)!=2&&~~(C/100)!=4}(S)?I.onRetry(S):~~(S.status/100)==2?I.onSucess(S):I.onFail(S)}(O,E)})};return Ag(e.hostsCache,t).then(function(f){return d($r(f.statelessHosts).reverse(),f.getTimeout)})}function Ig(e){var t={value:"Algolia for JavaScript (".concat(e,")"),add:function(n){var r="; ".concat(n.segment).concat(n.version!==void 0?" (".concat(n.version,")"):"");return t.value.indexOf(r)===-1&&(t.value="".concat(t.value).concat(r)),t}};return t}function xg(e,t,n){var r=yu(n),o="".concat(e.protocol,"://").concat(e.url,"/").concat(t.charAt(0)==="/"?t.substr(1):t);return r.length&&(o+="?".concat(r)),o}function yu(e){return Object.keys(e).map(function(t){return io("%s=%s",t,(n=e[t],Object.prototype.toString.call(n)==="[object Object]"||Object.prototype.toString.call(n)==="[object Array]"?JSON.stringify(e[t]):e[t]));var n}).join("&")}function Ga(e){return e.map(function(t){return bu(t)})}function bu(e){var t=e.request.headers["x-algolia-api-key"]?{"x-algolia-api-key":"*****"}:{};return fe(fe({},e),{},{request:fe(fe({},e.request),{},{headers:fe(fe({},e.request.headers),t)})})}var jg=function(e){var t=e.appId,n=function(i,s,a){var l={"x-algolia-api-key":a,"x-algolia-application-id":s};return{headers:function(){return i===Cr.WithinHeaders?l:{}},queryParameters:function(){return i===Cr.WithinQueryParameters?l:{}}}}(e.authMode!==void 0?e.authMode:Cr.WithinHeaders,t,e.apiKey),r=function(i){var s=i.hostsCache,a=i.logger,l=i.requester,c=i.requestsCache,u=i.responsesCache,d=i.timeouts,f=i.userAgent,h=i.hosts,m=i.queryParameters,g={hostsCache:s,logger:a,requester:l,requestsCache:c,responsesCache:u,timeouts:d,userAgent:f,headers:i.headers,queryParameters:m,hosts:h.map(function(v){return _u(v)}),read:function(v,_){var E=Qa(_,g.timeouts.read),O=function(){return Za(g,g.hosts.filter(function(I){return(I.accept&rn.Read)!=0}),v,E)};if((E.cacheable!==void 0?E.cacheable:v.cacheable)!==!0)return O();var S={request:v,mappedRequestOptions:E,transporter:{queryParameters:g.queryParameters,headers:g.headers}};return g.responsesCache.get(S,function(){return g.requestsCache.get(S,function(){return g.requestsCache.set(S,O()).then(function(I){return Promise.all([g.requestsCache.delete(S),I])},function(I){return Promise.all([g.requestsCache.delete(S),Promise.reject(I)])}).then(function(I){var L=Br(I,2);return L[0],L[1]})})},{miss:function(I){return g.responsesCache.set(S,I)}})},write:function(v,_){return Za(g,g.hosts.filter(function(E){return(E.accept&rn.Write)!=0}),v,Qa(_,g.timeouts.write))}};return g}(fe(fe({hosts:[{url:"".concat(t,"-dsn.algolia.net"),accept:rn.Read},{url:"".concat(t,".algolia.net"),accept:rn.Write}].concat(Pg([{url:"".concat(t,"-1.algolianet.com")},{url:"".concat(t,"-2.algolianet.com")},{url:"".concat(t,"-3.algolianet.com")}]))},e),{},{headers:fe(fe(fe({},n.headers()),{"content-type":"application/x-www-form-urlencoded"}),e.headers),queryParameters:fe(fe({},n.queryParameters()),e.queryParameters)})),o={transporter:r,appId:t,addAlgoliaAgent:function(i,s){r.userAgent.add({segment:i,version:s})},clearCache:function(){return Promise.all([r.requestsCache.clear(),r.responsesCache.clear()]).then(function(){})}};return mu(o,e.methods)},Eu=function(e){return function(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},r={transporter:e.transporter,appId:e.appId,indexName:t};return mu(r,n.methods)}},Xa=function(e){return function(t,n){var r=t.map(function(o){return fe(fe({},o),{},{params:yu(o.params||{})})});return e.transporter.read({method:so,path:"1/indexes/*/queries",data:{requests:r},cacheable:!0},n)}},el=function(e){return function(t,n){return Promise.all(t.map(function(r){var o=r.params,i=o.facetName,s=o.facetQuery,a=Fh(o,wg);return Eu(e)(r.indexName,{methods:{searchForFacetValues:Ou}}).searchForFacetValues(i,s,fe(fe({},n),a))}))}},Tg=function(e){return function(t,n,r){return e.transporter.read({method:so,path:io("1/answers/%s/prediction",e.indexName),data:{query:t,queryLanguages:n},cacheable:!0},r)}},kg=function(e){return function(t,n){return e.transporter.read({method:so,path:io("1/indexes/%s/query",e.indexName),data:{query:t},cacheable:!0},n)}},Ou=function(e){return function(t,n,r){return e.transporter.read({method:so,path:io("1/indexes/%s/facets/%s/query",e.indexName,t),data:{facetQuery:n},cacheable:!0},r)}},Dg=1,Rg=2,Lg=3;function wu(e,t,n){var r,o={appId:e,apiKey:t,timeouts:{connect:1,read:2,write:30},requester:{send:function(i){return new Promise(function(s){var a=new XMLHttpRequest;a.open(i.method,i.url,!0),Object.keys(i.headers).forEach(function(d){return a.setRequestHeader(d,i.headers[d])});var l,c=function(d,f){return setTimeout(function(){a.abort(),s({status:0,content:f,isTimedOut:!0})},1e3*d)},u=c(i.connectTimeout,"Connection timeout");a.onreadystatechange=function(){a.readyState>a.OPENED&&l===void 0&&(clearTimeout(u),l=c(i.responseTimeout,"Socket timeout"))},a.onerror=function(){a.status===0&&(clearTimeout(u),clearTimeout(l),s({content:a.responseText||"Network request failed",status:a.status,isTimedOut:!1}))},a.onload=function(){clearTimeout(u),clearTimeout(l),s({content:a.responseText,status:a.status,isTimedOut:!1})},a.send(i.data)})}},logger:(r=Lg,{debug:function(i,s){return Dg>=r&&console.debug(i,s),Promise.resolve()},info:function(i,s){return Rg>=r&&console.info(i,s),Promise.resolve()},error:function(i,s){return console.error(i,s),Promise.resolve()}}),responsesCache:Co(),requestsCache:Co({serializable:!1}),hostsCache:Tn({caches:[Sg({key:"".concat("4.8.5","-").concat(e)}),Co()]}),userAgent:Ig("4.8.5").add({segment:"Browser",version:"lite"}),authMode:Cr.WithinQueryParameters};return jg(fe(fe(fe({},o),n),{},{methods:{search:Xa,searchForFacetValues:el,multipleQueries:Xa,multipleSearchForFacetValues:el,initIndex:function(i){return function(s){return Eu(i)(s,{methods:{search:kg,searchForFacetValues:Ou,findAnswers:Tg}})}}}}))}wu.version="4.8.5";var Ng=["footer","searchBox"];function $n(){return $n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},$n.apply(this,arguments)}function tl(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable})),n.push.apply(n,r)}return n}function Ao(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?tl(Object(n),!0).forEach(function(r){Mg(e,r,n[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):tl(Object(n)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})}return e}function Mg(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Hg(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){if(!(typeof Symbol=="undefined"||!(Symbol.iterator in Object(n)))){var o=[],i=!0,s=!1,a=void 0;try{for(var l,c=n[Symbol.iterator]();!(i=(l=c.next()).done)&&(o.push(l.value),!r||o.length!==r);i=!0);}catch(u){s=!0,a=u}finally{try{i||c.return==null||c.return()}finally{if(s)throw a}}return o}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return nl(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return nl(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function nl(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Fg(e,t){if(e==null)return{};var n,r,o=function(s,a){if(s==null)return{};var l,c,u={},d=Object.keys(s);for(c=0;c<d.length;c++)l=d[c],a.indexOf(l)>=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function zg(e){var t=e.appId,n=t===void 0?"BH4D9OD16A":t,r=e.apiKey,o=e.indexName,i=e.placeholder,s=i===void 0?"Search docs":i,a=e.searchParameters,l=e.onClose,c=l===void 0?lg:l,u=e.transformItems,d=u===void 0?Wa:u,f=e.hitComponent,h=f===void 0?Uv:f,m=e.resultsFooterComponent,g=m===void 0?function(){return null}:m,v=e.navigator,_=e.initialScrollY,E=_===void 0?0:_,O=e.transformSearchClient,S=O===void 0?Wa:O,I=e.disableUserPersonalization,L=I!==void 0&&I,C=e.initialQuery,P=C===void 0?"":C,B=e.translations,z=B===void 0?{}:B,$=z.footer,A=z.searchBox,F=Fg(z,Ng),Q=Hg(b.useState({query:"",collections:[],completion:null,context:{},isOpen:!1,activeItemId:null,status:"idle"}),2),se=Q[0],W=Q[1],ee=b.useRef(null),te=b.useRef(null),Ee=b.useRef(null),Pe=b.useRef(null),Ae=b.useRef(null),we=b.useRef(10),Te=b.useRef(typeof window!="undefined"?window.getSelection().toString().slice(0,64):"").current,ze=b.useRef(P||Te).current,j=function(p,y,w){return b.useMemo(function(){var x=wu(p,y);return x.addAlgoliaAgent("docsearch","3.0.0-alpha.42"),/docsearch.js \(.*\)/.test(x.transporter.userAgent.value)===!1&&x.addAlgoliaAgent("docsearch-react","3.0.0-alpha.42"),w(x)},[p,y,w])}(n,r,S),U=b.useRef(Ja({key:"__DOCSEARCH_FAVORITE_SEARCHES__".concat(o),limit:10})).current,N=b.useRef(Ja({key:"__DOCSEARCH_RECENT_SEARCHES__".concat(o),limit:U.getAll().length===0?7:4})).current,q=b.useCallback(function(p){if(!L){var y=p.type==="content"?p.__docsearch_parent:p;y&&U.getAll().findIndex(function(w){return w.objectID===y.objectID})===-1&&N.add(y)}},[U,N,L]),le=b.useMemo(function(){return zv({id:"docsearch",defaultActiveItemId:0,placeholder:s,openOnFocus:!0,initialState:{query:ze,context:{searchSuggestions:[]}},navigator:v,onStateChange:function(p){W(p.state)},getSources:function(p){var y=p.query,w=p.state,x=p.setContext,T=p.setStatus;return y?j.search([{query:y,indexName:o,params:Ao({attributesToRetrieve:["hierarchy.lvl0","hierarchy.lvl1","hierarchy.lvl2","hierarchy.lvl3","hierarchy.lvl4","hierarchy.lvl5","hierarchy.lvl6","content","type","url"],attributesToSnippet:["hierarchy.lvl1:".concat(we.current),"hierarchy.lvl2:".concat(we.current),"hierarchy.lvl3:".concat(we.current),"hierarchy.lvl4:".concat(we.current),"hierarchy.lvl5:".concat(we.current),"hierarchy.lvl6:".concat(we.current),"content:".concat(we.current)],snippetEllipsisText:"\u2026",highlightPreTag:"<mark>",highlightPostTag:"</mark>",hitsPerPage:20},a)}]).catch(function(k){throw k.name==="RetryError"&&T("error"),k}).then(function(k){var M=k.results[0],D=M.hits,H=M.nbHits,R=Ka(D,function(J){return pu(J)});return w.context.searchSuggestions.length<Object.keys(R).length&&x({searchSuggestions:Object.keys(R)}),x({nbHits:H}),Object.values(R).map(function(J,K){return{sourceId:"hits".concat(K),onSelect:function(V){var Z=V.item,ie=V.event;q(Z),ie.shiftKey||ie.ctrlKey||ie.metaKey||c()},getItemUrl:function(V){return V.item.url},getItems:function(){return Object.values(Ka(J,function(V){return V.hierarchy.lvl1})).map(d).map(function(V){return V.map(function(Z){return Ao(Ao({},Z),{},{__docsearch_parent:Z.type!=="lvl1"&&V.find(function(ie){return ie.type==="lvl1"&&ie.hierarchy.lvl1===Z.hierarchy.lvl1})})})}).flat()}}})}):L?[]:[{sourceId:"recentSearches",onSelect:function(k){var M=k.item,D=k.event;q(M),D.shiftKey||D.ctrlKey||D.metaKey||c()},getItemUrl:function(k){return k.item.url},getItems:function(){return N.getAll()}},{sourceId:"favoriteSearches",onSelect:function(k){var M=k.item,D=k.event;q(M),D.shiftKey||D.ctrlKey||D.metaKey||c()},getItemUrl:function(k){return k.item.url},getItems:function(){return U.getAll()}}]}})},[o,a,j,c,N,U,q,ze,s,v,d,L]),pe=le.getEnvironmentProps,re=le.getRootProps,X=le.refresh;return function(p){var y=p.getEnvironmentProps,w=p.panelElement,x=p.formElement,T=p.inputElement;b.useEffect(function(){if(w&&x&&T){var k=y({panelElement:w,formElement:x,inputElement:T}),M=k.onTouchStart,D=k.onTouchMove;return window.addEventListener("touchstart",M),window.addEventListener("touchmove",D),function(){window.removeEventListener("touchstart",M),window.removeEventListener("touchmove",D)}}},[y,w,x,T])}({getEnvironmentProps:pe,panelElement:Pe.current,formElement:Ee.current,inputElement:Ae.current}),function(p){var y=p.container;b.useEffect(function(){if(y){var w=y.querySelectorAll("a[href]:not([disabled]), button:not([disabled]), input:not([disabled])"),x=w[0],T=w[w.length-1];return y.addEventListener("keydown",k),function(){y.removeEventListener("keydown",k)}}function k(M){M.key==="Tab"&&(M.shiftKey?document.activeElement===x&&(M.preventDefault(),T.focus()):document.activeElement===T&&(M.preventDefault(),x.focus()))}},[y])}({container:ee.current}),b.useEffect(function(){return document.body.classList.add("DocSearch--active"),function(){var p,y;document.body.classList.remove("DocSearch--active"),(p=(y=window).scrollTo)===null||p===void 0||p.call(y,0,E)}},[]),b.useEffect(function(){window.matchMedia("(max-width: 750px)").matches&&(we.current=5)},[]),b.useEffect(function(){Pe.current&&(Pe.current.scrollTop=0)},[se.query]),b.useEffect(function(){ze.length>0&&(X(),Ae.current&&Ae.current.focus())},[ze,X]),b.useEffect(function(){function p(){if(te.current){var y=.01*window.innerHeight;te.current.style.setProperty("--docsearch-vh","".concat(y,"px"))}}return p(),window.addEventListener("resize",p),function(){window.removeEventListener("resize",p)}},[]),b.createElement("div",$n({ref:ee},re({"aria-expanded":!0}),{className:["DocSearch","DocSearch-Container",se.status==="stalled"&&"DocSearch-Container--Stalled",se.status==="error"&&"DocSearch-Container--Errored"].filter(Boolean).join(" "),role:"button",tabIndex:0,onMouseDown:function(p){p.target===p.currentTarget&&c()}}),b.createElement("div",{className:"DocSearch-Modal",ref:te},b.createElement("header",{className:"DocSearch-SearchBar",ref:Ee},b.createElement(yg,$n({},le,{state:se,autoFocus:ze.length===0,inputRef:Ae,isFromSelection:Boolean(ze)&&ze===Te,translations:A,onClose:c}))),b.createElement("div",{className:"DocSearch-Dropdown",ref:Pe},b.createElement(vg,$n({},le,{indexName:o,state:se,hitComponent:h,resultsFooterComponent:g,disableUserPersonalization:L,recentSearches:N,favoriteSearches:U,inputRef:Ae,translations:F,onItemClick:function(p){q(p),c()}}))),b.createElement("footer",{className:"DocSearch-Footer"},b.createElement($v,{translations:$}))))}function si(){return si=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},si.apply(this,arguments)}function rl(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,r){if(!(typeof Symbol=="undefined"||!(Symbol.iterator in Object(n)))){var o=[],i=!0,s=!1,a=void 0;try{for(var l,c=n[Symbol.iterator]();!(i=(l=c.next()).done)&&(o.push(l.value),!r||o.length!==r);i=!0);}catch(u){s=!0,a=u}finally{try{i||c.return==null||c.return()}finally{if(s)throw a}}return o}}(e,t)||function(n,r){if(!!n){if(typeof n=="string")return ol(n,r);var o=Object.prototype.toString.call(n).slice(8,-1);if(o==="Object"&&n.constructor&&(o=n.constructor.name),o==="Map"||o==="Set")return Array.from(n);if(o==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return ol(n,r)}}(e,t)||function(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}()}function ol(e,t){(t==null||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function Bg(e){var t,n,r=b.useRef(null),o=rl(b.useState(!1),2),i=o[0],s=o[1],a=rl(b.useState((e==null?void 0:e.initialQuery)||void 0),2),l=a[0],c=a[1],u=b.useCallback(function(){s(!0)},[s]),d=b.useCallback(function(){s(!1)},[s]);return function(f){var h=f.isOpen,m=f.onOpen,g=f.onClose,v=f.onInput,_=f.searchButtonRef;b.useEffect(function(){function E(O){(O.keyCode===27&&h||O.key==="k"&&(O.metaKey||O.ctrlKey)||!function(S){var I=S.target,L=I.tagName;return I.isContentEditable||L==="INPUT"||L==="SELECT"||L==="TEXTAREA"}(O)&&O.key==="/"&&!h)&&(O.preventDefault(),h?g():document.body.classList.contains("DocSearch--active")||document.body.classList.contains("DocSearch--active")||m()),_&&_.current===document.activeElement&&v&&/[a-zA-Z0-9]/.test(String.fromCharCode(O.keyCode))&&v(O)}return window.addEventListener("keydown",E),function(){window.removeEventListener("keydown",E)}},[h,m,g,v,_])}({isOpen:i,onOpen:u,onClose:d,onInput:b.useCallback(function(f){s(!0),c(f.key)},[s,c]),searchButtonRef:r}),b.createElement(b.Fragment,null,b.createElement(iv,{ref:r,translations:e==null||(t=e.translations)===null||t===void 0?void 0:t.button,onClick:u}),i&&iu(b.createElement(zg,si({},e,{initialScrollY:window.scrollY,initialQuery:l,translations:e==null||(n=e.translations)===null||n===void 0?void 0:n.modal,onClose:d})),document.body))}function $g(e){au(b.createElement(Bg,Jo({},e,{transformSearchClient:function(t){return t.addAlgoliaAgent("docsearch.js","3.0.0-alpha.42"),e.transformSearchClient?e.transformSearchClient(t):t}})),function(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:window;return typeof t=="string"?n.document.querySelector(t):t}(e.container,e.environment))}var Su,ai,Pu,Ug=[];function qg(e,t,n){var r,o,i,s={};for(i in t)i=="key"?r=t[i]:i=="ref"?o=t[i]:s[i]=t[i];if(arguments.length>2&&(s.children=arguments.length>3?Su.call(arguments,2):n),typeof e=="function"&&e.defaultProps!=null)for(i in e.defaultProps)s[i]===void 0&&(s[i]=e.defaultProps[i]);return Vg(e,s,r,o,null)}function Vg(e,t,n,r,o){var i={type:e,props:t,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:o==null?++Pu:o};return o==null&&ai.vnode!=null&&ai.vnode(i),i}Su=Ug.slice,ai={__e:function(e,t){for(var n,r,o;t=t.__;)if((n=t.__c)&&!n.__)try{if((r=n.constructor)&&r.getDerivedStateFromError!=null&&(n.setState(r.getDerivedStateFromError(e)),o=n.__d),n.componentDidCatch!=null&&(n.componentDidCatch(e),o=n.__d),o)return n.__E=n}catch(i){e=i}throw e}},Pu=0,typeof Promise=="function"&&Promise.prototype.then.bind(Promise.resolve());const Kg=e=>e.button===1||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey,Wg=()=>{const e=oo(),t=kc();return{transformItems:n=>n.map(r=>It(Re({},r),{url:Im(r.url,t.value.base)})),hitComponent:({hit:n,children:r})=>qg("a",{href:n.url,onClick:o=>{Kg(o)||(o.preventDefault(),e.push(n.url))}},r),navigator:{navigate:({itemUrl:n})=>{e.push(n)}}}};const Jg=Ye({name:"Docsearch",props:{options:{type:Object,required:!0}},setup(e){const t=Tc(),n=jc(),r=Wg(),o=Oe(()=>{var a;return Re(Re({},e.options),(a=e.options.locales)===null||a===void 0?void 0:a[t.value])}),i=[],s=()=>{var a,l;const c=(l=(a=o.value.searchParameters)===null||a===void 0?void 0:a.facetFilters)!==null&&l!==void 0?l:[];i.splice(0,i.length,`lang:${n.value}`,...G(c)?c:[c]),$g(It(Re(Re({},r),o.value),{container:"#docsearch-container",searchParameters:It(Re({},o.value.searchParameters),{facetFilters:i})}))};return at(()=>{s(),et([t,o],([a,l],[c,u])=>{a!==c&&JSON.stringify(l)!==JSON.stringify(u)&&s()}),et(n,(a,l)=>{if(a!==l){const c=i.findIndex(u=>u===`lang:${l}`);c>-1&&i.splice(c,1,`lang:${a}`)}})}),()=>be("div",{id:"docsearch-container"})}}),Qg={apiKey:"43f53c241d1cfae00618363083251da3",indexName:"vue3-date-time-picker",locales:{"/":{placeholder:"Search"}}};var Yg=yn(({app:e})=>{e.component("Docsearch",()=>be(Jg,{options:Qg}))});const Zg=[Dm,Vm,Ym,Dh,Rh,Mh,Yg];function Cu(e,t,n){var r,o,i;t===void 0&&(t=50),n===void 0&&(n={});var s=(r=n.isImmediate)!=null&&r,a=(o=n.callback)!=null&&o,l=n.maxWait,c=Date.now(),u=[];function d(){if(l!==void 0){var h=Date.now()-c;if(h+t>=l)return l-h}return t}var f=function(){var h=[].slice.call(arguments),m=this;return new Promise(function(g,v){var _=s&&i===void 0;if(i!==void 0&&clearTimeout(i),i=setTimeout(function(){if(i=void 0,c=Date.now(),!s){var O=e.apply(m,h);a&&a(O),u.forEach(function(S){return(0,S.resolve)(O)}),u=[]}},d()),_){var E=e.apply(m,h);return a&&a(E),g(E)}u.push({resolve:g,reject:v})})};return f.cancel=function(h){i!==void 0&&clearTimeout(i),u.forEach(function(m){return(0,m.reject)(h)}),u=[]},f}const il=()=>window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,Gg=()=>window.scrollTo({top:0,behavior:"smooth"});const Xg=Ye({name:"BackToTop",setup(){const e=Ne(0),t=Oe(()=>e.value>300),n=Cu(()=>{e.value=il()},100);at(()=>{e.value=il(),window.addEventListener("scroll",()=>n())});const r=be("div",{class:"back-to-top",onClick:Gg});return()=>be(Li,{name:"back-to-top"},()=>t.value?r:null)}}),e0=[Xg],t0=({headerLinkSelector:e,headerAnchorSelector:t,delay:n,offset:r=5})=>{const o=oo(),i=or(),a=Cu(()=>{var l,c,u,d;const f=Array.from(document.querySelectorAll(e)),m=Array.from(document.querySelectorAll(t)).filter(O=>f.some(S=>S.hash===O.hash)),g=Math.max(window.pageYOffset,document.documentElement.scrollTop,document.body.scrollTop),v=window.innerHeight+g,_=Math.max(document.documentElement.scrollHeight,document.body.scrollHeight),E=Math.abs(_-v)<r;for(let O=0;O<m.length;O++){const S=m[O],I=m[O+1],L=O===0&&g===0,C=g>=((c=(l=S.parentElement)===null||l===void 0?void 0:l.offsetTop)!==null&&c!==void 0?c:0)-r,P=!I||g<((d=(u=I.parentElement)===null||u===void 0?void 0:u.offsetTop)!==null&&d!==void 0?d:0)-r;if(!(L||C&&P))continue;const z=decodeURIComponent(o.currentRoute.value.hash),$=decodeURIComponent(S.hash);if(z===$)return;if(E){for(let A=O+1;A<m.length;A++)if(z===decodeURIComponent(m[A].hash))return}n0(o,{hash:$,force:!0});return}},n);at(()=>{a(),window.addEventListener("scroll",a)}),Ci(()=>{window.removeEventListener("scroll",a)}),et(()=>i.value.path,a)},n0=async(e,...t)=>{const{scrollBehavior:n}=e.options;e.options.scrollBehavior=void 0,await e.replace(...t).finally(()=>e.options.scrollBehavior=n)},r0="a.sidebar-item",o0=".header-anchor",i0=300,s0=5;var a0=Bi(()=>{t0({headerLinkSelector:r0,headerAnchorSelector:o0,delay:i0,offset:s0})}),l0=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},Ar={exports:{}};/* NProgress, (c) 2013, 2014 Rico Sta. Cruz - http://ricostacruz.com/nprogress
- * @license MIT */(function(e,t){(function(n,r){e.exports=r()})(l0,function(){var n={};n.version="0.2.0";var r=n.settings={minimum:.08,easing:"ease",positionUsing:"",speed:200,trickle:!0,trickleRate:.02,trickleSpeed:800,showSpinner:!0,barSelector:'[role="bar"]',spinnerSelector:'[role="spinner"]',parent:"body",template:'<div class="bar" role="bar"><div class="peg"></div></div><div class="spinner" role="spinner"><div class="spinner-icon"></div></div>'};n.configure=function(m){var g,v;for(g in m)v=m[g],v!==void 0&&m.hasOwnProperty(g)&&(r[g]=v);return this},n.status=null,n.set=function(m){var g=n.isStarted();m=o(m,r.minimum,1),n.status=m===1?null:m;var v=n.render(!g),_=v.querySelector(r.barSelector),E=r.speed,O=r.easing;return v.offsetWidth,a(function(S){r.positionUsing===""&&(r.positionUsing=n.getPositioningCSS()),l(_,s(m,E,O)),m===1?(l(v,{transition:"none",opacity:1}),v.offsetWidth,setTimeout(function(){l(v,{transition:"all "+E+"ms linear",opacity:0}),setTimeout(function(){n.remove(),S()},E)},E)):setTimeout(S,E)}),this},n.isStarted=function(){return typeof n.status=="number"},n.start=function(){n.status||n.set(0);var m=function(){setTimeout(function(){!n.status||(n.trickle(),m())},r.trickleSpeed)};return r.trickle&&m(),this},n.done=function(m){return!m&&!n.status?this:n.inc(.3+.5*Math.random()).set(1)},n.inc=function(m){var g=n.status;return g?(typeof m!="number"&&(m=(1-g)*o(Math.random()*g,.1,.95)),g=o(g+m,0,.994),n.set(g)):n.start()},n.trickle=function(){return n.inc(Math.random()*r.trickleRate)},function(){var m=0,g=0;n.promise=function(v){return!v||v.state()==="resolved"?this:(g===0&&n.start(),m++,g++,v.always(function(){g--,g===0?(m=0,n.done()):n.set((m-g)/m)}),this)}}(),n.render=function(m){if(n.isRendered())return document.getElementById("nprogress");u(document.documentElement,"nprogress-busy");var g=document.createElement("div");g.id="nprogress",g.innerHTML=r.template;var v=g.querySelector(r.barSelector),_=m?"-100":i(n.status||0),E=document.querySelector(r.parent),O;return l(v,{transition:"all 0 linear",transform:"translate3d("+_+"%,0,0)"}),r.showSpinner||(O=g.querySelector(r.spinnerSelector),O&&h(O)),E!=document.body&&u(E,"nprogress-custom-parent"),E.appendChild(g),g},n.remove=function(){d(document.documentElement,"nprogress-busy"),d(document.querySelector(r.parent),"nprogress-custom-parent");var m=document.getElementById("nprogress");m&&h(m)},n.isRendered=function(){return!!document.getElementById("nprogress")},n.getPositioningCSS=function(){var m=document.body.style,g="WebkitTransform"in m?"Webkit":"MozTransform"in m?"Moz":"msTransform"in m?"ms":"OTransform"in m?"O":"";return g+"Perspective"in m?"translate3d":g+"Transform"in m?"translate":"margin"};function o(m,g,v){return m<g?g:m>v?v:m}function i(m){return(-1+m)*100}function s(m,g,v){var _;return r.positionUsing==="translate3d"?_={transform:"translate3d("+i(m)+"%,0,0)"}:r.positionUsing==="translate"?_={transform:"translate("+i(m)+"%,0)"}:_={"margin-left":i(m)+"%"},_.transition="all "+g+"ms "+v,_}var a=function(){var m=[];function g(){var v=m.shift();v&&v(g)}return function(v){m.push(v),m.length==1&&g()}}(),l=function(){var m=["Webkit","O","Moz","ms"],g={};function v(S){return S.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,function(I,L){return L.toUpperCase()})}function _(S){var I=document.body.style;if(S in I)return S;for(var L=m.length,C=S.charAt(0).toUpperCase()+S.slice(1),P;L--;)if(P=m[L]+C,P in I)return P;return S}function E(S){return S=v(S),g[S]||(g[S]=_(S))}function O(S,I,L){I=E(I),S.style[I]=L}return function(S,I){var L=arguments,C,P;if(L.length==2)for(C in I)P=I[C],P!==void 0&&I.hasOwnProperty(C)&&O(S,C,P);else O(S,L[1],L[2])}}();function c(m,g){var v=typeof m=="string"?m:f(m);return v.indexOf(" "+g+" ")>=0}function u(m,g){var v=f(m),_=v+g;c(v,g)||(m.className=_.substring(1))}function d(m,g){var v=f(m),_;!c(m,g)||(_=v.replace(" "+g+" "," "),m.className=_.substring(1,_.length-1))}function f(m){return(" "+(m.className||"")+" ").replace(/\s+/gi," ")}function h(m){m&&m.parentNode&&m.parentNode.removeChild(m)}return n})})(Ar);const c0=()=>{at(()=>{const e=oo(),t=new Set;t.add(e.currentRoute.value.path),Ar.exports.configure({showSpinner:!1}),e.beforeEach(n=>{t.has(n.path)||Ar.exports.start()}),e.afterEach(n=>{t.add(n.path),Ar.exports.done()})})};var u0=Bi(()=>{c0()}),f0=Bi(()=>{wh(),Ih()});const d0=[a0,u0,f0],p0=[["v-8daa1a0e","/",{title:"Vue 3 Datepicker"},["/index.html","/README.md"]],["v-08a5d2dc","/installation/",{title:"Installation"},["/installation/index.html","/installation/README.md"]],["v-9014096a","/api/components/",{title:"Components"},["/api/components/index.html","/api/components/README.md"]],["v-0dd9e6a8","/api/events/",{title:"Events"},["/api/events/index.html","/api/events/README.md"]],["v-fb37d6ea","/api/methods/",{title:"Methods"},["/api/methods/index.html","/api/methods/README.md"]],["v-55146a0d","/api/props/",{title:"Props"},["/api/props/index.html","/api/props/README.md"]],["v-59de75e8","/api/slots/",{title:"Slots"},["/api/slots/index.html","/api/slots/README.md"]],["v-d446beac","/customization/scss/",{title:"SCSS"},["/customization/scss/index.html","/customization/scss/README.md"]],["v-241ec4c4","/customization/theming/",{title:"Theming"},["/customization/theming/index.html","/customization/theming/README.md"]],["v-3706649a","/404.html",{title:""},["/404"]]],m0=p0.reduce((e,[t,n,r,o])=>(e.push({name:t,path:n,component:Ks,meta:r},...o.map(i=>({path:i,redirect:n}))),e),[{name:"404",path:"/:catchAll(.*)",component:Ks}]),h0=Ip,v0=()=>{const e=fm({history:h0(Cm(wt.value.base)),routes:m0,scrollBehavior:(t,n,r)=>r||(t.hash?{el:t.hash}:{top:0})});return e.beforeResolve(async(t,n)=>{var r;(t.path!==n.path||n===lt)&&([ut.value]=await Promise.all([Rt.resolvePageData(t.name),(r=Sc[t.name])===null||r===void 0?void 0:r.__asyncLoader()]))}),e},g0=e=>{e.component("ClientOnly",pm),e.component("Content",zi)},_0=(e,t)=>{const n=Oe(()=>Rt.resolveRouteLocale(wt.value.locales,t.currentRoute.value.path)),r=Oe(()=>Rt.resolveSiteLocaleData(wt.value,n.value)),o=Oe(()=>Rt.resolvePageFrontmatter(ut.value)),i=Oe(()=>Rt.resolvePageHeadTitle(ut.value,r.value)),s=Oe(()=>Rt.resolvePageHead(i.value,o.value,r.value)),a=Oe(()=>Rt.resolvePageLang(ut.value));return e.provide(Fi,n),e.provide(Dc,r),e.provide(Ac,o),e.provide(ym,i),e.provide(Ic,s),e.provide(xc,a),Object.defineProperties(e.config.globalProperties,{$frontmatter:{get:()=>o.value},$head:{get:()=>s.value},$headTitle:{get:()=>i.value},$lang:{get:()=>a.value},$page:{get:()=>ut.value},$routeLocale:{get:()=>n.value},$site:{get:()=>wt.value},$siteLocale:{get:()=>r.value},$withBase:{get:()=>xm}}),{pageData:ut,pageFrontmatter:o,pageHead:s,pageHeadTitle:i,pageLang:a,routeLocale:n,siteData:wt,siteLocaleData:r}},y0=()=>{const e=Hi(),t=_m(),n=jc(),r=Ne([]),o=()=>{t.value.forEach(s=>{const a=b0(s);a&&r.value.push(a)})},i=()=>{document.documentElement.lang=n.value,r.value.forEach(s=>{s.parentNode===document.head&&document.head.removeChild(s)}),r.value.splice(0,r.value.length),t.value.forEach(s=>{const a=E0(s);a!==null&&(document.head.appendChild(a),r.value.push(a))})};Bt(Em,i),at(()=>{o(),i(),et(()=>e.path,()=>i())})},b0=([e,t,n=""])=>{const r=Object.entries(t).map(([a,l])=>me(l)?`[${a}="${l}"]`:l===!0?`[${a}]`:"").join(""),o=`head > ${e}${r}`;return Array.from(document.querySelectorAll(o)).find(a=>a.innerText===n)||null},E0=([e,t,n])=>{if(!me(e))return null;const r=document.createElement(e);return Rc(t)&&Object.entries(t).forEach(([o,i])=>{me(i)?r.setAttribute(o,i):i===!0&&r.setAttribute(o,"")}),me(n)&&r.appendChild(document.createTextNode(n)),r},O0=lp,w0=async()=>{const e=O0({name:"VuepressApp",setup(){y0();for(const n of d0)n();return()=>[be(wc),...e0.map(n=>be(n))]}}),t=v0();g0(e),_0(e,t);for(const n of Zg)await n({app:e,router:t,siteData:wt});return e.use(t),{app:e,router:t}};w0().then(({app:e,router:t})=>{t.isReady().then(()=>{e.mount("#app")})});export{z0 as $,er as A,Ti as B,Wf as C,D0 as D,Od as E,Fe as F,gn as G,Ai as H,x0 as I,Bt as J,xe as K,I0 as L,P0 as M,Ed as N,Wu as O,Ju as P,j0 as Q,Tc as R,Uc as S,Li as T,gm as U,G as V,Hi as W,C0 as X,Pm as Y,F0 as Z,ne as _,Se as a,kc as a0,H0 as a1,be as a2,xm as a3,pm as a4,A0 as a5,M0 as a6,Am as a7,Cm as a8,oo as a9,me as aa,Ph as ab,or as ac,$0 as ad,Rc as ae,Ah as af,oc as b,tc as c,w0 as createVueApp,ce as d,Ye as e,Ne as f,R0 as g,Oe as h,ic as i,T0 as j,zt as k,nc as l,L0 as m,mn as n,eo as o,je as p,at as q,_d as r,et as s,Pf as t,B0 as u,Oi as v,N0 as w,Mu as x,k0 as y,Rf as z};
diff --git a/docs/assets/index.fb659316.js b/docs/assets/index.e7c299e1.js
similarity index 98%
rename from docs/assets/index.fb659316.js
rename to docs/assets/index.e7c299e1.js
index 56d7d9d31..67ce11db6 100644
--- a/docs/assets/index.fb659316.js
+++ b/docs/assets/index.e7c299e1.js
@@ -1 +1 @@
-import{c as u,d as o,e as d,f as i}from"./vue-datepicker.es.e0a9f9bf.js";var s={lessThanXSeconds:{one:"1\u79D2\u672A\u6E80",other:"{{count}}\u79D2\u672A\u6E80",oneWithSuffix:"\u7D041\u79D2",otherWithSuffix:"\u7D04{{count}}\u79D2"},xSeconds:{one:"1\u79D2",other:"{{count}}\u79D2"},halfAMinute:"30\u79D2",lessThanXMinutes:{one:"1\u5206\u672A\u6E80",other:"{{count}}\u5206\u672A\u6E80",oneWithSuffix:"\u7D041\u5206",otherWithSuffix:"\u7D04{{count}}\u5206"},xMinutes:{one:"1\u5206",other:"{{count}}\u5206"},aboutXHours:{one:"\u7D041\u6642\u9593",other:"\u7D04{{count}}\u6642\u9593"},xHours:{one:"1\u6642\u9593",other:"{{count}}\u6642\u9593"},xDays:{one:"1\u65E5",other:"{{count}}\u65E5"},aboutXWeeks:{one:"\u7D041\u9031\u9593",other:"\u7D04{{count}}\u9031\u9593"},xWeeks:{one:"1\u9031\u9593",other:"{{count}}\u9031\u9593"},aboutXMonths:{one:"\u7D041\u304B\u6708",other:"\u7D04{{count}}\u304B\u6708"},xMonths:{one:"1\u304B\u6708",other:"{{count}}\u304B\u6708"},aboutXYears:{one:"\u7D041\u5E74",other:"\u7D04{{count}}\u5E74"},xYears:{one:"1\u5E74",other:"{{count}}\u5E74"},overXYears:{one:"1\u5E74\u4EE5\u4E0A",other:"{{count}}\u5E74\u4EE5\u4E0A"},almostXYears:{one:"1\u5E74\u8FD1\u304F",other:"{{count}}\u5E74\u8FD1\u304F"}},m=function(e,n,a){a=a||{};var t,r=s[e];return typeof r=="string"?t=r:n===1?a.addSuffix&&r.oneWithSuffix?t=r.oneWithSuffix:t=r.one:a.addSuffix&&r.otherWithSuffix?t=r.otherWithSuffix.replace("{{count}}",String(n)):t=r.other.replace("{{count}}",String(n)),a.addSuffix?a.comparison&&a.comparison>0?t+"\u5F8C":t+"\u524D":t},h=m,c={full:"y\u5E74M\u6708d\u65E5EEEE",long:"y\u5E74M\u6708d\u65E5",medium:"y/MM/dd",short:"y/MM/dd"},l={full:"H\u6642mm\u5206ss\u79D2 zzzz",long:"H:mm:ss z",medium:"H:mm:ss",short:"H:mm"},f={full:"{{date}} {{time}}",long:"{{date}} {{time}}",medium:"{{date}} {{time}}",short:"{{date}} {{time}}"},v={date:u({formats:c,defaultWidth:"full"}),time:u({formats:l,defaultWidth:"full"}),dateTime:u({formats:f,defaultWidth:"full"})},g=v,b={lastWeek:"\u5148\u9031\u306Eeeee\u306Ep",yesterday:"\u6628\u65E5\u306Ep",today:"\u4ECA\u65E5\u306Ep",tomorrow:"\u660E\u65E5\u306Ep",nextWeek:"\u7FCC\u9031\u306Eeeee\u306Ep",other:"P"},P=function(e,n,a,t){return b[e]},w=P,y={narrow:["BC","AC"],abbreviated:["\u7D00\u5143\u524D","\u897F\u66A6"],wide:["\u7D00\u5143\u524D","\u897F\u66A6"]},W={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["\u7B2C1\u56DB\u534A\u671F","\u7B2C2\u56DB\u534A\u671F","\u7B2C3\u56DB\u534A\u671F","\u7B2C4\u56DB\u534A\u671F"]},p={narrow:["1","2","3","4","5","6","7","8","9","10","11","12"],abbreviated:["1\u6708","2\u6708","3\u6708","4\u6708","5\u6708","6\u6708","7\u6708","8\u6708","9\u6708","10\u6708","11\u6708","12\u6708"],wide:["1\u6708","2\u6708","3\u6708","4\u6708","5\u6708","6\u6708","7\u6708","8\u6708","9\u6708","10\u6708","11\u6708","12\u6708"]},M={narrow:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],short:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],abbreviated:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],wide:["\u65E5\u66DC\u65E5","\u6708\u66DC\u65E5","\u706B\u66DC\u65E5","\u6C34\u66DC\u65E5","\u6728\u66DC\u65E5","\u91D1\u66DC\u65E5","\u571F\u66DC\u65E5"]},x={narrow:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},abbreviated:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},wide:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"}},S={narrow:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},abbreviated:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},wide:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"}},D=function(e,n){var a=Number(e),t=n||{},r=String(t.unit);switch(r){case"year":return"".concat(a,"\u5E74");case"quarter":return"\u7B2C".concat(a,"\u56DB\u534A\u671F");case"month":return"".concat(a,"\u6708");case"week":return"\u7B2C".concat(a,"\u9031");case"date":return"".concat(a,"\u65E5");case"hour":return"".concat(a,"\u6642");case"minute":return"".concat(a,"\u5206");case"second":return"".concat(a,"\u79D2");default:return"".concat(a)}},k={ordinalNumber:D,era:o({values:y,defaultWidth:"wide"}),quarter:o({values:W,defaultWidth:"wide",argumentCallback:function(e){return Number(e)-1}}),month:o({values:p,defaultWidth:"wide"}),day:o({values:M,defaultWidth:"wide"}),dayPeriod:o({values:x,defaultWidth:"wide",formattingValues:S,defaultFormattingWidth:"wide"})},F=k,z=/^第?\d+(年|四半期|月|週|日|時|分|秒)?/i,C=/\d+/i,E={narrow:/^(B\.?C\.?|A\.?D\.?)/i,abbreviated:/^(紀元[前後]|西暦)/i,wide:/^(紀元[前後]|西暦)/i},V={narrow:[/^B/i,/^A/i],any:[/^(紀元前)/i,/^(西暦|紀元後)/i]},X={narrow:/^[1234]/i,abbreviated:/^Q[1234]/i,wide:/^第[1234一二三四１２３４]四半期/i},A={any:[/(1|一|１)/i,/(2|二|２)/i,/(3|三|３)/i,/(4|四|４)/i]},L={narrow:/^([123456789]|1[012])/,abbreviated:/^([123456789]|1[012])月/i,wide:/^([123456789]|1[012])月/i},N={any:[/^1\D/,/^2/,/^3/,/^4/,/^5/,/^6/,/^7/,/^8/,/^9/,/^10/,/^11/,/^12/]},Q={narrow:/^[日月火水木金土]/,short:/^[日月火水木金土]/,abbreviated:/^[日月火水木金土]/,wide:/^[日月火水木金土]曜日/},B={any:[/^日/,/^月/,/^火/,/^水/,/^木/,/^金/,/^土/]},H={any:/^(AM|PM|午前|午後|正午|深夜|真夜中|夜|朝)/i},$={any:{am:/^(A|午前)/i,pm:/^(P|午後)/i,midnight:/^深夜|真夜中/i,noon:/^正午/i,morning:/^朝/i,afternoon:/^午後/i,evening:/^夜/i,night:/^深夜/i}},q={ordinalNumber:d({matchPattern:z,parsePattern:C,valueCallback:function(e){return parseInt(e,10)}}),era:i({matchPatterns:E,defaultMatchWidth:"wide",parsePatterns:V,defaultParseWidth:"any"}),quarter:i({matchPatterns:X,defaultMatchWidth:"wide",parsePatterns:A,defaultParseWidth:"any",valueCallback:function(e){return e+1}}),month:i({matchPatterns:L,defaultMatchWidth:"wide",parsePatterns:N,defaultParseWidth:"any"}),day:i({matchPatterns:Q,defaultMatchWidth:"wide",parsePatterns:B,defaultParseWidth:"any"}),dayPeriod:i({matchPatterns:H,defaultMatchWidth:"any",parsePatterns:$,defaultParseWidth:"any"})},R=q,T={code:"ja",formatDistance:h,formatLong:g,formatRelative:w,localize:F,match:R,options:{weekStartsOn:0,firstWeekContainsDate:1}},j=T;export{j};
+import{c as u,d as o,e as d,f as i}from"./vue-datepicker.es.9f3b8378.js";var s={lessThanXSeconds:{one:"1\u79D2\u672A\u6E80",other:"{{count}}\u79D2\u672A\u6E80",oneWithSuffix:"\u7D041\u79D2",otherWithSuffix:"\u7D04{{count}}\u79D2"},xSeconds:{one:"1\u79D2",other:"{{count}}\u79D2"},halfAMinute:"30\u79D2",lessThanXMinutes:{one:"1\u5206\u672A\u6E80",other:"{{count}}\u5206\u672A\u6E80",oneWithSuffix:"\u7D041\u5206",otherWithSuffix:"\u7D04{{count}}\u5206"},xMinutes:{one:"1\u5206",other:"{{count}}\u5206"},aboutXHours:{one:"\u7D041\u6642\u9593",other:"\u7D04{{count}}\u6642\u9593"},xHours:{one:"1\u6642\u9593",other:"{{count}}\u6642\u9593"},xDays:{one:"1\u65E5",other:"{{count}}\u65E5"},aboutXWeeks:{one:"\u7D041\u9031\u9593",other:"\u7D04{{count}}\u9031\u9593"},xWeeks:{one:"1\u9031\u9593",other:"{{count}}\u9031\u9593"},aboutXMonths:{one:"\u7D041\u304B\u6708",other:"\u7D04{{count}}\u304B\u6708"},xMonths:{one:"1\u304B\u6708",other:"{{count}}\u304B\u6708"},aboutXYears:{one:"\u7D041\u5E74",other:"\u7D04{{count}}\u5E74"},xYears:{one:"1\u5E74",other:"{{count}}\u5E74"},overXYears:{one:"1\u5E74\u4EE5\u4E0A",other:"{{count}}\u5E74\u4EE5\u4E0A"},almostXYears:{one:"1\u5E74\u8FD1\u304F",other:"{{count}}\u5E74\u8FD1\u304F"}},m=function(e,n,a){a=a||{};var t,r=s[e];return typeof r=="string"?t=r:n===1?a.addSuffix&&r.oneWithSuffix?t=r.oneWithSuffix:t=r.one:a.addSuffix&&r.otherWithSuffix?t=r.otherWithSuffix.replace("{{count}}",String(n)):t=r.other.replace("{{count}}",String(n)),a.addSuffix?a.comparison&&a.comparison>0?t+"\u5F8C":t+"\u524D":t},h=m,c={full:"y\u5E74M\u6708d\u65E5EEEE",long:"y\u5E74M\u6708d\u65E5",medium:"y/MM/dd",short:"y/MM/dd"},l={full:"H\u6642mm\u5206ss\u79D2 zzzz",long:"H:mm:ss z",medium:"H:mm:ss",short:"H:mm"},f={full:"{{date}} {{time}}",long:"{{date}} {{time}}",medium:"{{date}} {{time}}",short:"{{date}} {{time}}"},v={date:u({formats:c,defaultWidth:"full"}),time:u({formats:l,defaultWidth:"full"}),dateTime:u({formats:f,defaultWidth:"full"})},g=v,b={lastWeek:"\u5148\u9031\u306Eeeee\u306Ep",yesterday:"\u6628\u65E5\u306Ep",today:"\u4ECA\u65E5\u306Ep",tomorrow:"\u660E\u65E5\u306Ep",nextWeek:"\u7FCC\u9031\u306Eeeee\u306Ep",other:"P"},P=function(e,n,a,t){return b[e]},w=P,y={narrow:["BC","AC"],abbreviated:["\u7D00\u5143\u524D","\u897F\u66A6"],wide:["\u7D00\u5143\u524D","\u897F\u66A6"]},W={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["\u7B2C1\u56DB\u534A\u671F","\u7B2C2\u56DB\u534A\u671F","\u7B2C3\u56DB\u534A\u671F","\u7B2C4\u56DB\u534A\u671F"]},p={narrow:["1","2","3","4","5","6","7","8","9","10","11","12"],abbreviated:["1\u6708","2\u6708","3\u6708","4\u6708","5\u6708","6\u6708","7\u6708","8\u6708","9\u6708","10\u6708","11\u6708","12\u6708"],wide:["1\u6708","2\u6708","3\u6708","4\u6708","5\u6708","6\u6708","7\u6708","8\u6708","9\u6708","10\u6708","11\u6708","12\u6708"]},M={narrow:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],short:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],abbreviated:["\u65E5","\u6708","\u706B","\u6C34","\u6728","\u91D1","\u571F"],wide:["\u65E5\u66DC\u65E5","\u6708\u66DC\u65E5","\u706B\u66DC\u65E5","\u6C34\u66DC\u65E5","\u6728\u66DC\u65E5","\u91D1\u66DC\u65E5","\u571F\u66DC\u65E5"]},x={narrow:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},abbreviated:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},wide:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"}},S={narrow:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},abbreviated:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"},wide:{am:"\u5348\u524D",pm:"\u5348\u5F8C",midnight:"\u6DF1\u591C",noon:"\u6B63\u5348",morning:"\u671D",afternoon:"\u5348\u5F8C",evening:"\u591C",night:"\u6DF1\u591C"}},D=function(e,n){var a=Number(e),t=n||{},r=String(t.unit);switch(r){case"year":return"".concat(a,"\u5E74");case"quarter":return"\u7B2C".concat(a,"\u56DB\u534A\u671F");case"month":return"".concat(a,"\u6708");case"week":return"\u7B2C".concat(a,"\u9031");case"date":return"".concat(a,"\u65E5");case"hour":return"".concat(a,"\u6642");case"minute":return"".concat(a,"\u5206");case"second":return"".concat(a,"\u79D2");default:return"".concat(a)}},k={ordinalNumber:D,era:o({values:y,defaultWidth:"wide"}),quarter:o({values:W,defaultWidth:"wide",argumentCallback:function(e){return Number(e)-1}}),month:o({values:p,defaultWidth:"wide"}),day:o({values:M,defaultWidth:"wide"}),dayPeriod:o({values:x,defaultWidth:"wide",formattingValues:S,defaultFormattingWidth:"wide"})},F=k,z=/^第?\d+(年|四半期|月|週|日|時|分|秒)?/i,C=/\d+/i,E={narrow:/^(B\.?C\.?|A\.?D\.?)/i,abbreviated:/^(紀元[前後]|西暦)/i,wide:/^(紀元[前後]|西暦)/i},V={narrow:[/^B/i,/^A/i],any:[/^(紀元前)/i,/^(西暦|紀元後)/i]},X={narrow:/^[1234]/i,abbreviated:/^Q[1234]/i,wide:/^第[1234一二三四１２３４]四半期/i},A={any:[/(1|一|１)/i,/(2|二|２)/i,/(3|三|３)/i,/(4|四|４)/i]},L={narrow:/^([123456789]|1[012])/,abbreviated:/^([123456789]|1[012])月/i,wide:/^([123456789]|1[012])月/i},N={any:[/^1\D/,/^2/,/^3/,/^4/,/^5/,/^6/,/^7/,/^8/,/^9/,/^10/,/^11/,/^12/]},Q={narrow:/^[日月火水木金土]/,short:/^[日月火水木金土]/,abbreviated:/^[日月火水木金土]/,wide:/^[日月火水木金土]曜日/},B={any:[/^日/,/^月/,/^火/,/^水/,/^木/,/^金/,/^土/]},H={any:/^(AM|PM|午前|午後|正午|深夜|真夜中|夜|朝)/i},$={any:{am:/^(A|午前)/i,pm:/^(P|午後)/i,midnight:/^深夜|真夜中/i,noon:/^正午/i,morning:/^朝/i,afternoon:/^午後/i,evening:/^夜/i,night:/^深夜/i}},q={ordinalNumber:d({matchPattern:z,parsePattern:C,valueCallback:function(e){return parseInt(e,10)}}),era:i({matchPatterns:E,defaultMatchWidth:"wide",parsePatterns:V,defaultParseWidth:"any"}),quarter:i({matchPatterns:X,defaultMatchWidth:"wide",parsePatterns:A,defaultParseWidth:"any",valueCallback:function(e){return e+1}}),month:i({matchPatterns:L,defaultMatchWidth:"wide",parsePatterns:N,defaultParseWidth:"any"}),day:i({matchPatterns:Q,defaultMatchWidth:"wide",parsePatterns:B,defaultParseWidth:"any"}),dayPeriod:i({matchPatterns:H,defaultMatchWidth:"any",parsePatterns:$,defaultParseWidth:"any"})},R=q,T={code:"ja",formatDistance:h,formatLong:g,formatRelative:w,localize:F,match:R,options:{weekStartsOn:0,firstWeekContainsDate:1}},j=T;export{j};
diff --git a/docs/assets/index.html.055fb78f.js b/docs/assets/index.html.055fb78f.js
new file mode 100644
index 000000000..bafc4c168
--- /dev/null
+++ b/docs/assets/index.html.055fb78f.js
@@ -0,0 +1,265 @@
+import{_ as c,r as o,o as l,c as u,e as s,b as t,x as p,F as i,R as e,z as n}from"./app.46c9efaa.js";const r={},k=e(`<h1 id="events" tabindex="-1"><a class="header-anchor" href="#events" aria-hidden="true">#</a> Events</h1><p>List of available events that are emitted on some action</p><h2 id="update-modelvalue" tabindex="-1"><a class="header-anchor" href="#update-modelvalue" aria-hidden="true">#</a> @update:modelValue</h2><p>This event is emitted when the value is selected. This is a <code>v-model</code> binding event</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">:value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name"><span class="token namespace">@update:</span>modelValue</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleDate<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token comment">// Make sure to check modelData type here https://vue3datepicker.com/api/props/#modelvalue</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleDate</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">modelData</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">.</span>value <span class="token operator">=</span> modelData<span class="token punctuation">;</span>
+          <span class="token comment">// do something else with the data</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleDate<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h2 id="textsubmit" tabindex="-1"><a class="header-anchor" href="#textsubmit" aria-hidden="true">#</a> @textSubmit</h2>`,6),b=n("When "),m=n("textInput"),d=n(" prop is set to "),g=s("code",null,"true",-1),h=n(" and "),v=s("code",null,"enterSubmit",-1),f=n(" is set to "),w=s("code",null,"true",-1),y=n(" in "),q=n("textInputOptions"),x=n(", when enter button is pressed, this event will be emitted"),_=e(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">textInput</span> <span class="token attr-name">@textSubmit</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertDate<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertDate</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span>date<span class="token punctuation">.</span>value<span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertDate<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="open" tabindex="-1"><a class="header-anchor" href="#open" aria-hidden="true">#</a> @open</h2><p>Emitted when the datepicker menu is opened</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@open</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Menu open&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="closed" tabindex="-1"><a class="header-anchor" href="#closed" aria-hidden="true">#</a> @closed</h2><p>Emitted when the datepicker menu is closed</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@closed</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Menu closed&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="cleared" tabindex="-1"><a class="header-anchor" href="#cleared" aria-hidden="true">#</a> @cleared</h2><p>Emitted when the value is cleared on clear button</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@cleared</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Value cleared&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><code>@focus</code> and <code>@blur</code> events are not native events. Those events are handled internally in the component in order to handle proper focusing</p></div><h2 id="focus" tabindex="-1"><a class="header-anchor" href="#focus" aria-hidden="true">#</a> @focus</h2><p>Emitted when the datepicker menu is open</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@focus</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Input focus&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="blur" tabindex="-1"><a class="header-anchor" href="#blur" aria-hidden="true">#</a> @blur</h2><p>Emitted when the datepicker menu is closed</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@blur</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Input unfocused&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="internalmodelchange" tabindex="-1"><a class="header-anchor" href="#internalmodelchange" aria-hidden="true">#</a> @internalModelChange</h2><p>Emitted when the internal <code>modelValue</code> is changed before selecting this date that will be set to <code>v-model</code></p><p>Will have one param</p><ul><li><code>Date | Date[]</code>: Current state of the internal <code>modelValue</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@internalModelChange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleInternal<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+      <span class="token doc-comment comment">/**
+       * If you don&#39;t use \`autoApply\` prop
+       * with this event you can always get the current selection in the component
+       * 
+       * Note: Value will always be date object 
+       * or array of date objects if you use \`multiDates\` or \`range\`
+       * unlike v-model binding
+       */</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleInternal</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">date</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">\`</span><span class="token string">Current selection - </span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">\${</span>date<span class="token interpolation-punctuation punctuation">}</span></span><span class="token template-punctuation string">\`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleInternal<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h2 id="recalculateposition" tabindex="-1"><a class="header-anchor" href="#recalculateposition" aria-hidden="true">#</a> @recalculatePosition</h2><p>Emitted when the menu position is recalculated</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@recalculatePosition</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>alertFn<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">alertFn</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Position recalculated&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          alertFn<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br></div></div></details><h2 id="flowstep" tabindex="-1"><a class="header-anchor" href="#flowstep" aria-hidden="true">#</a> @flowStep</h2><p>Emitted when the flow step is triggered</p><p>Will have one param</p><ul><li><code>number</code>: Executed flow step</li></ul><div class="custom-container tip"><p class="custom-container-title">Points to keep in mind</p><ul><li>Current logic will not emit an event on the first flow step</li><li>Flow step will keep emitting even tho there are no more steps and just keep incrementing</li></ul><p>Both of these will be handled in one of the upcoming releases</p></div><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:flow</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>flow<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@flowStep</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleFlowStep<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> flow <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">&#39;month&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;year&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;calendar&#39;</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">handleFlowStep</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">step</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>step <span class="token operator">===</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">\`</span><span class="token string">Select year</span><span class="token template-punctuation string">\`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>step <span class="token operator">===</span> <span class="token number">2</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Select date&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          flow<span class="token punctuation">,</span>
+          handleFlowStep<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br></div></div></details><h2 id="updatemonthyear" tabindex="-1"><a class="header-anchor" href="#updatemonthyear" aria-hidden="true">#</a> @updateMonthYear</h2><p>Emitted when the month or year is changed</p><p>Will have one param</p><ul><li><code>{ instance: number, value: number, isMonth: boolean }</code>: The received parameter is an object containing <code>instance</code> (in case of multiple calendars), <code>value</code> is selected value, and <code>isMonth</code> indicating if it is month or year</li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@updateMonthYear</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleMonthYear<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token comment">// For multiCalendars, instance will be the index of the calendar where the value is changed</span>
+        <span class="token keyword">const</span> <span class="token function-variable function">handleMonthYear</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> instance<span class="token punctuation">,</span> value<span class="token punctuation">,</span> isMonth <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token comment">// Do something</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>value <span class="token operator">===</span> <span class="token number">0</span> <span class="token operator">&amp;&amp;</span> isMonth<span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">&#39;Selected January&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          handleMonthYear<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details>`,36);function D(F,E){const a=o("RouterLink");return l(),u(i,null,[k,s("p",null,[b,t(a,{to:"/api/props/#textinput"},{default:p(()=>[m]),_:1}),d,g,h,v,f,w,y,t(a,{to:"/api/props/#textinputoptions"},{default:p(()=>[q]),_:1}),x]),_],64)}var j=c(r,[["render",D],["__file","index.html.vue"]]);export{j as default};
diff --git a/docs/assets/index.html.53c86478.js b/docs/assets/index.html.46debbc6.js
similarity index 86%
rename from docs/assets/index.html.53c86478.js
rename to docs/assets/index.html.46debbc6.js
index 9d70e7702..3aac295dc 100644
--- a/docs/assets/index.html.53c86478.js
+++ b/docs/assets/index.html.46debbc6.js
@@ -1 +1 @@
-const l={key:"v-08a5d2dc",path:"/installation/",title:"Installation",lang:"en-US",frontmatter:{title:"Installation",description:"Install guide for @vuepic/vue-datepicker for global installation, Options and Composition API"},excerpt:"",headers:[{level:3,title:"Global",slug:"global",children:[]},{level:3,title:"Local",slug:"local",children:[]},{level:3,title:"Browser",slug:"browser",children:[]}],git:{updatedTime:1647457665e3},filePathRelative:"installation/README.md"};export{l as data};
+const l={key:"v-08a5d2dc",path:"/installation/",title:"Installation",lang:"en-US",frontmatter:{title:"Installation",description:"Install guide for @vuepic/vue-datepicker for global installation, Options and Composition API"},excerpt:"",headers:[{level:3,title:"Global",slug:"global",children:[]},{level:3,title:"Local",slug:"local",children:[]},{level:3,title:"Browser",slug:"browser",children:[]}],git:{updatedTime:1648485979e3},filePathRelative:"installation/README.md"};export{l as data};
diff --git a/docs/assets/index.html.5ab90608.js b/docs/assets/index.html.5ab90608.js
new file mode 100644
index 000000000..8e1e54f45
--- /dev/null
+++ b/docs/assets/index.html.5ab90608.js
@@ -0,0 +1 @@
+import{_ as s,r as a,o as n,c,e,b as i,x as d,F as h,z as t}from"./app.46c9efaa.js";const l={},p={style:{"text-align":"center"},markdown:"1"},u=t("\u2B50 If you like the component, give it a star on "),_={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},m=t("GitHub"),k=t(" and consider "),f={href:"https://github.com/sponsors/Vuepic",target:"_blank",rel:"noopener noreferrer"},g=t("sponsoring"),b=t(" its development! \u2B50"),v={class:"custom-container tip"},x=e("p",{class:"custom-container-title"},"\u26A0\uFE0F Important \u26A0\uFE0F",-1),w=t("If you come from "),y={href:"https://github.com/Vuepic/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},V=e("code",null,"vue3-date-time-picker",-1),I=t(", the library is moved to the new repository with the new name: "),L={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},C=e("code",null,"@vuepic/vue-datepicker",-1),E=t(". If you haven't updated yet, please switch to the new package."),R=e("h1",{id:"vuepic-vue-datepicker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#vuepic-vue-datepicker","aria-hidden":"true"},"#"),t(" @vuepic/vue-datepicker")],-1),S=e("h3",{id:"the-most-complete-datepicker-solution-for-vue-3",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#the-most-complete-datepicker-solution-for-vue-3","aria-hidden":"true"},"#"),t(" The most complete datepicker solution for Vue 3")],-1),T={href:"https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE",target:"_blank",rel:"noopener noreferrer"},z=e("img",{src:"https://img.shields.io/npm/l/@vuepic/vue-datepicker",alt:"License"},null,-1),F=t(),N={href:"https://www.npmjs.com/package/@vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},B=e("img",{src:"https://img.shields.io/npm/v/@vuepic/vue-datepicker",alt:"npm"},null,-1),G=t(),H=e("img",{src:"https://img.shields.io/npm/dm/@vuepic/vue-datepicker",alt:"Downloads"},null,-1),j=t(),D={href:"https://github.com/Vuepic/vue-datepicker/issues",target:"_blank",rel:"noopener noreferrer"},M=e("img",{src:"https://img.shields.io/github/issues-raw/Vuepic/vue-datepicker",alt:"Open issues"},null,-1),O=t(),P=e("img",{src:"https://img.shields.io/github/workflow/status/Vuepic/vue-datepicker/CI?label=CI",alt:"CI"},null,-1),W=t(),A=e("img",{src:"https://img.shields.io/github/release-date/Vuepic/vue-datepicker",alt:"Release date"},null,-1),q=e("p",null,"Vue 3 date time picker is a lightweight yet powerful and reusable datepicker component. It aims to provide a high level of customization to fit within any project. Offers a great range of features, slots and props, while providing a way to customize for specific needs. Written in typescript to provide a great developer experience.",-1),J=t("Getting started"),K={href:"https://stackblitz.com/edit/vuepic-vue-datepicker?file=src%2Fcomponents%2FPlayground.vue",target:"_blank",rel:"noopener noreferrer"},Q=t("StackBlitz Playground"),U=e("h3",{id:"",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#","aria-hidden":"true"},"#")],-1),X=e("div",{style:{"text-align":"center"},markdown:"1"},[e("h2",{id:"features",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#features","aria-hidden":"true"},"#"),t(" Features")]),e("h4",{id:"single-date-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#single-date-picker","aria-hidden":"true"},"#"),t(" Single date picker")]),e("h4",{id:"range-date-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#range-date-picker","aria-hidden":"true"},"#"),t(" Range date picker")]),e("h4",{id:"time-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#time-picker","aria-hidden":"true"},"#"),t(" Time picker")]),e("h4",{id:"month-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#month-picker","aria-hidden":"true"},"#"),t(" Month picker")]),e("h4",{id:"text-input",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#text-input","aria-hidden":"true"},"#"),t(" Text input")]),e("h4",{id:"locale-support",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#locale-support","aria-hidden":"true"},"#"),t(" Locale support")]),e("h4",{id:"week-numbers",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#week-numbers","aria-hidden":"true"},"#"),t(" Week numbers")]),e("h4",{id:"dark-and-light-theme",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#dark-and-light-theme","aria-hidden":"true"},"#"),t(" Dark and light theme")]),e("h4",{id:"ssr-support",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#ssr-support","aria-hidden":"true"},"#"),t(" SSR support")]),e("h4",{id:"highly-configurable",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#highly-configurable","aria-hidden":"true"},"#"),t(" Highly configurable")]),e("h4",{id:"accessible",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#accessible","aria-hidden":"true"},"#"),t(" Accessible")]),e("h4",{id:"types-included",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#types-included","aria-hidden":"true"},"#"),t(" Types included")])],-1),Y={style:{"text-align":"center"},markdown:"1"},Z=e("h2",{id:"resources",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#resources","aria-hidden":"true"},"#"),t(" Resources")],-1),$={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},ee=t("GitHub"),te={href:"https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE",target:"_blank",rel:"noopener noreferrer"},ie=t("MIT License"),re=e("div",{style:{"text-align":"center"},markdown:"1"}," \xA9 Vuepic 2021-2022 ",-1);function ae(oe,se){const r=a("ExternalLinkIcon"),o=a("RouterLink");return n(),c(h,null,[e("div",p,[e("p",null,[u,e("a",_,[m,i(r)]),k,e("a",f,[g,i(r)]),b]),e("div",v,[x,e("p",null,[e("strong",null,[w,e("a",y,[V,i(r)]),I,e("a",L,[C,i(r)]),E])])]),R,S,e("p",null,[e("a",T,[z,i(r)]),F,e("a",N,[B,i(r)]),G,H,j,e("a",D,[M,i(r)]),O,P,W,A]),q,e("p",null,[i(o,{to:"/installation/"},{default:d(()=>[J]),_:1})]),e("p",null,[e("a",K,[Q,i(r)])])]),U,X,e("div",Y,[Z,e("p",null,[e("a",$,[ee,i(r)])]),e("p",null,[e("a",te,[ie,i(r)])])]),re],64)}var ce=s(l,[["render",ae],["__file","index.html.vue"]]);export{ce as default};
diff --git a/docs/assets/index.html.9ea49862.js b/docs/assets/index.html.5c620bdc.js
similarity index 91%
rename from docs/assets/index.html.9ea49862.js
rename to docs/assets/index.html.5c620bdc.js
index 6c161f5ba..be14a6dcd 100644
--- a/docs/assets/index.html.9ea49862.js
+++ b/docs/assets/index.html.5c620bdc.js
@@ -1 +1 @@
-const e={key:"v-8daa1a0e",path:"/",title:"Vue 3 Datepicker",lang:"en-US",frontmatter:{title:"Vue 3 Datepicker",description:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available."},excerpt:"",headers:[{level:3,title:"The most complete datepicker solution for Vue 3",slug:"the-most-complete-datepicker-solution-for-vue-3",children:[]},{level:3,title:"",slug:"",children:[]},{level:2,title:"Features",slug:"features",children:[]},{level:2,title:"Resources",slug:"resources",children:[]}],git:{updatedTime:1647714923e3},filePathRelative:"README.md"};export{e as data};
+const e={key:"v-8daa1a0e",path:"/",title:"Vue 3 Datepicker",lang:"en-US",frontmatter:{title:"Vue 3 Datepicker",description:"Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available."},excerpt:"",headers:[{level:3,title:"The most complete datepicker solution for Vue 3",slug:"the-most-complete-datepicker-solution-for-vue-3",children:[]},{level:3,title:"",slug:"",children:[]},{level:2,title:"Features",slug:"features",children:[]},{level:2,title:"Resources",slug:"resources",children:[]}],git:{updatedTime:1648485979e3},filePathRelative:"README.md"};export{e as data};
diff --git a/docs/assets/index.html.6d23c620.js b/docs/assets/index.html.6d23c620.js
new file mode 100644
index 000000000..c02834576
--- /dev/null
+++ b/docs/assets/index.html.6d23c620.js
@@ -0,0 +1 @@
+const e={key:"v-55146a0d",path:"/api/props/",title:"Props",lang:"en-US",frontmatter:{lang:"en-US",title:"Props",description:"Datepicker props list to customize the component"},excerpt:"",headers:[{level:2,title:"Modes",slug:"modes",children:[{level:3,title:"range",slug:"range",children:[]},{level:3,title:"autoRange",slug:"autorange",children:[]},{level:3,title:"multiCalendars",slug:"multicalendars",children:[]},{level:3,title:"monthPicker",slug:"monthpicker",children:[]},{level:3,title:"timePicker",slug:"timepicker",children:[]},{level:3,title:"textInput",slug:"textinput",children:[]},{level:3,title:"inline",slug:"inline",children:[]},{level:3,title:"multiDates",slug:"multidates",children:[]},{level:3,title:"flow",slug:"flow",children:[]},{level:3,title:"utc",slug:"utc",children:[]},{level:3,title:"weekPicker",slug:"weekpicker",children:[]},{level:3,title:"vertical",slug:"vertical",children:[]}]},{level:2,title:"Modes configuration",slug:"modes-configuration",children:[{level:3,title:"partialRange",slug:"partialrange",children:[]},{level:3,title:"presetRanges",slug:"presetranges",children:[]},{level:3,title:"minRange",slug:"minrange",children:[]},{level:3,title:"maxRange",slug:"maxrange",children:[]},{level:3,title:"fixedStart",slug:"fixedstart",children:[]},{level:3,title:"fixedEnd",slug:"fixedend",children:[]},{level:3,title:"multiCalendarsSolo",slug:"multicalendarssolo",children:[]},{level:3,title:"textInputOptions",slug:"textinputoptions",children:[]},{level:3,title:"modeHeight",slug:"modeheight",children:[]},{level:3,title:"inlineWithInput",slug:"inlinewithinput",children:[]},{level:3,title:"multiDatesLimit",slug:"multidateslimit",children:[]}]},{level:2,title:"Formatting",slug:"formatting",children:[{level:3,title:"format",slug:"format",children:[]},{level:3,title:"previewFormat",slug:"previewformat",children:[]},{level:3,title:"monthNameFormat",slug:"monthnameformat",children:[]}]},{level:2,title:"Localization",slug:"localization",children:[{level:3,title:"locale",slug:"locale",children:[]},{level:3,title:"formatLocale",slug:"formatlocale",children:[]},{level:3,title:"selectText",slug:"selecttext",children:[]},{level:3,title:"cancelText",slug:"canceltext",children:[]},{level:3,title:"nowButtonLabel",slug:"nowbuttonlabel",children:[]},{level:3,title:"weekNumName",slug:"weeknumname",children:[]},{level:3,title:"ariaLabels",slug:"arialabels",children:[]}]},{level:2,title:"General configuration",slug:"general-configuration",children:[{level:3,title:"uid",slug:"uid",children:[]},{level:3,title:"monthChangeOnScroll",slug:"monthchangeonscroll",children:[]},{level:3,title:"modelValue",slug:"modelvalue",children:[]},{level:3,title:"clearable",slug:"clearable",children:[]},{level:3,title:"closeOnScroll",slug:"closeonscroll",children:[]},{level:3,title:"autoApply",slug:"autoapply",children:[]},{level:3,title:"placeholder",slug:"placeholder",children:[]},{level:3,title:"noToday",slug:"notoday",children:[]},{level:3,title:"closeOnAutoApply",slug:"closeonautoapply",children:[]},{level:3,title:"markers",slug:"markers",children:[]},{level:3,title:"showNowButton",slug:"shownowbutton",children:[]},{level:3,title:"disabled",slug:"disabled",children:[]},{level:3,title:"readonly",slug:"readonly",children:[]},{level:3,title:"required",slug:"required",children:[]},{level:3,title:"name",slug:"name",children:[]},{level:3,title:"autocomplete",slug:"autocomplete",children:[]},{level:3,title:"keepActionRow",slug:"keepactionrow",children:[]},{level:3,title:"noSwipe",slug:"noswipe",children:[]}]},{level:2,title:"Calendar configuration",slug:"calendar-configuration",children:[{level:3,title:"weekNumbers",slug:"weeknumbers",children:[]},{level:3,title:"hideOffsetDates",slug:"hideoffsetdates",children:[]},{level:3,title:"minDate",slug:"mindate",children:[]},{level:3,title:"maxDate",slug:"maxdate",children:[]},{level:3,title:"preventMinMaxNavigation",slug:"preventminmaxnavigation",children:[]},{level:3,title:"startDate",slug:"startdate",children:[]},{level:3,title:"weekStart",slug:"weekstart",children:[]},{level:3,title:"filters",slug:"filters",children:[]},{level:3,title:"disableMonthYearSelect",slug:"disablemonthyearselect",children:[]},{level:3,title:"yearRange",slug:"yearrange",children:[]},{level:3,title:"reverseYears",slug:"reverseyears",children:[]},{level:3,title:"allowedDates",slug:"alloweddates",children:[]},{level:3,title:"disabledDates",slug:"disableddates",children:[]},{level:3,title:"disabledWeekDays",slug:"disabledweekdays",children:[]}]},{level:2,title:"Time picker configuration",slug:"time-picker-configuration",children:[{level:3,title:"enableTimePicker",slug:"enabletimepicker",children:[]},{level:3,title:"is24",slug:"is24",children:[]},{level:3,title:"enableSeconds",slug:"enableseconds",children:[]},{level:3,title:"hoursIncrement",slug:"hoursincrement",children:[]},{level:3,title:"minutesIncrement",slug:"minutesincrement",children:[]},{level:3,title:"secondsIncrement",slug:"secondsincrement",children:[]},{level:3,title:"hoursGridIncrement",slug:"hoursgridincrement",children:[]},{level:3,title:"minutesGridIncrement",slug:"minutesgridincrement",children:[]},{level:3,title:"secondsGridIncrement",slug:"secondsgridincrement",children:[]},{level:3,title:"noHoursOverlay",slug:"nohoursoverlay",children:[]},{level:3,title:"noMinutesOverlay",slug:"nominutesoverlay",children:[]},{level:3,title:"noSecondsOverlay",slug:"nosecondsoverlay",children:[]},{level:3,title:"minTime",slug:"mintime",children:[]},{level:3,title:"maxTime",slug:"maxtime",children:[]},{level:3,title:"startTime",slug:"starttime",children:[]}]},{level:2,title:"Positioning",slug:"positioning",children:[{level:3,title:"position",slug:"position",children:[]},{level:3,title:"autoPosition",slug:"autoposition",children:[]},{level:3,title:"altPosition",slug:"altposition",children:[]},{level:3,title:"teleport",slug:"teleport",children:[]}]},{level:2,title:"Keyboard",slug:"keyboard",children:[{level:3,title:"openMenuOnFocus",slug:"openmenuonfocus",children:[]},{level:3,title:"escClose",slug:"escclose",children:[]},{level:3,title:"spaceConfirm",slug:"spaceconfirm",children:[]},{level:3,title:"monthChangeOnArrows",slug:"monthchangeonarrows",children:[]}]},{level:2,title:"Look and feel",slug:"look-and-feel",children:[{level:3,title:"transitions",slug:"transitions",children:[]},{level:3,title:"dark",slug:"dark",children:[]},{level:3,title:"hideInputIcon",slug:"hideinputicon",children:[]},{level:3,title:"state",slug:"state",children:[]},{level:3,title:"inputClassName",slug:"inputclassname",children:[]},{level:3,title:"menuClassName",slug:"menuclassname",children:[]},{level:3,title:"calendarClassName",slug:"calendarclassname",children:[]},{level:3,title:"calendarCellClassName",slug:"calendarcellclassname",children:[]}]}],git:{updatedTime:1649103386e3},filePathRelative:"api/props/README.md"};export{e as data};
diff --git a/docs/assets/index.html.1b6f9115.js b/docs/assets/index.html.77270580.js
similarity index 86%
rename from docs/assets/index.html.1b6f9115.js
rename to docs/assets/index.html.77270580.js
index cf70dfc65..743804b74 100644
--- a/docs/assets/index.html.1b6f9115.js
+++ b/docs/assets/index.html.77270580.js
@@ -1 +1 @@
-const e={key:"v-fb37d6ea",path:"/api/methods/",title:"Methods",lang:"en-US",frontmatter:{title:"Methods",description:"Datepicker component methods"},excerpt:"",headers:[{level:2,title:"selectDate",slug:"selectdate",children:[]},{level:2,title:"closeMenu",slug:"closemenu",children:[]},{level:2,title:"openMenu",slug:"openmenu",children:[]},{level:2,title:"clearValue",slug:"clearvalue",children:[]}],git:{updatedTime:1632574454e3},filePathRelative:"api/methods/README.md"};export{e as data};
+const e={key:"v-fb37d6ea",path:"/api/methods/",title:"Methods",lang:"en-US",frontmatter:{title:"Methods",description:"Datepicker component methods"},excerpt:"",headers:[{level:2,title:"selectDate",slug:"selectdate",children:[]},{level:2,title:"closeMenu",slug:"closemenu",children:[]},{level:2,title:"openMenu",slug:"openmenu",children:[]},{level:2,title:"clearValue",slug:"clearvalue",children:[]}],git:{updatedTime:1649500174e3},filePathRelative:"api/methods/README.md"};export{e as data};
diff --git a/docs/assets/index.html.7d9f5387.js b/docs/assets/index.html.7d9f5387.js
deleted file mode 100644
index dd7d3e790..000000000
--- a/docs/assets/index.html.7d9f5387.js
+++ /dev/null
@@ -1 +0,0 @@
-import{Q as e}from"./app.519dac2e.js";import{_ as a}from"./plugin-vue_export-helper.21dcd24c.js";const t={},d=e('<h1 id="methods" tabindex="-1"><a class="header-anchor" href="#methods" aria-hidden="true">#</a> Methods</h1><p>List of available methods that you can call on the datepicker from the external code</p><p>Add a <code>ref</code> to the component, and call the method on that ref</p><h2 id="selectdate" tabindex="-1"><a class="header-anchor" href="#selectdate" aria-hidden="true">#</a> selectDate</h2><p>When called and there is an active selection, it will select that date.</p><h2 id="closemenu" tabindex="-1"><a class="header-anchor" href="#closemenu" aria-hidden="true">#</a> closeMenu</h2><p>Closes the datepicker menu</p><h2 id="openmenu" tabindex="-1"><a class="header-anchor" href="#openmenu" aria-hidden="true">#</a> openMenu</h2><p>Opens the datepicker menu</p><h2 id="clearvalue" tabindex="-1"><a class="header-anchor" href="#clearvalue" aria-hidden="true">#</a> clearValue</h2><p>Clears the selected value</p>',11);function r(h,n){return d}var s=a(t,[["render",r]]);export{s as default};
diff --git a/docs/assets/index.html.a6269bf4.js b/docs/assets/index.html.a6269bf4.js
new file mode 100644
index 000000000..e9f5cb9ad
--- /dev/null
+++ b/docs/assets/index.html.a6269bf4.js
@@ -0,0 +1,26 @@
+import{_ as n,R as a}from"./app.46c9efaa.js";const s={},e=a(`<h1 id="methods" tabindex="-1"><a class="header-anchor" href="#methods" aria-hidden="true">#</a> Methods</h1><p>List of available methods that you can call on the datepicker from the external code</p><p>Add a <code>ref</code> to the component, and call the method on that ref</p><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>datepicker<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> datepicker <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+        <span class="token keyword">const</span> <span class="token function-variable function">yourCustomMethod</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+          <span class="token keyword">if</span> <span class="token punctuation">(</span>datepicker<span class="token punctuation">)</span> <span class="token punctuation">{</span>
+            <span class="token comment">// Close the menu programmatically</span>
+            datepicker<span class="token punctuation">.</span>value<span class="token punctuation">.</span><span class="token function">closeMenu</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
+          <span class="token punctuation">}</span>
+        <span class="token punctuation">}</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h2 id="selectdate" tabindex="-1"><a class="header-anchor" href="#selectdate" aria-hidden="true">#</a> selectDate</h2><p>When called and there is an active selection, it will select that date.</p><h2 id="closemenu" tabindex="-1"><a class="header-anchor" href="#closemenu" aria-hidden="true">#</a> closeMenu</h2><p>Closes the datepicker menu</p><h2 id="openmenu" tabindex="-1"><a class="header-anchor" href="#openmenu" aria-hidden="true">#</a> openMenu</h2><p>Opens the datepicker menu</p><h2 id="clearvalue" tabindex="-1"><a class="header-anchor" href="#clearvalue" aria-hidden="true">#</a> clearValue</h2><p>Clears the selected value</p>`,12);function t(p,c){return e}var l=n(s,[["render",t],["__file","index.html.vue"]]);export{l as default};
diff --git a/docs/assets/index.html.256dcdde.js b/docs/assets/index.html.b1d7c8d2.js
similarity index 93%
rename from docs/assets/index.html.256dcdde.js
rename to docs/assets/index.html.b1d7c8d2.js
index 36a3cd318..a2fe9e12f 100644
--- a/docs/assets/index.html.256dcdde.js
+++ b/docs/assets/index.html.b1d7c8d2.js
@@ -1 +1 @@
-const e={key:"v-0dd9e6a8",path:"/api/events/",title:"Events",lang:"en-US",frontmatter:{title:"Events",description:"Datepicker component emitted events"},excerpt:"",headers:[{level:2,title:"@update:modelValue",slug:"update-modelvalue",children:[]},{level:2,title:"@textSubmit",slug:"textsubmit",children:[]},{level:2,title:"@open",slug:"open",children:[]},{level:2,title:"@closed",slug:"closed",children:[]},{level:2,title:"@cleared",slug:"cleared",children:[]},{level:2,title:"@focus",slug:"focus",children:[]},{level:2,title:"@blur",slug:"blur",children:[]},{level:2,title:"@internalModelChange",slug:"internalmodelchange",children:[]},{level:2,title:"@recalculatePosition",slug:"recalculateposition",children:[]},{level:2,title:"@flowStep",slug:"flowstep",children:[]},{level:2,title:"@updateMonthYear",slug:"updatemonthyear",children:[]}],git:{updatedTime:1646582243e3},filePathRelative:"api/events/README.md"};export{e as data};
+const e={key:"v-0dd9e6a8",path:"/api/events/",title:"Events",lang:"en-US",frontmatter:{title:"Events",description:"Datepicker component emitted events"},excerpt:"",headers:[{level:2,title:"@update:modelValue",slug:"update-modelvalue",children:[]},{level:2,title:"@textSubmit",slug:"textsubmit",children:[]},{level:2,title:"@open",slug:"open",children:[]},{level:2,title:"@closed",slug:"closed",children:[]},{level:2,title:"@cleared",slug:"cleared",children:[]},{level:2,title:"@focus",slug:"focus",children:[]},{level:2,title:"@blur",slug:"blur",children:[]},{level:2,title:"@internalModelChange",slug:"internalmodelchange",children:[]},{level:2,title:"@recalculatePosition",slug:"recalculateposition",children:[]},{level:2,title:"@flowStep",slug:"flowstep",children:[]},{level:2,title:"@updateMonthYear",slug:"updatemonthyear",children:[]}],git:{updatedTime:1649500174e3},filePathRelative:"api/events/README.md"};export{e as data};
diff --git a/docs/assets/index.html.b3eef111.js b/docs/assets/index.html.b3eef111.js
deleted file mode 100644
index a22481385..000000000
--- a/docs/assets/index.html.b3eef111.js
+++ /dev/null
@@ -1 +0,0 @@
-import{r as o,o as s,c as h,b as t,a as n,z as i,F as r,Q as d,B as e}from"./app.519dac2e.js";import{_ as c}from"./plugin-vue_export-helper.21dcd24c.js";const l={},p=d('<h1 id="events" tabindex="-1"><a class="header-anchor" href="#events" aria-hidden="true">#</a> Events</h1><p>List of available events that are emitted on some action</p><h2 id="update-modelvalue" tabindex="-1"><a class="header-anchor" href="#update-modelvalue" aria-hidden="true">#</a> @update:modelValue</h2><p>This event is emitted when the value is selected. This is a <code>v-model</code> binding event</p><h2 id="textsubmit" tabindex="-1"><a class="header-anchor" href="#textsubmit" aria-hidden="true">#</a> @textSubmit</h2>',5),u=e("When "),m=e("textInput"),_=e(" prop is set to "),f=t("code",null,"true",-1),b=e(" and "),x=t("code",null,"enterSubmit",-1),v=e(" is set to "),w=t("code",null,"true",-1),g=e(" in "),E=e("textInputOptions"),k=e(", when enter button is pressed, this event will be emitted"),V=d('<h2 id="open" tabindex="-1"><a class="header-anchor" href="#open" aria-hidden="true">#</a> @open</h2><p>Emitted when the datepicker menu is opened</p><h2 id="closed" tabindex="-1"><a class="header-anchor" href="#closed" aria-hidden="true">#</a> @closed</h2><p>Emitted when the datepicker menu is closed</p><h2 id="cleared" tabindex="-1"><a class="header-anchor" href="#cleared" aria-hidden="true">#</a> @cleared</h2><p>Emitted when the value is cleared on clear button</p><h2 id="focus" tabindex="-1"><a class="header-anchor" href="#focus" aria-hidden="true">#</a> @focus</h2><p>Emitted when the datepicker menu is open</p><h2 id="blur" tabindex="-1"><a class="header-anchor" href="#blur" aria-hidden="true">#</a> @blur</h2><p>Emitted when the datepicker menu is closed</p><h2 id="internalmodelchange" tabindex="-1"><a class="header-anchor" href="#internalmodelchange" aria-hidden="true">#</a> @internalModelChange</h2><p>Emitted when the internal <code>modelValue</code> is changed before selecting this date that will be set to <code>v-model</code></p><h2 id="recalculateposition" tabindex="-1"><a class="header-anchor" href="#recalculateposition" aria-hidden="true">#</a> @recalculatePosition</h2><p>Emitted when the menu position is recalculated</p><h2 id="flowstep" tabindex="-1"><a class="header-anchor" href="#flowstep" aria-hidden="true">#</a> @flowStep</h2><p>Emitted when the flow step is triggered</p><p>Will have one param</p><ul><li><code>step</code>: Executed flow step</li></ul><h2 id="updatemonthyear" tabindex="-1"><a class="header-anchor" href="#updatemonthyear" aria-hidden="true">#</a> @updateMonthYear</h2><p>Emitted when the month or year is changed</p><p>Will have one param</p><ul><li><code>{ instance: number, value: number, isMonth: boolean }</code>: The received parameter is an object containing <code>instance</code> (in case of multiple calendars), <code>value</code> is selected value, and <code>isMonth</code> indicating if it is month or year</li></ul>',22);function y(B,M){const a=o("RouterLink");return s(),h(r,null,[p,t("p",null,[u,n(a,{to:"/api/props/#textinput"},{default:i(()=>[m]),_:1}),_,f,b,x,v,w,g,n(a,{to:"/api/props/#textinputoptions"},{default:i(()=>[E]),_:1}),k]),V],64)}var T=c(l,[["render",y]]);export{T as default};
diff --git a/docs/assets/index.html.6b18d5e2.js b/docs/assets/index.html.b4665819.js
similarity index 96%
rename from docs/assets/index.html.6b18d5e2.js
rename to docs/assets/index.html.b4665819.js
index 7d9377ca7..dfe9ce900 100644
--- a/docs/assets/index.html.6b18d5e2.js
+++ b/docs/assets/index.html.b4665819.js
@@ -1,4 +1,4 @@
-import{r as p,o as l,c as u,a,z as t,F as r,Q as c,b as n,B as s}from"./app.519dac2e.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const k={},d=c(`<h1 id="installation" tabindex="-1"><a class="header-anchor" href="#installation" aria-hidden="true">#</a> Installation</h1><p>Install the component using the preferred package manager</p><div class="language-bash ext-sh line-numbers-mode"><pre class="language-bash"><code><span class="token function">yarn</span> <span class="token function">add</span> @vuepic/vue-datepicker
+import{_ as l,r as p,o as u,c as r,b as a,x as t,F as i,R as c,e as n,z as s}from"./app.46c9efaa.js";const k={},d=c(`<h1 id="installation" tabindex="-1"><a class="header-anchor" href="#installation" aria-hidden="true">#</a> Installation</h1><p>Install the component using the preferred package manager</p><div class="language-bash ext-sh line-numbers-mode"><pre class="language-bash"><code><span class="token function">yarn</span> <span class="token function">add</span> @vuepic/vue-datepicker
 
 <span class="token comment"># or</span>
 
@@ -62,7 +62,7 @@ app<span class="token punctuation">.</span><span class="token function">mount</s
     
     `),n("span",{class:"token keyword"},"const"),s(" date "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(`
 `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("script")]),n("span",{class:"token punctuation"},">")]),s(`
-`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br")])],-1),v=c(`<p>Alternatively, you can import the <code>scss</code> file if you want full control of the component styles</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/Vue3DatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
+`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br")])],-1),v=c(`<p>Alternatively, you can import the <code>scss</code> file if you want full control of the component styles</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br></div></div><h3 id="browser" tabindex="-1"><a class="header-anchor" href="#browser" aria-hidden="true">#</a> <strong>Browser</strong></h3><p>Register and use component in the <code>.html</code> file</p><p>Keep in mind that when you use unpkg to import the component, global component name will be <strong>VueDatePicker</strong></p><p>Add JavaScript files</p><div class="language-html ext-html line-numbers-mode"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>https://unpkg.com/vue@latest<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>https://unpkg.com/@vuepic/vue-datepicker@latest<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>Add CSS file</p><div class="language-html ext-html line-numbers-mode"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>link</span> <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>stylesheet<span class="token punctuation">&quot;</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>https://unpkg.com/@vuepic/vue-datepicker@latest/dist/main.css<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -71,4 +71,4 @@ app<span class="token punctuation">.</span><span class="token function">mount</s
         <span class="token literal-property property">components</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">Datepicker</span><span class="token operator">:</span> VueDatePicker <span class="token punctuation">}</span><span class="token punctuation">,</span>
     <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">mount</span><span class="token punctuation">(</span><span class="token string">&quot;#app&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><p>That&#39;s it, you are ready to go</p>`,12);function h(f,y){const e=p("CodeGroupItem"),o=p("CodeGroup");return l(),u(r,null,[d,a(o,null,{default:t(()=>[a(e,{title:"Options API",active:""},{default:t(()=>[m]),_:1}),a(e,{title:"Composition API"},{default:t(()=>[b]),_:1}),a(e,{title:"<script setup>"},{default:t(()=>[g]),_:1})]),_:1}),v],64)}var x=i(k,[["render",h]]);export{x as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><p>That&#39;s it, you are ready to go</p>`,12);function h(f,y){const e=p("CodeGroupItem"),o=p("CodeGroup");return u(),r(i,null,[d,a(o,null,{default:t(()=>[a(e,{title:"Options API",active:""},{default:t(()=>[m]),_:1}),a(e,{title:"Composition API"},{default:t(()=>[b]),_:1}),a(e,{title:"<script setup>"},{default:t(()=>[g]),_:1})]),_:1}),v],64)}var _=l(k,[["render",h],["__file","index.html.vue"]]);export{_ as default};
diff --git a/docs/assets/index.html.7514c62a.js b/docs/assets/index.html.bead136d.js
similarity index 93%
rename from docs/assets/index.html.7514c62a.js
rename to docs/assets/index.html.bead136d.js
index a39667756..8f1af280d 100644
--- a/docs/assets/index.html.7514c62a.js
+++ b/docs/assets/index.html.bead136d.js
@@ -1,4 +1,4 @@
-import{Q as n}from"./app.519dac2e.js";import{_ as s}from"./plugin-vue_export-helper.21dcd24c.js";const a={},e=n(`<h1 id="scss" tabindex="-1"><a class="header-anchor" href="#scss" aria-hidden="true">#</a> SCSS</h1><p>For easier style configuration you can import the <code>scss</code> file and modify the default properties</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
+import{_ as n,R as s}from"./app.46c9efaa.js";const a={},e=s(`<h1 id="scss" tabindex="-1"><a class="header-anchor" href="#scss" aria-hidden="true">#</a> SCSS</h1><p>For easier style configuration you can import the <code>scss</code> file and modify the default properties</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br></div></div><p>Available properties are:</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token comment">// General</span>
 <span class="token property"><span class="token variable">$dp__font_family</span></span><span class="token punctuation">:</span> -apple-system<span class="token punctuation">,</span> blinkmacsystemfont<span class="token punctuation">,</span> <span class="token string">&quot;Segoe UI&quot;</span><span class="token punctuation">,</span> roboto<span class="token punctuation">,</span> oxygen<span class="token punctuation">,</span> ubuntu<span class="token punctuation">,</span> cantarell<span class="token punctuation">,</span> <span class="token string">&quot;Open Sans&quot;</span><span class="token punctuation">,</span>
   <span class="token string">&quot;Helvetica Neue&quot;</span><span class="token punctuation">,</span> sans-serif <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// Font size for the menu</span>
@@ -31,4 +31,4 @@ import{Q as n}from"./app.519dac2e.js";import{_ as s}from"./plugin-vue_export-hel
 <span class="token property"><span class="token variable">$dp__font_size</span></span><span class="token punctuation">:</span> 1rem <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// overall font-size</span>
 <span class="token property"><span class="token variable">$dp__preview_font_size</span></span><span class="token punctuation">:</span> 0.8rem <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// font size of the date preview in the action row</span>
 <span class="token property"><span class="token variable">$dp__time_font_size</span></span><span class="token punctuation">:</span> 2rem <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// font size in the time picker</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div>`,5);function p(t,o){return e}var r=s(a,[["render",p]]);export{r as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div>`,5);function p(t,o){return e}var l=n(a,[["render",p],["__file","index.html.vue"]]);export{l as default};
diff --git a/docs/assets/index.html.b5876d91.js b/docs/assets/index.html.c2cc26a6.js
similarity index 90%
rename from docs/assets/index.html.b5876d91.js
rename to docs/assets/index.html.c2cc26a6.js
index b1d6bdfc1..5833c5cda 100644
--- a/docs/assets/index.html.b5876d91.js
+++ b/docs/assets/index.html.c2cc26a6.js
@@ -1,4 +1,4 @@
-import{Q as n}from"./app.519dac2e.js";import{_ as s}from"./plugin-vue_export-helper.21dcd24c.js";const a={},p=n(`<h1 id="theming" tabindex="-1"><a class="header-anchor" href="#theming" aria-hidden="true">#</a> Theming</h1><p>Datepicker comes with the theme support with <code>css</code> variables. It provides two classes that are applied based on the chosen dark/light mode</p><p>To change variables, simply override the classes with your custom values.</p><p><strong>Dark mode configuration</strong></p><div class="language-css ext-css line-numbers-mode"><pre class="language-css"><code><span class="token selector">.dp__theme_dark</span> <span class="token punctuation">{</span>
+import{_ as n,R as s}from"./app.46c9efaa.js";const a={},p=s(`<h1 id="theming" tabindex="-1"><a class="header-anchor" href="#theming" aria-hidden="true">#</a> Theming</h1><p>Datepicker comes with the theme support with <code>css</code> variables. It provides two classes that are applied based on the chosen dark/light mode</p><p>To change variables, simply override the classes with your custom values.</p><p><strong>Dark mode configuration</strong></p><div class="language-css ext-css line-numbers-mode"><pre class="language-css"><code><span class="token selector">.dp__theme_dark</span> <span class="token punctuation">{</span>
     <span class="token property">--dp-background-color</span><span class="token punctuation">:</span> #212121<span class="token punctuation">;</span>
     <span class="token property">--dp-text-color</span><span class="token punctuation">:</span> #ffffff<span class="token punctuation">;</span>
     <span class="token property">--dp-hover-color</span><span class="token punctuation">:</span> #484848<span class="token punctuation">;</span>
@@ -38,4 +38,4 @@ import{Q as n}from"./app.519dac2e.js";import{_ as s}from"./plugin-vue_export-hel
   <span class="token property">--dp-icon-color</span><span class="token punctuation">:</span> #959595<span class="token punctuation">;</span>
   <span class="token property">--dp-danger-color</span><span class="token punctuation">:</span> #ff6f60<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div>`,7);function o(t,e){return p}var l=s(a,[["render",o]]);export{l as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div>`,7);function t(o,e){return p}var r=n(a,[["render",t],["__file","index.html.vue"]]);export{r as default};
diff --git a/docs/assets/index.html.3a5189cb.js b/docs/assets/index.html.ceb36e17.js
similarity index 96%
rename from docs/assets/index.html.3a5189cb.js
rename to docs/assets/index.html.ceb36e17.js
index 46a16d851..6d85e931a 100644
--- a/docs/assets/index.html.3a5189cb.js
+++ b/docs/assets/index.html.ceb36e17.js
@@ -1,4 +1,4 @@
-import{r as c,o as i,c as k,a,b as n,z as t,F as m,Q as o,B as s}from"./app.519dac2e.js";import{_ as b}from"./plugin-vue_export-helper.21dcd24c.js";const d={},y=o('<h1 id="components" tabindex="-1"><a class="header-anchor" href="#components" aria-hidden="true">#</a> Components</h1><p>Customize the datepicker with your custom components</p><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong>Make sure to properly read the documentation and check the examples on how to pass and configure a custom component. Wrong implementation may result in errors</strong></p></div><div class="custom-container tip"><p class="custom-container-title">TIP</p><p><strong>You can use <code>css</code> variables inside custom components if you need to style for the theme</strong></p></div><h2 id="monthyearcomponent" tabindex="-1"><a class="header-anchor" href="#monthyearcomponent" aria-hidden="true">#</a> monthYearComponent</h2><p>Create and use a custom component in the header for month/year select</p>',6),h=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),_=n("li",null,[n("code",null,"months"),s(": "),n("code",null,"{ value: number; text: string }[]"),s(" -> value: "),n("code",null,"0-11"),s(", text: name of the month")],-1),g=n("li",null,[n("code",null,"years"),s(": "),n("code",null,"{ value: number; text: string }[]"),s(" -> generated array of years based on provided range, text and value are the same")],-1),f=n("code",null,"filters",-1),v=s(": "),w=s("filters prop"),x=n("code",null,"monthPicker",-1),C=s(": "),q=s("monthPicker prop"),P=o("<li><code>month</code>: <code>number</code> -&gt; This is the value of the selected month</li><li><code>year</code> : <code>number</code> -&gt; This is the value of the selected year</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),I=n("code",null,"instance",-1),T=s(": "),D=n("code",null,"number",-1),A=s(" -> In case you are using "),M=s("multiCalendars prop"),R=s(", it will be 1 or 2"),j=n("code",null,"minDate",-1),Y=s(": "),N=n("code",null,"Date | string",-1),V=s(" -> "),S=s("minDate prop"),$=n("code",null,"maxDate",-1),G=s(": "),E=n("code",null,"Date | string",-1),O=s(" -> "),B=s("maxDate prop"),L=o('<div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the month and the year value make sure to <code>emit</code> the following:</p><ul><li>Month <ul><li>Event: <code>update:month</code></li><li>Value: <code>number</code></li></ul></li><li>Year <ul><li>Event: <code>update:year</code></li><li>Value: <code>number</code></li></ul></li><li>Handler event <ul><li>Event: <code>updateMonthYear</code></li><li>Value: <code>boolean</code> (only when updating year)</li></ul></li></ul></div>',1),F={class:"custom-container details"},z=n("summary",null,"Code Example",-1),H=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
+import{_ as i,r as c,o as k,c as m,b as a,e as n,x as t,F as b,R as o,z as s}from"./app.46c9efaa.js";const d={},y=o('<h1 id="components" tabindex="-1"><a class="header-anchor" href="#components" aria-hidden="true">#</a> Components</h1><p>Customize the datepicker with your custom components</p><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong>Make sure to properly read the documentation and check the examples on how to pass and configure a custom component. Wrong implementation may result in errors</strong></p></div><div class="custom-container tip"><p class="custom-container-title">TIP</p><p><strong>You can use <code>css</code> variables inside custom components if you need to style for the theme</strong></p></div><h2 id="monthyearcomponent" tabindex="-1"><a class="header-anchor" href="#monthyearcomponent" aria-hidden="true">#</a> monthYearComponent</h2><p>Create and use a custom component in the header for month/year select</p>',6),h=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),_=n("li",null,[n("code",null,"months"),s(": "),n("code",null,"{ value: number; text: string }[]"),s(" -> value: "),n("code",null,"0-11"),s(", text: name of the month")],-1),g=n("li",null,[n("code",null,"years"),s(": "),n("code",null,"{ value: number; text: string }[]"),s(" -> generated array of years based on provided range, text and value are the same")],-1),f=n("code",null,"filters",-1),v=s(": "),w=s("filters prop"),x=n("code",null,"monthPicker",-1),C=s(": "),q=s("monthPicker prop"),P=o("<li><code>month</code>: <code>number</code> -&gt; This is the value of the selected month</li><li><code>year</code> : <code>number</code> -&gt; This is the value of the selected year</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),I=n("code",null,"instance",-1),T=s(": "),D=n("code",null,"number",-1),A=s(" -> In case you are using "),M=s("multiCalendars prop"),R=s(", it will be 1 or 2"),j=n("code",null,"minDate",-1),Y=s(": "),N=n("code",null,"Date | string",-1),V=s(" -> "),S=s("minDate prop"),$=n("code",null,"maxDate",-1),G=s(": "),E=n("code",null,"Date | string",-1),O=s(" -> "),L=s("maxDate prop"),B=o('<div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the month and the year value make sure to <code>emit</code> the following:</p><ul><li>Month <ul><li>Event: <code>update:month</code></li><li>Value: <code>number</code></li></ul></li><li>Year <ul><li>Event: <code>update:year</code></li><li>Value: <code>number</code></li></ul></li><li>Handler event <ul><li>Event: <code>updateMonthYear</code></li><li>Value: <code>boolean</code> (only when updating year)</li></ul></li></ul></div>',1),F={class:"custom-container details"},z=n("summary",null,"Code Example",-1),H=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("Datepicker")]),s(),n("span",{class:"token attr-name"},"v-model"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("date"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},":month-year-component"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("monthYear"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},"/>")]),s(`
 `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
 
@@ -156,7 +156,7 @@ import{r as c,o as i,c as k,a,b as n,z as t,F as m,Q as o,B as s}from"./app.519d
   `),n("span",{class:"token punctuation"},"}"),s(`
 `),n("span",{class:"token punctuation"},"}"),s(`
 `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("style")]),n("span",{class:"token punctuation"},">")]),s(`
-`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br"),n("span",{class:"line-number"},"46"),n("br"),n("span",{class:"line-number"},"47"),n("br"),n("span",{class:"line-number"},"48"),n("br"),n("span",{class:"line-number"},"49"),n("br"),n("span",{class:"line-number"},"50"),n("br"),n("span",{class:"line-number"},"51"),n("br"),n("span",{class:"line-number"},"52"),n("br"),n("span",{class:"line-number"},"53"),n("br"),n("span",{class:"line-number"},"54"),n("br"),n("span",{class:"line-number"},"55"),n("br"),n("span",{class:"line-number"},"56"),n("br"),n("span",{class:"line-number"},"57"),n("br"),n("span",{class:"line-number"},"58"),n("br"),n("span",{class:"line-number"},"59"),n("br"),n("span",{class:"line-number"},"60"),n("br"),n("span",{class:"line-number"},"61"),n("br"),n("span",{class:"line-number"},"62"),n("br"),n("span",{class:"line-number"},"63"),n("br"),n("span",{class:"line-number"},"64"),n("br"),n("span",{class:"line-number"},"65"),n("br"),n("span",{class:"line-number"},"66"),n("br"),n("span",{class:"line-number"},"67"),n("br"),n("span",{class:"line-number"},"68"),n("br"),n("span",{class:"line-number"},"69"),n("br"),n("span",{class:"line-number"},"70"),n("br"),n("span",{class:"line-number"},"71"),n("br"),n("span",{class:"line-number"},"72"),n("br"),n("span",{class:"line-number"},"73"),n("br"),n("span",{class:"line-number"},"74"),n("br"),n("span",{class:"line-number"},"75"),n("br"),n("span",{class:"line-number"},"76"),n("br"),n("span",{class:"line-number"},"77"),n("br"),n("span",{class:"line-number"},"78"),n("br"),n("span",{class:"line-number"},"79"),n("br"),n("span",{class:"line-number"},"80"),n("br"),n("span",{class:"line-number"},"81"),n("br"),n("span",{class:"line-number"},"82"),n("br"),n("span",{class:"line-number"},"83"),n("br"),n("span",{class:"line-number"},"84"),n("br"),n("span",{class:"line-number"},"85"),n("br"),n("span",{class:"line-number"},"86"),n("br"),n("span",{class:"line-number"},"87"),n("br"),n("span",{class:"line-number"},"88"),n("br"),n("span",{class:"line-number"},"89"),n("br"),n("span",{class:"line-number"},"90"),n("br"),n("span",{class:"line-number"},"91"),n("br"),n("span",{class:"line-number"},"92"),n("br"),n("span",{class:"line-number"},"93"),n("br"),n("span",{class:"line-number"},"94"),n("br"),n("span",{class:"line-number"},"95"),n("br"),n("span",{class:"line-number"},"96"),n("br"),n("span",{class:"line-number"},"97"),n("br"),n("span",{class:"line-number"},"98"),n("br"),n("span",{class:"line-number"},"99"),n("br"),n("span",{class:"line-number"},"100"),n("br"),n("span",{class:"line-number"},"101"),n("br"),n("span",{class:"line-number"},"102"),n("br"),n("span",{class:"line-number"},"103"),n("br"),n("span",{class:"line-number"},"104"),n("br"),n("span",{class:"line-number"},"105"),n("br"),n("span",{class:"line-number"},"106"),n("br"),n("span",{class:"line-number"},"107"),n("br"),n("span",{class:"line-number"},"108"),n("br"),n("span",{class:"line-number"},"109"),n("br"),n("span",{class:"line-number"},"110"),n("br"),n("span",{class:"line-number"},"111"),n("br"),n("span",{class:"line-number"},"112"),n("br"),n("span",{class:"line-number"},"113"),n("br"),n("span",{class:"line-number"},"114"),n("br"),n("span",{class:"line-number"},"115"),n("br"),n("span",{class:"line-number"},"116"),n("br"),n("span",{class:"line-number"},"117"),n("br"),n("span",{class:"line-number"},"118"),n("br"),n("span",{class:"line-number"},"119"),n("br"),n("span",{class:"line-number"},"120"),n("br"),n("span",{class:"line-number"},"121"),n("br"),n("span",{class:"line-number"},"122"),n("br"),n("span",{class:"line-number"},"123"),n("br"),n("span",{class:"line-number"},"124"),n("br"),n("span",{class:"line-number"},"125"),n("br"),n("span",{class:"line-number"},"126"),n("br"),n("span",{class:"line-number"},"127"),n("br"),n("span",{class:"line-number"},"128"),n("br"),n("span",{class:"line-number"},"129"),n("br"),n("span",{class:"line-number"},"130"),n("br"),n("span",{class:"line-number"},"131"),n("br"),n("span",{class:"line-number"},"132"),n("br"),n("span",{class:"line-number"},"133"),n("br"),n("span",{class:"line-number"},"134"),n("br")])],-1),K=n("h2",{id:"timepickercomponent",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#timepickercomponent","aria-hidden":"true"},"#"),s(" timePickerComponent")],-1),Q=n("p",null,"Create and use a custom component for the time picker",-1),J=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),U=n("code",null,"hoursIncrement",-1),X=s(": "),Z=s("hoursIncrement prop"),nn=n("code",null,"minutesIncrement",-1),sn=s(": "),an=s("minutesIncrement prop"),tn=n("code",null,"secondsIncrement",-1),en=s(": "),on=s("minutesIncrement prop"),pn=n("code",null,"is24",-1),cn=s(": "),ln=s("is24 prop"),un=n("code",null,"hoursGridIncrement",-1),rn=s(": "),kn=s("hoursGridIncrement prop"),mn=n("code",null,"minutesGridIncrement",-1),bn=s(": "),dn=s("minutesGridIncrement prop"),yn=n("code",null,"secondsGridIncrement",-1),hn=s(": "),_n=s("secondsGridIncrement prop"),gn=n("code",null,"filters",-1),fn=s(" : "),vn=s("filters prop"),wn=n("code",null,"timePicker",-1),xn=s(": "),Cn=s("timePicker prop"),qn=o("<li><code>hours</code>: <code>number | [number, number]</code> -&gt; This is the hours value</li><li><code>minutes</code>: <code>number | [number, number]</code> -&gt; This is the minutes value</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),Pn=n("code",null,"noHoursOverlay",-1),In=s(": "),Tn=n("code",null,"boolean",-1),Dn=s(" -> "),An=s("noHoursOverlay prop"),Mn=n("code",null,"noMinutesOverlay",-1),Rn=s(": "),jn=n("code",null,"boolean",-1),Yn=s(" -> "),Nn=s("noMinutesOverlay prop"),Vn=n("code",null,"noSecondsOverlay",-1),Sn=s(": "),$n=n("code",null,"boolean",-1),Gn=s(" -> "),En=s("noSecondsOverlay prop"),On=n("li",null,[n("code",null,"customProps"),s(": "),n("code",null,"Record<string, unknown>"),s(" -> Your custom props")],-1),Bn=n("code",null,"enableSeconds",-1),Ln=s(": "),Fn=n("code",null,"boolean",-1),zn=s(" -> "),Hn=s("enableSeconds prop"),Wn=o('<p><strong>Note:</strong> <code>hours</code> and <code>minutes</code> values will be arrays if range picker mode is active.</p><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the hours and the minutes values make sure to <code>emit</code> the following:</p><ul><li>Hours <ul><li>Event: <code>update:hours</code></li><li>Value: <code>number | [number, number]</code></li></ul></li><li>Minutes <ul><li>Event: <code>update:minutes</code></li><li>Value: <code>number | [number, number]</code></li></ul></li></ul><p><strong>Note:</strong> Keep in mind that when you are using the range picker, both values for the time must be emitted. For example if you want to update the second date hours, you will <code>emit</code> something like this <code>emit(&#39;update:hours&#39;, [firstValueSaved, newSecondValue])</code></p></div>',2),Kn={class:"custom-container details"},Qn=n("summary",null,"Code Example",-1),Jn=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
+`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br"),n("span",{class:"line-number"},"46"),n("br"),n("span",{class:"line-number"},"47"),n("br"),n("span",{class:"line-number"},"48"),n("br"),n("span",{class:"line-number"},"49"),n("br"),n("span",{class:"line-number"},"50"),n("br"),n("span",{class:"line-number"},"51"),n("br"),n("span",{class:"line-number"},"52"),n("br"),n("span",{class:"line-number"},"53"),n("br"),n("span",{class:"line-number"},"54"),n("br"),n("span",{class:"line-number"},"55"),n("br"),n("span",{class:"line-number"},"56"),n("br"),n("span",{class:"line-number"},"57"),n("br"),n("span",{class:"line-number"},"58"),n("br"),n("span",{class:"line-number"},"59"),n("br"),n("span",{class:"line-number"},"60"),n("br"),n("span",{class:"line-number"},"61"),n("br"),n("span",{class:"line-number"},"62"),n("br"),n("span",{class:"line-number"},"63"),n("br"),n("span",{class:"line-number"},"64"),n("br"),n("span",{class:"line-number"},"65"),n("br"),n("span",{class:"line-number"},"66"),n("br"),n("span",{class:"line-number"},"67"),n("br"),n("span",{class:"line-number"},"68"),n("br"),n("span",{class:"line-number"},"69"),n("br"),n("span",{class:"line-number"},"70"),n("br"),n("span",{class:"line-number"},"71"),n("br"),n("span",{class:"line-number"},"72"),n("br"),n("span",{class:"line-number"},"73"),n("br"),n("span",{class:"line-number"},"74"),n("br"),n("span",{class:"line-number"},"75"),n("br"),n("span",{class:"line-number"},"76"),n("br"),n("span",{class:"line-number"},"77"),n("br"),n("span",{class:"line-number"},"78"),n("br"),n("span",{class:"line-number"},"79"),n("br"),n("span",{class:"line-number"},"80"),n("br"),n("span",{class:"line-number"},"81"),n("br"),n("span",{class:"line-number"},"82"),n("br"),n("span",{class:"line-number"},"83"),n("br"),n("span",{class:"line-number"},"84"),n("br"),n("span",{class:"line-number"},"85"),n("br"),n("span",{class:"line-number"},"86"),n("br"),n("span",{class:"line-number"},"87"),n("br"),n("span",{class:"line-number"},"88"),n("br"),n("span",{class:"line-number"},"89"),n("br"),n("span",{class:"line-number"},"90"),n("br"),n("span",{class:"line-number"},"91"),n("br"),n("span",{class:"line-number"},"92"),n("br"),n("span",{class:"line-number"},"93"),n("br"),n("span",{class:"line-number"},"94"),n("br"),n("span",{class:"line-number"},"95"),n("br"),n("span",{class:"line-number"},"96"),n("br"),n("span",{class:"line-number"},"97"),n("br"),n("span",{class:"line-number"},"98"),n("br"),n("span",{class:"line-number"},"99"),n("br"),n("span",{class:"line-number"},"100"),n("br"),n("span",{class:"line-number"},"101"),n("br"),n("span",{class:"line-number"},"102"),n("br"),n("span",{class:"line-number"},"103"),n("br"),n("span",{class:"line-number"},"104"),n("br"),n("span",{class:"line-number"},"105"),n("br"),n("span",{class:"line-number"},"106"),n("br"),n("span",{class:"line-number"},"107"),n("br"),n("span",{class:"line-number"},"108"),n("br"),n("span",{class:"line-number"},"109"),n("br"),n("span",{class:"line-number"},"110"),n("br"),n("span",{class:"line-number"},"111"),n("br"),n("span",{class:"line-number"},"112"),n("br"),n("span",{class:"line-number"},"113"),n("br"),n("span",{class:"line-number"},"114"),n("br"),n("span",{class:"line-number"},"115"),n("br"),n("span",{class:"line-number"},"116"),n("br"),n("span",{class:"line-number"},"117"),n("br"),n("span",{class:"line-number"},"118"),n("br"),n("span",{class:"line-number"},"119"),n("br"),n("span",{class:"line-number"},"120"),n("br"),n("span",{class:"line-number"},"121"),n("br"),n("span",{class:"line-number"},"122"),n("br"),n("span",{class:"line-number"},"123"),n("br"),n("span",{class:"line-number"},"124"),n("br"),n("span",{class:"line-number"},"125"),n("br"),n("span",{class:"line-number"},"126"),n("br"),n("span",{class:"line-number"},"127"),n("br"),n("span",{class:"line-number"},"128"),n("br"),n("span",{class:"line-number"},"129"),n("br"),n("span",{class:"line-number"},"130"),n("br"),n("span",{class:"line-number"},"131"),n("br"),n("span",{class:"line-number"},"132"),n("br"),n("span",{class:"line-number"},"133"),n("br"),n("span",{class:"line-number"},"134"),n("br")])],-1),K=n("h2",{id:"timepickercomponent",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#timepickercomponent","aria-hidden":"true"},"#"),s(" timePickerComponent")],-1),J=n("p",null,"Create and use a custom component for the time picker",-1),Q=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),U=n("code",null,"hoursIncrement",-1),X=s(": "),Z=s("hoursIncrement prop"),nn=n("code",null,"minutesIncrement",-1),sn=s(": "),an=s("minutesIncrement prop"),tn=n("code",null,"secondsIncrement",-1),en=s(": "),on=s("minutesIncrement prop"),pn=n("code",null,"is24",-1),cn=s(": "),ln=s("is24 prop"),un=n("code",null,"hoursGridIncrement",-1),rn=s(": "),kn=s("hoursGridIncrement prop"),mn=n("code",null,"minutesGridIncrement",-1),bn=s(": "),dn=s("minutesGridIncrement prop"),yn=n("code",null,"secondsGridIncrement",-1),hn=s(": "),_n=s("secondsGridIncrement prop"),gn=n("code",null,"filters",-1),fn=s(" : "),vn=s("filters prop"),wn=n("code",null,"timePicker",-1),xn=s(": "),Cn=s("timePicker prop"),qn=o("<li><code>hours</code>: <code>number | [number, number]</code> -&gt; This is the hours value</li><li><code>minutes</code>: <code>number | [number, number]</code> -&gt; This is the minutes value</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),Pn=n("code",null,"noHoursOverlay",-1),In=s(": "),Tn=n("code",null,"boolean",-1),Dn=s(" -> "),An=s("noHoursOverlay prop"),Mn=n("code",null,"noMinutesOverlay",-1),Rn=s(": "),jn=n("code",null,"boolean",-1),Yn=s(" -> "),Nn=s("noMinutesOverlay prop"),Vn=n("code",null,"noSecondsOverlay",-1),Sn=s(": "),$n=n("code",null,"boolean",-1),Gn=s(" -> "),En=s("noSecondsOverlay prop"),On=n("li",null,[n("code",null,"customProps"),s(": "),n("code",null,"Record<string, unknown>"),s(" -> Your custom props")],-1),Ln=n("code",null,"enableSeconds",-1),Bn=s(": "),Fn=n("code",null,"boolean",-1),zn=s(" -> "),Hn=s("enableSeconds prop"),Wn=o('<p><strong>Note:</strong> <code>hours</code> and <code>minutes</code> values will be arrays if range picker mode is active.</p><div class="custom-container tip"><p class="custom-container-title">Important</p><p>To update the hours and the minutes values make sure to <code>emit</code> the following:</p><ul><li>Hours <ul><li>Event: <code>update:hours</code></li><li>Value: <code>number | [number, number]</code></li></ul></li><li>Minutes <ul><li>Event: <code>update:minutes</code></li><li>Value: <code>number | [number, number]</code></li></ul></li></ul><p><strong>Note:</strong> Keep in mind that when you are using the range picker, both values for the time must be emitted. For example if you want to update the second date hours, you will <code>emit</code> something like this <code>emit(&#39;update:hours&#39;, [firstValueSaved, newSecondValue])</code></p></div>',2),Kn={class:"custom-container details"},Jn=n("summary",null,"Code Example",-1),Qn=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("Datepicker")]),s(),n("span",{class:"token attr-name"},"v-model"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("date"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},":time-picker-component"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("timePicker"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},"/>")]),s(`
 `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
 
@@ -266,7 +266,7 @@ import{r as c,o as i,c as k,a,b as n,z as t,F as m,Q as o,B as s}from"./app.519d
         `),n("span",{class:"token property"},"outline"),n("span",{class:"token punctuation"},":"),s(" none"),n("span",{class:"token punctuation"},";"),s(`
     `),n("span",{class:"token punctuation"},"}"),s(`
 `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("style")]),n("span",{class:"token punctuation"},">")]),s(`
-`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br"),n("span",{class:"line-number"},"46"),n("br"),n("span",{class:"line-number"},"47"),n("br"),n("span",{class:"line-number"},"48"),n("br"),n("span",{class:"line-number"},"49"),n("br"),n("span",{class:"line-number"},"50"),n("br"),n("span",{class:"line-number"},"51"),n("br"),n("span",{class:"line-number"},"52"),n("br"),n("span",{class:"line-number"},"53"),n("br"),n("span",{class:"line-number"},"54"),n("br"),n("span",{class:"line-number"},"55"),n("br"),n("span",{class:"line-number"},"56"),n("br"),n("span",{class:"line-number"},"57"),n("br"),n("span",{class:"line-number"},"58"),n("br"),n("span",{class:"line-number"},"59"),n("br"),n("span",{class:"line-number"},"60"),n("br"),n("span",{class:"line-number"},"61"),n("br"),n("span",{class:"line-number"},"62"),n("br"),n("span",{class:"line-number"},"63"),n("br"),n("span",{class:"line-number"},"64"),n("br"),n("span",{class:"line-number"},"65"),n("br"),n("span",{class:"line-number"},"66"),n("br"),n("span",{class:"line-number"},"67"),n("br"),n("span",{class:"line-number"},"68"),n("br"),n("span",{class:"line-number"},"69"),n("br"),n("span",{class:"line-number"},"70"),n("br"),n("span",{class:"line-number"},"71"),n("br"),n("span",{class:"line-number"},"72"),n("br"),n("span",{class:"line-number"},"73"),n("br"),n("span",{class:"line-number"},"74"),n("br"),n("span",{class:"line-number"},"75"),n("br"),n("span",{class:"line-number"},"76"),n("br"),n("span",{class:"line-number"},"77"),n("br"),n("span",{class:"line-number"},"78"),n("br"),n("span",{class:"line-number"},"79"),n("br"),n("span",{class:"line-number"},"80"),n("br"),n("span",{class:"line-number"},"81"),n("br"),n("span",{class:"line-number"},"82"),n("br"),n("span",{class:"line-number"},"83"),n("br"),n("span",{class:"line-number"},"84"),n("br"),n("span",{class:"line-number"},"85"),n("br"),n("span",{class:"line-number"},"86"),n("br")])],-1),Xn=n("h2",{id:"actionrowcomponent",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#actionrowcomponent","aria-hidden":"true"},"#"),s(" actionRowComponent")],-1),Zn=n("p",null,"Create and use a custom component for action row",-1),ns=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),ss=n("code",null,"selectText",-1),as=s(": "),ts=s("selectText prop"),es=n("code",null,"cancelText",-1),os=s(": "),ps=s("cancelText prop"),cs=n("li",null,[n("code",null,"internalModelValue"),s(": "),n("code",null,"Date | [Date, Date]"),s(" -> Internal value, will be array if range is active")],-1),ls=n("code",null,"range",-1),us=s(": "),rs=s("range prop"),is=n("code",null,"previewFormat",-1),ks=s(": "),ms=s("previewFormat prop"),bs=n("code",null,"monthPicker",-1),ds=s(" : "),ys=s("monthPicker prop"),hs=n("code",null,"timePicker",-1),_s=s(": "),gs=s("timePicker prop"),fs=n("code",null,"multiCalendars",-1),vs=s(": "),ws=n("code",null,"boolean",-1),xs=s(" -> "),Cs=s("multiCalendars prop"),qs=o("<li><code>calendarWidth</code>: <code>number</code> -&gt; Calendar width</li><li><code>menuMount</code>: <code>boolean</code> -&gt; True when the parent menu component is mounted</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),Ps=n("code",null,"minDate",-1),Is=s(": "),Ts=n("code",null,"Date | string",-1),Ds=s(" -> "),As=s("minDate prop"),Ms=n("code",null,"maxDate",-1),Rs=s(": "),js=n("code",null,"Date | string",-1),Ys=s(" -> "),Ns=s("maxDate prop"),Vs=n("code",null,"enableTimePicker",-1),Ss=s(": "),$s=n("code",null,"boolean",-1),Gs=s(" -> "),Es=s("enableTimePicker prop"),Os=n("code",null,"maxTime",-1),Bs=s(": "),Ls=n("code",null,"{ hours: number | string; minutes: number |stirng; seconds: number | string }",-1),Fs=s(" -> "),zs=s("maxTime prop"),Hs=n("code",null,"minTime",-1),Ws=s(": "),Ks=n("code",null,"{ hours: number | string; minutes: number |stirng; seconds: number | string }",-1),Qs=s(" -> "),Js=s("minTime prop"),Us=n("div",{class:"custom-container tip"},[n("p",{class:"custom-container-title"},"Info"),n("p",null,[s("Two events are available from this component to "),n("code",null,"emit"),s(":")]),n("ul",null,[n("li",null,[n("code",null,"selectDate"),s(": Selects the current selection")]),n("li",null,[n("code",null,"closePicker"),s(": Closes the datepicker menu")])])],-1),Xs={class:"custom-container details"},Zs=n("summary",null,"Code Example",-1),na=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
+`)])]),n("div",{class:"line-numbers","aria-hidden":"true"},[n("span",{class:"line-number"},"1"),n("br"),n("span",{class:"line-number"},"2"),n("br"),n("span",{class:"line-number"},"3"),n("br"),n("span",{class:"line-number"},"4"),n("br"),n("span",{class:"line-number"},"5"),n("br"),n("span",{class:"line-number"},"6"),n("br"),n("span",{class:"line-number"},"7"),n("br"),n("span",{class:"line-number"},"8"),n("br"),n("span",{class:"line-number"},"9"),n("br"),n("span",{class:"line-number"},"10"),n("br"),n("span",{class:"line-number"},"11"),n("br"),n("span",{class:"line-number"},"12"),n("br"),n("span",{class:"line-number"},"13"),n("br"),n("span",{class:"line-number"},"14"),n("br"),n("span",{class:"line-number"},"15"),n("br"),n("span",{class:"line-number"},"16"),n("br"),n("span",{class:"line-number"},"17"),n("br"),n("span",{class:"line-number"},"18"),n("br"),n("span",{class:"line-number"},"19"),n("br"),n("span",{class:"line-number"},"20"),n("br"),n("span",{class:"line-number"},"21"),n("br"),n("span",{class:"line-number"},"22"),n("br"),n("span",{class:"line-number"},"23"),n("br"),n("span",{class:"line-number"},"24"),n("br"),n("span",{class:"line-number"},"25"),n("br"),n("span",{class:"line-number"},"26"),n("br"),n("span",{class:"line-number"},"27"),n("br"),n("span",{class:"line-number"},"28"),n("br"),n("span",{class:"line-number"},"29"),n("br"),n("span",{class:"line-number"},"30"),n("br"),n("span",{class:"line-number"},"31"),n("br"),n("span",{class:"line-number"},"32"),n("br"),n("span",{class:"line-number"},"33"),n("br"),n("span",{class:"line-number"},"34"),n("br"),n("span",{class:"line-number"},"35"),n("br"),n("span",{class:"line-number"},"36"),n("br"),n("span",{class:"line-number"},"37"),n("br"),n("span",{class:"line-number"},"38"),n("br"),n("span",{class:"line-number"},"39"),n("br"),n("span",{class:"line-number"},"40"),n("br"),n("span",{class:"line-number"},"41"),n("br"),n("span",{class:"line-number"},"42"),n("br"),n("span",{class:"line-number"},"43"),n("br"),n("span",{class:"line-number"},"44"),n("br"),n("span",{class:"line-number"},"45"),n("br"),n("span",{class:"line-number"},"46"),n("br"),n("span",{class:"line-number"},"47"),n("br"),n("span",{class:"line-number"},"48"),n("br"),n("span",{class:"line-number"},"49"),n("br"),n("span",{class:"line-number"},"50"),n("br"),n("span",{class:"line-number"},"51"),n("br"),n("span",{class:"line-number"},"52"),n("br"),n("span",{class:"line-number"},"53"),n("br"),n("span",{class:"line-number"},"54"),n("br"),n("span",{class:"line-number"},"55"),n("br"),n("span",{class:"line-number"},"56"),n("br"),n("span",{class:"line-number"},"57"),n("br"),n("span",{class:"line-number"},"58"),n("br"),n("span",{class:"line-number"},"59"),n("br"),n("span",{class:"line-number"},"60"),n("br"),n("span",{class:"line-number"},"61"),n("br"),n("span",{class:"line-number"},"62"),n("br"),n("span",{class:"line-number"},"63"),n("br"),n("span",{class:"line-number"},"64"),n("br"),n("span",{class:"line-number"},"65"),n("br"),n("span",{class:"line-number"},"66"),n("br"),n("span",{class:"line-number"},"67"),n("br"),n("span",{class:"line-number"},"68"),n("br"),n("span",{class:"line-number"},"69"),n("br"),n("span",{class:"line-number"},"70"),n("br"),n("span",{class:"line-number"},"71"),n("br"),n("span",{class:"line-number"},"72"),n("br"),n("span",{class:"line-number"},"73"),n("br"),n("span",{class:"line-number"},"74"),n("br"),n("span",{class:"line-number"},"75"),n("br"),n("span",{class:"line-number"},"76"),n("br"),n("span",{class:"line-number"},"77"),n("br"),n("span",{class:"line-number"},"78"),n("br"),n("span",{class:"line-number"},"79"),n("br"),n("span",{class:"line-number"},"80"),n("br"),n("span",{class:"line-number"},"81"),n("br"),n("span",{class:"line-number"},"82"),n("br"),n("span",{class:"line-number"},"83"),n("br"),n("span",{class:"line-number"},"84"),n("br"),n("span",{class:"line-number"},"85"),n("br"),n("span",{class:"line-number"},"86"),n("br")])],-1),Xn=n("h2",{id:"actionrowcomponent",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#actionrowcomponent","aria-hidden":"true"},"#"),s(" actionRowComponent")],-1),Zn=n("p",null,"Create and use a custom component for action row",-1),ns=n("p",null,[s("The component will receive the following "),n("code",null,"props"),s(":")],-1),ss=n("code",null,"selectText",-1),as=s(": "),ts=s("selectText prop"),es=n("code",null,"cancelText",-1),os=s(": "),ps=s("cancelText prop"),cs=n("li",null,[n("code",null,"internalModelValue"),s(": "),n("code",null,"Date | [Date, Date]"),s(" -> Internal value, will be array if range is active")],-1),ls=n("code",null,"range",-1),us=s(": "),rs=s("range prop"),is=n("code",null,"previewFormat",-1),ks=s(": "),ms=s("previewFormat prop"),bs=n("code",null,"monthPicker",-1),ds=s(" : "),ys=s("monthPicker prop"),hs=n("code",null,"timePicker",-1),_s=s(": "),gs=s("timePicker prop"),fs=n("code",null,"multiCalendars",-1),vs=s(": "),ws=n("code",null,"boolean",-1),xs=s(" -> "),Cs=s("multiCalendars prop"),qs=o("<li><code>calendarWidth</code>: <code>number</code> -&gt; Calendar width</li><li><code>menuMount</code>: <code>boolean</code> -&gt; True when the parent menu component is mounted</li><li><code>customProps</code>: <code>Record&lt;string, unknown&gt;</code> -&gt; Your custom props</li>",3),Ps=n("code",null,"minDate",-1),Is=s(": "),Ts=n("code",null,"Date | string",-1),Ds=s(" -> "),As=s("minDate prop"),Ms=n("code",null,"maxDate",-1),Rs=s(": "),js=n("code",null,"Date | string",-1),Ys=s(" -> "),Ns=s("maxDate prop"),Vs=n("code",null,"enableTimePicker",-1),Ss=s(": "),$s=n("code",null,"boolean",-1),Gs=s(" -> "),Es=s("enableTimePicker prop"),Os=n("code",null,"maxTime",-1),Ls=s(": "),Bs=n("code",null,"{ hours: number | string; minutes: number |stirng; seconds: number | string }",-1),Fs=s(" -> "),zs=s("maxTime prop"),Hs=n("code",null,"minTime",-1),Ws=s(": "),Ks=n("code",null,"{ hours: number | string; minutes: number |stirng; seconds: number | string }",-1),Js=s(" -> "),Qs=s("minTime prop"),Us=n("div",{class:"custom-container tip"},[n("p",{class:"custom-container-title"},"Info"),n("p",null,[s("Two events are available from this component to "),n("code",null,"emit"),s(":")]),n("ul",null,[n("li",null,[n("code",null,"selectDate"),s(": Selects the current selection")]),n("li",null,[n("code",null,"closePicker"),s(": Closes the datepicker menu")])])],-1),Xs={class:"custom-container details"},Zs=n("summary",null,"Code Example",-1),na=n("div",{class:"language-vue ext-vue line-numbers-mode"},[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
     `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("Datepicker")]),s(),n("span",{class:"token attr-name"},"v-model"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("date"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},":action-row-component"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("actionRow"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token punctuation"},"/>")]),s(`
 `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),s("template")]),n("span",{class:"token punctuation"},">")]),s(`
 
@@ -381,4 +381,4 @@ import{r as c,o as i,c as k,a,b as n,z as t,F as m,Q as o,B as s}from"./app.519d
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details>`,1);function ra(ia,ka){const l=c("CustomComponentsDemo"),e=c("RouterLink"),p=c("CodeGroupItem"),u=c("CodeGroup"),r=c("ExternalLinkIcon");return i(),k(m,null,[y,a(l,{useCustomMonthYear:!0}),h,n("ul",null,[_,g,n("li",null,[f,v,a(e,{to:"/api/props/#filters"},{default:t(()=>[w]),_:1})]),n("li",null,[x,C,a(e,{to:"/api/props/#monthpicker"},{default:t(()=>[q]),_:1})]),P,n("li",null,[I,T,D,A,a(e,{to:"/api/props/#multicalendars"},{default:t(()=>[M]),_:1}),R]),n("li",null,[j,Y,N,V,a(e,{to:"/api/props/#mindate"},{default:t(()=>[S]),_:1})]),n("li",null,[$,G,E,O,a(e,{to:"/api/props/#mindate"},{default:t(()=>[B]),_:1})])]),L,n("details",F,[z,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[H]),_:1}),a(p,{title:"MonthYearCustom"},{default:t(()=>[W]),_:1})]),_:1})]),K,Q,a(l,{useCustomTimePicker:!0}),J,n("ul",null,[n("li",null,[U,X,a(e,{to:"/api/props/#hoursincrement"},{default:t(()=>[Z]),_:1})]),n("li",null,[nn,sn,a(e,{to:"/api/props/#minutesincrement"},{default:t(()=>[an]),_:1})]),n("li",null,[tn,en,a(e,{to:"/api/props/#secondsincrement"},{default:t(()=>[on]),_:1})]),n("li",null,[pn,cn,a(e,{to:"/api/props/#is24"},{default:t(()=>[ln]),_:1})]),n("li",null,[un,rn,a(e,{to:"/api/props/#hoursgridincrement"},{default:t(()=>[kn]),_:1})]),n("li",null,[mn,bn,a(e,{to:"/api/props/#minutesgridincrement"},{default:t(()=>[dn]),_:1})]),n("li",null,[yn,hn,a(e,{to:"/api/props/#secondsgridincrement"},{default:t(()=>[_n]),_:1})]),n("li",null,[gn,fn,a(e,{to:"/api/props/#filters"},{default:t(()=>[vn]),_:1})]),n("li",null,[wn,xn,a(e,{to:"/api/props/#timepicker"},{default:t(()=>[Cn]),_:1})]),qn,n("li",null,[Pn,In,Tn,Dn,a(e,{to:"/api/props/#nohoursoverlay"},{default:t(()=>[An]),_:1})]),n("li",null,[Mn,Rn,jn,Yn,a(e,{to:"/api/props/#nominutesoverlay"},{default:t(()=>[Nn]),_:1})]),n("li",null,[Vn,Sn,$n,Gn,a(e,{to:"/api/props/#nosecondsoverlay"},{default:t(()=>[En]),_:1})]),On,n("li",null,[Bn,Ln,Fn,zn,a(e,{to:"/api/props/#enableseconds"},{default:t(()=>[Hn]),_:1})])]),Wn,n("details",Kn,[Qn,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[Jn]),_:1}),a(p,{title:"TimePickerCustom"},{default:t(()=>[Un]),_:1})]),_:1})]),Xn,Zn,a(l,{useCustomActionRow:!0}),ns,n("ul",null,[n("li",null,[ss,as,a(e,{to:"/api/props/#selecttext"},{default:t(()=>[ts]),_:1})]),n("li",null,[es,os,a(e,{to:"/api/props/#canceltext"},{default:t(()=>[ps]),_:1})]),cs,n("li",null,[ls,us,a(e,{to:"/api/props/#range"},{default:t(()=>[rs]),_:1})]),n("li",null,[is,ks,a(e,{to:"/api/props/#previewformat"},{default:t(()=>[ms]),_:1})]),n("li",null,[bs,ds,a(e,{to:"/api/props/#monthpicker"},{default:t(()=>[ys]),_:1})]),n("li",null,[hs,_s,a(e,{to:"/api/props/#timepicker"},{default:t(()=>[gs]),_:1})]),n("li",null,[fs,vs,ws,xs,a(e,{to:"/api/props/#multicalendars"},{default:t(()=>[Cs]),_:1})]),qs,n("li",null,[Ps,Is,Ts,Ds,a(e,{to:"/api/props/#mindate"},{default:t(()=>[As]),_:1})]),n("li",null,[Ms,Rs,js,Ys,a(e,{to:"/api/props/#mindate"},{default:t(()=>[Ns]),_:1})]),n("li",null,[Vs,Ss,$s,Gs,a(e,{to:"/api/props/#enabletimepicker"},{default:t(()=>[Es]),_:1})]),n("li",null,[Os,Bs,Ls,Fs,a(e,{to:"/api/props/#maxtime"},{default:t(()=>[zs]),_:1})]),n("li",null,[Hs,Ws,Ks,Qs,a(e,{to:"/api/props/#mintime"},{default:t(()=>[Js]),_:1})])]),Us,n("details",Xs,[Zs,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[na]),_:1}),a(p,{title:"ActionRowCustom"},{default:t(()=>[sa]),_:1})]),_:1})]),aa,ta,ea,n("p",null,[oa,n("a",pa,[ca,a(r)]),la]),ua],64)}var da=b(d,[["render",ra]]);export{da as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details>`,1);function ra(ia,ka){const l=c("CustomComponentsDemo"),e=c("RouterLink"),p=c("CodeGroupItem"),u=c("CodeGroup"),r=c("ExternalLinkIcon");return k(),m(b,null,[y,a(l,{useCustomMonthYear:!0}),h,n("ul",null,[_,g,n("li",null,[f,v,a(e,{to:"/api/props/#filters"},{default:t(()=>[w]),_:1})]),n("li",null,[x,C,a(e,{to:"/api/props/#monthpicker"},{default:t(()=>[q]),_:1})]),P,n("li",null,[I,T,D,A,a(e,{to:"/api/props/#multicalendars"},{default:t(()=>[M]),_:1}),R]),n("li",null,[j,Y,N,V,a(e,{to:"/api/props/#mindate"},{default:t(()=>[S]),_:1})]),n("li",null,[$,G,E,O,a(e,{to:"/api/props/#mindate"},{default:t(()=>[L]),_:1})])]),B,n("details",F,[z,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[H]),_:1}),a(p,{title:"MonthYearCustom"},{default:t(()=>[W]),_:1})]),_:1})]),K,J,a(l,{useCustomTimePicker:!0}),Q,n("ul",null,[n("li",null,[U,X,a(e,{to:"/api/props/#hoursincrement"},{default:t(()=>[Z]),_:1})]),n("li",null,[nn,sn,a(e,{to:"/api/props/#minutesincrement"},{default:t(()=>[an]),_:1})]),n("li",null,[tn,en,a(e,{to:"/api/props/#secondsincrement"},{default:t(()=>[on]),_:1})]),n("li",null,[pn,cn,a(e,{to:"/api/props/#is24"},{default:t(()=>[ln]),_:1})]),n("li",null,[un,rn,a(e,{to:"/api/props/#hoursgridincrement"},{default:t(()=>[kn]),_:1})]),n("li",null,[mn,bn,a(e,{to:"/api/props/#minutesgridincrement"},{default:t(()=>[dn]),_:1})]),n("li",null,[yn,hn,a(e,{to:"/api/props/#secondsgridincrement"},{default:t(()=>[_n]),_:1})]),n("li",null,[gn,fn,a(e,{to:"/api/props/#filters"},{default:t(()=>[vn]),_:1})]),n("li",null,[wn,xn,a(e,{to:"/api/props/#timepicker"},{default:t(()=>[Cn]),_:1})]),qn,n("li",null,[Pn,In,Tn,Dn,a(e,{to:"/api/props/#nohoursoverlay"},{default:t(()=>[An]),_:1})]),n("li",null,[Mn,Rn,jn,Yn,a(e,{to:"/api/props/#nominutesoverlay"},{default:t(()=>[Nn]),_:1})]),n("li",null,[Vn,Sn,$n,Gn,a(e,{to:"/api/props/#nosecondsoverlay"},{default:t(()=>[En]),_:1})]),On,n("li",null,[Ln,Bn,Fn,zn,a(e,{to:"/api/props/#enableseconds"},{default:t(()=>[Hn]),_:1})])]),Wn,n("details",Kn,[Jn,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[Qn]),_:1}),a(p,{title:"TimePickerCustom"},{default:t(()=>[Un]),_:1})]),_:1})]),Xn,Zn,a(l,{useCustomActionRow:!0}),ns,n("ul",null,[n("li",null,[ss,as,a(e,{to:"/api/props/#selecttext"},{default:t(()=>[ts]),_:1})]),n("li",null,[es,os,a(e,{to:"/api/props/#canceltext"},{default:t(()=>[ps]),_:1})]),cs,n("li",null,[ls,us,a(e,{to:"/api/props/#range"},{default:t(()=>[rs]),_:1})]),n("li",null,[is,ks,a(e,{to:"/api/props/#previewformat"},{default:t(()=>[ms]),_:1})]),n("li",null,[bs,ds,a(e,{to:"/api/props/#monthpicker"},{default:t(()=>[ys]),_:1})]),n("li",null,[hs,_s,a(e,{to:"/api/props/#timepicker"},{default:t(()=>[gs]),_:1})]),n("li",null,[fs,vs,ws,xs,a(e,{to:"/api/props/#multicalendars"},{default:t(()=>[Cs]),_:1})]),qs,n("li",null,[Ps,Is,Ts,Ds,a(e,{to:"/api/props/#mindate"},{default:t(()=>[As]),_:1})]),n("li",null,[Ms,Rs,js,Ys,a(e,{to:"/api/props/#mindate"},{default:t(()=>[Ns]),_:1})]),n("li",null,[Vs,Ss,$s,Gs,a(e,{to:"/api/props/#enabletimepicker"},{default:t(()=>[Es]),_:1})]),n("li",null,[Os,Ls,Bs,Fs,a(e,{to:"/api/props/#maxtime"},{default:t(()=>[zs]),_:1})]),n("li",null,[Hs,Ws,Ks,Js,a(e,{to:"/api/props/#mintime"},{default:t(()=>[Qs]),_:1})])]),Us,n("details",Xs,[Zs,a(u,null,{default:t(()=>[a(p,{title:"Parent Component",active:""},{default:t(()=>[na]),_:1}),a(p,{title:"ActionRowCustom"},{default:t(()=>[sa]),_:1})]),_:1})]),aa,ta,ea,n("p",null,[oa,n("a",pa,[ca,a(r)]),la]),ua],64)}var ba=i(d,[["render",ra],["__file","index.html.vue"]]);export{ba as default};
diff --git a/docs/assets/index.html.d713def1.js b/docs/assets/index.html.d713def1.js
deleted file mode 100644
index 746d69ab1..000000000
--- a/docs/assets/index.html.d713def1.js
+++ /dev/null
@@ -1 +0,0 @@
-const e={key:"v-55146a0d",path:"/api/props/",title:"Props",lang:"en-US",frontmatter:{lang:"en-US",title:"Props",description:"Datepicker props list to customize the component"},excerpt:"",headers:[{level:2,title:"Modes",slug:"modes",children:[{level:3,title:"range",slug:"range",children:[]},{level:3,title:"autoRange",slug:"autorange",children:[]},{level:3,title:"multiCalendars",slug:"multicalendars",children:[]},{level:3,title:"monthPicker",slug:"monthpicker",children:[]},{level:3,title:"timePicker",slug:"timepicker",children:[]},{level:3,title:"textInput",slug:"textinput",children:[]},{level:3,title:"inline",slug:"inline",children:[]},{level:3,title:"multiDates",slug:"multidates",children:[]},{level:3,title:"flow",slug:"flow",children:[]},{level:3,title:"utc",slug:"utc",children:[]},{level:3,title:"weekPicker",slug:"weekpicker",children:[]}]},{level:2,title:"Modes configuration",slug:"modes-configuration",children:[{level:3,title:"partialRange",slug:"partialrange",children:[]},{level:3,title:"presetRanges",slug:"presetranges",children:[]},{level:3,title:"minRange",slug:"minrange",children:[]},{level:3,title:"maxRange",slug:"maxrange",children:[]},{level:3,title:"fixedStart",slug:"fixedstart",children:[]},{level:3,title:"fixedEnd",slug:"fixedend",children:[]},{level:3,title:"multiCalendarsSolo",slug:"multicalendarssolo",children:[]},{level:3,title:"textInputOptions",slug:"textinputoptions",children:[]},{level:3,title:"modeHeight",slug:"modeheight",children:[]},{level:3,title:"inlineWithInput",slug:"inlinewithinput",children:[]},{level:3,title:"multiDatesLimit",slug:"multidateslimit",children:[]}]},{level:2,title:"Formatting",slug:"formatting",children:[{level:3,title:"format",slug:"format",children:[]},{level:3,title:"previewFormat",slug:"previewformat",children:[]},{level:3,title:"monthNameFormat",slug:"monthnameformat",children:[]}]},{level:2,title:"Localization",slug:"localization",children:[{level:3,title:"locale",slug:"locale",children:[]},{level:3,title:"formatLocale",slug:"formatlocale",children:[]},{level:3,title:"selectText",slug:"selecttext",children:[]},{level:3,title:"cancelText",slug:"canceltext",children:[]},{level:3,title:"nowButtonLabel",slug:"nowbuttonlabel",children:[]},{level:3,title:"weekNumName",slug:"weeknumname",children:[]}]},{level:2,title:"General configuration",slug:"general-configuration",children:[{level:3,title:"uid",slug:"uid",children:[]},{level:3,title:"monthChangeOnScroll",slug:"monthchangeonscroll",children:[]},{level:3,title:"modelValue",slug:"modelvalue",children:[]},{level:3,title:"clearable",slug:"clearable",children:[]},{level:3,title:"closeOnScroll",slug:"closeonscroll",children:[]},{level:3,title:"autoApply",slug:"autoapply",children:[]},{level:3,title:"placeholder",slug:"placeholder",children:[]},{level:3,title:"noToday",slug:"notoday",children:[]},{level:3,title:"closeOnAutoApply",slug:"closeonautoapply",children:[]},{level:3,title:"markers",slug:"markers",children:[]},{level:3,title:"showNowButton",slug:"shownowbutton",children:[]},{level:3,title:"disabled",slug:"disabled",children:[]},{level:3,title:"readonly",slug:"readonly",children:[]},{level:3,title:"required",slug:"required",children:[]},{level:3,title:"name",slug:"name",children:[]},{level:3,title:"autocomplete",slug:"autocomplete",children:[]},{level:3,title:"keepActionRow",slug:"keepactionrow",children:[]}]},{level:2,title:"Calendar configuration",slug:"calendar-configuration",children:[{level:3,title:"weekNumbers",slug:"weeknumbers",children:[]},{level:3,title:"hideOffsetDates",slug:"hideoffsetdates",children:[]},{level:3,title:"minDate",slug:"mindate",children:[]},{level:3,title:"maxDate",slug:"maxdate",children:[]},{level:3,title:"preventMinMaxNavigation",slug:"preventminmaxnavigation",children:[]},{level:3,title:"startDate",slug:"startdate",children:[]},{level:3,title:"weekStart",slug:"weekstart",children:[]},{level:3,title:"filters",slug:"filters",children:[]},{level:3,title:"disableMonthYearSelect",slug:"disablemonthyearselect",children:[]},{level:3,title:"yearRange",slug:"yearrange",children:[]},{level:3,title:"reverseYears",slug:"reverseyears",children:[]},{level:3,title:"allowedDates",slug:"alloweddates",children:[]},{level:3,title:"disabledDates",slug:"disableddates",children:[]},{level:3,title:"disabledWeekDays",slug:"disabledweekdays",children:[]}]},{level:2,title:"Time picker configuration",slug:"time-picker-configuration",children:[{level:3,title:"enableTimePicker",slug:"enabletimepicker",children:[]},{level:3,title:"is24",slug:"is24",children:[]},{level:3,title:"enableSeconds",slug:"enableseconds",children:[]},{level:3,title:"hoursIncrement",slug:"hoursincrement",children:[]},{level:3,title:"minutesIncrement",slug:"minutesincrement",children:[]},{level:3,title:"secondsIncrement",slug:"secondsincrement",children:[]},{level:3,title:"hoursGridIncrement",slug:"hoursgridincrement",children:[]},{level:3,title:"minutesGridIncrement",slug:"minutesgridincrement",children:[]},{level:3,title:"secondsGridIncrement",slug:"secondsgridincrement",children:[]},{level:3,title:"noHoursOverlay",slug:"nohoursoverlay",children:[]},{level:3,title:"noMinutesOverlay",slug:"nominutesoverlay",children:[]},{level:3,title:"noSecondsOverlay",slug:"nosecondsoverlay",children:[]},{level:3,title:"minTime",slug:"mintime",children:[]},{level:3,title:"maxTime",slug:"maxtime",children:[]},{level:3,title:"startTime",slug:"starttime",children:[]}]},{level:2,title:"Positioning",slug:"positioning",children:[{level:3,title:"position",slug:"position",children:[]},{level:3,title:"autoPosition",slug:"autoposition",children:[]},{level:3,title:"altPosition",slug:"altposition",children:[]},{level:3,title:"teleport",slug:"teleport",children:[]}]},{level:2,title:"Keyboard",slug:"keyboard",children:[{level:3,title:"openMenuOnFocus",slug:"openmenuonfocus",children:[]},{level:3,title:"escClose",slug:"escclose",children:[]},{level:3,title:"spaceConfirm",slug:"spaceconfirm",children:[]},{level:3,title:"monthChangeOnArrows",slug:"monthchangeonarrows",children:[]}]},{level:2,title:"Look and feel",slug:"look-and-feel",children:[{level:3,title:"transitions",slug:"transitions",children:[]},{level:3,title:"dark",slug:"dark",children:[]},{level:3,title:"hideInputIcon",slug:"hideinputicon",children:[]},{level:3,title:"state",slug:"state",children:[]},{level:3,title:"inputClassName",slug:"inputclassname",children:[]},{level:3,title:"menuClassName",slug:"menuclassname",children:[]},{level:3,title:"calendarClassName",slug:"calendarclassname",children:[]},{level:3,title:"calendarCellClassName",slug:"calendarcellclassname",children:[]}]}],git:{updatedTime:164754106e4},filePathRelative:"api/props/README.md"};export{e as data};
diff --git a/docs/assets/index.html.e796e241.js b/docs/assets/index.html.e796e241.js
deleted file mode 100644
index 5f33319bc..000000000
--- a/docs/assets/index.html.e796e241.js
+++ /dev/null
@@ -1 +0,0 @@
-import{r as a,o as s,c as n,b as e,a as i,z as c,F as d,B as t}from"./app.519dac2e.js";import{_ as h}from"./plugin-vue_export-helper.21dcd24c.js";const l={},p={style:{"text-align":"center"},markdown:"1"},u=t("\u2B50\uFE0F If you like the component, give it a star on "),_={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},m=t("GitHub"),k=t(" and consider "),f={href:"https://github.com/sponsors/Vuepic",target:"_blank",rel:"noopener noreferrer"},g=t("sponsoring"),b=t(" its development! \u2B50"),v={class:"custom-container tip"},x=e("p",{class:"custom-container-title"},"\u26A0\uFE0F Important \u26A0\uFE0F",-1),w=t("If you come from "),y={href:"https://github.com/Vuepic/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},V=e("code",null,"vue3-date-time-picker",-1),I=t(", the library is moved to the new repository with the new name: "),L={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},C=e("code",null,"@vuepic/vue-datepicker",-1),E=t(". If you haven't updated yet, please switch to the new package."),R=e("h1",{id:"vuepic-vue-datepicker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#vuepic-vue-datepicker","aria-hidden":"true"},"#"),t(" @vuepic/vue-datepicker")],-1),S=e("h3",{id:"the-most-complete-datepicker-solution-for-vue-3",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#the-most-complete-datepicker-solution-for-vue-3","aria-hidden":"true"},"#"),t(" The most complete datepicker solution for Vue 3")],-1),T={href:"https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE",target:"_blank",rel:"noopener noreferrer"},z=e("img",{src:"https://img.shields.io/npm/l/@vuepic/vue-datepicker",alt:"License"},null,-1),B=t(),F={href:"https://www.npmjs.com/package/@vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},N=e("img",{src:"https://img.shields.io/npm/v/@vuepic/vue-datepicker",alt:"npm"},null,-1),G=t(),H=e("img",{src:"https://img.shields.io/npm/dm/@vuepic/vue-datepicker",alt:"Downloads"},null,-1),j=t(),D={href:"https://github.com/Vuepic/vue-datepicker/issues",target:"_blank",rel:"noopener noreferrer"},M=e("img",{src:"https://img.shields.io/github/issues-raw/Vuepic/vue-datepicker",alt:"Open issues"},null,-1),O=t(),P=e("img",{src:"https://img.shields.io/github/workflow/status/Vuepic/vue-datepicker/CI?label=CI",alt:"CI"},null,-1),W=t(),A=e("img",{src:"https://img.shields.io/github/release-date/Vuepic/vue-datepicker",alt:"Release date"},null,-1),q=e("p",null,"Vue 3 date time picker is a lightweight yet powerful and reusable datepicker component. It aims to provide a high level of customization to fit within any project. Offers a great range of features, slots and props, while providing a way to customize for specific needs. Written in typescript to provide a great developer experience.",-1),J=t("Getting started"),K={href:"https://stackblitz.com/edit/vuepic-vue-datepicker?file=src%2Fcomponents%2FPlayground.vue",target:"_blank",rel:"noopener noreferrer"},Q=t("StackBlitz Playground"),U=e("h3",{id:"",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#","aria-hidden":"true"},"#")],-1),X=e("div",{style:{"text-align":"center"},markdown:"1"},[e("h2",{id:"features",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#features","aria-hidden":"true"},"#"),t(" Features")]),e("h4",{id:"single-date-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#single-date-picker","aria-hidden":"true"},"#"),t(" Single date picker")]),e("h4",{id:"range-date-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#range-date-picker","aria-hidden":"true"},"#"),t(" Range date picker")]),e("h4",{id:"time-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#time-picker","aria-hidden":"true"},"#"),t(" Time picker")]),e("h4",{id:"month-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#month-picker","aria-hidden":"true"},"#"),t(" Month picker")]),e("h4",{id:"text-input",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#text-input","aria-hidden":"true"},"#"),t(" Text input")]),e("h4",{id:"locale-support",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#locale-support","aria-hidden":"true"},"#"),t(" Locale support")]),e("h4",{id:"week-numbers",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#week-numbers","aria-hidden":"true"},"#"),t(" Week numbers")]),e("h4",{id:"dark-and-light-theme",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#dark-and-light-theme","aria-hidden":"true"},"#"),t(" Dark and light theme")]),e("h4",{id:"ssr-support",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#ssr-support","aria-hidden":"true"},"#"),t(" SSR support")]),e("h4",{id:"highly-configurable",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#highly-configurable","aria-hidden":"true"},"#"),t(" Highly configurable")]),e("h4",{id:"accessible",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#accessible","aria-hidden":"true"},"#"),t(" Accessible")]),e("h4",{id:"types-included",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#types-included","aria-hidden":"true"},"#"),t(" Types included")])],-1),Y={style:{"text-align":"center"},markdown:"1"},Z=e("h2",{id:"resources",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#resources","aria-hidden":"true"},"#"),t(" Resources")],-1),$={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},ee=t("GitHub"),te={href:"https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE",target:"_blank",rel:"noopener noreferrer"},ie=t("MIT License"),re=e("div",{style:{"text-align":"center"},markdown:"1"}," \xA9 Vuepic 2021-2022 ",-1);function ae(oe,se){const r=a("ExternalLinkIcon"),o=a("RouterLink");return s(),n(d,null,[e("div",p,[e("p",null,[u,e("a",_,[m,i(r)]),k,e("a",f,[g,i(r)]),b]),e("div",v,[x,e("p",null,[e("strong",null,[w,e("a",y,[V,i(r)]),I,e("a",L,[C,i(r)]),E])])]),R,S,e("p",null,[e("a",T,[z,i(r)]),B,e("a",F,[N,i(r)]),G,H,j,e("a",D,[M,i(r)]),O,P,W,A]),q,e("p",null,[i(o,{to:"/installation/"},{default:c(()=>[J]),_:1})]),e("p",null,[e("a",K,[Q,i(r)])])]),U,X,e("div",Y,[Z,e("p",null,[e("a",$,[ee,i(r)])]),e("p",null,[e("a",te,[ie,i(r)])])]),re],64)}var de=h(l,[["render",ae]]);export{de as default};
diff --git a/docs/assets/index.html.ae7c0acf.js b/docs/assets/index.html.f42a93ce.js
similarity index 98%
rename from docs/assets/index.html.ae7c0acf.js
rename to docs/assets/index.html.f42a93ce.js
index 6b2576da5..82d8c4ef9 100644
--- a/docs/assets/index.html.ae7c0acf.js
+++ b/docs/assets/index.html.f42a93ce.js
@@ -1,4 +1,4 @@
-import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app.519dac2e.js";import{_ as r}from"./plugin-vue_export-helper.21dcd24c.js";const k={},b=s('<h1 id="slots" tabindex="-1"><a class="header-anchor" href="#slots" aria-hidden="true">#</a> Slots</h1><p>Below is a list of available slots which you can use to change some default elements of the datepicker</p><h2 id="content" tabindex="-1"><a class="header-anchor" href="#content" aria-hidden="true">#</a> Content</h2><p>Customize parts in the datepicker menu</p><h3 id="calendar-header" tabindex="-1"><a class="header-anchor" href="#calendar-header" aria-hidden="true">#</a> calendar-header</h3><p>Replace the content in the calendar header cells</p><p>Available props are:</p><ul><li><code>day</code>: Displayed value in the header cell</li><li><code>index</code>: Column index it is rendered by</li></ul>',8),m=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+import{_ as l,r as c,o as u,c as i,b as n,e as t,x as o,F as r,R as s,z as p}from"./app.46c9efaa.js";const k={},b=s('<h1 id="slots" tabindex="-1"><a class="header-anchor" href="#slots" aria-hidden="true">#</a> Slots</h1><p>Below is a list of available slots which you can use to change some default elements of the datepicker</p><h2 id="content" tabindex="-1"><a class="header-anchor" href="#content" aria-hidden="true">#</a> Content</h2><p>Customize parts in the datepicker menu</p><h3 id="calendar-header" tabindex="-1"><a class="header-anchor" href="#calendar-header" aria-hidden="true">#</a> calendar-header</h3><p>Replace the content in the calendar header cells</p><p>Available props are:</p><ul><li><code>day</code>: Displayed value in the header cell</li><li><code>index</code>: Column index it is rendered by</li></ul>',8),m=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#calendar-header</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ index, day }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">:class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>index === 5 || index === 6 ? <span class="token punctuation">&#39;</span>red-color<span class="token punctuation">&#39;</span> : <span class="token punctuation">&#39;</span><span class="token punctuation">&#39;</span><span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
@@ -209,7 +209,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
         <span class="token property">cursor</span><span class="token punctuation">:</span> pointer<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="dp-input" tabindex="-1"><a class="header-anchor" href="#dp-input" aria-hidden="true">#</a> dp-input</h3><p>This slot replaces the input field. The difference from the <code>trigger slot</code> is that you will have access to the input field properties</p><p>Available props are:</p>`,4),S={class:"custom-container tip"},E=t("p",{class:"custom-container-title"},"TIP",-1),j=p("For functions to work correctly, make sure that the "),A=p("textInput prop"),V=p(" is enabled"),I=t("p",null,[p("When calling "),t("code",null,"onInput"),p(" function, make sure to pass the "),t("code",null,"input event"),p(" as argument")],-1),B=s("<ul><li><code>value</code>: Value displayed in the input field <ul><li>type: <code>string</code></li></ul></li><li><code>onInput</code>: Function called on the <code>@input</code> event <ul><li>type: <code>(event: Event) =&gt; void</code></li></ul></li><li><code>onEnter</code>: Function called on the <code>@keydown.enter</code> event <ul><li>type: <code>() =&gt; void</code></li></ul></li><li><code>onTab</code>: Function called on the <code>@keydown.tab</code> event <ul><li>type: <code>() =&gt; void</code></li></ul></li><li><code>onClear</code>: Function to call if you want to clear date <ul><li>type: <code>() =&gt; void</code></li></ul></li></ul>",1),F=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="dp-input" tabindex="-1"><a class="header-anchor" href="#dp-input" aria-hidden="true">#</a> dp-input</h3><p>This slot replaces the input field. The difference from the <code>trigger slot</code> is that you will have access to the input field properties</p><p>Available props are:</p>`,4),S={class:"custom-container tip"},E=t("p",{class:"custom-container-title"},"TIP",-1),j=p("For functions to work correctly, make sure that the "),A=p("textInput prop"),V=p(" is enabled"),I=t("p",null,[p("When calling "),t("code",null,"onInput"),p(" function, make sure to pass the "),t("code",null,"input event"),p(" as argument")],-1),F=s("<ul><li><code>value</code>: Value displayed in the input field <ul><li>type: <code>string</code></li></ul></li><li><code>onInput</code>: Function called on the <code>@input</code> event <ul><li>type: <code>(event: Event) =&gt; void</code></li></ul></li><li><code>onEnter</code>: Function called on the <code>@keydown.enter</code> event <ul><li>type: <code>() =&gt; void</code></li></ul></li><li><code>onTab</code>: Function called on the <code>@keydown.tab</code> event <ul><li>type: <code>() =&gt; void</code></li></ul></li><li><code>onClear</code>: Function to call if you want to clear date <ul><li>type: <code>() =&gt; void</code></li></ul></li></ul>",1),B=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#dp-input</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ value, onInput, onEnter, onTab, onClear }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
           <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>text<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>value<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
@@ -372,7 +372,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
         <span class="token property">width</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-up" tabindex="-1"><a class="header-anchor" href="#arrow-up" aria-hidden="true">#</a> arrow-up</h3><p>This slot replaces the arrow up icon in the time picker</p>`,3),$=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="arrow-up" tabindex="-1"><a class="header-anchor" href="#arrow-up" aria-hidden="true">#</a> arrow-up</h3><p>This slot replaces the arrow up icon in the time picker</p>`,3),R=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-up</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -401,7 +401,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
        <span class="token property">margin</span><span class="token punctuation">:</span> 0 auto<span class="token punctuation">;</span>
     <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="arrow-down" tabindex="-1"><a class="header-anchor" href="#arrow-down" aria-hidden="true">#</a> arrow-down</h3><p>This slot replaces the arrow down icon in the time picker</p>`,3),R=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><h3 id="arrow-down" tabindex="-1"><a class="header-anchor" href="#arrow-down" aria-hidden="true">#</a> arrow-down</h3><p>This slot replaces the arrow down icon in the time picker</p>`,3),$=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#arrow-down</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>slot-icon<span class="token punctuation">&quot;</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>/logo.png<span class="token punctuation">&quot;</span></span><span class="token punctuation">/&gt;</span></span>
@@ -554,7 +554,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="hours-overlay" tabindex="-1"><a class="header-anchor" href="#hours-overlay" aria-hidden="true">#</a> hours-overlay</h3><p>This slot replaces the text in the hours overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),Q=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="hours-overlay" tabindex="-1"><a class="header-anchor" href="#hours-overlay" aria-hidden="true">#</a> hours-overlay</h3><p>This slot replaces the text in the hours overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),W=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#hours-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -575,7 +575,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes-overlay" tabindex="-1"><a class="header-anchor" href="#minutes-overlay" aria-hidden="true">#</a> minutes-overlay</h3><p>This slot replaces the text in the minutes overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),W=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="minutes-overlay" tabindex="-1"><a class="header-anchor" href="#minutes-overlay" aria-hidden="true">#</a> minutes-overlay</h3><p>This slot replaces the text in the minutes overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),G=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#minutes-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -596,7 +596,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month" tabindex="-1"><a class="header-anchor" href="#month" aria-hidden="true">#</a> month</h3><p>This slot replaces the text in the month picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),G=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month" tabindex="-1"><a class="header-anchor" href="#month" aria-hidden="true">#</a> month</h3><p>This slot replaces the text in the month picker</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),J=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#month</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -617,7 +617,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year" tabindex="-1"><a class="header-anchor" href="#year" aria-hidden="true">#</a> year</h3><p>This slot replaces the text in the year picker</p><p>One props is available</p><ul><li><code>year</code>: Displayed year</li></ul>`,5),J=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="year" tabindex="-1"><a class="header-anchor" href="#year" aria-hidden="true">#</a> year</h3><p>This slot replaces the text in the year picker</p><p>One props is available</p><ul><li><code>year</code>: Displayed year</li></ul>`,5),K=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#year</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ year }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ year }}
@@ -638,7 +638,7 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month-overlay" tabindex="-1"><a class="header-anchor" href="#month-overlay" aria-hidden="true">#</a> month-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),K=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details><h3 id="month-overlay" tabindex="-1"><a class="header-anchor" href="#month-overlay" aria-hidden="true">#</a> month-overlay</h3><p>This slot replaces the text in the month picker overlay</p><p>2 props are available</p><ul><li><code>text</code>: Value displayed in the datepicker by default</li><li><code>value</code>: Actual value used in the code</li></ul>`,5),Q=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span> <span class="token attr-name">#month-overlay</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ text, value }<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
         {{ value }}
@@ -680,4 +680,4 @@ import{r as c,o as l,c as u,a as n,b as t,z as o,F as i,Q as s,B as p}from"./app
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details>`,1);function Z(nn,sn){const a=c("DemoSlots"),e=c("RouterLink");return l(),u(i,null,[b,n(a,{useCalendarHeaderSlot:!0}),m,n(a,{useDaySlot:!0}),d,n(a,{useActionButtonSlot:!0}),g,n(a,{useActionPreviewSlot:!0}),v,t("div",h,[y,t("p",null,[w,n(e,{to:"/api/props/#shownowbutton"},{default:o(()=>[q]),_:1}),f])]),x,D,n(a,{useNowButtonSlot:!0,showNowButton:!0,placeholder:"Select Date"}),_,n(a,{useAmPmButtonSlot:!0,is24:!1,placeholder:"Select Date"}),C,n(a,{useTriggerSlot:!0}),T,t("div",S,[E,t("p",null,[j,n(e,{to:"/api/props/#textinput"},{default:o(()=>[A]),_:1}),V]),I]),B,n(a,{useDpInputSlot:!0}),F,n(a,{useInputIconSlot:!0}),M,n(a,{useClearIconSlot:!0}),N,n(a,{useClockIconSlot:!0}),O,n(a,{useArrowLeftSlot:!0}),P,n(a,{useArrowRightSlot:!0}),H,n(a,{useArrowUpSlot:!0}),$,n(a,{useArrowDownSlot:!0}),R,n(a,{useCalendarIconSlot:!0}),z,n(a,{useTimePickerOverlay:!0}),L,n(a,{useHoursSlot:!0}),U,n(a,{useMinutesSlot:!0}),Y,n(a,{useHoursOverlaySlot:!0}),Q,n(a,{useMinutesOverlaySlot:!0}),W,n(a,{useMonthSlot:!0}),G,n(a,{useYearSlot:!0}),J,n(a,{useMonthOverlaySlot:!0}),K,n(a,{useYearOverlaySlot:!0}),X],64)}var pn=r(k,[["render",Z]]);export{pn as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div></details>`,1);function Z(nn,sn){const a=c("DemoSlots"),e=c("RouterLink");return u(),i(r,null,[b,n(a,{useCalendarHeaderSlot:!0}),m,n(a,{useDaySlot:!0}),d,n(a,{useActionButtonSlot:!0}),g,n(a,{useActionPreviewSlot:!0}),v,t("div",h,[y,t("p",null,[w,n(e,{to:"/api/props/#shownowbutton"},{default:o(()=>[q]),_:1}),f])]),x,D,n(a,{useNowButtonSlot:!0,showNowButton:!0,placeholder:"Select Date"}),_,n(a,{useAmPmButtonSlot:!0,is24:!1,placeholder:"Select Date"}),C,n(a,{useTriggerSlot:!0}),T,t("div",S,[E,t("p",null,[j,n(e,{to:"/api/props/#textinput"},{default:o(()=>[A]),_:1}),V]),I]),F,n(a,{useDpInputSlot:!0}),B,n(a,{useInputIconSlot:!0}),M,n(a,{useClearIconSlot:!0}),N,n(a,{useClockIconSlot:!0}),O,n(a,{useArrowLeftSlot:!0}),P,n(a,{useArrowRightSlot:!0}),H,n(a,{useArrowUpSlot:!0}),R,n(a,{useArrowDownSlot:!0}),$,n(a,{useCalendarIconSlot:!0}),z,n(a,{useTimePickerOverlay:!0}),L,n(a,{useHoursSlot:!0}),U,n(a,{useMinutesSlot:!0}),Y,n(a,{useHoursOverlaySlot:!0}),W,n(a,{useMinutesOverlaySlot:!0}),G,n(a,{useMonthSlot:!0}),J,n(a,{useYearSlot:!0}),K,n(a,{useMonthOverlaySlot:!0}),Q,n(a,{useYearOverlaySlot:!0}),X],64)}var tn=l(k,[["render",Z],["__file","index.html.vue"]]);export{tn as default};
diff --git a/docs/assets/index.html.4d000d1b.js b/docs/assets/index.html.fb7d3767.js
similarity index 92%
rename from docs/assets/index.html.4d000d1b.js
rename to docs/assets/index.html.fb7d3767.js
index 2f99e6f67..e4ec08a8c 100644
--- a/docs/assets/index.html.4d000d1b.js
+++ b/docs/assets/index.html.fb7d3767.js
@@ -1,4 +1,4 @@
-import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac2e.js";import{_ as D}from"./plugin-vue_export-helper.21dcd24c.js";const _={},T=t("h1",{id:"props",tabindex:"-1"},[t("a",{class:"header-anchor",href:"#props","aria-hidden":"true"},"#"),o(" Props")],-1),C={style:{"text-align":"center"},markdown:"1"},E={class:"custom-container tip"},j=t("p",{class:"custom-container-title"},"\u26A0\uFE0F Important \u26A0\uFE0F",-1),S=o("If you come from "),I={href:"https://github.com/Vuepic/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},M=t("code",null,"vue3-date-time-picker",-1),O=o(", the library is moved to the new repository with the new name: "),A={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},N=t("code",null,"@vuepic/vue-datepicker",-1),F=o(". If you haven't updated yet, please switch to the new package."),P=s('<p>List of available props</p><div class="custom-container tip"><p class="custom-container-title">Info</p><ul><li>When checking the examples, for <code>boolean</code> prop types, the example will show the behavior opposite of what is set for the default value</li><li>If you use the component in the browser <code>&lt;script&gt;</code> tag, make sure to pass multi-word props with <code>-</code>, for example, <code>is24</code> as <code>is-24</code> and so on</li></ul></div><h2 id="modes" tabindex="-1"><a class="header-anchor" href="#modes" aria-hidden="true">#</a> Modes</h2><p>Set the default mode for the datepicker</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Depending on the mode, <a href="#modelvalue"><code>v-model</code></a> might be different, so make sure to use the proper configuration</p></div><h3 id="range" tabindex="-1"><a class="header-anchor" href="#range" aria-hidden="true">#</a> range</h3><p>Range picker mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>',8),R=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+import{_ as w,r as e,o as q,c as x,e as t,b as n,F as D,z as o,R as s}from"./app.46c9efaa.js";const _={},T=t("h1",{id:"props",tabindex:"-1"},[t("a",{class:"header-anchor",href:"#props","aria-hidden":"true"},"#"),o(" Props")],-1),C={style:{"text-align":"center"},markdown:"1"},E={class:"custom-container tip"},j=t("p",{class:"custom-container-title"},"\u26A0\uFE0F Important \u26A0\uFE0F",-1),S=o("If you come from "),I={href:"https://github.com/Vuepic/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},M=t("code",null,"vue3-date-time-picker",-1),O=o(", the library is moved to the new repository with the new name: "),A={href:"https://github.com/Vuepic/vue-datepicker",target:"_blank",rel:"noopener noreferrer"},N=t("code",null,"@vuepic/vue-datepicker",-1),P=o(". If you haven't updated yet, please switch to the new package."),F=s('<p>List of available props</p><div class="custom-container tip"><p class="custom-container-title">Info</p><ul><li>When checking the examples, for <code>boolean</code> prop types, the example will show the behavior opposite of what is set for the default value</li><li>If you use the component in the browser <code>&lt;script&gt;</code> tag, make sure to pass multi-word props with <code>-</code>, for example, <code>is24</code> as <code>is-24</code> and so on</li></ul></div><h2 id="modes" tabindex="-1"><a class="header-anchor" href="#modes" aria-hidden="true">#</a> Modes</h2><p>Set the default mode for the datepicker</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>Depending on the mode, <a href="#modelvalue"><code>v-model</code></a> might be different, so make sure to use the proper configuration</p></div><h3 id="range" tabindex="-1"><a class="header-anchor" href="#range" aria-hidden="true">#</a> range</h3><p>Range picker mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>',8),R=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -39,7 +39,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multicalendars" tabindex="-1"><a class="header-anchor" href="#multicalendars" aria-hidden="true">#</a> multiCalendars</h3><p>Enabling this prop will show multiple calendars side by side (on mobile devices, they will be in a column layout) for range picker. You can also pass a number to show more calendars. If you pass <code>true</code>, 2 calendars will be shown automatically.</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>boolean | number | string</code></li><li>Default: <code>false</code></li></ul>`,5),W=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multicalendars" tabindex="-1"><a class="header-anchor" href="#multicalendars" aria-hidden="true">#</a> multiCalendars</h3><p>Enabling this prop will show multiple calendars side by side (on mobile devices, they will be in a column layout) for range picker. You can also pass a number to show more calendars. If you pass <code>true</code>, 2 calendars will be shown automatically.</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>boolean | number | string</code></li><li>Default: <code>false</code></li></ul>`,5),L=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">multiCalendars</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -62,7 +62,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="monthpicker" tabindex="-1"><a class="header-anchor" href="#monthpicker" aria-hidden="true">#</a> monthPicker</h3><p>Change datepicker mode to select only month and year</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Y=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="monthpicker" tabindex="-1"><a class="header-anchor" href="#monthpicker" aria-hidden="true">#</a> monthPicker</h3><p>Change datepicker mode to select only month and year</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),W=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>month<span class="token punctuation">&quot;</span></span> <span class="token attr-name">monthPicker</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -82,7 +82,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="timepicker" tabindex="-1"><a class="header-anchor" href="#timepicker" aria-hidden="true">#</a> timePicker</h3><p>Change datepicker mode to select only time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),L=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="timepicker" tabindex="-1"><a class="header-anchor" href="#timepicker" aria-hidden="true">#</a> timePicker</h3><p>Change datepicker mode to select only time</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Y=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>time<span class="token punctuation">&quot;</span></span> <span class="token attr-name">timePicker</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -119,7 +119,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inline" tabindex="-1"><a class="header-anchor" href="#inline" aria-hidden="true">#</a> inline</h3><p>Removes the input field and places the calendar in your parent component</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),G=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inline" tabindex="-1"><a class="header-anchor" href="#inline" aria-hidden="true">#</a> inline</h3><p>Removes the input field and places the calendar in your parent component</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),z=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">inline</span> <span class="token attr-name">autoApply</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -153,7 +153,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="flow" tabindex="-1"><a class="header-anchor" href="#flow" aria-hidden="true">#</a> flow</h3><p>Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset</p><ul><li>Type: <code>(&#39;month&#39; | &#39;year&#39; | &#39;calendar&#39; | &#39;time&#39; | &#39;minutes&#39; | &#39;hours&#39; | &#39;seconds&#39;)[]</code></li><li>Default: <code>[]</code></li></ul>`,4),z=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="flow" tabindex="-1"><a class="header-anchor" href="#flow" aria-hidden="true">#</a> flow</h3><p>Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset</p><ul><li>Type: <code>(&#39;month&#39; | &#39;year&#39; | &#39;calendar&#39; | &#39;time&#39; | &#39;minutes&#39; | &#39;hours&#39; | &#39;seconds&#39;)[]</code></li><li>Default: <code>[]</code></li></ul>`,4),G=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:flow</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>flow<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -207,7 +207,24 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></details><h2 id="modes-configuration" tabindex="-1"><a class="header-anchor" href="#modes-configuration" aria-hidden="true">#</a> Modes configuration</h2><p>Props for configuring and extending the datepicker when using a specific mode</p><h3 id="partialrange" tabindex="-1"><a class="header-anchor" href="#partialrange" aria-hidden="true">#</a> partialRange</h3><p>This prop is enabled by default, meaning, two dates are not required for range input. If no second date is selected, the value will be <code>null</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),J=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></details><h3 id="vertical" tabindex="-1"><a class="header-anchor" href="#vertical" aria-hidden="true">#</a> vertical</h3><p>Sets the datepicker orientation in the vertical mode. This mode will change the arrow action from left/right to the top/bottom, transitions will also be vertical</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),J=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">vertical</span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="modes-configuration" tabindex="-1"><a class="header-anchor" href="#modes-configuration" aria-hidden="true">#</a> Modes configuration</h2><p>Props for configuring and extending the datepicker when using a specific mode</p><h3 id="partialrange" tabindex="-1"><a class="header-anchor" href="#partialrange" aria-hidden="true">#</a> partialRange</h3><p>This prop is enabled by default, meaning, two dates are not required for range input. If no second date is selected, the value will be <code>null</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),K=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">:partialRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -224,7 +241,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="presetranges" tabindex="-1"><a class="header-anchor" href="#presetranges" aria-hidden="true">#</a> presetRanges</h3><p>When configured, it will provide a sidebar with configured range that user can select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>{ label: string; range: Date[] | string[] }[]</code></li><li>Default: <code>[]</code></li></ul>`,5),K=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="presetranges" tabindex="-1"><a class="header-anchor" href="#presetranges" aria-hidden="true">#</a> presetRanges</h3><p>When configured, it will provide a sidebar with configured range that user can select</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>{ label: string; range: Date[] | string[] }[]</code></li><li>Default: <code>[]</code></li></ul>`,5),Q=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">:presetRanges</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>presetRanges<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -253,7 +270,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><h3 id="minrange" tabindex="-1"><a class="header-anchor" href="#minrange" aria-hidden="true">#</a> minRange</h3><p>Set minimal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,6),Q=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br></div></div></details><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><h3 id="minrange" tabindex="-1"><a class="header-anchor" href="#minrange" aria-hidden="true">#</a> minRange</h3><p>Set minimal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,6),X=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">minRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>3<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -270,7 +287,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxrange" tabindex="-1"><a class="header-anchor" href="#maxrange" aria-hidden="true">#</a> maxRange</h3><p>Set maximal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,5),X=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxrange" tabindex="-1"><a class="header-anchor" href="#maxrange" aria-hidden="true">#</a> maxRange</h3><p>Set maximal range available for selection. This is the number of days between the selected start and end date</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,5),Z=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">maxRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>7<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -287,7 +304,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="fixedstart" tabindex="-1"><a class="header-anchor" href="#fixedstart" aria-hidden="true">#</a> fixedStart</h3><p>Allows only adjustment of the second date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedEnd</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),Z=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="fixedstart" tabindex="-1"><a class="header-anchor" href="#fixedstart" aria-hidden="true">#</a> fixedStart</h3><p>Allows only adjustment of the second date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedEnd</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),nn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">fixedStart</span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -311,7 +328,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="fixedend" tabindex="-1"><a class="header-anchor" href="#fixedend" aria-hidden="true">#</a> fixedEnd</h3><p>Allows only adjustment of the first date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedStart</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),nn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="fixedend" tabindex="-1"><a class="header-anchor" href="#fixedend" aria-hidden="true">#</a> fixedEnd</h3><p>Allows only adjustment of the first date in the defined range</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> prop must be enabled</p></div><div class="custom-container warning"><p class="custom-container-title">WARNING</p><p><strong><code>v-model</code> must be provided with both dates.</strong></p><p><strong>Should not be used in combination with <code>fixedStart</code></strong></p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),sn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">fixedEnd</span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -335,7 +352,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="multicalendarssolo" tabindex="-1"><a class="header-anchor" href="#multicalendarssolo" aria-hidden="true">#</a> multiCalendarsSolo</h3><p>When enabled, both calendars will be independent of each other</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> and <a href="#multicalendars">multiCalendars</a> props must be enabled</p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,5),sn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br></div></div></details><h3 id="multicalendarssolo" tabindex="-1"><a class="header-anchor" href="#multicalendarssolo" aria-hidden="true">#</a> multiCalendarsSolo</h3><p>When enabled, both calendars will be independent of each other</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p><a href="#range">range</a> and <a href="#multicalendars">multiCalendars</a> props must be enabled</p></div><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,5),an=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">range</span> <span class="token attr-name">multiCalendars</span> <span class="token attr-name">multiCalendarsSolo</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -358,7 +375,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="textinputoptions" tabindex="-1"><a class="header-anchor" href="#textinputoptions" aria-hidden="true">#</a> textInputOptions</h3><p>Configuration for <a href="#textinput">textInput</a> prop</p><ul><li>Type: <code>{ enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }</code></li><li>Default: <code>{ enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: &#39;-&#39; }</code></li></ul><p>Properties explanation:</p><ul><li><code>enterSubmit</code>: When enabled, pressing enter will select a date if the input value is a valid date object</li><li><code>tabSubmit</code>: When enabled, pressing tab will select a date if the input value is a valid date object</li><li><code>openMenu</code>: When enabled, opens the menu when clicking on the input field</li><li><code>format</code>: Override the default parsing format. Default is the string value from <a href="#format">format</a></li><li><code>rangeSeparator</code>: If you use <code>range</code> mode, the default separator is <code>-</code>, you can change it here</li></ul>`,6),an=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="textinputoptions" tabindex="-1"><a class="header-anchor" href="#textinputoptions" aria-hidden="true">#</a> textInputOptions</h3><p>Configuration for <a href="#textinput">textInput</a> prop</p><ul><li>Type: <code>{ enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }</code></li><li>Default: <code>{ enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: &#39;-&#39; }</code></li></ul><p>Properties explanation:</p><ul><li><code>enterSubmit</code>: When enabled, pressing enter will select a date if the input value is a valid date object</li><li><code>tabSubmit</code>: When enabled, pressing tab will select a date if the input value is a valid date object</li><li><code>openMenu</code>: When enabled, opens the menu when clicking on the input field</li><li><code>format</code>: Override the default parsing format. Default is the string value from <a href="#format">format</a></li><li><code>rangeSeparator</code>: If you use <code>range</code> mode, the default separator is <code>-</code>, you can change it here</li></ul>`,6),tn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> 
       <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span>
       <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Start Typing ...<span class="token punctuation">&quot;</span></span>
@@ -383,7 +400,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="modeheight" tabindex="-1"><a class="header-anchor" href="#modeheight" aria-hidden="true">#</a> modeHeight</h3><p>If you use <code>monthPicker</code> and <code>timePicker</code>, set custom height of the picker in <code>px</code></p><ul><li>Type: <code>number | string</code></li><li>Default: <code>255</code></li></ul>`,4),tn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="modeheight" tabindex="-1"><a class="header-anchor" href="#modeheight" aria-hidden="true">#</a> modeHeight</h3><p>If you use <code>monthPicker</code> and <code>timePicker</code>, set custom height of the picker in <code>px</code></p><ul><li>Type: <code>number | string</code></li><li>Default: <code>255</code></li></ul>`,4),pn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>time<span class="token punctuation">&quot;</span></span> <span class="token attr-name">timePicker</span> <span class="token attr-name">modeHeight</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>120<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -403,7 +420,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="inlinewithinput" tabindex="-1"><a class="header-anchor" href="#inlinewithinput" aria-hidden="true">#</a> inlineWithInput</h3><p>Use input with the inline mode, useful if you enable <code>textInput</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),pn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div></details><h3 id="inlinewithinput" tabindex="-1"><a class="header-anchor" href="#inlinewithinput" aria-hidden="true">#</a> inlineWithInput</h3><p>Use input with the inline mode, useful if you enable <code>textInput</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),en=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">inline</span> <span class="token attr-name">inlineWithInput</span> <span class="token attr-name">autoApply</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -420,7 +437,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidateslimit" tabindex="-1"><a class="header-anchor" href="#multidateslimit" aria-hidden="true">#</a> multiDatesLimit</h3><p>Limit the number of dates to select when <code>multiDates</code> is enabled</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,4),en=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="multidateslimit" tabindex="-1"><a class="header-anchor" href="#multidateslimit" aria-hidden="true">#</a> multiDatesLimit</h3><p>Limit the number of dates to select when <code>multiDates</code> is enabled</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>null</code></li></ul>`,4),on=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">multiDates</span> <span class="token attr-name">multiDatesLimit</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>3<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -437,7 +454,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="formatting" tabindex="-1"><a class="header-anchor" href="#formatting" aria-hidden="true">#</a> Formatting</h2><p>Format options for the value displayed in the input or preview</p><h3 id="format" tabindex="-1"><a class="header-anchor" href="#format" aria-hidden="true">#</a> format</h3><p>Format the value of the date(s) in the input field. Formatting is done automatically via provided string format. However, you can override the default format by providing a custom formatter function</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <ul><li>Single picker: <code>&#39;MM/dd/yyyy HH:mm&#39;</code></li><li>Range picker: <code>&#39;MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm&#39;</code></li><li>Month picker: <code>&#39;MM/yyyy&#39;</code></li><li>Time picker: <code>&#39;HH:mm&#39;</code></li><li>Time picker range: <code>&#39;HH:mm - HH:mm&#39;</code></li></ul></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>If <a href="#is24">is24</a> prop is set to <code>false</code>, hours format will be changed to <code>&#39;hh:mm aa&#39;</code></p></div>`,7),on=o("For additional information on how to pass custom string format you can check "),cn={href:"https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table",target:"_blank",rel:"noopener noreferrer"},ln=o("Unicode tokens"),un=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="formatting" tabindex="-1"><a class="header-anchor" href="#formatting" aria-hidden="true">#</a> Formatting</h2><p>Format options for the value displayed in the input or preview</p><h3 id="format" tabindex="-1"><a class="header-anchor" href="#format" aria-hidden="true">#</a> format</h3><p>Format the value of the date(s) in the input field. Formatting is done automatically via provided string format. However, you can override the default format by providing a custom formatter function</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <ul><li>Single picker: <code>&#39;MM/dd/yyyy HH:mm&#39;</code></li><li>Range picker: <code>&#39;MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm&#39;</code></li><li>Month picker: <code>&#39;MM/yyyy&#39;</code></li><li>Time picker: <code>&#39;HH:mm&#39;</code></li><li>Time picker range: <code>&#39;HH:mm - HH:mm&#39;</code></li></ul></li></ul><div class="custom-container tip"><p class="custom-container-title">Info</p><p>If <a href="#is24">is24</a> prop is set to <code>false</code>, hours format will be changed to <code>&#39;hh:mm aa&#39;</code></p></div>`,7),cn=o("For additional information on how to pass custom string format you can check "),ln={href:"https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table",target:"_blank",rel:"noopener noreferrer"},un=o("Unicode tokens"),rn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:format</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>format<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -464,7 +481,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="previewformat" tabindex="-1"><a class="header-anchor" href="#previewformat" aria-hidden="true">#</a> previewFormat</h3><p>Format the value of the date(s) in the action row</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <code>null</code></li></ul><p>Same configuration as in <a href="#format">format</a> prop</p><p><strong>Note:</strong> If not provided, it will auto inherit data from the <a href="#format">format</a> prop</p>`,6),rn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="previewformat" tabindex="-1"><a class="header-anchor" href="#previewformat" aria-hidden="true">#</a> previewFormat</h3><p>Format the value of the date(s) in the action row</p><ul><li>Type: <code>string | (params: Date | Date[]) =&gt; string</code></li><li>Default: <code>null</code></li></ul><p>Same configuration as in <a href="#format">format</a> prop</p><p><strong>Note:</strong> If not provided, it will auto inherit data from the <a href="#format">format</a> prop</p>`,6),kn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:previewFormat</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>format<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -491,7 +508,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="monthnameformat" tabindex="-1"><a class="header-anchor" href="#monthnameformat" aria-hidden="true">#</a> monthNameFormat</h3><p>Set the month name format</p><ul><li>Type: <code>&#39;short&#39; | &#39;long&#39;</code></li><li>Default: <code>&#39;short&#39;</code></li></ul>`,4),kn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div></details><h3 id="monthnameformat" tabindex="-1"><a class="header-anchor" href="#monthnameformat" aria-hidden="true">#</a> monthNameFormat</h3><p>Set the month name format</p><ul><li>Type: <code>&#39;short&#39; | &#39;long&#39;</code></li><li>Default: <code>&#39;short&#39;</code></li></ul>`,4),dn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">monthNameFormat</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>long<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -508,7 +525,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="localization" tabindex="-1"><a class="header-anchor" href="#localization" aria-hidden="true">#</a> Localization</h2><p>Localization options and label props</p><h3 id="locale" tabindex="-1"><a class="header-anchor" href="#locale" aria-hidden="true">#</a> locale</h3><p>Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;en-US&#39;</code></li></ul>`,6),dn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="localization" tabindex="-1"><a class="header-anchor" href="#localization" aria-hidden="true">#</a> Localization</h2><p>Localization options and label props</p><h3 id="locale" tabindex="-1"><a class="header-anchor" href="#locale" aria-hidden="true">#</a> locale</h3><p>Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;en-US&#39;</code></li></ul>`,6),bn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>de<span class="token punctuation">&quot;</span></span> <span class="token attr-name">cancelText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>abbrechen<span class="token punctuation">&quot;</span></span> <span class="token attr-name">selectText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>ausw\xE4hlen<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -525,7 +542,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="formatlocale" tabindex="-1"><a class="header-anchor" href="#formatlocale" aria-hidden="true">#</a> formatLocale</h3><p>Specify localized format output. This prop uses <code>Locale</code> object from <code>date-fns</code> library</p>`,3),mn=o("For more info about supported locales or adding a custom locale object, please visit "),bn={href:"https://date-fns.org/v2.27.0/docs/I18n",target:"_blank",rel:"noopener noreferrer"},gn=t("code",null,"date-fns documentation",-1),hn=t("ul",null,[t("li",null,[o("Type: "),t("code",null,"Locale")]),t("li",null,[o("Default: "),t("code",null,"null")])],-1),vn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="formatlocale" tabindex="-1"><a class="header-anchor" href="#formatlocale" aria-hidden="true">#</a> formatLocale</h3><p>Specify localized format output. This prop uses <code>Locale</code> object from <code>date-fns</code> library</p>`,3),mn=o("For more info about supported locales or adding a custom locale object, please visit "),gn={href:"https://date-fns.org/v2.27.0/docs/I18n",target:"_blank",rel:"noopener noreferrer"},hn=t("code",null,"date-fns documentation",-1),vn=t("ul",null,[t("li",null,[o("Type: "),t("code",null,"Locale")]),t("li",null,[o("Default: "),t("code",null,"null")])],-1),yn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:format-locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>ja<span class="token punctuation">&quot;</span></span> <span class="token attr-name">format</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>E<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -544,7 +561,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="selecttext" tabindex="-1"><a class="header-anchor" href="#selecttext" aria-hidden="true">#</a> selectText</h3><p>Select text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Select&#39;</code></li></ul>`,4),yn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="selecttext" tabindex="-1"><a class="header-anchor" href="#selecttext" aria-hidden="true">#</a> selectText</h3><p>Select text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Select&#39;</code></li></ul>`,4),fn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">selectText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Pick<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -561,7 +578,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="canceltext" tabindex="-1"><a class="header-anchor" href="#canceltext" aria-hidden="true">#</a> cancelText</h3><p>Cancel text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Cancel&#39;</code></li></ul>`,4),fn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="canceltext" tabindex="-1"><a class="header-anchor" href="#canceltext" aria-hidden="true">#</a> cancelText</h3><p>Cancel text label in the action row</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Cancel&#39;</code></li></ul>`,4),wn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">cancelText</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Close<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -578,7 +595,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nowbuttonlabel" tabindex="-1"><a class="header-anchor" href="#nowbuttonlabel" aria-hidden="true">#</a> nowButtonLabel</h3><p>Change the text for now button</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Now&#39;</code></li></ul>`,4),wn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nowbuttonlabel" tabindex="-1"><a class="header-anchor" href="#nowbuttonlabel" aria-hidden="true">#</a> nowButtonLabel</h3><p>Change the text for now button</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;Now&#39;</code></li></ul>`,4),qn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">showNowButton</span> <span class="token attr-name">nowButtonLabel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Current<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -595,7 +612,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weeknumname" tabindex="-1"><a class="header-anchor" href="#weeknumname" aria-hidden="true">#</a> weekNumName</h3><p>Sets the label for the week numbers column</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;W&#39;</code></li></ul>`,4),qn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="weeknumname" tabindex="-1"><a class="header-anchor" href="#weeknumname" aria-hidden="true">#</a> weekNumName</h3><p>Sets the label for the week numbers column</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;W&#39;</code></li></ul>`,4),xn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekNumbers</span> <span class="token attr-name">weekNumName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>We<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -612,7 +629,43 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="general-configuration" tabindex="-1"><a class="header-anchor" href="#general-configuration" aria-hidden="true">#</a> General configuration</h2><p>General behavior props configuration</p><h3 id="uid" tabindex="-1"><a class="header-anchor" href="#uid" aria-hidden="true">#</a> uid</h3><p>Pass an <code>id</code> to the input and menu elements. If provided, you can select menu id as <code>dp-menu-\${uid}</code> and input id as <code>dp-input-\${uid}</code></p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,6),xn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="arialabels" tabindex="-1"><a class="header-anchor" href="#arialabels" aria-hidden="true">#</a> ariaLabels</h3><p>Customize the language of the HTML <code>aria-labels</code> for localized accessibility</p><ul><li>Type</li></ul><div class="language-typescript ext-ts line-numbers-mode"><pre class="language-typescript"><code><span class="token keyword">interface</span> <span class="token class-name">AriaLabels</span> <span class="token punctuation">{</span>
+  toggleOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  menu<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  input<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  calendarWrap<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  calendarDays<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openTimePicker<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  closeTimePicker<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  incrementValue<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  decrementValue<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openTpOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">(</span>type<span class="token operator">:</span> <span class="token string">&#39;hours&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;minutes&#39;</span> <span class="token operator">|</span> <span class="token string">&#39;seconds&#39;</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  amPmButton<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openYearsOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  openMonthsOverlay<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  nextMonth<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+  prevMonth<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div><ul><li>Default: <code>{}</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:ariaLabels</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>ariaLabels<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        <span class="token keyword">const</span> ariaLabels <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">menu</span><span class="token operator">:</span> <span class="token string">&#39;Some custom menu label&#39;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+          date<span class="token punctuation">,</span>
+          ariaLabels<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="general-configuration" tabindex="-1"><a class="header-anchor" href="#general-configuration" aria-hidden="true">#</a> General configuration</h2><p>General behavior props configuration</p><h3 id="uid" tabindex="-1"><a class="header-anchor" href="#uid" aria-hidden="true">#</a> uid</h3><p>Pass an <code>id</code> to the input and menu elements. If provided, you can select menu id as <code>dp-menu-\${uid}</code> and input id as <code>dp-input-\${uid}</code></p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,12),Dn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">uid</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>demo<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -629,7 +682,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonscroll" tabindex="-1"><a class="header-anchor" href="#monthchangeonscroll" aria-hidden="true">#</a> monthChangeOnScroll</h3><p>Scrolling the mouse wheel over the calendar will change the month. Scroll up for next month and vice versa</p><p>You can also set the value to &#39;inverse&#39;, so that scroll up will go to the previous month and down on the next</p><ul><li>Type: <code>boolean | &#39;inverse&#39;</code></li><li>Default: <code>true</code></li></ul>`,5),Dn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonscroll" tabindex="-1"><a class="header-anchor" href="#monthchangeonscroll" aria-hidden="true">#</a> monthChangeOnScroll</h3><p>Scrolling the mouse wheel over the calendar will change the month. Scroll down for next month and vice versa</p><p>You can also set the value to <code>&#39;inverse&#39;</code>, so that scrolling down will go to the previous month and up on the next</p><ul><li>Type: <code>boolean | &#39;inverse&#39;</code></li><li>Default: <code>true</code></li></ul>`,5),_n=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:monthChangeOnScroll</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -646,7 +699,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details>`,1),_n={id:"modelvalue",tabindex:"-1"},Tn=t("a",{class:"header-anchor",href:"#modelvalue","aria-hidden":"true"},"#",-1),Cn=o(" modelValue "),En=s(`<p>v-model binding</p><ul><li>Type: <ul><li>Single picker: <code>Date | string</code><ul><li>In case of <code>multiDates</code> it will be <code>Date[] | string[]</code></li></ul></li><li>Month picker: <code>{ month: number | string; year: number | string }</code></li><li>Time picker: <code>{ hours: number | string; minutes: number | string; seconds?: number | string }</code></li><li>Week picker: <code>[Date, Date] | [string, string]</code></li><li>Range picker: <code>[Date, Date] | [string | string]</code><ul><li>If you use time picker, it will be <code>{ hours: number | string; minutes: number | string; seconds?: number | string }[]</code></li><li>If you use month picker, it will be <code>{ month: number | string; year: number | string }[]</code></li></ul></li></ul></li><li>Default: <code>null</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details>`,1),Tn={id:"modelvalue",tabindex:"-1"},Cn=t("a",{class:"header-anchor",href:"#modelvalue","aria-hidden":"true"},"#",-1),En=o(" modelValue "),jn=s(`<p>v-model binding</p><ul><li>Type: <ul><li>Single picker: <code>Date | string</code><ul><li>In case of <code>multiDates</code> it will be <code>Date[] | string[]</code></li></ul></li><li>Month picker: <code>{ month: number | string; year: number | string }</code></li><li>Time picker: <code>{ hours: number | string; minutes: number | string; seconds?: number | string }</code></li><li>Week picker: <code>[Date, Date] | [string, string]</code></li><li>Range picker: <code>[Date, Date] | [string | string]</code><ul><li>If you use time picker, it will be <code>{ hours: number | string; minutes: number | string; seconds?: number | string }[]</code></li><li>If you use month picker, it will be <code>{ month: number | string; year: number | string }[]</code></li></ul></li></ul></li><li>Default: <code>null</code></li></ul><details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>manual<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:modelValue</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name"><span class="token namespace">@update:</span>modelValue</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>setDate<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>auto<span class="token punctuation">&quot;</span></span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
@@ -671,7 +724,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="clearable" tabindex="-1"><a class="header-anchor" href="#clearable" aria-hidden="true">#</a> clearable</h3><p>Add a clear icon to the input field where you can set the value to null</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),jn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="clearable" tabindex="-1"><a class="header-anchor" href="#clearable" aria-hidden="true">#</a> clearable</h3><p>Add a clear icon to the input field where you can set the value to null</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),Sn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:clearable</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -688,7 +741,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonscroll" tabindex="-1"><a class="header-anchor" href="#closeonscroll" aria-hidden="true">#</a> closeOnScroll</h3><p>Close datepicker menu on page scroll</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Sn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonscroll" tabindex="-1"><a class="header-anchor" href="#closeonscroll" aria-hidden="true">#</a> closeOnScroll</h3><p>Close datepicker menu on page scroll</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),In=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">closeOnScroll</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -705,7 +758,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoapply" tabindex="-1"><a class="header-anchor" href="#autoapply" aria-hidden="true">#</a> autoApply</h3><p>If set to <code>true</code>, clicking on a date value will automatically select the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),In=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoapply" tabindex="-1"><a class="header-anchor" href="#autoapply" aria-hidden="true">#</a> autoApply</h3><p>If set to <code>true</code>, clicking on a date value will automatically select the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Mn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -722,7 +775,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="placeholder" tabindex="-1"><a class="header-anchor" href="#placeholder" aria-hidden="true">#</a> placeholder</h3><p>Input placeholder</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Mn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="placeholder" tabindex="-1"><a class="header-anchor" href="#placeholder" aria-hidden="true">#</a> placeholder</h3><p>Input placeholder</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),On=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -739,7 +792,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="notoday" tabindex="-1"><a class="header-anchor" href="#notoday" aria-hidden="true">#</a> noToday</h3><p>Hide today mark from the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),On=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="notoday" tabindex="-1"><a class="header-anchor" href="#notoday" aria-hidden="true">#</a> noToday</h3><p>Hide today mark from the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),An=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noToday</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -756,7 +809,7 @@ import{r as e,o as w,c as q,b as t,a as n,F as x,B as o,Q as s}from"./app.519dac
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonautoapply" tabindex="-1"><a class="header-anchor" href="#closeonautoapply" aria-hidden="true">#</a> closeOnAutoApply</h3><p>If set to <code>false</code>, clicking on a date value will automatically select the value but will not close the datepicker menu. Closing will be available on a click-away or clicking on the input again</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),An=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="closeonautoapply" tabindex="-1"><a class="header-anchor" href="#closeonautoapply" aria-hidden="true">#</a> closeOnAutoApply</h3><p>If set to <code>false</code>, clicking on a date value will automatically select the value but will not close the datepicker menu. Closing will be available on a click-away or clicking on the input again</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),Nn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token attr-name">:closeOnAutoApply</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -779,7 +832,7 @@ type<span class="token operator">?</span><span class="token operator">:</span> <
 tooltip<span class="token operator">?</span><span class="token operator">:</span> <span class="token punctuation">{</span> text<span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span> color<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span> <span class="token punctuation">}</span><span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">;</span>
 color<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
 <span class="token punctuation">}</span><span class="token punctuation">[</span><span class="token punctuation">]</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><ul><li>Default: <code>[]</code></li></ul>`,6),Nn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><ul><li>Default: <code>[]</code></li></ul>`,6),Pn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:markers</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>markers<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -835,7 +888,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="disabled" tabindex="-1"><a class="header-anchor" href="#disabled" aria-hidden="true">#</a> disabled</h3><p>Disables the input</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Pn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="disabled" tabindex="-1"><a class="header-anchor" href="#disabled" aria-hidden="true">#</a> disabled</h3><p>Disables the input</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Rn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">disabled</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -852,7 +905,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="readonly" tabindex="-1"><a class="header-anchor" href="#readonly" aria-hidden="true">#</a> readonly</h3><p>Sets the input in readonly state</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Rn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="readonly" tabindex="-1"><a class="header-anchor" href="#readonly" aria-hidden="true">#</a> readonly</h3><p>Sets the input in readonly state</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Hn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">readonly</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -869,7 +922,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="required" tabindex="-1"><a class="header-anchor" href="#required" aria-hidden="true">#</a> required</h3><p>Add <code>required</code> flag to the input field. Use with form tag for built-in validation</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Hn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="required" tabindex="-1"><a class="header-anchor" href="#required" aria-hidden="true">#</a> required</h3><p>Add <code>required</code> flag to the input field. Use with form tag for built-in validation</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Ln=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>form</span> <span class="token attr-name">@submit.prevent</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>submitForm<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">required</span> <span class="token punctuation">/&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>button</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>submit<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>Submit form<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>button</span><span class="token punctuation">&gt;</span></span>
@@ -928,7 +981,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="keepactionrow" tabindex="-1"><a class="header-anchor" href="#keepactionrow" aria-hidden="true">#</a> keepActionRow</h3><p>When enabled, it will keep the action row even if the <code>autoApply</code> prop is enabled</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Ln=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="keepactionrow" tabindex="-1"><a class="header-anchor" href="#keepactionrow" aria-hidden="true">#</a> keepActionRow</h3><p>When enabled, it will keep the action row even if the <code>autoApply</code> prop is enabled</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Bn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">autoApply</span> <span class="token attr-name">keepActionRow</span> <span class="token attr-name">:closeOnAutoApply</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -945,7 +998,24 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="calendar-configuration" tabindex="-1"><a class="header-anchor" href="#calendar-configuration" aria-hidden="true">#</a> Calendar configuration</h2><p>Configure calendar options such as behavior or available dates</p><h3 id="weeknumbers" tabindex="-1"><a class="header-anchor" href="#weeknumbers" aria-hidden="true">#</a> weekNumbers</h3><p>Display week numbers in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),Bn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="noswipe" tabindex="-1"><a class="header-anchor" href="#noswipe" aria-hidden="true">#</a> noSwipe</h3><p>Disable touch events on the calendar</p><ul><li>Type: <code>Boolean</code></li><li>Default: <code>false</code></li></ul>`,4),zn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noSwipe</span> <span class="token punctuation">/&gt;</span></span>
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
+
+<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
+<span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
+
+<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
+    <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+        <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Date</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        
+        <span class="token keyword">return</span> <span class="token punctuation">{</span>
+            date<span class="token punctuation">,</span>
+        <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="calendar-configuration" tabindex="-1"><a class="header-anchor" href="#calendar-configuration" aria-hidden="true">#</a> Calendar configuration</h2><p>Configure calendar options such as behavior or available dates</p><h3 id="weeknumbers" tabindex="-1"><a class="header-anchor" href="#weeknumbers" aria-hidden="true">#</a> weekNumbers</h3><p>Display week numbers in the calendar</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,6),Vn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekNumbers</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -979,7 +1049,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mindate" tabindex="-1"><a class="header-anchor" href="#mindate" aria-hidden="true">#</a> minDate</h3><p>All dates before the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),Vn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mindate" tabindex="-1"><a class="header-anchor" href="#mindate" aria-hidden="true">#</a> minDate</h3><p>All dates before the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),$n=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>new Date()<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -996,7 +1066,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxdate" tabindex="-1"><a class="header-anchor" href="#maxdate" aria-hidden="true">#</a> maxDate</h3><p>All dates after the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),zn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxdate" tabindex="-1"><a class="header-anchor" href="#maxdate" aria-hidden="true">#</a> maxDate</h3><p>All dates after the given date will be disabled</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),Un=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>new Date()<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1013,7 +1083,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="preventminmaxnavigation" tabindex="-1"><a class="header-anchor" href="#preventminmaxnavigation" aria-hidden="true">#</a> preventMinMaxNavigation</h3><p>Prevent navigation after or before the <code>minDate</code> or <code>mixDate</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),$n=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="preventminmaxnavigation" tabindex="-1"><a class="header-anchor" href="#preventminmaxnavigation" aria-hidden="true">#</a> preventMinMaxNavigation</h3><p>Prevent navigation after or before the <code>minDate</code> or <code>mixDate</code></p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Jn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>minDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>maxDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">preventMinMaxNavigation</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1036,7 +1106,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="startdate" tabindex="-1"><a class="header-anchor" href="#startdate" aria-hidden="true">#</a> startDate</h3><p>Open the datepicker to some preselected month and year</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),Un=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="startdate" tabindex="-1"><a class="header-anchor" href="#startdate" aria-hidden="true">#</a> startDate</h3><p>Open the datepicker to some preselected month and year</p><ul><li>Type: <code>Date | string</code></li><li>Default: <code>null</code></li></ul>`,4),Kn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:startDate</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>startDate<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1055,7 +1125,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="weekstart" tabindex="-1"><a class="header-anchor" href="#weekstart" aria-hidden="true">#</a> weekStart</h3><p>Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),Jn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h3 id="weekstart" tabindex="-1"><a class="header-anchor" href="#weekstart" aria-hidden="true">#</a> weekStart</h3><p>Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),Qn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">weekStart</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>0<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1081,7 +1151,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     seconds<span class="token operator">?</span><span class="token operator">:</span> <span class="token builtin">number</span><span class="token punctuation">[</span><span class="token punctuation">]</span> <span class="token comment">// disable specific seconds</span>
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><ul><li>Default: <code>null</code></li></ul>`,6),Kn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><ul><li>Default: <code>null</code></li></ul>`,6),Xn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:filters</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>filters<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1109,7 +1179,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="disablemonthyearselect" tabindex="-1"><a class="header-anchor" href="#disablemonthyearselect" aria-hidden="true">#</a> disableMonthYearSelect</h3><p>Removes the month and year picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Qn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="disablemonthyearselect" tabindex="-1"><a class="header-anchor" href="#disablemonthyearselect" aria-hidden="true">#</a> disableMonthYearSelect</h3><p>Removes the month and year picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Zn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">disableMonthYearSelect</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1126,7 +1196,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="yearrange" tabindex="-1"><a class="header-anchor" href="#yearrange" aria-hidden="true">#</a> yearRange</h3><p>Specify start and end year for years to generate</p><ul><li>Type: <code>[number, number]</code></li><li>Default: <code>[1900, 2100]</code></li></ul>`,4),Xn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="yearrange" tabindex="-1"><a class="header-anchor" href="#yearrange" aria-hidden="true">#</a> yearRange</h3><p>Specify start and end year for years to generate</p><ul><li>Type: <code>[number, number]</code></li><li>Default: <code>[1900, 2100]</code></li></ul>`,4),ns=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:yearRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[2020, 2040]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1143,7 +1213,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="reverseyears" tabindex="-1"><a class="header-anchor" href="#reverseyears" aria-hidden="true">#</a> reverseYears</h3><p>Reverse the order of the years in years overlay</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Zn=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="reverseyears" tabindex="-1"><a class="header-anchor" href="#reverseyears" aria-hidden="true">#</a> reverseYears</h3><p>Reverse the order of the years in years overlay</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),ss=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">reverseYears</span> <span class="token attr-name">:yearRange</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[2020, 2040]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1160,7 +1230,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="alloweddates" tabindex="-1"><a class="header-anchor" href="#alloweddates" aria-hidden="true">#</a> allowedDates</h3><p>Allow only specific dates</p><ul><li>Type: <code>string[] | Date[]</code></li><li>Default: <code>[]</code></li></ul>`,4),ns=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="alloweddates" tabindex="-1"><a class="header-anchor" href="#alloweddates" aria-hidden="true">#</a> allowedDates</h3><p>Allow only specific dates</p><ul><li>Type: <code>string[] | Date[]</code></li><li>Default: <code>[]</code></li></ul>`,4),as=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:allowedDates</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>allowedDates<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1186,7 +1256,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details><h3 id="disableddates" tabindex="-1"><a class="header-anchor" href="#disableddates" aria-hidden="true">#</a> disabledDates</h3><p>Disable specific dates</p><ul><li>Type: <code>Date[] | string[] | (date: Date) =&gt; boolean</code></li><li>Default: <code>[]</code></li></ul><p><strong>Note:</strong> If you use a custom function, make sure to return <code>true</code> for a disabled date and <code>false</code> for enabled</p>`,5),ss=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br></div></div></details><h3 id="disableddates" tabindex="-1"><a class="header-anchor" href="#disableddates" aria-hidden="true">#</a> disabledDates</h3><p>Disable specific dates</p><ul><li>Type: <code>Date[] | string[] | (date: Date) =&gt; boolean</code></li><li>Default: <code>[]</code></li></ul><p><strong>Note:</strong> If you use a custom function, make sure to return <code>true</code> for a disabled date and <code>false</code> for enabled</p>`,5),ts=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:disabledDates</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>disabledDates<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1217,7 +1287,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="disabledweekdays" tabindex="-1"><a class="header-anchor" href="#disabledweekdays" aria-hidden="true">#</a> disabledWeekDays</h3><p>Disable specific days from the week</p><ul><li>Type: <code>string[] | number[]</code> - 0-6, 0 is Sunday, 6 is Saturday</li><li>Default: <code>[]</code></li></ul>`,4),as=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></details><h3 id="disabledweekdays" tabindex="-1"><a class="header-anchor" href="#disabledweekdays" aria-hidden="true">#</a> disabledWeekDays</h3><p>Disable specific days from the week</p><ul><li>Type: <code>string[] | number[]</code> - 0-6, 0 is Sunday, 6 is Saturday</li><li>Default: <code>[]</code></li></ul>`,4),ps=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:disabledWeekDays</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>[6, 0]<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1234,7 +1304,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="time-picker-configuration" tabindex="-1"><a class="header-anchor" href="#time-picker-configuration" aria-hidden="true">#</a> Time picker configuration</h2><p>Props to configure time picker, whether using it only as time picker or alongside the datepicker</p><h3 id="enabletimepicker" tabindex="-1"><a class="header-anchor" href="#enabletimepicker" aria-hidden="true">#</a> enableTimePicker</h3><p>Enable or disable time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),ts=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="time-picker-configuration" tabindex="-1"><a class="header-anchor" href="#time-picker-configuration" aria-hidden="true">#</a> Time picker configuration</h2><p>Props to configure time picker, whether using it only as time picker or alongside the datepicker</p><h3 id="enabletimepicker" tabindex="-1"><a class="header-anchor" href="#enabletimepicker" aria-hidden="true">#</a> enableTimePicker</h3><p>Enable or disable time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,6),es=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:enableTimePicker</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1251,7 +1321,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="is24" tabindex="-1"><a class="header-anchor" href="#is24" aria-hidden="true">#</a> is24</h3><p>Whether to use 24H or 12H mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),ps=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="is24" tabindex="-1"><a class="header-anchor" href="#is24" aria-hidden="true">#</a> is24</h3><p>Whether to use 24H or 12H mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),os=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:is24</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1268,7 +1338,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="enableseconds" tabindex="-1"><a class="header-anchor" href="#enableseconds" aria-hidden="true">#</a> enableSeconds</h3><p>Enable seconds in the time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),es=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="enableseconds" tabindex="-1"><a class="header-anchor" href="#enableseconds" aria-hidden="true">#</a> enableSeconds</h3><p>Enable seconds in the time picker</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),cs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1285,7 +1355,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursincrement" tabindex="-1"><a class="header-anchor" href="#hoursincrement" aria-hidden="true">#</a> hoursIncrement</h3><p>The value which is used to increment hours via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),os=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursincrement" tabindex="-1"><a class="header-anchor" href="#hoursincrement" aria-hidden="true">#</a> hoursIncrement</h3><p>The value which is used to increment hours via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),ls=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hoursIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1302,7 +1372,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesincrement" tabindex="-1"><a class="header-anchor" href="#minutesincrement" aria-hidden="true">#</a> minutesIncrement</h3><p>The value which is used to increment minutes via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),cs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesincrement" tabindex="-1"><a class="header-anchor" href="#minutesincrement" aria-hidden="true">#</a> minutesIncrement</h3><p>The value which is used to increment minutes via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),us=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">minutesIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1319,7 +1389,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsincrement" tabindex="-1"><a class="header-anchor" href="#secondsincrement" aria-hidden="true">#</a> secondsIncrement</h3><p>The value which is used to increment seconds via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),ls=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsincrement" tabindex="-1"><a class="header-anchor" href="#secondsincrement" aria-hidden="true">#</a> secondsIncrement</h3><p>The value which is used to increment seconds via arrows in the time picker</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,4),is=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token attr-name">secondsIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1336,7 +1406,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursgridincrement" tabindex="-1"><a class="header-anchor" href="#hoursgridincrement" aria-hidden="true">#</a> hoursGridIncrement</h3><p>The value which is used to increment hours when showing hours overlay</p><p>It will always start from 0 until it reaches 24 or 12 depending on the <code>is24</code> prop</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,5),us=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hoursgridincrement" tabindex="-1"><a class="header-anchor" href="#hoursgridincrement" aria-hidden="true">#</a> hoursGridIncrement</h3><p>The value which is used to increment hours when showing hours overlay</p><p>It will always start from 0 until it reaches 24 or 12 depending on the <code>is24</code> prop</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>1</code></li></ul>`,5),rs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hoursGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1353,7 +1423,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesgridincrement" tabindex="-1"><a class="header-anchor" href="#minutesgridincrement" aria-hidden="true">#</a> minutesGridIncrement</h3><p>The value which is used to increment minutes when showing minutes overlay</p><p>It will always start from 0 to 60 minutes</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul>`,5),is=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="minutesgridincrement" tabindex="-1"><a class="header-anchor" href="#minutesgridincrement" aria-hidden="true">#</a> minutesGridIncrement</h3><p>The value which is used to increment minutes when showing minutes overlay</p><p>It will always start from 0 to 60 minutes</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul>`,5),ks=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">minutesGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1370,7 +1440,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsgridincrement" tabindex="-1"><a class="header-anchor" href="#secondsgridincrement" aria-hidden="true">#</a> secondsGridIncrement</h3><p>The value which is used to increment seconds when showing seconds overlay</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul>`,4),rs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="secondsgridincrement" tabindex="-1"><a class="header-anchor" href="#secondsgridincrement" aria-hidden="true">#</a> secondsGridIncrement</h3><p>The value which is used to increment seconds when showing seconds overlay</p><ul><li>Type: <code>number | string</code></li><li>Default: <code>5</code></li></ul>`,4),ds=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">enableSeconds</span> <span class="token attr-name">secondsGridIncrement</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1387,7 +1457,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nohoursoverlay" tabindex="-1"><a class="header-anchor" href="#nohoursoverlay" aria-hidden="true">#</a> noHoursOverlay</h3><p>Disable overlay for the hours, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),ks=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nohoursoverlay" tabindex="-1"><a class="header-anchor" href="#nohoursoverlay" aria-hidden="true">#</a> noHoursOverlay</h3><p>Disable overlay for the hours, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),bs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noHoursOverlay</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1404,7 +1474,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nominutesoverlay" tabindex="-1"><a class="header-anchor" href="#nominutesoverlay" aria-hidden="true">#</a> noMinutesOverlay</h3><p>Disable overlay for the minutes, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),ds=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nominutesoverlay" tabindex="-1"><a class="header-anchor" href="#nominutesoverlay" aria-hidden="true">#</a> noMinutesOverlay</h3><p>Disable overlay for the minutes, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),ms=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noMinutesOverlay</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1421,7 +1491,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nosecondsoverlay" tabindex="-1"><a class="header-anchor" href="#nosecondsoverlay" aria-hidden="true">#</a> noSecondsOverlay</h3><p>Disable overlay for the seconds, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),ms=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="nosecondsoverlay" tabindex="-1"><a class="header-anchor" href="#nosecondsoverlay" aria-hidden="true">#</a> noSecondsOverlay</h3><p>Disable overlay for the seconds, only arrow selection will be available</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),gs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">noSecondsOverlay</span> <span class="token attr-name">enableSeconds</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1438,7 +1508,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mintime" tabindex="-1"><a class="header-anchor" href="#mintime" aria-hidden="true">#</a> minTime</h3><p>Sets the minimal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul>`,4),bs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="mintime" tabindex="-1"><a class="header-anchor" href="#mintime" aria-hidden="true">#</a> minTime</h3><p>Sets the minimal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul>`,4),hs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:minTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ hours: 11, minutes: 30 }<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1455,7 +1525,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxtime" tabindex="-1"><a class="header-anchor" href="#maxtime" aria-hidden="true">#</a> maxTime</h3><p>Sets the maximal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul>`,4),gs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="maxtime" tabindex="-1"><a class="header-anchor" href="#maxtime" aria-hidden="true">#</a> maxTime</h3><p>Sets the maximal available time to pick</p><ul><li>Type: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Default: <code>null</code></li></ul>`,4),vs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:maxTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>{ hours: 11, minutes: 30 }<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1472,7 +1542,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="starttime" tabindex="-1"><a class="header-anchor" href="#starttime" aria-hidden="true">#</a> startTime</h3><p>Set some default starting time</p><ul><li>Type: <ul><li>Single picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Range picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }[]</code></li></ul></li><li>Default: <code>null</code></li></ul>`,4),hs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="starttime" tabindex="-1"><a class="header-anchor" href="#starttime" aria-hidden="true">#</a> startTime</h3><p>Set some default starting time</p><ul><li>Type: <ul><li>Single picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }</code></li><li>Range picker: <code>{ hours?: number | string; minutes?: number | string; seconds?: number | string }[]</code></li></ul></li><li>Default: <code>null</code></li></ul>`,4),ys=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:startTime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>startTime<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>Select Date<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1491,7 +1561,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="positioning" tabindex="-1"><a class="header-anchor" href="#positioning" aria-hidden="true">#</a> Positioning</h2><p>Configure datepicker menu positioning</p><h3 id="position" tabindex="-1"><a class="header-anchor" href="#position" aria-hidden="true">#</a> position</h3><p>Datepicker menu position</p><ul><li>Type: <code>&#39;left&#39; | &#39;center&#39; | &#39;right&#39;</code></li><li>Default: <code>&#39;center&#39;</code></li></ul>`,6),vs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></details><h2 id="positioning" tabindex="-1"><a class="header-anchor" href="#positioning" aria-hidden="true">#</a> Positioning</h2><p>Configure datepicker menu positioning</p><h3 id="position" tabindex="-1"><a class="header-anchor" href="#position" aria-hidden="true">#</a> position</h3><p>Datepicker menu position</p><ul><li>Type: <code>&#39;left&#39; | &#39;center&#39; | &#39;right&#39;</code></li><li>Default: <code>&#39;center&#39;</code></li></ul>`,6),fs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">position</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>left<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1508,7 +1578,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoposition" tabindex="-1"><a class="header-anchor" href="#autoposition" aria-hidden="true">#</a> autoPosition</h3><p>When enabled, based on viewport space available it will automatically position the menu above or bellow input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),ys=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="autoposition" tabindex="-1"><a class="header-anchor" href="#autoposition" aria-hidden="true">#</a> autoPosition</h3><p>When enabled, based on viewport space available it will automatically position the menu above or bellow input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),ws=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:autoPosition</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1525,7 +1595,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="altposition" tabindex="-1"><a class="header-anchor" href="#altposition" aria-hidden="true">#</a> altPosition</h3><p>If you have issues with the menu being miss-placed, you can enable this prop to use an alternative positioning method. By default, if passed <code>true</code>, datepicker will use an alternative function to recalculate position, but you can also pass a custom function that can position the menu to your liking.</p><ul><li>Type: <code>boolean | ((el: HTMLElement | undefined) =&gt; { top: string; left: string; transform: string })</code></li><li>Default: <code>false</code></li></ul>`,4),fs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="altposition" tabindex="-1"><a class="header-anchor" href="#altposition" aria-hidden="true">#</a> altPosition</h3><p>If you have issues with the menu being miss-placed, you can enable this prop to use an alternative positioning method. By default, if passed <code>true</code>, datepicker will use an alternative function to recalculate position, but you can also pass a custom function that can position the menu to your liking.</p><ul><li>Type: <code>boolean | ((el: HTMLElement | undefined) =&gt; { top: string; left: string; transform: string })</code></li><li>Default: <code>false</code></li></ul>`,4),qs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">altPosition</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1542,7 +1612,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="teleport" tabindex="-1"><a class="header-anchor" href="#teleport" aria-hidden="true">#</a> teleport</h3><p>Set teleport target</p><ul><li>Type: <code>string</code></li><li>Default: <code>&#39;body&#39;</code></li></ul><p>You can inspect the page and check the menu placement</p>`,5),ws=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="teleport" tabindex="-1"><a class="header-anchor" href="#teleport" aria-hidden="true">#</a> teleport</h3><p>Set teleport target</p><ul><li>Type: <code>string | HTMLElement</code></li><li>Default: <code>&#39;body&#39;</code></li></ul><p>You can inspect the page and check the menu placement</p>`,5),xs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">teleport</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>#app<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1559,7 +1629,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="keyboard" tabindex="-1"><a class="header-anchor" href="#keyboard" aria-hidden="true">#</a> Keyboard</h2><p>Configure keyboard actions</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>You can press <code>tab</code> key in the menu, and it will autofocus elements, pressing <code>enter</code> will do a <code>click</code> action like open overlay or select a date.</p><p>All keyboard events are enabled by default</p></div><h3 id="openmenuonfocus" tabindex="-1"><a class="header-anchor" href="#openmenuonfocus" aria-hidden="true">#</a> openMenuOnFocus</h3><p>Pressing <code>tab</code> in the form, datepicker menu will open</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,7),qs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="keyboard" tabindex="-1"><a class="header-anchor" href="#keyboard" aria-hidden="true">#</a> Keyboard</h2><p>Configure keyboard actions</p><div class="custom-container tip"><p class="custom-container-title">Info</p><p>You can press <code>tab</code> key in the menu, and it will autofocus elements, pressing <code>enter</code> will do a <code>click</code> action like open overlay or select a date.</p><p>All keyboard events are enabled by default</p></div><h3 id="openmenuonfocus" tabindex="-1"><a class="header-anchor" href="#openmenuonfocus" aria-hidden="true">#</a> openMenuOnFocus</h3><p>Pressing <code>tab</code> in the form, datepicker menu will open</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,7),Ds=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:openMenuOnFocus</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1576,7 +1646,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="escclose" tabindex="-1"><a class="header-anchor" href="#escclose" aria-hidden="true">#</a> escClose</h3><p><code>Esc</code> key closes the menu</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),xs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="escclose" tabindex="-1"><a class="header-anchor" href="#escclose" aria-hidden="true">#</a> escClose</h3><p><code>Esc</code> key closes the menu</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),_s=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:escClose</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1593,7 +1663,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="spaceconfirm" tabindex="-1"><a class="header-anchor" href="#spaceconfirm" aria-hidden="true">#</a> spaceConfirm</h3><p><code>space</code> key selects the date (like you pressed the select button)</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),Ds=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="spaceconfirm" tabindex="-1"><a class="header-anchor" href="#spaceconfirm" aria-hidden="true">#</a> spaceConfirm</h3><p><code>space</code> key selects the date (like you pressed the select button)</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),Ts=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:spaceConfirm</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1610,7 +1680,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonarrows" tabindex="-1"><a class="header-anchor" href="#monthchangeonarrows" aria-hidden="true">#</a> monthChangeOnArrows</h3><p>Change months via arrow keys</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),_s=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="monthchangeonarrows" tabindex="-1"><a class="header-anchor" href="#monthchangeonarrows" aria-hidden="true">#</a> monthChangeOnArrows</h3><p>Change months via arrow keys</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>true</code></li></ul>`,4),Cs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:monthChangeOnArrows</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1627,7 +1697,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="look-and-feel" tabindex="-1"><a class="header-anchor" href="#look-and-feel" aria-hidden="true">#</a> Look and feel</h2><p>Customization options</p><h3 id="transitions" tabindex="-1"><a class="header-anchor" href="#transitions" aria-hidden="true">#</a> transitions</h3>`,4),Ts=o("Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in "),Cs={href:"https://v3.vuejs.org/guide/transitions-overview.html",target:"_blank",rel:"noopener noreferrer"},Es=o("transitions"),js=o(" component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop"),Ss=s("<ul><li>Type: <code>boolean | {open?: string; close?: string; next?: string; previous?: string}</code></li><li>Default: <code>true</code></li></ul><p><code>open</code> and <code>close</code> are added on overlays show/hide</p><p><code>next</code> and <code>previous</code> are added when switching months in the calendar</p>",3),Is=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h2 id="look-and-feel" tabindex="-1"><a class="header-anchor" href="#look-and-feel" aria-hidden="true">#</a> Look and feel</h2><p>Customization options</p><h3 id="transitions" tabindex="-1"><a class="header-anchor" href="#transitions" aria-hidden="true">#</a> transitions</h3>`,4),Es=o("Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in "),js={href:"https://v3.vuejs.org/guide/transitions-overview.html",target:"_blank",rel:"noopener noreferrer"},Ss=o("transitions"),Is=o(" component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop"),Ms=s("<ul><li>Type: <code>boolean | {open?: string; close?: string; next?: string; previous?: string; menuAppear?: string; vNext?: string; vPrevious?: string; }</code></li><li>Default: <code>true</code></li></ul><p><code>menuAppear</code> is added on menu open</p><p><code>open</code> and <code>close</code> are added on overlays show/hide</p><p><code>next</code> and <code>previous</code> are added when switching months in the calendar</p><p><code>vNext</code> and <code>vPrevious</code> are added when switching months in the calendar in the <code>vertical</code> mode</p>",5),Os=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:transitions</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1644,7 +1714,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="dark" tabindex="-1"><a class="header-anchor" href="#dark" aria-hidden="true">#</a> dark</h3><p>Theme switch between the dark and light mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Ms=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="dark" tabindex="-1"><a class="header-anchor" href="#dark" aria-hidden="true">#</a> dark</h3><p>Theme switch between the dark and light mode</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),As=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">dark</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1661,7 +1731,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideinputicon" tabindex="-1"><a class="header-anchor" href="#hideinputicon" aria-hidden="true">#</a> hideInputIcon</h3><p>Hide calendar icon in the input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Os=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="hideinputicon" tabindex="-1"><a class="header-anchor" href="#hideinputicon" aria-hidden="true">#</a> hideInputIcon</h3><p>Hide calendar icon in the input field</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>false</code></li></ul>`,4),Ns=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">hideInputIcon</span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1678,7 +1748,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="state" tabindex="-1"><a class="header-anchor" href="#state" aria-hidden="true">#</a> state</h3><p>Validation state of the calendar value. Sets the green/red border depending on the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>null</code></li></ul>`,4),As=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="state" tabindex="-1"><a class="header-anchor" href="#state" aria-hidden="true">#</a> state</h3><p>Validation state of the calendar value. Sets the green/red border depending on the value</p><ul><li>Type: <code>boolean</code></li><li>Default: <code>null</code></li></ul>`,4),Ps=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:state</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>false<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1695,7 +1765,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
     <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inputclassname" tabindex="-1"><a class="header-anchor" href="#inputclassname" aria-hidden="true">#</a> inputClassName</h3><p>Add a custom class to the input field</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Ns=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br></div></div></details><h3 id="inputclassname" tabindex="-1"><a class="header-anchor" href="#inputclassname" aria-hidden="true">#</a> inputClassName</h3><p>Add a custom class to the input field</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Fs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">inputClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-input<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1723,7 +1793,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="menuclassname" tabindex="-1"><a class="header-anchor" href="#menuclassname" aria-hidden="true">#</a> menuClassName</h3><p>Add a custom class to the datepicker menu wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Fs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br></div></div></details><h3 id="menuclassname" tabindex="-1"><a class="header-anchor" href="#menuclassname" aria-hidden="true">#</a> menuClassName</h3><p>Add a custom class to the datepicker menu wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Rs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">menuClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-menu<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1746,7 +1816,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
   <span class="token property">box-shadow</span><span class="token punctuation">:</span> 0 0 6px #1976d2<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="calendarclassname" tabindex="-1"><a class="header-anchor" href="#calendarclassname" aria-hidden="true">#</a> calendarClassName</h3><p>Add a custom class to the calendar wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Ps=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details><h3 id="calendarclassname" tabindex="-1"><a class="header-anchor" href="#calendarclassname" aria-hidden="true">#</a> calendarClassName</h3><p>Add a custom class to the calendar wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Hs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">calendarClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-calendar<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1771,7 +1841,7 @@ color<span class="token operator">?</span><span class="token operator">:</span>
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="calendarcellclassname" tabindex="-1"><a class="header-anchor" href="#calendarcellclassname" aria-hidden="true">#</a> calendarCellClassName</h3><p>Add a custom class to the calendar cell wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Rs=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br></div></div></details><h3 id="calendarcellclassname" tabindex="-1"><a class="header-anchor" href="#calendarcellclassname" aria-hidden="true">#</a> calendarCellClassName</h3><p>Add a custom class to the calendar cell wrapper</p><ul><li>Type: <code>string</code></li><li>Default: <code>null</code></li></ul>`,4),Ls=s(`<details class="custom-container details"><summary>Code Example</summary><div class="language-vue ext-vue line-numbers-mode"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>Datepicker</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>date<span class="token punctuation">&quot;</span></span> <span class="token attr-name">calendarCellClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>dp-custom-cell<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
 
@@ -1794,4 +1864,4 @@ color<span class="token operator">?</span><span class="token operator">:</span>
   <span class="token property">border-radius</span><span class="token punctuation">:</span> 50%<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span>
-</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details>`,1);function Hs(Ws,Ys){const c=e("ExternalLinkIcon"),a=e("Demo"),l=e("TextInputDemo"),p=e("EmptyDemo"),u=e("TimezoneDemo"),i=e("PresetRange"),r=e("FormatDemo"),k=e("PreviewFormatDemo"),d=e("LocalizedOutput"),m=e("Badge"),b=e("DemoMarkers"),g=e("RequiredDemo"),h=e("MinMaxDemo"),v=e("FiltersDemo"),y=e("DisabledDatesDemo"),f=e("DarkDemo");return w(),q(x,null,[T,t("div",C,[t("div",E,[j,t("p",null,[t("strong",null,[S,t("a",I,[M,n(c)]),O,t("a",A,[N,n(c)]),F])])])]),P,n(a,{range:!0}),R,n(a,{range:"",autoRange:5,placeholder:"Select Date"}),H,n(a,{range:!0,multiCalendars:!0}),W,n(a,{monthPicker:!0}),Y,n(a,{timePicker:!0}),L,n(l,{textInput:!0}),B,n(a,{inline:!0,autoApply:!0}),G,n(p,{multiDates:!0,placeholder:"Select Multiple Dates"}),V,n(p,{flow:["month","year","calendar"],placeholder:"Month > Year > Date"}),z,n(u),$,n(p,{weekPicker:!0,placeholder:"Select week"}),U,n(a,{range:!0,partialRange:!1,placeholder:"Select Date"}),J,n(i),K,n(p,{range:!0,minRange:3,placeholder:"At least 3 days in between"}),Q,n(p,{range:!0,maxRange:7,placeholder:"Can't have more than 7 days in between"}),X,n(a,{range:!0,fixedStart:!0,clearable:!1}),Z,n(a,{range:!0,fixedEnd:!0,clearable:!1}),nn,n(a,{range:!0,multiCalendars:!0,multiCalendarsSolo:!0}),sn,n(l,{textInput:!0,textInputOptions:{format:"MM.dd.yyyy"}},null,8,["textInputOptions"]),an,n(a,{timePicker:!0,modeHeight:120}),tn,n(a,{inline:!0,inlineWithInput:!0,autoApply:!0}),pn,n(p,{multiDates:!0,placeholder:"Select Multiple Dates",multiDatesLimit:3}),en,t("p",null,[on,t("a",cn,[ln,n(c)])]),n(r),un,n(k),rn,n(a,{monthNameFormat:"long"}),kn,n(a,{locale:"de",cancelText:"abbrechen",selectText:"ausw\xE4hlen"}),dn,t("p",null,[mn,t("a",bn,[gn,n(c)])]),hn,n(d),vn,n(a,{selectText:"Pick"}),yn,n(a,{cancelText:"Close"}),fn,n(p,{showNowButton:!0,placeholder:"Select Date",nowButtonLabel:"Current"}),wn,n(a,{weekNumbers:"",weekNumName:"We"}),qn,n(a,{uid:"demo"}),xn,n(a,{monthChangeOnScroll:!1}),Dn,t("h3",_n,[Tn,Cn,n(m,{type:"tip",text:"v-model",vertical:"top"})]),En,n(a,{clearable:!1}),jn,n(a,{closeOnScroll:!0}),Sn,n(a,{autoApply:!0}),In,n(p,{placeholder:"Select Date"}),Mn,n(p,{noToday:!0,placeholder:"Select Date"}),On,n(a,{autoApply:!0,closeOnAutoApply:!1}),An,n(b),Nn,n(p,{showNowButton:!0,placeholder:"Select Date"}),Fn,n(a,{disabled:!0}),Pn,n(a,{readonly:!0}),Rn,n(g,{required:!0}),Hn,n(a,{name:"date-picker"}),Wn,n(a,{autocomplete:"off"}),Yn,n(a,{keepActionRow:!0,autoApply:!0,closeOnAutoApply:!1}),Ln,n(a,{weekNumbers:!0}),Bn,n(a,{hideOffsetDates:!0}),Gn,n(a,{minDate:new Date},null,8,["minDate"]),Vn,n(a,{maxDate:new Date},null,8,["maxDate"]),zn,n(h),$n,n(p,{startDate:new Date(2020,1),placeholder:"Select Date"},null,8,["startDate"]),Un,n(a,{weekStart:"0"}),Jn,n(v),Kn,n(a,{disableMonthYearSelect:!0}),Qn,n(a,{yearRange:[2020,2040]}),Xn,n(a,{reverseYears:!0,yearRange:[2020,2040]}),Zn,n(p,{allowedDates:[new Date],placeholder:"Select Date"},null,8,["allowedDates"]),ns,n(y),ss,n(p,{disabledWeekDays:[6,0],placeholder:"Select Date"}),as,n(a,{enableTimePicker:!1}),ts,n(a,{is24:!1}),ps,n(a,{enableSeconds:!0}),es,n(a,{hoursIncrement:"2"}),os,n(a,{minutesIncrement:"5"}),cs,n(a,{secondsIncrement:"5",enableSeconds:!0}),ls,n(a,{hoursGridIncrement:"2"}),us,n(a,{minutesGridIncrement:"2"}),is,n(a,{secondsGridIncrement:"2",enableSeconds:!0}),rs,n(a,{noHoursOverlay:!0}),ks,n(a,{noMinutesOverlay:!0}),ds,n(a,{noSecondsOverlay:!0,enableSeconds:!0}),ms,n(p,{minTime:{hours:11,minutes:30},placeholder:"Select Date"}),bs,n(p,{maxTime:{hours:11,minutes:30},placeholder:"Select Date"}),gs,n(p,{startTime:{hours:0,minutes:0},placeholder:"Select Date"}),hs,n(a,{position:"left"}),vs,n(a,{autoPosition:!1}),ys,n(a,{altPosition:!0}),fs,n(a,{teleport:"#app"}),ws,n(a,{openMenuOnFocus:!1}),qs,n(a,{escClose:!1}),xs,n(a,{spaceConfirm:!1}),Ds,n(a,{monthChangeOnArrows:!1}),_s,t("p",null,[Ts,t("a",Cs,[Es,n(c)]),js]),Ss,n(a,{transitions:!1}),Is,n(f),Ms,n(a,{hideInputIcon:!0}),Os,n(a,{state:!1}),As,n(a,{inputClassName:"dp-custom-input"}),Ns,n(a,{menuClassName:"dp-custom-menu"}),Fs,n(a,{calendarClassName:"dp-custom-calendar"}),Ps,n(a,{calendarCellClassName:"dp-custom-cell"}),Rs],64)}var Gs=D(_,[["render",Hs]]);export{Gs as default};
+</code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></details>`,1);function Ws(Ys,Bs){const c=e("ExternalLinkIcon"),a=e("Demo"),l=e("TextInputDemo"),p=e("EmptyDemo"),u=e("TimezoneDemo"),i=e("PresetRange"),r=e("FormatDemo"),k=e("PreviewFormatDemo"),d=e("LocalizedOutput"),b=e("Badge"),m=e("DemoMarkers"),g=e("RequiredDemo"),h=e("MinMaxDemo"),v=e("FiltersDemo"),y=e("DisabledDatesDemo"),f=e("DarkDemo");return q(),x(D,null,[T,t("div",C,[t("div",E,[j,t("p",null,[t("strong",null,[S,t("a",I,[M,n(c)]),O,t("a",A,[N,n(c)]),P])])])]),F,n(a,{range:!0}),R,n(a,{range:"",autoRange:5,placeholder:"Select Date"}),H,n(a,{range:!0,multiCalendars:!0}),L,n(a,{monthPicker:!0}),W,n(a,{timePicker:!0}),Y,n(l,{textInput:!0}),B,n(a,{inline:!0,autoApply:!0}),z,n(p,{multiDates:!0,placeholder:"Select Multiple Dates"}),V,n(p,{flow:["month","year","calendar"],placeholder:"Month > Year > Date"}),G,n(u),$,n(p,{weekPicker:!0,placeholder:"Select week"}),U,n(a,{vertical:!0}),J,n(a,{range:!0,partialRange:!1,placeholder:"Select Date"}),K,n(i),Q,n(p,{range:!0,minRange:3,placeholder:"At least 3 days in between"}),X,n(p,{range:!0,maxRange:7,placeholder:"Can't have more than 7 days in between"}),Z,n(a,{range:!0,fixedStart:!0,clearable:!1}),nn,n(a,{range:!0,fixedEnd:!0,clearable:!1}),sn,n(a,{range:!0,multiCalendars:!0,multiCalendarsSolo:!0}),an,n(l,{textInput:!0,textInputOptions:{format:"MM.dd.yyyy"}},null,8,["textInputOptions"]),tn,n(a,{timePicker:!0,modeHeight:120}),pn,n(a,{inline:!0,inlineWithInput:!0,autoApply:!0}),en,n(p,{multiDates:!0,placeholder:"Select Multiple Dates",multiDatesLimit:3}),on,t("p",null,[cn,t("a",ln,[un,n(c)])]),n(r),rn,n(k),kn,n(a,{monthNameFormat:"long"}),dn,n(a,{locale:"de",cancelText:"abbrechen",selectText:"ausw\xE4hlen"}),bn,t("p",null,[mn,t("a",gn,[hn,n(c)])]),vn,n(d),yn,n(a,{selectText:"Pick"}),fn,n(a,{cancelText:"Close"}),wn,n(p,{showNowButton:!0,placeholder:"Select Date",nowButtonLabel:"Current"}),qn,n(a,{weekNumbers:"",weekNumName:"We"}),xn,n(a,{uid:"demo"}),Dn,n(a,{monthChangeOnScroll:!1}),_n,t("h3",Tn,[Cn,En,n(b,{type:"tip",text:"v-model",vertical:"top"})]),jn,n(a,{clearable:!1}),Sn,n(a,{closeOnScroll:!0}),In,n(a,{autoApply:!0}),Mn,n(p,{placeholder:"Select Date"}),On,n(p,{noToday:!0,placeholder:"Select Date"}),An,n(a,{autoApply:!0,closeOnAutoApply:!1}),Nn,n(m),Pn,n(p,{showNowButton:!0,placeholder:"Select Date"}),Fn,n(a,{disabled:!0}),Rn,n(a,{readonly:!0}),Hn,n(g,{required:!0}),Ln,n(a,{name:"date-picker"}),Wn,n(a,{autocomplete:"off"}),Yn,n(a,{keepActionRow:!0,autoApply:!0,closeOnAutoApply:!1}),Bn,n(a,{noSwipe:!0}),zn,n(a,{weekNumbers:!0}),Vn,n(a,{hideOffsetDates:!0}),Gn,n(a,{minDate:new Date},null,8,["minDate"]),$n,n(a,{maxDate:new Date},null,8,["maxDate"]),Un,n(h),Jn,n(p,{startDate:new Date(2020,1),placeholder:"Select Date"},null,8,["startDate"]),Kn,n(a,{weekStart:"0"}),Qn,n(v),Xn,n(a,{disableMonthYearSelect:!0}),Zn,n(a,{yearRange:[2020,2040]}),ns,n(a,{reverseYears:!0,yearRange:[2020,2040]}),ss,n(p,{allowedDates:[new Date],placeholder:"Select Date"},null,8,["allowedDates"]),as,n(y),ts,n(p,{disabledWeekDays:[6,0],placeholder:"Select Date"}),ps,n(a,{enableTimePicker:!1}),es,n(a,{is24:!1}),os,n(a,{enableSeconds:!0}),cs,n(a,{hoursIncrement:"2"}),ls,n(a,{minutesIncrement:"5"}),us,n(a,{secondsIncrement:"5",enableSeconds:!0}),is,n(a,{hoursGridIncrement:"2"}),rs,n(a,{minutesGridIncrement:"2"}),ks,n(a,{secondsGridIncrement:"2",enableSeconds:!0}),ds,n(a,{noHoursOverlay:!0}),bs,n(a,{noMinutesOverlay:!0}),ms,n(a,{noSecondsOverlay:!0,enableSeconds:!0}),gs,n(p,{minTime:{hours:11,minutes:30},placeholder:"Select Date"}),hs,n(p,{maxTime:{hours:11,minutes:30},placeholder:"Select Date"}),vs,n(p,{startTime:{hours:0,minutes:0},placeholder:"Select Date"}),ys,n(a,{position:"left"}),fs,n(a,{autoPosition:!1}),ws,n(a,{altPosition:!0}),qs,n(a,{teleport:"#app"}),xs,n(a,{openMenuOnFocus:!1}),Ds,n(a,{escClose:!1}),_s,n(a,{spaceConfirm:!1}),Ts,n(a,{monthChangeOnArrows:!1}),Cs,t("p",null,[Es,t("a",js,[Ss,n(c)]),Is]),Ms,n(a,{transitions:!1}),Os,n(f),As,n(a,{hideInputIcon:!0}),Ns,n(a,{state:!1}),Ps,n(a,{inputClassName:"dp-custom-input"}),Fs,n(a,{menuClassName:"dp-custom-menu"}),Rs,n(a,{calendarClassName:"dp-custom-calendar"}),Hs,n(a,{calendarCellClassName:"dp-custom-cell"}),Ls],64)}var Vs=w(_,[["render",Ws],["__file","index.html.vue"]]);export{Vs as default};
diff --git a/docs/assets/plugin-vue_export-helper.21dcd24c.js b/docs/assets/plugin-vue_export-helper.21dcd24c.js
deleted file mode 100644
index aae20adfd..000000000
--- a/docs/assets/plugin-vue_export-helper.21dcd24c.js
+++ /dev/null
@@ -1 +0,0 @@
-var a=(t,o)=>{const r=t.__vccOpts||t;for(const[e,_]of o)r[e]=_;return r};export{a as _};
diff --git a/docs/assets/style.3b68b3c3.css b/docs/assets/style.8c8e2d0d.css
similarity index 70%
rename from docs/assets/style.3b68b3c3.css
rename to docs/assets/style.8c8e2d0d.css
index cd2478c28..8a798cc5e 100644
--- a/docs/assets/style.3b68b3c3.css
+++ b/docs/assets/style.8c8e2d0d.css
@@ -1 +1 @@
-:root{--external-link-icon-color:#aaa}.external-link-icon{position:relative;display:inline-block;color:var(--external-link-icon-color);vertical-align:middle;top:-1px}.external-link-icon-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:root{--medium-zoom-z-index:100;--medium-zoom-bg-color:#ffffff;--medium-zoom-opacity:1}.medium-zoom-overlay{background-color:var(--medium-zoom-bg-color)!important;z-index:var(--medium-zoom-z-index)}.medium-zoom-overlay~img{z-index:calc(var(--medium-zoom-z-index) + 1)}.medium-zoom--opened .medium-zoom-overlay{opacity:var(--medium-zoom-opacity)}:root{--c-brand:#3eaf7c;--c-brand-light:#4abf8a;--c-bg:#ffffff;--c-bg-light:#f3f4f5;--c-bg-lighter:#eeeeee;--c-bg-navbar:var(--c-bg);--c-bg-sidebar:var(--c-bg);--c-bg-arrow:#cccccc;--c-text:#2c3e50;--c-text-accent:var(--c-brand);--c-text-light:#3a5169;--c-text-lighter:#4e6e8e;--c-text-lightest:#6a8bad;--c-text-quote:#999999;--c-border:#eaecef;--c-border-dark:#dfe2e5;--c-tip:#42b983;--c-tip-bg:var(--c-bg-light);--c-tip-title:var(--c-text);--c-tip-text:var(--c-text);--c-tip-text-accent:var(--c-text-accent);--c-warning:#e7c000;--c-warning-bg:#fffae3;--c-warning-title:#ad9000;--c-warning-text:#746000;--c-warning-text-accent:var(--c-text);--c-danger:#cc0000;--c-danger-bg:#ffe0e0;--c-danger-title:#990000;--c-danger-text:#660000;--c-danger-text-accent:var(--c-text);--c-details-bg:#eeeeee;--c-badge-tip:var(--c-tip);--c-badge-warning:var(--c-warning);--c-badge-danger:var(--c-danger);--t-color:.3s ease;--t-transform:.3s ease;--code-bg-color:#282c34;--code-hl-bg-color:rgba(0, 0, 0, .66);--code-ln-color:#9e9e9e;--code-ln-wrapper-width:3.5rem;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code:Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;--navbar-height:3.6rem;--navbar-padding-v:.7rem;--navbar-padding-h:1.5rem;--sidebar-width:20rem;--sidebar-width-mobile:calc(var(--sidebar-width) * .82);--content-width:740px;--homepage-width:960px}.back-to-top{--back-to-top-color:var(--c-brand);--back-to-top-color-hover:var(--c-brand-light)}.DocSearch{--docsearch-primary-color:var(--c-brand);--docsearch-text-color:var(--c-text);--docsearch-highlight-color:var(--c-brand);--docsearch-muted-color:var(--c-text-quote);--docsearch-container-background:rgba(9, 10, 17, .8);--docsearch-modal-background:var(--c-bg-light);--docsearch-searchbox-background:var(--c-bg-lighter);--docsearch-searchbox-focus-background:var(--c-bg);--docsearch-searchbox-shadow:inset 0 0 0 2px var(--c-brand);--docsearch-hit-color:var(--c-text-light);--docsearch-hit-active-color:var(--c-bg);--docsearch-hit-background:var(--c-bg);--docsearch-hit-shadow:0 1px 3px 0 var(--c-border-dark);--docsearch-footer-background:var(--c-bg)}.external-link-icon{--external-link-icon-color:var(--c-text-quote)}.medium-zoom-overlay{--medium-zoom-bg-color:var(--c-bg)}#nprogress{--nprogress-color:var(--c-brand)}.pwa-popup{--pwa-popup-text-color:var(--c-text);--pwa-popup-bg-color:var(--c-bg);--pwa-popup-border-color:var(--c-brand);--pwa-popup-shadow:0 4px 16px var(--c-brand);--pwa-popup-btn-text-color:var(--c-bg);--pwa-popup-btn-bg-color:var(--c-brand);--pwa-popup-btn-hover-bg-color:var(--c-brand-light)}.search-box{--search-bg-color:var(--c-bg);--search-accent-color:var(--c-brand);--search-text-color:var(--c-text);--search-border-color:var(--c-border);--search-item-text-color:var(--c-text-lighter);--search-item-focus-bg-color:var(--c-bg-light)}html.dark{--c-brand:#3aa675;--c-brand-light:#349469;--c-bg:#22272e;--c-bg-light:#2b313a;--c-bg-lighter:#262c34;--c-text:#adbac7;--c-text-light:#96a7b7;--c-text-lighter:#8b9eb0;--c-text-lightest:#8094a8;--c-border:#3e4c5a;--c-border-dark:#34404c;--c-tip:#318a62;--c-warning:#ceab00;--c-warning-bg:#7e755b;--c-warning-title:#ceac03;--c-warning-text:#362e00;--c-danger:#940000;--c-danger-bg:#806161;--c-danger-title:#610000;--c-danger-text:#3a0000;--c-details-bg:#323843;--code-hl-bg-color:#363b46;color-scheme:dark}html.dark .DocSearch{--docsearch-logo-color:var(--c-text);--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40, 0 3px 8px 0 #000309;--docsearch-key-shadow:inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, .3);--docsearch-key-gradient:linear-gradient(-225deg, #444950, #1c1e21);--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73, 76, 106, .5), 0 -4px 8px 0 rgba(0, 0, 0, .2)}body,html{padding:0;margin:0;background-color:var(--c-bg);transition:background-color var(--t-color)}body{font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}a,p a code{color:var(--c-text-accent)}a{font-weight:500;text-decoration:none;overflow-wrap:break-word}p a code{font-weight:400}code,kbd{font-family:var(--font-family-code)}body,kbd{color:var(--c-text)}kbd{background:var(--c-bg-lighter);border:solid .15rem var(--c-border-dark);border-bottom:solid .25rem var(--c-border-dark);border-radius:.15rem;padding:0 .15em}code{color:var(--c-text-lighter);padding:.25rem .5rem;font-size:.85em;background-color:var(--c-bg-light);border-radius:3px;overflow-wrap:break-word;transition:background-color var(--t-color)}blockquote{font-size:1rem;color:var(--c-text-quote);border-left:.2rem solid var(--c-border-dark);margin:1rem 0;padding:.25rem 0 .25rem 1rem}blockquote>p,code{margin:0}ol,ul{padding-left:1.2em}strong{font-weight:600}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.25}h1:focus-visible,h2:focus-visible,h3:focus-visible,h4:focus-visible,h5:focus-visible,h6:focus-visible{outline:0}h1:hover .header-anchor,h2:hover .header-anchor,h3:hover .header-anchor,h4:hover .header-anchor,h5:hover .header-anchor,h6:hover .header-anchor{opacity:1}h1{font-size:2.2rem}h2{font-size:1.65rem;padding-bottom:.3rem;border-bottom:1px solid var(--c-border);transition:border-color var(--t-color)}h3{font-size:1.35rem}h4{font-size:1.15rem}h5{font-size:1.05rem}h6{font-size:1rem}a.header-anchor{font-size:.85em;float:left;margin-left:-.87em;padding-right:.23em;margin-top:.125em;opacity:0}a.header-anchor:hover{text-decoration:none}a.header-anchor:focus-visible{opacity:1}ol,p,ul{line-height:1.7}hr{border:0;border-top:1px solid var(--c-border)}table,tr{transition:border-color var(--t-color)}table{border-collapse:collapse;margin:1rem 0;display:block;overflow-x:auto}tr{border-top:1px solid var(--c-border-dark)}tr:nth-child(2n){background-color:var(--c-bg-light);transition:background-color var(--t-color)}td,th{padding:.6em 1em;border:1px solid var(--c-border-dark);transition:border-color var(--t-color)}.arrow,.badge{display:inline-block}.arrow{width:0;height:0}.arrow.down,.arrow.up{border-left:4px solid transparent;border-right:4px solid transparent}.arrow.up{border-bottom:6px solid var(--c-bg-arrow)}.arrow.down{border-top:6px solid var(--c-bg-arrow)}.arrow.left,.arrow.right{border-top:4px solid transparent;border-bottom:4px solid transparent}.arrow.right{border-left:6px solid var(--c-bg-arrow)}.arrow.left{border-right:6px solid var(--c-bg-arrow)}.badge{font-size:14px;height:18px;line-height:18px;border-radius:3px;padding:0 6px;color:var(--c-bg);vertical-align:top;transition:color var(--t-color),background-color var(--t-color)}.badge.tip{background-color:var(--c-badge-tip)}.badge.warning{background-color:var(--c-badge-warning)}.badge.danger{background-color:var(--c-badge-danger)}.badge+.badge{margin-left:5px}code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-family:var(--font-family-code);font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#ec5975}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:#3eaf7c}.theme-default-content pre,.theme-default-content pre[class*=language-]{line-height:1.4;padding:1.3rem 1.5rem;margin:.85rem 0;border-radius:6px;overflow:auto}.theme-default-content pre code,.theme-default-content pre[class*=language-] code{color:#fff;padding:0;background-color:transparent;border-radius:0;overflow-wrap:unset;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}.theme-default-content .line-number{font-family:var(--font-family-code)}div[class*=language-]{position:relative;background-color:var(--code-bg-color);border-radius:6px}div[class*=language-]:before{position:absolute;z-index:3;top:.8em;right:1em;font-size:.75rem;color:var(--code-ln-color)}div[class*=language-] pre,div[class*=language-] pre[class*=language-]{background:0 0!important;position:relative;z-index:1}div[class*=language-] .highlight-lines{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-top:1.3rem;position:absolute;top:0;left:0;width:100%;line-height:1.4}div[class*=language-] .highlight-lines .highlight-line{background-color:var(--code-hl-bg-color)}div[class*=language-]:not(.line-numbers-mode) .line-numbers{display:none}div[class*=language-].line-numbers-mode .highlight-lines .highlight-line{position:relative}div[class*=language-].line-numbers-mode .highlight-lines .highlight-line:before{content:" ";position:absolute;z-index:2;left:0;top:0;display:block;width:var(--code-ln-wrapper-width);height:100%}div[class*=language-].line-numbers-mode pre{margin-left:var(--code-ln-wrapper-width);padding-left:1rem;vertical-align:middle}div[class*=language-].line-numbers-mode .line-numbers{position:absolute;top:0;width:var(--code-ln-wrapper-width);text-align:center;color:var(--code-ln-color);padding-top:1.25rem;line-height:1.4}div[class*=language-].line-numbers-mode .line-numbers .line-number,div[class*=language-].line-numbers-mode .line-numbers br{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div[class*=language-].line-numbers-mode .line-numbers .line-number{position:relative;z-index:3;font-size:.85em;line-height:0}div[class*=language-].line-numbers-mode:after{content:"";position:absolute;top:0;left:0;width:var(--code-ln-wrapper-width);height:100%;border-radius:6px 0 0 6px;border-right:1px solid var(--code-hl-bg-color)}div[class*=language-].ext-c:before{content:"c"}div[class*=language-].ext-cpp:before{content:"cpp"}div[class*=language-].ext-cs:before{content:"cs"}div[class*=language-].ext-css:before{content:"css"}div[class*=language-].ext-dart:before{content:"dart"}div[class*=language-].ext-docker:before{content:"docker"}div[class*=language-].ext-fs:before{content:"fs"}div[class*=language-].ext-go:before{content:"go"}div[class*=language-].ext-html:before{content:"html"}div[class*=language-].ext-java:before{content:"java"}div[class*=language-].ext-js:before{content:"js"}div[class*=language-].ext-json:before{content:"json"}div[class*=language-].ext-kt:before{content:"kt"}div[class*=language-].ext-less:before{content:"less"}div[class*=language-].ext-makefile:before{content:"makefile"}div[class*=language-].ext-md:before{content:"md"}div[class*=language-].ext-php:before{content:"php"}div[class*=language-].ext-py:before{content:"py"}div[class*=language-].ext-rb:before{content:"rb"}div[class*=language-].ext-rs:before{content:"rs"}div[class*=language-].ext-sass:before{content:"sass"}div[class*=language-].ext-scss:before{content:"scss"}div[class*=language-].ext-sh:before{content:"sh"}div[class*=language-].ext-styl:before{content:"styl"}div[class*=language-].ext-ts:before{content:"ts"}div[class*=language-].ext-toml:before{content:"toml"}div[class*=language-].ext-vue:before{content:"vue"}div[class*=language-].ext-yml:before{content:"yml"}@media (max-width:419px){.theme-default-content div[class*=language-]{margin:.85rem -1.5rem;border-radius:0}}.code-group__nav{margin-top:.85rem;margin-bottom:calc(-1.7rem - 6px);padding-bottom:calc(1.7rem - 6px);padding-left:10px;padding-top:10px;border-top-left-radius:6px;border-top-right-radius:6px;background-color:var(--code-bg-color)}.code-group__ul{margin:auto 0;padding-left:0;display:inline-flex;list-style:none}.code-group__nav-tab{border:0;padding:5px;cursor:pointer;background-color:transparent;font-size:.85em;line-height:1.4;color:#ffffffe6;font-weight:600}.code-group__nav-tab:focus{outline:0}.code-group__nav-tab:focus-visible{outline:1px solid rgba(255,255,255,.9)}.code-group__nav-tab-active{border-bottom:var(--c-brand) 1px solid}@media (max-width:419px){.code-group__nav{margin-left:-1.5rem;margin-right:-1.5rem;border-radius:0}}.code-group-item,.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>a.router-link-active:after{display:none}.code-group-item__active{display:block}.code-group-item>pre{background-color:orange}.custom-container{transition:color var(--t-color),border-color var(--t-color),background-color var(--t-color)}.custom-container .custom-container-title{font-weight:600}.custom-container .custom-container-title:not(:only-child){margin-bottom:-.4rem}.custom-container.danger,.custom-container.tip,.custom-container.warning{padding:.1rem 1.5rem;border-left-width:.5rem;border-left-style:solid;margin:1rem 0}.custom-container.tip{border-color:var(--c-tip);background-color:var(--c-tip-bg);color:var(--c-tip-text)}.custom-container.tip .custom-container-title{color:var(--c-tip-title)}.custom-container.tip a{color:var(--c-tip-text-accent)}.custom-container.warning{border-color:var(--c-warning);background-color:var(--c-warning-bg);color:var(--c-warning-text)}.custom-container.warning .custom-container-title{color:var(--c-warning-title)}.custom-container.warning a{color:var(--c-warning-text-accent)}.custom-container.danger{border-color:var(--c-danger);background-color:var(--c-danger-bg);color:var(--c-danger-text)}.custom-container.danger .custom-container-title{color:var(--c-danger-title)}.custom-container.danger a{color:var(--c-danger-text-accent)}.custom-container.details{display:block;position:relative;border-radius:2px;margin:1.6em 0;padding:1.6em;background-color:var(--c-details-bg)}.custom-container.details h4{margin-top:0}.custom-container.details figure:last-child,.custom-container.details p:last-child{margin-bottom:0;padding-bottom:0}.custom-container.details summary{outline:0;cursor:pointer}.home{padding:var(--navbar-height) 2rem 0;max-width:var(--homepage-width);margin:0 auto;display:block}.home .hero{text-align:center}.home .hero img{max-width:100%;max-height:280px;display:block;margin:3rem auto 1.5rem}.home .hero h1{font-size:3rem}.home .hero .actions,.home .hero .description,.home .hero h1{margin:1.8rem auto}.home .hero .actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.home .hero .description{max-width:35rem;font-size:1.6rem;line-height:1.3;color:var(--c-text-lightest)}.home .hero .action-button{display:inline-block;font-size:1.2rem;padding:.8rem 1.6rem;border-width:2px;border-style:solid;border-radius:4px;transition:background-color var(--t-color);box-sizing:border-box}.home .hero .action-button.primary{color:var(--c-bg);background-color:var(--c-brand);border-color:var(--c-brand)}.home .hero .action-button.primary:hover{background-color:var(--c-brand-light)}.home .hero .action-button.secondary{color:var(--c-brand);background-color:var(--c-bg);border-color:var(--c-brand)}.home .hero .action-button.secondary:hover{color:var(--c-bg);background-color:var(--c-brand-light)}.home .features{border-top:1px solid var(--c-border);transition:border-color var(--t-color);padding:1.2rem 0;margin-top:2.5rem;display:flex;flex-wrap:wrap;align-items:flex-start;align-content:stretch;justify-content:space-between}.home .feature{flex-grow:1;flex-basis:30%;max-width:30%}.home .feature h2{font-size:1.4rem;font-weight:500;border-bottom:none;padding-bottom:0;color:var(--c-text-light)}.home .feature p,.home .footer{color:var(--c-text-lighter)}.home .footer{padding:2.5rem;border-top:1px solid var(--c-border);text-align:center;transition:border-color var(--t-color)}@media (max-width:719px){.home .features{flex-direction:column}.home .feature{max-width:100%;padding:0 2.5rem}}@media (max-width:419px){.home{padding-left:1.5rem;padding-right:1.5rem}.home .hero img{max-height:210px;margin:2rem auto 1.2rem}.home .hero h1{font-size:2rem}.home .hero .actions,.home .hero .description,.home .hero h1{margin:1.2rem auto}.home .hero .description{font-size:1.2rem}.home .hero .action-button{font-size:1rem;padding:.6rem 1.2rem}.home .feature h2{font-size:1.25rem}}.page{padding-top:var(--navbar-height);padding-left:var(--sidebar-width)}.navbar,.sidebar{position:fixed;left:0;box-sizing:border-box}.navbar{z-index:20;top:0;right:0;height:var(--navbar-height);border-bottom:1px solid var(--c-border);background-color:var(--c-bg-navbar);transition:background-color var(--t-color),border-color var(--t-color)}.sidebar{font-size:16px;width:var(--sidebar-width);z-index:10;margin:0;top:var(--navbar-height);bottom:0;border-right:1px solid var(--c-border);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--c-brand) var(--c-border);background-color:var(--c-bg-sidebar);transition:transform var(--t-transform),background-color var(--t-color),border-color var(--t-color)}.sidebar::-webkit-scrollbar{width:7px}.sidebar::-webkit-scrollbar-track{background-color:var(--c-border)}.sidebar::-webkit-scrollbar-thumb{background-color:var(--c-brand)}.sidebar-mask{position:fixed;z-index:9;top:0;left:0;width:100vw;height:100vh;display:none}.theme-container.sidebar-open .sidebar-mask{display:block}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(1){transform:rotate(45deg) translate3d(5.5px,5.5px,0)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(2){transform:scale3d(0,1,1)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(3){transform:rotate(-45deg) translate3d(6px,-6px,0)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(1),.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(3){transform-origin:center}.theme-container.no-navbar .theme-default-content:not(.custom)>h1,.theme-container.no-navbar h2,.theme-container.no-navbar h3,.theme-container.no-navbar h4,.theme-container.no-navbar h5,.theme-container.no-navbar h6{margin-top:1.5rem;padding-top:0}.theme-container.no-navbar .page{padding-top:0}.theme-container.no-navbar .sidebar{top:0}@media (min-width:720px){.theme-container.no-sidebar .sidebar{display:none}.theme-container.no-sidebar .page{padding-left:0}}.theme-default-content:not(.custom)>h1,.theme-default-content:not(.custom)>h2,.theme-default-content:not(.custom)>h3,.theme-default-content:not(.custom)>h4,.theme-default-content:not(.custom)>h5,.theme-default-content:not(.custom)>h6{margin-top:calc(.5rem - var(--navbar-height));padding-top:calc(1rem + var(--navbar-height));margin-bottom:0}.theme-default-content:not(.custom)>h1:first-child,.theme-default-content:not(.custom)>h2:first-child,.theme-default-content:not(.custom)>h3:first-child,.theme-default-content:not(.custom)>h4:first-child,.theme-default-content:not(.custom)>h5:first-child,.theme-default-content:not(.custom)>h6:first-child{margin-bottom:1rem}.theme-default-content:not(.custom)>h1:first-child+.custom-container,.theme-default-content:not(.custom)>h1:first-child+p,.theme-default-content:not(.custom)>h1:first-child+pre,.theme-default-content:not(.custom)>h2:first-child+.custom-container,.theme-default-content:not(.custom)>h2:first-child+p,.theme-default-content:not(.custom)>h2:first-child+pre,.theme-default-content:not(.custom)>h3:first-child+.custom-container,.theme-default-content:not(.custom)>h3:first-child+p,.theme-default-content:not(.custom)>h3:first-child+pre,.theme-default-content:not(.custom)>h4:first-child+.custom-container,.theme-default-content:not(.custom)>h4:first-child+p,.theme-default-content:not(.custom)>h4:first-child+pre,.theme-default-content:not(.custom)>h5:first-child+.custom-container,.theme-default-content:not(.custom)>h5:first-child+p,.theme-default-content:not(.custom)>h5:first-child+pre,.theme-default-content:not(.custom)>h6:first-child+.custom-container,.theme-default-content:not(.custom)>h6:first-child+p,.theme-default-content:not(.custom)>h6:first-child+pre{margin-top:2rem}.theme-default-content:not(.custom){max-width:var(--content-width);margin:0 auto;padding:2rem 2.5rem;padding-top:0}@media (max-width:959px){.theme-default-content:not(.custom){padding:2rem}}@media (max-width:419px){.theme-default-content:not(.custom){padding:1.5rem}}.theme-default-content:not(.custom) a:hover{text-decoration:underline}.theme-default-content:not(.custom) img{max-width:100%}.theme-default-content.custom{padding:0;margin:0}.theme-default-content.custom img{max-width:100%}@media (max-width:959px){.sidebar{font-size:15px;width:var(--sidebar-width-mobile)}.page{padding-left:var(--sidebar-width-mobile)}}@media (max-width:719px){.sidebar{top:0;padding-top:var(--navbar-height);transform:translate(-100%)}.page{padding-left:0}.theme-container.sidebar-open .sidebar{transform:translate(0)}.theme-container.no-navbar .sidebar{padding-top:0}}@media (max-width:419px){h1{font-size:1.9rem}}.navbar{--navbar-line-height:calc( var(--navbar-height) - 2 * var(--navbar-padding-v) );padding:var(--navbar-padding-v) var(--navbar-padding-h);line-height:var(--navbar-line-height)}.navbar .logo{height:var(--navbar-line-height);margin-right:var(--navbar-padding-v);vertical-align:top}.navbar .site-name{font-size:1.3rem;font-weight:600;color:var(--c-text);position:relative}.navbar .navbar-items-wrapper{display:flex;position:absolute;box-sizing:border-box;top:var(--navbar-padding-v);right:var(--navbar-padding-h);height:var(--navbar-line-height);padding-left:var(--navbar-padding-h);white-space:nowrap;font-size:.9rem}.navbar .navbar-items-wrapper .search-box{flex:0 0 auto;vertical-align:top}@media (max-width:719px){.navbar{padding-left:4rem}.navbar .can-hide{display:none}.navbar .site-name{width:calc(100vw - 9.4rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}.navbar-items,.navbar-items a{display:inline-block}.navbar-items a{line-height:1.4rem;color:inherit}.navbar-items a.router-link-active,.navbar-items a:hover{color:var(--c-text-accent)}.navbar-items .navbar-item{position:relative;display:inline-block;margin-left:1.5rem;line-height:var(--navbar-line-height)}.navbar-items .navbar-item:first-child{margin-left:0}@media (max-width:719px){.navbar-items .navbar-item{margin-left:0}}@media (min-width:719px){.navbar-items a.router-link-active,.navbar-items a:hover{color:var(--c-text)}.navbar-item>a.router-link-active,.navbar-item>a:hover{margin-bottom:-2px;border-bottom:2px solid var(--c-text-accent)}}.toggle-sidebar-button{position:absolute;top:.6rem;left:1rem;display:none;padding:.6rem;cursor:pointer}.toggle-sidebar-button .icon{display:flex;flex-direction:column;justify-content:center;align-items:center;width:1.25rem;height:1.25rem;cursor:inherit}.toggle-sidebar-button .icon span{display:inline-block;width:100%;height:2px;border-radius:2px;background-color:var(--c-text);transition:transform var(--t-transform)}.toggle-sidebar-button .icon span:nth-child(2){margin:6px 0}@media screen and (max-width:719px){.toggle-sidebar-button{display:block}}.toggle-dark-button{display:flex;margin:auto;margin-left:1rem;border:0;background:0 0;color:var(--c-text);opacity:.8;cursor:pointer}.toggle-dark-button:hover{opacity:1}.toggle-dark-button .icon{width:1.25rem;height:1.25rem}.DocSearch{transition:background-color var(--t-color)}.navbar-dropdown-wrapper{cursor:pointer}.navbar-dropdown-wrapper .navbar-dropdown-title,.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:block;font-size:.9rem;font-family:inherit;cursor:inherit;padding:inherit;line-height:1.4rem;background:0 0;border:0;font-weight:500;color:var(--c-text)}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:none;font-weight:600;font-size:inherit}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile:hover,.navbar-dropdown-wrapper .navbar-dropdown-title:hover{border-color:transparent}.navbar-dropdown-wrapper .navbar-dropdown-title .arrow,.navbar-dropdown-wrapper .navbar-dropdown-title-mobile .arrow{vertical-align:middle;margin-top:-1px;margin-left:.4rem}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile:hover{color:var(--c-text-accent)}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item{color:inherit;line-height:1.7rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle{margin:.45rem 0 0;border-top:1px solid var(--c-border);padding:1rem 0 .45rem;font-size:.9rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>span{padding:0 1.5rem 0 1.25rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>a{font-weight:inherit}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem-wrapper{padding:0;list-style:none}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem-wrapper .navbar-dropdown-subitem{font-size:.9em}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a{display:block;line-height:1.7rem;position:relative;border-bottom:none;font-weight:400;margin-bottom:0;padding:0 1.5rem 0 1.25rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active,.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a:hover{color:var(--c-text-accent)}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active:after{content:"";width:0;height:0;border-left:5px solid var(--c-text-accent);border-top:3px solid transparent;border-bottom:3px solid transparent;position:absolute;top:calc(50% - 2px);left:9px}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item:first-child .navbar-dropdown-subtitle{margin-top:0;padding-top:0;border-top:0}@media (max-width:719px){.navbar-dropdown-wrapper.open .navbar-dropdown-title,.navbar-dropdown-wrapper.open .navbar-dropdown-title-mobile{margin-bottom:.5rem}.navbar-dropdown-wrapper .navbar-dropdown-title{display:none}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:block}.navbar-dropdown-wrapper .navbar-dropdown{transition:height .1s ease-out;overflow:hidden}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle{border-top:0;margin-top:0;padding-top:0;padding-bottom:0;font-size:15px;line-height:2rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item>a{font-size:15px;line-height:2rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem{font-size:14px;padding-left:1rem}}@media (min-width:720px){.navbar-dropdown-wrapper{height:1.8rem}.navbar-dropdown-wrapper.open .navbar-dropdown,.navbar-dropdown-wrapper:hover .navbar-dropdown{display:block!important}.navbar-dropdown-wrapper.open:blur{display:none}.navbar-dropdown-wrapper .navbar-dropdown{display:none;height:auto!important;box-sizing:border-box;max-height:calc(100vh - 2.7rem);overflow-y:auto;position:absolute;top:100%;right:0;background-color:var(--c-bg-navbar);padding:.6rem 0;border:1px solid var(--c-border);border-bottom-color:var(--c-border-dark);text-align:left;border-radius:.25rem;white-space:nowrap;margin:0}}.page{padding-bottom:2rem;display:block}.page-meta{max-width:var(--content-width);margin:0 auto;padding:1rem 2.5rem;overflow:auto}@media (max-width:959px){.page-meta{padding:2rem}}@media (max-width:419px){.page-meta{padding:1.5rem}}.page-meta .meta-item{cursor:default;margin-top:.8rem}.page-meta .meta-item .meta-item-label{font-weight:500;color:var(--c-text-lighter)}.page-meta .meta-item .meta-item-info{font-weight:400;color:var(--c-text-quote)}.page-meta .edit-link{display:inline-block;margin-right:.25rem}.page-meta .last-updated{float:right}@media (max-width:719px){.page-meta .last-updated{font-size:.8em;float:none}.page-meta .contributors{font-size:.8em}}.page-nav{max-width:var(--content-width);margin:0 auto;padding:1rem 2.5rem 2rem;padding-bottom:0}@media (max-width:959px){.page-nav{padding:2rem}}@media (max-width:419px){.page-nav{padding:1.5rem}}.page-nav .inner{min-height:2rem;margin-top:0;border-top:1px solid var(--c-border);transition:border-color var(--t-color);padding-top:1rem;overflow:auto}.page-nav .prev a:before{content:"\2190"}.page-nav .next{float:right}.page-nav .next a:after{content:"\2192"}.sidebar ul{padding:0;margin:0;list-style-type:none}.sidebar a{display:inline-block}.sidebar .navbar-items{display:none;border-bottom:1px solid var(--c-border);transition:border-color var(--t-color);padding:.5rem 0 .75rem}.sidebar .navbar-items a{font-weight:600}.sidebar .navbar-items .navbar-item{display:block;line-height:1.25rem;font-size:1.1em;padding:.5rem 0 .5rem 1.5rem}.sidebar .sidebar-items{padding:1.5rem 0}@media (max-width:719px){.sidebar .navbar-items{display:block}.sidebar .navbar-items .navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active:after{top:calc(1rem - 2px)}.sidebar .sidebar-items{padding:1rem 0}}.sidebar-item{cursor:default;border-left:.25rem solid transparent;color:var(--c-text)}.sidebar-item:focus-visible{outline-width:1px;outline-offset:-1px}.sidebar-item.active:not(p.sidebar-heading){font-weight:600;color:var(--c-text-accent);border-left-color:var(--c-text-accent)}.sidebar-item.sidebar-heading{transition:color .15s ease;font-size:1.1em;font-weight:700;padding:.35rem 1.5rem .35rem 1.25rem;width:100%;box-sizing:border-box;margin:0}.sidebar-item.sidebar-heading.collapsible,a.sidebar-item{cursor:pointer}.sidebar-item.sidebar-heading.collapsible+.sidebar-item-children{transition:height .1s ease-out;overflow:hidden;margin-bottom:.75rem}.sidebar-item.sidebar-heading .arrow{position:relative;top:-.12em;left:.5em}.sidebar-item:not(.sidebar-heading){font-size:1em;font-weight:400;display:inline-block;margin:0;padding:.35rem 1rem .35rem 2rem;line-height:1.4;width:100%;box-sizing:border-box}.sidebar-item:not(.sidebar-heading)+.sidebar-item-children{padding-left:1rem;font-size:.95em}.sidebar-item-children .sidebar-item-children .sidebar-item:not(.sidebar-heading){padding:.25rem 1rem .25rem 1.75rem}.sidebar-item-children .sidebar-item-children .sidebar-item:not(.sidebar-heading).active{font-weight:500;border-left-color:transparent}a.sidebar-heading+.sidebar-item-children .sidebar-item:not(.sidebar-heading).active{border-left-color:transparent}a.sidebar-item:hover{color:var(--c-text-accent)}.table-of-contents .badge{vertical-align:middle}.dropdown-enter-from,.dropdown-leave-to{height:0!important}.fade-slide-y-enter-active{transition:all .2s ease}.fade-slide-y-leave-active{transition:all .2s cubic-bezier(1,.5,.8,1)}.fade-slide-y-enter-from,.fade-slide-y-leave-to{transform:translateY(10px);opacity:0}.dp__input_wrap{position:relative;width:100%;box-sizing:unset}.dp__input_wrap:focus{border-color:var(--dp-border-color-hover);outline:0}.dp__input{background-color:var(--dp-background-color);border-radius:4px;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;border:1px solid var(--dp-border-color);outline:0;transition:border-color .2s cubic-bezier(.645,.045,.355,1);width:100%;font-size:1rem;line-height:1.5rem;padding:6px 12px;color:var(--dp-text-color);box-sizing:border-box}.dp__input::-moz-placeholder{opacity:.7}.dp__input:-ms-input-placeholder{opacity:.7}.dp__input::placeholder{opacity:.7}.dp__input:hover,.dp__input_focus{border-color:var(--dp-border-color-hover)}.dp__disabled{background:var(--dp-disabled-color)}.dp__disabled::-moz-placeholder{color:var(--dp-disabled-color-text)}.dp__disabled:-ms-input-placeholder{color:var(--dp-disabled-color-text)}.dp__disabled::placeholder{color:var(--dp-disabled-color-text)}.dp__input_icons{display:inline-block;width:1rem;height:1rem;stroke-width:0;font-size:1rem;line-height:1.5rem;padding:6px 12px;color:var(--dp-icon-color);box-sizing:content-box}.dp__clear_icon,.dp__input_icon{position:absolute;top:50%;transform:translateY(-50%);color:var(--dp-icon-color)}.dp__input_icon{left:0}.dp__clear_icon{right:0;cursor:pointer}.dp__input_icon_pad{padding-left:35px}.dp__input_valid{box-shadow:0 0 4px var(--dp-success-color)}.dp__input_valid,.dp__input_valid:hover{border-color:var(--dp-success-color)}.dp__input_invalid{box-shadow:0 0 4px var(--dp-danger-color)}.dp__input_invalid,.dp__input_invalid:hover{border-color:var(--dp-danger-color)}.dp__menu{position:absolute;background:var(--dp-background-color);border-radius:4px;min-width:260px;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid var(--dp-menu-border-color)}.dp__menu,.dp__menu:after,.dp__menu:before{box-sizing:border-box}.dp__menu:focus{border:1px solid var(--dp-menu-border-color);outline:0}.dp__menu_index{z-index:99999}.dp__menu_disabled,.dp__menu_readonly{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.dp__menu_disabled{background:rgba(255,255,255,.5);cursor:not-allowed}.dp__menu_readonly{background:0 0;cursor:default}.dp__arrow_bottom,.dp__arrow_top{left:50%;height:12px;width:12px;background-color:var(--dp-background-color);position:absolute}.dp__arrow_top{top:-1px;border-left:1px solid var(--dp-menu-border-color);border-top:1px solid var(--dp-menu-border-color);transform:translate(-50%,-50%) rotate(45deg)}.dp__arrow_bottom{bottom:-1px;border-right:1px solid var(--dp-menu-border-color);border-bottom:1px solid var(--dp-menu-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__now_wrap{text-align:center;padding:2px 0}.dp__now_button{border:1px solid var(--dp-primary-color);color:var(--dp-primary-color);padding:0 4px;font-weight:700;border-radius:4px;font-size:1rem;cursor:pointer;background:0 0}.dp__preset_ranges{padding:5px;border-right:1px solid var(--dp-border-color)}.dp__preset_range{padding:5px}.dp__preset_range:hover{background-color:var(--dp-hover-color);cursor:pointer}.dp__menu_content_wrapper{display:flex}.db__calendar_header,.dp__calendar_wrap{display:flex;justify-content:center;align-items:center}.dp__calendar_wrap{flex-direction:column;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;flex:0}.db__calendar_header{position:relative;color:var(--dp-text-color);white-space:nowrap;font-weight:700}.dp__calendar_header_item{text-align:center;flex-grow:1;height:35px;padding:5px;width:35px;box-sizing:border-box}.dp__calendar_row{display:flex;justify-content:center;align-items:center;margin:5px 0}.dp__calendar_item{text-align:center;flex-grow:1;box-sizing:border-box;color:var(--dp-text-color)}.dp__calendar{position:relative}.dp__calendar_header_cell{border-bottom:thin solid var(--dp-border-color);padding:.5rem}.dp__cell_inner{display:flex;align-items:center;text-align:center;justify-content:center;border-radius:4px;height:35px;padding:5px;width:35px;border:1px solid transparent;box-sizing:border-box;position:relative}.dp__cell_auto_range_start,.dp__date_hover_start:hover,.dp__range_start{border-bottom-right-radius:0;border-top-right-radius:0}.dp__cell_auto_range_end,.dp__date_hover_end:hover,.dp__range_end{border-bottom-left-radius:0;border-top-left-radius:0}.dp__active_date,.dp__range_end,.dp__range_start{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__cell_auto_range_end,.dp__cell_auto_range_start{border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__date_hover:hover,.dp__date_hover_end:hover,.dp__date_hover_start:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__cell_disabled,.dp__cell_offset{color:var(--dp-secondary-color)}.dp__cell_disabled{cursor:not-allowed}.dp__range_between{background:var(--dp-hover-color);border-radius:0;border-top:1px solid var(--dp-hover-color);border-bottom:1px solid var(--dp-hover-color)}.dp__today{border:1px solid var(--dp-primary-color)}.dp__week_num{color:var(--dp-secondary-color);text-align:center}.dp__cell_auto_range{border-radius:0;border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_start{border-left:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_end{border-right:1px dashed var(--dp-primary-color)}.dp__calendar_header_separator{width:100%;height:1px;background:var(--dp-border-color)}.dp__calendar_next{margin-left:10px}.dp__marker_dot,.dp__marker_line{height:5px;background-color:var(--dp-marker-color);position:absolute;bottom:0}.dp__marker_dot{width:5px;border-radius:50%;left:50%;transform:translate(-50%)}.dp__marker_line{width:100%;left:0}.dp__marker_tooltip{position:absolute;border-radius:4px;background-color:var(--dp-tooltip-color);padding:5px;border:1px solid var(--dp-border-color);z-index:99999;box-sizing:border-box;cursor:default}.dp__tooltip_content{white-space:nowrap}.dp__tooltip_text{display:flex;align-items:center;flex-flow:row nowrap;color:var(--dp-text-color)}.dp__tooltip_mark{height:5px;width:5px;border-radius:50%;background-color:var(--dp-text-color);color:var(--dp-text-color);margin-right:5px}.dp__arrow_bottom_tp{left:50%;bottom:0;height:8px;width:8px;background-color:var(--dp-tooltip-color);position:absolute;border-right:1px solid var(--dp-border-color);border-bottom:1px solid var(--dp-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__instance_calendar{position:relative}@media only screen and (max-width:600px){.dp__flex_display{flex-direction:column}}.dp__month_year_row{display:flex;align-items:center;height:35px;color:var(--dp-text-color);box-sizing:border-box}.dp__inner_nav,.dp__month_year_select{text-align:center;cursor:pointer;display:flex;align-items:center;justify-content:center}.dp__inner_nav{height:25px;width:25px;color:var(--dp-icon-color);border-radius:50%}.dp__inner_nav svg{height:20px;width:20px}.dp__inner_nav:hover,.dp__month_year_select:hover{background:var(--dp-hover-color);color:var(--dp-hover-icon-color)}.dp__month_year_select{width:50%;height:35px;border-radius:4px;box-sizing:border-box}.dp__month_year_select:hover{color:var(--dp-hover-text-color)}.dp__overlay{position:absolute;overflow-y:auto;width:100%;height:100%;background:var(--dp-background-color);top:0;left:0;transition:opacity 1s ease-out;z-index:99999;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;color:var(--dp-text-color);box-sizing:border-box}.dp__overlay::-webkit-scrollbar-track{box-shadow:var(--dp-scroll-bar-background);background-color:var(--dp-scroll-bar-background)}.dp__overlay::-webkit-scrollbar{width:5px;background-color:var(--dp-scroll-bar-background)}.dp__overlay::-webkit-scrollbar-thumb{background-color:var(--dp-scroll-bar-color);border-radius:10px}.dp__overlay:focus{border:0;outline:0}.dp__overlay_container{display:flex;height:100%;flex-direction:column}.dp__overlay_row{padding:0;box-sizing:border-box;display:flex;margin-left:auto;margin-right:auto;flex-wrap:wrap;max-width:100%;width:100%;align-items:center}.dp__overlay_container>.dp__overlay_row{flex:1}.dp__overlay_col{box-sizing:border-box;width:33%;padding:3px;white-space:nowrap}.dp__overlay_cell_pad{padding:10px 0}.dp__overlay_cell_active{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__overlay_cell,.dp__overlay_cell_active{cursor:pointer;border-radius:4px;text-align:center}.dp__cell_in_between,.dp__overlay_cell:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__overlay_action{position:-webkit-sticky;position:sticky;bottom:0;background:#fff}.dp__over_action_scroll{right:5px;box-sizing:border-box}.dp__overlay_cell_disabled{cursor:not-allowed}.dp__overlay_cell_disabled,.dp__overlay_cell_disabled:hover{background:var(--dp-disabled-color)}.dp__overlay_cell_active_disabled{cursor:not-allowed}.dp__overlay_cell_active_disabled,.dp__overlay_cell_active_disabled:hover{background:var(--dp-primary-disabled-color)}.dp__month_picker_header,.dp__time_input{width:100%;display:flex;align-items:center}.dp__month_picker_header{justify-content:space-between;height:35px}.dp__time_input{justify-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;color:var(--dp-text-color)}.dp__time_col_reg{padding:0 20px}.dp__time_col_reg_with_button{padding:0 15px}.dp__time_col_sec{padding:0 10px}.dp__time_col_sec_with_button{padding:0 5px}.dp__inc_dec_button,.dp__time_col,.dp__time_display{display:flex;align-items:center;justify-content:center}.dp__time_col{font-size:2rem;text-align:center;flex-direction:column}.dp__inc_dec_button,.dp__time_display{cursor:pointer;color:var(--dp-text-color);border-radius:4px;padding:0 3px}.dp__time_display:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__inc_dec_button{padding:5px;margin:0;border-radius:50%;color:var(--dp-icon-color);box-sizing:border-box}.dp__inc_dec_button,.dp__inc_dec_button svg{height:32px;width:32px}.dp__button:hover,.dp__inc_dec_button:hover{background:var(--dp-hover-color);color:var(--dp-primary-color)}.dp__pm_am_button{background:var(--dp-primary-color);color:var(--dp-primary-text-color);border:0;padding:10px;border-radius:4px;cursor:pointer}.dp__action_row{display:flex;align-items:center;width:100%;padding:10px;box-sizing:border-box;color:var(--dp-text-color);background:var(--dp-background-color)}.dp__action_row svg,.dp__button svg{height:20px;width:auto}.dp__selection_preview{width:50%;color:var(--dp-text-color);font-size:.8rem}.dp__action_buttons{width:50%;text-align:right}.dp__action{font-weight:700;cursor:pointer;padding:2px 5px;border-radius:4px;display:inline-flex;align-items:center}.dp__select{color:var(--dp-success-color)}.dp__action_disabled{color:var(--dp-success-color-disabled);cursor:not-allowed}.dp__cancel{color:var(--dp-secondary-color)}.dp__theme_dark{--dp-text-color:#fff;--dp-hover-text-color:#fff;--dp-hover-icon-color:#959595;--dp-primary-disabled-color:#61a8ea;--dp-primary-text-color:#fff;--dp-menu-border-color:#2d2d2d;--dp-success-color-disabled:#428f59;--dp-marker-color:#e53935;--dp-tooltip-color:#3e3e3e}.dp__theme_light{--dp-background-color:#fff;--dp-hover-text-color:#212121;--dp-hover-icon-color:#959595;--dp-primary-disabled-color:#6bacea;--dp-menu-border-color:#ddd;--dp-success-color-disabled:#a3d9b1;--dp-marker-color:#ff6f60;--dp-tooltip-color:#fafafa}.dp__main{font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box}.dp__pointer{cursor:pointer}.dp__icon{stroke:currentcolor;fill:currentcolor}.dp__button{width:100%;text-align:center;color:var(--dp-icon-color);background:var(--dp-background-color);cursor:pointer;display:flex;align-items:center;align-content:center;justify-content:center;padding:10px;box-sizing:border-box;height:35px}.dp__button:hover{color:var(--dp-hover-icon-color)}.dp__button_bottom{border-bottom-left-radius:4px;border-bottom-right-radius:4px}.dp__flex_display{display:flex}.dp__flex_display_with_input{flex-direction:column;align-items:start}.dp__relative{position:relative}.calendar-next-enter-active,.calendar-next-leave-active,.calendar-prev-enter-active,.calendar-prev-leave-active,.dp-close-enter-active,.dp-close-leave-active,.dp-open-enter-active,.dp-open-leave-active{transition:all .1s cubic-bezier(.19,1,.22,1)}.calendar-next-enter-from{opacity:0;transform:translate(22px)}.calendar-next-leave-to,.calendar-prev-enter-from{opacity:0;transform:translate(-22px)}.calendar-prev-leave-to{opacity:0;transform:translate(22px)}.dp-open-enter-from{opacity:0;transform:translateY(-22px)}.dp-close-enter-from,.dp-open-leave-to{opacity:0;transform:translateY(22px)}.dp-close-leave-to{opacity:0;transform:translateY(-22px)}.demo-wrap{position:relative}caption,table,tbody,td,tfoot,th,thead,tr{all:revert}tr:nth-child(even){background:0 0}.line-numbers{z-index:0}.custom-select{cursor:pointer;color:var(--c-text-accent);margin:0;display:inline-block}.clickable-text{color:#1976d2;cursor:pointer}.input-slot-image{height:20px;width:auto;margin-left:5px}.input-slot-image-clear{height:20px;width:auto;margin-right:5px}.slot-icon,.slot-icon-m{height:20px;width:auto}.slot-icon-m{margin:0 auto}.dp__theme_dark,.dp__theme_light{--dp-border-color-hover:#aaaeb7;--dp-icon-color:#959595}.dp__theme_dark{--dp-background-color:#212121;--dp-text-color:#ffffff;--dp-hover-color:#484848;--dp-primary-color:#005cb2;--dp-primary-text-color:#ffffff;--dp-secondary-color:#a9a9a9;--dp-border-color:#2d2d2d;--dp-disabled-color:#737373;--dp-disabled-color-text:#d0d0d0;--dp-scroll-bar-background:#212121;--dp-scroll-bar-color:#484848;--dp-success-color:#00701a;--dp-danger-color:#e53935}.dp__theme_light{--dp-background-color:#ffffff;--dp-text-color:#212121;--dp-hover-color:#f3f3f3;--dp-primary-color:#1976d2;--dp-primary-text-color:#f8f5f5;--dp-secondary-color:#c0c4cc;--dp-border-color:#ddd;--dp-disabled-color:#f6f6f6;--dp-scroll-bar-background:#f3f3f3;--dp-scroll-bar-color:#959595;--dp-success-color:#76d275;--dp-danger-color:#ff6f60;--dp-disabled-color-text:#8e8e8e}/*! @docsearch/css 3.0.0-alpha.42 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */@-webkit-keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}:root{--docsearch-primary-color:#5468ff;--docsearch-text-color:#1c1e21;--docsearch-spacing:12px;--docsearch-icon-stroke-width:1.4;--docsearch-highlight-color:var(--docsearch-primary-color);--docsearch-muted-color:#969faf;--docsearch-container-background:rgba(101,108,133,.8);--docsearch-logo-color:#5468ff;--docsearch-modal-width:560px;--docsearch-modal-height:600px;--docsearch-modal-background:#f5f6f7;--docsearch-modal-shadow:inset 1px 1px 0 0 hsla(0,0%,100%,.5),0 3px 8px 0 #555a64;--docsearch-searchbox-height:56px;--docsearch-searchbox-background:#ebedf0;--docsearch-searchbox-focus-background:#fff;--docsearch-searchbox-shadow:inset 0 0 0 2px var(--docsearch-primary-color);--docsearch-hit-height:56px;--docsearch-hit-color:#444950;--docsearch-hit-active-color:#fff;--docsearch-hit-background:#fff;--docsearch-hit-shadow:0 1px 3px 0 #d4d9e1;--docsearch-key-gradient:linear-gradient(-225deg,#d5dbe4,#f8f8f8);--docsearch-key-shadow:inset 0 -2px 0 0 #cdcde6,inset 0 0 1px 1px #fff,0 1px 2px 1px rgba(30,35,90,.4);--docsearch-footer-height:44px;--docsearch-footer-background:#fff;--docsearch-footer-shadow:0 -1px 0 0 #e0e3e8,0 -3px 6px 0 rgba(69,98,155,.12)}html[data-theme=dark]{--docsearch-text-color:#f5f6f7;--docsearch-container-background:rgba(9,10,17,.8);--docsearch-modal-background:#15172a;--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--docsearch-searchbox-background:#090a11;--docsearch-searchbox-focus-background:#000;--docsearch-hit-color:#bec3c9;--docsearch-hit-shadow:none;--docsearch-hit-background:#090a11;--docsearch-key-gradient:linear-gradient(-26.5deg,#565872,#31355b);--docsearch-key-shadow:inset 0 -2px 0 0 #282d55,inset 0 0 1px 1px #51577d,0 2px 2px 0 rgba(3,4,9,.3);--docsearch-footer-background:#1e2136;--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73,76,106,.5),0 -4px 8px 0 rgba(0,0,0,.2);--docsearch-logo-color:#fff;--docsearch-muted-color:#7f8497}.DocSearch-Button{align-items:center;background:var(--docsearch-searchbox-background);border:0;border-radius:40px;color:var(--docsearch-muted-color);cursor:pointer;display:flex;font-weight:500;height:36px;justify-content:space-between;margin:0 0 0 16px;padding:0 8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DocSearch-Button:active,.DocSearch-Button:focus,.DocSearch-Button:hover{background:var(--docsearch-searchbox-focus-background);box-shadow:var(--docsearch-searchbox-shadow);color:var(--docsearch-text-color);outline:0}.DocSearch-Button-Container{align-items:center;display:flex}.DocSearch-Search-Icon{stroke-width:1.6}.DocSearch-Button .DocSearch-Search-Icon{color:var(--docsearch-text-color)}.DocSearch-Button-Placeholder{font-size:1rem;padding:0 12px 0 6px}.DocSearch-Button-Keys{display:flex;min-width:calc(40px + .8em)}.DocSearch-Button-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:3px;box-shadow:var(--docsearch-key-shadow);color:var(--docsearch-muted-color);display:flex;height:18px;justify-content:center;margin-right:.4em;padding-bottom:2px;position:relative;top:-1px;width:20px}@media (max-width:750px){.DocSearch-Button-Keys,.DocSearch-Button-Placeholder{display:none}}.DocSearch--active{overflow:hidden!important}.DocSearch-Container,.DocSearch-Container *{box-sizing:border-box}.DocSearch-Container{background-color:var(--docsearch-container-background);height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:200}.DocSearch-Container a{text-decoration:none}.DocSearch-Link{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-highlight-color);cursor:pointer;font:inherit;margin:0;padding:0}.DocSearch-Modal{background:var(--docsearch-modal-background);border-radius:6px;box-shadow:var(--docsearch-modal-shadow);flex-direction:column;margin:60px auto auto;max-width:var(--docsearch-modal-width);position:relative}.DocSearch-SearchBar{display:flex;padding:var(--docsearch-spacing) var(--docsearch-spacing)0}.DocSearch-Form{align-items:center;background:var(--docsearch-searchbox-focus-background);border-radius:4px;box-shadow:var(--docsearch-searchbox-shadow);display:flex;height:var(--docsearch-searchbox-height);margin:0;padding:0 var(--docsearch-spacing);position:relative;width:100%}.DocSearch-Input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-text-color);flex:1;font:inherit;font-size:1.2em;height:100%;outline:0;padding:0 0 0 8px;width:80%}.DocSearch-Input::-moz-placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input:-ms-input-placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::-webkit-search-cancel-button,.DocSearch-Input::-webkit-search-decoration,.DocSearch-Input::-webkit-search-results-button,.DocSearch-Input::-webkit-search-results-decoration{display:none}.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel{margin:0;padding:0}.DocSearch-Reset{margin:0}.DocSearch-MagnifierLabel{color:var(--docsearch-highlight-color)}.DocSearch-MagnifierLabel,.DocSearch-Reset{align-items:center;display:flex;justify-content:center}.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,.DocSearch-LoadingIndicator{display:none}.DocSearch-Container--Stalled .DocSearch-LoadingIndicator{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Reset{-webkit-animation:none;animation:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;right:0;stroke-width:var(--docsearch-icon-stroke-width)}}.DocSearch-Reset{-webkit-animation:fade-in .1s ease-in forwards;animation:fade-in .1s ease-in forwards;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;padding:2px;right:0;stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Cancel,.DocSearch-Reset[hidden]{display:none}.DocSearch-Reset:focus{outline:0}.DocSearch-Reset:hover{color:var(--docsearch-highlight-color)}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{height:24px;width:24px}.DocSearch-Dropdown{max-height:calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));min-height:var(--docsearch-spacing);overflow-y:overlay;padding:0 var(--docsearch-spacing);scrollbar-color:var(--docsearch-muted-color) var(--docsearch-modal-background);scrollbar-width:thin}.DocSearch-Dropdown::-webkit-scrollbar{width:12px}.DocSearch-Dropdown::-webkit-scrollbar-track{background:0 0}.DocSearch-Dropdown::-webkit-scrollbar-thumb{background-color:var(--docsearch-muted-color);border:3px solid var(--docsearch-modal-background);border-radius:20px}.DocSearch-Dropdown ul{list-style:none;margin:0;padding:0}.DocSearch-Label{font-size:.75em;line-height:1.6em}.DocSearch-Help,.DocSearch-Label{color:var(--docsearch-muted-color)}.DocSearch-Help{font-size:.9em;margin:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DocSearch-Title{font-size:1.2em}.DocSearch-Logo a{display:flex}.DocSearch-Logo svg{color:var(--docsearch-logo-color);margin-left:8px}.DocSearch-Hits:last-of-type{margin-bottom:24px}.DocSearch-Hits mark{background:0 0;color:var(--docsearch-highlight-color)}.DocSearch-HitsFooter{color:var(--docsearch-muted-color);display:flex;font-size:.85em;justify-content:center;margin-bottom:var(--docsearch-spacing);padding:var(--docsearch-spacing)}.DocSearch-HitsFooter a{border-bottom:1px solid;color:inherit}.DocSearch-Hit{border-radius:4px;display:flex;padding-bottom:4px;position:relative}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--deleting{transition:none}}.DocSearch-Hit--deleting{opacity:0;transition:all .25s linear}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--favoriting{transition:none}}.DocSearch-Hit--favoriting{transform:scale(0);transform-origin:top center;transition:all .25s linear;transition-delay:.25s}.DocSearch-Hit a{background:var(--docsearch-hit-background);border-radius:4px;box-shadow:var(--docsearch-hit-shadow);display:block;padding-left:var(--docsearch-spacing);width:100%}.DocSearch-Hit-source{background:var(--docsearch-modal-background);color:var(--docsearch-highlight-color);font-size:.85em;font-weight:600;line-height:32px;margin:0 -4px;padding:8px 4px 0;position:-webkit-sticky;position:sticky;top:0;z-index:10}.DocSearch-Hit-Tree{color:var(--docsearch-muted-color);height:var(--docsearch-hit-height);opacity:.5;stroke-width:var(--docsearch-icon-stroke-width);width:24px}.DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-highlight-color)}.DocSearch-Hit[aria-selected=true] mark{text-decoration:underline}.DocSearch-Hit-Container{align-items:center;color:var(--docsearch-hit-color);display:flex;flex-direction:row;height:var(--docsearch-hit-height);padding:0 var(--docsearch-spacing)0 0}.DocSearch-Hit-icon{height:20px;width:20px}.DocSearch-Hit-action,.DocSearch-Hit-icon{color:var(--docsearch-muted-color);stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Hit-action{align-items:center;display:flex;height:22px;width:22px}.DocSearch-Hit-action svg{display:block;height:18px;width:18px}.DocSearch-Hit-action+.DocSearch-Hit-action{margin-left:6px}.DocSearch-Hit-action-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:inherit;cursor:pointer;padding:2px}svg.DocSearch-Hit-Select-Icon{display:none}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon{display:block}.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:background-color .1s ease-in}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{transition:none}}.DocSearch-Hit-action-button:focus path,.DocSearch-Hit-action-button:hover path{fill:#fff}.DocSearch-Hit-content-wrapper{display:flex;flex:1 1 auto;flex-direction:column;font-weight:500;justify-content:center;line-height:1.2em;margin:0 8px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-title{font-size:.9em}.DocSearch-Hit-path{color:var(--docsearch-muted-color);font-size:.75em}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,.DocSearch-Hit[aria-selected=true] mark{color:var(--docsearch-hit-active-color)!important}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:none}}.DocSearch-ErrorScreen,.DocSearch-NoResults,.DocSearch-StartScreen{font-size:.9em;margin:0 auto;padding:36px 0;text-align:center;width:80%}.DocSearch-Screen-Icon{color:var(--docsearch-muted-color);padding-bottom:12px}.DocSearch-NoResults-Prefill-List{display:inline-block;padding-bottom:24px;text-align:left}.DocSearch-NoResults-Prefill-List ul,.DocSearch-Prefill{display:inline-block;padding:8px 0 0}.DocSearch-NoResults-Prefill-List li{list-style-position:inside;list-style-type:"\bb  "}.DocSearch-Prefill{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:1em;color:var(--docsearch-highlight-color);cursor:pointer;font-size:1em;font-weight:700;padding:0}.DocSearch-Prefill:focus,.DocSearch-Prefill:hover{outline:0;text-decoration:underline}.DocSearch-Footer{align-items:center;background:var(--docsearch-footer-background);border-radius:0 0 8px 8px;box-shadow:var(--docsearch-footer-shadow);display:flex;flex-direction:row-reverse;flex-shrink:0;height:var(--docsearch-footer-height);justify-content:space-between;padding:0 var(--docsearch-spacing);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%;z-index:300}.DocSearch-Commands{color:var(--docsearch-muted-color);display:flex;list-style:none;margin:0;padding:0}.DocSearch-Commands li{align-items:center;display:flex}.DocSearch-Commands li:not(:last-of-type){margin-right:.8em}.DocSearch-Commands-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:2px;box-shadow:var(--docsearch-key-shadow);display:flex;height:18px;justify-content:center;margin-right:.4em;padding-bottom:1px;width:20px}@media (max-width:750px){:root{--docsearch-spacing:10px;--docsearch-footer-height:40px}.DocSearch-Dropdown{height:100%}.DocSearch-Container{height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);position:absolute}.DocSearch-Footer{border-radius:0;bottom:0;position:absolute}.DocSearch-Hit-content-wrapper{display:flex;position:relative;width:80%}.DocSearch-Modal{border-radius:0;box-shadow:none;height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);margin:0;max-width:100%;width:100%}.DocSearch-Dropdown{max-height:calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))}.DocSearch-Cancel{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;flex:none;font:inherit;font-size:1em;font-weight:500;margin-left:var(--docsearch-spacing);outline:0;overflow:hidden;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.DocSearch-Commands,.DocSearch-Hit-Tree{display:none}}:root{--back-to-top-z-index:5;--back-to-top-color:#3eaf7c;--back-to-top-color-hover:#71cda3}.back-to-top{cursor:pointer;position:fixed;bottom:2rem;right:2.5rem;width:2rem;height:1.2rem;background-color:var(--back-to-top-color);-webkit-mask:url(/assets/back-to-top.8efcbe56.svg)no-repeat;mask:url(/assets/back-to-top.8efcbe56.svg)no-repeat;z-index:var(--back-to-top-z-index)}.back-to-top:hover{background-color:var(--back-to-top-color-hover)}@media (max-width:959px){.back-to-top{display:none}}.back-to-top-enter-active,.back-to-top-leave-active{transition:opacity .3s}.back-to-top-enter-from,.back-to-top-leave-to{opacity:0}:root{--nprogress-color:#29d;--nprogress-z-index:1031}#nprogress{pointer-events:none}#nprogress .bar{background:var(--nprogress-color);position:fixed;z-index:var(--nprogress-z-index);top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px var(--nprogress-color),0 0 5px var(--nprogress-color);opacity:1;transform:rotate(3deg) translateY(-4px)}.dp-custom-input{color:#1976d2}.dp-custom-input:hover{border-color:#1976d2}.dp-custom-input,.dp-custom-menu{box-shadow:0 0 6px #1976d2}.dp-custom-calendar .dp__calendar_item{border:1px solid var(--dp-border-color-hover)}.dp-custom-cell{border-radius:50%}.demo-wrap-inline{display:inline-block}.pointer{cursor:pointer}.red-color{color:red}.time-picker-overlay{display:flex;height:100%;flex-direction:column}.submit-btn{margin-top:15px}.custom-action-row{display:flex;align-items:center;justify-content:center;flex-direction:column}.current-selection{margin:10px 0 0}.select-button{display:block;background:0 0;border:1px solid var(--dp-success-color);color:var(--dp-success-color);border-radius:4px;padding:5px;margin:10px;cursor:pointer}.month-year-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box}.custom-month-year-component{display:flex;align-items:center;justify-content:flex-start}.select-input{margin:5px 3px;padding:5px;width:auto;border-radius:4px;border-color:var(--dp-border-color);outline:0}.icons{display:flex;box-sizing:border-box}.custom-icon{padding:5px;display:flex;height:25px;align-items:center;justify-content:center;cursor:pointer;width:25px;color:var(--dp-icon-color);text-align:center;border-radius:50%}.custom-icon svg{height:20px;width:20px}.custom-icon:hover{background:var(--dp-hover-color)}.custom-time-picker-component{display:flex;align-items:center;justify-content:center}.select-input{margin:5px 3px;padding:5px;width:100px;border-radius:4px;border-color:var(--dp-border-color);outline:0}
+:root{--external-link-icon-color:#aaa}.external-link-icon{position:relative;display:inline-block;color:var(--external-link-icon-color);vertical-align:middle;top:-1px}.external-link-icon-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:root{--medium-zoom-z-index:100;--medium-zoom-bg-color:#ffffff;--medium-zoom-opacity:1}.medium-zoom-overlay{background-color:var(--medium-zoom-bg-color)!important;z-index:var(--medium-zoom-z-index)}.medium-zoom-overlay~img{z-index:calc(var(--medium-zoom-z-index) + 1)}.medium-zoom--opened .medium-zoom-overlay{opacity:var(--medium-zoom-opacity)}:root{--c-brand:#3eaf7c;--c-brand-light:#4abf8a;--c-bg:#ffffff;--c-bg-light:#f3f4f5;--c-bg-lighter:#eeeeee;--c-bg-navbar:var(--c-bg);--c-bg-sidebar:var(--c-bg);--c-bg-arrow:#cccccc;--c-text:#2c3e50;--c-text-accent:var(--c-brand);--c-text-light:#3a5169;--c-text-lighter:#4e6e8e;--c-text-lightest:#6a8bad;--c-text-quote:#999999;--c-border:#eaecef;--c-border-dark:#dfe2e5;--c-tip:#42b983;--c-tip-bg:var(--c-bg-light);--c-tip-title:var(--c-text);--c-tip-text:var(--c-text);--c-tip-text-accent:var(--c-text-accent);--c-warning:#e7c000;--c-warning-bg:#fffae3;--c-warning-title:#ad9000;--c-warning-text:#746000;--c-warning-text-accent:var(--c-text);--c-danger:#cc0000;--c-danger-bg:#ffe0e0;--c-danger-title:#990000;--c-danger-text:#660000;--c-danger-text-accent:var(--c-text);--c-details-bg:#eeeeee;--c-badge-tip:var(--c-tip);--c-badge-warning:var(--c-warning);--c-badge-danger:var(--c-danger);--t-color:.3s ease;--t-transform:.3s ease;--code-bg-color:#282c34;--code-hl-bg-color:rgba(0, 0, 0, .66);--code-ln-color:#9e9e9e;--code-ln-wrapper-width:3.5rem;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code:Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;--navbar-height:3.6rem;--navbar-padding-v:.7rem;--navbar-padding-h:1.5rem;--sidebar-width:20rem;--sidebar-width-mobile:calc(var(--sidebar-width) * .82);--content-width:740px;--homepage-width:960px}.back-to-top{--back-to-top-color:var(--c-brand);--back-to-top-color-hover:var(--c-brand-light)}.DocSearch{--docsearch-primary-color:var(--c-brand);--docsearch-text-color:var(--c-text);--docsearch-highlight-color:var(--c-brand);--docsearch-muted-color:var(--c-text-quote);--docsearch-container-background:rgba(9, 10, 17, .8);--docsearch-modal-background:var(--c-bg-light);--docsearch-searchbox-background:var(--c-bg-lighter);--docsearch-searchbox-focus-background:var(--c-bg);--docsearch-searchbox-shadow:inset 0 0 0 2px var(--c-brand);--docsearch-hit-color:var(--c-text-light);--docsearch-hit-active-color:var(--c-bg);--docsearch-hit-background:var(--c-bg);--docsearch-hit-shadow:0 1px 3px 0 var(--c-border-dark);--docsearch-footer-background:var(--c-bg)}.external-link-icon{--external-link-icon-color:var(--c-text-quote)}.medium-zoom-overlay{--medium-zoom-bg-color:var(--c-bg)}#nprogress{--nprogress-color:var(--c-brand)}.pwa-popup{--pwa-popup-text-color:var(--c-text);--pwa-popup-bg-color:var(--c-bg);--pwa-popup-border-color:var(--c-brand);--pwa-popup-shadow:0 4px 16px var(--c-brand);--pwa-popup-btn-text-color:var(--c-bg);--pwa-popup-btn-bg-color:var(--c-brand);--pwa-popup-btn-hover-bg-color:var(--c-brand-light)}.search-box{--search-bg-color:var(--c-bg);--search-accent-color:var(--c-brand);--search-text-color:var(--c-text);--search-border-color:var(--c-border);--search-item-text-color:var(--c-text-lighter);--search-item-focus-bg-color:var(--c-bg-light)}html.dark{--c-brand:#3aa675;--c-brand-light:#349469;--c-bg:#22272e;--c-bg-light:#2b313a;--c-bg-lighter:#262c34;--c-text:#adbac7;--c-text-light:#96a7b7;--c-text-lighter:#8b9eb0;--c-text-lightest:#8094a8;--c-border:#3e4c5a;--c-border-dark:#34404c;--c-tip:#318a62;--c-warning:#ceab00;--c-warning-bg:#7e755b;--c-warning-title:#ceac03;--c-warning-text:#362e00;--c-danger:#940000;--c-danger-bg:#806161;--c-danger-title:#610000;--c-danger-text:#3a0000;--c-details-bg:#323843;--code-hl-bg-color:#363b46;color-scheme:dark}html.dark .DocSearch{--docsearch-logo-color:var(--c-text);--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40, 0 3px 8px 0 #000309;--docsearch-key-shadow:inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, .3);--docsearch-key-gradient:linear-gradient(-225deg, #444950, #1c1e21);--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73, 76, 106, .5), 0 -4px 8px 0 rgba(0, 0, 0, .2)}body,html{padding:0;margin:0;background-color:var(--c-bg);transition:background-color var(--t-color)}body{font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}a,p a code{color:var(--c-text-accent)}a{font-weight:500;text-decoration:none;overflow-wrap:break-word}p a code{font-weight:400}code,kbd{font-family:var(--font-family-code)}body,kbd{color:var(--c-text)}kbd{background:var(--c-bg-lighter);border:solid .15rem var(--c-border-dark);border-bottom:solid .25rem var(--c-border-dark);border-radius:.15rem;padding:0 .15em}code{color:var(--c-text-lighter);padding:.25rem .5rem;font-size:.85em;background-color:var(--c-bg-light);border-radius:3px;overflow-wrap:break-word;transition:background-color var(--t-color)}blockquote{font-size:1rem;color:var(--c-text-quote);border-left:.2rem solid var(--c-border-dark);margin:1rem 0;padding:.25rem 0 .25rem 1rem}blockquote>p,code{margin:0}ol,ul{padding-left:1.2em}strong{font-weight:600}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.25}h1:focus-visible,h2:focus-visible,h3:focus-visible,h4:focus-visible,h5:focus-visible,h6:focus-visible{outline:0}h1:hover .header-anchor,h2:hover .header-anchor,h3:hover .header-anchor,h4:hover .header-anchor,h5:hover .header-anchor,h6:hover .header-anchor{opacity:1}h1{font-size:2.2rem}h2{font-size:1.65rem;padding-bottom:.3rem;border-bottom:1px solid var(--c-border);transition:border-color var(--t-color)}h3{font-size:1.35rem}h4{font-size:1.15rem}h5{font-size:1.05rem}h6{font-size:1rem}a.header-anchor{font-size:.85em;float:left;margin-left:-.87em;padding-right:.23em;margin-top:.125em;opacity:0}a.header-anchor:hover{text-decoration:none}a.header-anchor:focus-visible{opacity:1}ol,p,ul{line-height:1.7}hr{border:0;border-top:1px solid var(--c-border)}table,tr{transition:border-color var(--t-color)}table{border-collapse:collapse;margin:1rem 0;display:block;overflow-x:auto}tr{border-top:1px solid var(--c-border-dark)}tr:nth-child(2n){background-color:var(--c-bg-light);transition:background-color var(--t-color)}td,th{padding:.6em 1em;border:1px solid var(--c-border-dark);transition:border-color var(--t-color)}.arrow,.badge{display:inline-block}.arrow{width:0;height:0}.arrow.down,.arrow.up{border-left:4px solid transparent;border-right:4px solid transparent}.arrow.up{border-bottom:6px solid var(--c-bg-arrow)}.arrow.down{border-top:6px solid var(--c-bg-arrow)}.arrow.left,.arrow.right{border-top:4px solid transparent;border-bottom:4px solid transparent}.arrow.right{border-left:6px solid var(--c-bg-arrow)}.arrow.left{border-right:6px solid var(--c-bg-arrow)}.badge{font-size:14px;height:18px;line-height:18px;border-radius:3px;padding:0 6px;color:var(--c-bg);vertical-align:top;transition:color var(--t-color),background-color var(--t-color)}.badge.tip{background-color:var(--c-badge-tip)}.badge.warning{background-color:var(--c-badge-warning)}.badge.danger{background-color:var(--c-badge-danger)}.badge+.badge{margin-left:5px}code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-family:var(--font-family-code);font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#ec5975}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:#3eaf7c}.theme-default-content pre,.theme-default-content pre[class*=language-]{line-height:1.4;padding:1.3rem 1.5rem;margin:.85rem 0;border-radius:6px;overflow:auto}.theme-default-content pre code,.theme-default-content pre[class*=language-] code{color:#fff;padding:0;background-color:transparent;border-radius:0;overflow-wrap:unset;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}.theme-default-content .line-number{font-family:var(--font-family-code)}div[class*=language-]{position:relative;background-color:var(--code-bg-color);border-radius:6px}div[class*=language-]:before{position:absolute;z-index:3;top:.8em;right:1em;font-size:.75rem;color:var(--code-ln-color)}div[class*=language-] pre,div[class*=language-] pre[class*=language-]{background:0 0!important;position:relative;z-index:1}div[class*=language-] .highlight-lines{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-top:1.3rem;position:absolute;top:0;left:0;width:100%;line-height:1.4}div[class*=language-] .highlight-lines .highlight-line{background-color:var(--code-hl-bg-color)}div[class*=language-]:not(.line-numbers-mode) .line-numbers{display:none}div[class*=language-].line-numbers-mode .highlight-lines .highlight-line{position:relative}div[class*=language-].line-numbers-mode .highlight-lines .highlight-line:before{content:" ";position:absolute;z-index:2;left:0;top:0;display:block;width:var(--code-ln-wrapper-width);height:100%}div[class*=language-].line-numbers-mode pre{margin-left:var(--code-ln-wrapper-width);padding-left:1rem;vertical-align:middle}div[class*=language-].line-numbers-mode .line-numbers{position:absolute;top:0;width:var(--code-ln-wrapper-width);text-align:center;color:var(--code-ln-color);padding-top:1.25rem;line-height:1.4}div[class*=language-].line-numbers-mode .line-numbers .line-number,div[class*=language-].line-numbers-mode .line-numbers br{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div[class*=language-].line-numbers-mode .line-numbers .line-number{position:relative;z-index:3;font-size:.85em;line-height:0}div[class*=language-].line-numbers-mode:after{content:"";position:absolute;top:0;left:0;width:var(--code-ln-wrapper-width);height:100%;border-radius:6px 0 0 6px;border-right:1px solid var(--code-hl-bg-color)}div[class*=language-].ext-c:before{content:"c"}div[class*=language-].ext-cpp:before{content:"cpp"}div[class*=language-].ext-cs:before{content:"cs"}div[class*=language-].ext-css:before{content:"css"}div[class*=language-].ext-dart:before{content:"dart"}div[class*=language-].ext-docker:before{content:"docker"}div[class*=language-].ext-fs:before{content:"fs"}div[class*=language-].ext-go:before{content:"go"}div[class*=language-].ext-html:before{content:"html"}div[class*=language-].ext-java:before{content:"java"}div[class*=language-].ext-js:before{content:"js"}div[class*=language-].ext-json:before{content:"json"}div[class*=language-].ext-kt:before{content:"kt"}div[class*=language-].ext-less:before{content:"less"}div[class*=language-].ext-makefile:before{content:"makefile"}div[class*=language-].ext-md:before{content:"md"}div[class*=language-].ext-php:before{content:"php"}div[class*=language-].ext-py:before{content:"py"}div[class*=language-].ext-rb:before{content:"rb"}div[class*=language-].ext-rs:before{content:"rs"}div[class*=language-].ext-sass:before{content:"sass"}div[class*=language-].ext-scss:before{content:"scss"}div[class*=language-].ext-sh:before{content:"sh"}div[class*=language-].ext-styl:before{content:"styl"}div[class*=language-].ext-ts:before{content:"ts"}div[class*=language-].ext-toml:before{content:"toml"}div[class*=language-].ext-vue:before{content:"vue"}div[class*=language-].ext-yml:before{content:"yml"}@media (max-width:419px){.theme-default-content div[class*=language-]{margin:.85rem -1.5rem;border-radius:0}}.code-group__nav{margin-top:.85rem;margin-bottom:calc(-1.7rem - 6px);padding-bottom:calc(1.7rem - 6px);padding-left:10px;padding-top:10px;border-top-left-radius:6px;border-top-right-radius:6px;background-color:var(--code-bg-color)}.code-group__ul{margin:auto 0;padding-left:0;display:inline-flex;list-style:none}.code-group__nav-tab{border:0;padding:5px;cursor:pointer;background-color:transparent;font-size:.85em;line-height:1.4;color:#ffffffe6;font-weight:600}.code-group__nav-tab:focus{outline:0}.code-group__nav-tab:focus-visible{outline:1px solid rgba(255,255,255,.9)}.code-group__nav-tab-active{border-bottom:var(--c-brand) 1px solid}@media (max-width:419px){.code-group__nav{margin-left:-1.5rem;margin-right:-1.5rem;border-radius:0}}.code-group-item,.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>a.router-link-active:after{display:none}.code-group-item__active{display:block}.code-group-item>pre{background-color:orange}.custom-container{transition:color var(--t-color),border-color var(--t-color),background-color var(--t-color)}.custom-container .custom-container-title{font-weight:600}.custom-container .custom-container-title:not(:only-child){margin-bottom:-.4rem}.custom-container.danger,.custom-container.tip,.custom-container.warning{padding:.1rem 1.5rem;border-left-width:.5rem;border-left-style:solid;margin:1rem 0}.custom-container.tip{border-color:var(--c-tip);background-color:var(--c-tip-bg);color:var(--c-tip-text)}.custom-container.tip .custom-container-title{color:var(--c-tip-title)}.custom-container.tip a{color:var(--c-tip-text-accent)}.custom-container.warning{border-color:var(--c-warning);background-color:var(--c-warning-bg);color:var(--c-warning-text)}.custom-container.warning .custom-container-title{color:var(--c-warning-title)}.custom-container.warning a{color:var(--c-warning-text-accent)}.custom-container.danger{border-color:var(--c-danger);background-color:var(--c-danger-bg);color:var(--c-danger-text)}.custom-container.danger .custom-container-title{color:var(--c-danger-title)}.custom-container.danger a{color:var(--c-danger-text-accent)}.custom-container.details{display:block;position:relative;border-radius:2px;margin:1.6em 0;padding:1.6em;background-color:var(--c-details-bg)}.custom-container.details h4{margin-top:0}.custom-container.details figure:last-child,.custom-container.details p:last-child{margin-bottom:0;padding-bottom:0}.custom-container.details summary{outline:0;cursor:pointer}.home{padding:var(--navbar-height) 2rem 0;max-width:var(--homepage-width);margin:0 auto;display:block}.home .hero{text-align:center}.home .hero img{max-width:100%;max-height:280px;display:block;margin:3rem auto 1.5rem}.home .hero h1{font-size:3rem}.home .hero .actions,.home .hero .description,.home .hero h1{margin:1.8rem auto}.home .hero .actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.home .hero .description{max-width:35rem;font-size:1.6rem;line-height:1.3;color:var(--c-text-lightest)}.home .hero .action-button{display:inline-block;font-size:1.2rem;padding:.8rem 1.6rem;border-width:2px;border-style:solid;border-radius:4px;transition:background-color var(--t-color);box-sizing:border-box}.home .hero .action-button.primary{color:var(--c-bg);background-color:var(--c-brand);border-color:var(--c-brand)}.home .hero .action-button.primary:hover{background-color:var(--c-brand-light)}.home .hero .action-button.secondary{color:var(--c-brand);background-color:var(--c-bg);border-color:var(--c-brand)}.home .hero .action-button.secondary:hover{color:var(--c-bg);background-color:var(--c-brand-light)}.home .features{border-top:1px solid var(--c-border);transition:border-color var(--t-color);padding:1.2rem 0;margin-top:2.5rem;display:flex;flex-wrap:wrap;align-items:flex-start;align-content:stretch;justify-content:space-between}.home .feature{flex-grow:1;flex-basis:30%;max-width:30%}.home .feature h2{font-size:1.4rem;font-weight:500;border-bottom:none;padding-bottom:0;color:var(--c-text-light)}.home .feature p,.home .footer{color:var(--c-text-lighter)}.home .footer{padding:2.5rem;border-top:1px solid var(--c-border);text-align:center;transition:border-color var(--t-color)}@media (max-width:719px){.home .features{flex-direction:column}.home .feature{max-width:100%;padding:0 2.5rem}}@media (max-width:419px){.home{padding-left:1.5rem;padding-right:1.5rem}.home .hero img{max-height:210px;margin:2rem auto 1.2rem}.home .hero h1{font-size:2rem}.home .hero .actions,.home .hero .description,.home .hero h1{margin:1.2rem auto}.home .hero .description{font-size:1.2rem}.home .hero .action-button{font-size:1rem;padding:.6rem 1.2rem}.home .feature h2{font-size:1.25rem}}.page{padding-top:var(--navbar-height);padding-left:var(--sidebar-width)}.navbar,.sidebar{position:fixed;left:0;box-sizing:border-box}.navbar{z-index:20;top:0;right:0;height:var(--navbar-height);border-bottom:1px solid var(--c-border);background-color:var(--c-bg-navbar);transition:background-color var(--t-color),border-color var(--t-color)}.sidebar{font-size:16px;width:var(--sidebar-width);z-index:10;margin:0;top:var(--navbar-height);bottom:0;border-right:1px solid var(--c-border);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--c-brand) var(--c-border);background-color:var(--c-bg-sidebar);transition:transform var(--t-transform),background-color var(--t-color),border-color var(--t-color)}.sidebar::-webkit-scrollbar{width:7px}.sidebar::-webkit-scrollbar-track{background-color:var(--c-border)}.sidebar::-webkit-scrollbar-thumb{background-color:var(--c-brand)}.sidebar-mask{position:fixed;z-index:9;top:0;left:0;width:100vw;height:100vh;display:none}.theme-container.sidebar-open .sidebar-mask{display:block}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(1){transform:rotate(45deg) translate3d(5.5px,5.5px,0)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(2){transform:scale3d(0,1,1)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(3){transform:rotate(-45deg) translate3d(6px,-6px,0)}.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(1),.theme-container.sidebar-open .navbar>.toggle-sidebar-button .icon span:nth-child(3){transform-origin:center}.theme-container.no-navbar .theme-default-content:not(.custom)>h1,.theme-container.no-navbar h2,.theme-container.no-navbar h3,.theme-container.no-navbar h4,.theme-container.no-navbar h5,.theme-container.no-navbar h6{margin-top:1.5rem;padding-top:0}.theme-container.no-navbar .page{padding-top:0}.theme-container.no-navbar .sidebar{top:0}@media (min-width:720px){.theme-container.no-sidebar .sidebar{display:none}.theme-container.no-sidebar .page{padding-left:0}}.theme-default-content:not(.custom)>h1,.theme-default-content:not(.custom)>h2,.theme-default-content:not(.custom)>h3,.theme-default-content:not(.custom)>h4,.theme-default-content:not(.custom)>h5,.theme-default-content:not(.custom)>h6{margin-top:calc(.5rem - var(--navbar-height));padding-top:calc(1rem + var(--navbar-height));margin-bottom:0}.theme-default-content:not(.custom)>h1:first-child,.theme-default-content:not(.custom)>h2:first-child,.theme-default-content:not(.custom)>h3:first-child,.theme-default-content:not(.custom)>h4:first-child,.theme-default-content:not(.custom)>h5:first-child,.theme-default-content:not(.custom)>h6:first-child{margin-bottom:1rem}.theme-default-content:not(.custom)>h1:first-child+.custom-container,.theme-default-content:not(.custom)>h1:first-child+p,.theme-default-content:not(.custom)>h1:first-child+pre,.theme-default-content:not(.custom)>h2:first-child+.custom-container,.theme-default-content:not(.custom)>h2:first-child+p,.theme-default-content:not(.custom)>h2:first-child+pre,.theme-default-content:not(.custom)>h3:first-child+.custom-container,.theme-default-content:not(.custom)>h3:first-child+p,.theme-default-content:not(.custom)>h3:first-child+pre,.theme-default-content:not(.custom)>h4:first-child+.custom-container,.theme-default-content:not(.custom)>h4:first-child+p,.theme-default-content:not(.custom)>h4:first-child+pre,.theme-default-content:not(.custom)>h5:first-child+.custom-container,.theme-default-content:not(.custom)>h5:first-child+p,.theme-default-content:not(.custom)>h5:first-child+pre,.theme-default-content:not(.custom)>h6:first-child+.custom-container,.theme-default-content:not(.custom)>h6:first-child+p,.theme-default-content:not(.custom)>h6:first-child+pre{margin-top:2rem}.theme-default-content:not(.custom){max-width:var(--content-width);margin:0 auto;padding:2rem 2.5rem;padding-top:0}@media (max-width:959px){.theme-default-content:not(.custom){padding:2rem}}@media (max-width:419px){.theme-default-content:not(.custom){padding:1.5rem}}.theme-default-content:not(.custom) a:hover{text-decoration:underline}.theme-default-content:not(.custom) img{max-width:100%}.theme-default-content.custom{padding:0;margin:0}.theme-default-content.custom img{max-width:100%}@media (max-width:959px){.sidebar{font-size:15px;width:var(--sidebar-width-mobile)}.page{padding-left:var(--sidebar-width-mobile)}}@media (max-width:719px){.sidebar{top:0;padding-top:var(--navbar-height);transform:translate(-100%)}.page{padding-left:0}.theme-container.sidebar-open .sidebar{transform:translate(0)}.theme-container.no-navbar .sidebar{padding-top:0}}@media (max-width:419px){h1{font-size:1.9rem}}.navbar{--navbar-line-height:calc( var(--navbar-height) - 2 * var(--navbar-padding-v) );padding:var(--navbar-padding-v) var(--navbar-padding-h);line-height:var(--navbar-line-height)}.navbar .logo{height:var(--navbar-line-height);margin-right:var(--navbar-padding-v);vertical-align:top}.navbar .site-name{font-size:1.3rem;font-weight:600;color:var(--c-text);position:relative}.navbar .navbar-items-wrapper{display:flex;position:absolute;box-sizing:border-box;top:var(--navbar-padding-v);right:var(--navbar-padding-h);height:var(--navbar-line-height);padding-left:var(--navbar-padding-h);white-space:nowrap;font-size:.9rem}.navbar .navbar-items-wrapper .search-box{flex:0 0 auto;vertical-align:top}@media (max-width:719px){.navbar{padding-left:4rem}.navbar .can-hide{display:none}.navbar .site-name{width:calc(100vw - 9.4rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}.navbar-items,.navbar-items a{display:inline-block}.navbar-items a{line-height:1.4rem;color:inherit}.navbar-items a.router-link-active,.navbar-items a:hover{color:var(--c-text-accent)}.navbar-items .navbar-item{position:relative;display:inline-block;margin-left:1.5rem;line-height:var(--navbar-line-height)}.navbar-items .navbar-item:first-child{margin-left:0}@media (max-width:719px){.navbar-items .navbar-item{margin-left:0}}@media (min-width:719px){.navbar-items a.router-link-active,.navbar-items a:hover{color:var(--c-text)}.navbar-item>a.router-link-active,.navbar-item>a:hover{margin-bottom:-2px;border-bottom:2px solid var(--c-text-accent)}}.toggle-sidebar-button{position:absolute;top:.6rem;left:1rem;display:none;padding:.6rem;cursor:pointer}.toggle-sidebar-button .icon{display:flex;flex-direction:column;justify-content:center;align-items:center;width:1.25rem;height:1.25rem;cursor:inherit}.toggle-sidebar-button .icon span{display:inline-block;width:100%;height:2px;border-radius:2px;background-color:var(--c-text);transition:transform var(--t-transform)}.toggle-sidebar-button .icon span:nth-child(2){margin:6px 0}@media screen and (max-width:719px){.toggle-sidebar-button{display:block}}.toggle-dark-button{display:flex;margin:auto;margin-left:1rem;border:0;background:0 0;color:var(--c-text);opacity:.8;cursor:pointer}.toggle-dark-button:hover{opacity:1}.toggle-dark-button .icon{width:1.25rem;height:1.25rem}.DocSearch{transition:background-color var(--t-color)}.navbar-dropdown-wrapper{cursor:pointer}.navbar-dropdown-wrapper .navbar-dropdown-title,.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:block;font-size:.9rem;font-family:inherit;cursor:inherit;padding:inherit;line-height:1.4rem;background:0 0;border:0;font-weight:500;color:var(--c-text)}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:none;font-weight:600;font-size:inherit}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile:hover,.navbar-dropdown-wrapper .navbar-dropdown-title:hover{border-color:transparent}.navbar-dropdown-wrapper .navbar-dropdown-title .arrow,.navbar-dropdown-wrapper .navbar-dropdown-title-mobile .arrow{vertical-align:middle;margin-top:-1px;margin-left:.4rem}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile:hover{color:var(--c-text-accent)}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item{color:inherit;line-height:1.7rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle{margin:.45rem 0 0;border-top:1px solid var(--c-border);padding:1rem 0 .45rem;font-size:.9rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>span{padding:0 1.5rem 0 1.25rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle>a{font-weight:inherit}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem-wrapper{padding:0;list-style:none}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem-wrapper .navbar-dropdown-subitem{font-size:.9em}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a{display:block;line-height:1.7rem;position:relative;border-bottom:none;font-weight:400;margin-bottom:0;padding:0 1.5rem 0 1.25rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active,.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a:hover{color:var(--c-text-accent)}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active:after{content:"";width:0;height:0;border-left:5px solid var(--c-text-accent);border-top:3px solid transparent;border-bottom:3px solid transparent;position:absolute;top:calc(50% - 2px);left:9px}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item:first-child .navbar-dropdown-subtitle{margin-top:0;padding-top:0;border-top:0}@media (max-width:719px){.navbar-dropdown-wrapper.open .navbar-dropdown-title,.navbar-dropdown-wrapper.open .navbar-dropdown-title-mobile{margin-bottom:.5rem}.navbar-dropdown-wrapper .navbar-dropdown-title{display:none}.navbar-dropdown-wrapper .navbar-dropdown-title-mobile{display:block}.navbar-dropdown-wrapper .navbar-dropdown{transition:height .1s ease-out;overflow:hidden}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subtitle{border-top:0;margin-top:0;padding-top:0;padding-bottom:0;font-size:15px;line-height:2rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item>a{font-size:15px;line-height:2rem}.navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item .navbar-dropdown-subitem{font-size:14px;padding-left:1rem}}@media (min-width:720px){.navbar-dropdown-wrapper{height:1.8rem}.navbar-dropdown-wrapper.open .navbar-dropdown,.navbar-dropdown-wrapper:hover .navbar-dropdown{display:block!important}.navbar-dropdown-wrapper.open:blur{display:none}.navbar-dropdown-wrapper .navbar-dropdown{display:none;height:auto!important;box-sizing:border-box;max-height:calc(100vh - 2.7rem);overflow-y:auto;position:absolute;top:100%;right:0;background-color:var(--c-bg-navbar);padding:.6rem 0;border:1px solid var(--c-border);border-bottom-color:var(--c-border-dark);text-align:left;border-radius:.25rem;white-space:nowrap;margin:0}}.page{padding-bottom:2rem;display:block}.page-meta{max-width:var(--content-width);margin:0 auto;padding:1rem 2.5rem;overflow:auto}@media (max-width:959px){.page-meta{padding:2rem}}@media (max-width:419px){.page-meta{padding:1.5rem}}.page-meta .meta-item{cursor:default;margin-top:.8rem}.page-meta .meta-item .meta-item-label{font-weight:500;color:var(--c-text-lighter)}.page-meta .meta-item .meta-item-info{font-weight:400;color:var(--c-text-quote)}.page-meta .edit-link{display:inline-block;margin-right:.25rem}.page-meta .last-updated{float:right}@media (max-width:719px){.page-meta .last-updated{font-size:.8em;float:none}.page-meta .contributors{font-size:.8em}}.page-nav{max-width:var(--content-width);margin:0 auto;padding:1rem 2.5rem 2rem;padding-bottom:0}@media (max-width:959px){.page-nav{padding:2rem}}@media (max-width:419px){.page-nav{padding:1.5rem}}.page-nav .inner{min-height:2rem;margin-top:0;border-top:1px solid var(--c-border);transition:border-color var(--t-color);padding-top:1rem;overflow:auto}.page-nav .prev a:before{content:"\2190"}.page-nav .next{float:right}.page-nav .next a:after{content:"\2192"}.sidebar ul{padding:0;margin:0;list-style-type:none}.sidebar a{display:inline-block}.sidebar .navbar-items{display:none;border-bottom:1px solid var(--c-border);transition:border-color var(--t-color);padding:.5rem 0 .75rem}.sidebar .navbar-items a{font-weight:600}.sidebar .navbar-items .navbar-item{display:block;line-height:1.25rem;font-size:1.1em;padding:.5rem 0 .5rem 1.5rem}.sidebar .sidebar-items{padding:1.5rem 0}@media (max-width:719px){.sidebar .navbar-items{display:block}.sidebar .navbar-items .navbar-dropdown-wrapper .navbar-dropdown .navbar-dropdown-item a.router-link-active:after{top:calc(1rem - 2px)}.sidebar .sidebar-items{padding:1rem 0}}.sidebar-item{cursor:default;border-left:.25rem solid transparent;color:var(--c-text)}.sidebar-item:focus-visible{outline-width:1px;outline-offset:-1px}.sidebar-item.active:not(p.sidebar-heading){font-weight:600;color:var(--c-text-accent);border-left-color:var(--c-text-accent)}.sidebar-item.sidebar-heading{transition:color .15s ease;font-size:1.1em;font-weight:700;padding:.35rem 1.5rem .35rem 1.25rem;width:100%;box-sizing:border-box;margin:0}.sidebar-item.sidebar-heading.collapsible,a.sidebar-item{cursor:pointer}.sidebar-item.sidebar-heading.collapsible+.sidebar-item-children{transition:height .1s ease-out;overflow:hidden;margin-bottom:.75rem}.sidebar-item.sidebar-heading .arrow{position:relative;top:-.12em;left:.5em}.sidebar-item:not(.sidebar-heading){font-size:1em;font-weight:400;display:inline-block;margin:0;padding:.35rem 1rem .35rem 2rem;line-height:1.4;width:100%;box-sizing:border-box}.sidebar-item:not(.sidebar-heading)+.sidebar-item-children{padding-left:1rem;font-size:.95em}.sidebar-item-children .sidebar-item-children .sidebar-item:not(.sidebar-heading){padding:.25rem 1rem .25rem 1.75rem}.sidebar-item-children .sidebar-item-children .sidebar-item:not(.sidebar-heading).active{font-weight:500;border-left-color:transparent}a.sidebar-heading+.sidebar-item-children .sidebar-item:not(.sidebar-heading).active{border-left-color:transparent}a.sidebar-item:hover{color:var(--c-text-accent)}.table-of-contents .badge{vertical-align:middle}.dropdown-enter-from,.dropdown-leave-to{height:0!important}.fade-slide-y-enter-active{transition:all .2s ease}.fade-slide-y-leave-active{transition:all .2s cubic-bezier(1,.5,.8,1)}.fade-slide-y-enter-from,.fade-slide-y-leave-to{transform:translateY(10px);opacity:0}.dp__input_wrap{position:relative;width:100%;box-sizing:unset}.dp__input_wrap:focus{border-color:var(--dp-border-color-hover);outline:0}.dp__input{background-color:var(--dp-background-color);border-radius:4px;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;border:1px solid var(--dp-border-color);outline:0;transition:border-color .2s cubic-bezier(.645,.045,.355,1);width:100%;font-size:1rem;line-height:1.5rem;padding:6px 12px;color:var(--dp-text-color);box-sizing:border-box}.dp__input::-moz-placeholder{opacity:.7}.dp__input:-ms-input-placeholder{opacity:.7}.dp__input::placeholder{opacity:.7}.dp__input:hover,.dp__input_focus{border-color:var(--dp-border-color-hover)}.dp__disabled{background:var(--dp-disabled-color)}.dp__disabled::-moz-placeholder{color:var(--dp-disabled-color-text)}.dp__disabled:-ms-input-placeholder{color:var(--dp-disabled-color-text)}.dp__disabled::placeholder{color:var(--dp-disabled-color-text)}.dp__input_icons{display:inline-block;width:1rem;height:1rem;stroke-width:0;font-size:1rem;line-height:1.5rem;padding:6px 12px;color:var(--dp-icon-color);box-sizing:content-box}.dp__clear_icon,.dp__input_icon{position:absolute;top:50%;transform:translateY(-50%);color:var(--dp-icon-color)}.dp__input_icon{left:0}.dp__clear_icon{right:0;cursor:pointer}.dp__input_icon_pad{padding-left:35px}.dp__input_valid{box-shadow:0 0 4px var(--dp-success-color)}.dp__input_valid,.dp__input_valid:hover{border-color:var(--dp-success-color)}.dp__input_invalid{box-shadow:0 0 4px var(--dp-danger-color)}.dp__input_invalid,.dp__input_invalid:hover{border-color:var(--dp-danger-color)}.dp__menu{position:absolute;background:var(--dp-background-color);border-radius:4px;min-width:260px;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid var(--dp-menu-border-color)}.dp__menu,.dp__menu:after,.dp__menu:before{box-sizing:border-box}.dp__menu:focus{border:1px solid var(--dp-menu-border-color);outline:0}.dp__menu_index{z-index:99999}.dp__menu_disabled,.dp__menu_readonly{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.dp__menu_disabled{background:rgba(255,255,255,.5);cursor:not-allowed}.dp__menu_readonly{background:0 0;cursor:default}.dp__arrow_bottom,.dp__arrow_top{left:50%;height:12px;width:12px;background-color:var(--dp-background-color);position:absolute}.dp__arrow_top{top:-1px;border-left:1px solid var(--dp-menu-border-color);border-top:1px solid var(--dp-menu-border-color);transform:translate(-50%,-50%) rotate(45deg)}.dp__arrow_bottom{bottom:-1px;border-right:1px solid var(--dp-menu-border-color);border-bottom:1px solid var(--dp-menu-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__now_wrap{text-align:center;padding:2px 0}.dp__now_button{border:1px solid var(--dp-primary-color);color:var(--dp-primary-color);padding:0 4px;font-weight:700;border-radius:4px;font-size:1rem;cursor:pointer;background:0 0}.dp__preset_ranges{padding:5px;border-right:1px solid var(--dp-border-color)}.dp__preset_range{padding:5px}.dp__preset_range:hover{background-color:var(--dp-hover-color);cursor:pointer}.dp__menu_content_wrapper{display:flex}.db__calendar_header,.dp__calendar_wrap{display:flex;justify-content:center;align-items:center}.dp__calendar_wrap{flex-direction:column;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;flex:0}.db__calendar_header{position:relative;color:var(--dp-text-color);white-space:nowrap;font-weight:700}.dp__calendar_header_item{text-align:center;flex-grow:1;height:35px;padding:5px;width:35px;box-sizing:border-box}.dp__calendar_row{display:flex;justify-content:center;align-items:center;margin:5px 0}.dp__calendar_item{text-align:center;flex-grow:1;box-sizing:border-box;color:var(--dp-text-color)}.dp__calendar{position:relative}.dp__calendar_header_cell{border-bottom:thin solid var(--dp-border-color);padding:.5rem}.dp__cell_inner{display:flex;align-items:center;text-align:center;justify-content:center;border-radius:4px;height:35px;padding:5px;width:35px;border:1px solid transparent;box-sizing:border-box;position:relative}.dp__cell_auto_range_start,.dp__date_hover_start:hover,.dp__range_start{border-bottom-right-radius:0;border-top-right-radius:0}.dp__cell_auto_range_end,.dp__date_hover_end:hover,.dp__range_end{border-bottom-left-radius:0;border-top-left-radius:0}.dp__active_date,.dp__range_end,.dp__range_start{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__cell_auto_range_end,.dp__cell_auto_range_start{border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__date_hover:hover,.dp__date_hover_end:hover,.dp__date_hover_start:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__cell_disabled,.dp__cell_offset{color:var(--dp-secondary-color)}.dp__cell_disabled{cursor:not-allowed}.dp__range_between{background:var(--dp-hover-color);border-radius:0;border-top:1px solid var(--dp-hover-color);border-bottom:1px solid var(--dp-hover-color)}.dp__today{border:1px solid var(--dp-primary-color)}.dp__week_num{color:var(--dp-secondary-color);text-align:center}.dp__cell_auto_range{border-radius:0;border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_start{border-left:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_end{border-right:1px dashed var(--dp-primary-color)}.dp__calendar_header_separator{width:100%;height:1px;background:var(--dp-border-color)}.dp__calendar_next{margin-left:10px}.dp__marker_dot,.dp__marker_line{height:5px;background-color:var(--dp-marker-color);position:absolute;bottom:0}.dp__marker_dot{width:5px;border-radius:50%;left:50%;transform:translate(-50%)}.dp__marker_line{width:100%;left:0}.dp__marker_tooltip{position:absolute;border-radius:4px;background-color:var(--dp-tooltip-color);padding:5px;border:1px solid var(--dp-border-color);z-index:99999;box-sizing:border-box;cursor:default}.dp__tooltip_content{white-space:nowrap}.dp__tooltip_text{display:flex;align-items:center;flex-flow:row nowrap;color:var(--dp-text-color)}.dp__tooltip_mark{height:5px;width:5px;border-radius:50%;background-color:var(--dp-text-color);color:var(--dp-text-color);margin-right:5px}.dp__arrow_bottom_tp{left:50%;bottom:0;height:8px;width:8px;background-color:var(--dp-tooltip-color);position:absolute;border-right:1px solid var(--dp-border-color);border-bottom:1px solid var(--dp-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__instance_calendar{position:relative}@media only screen and (max-width:600px){.dp__flex_display{flex-direction:column}}.dp__month_year_row{display:flex;align-items:center;height:35px;color:var(--dp-text-color);box-sizing:border-box}.dp__inner_nav,.dp__month_year_select{text-align:center;cursor:pointer;display:flex;align-items:center;justify-content:center}.dp__inner_nav{height:25px;width:25px;color:var(--dp-icon-color);border-radius:50%}.dp__inner_nav svg{height:20px;width:20px}.dp__inner_nav:hover,.dp__month_year_select:hover{background:var(--dp-hover-color);color:var(--dp-hover-icon-color)}.dp__month_year_select{width:50%;height:35px;border-radius:4px;box-sizing:border-box}.dp__month_year_select:hover{color:var(--dp-hover-text-color)}.dp__overlay{position:absolute;overflow-y:auto;width:100%;height:100%;background:var(--dp-background-color);top:0;left:0;transition:opacity 1s ease-out;z-index:99999;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;color:var(--dp-text-color);box-sizing:border-box}.dp__overlay::-webkit-scrollbar-track{box-shadow:var(--dp-scroll-bar-background);background-color:var(--dp-scroll-bar-background)}.dp__overlay::-webkit-scrollbar{width:5px;background-color:var(--dp-scroll-bar-background)}.dp__overlay::-webkit-scrollbar-thumb{background-color:var(--dp-scroll-bar-color);border-radius:10px}.dp__overlay:focus{border:0;outline:0}.dp__overlay_container{display:flex;height:100%;flex-direction:column}.dp__overlay_row{padding:0;box-sizing:border-box;display:flex;margin-left:auto;margin-right:auto;flex-wrap:wrap;max-width:100%;width:100%;align-items:center}.dp__overlay_container>.dp__overlay_row{flex:1}.dp__overlay_col{box-sizing:border-box;width:33%;padding:3px;white-space:nowrap}.dp__overlay_cell_pad{padding:10px 0}.dp__overlay_cell_active{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__overlay_cell,.dp__overlay_cell_active{cursor:pointer;border-radius:4px;text-align:center}.dp__cell_in_between,.dp__overlay_cell:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__overlay_action{position:-webkit-sticky;position:sticky;bottom:0;background:#fff}.dp__over_action_scroll{right:5px;box-sizing:border-box}.dp__overlay_cell_disabled{cursor:not-allowed}.dp__overlay_cell_disabled,.dp__overlay_cell_disabled:hover{background:var(--dp-disabled-color)}.dp__overlay_cell_active_disabled{cursor:not-allowed}.dp__overlay_cell_active_disabled,.dp__overlay_cell_active_disabled:hover{background:var(--dp-primary-disabled-color)}.dp__month_picker_header,.dp__time_input{width:100%;display:flex;align-items:center}.dp__month_picker_header{justify-content:space-between;height:35px}.dp__time_input{justify-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;color:var(--dp-text-color)}.dp__time_col_reg{padding:0 20px}.dp__time_col_reg_with_button{padding:0 15px}.dp__time_col_sec{padding:0 10px}.dp__time_col_sec_with_button{padding:0 5px}.dp__inc_dec_button,.dp__time_col,.dp__time_display{display:flex;align-items:center;justify-content:center}.dp__time_col{font-size:2rem;text-align:center;flex-direction:column}.dp__inc_dec_button,.dp__time_display{cursor:pointer;color:var(--dp-text-color);border-radius:4px;padding:0 3px}.dp__time_display:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__inc_dec_button{padding:5px;margin:0;border-radius:50%;color:var(--dp-icon-color);box-sizing:border-box}.dp__inc_dec_button,.dp__inc_dec_button svg{height:32px;width:32px}.dp__button:hover,.dp__inc_dec_button:hover{background:var(--dp-hover-color);color:var(--dp-primary-color)}.dp__pm_am_button{background:var(--dp-primary-color);color:var(--dp-primary-text-color);border:0;padding:10px;border-radius:4px;cursor:pointer}.dp__action_row{display:flex;align-items:center;width:100%;padding:10px;box-sizing:border-box;color:var(--dp-text-color);background:var(--dp-background-color)}.dp__action_row svg,.dp__button svg{height:20px;width:auto}.dp__selection_preview{width:50%;color:var(--dp-text-color);font-size:.8rem}.dp__action_buttons{width:50%;text-align:right}.dp__action{font-weight:700;cursor:pointer;padding:2px 5px;border-radius:4px;display:inline-flex;align-items:center}.dp__select{color:var(--dp-success-color)}.dp__action_disabled{color:var(--dp-success-color-disabled);cursor:not-allowed}.dp__cancel{color:var(--dp-secondary-color)}.dp__theme_dark{--dp-text-color:#fff;--dp-hover-text-color:#fff;--dp-hover-icon-color:#959595;--dp-primary-disabled-color:#61a8ea;--dp-primary-text-color:#fff;--dp-menu-border-color:#2d2d2d;--dp-success-color-disabled:#428f59;--dp-marker-color:#e53935;--dp-tooltip-color:#3e3e3e}.dp__theme_light{--dp-background-color:#fff;--dp-hover-text-color:#212121;--dp-hover-icon-color:#959595;--dp-primary-disabled-color:#6bacea;--dp-menu-border-color:#ddd;--dp-success-color-disabled:#a3d9b1;--dp-marker-color:#ff6f60;--dp-tooltip-color:#fafafa}.dp__main{font-family:-apple-system,blinkmacsystemfont,Segoe UI,roboto,oxygen,ubuntu,cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box}.dp__pointer{cursor:pointer}.dp__icon{stroke:currentcolor;fill:currentcolor}.dp__button{width:100%;text-align:center;color:var(--dp-icon-color);background:var(--dp-background-color);cursor:pointer;display:flex;align-items:center;align-content:center;justify-content:center;padding:10px;box-sizing:border-box;height:35px}.dp__button:hover{color:var(--dp-hover-icon-color)}.dp__button_bottom{border-bottom-left-radius:4px;border-bottom-right-radius:4px}.dp__flex_display{display:flex}.dp__flex_display_with_input{flex-direction:column;align-items:start}.dp__relative{position:relative}.calendar-next-enter-active,.calendar-next-leave-active,.calendar-prev-enter-active,.calendar-prev-leave-active{transition:all .1s ease-out}.calendar-next-enter-from{opacity:0;transform:translate(22px)}.calendar-next-leave-to,.calendar-prev-enter-from{opacity:0;transform:translate(-22px)}.calendar-prev-leave-to{opacity:0;transform:translate(22px)}.dp-menu-appear-enter-active,.dp-menu-appear-leave-active,.dp-slide-down-enter-active,.dp-slide-down-leave-active,.dp-slide-up-enter-active,.dp-slide-up-leave-active{transition:all .1s ease-out}.dp-slide-down-leave-to,.dp-slide-up-enter-from{opacity:0;transform:translateY(22px)}.dp-slide-down-enter-from,.dp-slide-up-leave-to{opacity:0;transform:translateY(-22px)}.dp-menu-appear-enter-from{opacity:0}.dp-menu-appear-leave-to{opacity:1}.demo-wrap{position:relative}caption,table,tbody,td,tfoot,th,thead,tr{all:revert}tr:nth-child(even){background:0 0}.line-numbers{z-index:0}.custom-select{cursor:pointer;color:var(--c-text-accent);margin:0;display:inline-block}.clickable-text{color:#1976d2;cursor:pointer}.input-slot-image{height:20px;width:auto;margin-left:5px}.input-slot-image-clear{height:20px;width:auto;margin-right:5px}.slot-icon,.slot-icon-m{height:20px;width:auto}.slot-icon-m{margin:0 auto}.dp__theme_dark,.dp__theme_light{--dp-border-color-hover:#aaaeb7;--dp-icon-color:#959595}.dp__theme_dark{--dp-background-color:#212121;--dp-text-color:#ffffff;--dp-hover-color:#484848;--dp-primary-color:#005cb2;--dp-primary-text-color:#ffffff;--dp-secondary-color:#a9a9a9;--dp-border-color:#2d2d2d;--dp-disabled-color:#737373;--dp-disabled-color-text:#d0d0d0;--dp-scroll-bar-background:#212121;--dp-scroll-bar-color:#484848;--dp-success-color:#00701a;--dp-danger-color:#e53935}.dp__theme_light{--dp-background-color:#ffffff;--dp-text-color:#212121;--dp-hover-color:#f3f3f3;--dp-primary-color:#1976d2;--dp-primary-text-color:#f8f5f5;--dp-secondary-color:#c0c4cc;--dp-border-color:#ddd;--dp-disabled-color:#f6f6f6;--dp-scroll-bar-background:#f3f3f3;--dp-scroll-bar-color:#959595;--dp-success-color:#76d275;--dp-danger-color:#ff6f60;--dp-disabled-color-text:#8e8e8e}/*! @docsearch/css 3.0.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */@-webkit-keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}:root{--docsearch-primary-color:#5468ff;--docsearch-text-color:#1c1e21;--docsearch-spacing:12px;--docsearch-icon-stroke-width:1.4;--docsearch-highlight-color:var(--docsearch-primary-color);--docsearch-muted-color:#969faf;--docsearch-container-background:rgba(101,108,133,.8);--docsearch-logo-color:#5468ff;--docsearch-modal-width:560px;--docsearch-modal-height:600px;--docsearch-modal-background:#f5f6f7;--docsearch-modal-shadow:inset 1px 1px 0 0 hsla(0,0%,100%,.5),0 3px 8px 0 #555a64;--docsearch-searchbox-height:56px;--docsearch-searchbox-background:#ebedf0;--docsearch-searchbox-focus-background:#fff;--docsearch-searchbox-shadow:inset 0 0 0 2px var(--docsearch-primary-color);--docsearch-hit-height:56px;--docsearch-hit-color:#444950;--docsearch-hit-active-color:#fff;--docsearch-hit-background:#fff;--docsearch-hit-shadow:0 1px 3px 0 #d4d9e1;--docsearch-key-gradient:linear-gradient(-225deg,#d5dbe4,#f8f8f8);--docsearch-key-shadow:inset 0 -2px 0 0 #cdcde6,inset 0 0 1px 1px #fff,0 1px 2px 1px rgba(30,35,90,.4);--docsearch-footer-height:44px;--docsearch-footer-background:#fff;--docsearch-footer-shadow:0 -1px 0 0 #e0e3e8,0 -3px 6px 0 rgba(69,98,155,.12)}html[data-theme=dark]{--docsearch-text-color:#f5f6f7;--docsearch-container-background:rgba(9,10,17,.8);--docsearch-modal-background:#15172a;--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--docsearch-searchbox-background:#090a11;--docsearch-searchbox-focus-background:#000;--docsearch-hit-color:#bec3c9;--docsearch-hit-shadow:none;--docsearch-hit-background:#090a11;--docsearch-key-gradient:linear-gradient(-26.5deg,#565872,#31355b);--docsearch-key-shadow:inset 0 -2px 0 0 #282d55,inset 0 0 1px 1px #51577d,0 2px 2px 0 rgba(3,4,9,.3);--docsearch-footer-background:#1e2136;--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73,76,106,.5),0 -4px 8px 0 rgba(0,0,0,.2);--docsearch-logo-color:#fff;--docsearch-muted-color:#7f8497}.DocSearch-Button{align-items:center;background:var(--docsearch-searchbox-background);border:0;border-radius:40px;color:var(--docsearch-muted-color);cursor:pointer;display:flex;font-weight:500;height:36px;justify-content:space-between;margin:0 0 0 16px;padding:0 8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DocSearch-Button:active,.DocSearch-Button:focus,.DocSearch-Button:hover{background:var(--docsearch-searchbox-focus-background);box-shadow:var(--docsearch-searchbox-shadow);color:var(--docsearch-text-color);outline:0}.DocSearch-Button-Container{align-items:center;display:flex}.DocSearch-Search-Icon{stroke-width:1.6}.DocSearch-Button .DocSearch-Search-Icon{color:var(--docsearch-text-color)}.DocSearch-Button-Placeholder{font-size:1rem;padding:0 12px 0 6px}.DocSearch-Button-Keys{display:flex;min-width:calc(40px + .8em)}.DocSearch-Button-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:3px;box-shadow:var(--docsearch-key-shadow);color:var(--docsearch-muted-color);display:flex;height:18px;justify-content:center;margin-right:.4em;padding-bottom:2px;position:relative;top:-1px;width:20px}@media (max-width:750px){.DocSearch-Button-Keys,.DocSearch-Button-Placeholder{display:none}}.DocSearch--active{overflow:hidden!important}.DocSearch-Container,.DocSearch-Container *{box-sizing:border-box}.DocSearch-Container{background-color:var(--docsearch-container-background);height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:200}.DocSearch-Container a{text-decoration:none}.DocSearch-Link{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-highlight-color);cursor:pointer;font:inherit;margin:0;padding:0}.DocSearch-Modal{background:var(--docsearch-modal-background);border-radius:6px;box-shadow:var(--docsearch-modal-shadow);flex-direction:column;margin:60px auto auto;max-width:var(--docsearch-modal-width);position:relative}.DocSearch-SearchBar{display:flex;padding:var(--docsearch-spacing) var(--docsearch-spacing)0}.DocSearch-Form{align-items:center;background:var(--docsearch-searchbox-focus-background);border-radius:4px;box-shadow:var(--docsearch-searchbox-shadow);display:flex;height:var(--docsearch-searchbox-height);margin:0;padding:0 var(--docsearch-spacing);position:relative;width:100%}.DocSearch-Input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-text-color);flex:1;font:inherit;font-size:1.2em;height:100%;outline:0;padding:0 0 0 8px;width:80%}.DocSearch-Input::-moz-placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input:-ms-input-placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::-webkit-search-cancel-button,.DocSearch-Input::-webkit-search-decoration,.DocSearch-Input::-webkit-search-results-button,.DocSearch-Input::-webkit-search-results-decoration{display:none}.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel{margin:0;padding:0}.DocSearch-Reset{margin:0}.DocSearch-MagnifierLabel{color:var(--docsearch-highlight-color)}.DocSearch-MagnifierLabel,.DocSearch-Reset{align-items:center;display:flex;justify-content:center}.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,.DocSearch-LoadingIndicator{display:none}.DocSearch-Container--Stalled .DocSearch-LoadingIndicator{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Reset{-webkit-animation:none;animation:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;right:0;stroke-width:var(--docsearch-icon-stroke-width)}}.DocSearch-Reset{-webkit-animation:fade-in .1s ease-in forwards;animation:fade-in .1s ease-in forwards;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;padding:2px;right:0;stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Cancel,.DocSearch-Reset[hidden]{display:none}.DocSearch-Reset:focus{outline:0}.DocSearch-Reset:hover{color:var(--docsearch-highlight-color)}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{height:24px;width:24px}.DocSearch-Dropdown{max-height:calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));min-height:var(--docsearch-spacing);overflow-y:overlay;padding:0 var(--docsearch-spacing);scrollbar-color:var(--docsearch-muted-color) var(--docsearch-modal-background);scrollbar-width:thin}.DocSearch-Dropdown::-webkit-scrollbar{width:12px}.DocSearch-Dropdown::-webkit-scrollbar-track{background:0 0}.DocSearch-Dropdown::-webkit-scrollbar-thumb{background-color:var(--docsearch-muted-color);border:3px solid var(--docsearch-modal-background);border-radius:20px}.DocSearch-Dropdown ul{list-style:none;margin:0;padding:0}.DocSearch-Label{font-size:.75em;line-height:1.6em}.DocSearch-Help,.DocSearch-Label{color:var(--docsearch-muted-color)}.DocSearch-Help{font-size:.9em;margin:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.DocSearch-Title{font-size:1.2em}.DocSearch-Logo a{display:flex}.DocSearch-Logo svg{color:var(--docsearch-logo-color);margin-left:8px}.DocSearch-Hits:last-of-type{margin-bottom:24px}.DocSearch-Hits mark{background:0 0;color:var(--docsearch-highlight-color)}.DocSearch-HitsFooter{color:var(--docsearch-muted-color);display:flex;font-size:.85em;justify-content:center;margin-bottom:var(--docsearch-spacing);padding:var(--docsearch-spacing)}.DocSearch-HitsFooter a{border-bottom:1px solid;color:inherit}.DocSearch-Hit{border-radius:4px;display:flex;padding-bottom:4px;position:relative}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--deleting{transition:none}}.DocSearch-Hit--deleting{opacity:0;transition:all .25s linear}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--favoriting{transition:none}}.DocSearch-Hit--favoriting{transform:scale(0);transform-origin:top center;transition:all .25s linear;transition-delay:.25s}.DocSearch-Hit a{background:var(--docsearch-hit-background);border-radius:4px;box-shadow:var(--docsearch-hit-shadow);display:block;padding-left:var(--docsearch-spacing);width:100%}.DocSearch-Hit-source{background:var(--docsearch-modal-background);color:var(--docsearch-highlight-color);font-size:.85em;font-weight:600;line-height:32px;margin:0 -4px;padding:8px 4px 0;position:-webkit-sticky;position:sticky;top:0;z-index:10}.DocSearch-Hit-Tree{color:var(--docsearch-muted-color);height:var(--docsearch-hit-height);opacity:.5;stroke-width:var(--docsearch-icon-stroke-width);width:24px}.DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-highlight-color)}.DocSearch-Hit[aria-selected=true] mark{text-decoration:underline}.DocSearch-Hit-Container{align-items:center;color:var(--docsearch-hit-color);display:flex;flex-direction:row;height:var(--docsearch-hit-height);padding:0 var(--docsearch-spacing)0 0}.DocSearch-Hit-icon{height:20px;width:20px}.DocSearch-Hit-action,.DocSearch-Hit-icon{color:var(--docsearch-muted-color);stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Hit-action{align-items:center;display:flex;height:22px;width:22px}.DocSearch-Hit-action svg{display:block;height:18px;width:18px}.DocSearch-Hit-action+.DocSearch-Hit-action{margin-left:6px}.DocSearch-Hit-action-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:50%;color:inherit;cursor:pointer;padding:2px}svg.DocSearch-Hit-Select-Icon{display:none}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon{display:block}.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:background-color .1s ease-in}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{transition:none}}.DocSearch-Hit-action-button:focus path,.DocSearch-Hit-action-button:hover path{fill:#fff}.DocSearch-Hit-content-wrapper{display:flex;flex:1 1 auto;flex-direction:column;font-weight:500;justify-content:center;line-height:1.2em;margin:0 8px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-title{font-size:.9em}.DocSearch-Hit-path{color:var(--docsearch-muted-color);font-size:.75em}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,.DocSearch-Hit[aria-selected=true] mark{color:var(--docsearch-hit-active-color)!important}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:none}}.DocSearch-ErrorScreen,.DocSearch-NoResults,.DocSearch-StartScreen{font-size:.9em;margin:0 auto;padding:36px 0;text-align:center;width:80%}.DocSearch-Screen-Icon{color:var(--docsearch-muted-color);padding-bottom:12px}.DocSearch-NoResults-Prefill-List{display:inline-block;padding-bottom:24px;text-align:left}.DocSearch-NoResults-Prefill-List ul,.DocSearch-Prefill{display:inline-block;padding:8px 0 0}.DocSearch-NoResults-Prefill-List li{list-style-position:inside;list-style-type:"\bb  "}.DocSearch-Prefill{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;border-radius:1em;color:var(--docsearch-highlight-color);cursor:pointer;font-size:1em;font-weight:700;padding:0}.DocSearch-Prefill:focus,.DocSearch-Prefill:hover{outline:0;text-decoration:underline}.DocSearch-Footer{align-items:center;background:var(--docsearch-footer-background);border-radius:0 0 8px 8px;box-shadow:var(--docsearch-footer-shadow);display:flex;flex-direction:row-reverse;flex-shrink:0;height:var(--docsearch-footer-height);justify-content:space-between;padding:0 var(--docsearch-spacing);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%;z-index:300}.DocSearch-Commands{color:var(--docsearch-muted-color);display:flex;list-style:none;margin:0;padding:0}.DocSearch-Commands li{align-items:center;display:flex}.DocSearch-Commands li:not(:last-of-type){margin-right:.8em}.DocSearch-Commands-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:2px;box-shadow:var(--docsearch-key-shadow);display:flex;height:18px;justify-content:center;margin-right:.4em;padding-bottom:1px;width:20px}@media (max-width:750px){:root{--docsearch-spacing:10px;--docsearch-footer-height:40px}.DocSearch-Dropdown{height:100%}.DocSearch-Container{height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);position:absolute}.DocSearch-Footer{border-radius:0;bottom:0;position:absolute}.DocSearch-Hit-content-wrapper{display:flex;position:relative;width:80%}.DocSearch-Modal{border-radius:0;box-shadow:none;height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);margin:0;max-width:100%;width:100%}.DocSearch-Dropdown{max-height:calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))}.DocSearch-Cancel{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:0;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;flex:none;font:inherit;font-size:1em;font-weight:500;margin-left:var(--docsearch-spacing);outline:0;overflow:hidden;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.DocSearch-Commands,.DocSearch-Hit-Tree{display:none}}:root{--back-to-top-z-index:5;--back-to-top-color:#3eaf7c;--back-to-top-color-hover:#71cda3}.back-to-top{cursor:pointer;position:fixed;bottom:2rem;right:2.5rem;width:2rem;height:1.2rem;background-color:var(--back-to-top-color);-webkit-mask:url(/assets/back-to-top.8efcbe56.svg)no-repeat;mask:url(/assets/back-to-top.8efcbe56.svg)no-repeat;z-index:var(--back-to-top-z-index)}.back-to-top:hover{background-color:var(--back-to-top-color-hover)}@media (max-width:959px){.back-to-top{display:none}}.back-to-top-enter-active,.back-to-top-leave-active{transition:opacity .3s}.back-to-top-enter-from,.back-to-top-leave-to{opacity:0}:root{--nprogress-color:#29d;--nprogress-z-index:1031}#nprogress{pointer-events:none}#nprogress .bar{background:var(--nprogress-color);position:fixed;z-index:var(--nprogress-z-index);top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px var(--nprogress-color),0 0 5px var(--nprogress-color);opacity:1;transform:rotate(3deg) translateY(-4px)}.dp-custom-input{color:#1976d2}.dp-custom-input:hover{border-color:#1976d2}.dp-custom-input,.dp-custom-menu{box-shadow:0 0 6px #1976d2}.dp-custom-calendar .dp__calendar_item{border:1px solid var(--dp-border-color-hover)}.dp-custom-cell{border-radius:50%}.demo-wrap-inline{display:inline-block}.pointer{cursor:pointer}.red-color{color:red}.time-picker-overlay{display:flex;height:100%;flex-direction:column}.submit-btn{margin-top:15px}.custom-action-row{display:flex;align-items:center;justify-content:center;flex-direction:column}.current-selection{margin:10px 0 0}.select-button{display:block;background:0 0;border:1px solid var(--dp-success-color);color:var(--dp-success-color);border-radius:4px;padding:5px;margin:10px;cursor:pointer}.month-year-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box}.custom-month-year-component{display:flex;align-items:center;justify-content:flex-start}.select-input{margin:5px 3px;padding:5px;width:auto;border-radius:4px;border-color:var(--dp-border-color);outline:0}.icons{display:flex;box-sizing:border-box}.custom-icon{padding:5px;display:flex;height:25px;align-items:center;justify-content:center;cursor:pointer;width:25px;color:var(--dp-icon-color);text-align:center;border-radius:50%}.custom-icon svg{height:20px;width:20px}.custom-icon:hover{background:var(--dp-hover-color)}.custom-time-picker-component{display:flex;align-items:center;justify-content:center}.select-input{margin:5px 3px;padding:5px;width:100px;border-radius:4px;border-color:var(--dp-border-color);outline:0}
diff --git a/docs/assets/vue-datepicker.es.9f3b8378.js b/docs/assets/vue-datepicker.es.9f3b8378.js
new file mode 100644
index 000000000..a2b901593
--- /dev/null
+++ b/docs/assets/vue-datepicker.es.9f3b8378.js
@@ -0,0 +1 @@
+import{e as B,f as Ve,g as L,i as De,h as Qt,j as N,o as y,c as x,k as R,l as k,n as me,m as d,w as le,p as te,q as Ut,s as st,t as we,F as ne,v as he,b as ze,x as j,T as vt,y as Ct,z as qe,A as Mn,B as qa,C as Me,D as Ce,E as Xe,G as pt,H as Vt,I as La,J as Ta,K as kt,L as Pt,M as Sn,N as fa,O as nt,P as On,Q as Pn}from"./app.46c9efaa.js";function $(e){if(e===null||e===!0||e===!1)return NaN;var a=Number(e);return isNaN(a)?a:a<0?Math.ceil(a):Math.floor(a)}function I(e,a){if(a.length<e)throw new TypeError(e+" argument"+(e>1?"s":"")+" required, but only "+a.length+" present")}function F(e){I(1,arguments);var a=Object.prototype.toString.call(e);return e instanceof Date||typeof e=="object"&&a==="[object Date]"?new Date(e.getTime()):typeof e=="number"||a==="[object Number]"?new Date(e):((typeof e=="string"||a==="[object String]")&&typeof console!="undefined"&&(console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://git.io/fjule"),console.warn(new Error().stack)),new Date(NaN))}function ot(e,a){I(2,arguments);var t=F(e),n=$(a);return isNaN(n)?new Date(NaN):(n&&t.setDate(t.getDate()+n),t)}function Le(e,a){I(2,arguments);var t=F(e),n=$(a);if(isNaN(n))return new Date(NaN);if(!n)return t;var r=t.getDate(),l=new Date(t.getTime());l.setMonth(t.getMonth()+n+1,0);var u=l.getDate();return r>=u?l:(t.setFullYear(l.getFullYear(),l.getMonth(),r),t)}function Ga(e,a){if(I(2,arguments),!a||typeof a!="object")return new Date(NaN);var t=a.years?$(a.years):0,n=a.months?$(a.months):0,r=a.weeks?$(a.weeks):0,l=a.days?$(a.days):0,u=a.hours?$(a.hours):0,m=a.minutes?$(a.minutes):0,c=a.seconds?$(a.seconds):0,f=F(e),w=n||t?Le(f,n+t*12):f,T=l||r?ot(w,l+r*7):w,D=m+u*60,Y=c+D*60,U=Y*1e3,S=new Date(T.getTime()+U);return S}function Nn(e,a){I(2,arguments);var t=F(e).getTime(),n=$(a);return new Date(t+n)}function va(e,a){I(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,l=r==null?0:$(r),u=t.weekStartsOn==null?l:$(t.weekStartsOn);if(!(u>=0&&u<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var m=F(e),c=m.getDay(),f=(c<u?7:0)+c-u;return m.setDate(m.getDate()-f),m.setHours(0,0,0,0),m}function Bt(e){return I(1,arguments),va(e,{weekStartsOn:1})}function $n(e){I(1,arguments);var a=F(e),t=a.getFullYear(),n=new Date(0);n.setFullYear(t+1,0,4),n.setHours(0,0,0,0);var r=Bt(n),l=new Date(0);l.setFullYear(t,0,4),l.setHours(0,0,0,0);var u=Bt(l);return a.getTime()>=r.getTime()?t+1:a.getTime()>=u.getTime()?t:t-1}function In(e){I(1,arguments);var a=$n(e),t=new Date(0);t.setFullYear(a,0,4),t.setHours(0,0,0,0);var n=Bt(t);return n}function Ft(e){var a=new Date(Date.UTC(e.getFullYear(),e.getMonth(),e.getDate(),e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds()));return a.setUTCFullYear(e.getFullYear()),e.getTime()-a.getTime()}function xa(e){I(1,arguments);var a=F(e);return a.setHours(0,0,0,0),a}var An=864e5;function Yn(e,a){I(2,arguments);var t=xa(e),n=xa(a),r=t.getTime()-Ft(t),l=n.getTime()-Ft(n);return Math.round((r-l)/An)}function Qa(e,a){I(2,arguments);var t=$(a);return Le(e,t*12)}function Xa(e){return I(1,arguments),e instanceof Date||typeof e=="object"&&Object.prototype.toString.call(e)==="[object Date]"}function St(e){if(I(1,arguments),!Xa(e)&&typeof e!="number")return!1;var a=F(e);return!isNaN(Number(a))}function Un(e,a){I(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,l=r==null?0:$(r),u=t.weekStartsOn==null?l:$(t.weekStartsOn);if(!(u>=0&&u<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var m=F(e),c=m.getDay(),f=(c<u?-7:0)+6-(c-u);return m.setDate(m.getDate()+f),m.setHours(23,59,59,999),m}var Vn={lessThanXSeconds:{one:"less than a second",other:"less than {{count}} seconds"},xSeconds:{one:"1 second",other:"{{count}} seconds"},halfAMinute:"half a minute",lessThanXMinutes:{one:"less than a minute",other:"less than {{count}} minutes"},xMinutes:{one:"1 minute",other:"{{count}} minutes"},aboutXHours:{one:"about 1 hour",other:"about {{count}} hours"},xHours:{one:"1 hour",other:"{{count}} hours"},xDays:{one:"1 day",other:"{{count}} days"},aboutXWeeks:{one:"about 1 week",other:"about {{count}} weeks"},xWeeks:{one:"1 week",other:"{{count}} weeks"},aboutXMonths:{one:"about 1 month",other:"about {{count}} months"},xMonths:{one:"1 month",other:"{{count}} months"},aboutXYears:{one:"about 1 year",other:"about {{count}} years"},xYears:{one:"1 year",other:"{{count}} years"},overXYears:{one:"over 1 year",other:"over {{count}} years"},almostXYears:{one:"almost 1 year",other:"almost {{count}} years"}},En=function(e,a,t){var n,r=Vn[e];return typeof r=="string"?n=r:a===1?n=r.one:n=r.other.replace("{{count}}",a.toString()),t!=null&&t.addSuffix?t.comparison&&t.comparison>0?"in "+n:n+" ago":n},Wn=En;function aa(e){return function(){var a=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},t=a.width?String(a.width):e.defaultWidth,n=e.formats[t]||e.formats[e.defaultWidth];return n}}var Rn={full:"EEEE, MMMM do, y",long:"MMMM do, y",medium:"MMM d, y",short:"MM/dd/yyyy"},Hn={full:"h:mm:ss a zzzz",long:"h:mm:ss a z",medium:"h:mm:ss a",short:"h:mm a"},Bn={full:"{{date}} 'at' {{time}}",long:"{{date}} 'at' {{time}}",medium:"{{date}}, {{time}}",short:"{{date}}, {{time}}"},Fn={date:aa({formats:Rn,defaultWidth:"full"}),time:aa({formats:Hn,defaultWidth:"full"}),dateTime:aa({formats:Bn,defaultWidth:"full"})},qn=Fn,Ln={lastWeek:"'last' eeee 'at' p",yesterday:"'yesterday at' p",today:"'today at' p",tomorrow:"'tomorrow at' p",nextWeek:"eeee 'at' p",other:"P"},Gn=function(e,a,t,n){return Ln[e]},Qn=Gn;function Dt(e){return function(a,t){var n=t||{},r=n.context?String(n.context):"standalone",l;if(r==="formatting"&&e.formattingValues){var u=e.defaultFormattingWidth||e.defaultWidth,m=n.width?String(n.width):u;l=e.formattingValues[m]||e.formattingValues[u]}else{var c=e.defaultWidth,f=n.width?String(n.width):e.defaultWidth;l=e.values[f]||e.values[c]}var w=e.argumentCallback?e.argumentCallback(a):a;return l[w]}}var Xn={narrow:["B","A"],abbreviated:["BC","AD"],wide:["Before Christ","Anno Domini"]},Kn={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1st quarter","2nd quarter","3rd quarter","4th quarter"]},zn={narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],wide:["January","February","March","April","May","June","July","August","September","October","November","December"]},jn={narrow:["S","M","T","W","T","F","S"],short:["Su","Mo","Tu","We","Th","Fr","Sa"],abbreviated:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],wide:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]},Jn={narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"}},Zn={narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"}},er=function(e,a){var t=Number(e),n=t%100;if(n>20||n<10)switch(n%10){case 1:return t+"st";case 2:return t+"nd";case 3:return t+"rd"}return t+"th"},tr={ordinalNumber:er,era:Dt({values:Xn,defaultWidth:"wide"}),quarter:Dt({values:Kn,defaultWidth:"wide",argumentCallback:function(e){return e-1}}),month:Dt({values:zn,defaultWidth:"wide"}),day:Dt({values:jn,defaultWidth:"wide"}),dayPeriod:Dt({values:Jn,defaultWidth:"wide",formattingValues:Zn,defaultFormattingWidth:"wide"})},ar=tr;function Tt(e){return function(a){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=t.width,r=n&&e.matchPatterns[n]||e.matchPatterns[e.defaultMatchWidth],l=a.match(r);if(!l)return null;var u=l[0],m=n&&e.parsePatterns[n]||e.parsePatterns[e.defaultParseWidth],c=Array.isArray(m)?rr(m,function(T){return T.test(u)}):nr(m,function(T){return T.test(u)}),f;f=e.valueCallback?e.valueCallback(c):c,f=t.valueCallback?t.valueCallback(f):f;var w=a.slice(u.length);return{value:f,rest:w}}}function nr(e,a){for(var t in e)if(e.hasOwnProperty(t)&&a(e[t]))return t}function rr(e,a){for(var t=0;t<e.length;t++)if(a(e[t]))return t}function or(e){return function(a){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=a.match(e.matchPattern);if(!n)return null;var r=n[0],l=a.match(e.parsePattern);if(!l)return null;var u=e.valueCallback?e.valueCallback(l[0]):l[0];u=t.valueCallback?t.valueCallback(u):u;var m=a.slice(r.length);return{value:u,rest:m}}}var lr=/^(\d+)(th|st|nd|rd)?/i,ir=/\d+/i,sr={narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},ur={any:[/^b/i,/^(a|c)/i]},dr={narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},cr={any:[/1/i,/2/i,/3/i,/4/i]},mr={narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},pr={narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},fr={narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},vr={narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},hr={narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},yr={any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},wr={ordinalNumber:or({matchPattern:lr,parsePattern:ir,valueCallback:function(e){return parseInt(e,10)}}),era:Tt({matchPatterns:sr,defaultMatchWidth:"wide",parsePatterns:ur,defaultParseWidth:"any"}),quarter:Tt({matchPatterns:dr,defaultMatchWidth:"wide",parsePatterns:cr,defaultParseWidth:"any",valueCallback:function(e){return e+1}}),month:Tt({matchPatterns:mr,defaultMatchWidth:"wide",parsePatterns:pr,defaultParseWidth:"any"}),day:Tt({matchPatterns:fr,defaultMatchWidth:"wide",parsePatterns:vr,defaultParseWidth:"any"}),dayPeriod:Tt({matchPatterns:hr,defaultMatchWidth:"any",parsePatterns:yr,defaultParseWidth:"any"})},gr=wr,br={code:"en-US",formatDistance:Wn,formatLong:qn,formatRelative:Qn,localize:ar,match:gr,options:{weekStartsOn:0,firstWeekContainsDate:1}},Ka=br;function za(e,a){I(2,arguments);var t=$(a);return Nn(e,-t)}var _r=864e5;function kr(e){I(1,arguments);var a=F(e),t=a.getTime();a.setUTCMonth(0,1),a.setUTCHours(0,0,0,0);var n=a.getTime(),r=t-n;return Math.floor(r/_r)+1}function ft(e){I(1,arguments);var a=1,t=F(e),n=t.getUTCDay(),r=(n<a?7:0)+n-a;return t.setUTCDate(t.getUTCDate()-r),t.setUTCHours(0,0,0,0),t}function ja(e){I(1,arguments);var a=F(e),t=a.getUTCFullYear(),n=new Date(0);n.setUTCFullYear(t+1,0,4),n.setUTCHours(0,0,0,0);var r=ft(n),l=new Date(0);l.setUTCFullYear(t,0,4),l.setUTCHours(0,0,0,0);var u=ft(l);return a.getTime()>=r.getTime()?t+1:a.getTime()>=u.getTime()?t:t-1}function Dr(e){I(1,arguments);var a=ja(e),t=new Date(0);t.setUTCFullYear(a,0,4),t.setUTCHours(0,0,0,0);var n=ft(t);return n}var Tr=6048e5;function Ja(e){I(1,arguments);var a=F(e),t=ft(a).getTime()-Dr(a).getTime();return Math.round(t/Tr)+1}function lt(e,a){I(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,l=r==null?0:$(r),u=t.weekStartsOn==null?l:$(t.weekStartsOn);if(!(u>=0&&u<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var m=F(e),c=m.getUTCDay(),f=(c<u?7:0)+c-u;return m.setUTCDate(m.getUTCDate()-f),m.setUTCHours(0,0,0,0),m}function ha(e,a){I(1,arguments);var t=F(e),n=t.getUTCFullYear(),r=a||{},l=r.locale,u=l&&l.options&&l.options.firstWeekContainsDate,m=u==null?1:$(u),c=r.firstWeekContainsDate==null?m:$(r.firstWeekContainsDate);if(!(c>=1&&c<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var f=new Date(0);f.setUTCFullYear(n+1,0,c),f.setUTCHours(0,0,0,0);var w=lt(f,a),T=new Date(0);T.setUTCFullYear(n,0,c),T.setUTCHours(0,0,0,0);var D=lt(T,a);return t.getTime()>=w.getTime()?n+1:t.getTime()>=D.getTime()?n:n-1}function xr(e,a){I(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.firstWeekContainsDate,l=r==null?1:$(r),u=t.firstWeekContainsDate==null?l:$(t.firstWeekContainsDate),m=ha(e,a),c=new Date(0);c.setUTCFullYear(m,0,u),c.setUTCHours(0,0,0,0);var f=lt(c,a);return f}var Cr=6048e5;function Za(e,a){I(1,arguments);var t=F(e),n=lt(t,a).getTime()-xr(t,a).getTime();return Math.round(n/Cr)+1}function ee(e,a){for(var t=e<0?"-":"",n=Math.abs(e).toString();n.length<a;)n="0"+n;return t+n}var Mr={y:function(e,a){var t=e.getUTCFullYear(),n=t>0?t:1-t;return ee(a==="yy"?n%100:n,a.length)},M:function(e,a){var t=e.getUTCMonth();return a==="M"?String(t+1):ee(t+1,2)},d:function(e,a){return ee(e.getUTCDate(),a.length)},a:function(e,a){var t=e.getUTCHours()/12>=1?"pm":"am";switch(a){case"a":case"aa":return t.toUpperCase();case"aaa":return t;case"aaaaa":return t[0];case"aaaa":default:return t==="am"?"a.m.":"p.m."}},h:function(e,a){return ee(e.getUTCHours()%12||12,a.length)},H:function(e,a){return ee(e.getUTCHours(),a.length)},m:function(e,a){return ee(e.getUTCMinutes(),a.length)},s:function(e,a){return ee(e.getUTCSeconds(),a.length)},S:function(e,a){var t=a.length,n=e.getUTCMilliseconds(),r=Math.floor(n*Math.pow(10,t-3));return ee(r,a.length)}},Qe=Mr,mt={am:"am",pm:"pm",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},Sr={G:function(e,a,t){var n=e.getUTCFullYear()>0?1:0;switch(a){case"G":case"GG":case"GGG":return t.era(n,{width:"abbreviated"});case"GGGGG":return t.era(n,{width:"narrow"});case"GGGG":default:return t.era(n,{width:"wide"})}},y:function(e,a,t){if(a==="yo"){var n=e.getUTCFullYear(),r=n>0?n:1-n;return t.ordinalNumber(r,{unit:"year"})}return Qe.y(e,a)},Y:function(e,a,t,n){var r=ha(e,n),l=r>0?r:1-r;if(a==="YY"){var u=l%100;return ee(u,2)}return a==="Yo"?t.ordinalNumber(l,{unit:"year"}):ee(l,a.length)},R:function(e,a){var t=ja(e);return ee(t,a.length)},u:function(e,a){var t=e.getUTCFullYear();return ee(t,a.length)},Q:function(e,a,t){var n=Math.ceil((e.getUTCMonth()+1)/3);switch(a){case"Q":return String(n);case"QQ":return ee(n,2);case"Qo":return t.ordinalNumber(n,{unit:"quarter"});case"QQQ":return t.quarter(n,{width:"abbreviated",context:"formatting"});case"QQQQQ":return t.quarter(n,{width:"narrow",context:"formatting"});case"QQQQ":default:return t.quarter(n,{width:"wide",context:"formatting"})}},q:function(e,a,t){var n=Math.ceil((e.getUTCMonth()+1)/3);switch(a){case"q":return String(n);case"qq":return ee(n,2);case"qo":return t.ordinalNumber(n,{unit:"quarter"});case"qqq":return t.quarter(n,{width:"abbreviated",context:"standalone"});case"qqqqq":return t.quarter(n,{width:"narrow",context:"standalone"});case"qqqq":default:return t.quarter(n,{width:"wide",context:"standalone"})}},M:function(e,a,t){var n=e.getUTCMonth();switch(a){case"M":case"MM":return Qe.M(e,a);case"Mo":return t.ordinalNumber(n+1,{unit:"month"});case"MMM":return t.month(n,{width:"abbreviated",context:"formatting"});case"MMMMM":return t.month(n,{width:"narrow",context:"formatting"});case"MMMM":default:return t.month(n,{width:"wide",context:"formatting"})}},L:function(e,a,t){var n=e.getUTCMonth();switch(a){case"L":return String(n+1);case"LL":return ee(n+1,2);case"Lo":return t.ordinalNumber(n+1,{unit:"month"});case"LLL":return t.month(n,{width:"abbreviated",context:"standalone"});case"LLLLL":return t.month(n,{width:"narrow",context:"standalone"});case"LLLL":default:return t.month(n,{width:"wide",context:"standalone"})}},w:function(e,a,t,n){var r=Za(e,n);return a==="wo"?t.ordinalNumber(r,{unit:"week"}):ee(r,a.length)},I:function(e,a,t){var n=Ja(e);return a==="Io"?t.ordinalNumber(n,{unit:"week"}):ee(n,a.length)},d:function(e,a,t){return a==="do"?t.ordinalNumber(e.getUTCDate(),{unit:"date"}):Qe.d(e,a)},D:function(e,a,t){var n=kr(e);return a==="Do"?t.ordinalNumber(n,{unit:"dayOfYear"}):ee(n,a.length)},E:function(e,a,t){var n=e.getUTCDay();switch(a){case"E":case"EE":case"EEE":return t.day(n,{width:"abbreviated",context:"formatting"});case"EEEEE":return t.day(n,{width:"narrow",context:"formatting"});case"EEEEEE":return t.day(n,{width:"short",context:"formatting"});case"EEEE":default:return t.day(n,{width:"wide",context:"formatting"})}},e:function(e,a,t,n){var r=e.getUTCDay(),l=(r-n.weekStartsOn+8)%7||7;switch(a){case"e":return String(l);case"ee":return ee(l,2);case"eo":return t.ordinalNumber(l,{unit:"day"});case"eee":return t.day(r,{width:"abbreviated",context:"formatting"});case"eeeee":return t.day(r,{width:"narrow",context:"formatting"});case"eeeeee":return t.day(r,{width:"short",context:"formatting"});case"eeee":default:return t.day(r,{width:"wide",context:"formatting"})}},c:function(e,a,t,n){var r=e.getUTCDay(),l=(r-n.weekStartsOn+8)%7||7;switch(a){case"c":return String(l);case"cc":return ee(l,a.length);case"co":return t.ordinalNumber(l,{unit:"day"});case"ccc":return t.day(r,{width:"abbreviated",context:"standalone"});case"ccccc":return t.day(r,{width:"narrow",context:"standalone"});case"cccccc":return t.day(r,{width:"short",context:"standalone"});case"cccc":default:return t.day(r,{width:"wide",context:"standalone"})}},i:function(e,a,t){var n=e.getUTCDay(),r=n===0?7:n;switch(a){case"i":return String(r);case"ii":return ee(r,a.length);case"io":return t.ordinalNumber(r,{unit:"day"});case"iii":return t.day(n,{width:"abbreviated",context:"formatting"});case"iiiii":return t.day(n,{width:"narrow",context:"formatting"});case"iiiiii":return t.day(n,{width:"short",context:"formatting"});case"iiii":default:return t.day(n,{width:"wide",context:"formatting"})}},a:function(e,a,t){var n=e.getUTCHours(),r=n/12>=1?"pm":"am";switch(a){case"a":case"aa":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"aaa":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"aaaaa":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"aaaa":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},b:function(e,a,t){var n=e.getUTCHours(),r;switch(n===12?r=mt.noon:n===0?r=mt.midnight:r=n/12>=1?"pm":"am",a){case"b":case"bb":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"bbb":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"bbbbb":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"bbbb":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},B:function(e,a,t){var n=e.getUTCHours(),r;switch(n>=17?r=mt.evening:n>=12?r=mt.afternoon:n>=4?r=mt.morning:r=mt.night,a){case"B":case"BB":case"BBB":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"BBBBB":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"BBBB":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},h:function(e,a,t){if(a==="ho"){var n=e.getUTCHours()%12;return n===0&&(n=12),t.ordinalNumber(n,{unit:"hour"})}return Qe.h(e,a)},H:function(e,a,t){return a==="Ho"?t.ordinalNumber(e.getUTCHours(),{unit:"hour"}):Qe.H(e,a)},K:function(e,a,t){var n=e.getUTCHours()%12;return a==="Ko"?t.ordinalNumber(n,{unit:"hour"}):ee(n,a.length)},k:function(e,a,t){var n=e.getUTCHours();return n===0&&(n=24),a==="ko"?t.ordinalNumber(n,{unit:"hour"}):ee(n,a.length)},m:function(e,a,t){return a==="mo"?t.ordinalNumber(e.getUTCMinutes(),{unit:"minute"}):Qe.m(e,a)},s:function(e,a,t){return a==="so"?t.ordinalNumber(e.getUTCSeconds(),{unit:"second"}):Qe.s(e,a)},S:function(e,a){return Qe.S(e,a)},X:function(e,a,t,n){var r=n._originalDate||e,l=r.getTimezoneOffset();if(l===0)return"Z";switch(a){case"X":return Ma(l);case"XXXX":case"XX":return at(l);case"XXXXX":case"XXX":default:return at(l,":")}},x:function(e,a,t,n){var r=n._originalDate||e,l=r.getTimezoneOffset();switch(a){case"x":return Ma(l);case"xxxx":case"xx":return at(l);case"xxxxx":case"xxx":default:return at(l,":")}},O:function(e,a,t,n){var r=n._originalDate||e,l=r.getTimezoneOffset();switch(a){case"O":case"OO":case"OOO":return"GMT"+Ca(l,":");case"OOOO":default:return"GMT"+at(l,":")}},z:function(e,a,t,n){var r=n._originalDate||e,l=r.getTimezoneOffset();switch(a){case"z":case"zz":case"zzz":return"GMT"+Ca(l,":");case"zzzz":default:return"GMT"+at(l,":")}},t:function(e,a,t,n){var r=n._originalDate||e,l=Math.floor(r.getTime()/1e3);return ee(l,a.length)},T:function(e,a,t,n){var r=n._originalDate||e,l=r.getTime();return ee(l,a.length)}};function Ca(e,a){var t=e>0?"-":"+",n=Math.abs(e),r=Math.floor(n/60),l=n%60;if(l===0)return t+String(r);var u=a||"";return t+String(r)+u+ee(l,2)}function Ma(e,a){if(e%60===0){var t=e>0?"-":"+";return t+ee(Math.abs(e)/60,2)}return at(e,a)}function at(e,a){var t=a||"",n=e>0?"-":"+",r=Math.abs(e),l=ee(Math.floor(r/60),2),u=ee(r%60,2);return n+l+t+u}var Or=Sr;function Sa(e,a){switch(e){case"P":return a.date({width:"short"});case"PP":return a.date({width:"medium"});case"PPP":return a.date({width:"long"});case"PPPP":default:return a.date({width:"full"})}}function en(e,a){switch(e){case"p":return a.time({width:"short"});case"pp":return a.time({width:"medium"});case"ppp":return a.time({width:"long"});case"pppp":default:return a.time({width:"full"})}}function Pr(e,a){var t=e.match(/(P+)(p+)?/)||[],n=t[1],r=t[2];if(!r)return Sa(e,a);var l;switch(n){case"P":l=a.dateTime({width:"short"});break;case"PP":l=a.dateTime({width:"medium"});break;case"PPP":l=a.dateTime({width:"long"});break;case"PPPP":default:l=a.dateTime({width:"full"});break}return l.replace("{{date}}",Sa(n,a)).replace("{{time}}",en(r,a))}var Nr={p:en,P:Pr},tn=Nr,$r=["D","DD"],Ir=["YY","YYYY"];function an(e){return $r.indexOf(e)!==-1}function nn(e){return Ir.indexOf(e)!==-1}function qt(e,a,t){if(e==="YYYY")throw new RangeError("Use `yyyy` instead of `YYYY` (in `".concat(a,"`) for formatting years to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="YY")throw new RangeError("Use `yy` instead of `YY` (in `".concat(a,"`) for formatting years to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="D")throw new RangeError("Use `d` instead of `D` (in `".concat(a,"`) for formatting days of the month to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="DD")throw new RangeError("Use `dd` instead of `DD` (in `".concat(a,"`) for formatting days of the month to the input `").concat(t,"`; see: https://git.io/fxCyr"))}var Ar=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Yr=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,Ur=/^'([^]*?)'?$/,Vr=/''/g,Er=/[a-zA-Z]/;function Oa(e,a,t){I(2,arguments);var n=String(a),r=t||{},l=r.locale||Ka,u=l.options&&l.options.firstWeekContainsDate,m=u==null?1:$(u),c=r.firstWeekContainsDate==null?m:$(r.firstWeekContainsDate);if(!(c>=1&&c<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var f=l.options&&l.options.weekStartsOn,w=f==null?0:$(f),T=r.weekStartsOn==null?w:$(r.weekStartsOn);if(!(T>=0&&T<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");if(!l.localize)throw new RangeError("locale must contain localize property");if(!l.formatLong)throw new RangeError("locale must contain formatLong property");var D=F(e);if(!St(D))throw new RangeError("Invalid time value");var Y=Ft(D),U=za(D,Y),S={firstWeekContainsDate:c,weekStartsOn:T,locale:l,_originalDate:D},A=n.match(Yr).map(function(E){var o=E[0];if(o==="p"||o==="P"){var i=tn[o];return i(E,l.formatLong,S)}return E}).join("").match(Ar).map(function(E){if(E==="''")return"'";var o=E[0];if(o==="'")return Wr(E);var i=Or[o];if(i)return!r.useAdditionalWeekYearTokens&&nn(E)&&qt(E,a,e),!r.useAdditionalDayOfYearTokens&&an(E)&&qt(E,a,e),i(U,E,l.localize,S);if(o.match(Er))throw new RangeError("Format string contains an unescaped latin alphabet character `"+o+"`");return E}).join("");return A}function Wr(e){return e.match(Ur)[1].replace(Vr,"'")}function Rr(e,a){if(e==null)throw new TypeError("assign requires that input parameter not be null or undefined");a=a||{};for(var t in a)Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t]);return e}function Hr(e){I(1,arguments);var a=F(e),t=a.getDay();return t}function Br(e){I(1,arguments);var a=F(e),t=a.getFullYear(),n=a.getMonth(),r=new Date(0);return r.setFullYear(t,n+1,0),r.setHours(0,0,0,0),r.getDate()}function Ae(e){I(1,arguments);var a=F(e),t=a.getHours();return t}var Fr=6048e5;function qr(e){I(1,arguments);var a=F(e),t=Bt(a).getTime()-In(a).getTime();return Math.round(t/Fr)+1}function Ye(e){I(1,arguments);var a=F(e),t=a.getMinutes();return t}function pe(e){I(1,arguments);var a=F(e),t=a.getMonth();return t}function Ke(e){I(1,arguments);var a=F(e),t=a.getSeconds();return t}function fe(e){return I(1,arguments),F(e).getFullYear()}function Lr(e,a){I(2,arguments);var t=$(a);return ot(e,-t)}function Nt(e,a){I(2,arguments);var t=$(a);return Le(e,-t)}function Gr(e,a){if(I(2,arguments),!a||typeof a!="object")return new Date(NaN);var t=a.years?$(a.years):0,n=a.months?$(a.months):0,r=a.weeks?$(a.weeks):0,l=a.days?$(a.days):0,u=a.hours?$(a.hours):0,m=a.minutes?$(a.minutes):0,c=a.seconds?$(a.seconds):0,f=Nt(e,n+t*12),w=Lr(f,l+r*7),T=m+u*60,D=c+T*60,Y=D*1e3,U=new Date(w.getTime()-Y);return U}function rn(e,a){I(2,arguments);var t=F(e),n=F(a);return t.getTime()>n.getTime()}function on(e,a){I(2,arguments);var t=F(e),n=F(a);return t.getTime()<n.getTime()}function Qr(e,a){I(2,arguments);var t=F(e),n=F(a);return t.getTime()===n.getTime()}function na(e,a,t){I(2,arguments);var n=t||{},r=n.locale,l=r&&r.options&&r.options.weekStartsOn,u=l==null?0:$(l),m=n.weekStartsOn==null?u:$(n.weekStartsOn);if(!(m>=0&&m<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var c=F(e),f=$(a),w=c.getUTCDay(),T=f%7,D=(T+7)%7,Y=(D<m?7:0)+f-w;return c.setUTCDate(c.getUTCDate()+Y),c}function Xr(e,a){I(2,arguments);var t=$(a);t%7===0&&(t=t-7);var n=1,r=F(e),l=r.getUTCDay(),u=t%7,m=(u+7)%7,c=(m<n?7:0)+t-l;return r.setUTCDate(r.getUTCDate()+c),r}function Kr(e,a){I(2,arguments);var t=F(e),n=$(a),r=Ja(t)-n;return t.setUTCDate(t.getUTCDate()-r*7),t}function zr(e,a,t){I(2,arguments);var n=F(e),r=$(a),l=Za(n,t)-r;return n.setUTCDate(n.getUTCDate()-l*7),n}var jr=36e5,Jr=6e4,Zr=1e3,ce={month:/^(1[0-2]|0?\d)/,date:/^(3[0-1]|[0-2]?\d)/,dayOfYear:/^(36[0-6]|3[0-5]\d|[0-2]?\d?\d)/,week:/^(5[0-3]|[0-4]?\d)/,hour23h:/^(2[0-3]|[0-1]?\d)/,hour24h:/^(2[0-4]|[0-1]?\d)/,hour11h:/^(1[0-1]|0?\d)/,hour12h:/^(1[0-2]|0?\d)/,minute:/^[0-5]?\d/,second:/^[0-5]?\d/,singleDigit:/^\d/,twoDigits:/^\d{1,2}/,threeDigits:/^\d{1,3}/,fourDigits:/^\d{1,4}/,anyDigitsSigned:/^-?\d+/,singleDigitSigned:/^-?\d/,twoDigitsSigned:/^-?\d{1,2}/,threeDigitsSigned:/^-?\d{1,3}/,fourDigitsSigned:/^-?\d{1,4}/},We={basicOptionalMinutes:/^([+-])(\d{2})(\d{2})?|Z/,basic:/^([+-])(\d{2})(\d{2})|Z/,basicOptionalSeconds:/^([+-])(\d{2})(\d{2})((\d{2}))?|Z/,extended:/^([+-])(\d{2}):(\d{2})|Z/,extendedOptionalSeconds:/^([+-])(\d{2}):(\d{2})(:(\d{2}))?|Z/};function se(e,a,t){var n=a.match(e);if(!n)return null;var r=parseInt(n[0],10);return{value:t?t(r):r,rest:a.slice(n[0].length)}}function Re(e,a){var t=a.match(e);if(!t)return null;if(t[0]==="Z")return{value:0,rest:a.slice(1)};var n=t[1]==="+"?1:-1,r=t[2]?parseInt(t[2],10):0,l=t[3]?parseInt(t[3],10):0,u=t[5]?parseInt(t[5],10):0;return{value:n*(r*jr+l*Jr+u*Zr),rest:a.slice(t[0].length)}}function Pa(e,a){return se(ce.anyDigitsSigned,e,a)}function ue(e,a,t){switch(e){case 1:return se(ce.singleDigit,a,t);case 2:return se(ce.twoDigits,a,t);case 3:return se(ce.threeDigits,a,t);case 4:return se(ce.fourDigits,a,t);default:return se(new RegExp("^\\d{1,"+e+"}"),a,t)}}function At(e,a,t){switch(e){case 1:return se(ce.singleDigitSigned,a,t);case 2:return se(ce.twoDigitsSigned,a,t);case 3:return se(ce.threeDigitsSigned,a,t);case 4:return se(ce.fourDigitsSigned,a,t);default:return se(new RegExp("^-?\\d{1,"+e+"}"),a,t)}}function ra(e){switch(e){case"morning":return 4;case"evening":return 17;case"pm":case"noon":case"afternoon":return 12;case"am":case"midnight":case"night":default:return 0}}function Na(e,a){var t=a>0,n=t?a:1-a,r;if(n<=50)r=e||100;else{var l=n+50,u=Math.floor(l/100)*100,m=e>=l%100;r=e+u-(m?100:0)}return t?r:1-r}var eo=[31,28,31,30,31,30,31,31,30,31,30,31],to=[31,29,31,30,31,30,31,31,30,31,30,31];function $a(e){return e%400===0||e%4===0&&e%100!==0}var ao={G:{priority:140,parse:function(e,a,t,n){switch(a){case"G":case"GG":case"GGG":return t.era(e,{width:"abbreviated"})||t.era(e,{width:"narrow"});case"GGGGG":return t.era(e,{width:"narrow"});case"GGGG":default:return t.era(e,{width:"wide"})||t.era(e,{width:"abbreviated"})||t.era(e,{width:"narrow"})}},set:function(e,a,t,n){return a.era=t,e.setUTCFullYear(t,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["R","u","t","T"]},y:{priority:130,parse:function(e,a,t,n){var r=function(l){return{year:l,isTwoDigitYear:a==="yy"}};switch(a){case"y":return ue(4,e,r);case"yo":return t.ordinalNumber(e,{unit:"year",valueCallback:r});default:return ue(a.length,e,r)}},validate:function(e,a,t){return a.isTwoDigitYear||a.year>0},set:function(e,a,t,n){var r=e.getUTCFullYear();if(t.isTwoDigitYear){var l=Na(t.year,r);return e.setUTCFullYear(l,0,1),e.setUTCHours(0,0,0,0),e}var u=!("era"in a)||a.era===1?t.year:1-t.year;return e.setUTCFullYear(u,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","u","w","I","i","e","c","t","T"]},Y:{priority:130,parse:function(e,a,t,n){var r=function(l){return{year:l,isTwoDigitYear:a==="YY"}};switch(a){case"Y":return ue(4,e,r);case"Yo":return t.ordinalNumber(e,{unit:"year",valueCallback:r});default:return ue(a.length,e,r)}},validate:function(e,a,t){return a.isTwoDigitYear||a.year>0},set:function(e,a,t,n){var r=ha(e,n);if(t.isTwoDigitYear){var l=Na(t.year,r);return e.setUTCFullYear(l,0,n.firstWeekContainsDate),e.setUTCHours(0,0,0,0),lt(e,n)}var u=!("era"in a)||a.era===1?t.year:1-t.year;return e.setUTCFullYear(u,0,n.firstWeekContainsDate),e.setUTCHours(0,0,0,0),lt(e,n)},incompatibleTokens:["y","R","u","Q","q","M","L","I","d","D","i","t","T"]},R:{priority:130,parse:function(e,a,t,n){return At(a==="R"?4:a.length,e)},set:function(e,a,t,n){var r=new Date(0);return r.setUTCFullYear(t,0,4),r.setUTCHours(0,0,0,0),ft(r)},incompatibleTokens:["G","y","Y","u","Q","q","M","L","w","d","D","e","c","t","T"]},u:{priority:130,parse:function(e,a,t,n){return At(a==="u"?4:a.length,e)},set:function(e,a,t,n){return e.setUTCFullYear(t,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["G","y","Y","R","w","I","i","e","c","t","T"]},Q:{priority:120,parse:function(e,a,t,n){switch(a){case"Q":case"QQ":return ue(a.length,e);case"Qo":return t.ordinalNumber(e,{unit:"quarter"});case"QQQ":return t.quarter(e,{width:"abbreviated",context:"formatting"})||t.quarter(e,{width:"narrow",context:"formatting"});case"QQQQQ":return t.quarter(e,{width:"narrow",context:"formatting"});case"QQQQ":default:return t.quarter(e,{width:"wide",context:"formatting"})||t.quarter(e,{width:"abbreviated",context:"formatting"})||t.quarter(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=1&&a<=4},set:function(e,a,t,n){return e.setUTCMonth((t-1)*3,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","M","L","w","I","d","D","i","e","c","t","T"]},q:{priority:120,parse:function(e,a,t,n){switch(a){case"q":case"qq":return ue(a.length,e);case"qo":return t.ordinalNumber(e,{unit:"quarter"});case"qqq":return t.quarter(e,{width:"abbreviated",context:"standalone"})||t.quarter(e,{width:"narrow",context:"standalone"});case"qqqqq":return t.quarter(e,{width:"narrow",context:"standalone"});case"qqqq":default:return t.quarter(e,{width:"wide",context:"standalone"})||t.quarter(e,{width:"abbreviated",context:"standalone"})||t.quarter(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=1&&a<=4},set:function(e,a,t,n){return e.setUTCMonth((t-1)*3,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","Q","M","L","w","I","d","D","i","e","c","t","T"]},M:{priority:110,parse:function(e,a,t,n){var r=function(l){return l-1};switch(a){case"M":return se(ce.month,e,r);case"MM":return ue(2,e,r);case"Mo":return t.ordinalNumber(e,{unit:"month",valueCallback:r});case"MMM":return t.month(e,{width:"abbreviated",context:"formatting"})||t.month(e,{width:"narrow",context:"formatting"});case"MMMMM":return t.month(e,{width:"narrow",context:"formatting"});case"MMMM":default:return t.month(e,{width:"wide",context:"formatting"})||t.month(e,{width:"abbreviated",context:"formatting"})||t.month(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){return e.setUTCMonth(t,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","L","w","I","D","i","e","c","t","T"]},L:{priority:110,parse:function(e,a,t,n){var r=function(l){return l-1};switch(a){case"L":return se(ce.month,e,r);case"LL":return ue(2,e,r);case"Lo":return t.ordinalNumber(e,{unit:"month",valueCallback:r});case"LLL":return t.month(e,{width:"abbreviated",context:"standalone"})||t.month(e,{width:"narrow",context:"standalone"});case"LLLLL":return t.month(e,{width:"narrow",context:"standalone"});case"LLLL":default:return t.month(e,{width:"wide",context:"standalone"})||t.month(e,{width:"abbreviated",context:"standalone"})||t.month(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){return e.setUTCMonth(t,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","M","w","I","D","i","e","c","t","T"]},w:{priority:100,parse:function(e,a,t,n){switch(a){case"w":return se(ce.week,e);case"wo":return t.ordinalNumber(e,{unit:"week"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=53},set:function(e,a,t,n){return lt(zr(e,t,n),n)},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","i","t","T"]},I:{priority:100,parse:function(e,a,t,n){switch(a){case"I":return se(ce.week,e);case"Io":return t.ordinalNumber(e,{unit:"week"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=53},set:function(e,a,t,n){return ft(Kr(e,t,n),n)},incompatibleTokens:["y","Y","u","q","Q","M","L","w","d","D","e","c","t","T"]},d:{priority:90,subPriority:1,parse:function(e,a,t,n){switch(a){case"d":return se(ce.date,e);case"do":return t.ordinalNumber(e,{unit:"date"});default:return ue(a.length,e)}},validate:function(e,a,t){var n=e.getUTCFullYear(),r=$a(n),l=e.getUTCMonth();return r?a>=1&&a<=to[l]:a>=1&&a<=eo[l]},set:function(e,a,t,n){return e.setUTCDate(t),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","w","I","D","i","e","c","t","T"]},D:{priority:90,subPriority:1,parse:function(e,a,t,n){switch(a){case"D":case"DD":return se(ce.dayOfYear,e);case"Do":return t.ordinalNumber(e,{unit:"date"});default:return ue(a.length,e)}},validate:function(e,a,t){var n=e.getUTCFullYear(),r=$a(n);return r?a>=1&&a<=366:a>=1&&a<=365},set:function(e,a,t,n){return e.setUTCMonth(0,t),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","M","L","w","I","d","E","i","e","c","t","T"]},E:{priority:90,parse:function(e,a,t,n){switch(a){case"E":case"EE":case"EEE":return t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"EEEEE":return t.day(e,{width:"narrow",context:"formatting"});case"EEEEEE":return t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"EEEE":default:return t.day(e,{width:"wide",context:"formatting"})||t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=na(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["D","i","e","c","t","T"]},e:{priority:90,parse:function(e,a,t,n){var r=function(l){var u=Math.floor((l-1)/7)*7;return(l+n.weekStartsOn+6)%7+u};switch(a){case"e":case"ee":return ue(a.length,e,r);case"eo":return t.ordinalNumber(e,{unit:"day",valueCallback:r});case"eee":return t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"eeeee":return t.day(e,{width:"narrow",context:"formatting"});case"eeeeee":return t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"eeee":default:return t.day(e,{width:"wide",context:"formatting"})||t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=na(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","E","i","c","t","T"]},c:{priority:90,parse:function(e,a,t,n){var r=function(l){var u=Math.floor((l-1)/7)*7;return(l+n.weekStartsOn+6)%7+u};switch(a){case"c":case"cc":return ue(a.length,e,r);case"co":return t.ordinalNumber(e,{unit:"day",valueCallback:r});case"ccc":return t.day(e,{width:"abbreviated",context:"standalone"})||t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"});case"ccccc":return t.day(e,{width:"narrow",context:"standalone"});case"cccccc":return t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"});case"cccc":default:return t.day(e,{width:"wide",context:"standalone"})||t.day(e,{width:"abbreviated",context:"standalone"})||t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=na(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","E","i","e","t","T"]},i:{priority:90,parse:function(e,a,t,n){var r=function(l){return l===0?7:l};switch(a){case"i":case"ii":return ue(a.length,e);case"io":return t.ordinalNumber(e,{unit:"day"});case"iii":return t.day(e,{width:"abbreviated",context:"formatting",valueCallback:r})||t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiiii":return t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiiiii":return t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiii":default:return t.day(e,{width:"wide",context:"formatting",valueCallback:r})||t.day(e,{width:"abbreviated",context:"formatting",valueCallback:r})||t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r})}},validate:function(e,a,t){return a>=1&&a<=7},set:function(e,a,t,n){return e=Xr(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","Y","u","q","Q","M","L","w","d","D","E","e","c","t","T"]},a:{priority:80,parse:function(e,a,t,n){switch(a){case"a":case"aa":case"aaa":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"aaaaa":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"aaaa":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(ra(t),0,0,0),e},incompatibleTokens:["b","B","H","k","t","T"]},b:{priority:80,parse:function(e,a,t,n){switch(a){case"b":case"bb":case"bbb":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"bbbbb":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"bbbb":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(ra(t),0,0,0),e},incompatibleTokens:["a","B","H","k","t","T"]},B:{priority:80,parse:function(e,a,t,n){switch(a){case"B":case"BB":case"BBB":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"BBBBB":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"BBBB":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(ra(t),0,0,0),e},incompatibleTokens:["a","b","t","T"]},h:{priority:70,parse:function(e,a,t,n){switch(a){case"h":return se(ce.hour12h,e);case"ho":return t.ordinalNumber(e,{unit:"hour"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=12},set:function(e,a,t,n){var r=e.getUTCHours()>=12;return r&&t<12?e.setUTCHours(t+12,0,0,0):!r&&t===12?e.setUTCHours(0,0,0,0):e.setUTCHours(t,0,0,0),e},incompatibleTokens:["H","K","k","t","T"]},H:{priority:70,parse:function(e,a,t,n){switch(a){case"H":return se(ce.hour23h,e);case"Ho":return t.ordinalNumber(e,{unit:"hour"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=23},set:function(e,a,t,n){return e.setUTCHours(t,0,0,0),e},incompatibleTokens:["a","b","h","K","k","t","T"]},K:{priority:70,parse:function(e,a,t,n){switch(a){case"K":return se(ce.hour11h,e);case"Ko":return t.ordinalNumber(e,{unit:"hour"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){var r=e.getUTCHours()>=12;return r&&t<12?e.setUTCHours(t+12,0,0,0):e.setUTCHours(t,0,0,0),e},incompatibleTokens:["h","H","k","t","T"]},k:{priority:70,parse:function(e,a,t,n){switch(a){case"k":return se(ce.hour24h,e);case"ko":return t.ordinalNumber(e,{unit:"hour"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=24},set:function(e,a,t,n){var r=t<=24?t%24:t;return e.setUTCHours(r,0,0,0),e},incompatibleTokens:["a","b","h","H","K","t","T"]},m:{priority:60,parse:function(e,a,t,n){switch(a){case"m":return se(ce.minute,e);case"mo":return t.ordinalNumber(e,{unit:"minute"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=59},set:function(e,a,t,n){return e.setUTCMinutes(t,0,0),e},incompatibleTokens:["t","T"]},s:{priority:50,parse:function(e,a,t,n){switch(a){case"s":return se(ce.second,e);case"so":return t.ordinalNumber(e,{unit:"second"});default:return ue(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=59},set:function(e,a,t,n){return e.setUTCSeconds(t,0),e},incompatibleTokens:["t","T"]},S:{priority:30,parse:function(e,a,t,n){var r=function(l){return Math.floor(l*Math.pow(10,-a.length+3))};return ue(a.length,e,r)},set:function(e,a,t,n){return e.setUTCMilliseconds(t),e},incompatibleTokens:["t","T"]},X:{priority:10,parse:function(e,a,t,n){switch(a){case"X":return Re(We.basicOptionalMinutes,e);case"XX":return Re(We.basic,e);case"XXXX":return Re(We.basicOptionalSeconds,e);case"XXXXX":return Re(We.extendedOptionalSeconds,e);case"XXX":default:return Re(We.extended,e)}},set:function(e,a,t,n){return a.timestampIsSet?e:new Date(e.getTime()-t)},incompatibleTokens:["t","T","x"]},x:{priority:10,parse:function(e,a,t,n){switch(a){case"x":return Re(We.basicOptionalMinutes,e);case"xx":return Re(We.basic,e);case"xxxx":return Re(We.basicOptionalSeconds,e);case"xxxxx":return Re(We.extendedOptionalSeconds,e);case"xxx":default:return Re(We.extended,e)}},set:function(e,a,t,n){return a.timestampIsSet?e:new Date(e.getTime()-t)},incompatibleTokens:["t","T","X"]},t:{priority:40,parse:function(e,a,t,n){return Pa(e)},set:function(e,a,t,n){return[new Date(t*1e3),{timestampIsSet:!0}]},incompatibleTokens:"*"},T:{priority:20,parse:function(e,a,t,n){return Pa(e)},set:function(e,a,t,n){return[new Date(t),{timestampIsSet:!0}]},incompatibleTokens:"*"}},no=ao,ro=10,oo=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,lo=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,io=/^'([^]*?)'?$/,so=/''/g,uo=/\S/,co=/[a-zA-Z]/;function mo(e,a,t,n){I(3,arguments);var r=String(e),l=String(a),u=n||{},m=u.locale||Ka;if(!m.match)throw new RangeError("locale must contain match property");var c=m.options&&m.options.firstWeekContainsDate,f=c==null?1:$(c),w=u.firstWeekContainsDate==null?f:$(u.firstWeekContainsDate);if(!(w>=1&&w<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var T=m.options&&m.options.weekStartsOn,D=T==null?0:$(T),Y=u.weekStartsOn==null?D:$(u.weekStartsOn);if(!(Y>=0&&Y<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");if(l==="")return r===""?F(t):new Date(NaN);var U={firstWeekContainsDate:w,weekStartsOn:Y,locale:m},S=[{priority:ro,subPriority:-1,set:po,index:0}],A,E=l.match(lo).map(function(oe){var de=oe[0];if(de==="p"||de==="P"){var be=tn[de];return be(oe,m.formatLong,U)}return oe}).join("").match(oo),o=[];for(A=0;A<E.length;A++){var i=E[A];!u.useAdditionalWeekYearTokens&&nn(i)&&qt(i,l,e),!u.useAdditionalDayOfYearTokens&&an(i)&&qt(i,l,e);var p=i[0],b=no[p];if(b){var W=b.incompatibleTokens;if(Array.isArray(W)){for(var P=void 0,G=0;G<o.length;G++){var ae=o[G].token;if(W.indexOf(ae)!==-1||ae===p){P=o[G];break}}if(P)throw new RangeError("The format string mustn't contain `".concat(P.fullToken,"` and `").concat(i,"` at the same time"))}else if(b.incompatibleTokens==="*"&&o.length)throw new RangeError("The format string mustn't contain `".concat(i,"` and any other token at the same time"));o.push({token:p,fullToken:i});var M=b.parse(r,i,m.match,U);if(!M)return new Date(NaN);S.push({priority:b.priority,subPriority:b.subPriority||0,set:b.set,validate:b.validate,value:M.value,index:S.length}),r=M.rest}else{if(p.match(co))throw new RangeError("Format string contains an unescaped latin alphabet character `"+p+"`");if(i==="''"?i="'":p==="'"&&(i=fo(i)),r.indexOf(i)===0)r=r.slice(i.length);else return new Date(NaN)}}if(r.length>0&&uo.test(r))return new Date(NaN);var re=S.map(function(oe){return oe.priority}).sort(function(oe,de){return de-oe}).filter(function(oe,de,be){return be.indexOf(oe)===de}).map(function(oe){return S.filter(function(de){return de.priority===oe}).sort(function(de,be){return be.subPriority-de.subPriority})}).map(function(oe){return oe[0]}),J=F(t);if(isNaN(J))return new Date(NaN);var g=za(J,Ft(J)),O={};for(A=0;A<re.length;A++){var V=re[A];if(V.validate&&!V.validate(g,V.value,U))return new Date(NaN);var Z=V.set(g,O,V.value,U);Z[0]?(g=Z[0],Rr(O,Z[1])):g=Z}return g}function po(e,a){if(a.timestampIsSet)return e;var t=new Date(0);return t.setFullYear(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate()),t.setHours(e.getUTCHours(),e.getUTCMinutes(),e.getUTCSeconds(),e.getUTCMilliseconds()),t}function fo(e){return e.match(io)[1].replace(so,"'")}function Ot(e,a){I(2,arguments);var t=F(e),n=$(a),r=t.getFullYear(),l=t.getDate(),u=new Date(0);u.setFullYear(r,n,15),u.setHours(0,0,0,0);var m=Br(u);return t.setMonth(n,Math.min(l,m)),t}function Ue(e,a){if(I(2,arguments),typeof a!="object"||a===null)throw new RangeError("values parameter must be an object");var t=F(e);return isNaN(t.getTime())?new Date(NaN):(a.year!=null&&t.setFullYear(a.year),a.month!=null&&(t=Ot(t,a.month)),a.date!=null&&t.setDate($(a.date)),a.hours!=null&&t.setHours($(a.hours)),a.minutes!=null&&t.setMinutes($(a.minutes)),a.seconds!=null&&t.setSeconds($(a.seconds)),a.milliseconds!=null&&t.setMilliseconds($(a.milliseconds)),t)}function ln(e,a){I(2,arguments);var t=F(e),n=$(a);return t.setHours(n),t}function ya(e,a){I(2,arguments);var t=F(e),n=$(a);return t.setMilliseconds(n),t}function sn(e,a){I(2,arguments);var t=F(e),n=$(a);return t.setMinutes(n),t}function un(e,a){I(2,arguments);var t=F(e),n=$(a);return t.setSeconds(n),t}function Et(e,a){I(2,arguments);var t=F(e),n=$(a);return isNaN(t.getTime())?new Date(NaN):(t.setFullYear(n),t)}function vo(e,a){I(2,arguments);var t=$(a);return Qa(e,-t)}var ho=Object.defineProperty,yo=Object.defineProperties,wo=Object.getOwnPropertyDescriptors,Ia=Object.getOwnPropertySymbols,go=Object.prototype.hasOwnProperty,bo=Object.prototype.propertyIsEnumerable,Aa=(e,a,t)=>a in e?ho(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,K=(e,a)=>{for(var t in a||(a={}))go.call(a,t)&&Aa(e,t,a[t]);if(Ia)for(var t of Ia(a))bo.call(a,t)&&Aa(e,t,a[t]);return e},Oe=(e,a)=>yo(e,wo(a)),ut=(e,a)=>{const t=e.__vccOpts||e;for(const[n,r]of a)t[n]=r;return t};const _o={},ko={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Do=B("path",{d:"M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"},null,-1),To=B("path",{d:"M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),xo=B("path",{d:"M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),Co=B("path",{d:"M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"},null,-1),Mo=[Do,To,xo,Co];function So(e,a){return y(),x("svg",ko,Mo)}var Xt=ut(_o,[["render",So]]);const Oo={},Po={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},No=B("path",{d:"M23.057 7.057l-16 16c-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0l16-16c0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0z"},null,-1),$o=B("path",{d:"M7.057 8.943l16 16c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885l-16-16c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885z"},null,-1),Io=[No,$o];function Ao(e,a){return y(),x("svg",Po,Io)}var Yo=ut(Oo,[["render",Ao]]);const Uo={},Vo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Eo=B("path",{d:"M20.943 23.057l-7.057-7.057c0 0 7.057-7.057 7.057-7.057 0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-8 8c-0.521 0.521-0.521 1.365 0 1.885l8 8c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),Wo=[Eo];function Ro(e,a){return y(),x("svg",Vo,Wo)}var Ya=ut(Uo,[["render",Ro]]);const Ho={},Bo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Fo=B("path",{d:"M12.943 24.943l8-8c0.521-0.521 0.521-1.365 0-1.885l-8-8c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885l7.057 7.057c0 0-7.057 7.057-7.057 7.057-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0z"},null,-1),qo=[Fo];function Lo(e,a){return y(),x("svg",Bo,qo)}var Ua=ut(Ho,[["render",Lo]]);const Go={},Qo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Xo=B("path",{d:"M16 1.333c-8.095 0-14.667 6.572-14.667 14.667s6.572 14.667 14.667 14.667c8.095 0 14.667-6.572 14.667-14.667s-6.572-14.667-14.667-14.667zM16 4c6.623 0 12 5.377 12 12s-5.377 12-12 12c-6.623 0-12-5.377-12-12s5.377-12 12-12z"},null,-1),Ko=B("path",{d:"M14.667 8v8c0 0.505 0.285 0.967 0.737 1.193l5.333 2.667c0.658 0.329 1.46 0.062 1.789-0.596s0.062-1.46-0.596-1.789l-4.596-2.298c0 0 0-7.176 0-7.176 0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),zo=[Xo,Ko];function jo(e,a){return y(),x("svg",Qo,zo)}var dn=ut(Go,[["render",jo]]);const Jo={},Zo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},el=B("path",{d:"M24.943 19.057l-8-8c-0.521-0.521-1.365-0.521-1.885 0l-8 8c-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0l7.057-7.057c0 0 7.057 7.057 7.057 7.057 0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),tl=[el];function al(e,a){return y(),x("svg",Zo,tl)}var cn=ut(Jo,[["render",al]]);const nl={},rl={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},ol=B("path",{d:"M7.057 12.943l8 8c0.521 0.521 1.365 0.521 1.885 0l8-8c0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-7.057 7.057c0 0-7.057-7.057-7.057-7.057-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885z"},null,-1),ll=[ol];function il(e,a){return y(),x("svg",rl,ll)}var mn=ut(nl,[["render",il]]);const oa=(e,a)=>{const t=mo(e,a.slice(0,e.length),new Date);return St(t)&&Xa(t)?t:null},He=e=>{let a=new Date(JSON.parse(JSON.stringify(e)));return a=ln(a,0),a=sn(a,0),a=un(a,0),a=ya(a,0),a},ca=e=>Array.isArray(e)?St(e[0])&&(e[1]?St(e[1]):!0):e?St(e):!1,ke=(e,a,t,n)=>{let r=e?new Date(e):new Date;return(a||a===0)&&(r=ln(r,+a)),(t||t===0)&&(r=sn(r,+t)),(n||n===0)&&(r=un(r,+n)),ya(r,0)},sl=e=>{const a=Le(e,1);return{month:pe(a),year:fe(a)}},it=(e,a,t)=>{let n=e?new Date(e):new Date;return(a||a===0)&&(n=Ot(n,a)),t&&(n=Et(n,t)),n},Va=(e,a)=>e?`HH:mm${a?":ss":""}`:`hh:mm${a?":ss":""} aa`,pn=(e,a,t,n,r,l,u)=>e||(n?"MM/yyyy":r?Va(a,t):l?"MM/dd/yyyy":u?`MM/dd/yyyy, ${Va(a,t)}`:"MM/dd/yyyy"),la=e=>{const a=e||new Date;return{hours:Ae(a),minutes:Ye(a),seconds:Ke(a)}},Wt=e=>({month:pe(e),year:fe(e)}),Ea=e=>Array.isArray(e)?[Wt(e[0]),e[1]?Wt(e[1]):null]:Wt(e),ma=e=>Array.isArray(e)?[la(e[0]),la(e[1])]:la(e),ia=(e,a,t)=>t?Oa(e,a,{locale:t}):Oa(e,a),Lt=(e,a,t,n)=>Array.isArray(e)?`${ia(e[0],a,t)} ${n||"-"} ${e[1]?ia(e[1],a,t):""}`:ia(e,a,t),xe=(e,a)=>!e||!a?!1:rn(He(e),He(a)),ge=(e,a)=>!e||!a?!1:on(He(e),He(a)),ie=(e,a)=>!e||!a?!1:Qr(He(e),He(a)),ul=(e,a)=>Ga(Ue(new Date,e),a),dl=(e,a)=>Gr(Ue(new Date,e),a),sa=e=>Ue(new Date,{hours:Ae(e),minutes:Ye(e),seconds:Ke(e)}),Wa=e=>Ue(new Date,{hours:+e.hours||0,minutes:+e.minutes||0,seconds:+e.seconds||0}),pa=(e,a,t)=>{let n=!0;if(!e)return!0;const r=Array.isArray(e)?[e[0]?sa(e[0]):null,e[1]?sa(e[1]):null]:sa(e);if(a){const l=Wa(a);Array.isArray(r)?n=(r[0]?r[0].getTime()<=l.getTime():!0)&&(r[1]?r[1].getTime()<=l.getTime():!0):n=r.getTime()<=l.getTime()}if(t){const l=Wa(t);Array.isArray(r)?n=(r[0]?r[0].getTime()>=l.getTime():!0)&&(r[1]?r[1].getTime()>=l.getTime():!0)&&n:n=r.getTime()>=l.getTime()&&n}return n},cl=(e,a,t)=>{let n=!0;return a&&t&&(n=xe(new Date(e),new Date(a))&&ge(new Date(e),new Date(t))),a&&(n=xe(new Date(e),new Date(a))),t&&(n=ge(new Date(e),new Date(t))),n},Ne=e=>{const a=Date.UTC(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate(),e.getUTCHours(),e.getUTCMinutes(),e.getUTCSeconds());return new Date(a).toISOString()},fn=(e,a,t)=>e&&e[0]&&e[1]?xe(t,e[0])&&ge(t,e[1]):e&&e[0]&&a?xe(t,e[0])&&ge(t,a)||ge(t,e[0])&&xe(t,a):!1,Yt=(e,a)=>{const t=va(e,{weekStartsOn:a}),n=Un(e,{weekStartsOn:a});return[t,n]},ml=(e,a,t)=>{const n=new Date(JSON.parse(JSON.stringify(e))),r=[];for(let l=0;l<7;l++){const u=ot(n,l),m=pe(u)!==a;r.push({text:t&&m?"":u.getDate(),value:u,current:!m})}return r},pl=(e,a,t,n)=>{const r=[],l=new Date(a,e),u=new Date(a,e+1,0),m=va(l,{weekStartsOn:t}),c=f=>{const w=ml(f,e,n);if(r.push({days:w}),!r[r.length-1].days.some(T=>ie(He(T.value),He(u)))){const T=ot(f,7);c(T)}};return c(m),r},fl=(e,a=3)=>{const t=[];for(let n=0;n<e.length;n+=a)t.push([e[n],e[n+1],e[n+2]]);return t},vl=(e,a)=>{const t=[1,2,3,4,5,6,7].map(l=>new Intl.DateTimeFormat(e,{weekday:"short",timeZone:"UTC"}).format(new Date(`2017-01-0${l}T00:00:00+00:00`)).slice(0,2)),n=t.slice(0,a),r=t.slice(a+1,t.length);return[t[a]].concat(...r).concat(...n)},hl=e=>{const a=[];for(let t=+e[0];t<=+e[1];t++)a.push({value:+t,text:`${t}`});return a},yl=(e,a)=>{const t=new Intl.DateTimeFormat(e,{month:a,timeZone:"UTC"});return[1,2,3,4,5,6,7,8,9,10,11,12].map(n=>{const r=n<10?`0${n}`:n;return new Date(`2017-${r}-01T00:00:00+00:00`)}).map((n,r)=>({text:t.format(n),value:r}))},wl=e=>[12,1,2,3,4,5,6,7,8,9,10,11,12,1,2,3,4,5,6,7,8,9,10,11][e],gl=()=>({enterSubmit:!0,tabSubmit:!0,openMenu:!0,rangeSeparator:" - "}),bl=e=>Object.assign({months:[],years:[],times:{hours:[],minutes:[],seconds:[]}},e),_l=e=>{function a(t){let n="";const r="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",l=r.length;for(let u=0;u<t;u++)n+=r.charAt(Math.floor(Math.random()*l));return n+e}return a(5)},Se=e=>{var a;const t=d(e);return(a=t==null?void 0:t.$el)!=null?a:t},kl=e=>Object.assign({type:"dot"},e),Ra=e=>Object.assign({menuAppear:"dp-menu-appear",open:"dp-slide-down",close:"dp-slide-up",next:"calendar-next",previous:"calendar-prev",vNext:"dp-slide-up",vPrevious:"dp-slide-down"},e),Dl=e=>Object.assign({toggleOverlay:"Toggle overlay",menu:"Datepicker menu",input:"Datepicker input",calendarWrap:"Calendar wrapper",calendarDays:"Calendar days",openTimePicker:"Open time picker",closeTimePicker:"Close time Picker",incrementValue:a=>`Increment ${a}`,decrementValue:a=>`Decrement ${a}`,openTpOverlay:a=>`Open ${a} overlay`,amPmButton:"Switch AM/PM mode",openYearsOverlay:"Open years overlay",openMonthsOverlay:"Open months overlay",nextMonth:"Next month",prevMonth:"Previous month"},e),je=Symbol(),Kt=Symbol(),wa=Symbol(),vn=Symbol(),hn=Symbol(),ga={disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},autoApply:{type:Boolean,default:!1},inline:{type:Boolean,default:!1},textInput:{type:Boolean,default:!1}},ba={range:{type:Boolean,default:!1},uid:{type:String,default:null}},yn={enableSeconds:{type:Boolean,default:!1},is24:{type:Boolean,default:!0},noHoursOverlay:{type:Boolean,default:!1},noMinutesOverlay:{type:Boolean,default:!1},noSecondsOverlay:{type:Boolean,default:!1},hoursGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},secondsGridIncrement:{type:[String,Number],default:5},hoursIncrement:{type:[Number,String],default:1},minutesIncrement:{type:[Number,String],default:1},secondsIncrement:{type:[Number,String],default:1}},wn=Oe(K({},yn),{fixedStart:{type:Boolean,default:!1},fixedEnd:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1}}),gn={name:{type:String,default:null},placeholder:{type:String,default:""},hideInputIcon:{type:Boolean,default:!1},clearable:{type:Boolean,default:!0},state:{type:Boolean,default:null},required:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"},inputClassName:{type:String,default:null},inlineWithInput:{type:Boolean,default:!1},textInputOptions:{type:Object,default:()=>null},openMenuOnFocus:{type:Boolean,default:!0}},bn={minTime:{type:Object,default:null},maxTime:{type:Object,default:null}},_a={minDate:{type:[Date,String],default:null},maxDate:{type:[Date,String],default:null}},_n=K({selectText:{type:String,default:"Select"},cancelText:{type:String,default:"Cancel"},previewFormat:{type:[String,Function],default:()=>""},multiDates:{type:Boolean,default:!1}},bn),ka={monthPicker:{type:Boolean,default:!1},customProps:{type:Object,default:null}},kn={locale:{type:String,default:"en-Us"},weekNumName:{type:String,default:"W"},weekStart:{type:[Number,String],default:1},weekNumbers:{type:Boolean,default:!1},calendarClassName:{type:String,default:null},noSwipe:{type:Boolean,default:!1}},Dn=Oe(K(K(K(K(K(K({},wn),_n),ka),_a),kn),ba),{vertical:{type:Boolean,default:!1},disableMonthYearSelect:{type:Boolean,default:!1},menuClassName:{type:String,default:null},yearRange:{type:Array,default:()=>[1970,2100]},multiCalendarsSolo:{type:Boolean,default:!1},calendarCellClassName:{type:String,default:null},enableTimePicker:{type:Boolean,default:!0},autoApply:{type:Boolean,default:!1},disabledDates:{type:[Array,Function],default:()=>[]},monthNameFormat:{type:String,default:"short"},startDate:{type:[Date,String],default:null},startTime:{type:[Object,Array],default:null},monthYearComponent:{type:Object,default:null},timePickerComponent:{type:Object,default:null},actionRowComponent:{type:Object,default:null},hideOffsetDates:{type:Boolean,default:!1},autoRange:{type:[Number,String],default:null},noToday:{type:Boolean,default:!1},disabledWeekDays:{type:Array,default:()=>[]},allowedDates:{type:Array,default:()=>[]},showNowButton:{type:Boolean,default:!1},nowButtonLabel:{type:String,default:"Now"},monthChangeOnScroll:{type:[Boolean,String],default:!0},markers:{type:Array,default:()=>[]},modeHeight:{type:[Number,String],default:255},escClose:{type:Boolean,default:!0},spaceConfirm:{type:Boolean,default:!0},monthChangeOnArrows:{type:Boolean,default:!0},presetRanges:{type:Array,default:()=>[]},flow:{type:Array,default:()=>[]},preventMinMaxNavigation:{type:Boolean,default:!1},minRange:{type:[Number,String],default:null},maxRange:{type:[Number,String],default:null},multiDatesLimit:{type:[Number,String],default:null},reverseYears:{type:Boolean,default:!1},keepActionRow:{type:Boolean,default:!1},weekPicker:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})}}),Tl=Oe(K(K(K({},gn),ga),Dn),{multiCalendars:{type:[Boolean,Number,String],default:null},modelValue:{type:[String,Date,Array,Object],default:null},position:{type:String,default:"center"},dark:{type:Boolean,default:!1},format:{type:[String,Function],default:()=>null},closeOnScroll:{type:Boolean,default:!1},autoPosition:{type:Boolean,default:!0},closeOnAutoApply:{type:Boolean,default:!0},teleport:{type:[String,Object],default:"body"},altPosition:{type:[Boolean,Function],default:!1},partialRange:{type:Boolean,default:!0},transitions:{type:Boolean,default:!0},formatLocale:{type:Object,default:null},utc:{type:Boolean,default:!1},ariaLabels:{type:Object,default:()=>({})}}),Tn={range:{type:Boolean,default:!1},multiCalendars:{type:Number,default:0},internalModelValue:{type:[Date,Array],default:null}},xn=Oe(K(K({},ka),Tn),{vertical:{type:Boolean,default:!1},month:{type:Number,default:0},year:{type:Number,default:0},instance:{type:Number,default:1}}),xl=["aria-label","aria-disabled","aria-readonly"],Cl={key:1,class:"dp__input_wrap"},Ml=["id","name","placeholder","disabled","readonly","required","value","autocomplete","onKeydown"],Sl={key:4,class:"dp__clear_icon"},Ol=Ve({props:Oe(K(K(K({},gn),ga),ba),{inputValue:{type:String,default:""},inline:{type:Boolean,default:!1},isMenuOpen:{type:Boolean,default:!1},pattern:{type:String,default:""}}),emits:["clear","open","update:inputValue","setInputDate","close","selectDate","setEmptyDate"],setup(e,{expose:a,emit:t}){const n=e,r=L(),l=L(null),u=L(!1),m=De(je),c=Qt(),f=N(()=>({dp__pointer:!n.disabled&&!n.readonly&&!n.textInput,dp__disabled:n.disabled,dp__input:!0,dp__input_icon_pad:!n.hideInputIcon,dp__input_valid:n.state,dp__input_invalid:n.state===!1,dp__input_focus:u.value||n.isMenuOpen,[n.inputClassName]:!!n.inputClassName})),w=i=>{const{value:p}=i.target,{format:b,rangeSeparator:W}=n.textInputOptions;if(p!==""){if(n.range){const[P,G]=p.split(`${W}`);if(P&&G){const ae=oa(P.trim(),b||n.pattern),M=oa(G.trim(),b||n.pattern);r.value=ae&&M?[ae,M]:null}}else r.value=oa(p,b||n.pattern);t("setInputDate",r.value)}else t("setInputDate",null),n.autoApply&&(t("setEmptyDate"),r.value=null);t("update:inputValue",p)},T=()=>{var i,p;((i=n.textInputOptions)==null?void 0:i.enterSubmit)&&ca(r.value)&&n.inputValue!==""?(t("setInputDate",r.value,!0),r.value=null):((p=n.textInputOptions)==null?void 0:p.enterSubmit)&&n.inputValue===""&&(r.value=null,t("clear"))},D=()=>{var i,p;((i=n.textInputOptions)==null?void 0:i.tabSubmit)&&ca(r.value)&&n.inputValue!==""?(t("setInputDate",r.value,!0),r.value=null):((p=n.textInputOptions)==null?void 0:p.tabSubmit)&&n.inputValue===""&&(r.value=null,t("clear")),t("close")},Y=()=>{var i;!n.inline&&(n.textInput?n.textInput&&((i=n.textInputOptions)==null?void 0:i.openMenu):!0)&&(u.value=!0,n.openMenuOnFocus&&!n.isMenuOpen?t("open"):n.isMenuOpen&&(o(),t("close")))},U=()=>{var i;(!n.openMenuOnFocus||c["dp-input"]||c.trigger)&&(n.textInput&&((i=n.textInputOptions)==null?void 0:i.openMenu)&&!n.isMenuOpen?t("open"):n.textInput||t("open"))},S=()=>{u.value=!1,n.autoApply&&n.textInput&&r.value&&(t("setInputDate",r.value),t("selectDate"),r.value=null)},A=i=>{i.stopImmediatePropagation()},E=()=>{t("clear")},o=()=>{u.value=!1;const i=Se(l);i&&i.blur()};return a({unFocus:o}),(i,p)=>(y(),x("div",{onClick:U,"aria-label":d(m).input,role:"textbox","aria-multiline":"false","aria-disabled":i.disabled,"aria-readonly":i.readonly},[i.$slots.trigger&&!i.$slots["dp-input"]&&!e.inline?R(i.$slots,"trigger",{key:0}):k("",!0),!i.$slots.trigger&&(!e.inline||i.inlineWithInput)?(y(),x("div",Cl,[i.$slots["dp-input"]&&!i.$slots.trigger&&!e.inline?R(i.$slots,"dp-input",{key:0,value:e.inputValue,onInput:w,onEnter:T,onTab:D,onClear:E}):k("",!0),i.$slots["dp-input"]?k("",!0):(y(),x("input",{key:1,ref_key:"inputRef",ref:l,id:i.uid?`dp-input-${i.uid}`:void 0,name:i.name,class:me(d(f)),placeholder:i.placeholder,disabled:i.disabled,readonly:i.readonly,required:i.required,value:e.inputValue,autocomplete:i.autocomplete,onInput:w,onKeydown:[le(T,["enter"]),le(D,["tab"])],onBlur:S,onFocus:Y},null,42,Ml)),i.$slots["input-icon"]&&!i.hideInputIcon?(y(),x("span",{key:2,class:"dp__input_icon",onClick:A},[R(i.$slots,"input-icon")])):k("",!0),!i.$slots["input-icon"]&&!i.hideInputIcon&&!i.$slots["dp-input"]?(y(),te(d(Xt),{key:3,class:"dp__input_icon dp__input_icons",onClick:A})):k("",!0),i.$slots["clear-icon"]&&i.clearable&&!i.disabled&&!i.readonly?(y(),x("span",Sl,[R(i.$slots,"clear-icon",{clear:E})])):k("",!0),i.clearable&&!i.$slots["clear-icon"]&&e.inputValue&&!i.disabled&&!i.readonly?(y(),te(d(Yo),{key:5,class:"dp__clear_icon dp__input_icons",onClick:Ut(E,["stop","prevent"])},null,8,["onClick"])):k("",!0)])):k("",!0)],8,xl))}}),Pl=["aria-label"],Nl={class:"db__calendar_header",role:"row"},$l={key:0,class:"dp__calendar_header_item",role:"gridcell"},Il=B("div",{class:"dp__calendar_header_separator"},null,-1),Al=["aria-label"],Yl={key:0,role:"gridcell",class:"dp__calendar_item dp__week_num"},Ul={class:"dp__cell_inner"},Vl=["aria-selected","aria-disabled","onClick","onKeydown","onMouseover"],El=B("div",{class:"dp__arrow_bottom_tp"},null,-1),Wl=Ve({props:Oe(K(K({},xn),kn),{mappedDates:{type:Array,default:()=>[]},getWeekNum:{type:Function,default:()=>""},modeHeight:{type:[Number,String],default:255},specificMode:{type:Boolean,default:!1}}),emits:["selectDate","setHoverDate","handleScroll","mount","handleSwipe"],setup(e,{expose:a,emit:t}){const n=e,r=L(null),l=L({bottom:"",left:"",transform:""}),u=L([]),m=L(null),c=L(!0),f=De(Kt),w=De(je),T=L(""),D=L({startX:0,endX:0,startY:0,endY:0}),Y=N(()=>vl(n.locale,+n.weekStart));st(()=>{t("mount"),n.noSwipe||m.value&&(m.value.addEventListener("touchstart",W),m.value.addEventListener("touchend",P),m.value.addEventListener("touchmove",G))});const U=(M,re)=>{if(f!=null&&f.value){const J=He(it(new Date,n.month,n.year));T.value=xe(He(it(new Date,M,re)),J)?f.value[n.vertical?"vNext":"next"]:f.value[n.vertical?"vPrevious":"previous"],c.value=!1,fa(()=>{c.value=!0})}},S=N(()=>({dp__calendar_wrap:!0,[n.calendarClassName]:!!n.calendarClassName})),A=N(()=>M=>{const re=kl(M);return{dp__marker_dot:re.type==="dot",dp__marker_line:re.type==="line"}}),E=N(()=>M=>ie(M,r.value)),o=N(()=>({dp__calendar:!0,dp__calendar_next:n.multiCalendars>0&&n.instance!==0})),i=N(()=>n.specificMode?{height:`${n.modeHeight}px`}:null),p=(M,re)=>{var J,g;if(t("setHoverDate",M),(g=(J=M.marker)==null?void 0:J.tooltip)!=null&&g.length){const O=Se(u.value[re]);if(O){const{width:V,height:Z}=O.getBoundingClientRect();l.value={bottom:`${Z}px`,left:`${V/2}px`,transform:"translateX(-50%)"},r.value=M.value}}},b=()=>{r.value=null},W=M=>{D.value.startX=M.changedTouches[0].screenX,D.value.startY=M.changedTouches[0].screenY},P=M=>{D.value.endX=M.changedTouches[0].screenX,D.value.endY=M.changedTouches[0].screenY,ae()},G=M=>{M.preventDefault()},ae=()=>{const M=n.vertical?"Y":"X";Math.abs(D.value[`start${M}`]-D.value[`end${M}`])>10&&t("handleSwipe",D.value[`start${M}`]>D.value[`end${M}`]?"right":"left")};return a({triggerTransition:U}),(M,re)=>(y(),x("div",{class:me(d(o))},[B("div",{style:Ct(d(i))},[e.specificMode?k("",!0):(y(),x("div",{key:0,ref_key:"calendarWrapRef",ref:m,class:me(d(S)),role:"grid","aria-label":d(w).calendarWrap,onWheel:re[1]||(re[1]=Ut(J=>M.$emit("handleScroll",J),["prevent"]))},[B("div",Nl,[M.weekNumbers?(y(),x("div",$l,we(M.weekNumName),1)):k("",!0),(y(!0),x(ne,null,he(d(Y),(J,g)=>(y(),x("div",{class:"dp__calendar_header_item",role:"gridcell",key:g},[M.$slots["calendar-header"]?R(M.$slots,"calendar-header",{key:0,day:J,index:g}):k("",!0),M.$slots["calendar-header"]?k("",!0):(y(),x(ne,{key:1},[qe(we(J),1)],64))]))),128))]),Il,ze(vt,{name:T.value,css:!!d(f)},{default:j(()=>[c.value?(y(),x("div",{key:0,class:"dp__calendar",role:"grid","aria-label":d(w).calendarDays},[(y(!0),x(ne,null,he(e.mappedDates,(J,g)=>(y(),x("div",{class:"dp__calendar_row",role:"row",key:g},[M.weekNumbers?(y(),x("div",Yl,[B("div",Ul,we(e.getWeekNum(J.days)),1)])):k("",!0),(y(!0),x(ne,null,he(J.days,(O,V)=>(y(),x("div",{role:"gridcell",class:"dp__calendar_item",ref_for:!0,ref:Z=>{Z&&(u.value[V+g]=Z)},key:V+g,"aria-selected":O.classData.dp__active_date||O.classData.dp__range_start||O.classData.dp__range_start,"aria-disabled":O.classData.dp__cell_disabled,tabindex:"0",onClick:Ut(Z=>M.$emit("selectDate",O),["stop","prevent"]),onKeydown:le(Z=>M.$emit("selectDate",O),["enter"]),onMouseover:Z=>p(O,V+g),onMouseleave:b},[B("div",{class:me(["dp__cell_inner",O.classData])},[M.$slots.day?R(M.$slots,"day",{key:0,day:+O.text,date:O.value}):k("",!0),M.$slots.day?k("",!0):(y(),x(ne,{key:1},[qe(we(O.text),1)],64)),O.marker?(y(),x("div",{key:2,class:me(d(A)(O.marker)),style:Ct(O.marker.color?{backgroundColor:O.marker.color}:{})},null,6)):k("",!0),d(E)(O.value)?(y(),x("div",{key:3,class:"dp__marker_tooltip",style:Ct(l.value)},[B("div",{class:"dp__tooltip_content",onClick:re[0]||(re[0]=Ut(()=>{},["stop"]))},[(y(!0),x(ne,null,he(O.marker.tooltip,(Z,oe)=>(y(),x("div",{key:oe,class:"dp__tooltip_text"},[M.$slots["marker-tooltip"]?R(M.$slots,"marker-tooltip",{key:0,tooltop:Z,day:O.value}):k("",!0),M.$slots["marker-tooltip"]?k("",!0):(y(),x(ne,{key:1},[B("div",{class:"dp__tooltip_mark",style:Ct(Z.color?{backgroundColor:Z.color}:{})},null,4),B("div",null,we(Z.text),1)],64))]))),128)),El])],4)):k("",!0)],2)],40,Vl))),128))]))),128))],8,Al)):k("",!0)]),_:3},8,["name","css"])],42,Pl))],4)],2))}}),Rl=e=>typeof e=="object",Ha=(e,a)=>a,Hl=e=>Array.isArray(e)&&e.length===2,Bl=e=>Array.isArray(e),Fl=e=>typeof e=="object",Mt=e=>Array.isArray(e),Ie=e=>Array.isArray(e),Rt=e=>Array.isArray(e)&&e.length===2,ql=(e,a)=>a?Array.isArray(e):Rt(e),Ll=e=>Array.isArray(e),Gl=e=>typeof e=="string"||typeof e=="object",Ba=e=>typeof e=="string",Ql={class:"dp__selection_preview"},Xl={class:"dp__action_buttons"},Kl=["onKeydown"],zl=Ve({props:Oe(K(K(K(K(K({},_n),_a),bn),ka),Tn),{inline:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1},calendarWidth:{type:Number,default:0},menuMount:{type:Boolean,default:!1},enableTimePicker:{type:Boolean,default:!0}}),emits:["closePicker","selectDate"],setup(e,{emit:a}){const t=e,n=De(hn),r=N(()=>({dp__action:!0,dp__select:!0,dp__action_disabled:!l.value||!u.value})),l=N(()=>t.enableTimePicker?pa(t.internalModelValue,t.maxTime,t.minTime):!0),u=N(()=>t.monthPicker?cl(t.internalModelValue,t.minDate,t.maxDate):!0),m=w=>Lt(w,t.previewFormat,n==null?void 0:n.value),c=N(()=>!t.internalModelValue||!t.menuMount?"":typeof t.previewFormat=="string"?Mt(t.internalModelValue)?t.internalModelValue.length===2&&t.internalModelValue[1]?t.multiCalendars>0?`${m(t.internalModelValue[0])} - ${m(t.internalModelValue[1])}`:[m(t.internalModelValue[0]),m(t.internalModelValue[1])]:t.multiDates?t.internalModelValue.map(w=>`${m(w)}`):`${m(t.internalModelValue[0])} -`:Lt(t.internalModelValue,t.previewFormat,n==null?void 0:n.value):t.timePicker?t.previewFormat(ma(t.internalModelValue)):t.monthPicker?t.previewFormat(Wt(t.internalModelValue)):t.previewFormat(t.internalModelValue)),f=()=>{l.value&&u.value&&a("selectDate")};return(w,T)=>(y(),x("div",{class:"dp__action_row",style:Ct(e.calendarWidth?{width:`${e.calendarWidth}px`}:{})},[B("div",Ql,[w.$slots["action-preview"]?R(w.$slots,"action-preview",{key:0,value:w.internalModelValue}):k("",!0),w.$slots["action-preview"]?k("",!0):(y(),x(ne,{key:1},[Array.isArray(d(c))?k("",!0):(y(),x(ne,{key:0},[qe(we(d(c)),1)],64)),Array.isArray(d(c))?(y(!0),x(ne,{key:1},he(d(c),(D,Y)=>(y(),x("div",{key:Y},we(D),1))),128)):k("",!0)],64))]),B("div",Xl,[w.$slots["action-select"]?R(w.$slots,"action-select",{key:0,value:w.internalModelValue}):k("",!0),w.$slots["action-select"]?k("",!0):(y(),x(ne,{key:1},[e.inline?k("",!0):(y(),x("span",{key:0,class:"dp__action dp__cancel",tabindex:"0",onClick:T[0]||(T[0]=D=>w.$emit("closePicker")),onKeydown:T[1]||(T[1]=le(D=>w.$emit("closePicker"),["enter"]))},we(w.cancelText),33)),B("span",{class:me(d(r)),tabindex:"0",onKeydown:le(f,["enter"]),onClick:f},we(w.selectText),43,Kl)],64))])],4))}}),jl={class:"dp__overlay_container",role:"grid"},Jl={class:"dp__selection_grid_header"},Zl=["aria-selected","aria-disabled","onClick","onKeydown","onMouseover"],ei=["aria-label","onKeydown"],Gt=Ve({props:{items:{type:Array,default:()=>[]},modelValue:{type:[String,Number],default:null},multiModelValue:{type:Array,default:()=>[]},disabledValues:{type:Array,default:()=>[]},minValue:{type:[Number,String],default:null},maxValue:{type:[Number,String],default:null},year:{type:Number,default:0},skipActive:{type:Boolean,default:!1}},emits:["update:modelValue","selected","toggle","reset-flow"],setup(e,{emit:a}){const t=e,n=L(!1),r=L(null),l=L(null),u=De(wa,!1),m=De(vn,L(!1)),c=De(je),f=L();Mn(()=>{r.value=null}),st(()=>{S();const i=Se(l);i&&(m.value||i.focus({preventScroll:!0}),n.value=i.clientHeight<i.scrollHeight)});const w=N(()=>({dp__overlay:!0})),T=N(()=>({dp__overlay_col:!0})),D=N(()=>t.items.map(i=>i.filter(p=>p).map(p=>{var b,W,P;const G=t.disabledValues.some(M=>M===p.value)||U(p.value),ae=(b=t.multiModelValue)!=null&&b.length?(W=t.multiModelValue)==null?void 0:W.some(M=>ie(M,Et(Ot(new Date,p.value),t.year))):t.skipActive?!1:p.value===t.modelValue;return Oe(K({},p),{className:{dp__overlay_cell_active:ae,dp__overlay_cell:!ae,dp__overlay_cell_disabled:G,dp__overlay_cell_active_disabled:G&&ae,dp__overlay_cell_pad:!0,dp__cell_in_between:(P=t.multiModelValue)!=null&&P.length?E(p.value):!1}})}))),Y=N(()=>({dp__button:!0,dp__overlay_action:!0,dp__over_action_scroll:n.value,dp__button_bottom:u})),U=i=>{const p=t.maxValue?+i>+t.maxValue:!1,b=t.minValue?+i<+t.minValue:!1;return p||b},S=()=>{const i=Se(r);if(i){const p=Se(l);p&&(p.scrollTop=i.offsetTop-p.offsetTop-(p.getBoundingClientRect().height/2-i.getBoundingClientRect().height))}},A=i=>{!t.disabledValues.some(p=>p===i)&&(t.minValue?+t.minValue<=i:!0)&&(t.maxValue?+t.maxValue>=i:!0)&&(a("update:modelValue",i),a("selected"))},E=i=>fn(t.multiModelValue,Et(Ot(new Date,f.value||0),t.year),Et(Ot(new Date,i),t.year)),o=()=>{a("toggle"),a("reset-flow")};return(i,p)=>(y(),x("div",{ref_key:"gridWrapRef",ref:l,class:me(d(w)),role:"dialog",tabindex:"0"},[B("div",jl,[B("div",Jl,[R(i.$slots,"header")]),(y(!0),x(ne,null,he(d(D),(b,W)=>(y(),x("div",{class:"dp__overlay_row",key:d(_l)(W),role:"row"},[(y(!0),x(ne,null,he(b,P=>(y(),x("div",{role:"gridcell",class:me(d(T)),key:P.value,"aria-selected":P.value===e.modelValue&&!e.disabledValues.includes(P.value),"aria-disabled":P.className.dp__overlay_cell_disabled,ref_for:!0,ref:G=>{P.value===e.modelValue&&!e.disabledValues.includes(P.value)&&(r.value=G)},tabindex:"0",onClick:G=>A(P.value),onKeydown:le(G=>A(P.value),["enter"]),onMouseover:G=>f.value=P.value},[B("div",{class:me(P.className)},[i.$slots.item?R(i.$slots,"item",{key:0,item:P}):k("",!0),i.$slots.item?k("",!0):(y(),x(ne,{key:1},[qe(we(P.text),1)],64))],2)],42,Zl))),128))]))),128)),i.$slots["button-icon"]?(y(),x("div",{key:0,role:"button","aria-label":d(c).toggleOverlay,class:me(d(Y)),tabindex:"0",onClick:o,onKeydown:le(o,["enter"])},[R(i.$slots,"button-icon")],42,ei)):k("",!0)])],2))}}),zt=()=>{const e=De(Kt);return{transitionName:N(()=>a=>e!=null&&e.value?a?e.value.open:e.value.close:""),showTransition:!!(e!=null&&e.value)}},ti={key:0,class:"dp__time_input"},ai=qe(" : "),ni=["aria-label","onKeydown","onClick"],ri=["aria-label","onKeydown","onClick"],oi=["aria-label","onKeydown","onClick"],li={key:0},ii=["aria-label","onKeydown"],si=Ve({props:Oe(K({},yn),{hours:{type:Number,default:0},minutes:{type:Number,default:0},seconds:{type:Number,default:0},filters:{type:Object,default:()=>({})},disabled:{type:Boolean,default:!1}}),emits:["setHours","setMinutes","update:hours","update:minutes","update:seconds","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,r=qa({hours:!1,minutes:!1,seconds:!1}),l=L("AM"),u=De(je),{transitionName:m,showTransition:c}=zt(),f=N(()=>({dp__time_col:!0,dp__time_col_reg:!n.enableSeconds&&n.is24,dp__time_col_reg_with_button:!n.enableSeconds&&!n.is24,dp__time_col_sec:n.enableSeconds&&n.is24,dp__time_col_sec_with_button:n.enableSeconds&&!n.is24})),w=N(()=>{const i=[{type:"hours"},"separator",{type:"minutes"}];return n.enableSeconds?i.concat(["separator",{type:"seconds"}]):i}),T=N(()=>w.value.filter(i=>typeof i!="string")),D=N(()=>i=>{if(i==="hours"){const p=E(n.hours);return{text:p<10?`0${p}`:`${p}`,value:p}}return{text:n[i]<10?`0${n[i]}`:`${n[i]}`,value:n[i]}}),Y=i=>{const p=i==="hours"?n.is24?24:12:60,b=+n[`${i}GridIncrement`],W=[];for(let P=0;P<p;P+=b)W.push({value:P,text:P<10?`0${P}`:`${P}`});return fl(W)},U=i=>n[`no${i[0].toUpperCase()+i.slice(1)}Overlay`],S=i=>{U(i)||(r[i]=!r[i])},A=(i,p=!0)=>{const b=i==="hours"?Ae:i==="minutes"?Ye:Ke,W=p?ul:dl;t(`update:${i}`,b(W({[i]:+n[i]},{[i]:+n[`${i}Increment`]})))},E=i=>n.is24?i:(i>=12?l.value="PM":l.value="AM",wl(i)),o=()=>{l.value==="PM"?(l.value="AM",t("update:hours",n.hours-12)):(l.value="PM",t("update:hours",n.hours+12))};return a({openChildCmp:i=>{r[i]=!0}}),(i,p)=>e.disabled?k("",!0):(y(),x("div",ti,[(y(!0),x(ne,null,he(d(w),(b,W)=>(y(),x("div",{key:W,class:me(d(f))},[b==="separator"?(y(),x(ne,{key:0},[ai],64)):(y(),x(ne,{key:1},[B("div",{class:"dp__inc_dec_button",role:"button","aria-label":d(u).incrementValue(b.type),tabindex:"0",onKeydown:le(P=>A(b.type),["enter"]),onClick:P=>A(b.type)},[i.$slots["arrow-up"]?R(i.$slots,"arrow-up",{key:0}):k("",!0),i.$slots["arrow-up"]?k("",!0):(y(),te(d(cn),{key:1}))],40,ni),B("div",{role:"button","aria-label":d(u).openTpOverlay(b.type),class:me(U(b.type)?"":"dp__time_display"),tabindex:"0",onKeydown:le(P=>S(b.type),["enter"]),onClick:P=>S(b.type)},[i.$slots[b.type]?R(i.$slots,b.type,{key:0,text:d(D)(b.type).text,value:d(D)(b.type).value}):k("",!0),i.$slots[b.type]?k("",!0):(y(),x(ne,{key:1},[qe(we(d(D)(b.type).text),1)],64))],42,ri),B("div",{class:"dp__inc_dec_button",role:"button","aria-label":d(u).decrementValue(b.type),tabindex:"0",onKeydown:le(P=>A(b.type,!1),["enter"]),onClick:P=>A(b.type,!1)},[i.$slots["arrow-down"]?R(i.$slots,"arrow-down",{key:0}):k("",!0),i.$slots["arrow-down"]?k("",!0):(y(),te(d(mn),{key:1}))],40,oi)],64))],2))),128)),i.is24?k("",!0):(y(),x("div",li,[i.$slots["am-pm-button"]?R(i.$slots,"am-pm-button",{key:0,toggle:o,value:l.value}):k("",!0),i.$slots["am-pm-button"]?k("",!0):(y(),x("button",{key:1,class:"dp__pm_am_button",role:"button","aria-label":d(u).amPmButton,tabindex:"0",onClick:o,onKeydown:le(o,["enter"])},we(l.value),41,ii))])),(y(!0),x(ne,null,he(d(T),(b,W)=>(y(),te(vt,{key:W,name:d(m)(d(r)[b.type]),css:d(c)},{default:j(()=>[d(r)[b.type]?(y(),te(Gt,{key:0,items:Y(b.type),"disabled-values":e.filters.times[b.type],"onUpdate:modelValue":P=>i.$emit(`update:${b.type}`,P),onSelected:P=>S(b.type),onToggle:P=>S(b.type),onResetFlow:p[0]||(p[0]=P=>i.$emit("reset-flow"))},Me({"button-icon":j(()=>[i.$slots["clock-icon"]?R(i.$slots,"clock-icon",{key:0}):k("",!0),i.$slots["clock-icon"]?k("",!0):(y(),te(d(dn),{key:1}))]),_:2},[i.$slots[`${b.type}-overlay`]?{name:"item",fn:j(({item:P})=>[R(i.$slots,`${b.type}-overlay`,{text:P.text,value:P.value})])}:void 0]),1032,["items","disabled-values","onUpdate:modelValue","onSelected","onToggle"])):k("",!0)]),_:2},1032,["name","css"]))),128))]))}}),xt=[{name:"clock-icon",use:["time","calendar"]},{name:"arrow-left",use:["month-year","calendar"]},{name:"arrow-right",use:["month-year","calendar"]},{name:"arrow-up",use:["time","calendar"]},{name:"arrow-down",use:["time","calendar"]},{name:"calendar-icon",use:["month-year","time","calendar"]},{name:"day",use:["calendar"]},{name:"month-overlay",use:["calendar","month-year"]},{name:"year-overlay",use:["calendar","month-year"]},{name:"hours-overlay",use:["calendar","time"]},{name:"minutes-overlay",use:["calendar","time"]},{name:"seconds-overlay",use:["calendar","time"]},{name:"hours",use:["calendar","time"]},{name:"minutes",use:["calendar","time"]},{name:"month",use:["calendar","month-year"]},{name:"year",use:["calendar","month-year"]},{name:"action-select",use:["action"]},{name:"action-preview",use:["action"]},{name:"calendar-header",use:["calendar"]},{name:"marker-tooltip",use:["calendar"]},{name:"now-button",use:[]},{name:"time-picker-overlay",use:["calendar","time"]},{name:"am-pm-button",use:["calendar","time"]}],ui=[{name:"trigger"},{name:"input-icon"},{name:"clear-icon"},{name:"dp-input"}],di={all:()=>xt,monthYear:()=>xt.filter(e=>e.use.includes("month-year")),input:()=>ui,timePicker:()=>xt.filter(e=>e.use.includes("time")),action:()=>xt.filter(e=>e.use.includes("action")),calendar:()=>xt.filter(e=>e.use.includes("calendar"))},rt=(e,a)=>{const t=[];return di[a]().forEach(n=>{e[n.name]&&t.push(n.name)}),t},ci=["aria-label"],mi={key:0,class:"dp__overlay"},pi={class:"dp__overlay_container"},fi={key:1,class:"dp__overlay_row"},vi=["aria-label"],hi=Ve({props:Oe(K({},wn),{range:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})},hours:{type:[Number,Array],default:0},minutes:{type:[Number,Array],default:0},seconds:{type:[Number,Array],default:0},customProps:{type:Object,default:null}}),emits:["update:hours","update:minutes","update:seconds","mount","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,r=Qt(),l=De(wa,!1),u=L(null),m=De(je),{transitionName:c,showTransition:f}=zt();st(()=>{t("mount")});const w=L(!1),T=p=>({hours:Array.isArray(n.hours)?n.hours[p]:n.hours,minutes:Array.isArray(n.minutes)?n.minutes[p]:n.minutes,seconds:Array.isArray(n.seconds)?n.seconds[p]:n.seconds}),D=N(()=>{const p=[];if(n.range)for(let b=0;b<2;b++)p.push(T(b));else p.push(T(0));return p}),Y=(p,b=!1,W="")=>{b||t("reset-flow"),w.value=p,fa(()=>{W!==""&&u.value&&u.value.openChildCmp(W)})},U=N(()=>({dp__button:!0,dp__button_bottom:l})),S=rt(r,"timePicker"),A=(p,b,W)=>n.range?b===0?[p,D.value[1][W]]:[D.value[0][W],p]:p,E=p=>{t("update:hours",p)},o=p=>{t("update:minutes",p)},i=p=>{t("update:seconds",p)};return a({toggleTimePicker:Y}),(p,b)=>(y(),x("div",null,[p.timePicker?k("",!0):(y(),x("div",{key:0,class:me(d(U)),role:"button","aria-label":d(m).openTimePicker,tabindex:"0",onKeydown:b[0]||(b[0]=le(W=>Y(!0),["enter"])),onClick:b[1]||(b[1]=W=>Y(!0))},[p.$slots["clock-icon"]?R(p.$slots,"clock-icon",{key:0}):k("",!0),p.$slots["clock-icon"]?k("",!0):(y(),te(d(dn),{key:1}))],42,ci)),ze(vt,{name:d(c)(w.value),css:d(f)},{default:j(()=>[w.value||p.timePicker?(y(),x("div",mi,[B("div",pi,[p.$slots["time-picker-overlay"]?R(p.$slots,"time-picker-overlay",{key:0,range:e.range,hours:e.hours,minutes:e.minutes,seconds:e.seconds,setHours:E,setMinutes:o,setSeconds:i}):k("",!0),p.$slots["time-picker-overlay"]?k("",!0):(y(),x("div",fi,[(y(!0),x(ne,null,he(d(D),(W,P)=>(y(),te(si,Ce({key:P,disabled:P===0?p.fixedStart:p.fixedEnd,hours:W.hours,minutes:W.minutes,seconds:W.seconds,filters:e.filters},{is24:p.is24,hoursGridIncrement:p.hoursGridIncrement,minutesGridIncrement:p.minutesGridIncrement,secondsGridIncrement:p.secondsGridIncrement,hoursIncrement:p.hoursIncrement,minutesIncrement:p.minutesIncrement,secondsIncrement:p.secondsIncrement,filters:e.filters,noHoursOverlay:p.noHoursOverlay,noMinutesOverlay:p.noMinutesOverlay,noSecondsOverlay:p.noSecondsOverlay,enableSeconds:p.enableSeconds},{"onUpdate:hours":G=>E(A(G,P,"hours")),"onUpdate:minutes":G=>o(A(G,P,"minutes")),"onUpdate:seconds":G=>i(A(G,P,"seconds"))}),Me({_:2},[he(d(S),(G,ae)=>({name:G,fn:j(M=>[R(p.$slots,G,Xe(nt(M)))])}))]),1040,["disabled","hours","minutes","seconds","filters","onUpdate:hours","onUpdate:minutes","onUpdate:seconds"]))),128))])),p.timePicker?k("",!0):(y(),x("div",{key:2,class:me(d(U)),role:"button","aria-label":d(m).closeTimePicker,tabindex:"0",onKeydown:b[2]||(b[2]=le(W=>Y(!1),["enter"])),onClick:b[3]||(b[3]=W=>Y(!1))},[p.$slots["calendar-icon"]?R(p.$slots,"calendar-icon",{key:0}):k("",!0),p.$slots["calendar-icon"]?k("",!0):(y(),te(d(Xt),{key:1}))],42,vi))])])):k("",!0)]),_:3},8,["name","css"])]))}}),yi=["aria-label"],ua=Ve({props:{ariaLabel:{type:String,default:""}},emits:["activate"],setup(e){return(a,t)=>(y(),x("div",{class:"dp__month_year_col_nav",onClick:t[0]||(t[0]=n=>a.$emit("activate")),onKeydown:t[1]||(t[1]=le(n=>a.$emit("activate"),["enter"])),tabindex:"0"},[B("div",{class:"dp__inner_nav",role:"button","aria-label":e.ariaLabel},[R(a.$slots,"default")],8,yi)],32))}}),wi=["aria-label"],Fa=Ve({props:{ariaLabel:{type:String,default:""},showSelectionGrid:{type:Boolean,default:!1},modelValue:{type:Number,default:null},items:{type:Array,default:()=>[]},disabledValues:{type:Array,default:()=>[]},minValue:{type:Number,default:null},maxValue:{type:Number,default:null},slotName:{type:String,default:""}},emits:["update:model-value","toggle"],setup(e){const{transitionName:a,showTransition:t}=zt();return(n,r)=>(y(),x(ne,null,[B("div",{class:"dp__month_year_select",onClick:r[0]||(r[0]=l=>n.$emit("toggle")),onKeydown:r[1]||(r[1]=le(l=>n.$emit("toggle"),["enter"])),role:"button","aria-label":e.ariaLabel,tabindex:"0"},[R(n.$slots,"default")],40,wi),ze(vt,{name:d(a)(e.showSelectionGrid),css:d(t)},{default:j(()=>[e.showSelectionGrid?(y(),te(Gt,Ce({key:0},{modelValue:e.modelValue,items:e.items,disabledValues:e.disabledValues,minValue:e.minValue,maxValue:e.maxValue},{"onUpdate:modelValue":r[2]||(r[2]=l=>n.$emit("update:model-value",l)),onToggle:r[3]||(r[3]=l=>n.$emit("toggle"))}),Me({"button-icon":j(()=>[n.$slots["calendar-icon"]?R(n.$slots,"calendar-icon",{key:0}):k("",!0),n.$slots["calendar-icon"]?k("",!0):(y(),te(d(Xt),{key:1}))]),_:2},[n.$slots[e.slotName]?{name:"item",fn:j(({item:l})=>[R(n.$slots,e.slotName,{item:l})])}:void 0]),1040)):k("",!0)]),_:3},8,["name","css"])],64))}}),gi=(e,a)=>{const t=(c,f)=>{let w=c;return e.filters.months.includes(pe(w))?(w=f?Le(c,1):Nt(c,1),t(w,f)):w},n=(c,f)=>{let w=c;return e.filters.years.includes(fe(w))?(w=f?Qa(c,1):vo(c,1),n(w,f)):w},r=(c,f,w)=>[new Date(e[c]),Ue(new Date,{month:f,year:w})],l=(c,f)=>{e.preventMinMaxNavigation&&(e.minDate||e.maxDate)?(e.maxDate&&(xe(...r("maxDate",c,f))||ie(...r("maxDate",c,f)))&&m(c,f),(e.minDate&&ge(...r("minDate",c,f))||ie(...r("minDate",c,f)))&&m(c,f)):m(c,f)},u=c=>{const f=Ue(new Date,{month:e.month,year:e.year});let w=c?Le(f,1):Nt(f,1),T=pe(w),D=fe(w);e.filters.months.includes(T)&&(w=t(w,c),T=pe(w),D=fe(w)),e.filters.years.includes(D)&&(w=n(w,c),D=fe(w)),l(T,D)},m=(c,f)=>{a("update:month",c),a("update:year",f)};return{handleMonthYearChange:u}},bi={class:"dp__month_year_row"},_i={class:"dp__month_picker_header"},ki=["aria-label"],Di=["aria-label","onKeydown"],Ti=["aria-label"],xi=Ve({props:Oe(K(K({},xn),_a),{preventMinMaxNavigation:{type:Boolean,default:!1},reverseYears:{type:Boolean,default:!1},years:{type:Array,default:()=>[]},months:{type:Array,default:()=>[]},filters:{type:Object,default:()=>({})},multiCalendarsSolo:{type:Boolean,default:!1}}),emits:["update:month","update:year","monthYearSelect","mount","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,{transitionName:r,showTransition:l}=zt(),u=L(!1),m=L(!1),c=De(je),{handleMonthYearChange:f}=gi(n,t);st(()=>{t("mount")});const w=g=>({get:()=>n[g],set:O=>{t(`update:${g}`,O),t("monthYearSelect",g==="year"),g==="month"?ae(!0):M(!0)}}),T=N(w("month")),D=N(w("year")),Y=N(()=>g=>{const O=g==="month";return{showSelectionGrid:(O?u:m).value,items:(O?b:W).value,disabledValues:n.filters[O?"months":"years"],minValue:(O?A:U).value,maxValue:(O?E:S).value}}),U=N(()=>n.minDate?fe(new Date(n.minDate)):null),S=N(()=>n.maxDate?fe(new Date(n.maxDate)):null),A=N(()=>{if(n.minDate&&U.value){if(U.value>n.year)return 12;if(U.value===n.year)return pe(new Date(n.minDate))}return null}),E=N(()=>{if(n.maxDate&&S.value){if(S.value<n.year)return-1;if(S.value===n.year)return pe(new Date(n.maxDate))}return null}),o=N(()=>n.range&&n.internalModelValue&&n.monthPicker?n.internalModelValue:[]),i=(g,O=!1)=>{const V=[];for(let Z=0;Z<g.length;Z+=3){const oe=[g[Z],g[Z+1],g[Z+2]];V.push(O?oe.reverse():oe)}return O?V.reverse():V},p=N(()=>n.months.find(O=>O.value===n.month)||{text:"",value:0}),b=N(()=>i(n.months)),W=N(()=>i(n.years,n.reverseYears)),P=N(()=>n.multiCalendars?n.multiCalendarsSolo?!0:n.instance===0:!0),G=N(()=>n.multiCalendars?n.multiCalendarsSolo?!0:n.instance===n.multiCalendars-1:!0),ae=(g=!1)=>{re(g),u.value=!u.value},M=(g=!1)=>{re(g),m.value=!m.value},re=g=>{g||t("reset-flow")},J=(g=!1)=>{t("update:year",g?n.year+1:n.year-1)};return a({toggleMonthPicker:ae,toggleYearPicker:M}),(g,O)=>(y(),x("div",bi,[g.monthPicker?k("",!0):(y(),x(ne,{key:0},[d(P)&&!g.vertical?(y(),te(ua,{key:0,"aria-label":d(c).prevMonth,onActivate:O[0]||(O[0]=V=>d(f)(!1))},{default:j(()=>[g.$slots["arrow-left"]?R(g.$slots,"arrow-left",{key:0}):k("",!0),g.$slots["arrow-left"]?k("",!0):(y(),te(d(Ya),{key:1}))]),_:3},8,["aria-label"])):k("",!0),ze(Fa,Ce({"aria-label":d(c).openMonthsOverlay,"slot-name":"month-overlay",modelValue:d(T),"onUpdate:modelValue":O[1]||(O[1]=V=>pt(T)?T.value=V:null)},d(Y)("month"),{onToggle:ae}),Me({default:j(()=>[g.$slots.month?R(g.$slots,"month",Xe(Ce({key:0},d(p)))):k("",!0),g.$slots.month?k("",!0):(y(),x(ne,{key:1},[qe(we(d(p).text),1)],64))]),_:2},[g.$slots["calendar-icon"]?{name:"calendar-icon",fn:j(()=>[R(g.$slots,"calendar-icon")])}:void 0,g.$slots["month-overlay"]?{name:"month-overlay",fn:j(({item:V})=>[R(g.$slots,"month-overlay",{text:V.text,value:V.value})])}:void 0]),1040,["aria-label","modelValue"]),ze(Fa,Ce({"aria-label":d(c).openYearsOverlay,"slot-name":"year-overlay",modelValue:d(D),"onUpdate:modelValue":O[2]||(O[2]=V=>pt(D)?D.value=V:null)},d(Y)("year"),{onToggle:M}),Me({default:j(()=>[g.$slots.year?R(g.$slots,"year",{key:0,year:g.year}):k("",!0),g.$slots.year?k("",!0):(y(),x(ne,{key:1},[qe(we(g.year),1)],64))]),_:2},[g.$slots["calendar-icon"]?{name:"calendar-icon",fn:j(()=>[R(g.$slots,"calendar-icon")])}:void 0,g.$slots["year-overlay"]?{name:"year-overlay",fn:j(({item:V})=>[R(g.$slots,"year-overlay",{text:V.text,value:V.value})])}:void 0]),1040,["aria-label","modelValue"]),d(P)&&g.vertical?(y(),te(ua,{key:1,"aria-label":d(c).prevMonth,onActivate:O[3]||(O[3]=V=>d(f)(!1))},{default:j(()=>[g.$slots["arrow-up"]?R(g.$slots,"arrow-up",{key:0}):k("",!0),g.$slots["arrow-up"]?k("",!0):(y(),te(d(cn),{key:1}))]),_:3},8,["aria-label"])):k("",!0),d(G)?(y(),te(ua,{key:2,"arial-label":d(c).nextMonth,onActivate:O[4]||(O[4]=V=>d(f)(!0))},{default:j(()=>[g.$slots[g.vertical?"arrow-down":"arrow-right"]?R(g.$slots,g.vertical?"arrow-down":"arrow-right",{key:0}):k("",!0),g.$slots[g.vertical?"arrow-down":"arrow-right"]?k("",!0):(y(),te(Vt(g.vertical?d(mn):d(Ua)),{key:1}))]),_:3},8,["arial-label"])):k("",!0)],64)),g.monthPicker?(y(),te(Gt,Ce({key:1},d(Y)("month"),{"skip-active":n.range,year:g.year,"multi-model-value":d(o),modelValue:d(T),"onUpdate:modelValue":O[10]||(O[10]=V=>pt(T)?T.value=V:null),onToggle:ae}),Me({header:j(()=>[B("div",_i,[B("div",{class:"dp__month_year_col_nav",tabindex:"0",onClick:O[5]||(O[5]=V=>J(!1)),onKeydown:O[6]||(O[6]=le(V=>J(!1),["enter"]))},[B("div",{class:"dp__inner_nav",role:"button","aria-label":d(c).prevMonth},[g.$slots["arrow-left"]?R(g.$slots,"arrow-left",{key:0}):k("",!0),g.$slots["arrow-left"]?k("",!0):(y(),te(d(Ya),{key:1}))],8,ki)],32),B("div",{class:"dp__pointer",role:"button","aria-label":d(c).openYearsOverlay,tabindex:"0",onClick:M,onKeydown:le(M,["enter"])},[g.$slots.year?R(g.$slots,"year",{key:0,year:g.year}):k("",!0),g.$slots.year?k("",!0):(y(),x(ne,{key:1},[qe(we(g.year),1)],64))],40,Di),B("div",{class:"dp__month_year_col_nav",tabindex:"0",onClick:O[7]||(O[7]=V=>J(!0)),onKeydown:O[8]||(O[8]=le(V=>J(!0),["enter"]))},[B("div",{class:"dp__inner_nav",role:"button","aria-label":d(c).nextMonth},[g.$slots["arrow-right"]?R(g.$slots,"arrow-right",{key:0}):k("",!0),g.$slots["arrow-right"]?k("",!0):(y(),te(d(Ua),{key:1}))],8,Ti)],32)]),ze(vt,{name:d(r)(m.value),css:d(l)},{default:j(()=>[m.value?(y(),te(Gt,Ce({key:0},d(Y)("year"),{modelValue:d(D),"onUpdate:modelValue":O[9]||(O[9]=V=>pt(D)?D.value=V:null),onToggle:M}),Me({"button-icon":j(()=>[g.$slots["calendar-icon"]?R(g.$slots,"calendar-icon",{key:0}):k("",!0),g.$slots["calendar-icon"]?k("",!0):(y(),te(d(Xt),{key:1}))]),_:2},[g.$slots["year-overlay"]?{name:"item",fn:j(({item:V})=>[R(g.$slots,"year-overlay",{text:V.text,value:V.value})])}:void 0]),1040,["modelValue"])):k("",!0)]),_:3},8,["name","css"])]),_:2},[g.$slots["month-overlay"]?{name:"item",fn:j(({item:V})=>[R(g.$slots,"month-overlay",{text:V.text,value:V.value})])}:void 0]),1040,["skip-active","year","multi-model-value","modelValue"])):k("",!0)]))}}),Ci=(e,a,t,n,r)=>{const l=L(new Date),u=L(),m=L([{month:pe(new Date),year:fe(new Date)}]),c=L(e.range?[Ae(new Date),Ae(new Date)]:Ae(new Date)),f=L(e.range?[Ye(new Date),Ye(new Date)]:Ye(new Date)),w=L(e.range?[0,0]:0);Pt(m,()=>{setTimeout(()=>{e.openOnTop&&a("dpOpen")},0)},{deep:!0}),st(()=>{M(),o.value||(e.startDate&&(m.value[0].month=pe(new Date(e.startDate)),m.value[0].year=fe(new Date(e.startDate)),e.multiCalendars&&Te(0)),e.startTime&&E())});const T=N(()=>s=>m.value[s]?m.value[s].month:0),D=N(()=>s=>m.value[s]?m.value[s].year:0),Y=(s,_,C)=>{m.value[s].month=_,m.value[s].year=C},U=(s,_)=>m.value[s].month=_,S=(s,_)=>m.value[s].year=_,A=(s=!0)=>e.enableSeconds?Array.isArray(w.value)?s?w.value[0]:w.value[1]:w.value:0,E=()=>{e.startTime&&(Ll(e.startTime)?(c.value=[+e.startTime[0].hours,+e.startTime[1].hours],f.value=[+e.startTime[0].minutes,+e.startTime[1].minutes],e.enableSeconds&&(w.value=[+e.startTime[0].seconds,+e.startTime[1].seconds])):(c.value=+e.startTime.hours,f.value=+e.startTime.minutes,e.enableSeconds&&(w.value=+e.startTime.seconds)))},o=N({get:()=>e.internalModelValue,set:s=>{!e.readonly&&!e.disabled&&a("update:internalModelValue",s)}});Pt(o,()=>M());const i=s=>{const _=e.maxDate?xe(Ne(s),Ne(new Date(e.maxDate))):!1,C=e.minDate?ge(Ne(s),Ne(new Date(e.minDate))):!1,z=typeof e.disabledDates=="function"?e.disabledDates(s):e.disabledDates.some($e=>ie(Ne(new Date($e)),Ne(s))),Pe=(e.filters.months.length?e.filters.months.map($e=>+$e):[]).includes(pe(s)),et=e.disabledWeekDays.length?e.disabledWeekDays.some($e=>+$e===Hr(s)):!1,Fe=e.allowedDates.length?!e.allowedDates.some($e=>ie(Ne(new Date($e)),Ne(s))):!1,tt=fe(s),Ee=tt<+e.yearRange[0]||tt>+e.yearRange[1];return _||C||z||Pe||Ee||et||Fe},p=s=>!o.value||e.hideOffsetDates&&!s.current||e.range?!1:e.multiDates&&Array.isArray(o.value)?o.value.some(_=>ie(_,s.value)):ie(s.value,o.value?o.value:l.value),b=s=>fn(o.value,u.value,s.value),W=s=>{if(U(0,pe(s)),S(0,fe(s)),e.multiCalendars)for(let _=1;_<e.multiCalendars;_++){const C=Ue(new Date,{month:T.value(_-1),year:D.value(_-1)}),z=Ga(C,{months:1});m.value.push({month:pe(z),year:fe(z)})}},P=()=>{if(Array.isArray(o.value)&&o.value.length===2){const s=new Date(o.value[1]?o.value[1]:Le(o.value[0],1)),[_,C]=[pe(o.value[0]),fe(o.value[0])],[z,Pe]=[pe(o.value[1]),fe(o.value[1])];(_!==z||_===z&&C!==Pe)&&e.multiCalendarsSolo&&(U(1,pe(s)),S(1,fe(s)))}},G=s=>{W(s),c.value=Ae(s),f.value=Ye(s),w.value=Ke(s)},ae=()=>Array.isArray(o.value)&&o.value.length?o.value[o.value.length-1]:null,M=()=>{if(o.value)if(Mt(o.value)){if(o.value.length===2&&!e.multiDates)W(o.value[0]),c.value=[Ae(o.value[0]),o.value[1]?Ae(o.value[1]):Ae(new Date)],f.value=[Ye(o.value[0]),o.value[1]?Ye(o.value[1]):Ye(new Date)],w.value=[Ke(o.value[0]),o.value[1]?Ke(o.value[1]):Ke(new Date)];else if(Mt(o.value)&&e.multiDates){const s=o.value[o.value.length-1];s&&G(s)}e.multiCalendars&&e.multiCalendarsSolo&&P()}else G(o.value);else e.timePicker?(E(),e.range?Ie(c.value)&&Ie(f.value)&&(o.value=[ke(new Date,c.value[0],f.value[0],A()),ke(new Date,c.value[1],f.value[1],A(!1))]):o.value=ke(new Date,c.value,f.value,A())):e.monthPicker&&!e.range?o.value=it(new Date,T.value(0),D.value(0)):e.multiCalendars&&W(new Date)},re=s=>{const _=pe(new Date(s)),C=fe(new Date(s));if(U(0,_),S(0,C),e.multiCalendars>0)for(let z=1;z<e.multiCalendars;z++){const Pe=sl(Ue(new Date(s),{year:T.value(z-1),month:D.value(z-1)}));U(z,Pe.month),S(z,Pe.year)}},J=s=>{if(o.value&&Array.isArray(o.value))if(o.value.some(_=>ie(s,_))){const _=o.value.filter(C=>!ie(C,s));o.value=_.length?_:null}else(e.multiDatesLimit&&+e.multiDatesLimit>o.value.length||!e.multiDatesLimit)&&o.value.push(s);else o.value=[s]},g=s=>{if(Array.isArray(o.value)&&o.value[0]){const _=Yn(s,o.value[0]),C=Math.abs(_<0?_+1:_-1);if(e.minRange&&e.maxRange)return C>=+e.minRange&&C<=+e.maxRange;if(e.minRange)return C>=+e.minRange;if(e.maxRange)return C<=+e.maxRange}return!0},O=s=>Array.isArray(o.value)&&o.value.length===2?e.fixedStart&&(xe(s,o.value[0])||ie(s,o.value[0]))?[o.value[0],s]:e.fixedEnd&&(ge(s,o.value[1])||ie(s,o.value[1]))?[s,o.value[1]]:o.value:[],V=()=>{e.autoApply&&a("autoApply")},Z=(s,_=!1)=>{if(!i(s.value)&&!(!s.current&&e.hideOffsetDates)){if(e.weekPicker)return o.value=Yt(new Date(s.value),+e.weekStart),V();if(!e.range&&!Ie(c.value)&&!Ie(f.value)){const C=ke(new Date(s.value),c.value,f.value,A());e.multiDates?J(C):o.value=C,t(),V()}else if(Ie(c.value)&&Ie(f.value)&&!e.multiDates){let C=o.value?o.value.slice():[];C.length===2&&!(e.fixedStart||e.fixedEnd)&&(C=[]),e.autoRange?(_&&re(s.value),C=[new Date(s.value),ot(new Date(s.value),+e.autoRange)]):e.fixedStart||e.fixedEnd?C=O(new Date(s.value)):C[0]?g(new Date(s.value))&&(ge(new Date(s.value),new Date(C[0]))?C.unshift(new Date(s.value)):C[1]=new Date(s.value)):C[0]=new Date(s.value),C[0]&&!C[1]?C[0]=ke(C[0],c.value[0],f.value[0],A()):(C[0]=ke(C[0],c.value[0],f.value[0],A()),C[1]=ke(C[1],c.value[1],f.value[1],A(!1)),t()),o.value=C,C[0]&&C[1]&&e.autoApply&&a("autoApply")}}},oe=s=>{const _=s.find(C=>C.current);return _?qr(_.value):""},de=s=>{!s.current&&e.hideOffsetDates||(u.value=s.value)},be=s=>{if(e.autoRange||e.weekPicker){if(u.value){if(e.hideOffsetDates&&!s.current)return!1;const _=ot(u.value,+e.autoRange),C=Yt(new Date(u.value),+e.weekStart);return e.weekPicker?ie(C[1],new Date(s.value)):ie(_,new Date(s.value))}return!1}return!1},dt=s=>{if(e.autoRange||e.weekPicker){if(u.value){const _=ot(u.value,+e.autoRange);if(e.hideOffsetDates&&!s.current)return!1;const C=Yt(new Date(u.value),+e.weekStart);return e.weekPicker?xe(s.value,C[0])&&ge(s.value,C[1]):xe(s.value,u.value)&&ge(s.value,_)}return!1}return!1},ct=s=>{if(e.autoRange||e.weekPicker){if(u.value){if(e.hideOffsetDates&&!s.current)return!1;const _=Yt(new Date(u.value),+e.weekStart);return e.weekPicker?ie(_[0],s.value):ie(u.value,s.value)}return!1}return!1},Te=s=>{for(let _=s-1;_>=0;_--){const C=Nt(Ue(new Date,{month:T.value(_+1),year:D.value(_+1)}),1);Y(_,pe(C),fe(C))}for(let _=s+1;_<=e.multiCalendars-1;_++){const C=Le(Ue(new Date,{month:T.value(_-1),year:D.value(_-1)}),1);Y(_,pe(C),fe(C))}},Be=s=>it(new Date,T.value(s),D.value(s)),Je=(s,_,C=!0)=>{if(C?U(s,_):S(s,_),e.multiCalendars&&!e.multiCalendarsSolo&&Te(s),e.monthPicker)if(e.range){if(C){let z=o.value?o.value.slice():[];z.length===2&&(z=[]),z.length?ge(Be(s),z[0])?z.unshift(Be(s)):z.push(Be(s)):z=[Be(s)],o.value=z}}else o.value=Be(s);t(),a("updateMonthYear",{instance:s,value:_,isMonth:C}),bt(e.multiCalendarsSolo?s:void 0)},_e=s=>ke(s,c.value,f.value,A()),Ge=s=>{Mt(s)&&Mt(o.value)&&Ie(c.value)&&Ie(f.value)?(s[0]&&o.value[0]&&(o.value[0]=ke(s[0],c.value[0],f.value[0],A())),s[1]&&o.value[1]&&(o.value[1]=ke(s[1],c.value[1],f.value[1],A(!1)))):e.multiDates&&Array.isArray(o.value)?o.value[o.value.length-1]=_e(s):!e.range&&!Rt(s)&&(o.value=_e(s)),a("timeUpdate")},ht=(s,_=!0,C=!1)=>{const z=_?s:c.value,Pe=!_&&!C?s:f.value,et=C?s:w.value;if(e.range&&Rt(o.value)&&Ie(z)&&Ie(Pe)&&Ie(et)){const Fe=Ee=>ke(o.value[Ee],z[Ee],Pe[Ee],et[Ee]),tt=Ee=>ya(o.value[Ee],0);if(ie(o.value[0],o.value[1])&&(rn(Fe(0),tt(1))||on(Fe(1),tt(0))))return}if(c.value=z,f.value=Pe,w.value=et,o.value)if(e.multiDates){const Fe=ae();Fe&&Ge(Fe)}else Ge(o.value);else e.timePicker&&Ge(e.range?[new Date,new Date]:new Date);t()},yt=()=>{u.value=null},v=s=>Ha(o.value,e.range)&&o.value[0]&&u.value?s?xe(u.value,o.value[0]):ge(u.value,o.value[0]):!0,ye=(s,_=!0)=>(e.range||e.weekPicker)&&Rt(o.value)?e.hideOffsetDates&&!s.current?!1:ie(new Date(s.value),o.value[_?0:1]):e.range?ie(new Date(s.value),o.value&&Array.isArray(o.value)?_?o.value[0]||null:o.value[1]:null)&&(_?!ge(u.value||null,Array.isArray(o.value)?o.value[0]:null):!0)||ie(s.value,Array.isArray(o.value)?o.value[0]:null)&&v(_):!1,ve=(s,_)=>Array.isArray(e.internalModelValue)&&e.internalModelValue.length||e.weekPicker?!1:!s&&!p(_)&&!(!_.current&&e.hideOffsetDates)&&(e.range?!ye(_)&&!ye(_,!1):!0),wt=(s,_,C)=>Array.isArray(e.internalModelValue)&&e.internalModelValue[0]&&e.internalModelValue.length===1?s?!1:C?xe(e.internalModelValue[0],_.value):ge(e.internalModelValue[0],_.value):!1,Ze=(s=!1)=>{e.autoApply&&e.monthPicker&&a("autoApply",s)},$t=(s,_)=>{const C=Ue(new Date,{month:T.value(_),year:D.value(_)}),z=s<0?Le(C,1):Nt(C,1);Y(_,pe(z),fe(z)),e.multiCalendars&&!e.multiCalendarsSolo&&Te(_)},jt=(s,_)=>{e.monthChangeOnScroll&&($t(e.monthChangeOnScroll!=="inverse"?-s.deltaY:s.deltaY,_),bt())},gt=(s,_,C=!1)=>{e.monthChangeOnArrows&&e.vertical===C&&It(s,_)},It=(s,_)=>{$t(s==="right"?-1:1,_),bt()},Jt=s=>e.markers.find(_=>ie(Ne(new Date(s.value)),Ne(new Date(_.date)))),Zt=()=>{e.range?Ha(o.value,e.range)&&(o.value&&o.value[0]?o.value=ge(new Date,o.value[0])?[new Date,o.value[0]]:[o.value[0],new Date]:o.value=[new Date]):a("update:internalModelValue",new Date),e.autoApply&&a("selectDate")},ea=s=>{s.length&&s.length<=2&&e.range&&(o.value=s.map(_=>new Date(_)),e.autoApply&&a("selectDate"))},bt=s=>{s||s===0?n.value[s].triggerTransition(T.value(s),D.value(s)):n.value.forEach((_,C)=>_.triggerTransition(T.value(C),D.value(C)))};return{today:l,hours:c,minutes:f,seconds:w,month:T,year:D,monthYearSelect:Ze,isDisabled:i,updateTime:ht,setHoverDate:de,getWeekNum:oe,selectDate:Z,rangeActive:b,isActiveDate:p,updateMonthYear:Je,isHoverRangeEnd:be,isAutoRangeInBetween:dt,isAutoRangeStart:ct,clearHoverDate:yt,rangeActiveStartEnd:ye,handleScroll:jt,getMarker:Jt,handleArrow:gt,handleSwipe:It,selectCurrentDate:Zt,isHoverDate:ve,isHoverDateStartEnd:wt,presetDateRange:ea}},Mi=["id","aria-label","onKeydown"],Si={key:0,class:"dp__preset_ranges"},Oi=["onClick"],Pi={key:1,class:"dp__now_wrap"},Ni=Ve({props:Oe(K(K(K({},Dn),ba),ga),{internalModelValue:{type:[Date,Array],default:null},multiCalendars:{type:Number,default:0},openOnTop:{type:Boolean,default:!1}}),emits:["update:internalModelValue","closePicker","selectDate","dpOpen","autoApply","timeUpdate","flow-step","updateMonthYear"],setup(e,{emit:a}){const t=e,n=Qt(),r=L(null),l=qa({timePicker:!t.enableTimePicker,monthYearInput:!1,calendar:!1}),u=L([]),m=L([]),c=L(null),f=L(null),w=L(0),T=L(!1),D=L(0),Y=De(Kt),U=De(je);st(()=>{var h;T.value=!0,(h=t.presetRanges)!=null&&h.length||gt();const q=Se(f);if(q&&!t.textInput&&!t.inline&&q.focus({preventScroll:!0}),q){const H=X=>{X.stopImmediatePropagation(),X.stopPropagation()};q.addEventListener("pointerdown",H),q.addEventListener("mousedown",H)}document.addEventListener("resize",gt)}),La(()=>{document.removeEventListener("resize",gt)});const S=()=>{var h;((h=t.flow)==null?void 0:h.length)&&D.value!==-1&&(D.value+=1,a("flow-step",D.value),Da())},A=()=>{D.value=-1},{updateTime:E,updateMonthYear:o,today:i,month:p,year:b,hours:W,minutes:P,seconds:G,isDisabled:ae,isActiveDate:M,selectDate:re,getWeekNum:J,setHoverDate:g,isHoverRangeEnd:O,isAutoRangeInBetween:V,isAutoRangeStart:Z,rangeActive:oe,clearHoverDate:de,rangeActiveStartEnd:be,monthYearSelect:dt,handleScroll:ct,handleArrow:Te,handleSwipe:Be,getMarker:Je,selectCurrentDate:_e,isHoverDateStartEnd:Ge,isHoverDate:ht,presetDateRange:yt}=Ci(t,a,S,m),v=rt(n,"calendar"),ye=rt(n,"action"),ve=rt(n,"timePicker"),wt=rt(n,"monthYear"),Ze=N(()=>t.openOnTop?"dp__arrow_bottom":"dp__arrow_top"),$t=N(()=>hl(t.yearRange)),jt=N(()=>yl(t.locale,t.monthNameFormat)),gt=()=>{const h=Se(r);h&&(w.value=h.getBoundingClientRect().width)},It=N(()=>h=>pl(p.value(h),b.value(h),+t.weekStart,t.hideOffsetDates)),Jt=N(()=>t.multiCalendars>0&&t.range?[...Array(t.multiCalendars).keys()]:[0]),Zt=N(()=>h=>h===1),ea=N(()=>t.monthPicker||t.timePicker),bt=N(()=>({dp__flex_display:t.multiCalendars>0})),s=N(()=>({dp__instance_calendar:t.multiCalendars>0})),_=N(()=>({dp__menu_disabled:t.disabled,dp__menu_readonly:t.readonly})),C=N(()=>h=>et(It,h)),z=N(()=>({locale:t.locale,weekNumName:t.weekNumName,weekStart:t.weekStart,weekNumbers:t.weekNumbers,customProps:t.customProps,calendarClassName:t.calendarClassName,specificMode:ea.value,getWeekNum:J,multiCalendars:t.multiCalendars,modeHeight:t.modeHeight,internalModelValue:t.internalModelValue,noSwipe:t.noSwipe,vertical:t.vertical})),Pe=N(()=>({dp__menu:!0,dp__menu_index:!t.inline,dp__relative:t.inline,[t.menuClassName]:!!t.menuClassName})),et=(h,q)=>h.value(q).map(H=>Oe(K({},H),{days:H.days.map(X=>{const Q=ae(X.value),_t=ht(Q,X);return X.marker=Je(X),X.classData={dp__cell_offset:!X.current,dp__pointer:!Q&&!(!X.current&&t.hideOffsetDates),dp__active_date:t.range?!1:M(X),dp__date_hover:_t,dp__date_hover_start:Ge(_t,X,!0),dp__date_hover_end:Ge(_t,X,!1),dp__range_between:(t.range||t.weekPicker)&&(t.multiCalendars>0?X.current:!0)&&!Q&&!(!X.current&&t.hideOffsetDates)&&!M(X)?oe(X):!1,dp__today:!t.noToday&&ie(X.value,i.value)&&X.current,dp__cell_disabled:Q,dp__cell_auto_range:V(X),dp__cell_auto_range_start:Z(X),dp__cell_auto_range_end:O(X),dp__range_start:t.multiCalendars>0?X.current&&be(X):be(X),dp__range_end:t.multiCalendars>0?X.current&&be(X,!1):be(X,!1),[t.calendarCellClassName]:!!t.calendarCellClassName},X})})),Fe=h=>{h.stopPropagation(),h.preventDefault(),h.stopImmediatePropagation()},tt=()=>{t.escClose&&a("closePicker")},Ee=h=>{h.stopImmediatePropagation(),h.preventDefault(),t.spaceConfirm&&a("selectDate")},$e=h=>{var q;(q=t.flow)!=null&&q.length&&(l[h]=!0,Object.keys(l).filter(H=>!l[H]).length||Da())},Da=()=>{t.flow[D.value]==="month"&&u.value[0]&&u.value[0].toggleMonthPicker(!0),t.flow[D.value]==="year"&&u.value&&u.value[0].toggleYearPicker(!0),t.flow[D.value]==="calendar"&&c.value&&c.value.toggleTimePicker(!1,!0),t.flow[D.value]==="time"&&c.value&&c.value.toggleTimePicker(!0,!0);const h=t.flow[D.value];(h==="hours"||h==="minutes"||h==="seconds")&&c.value&&c.value.toggleTimePicker(!0,!0,h)};return(h,q)=>(y(),te(vt,{appear:"",name:d(Y).menuAppear,mode:"out-in",css:!!d(Y)},{default:j(()=>[B("div",{id:h.uid?`dp-menu-${h.uid}`:void 0,tabindex:"0",ref_key:"dpMenuRef",ref:f,role:"dialog","aria-label":d(U).menu,class:me(d(Pe)),onMouseleave:q[11]||(q[11]=(...H)=>d(de)&&d(de)(...H)),onClick:Fe,onKeydown:[le(tt,["esc"]),le(Ee,["space"]),q[12]||(q[12]=le(H=>d(Te)("left",0),["left"])),q[13]||(q[13]=le(H=>d(Te)("left",0,!0),["up"])),q[14]||(q[14]=le(H=>d(Te)("right",0,!0),["down"])),q[15]||(q[15]=le(H=>d(Te)("right",0),["right"]))]},[(h.disabled||h.readonly)&&h.inline?(y(),x("div",{key:0,class:me(d(_))},null,2)):k("",!0),h.inline?k("",!0):(y(),x("div",{key:1,class:me(d(Ze))},null,2)),B("div",{class:me(h.presetRanges.length?"dp__menu_content_wrapper":null)},[h.presetRanges.length?(y(),x("div",Si,[(y(!0),x(ne,null,he(h.presetRanges,(H,X)=>(y(),x("div",{key:X,class:"dp__preset_range",onClick:Q=>d(yt)(H.range)},we(H.label),9,Oi))),128))])):k("",!0),B("div",{class:"dp__instance_calendar",ref_key:"calendarWrapperRef",ref:r,role:"document"},[B("div",{class:me(d(bt))},[(y(!0),x(ne,null,he(d(Jt),(H,X)=>(y(),x("div",{key:H,class:me(d(s))},[!h.disableMonthYearSelect&&!h.timePicker?(y(),te(Vt(h.monthYearComponent?h.monthYearComponent:xi),Ce({key:0,ref_for:!0,ref:Q=>{Q&&(u.value[X]=Q)}},{months:d(jt),years:d($t),filters:h.filters,monthPicker:h.monthPicker,month:d(p)(H),year:d(b)(H),customProps:h.customProps,multiCalendars:e.multiCalendars,multiCalendarsSolo:h.multiCalendarsSolo,instance:H,minDate:h.minDate,maxDate:h.maxDate,preventMinMaxNavigation:h.preventMinMaxNavigation,internalModelValue:e.internalModelValue,range:h.range,reverseYears:h.reverseYears,vertical:h.vertical},{onMount:q[0]||(q[0]=Q=>$e("monthYearInput")),onResetFlow:A,"onUpdate:month":Q=>d(o)(H,Q,!0),"onUpdate:year":Q=>d(o)(H,Q,!1),onMonthYearSelect:d(dt)}),Me({_:2},[he(d(wt),(Q,_t)=>({name:Q,fn:j(ta=>[R(h.$slots,Q,Xe(nt(ta)))])}))]),1040,["onUpdate:month","onUpdate:year","onMonthYearSelect"])):k("",!0),ze(Wl,Ce({ref_for:!0,ref:Q=>{Q&&(m.value[X]=Q)}},d(z),{"flow-step":D.value,"onUpdate:flow-step":q[1]||(q[1]=Q=>D.value=Q),instance:H,"mapped-dates":d(C)(H),month:d(p)(H),year:d(b)(H),onSelectDate:Q=>d(re)(Q,!d(Zt)(H)),onSetHoverDate:q[2]||(q[2]=Q=>d(g)(Q)),onHandleScroll:Q=>d(ct)(Q,H),onHandleSwipe:Q=>d(Be)(Q,H),onMount:q[3]||(q[3]=Q=>$e("calendar")),onResetFlow:A}),Me({_:2},[he(d(v),(Q,_t)=>({name:Q,fn:j(ta=>[R(h.$slots,Q,Xe(nt(K({},ta))))])}))]),1040,["flow-step","instance","mapped-dates","month","year","onSelectDate","onHandleScroll","onHandleSwipe"])],2))),128))],2),B("div",null,[h.enableTimePicker&&!h.monthPicker&&!h.weekPicker?(y(),te(Vt(h.timePickerComponent?h.timePickerComponent:hi),Ce({key:0,ref_key:"timePickerRef",ref:c},{is24:h.is24,hoursIncrement:h.hoursIncrement,minutesIncrement:h.minutesIncrement,hoursGridIncrement:h.hoursGridIncrement,secondsIncrement:h.secondsIncrement,minutesGridIncrement:h.minutesGridIncrement,secondsGridIncrement:h.secondsGridIncrement,noHoursOverlay:h.noHoursOverlay,noMinutesOverlay:h.noMinutesOverlay,noSecondsOverlay:h.noSecondsOverlay,range:h.range,filters:h.filters,timePicker:h.timePicker,hours:d(W),minutes:d(P),seconds:d(G),customProps:h.customProps,enableSeconds:h.enableSeconds,fixedStart:h.fixedStart,fixedEnd:h.fixedEnd},{onMount:q[4]||(q[4]=H=>$e("timePicker")),"onUpdate:hours":q[5]||(q[5]=H=>d(E)(H)),"onUpdate:minutes":q[6]||(q[6]=H=>d(E)(H,!1)),"onUpdate:seconds":q[7]||(q[7]=H=>d(E)(H,!1,!0)),onResetFlow:A}),Me({_:2},[he(d(ve),(H,X)=>({name:H,fn:j(Q=>[R(h.$slots,H,Xe(nt(Q)))])}))]),1040)):k("",!0)])],512),h.showNowButton?(y(),x("div",Pi,[h.$slots["now-button"]?R(h.$slots,"now-button",{key:0,selectCurrentDate:d(_e)}):k("",!0),h.$slots["now-button"]?k("",!0):(y(),x("button",{key:1,type:"button",role:"button",class:"dp__now_button",onClick:q[8]||(q[8]=(...H)=>d(_e)&&d(_e)(...H))},we(h.nowButtonLabel),1))])):k("",!0)],2),!h.autoApply||h.keepActionRow?(y(),te(Vt(h.actionRowComponent?h.actionRowComponent:zl),Ce({key:2},{calendarWidth:w.value,selectText:h.selectText,cancelText:h.cancelText,internalModelValue:e.internalModelValue,range:h.range,previewFormat:h.previewFormat,inline:h.inline,monthPicker:h.monthPicker,timePicker:h.timePicker,customProps:h.customProps,multiCalendars:e.multiCalendars,menuMount:T.value,maxTime:h.maxTime,minTime:h.minTime,enableTimePicker:h.enableTimePicker,minDate:h.minDate,maxDate:h.maxDate,multiDates:h.multiDates},{onClosePicker:q[9]||(q[9]=H=>h.$emit("closePicker")),onSelectDate:q[10]||(q[10]=H=>h.$emit("selectDate"))}),Me({_:2},[he(d(ye),(H,X)=>({name:H,fn:j(Q=>[R(h.$slots,H,Xe(nt(K({},Q))))])}))]),1040)):k("",!0)],42,Mi)]),_:3},8,["name","css"]))}});var Ht=(e=>(e.center="center",e.left="left",e.right="right",e))(Ht||{});const $i=(e,a,t,n,r,l,u)=>{const m=L({top:"0",left:"0",transform:"none"}),c=L(!1),f=10,w=o=>{const i=o.getBoundingClientRect();return{left:i.left+window.scrollX,top:i.top+window.scrollY}},T=o=>{let i=0,p=0;for(;o&&!isNaN(o.offsetLeft)&&!isNaN(o.offsetTop);)i+=o.offsetLeft-o.scrollLeft,p+=o.offsetTop-o.scrollTop,o=o.offsetParent;return{top:p,left:i}},D=(o,i)=>{m.value.left=`${o+i}px`,m.value.transform="translateX(-100%)"},Y=o=>{m.value.left=`${o}px`,m.value.transform="translateX(0)"},U=(o,i)=>{e===Ht.left&&Y(o),e===Ht.right&&D(o,i),e===Ht.center&&(m.value.left=`${o+i/2}px`,m.value.transform="translateX(-50%)")},S=()=>{const o=Se(r);if(o){const{top:i}=a?T(o):w(o),{left:p,width:b}=o.getBoundingClientRect();m.value.top=`${i}px`,U(p,b)}},A=(o=!0)=>{if(!l){const i=Se(r);if(a&&typeof a!="boolean")m.value=a(i);else if(i){const{left:p,width:b,height:W}=i.getBoundingClientRect(),{top:P}=a?T(i):w(i);m.value.top=`${W+P+f}px`,U(p,b),o&&t&&E()}}},E=()=>{const o=Se(r);if(o&&t&&!l){const{height:i,top:p,left:b,width:W}=o.getBoundingClientRect(),{top:P}=a?T(o):w(o),G=window.innerHeight-p-i,ae=Se(n);if(ae){const{height:M,left:re,right:J}=ae.getBoundingClientRect(),g=M+i;g>p&&g>G?p<G&&(A(!1),c.value=!1):g>G?(m.value.top=`${P-M-f}px`,c.value=!0):(A(!1),c.value=!1),re<0?Y(b):J>document.documentElement.clientWidth&&D(b,W)}}u("recalculatePosition")};return{openOnTop:c,menuPosition:m,setMenuPosition:A,setInitialPosition:S,recalculatePosition:E}},Ii=(e,a,t,n,r,l,u,m,c,f,w,T,D,Y)=>{const U=L(""),S=L();Pt(S,()=>{Y("internalModelChange",S.value)});const A=o=>{let i=null;o?a?Hl(o)&&"hours"in o[0]&&"minutes"in o[0]?i=[ke(null,+o[0].hours,+o[0].minutes,+o[0].seconds),ke(null,+o[1].hours,+o[1].minutes,+o[1].seconds)]:Rl(o)&&(i=ke(null,+o.hours,+o.minutes,+o.seconds)):t?Bl(o)&&"month"in o[0]&&"year"in o[0]?i=[it(null,+o[0].month,+o[0].year),o[1]?it(null,+o[1].month,+o[1].year):null]:Fl(o)&&"month"in o&&"year"in o&&(i=it(null,+o.month,+o.year)):f&&Array.isArray(o)?i=o.map(p=>new Date(p)):T&&Array.isArray(o)?i=[new Date(o[0]),new Date(o[1])]:n?ql(o,r)&&(i=[new Date(o[0]),o[1]?new Date(o[1]):null]):Gl(o)&&(i=new Date(o)):i=null,ca(i)?(S.value=i,E()):(S.value=null,U.value="")},E=()=>{if(!S.value)U.value="";else if(!e||typeof e=="string"){const o=pn(e,l,m,t,a,T,u);Array.isArray(S.value)&&f?U.value=S.value.map(i=>Lt(i,o,c==null?void 0:c.value)).join("; "):U.value=Lt(S.value,o,c==null?void 0:c.value,D==null?void 0:D.rangeSeparator)}else a?U.value=e(ma(S.value)):t?U.value=e(Ea(S.value)):U.value=e(S.value)};return{parseExternalModelValue:A,formatInputValue:E,internalModelValue:S,inputValue:U,emitModelValue:()=>{if(t)Y("update:modelValue",Ea(S.value));else if(a)Y("update:modelValue",ma(S.value));else if(T)Y("update:modelValue",S.value);else{S.value&&n&&r&&S.value.length===1&&S.value.push(null);const o=w?Array.isArray(S.value)?S.value.map(i=>i&&Ne(i)):Ne(S.value):S.value;Y("update:modelValue",o)}E()},checkBeforeEmit:()=>S.value?n?r?S.value.length>=1:S.value.length===2:!!S.value:!1}},Ai=typeof window<"u"?window:void 0,da=()=>{},Yi=e=>On()?(Pn(e),!0):!1,Ui=(e,a,t,n)=>{if(!e)return da;let r=da;const l=Pt(()=>d(e),m=>{r(),m&&(m.addEventListener(a,t,n),r=()=>{m.removeEventListener(a,t,n),r=da})},{immediate:!0,flush:"post"}),u=()=>{l(),r()};return Yi(u),u},Vi=(e,a,t,n={})=>{const{window:r=Ai,event:l="pointerdown"}=n;return r?Ui(r,l,u=>{const m=Se(e),c=Se(a);!m||!c||m===u.target||u.composedPath().includes(m)||u.composedPath().includes(c)||t(u)},{passive:!0}):void 0},Ei=Ve({props:K({},Tl),emits:["update:modelValue","textSubmit","closed","cleared","open","focus","blur","internalModelChange","recalculatePosition","flow-step","updateMonthYear"],setup(e,{expose:a,emit:t}){const n=e,r=Qt(),l=L(!1),u=Ta(n,"modelValue"),m=L(null),c=L(null),f=L(null);kt(wa,n.autoApply);const w=N(()=>n.formatLocale);kt(hn,w),kt(vn,Ta(n,"textInput")),st(()=>{p(n.modelValue),n.inline||(window.addEventListener("scroll",de),window.addEventListener("resize",be)),n.inline&&(l.value=!0)}),La(()=>{n.inline||(window.removeEventListener("scroll",de),window.removeEventListener("resize",be))});const T=rt(r,"all"),D=rt(r,"input");Pt(u,()=>{p(u.value)},{deep:!0});const{openOnTop:Y,menuPosition:U,setMenuPosition:S,recalculatePosition:A,setInitialPosition:E}=$i(n.position,n.altPosition,n.autoPosition,m,c,n.inline,t),{internalModelValue:o,inputValue:i,parseExternalModelValue:p,emitModelValue:b,checkBeforeEmit:W,formatInputValue:P}=Ii(n.format,n.timePicker,n.monthPicker,n.range,n.partialRange,n.is24,n.enableTimePicker,n.enableSeconds,w,n.multiDates,n.utc,n.weekPicker,n.textInputOptions,t),G=N(()=>({dp__main:!0,dp__theme_dark:n.dark,dp__theme_light:!n.dark,dp__flex_display:n.inline,dp__flex_display_with_input:n.inlineWithInput})),ae=N(()=>Ba(n.format)?n.format:pn(null,n.is24,n.enableSeconds,n.monthPicker,n.timePicker,n.weekPicker,n.enableTimePicker)),M=N(()=>n.previewFormat?n.previewFormat:Ba(ae.value)?ae.value:n.format),re=N(()=>typeof n.transitions=="boolean"?n.transitions?Ra({}):!1:Ra(n.transitions));kt(Kt,re);const J=N(()=>n.dark?"dp__theme_dark":"dp__theme_light"),g=N(()=>Object.assign(gl(),n.textInputOptions)),O=N(()=>Dl(n.ariaLabels));kt(je,O);const V=N(()=>bl(n.filters)),Z=N(()=>{const v=ye=>{const ve={hours:Ae(new Date),minutes:Ye(new Date),seconds:Ke(new Date)};return Object.assign(ve,ye)};return n.range?n.startTime&&Array.isArray(n.startTime)?[v(n.startTime[0]),v(n.startTime[1])]:null:n.startTime&&!Array.isArray(n.startTime)?v(n.startTime):null}),oe=N(()=>n.multiCalendars===null?0:typeof n.multiCalendars=="boolean"?n.multiCalendars?2:0:+n.multiCalendars>=2?+n.multiCalendars:2),de=()=>{l.value&&(n.closeOnScroll?_e():n.autoPosition?S():window.removeEventListener("scroll",de))},be=()=>{l.value&&S()},dt=()=>{!n.disabled&&!n.readonly&&(E(),l.value=!0,fa().then(()=>S()),l.value||Je(),l.value&&(t("open"),t("focus")),p(n.modelValue))},ct=()=>{i.value="",Je(),t("update:modelValue",null),t("cleared"),_e()},Te=()=>{W()&&(b(),_e())},Be=(v=!1)=>{n.autoApply&&(n.enableTimePicker?pa(o.value,n.maxTime,n.minTime):!0)&&(b(),n.closeOnAutoApply&&!v&&_e())},Je=()=>{o.value=null},_e=()=>{n.inline||(l.value&&(l.value=!1,t("closed"),t("blur"),E(),i.value&&p(u.value)),Je(),c.value&&c.value.unFocus(),yt())},Ge=(v,ye)=>{if(!v){o.value=null;return}o.value=v,ye&&(Te(),t("textSubmit"))},ht=()=>{n.autoApply&&pa(o.value,n.maxTime,n.minTime)&&b()},yt=()=>{f.value&&f.value.focus({preventScroll:!0})};return Vi(m,c,_e),a({closeMenu:_e,selectDate:Te,clearValue:ct,openMenu:dt,onScroll:de,formatInputValue:P}),(v,ye)=>(y(),x("div",{class:me(d(G))},[ze(Ol,Ce({ref_key:"inputRef",ref:c},{placeholder:v.placeholder,hideInputIcon:v.hideInputIcon,readonly:v.readonly,disabled:v.disabled,inputClassName:v.inputClassName,clearable:v.clearable,state:v.state,inline:v.inline,inlineWithInput:v.inlineWithInput,textInput:v.textInput,textInputOptions:d(g),range:v.range,isMenuOpen:l.value,pattern:d(ae),autoApply:v.autoApply,uid:v.uid,openMenuOnFocus:v.openMenuOnFocus,required:v.required,name:v.name,autocomplete:v.autocomplete},{"input-value":d(i),"onUpdate:input-value":ye[0]||(ye[0]=ve=>pt(i)?i.value=ve:null),onClear:ct,onOpen:dt,onSetInputDate:Ge,onSetEmptyDate:d(b),onSelectDate:Te,onClose:_e}),Me({_:2},[he(d(D),(ve,wt)=>({name:ve,fn:j(Ze=>[R(v.$slots,ve,Xe(nt(Ze)))])}))]),1040,["input-value","onSetEmptyDate"]),B("span",{tabindex:"-1",ref_key:"focusRef",ref:f},null,512),l.value?(y(),te(Sn,{key:0,to:v.teleport,disabled:v.inline},[l.value?(y(),te(Ni,Ce({key:0,ref_key:"dpMenuRef",ref:m,class:d(J),style:d(U)},{weekNumbers:v.weekNumbers,weekStart:v.weekStart,disableMonthYearSelect:v.disableMonthYearSelect,menuClassName:v.menuClassName,calendarClassName:v.calendarClassName,yearRange:v.yearRange,range:v.range,multiCalendars:d(oe),multiCalendarsSolo:v.multiCalendarsSolo,calendarCellClassName:v.calendarCellClassName,enableTimePicker:v.enableTimePicker,is24:v.is24,hoursIncrement:v.hoursIncrement,minutesIncrement:v.minutesIncrement,hoursGridIncrement:v.hoursGridIncrement,minutesGridIncrement:v.minutesGridIncrement,minDate:v.minDate,maxDate:v.maxDate,autoApply:v.autoApply,selectText:v.selectText,cancelText:v.cancelText,previewFormat:d(M),locale:v.locale,weekNumName:v.weekNumName,disabledDates:v.disabledDates,filters:d(V),minTime:v.minTime,maxTime:v.maxTime,inline:v.inline,openOnTop:d(Y),monthPicker:v.monthPicker,timePicker:v.timePicker,monthNameFormat:v.monthNameFormat,startDate:v.startDate,startTime:d(Z),monthYearComponent:v.monthYearComponent,timePickerComponent:v.timePickerComponent,actionRowComponent:v.actionRowComponent,customProps:v.customProps,hideOffsetDates:v.hideOffsetDates,autoRange:v.autoRange,noToday:v.noToday,noHoursOverlay:v.noHoursOverlay,noMinutesOverlay:v.noMinutesOverlay,disabledWeekDays:v.disabledWeekDays,allowedDates:v.allowedDates,showNowButton:v.showNowButton,nowButtonLabel:v.nowButtonLabel,monthChangeOnScroll:v.monthChangeOnScroll,markers:v.markers,uid:v.uid,modeHeight:v.modeHeight,enableSeconds:v.enableSeconds,secondsIncrement:v.secondsIncrement,secondsGridIncrement:v.secondsGridIncrement,noSecondsOverlay:v.noSecondsOverlay,escClose:v.escClose,spaceConfirm:v.spaceConfirm,monthChangeOnArrows:v.monthChangeOnArrows,textInput:v.textInput,disabled:v.disabled,readonly:v.readonly,multiDates:v.multiDates,presetRanges:v.presetRanges,flow:v.flow,preventMinMaxNavigation:v.preventMinMaxNavigation,minRange:v.minRange,maxRange:v.maxRange,fixedStart:v.fixedStart,fixedEnd:v.fixedEnd,multiDatesLimit:v.multiDatesLimit,reverseYears:v.reverseYears,keepActionRow:v.keepActionRow,weekPicker:v.weekPicker,noSwipe:v.noSwipe,vertical:v.vertical},{internalModelValue:d(o),"onUpdate:internalModelValue":ye[1]||(ye[1]=ve=>pt(o)?o.value=ve:null),onClosePicker:_e,onSelectDate:Te,onDpOpen:d(A),onAutoApply:Be,onTimeUpdate:ht,onFlowStep:ye[2]||(ye[2]=ve=>v.$emit("flow-step",ve)),onUpdateMonthYear:ye[3]||(ye[3]=ve=>v.$emit("updateMonthYear",ve))}),Me({_:2},[he(d(T),(ve,wt)=>({name:ve,fn:j(Ze=>[R(v.$slots,ve,Xe(nt(K({},Ze))))])}))]),1040,["class","style","internalModelValue","onDpOpen"])):k("",!0)],8,["to","disabled"])):k("",!0)],2))}});var Cn=(()=>{const e=Ei;return e.install=a=>{a.component("Vue3DatePicker",e)},e})(),Wi=Object.freeze(Object.defineProperty({__proto__:null,default:Cn},Symbol.toStringTag,{value:"Module"}));Object.entries(Wi).forEach(([e,a])=>{e!=="default"&&(Cn[e]=a)});export{Cn as Q,ot as a,Le as b,aa as c,Dt as d,or as e,Tt as f,pe as g,fe as h,I as r,Nt as s,F as t};
diff --git a/docs/assets/vue-datepicker.es.e0a9f9bf.js b/docs/assets/vue-datepicker.es.e0a9f9bf.js
deleted file mode 100644
index 765085c8f..000000000
--- a/docs/assets/vue-datepicker.es.e0a9f9bf.js
+++ /dev/null
@@ -1 +0,0 @@
-import{b as Y,e as Le,f as R,g as Ht,h as A,o as y,c as C,i as B,j as p,n as Z,k as u,w as z,l as Q,m as na,p as ft,t as Yt,q as st,s as vt,v as ia,x as ce,F as te,y as ve,a as Ee,z as J,T as je,A as kt,B as We,C as on,D as ge,E as $e,G as ln,H as $a,I as Lt,J as St,K as fa,L as sn,M as tt,N as at,O as un,P as dn}from"./app.519dac2e.js";function U(e){if(e===null||e===!0||e===!1)return NaN;var a=Number(e);return isNaN(a)?a:a<0?Math.ceil(a):Math.floor(a)}function E(e,a){if(a.length<e)throw new TypeError(e+" argument"+(e>1?"s":"")+" required, but only "+a.length+" present")}function F(e){E(1,arguments);var a=Object.prototype.toString.call(e);return e instanceof Date||typeof e=="object"&&a==="[object Date]"?new Date(e.getTime()):typeof e=="number"||a==="[object Number]"?new Date(e):((typeof e=="string"||a==="[object String]")&&typeof console!="undefined"&&(console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://git.io/fjule"),console.warn(new Error().stack)),new Date(NaN))}function ot(e,a){E(2,arguments);var t=F(e),n=U(a);return isNaN(n)?new Date(NaN):(n&&t.setDate(t.getDate()+n),t)}function Fe(e,a){E(2,arguments);var t=F(e),n=U(a);if(isNaN(n))return new Date(NaN);if(!n)return t;var r=t.getDate(),o=new Date(t.getTime());o.setMonth(t.getMonth()+n+1,0);var l=o.getDate();return r>=l?o:(t.setFullYear(o.getFullYear(),o.getMonth(),r),t)}function Ia(e,a){if(E(2,arguments),!a||typeof a!="object")return new Date(NaN);var t=a.years?U(a.years):0,n=a.months?U(a.months):0,r=a.weeks?U(a.weeks):0,o=a.days?U(a.days):0,l=a.hours?U(a.hours):0,c=a.minutes?U(a.minutes):0,m=a.seconds?U(a.seconds):0,g=F(e),b=n||t?Fe(g,n+t*12):g,D=o||r?ot(b,o+r*7):b,$=c+l*60,P=m+$*60,N=P*1e3,M=new Date(D.getTime()+N);return M}function cn(e,a){E(2,arguments);var t=F(e).getTime(),n=U(a);return new Date(t+n)}function sa(e,a){E(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,o=r==null?0:U(r),l=t.weekStartsOn==null?o:U(t.weekStartsOn);if(!(l>=0&&l<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var c=F(e),m=c.getDay(),g=(m<l?7:0)+m-l;return c.setDate(c.getDate()-g),c.setHours(0,0,0,0),c}function Bt(e){return E(1,arguments),sa(e,{weekStartsOn:1})}function mn(e){E(1,arguments);var a=F(e),t=a.getFullYear(),n=new Date(0);n.setFullYear(t+1,0,4),n.setHours(0,0,0,0);var r=Bt(n),o=new Date(0);o.setFullYear(t,0,4),o.setHours(0,0,0,0);var l=Bt(o);return a.getTime()>=r.getTime()?t+1:a.getTime()>=l.getTime()?t:t-1}function fn(e){E(1,arguments);var a=mn(e),t=new Date(0);t.setFullYear(a,0,4),t.setHours(0,0,0,0);var n=Bt(t);return n}function Et(e){var a=new Date(Date.UTC(e.getFullYear(),e.getMonth(),e.getDate(),e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds()));return a.setUTCFullYear(e.getFullYear()),e.getTime()-a.getTime()}function va(e){E(1,arguments);var a=F(e);return a.setHours(0,0,0,0),a}var vn=864e5;function pn(e,a){E(2,arguments);var t=va(e),n=va(a),r=t.getTime()-Et(t),o=n.getTime()-Et(n);return Math.round((r-o)/vn)}function Aa(e,a){E(2,arguments);var t=U(a);return Fe(e,t*12)}function Ua(e){return E(1,arguments),e instanceof Date||typeof e=="object"&&Object.prototype.toString.call(e)==="[object Date]"}function Tt(e){if(E(1,arguments),!Ua(e)&&typeof e!="number")return!1;var a=F(e);return!isNaN(Number(a))}function yn(e,a){E(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,o=r==null?0:U(r),l=t.weekStartsOn==null?o:U(t.weekStartsOn);if(!(l>=0&&l<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var c=F(e),m=c.getDay(),g=(m<l?-7:0)+6-(m-l);return c.setDate(c.getDate()+g),c.setHours(23,59,59,999),c}var hn={lessThanXSeconds:{one:"less than a second",other:"less than {{count}} seconds"},xSeconds:{one:"1 second",other:"{{count}} seconds"},halfAMinute:"half a minute",lessThanXMinutes:{one:"less than a minute",other:"less than {{count}} minutes"},xMinutes:{one:"1 minute",other:"{{count}} minutes"},aboutXHours:{one:"about 1 hour",other:"about {{count}} hours"},xHours:{one:"1 hour",other:"{{count}} hours"},xDays:{one:"1 day",other:"{{count}} days"},aboutXWeeks:{one:"about 1 week",other:"about {{count}} weeks"},xWeeks:{one:"1 week",other:"{{count}} weeks"},aboutXMonths:{one:"about 1 month",other:"about {{count}} months"},xMonths:{one:"1 month",other:"{{count}} months"},aboutXYears:{one:"about 1 year",other:"about {{count}} years"},xYears:{one:"1 year",other:"{{count}} years"},overXYears:{one:"over 1 year",other:"over {{count}} years"},almostXYears:{one:"almost 1 year",other:"almost {{count}} years"}},gn=function(e,a,t){var n,r=hn[e];return typeof r=="string"?n=r:a===1?n=r.one:n=r.other.replace("{{count}}",a.toString()),t!=null&&t.addSuffix?t.comparison&&t.comparison>0?"in "+n:n+" ago":n},wn=gn;function qt(e){return function(){var a=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},t=a.width?String(a.width):e.defaultWidth,n=e.formats[t]||e.formats[e.defaultWidth];return n}}var bn={full:"EEEE, MMMM do, y",long:"MMMM do, y",medium:"MMM d, y",short:"MM/dd/yyyy"},_n={full:"h:mm:ss a zzzz",long:"h:mm:ss a z",medium:"h:mm:ss a",short:"h:mm a"},kn={full:"{{date}} 'at' {{time}}",long:"{{date}} 'at' {{time}}",medium:"{{date}}, {{time}}",short:"{{date}}, {{time}}"},Dn={date:qt({formats:bn,defaultWidth:"full"}),time:qt({formats:_n,defaultWidth:"full"}),dateTime:qt({formats:kn,defaultWidth:"full"})},Tn=Dn,xn={lastWeek:"'last' eeee 'at' p",yesterday:"'yesterday at' p",today:"'today at' p",tomorrow:"'tomorrow at' p",nextWeek:"eeee 'at' p",other:"P"},Cn=function(e,a,t,n){return xn[e]},Mn=Cn;function wt(e){return function(a,t){var n=t||{},r=n.context?String(n.context):"standalone",o;if(r==="formatting"&&e.formattingValues){var l=e.defaultFormattingWidth||e.defaultWidth,c=n.width?String(n.width):l;o=e.formattingValues[c]||e.formattingValues[l]}else{var m=e.defaultWidth,g=n.width?String(n.width):e.defaultWidth;o=e.values[g]||e.values[m]}var b=e.argumentCallback?e.argumentCallback(a):a;return o[b]}}var Sn={narrow:["B","A"],abbreviated:["BC","AD"],wide:["Before Christ","Anno Domini"]},On={narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1st quarter","2nd quarter","3rd quarter","4th quarter"]},Pn={narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],wide:["January","February","March","April","May","June","July","August","September","October","November","December"]},Nn={narrow:["S","M","T","W","T","F","S"],short:["Su","Mo","Tu","We","Th","Fr","Sa"],abbreviated:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],wide:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]},$n={narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"}},In={narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"}},An=function(e,a){var t=Number(e),n=t%100;if(n>20||n<10)switch(n%10){case 1:return t+"st";case 2:return t+"nd";case 3:return t+"rd"}return t+"th"},Un={ordinalNumber:An,era:wt({values:Sn,defaultWidth:"wide"}),quarter:wt({values:On,defaultWidth:"wide",argumentCallback:function(e){return e-1}}),month:wt({values:Pn,defaultWidth:"wide"}),day:wt({values:Nn,defaultWidth:"wide"}),dayPeriod:wt({values:$n,defaultWidth:"wide",formattingValues:In,defaultFormattingWidth:"wide"})},Yn=Un;function bt(e){return function(a){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=t.width,r=n&&e.matchPatterns[n]||e.matchPatterns[e.defaultMatchWidth],o=a.match(r);if(!o)return null;var l=o[0],c=n&&e.parsePatterns[n]||e.parsePatterns[e.defaultParseWidth],m=Array.isArray(c)?En(c,function(D){return D.test(l)}):Bn(c,function(D){return D.test(l)}),g;g=e.valueCallback?e.valueCallback(m):m,g=t.valueCallback?t.valueCallback(g):g;var b=a.slice(l.length);return{value:g,rest:b}}}function Bn(e,a){for(var t in e)if(e.hasOwnProperty(t)&&a(e[t]))return t}function En(e,a){for(var t=0;t<e.length;t++)if(a(e[t]))return t}function Wn(e){return function(a){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=a.match(e.matchPattern);if(!n)return null;var r=n[0],o=a.match(e.parsePattern);if(!o)return null;var l=e.valueCallback?e.valueCallback(o[0]):o[0];l=t.valueCallback?t.valueCallback(l):l;var c=a.slice(r.length);return{value:l,rest:c}}}var Vn=/^(\d+)(th|st|nd|rd)?/i,Hn=/\d+/i,Rn={narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},Fn={any:[/^b/i,/^(a|c)/i]},Ln={narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},qn={any:[/1/i,/2/i,/3/i,/4/i]},Gn={narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},Qn={narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},jn={narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},Xn={narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},zn={narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},Kn={any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},Jn={ordinalNumber:Wn({matchPattern:Vn,parsePattern:Hn,valueCallback:function(e){return parseInt(e,10)}}),era:bt({matchPatterns:Rn,defaultMatchWidth:"wide",parsePatterns:Fn,defaultParseWidth:"any"}),quarter:bt({matchPatterns:Ln,defaultMatchWidth:"wide",parsePatterns:qn,defaultParseWidth:"any",valueCallback:function(e){return e+1}}),month:bt({matchPatterns:Gn,defaultMatchWidth:"wide",parsePatterns:Qn,defaultParseWidth:"any"}),day:bt({matchPatterns:jn,defaultMatchWidth:"wide",parsePatterns:Xn,defaultParseWidth:"any"}),dayPeriod:bt({matchPatterns:zn,defaultMatchWidth:"any",parsePatterns:Kn,defaultParseWidth:"any"})},Zn=Jn,er={code:"en-US",formatDistance:wn,formatLong:Tn,formatRelative:Mn,localize:Yn,match:Zn,options:{weekStartsOn:0,firstWeekContainsDate:1}},Ya=er;function Ba(e,a){E(2,arguments);var t=U(a);return cn(e,-t)}var tr=864e5;function ar(e){E(1,arguments);var a=F(e),t=a.getTime();a.setUTCMonth(0,1),a.setUTCHours(0,0,0,0);var n=a.getTime(),r=t-n;return Math.floor(r/tr)+1}function pt(e){E(1,arguments);var a=1,t=F(e),n=t.getUTCDay(),r=(n<a?7:0)+n-a;return t.setUTCDate(t.getUTCDate()-r),t.setUTCHours(0,0,0,0),t}function Ea(e){E(1,arguments);var a=F(e),t=a.getUTCFullYear(),n=new Date(0);n.setUTCFullYear(t+1,0,4),n.setUTCHours(0,0,0,0);var r=pt(n),o=new Date(0);o.setUTCFullYear(t,0,4),o.setUTCHours(0,0,0,0);var l=pt(o);return a.getTime()>=r.getTime()?t+1:a.getTime()>=l.getTime()?t:t-1}function nr(e){E(1,arguments);var a=Ea(e),t=new Date(0);t.setUTCFullYear(a,0,4),t.setUTCHours(0,0,0,0);var n=pt(t);return n}var rr=6048e5;function Wa(e){E(1,arguments);var a=F(e),t=pt(a).getTime()-nr(a).getTime();return Math.round(t/rr)+1}function lt(e,a){E(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.weekStartsOn,o=r==null?0:U(r),l=t.weekStartsOn==null?o:U(t.weekStartsOn);if(!(l>=0&&l<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var c=F(e),m=c.getUTCDay(),g=(m<l?7:0)+m-l;return c.setUTCDate(c.getUTCDate()-g),c.setUTCHours(0,0,0,0),c}function ua(e,a){E(1,arguments);var t=F(e),n=t.getUTCFullYear(),r=a||{},o=r.locale,l=o&&o.options&&o.options.firstWeekContainsDate,c=l==null?1:U(l),m=r.firstWeekContainsDate==null?c:U(r.firstWeekContainsDate);if(!(m>=1&&m<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var g=new Date(0);g.setUTCFullYear(n+1,0,m),g.setUTCHours(0,0,0,0);var b=lt(g,a),D=new Date(0);D.setUTCFullYear(n,0,m),D.setUTCHours(0,0,0,0);var $=lt(D,a);return t.getTime()>=b.getTime()?n+1:t.getTime()>=$.getTime()?n:n-1}function or(e,a){E(1,arguments);var t=a||{},n=t.locale,r=n&&n.options&&n.options.firstWeekContainsDate,o=r==null?1:U(r),l=t.firstWeekContainsDate==null?o:U(t.firstWeekContainsDate),c=ua(e,a),m=new Date(0);m.setUTCFullYear(c,0,l),m.setUTCHours(0,0,0,0);var g=lt(m,a);return g}var lr=6048e5;function Va(e,a){E(1,arguments);var t=F(e),n=lt(t,a).getTime()-or(t,a).getTime();return Math.round(n/lr)+1}function K(e,a){for(var t=e<0?"-":"",n=Math.abs(e).toString();n.length<a;)n="0"+n;return t+n}var ir={y:function(e,a){var t=e.getUTCFullYear(),n=t>0?t:1-t;return K(a==="yy"?n%100:n,a.length)},M:function(e,a){var t=e.getUTCMonth();return a==="M"?String(t+1):K(t+1,2)},d:function(e,a){return K(e.getUTCDate(),a.length)},a:function(e,a){var t=e.getUTCHours()/12>=1?"pm":"am";switch(a){case"a":case"aa":return t.toUpperCase();case"aaa":return t;case"aaaaa":return t[0];case"aaaa":default:return t==="am"?"a.m.":"p.m."}},h:function(e,a){return K(e.getUTCHours()%12||12,a.length)},H:function(e,a){return K(e.getUTCHours(),a.length)},m:function(e,a){return K(e.getUTCMinutes(),a.length)},s:function(e,a){return K(e.getUTCSeconds(),a.length)},S:function(e,a){var t=a.length,n=e.getUTCMilliseconds(),r=Math.floor(n*Math.pow(10,t-3));return K(r,a.length)}},Qe=ir,mt={am:"am",pm:"pm",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},sr={G:function(e,a,t){var n=e.getUTCFullYear()>0?1:0;switch(a){case"G":case"GG":case"GGG":return t.era(n,{width:"abbreviated"});case"GGGGG":return t.era(n,{width:"narrow"});case"GGGG":default:return t.era(n,{width:"wide"})}},y:function(e,a,t){if(a==="yo"){var n=e.getUTCFullYear(),r=n>0?n:1-n;return t.ordinalNumber(r,{unit:"year"})}return Qe.y(e,a)},Y:function(e,a,t,n){var r=ua(e,n),o=r>0?r:1-r;if(a==="YY"){var l=o%100;return K(l,2)}return a==="Yo"?t.ordinalNumber(o,{unit:"year"}):K(o,a.length)},R:function(e,a){var t=Ea(e);return K(t,a.length)},u:function(e,a){var t=e.getUTCFullYear();return K(t,a.length)},Q:function(e,a,t){var n=Math.ceil((e.getUTCMonth()+1)/3);switch(a){case"Q":return String(n);case"QQ":return K(n,2);case"Qo":return t.ordinalNumber(n,{unit:"quarter"});case"QQQ":return t.quarter(n,{width:"abbreviated",context:"formatting"});case"QQQQQ":return t.quarter(n,{width:"narrow",context:"formatting"});case"QQQQ":default:return t.quarter(n,{width:"wide",context:"formatting"})}},q:function(e,a,t){var n=Math.ceil((e.getUTCMonth()+1)/3);switch(a){case"q":return String(n);case"qq":return K(n,2);case"qo":return t.ordinalNumber(n,{unit:"quarter"});case"qqq":return t.quarter(n,{width:"abbreviated",context:"standalone"});case"qqqqq":return t.quarter(n,{width:"narrow",context:"standalone"});case"qqqq":default:return t.quarter(n,{width:"wide",context:"standalone"})}},M:function(e,a,t){var n=e.getUTCMonth();switch(a){case"M":case"MM":return Qe.M(e,a);case"Mo":return t.ordinalNumber(n+1,{unit:"month"});case"MMM":return t.month(n,{width:"abbreviated",context:"formatting"});case"MMMMM":return t.month(n,{width:"narrow",context:"formatting"});case"MMMM":default:return t.month(n,{width:"wide",context:"formatting"})}},L:function(e,a,t){var n=e.getUTCMonth();switch(a){case"L":return String(n+1);case"LL":return K(n+1,2);case"Lo":return t.ordinalNumber(n+1,{unit:"month"});case"LLL":return t.month(n,{width:"abbreviated",context:"standalone"});case"LLLLL":return t.month(n,{width:"narrow",context:"standalone"});case"LLLL":default:return t.month(n,{width:"wide",context:"standalone"})}},w:function(e,a,t,n){var r=Va(e,n);return a==="wo"?t.ordinalNumber(r,{unit:"week"}):K(r,a.length)},I:function(e,a,t){var n=Wa(e);return a==="Io"?t.ordinalNumber(n,{unit:"week"}):K(n,a.length)},d:function(e,a,t){return a==="do"?t.ordinalNumber(e.getUTCDate(),{unit:"date"}):Qe.d(e,a)},D:function(e,a,t){var n=ar(e);return a==="Do"?t.ordinalNumber(n,{unit:"dayOfYear"}):K(n,a.length)},E:function(e,a,t){var n=e.getUTCDay();switch(a){case"E":case"EE":case"EEE":return t.day(n,{width:"abbreviated",context:"formatting"});case"EEEEE":return t.day(n,{width:"narrow",context:"formatting"});case"EEEEEE":return t.day(n,{width:"short",context:"formatting"});case"EEEE":default:return t.day(n,{width:"wide",context:"formatting"})}},e:function(e,a,t,n){var r=e.getUTCDay(),o=(r-n.weekStartsOn+8)%7||7;switch(a){case"e":return String(o);case"ee":return K(o,2);case"eo":return t.ordinalNumber(o,{unit:"day"});case"eee":return t.day(r,{width:"abbreviated",context:"formatting"});case"eeeee":return t.day(r,{width:"narrow",context:"formatting"});case"eeeeee":return t.day(r,{width:"short",context:"formatting"});case"eeee":default:return t.day(r,{width:"wide",context:"formatting"})}},c:function(e,a,t,n){var r=e.getUTCDay(),o=(r-n.weekStartsOn+8)%7||7;switch(a){case"c":return String(o);case"cc":return K(o,a.length);case"co":return t.ordinalNumber(o,{unit:"day"});case"ccc":return t.day(r,{width:"abbreviated",context:"standalone"});case"ccccc":return t.day(r,{width:"narrow",context:"standalone"});case"cccccc":return t.day(r,{width:"short",context:"standalone"});case"cccc":default:return t.day(r,{width:"wide",context:"standalone"})}},i:function(e,a,t){var n=e.getUTCDay(),r=n===0?7:n;switch(a){case"i":return String(r);case"ii":return K(r,a.length);case"io":return t.ordinalNumber(r,{unit:"day"});case"iii":return t.day(n,{width:"abbreviated",context:"formatting"});case"iiiii":return t.day(n,{width:"narrow",context:"formatting"});case"iiiiii":return t.day(n,{width:"short",context:"formatting"});case"iiii":default:return t.day(n,{width:"wide",context:"formatting"})}},a:function(e,a,t){var n=e.getUTCHours(),r=n/12>=1?"pm":"am";switch(a){case"a":case"aa":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"aaa":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"aaaaa":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"aaaa":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},b:function(e,a,t){var n=e.getUTCHours(),r;switch(n===12?r=mt.noon:n===0?r=mt.midnight:r=n/12>=1?"pm":"am",a){case"b":case"bb":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"bbb":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"bbbbb":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"bbbb":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},B:function(e,a,t){var n=e.getUTCHours(),r;switch(n>=17?r=mt.evening:n>=12?r=mt.afternoon:n>=4?r=mt.morning:r=mt.night,a){case"B":case"BB":case"BBB":return t.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"BBBBB":return t.dayPeriod(r,{width:"narrow",context:"formatting"});case"BBBB":default:return t.dayPeriod(r,{width:"wide",context:"formatting"})}},h:function(e,a,t){if(a==="ho"){var n=e.getUTCHours()%12;return n===0&&(n=12),t.ordinalNumber(n,{unit:"hour"})}return Qe.h(e,a)},H:function(e,a,t){return a==="Ho"?t.ordinalNumber(e.getUTCHours(),{unit:"hour"}):Qe.H(e,a)},K:function(e,a,t){var n=e.getUTCHours()%12;return a==="Ko"?t.ordinalNumber(n,{unit:"hour"}):K(n,a.length)},k:function(e,a,t){var n=e.getUTCHours();return n===0&&(n=24),a==="ko"?t.ordinalNumber(n,{unit:"hour"}):K(n,a.length)},m:function(e,a,t){return a==="mo"?t.ordinalNumber(e.getUTCMinutes(),{unit:"minute"}):Qe.m(e,a)},s:function(e,a,t){return a==="so"?t.ordinalNumber(e.getUTCSeconds(),{unit:"second"}):Qe.s(e,a)},S:function(e,a){return Qe.S(e,a)},X:function(e,a,t,n){var r=n._originalDate||e,o=r.getTimezoneOffset();if(o===0)return"Z";switch(a){case"X":return ya(o);case"XXXX":case"XX":return et(o);case"XXXXX":case"XXX":default:return et(o,":")}},x:function(e,a,t,n){var r=n._originalDate||e,o=r.getTimezoneOffset();switch(a){case"x":return ya(o);case"xxxx":case"xx":return et(o);case"xxxxx":case"xxx":default:return et(o,":")}},O:function(e,a,t,n){var r=n._originalDate||e,o=r.getTimezoneOffset();switch(a){case"O":case"OO":case"OOO":return"GMT"+pa(o,":");case"OOOO":default:return"GMT"+et(o,":")}},z:function(e,a,t,n){var r=n._originalDate||e,o=r.getTimezoneOffset();switch(a){case"z":case"zz":case"zzz":return"GMT"+pa(o,":");case"zzzz":default:return"GMT"+et(o,":")}},t:function(e,a,t,n){var r=n._originalDate||e,o=Math.floor(r.getTime()/1e3);return K(o,a.length)},T:function(e,a,t,n){var r=n._originalDate||e,o=r.getTime();return K(o,a.length)}};function pa(e,a){var t=e>0?"-":"+",n=Math.abs(e),r=Math.floor(n/60),o=n%60;if(o===0)return t+String(r);var l=a||"";return t+String(r)+l+K(o,2)}function ya(e,a){if(e%60===0){var t=e>0?"-":"+";return t+K(Math.abs(e)/60,2)}return et(e,a)}function et(e,a){var t=a||"",n=e>0?"-":"+",r=Math.abs(e),o=K(Math.floor(r/60),2),l=K(r%60,2);return n+o+t+l}var ur=sr;function ha(e,a){switch(e){case"P":return a.date({width:"short"});case"PP":return a.date({width:"medium"});case"PPP":return a.date({width:"long"});case"PPPP":default:return a.date({width:"full"})}}function Ha(e,a){switch(e){case"p":return a.time({width:"short"});case"pp":return a.time({width:"medium"});case"ppp":return a.time({width:"long"});case"pppp":default:return a.time({width:"full"})}}function dr(e,a){var t=e.match(/(P+)(p+)?/)||[],n=t[1],r=t[2];if(!r)return ha(e,a);var o;switch(n){case"P":o=a.dateTime({width:"short"});break;case"PP":o=a.dateTime({width:"medium"});break;case"PPP":o=a.dateTime({width:"long"});break;case"PPPP":default:o=a.dateTime({width:"full"});break}return o.replace("{{date}}",ha(n,a)).replace("{{time}}",Ha(r,a))}var cr={p:Ha,P:dr},Ra=cr,mr=["D","DD"],fr=["YY","YYYY"];function Fa(e){return mr.indexOf(e)!==-1}function La(e){return fr.indexOf(e)!==-1}function Wt(e,a,t){if(e==="YYYY")throw new RangeError("Use `yyyy` instead of `YYYY` (in `".concat(a,"`) for formatting years to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="YY")throw new RangeError("Use `yy` instead of `YY` (in `".concat(a,"`) for formatting years to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="D")throw new RangeError("Use `d` instead of `D` (in `".concat(a,"`) for formatting days of the month to the input `").concat(t,"`; see: https://git.io/fxCyr"));if(e==="DD")throw new RangeError("Use `dd` instead of `DD` (in `".concat(a,"`) for formatting days of the month to the input `").concat(t,"`; see: https://git.io/fxCyr"))}var vr=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,pr=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,yr=/^'([^]*?)'?$/,hr=/''/g,gr=/[a-zA-Z]/;function ga(e,a,t){E(2,arguments);var n=String(a),r=t||{},o=r.locale||Ya,l=o.options&&o.options.firstWeekContainsDate,c=l==null?1:U(l),m=r.firstWeekContainsDate==null?c:U(r.firstWeekContainsDate);if(!(m>=1&&m<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var g=o.options&&o.options.weekStartsOn,b=g==null?0:U(g),D=r.weekStartsOn==null?b:U(r.weekStartsOn);if(!(D>=0&&D<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");if(!o.localize)throw new RangeError("locale must contain localize property");if(!o.formatLong)throw new RangeError("locale must contain formatLong property");var $=F(e);if(!Tt($))throw new RangeError("Invalid time value");var P=Et($),N=Ba($,P),M={firstWeekContainsDate:m,weekStartsOn:D,locale:o,_originalDate:$},d=n.match(pr).map(function(I){var s=I[0];if(s==="p"||s==="P"){var w=Ra[s];return w(I,o.formatLong,M)}return I}).join("").match(vr).map(function(I){if(I==="''")return"'";var s=I[0];if(s==="'")return wr(I);var w=ur[s];if(w)return!r.useAdditionalWeekYearTokens&&La(I)&&Wt(I,a,e),!r.useAdditionalDayOfYearTokens&&Fa(I)&&Wt(I,a,e),w(N,I,o.localize,M);if(s.match(gr))throw new RangeError("Format string contains an unescaped latin alphabet character `"+s+"`");return I}).join("");return d}function wr(e){return e.match(yr)[1].replace(hr,"'")}function br(e,a){if(e==null)throw new TypeError("assign requires that input parameter not be null or undefined");a=a||{};for(var t in a)Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t]);return e}function _r(e){E(1,arguments);var a=F(e),t=a.getDay();return t}function kr(e){E(1,arguments);var a=F(e),t=a.getFullYear(),n=a.getMonth(),r=new Date(0);return r.setFullYear(t,n+1,0),r.setHours(0,0,0,0),r.getDate()}function xe(e){E(1,arguments);var a=F(e),t=a.getHours();return t}var Dr=6048e5;function Tr(e){E(1,arguments);var a=F(e),t=Bt(a).getTime()-fn(a).getTime();return Math.round(t/Dr)+1}function Ce(e){E(1,arguments);var a=F(e),t=a.getMinutes();return t}function se(e){E(1,arguments);var a=F(e),t=a.getMonth();return t}function Re(e){E(1,arguments);var a=F(e),t=a.getSeconds();return t}function ue(e){return E(1,arguments),F(e).getFullYear()}function xr(e,a){E(2,arguments);var t=U(a);return ot(e,-t)}function Mt(e,a){E(2,arguments);var t=U(a);return Fe(e,-t)}function Cr(e,a){if(E(2,arguments),!a||typeof a!="object")return new Date(NaN);var t=a.years?U(a.years):0,n=a.months?U(a.months):0,r=a.weeks?U(a.weeks):0,o=a.days?U(a.days):0,l=a.hours?U(a.hours):0,c=a.minutes?U(a.minutes):0,m=a.seconds?U(a.seconds):0,g=Mt(e,n+t*12),b=xr(g,o+r*7),D=c+l*60,$=m+D*60,P=$*1e3,N=new Date(b.getTime()-P);return N}function qa(e,a){E(2,arguments);var t=F(e),n=F(a);return t.getTime()>n.getTime()}function Ga(e,a){E(2,arguments);var t=F(e),n=F(a);return t.getTime()<n.getTime()}function Mr(e,a){E(2,arguments);var t=F(e),n=F(a);return t.getTime()===n.getTime()}function Gt(e,a,t){E(2,arguments);var n=t||{},r=n.locale,o=r&&r.options&&r.options.weekStartsOn,l=o==null?0:U(o),c=n.weekStartsOn==null?l:U(n.weekStartsOn);if(!(c>=0&&c<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");var m=F(e),g=U(a),b=m.getUTCDay(),D=g%7,$=(D+7)%7,P=($<c?7:0)+g-b;return m.setUTCDate(m.getUTCDate()+P),m}function Sr(e,a){E(2,arguments);var t=U(a);t%7===0&&(t=t-7);var n=1,r=F(e),o=r.getUTCDay(),l=t%7,c=(l+7)%7,m=(c<n?7:0)+t-o;return r.setUTCDate(r.getUTCDate()+m),r}function Or(e,a){E(2,arguments);var t=F(e),n=U(a),r=Wa(t)-n;return t.setUTCDate(t.getUTCDate()-r*7),t}function Pr(e,a,t){E(2,arguments);var n=F(e),r=U(a),o=Va(n,t)-r;return n.setUTCDate(n.getUTCDate()-o*7),n}var Nr=36e5,$r=6e4,Ir=1e3,oe={month:/^(1[0-2]|0?\d)/,date:/^(3[0-1]|[0-2]?\d)/,dayOfYear:/^(36[0-6]|3[0-5]\d|[0-2]?\d?\d)/,week:/^(5[0-3]|[0-4]?\d)/,hour23h:/^(2[0-3]|[0-1]?\d)/,hour24h:/^(2[0-4]|[0-1]?\d)/,hour11h:/^(1[0-1]|0?\d)/,hour12h:/^(1[0-2]|0?\d)/,minute:/^[0-5]?\d/,second:/^[0-5]?\d/,singleDigit:/^\d/,twoDigits:/^\d{1,2}/,threeDigits:/^\d{1,3}/,fourDigits:/^\d{1,4}/,anyDigitsSigned:/^-?\d+/,singleDigitSigned:/^-?\d/,twoDigitsSigned:/^-?\d{1,2}/,threeDigitsSigned:/^-?\d{1,3}/,fourDigitsSigned:/^-?\d{1,4}/},Ue={basicOptionalMinutes:/^([+-])(\d{2})(\d{2})?|Z/,basic:/^([+-])(\d{2})(\d{2})|Z/,basicOptionalSeconds:/^([+-])(\d{2})(\d{2})((\d{2}))?|Z/,extended:/^([+-])(\d{2}):(\d{2})|Z/,extendedOptionalSeconds:/^([+-])(\d{2}):(\d{2})(:(\d{2}))?|Z/};function ne(e,a,t){var n=a.match(e);if(!n)return null;var r=parseInt(n[0],10);return{value:t?t(r):r,rest:a.slice(n[0].length)}}function Ye(e,a){var t=a.match(e);if(!t)return null;if(t[0]==="Z")return{value:0,rest:a.slice(1)};var n=t[1]==="+"?1:-1,r=t[2]?parseInt(t[2],10):0,o=t[3]?parseInt(t[3],10):0,l=t[5]?parseInt(t[5],10):0;return{value:n*(r*Nr+o*$r+l*Ir),rest:a.slice(t[0].length)}}function wa(e,a){return ne(oe.anyDigitsSigned,e,a)}function re(e,a,t){switch(e){case 1:return ne(oe.singleDigit,a,t);case 2:return ne(oe.twoDigits,a,t);case 3:return ne(oe.threeDigits,a,t);case 4:return ne(oe.fourDigits,a,t);default:return ne(new RegExp("^\\d{1,"+e+"}"),a,t)}}function Ot(e,a,t){switch(e){case 1:return ne(oe.singleDigitSigned,a,t);case 2:return ne(oe.twoDigitsSigned,a,t);case 3:return ne(oe.threeDigitsSigned,a,t);case 4:return ne(oe.fourDigitsSigned,a,t);default:return ne(new RegExp("^-?\\d{1,"+e+"}"),a,t)}}function Qt(e){switch(e){case"morning":return 4;case"evening":return 17;case"pm":case"noon":case"afternoon":return 12;case"am":case"midnight":case"night":default:return 0}}function ba(e,a){var t=a>0,n=t?a:1-a,r;if(n<=50)r=e||100;else{var o=n+50,l=Math.floor(o/100)*100,c=e>=o%100;r=e+l-(c?100:0)}return t?r:1-r}var Ar=[31,28,31,30,31,30,31,31,30,31,30,31],Ur=[31,29,31,30,31,30,31,31,30,31,30,31];function _a(e){return e%400===0||e%4===0&&e%100!==0}var Yr={G:{priority:140,parse:function(e,a,t,n){switch(a){case"G":case"GG":case"GGG":return t.era(e,{width:"abbreviated"})||t.era(e,{width:"narrow"});case"GGGGG":return t.era(e,{width:"narrow"});case"GGGG":default:return t.era(e,{width:"wide"})||t.era(e,{width:"abbreviated"})||t.era(e,{width:"narrow"})}},set:function(e,a,t,n){return a.era=t,e.setUTCFullYear(t,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["R","u","t","T"]},y:{priority:130,parse:function(e,a,t,n){var r=function(o){return{year:o,isTwoDigitYear:a==="yy"}};switch(a){case"y":return re(4,e,r);case"yo":return t.ordinalNumber(e,{unit:"year",valueCallback:r});default:return re(a.length,e,r)}},validate:function(e,a,t){return a.isTwoDigitYear||a.year>0},set:function(e,a,t,n){var r=e.getUTCFullYear();if(t.isTwoDigitYear){var o=ba(t.year,r);return e.setUTCFullYear(o,0,1),e.setUTCHours(0,0,0,0),e}var l=!("era"in a)||a.era===1?t.year:1-t.year;return e.setUTCFullYear(l,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","u","w","I","i","e","c","t","T"]},Y:{priority:130,parse:function(e,a,t,n){var r=function(o){return{year:o,isTwoDigitYear:a==="YY"}};switch(a){case"Y":return re(4,e,r);case"Yo":return t.ordinalNumber(e,{unit:"year",valueCallback:r});default:return re(a.length,e,r)}},validate:function(e,a,t){return a.isTwoDigitYear||a.year>0},set:function(e,a,t,n){var r=ua(e,n);if(t.isTwoDigitYear){var o=ba(t.year,r);return e.setUTCFullYear(o,0,n.firstWeekContainsDate),e.setUTCHours(0,0,0,0),lt(e,n)}var l=!("era"in a)||a.era===1?t.year:1-t.year;return e.setUTCFullYear(l,0,n.firstWeekContainsDate),e.setUTCHours(0,0,0,0),lt(e,n)},incompatibleTokens:["y","R","u","Q","q","M","L","I","d","D","i","t","T"]},R:{priority:130,parse:function(e,a,t,n){return Ot(a==="R"?4:a.length,e)},set:function(e,a,t,n){var r=new Date(0);return r.setUTCFullYear(t,0,4),r.setUTCHours(0,0,0,0),pt(r)},incompatibleTokens:["G","y","Y","u","Q","q","M","L","w","d","D","e","c","t","T"]},u:{priority:130,parse:function(e,a,t,n){return Ot(a==="u"?4:a.length,e)},set:function(e,a,t,n){return e.setUTCFullYear(t,0,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["G","y","Y","R","w","I","i","e","c","t","T"]},Q:{priority:120,parse:function(e,a,t,n){switch(a){case"Q":case"QQ":return re(a.length,e);case"Qo":return t.ordinalNumber(e,{unit:"quarter"});case"QQQ":return t.quarter(e,{width:"abbreviated",context:"formatting"})||t.quarter(e,{width:"narrow",context:"formatting"});case"QQQQQ":return t.quarter(e,{width:"narrow",context:"formatting"});case"QQQQ":default:return t.quarter(e,{width:"wide",context:"formatting"})||t.quarter(e,{width:"abbreviated",context:"formatting"})||t.quarter(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=1&&a<=4},set:function(e,a,t,n){return e.setUTCMonth((t-1)*3,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","M","L","w","I","d","D","i","e","c","t","T"]},q:{priority:120,parse:function(e,a,t,n){switch(a){case"q":case"qq":return re(a.length,e);case"qo":return t.ordinalNumber(e,{unit:"quarter"});case"qqq":return t.quarter(e,{width:"abbreviated",context:"standalone"})||t.quarter(e,{width:"narrow",context:"standalone"});case"qqqqq":return t.quarter(e,{width:"narrow",context:"standalone"});case"qqqq":default:return t.quarter(e,{width:"wide",context:"standalone"})||t.quarter(e,{width:"abbreviated",context:"standalone"})||t.quarter(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=1&&a<=4},set:function(e,a,t,n){return e.setUTCMonth((t-1)*3,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","Q","M","L","w","I","d","D","i","e","c","t","T"]},M:{priority:110,parse:function(e,a,t,n){var r=function(o){return o-1};switch(a){case"M":return ne(oe.month,e,r);case"MM":return re(2,e,r);case"Mo":return t.ordinalNumber(e,{unit:"month",valueCallback:r});case"MMM":return t.month(e,{width:"abbreviated",context:"formatting"})||t.month(e,{width:"narrow",context:"formatting"});case"MMMMM":return t.month(e,{width:"narrow",context:"formatting"});case"MMMM":default:return t.month(e,{width:"wide",context:"formatting"})||t.month(e,{width:"abbreviated",context:"formatting"})||t.month(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){return e.setUTCMonth(t,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","L","w","I","D","i","e","c","t","T"]},L:{priority:110,parse:function(e,a,t,n){var r=function(o){return o-1};switch(a){case"L":return ne(oe.month,e,r);case"LL":return re(2,e,r);case"Lo":return t.ordinalNumber(e,{unit:"month",valueCallback:r});case"LLL":return t.month(e,{width:"abbreviated",context:"standalone"})||t.month(e,{width:"narrow",context:"standalone"});case"LLLLL":return t.month(e,{width:"narrow",context:"standalone"});case"LLLL":default:return t.month(e,{width:"wide",context:"standalone"})||t.month(e,{width:"abbreviated",context:"standalone"})||t.month(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){return e.setUTCMonth(t,1),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","M","w","I","D","i","e","c","t","T"]},w:{priority:100,parse:function(e,a,t,n){switch(a){case"w":return ne(oe.week,e);case"wo":return t.ordinalNumber(e,{unit:"week"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=53},set:function(e,a,t,n){return lt(Pr(e,t,n),n)},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","i","t","T"]},I:{priority:100,parse:function(e,a,t,n){switch(a){case"I":return ne(oe.week,e);case"Io":return t.ordinalNumber(e,{unit:"week"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=53},set:function(e,a,t,n){return pt(Or(e,t,n),n)},incompatibleTokens:["y","Y","u","q","Q","M","L","w","d","D","e","c","t","T"]},d:{priority:90,subPriority:1,parse:function(e,a,t,n){switch(a){case"d":return ne(oe.date,e);case"do":return t.ordinalNumber(e,{unit:"date"});default:return re(a.length,e)}},validate:function(e,a,t){var n=e.getUTCFullYear(),r=_a(n),o=e.getUTCMonth();return r?a>=1&&a<=Ur[o]:a>=1&&a<=Ar[o]},set:function(e,a,t,n){return e.setUTCDate(t),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","w","I","D","i","e","c","t","T"]},D:{priority:90,subPriority:1,parse:function(e,a,t,n){switch(a){case"D":case"DD":return ne(oe.dayOfYear,e);case"Do":return t.ordinalNumber(e,{unit:"date"});default:return re(a.length,e)}},validate:function(e,a,t){var n=e.getUTCFullYear(),r=_a(n);return r?a>=1&&a<=366:a>=1&&a<=365},set:function(e,a,t,n){return e.setUTCMonth(0,t),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["Y","R","q","Q","M","L","w","I","d","E","i","e","c","t","T"]},E:{priority:90,parse:function(e,a,t,n){switch(a){case"E":case"EE":case"EEE":return t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"EEEEE":return t.day(e,{width:"narrow",context:"formatting"});case"EEEEEE":return t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"EEEE":default:return t.day(e,{width:"wide",context:"formatting"})||t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=Gt(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["D","i","e","c","t","T"]},e:{priority:90,parse:function(e,a,t,n){var r=function(o){var l=Math.floor((o-1)/7)*7;return(o+n.weekStartsOn+6)%7+l};switch(a){case"e":case"ee":return re(a.length,e,r);case"eo":return t.ordinalNumber(e,{unit:"day",valueCallback:r});case"eee":return t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"eeeee":return t.day(e,{width:"narrow",context:"formatting"});case"eeeeee":return t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"});case"eeee":default:return t.day(e,{width:"wide",context:"formatting"})||t.day(e,{width:"abbreviated",context:"formatting"})||t.day(e,{width:"short",context:"formatting"})||t.day(e,{width:"narrow",context:"formatting"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=Gt(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","E","i","c","t","T"]},c:{priority:90,parse:function(e,a,t,n){var r=function(o){var l=Math.floor((o-1)/7)*7;return(o+n.weekStartsOn+6)%7+l};switch(a){case"c":case"cc":return re(a.length,e,r);case"co":return t.ordinalNumber(e,{unit:"day",valueCallback:r});case"ccc":return t.day(e,{width:"abbreviated",context:"standalone"})||t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"});case"ccccc":return t.day(e,{width:"narrow",context:"standalone"});case"cccccc":return t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"});case"cccc":default:return t.day(e,{width:"wide",context:"standalone"})||t.day(e,{width:"abbreviated",context:"standalone"})||t.day(e,{width:"short",context:"standalone"})||t.day(e,{width:"narrow",context:"standalone"})}},validate:function(e,a,t){return a>=0&&a<=6},set:function(e,a,t,n){return e=Gt(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","R","u","q","Q","M","L","I","d","D","E","i","e","t","T"]},i:{priority:90,parse:function(e,a,t,n){var r=function(o){return o===0?7:o};switch(a){case"i":case"ii":return re(a.length,e);case"io":return t.ordinalNumber(e,{unit:"day"});case"iii":return t.day(e,{width:"abbreviated",context:"formatting",valueCallback:r})||t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiiii":return t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiiiii":return t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r});case"iiii":default:return t.day(e,{width:"wide",context:"formatting",valueCallback:r})||t.day(e,{width:"abbreviated",context:"formatting",valueCallback:r})||t.day(e,{width:"short",context:"formatting",valueCallback:r})||t.day(e,{width:"narrow",context:"formatting",valueCallback:r})}},validate:function(e,a,t){return a>=1&&a<=7},set:function(e,a,t,n){return e=Sr(e,t,n),e.setUTCHours(0,0,0,0),e},incompatibleTokens:["y","Y","u","q","Q","M","L","w","d","D","E","e","c","t","T"]},a:{priority:80,parse:function(e,a,t,n){switch(a){case"a":case"aa":case"aaa":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"aaaaa":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"aaaa":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(Qt(t),0,0,0),e},incompatibleTokens:["b","B","H","k","t","T"]},b:{priority:80,parse:function(e,a,t,n){switch(a){case"b":case"bb":case"bbb":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"bbbbb":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"bbbb":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(Qt(t),0,0,0),e},incompatibleTokens:["a","B","H","k","t","T"]},B:{priority:80,parse:function(e,a,t,n){switch(a){case"B":case"BB":case"BBB":return t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"});case"BBBBB":return t.dayPeriod(e,{width:"narrow",context:"formatting"});case"BBBB":default:return t.dayPeriod(e,{width:"wide",context:"formatting"})||t.dayPeriod(e,{width:"abbreviated",context:"formatting"})||t.dayPeriod(e,{width:"narrow",context:"formatting"})}},set:function(e,a,t,n){return e.setUTCHours(Qt(t),0,0,0),e},incompatibleTokens:["a","b","t","T"]},h:{priority:70,parse:function(e,a,t,n){switch(a){case"h":return ne(oe.hour12h,e);case"ho":return t.ordinalNumber(e,{unit:"hour"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=12},set:function(e,a,t,n){var r=e.getUTCHours()>=12;return r&&t<12?e.setUTCHours(t+12,0,0,0):!r&&t===12?e.setUTCHours(0,0,0,0):e.setUTCHours(t,0,0,0),e},incompatibleTokens:["H","K","k","t","T"]},H:{priority:70,parse:function(e,a,t,n){switch(a){case"H":return ne(oe.hour23h,e);case"Ho":return t.ordinalNumber(e,{unit:"hour"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=23},set:function(e,a,t,n){return e.setUTCHours(t,0,0,0),e},incompatibleTokens:["a","b","h","K","k","t","T"]},K:{priority:70,parse:function(e,a,t,n){switch(a){case"K":return ne(oe.hour11h,e);case"Ko":return t.ordinalNumber(e,{unit:"hour"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=11},set:function(e,a,t,n){var r=e.getUTCHours()>=12;return r&&t<12?e.setUTCHours(t+12,0,0,0):e.setUTCHours(t,0,0,0),e},incompatibleTokens:["h","H","k","t","T"]},k:{priority:70,parse:function(e,a,t,n){switch(a){case"k":return ne(oe.hour24h,e);case"ko":return t.ordinalNumber(e,{unit:"hour"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=1&&a<=24},set:function(e,a,t,n){var r=t<=24?t%24:t;return e.setUTCHours(r,0,0,0),e},incompatibleTokens:["a","b","h","H","K","t","T"]},m:{priority:60,parse:function(e,a,t,n){switch(a){case"m":return ne(oe.minute,e);case"mo":return t.ordinalNumber(e,{unit:"minute"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=59},set:function(e,a,t,n){return e.setUTCMinutes(t,0,0),e},incompatibleTokens:["t","T"]},s:{priority:50,parse:function(e,a,t,n){switch(a){case"s":return ne(oe.second,e);case"so":return t.ordinalNumber(e,{unit:"second"});default:return re(a.length,e)}},validate:function(e,a,t){return a>=0&&a<=59},set:function(e,a,t,n){return e.setUTCSeconds(t,0),e},incompatibleTokens:["t","T"]},S:{priority:30,parse:function(e,a,t,n){var r=function(o){return Math.floor(o*Math.pow(10,-a.length+3))};return re(a.length,e,r)},set:function(e,a,t,n){return e.setUTCMilliseconds(t),e},incompatibleTokens:["t","T"]},X:{priority:10,parse:function(e,a,t,n){switch(a){case"X":return Ye(Ue.basicOptionalMinutes,e);case"XX":return Ye(Ue.basic,e);case"XXXX":return Ye(Ue.basicOptionalSeconds,e);case"XXXXX":return Ye(Ue.extendedOptionalSeconds,e);case"XXX":default:return Ye(Ue.extended,e)}},set:function(e,a,t,n){return a.timestampIsSet?e:new Date(e.getTime()-t)},incompatibleTokens:["t","T","x"]},x:{priority:10,parse:function(e,a,t,n){switch(a){case"x":return Ye(Ue.basicOptionalMinutes,e);case"xx":return Ye(Ue.basic,e);case"xxxx":return Ye(Ue.basicOptionalSeconds,e);case"xxxxx":return Ye(Ue.extendedOptionalSeconds,e);case"xxx":default:return Ye(Ue.extended,e)}},set:function(e,a,t,n){return a.timestampIsSet?e:new Date(e.getTime()-t)},incompatibleTokens:["t","T","X"]},t:{priority:40,parse:function(e,a,t,n){return wa(e)},set:function(e,a,t,n){return[new Date(t*1e3),{timestampIsSet:!0}]},incompatibleTokens:"*"},T:{priority:20,parse:function(e,a,t,n){return wa(e)},set:function(e,a,t,n){return[new Date(t),{timestampIsSet:!0}]},incompatibleTokens:"*"}},Br=Yr,Er=10,Wr=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Vr=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,Hr=/^'([^]*?)'?$/,Rr=/''/g,Fr=/\S/,Lr=/[a-zA-Z]/;function qr(e,a,t,n){E(3,arguments);var r=String(e),o=String(a),l=n||{},c=l.locale||Ya;if(!c.match)throw new RangeError("locale must contain match property");var m=c.options&&c.options.firstWeekContainsDate,g=m==null?1:U(m),b=l.firstWeekContainsDate==null?g:U(l.firstWeekContainsDate);if(!(b>=1&&b<=7))throw new RangeError("firstWeekContainsDate must be between 1 and 7 inclusively");var D=c.options&&c.options.weekStartsOn,$=D==null?0:U(D),P=l.weekStartsOn==null?$:U(l.weekStartsOn);if(!(P>=0&&P<=6))throw new RangeError("weekStartsOn must be between 0 and 6 inclusively");if(o==="")return r===""?F(t):new Date(NaN);var N={firstWeekContainsDate:b,weekStartsOn:P,locale:c},M=[{priority:Er,subPriority:-1,set:Gr,index:0}],d,I=o.match(Vr).map(function(ie){var me=ie[0];if(me==="p"||me==="P"){var we=Ra[me];return we(ie,c.formatLong,N)}return ie}).join("").match(Wr),s=[];for(d=0;d<I.length;d++){var w=I[d];!l.useAdditionalWeekYearTokens&&La(w)&&Wt(w,o,e),!l.useAdditionalDayOfYearTokens&&Fa(w)&&Wt(w,o,e);var T=w[0],V=Br[T];if(V){var x=V.incompatibleTokens;if(Array.isArray(x)){for(var f=void 0,_=0;_<s.length;_++){var S=s[_].token;if(x.indexOf(S)!==-1||S===T){f=s[_];break}}if(f)throw new RangeError("The format string mustn't contain `".concat(f.fullToken,"` and `").concat(w,"` at the same time"))}else if(V.incompatibleTokens==="*"&&s.length)throw new RangeError("The format string mustn't contain `".concat(w,"` and any other token at the same time"));s.push({token:T,fullToken:w});var v=V.parse(r,w,c.match,N);if(!v)return new Date(NaN);M.push({priority:V.priority,subPriority:V.subPriority||0,set:V.set,validate:V.validate,value:v.value,index:M.length}),r=v.rest}else{if(T.match(Lr))throw new RangeError("Format string contains an unescaped latin alphabet character `"+T+"`");if(w==="''"?w="'":T==="'"&&(w=Qr(w)),r.indexOf(w)===0)r=r.slice(w.length);else return new Date(NaN)}}if(r.length>0&&Fr.test(r))return new Date(NaN);var q=M.map(function(ie){return ie.priority}).sort(function(ie,me){return me-ie}).filter(function(ie,me,we){return we.indexOf(ie)===me}).map(function(ie){return M.filter(function(me){return me.priority===ie}).sort(function(me,we){return we.subPriority-me.subPriority})}).map(function(ie){return ie[0]}),W=F(t);if(isNaN(W))return new Date(NaN);var le=Ba(W,Et(W)),Se={};for(d=0;d<q.length;d++){var ke=q[d];if(ke.validate&&!ke.validate(le,ke.value,N))return new Date(NaN);var pe=ke.set(le,Se,ke.value,N);pe[0]?(le=pe[0],br(Se,pe[1])):le=pe}return le}function Gr(e,a){if(a.timestampIsSet)return e;var t=new Date(0);return t.setFullYear(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate()),t.setHours(e.getUTCHours(),e.getUTCMinutes(),e.getUTCSeconds(),e.getUTCMilliseconds()),t}function Qr(e){return e.match(Hr)[1].replace(Rr,"'")}function xt(e,a){E(2,arguments);var t=F(e),n=U(a),r=t.getFullYear(),o=t.getDate(),l=new Date(0);l.setFullYear(r,n,15),l.setHours(0,0,0,0);var c=kr(l);return t.setMonth(n,Math.min(o,c)),t}function Ne(e,a){if(E(2,arguments),typeof a!="object"||a===null)throw new RangeError("values parameter must be an object");var t=F(e);return isNaN(t.getTime())?new Date(NaN):(a.year!=null&&t.setFullYear(a.year),a.month!=null&&(t=xt(t,a.month)),a.date!=null&&t.setDate(U(a.date)),a.hours!=null&&t.setHours(U(a.hours)),a.minutes!=null&&t.setMinutes(U(a.minutes)),a.seconds!=null&&t.setSeconds(U(a.seconds)),a.milliseconds!=null&&t.setMilliseconds(U(a.milliseconds)),t)}function Qa(e,a){E(2,arguments);var t=F(e),n=U(a);return t.setHours(n),t}function da(e,a){E(2,arguments);var t=F(e),n=U(a);return t.setMilliseconds(n),t}function ja(e,a){E(2,arguments);var t=F(e),n=U(a);return t.setMinutes(n),t}function Xa(e,a){E(2,arguments);var t=F(e),n=U(a);return t.setSeconds(n),t}function Nt(e,a){E(2,arguments);var t=F(e),n=U(a);return isNaN(t.getTime())?new Date(NaN):(t.setFullYear(n),t)}function jr(e,a){E(2,arguments);var t=U(a);return Aa(e,-t)}var Xr=Object.defineProperty,zr=Object.defineProperties,Kr=Object.getOwnPropertyDescriptors,ka=Object.getOwnPropertySymbols,Jr=Object.prototype.hasOwnProperty,Zr=Object.prototype.propertyIsEnumerable,Da=(e,a,t)=>a in e?Xr(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,Be=(e,a)=>{for(var t in a||(a={}))Jr.call(a,t)&&Da(e,t,a[t]);if(ka)for(var t of ka(a))Zr.call(a,t)&&Da(e,t,a[t]);return e},it=(e,a)=>zr(e,Kr(a)),ut=(e,a)=>{const t=e.__vccOpts||e;for(const[n,r]of a)t[n]=r;return t};const eo={},to={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},ao=Y("path",{d:"M29.333 8c0-2.208-1.792-4-4-4h-18.667c-2.208 0-4 1.792-4 4v18.667c0 2.208 1.792 4 4 4h18.667c2.208 0 4-1.792 4-4v-18.667zM26.667 8v18.667c0 0.736-0.597 1.333-1.333 1.333 0 0-18.667 0-18.667 0-0.736 0-1.333-0.597-1.333-1.333 0 0 0-18.667 0-18.667 0-0.736 0.597-1.333 1.333-1.333 0 0 18.667 0 18.667 0 0.736 0 1.333 0.597 1.333 1.333z"},null,-1),no=Y("path",{d:"M20 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),ro=Y("path",{d:"M9.333 2.667v5.333c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-5.333c0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),oo=Y("path",{d:"M4 14.667h24c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-24c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333z"},null,-1),lo=[ao,no,ro,oo];function io(e,a){return y(),C("svg",to,lo)}var Ct=ut(eo,[["render",io]]);const so={},uo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},co=Y("path",{d:"M23.057 7.057l-16 16c-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0l16-16c0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0z"},null,-1),mo=Y("path",{d:"M7.057 8.943l16 16c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885l-16-16c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885z"},null,-1),fo=[co,mo];function vo(e,a){return y(),C("svg",uo,fo)}var po=ut(so,[["render",vo]]);const yo={},ho={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},go=Y("path",{d:"M20.943 23.057l-7.057-7.057c0 0 7.057-7.057 7.057-7.057 0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-8 8c-0.521 0.521-0.521 1.365 0 1.885l8 8c0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),wo=[go];function bo(e,a){return y(),C("svg",ho,wo)}var Ta=ut(yo,[["render",bo]]);const _o={},ko={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Do=Y("path",{d:"M12.943 24.943l8-8c0.521-0.521 0.521-1.365 0-1.885l-8-8c-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885l7.057 7.057c0 0-7.057 7.057-7.057 7.057-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0z"},null,-1),To=[Do];function xo(e,a){return y(),C("svg",ko,To)}var xa=ut(_o,[["render",xo]]);const Co={},Mo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},So=Y("path",{d:"M16 1.333c-8.095 0-14.667 6.572-14.667 14.667s6.572 14.667 14.667 14.667c8.095 0 14.667-6.572 14.667-14.667s-6.572-14.667-14.667-14.667zM16 4c6.623 0 12 5.377 12 12s-5.377 12-12 12c-6.623 0-12-5.377-12-12s5.377-12 12-12z"},null,-1),Oo=Y("path",{d:"M14.667 8v8c0 0.505 0.285 0.967 0.737 1.193l5.333 2.667c0.658 0.329 1.46 0.062 1.789-0.596s0.062-1.46-0.596-1.789l-4.596-2.298c0 0 0-7.176 0-7.176 0-0.736-0.597-1.333-1.333-1.333s-1.333 0.597-1.333 1.333z"},null,-1),Po=[So,Oo];function No(e,a){return y(),C("svg",Mo,Po)}var $t=ut(Co,[["render",No]]);const $o={},Io={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Ao=Y("path",{d:"M24.943 19.057l-8-8c-0.521-0.521-1.365-0.521-1.885 0l-8 8c-0.52 0.52-0.52 1.365 0 1.885s1.365 0.52 1.885 0l7.057-7.057c0 0 7.057 7.057 7.057 7.057 0.52 0.52 1.365 0.52 1.885 0s0.52-1.365 0-1.885z"},null,-1),Uo=[Ao];function Yo(e,a){return y(),C("svg",Io,Uo)}var jt=ut($o,[["render",Yo]]);const Bo={},Eo={version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",class:"dp__icon"},Wo=Y("path",{d:"M7.057 12.943l8 8c0.521 0.521 1.365 0.521 1.885 0l8-8c0.52-0.52 0.52-1.365 0-1.885s-1.365-0.52-1.885 0l-7.057 7.057c0 0-7.057-7.057-7.057-7.057-0.52-0.52-1.365-0.52-1.885 0s-0.52 1.365 0 1.885z"},null,-1),Vo=[Wo];function Ho(e,a){return y(),C("svg",Eo,Vo)}var Xt=ut(Bo,[["render",Ho]]);const zt=(e,a)=>{const t=qr(e,a.slice(0,e.length),new Date);return Tt(t)&&Ua(t)?t:null},ze=e=>{let a=new Date(JSON.parse(JSON.stringify(e)));return a=Qa(a,0),a=ja(a,0),a=Xa(a,0),a=da(a,0),a},ra=e=>Array.isArray(e)?Tt(e[0])&&(e[1]?Tt(e[1]):!0):e?Tt(e):!1,he=(e,a,t,n)=>{let r=e?new Date(e):new Date;return(a||a===0)&&(r=Qa(r,+a)),(t||t===0)&&(r=ja(r,+t)),(n||n===0)&&(r=Xa(r,+n)),da(r,0)},Ro=e=>{const a=Fe(e,1);return{month:se(a),year:ue(a)}},Xe=(e,a,t)=>{let n=e?new Date(e):new Date;return(a||a===0)&&(n=xt(n,a)),t&&(n=Nt(n,t)),n},Ca=(e,a)=>e?`HH:mm${a?":ss":""}`:`hh:mm${a?":ss":""} aa`,za=(e,a,t,n,r,o,l)=>e||(n?"MM/yyyy":r?Ca(a,t):o?"MM/dd/yyyy":l?`MM/dd/yyyy, ${Ca(a,t)}`:"MM/dd/yyyy"),Kt=e=>{const a=e||new Date;return{hours:xe(a),minutes:Ce(a),seconds:Re(a)}},It=e=>({month:se(e),year:ue(e)}),Ma=e=>Array.isArray(e)?[It(e[0]),e[1]?It(e[1]):null]:It(e),oa=e=>Array.isArray(e)?[Kt(e[0]),Kt(e[1])]:Kt(e),Jt=(e,a,t)=>t?ga(e,a,{locale:t}):ga(e,a),Vt=(e,a,t,n)=>Array.isArray(e)?`${Jt(e[0],a,t)} ${n||"-"} ${e[1]?Jt(e[1],a,t):""}`:Jt(e,a,t),_e=(e,a)=>!e||!a?!1:qa(ze(e),ze(a)),ye=(e,a)=>!e||!a?!1:Ga(ze(e),ze(a)),ae=(e,a)=>!e||!a?!1:Mr(ze(e),ze(a)),Zt=(e,a)=>Ia(Ne(new Date,e),a),ea=(e,a)=>Cr(Ne(new Date,e),a),ta=e=>Ne(new Date,{hours:xe(e),minutes:Ce(e),seconds:Re(e)}),Sa=e=>Ne(new Date,{hours:+e.hours||0,minutes:+e.minutes||0,seconds:+e.seconds||0}),la=(e,a,t)=>{let n=!0;if(!e)return!0;const r=Array.isArray(e)?[e[0]?ta(e[0]):null,e[1]?ta(e[1]):null]:ta(e);if(a){const o=Sa(a);Array.isArray(r)?n=(r[0]?r[0].getTime()<=o.getTime():!0)&&(r[1]?r[1].getTime()<=o.getTime():!0):n=r.getTime()<=o.getTime()}if(t){const o=Sa(t);Array.isArray(r)?n=(r[0]?r[0].getTime()>=o.getTime():!0)&&(r[1]?r[1].getTime()>=o.getTime():!0)&&n:n=r.getTime()>=o.getTime()&&n}return n},Fo=(e,a,t)=>{let n=!0;return a&&t&&(n=_e(new Date(e),new Date(a))&&ye(new Date(e),new Date(t))),a&&(n=_e(new Date(e),new Date(a))),t&&(n=ye(new Date(e),new Date(t))),n},Te=e=>{const a=Date.UTC(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate(),e.getUTCHours(),e.getUTCMinutes(),e.getUTCSeconds());return new Date(a).toISOString()},Ka=(e,a,t)=>e&&e[0]&&e[1]?_e(t,e[0])&&ye(t,e[1]):e&&e[0]&&a?_e(t,e[0])&&ye(t,a)||ye(t,e[0])&&_e(t,a):!1,Pt=(e,a)=>{const t=sa(e,{weekStartsOn:a}),n=yn(e,{weekStartsOn:a});return[t,n]},Lo=(e,a,t)=>{const n=new Date(JSON.parse(JSON.stringify(e))),r=[];for(let o=0;o<7;o++){const l=ot(n,o),c=se(l)!==a;r.push({text:t&&c?"":l.getDate(),value:l,current:!c})}return r},qo=(e,a,t,n)=>{const r=[],o=new Date(a,e),l=new Date(a,e+1,0),c=sa(o,{weekStartsOn:t}),m=g=>{const b=Lo(g,e,n);if(r.push({days:b}),!r[r.length-1].days.some(D=>ae(ze(D.value),ze(l)))){const D=ot(g,7);m(D)}};return m(c),r},Go=(e,a=3)=>{const t=[];for(let n=0;n<e.length;n+=a)t.push([e[n],e[n+1],e[n+2]]);return t},Qo=(e,a)=>{const t=[1,2,3,4,5,6,7].map(o=>new Intl.DateTimeFormat(e,{weekday:"short",timeZone:"UTC"}).format(new Date(`2017-01-0${o}T00:00:00+00:00`)).slice(0,2)),n=t.slice(0,a),r=t.slice(a+1,t.length);return[t[a]].concat(...r).concat(...n)},jo=e=>{const a=[];for(let t=+e[0];t<=+e[1];t++)a.push({value:+t,text:`${t}`});return a},Xo=(e,a)=>{const t=new Intl.DateTimeFormat(e,{month:a,timeZone:"UTC"});return[1,2,3,4,5,6,7,8,9,10,11,12].map(n=>{const r=n<10?`0${n}`:n;return new Date(`2017-${r}-01T00:00:00+00:00`)}).map((n,r)=>({text:t.format(n),value:r}))},zo=e=>[12,1,2,3,4,5,6,7,8,9,10,11,12,1,2,3,4,5,6,7,8,9,10,11][e],Ko=()=>({enterSubmit:!0,tabSubmit:!0,openMenu:!0,rangeSeparator:" - "}),Jo=e=>Object.assign({months:[],years:[],times:{hours:[],minutes:[],seconds:[]}},e),Zo=e=>{function a(t){let n="";const r="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",o=r.length;for(let l=0;l<t;l++)n+=r.charAt(Math.floor(Math.random()*o));return n+e}return a(5)},Me=e=>{var a;const t=u(e);return(a=t==null?void 0:t.$el)!=null?a:t},el=e=>Object.assign({type:"dot"},e),Oa=e=>Object.assign({open:"dp-open",close:"dp-close",next:"calendar-next",previous:"calendar-prev"},e),tl=["aria-disabled","aria-readonly"],al={key:1,class:"dp__input_wrap"},nl=["id","name","placeholder","disabled","readonly","required","value","autocomplete","onKeydown"],rl={key:4,class:"dp__clear_icon"},ol=Le({props:{name:{type:String,default:null},inputValue:{type:String,default:""},placeholder:{type:String,default:""},hideInputIcon:{type:Boolean,default:!1},disabled:{type:Boolean,default:!0},readonly:{type:Boolean,default:!0},clearable:{type:Boolean,default:!0},range:{type:Boolean,default:!1},state:{type:Boolean,default:null},inputClassName:{type:String,default:null},inline:{type:Boolean,default:!1},inlineWithInput:{type:Boolean,default:!1},textInput:{type:Boolean,default:!1},textInputOptions:{type:Object,default:()=>null},isMenuOpen:{type:Boolean,default:!1},autoApply:{type:Boolean,default:!1},pattern:{type:String,default:""},uid:{type:String,default:null},openMenuOnFocus:{type:Boolean,default:!0},required:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"}},emits:["clear","open","update:inputValue","setInputDate","close","selectDate","setEmptyDate"],setup(e,{expose:a,emit:t}){const n=e,r=R(),o=R(null),l=R(!1),c=Ht(),m=A(()=>({dp__pointer:!n.disabled&&!n.readonly&&!n.textInput,dp__disabled:n.disabled,dp__input:!0,dp__input_icon_pad:!n.hideInputIcon,dp__input_valid:n.state,dp__input_invalid:n.state===!1,dp__input_focus:l.value||n.isMenuOpen,[n.inputClassName]:!!n.inputClassName})),g=s=>{const{value:w}=s.target,{format:T,rangeSeparator:V}=n.textInputOptions;if(w!==""){if(n.range){const[x,f]=w.split(`${V}`);if(x&&f){const _=zt(x.trim(),T||n.pattern),S=zt(f.trim(),T||n.pattern);r.value=_&&S?[_,S]:null}}else r.value=zt(w,T||n.pattern);t("setInputDate",r.value)}else t("setInputDate",null),n.autoApply&&(t("setEmptyDate"),r.value=null);t("update:inputValue",w)},b=()=>{var s,w;((s=n.textInputOptions)==null?void 0:s.enterSubmit)&&ra(r.value)&&n.inputValue!==""?(t("setInputDate",r.value,!0),r.value=null):((w=n.textInputOptions)==null?void 0:w.enterSubmit)&&n.inputValue===""&&(r.value=null,t("clear"))},D=()=>{var s,w;((s=n.textInputOptions)==null?void 0:s.tabSubmit)&&ra(r.value)&&n.inputValue!==""?(t("setInputDate",r.value,!0),r.value=null):((w=n.textInputOptions)==null?void 0:w.tabSubmit)&&n.inputValue===""&&(r.value=null,t("clear")),t("close")},$=()=>{var s;!n.inline&&(n.textInput?n.textInput&&((s=n.textInputOptions)==null?void 0:s.openMenu):!0)&&(l.value=!0,n.openMenuOnFocus&&!n.isMenuOpen?t("open"):n.isMenuOpen&&(I(),t("close")))},P=()=>{var s;(!n.openMenuOnFocus||c["dp-input"]||c.trigger)&&(n.textInput&&((s=n.textInputOptions)==null?void 0:s.openMenu)&&!n.isMenuOpen?t("open"):n.textInput||t("open"))},N=()=>{l.value=!1,n.autoApply&&n.textInput&&r.value&&(t("setInputDate",r.value),t("selectDate"),r.value=null)},M=s=>{s.stopImmediatePropagation()},d=()=>{t("clear")},I=()=>{l.value=!1;const s=Me(o);s&&s.blur()};return a({unFocus:I}),(s,w)=>(y(),C("div",{onClick:P,"aria-label":"Datepicker input",role:"textbox","aria-multiline":"false","aria-disabled":e.disabled,"aria-readonly":e.readonly},[s.$slots.trigger&&!s.$slots["dp-input"]&&!e.inline?B(s.$slots,"trigger",{key:0}):p("",!0),!s.$slots.trigger&&(!e.inline||e.inlineWithInput)?(y(),C("div",al,[s.$slots["dp-input"]&&!s.$slots.trigger&&!e.inline?B(s.$slots,"dp-input",{key:0,value:e.inputValue,onInput:g,onEnter:b,onTab:D,onClear:d}):p("",!0),s.$slots["dp-input"]?p("",!0):(y(),C("input",{key:1,ref_key:"inputRef",ref:o,id:e.uid?`dp-input-${e.uid}`:void 0,name:e.name,class:Z(u(m)),placeholder:e.placeholder,disabled:e.disabled,readonly:e.readonly,required:e.required,value:e.inputValue,autocomplete:e.autocomplete,onInput:g,onKeydown:[z(b,["enter"]),z(D,["tab"])],onBlur:N,onFocus:$},null,42,nl)),s.$slots["input-icon"]&&!e.hideInputIcon?(y(),C("span",{key:2,class:"dp__input_icon",onClick:M},[B(s.$slots,"input-icon")])):p("",!0),!s.$slots["input-icon"]&&!e.hideInputIcon&&!s.$slots["dp-input"]?(y(),Q(u(Ct),{key:3,class:"dp__input_icon dp__input_icons",onClick:M})):p("",!0),s.$slots["clear-icon"]&&e.clearable&&!e.disabled&&!e.readonly?(y(),C("span",rl,[B(s.$slots,"clear-icon",{clear:d})])):p("",!0),e.clearable&&!s.$slots["clear-icon"]&&e.inputValue&&!e.disabled&&!e.readonly?(y(),Q(u(po),{key:5,class:"dp__clear_icon dp__input_icons",onClick:na(d,["stop","prevent"])},null,8,["onClick"])):p("",!0)])):p("",!0)],8,tl))}}),Ja={weekNumbers:{type:Boolean,default:!1},weekStart:{type:[Number,String],default:1},disableMonthYearSelect:{type:Boolean,default:!1},menuClassName:{type:String,default:null},calendarClassName:{type:String,default:null},yearRange:{type:Array,default:()=>[1970,2100]},range:{type:Boolean,default:!1},multiCalendarsSolo:{type:Boolean,default:!1},calendarCellClassName:{type:String,default:null},enableTimePicker:{type:Boolean,default:!0},is24:{type:Boolean,default:!0},hoursIncrement:{type:[String,Number],default:1},minutesIncrement:{type:[String,Number],default:1},secondsIncrement:{type:[String,Number],default:1},hoursGridIncrement:{type:[String,Number],default:1},secondsGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},minDate:{type:[Date,String],default:null},maxDate:{type:[Date,String],default:null},autoApply:{type:Boolean,default:!1},selectText:{type:String,default:"Select"},cancelText:{type:String,default:"Cancel"},locale:{type:String,default:"en-US"},weekNumName:{type:String,default:"W"},disabledDates:{type:[Array,Function],default:()=>[]},minTime:{type:Object,default:null},maxTime:{type:Object,default:null},inline:{type:Boolean,default:!1},monthPicker:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1},monthNameFormat:{type:String,default:"short"},startDate:{type:[Date,String],default:null},startTime:{type:[Object,Array],default:null},monthYearComponent:{type:Object,default:null},timePickerComponent:{type:Object,default:null},actionRowComponent:{type:Object,default:null},customProps:{type:Object,default:null},hideOffsetDates:{type:Boolean,default:!1},autoRange:{type:[Number,String],default:null},noToday:{type:Boolean,default:!1},noHoursOverlay:{type:Boolean,default:!1},noMinutesOverlay:{type:Boolean,default:!1},noSecondsOverlay:{type:Boolean,default:!1},disabledWeekDays:{type:Array,default:()=>[]},allowedDates:{type:Array,default:()=>[]},showNowButton:{type:Boolean,default:!1},nowButtonLabel:{type:String,default:"Now"},monthChangeOnScroll:{type:[Boolean,String],default:!0},markers:{type:Array,default:()=>[]},uid:{type:String,default:null},modeHeight:{type:[Number,String],default:255},enableSeconds:{type:Boolean,default:!1},escClose:{type:Boolean,default:!0},spaceConfirm:{type:Boolean,default:!0},monthChangeOnArrows:{type:Boolean,default:!0},textInput:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},multiDates:{type:Boolean,default:!1},presetRanges:{type:Array,default:()=>[]},flow:{type:Array,default:()=>[]},preventMinMaxNavigation:{type:Boolean,default:!1},minRange:{type:[Number,String],default:null},maxRange:{type:[Number,String],default:null},fixedStart:{type:Boolean,default:!1},fixedEnd:{type:Boolean,default:!1},multiDatesLimit:{type:[Number,String],default:null},reverseYears:{type:Boolean,default:!1},keepActionRow:{type:Boolean,default:!1},weekPicker:{type:Boolean,default:!1}},ll=e=>{const a={};return Object.keys(e).forEach(t=>{a[t]=e[t]}),a},Za={years:{type:Array,default:()=>[]},months:{type:Array,default:()=>[]},month:{type:Number,default:0},year:{type:Number,default:0},filters:{type:Object,default:()=>({})},monthPicker:{type:Boolean,default:!1},instance:{type:Number,default:1},internalModelValue:{type:[Date,Array],default:null},range:{type:Boolean,default:!1},multiCalendars:{type:Number,default:0},multiCalendarsSolo:{type:Boolean,default:!1},customProps:{type:Object,default:null}},il={class:"db__calendar_header",role:"row"},sl={key:0,class:"dp__calendar_header_item",role:"gridcell"},ul=Y("div",{class:"dp__calendar_header_separator"},null,-1),dl={key:0,class:"dp__calendar",role:"grid","aria-label":"Calendar days"},cl={key:0,role:"gridcell",class:"dp__calendar_item dp__week_num"},ml={class:"dp__cell_inner"},fl=["aria-selected","aria-disabled","onClick","onKeydown","onMouseover"],vl=Y("div",{class:"dp__arrow_bottom_tp"},null,-1),pl=Le({props:it(Be({},Za),{locale:{type:String,default:"en-Us"},weekNumName:{type:String,default:"W"},weekStart:{type:[Number,String],default:1},weekNumbers:{type:Boolean,default:!1},mappedDates:{type:Array,default:()=>[]},monthYearComponent:{type:Object,default:null},calendarClassName:{type:String,default:null},timePicker:{type:Boolean,default:!1},disableMonthYearSelect:{type:Boolean,default:!1},getWeekNum:{type:Function,default:()=>""},modeHeight:{type:[Number,String],default:255}}),emits:["selectDate","setHoverDate","handleScroll","mount"],setup(e,{emit:a}){const t=e,n=R(null),r=R({bottom:"",left:"",transform:""}),o=R([]),l=R(!0),c=ft("transitions"),m=R(""),g=Yt(t,"month"),b=Yt(t,"year"),D=R(),$=R(!1),P=A(()=>Qo(t.locale,+t.weekStart));st(()=>{t.internalModelValue||($.value=!0),D.value=Xe(new Date,t.month,t.year),a("mount")});const N=A(()=>t.monthPicker||t.timePicker);vt([g,b],()=>{if(c!=null&&c.value){const x=Xe(new Date,t.month,t.year);m.value=_e(Xe(new Date,t.month,t.year),D.value)?c.value.next:c.value.previous,D.value=x,$.value&&(l.value=!1,ia(()=>{l.value=!0}))}$.value||($.value=!0)});const M=A(()=>({dp__calendar_wrap:!0,[t.calendarClassName]:!!t.calendarClassName})),d=A(()=>x=>{const f=el(x);return{dp__marker_dot:f.type==="dot",dp__marker_line:f.type==="line"}}),I=A(()=>x=>ae(x,n.value)),s=A(()=>({dp__calendar:!0,dp__calendar_next:t.multiCalendars>0&&t.instance!==0})),w=A(()=>N.value?{height:`${t.modeHeight}px`}:null),T=(x,f)=>{var _,S;if(a("setHoverDate",x),(S=(_=x.marker)==null?void 0:_.tooltip)!=null&&S.length){const v=Me(o.value[f]);if(v){const{width:q,height:W}=v.getBoundingClientRect();r.value={bottom:`${W}px`,left:`${q/2}px`,transform:"translateX(-50%)"},n.value=x.value}}},V=()=>{n.value=null};return(x,f)=>(y(),C("div",{class:Z(u(s))},[Y("div",{style:kt(u(w))},[u(N)?p("",!0):(y(),C("div",{key:0,class:Z(u(M)),role:"grid","aria-label":"Calendar wrapper",onWheel:f[1]||(f[1]=na(_=>x.$emit("handleScroll",_),["prevent"]))},[Y("div",il,[e.weekNumbers?(y(),C("div",sl,ce(e.weekNumName),1)):p("",!0),(y(!0),C(te,null,ve(u(P),(_,S)=>(y(),C("div",{class:"dp__calendar_header_item",role:"gridcell",key:S},[x.$slots["calendar-header"]?B(x.$slots,"calendar-header",{key:0,day:_,index:S}):p("",!0),x.$slots["calendar-header"]?p("",!0):(y(),C(te,{key:1},[We(ce(_),1)],64))]))),128))]),ul,Ee(je,{name:m.value,css:!!u(c)},{default:J(()=>[l.value?(y(),C("div",dl,[(y(!0),C(te,null,ve(e.mappedDates,(_,S)=>(y(),C("div",{class:"dp__calendar_row",role:"row",key:S},[e.weekNumbers?(y(),C("div",cl,[Y("div",ml,ce(e.getWeekNum(_.days)),1)])):p("",!0),(y(!0),C(te,null,ve(_.days,(v,q)=>(y(),C("div",{role:"gridcell",class:"dp__calendar_item",ref_for:!0,ref:W=>{W&&(o.value[q+S]=W)},key:q+S,"aria-selected":v.classData.dp__active_date||v.classData.dp__range_start||v.classData.dp__range_start,"aria-disabled":v.classData.dp__cell_disabled,tabindex:"0",onClick:W=>x.$emit("selectDate",v),onKeydown:z(W=>x.$emit("selectDate",v),["enter"]),onMouseover:W=>T(v,q+S),onMouseleave:V},[Y("div",{class:Z(["dp__cell_inner",v.classData])},[x.$slots.day?B(x.$slots,"day",{key:0,day:+v.text,date:v.value}):p("",!0),x.$slots.day?p("",!0):(y(),C(te,{key:1},[We(ce(v.text),1)],64)),v.marker?(y(),C("div",{key:2,class:Z(u(d)(v.marker)),style:kt(v.marker.color?{backgroundColor:v.marker.color}:{})},null,6)):p("",!0),u(I)(v.value)?(y(),C("div",{key:3,class:"dp__marker_tooltip",style:kt(r.value)},[Y("div",{class:"dp__tooltip_content",onClick:f[0]||(f[0]=na(()=>{},["stop"]))},[(y(!0),C(te,null,ve(v.marker.tooltip,(W,le)=>(y(),C("div",{key:le,class:"dp__tooltip_text"},[x.$slots["marker-tooltip"]?B(x.$slots,"marker-tooltip",{key:0,tooltop:W,day:v.value}):p("",!0),x.$slots["marker-tooltip"]?p("",!0):(y(),C(te,{key:1},[Y("div",{class:"dp__tooltip_mark",style:kt(W.color?{backgroundColor:W.color}:{})},null,4),Y("div",null,ce(W.text),1)],64))]))),128)),vl])],4)):p("",!0)],2)],40,fl))),128))]))),128))])):p("",!0)]),_:3},8,["name","css"])],34))],4)],2))}}),yl=e=>typeof e=="object",Pa=(e,a)=>a,hl=e=>Array.isArray(e)&&e.length===2,gl=e=>Array.isArray(e),wl=e=>typeof e=="object",Dt=e=>Array.isArray(e),Pe=e=>Array.isArray(e),At=e=>Array.isArray(e)&&e.length===2,bl=(e,a)=>a?Array.isArray(e):At(e),_l=e=>Array.isArray(e),kl=e=>typeof e=="string"||typeof e=="object",Na=e=>typeof e=="string",Dl={class:"dp__selection_preview"},Tl={class:"dp__action_buttons"},xl=["onKeydown"],Cl=Le({props:{selectText:{type:String,default:"Select"},cancelText:{type:String,default:"Cancel"},internalModelValue:{type:[Date,Array],default:null},range:{type:Boolean,default:!1},previewFormat:{type:[String,Function],default:()=>""},inline:{type:Boolean,default:!1},monthPicker:{type:Boolean,default:!1},timePicker:{type:Boolean,default:!1},multiCalendars:{type:Number,default:0},calendarWidth:{type:Number,default:0},menuMount:{type:Boolean,default:!1},customProps:{type:Object,default:null},minTime:{type:Object,default:null},maxTime:{type:Object,default:null},enableTimePicker:{type:Boolean,default:!0},minDate:{type:[Date,String],default:null},maxDate:{type:[Date,String],default:null},multiDates:{type:Boolean,default:!1}},emits:["closePicker","selectDate"],setup(e,{emit:a}){const t=e,n=ft("formatLocale"),r=A(()=>({dp__action:!0,dp__select:!0,dp__action_disabled:!o.value||!l.value})),o=A(()=>t.enableTimePicker?la(t.internalModelValue,t.maxTime,t.minTime):!0),l=A(()=>t.monthPicker?Fo(t.internalModelValue,t.minDate,t.maxDate):!0),c=b=>Vt(b,t.previewFormat,n==null?void 0:n.value),m=A(()=>!t.internalModelValue||!t.menuMount?"":typeof t.previewFormat=="string"?Dt(t.internalModelValue)?t.internalModelValue.length===2&&t.internalModelValue[1]?t.multiCalendars>0?`${c(t.internalModelValue[0])} - ${c(t.internalModelValue[1])}`:[c(t.internalModelValue[0]),c(t.internalModelValue[1])]:t.multiDates?t.internalModelValue.map(b=>`${c(b)}`):`${c(t.internalModelValue[0])} -`:Vt(t.internalModelValue,t.previewFormat,n==null?void 0:n.value):t.timePicker?t.previewFormat(oa(t.internalModelValue)):t.monthPicker?t.previewFormat(It(t.internalModelValue)):t.previewFormat(t.internalModelValue)),g=()=>{o.value&&l.value&&a("selectDate")};return(b,D)=>(y(),C("div",{class:"dp__action_row",style:kt(e.calendarWidth?{width:`${e.calendarWidth}px`}:{})},[Y("div",Dl,[b.$slots["action-preview"]?B(b.$slots,"action-preview",{key:0,value:e.internalModelValue}):p("",!0),b.$slots["action-preview"]?p("",!0):(y(),C(te,{key:1},[Array.isArray(u(m))?p("",!0):(y(),C(te,{key:0},[We(ce(u(m)),1)],64)),Array.isArray(u(m))?(y(!0),C(te,{key:1},ve(u(m),($,P)=>(y(),C("div",{key:P},ce($),1))),128)):p("",!0)],64))]),Y("div",Tl,[b.$slots["action-select"]?B(b.$slots,"action-select",{key:0,value:e.internalModelValue}):p("",!0),b.$slots["action-select"]?p("",!0):(y(),C(te,{key:1},[e.inline?p("",!0):(y(),C("span",{key:0,class:"dp__action dp__cancel",tabindex:"0",onClick:D[0]||(D[0]=$=>b.$emit("closePicker")),onKeydown:D[1]||(D[1]=z($=>b.$emit("closePicker"),["enter"]))},ce(e.cancelText),33)),Y("span",{class:Z(u(r)),tabindex:"0",onKeydown:z(g,["enter"]),onClick:g},ce(e.selectText),43,xl)],64))])],4))}}),Ml={class:"dp__overlay_container",role:"grid"},Sl={class:"dp__selection_grid_header"},Ol=["aria-selected","aria-disabled","onClick","onKeydown","onMouseover"],Pl=["onKeydown"],nt=Le({props:{items:{type:Array,default:()=>[]},modelValue:{type:[String,Number],default:null},multiModelValue:{type:Array,default:()=>[]},disabledValues:{type:Array,default:()=>[]},minValue:{type:[Number,String],default:null},maxValue:{type:[Number,String],default:null},year:{type:Number,default:0},skipActive:{type:Boolean,default:!1}},emits:["update:modelValue","selected","toggle","reset-flow"],setup(e,{emit:a}){const t=e,n=R(!1),r=R(null),o=R(null),l=ft("autoApply",!1),c=ft("textInput",R(!1)),m=R();on(()=>{r.value=null}),st(()=>{N();const s=Me(o);s&&(c.value||s.focus({preventScroll:!0}),n.value=s.clientHeight<s.scrollHeight)});const g=A(()=>({dp__overlay:!0})),b=A(()=>({dp__overlay_col:!0})),D=A(()=>t.items.map(s=>s.filter(w=>w).map(w=>{var T,V,x;const f=t.disabledValues.some(S=>S===w.value)||P(w.value),_=(T=t.multiModelValue)!=null&&T.length?(V=t.multiModelValue)==null?void 0:V.some(S=>ae(S,Nt(xt(new Date,w.value),t.year))):t.skipActive?!1:w.value===t.modelValue;return it(Be({},w),{className:{dp__overlay_cell_active:_,dp__overlay_cell:!_,dp__overlay_cell_disabled:f,dp__overlay_cell_active_disabled:f&&_,dp__overlay_cell_pad:!0,dp__cell_in_between:(x=t.multiModelValue)!=null&&x.length?d(w.value):!1}})}))),$=A(()=>({dp__button:!0,dp__overlay_action:!0,dp__over_action_scroll:n.value,dp__button_bottom:l})),P=s=>{const w=t.maxValue?+s>+t.maxValue:!1,T=t.minValue?+s<+t.minValue:!1;return w||T},N=()=>{const s=Me(r);if(s){const w=Me(o);w&&(w.scrollTop=s.offsetTop-w.offsetTop-(w.getBoundingClientRect().height/2-s.getBoundingClientRect().height))}},M=s=>{!t.disabledValues.some(w=>w===s)&&(t.minValue?+t.minValue<=s:!0)&&(t.maxValue?+t.maxValue>=s:!0)&&(a("update:modelValue",s),a("selected"))},d=s=>Ka(t.multiModelValue,Nt(xt(new Date,m.value||0),t.year),Nt(xt(new Date,s),t.year)),I=()=>{a("toggle"),a("reset-flow")};return(s,w)=>(y(),C("div",{ref_key:"gridWrapRef",ref:o,class:Z(u(g)),role:"dialog",tabindex:"0"},[Y("div",Ml,[Y("div",Sl,[B(s.$slots,"header")]),(y(!0),C(te,null,ve(u(D),(T,V)=>(y(),C("div",{class:"dp__overlay_row",key:u(Zo)(V),role:"row"},[(y(!0),C(te,null,ve(T,x=>(y(),C("div",{role:"gridcell",class:Z(u(b)),key:x.value,"aria-selected":x.value===e.modelValue&&!e.disabledValues.includes(x.value),"aria-disabled":x.className.dp__overlay_cell_disabled,ref_for:!0,ref:f=>{x.value===e.modelValue&&!e.disabledValues.includes(x.value)&&(r.value=f)},tabindex:"0",onClick:f=>M(x.value),onKeydown:z(f=>M(x.value),["enter"]),onMouseover:f=>m.value=x.value},[Y("div",{class:Z(x.className)},[s.$slots.item?B(s.$slots,"item",{key:0,item:x}):p("",!0),s.$slots.item?p("",!0):(y(),C(te,{key:1},[We(ce(x.text),1)],64))],2)],42,Ol))),128))]))),128)),s.$slots["button-icon"]?(y(),C("div",{key:0,role:"button","aria-label":"Toggle overlay",class:Z(u($)),tabindex:"0",onClick:I,onKeydown:z(I,["enter"])},[B(s.$slots,"button-icon")],42,Pl)):p("",!0)])],2))}}),ca=()=>{const e=ft("transitions");return{transitionName:A(()=>a=>e!=null&&e.value?a?e.value.open:e.value.close:""),showTransition:!!(e!=null&&e.value)}},Nl={key:0,class:"dp__time_input"},$l=["onKeydown"],Il=["onKeydown"],Al=["onKeydown"],Ul={key:2},Yl=["onKeydown"],Bl=Le({props:{hours:{type:Number,default:0},minutes:{type:Number,default:0},seconds:{type:Number,default:0},hoursGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},secondsGridIncrement:{type:[String,Number],default:5},hoursIncrement:{type:[Number,String],default:1},minutesIncrement:{type:[Number,String],default:1},secondsIncrement:{type:[Number,String],default:1},is24:{type:Boolean,default:!0},filters:{type:Object,default:()=>({})},noHoursOverlay:{type:Boolean,default:!1},noMinutesOverlay:{type:Boolean,default:!1},noSecondsOverlay:{type:Boolean,default:!1},enableSeconds:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},emits:["setHours","setMinutes","update:hours","update:minutes","update:seconds","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,r=R(!1),o=R(!1),l=R(!1),c=R("AM"),{transitionName:m,showTransition:g}=ca(),b=A(()=>({dp__time_col:!0,dp__time_col_reg:!n.enableSeconds&&n.is24,dp__time_col_reg_with_button:!n.enableSeconds&&!n.is24,dp__time_col_sec:n.enableSeconds&&n.is24,dp__time_col_sec_with_button:n.enableSeconds&&!n.is24})),D=A(()=>{const f=V(n.hours);return{text:f<10?`0${f}`:`${f}`,value:f}}),$=A(()=>({text:n.minutes<10?`0${n.minutes}`:`${n.minutes}`,value:n.minutes})),P=A(()=>({text:n.seconds<10?`0${n.seconds}`:`${n.seconds}`,value:n.seconds})),N=(f,_)=>{const S=[];for(let v=0;v<f;v+=_)S.push({value:v,text:v<10?`0${v}`:`${v}`});return Go(S)},M=(f,_)=>N(f,+_),d=()=>{n.noHoursOverlay||(r.value=!r.value)},I=()=>{n.noMinutesOverlay||(o.value=!o.value)},s=()=>{n.noSecondsOverlay||(l.value=!l.value)},w=(f,_)=>({hours:f==="hours"?xe(_?Zt({hours:+n.hours},{hours:+n.hoursIncrement}):ea({hours:+n.hours},{hours:+n.hoursIncrement})):n.hours,minutes:f==="minutes"?Ce(_?Zt({minutes:n.minutes},{minutes:+n.minutesIncrement}):ea({minutes:n.minutes},{minutes:+n.minutesIncrement})):n.minutes,seconds:f==="seconds"?Re(_?Zt({seconds:n.seconds},{seconds:+n.secondsIncrement}):ea({seconds:n.seconds},{seconds:+n.secondsIncrement})):n.seconds}),T=(f,_=!0)=>{const S=w(f,_)[f];t(_?`update:${f}`:`update:${f}`,S)},V=f=>n.is24?f:(f>=12?c.value="PM":c.value="AM",zo(f)),x=()=>{c.value==="PM"?(c.value="AM",t("update:hours",n.hours-12)):(c.value="PM",t("update:hours",n.hours+12))};return a({openChildCmp:f=>{switch(f){case"hours":r.value=!0;break;case"minutes":o.value=!0;break;case"seconds":l.value=!0}}}),(f,_)=>e.disabled?p("",!0):(y(),C("div",Nl,[Y("div",{class:Z(u(b))},[Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Increment hours",tabindex:"0",onKeydown:_[0]||(_[0]=z(S=>T("hours"),["enter"])),onClick:_[1]||(_[1]=S=>T("hours"))},[f.$slots["arrow-up"]?B(f.$slots,"arrow-up",{key:0}):p("",!0),f.$slots["arrow-up"]?p("",!0):(y(),Q(u(jt),{key:1}))],32),Y("div",{role:"button","aria-label":"Open hours overlay",class:Z(e.noHoursOverlay?"":"dp__time_display"),tabindex:"0",onKeydown:z(d,["enter"]),onClick:d},[f.$slots.hours?B(f.$slots,"hours",{key:0,text:u(D).text,value:u(D).value}):p("",!0),f.$slots.hours?p("",!0):(y(),C(te,{key:1},[We(ce(u(D).text),1)],64))],42,$l),Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Decrement hours",tabindex:"0",onKeydown:_[2]||(_[2]=z(S=>T("hours",!1),["enter"])),onClick:_[3]||(_[3]=S=>T("hours",!1))},[f.$slots["arrow-down"]?B(f.$slots,"arrow-down",{key:0}):p("",!0),f.$slots["arrow-down"]?p("",!0):(y(),Q(u(Xt),{key:1}))],32)],2),Y("div",{class:Z(u(b))},":",2),Y("div",{class:Z(u(b))},[Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Increment minutes",tabindex:"0",onKeydown:_[4]||(_[4]=z(S=>T("minutes"),["enter"])),onClick:_[5]||(_[5]=S=>T("minutes"))},[f.$slots["arrow-up"]?B(f.$slots,"arrow-up",{key:0}):p("",!0),f.$slots["arrow-up"]?p("",!0):(y(),Q(u(jt),{key:1}))],32),Y("div",{"aria-label":"Open minutes overlay",role:"button",class:Z(e.noMinutesOverlay?"":"dp__time_display"),tabindex:"0",onKeydown:z(I,["enter"]),onClick:I},[f.$slots.minutes?B(f.$slots,"minutes",{key:0,text:u($).text,value:u($).value}):p("",!0),f.$slots.minutes?p("",!0):(y(),C(te,{key:1},[We(ce(u($).text),1)],64))],42,Il),Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Decrement minutes",tabindex:"0",onKeydown:_[6]||(_[6]=z(S=>T("minutes",!1),["enter"])),onClick:_[7]||(_[7]=S=>T("minutes",!1))},[f.$slots["arrow-down"]?B(f.$slots,"arrow-down",{key:0}):p("",!0),f.$slots["arrow-down"]?p("",!0):(y(),Q(u(Xt),{key:1}))],32)],2),e.enableSeconds?(y(),C("div",{key:0,class:Z(u(b))},":",2)):p("",!0),e.enableSeconds?(y(),C("div",{key:1,class:Z(u(b))},[Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Increment seconds",tabindex:"0",onKeydown:_[8]||(_[8]=z(S=>T("seconds"),["enter"])),onClick:_[9]||(_[9]=S=>T("seconds"))},[f.$slots["arrow-up"]?B(f.$slots,"arrow-up",{key:0}):p("",!0),f.$slots["arrow-up"]?p("",!0):(y(),Q(u(jt),{key:1}))],32),Y("div",{role:"button","aria-label":"Open seconds overlay",class:Z(e.noSecondsOverlay?"":"dp__time_display"),tabindex:"0",onKeydown:z(s,["enter"]),onClick:s},[f.$slots.seconds?B(f.$slots,"hours",{key:0,text:u(P).text,value:u(P).value}):p("",!0),f.$slots.seconds?p("",!0):(y(),C(te,{key:1},[We(ce(u(P).text),1)],64))],42,Al),Y("div",{class:"dp__inc_dec_button",role:"button","aria-label":"Decrement seconds",tabindex:"0",onKeydown:_[10]||(_[10]=z(S=>T("seconds",!1),["enter"])),onClick:_[11]||(_[11]=S=>T("seconds",!1))},[f.$slots["arrow-down"]?B(f.$slots,"arrow-down",{key:0}):p("",!0),f.$slots["arrow-down"]?p("",!0):(y(),Q(u(Xt),{key:1}))],32)],2)):p("",!0),e.is24?p("",!0):(y(),C("div",Ul,[f.$slots["am-pm-button"]?B(f.$slots,"am-pm-button",{key:0,toggle:x,value:c.value}):p("",!0),f.$slots["am-pm-button"]?p("",!0):(y(),C("button",{key:1,class:"dp__pm_am_button",role:"button","aria-label":"Switch AM/PM mode",tabindex:"0",onClick:x,onKeydown:z(x,["enter"])},ce(c.value),41,Yl))])),Ee(je,{name:u(m)(r.value),css:u(g)},{default:J(()=>[r.value?(y(),Q(nt,{key:0,items:M(e.is24?24:12,e.hoursGridIncrement),"disabled-values":e.filters.times.hours,"onUpdate:modelValue":_[12]||(_[12]=S=>f.$emit("update:hours",S)),onSelected:d,onToggle:d,onResetFlow:_[13]||(_[13]=S=>f.$emit("reset-flow"))},ge({"button-icon":J(()=>[f.$slots["clock-icon"]?B(f.$slots,"clock-icon",{key:0}):p("",!0),f.$slots["clock-icon"]?p("",!0):(y(),Q(u($t),{key:1}))]),_:2},[f.$slots["hours-overlay"]?{name:"item",fn:J(({item:S})=>[B(f.$slots,"hours-overlay",{text:S.text,value:S.value})])}:void 0]),1032,["items","disabled-values"])):p("",!0)]),_:3},8,["name","css"]),Ee(je,{name:u(m)(o.value),css:u(g)},{default:J(()=>[o.value?(y(),Q(nt,{key:0,items:M(60,e.minutesGridIncrement),"disabled-values":e.filters.times.minutes,"onUpdate:modelValue":_[14]||(_[14]=S=>f.$emit("update:minutes",S)),onSelected:I,onToggle:I,onResetFlow:_[15]||(_[15]=S=>f.$emit("reset-flow"))},ge({"button-icon":J(()=>[f.$slots["clock-icon"]?B(f.$slots,"clock-icon",{key:0}):p("",!0),f.$slots["clock-icon"]?p("",!0):(y(),Q(u($t),{key:1}))]),_:2},[f.$slots["minutes-overlay"]?{name:"item",fn:J(({item:S})=>[B(f.$slots,"minutes-overlay",{text:S.text,value:S.value})])}:void 0]),1032,["items","disabled-values"])):p("",!0)]),_:3},8,["name","css"]),Ee(je,{name:u(m)(l.value),css:u(g)},{default:J(()=>[l.value?(y(),Q(nt,{key:0,items:M(60,e.secondsGridIncrement),"disabled-values":e.filters.times.seconds,"onUpdate:modelValue":_[16]||(_[16]=S=>f.$emit("update:seconds",S)),onSelected:s,onToggle:s,onResetFlow:_[17]||(_[17]=S=>f.$emit("reset-flow"))},ge({"button-icon":J(()=>[f.$slots["clock-icon"]?B(f.$slots,"clock-icon",{key:0}):p("",!0),f.$slots["clock-icon"]?p("",!0):(y(),Q(u($t),{key:1}))]),_:2},[f.$slots["seconds-overlay"]?{name:"item",fn:J(({item:S})=>[B(f.$slots,"seconds-overlay",{text:S.text,value:S.value})])}:void 0]),1032,["items","disabled-values"])):p("",!0)]),_:3},8,["name","css"])]))}}),_t=[{name:"clock-icon",use:["time","calendar"]},{name:"arrow-left",use:["month-year","calendar"]},{name:"arrow-right",use:["month-year","calendar"]},{name:"arrow-up",use:["time","calendar"]},{name:"arrow-down",use:["time","calendar"]},{name:"calendar-icon",use:["month-year","time","calendar"]},{name:"day",use:["calendar"]},{name:"month-overlay",use:["calendar","month-year"]},{name:"year-overlay",use:["calendar","month-year"]},{name:"hours-overlay",use:["calendar","time"]},{name:"minutes-overlay",use:["calendar","time"]},{name:"seconds-overlay",use:["calendar","time"]},{name:"hours",use:["calendar","time"]},{name:"minutes",use:["calendar","time"]},{name:"month",use:["calendar","month-year"]},{name:"year",use:["calendar","month-year"]},{name:"action-select",use:["action"]},{name:"action-preview",use:["action"]},{name:"calendar-header",use:["calendar"]},{name:"marker-tooltip",use:["calendar"]},{name:"now-button",use:[]},{name:"time-picker-overlay",use:["calendar","time"]},{name:"am-pm-button",use:["calendar","time"]}],El=[{name:"trigger"},{name:"input-icon"},{name:"clear-icon"},{name:"dp-input"}],Wl={all:()=>_t,monthYear:()=>_t.filter(e=>e.use.includes("month-year")),input:()=>El,timePicker:()=>_t.filter(e=>e.use.includes("time")),action:()=>_t.filter(e=>e.use.includes("action")),calendar:()=>_t.filter(e=>e.use.includes("calendar"))},rt=(e,a)=>{const t=[];return Wl[a]().forEach(n=>{e[n.name]&&t.push(n.name)}),t},Vl={key:0,class:"dp__overlay"},Hl={class:"dp__overlay_container"},Rl={key:1,class:"dp__overlay_row"},Fl=Le({props:{hoursIncrement:{type:[Number,String],default:1},minutesIncrement:{type:[Number,String],default:1},secondsIncrement:{type:[Number,String],default:1},is24:{type:Boolean,default:!0},hoursGridIncrement:{type:[String,Number],default:1},minutesGridIncrement:{type:[String,Number],default:5},secondsGridIncrement:{type:[String,Number],default:5},range:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})},timePicker:{type:Boolean,default:!1},hours:{type:[Number,Array],default:0},minutes:{type:[Number,Array],default:0},seconds:{type:[Number,Array],default:0},noHoursOverlay:{type:Boolean,default:!1},noMinutesOverlay:{type:Boolean,default:!1},noSecondsOverlay:{type:Boolean,default:!1},customProps:{type:Object,default:null},enableSeconds:{type:Boolean,default:!1},fixedStart:{type:Boolean,default:!1},fixedEnd:{type:Boolean,default:!1}},emits:["update:hours","update:minutes","update:seconds","mount","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,r=Ht(),o=ft("autoApply",!1),l=R(null),{transitionName:c,showTransition:m}=ca();st(()=>{t("mount")});const g=R(!1),b=T=>({hours:Array.isArray(n.hours)?n.hours[T]:n.hours,minutes:Array.isArray(n.minutes)?n.minutes[T]:n.minutes,seconds:Array.isArray(n.seconds)?n.seconds[T]:n.seconds}),D=A(()=>{const T=[];if(n.range)for(let V=0;V<2;V++)T.push(b(V));else T.push(b(0));return T}),$=(T,V=!1,x="")=>{V||t("reset-flow"),g.value=T,ia(()=>{x!==""&&l.value&&l.value.openChildCmp(x)})},P=A(()=>({dp__button:!0,dp__button_bottom:o})),N=rt(r,"timePicker"),M=A(()=>({is24:n.is24,hoursGridIncrement:n.hoursGridIncrement,minutesGridIncrement:n.minutesGridIncrement,secondsGridIncrement:n.secondsGridIncrement,hoursIncrement:n.hoursIncrement,minutesIncrement:n.minutesIncrement,secondsIncrement:n.secondsIncrement,filters:n.filters,noHoursOverlay:n.noHoursOverlay,noMinutesOverlay:n.noMinutesOverlay,noSecondsOverlay:n.noSecondsOverlay,enableSeconds:n.enableSeconds})),d=(T,V,x)=>n.range?V===0?[T,D.value[1][x]]:[D.value[0][x],T]:T,I=T=>{t("update:hours",T)},s=T=>{t("update:minutes",T)},w=T=>{t("update:seconds",T)};return a({toggleTimePicker:$}),(T,V)=>(y(),C("div",null,[e.timePicker?p("",!0):(y(),C("div",{key:0,class:Z(u(P)),role:"button","aria-label":"Open time picker",tabindex:"0",onKeydown:V[0]||(V[0]=z(x=>$(!0),["enter"])),onClick:V[1]||(V[1]=x=>$(!0))},[T.$slots["clock-icon"]?B(T.$slots,"clock-icon",{key:0}):p("",!0),T.$slots["clock-icon"]?p("",!0):(y(),Q(u($t),{key:1}))],34)),Ee(je,{name:u(c)(g.value),css:u(m)},{default:J(()=>[g.value||e.timePicker?(y(),C("div",Vl,[Y("div",Hl,[T.$slots["time-picker-overlay"]?B(T.$slots,"time-picker-overlay",{key:0,range:e.range,hours:e.hours,minutes:e.minutes,seconds:e.seconds,setHours:I,setMinutes:s,setSeconds:w}):p("",!0),T.$slots["time-picker-overlay"]?p("",!0):(y(),C("div",Rl,[(y(!0),C(te,null,ve(u(D),(x,f)=>(y(),Q(Bl,$e({key:f,disabled:f===0?e.fixedStart:e.fixedEnd,hours:x.hours,minutes:x.minutes,seconds:x.seconds},u(M),{"onUpdate:hours":_=>I(d(_,f,"hours")),"onUpdate:minutes":_=>s(d(_,f,"minutes")),"onUpdate:seconds":_=>w(d(_,f,"seconds"))}),ge({_:2},[ve(u(N),(_,S)=>({name:_,fn:J(v=>[B(T.$slots,_,tt(at(v)))])}))]),1040,["disabled","hours","minutes","seconds","onUpdate:hours","onUpdate:minutes","onUpdate:seconds"]))),128))])),e.timePicker?p("",!0):(y(),C("div",{key:2,class:Z(u(P)),role:"button","aria-label":"Close time picker",tabindex:"0",onKeydown:V[2]||(V[2]=z(x=>$(!1),["enter"])),onClick:V[3]||(V[3]=x=>$(!1))},[T.$slots["calendar-icon"]?B(T.$slots,"calendar-icon",{key:0}):p("",!0),T.$slots["calendar-icon"]?p("",!0):(y(),Q(u(Ct),{key:1}))],34))])])):p("",!0)]),_:3},8,["name","css"])]))}}),Ll=(e,a)=>{const t=(m,g)=>{let b=m;return e.filters.months.includes(se(b))?(b=g?Fe(m,1):Mt(m,1),t(b,g)):b},n=(m,g)=>{let b=m;return e.filters.years.includes(ue(b))?(b=g?Aa(m,1):jr(m,1),n(b,g)):b},r=(m,g,b)=>[new Date(e[m]),Ne(new Date,{month:g,year:b})],o=(m,g)=>{e.preventMinMaxNavigation&&(e.minDate||e.maxDate)?(e.maxDate&&(_e(...r("maxDate",m,g))||ae(...r("maxDate",m,g)))&&c(m,g),(e.minDate&&ye(...r("minDate",m,g))||ae(...r("minDate",m,g)))&&c(m,g)):c(m,g)},l=m=>{const g=Ne(new Date,{month:e.month,year:e.year});let b=m?Fe(g,1):Mt(g,1),D=se(b),$=ue(b);e.filters.months.includes(D)&&(b=t(b,m),D=se(b),$=ue(b)),e.filters.years.includes($)&&(b=n(b,m),$=ue(b)),o(D,$)},c=(m,g)=>{a("update:month",m),a("update:year",g)};return{handleMonthYearChange:l}},ql={class:"dp__month_year_row"},Gl={class:"dp__inner_nav",role:"button","aria-label":"Previous month"},Ql=["onKeydown"],jl=["onKeydown"],Xl={class:"dp__inner_nav",role:"button","aria-label":"Next month"},zl={class:"dp__month_picker_header"},Kl={class:"dp__inner_nav",role:"button","aria-label":"Previous month"},Jl=["onKeydown"],Zl={class:"dp__inner_nav",role:"button","aria-label":"Next month"},ei=Le({props:it(Be({},Za),{minDate:{type:[Date,String],default:null},maxDate:{type:[Date,String],default:null},preventMinMaxNavigation:{type:Boolean,default:!1},reverseYears:{type:Boolean,default:!1}}),emits:["update:month","update:year","monthYearSelect","mount","reset-flow"],setup(e,{expose:a,emit:t}){const n=e,{transitionName:r,showTransition:o}=ca(),l=R(!1),c=R(!1),{handleMonthYearChange:m}=Ll(n,t);st(()=>{t("mount")});const g=v=>{t("update:month",v),t("monthYearSelect"),x(!0)},b=v=>{t("update:year",v),t("monthYearSelect",!0),f(!0)},D=A(()=>n.minDate?ue(new Date(n.minDate)):null),$=A(()=>n.maxDate?ue(new Date(n.maxDate)):null),P=A(()=>{if(n.minDate&&D.value){if(D.value>n.year)return 12;if(D.value===n.year)return se(new Date(n.minDate))}return null}),N=A(()=>{if(n.maxDate&&$.value){if($.value<n.year)return-1;if($.value===n.year)return se(new Date(n.maxDate))}return null}),M=A(()=>n.range&&n.internalModelValue&&n.monthPicker?n.internalModelValue:[]),d=(v,q=!1)=>{const W=[];for(let le=0;le<v.length;le+=3){const Se=[v[le],v[le+1],v[le+2]];W.push(q?Se.reverse():Se)}return q?W.reverse():W},I=A(()=>n.months.find(q=>q.value===n.month)||{text:"",value:0}),s=A(()=>d(n.months)),w=A(()=>d(n.years,n.reverseYears)),T=A(()=>n.multiCalendars?n.multiCalendarsSolo?!0:n.instance===0:!0),V=A(()=>n.multiCalendars?n.multiCalendarsSolo?!0:n.instance===n.multiCalendars-1:!0),x=(v=!1)=>{_(v),l.value=!l.value},f=(v=!1)=>{_(v),c.value=!c.value},_=v=>{v||t("reset-flow")},S=(v=!1)=>{t("update:year",v?n.year+1:n.year-1)};return a({toggleMonthPicker:x,toggleYearPicker:f}),(v,q)=>(y(),C("div",ql,[v.monthPicker?p("",!0):(y(),C(te,{key:0},[u(T)?(y(),C("div",{key:0,class:"dp__month_year_col_nav",onClick:q[0]||(q[0]=W=>u(m)(!1)),onKeydown:q[1]||(q[1]=z(W=>u(m)(!1),["enter"])),tabindex:"0"},[Y("div",Gl,[v.$slots["arrow-left"]?B(v.$slots,"arrow-left",{key:0}):p("",!0),v.$slots["arrow-left"]?p("",!0):(y(),Q(u(Ta),{key:1}))])],32)):p("",!0),Y("div",{class:"dp__month_year_select",onClick:x,onKeydown:z(x,["enter"]),role:"button","aria-label":"Open months overlay",tabindex:"0"},[v.$slots.month?B(v.$slots,"month",{key:0,value:u(I).value,text:u(I).text}):p("",!0),v.$slots.month?p("",!0):(y(),C(te,{key:1},[We(ce(u(I).text),1)],64))],40,Ql),Y("div",{class:"dp__month_year_select",onClick:f,onKeydown:z(f,["enter"]),role:"button","aria-label":"Open years overlay",tabindex:"0"},[v.$slots.year?B(v.$slots,"year",{key:0,year:v.year}):p("",!0),v.$slots.year?p("",!0):(y(),C(te,{key:1},[We(ce(v.year),1)],64))],40,jl),Ee(je,{name:u(r)(l.value),css:u(o)},{default:J(()=>[l.value?(y(),Q(nt,$e({key:0},{modelValue:v.month,items:u(s),disabledValues:v.filters.months,minValue:u(P),maxValue:u(N)},{"onUpdate:modelValue":g,onToggle:x}),ge({"button-icon":J(()=>[v.$slots["calendar-icon"]?B(v.$slots,"calendar-icon",{key:0}):p("",!0),v.$slots["calendar-icon"]?p("",!0):(y(),Q(u(Ct),{key:1}))]),_:2},[v.$slots["month-overlay"]?{name:"item",fn:J(({item:W})=>[B(v.$slots,"month-overlay",{text:W.text,value:W.value})])}:void 0]),1040)):p("",!0)]),_:3},8,["name","css"]),Ee(je,{name:u(r)(c.value),css:u(o)},{default:J(()=>[c.value?(y(),Q(nt,$e({key:0},{modelValue:v.year,items:u(w),disabledValues:v.filters.years,minValue:u(D),maxValue:u($)},{"onUpdate:modelValue":b,onToggle:f}),ge({"button-icon":J(()=>[v.$slots["calendar-icon"]?B(v.$slots,"calendar-icon",{key:0}):p("",!0),v.$slots["calendar-icon"]?p("",!0):(y(),Q(u(Ct),{key:1}))]),_:2},[v.$slots["year-overlay"]?{name:"item",fn:J(({item:W})=>[B(v.$slots,"year-overlay",{text:W.text,value:W.value})])}:void 0]),1040)):p("",!0)]),_:3},8,["name","css"]),u(V)?(y(),C("div",{key:1,class:"dp__month_year_col_nav",onClick:q[2]||(q[2]=W=>u(m)(!0)),onKeydown:q[3]||(q[3]=z(W=>u(m)(!0),["enter"])),tabindex:"0"},[Y("div",Xl,[v.$slots["arrow-right"]?B(v.$slots,"arrow-right",{key:0}):p("",!0),v.$slots["arrow-right"]?p("",!0):(y(),Q(u(xa),{key:1}))])],32)):p("",!0)],64)),v.monthPicker?(y(),Q(nt,$e({key:1},{modelValue:v.month,items:u(s),disabledValues:v.filters.months,minValue:u(P),maxValue:u(N),multiModelValue:u(M),year:v.year,skipActive:n.range},{"onUpdate:modelValue":g,onToggle:x}),ge({header:J(()=>[Y("div",zl,[Y("div",{class:"dp__month_year_col_nav",tabindex:"0",onClick:q[4]||(q[4]=W=>S(!1)),onKeydown:q[5]||(q[5]=z(W=>S(!1),["enter"]))},[Y("div",Kl,[v.$slots["arrow-left"]?B(v.$slots,"arrow-left",{key:0}):p("",!0),v.$slots["arrow-left"]?p("",!0):(y(),Q(u(Ta),{key:1}))])],32),Y("div",{class:"dp__pointer",role:"button","aria-label":"Open years overlay",tabindex:"0",onClick:f,onKeydown:z(f,["enter"])},[v.$slots.year?B(v.$slots,"year",{key:0,year:v.year}):p("",!0),v.$slots.year?p("",!0):(y(),C(te,{key:1},[We(ce(v.year),1)],64))],40,Jl),Y("div",{class:"dp__month_year_col_nav",tabindex:"0",onClick:q[6]||(q[6]=W=>S(!0)),onKeydown:q[7]||(q[7]=z(W=>S(!0),["enter"]))},[Y("div",Zl,[v.$slots["arrow-right"]?B(v.$slots,"arrow-right",{key:0}):p("",!0),v.$slots["arrow-right"]?p("",!0):(y(),Q(u(xa),{key:1}))])],32)]),Ee(je,{name:u(r)(c.value),css:u(o)},{default:J(()=>[c.value?(y(),Q(nt,$e({key:0},{modelValue:v.year,items:u(w),disabledValues:v.filters.years,minValue:u(D),maxValue:u($)},{"onUpdate:modelValue":b,onToggle:f}),ge({"button-icon":J(()=>[v.$slots["calendar-icon"]?B(v.$slots,"calendar-icon",{key:0}):p("",!0),v.$slots["calendar-icon"]?p("",!0):(y(),Q(u(Ct),{key:1}))]),_:2},[v.$slots["year-overlay"]?{name:"item",fn:J(({item:W})=>[B(v.$slots,"year-overlay",{text:W.text,value:W.value})])}:void 0]),1040)):p("",!0)]),_:3},8,["name","css"])]),_:2},[v.$slots["month-overlay"]?{name:"item",fn:J(({item:W})=>[B(v.$slots,"month-overlay",{text:W.text,value:W.value})])}:void 0]),1040)):p("",!0)]))}}),ti=(e,a,t)=>{const n=R(new Date),r=R(),o=R([{month:se(new Date),year:ue(new Date)}]),l=R(e.range?[xe(new Date),xe(new Date)]:xe(new Date)),c=R(e.range?[Ce(new Date),Ce(new Date)]:Ce(new Date)),m=R(e.range?[0,0]:0);vt(o,()=>{setTimeout(()=>{e.openOnTop&&a("dpOpen")},0)},{deep:!0}),st(()=>{_(),d.value||(e.startDate&&(o.value[0].month=se(new Date(e.startDate)),o.value[0].year=ue(new Date(e.startDate)),e.multiCalendars&&Ie(0)),e.startTime&&M())});const g=A(()=>i=>o.value[i]?o.value[i].month:0),b=A(()=>i=>o.value[i]?o.value[i].year:0),D=(i,k,O)=>{o.value[i].month=k,o.value[i].year=O},$=(i,k)=>o.value[i].month=k,P=(i,k)=>o.value[i].year=k,N=(i=!0)=>e.enableSeconds?Array.isArray(m.value)?i?m.value[0]:m.value[1]:m.value:0,M=()=>{e.startTime&&(_l(e.startTime)?(l.value=[+e.startTime[0].hours,+e.startTime[1].hours],c.value=[+e.startTime[0].minutes,+e.startTime[1].minutes],e.enableSeconds&&(m.value=[+e.startTime[0].seconds,+e.startTime[1].seconds])):(l.value=+e.startTime.hours,c.value=+e.startTime.minutes,e.enableSeconds&&(m.value=+e.startTime.seconds)))},d=A({get:()=>e.internalModelValue,set:i=>{!e.readonly&&!e.disabled&&a("update:internalModelValue",i)}});vt(d,()=>_());const I=i=>{const k=e.maxDate?_e(Te(i),Te(new Date(e.maxDate))):!1,O=e.minDate?ye(Te(i),Te(new Date(e.minDate))):!1,j=typeof e.disabledDates=="function"?e.disabledDates(i):e.disabledDates.some(He=>ae(Te(new Date(He)),Te(i))),De=(e.filters.months.length?e.filters.months.map(He=>+He):[]).includes(se(i)),Je=e.disabledWeekDays.length?e.disabledWeekDays.some(He=>+He===_r(i)):!1,Ve=e.allowedDates.length?!e.allowedDates.some(He=>ae(Te(new Date(He)),Te(i))):!1,Ze=ue(i),Ae=Ze<+e.yearRange[0]||Ze>+e.yearRange[1];return k||O||j||De||Ae||Je||Ve},s=i=>!d.value||e.hideOffsetDates&&!i.current||e.range?!1:e.multiDates&&Array.isArray(d.value)?d.value.some(k=>ae(k,i.value)):ae(i.value,d.value?d.value:n.value),w=i=>Ka(d.value,r.value,i.value),T=i=>{if($(0,se(i)),P(0,ue(i)),e.multiCalendars)for(let k=1;k<e.multiCalendars;k++){const O=Ne(new Date,{month:g.value(k-1),year:b.value(k-1)}),j=Ia(O,{months:1});o.value.push({month:se(j),year:ue(j)})}},V=()=>{if(Array.isArray(d.value)&&d.value.length===2){const i=new Date(d.value[1]?d.value[1]:Fe(d.value[0],1)),[k,O]=[se(d.value[0]),ue(d.value[0])],[j,De]=[se(d.value[1]),ue(d.value[1])];(k!==j||k===j&&O!==De)&&e.multiCalendarsSolo&&($(1,se(i)),P(1,ue(i)))}},x=i=>{T(i),l.value=xe(i),c.value=Ce(i),m.value=Re(i)},f=()=>Array.isArray(d.value)&&d.value.length?d.value[d.value.length-1]:null,_=()=>{if(d.value)if(Dt(d.value)){if(d.value.length===2&&!e.multiDates)T(d.value[0]),l.value=[xe(d.value[0]),d.value[1]?xe(d.value[1]):xe(new Date)],c.value=[Ce(d.value[0]),d.value[1]?Ce(d.value[1]):Ce(new Date)],m.value=[Re(d.value[0]),d.value[1]?Re(d.value[1]):Re(new Date)];else if(Dt(d.value)&&e.multiDates){const i=d.value[d.value.length-1];i&&x(i)}e.multiCalendars&&e.multiCalendarsSolo&&V()}else x(d.value);else e.timePicker?(M(),e.range?Pe(l.value)&&Pe(c.value)&&(d.value=[he(new Date,l.value[0],c.value[0],N()),he(new Date,l.value[1],c.value[1],N(!1))]):d.value=he(new Date,l.value,c.value,N())):e.monthPicker&&!e.range?d.value=Xe(new Date,g.value(0),b.value(0)):e.multiCalendars&&T(new Date)},S=i=>{const k=se(new Date(i)),O=ue(new Date(i));if($(0,k),P(0,O),e.multiCalendars>0)for(let j=1;j<e.multiCalendars;j++){const De=Ro(Ne(new Date(i),{year:g.value(j-1),month:b.value(j-1)}));$(j,De.month),P(j,De.year)}},v=i=>{if(d.value&&Array.isArray(d.value))if(d.value.some(k=>ae(i,k))){const k=d.value.filter(O=>!ae(O,i));d.value=k.length?k:null}else(e.multiDatesLimit&&+e.multiDatesLimit>d.value.length||!e.multiDatesLimit)&&d.value.push(i);else d.value=[i]},q=i=>{if(Array.isArray(d.value)&&d.value[0]){const k=pn(i,d.value[0]),O=Math.abs(k<0?k+1:k-1);if(e.minRange&&e.maxRange)return O>=+e.minRange&&O<=+e.maxRange;if(e.minRange)return O>=+e.minRange;if(e.maxRange)return O<=+e.maxRange}return!0},W=i=>Array.isArray(d.value)&&d.value.length===2?e.fixedStart&&(_e(i,d.value[0])||ae(i,d.value[0]))?[d.value[0],i]:e.fixedEnd&&(ye(i,d.value[1])||ae(i,d.value[1]))?[i,d.value[1]]:d.value:[],le=()=>{e.autoApply&&a("autoApply")},Se=(i,k=!1)=>{if(!I(i.value)&&!(!i.current&&e.hideOffsetDates)){if(e.weekPicker)return d.value=Pt(new Date(i.value),+e.weekStart),le();if(!e.range&&!Pe(l.value)&&!Pe(c.value)){const O=he(new Date(i.value),l.value,c.value,N());e.multiDates?v(O):d.value=O,t(),le()}else if(Pe(l.value)&&Pe(c.value)&&!e.multiDates){let O=d.value?d.value.slice():[];O.length===2&&!(e.fixedStart||e.fixedEnd)&&(O=[]),e.autoRange?(k&&S(i.value),O=[new Date(i.value),ot(new Date(i.value),+e.autoRange)]):e.fixedStart||e.fixedEnd?O=W(new Date(i.value)):O[0]?q(new Date(i.value))&&(ye(new Date(i.value),new Date(O[0]))?O.unshift(new Date(i.value)):O[1]=new Date(i.value)):O[0]=new Date(i.value),O[0]&&!O[1]?O[0]=he(O[0],l.value[0],c.value[0],N()):(O[0]=he(O[0],l.value[0],c.value[0],N()),O[1]=he(O[1],l.value[1],c.value[1],N(!1)),t()),d.value=O,O[0]&&O[1]&&e.autoApply&&a("autoApply")}}},ke=i=>{const k=i.find(O=>O.current);return k?Tr(k.value):""},pe=i=>{!i.current&&e.hideOffsetDates||(r.value=i.value)},ie=i=>{if(e.autoRange||e.weekPicker){if(r.value){if(e.hideOffsetDates&&!i.current)return!1;const k=ot(r.value,+e.autoRange),O=Pt(new Date(r.value),+e.weekStart);return e.weekPicker?ae(O[1],new Date(i.value)):ae(k,new Date(i.value))}return!1}return!1},me=i=>{if(e.autoRange||e.weekPicker){if(r.value){const k=ot(r.value,+e.autoRange);if(e.hideOffsetDates&&!i.current)return!1;const O=Pt(new Date(r.value),+e.weekStart);return e.weekPicker?_e(i.value,O[0])&&ye(i.value,O[1]):_e(i.value,r.value)&&ye(i.value,k)}return!1}return!1},we=i=>{if(e.autoRange||e.weekPicker){if(r.value){if(e.hideOffsetDates&&!i.current)return!1;const k=Pt(new Date(r.value),+e.weekStart);return e.weekPicker?ae(k[0],i.value):ae(r.value,i.value)}return!1}return!1},Ie=i=>{for(let k=i-1;k>=0;k--){const O=Mt(Ne(new Date,{month:g.value(k+1),year:b.value(k+1)}),1);D(k,se(O),ue(O))}for(let k=i+1;k<=e.multiCalendars-1;k++){const O=Fe(Ne(new Date,{month:g.value(k-1),year:b.value(k-1)}),1);D(k,se(O),ue(O))}},Oe=i=>Xe(new Date,g.value(i),b.value(i)),qe=(i,k,O=!0)=>{if(O?$(i,k):P(i,k),e.multiCalendars&&!e.multiCalendarsSolo&&Ie(i),e.monthPicker)if(e.range){if(O){let j=d.value?d.value.slice():[];j.length===2&&(j=[]),j.length?ye(Oe(i),j[0])?j.unshift(Oe(i)):j.push(Oe(i)):j=[Oe(i)],d.value=j}}else d.value=Oe(i);t(),a("updateMonthYear",{instance:i,value:k,isMonth:O})},be=i=>he(i,l.value,c.value,N()),Ke=i=>{Dt(i)&&Dt(d.value)&&Pe(l.value)&&Pe(c.value)?(i[0]&&d.value[0]&&(d.value[0]=he(i[0],l.value[0],c.value[0],N())),i[1]&&d.value[1]&&(d.value[1]=he(i[1],l.value[1],c.value[1],N(!1)))):e.multiDates&&Array.isArray(d.value)?d.value[d.value.length-1]=be(i):!e.range&&!At(i)&&(d.value=be(i)),a("timeUpdate")},yt=(i,k=!0,O=!1)=>{const j=k?i:l.value,De=!k&&!O?i:c.value,Je=O?i:m.value;if(e.range&&At(d.value)&&Pe(j)&&Pe(De)&&Pe(Je)){const Ve=Ae=>he(d.value[Ae],j[Ae],De[Ae],Je[Ae]),Ze=Ae=>da(d.value[Ae],0);if(ae(d.value[0],d.value[1])&&(qa(Ve(0),Ze(1))||Ga(Ve(1),Ze(0))))return}if(l.value=j,c.value=De,m.value=Je,d.value)if(e.multiDates){const Ve=f();Ve&&Ke(Ve)}else Ke(d.value);else e.timePicker&&Ke(e.range?[new Date,new Date]:new Date);t()},ht=()=>{r.value=null},ee=i=>Pa(d.value,e.range)&&d.value[0]&&r.value?i?_e(r.value,d.value[0]):ye(r.value,d.value[0]):!0,fe=(i,k=!0)=>(e.range||e.weekPicker)&&At(d.value)?e.hideOffsetDates&&!i.current?!1:ae(new Date(i.value),d.value[k?0:1]):e.range?ae(new Date(i.value),d.value&&Array.isArray(d.value)?k?d.value[0]||null:d.value[1]:null)&&(k?!ye(r.value||null,Array.isArray(d.value)?d.value[0]:null):!0)||ae(i.value,Array.isArray(d.value)?d.value[0]:null)&&ee(k):!1,de=(i,k)=>Array.isArray(e.internalModelValue)&&e.internalModelValue.length||e.weekPicker?!1:!i&&!s(k)&&!(!k.current&&e.hideOffsetDates)&&(e.range?!fe(k)&&!fe(k,!1):!0),dt=(i,k,O)=>Array.isArray(e.internalModelValue)&&e.internalModelValue[0]&&e.internalModelValue.length===1?i?!1:O?_e(e.internalModelValue[0],k.value):ye(e.internalModelValue[0],k.value):!1,Ge=(i=!1)=>{e.autoApply&&e.monthPicker&&a("autoApply",i)},ct=(i,k)=>{const O=Ne(new Date,{month:g.value(k),year:b.value(k)}),j=i<0?Fe(O,1):Mt(O,1);D(k,se(j),ue(j)),e.multiCalendars&&!e.multiCalendarsSolo&&Ie(k)};return{today:n,hours:l,minutes:c,seconds:m,month:g,year:b,monthYearSelect:Ge,isDisabled:I,updateTime:yt,setHoverDate:pe,getWeekNum:ke,selectDate:Se,rangeActive:w,isActiveDate:s,updateMonthYear:qe,isHoverRangeEnd:ie,isAutoRangeInBetween:me,isAutoRangeStart:we,clearHoverDate:ht,rangeActiveStartEnd:fe,handleScroll:(i,k)=>{e.monthChangeOnScroll&&ct(e.monthChangeOnScroll==="inverse"?-i.deltaY:i.deltaY,k)},getMarker:i=>e.markers.find(k=>ae(Te(new Date(i.value)),Te(new Date(k.date)))),handleArrow:(i,k)=>{e.monthChangeOnArrows&&ct(i==="right"?-1:1,k)},selectCurrentDate:()=>{e.range?Pa(d.value,e.range)&&(d.value&&d.value[0]?d.value=ye(new Date,d.value[0])?[new Date,d.value[0]]:[d.value[0],new Date]:d.value=[new Date]):a("update:internalModelValue",new Date),e.autoApply&&a("selectDate")},isHoverDate:de,isHoverDateStartEnd:dt,presetDateRange:i=>{i.length&&i.length<=2&&e.range&&(d.value=i.map(k=>new Date(k)),e.autoApply&&a("selectDate"))}}},ai=["id","onKeydown"],ni={key:0,class:"dp__preset_ranges"},ri=["onClick"],oi={key:1,class:"dp__now_wrap"},li=Le({props:it(Be({},Ja),{internalModelValue:{type:[Date,Array],default:null},multiCalendars:{type:Number,default:0},previewFormat:{type:[String,Function],default:()=>null},filters:{type:Object,default:()=>({})},openOnTop:{type:Boolean,default:!1}}),emits:["update:internalModelValue","closePicker","selectDate","dpOpen","autoApply","timeUpdate","flow-step","updateMonthYear"],setup(e,{emit:a}){const t=e,n=Ht(),r=R(null),o=ln({timePicker:!t.enableTimePicker,monthYearInput:!1,calendar:!1}),l=R([]),c=R(null),m=R(null),g=R(0),b=R(!1),D=R(0);st(()=>{var h;b.value=!0,(h=t.presetRanges)!=null&&h.length||ct(),t.inline||ia(()=>a("dpOpen"));const L=Me(m);if(L&&!t.textInput&&!t.inline&&L.focus({preventScroll:!0}),L){const H=G=>{G.stopImmediatePropagation(),G.stopPropagation()};L.addEventListener("pointerdown",H),L.addEventListener("mousedown",H)}document.addEventListener("resize",ct)}),$a(()=>{document.removeEventListener("resize",ct)});const $=()=>{var h;((h=t.flow)==null?void 0:h.length)&&D.value!==-1&&(D.value+=1,a("flow-step",D.value),ma())},P=()=>{D.value=-1},{updateTime:N,updateMonthYear:M,today:d,month:I,year:s,hours:w,minutes:T,seconds:V,isDisabled:x,isActiveDate:f,selectDate:_,getWeekNum:S,setHoverDate:v,isHoverRangeEnd:q,isAutoRangeInBetween:W,isAutoRangeStart:le,rangeActive:Se,clearHoverDate:ke,rangeActiveStartEnd:pe,monthYearSelect:ie,handleScroll:me,handleArrow:we,getMarker:Ie,selectCurrentDate:Oe,isHoverDateStartEnd:qe,isHoverDate:be,presetDateRange:Ke}=ti(t,a,$),yt=rt(n,"calendar"),ht=rt(n,"action"),ee=rt(n,"timePicker"),fe=rt(n,"monthYear"),de=A(()=>t.openOnTop?"dp__arrow_bottom":"dp__arrow_top"),dt=A(()=>jo(t.yearRange)),Ge=A(()=>Xo(t.locale,t.monthNameFormat)),ct=()=>{const h=Me(r);h&&(g.value=h.getBoundingClientRect().width)},i=A(()=>h=>qo(I.value(h),s.value(h),+t.weekStart,t.hideOffsetDates)),k=A(()=>t.multiCalendars>0&&t.range?[...Array(t.multiCalendars).keys()]:[0]),O=A(()=>h=>h===1),j=A(()=>t.monthPicker||t.timePicker),De=A(()=>({dp__flex_display:t.multiCalendars>0})),Je=A(()=>({dp__instance_calendar:t.multiCalendars>0})),Ve=A(()=>({dp__menu_disabled:t.disabled,dp__menu_readonly:t.readonly})),Ze=A(()=>h=>tn(i,h)),Ae=A(()=>({locale:t.locale,weekNumName:t.weekNumName,weekStart:t.weekStart,weekNumbers:t.weekNumbers,enableTimePicker:t.enableTimePicker,disableMonthYearSelect:t.disableMonthYearSelect,monthPicker:t.monthPicker,timePicker:t.timePicker,range:t.range,filters:t.filters,minTime:t.minTime,maxTime:t.maxTime,minDate:t.minDate,maxDate:t.maxDate,customProps:t.customProps,calendarClassName:t.calendarClassName,specificMode:j.value,getWeekNum:S,multiCalendars:t.multiCalendars,months:Ge.value,years:dt.value,multiCalendarsSolo:t.multiCalendarsSolo,modeHeight:t.modeHeight,internalModelValue:t.internalModelValue})),He=A(()=>({dp__menu:!0,dp__menu_index:!t.inline,dp__relative:t.inline,[t.menuClassName]:!!t.menuClassName})),tn=(h,L)=>h.value(L).map(H=>it(Be({},H),{days:H.days.map(G=>{const X=x(G.value),gt=be(X,G);return G.marker=Ie(G),G.classData={dp__cell_offset:!G.current,dp__pointer:!X&&!(!G.current&&t.hideOffsetDates),dp__active_date:t.range?!1:f(G),dp__date_hover:gt,dp__date_hover_start:qe(gt,G,!0),dp__date_hover_end:qe(gt,G,!1),dp__range_between:(t.range||t.weekPicker)&&(t.multiCalendars>0?G.current:!0)&&!X&&!(!G.current&&t.hideOffsetDates)&&!f(G)?Se(G):!1,dp__today:!t.noToday&&ae(G.value,d.value),dp__cell_disabled:X,dp__cell_auto_range:W(G),dp__cell_auto_range_start:le(G),dp__cell_auto_range_end:q(G),dp__range_start:t.multiCalendars>0?G.current&&pe(G):pe(G),dp__range_end:t.multiCalendars>0?G.current&&pe(G,!1):pe(G,!1),[t.calendarCellClassName]:!!t.calendarCellClassName},G})})),an=h=>{h.stopPropagation(),h.preventDefault(),h.stopImmediatePropagation()},nn=()=>{t.escClose&&a("closePicker")},rn=h=>{h.stopImmediatePropagation(),h.preventDefault(),t.spaceConfirm&&a("selectDate")},Rt=h=>{var L;(L=t.flow)!=null&&L.length&&(o[h]=!0,Object.keys(o).filter(H=>!o[H]).length||ma())},ma=()=>{t.flow[D.value]==="month"&&l.value[0]&&l.value[0].toggleMonthPicker(!0),t.flow[D.value]==="year"&&l.value&&l.value[0].toggleYearPicker(!0),t.flow[D.value]==="calendar"&&c.value&&c.value.toggleTimePicker(!1,!0),t.flow[D.value]==="time"&&c.value&&c.value.toggleTimePicker(!0,!0);const h=t.flow[D.value];(h==="hours"||h==="minutes"||h==="seconds")&&c.value&&c.value.toggleTimePicker(!0,!0,h)};return(h,L)=>(y(),C("div",{id:h.uid?`dp-menu-${h.uid}`:void 0,tabindex:"0",ref_key:"dpMenuRef",ref:m,role:"dialog","aria-label":"Datepicker menu",class:Z(u(He)),onMouseleave:L[11]||(L[11]=(...H)=>u(ke)&&u(ke)(...H)),onClick:an,onKeydown:[z(nn,["esc"]),z(rn,["space"]),L[12]||(L[12]=z(H=>u(we)("left",0),["left"])),L[13]||(L[13]=z(H=>u(we)("right",0),["right"]))]},[(h.disabled||h.readonly)&&h.inline?(y(),C("div",{key:0,class:Z(u(Ve))},null,2)):p("",!0),h.inline?p("",!0):(y(),C("div",{key:1,class:Z(u(de))},null,2)),Y("div",{class:Z(h.presetRanges.length?"dp__menu_content_wrapper":null)},[h.presetRanges.length?(y(),C("div",ni,[(y(!0),C(te,null,ve(h.presetRanges,(H,G)=>(y(),C("div",{key:G,class:"dp__preset_range",onClick:X=>u(Ke)(H.range)},ce(H.label),9,ri))),128))])):p("",!0),Y("div",{class:"dp__instance_calendar",ref_key:"calendarWrapperRef",ref:r,role:"document"},[Y("div",{class:Z(u(De))},[(y(!0),C(te,null,ve(u(k),(H,G)=>(y(),C("div",{key:H,class:Z(u(Je))},[!h.disableMonthYearSelect&&!h.timePicker?(y(),Q(Lt(h.monthYearComponent?h.monthYearComponent:ei),$e({key:0,ref_for:!0,ref:X=>{X&&(l.value[G]=X)}},{months:u(Ge),years:u(dt),filters:e.filters,monthPicker:h.monthPicker,month:u(I)(H),year:u(s)(H),customProps:h.customProps,multiCalendars:e.multiCalendars,multiCalendarsSolo:h.multiCalendarsSolo,instance:H,minDate:h.minDate,maxDate:h.maxDate,preventMinMaxNavigation:h.preventMinMaxNavigation,internalModelValue:e.internalModelValue,range:h.range,reverseYears:h.reverseYears},{onMount:L[0]||(L[0]=X=>Rt("monthYearInput")),onResetFlow:P,"onUpdate:month":X=>u(M)(H,X,!0),"onUpdate:year":X=>u(M)(H,X,!1),onMonthYearSelect:u(ie)}),ge({_:2},[ve(u(fe),(X,gt)=>({name:X,fn:J(Ft=>[B(h.$slots,X,tt(at(Ft)))])}))]),1040,["onUpdate:month","onUpdate:year","onMonthYearSelect"])):p("",!0),Ee(pl,$e(u(Ae),{"flow-step":D.value,"onUpdate:flow-step":L[1]||(L[1]=X=>D.value=X),instance:H,"mapped-dates":u(Ze)(H),month:u(I)(H),year:u(s)(H),"month-year-component":h.monthYearComponent,onSelectDate:X=>u(_)(X,!u(O)(H)),onSetHoverDate:L[2]||(L[2]=X=>u(v)(X)),onHandleScroll:X=>u(me)(X,H),onMount:L[3]||(L[3]=X=>Rt("calendar")),onResetFlow:P}),ge({_:2},[ve(u(yt),(X,gt)=>({name:X,fn:J(Ft=>[B(h.$slots,X,tt(at(Be({},Ft))))])}))]),1040,["flow-step","instance","mapped-dates","month","year","month-year-component","onSelectDate","onHandleScroll"])],2))),128))],2),Y("div",null,[h.enableTimePicker&&!h.monthPicker&&!h.weekPicker?(y(),Q(Lt(h.timePickerComponent?h.timePickerComponent:Fl),$e({key:0,ref_key:"timePickerRef",ref:c},{is24:h.is24,hoursIncrement:h.hoursIncrement,minutesIncrement:h.minutesIncrement,hoursGridIncrement:h.hoursGridIncrement,secondsIncrement:h.secondsIncrement,minutesGridIncrement:h.minutesGridIncrement,secondsGridIncrement:h.secondsGridIncrement,noHoursOverlay:h.noHoursOverlay,noMinutesOverlay:h.noMinutesOverlay,noSecondsOverlay:h.noSecondsOverlay,range:h.range,filters:e.filters,timePicker:h.timePicker,hours:u(w),minutes:u(T),seconds:u(V),customProps:h.customProps,enableSeconds:h.enableSeconds,fixedStart:h.fixedStart,fixedEnd:h.fixedEnd},{onMount:L[4]||(L[4]=H=>Rt("timePicker")),"onUpdate:hours":L[5]||(L[5]=H=>u(N)(H)),"onUpdate:minutes":L[6]||(L[6]=H=>u(N)(H,!1)),"onUpdate:seconds":L[7]||(L[7]=H=>u(N)(H,!1,!0)),onResetFlow:P}),ge({_:2},[ve(u(ee),(H,G)=>({name:H,fn:J(X=>[B(h.$slots,H,tt(at(X)))])}))]),1040)):p("",!0)])],512),h.showNowButton?(y(),C("div",oi,[h.$slots["now-button"]?B(h.$slots,"now-button",{key:0,selectCurrentDate:u(Oe)}):p("",!0),h.$slots["now-button"]?p("",!0):(y(),C("button",{key:1,type:"button",role:"button",class:"dp__now_button",onClick:L[8]||(L[8]=(...H)=>u(Oe)&&u(Oe)(...H))},ce(h.nowButtonLabel),1))])):p("",!0)],2),!h.autoApply||h.keepActionRow?(y(),Q(Lt(h.actionRowComponent?h.actionRowComponent:Cl),$e({key:2},{calendarWidth:g.value,selectText:h.selectText,cancelText:h.cancelText,internalModelValue:e.internalModelValue,range:h.range,previewFormat:e.previewFormat,inline:h.inline,monthPicker:h.monthPicker,timePicker:h.timePicker,customProps:h.customProps,multiCalendars:e.multiCalendars,menuMount:b.value,maxTime:h.maxTime,minTime:h.minTime,enableTimePicker:h.enableTimePicker,minDate:h.minDate,maxDate:h.maxDate,multiDates:h.multiDates},{onClosePicker:L[9]||(L[9]=H=>h.$emit("closePicker")),onSelectDate:L[10]||(L[10]=H=>h.$emit("selectDate"))}),ge({_:2},[ve(u(ht),(H,G)=>({name:H,fn:J(X=>[B(h.$slots,H,tt(at(Be({},X))))])}))]),1040)):p("",!0)],42,ai))}});var Ut=(e=>(e.center="center",e.left="left",e.right="right",e))(Ut||{});const ii=(e,a,t,n,r,o)=>{const l=R({top:"0",left:"0",transform:"none"}),c=R(!1),m=10,g=P=>{const N=P.getBoundingClientRect();return{left:N.left+window.scrollX,top:N.top+window.scrollY}},b=P=>{let N=0,M=0;for(;P&&!isNaN(P.offsetLeft)&&!isNaN(P.offsetTop);)N+=P.offsetLeft-P.scrollLeft,M+=P.offsetTop-P.scrollTop,P=P.offsetParent;return{top:M,left:N}},D=(P=!0)=>{const N=Me(r);if(a&&typeof a!="boolean")l.value=a(N);else if(N){const{left:M,width:d,height:I}=N.getBoundingClientRect(),{top:s}=a?b(N):g(N),w={top:`${I+s+m}px`,left:"",transform:"none"};e===Ut.left&&(w.left=`${M}px`),e===Ut.right&&(w.left=`${M+d}px`,w.transform="translateX(-100%)"),e===Ut.center&&(w.left=`${M+d/2}px`,w.transform="translateX(-50%)"),l.value=w,P&&t&&$()}},$=()=>{const P=Me(r);if(P&&t){const{height:N,top:M}=P.getBoundingClientRect(),{top:d}=a?b(P):g(P),I=window.innerHeight-M-N,s=Me(n);if(s){const{height:w}=s.getBoundingClientRect(),T=w+N;T>M&&T>I?M<I&&(D(!1),c.value=!1):T>I?(l.value.top=`${d-w-m}px`,c.value=!0):(D(!1),c.value=!1)}}o("recalculatePosition")};return{openOnTop:c,menuPosition:l,setMenuPosition:D,recalculatePosition:$}},si=(e,a,t,n,r,o,l,c,m,g,b,D,$,P)=>{const N=R(""),M=R();vt(M,()=>{P("internalModelChange",M.value)});const d=s=>{let w=null;s?a?hl(s)&&"hours"in s[0]&&"minutes"in s[0]?w=[he(null,+s[0].hours,+s[0].minutes,+s[0].seconds),he(null,+s[1].hours,+s[1].minutes,+s[1].seconds)]:yl(s)&&(w=he(null,+s.hours,+s.minutes,+s.seconds)):t?gl(s)&&"month"in s[0]&&"year"in s[0]?w=[Xe(null,+s[0].month,+s[0].year),s[1]?Xe(null,+s[1].month,+s[1].year):null]:wl(s)&&"month"in s&&"year"in s&&(w=Xe(null,+s.month,+s.year)):g&&Array.isArray(s)?w=s.map(T=>new Date(T)):D&&Array.isArray(s)?w=[new Date(s[0]),new Date(s[1])]:n?bl(s,r)&&(w=[new Date(s[0]),s[1]?new Date(s[1]):null]):kl(s)&&(w=new Date(s)):w=null,ra(w)?(M.value=w,I()):(M.value=null,N.value="")},I=()=>{if(!M.value)N.value="";else if(!e||typeof e=="string"){const s=za(e,o,c,t,a,D,l);Array.isArray(M.value)&&g?N.value=M.value.map(w=>Vt(w,s,m==null?void 0:m.value)).join("; "):N.value=Vt(M.value,s,m==null?void 0:m.value,$.rangeSeparator)}else a?N.value=e(oa(M.value)):t?N.value=e(Ma(M.value)):N.value=e(M.value)};return{parseExternalModelValue:d,formatInputValue:I,internalModelValue:M,inputValue:N,emitModelValue:()=>{if(t)P("update:modelValue",Ma(M.value));else if(a)P("update:modelValue",oa(M.value));else if(D)P("update:modelValue",M.value);else{M.value&&n&&r&&M.value.length===1&&M.value.push(null);const s=b?Array.isArray(M.value)?M.value.map(w=>w&&Te(w)):Te(M.value):M.value;P("update:modelValue",s)}I()},checkBeforeEmit:()=>M.value?n?r?M.value.length>=1:M.value.length===2:!!M.value:!1}},ui=typeof window<"u"?window:void 0,aa=()=>{},di=e=>un()?(dn(e),!0):!1,ci=(e,a,t,n)=>{if(!e)return aa;let r=aa;const o=vt(()=>u(e),c=>{r(),c&&(c.addEventListener(a,t,n),r=()=>{c.removeEventListener(a,t,n),r=aa})},{immediate:!0,flush:"post"}),l=()=>{o(),r()};return di(l),l},mi=(e,a,t,n={})=>{const{window:r=ui,event:o="pointerdown"}=n;return r?ci(r,o,l=>{const c=Me(e),m=Me(a);!c||!m||c===l.target||l.composedPath().includes(c)||l.composedPath().includes(m)||t(l)},{passive:!0}):void 0},fi=Le({props:it(Be({},Ja),{name:{type:String,default:null},multiCalendars:{type:[Boolean,Number,String],default:null},modelValue:{type:[String,Date,Array,Object],default:null},position:{type:String,default:"center"},placeholder:{type:String,default:null},dark:{type:Boolean,default:!1},required:{type:Boolean,default:!1},format:{type:[String,Function],default:()=>null},previewFormat:{type:[String,Function],default:()=>null},inputClassName:{type:String,default:null},hideInputIcon:{type:Boolean,default:!1},state:{type:Boolean,default:null},clearable:{type:Boolean,default:!0},closeOnScroll:{type:Boolean,default:!1},filters:{type:Object,default:()=>({})},inlineWithInput:{type:Boolean,default:!1},autoPosition:{type:Boolean,default:!0},closeOnAutoApply:{type:Boolean,default:!0},textInputOptions:{type:Object,default:()=>({})},teleport:{type:String,default:"body"},altPosition:{type:[Boolean,Function],default:!1},partialRange:{type:Boolean,default:!0},transitions:{type:Boolean,default:!0},openMenuOnFocus:{type:Boolean,default:!0},formatLocale:{type:Object,default:null},autocomplete:{type:String,default:null},utc:{type:Boolean,default:!1}}),emits:["update:modelValue","textSubmit","closed","cleared","open","focus","blur","internalModelChange","recalculatePosition","flow-step","updateMonthYear"],setup(e,{expose:a,emit:t}){const n=e,r=Ht(),o=R(!1),l=Yt(n,"modelValue"),c=R(null),m=R(null),g=R(null);St("autoApply",n.autoApply);const b=A(()=>n.formatLocale);St("formatLocale",b),St("textInput",Yt(n,"textInput")),st(()=>{w(n.modelValue),n.inline||(window.addEventListener("scroll",pe),window.addEventListener("resize",ie)),n.inline&&(o.value=!0)}),$a(()=>{n.inline||(window.removeEventListener("scroll",pe),window.removeEventListener("resize",ie))});const D=rt(r,"all"),$=rt(r,"input");vt(l,()=>{w(l.value)},{deep:!0});const{openOnTop:P,menuPosition:N,setMenuPosition:M,recalculatePosition:d}=ii(n.position,n.altPosition,n.autoPosition,c,m,t),{internalModelValue:I,inputValue:s,parseExternalModelValue:w,emitModelValue:T,checkBeforeEmit:V,formatInputValue:x}=si(n.format,n.timePicker,n.monthPicker,n.range,n.partialRange,n.is24,n.enableTimePicker,n.enableSeconds,b,n.multiDates,n.utc,n.weekPicker,n.textInputOptions,t),f=A(()=>({dp__main:!0,dp__theme_dark:n.dark,dp__theme_light:!n.dark,dp__flex_display:n.inline,dp__flex_display_with_input:n.inlineWithInput})),_=A(()=>Na(n.format)?n.format:za(null,n.is24,n.enableSeconds,n.monthPicker,n.timePicker,n.weekPicker,n.enableTimePicker)),S=A(()=>n.previewFormat?n.previewFormat:Na(_.value)?_.value:n.format),v=A(()=>typeof n.transitions=="boolean"?n.transitions?Oa({}):!1:Oa(n.transitions));St("transitions",v);const q=A(()=>n.dark?"dp__theme_dark":"dp__theme_light"),W=A(()=>Object.assign(Ko(),n.textInputOptions)),le=A(()=>Jo(n.filters)),Se=A(()=>{const ee=fe=>{const de={hours:xe(new Date),minutes:Ce(new Date),seconds:Re(new Date)};return Object.assign(de,fe)};return n.range?n.startTime&&Array.isArray(n.startTime)?[ee(n.startTime[0]),ee(n.startTime[1])]:null:n.startTime&&!Array.isArray(n.startTime)?ee(n.startTime):null}),ke=A(()=>n.multiCalendars===null?0:typeof n.multiCalendars=="boolean"?n.multiCalendars?2:0:+n.multiCalendars>=2?+n.multiCalendars:2),pe=()=>{o.value&&(n.closeOnScroll?be():n.autoPosition?M():window.removeEventListener("scroll",pe))},ie=()=>{o.value&&M()},me=()=>{!n.disabled&&!n.readonly&&(M(),o.value=!0,o.value||qe(),o.value&&(t("open"),t("focus")),w(n.modelValue))},we=()=>{s.value="",qe(),t("update:modelValue",null),t("cleared"),be()},Ie=()=>{V()&&(T(),be())},Oe=(ee=!1)=>{n.autoApply&&(n.enableTimePicker?la(I.value,n.maxTime,n.minTime):!0)&&(T(),n.closeOnAutoApply&&!ee&&be())},qe=()=>{I.value=null},be=()=>{n.inline||(o.value&&(o.value=!1,t("closed"),t("blur"),s.value&&w(l.value)),qe(),m.value&&m.value.unFocus(),ht())},Ke=(ee,fe)=>{if(!ee){I.value=null;return}I.value=ee,fe&&(Ie(),t("textSubmit"))},yt=()=>{n.autoApply&&la(I.value,n.maxTime,n.minTime)&&T()},ht=()=>{g.value&&g.value.focus({preventScroll:!0})};return mi(c,m,be),a({closeMenu:be,selectDate:Ie,clearValue:we,openMenu:me,onScroll:pe,formatInputValue:x}),(ee,fe)=>(y(),C("div",{class:Z(u(f))},[Ee(ol,$e({ref_key:"inputRef",ref:m},{placeholder:e.placeholder,hideInputIcon:e.hideInputIcon,readonly:ee.readonly,disabled:ee.disabled,inputClassName:e.inputClassName,clearable:e.clearable,state:e.state,inline:ee.inline,inlineWithInput:e.inlineWithInput,textInput:ee.textInput,textInputOptions:u(W),range:ee.range,isMenuOpen:o.value,pattern:u(_),autoApply:ee.autoApply,uid:ee.uid,openMenuOnFocus:e.openMenuOnFocus,required:e.required,name:e.name,autocomplete:e.autocomplete},{"input-value":u(s),"onUpdate:input-value":fe[0]||(fe[0]=de=>fa(s)?s.value=de:null),onClear:we,onOpen:me,onSetInputDate:Ke,onSetEmptyDate:u(T),onSelectDate:Ie,onClose:be}),ge({_:2},[ve(u($),(de,dt)=>({name:de,fn:J(Ge=>[B(ee.$slots,de,tt(at(Ge)))])}))]),1040,["input-value","onSetEmptyDate"]),Y("span",{tabindex:"-1",ref_key:"focusRef",ref:g},null,512),o.value?(y(),Q(sn,{key:0,to:e.teleport,disabled:ee.inline},[o.value?(y(),Q(li,$e({key:0,ref_key:"dpMenuRef",ref:c,class:u(q),style:u(N)},it(Be({},u(ll)(ee.$props)),{multiCalendars:u(ke),previewFormat:u(S),filters:u(le),openOnTop:u(P),startTime:u(Se)}),{internalModelValue:u(I),"onUpdate:internalModelValue":fe[1]||(fe[1]=de=>fa(I)?I.value=de:null),onClosePicker:be,onSelectDate:Ie,onDpOpen:u(d),onAutoApply:Oe,onTimeUpdate:yt,onFlowStep:fe[2]||(fe[2]=de=>ee.$emit("flow-step",de)),onUpdateMonthYear:fe[3]||(fe[3]=de=>ee.$emit("updateMonthYear",de))}),ge({_:2},[ve(u(D),(de,dt)=>({name:de,fn:J(Ge=>[B(ee.$slots,de,tt(at(Be({},Ge))))])}))]),1040,["class","style","internalModelValue","onDpOpen"])):p("",!0)],8,["to","disabled"])):p("",!0)],2))}});var en=(()=>{const e=fi;return e.install=a=>{a.component("Vue3DatePicker",e)},e})(),vi=Object.freeze(Object.defineProperty({__proto__:null,default:en},Symbol.toStringTag,{value:"Module"}));Object.entries(vi).forEach(([e,a])=>{e!=="default"&&(en[e]=a)});export{en as U,ot as a,Fe as b,qt as c,wt as d,Wn as e,bt as f,se as g,ue as h,E as r,Mt as s,F as t};
diff --git a/docs/customization/scss/index.html b/docs/customization/scss/index.html
index d14dffa60..b4abfac85 100644
--- a/docs/customization/scss/index.html
+++ b/docs/customization/scss/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,8 +23,8 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>SCSS | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.1f688541.js"><link rel="modulepreload" href="/assets/index.html.7514c62a.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.1f688541.js"><link rel="modulepreload" href="/assets/index.html.bead136d.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
     <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/customization/scss/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="scss" tabindex="-1"><a class="header-anchor" href="#scss" aria-hidden="true">#</a> SCSS</h1><p>For easier style configuration you can import the <code>scss</code> file and modify the default properties</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
@@ -61,6 +61,6 @@
 <span class="token property"><span class="token variable">$dp__preview_font_size</span></span><span class="token punctuation">:</span> 0.8rem <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// font size of the date preview in the action row</span>
 <span class="token property"><span class="token variable">$dp__time_font_size</span></span><span class="token punctuation">:</span> 2rem <span class="token statement keyword">!default</span><span class="token punctuation">;</span> <span class="token comment">// font size in the time picker</span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/customization/theming/" class="" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a></span><!----></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/customization/theming/index.html b/docs/customization/theming/index.html
index a492b3b00..007d455f3 100644
--- a/docs/customization/theming/index.html
+++ b/docs/customization/theming/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,8 +23,8 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Theming | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.61d313f8.js"><link rel="modulepreload" href="/assets/index.html.b5876d91.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.61d313f8.js"><link rel="modulepreload" href="/assets/index.html.c2cc26a6.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
     <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading active">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/customization/theming/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="theming" tabindex="-1"><a class="header-anchor" href="#theming" aria-hidden="true">#</a> Theming</h1><p>Datepicker comes with the theme support with <code>css</code> variables. It provides two classes that are applied based on the chosen dark/light mode</p><p>To change variables, simply override the classes with your custom values.</p><p><strong>Dark mode configuration</strong></p><div class="language-css ext-css line-numbers-mode"><pre class="language-css"><code><span class="token selector">.dp__theme_dark</span> <span class="token punctuation">{</span>
@@ -68,6 +68,6 @@
   <span class="token property">--dp-danger-color</span><span class="token punctuation">:</span> #ff6f60<span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><nav class="page-nav"><p class="inner"><!----><span class="next"><a href="/customization/scss/" class="" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/index.html b/docs/index.html
index 3c1622b50..f16d9daf1 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,11 +23,11 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Vue 3 Datepicker | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.9ea49862.js"><link rel="modulepreload" href="/assets/index.html.e796e241.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.5c620bdc.js"><link rel="modulepreload" href="/assets/index.html.5ab90608.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
-    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a aria-current="page" href="/" class="router-link-active router-link-exact-active"><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a aria-current="page" href="/" class="router-link-active router-link-exact-active" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a aria-current="page" href="/" class="router-link-active router-link-exact-active" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><div style="text-align:center;" markdown="1"><p>⭐️ If you like the component, give it a star on <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer">GitHub<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> and consider <a href="https://github.com/sponsors/Vuepic" target="_blank" rel="noopener noreferrer">sponsoring<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> its development! ⭐</p><div class="custom-container tip"><p class="custom-container-title">⚠️ Important ⚠️</p><p><strong>If you come from <a href="https://github.com/Vuepic/vue3-date-time-picker" target="_blank" rel="noopener noreferrer"><code>vue3-date-time-picker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>, the library is moved to the new repository with the new name: <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><code>@vuepic/vue-datepicker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>. If you haven&#39;t updated yet, please switch to the new package.</strong></p></div><h1 id="vuepic-vue-datepicker" tabindex="-1"><a class="header-anchor" href="#vuepic-vue-datepicker" aria-hidden="true">#</a> @vuepic/vue-datepicker</h1><h3 id="the-most-complete-datepicker-solution-for-vue-3" tabindex="-1"><a class="header-anchor" href="#the-most-complete-datepicker-solution-for-vue-3" aria-hidden="true">#</a> The most complete datepicker solution for Vue 3</h3><p><a href="https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/npm/l/@vuepic/vue-datepicker" alt="License"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <a href="https://www.npmjs.com/package/@vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/npm/v/@vuepic/vue-datepicker" alt="npm"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <img src="https://img.shields.io/npm/dm/@vuepic/vue-datepicker" alt="Downloads"> <a href="https://github.com/Vuepic/vue-datepicker/issues" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/github/issues-raw/Vuepic/vue-datepicker" alt="Open issues"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <img src="https://img.shields.io/github/workflow/status/Vuepic/vue-datepicker/CI?label=CI" alt="CI"> <img src="https://img.shields.io/github/release-date/Vuepic/vue-datepicker" alt="Release date"></p><p>Vue 3 date time picker is a lightweight yet powerful and reusable datepicker component. It aims to provide a high level of customization to fit within any project. Offers a great range of features, slots and props, while providing a way to customize for specific needs. Written in typescript to provide a great developer experience.</p><p><a href="/installation/" class="">Getting started</a></p><p><a href="https://stackblitz.com/edit/vuepic-vue-datepicker?file=src%2Fcomponents%2FPlayground.vue" target="_blank" rel="noopener noreferrer">StackBlitz Playground<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p></div><h3 id="" tabindex="-1"><a class="header-anchor" href="#" aria-hidden="true">#</a></h3><div style="text-align:center;" markdown="1"><h2 id="features" tabindex="-1"><a class="header-anchor" href="#features" aria-hidden="true">#</a> Features</h2><h4 id="single-date-picker" tabindex="-1"><a class="header-anchor" href="#single-date-picker" aria-hidden="true">#</a> Single date picker</h4><h4 id="range-date-picker" tabindex="-1"><a class="header-anchor" href="#range-date-picker" aria-hidden="true">#</a> Range date picker</h4><h4 id="time-picker" tabindex="-1"><a class="header-anchor" href="#time-picker" aria-hidden="true">#</a> Time picker</h4><h4 id="month-picker" tabindex="-1"><a class="header-anchor" href="#month-picker" aria-hidden="true">#</a> Month picker</h4><h4 id="text-input" tabindex="-1"><a class="header-anchor" href="#text-input" aria-hidden="true">#</a> Text input</h4><h4 id="locale-support" tabindex="-1"><a class="header-anchor" href="#locale-support" aria-hidden="true">#</a> Locale support</h4><h4 id="week-numbers" tabindex="-1"><a class="header-anchor" href="#week-numbers" aria-hidden="true">#</a> Week numbers</h4><h4 id="dark-and-light-theme" tabindex="-1"><a class="header-anchor" href="#dark-and-light-theme" aria-hidden="true">#</a> Dark and light theme</h4><h4 id="ssr-support" tabindex="-1"><a class="header-anchor" href="#ssr-support" aria-hidden="true">#</a> SSR support</h4><h4 id="highly-configurable" tabindex="-1"><a class="header-anchor" href="#highly-configurable" aria-hidden="true">#</a> Highly configurable</h4><h4 id="accessible" tabindex="-1"><a class="header-anchor" href="#accessible" aria-hidden="true">#</a> Accessible</h4><h4 id="types-included" tabindex="-1"><a class="header-anchor" href="#types-included" aria-hidden="true">#</a> Types included</h4></div><div style="text-align:center;" markdown="1"><h2 id="resources" tabindex="-1"><a class="header-anchor" href="#resources" aria-hidden="true">#</a> Resources</h2><p><a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer">GitHub<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><p><a href="https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE" target="_blank" rel="noopener noreferrer">MIT License<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p></div><div style="text-align:center;" markdown="1"> © Vuepic 2021-2022 </div><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><!----><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a aria-current="page" href="/" class="router-link-active router-link-exact-active"><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a aria-current="page" href="/" class="router-link-active router-link-exact-active" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a aria-current="page" href="/" class="router-link-active router-link-exact-active" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/installation/" class="sidebar-item" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><div style="text-align:center;" markdown="1"><p>⭐ If you like the component, give it a star on <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer">GitHub<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> and consider <a href="https://github.com/sponsors/Vuepic" target="_blank" rel="noopener noreferrer">sponsoring<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> its development! ⭐</p><div class="custom-container tip"><p class="custom-container-title">⚠️ Important ⚠️</p><p><strong>If you come from <a href="https://github.com/Vuepic/vue3-date-time-picker" target="_blank" rel="noopener noreferrer"><code>vue3-date-time-picker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>, the library is moved to the new repository with the new name: <a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><code>@vuepic/vue-datepicker</code><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>. If you haven&#39;t updated yet, please switch to the new package.</strong></p></div><h1 id="vuepic-vue-datepicker" tabindex="-1"><a class="header-anchor" href="#vuepic-vue-datepicker" aria-hidden="true">#</a> @vuepic/vue-datepicker</h1><h3 id="the-most-complete-datepicker-solution-for-vue-3" tabindex="-1"><a class="header-anchor" href="#the-most-complete-datepicker-solution-for-vue-3" aria-hidden="true">#</a> The most complete datepicker solution for Vue 3</h3><p><a href="https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/npm/l/@vuepic/vue-datepicker" alt="License"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <a href="https://www.npmjs.com/package/@vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/npm/v/@vuepic/vue-datepicker" alt="npm"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <img src="https://img.shields.io/npm/dm/@vuepic/vue-datepicker" alt="Downloads"> <a href="https://github.com/Vuepic/vue-datepicker/issues" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/github/issues-raw/Vuepic/vue-datepicker" alt="Open issues"><span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> <img src="https://img.shields.io/github/workflow/status/Vuepic/vue-datepicker/CI?label=CI" alt="CI"> <img src="https://img.shields.io/github/release-date/Vuepic/vue-datepicker" alt="Release date"></p><p>Vue 3 date time picker is a lightweight yet powerful and reusable datepicker component. It aims to provide a high level of customization to fit within any project. Offers a great range of features, slots and props, while providing a way to customize for specific needs. Written in typescript to provide a great developer experience.</p><p><a href="/installation/" class="">Getting started</a></p><p><a href="https://stackblitz.com/edit/vuepic-vue-datepicker?file=src%2Fcomponents%2FPlayground.vue" target="_blank" rel="noopener noreferrer">StackBlitz Playground<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p></div><h3 id="" tabindex="-1"><a class="header-anchor" href="#" aria-hidden="true">#</a></h3><div style="text-align:center;" markdown="1"><h2 id="features" tabindex="-1"><a class="header-anchor" href="#features" aria-hidden="true">#</a> Features</h2><h4 id="single-date-picker" tabindex="-1"><a class="header-anchor" href="#single-date-picker" aria-hidden="true">#</a> Single date picker</h4><h4 id="range-date-picker" tabindex="-1"><a class="header-anchor" href="#range-date-picker" aria-hidden="true">#</a> Range date picker</h4><h4 id="time-picker" tabindex="-1"><a class="header-anchor" href="#time-picker" aria-hidden="true">#</a> Time picker</h4><h4 id="month-picker" tabindex="-1"><a class="header-anchor" href="#month-picker" aria-hidden="true">#</a> Month picker</h4><h4 id="text-input" tabindex="-1"><a class="header-anchor" href="#text-input" aria-hidden="true">#</a> Text input</h4><h4 id="locale-support" tabindex="-1"><a class="header-anchor" href="#locale-support" aria-hidden="true">#</a> Locale support</h4><h4 id="week-numbers" tabindex="-1"><a class="header-anchor" href="#week-numbers" aria-hidden="true">#</a> Week numbers</h4><h4 id="dark-and-light-theme" tabindex="-1"><a class="header-anchor" href="#dark-and-light-theme" aria-hidden="true">#</a> Dark and light theme</h4><h4 id="ssr-support" tabindex="-1"><a class="header-anchor" href="#ssr-support" aria-hidden="true">#</a> SSR support</h4><h4 id="highly-configurable" tabindex="-1"><a class="header-anchor" href="#highly-configurable" aria-hidden="true">#</a> Highly configurable</h4><h4 id="accessible" tabindex="-1"><a class="header-anchor" href="#accessible" aria-hidden="true">#</a> Accessible</h4><h4 id="types-included" tabindex="-1"><a class="header-anchor" href="#types-included" aria-hidden="true">#</a> Types included</h4></div><div style="text-align:center;" markdown="1"><h2 id="resources" tabindex="-1"><a class="header-anchor" href="#resources" aria-hidden="true">#</a> Resources</h2><p><a href="https://github.com/Vuepic/vue-datepicker" target="_blank" rel="noopener noreferrer">GitHub<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><p><a href="https://github.com/Vuepic/vue-datepicker/blob/main/LICENSE" target="_blank" rel="noopener noreferrer">MIT License<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p></div><div style="text-align:center;" markdown="1"> © Vuepic 2021-2022 </div><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><!----><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>
diff --git a/docs/installation/index.html b/docs/installation/index.html
index f5d4ed3b2..0ddf30ff3 100644
--- a/docs/installation/index.html
+++ b/docs/installation/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
-    <meta name="generator" content="VuePress 2.0.0-beta.36">
+    <meta name="generator" content="VuePress 2.0.0-beta.37">
     <style>
       :root {
         --c-bg: #fff;
@@ -23,8 +23,8 @@
 			}
     </script>
     <link rel="icon" href="/logo.png"><meta name="description" content="Vue 3 datepicker component. Lightweight and powerful with support for the timepicker, range picker, month-year picker, text input, week numbers and many more. Options to customize the datepicker from the ground up with props, slots and custom components. Dark and light mode available"><title>Installation | Vue 3 Datepicker</title>
-    <link rel="modulepreload" href="/assets/app.519dac2e.js"><link rel="modulepreload" href="/assets/index.html.53c86478.js"><link rel="modulepreload" href="/assets/index.html.6b18d5e2.js"><link rel="modulepreload" href="/assets/plugin-vue_export-helper.21dcd24c.js">
-    <link rel="stylesheet" href="/assets/style.3b68b3c3.css">
+    <link rel="modulepreload" href="/assets/app.46c9efaa.js"><link rel="modulepreload" href="/assets/index.html.46debbc6.js"><link rel="modulepreload" href="/assets/index.html.b4665819.js">
+    <link rel="stylesheet" href="/assets/style.8c8e2d0d.css">
   </head>
   <body>
     <div id="app"><!--[--><div class="theme-container"><!--[--><header ref_key="navbar" class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/logo.png" alt="Vue 3 Datepicker"><span class="site-name can-hide">Vue 3 Datepicker</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><a href="/" class="" aria-label="Home"><!--[--><!--]--> Home <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://github.com/Vuepic/vue-datepicker/releases" rel="noopener noreferrer" target="_blank" aria-label="Changelog"><!--[--><!--]--> Changelog <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><p tabindex="0" class="sidebar-item sidebar-heading active">Getting Started <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/installation/" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Installation"><!--[--><!--]--> Installation <!--[--><!--]--></a><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/installation/#global" class="router-link-active router-link-exact-active sidebar-item" aria-label="Global"><!--[--><!--]--> Global <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/installation/#local" class="router-link-active router-link-exact-active sidebar-item" aria-label="Local"><!--[--><!--]--> Local <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/installation/#browser" class="router-link-active router-link-exact-active sidebar-item" aria-label="Browser"><!--[--><!--]--> Browser <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">API <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/api/props/" class="sidebar-item" aria-label="Props"><!--[--><!--]--> Props <!--[--><!--]--></a><!----></li><li><a href="/api/slots/" class="sidebar-item" aria-label="Slots"><!--[--><!--]--> Slots <!--[--><!--]--></a><!----></li><li><a href="/api/components/" class="sidebar-item" aria-label="Components"><!--[--><!--]--> Components <!--[--><!--]--></a><!----></li><li><a href="/api/events/" class="sidebar-item" aria-label="Events"><!--[--><!--]--> Events <!--[--><!--]--></a><!----></li><li><a href="/api/methods/" class="sidebar-item" aria-label="Methods"><!--[--><!--]--> Methods <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><li><p tabindex="0" class="sidebar-item sidebar-heading">Customization <!----></p><!--[--><ul style="" class="sidebar-item-children"><!--[--><li><a href="/customization/theming/" class="sidebar-item" aria-label="Theming"><!--[--><!--]--> Theming <!--[--><!--]--></a><!----></li><li><a href="/customization/scss/" class="sidebar-item" aria-label="Scss"><!--[--><!--]--> Scss <!--[--><!--]--></a><!----></li><!--]--></ul><!--]--></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="installation" tabindex="-1"><a class="header-anchor" href="#installation" aria-hidden="true">#</a> Installation</h1><p>Install the component using the preferred package manager</p><div class="language-bash ext-sh line-numbers-mode"><pre class="language-bash"><code><span class="token function">yarn</span> <span class="token function">add</span> @vuepic/vue-datepicker
@@ -50,7 +50,7 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
     <span class="token keyword">import</span> Datepicker <span class="token keyword">from</span> <span class="token string">&#39;@vuepic/vue-datepicker&#39;</span><span class="token punctuation">;</span>
     <span class="token keyword">import</span> <span class="token string">&#39;@vuepic/vue-datepicker/dist/main.css&#39;</span>
-
+    
     <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
         <span class="token literal-property property">components</span><span class="token operator">:</span> <span class="token punctuation">{</span> Datepicker <span class="token punctuation">}</span><span class="token punctuation">,</span>
         <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
@@ -68,12 +68,12 @@
     <span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
     <span class="token keyword">import</span> Datepicker <span class="token keyword">from</span> <span class="token string">&#39;@vuepic/vue-datepicker&#39;</span><span class="token punctuation">;</span>
     <span class="token keyword">import</span> <span class="token string">&#39;@vuepic/vue-datepicker/dist/main.css&#39;</span>
-
+    
     <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
         <span class="token literal-property property">components</span><span class="token operator">:</span> <span class="token punctuation">{</span> Datepicker <span class="token punctuation">}</span><span class="token punctuation">,</span>
         <span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
             <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
-
+            
             <span class="token keyword">return</span> <span class="token punctuation">{</span>
                 date
             <span class="token punctuation">}</span>
@@ -88,7 +88,7 @@
     <span class="token keyword">import</span> <span class="token punctuation">{</span> ref <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;vue&#39;</span><span class="token punctuation">;</span>
     <span class="token keyword">import</span> Datepicker <span class="token keyword">from</span> <span class="token string">&#39;@vuepic/vue-datepicker&#39;</span><span class="token punctuation">;</span>
     <span class="token keyword">import</span> <span class="token string">&#39;@vuepic/vue-datepicker/dist/main.css&#39;</span>
-
+    
     <span class="token keyword">const</span> date <span class="token operator">=</span> <span class="token function">ref</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div><!--]--></div><!--]--></div><p>Alternatively, you can import the <code>scss</code> file if you want full control of the component styles</p><div class="language-scss ext-scss line-numbers-mode"><pre class="language-scss"><code><span class="token keyword">@import</span> <span class="token string">&#39;@vuepic/vue-datepicker/src/VueDatePicker/style/main.scss&#39;</span><span class="token punctuation">;</span>
@@ -101,6 +101,6 @@
     <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">mount</span><span class="token punctuation">(</span><span class="token string">&quot;#app&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
 </span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
 </code></pre><div class="line-numbers" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><p>That&#39;s it, you are ready to go</p><!--]--></div><footer class="page-meta"><!----><div class="meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><!----></footer><!----><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
-    <script type="module" src="/assets/app.519dac2e.js" defer></script>
+    <script type="module" src="/assets/app.46c9efaa.js" defer></script>
   </body>
 </html>