diff --git a/README.md b/README.md index bea4639..73d0dea 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,9 @@ +# ⚠️ Important info! ⚠️ + +### The package is moved under a new name in the new repository, please transfer to [@vuepic/vue-datepicker]( https://github.com/Vuepic/vue-datepicker) + +### This repository will be archived soon. + ## vue3-date-time-picker diff --git a/docs/404.html b/docs/404.html deleted file mode 100644 index b308b66..0000000 --- a/docs/404.html +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - - Vue 3 Datepicker - - - - -

404

There's nothing here.
Take me home
- - - diff --git a/docs/api/components/index.html b/docs/api/components/index.html deleted file mode 100644 index f4418b3..0000000 --- a/docs/api/components/index.html +++ /dev/null @@ -1,416 +0,0 @@ - - - - - - - - - Components | Vue 3 Datepicker - - - - -
Vue 3 Datepicker

Components

Customize the datepicker with your custom components

WARNING

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

TIP

You can use css variables inside custom components if you need to style for the theme

monthYearComponent

Create and use a custom component in the header for month/year select

The component will receive the following props:

  • months: { value: number; text: string }[] -> value: 0-11, text: name of the month
  • years: { value: number; text: string }[] -> generated array of years based on provided range, text and value are the same
  • filters: filters prop
  • monthPicker: monthPicker prop
  • month: number -> This is the value of the selected month
  • year : number -> This is the value of the selected year
  • customProps: Record<string, unknown> -> Your custom props
  • instance: number -> In case you are using multiCalendars prop, it will be 1 or 2
  • minDate: Date | string -> minDate prop
  • maxDate: Date | string -> maxDate prop

Important

To update the month and the year value make sure to emit the following:

  • Month
    • Event: update:month
    • Value: number
  • Year
    • Event: update:year
    • Value: number
  • Handler event
    • Event: updateMonthYear
    • Value: boolean (only when updating year)
Code Example
<template>
-    <Datepicker v-model="date" :month-year-component="monthYear" />
-</template>
-
-<script>
-    import { computed, ref, defineAsyncComponent } from 'vue';
-    
-    // Lazy load the component we want to pass
-    const MonthYear = defineAsyncComponent(() => import('./MonthYearCustom.vue'));
-    
-    export default {
-          setup() {
-            const date = ref();
-            
-            // Return from computed as it is imported
-            const monthYear = computed(() => MonthYear);
-    
-            return {
-              date,
-              monthYear
-            }
-          }
-    }
-</script>
-
<template>
-  <div class="month-year-wrapper">
-    <div class="custom-month-year-component">
-      <select 
-            class="select-input"
-            :value="month" 
-            @change="$emit('update:month', +$event.target.value)">
-        <option 
-            v-for="m in months" 
-            :key="m.value"
-            :value="m.value">{{ m.text }}</option>
-      </select>
-      <select 
-            class="select-input" 
-            :value="year" 
-            @change="$emit('update:year', +$event.target.value)">
-        <option 
-            v-for="y in years"
-            :key="y.value" 
-            :value="y.value">{{ y.text }}</option>
-      </select>
-    </div>
-    <div class="icons">
-      <span class="custom-icon" @click="onPrev"><ChevronLeftIcon /></span>
-      <span class="custom-icon" @click="onNext"><ChevronRightIcon /></span>
-    </div>
-  </div>
-</template>
-
-<script>
-// Icons used in the example, you can use your custom ones
-import ChevronLeftIcon from './ChevronLeftIcon.vue';
-import ChevronRightIcon from './ChevronRightIcon.vue';
-
-import { defineComponent } from 'vue';
-
-export default defineComponent({
-  components: { ChevronLeftIcon, ChevronRightIcon },
-  emits: ['update:month', 'update:year'],
-  // Available props
-  props: {
-    months: { type: Array, default: () => [] },
-    years: { type: Array, default: () => [] },
-    filters: { type: Object, default: null },
-    monthPicker: { type: Boolean, default: false },
-    month: { type: Number, default: 0 },
-    year: { type: Number, default: 0 },
-    customProps: { type: Object, default: null }
-  },
-  setup(props, { emit }) {
-    const updateMonthYear = (month, year) => {
-      emit('update:month', month);
-      emit('update:year', year);
-    };
-
-    const onNext = () => {
-      let month = props.month;
-      let year = props.year;
-      if (props.month === 11) {
-        month = 0;
-        year = props.year + 1;
-      } else {
-        month += 1;
-      }
-      updateMonthYear(month, year);
-    };
-
-    const onPrev = () => {
-      let month = props.month;
-      let year = props.year;
-      if (props.month === 0) {
-        month = 11;
-        year = props.year - 1;
-      } else {
-        month -= 1;
-      }
-      updateMonthYear(month, year);
-    };
-
-    return {
-      onNext,
-      onPrev,
-    };
-  },
-});
-</script>
-
-<style lang="scss">
-.month-year-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.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: none;
-}
-
-.icons {
-  display: flex;
-}
-
-.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%;
-
-  svg {
-    height: 20px;
-    width: 20px;
-  }
-
-  &:hover {
-    background: var(--dp-hover-color);
-  }
-}
-</style>
-

timePickerComponent

Create and use a custom component for the time picker

The component will receive the following props:

Note: hours and minutes values will be arrays if range picker mode is active.

Important

To update the hours and the minutes values make sure to emit the following:

  • Hours
    • Event: update:hours
    • Value: number | [number, number]
  • Minutes
    • Event: update:minutes
    • Value: number | [number, number]

Note: 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 emit something like this emit('update:hours', [firstValueSaved, newSecondValue])

Code Example
<template>
-    <Datepicker v-model="date" :time-picker-component="timePicker" />
-</template>
-
-<script>
-    import { computed, ref, defineAsyncComponent } from 'vue';
-    
-    // Lazy load the component we want to pass
-    const TimePicker = defineAsyncComponent(() => import('./TimePickerCustom.vue'));
-    
-    export default {
-        setup() {
-            const date = ref();
-        
-            // Return from computed as it is imported
-            const timePicker = computed(() => TimePicker);
-
-            return {
-              date,
-              timePicker 
-            }
-        }
-    }
-</script>
-
<template>
-    <div class="custom-time-picker-component">
-        <select 
-              class="select-input"
-              :value="hours"
-              @change="$emit('update:hours', +$event.target.value)">
-            <option 
-              v-for="h in hoursArray"
-              :key="h.value"
-              :value="h.value">{{ h.text }}</option>
-        </select>
-        <select 
-              class="select-input" 
-              :value="minutes"
-              @change="$emit('update:minutes', +$event.target.value)">
-            <option 
-              v-for="m in minutesArray" 
-              :key="m.value" 
-              :value="m.value">{{ m.text }}</option>
-        </select>
-    </div>
-</template>
-
-<script>
-    import { computed, defineComponent } from 'vue';
-
-    export default defineComponent({
-        emits: ['update:hours', 'update:minutes'],
-        props: {
-            hoursIncrement: { type: [Number, String], default: 1 },
-            minutesIncrement: { type: [Number, String], default: 1 },
-            is24: { type: Boolean, default: true },
-            hoursGridIncrement: { type: [String, Number], default: 1 },
-            minutesGridIncrement: { type: [String, Number], default: 5 },
-            range: { type: Boolean, default: false },
-            filters: { type: Object, default: () => ({}) },
-            minTime: { type: Object, default: () => ({}) },
-            maxTime: { type: Object, default: () => ({}) },
-            timePicker: { type: Boolean, default: false },
-            hours: { type: [Number, Array], default: 0 },
-            minutes: { type: [Number, Array], default: 0 },
-            customProps: { type: Object, default: null }
-        },
-        setup() {
-            // Generate array of hours
-            const hoursArray = computed(() => {
-                const arr = [];
-                for (let i = 0; i < 24; i++) {
-                    arr.push({ text: i < 10 ? `0${i}` : i, value: i });
-                }
-                return arr;
-            });
-
-            // Generate array of minutes
-            const minutesArray = computed(() => {
-                const arr = [];
-                for (let i = 0; i < 60; i++) {
-                    arr.push({ text: i < 10 ? `0${i}` : i, value: i });
-                }
-                return arr;
-            });
-
-            return {
-                hoursArray,
-                minutesArray,
-            };
-        },
-    });
-</script>
-
-<style lang="scss">
-    .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: none;
-    }
-</style>
-

actionRowComponent

Create and use a custom component for action row

The component will receive the following props:

Info

Two events are available from this component to emit:

  • selectDate: Selects the current selection
  • closePicker: Closes the datepicker menu
Code Example
<template>
-    <Datepicker v-model="date" :action-row-component="actionRow" />
-</template>
-
-<script>
-    import { computed, ref, defineAsyncComponent } from 'vue';
-    
-    // Lazy load the component we want to pass
-    const ActionRow = defineAsyncComponent(() => import('./ActionRowCustom.vue'));
-    
-    export default {
-        setup() {
-            const date = ref();
-        
-            // Return from computed as it is imported
-            const actionRow = computed(() => ActionRow);
-
-            return {
-              date,
-              actionRow 
-            }
-        }
-    }
-</script>
-
<template>
-    <div class="custom-action-row">
-        <p class="current-selection">{{ date }}</p>
-        <button class="select-button" @click="$emit('selectDate')">Select Date</button>
-    </div>
-</template>
-
-<script>
-    import { computed, defineComponent } from 'vue';
-
-    export default defineComponent({
-        emits: ['selectDate', 'closePicker'],
-        props: {
-            selectText: { type: String, default: 'Select' },
-            cancelText: { type: String, default: 'Cancel' },
-            internalModelValue: { type: [Date, Array], default: null },
-            range: { type: Boolean, default: false },
-            previewFormat: {
-                type: [String, Function],
-                default: () => '',
-            },
-            monthPicker: { type: Boolean, default: false },
-            timePicker: { type: Boolean, default: false },
-        },
-        setup(props) {
-            const date = computed(() => {
-                if (props.internalModelValue) {
-                    const date = props.internalModelValue.getDate();
-                    const month = props.internalModelValue.getMonth() + 1;
-                    const year = props.internalModelValue.getFullYear();
-                    const hours = props.internalModelValue.getHours();
-                    const minutes = props.internalModelValue.getMinutes();
-
-                    return `${month}/${date}/${year}, ${hours}:${minutes}`;
-                }
-                return '';
-            });
-
-            return {
-                date,
-            };
-        },
-    });
-</script>
-
-<style lang="scss">
-    .custom-action-row {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-    }
-
-    .current-selection {
-        margin: 10px 0 0 0;
-    }
-
-    .select-button {
-        display: block;
-        background: transparent;
-        border: 1px solid var(--dp-success-color);
-        color: var(--dp-success-color);
-        border-radius: 4px;
-        padding: 5px;
-        margin: 10px;
-        cursor: pointer;
-    }
-</style>
-

customProps

If you use a custom component you can pass your custom props from the datepicker via this prop

  • Type: Record<string, unknown>
  • Default: null

Also, you can use the provideopen in new window function and provide needed props from the parent component

Code Example
<template>
-  <Datepicker :customProps="customProps" v-model="date" />
-</template>
-
-<script>
-import { ref, reactive } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        // We can access this object in our custom components
-        const customProps = reactive({
-          foo: 'bar',
-          hello: 'hi'
-        });
-        
-        return {
-            date,
-            customProps,
-        }
-    }
-}
-</script>
-
Last Updated:
- - - diff --git a/docs/api/events/index.html b/docs/api/events/index.html deleted file mode 100644 index 890869e..0000000 --- a/docs/api/events/index.html +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - - Events | Vue 3 Datepicker - - - - -
Vue 3 Datepicker

Events

List of available events that are emitted on some action

@update:modelValue

This event is emitted when the value is selected. This is a v-model binding event

@textSubmit

When textInput prop is set to true and enterSubmit is set to true in textInputOptions, when enter button is pressed, this event will be emitted

@open

Emitted when the datepicker menu is opened

@closed

Emitted when the datepicker menu is closed

@cleared

Emitted when the value is cleared on clear button

@focus

Emitted when the datepicker menu is open

@blur

Emitted when the datepicker menu is closed

@internalModelChange

Emitted when the internal modelValue is changed before selecting this date that will be set to v-model

@recalculatePosition

Emitted when the menu position is recalculated

@flowStep

Emitted when the flow step is triggered

Will have one param

  • step: Executed flow step

@updateMonthYear

Emitted when the month or year is changed

Will have one param

  • { instance: number, value: number, isMonth: boolean }: The received parameter is an object containing instance (in case of multiple calendars), value is selected value, and isMonth indicating if it is month or year
Last Updated:
- - - diff --git a/docs/api/methods/index.html b/docs/api/methods/index.html deleted file mode 100644 index cedbe1f..0000000 --- a/docs/api/methods/index.html +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - - Methods | Vue 3 Datepicker - - - - -
Vue 3 Datepicker

Methods

List of available methods that you can call on the datepicker from the external code

Add a ref to the component, and call the method on that ref

selectDate

When called and there is an active selection, it will select that date.

closeMenu

Closes the datepicker menu

openMenu

Opens the datepicker menu

clearValue

Clears the selected value

Last Updated:
- - - diff --git a/docs/api/props/index.html b/docs/api/props/index.html deleted file mode 100644 index 89ab9bc..0000000 --- a/docs/api/props/index.html +++ /dev/null @@ -1,1829 +0,0 @@ - - - - - - - - - Props | Vue 3 Datepicker - - - - -
Vue 3 Datepicker

Props

List of available props

Info

  • When checking examples, for boolean prop types, the example will show opposite behavior than what is set for the default value
  • If you use the component in the browser <script> tag, make sure to pass multi-word props with -, for example, is24 as is-24 and so on

Modes

Set the default mode for the datepicker

Info

Depending on the mode, v-model might be different, so make sure to use the proper configuration

range

Range picker mode

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" range />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoRange

Predefine range to select

Info

range prop must be enabled

  • Type: number | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" range auto-range="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

multiCalendars

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 true, 2 calendars will be shown automatically.

Info

range prop must be enabled

  • Type: boolean | number | string
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" range multiCalendars />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        onMounted(() => {
-          const startDate = new Date();
-          const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-          date.value = [startDate, endDate];
-        })
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

monthPicker

Change datepicker mode to select only month and year

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="month" monthPicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const month = ref({ 
-            month: new Date().getMonth(),
-            year: new Date().getFullYear()
-        });
-        
-        return {
-            month,
-        }
-    }
-}
-</script>
-

timePicker

Change datepicker mode to select only time

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="time" timePicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const time = ref({ 
-            hours: new Date().getHours(),
-            minutes: new Date().getMinutes()
-        });
-        
-        return {
-            time,
-        }
-    }
-}
-</script>
-

textInput

When enabled, will try to parse the date from the user input. You can also adjust the default behavior by providing text input options

Text input works with all picker modes.

  • Type: boolean
  • Default: false

Drawbacks:

  • Validation properties will not work in the text input
Code Example
<template>
-    <Datepicker v-model="date" placeholder="Start Typing ..." textInput />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

inline

Removes the input field and places the calendar in your parent component

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" inline autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiDates

Allow selecting multiple single dates. When changing time, the latest selected date is affected. To deselect the date, click on the selected value

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" multiDates />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

flow

Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset

  • Type: ('month' | 'year' | 'calendar' | 'time' | 'minutes' | 'hours' | 'seconds')[]
  • Default: []
Code Example
<template>
-    <Datepicker v-model="date" :flow="flow" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const flow = ref(['month', 'year', 'calendar']);
-        
-        return {
-          date,
-          flow,
-        }
-    }
-}
-</script>
-

utc

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

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" utc />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

weekPicker

Select a specific week range

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" weekPicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        // On selection, it will be the first and the last day of the week
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

Modes configuration

Props for configuring and extending the datepicker when using a specific mode

partialRange

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 null

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" range :partialRange="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

presetRanges

When configured, it will provide a sidebar with configured range that user can select

Info

range prop must be enabled

  • Type: { label: string; range: Date[] | string[] }[]
  • Default: []
Code Example
<template>
-    <Datepicker v-model="date" range :presetRanges="presetRanges" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { endOfMonth, endOfYear, startOfMonth, startOfYear, subMonths } from 'date-fns';
-
-export default {
-    setup() {
-        const date = ref();
-
-        const presetRanges = ref([
-          { label: 'Today', range: [new Date(), new Date()] },
-          { label: 'This month', range: [startOfMonth(new Date()), endOfMonth(new Date())] },
-          {
-            label: 'Last month',
-            range: [startOfMonth(subMonths(new Date(), 1)), endOfMonth(subMonths(new Date(), 1))],
-          },
-          { label: 'This year', range: [startOfYear(new Date()), endOfYear(new Date())] },
-        ]);
-        
-        return {
-          date,
-          presetRanges,
-        }
-    }
-}
-</script>
-

Info

range prop must be enabled

minRange

Set minimal range available for selection. This is the number of days between the selected start and end date

Info

range prop must be enabled

  • Type: number | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" range minRange="3" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

maxRange

Set maximal range available for selection. This is the number of days between the selected start and end date

Info

range prop must be enabled

  • Type: number | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" range maxRange="7" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

fixedStart

Allows only adjustment of the second date in the defined range

Info

range prop must be enabled

WARNING

v-model must be provided with both dates.

Should not be used in combination with fixedEnd

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" range fixedStart :clearable="false" />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

fixedEnd

Allows only adjustment of the first date in the defined range

Info

range prop must be enabled

WARNING

v-model must be provided with both dates.

Should not be used in combination with fixedStart

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" range fixedEnd :clearable="false" />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiCalendarsSolo

When enabled, both calendars will be independent of each other

Info

range and multiCalendars props must be enabled

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" range multiCalendars multiCalendarsSolo />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        onMounted(() => {
-          const startDate = new Date();
-          const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-          date.value = [startDate, endDate];
-        })
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

textInputOptions

Configuration for textInput prop

  • Type: { enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }
  • Default: { enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: '-' }

Properties explanation:

  • enterSubmit: When enabled, pressing enter will select a date if the input value is a valid date object
  • tabSubmit: When enabled, pressing tab will select a date if the input value is a valid date object
  • openMenu: When enabled, opens the menu when clicking on the input field
  • format: Override the default parsing format. Default is the string value from format
  • rangeSeparator: If you use range mode, the default separator is -, you can change it here
Code Example
<template>
-    <Datepicker 
-      v-model="date"
-      placeholder="Start Typing ..."
-      textInput
-      :textInputOptions="textInputOptions" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const textInputOptions = ref({
-          format: 'MM.dd.yyyy'
-        })
-        
-        return {
-            date,
-            textInputOptions,
-        }
-    }
-}
-</script>
-

modeHeight

If you use monthPicker and timePicker, set custom height of the picker in px

  • Type: number | string
  • Default: 255
Code Example
<template>
-    <Datepicker v-model="time" timePicker modeHeight="120" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const time = ref({ 
-            hours: new Date().getHours(),
-            minutes: new Date().getMinutes()
-        });
-        
-        return {
-            time,
-        }
-    }
-}
-</script>
-

inlineWithInput

Use input with the inline mode, useful if you enable textInput

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" inline inlineWithInput autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiDatesLimit

Limit the number of dates to select when multiDates is enabled

  • Type: number | string
  • Default: null
Code Example
<template>
-  <Datepicker v-model="date" multiDates multiDatesLimit="3" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-  setup() {
-    const date = ref();
-
-    return {
-      date,
-    }
-  }
-}
-</script>
-

Formatting

Format options for the value displayed in the input or preview

format

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

  • Type: string | (params: Date | Date[]) => string
  • Default:
    • Single picker: 'MM/dd/yyyy HH:mm'
    • Range picker: 'MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm'
    • Month picker: 'MM/yyyy'
    • Time picker: 'HH:mm'
    • Time picker range: 'HH:mm - HH:mm'

Info

If is24 prop is set to false, hours format will be changed to 'hh:mm aa'

For additional information on how to pass custom string format you can check Unicode tokensopen in new window

Code Example
<template>
-    <Datepicker v-model="date" :format="format" />
-</template>
-
-<script>
-// Example using a custom format function
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // In case of a range picker, you'll receive [Date, Date]
-        const format = (date) => {
-            const day = date.getDate();
-            const month = date.getMonth() + 1;
-            const year = date.getFullYear();
-
-            return `Selected date is ${day}/${month}/${year}`;
-        }
-        
-        return {
-            date,
-            format,
-        }
-    }
-}
-</script>
-

previewFormat

Format the value of the date(s) in the action row

  • Type: string | (params: Date | Date[]) => string
  • Default: null

Same configuration as in format prop

Note: If not provided, it will auto inherit data from the format prop

Code Example
<template>
-    <Datepicker v-model="date" :previewFormat="format" />
-</template>
-
-<script>
-// Example using a custom format function
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // In case of a range picker, you'll receive [Date, Date]
-        const format = (date) => {
-            const day = date.getDate();
-            const month = date.getMonth() + 1;
-            const year = date.getFullYear();
-
-            return `Selected date is ${day}/${month}/${year}`;
-        }
-
-        return {
-            date,
-            format,
-        }
-    }
-}
-</script>
-

monthNameFormat

Set the month name format

  • Type: 'short' | 'long'
  • Default: 'short'
Code Example
<template>
-    <Datepicker v-model="date" monthNameFormat="long" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Localization

Localization options and label props

locale

Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names

  • Type: string
  • Default: 'en-US'
Code Example
<template>
-    <Datepicker v-model="date" locale="de" cancelText="abbrechen" selectText="auswählen" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

formatLocale

Specify localized format output. This prop uses Locale object from date-fns library

For more info about supported locales or adding a custom locale object, please visit date-fns documentationopen in new window

  • Type: Locale
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :format-locale="ja" format="E" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { ja } from 'date-fns/locale';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-            ja,
-        }
-    }
-}
-</script>
-

selectText

Select text label in the action row

  • Type: string
  • Default: 'Select'
Code Example
<template>
-    <Datepicker v-model="date" selectText="Pick" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

cancelText

Cancel text label in the action row

  • Type: string
  • Default: 'Cancel'
Code Example
<template>
-    <Datepicker v-model="date" cancelText="Close" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

nowButtonLabel

Change the text for now button

  • Type: string
  • Default: 'Now'
Code Example
<template>
-    <Datepicker v-model="date" showNowButton nowButtonLabel="Current" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

weekNumName

Sets the label for the week numbers column

  • Type: string
  • Default: 'W'
Code Example
<template>
-    <Datepicker v-model="date" weekNumbers weekNumName="We" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

General configuration

General behavior props configuration

uid

Pass an id to the input and menu elements. If provided, you can select menu id as dp-menu-${uid} and input id as dp-input-${uid}

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" uid="demo" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

monthChangeOnScroll

Scrolling the mouse wheel over the calendar will change the month. Scroll up for next month and vice versa

You can also set the value to 'inverse', so that scroll up will go to the previous month and down on the next

  • Type: boolean | 'inverse'
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :monthChangeOnScroll="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

modelValue v-model

v-model binding

  • Type:
    • Single picker: Date | string
      • In case of multiDates it will be Date[] | string[]
    • Month picker: { month: number | string; year: number | string }
    • Time picker: { hours: number | string; minutes: number | string; seconds?: number | string }
    • Week picker: [Date, Date] | [string, string]
    • Range picker: [Date, Date] | [string | string]
      • If you use time picker, it will be { hours: number | string; minutes: number | string; seconds?: number | string }[]
      • If you use month picker, it will be { month: number | string; year: number | string }[]
  • Default: null
Code Example
<template>
-   <div>
-       <Datepicker id="manual" :modelValue="date" @update:modelValue="setDate" />
-       <Datepicker id="auto" v-model="date" />
-   </div>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        const setDate = (value) => {
-            date.value = value;
-        }
-        
-        return {
-            date,
-            setDate,
-        }
-    }
-}
-</script>
-

clearable

Add a clear icon to the input field where you can set the value to null

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :clearable="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

closeOnScroll

Close datepicker menu on page scroll

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" closeOnScroll />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoApply

If set to true, clicking on a date value will automatically select the value

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

placeholder

Input placeholder

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noToday

Hide today mark from the calendar

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" noToday />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

closeOnAutoApply

If set to false, 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

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" autoApply :closeOnAutoApply="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

markers

Add markers to the specified dates with (optional) tooltips

  • Type:
{ 
-date: Date | string;
-type?: 'dot' | 'line';
-tooltip?: { text: string; color?: string }[];
-color?: string;
-}[]
-
  • Default: []
Code Example
<template>
-    <Datepicker v-model="date" :markers="markers" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import addDays from 'date-fns/addDays';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const markers = ref([
-          {
-            date: addDays(new Date(), 1),
-            type: 'dot',
-            tooltip: [{ text: 'Dot with tooltip', color: 'green' }],
-          },
-          {
-            date: addDays(new Date(), 2),
-            type: 'line',
-            tooltip: [
-              { text: 'First tooltip', color: 'blue' },
-              { text: 'Second tooltip', color: 'yellow' },
-            ],
-          },
-          {
-            date: addDays(new Date(), 3),
-            type: 'dot',
-            color: 'yellow',
-          },
-        ])
-        
-        return {
-            date,
-          markers,
-        }
-    }
-}
-</script>
-

showNowButton

Enable button to select current date and time

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" showNowButton />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

disabled

Disables the input

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" disabled />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

readonly

Sets the input in readonly state

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" readonly />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

required

Add required flag to the input field. Use with form tag for built-in validation

  • Type: boolean
  • Default: false
Code Example
<template>
-    <form @submit.prevent="submitForm">
-      <Datepicker v-model="date" required />
-      <button type="submit">Submit form</button>
-    </form>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        const submitForm = () => {
-          alert('Form submitted');
-        }
-        
-        return {
-            date,
-            submitForm,
-        }
-    }
-}
-</script>
-

name

Sets the input name attribute

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" name="date-picker" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autocomplete

Sets the input autocomplete attribute

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" autocomplete="off" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

keepActionRow

When enabled, it will keep the action row even if the autoApply prop is enabled

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" autoApply keepActionRow :closeOnAutoApply="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Calendar configuration

Configure calendar options such as behavior or available dates

weekNumbers

Display week numbers in the calendar

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" weekNumbers />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hideOffsetDates

Hide dates from the previous/next month in the calendar

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" hideOffsetDates />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minDate

All dates before the given date will be disabled

  • Type: Date | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :minDate="new Date()" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

maxDate

All dates after the given date will be disabled

  • Type: Date | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :maxDate="new Date()" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

preventMinMaxNavigation

Prevent navigation after or before the minDate or mixDate

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" :minDate="minDate" :maxDate="maxDate" preventMinMaxNavigation />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { addMonths, getMonth, getYear, subMonths } from 'date-fns';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // 2 months before and after the current date
-        const minDate = computed(() => subMonths(new Date(getYear(new Date()), getMonth(new Date())), 2));
-        const maxDate = computed(() => addMonths(new Date(getYear(new Date()), getMonth(new Date())), 2));
-        
-        return {
-            date,
-            minDate,
-            maxDate
-        }
-    }
-}
-</script>
-

startDate

Open the datepicker to some preselected month and year

  • Type: Date | string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :startDate="startDate" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const startDate = ref(new Date(2020, 1));
-        
-        return {
-            date,
-            startDate,
-        }
-    }
-}
-</script>
-

weekStart

Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday

  • Type: number | string
  • Default: 1
Code Example
<template>
-    <Datepicker v-model="date" weekStart="0" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

filters

Disable specific values from being selected in the month, year, and time picker overlays

  • Type:
{
-  months?: number[]; // 0 = Jan, 11 - Dec
-  years?: number[]; // Array of years to disable
-  times?: {
-    hours?: number[]; // disable specific hours
-    minutes?: number[]; // disable sepcific minutes
-    seconds?: number[] // disable specific seconds
-  }
-}
-
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :filters="filters" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { getMonth, addMonths } from 'date-fns'
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-        // For demo purposes, disable the next 3 months from the current month
-        const filters = computed(() => {
-          const currentDate = new Date()
-          return {
-            months: Array.from(Array(3).keys())
-                    .map((item) => getMonth(addMonths(currentDate, item + 1)))
-          }
-        })
-        
-        return {
-            filters,
-            date,
-        }
-    }
-}
-</script>
-

disableMonthYearSelect

Removes the month and year picker

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" disableMonthYearSelect />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

yearRange

Specify start and end year for years to generate

  • Type: [number, number]
  • Default: [1900, 2100]
Code Example
<template>
-    <Datepicker v-model="date" :yearRange="[2020, 2040]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

reverseYears

Reverse the order of the years in years overlay

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" reverseYears :yearRange="[2020, 2040]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

allowedDates

Allow only specific dates

  • Type: string[] | Date[]
  • Default: []
Code Example
<template>
-    <Datepicker v-model="date" :allowedDates="allowedDates" />
-</template>
-
-<script>
-import { ref, computed } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        // For demo purposes, enable only today and tomorrow
-        const allowedDates = computed(() => {
-          return [
-            new Date(),
-            new Date(new Date().setDate(new Date().getDate() + 1))
-          ];
-        });
-        
-        return {
-            date,
-          allowedDates,
-        }
-    }
-}
-</script>
-

disabledDates

Disable specific dates

  • Type: Date[] | string[] | (date: Date) => boolean
  • Default: []

Note: If you use a custom function, make sure to return true for a disabled date and false for enabled

Code Example
<template>
-    <Datepicker v-model="date" :disabledDates="disabledDates" />
-</template>
-
-<script>
-import { ref, computed } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-        // For demo purposes disables the next 2 days from the current date
-        const disabledDates = computed(() => {
-            const today = new Date();
-            
-            const tomorrow = new Date(today)
-            tomorrow.setDate(tomorrow.getDate() + 1)
-            
-            const afterTomorrow = new Date(tomorrow);
-            afterTomorrow.setDate(tomorrow.getDate() + 1);
-            
-            return [tomorrow, afterTomorrow]
-        })
-        
-        return {
-            disabledDates,
-            date,
-        }
-    }
-}
-</script>
-

disabledWeekDays

Disable specific days from the week

  • Type: string[] | number[] - 0-6, 0 is Sunday, 6 is Saturday
  • Default: []
Code Example
<template>
-    <Datepicker v-model="date" :disabledWeekDays="[6, 0]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Time picker configuration

Props to configure time picker, whether using it only as time picker or alongside the datepicker

enableTimePicker

Enable or disable time picker

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :enableTimePicker="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

is24

Whether to use 24H or 12H mode

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :is24="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

enableSeconds

Enable seconds in the time picker

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hoursIncrement

The value which is used to increment hours via arrows in the time picker

  • Type: number | string
  • Default: 1
Code Example
<template>
-    <Datepicker v-model="date" hoursIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutesIncrement

The value which is used to increment minutes via arrows in the time picker

  • Type: number | string
  • Default: 1
Code Example
<template>
-    <Datepicker v-model="date" minutesIncrement="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

secondsIncrement

The value which is used to increment seconds via arrows in the time picker

  • Type: number | string
  • Default: 1
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds secondsIncrement="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hoursGridIncrement

The value which is used to increment hours when showing hours overlay

It will always start from 0 until it reaches 24 or 12 depending on the is24 prop

  • Type: number | string
  • Default: 1
Code Example
<template>
-    <Datepicker v-model="date" hoursGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutesGridIncrement

The value which is used to increment minutes when showing minutes overlay

It will always start from 0 to 60 minutes

  • Type: number | string
  • Default: 5
Code Example
<template>
-    <Datepicker v-model="date" minutesGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

secondsGridIncrement

The value which is used to increment seconds when showing seconds overlay

  • Type: number | string
  • Default: 5
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds secondsGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noHoursOverlay

Disable overlay for the hours, only arrow selection will be available

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" noHoursOverlay />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noMinutesOverlay

Disable overlay for the minutes, only arrow selection will be available

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" noMinutesOverlay />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noSecondsOverlay

Disable overlay for the seconds, only arrow selection will be available

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" noSecondsOverlay enableSeconds />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minTime

Sets the minimal available time to pick

  • Type: { hours?: number | string; minutes?: number | string; seconds?: number | string }
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :minTime="{ hours: 11, minutes: 30 }" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

maxTime

Sets the maximal available time to pick

  • Type: { hours?: number | string; minutes?: number | string; seconds?: number | string }
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :maxTime="{ hours: 11, minutes: 30 }" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

startTime

Set some default starting time

  • Type:
    • Single picker: { hours?: number | string; minutes?: number | string; seconds?: number | string }
    • Range picker: { hours?: number | string; minutes?: number | string; seconds?: number | string }[]
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :startTime="startTime" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const startTime = ref({ hours: 0, minutes: 0 });
-        
-        return {
-            date,
-            startTime,
-        }
-    }
-}
-</script>
-

Positioning

Configure datepicker menu positioning

position

Datepicker menu position

  • Type: 'left' | 'center' | 'right'
  • Default: 'center'
Code Example
<template>
-    <Datepicker v-model="date" position="left" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoPosition

When enabled, based on viewport space available it will automatically position the menu above or bellow input field

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :autoPosition="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

altPosition

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 true, 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.

  • Type: boolean | ((el: HTMLElement | undefined) => { top: string; left: string; transform: string })
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" altPosition />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

teleport

Set teleport target

  • Type: string
  • Default: 'body'

You can inspect the page and check the menu placement

Code Example
<template>
-    <Datepicker v-model="date" teleport="#app" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Keyboard

Configure keyboard actions

Info

You can press tab key in the menu, and it will autofocus elements, pressing enter will do a click action like open overlay or select a date.

All keyboard events are enabled by default

openMenuOnFocus

Pressing tab in the form, datepicker menu will open

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :openMenuOnFocus="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

escClose

Esc key closes the menu

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :escClose="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

spaceConfirm

space key selects the date (like you pressed the select button)

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :spaceConfirm="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

monthChangeOnArrows

Change months via arrow keys

  • Type: boolean
  • Default: true
Code Example
<template>
-    <Datepicker v-model="date" :monthChangeOnArrows="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Look and feel

Customization options

transitions

Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in transitionsopen in new window component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop

  • Type: boolean | {open?: string; close?: string; next?: string; previous?: string}
  • Default: true

open and close are added on overlays show/hide

next and previous are added when switching months in the calendar

Code Example
<template>
-    <Datepicker v-model="date" :transitions="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

dark

Theme switch between the dark and light mode

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" dark />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hideInputIcon

Hide calendar icon in the input field

  • Type: boolean
  • Default: false
Code Example
<template>
-    <Datepicker v-model="date" hideInputIcon />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

state

Validation state of the calendar value. Sets the green/red border depending on the value

  • Type: boolean
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" :state="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

inputClassName

Add a custom class to the input field

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" inputClassName="dp-custom-input" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-input {
-  box-shadow: 0 0 6px #1976d2;
-  color: #1976d2;
-
-  &:hover {
-    border-color: #1976d2;
-  }
-}
-</style>
-

Add a custom class to the datepicker menu wrapper

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" menuClassName="dp-custom-menu" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-menu {
-  box-shadow: 0 0 6px #1976d2;
-}
-</style>
-

calendarClassName

Add a custom class to the calendar wrapper

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" calendarClassName="dp-custom-calendar" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-calendar {
-  .dp__calendar_item {
-    border: 1px solid var(--dp-border-color-hover);
-  }
-}
-</style>
-

calendarCellClassName

Add a custom class to the calendar cell wrapper

  • Type: string
  • Default: null
Code Example
<template>
-    <Datepicker v-model="date" calendarCellClassName="dp-custom-cell" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-cell {
-  border-radius: 50%;
-}
-</style>
-
Last Updated:
- - - diff --git a/docs/api/slots/index.html b/docs/api/slots/index.html deleted file mode 100644 index a462c1a..0000000 --- a/docs/api/slots/index.html +++ /dev/null @@ -1,715 +0,0 @@ - - - - - - - - - Slots | Vue 3 Datepicker - - - - -
Vue 3 Datepicker

Slots

Below is a list of available slots which you can use to change some default elements of the datepicker

Content

Customize parts in the datepicker menu

calendar-header

Replace the content in the calendar header cells

Available props are:

  • day: Displayed value in the header cell
  • index: Column index it is rendered by
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #calendar-header="{ index, day }">
-        <div :class="index === 5 || index === 6 ? 'red-color' : ''">
-          {{ day }}
-        </div>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-      
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .red-color {
-        color: red;
-    }
-</style>
-

day

This slot allows you to place custom content in the calendar

This slot will also provide 2 props when used

  • day: This is the day number displayed in the calendar
  • date: This is the date value from that day
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #day="{ day, date }">
-            <temlplate v-if="day === tomorrow">
-              <img class="slot-icon" src="/logo.png"/>
-            </temlplate>
-            <template v-else>
-              {{ day }}
-            </template>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const tomorrow = ref(new Date().getDate() + 1);
-        
-        return {
-            date,
-            tomorrow,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

action-select

This slot replaces the select and cancel button section in the action row

Code Example
<template>
-    <Datepicker v-model="date" ref="dp">
-      <template #action-select>
-        <p class="custom-select" @click="selectDate">Select</p>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const dp = ref();
-        
-        const selectDate = () => {
-          ref.value.selectDate();
-        }
-        
-        return {
-            date,
-            dp,
-            selectDate,
-        }
-    }
-}
-</script>
-
-<style>
-    .custom-select {
-      cursor: pointer;
-      color: var(--c-text-accent);
-      margin: 0;
-      display: inline-block;
-    }
-</style>
-

action-preview

This slot replaces the date preview section in the action row

This slot will provide one prop

  • value: Current selection in the picker, this can be Date object, or in case of range, Date array
Code Example
<template>
-    <Datepicker v-model="date" ref="dp">
-      <template #action-preview="{ value }">
-        {{ getDate(value) }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const dp = ref();
-      
-        const getDate = (dateVal) => {
-          const newDate = new Date(dateVal);
-
-          return `Selected ${newDate.getDate()}`;
-        }
-        
-        return {
-            date,
-            dp,
-            getDate,
-        }
-    }
-}
-</script>
-

now-button

This slot replaces the content in the now button wrapper

TIP

To use this slot, make sure that showNowButton prop is enabled

One prop is available:

  • selectCurrentDate - Function to call to select the date
Code Example
<template>
-    <Datepicker v-model="date" showNowButton>
-      <template #now-button="{ selectCurrentDate }">
-        <span @click="selectCurrentDate()" title="Select current date">
-          <img class="slot-icon" src="/logo.png" />
-        </span>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-  .slot-icon {
-    height: 20px;
-    width: auto;
-    cursor: pointer;
-  }
-</style>
-

am-pm-button

This slot replaces the am-pm button in the time picker when the is24 prop is set to false

Two props are available:

  • toggle - Function to call to switch AM/PM
  • value - Currently active mode, AM or PM
Code Example
<template>
-    <Datepicker v-model="date" showNowButton>
-      <template #am-pm-button="{ toggle, value }">
-        <button @click="toggle">{{ value }}</button>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Trigger and input

Use custom input or trigger element

trigger

This slot replaces the input element with your custom element

This is some custom clickable text that will open datepicker

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #trigger>
-            <p class="clickable-text">This is some custom clickable text that will open the datepicker</p>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .clickable-text {
-        color: #1976d2;
-        cursor: pointer;
-    }
-</style>
-

dp-input

This slot replaces the input field. The difference from the trigger slot is that you will have access to the input field properties

Available props are:

TIP

For functions to work correctly, make sure that the textInput prop is enabled

When calling onInput function, make sure to pass the input event as argument

  • value: Value displayed in the input field
    • type: string
  • onInput: Function called on the @input event
    • type: (event: Event) => void
  • onEnter: Function called on the @keydown.enter event
    • type: () => void
  • onTab: Function called on the @keydown.tab event
    • type: () => void
  • onClear: Function to call if you want to clear date
    • type: () => void
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #dp-input="{ value, onInput, onEnter, onTab, onClear }">
-          <input type="text" :value="value" />
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Icons

Change datepicker icons

input-icon

This slot replaces the calendar icon in the input element with your custom element

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #input-icon>
-            <img class="input-slot-image" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .input-slot-image {
-        height: 20px;
-        width: auto;
-        margin-left: 5px;
-    }
-</style>
-

clear-icon

This slot replaces the clear icon in the input element with your custom element

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #clear-icon="{ clear }">
-            <img class="input-slot-image" src="/logo.png" @click="clear" />
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .input-slot-image {
-        height: 20px;
-        width: auto;
-        margin-right: 5px;
-    }
-</style>
-

clock-icon

This slot replaces the default clock icon used to select the time

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #clock-icon>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-left

This slot replaces the arrow left icon on the month/year select row

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-left>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-right

This slot replaces the arrow right icon on the month/year select row

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-right>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-up

This slot replaces the arrow up icon in the time picker

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-up>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-       margin: 0 auto;
-    }
-</style>
-

arrow-down

This slot replaces the arrow down icon in the time picker

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-down>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-        margin: 0 auto;
-    }
-</style>
-

calendar-icon

This slot replaces the back to calendar icon

Code Example
<template>
-    <Datepicker v-model="date">
-        <template #calendar-icon>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

Overlay

Customize overlay and overlay triggers

time-picker-overlay

This slot replaces the full overlay in the timepicker

Several props are available:

  • range: Value passed from general props
  • hours: Selected hours value
  • minutes: Selected minutes value
  • seconds: Selected seconds value
  • setHours: Function to call to set hours, (hours: number | number[]) => void
  • setMinutes: Function to call to set minutes, (minutes: number | number[]) => void
  • setSeconds: Function to call to set seconds, (seconds: number | number[]) => void

If you are using range mode, make sure to pass number arrays in functions

Code Example
<template>
-    <Datepicker v-model="date">
-      <template #time-picker-overlay="{ hours, minutes, setHours, setMinutes }">
-        <div class="time-picker-overlay">
-          <select class="select-input" :value="hours" @change="setHours(+$event.target.value)">
-            <option v-for="h in hoursArray" :key="h.value" :value="h.value">{{ h.text }}</option>
-          </select>
-          <select class="select-input" :value="minutes" @change="setMinutes(+$event.target.value)">
-            <option v-for="m in minutesArray" :key="m.value" :value="m.value">{{ m.text }}</option>
-          </select>
-        </div>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-      const hoursArray = computed(() => {
-        const arr = [];
-        for (let i = 0; i < 24; i++) {
-          arr.push({ text: i < 10 ? `0${i}` : i, value: i });
-        }
-        return arr;
-      });
-
-      const minutesArray = computed(() => {
-        const arr = [];
-        for (let i = 0; i < 60; i++) {
-          arr.push({ text: i < 10 ? `0${i}` : i, value: i });
-        }
-        return arr;
-      });
-        
-        return {
-            date,
-            hoursArray,
-            minutesArray,
-        }
-    }
-}
-</script>
-
-<style>
-.time-picker-overlay {
-  display: flex;
-  height: 100%;
-  flex-direction: column;
-}
-</style>
-

hours

This slot replaces the hours text between the arrows in the time picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #hours="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutes

This slot replaces the minutes text between the arrows in the time picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #minutes="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hours-overlay

This slot replaces the text in the hours overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #hours-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutes-overlay

This slot replaces the text in the minutes overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #minutes-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

month

This slot replaces the text in the month picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #month="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

year

This slot replaces the text in the year picker

One props is available

  • year: Displayed year
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #year="{ year }">
-        {{ year }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

month-overlay

This slot replaces the text in the month picker overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #month-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

year-overlay

This slot replaces the text in the month picker overlay

2 props are available, although for the year, text and value are the same

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #year-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
Last Updated:
- - - diff --git a/docs/assets/404.898af4d2.js b/docs/assets/404.898af4d2.js deleted file mode 100644 index 8f04823..0000000 --- a/docs/assets/404.898af4d2.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.232643d3.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.html.bee13de6.js b/docs/assets/404.html.bee13de6.js deleted file mode 100644 index 88b1d33..0000000 --- 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.f166316b.js b/docs/assets/404.html.f166316b.js deleted file mode 100644 index fa2a247..0000000 --- a/docs/assets/404.html.f166316b.js +++ /dev/null @@ -1 +0,0 @@ -const t={key:"v-3706649a",path:"/404.html",title:"",lang:"en-US",frontmatter:{layout:"404"},excerpt:"",headers:[],git:{},filePathRelative:null};export{t as data}; diff --git a/docs/assets/ActionRowCmp.4a513be3.js b/docs/assets/ActionRowCmp.4a513be3.js deleted file mode 100644 index f71d3d2..0000000 --- a/docs/assets/ActionRowCmp.4a513be3.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.232643d3.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.db9cd9b5.js b/docs/assets/ChevronLeftIcon.db9cd9b5.js deleted file mode 100644 index 167cc38..0000000 --- a/docs/assets/ChevronLeftIcon.db9cd9b5.js +++ /dev/null @@ -1 +0,0 @@ -import{o as e,c as o,b as s}from"./app.232643d3.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.0fc558c3.js b/docs/assets/ChevronRightIcon.0fc558c3.js deleted file mode 100644 index 9153f47..0000000 --- a/docs/assets/ChevronRightIcon.0fc558c3.js +++ /dev/null @@ -1 +0,0 @@ -import{o as e,c as o,b as s}from"./app.232643d3.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/CustomComponentsDemo.25c693b7.js b/docs/assets/CustomComponentsDemo.25c693b7.js deleted file mode 100644 index 87a8e52..0000000 --- a/docs/assets/CustomComponentsDemo.25c693b7.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.232643d3.js";import{W as _}from"./vue3-date-time-picker.esm.a2a96c39.js";import{_ as d}from"./plugin-vue_export-helper.21dcd24c.js";const l=t(()=>r(()=>import("./MonthYearCmp.68f005e3.js"),["assets/MonthYearCmp.68f005e3.js","assets/ChevronLeftIcon.db9cd9b5.js","assets/app.232643d3.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/ChevronRightIcon.0fc558c3.js"])),k=t(()=>r(()=>import("./TimePickerCmp.bef2c083.js"),["assets/TimePickerCmp.bef2c083.js","assets/app.232643d3.js","assets/plugin-vue_export-helper.21dcd24c.js"])),C=t(()=>r(()=>import("./ActionRowCmp.4a513be3.js"),["assets/ActionRowCmp.4a513be3.js","assets/app.232643d3.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/DarkDemo.39a7eaf3.js b/docs/assets/DarkDemo.39a7eaf3.js deleted file mode 100644 index 12c9095..0000000 --- a/docs/assets/DarkDemo.39a7eaf3.js +++ /dev/null @@ -1 +0,0 @@ -import{W as n}from"./vue3-date-time-picker.esm.a2a96c39.js";import{r as l,o as p,c,a as s}from"./app.232643d3.js";import{_ as d}from"./plugin-vue_export-helper.21dcd24c.js";const m={components:{Datepicker:n},props:["placeholder"],data(){return{date:new Date}}},i={class:"demo-wrap"};function _(u,e,r,f,o,k){const a=l("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/Demo.def40e7a.js b/docs/assets/Demo.def40e7a.js deleted file mode 100644 index 2104fd7..0000000 --- a/docs/assets/Demo.def40e7a.js +++ /dev/null @@ -1 +0,0 @@ -import{W as o}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as i,r as l,o as m,c as d,a as c,E as u}from"./app.232643d3.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/DemoMarkers.9ee96681.js b/docs/assets/DemoMarkers.9ee96681.js deleted file mode 100644 index 20bfd4e..0000000 --- a/docs/assets/DemoMarkers.9ee96681.js +++ /dev/null @@ -1 +0,0 @@ -import{W as n,a as t}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as d,r as l,o as p,c,a as m}from"./app.232643d3.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:n},data(){return{date:new Date,dark:!0}},mounted(){this.dark=d()},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=l("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/DemoSlots.38ac3494.js b/docs/assets/DemoSlots.38ac3494.js deleted file mode 100644 index 5751145..0000000 --- a/docs/assets/DemoSlots.38ac3494.js +++ /dev/null @@ -1 +0,0 @@ -import{W as k}from"./vue3-date-time-picker.esm.a2a96c39.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.232643d3.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),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},p=["onClick"],z=l("img",{class:"slot-icon",src:i},null,-1),F=[z],R=["onClick"],W={class:"time-picker-overlay"},E=["value","onChange"],j=["value"],q=["value","onChange"],G=["value"];function J(r,o,t,K,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(()=>[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"},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",W,[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 $=B(I,[["render",J]]);export{$ as default}; diff --git a/docs/assets/DisabledDatesDemo.076cf55d.js b/docs/assets/DisabledDatesDemo.076cf55d.js deleted file mode 100644 index 7209ea1..0000000 --- a/docs/assets/DisabledDatesDemo.076cf55d.js +++ /dev/null @@ -1 +0,0 @@ -import{W as n}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as c,r as m,o as l,c as p,a as D}from"./app.232643d3.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/EmptyDemo.a361e8da.js b/docs/assets/EmptyDemo.a361e8da.js deleted file mode 100644 index c403561..0000000 --- a/docs/assets/EmptyDemo.a361e8da.js +++ /dev/null @@ -1 +0,0 @@ -import{W as i}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as l,r as d,o as r,c as s,a as u}from"./app.232643d3.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.edad1f95.js b/docs/assets/FiltersDemo.edad1f95.js deleted file mode 100644 index 12d3037..0000000 --- a/docs/assets/FiltersDemo.edad1f95.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.232643d3.js";import{W as _,g as k,b as D}from"./vue3-date-time-picker.esm.a2a96c39.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 A=v(h,[["render",V]]);export{A as default}; diff --git a/docs/assets/FormatDemo.4d84193b.js b/docs/assets/FormatDemo.4d84193b.js deleted file mode 100644 index ea7735d..0000000 --- a/docs/assets/FormatDemo.4d84193b.js +++ /dev/null @@ -1 +0,0 @@ -import{W as c}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as l,r as m,o as p,c as u,a as f}from"./app.232643d3.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/Layout.276f5370.js b/docs/assets/Layout.276f5370.js deleted file mode 100644 index 3004f8c..0000000 --- a/docs/assets/Layout.276f5370.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,i as w,W as G,X as Q,l as C,z as B,E as pe,j 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.232643d3.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('',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/LocalizedOutput.850dc0d6.js b/docs/assets/LocalizedOutput.850dc0d6.js deleted file mode 100644 index 3597a6d..0000000 --- a/docs/assets/LocalizedOutput.850dc0d6.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.232643d3.js";import{W as c}from"./vue3-date-time-picker.esm.a2a96c39.js";import{_ as f}from"./plugin-vue_export-helper.21dcd24c.js";import{j as i}from"./index.bd0ee1f8.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 E=f(u,[["render",_]]);export{E as default}; diff --git a/docs/assets/MinMaxDemo.4dae7704.js b/docs/assets/MinMaxDemo.4dae7704.js deleted file mode 100644 index b98f26d..0000000 --- a/docs/assets/MinMaxDemo.4dae7704.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.232643d3.js";import{W as k,s as w,h as s,g as r,b as h}from"./vue3-date-time-picker.esm.a2a96c39.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 C=M(_,[["render",g]]);export{C as default}; diff --git a/docs/assets/MonthYearCmp.68f005e3.js b/docs/assets/MonthYearCmp.68f005e3.js deleted file mode 100644 index a2801ad..0000000 --- a/docs/assets/MonthYearCmp.68f005e3.js +++ /dev/null @@ -1 +0,0 @@ -import f from"./ChevronLeftIcon.db9cd9b5.js";import _ from"./ChevronRightIcon.0fc558c3.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.232643d3.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.cacfc47f.js b/docs/assets/PresetRange.cacfc47f.js deleted file mode 100644 index 1aca994..0000000 --- a/docs/assets/PresetRange.cacfc47f.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.232643d3.js";import{r,t as n,W as h,s as o}from"./vue3-date-time-picker.esm.a2a96c39.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/PreviewFormatDemo.40c8d729.js b/docs/assets/PreviewFormatDemo.40c8d729.js deleted file mode 100644 index bfd908d..0000000 --- a/docs/assets/PreviewFormatDemo.40c8d729.js +++ /dev/null @@ -1 +0,0 @@ -import{W as c}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as l,r as m,o as p,c as i,a as u}from"./app.232643d3.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/RequiredDemo.e6968359.js b/docs/assets/RequiredDemo.e6968359.js deleted file mode 100644 index c2353b2..0000000 --- a/docs/assets/RequiredDemo.e6968359.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.232643d3.js";import{W as f}from"./vue3-date-time-picker.esm.a2a96c39.js";import{_}from"./plugin-vue_export-helper.21dcd24c.js";import{j as b}from"./index.bd0ee1f8.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 w=_(k,[["render",F]]);export{w as default}; diff --git a/docs/assets/TextInputDemo.93d930c5.js b/docs/assets/TextInputDemo.93d930c5.js deleted file mode 100644 index 4d04f83..0000000 --- a/docs/assets/TextInputDemo.93d930c5.js +++ /dev/null @@ -1 +0,0 @@ -import{W as a}from"./vue3-date-time-picker.esm.a2a96c39.js";import{u as p,r as s,o as u,c as d,a as i}from"./app.232643d3.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/TimePickerCmp.bef2c083.js b/docs/assets/TimePickerCmp.bef2c083.js deleted file mode 100644 index 9508df9..0000000 --- a/docs/assets/TimePickerCmp.bef2c083.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.232643d3.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/TimezoneDemo.edbd462d.js b/docs/assets/TimezoneDemo.edbd462d.js deleted file mode 100644 index e348556..0000000 --- a/docs/assets/TimezoneDemo.edbd462d.js +++ /dev/null @@ -1 +0,0 @@ -import{f as s,u as c,r as m,o as t,c as r,a as l,x as i,i as p}from"./app.232643d3.js";import{W as _}from"./vue3-date-time-picker.esm.a2a96c39.js";import{_ as f}from"./plugin-vue_export-helper.21dcd24c.js";const k={components:{Datepicker:_},setup(){const a=s(),o=c();return{date:a,dark:o}}},u={class:"demo-wrap"},D={key:0};function V(a,o,x,e,v,C){const n=m("Datepicker");return t(),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?(t(),r("p",D,"Selected date in UTC format: "+i(e.date),1)):p("",!0)])}var B=f(k,[["render",V]]);export{B as default}; diff --git a/docs/assets/app.232643d3.js b/docs/assets/app.232643d3.js deleted file mode 100644 index ef8724c..0000000 --- a/docs/assets/app.232643d3.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!!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{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;nme(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{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{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{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r{(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{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)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>>1;Kn($e[r])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;ZtKn(n)-Kn(r)),Gt=0;Gte.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;de.__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{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;o1)for(let o=0;o!!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;n0)&&!(s&16)){if(s&8){const u=e.vnode.dynamicProps;for(let d=0;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-1,h[1]=g<0||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;iRr(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{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{for(let R=H;R{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{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{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;VJ?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=ZV)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){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{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;KD.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;Mp.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>1,e[n[a]]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;h0?$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;nt(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;aNr(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?`${e}`: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;odocument.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(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.lengthxs(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;on=>{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.13 - * (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({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;dt.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(;n1&&(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{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=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;oi&&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;sfn(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.1a431d99.js"),["assets/index.html.1a431d99.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-08a5d2dc":ce(()=>ne(()=>import("./index.html.e93974bd.js"),["assets/index.html.e93974bd.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-9014096a":ce(()=>ne(()=>import("./index.html.b98d62f4.js"),["assets/index.html.b98d62f4.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-0dd9e6a8":ce(()=>ne(()=>import("./index.html.608401f1.js"),["assets/index.html.608401f1.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-fb37d6ea":ce(()=>ne(()=>import("./index.html.09da4d30.js"),["assets/index.html.09da4d30.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-55146a0d":ce(()=>ne(()=>import("./index.html.61e260c5.js"),["assets/index.html.61e260c5.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-59de75e8":ce(()=>ne(()=>import("./index.html.997122eb.js"),["assets/index.html.997122eb.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-d446beac":ce(()=>ne(()=>import("./index.html.e981cfc0.js"),["assets/index.html.e981cfc0.js","assets/plugin-vue_export-helper.21dcd24c.js"])),"v-241ec4c4":ce(()=>ne(()=>import("./index.html.f8fb2aa2.js"),["assets/index.html.f8fb2aa2.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.cced2d39.js"),[]).then(({data:e})=>e),"v-08a5d2dc":()=>ne(()=>import("./index.html.0fac8040.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.628a0633.js"),[]).then(({data:e})=>e),"v-59de75e8":()=>ne(()=>import("./index.html.94c6d9be.js"),[]).then(({data:e})=>e),"v-d446beac":()=>ne(()=>import("./index.html.2a9ea9e2.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.898af4d2.js"),[])),Layout:ce(()=>ne(()=>import("./Layout.276f5370.js"),["assets/Layout.276f5370.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;t1&&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;Q0?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/vue3-date-time-picker"},{text:"Changelog",link:"https://github.com/Vuepic/vue3-date-time-picker/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{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.25c693b7.js"),["assets/CustomComponentsDemo.25c693b7.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DarkDemo",ce(()=>ne(()=>import("./DarkDemo.39a7eaf3.js"),["assets/DarkDemo.39a7eaf3.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("Demo",ce(()=>ne(()=>import("./Demo.def40e7a.js"),["assets/Demo.def40e7a.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DemoMarkers",ce(()=>ne(()=>import("./DemoMarkers.9ee96681.js"),["assets/DemoMarkers.9ee96681.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DemoSlots",ce(()=>ne(()=>import("./DemoSlots.38ac3494.js"),["assets/DemoSlots.38ac3494.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("DisabledDatesDemo",ce(()=>ne(()=>import("./DisabledDatesDemo.076cf55d.js"),["assets/DisabledDatesDemo.076cf55d.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("EmptyDemo",ce(()=>ne(()=>import("./EmptyDemo.a361e8da.js"),["assets/EmptyDemo.a361e8da.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("FiltersDemo",ce(()=>ne(()=>import("./FiltersDemo.edad1f95.js"),["assets/FiltersDemo.edad1f95.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("FormatDemo",ce(()=>ne(()=>import("./FormatDemo.4d84193b.js"),["assets/FormatDemo.4d84193b.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("LocalizedOutput",ce(()=>ne(()=>import("./LocalizedOutput.850dc0d6.js"),["assets/LocalizedOutput.850dc0d6.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/index.bd0ee1f8.js"]))),e.component("MinMaxDemo",ce(()=>ne(()=>import("./MinMaxDemo.4dae7704.js"),["assets/MinMaxDemo.4dae7704.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("PresetRange",ce(()=>ne(()=>import("./PresetRange.cacfc47f.js"),["assets/PresetRange.cacfc47f.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("PreviewFormatDemo",ce(()=>ne(()=>import("./PreviewFormatDemo.40c8d729.js"),["assets/PreviewFormatDemo.40c8d729.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("RequiredDemo",ce(()=>ne(()=>import("./RequiredDemo.e6968359.js"),["assets/RequiredDemo.e6968359.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/index.bd0ee1f8.js"]))),e.component("TextInputDemo",ce(()=>ne(()=>import("./TextInputDemo.93d930c5.js"),["assets/TextInputDemo.93d930c5.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("TimezoneDemo",ce(()=>ne(()=>import("./TimezoneDemo.edbd462d.js"),["assets/TimezoneDemo.edbd462d.js","assets/vue3-date-time-picker.esm.a2a96c39.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ActionRowCmp",ce(()=>ne(()=>import("./ActionRowCmp.4a513be3.js"),["assets/ActionRowCmp.4a513be3.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ChevronLeftIcon",ce(()=>ne(()=>import("./ChevronLeftIcon.db9cd9b5.js"),["assets/ChevronLeftIcon.db9cd9b5.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-ChevronRightIcon",ce(()=>ne(()=>import("./ChevronRightIcon.0fc558c3.js"),["assets/ChevronRightIcon.0fc558c3.js","assets/plugin-vue_export-helper.21dcd24c.js"]))),e.component("customComponents-MonthYearCmp",ce(()=>ne(()=>import("./MonthYearCmp.68f005e3.js"),["assets/MonthYearCmp.68f005e3.js","assets/ChevronLeftIcon.db9cd9b5.js","assets/plugin-vue_export-helper.21dcd24c.js","assets/ChevronRightIcon.0fc558c3.js"]))),e.component("customComponents-TimePickerCmp",ce(()=>ne(()=>import("./TimePickerCmp.bef2c083.js"),["assets/TimePickerCmp.bef2c083.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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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);n3)for(n=[n],i=3;i0?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;d3)for(n=[n],i=3;i=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]>>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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=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;ae.length)&&(t=e.length);for(var n=0,r=new Array(t);ne.length)&&(t=e.length);for(var n=0,r=new Array(t);n=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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;t0},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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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|<\/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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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;r0?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;te.length)&&(t=e.length);for(var n=0,r=new Array(t);n=0||(u[l]=s[l]);return u}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r=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:"",highlightPostTag:"",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.length0&&(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;te.length)&&(t=e.length);for(var n=0,r=new Array(t);n1&&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)=((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{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:'
'};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 mv?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,T0 as i,ic 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/back-to-top.8efcbe56.svg b/docs/assets/back-to-top.8efcbe56.svg deleted file mode 100644 index 8323678..0000000 --- a/docs/assets/back-to-top.8efcbe56.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/docs/assets/index.bd0ee1f8.js b/docs/assets/index.bd0ee1f8.js deleted file mode 100644 index 8ea80bf..0000000 --- a/docs/assets/index.bd0ee1f8.js +++ /dev/null @@ -1 +0,0 @@ -import{c as u,d as o,e as d,f as i}from"./vue3-date-time-picker.esm.a2a96c39.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.09da4d30.js b/docs/assets/index.html.09da4d30.js deleted file mode 100644 index 8313f6d..0000000 --- a/docs/assets/index.html.09da4d30.js +++ /dev/null @@ -1 +0,0 @@ -import{Q as e}from"./app.232643d3.js";import{_ as a}from"./plugin-vue_export-helper.21dcd24c.js";const t={},d=e('

Methods

List of available methods that you can call on the datepicker from the external code

Add a ref to the component, and call the method on that ref

selectDate

When called and there is an active selection, it will select that date.

closeMenu

Closes the datepicker menu

openMenu

Opens the datepicker menu

clearValue

Clears the selected value

',11);function r(h,n){return d}var s=a(t,[["render",r]]);export{s as default}; diff --git a/docs/assets/index.html.0fac8040.js b/docs/assets/index.html.0fac8040.js deleted file mode 100644 index d3c1b9e..0000000 --- a/docs/assets/index.html.0fac8040.js +++ /dev/null @@ -1 +0,0 @@ -const l={key:"v-08a5d2dc",path:"/installation/",title:"Installation",lang:"en-US",frontmatter:{title:"Installation",description:"Install guide for vue3-date-time-picker 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:1646933654e3},filePathRelative:"installation/README.md"};export{l as data}; diff --git a/docs/assets/index.html.1a431d99.js b/docs/assets/index.html.1a431d99.js deleted file mode 100644 index 12a0176..0000000 --- a/docs/assets/index.html.1a431d99.js +++ /dev/null @@ -1 +0,0 @@ -import{r as a,o,c as n,b as e,a as i,z as d,F as c,B as t}from"./app.232643d3.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/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},m=t("GitHub"),g=t(" and consider "),f={href:"https://github.com/sponsors/Vuepic",target:"_blank",rel:"noopener noreferrer"},k=t("sponsoring"),b=t(" its development! \u2B50"),v=e("h1",{id:"vue3-date-time-picker",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#vue3-date-time-picker","aria-hidden":"true"},"#"),t(" vue3-date-time-picker")],-1),x=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),w={href:"https://github.com/Vuepic/vue3-date-time-picker/blob/master/LICENSE",target:"_blank",rel:"noopener noreferrer"},y=e("img",{src:"https://img.shields.io/github/license/vuepic/vue3-date-time-picker",alt:"License"},null,-1),V=t(),L={href:"https://www.npmjs.com/package/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},I=e("img",{src:"https://img.shields.io/npm/v/vue3-date-time-picker.svg",alt:"npm"},null,-1),E=t(),C=e("img",{src:"https://img.shields.io/npm/dm/vue3-date-time-picker",alt:"Downloads"},null,-1),R=t(),S={href:"https://github.com/Vuepic/vue3-date-time-picker/issues",target:"_blank",rel:"noopener noreferrer"},T=e("img",{src:"https://img.shields.io/github/issues-raw/vuepic/vue3-date-time-picker",alt:"Open issues"},null,-1),N=t(),B=e("img",{src:"https://github.com/Vuepic/vue3-date-time-picker/actions/workflows/node.js.yml/badge.svg",alt:"CI"},null,-1),j=t(),z=e("img",{src:"https://img.shields.io/github/release-date/vuepic/vue3-date-time-picker",alt:"Release date"},null,-1),D=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),F=t("Getting started"),G={href:"https://codesandbox.io/s/vue3-date-time-picker-demo-5scsr?file=/src/components/Demo.vue",target:"_blank",rel:"noopener noreferrer"},H=t("CodeSandbox Playground"),M=e("h3",{id:"",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#","aria-hidden":"true"},"#")],-1),O=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),W={style:{"text-align":"center"},markdown:"1"},A=e("h2",{id:"resources",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#resources","aria-hidden":"true"},"#"),t(" Resources")],-1),P={href:"https://github.com/Vuepic/vue3-date-time-picker",target:"_blank",rel:"noopener noreferrer"},q=t("GitHub"),J={href:"https://github.com/Vuepic/vue3-date-time-picker/blob/master/LICENSE",target:"_blank",rel:"noopener noreferrer"},K=t("MIT License"),Q=e("div",{style:{"text-align":"center"},markdown:"1"}," \xA9 Vuepic 2021-2022 ",-1);function U(X,Y){const r=a("ExternalLinkIcon"),s=a("RouterLink");return o(),n(c,null,[e("div",p,[e("p",null,[u,e("a",_,[m,i(r)]),g,e("a",f,[k,i(r)]),b]),v,x,e("p",null,[e("a",w,[y,i(r)]),V,e("a",L,[I,i(r)]),E,C,R,e("a",S,[T,i(r)]),N,B,j,z]),D,e("p",null,[i(s,{to:"/installation/"},{default:d(()=>[F]),_:1})]),e("p",null,[e("a",G,[H,i(r)])])]),M,O,e("div",W,[A,e("p",null,[e("a",P,[q,i(r)])]),e("p",null,[e("a",J,[K,i(r)])])]),Q],64)}var ee=h(l,[["render",U]]);export{ee as default}; diff --git a/docs/assets/index.html.1b6f9115.js b/docs/assets/index.html.1b6f9115.js deleted file mode 100644 index cf70dfc..0000000 --- a/docs/assets/index.html.1b6f9115.js +++ /dev/null @@ -1 +0,0 @@ -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}; diff --git a/docs/assets/index.html.256dcdde.js b/docs/assets/index.html.256dcdde.js deleted file mode 100644 index 36a3cd3..0000000 --- a/docs/assets/index.html.256dcdde.js +++ /dev/null @@ -1 +0,0 @@ -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}; diff --git a/docs/assets/index.html.2a9ea9e2.js b/docs/assets/index.html.2a9ea9e2.js deleted file mode 100644 index d3a1f47..0000000 --- a/docs/assets/index.html.2a9ea9e2.js +++ /dev/null @@ -1 +0,0 @@ -const t={key:"v-d446beac",path:"/customization/scss/",title:"SCSS",lang:"en-US",frontmatter:{title:"SCSS",description:"Datepicker custom scss configuration"},excerpt:"",headers:[],git:{updatedTime:1638711662e3},filePathRelative:"customization/scss/README.md"};export{t as data}; diff --git a/docs/assets/index.html.608401f1.js b/docs/assets/index.html.608401f1.js deleted file mode 100644 index bc59dfb..0000000 --- a/docs/assets/index.html.608401f1.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.232643d3.js";import{_ as c}from"./plugin-vue_export-helper.21dcd24c.js";const l={},p=d('

Events

List of available events that are emitted on some action

@update:modelValue

This event is emitted when the value is selected. This is a v-model binding event

@textSubmit

',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('

@open

Emitted when the datepicker menu is opened

@closed

Emitted when the datepicker menu is closed

@cleared

Emitted when the value is cleared on clear button

@focus

Emitted when the datepicker menu is open

@blur

Emitted when the datepicker menu is closed

@internalModelChange

Emitted when the internal modelValue is changed before selecting this date that will be set to v-model

@recalculatePosition

Emitted when the menu position is recalculated

@flowStep

Emitted when the flow step is triggered

Will have one param

  • step: Executed flow step

@updateMonthYear

Emitted when the month or year is changed

Will have one param

  • { instance: number, value: number, isMonth: boolean }: The received parameter is an object containing instance (in case of multiple calendars), value is selected value, and isMonth indicating if it is month or year
',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.61d313f8.js b/docs/assets/index.html.61d313f8.js deleted file mode 100644 index 1911566..0000000 --- a/docs/assets/index.html.61d313f8.js +++ /dev/null @@ -1 +0,0 @@ -const t={key:"v-241ec4c4",path:"/customization/theming/",title:"Theming",lang:"en-US",frontmatter:{title:"Theming",description:"Datepicker theme configuration for light and dark theme"},excerpt:"",headers:[],git:{updatedTime:1643050843e3},filePathRelative:"customization/theming/README.md"};export{t as data}; diff --git a/docs/assets/index.html.61e260c5.js b/docs/assets/index.html.61e260c5.js deleted file mode 100644 index 18e9ef4..0000000 --- a/docs/assets/index.html.61e260c5.js +++ /dev/null @@ -1,1797 +0,0 @@ -import{r as p,o as w,c as q,a as n,b as e,F as x,Q as s,B as o}from"./app.232643d3.js";import{_ as D}from"./plugin-vue_export-helper.21dcd24c.js";const _={},T=s('

Props

List of available props

Info

  • When checking examples, for boolean prop types, the example will show opposite behavior than what is set for the default value
  • If you use the component in the browser <script> tag, make sure to pass multi-word props with -, for example, is24 as is-24 and so on

Modes

Set the default mode for the datepicker

Info

Depending on the mode, v-model might be different, so make sure to use the proper configuration

range

Range picker mode

  • Type: boolean
  • Default: false
',9),C=s(`
Code Example
<template>
-    <Datepicker v-model="date" range />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoRange

Predefine range to select

Info

range prop must be enabled

  • Type: number | string
  • Default: null
`,5),E=s(`
Code Example
<template>
-    <Datepicker v-model="date" range auto-range="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

multiCalendars

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 true, 2 calendars will be shown automatically.

Info

range prop must be enabled

  • Type: boolean | number | string
  • Default: false
`,5),j=s(`
Code Example
<template>
-    <Datepicker v-model="date" range multiCalendars />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        onMounted(() => {
-          const startDate = new Date();
-          const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-          date.value = [startDate, endDate];
-        })
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

monthPicker

Change datepicker mode to select only month and year

  • Type: boolean
  • Default: false
`,4),S=s(`
Code Example
<template>
-    <Datepicker v-model="month" monthPicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const month = ref({ 
-            month: new Date().getMonth(),
-            year: new Date().getFullYear()
-        });
-        
-        return {
-            month,
-        }
-    }
-}
-</script>
-

timePicker

Change datepicker mode to select only time

  • Type: boolean
  • Default: false
`,4),I=s(`
Code Example
<template>
-    <Datepicker v-model="time" timePicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const time = ref({ 
-            hours: new Date().getHours(),
-            minutes: new Date().getMinutes()
-        });
-        
-        return {
-            time,
-        }
-    }
-}
-</script>
-

textInput

When enabled, will try to parse the date from the user input. You can also adjust the default behavior by providing text input options

Text input works with all picker modes.

  • Type: boolean
  • Default: false

Drawbacks:

  • Validation properties will not work in the text input
`,7),M=s(`
Code Example
<template>
-    <Datepicker v-model="date" placeholder="Start Typing ..." textInput />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

inline

Removes the input field and places the calendar in your parent component

  • Type: boolean
  • Default: false
`,4),O=s(`
Code Example
<template>
-    <Datepicker v-model="date" inline autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiDates

Allow selecting multiple single dates. When changing time, the latest selected date is affected. To deselect the date, click on the selected value

  • Type: boolean
  • Default: false
`,4),A=s(`
Code Example
<template>
-    <Datepicker v-model="date" multiDates />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

flow

Define the selecting order. Position in the array will specify the execution step. When you overwrite the execution step, the flow is reset

  • Type: ('month' | 'year' | 'calendar' | 'time' | 'minutes' | 'hours' | 'seconds')[]
  • Default: []
`,4),N=s(`
Code Example
<template>
-    <Datepicker v-model="date" :flow="flow" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const flow = ref(['month', 'year', 'calendar']);
-        
-        return {
-          date,
-          flow,
-        }
-    }
-}
-</script>
-

utc

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

  • Type: boolean
  • Default: false
`,4),F=s(`
Code Example
<template>
-    <Datepicker v-model="date" utc />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

weekPicker

Select a specific week range

  • Type: boolean
  • Default: false
`,4),P=s(`
Code Example
<template>
-    <Datepicker v-model="date" weekPicker />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        // On selection, it will be the first and the last day of the week
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

Modes configuration

Props for configuring and extending the datepicker when using a specific mode

partialRange

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 null

  • Type: boolean
  • Default: true
`,6),R=s(`
Code Example
<template>
-    <Datepicker v-model="date" range :partialRange="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

presetRanges

When configured, it will provide a sidebar with configured range that user can select

Info

range prop must be enabled

  • Type: { label: string; range: Date[] | string[] }[]
  • Default: []
`,5),H=s(`
Code Example
<template>
-    <Datepicker v-model="date" range :presetRanges="presetRanges" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { endOfMonth, endOfYear, startOfMonth, startOfYear, subMonths } from 'date-fns';
-
-export default {
-    setup() {
-        const date = ref();
-
-        const presetRanges = ref([
-          { label: 'Today', range: [new Date(), new Date()] },
-          { label: 'This month', range: [startOfMonth(new Date()), endOfMonth(new Date())] },
-          {
-            label: 'Last month',
-            range: [startOfMonth(subMonths(new Date(), 1)), endOfMonth(subMonths(new Date(), 1))],
-          },
-          { label: 'This year', range: [startOfYear(new Date()), endOfYear(new Date())] },
-        ]);
-        
-        return {
-          date,
-          presetRanges,
-        }
-    }
-}
-</script>
-

Info

range prop must be enabled

minRange

Set minimal range available for selection. This is the number of days between the selected start and end date

Info

range prop must be enabled

  • Type: number | string
  • Default: null
`,6),W=s(`
Code Example
<template>
-    <Datepicker v-model="date" range minRange="3" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

maxRange

Set maximal range available for selection. This is the number of days between the selected start and end date

Info

range prop must be enabled

  • Type: number | string
  • Default: null
`,5),Y=s(`
Code Example
<template>
-    <Datepicker v-model="date" range maxRange="7" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

fixedStart

Allows only adjustment of the second date in the defined range

Info

range prop must be enabled

WARNING

v-model must be provided with both dates.

Should not be used in combination with fixedEnd

  • Type: boolean
  • Default: false
`,6),L=s(`
Code Example
<template>
-    <Datepicker v-model="date" range fixedStart :clearable="false" />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

fixedEnd

Allows only adjustment of the first date in the defined range

Info

range prop must be enabled

WARNING

v-model must be provided with both dates.

Should not be used in combination with fixedStart

  • Type: boolean
  • Default: false
`,6),B=s(`
Code Example
<template>
-    <Datepicker v-model="date" range fixedEnd :clearable="false" />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        // For demo purposes assign range from the current date
-        onMounted(() => {
-            const startDate = new Date();
-            const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-            date.value = [startDate, endDate];
-        })
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiCalendarsSolo

When enabled, both calendars will be independent of each other

Info

range and multiCalendars props must be enabled

  • Type: boolean
  • Default: false
`,5),G=s(`
Code Example
<template>
-    <Datepicker v-model="date" range multiCalendars multiCalendarsSolo />
-</template>
-
-<script>
-import { ref, onMounted } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-
-        onMounted(() => {
-          const startDate = new Date();
-          const endDate = new Date(new Date().setDate(startDate.getDate() + 7));
-          date.value = [startDate, endDate];
-        })
-        
-        return {
-          date,
-        }
-    }
-}
-</script>
-

textInputOptions

Configuration for textInput prop

  • Type: { enterSubmit?: boolean; tabSubmit?: boolean; openMenu?: boolean; format?: string; rangeSeparator?: string }
  • Default: { enterSubmit: true, tabSubmit: true, openMenu: true, rangeSeparator: '-' }

Properties explanation:

  • enterSubmit: When enabled, pressing enter will select a date if the input value is a valid date object
  • tabSubmit: When enabled, pressing tab will select a date if the input value is a valid date object
  • openMenu: When enabled, opens the menu when clicking on the input field
  • format: Override the default parsing format. Default is the string value from format
  • rangeSeparator: If you use range mode, the default separator is -, you can change it here
`,6),z=s(`
Code Example
<template>
-    <Datepicker 
-      v-model="date"
-      placeholder="Start Typing ..."
-      textInput
-      :textInputOptions="textInputOptions" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const textInputOptions = ref({
-          format: 'MM.dd.yyyy'
-        })
-        
-        return {
-            date,
-            textInputOptions,
-        }
-    }
-}
-</script>
-

modeHeight

If you use monthPicker and timePicker, set custom height of the picker in px

  • Type: number | string
  • Default: 255
`,4),V=s(`
Code Example
<template>
-    <Datepicker v-model="time" timePicker modeHeight="120" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const time = ref({ 
-            hours: new Date().getHours(),
-            minutes: new Date().getMinutes()
-        });
-        
-        return {
-            time,
-        }
-    }
-}
-</script>
-

inlineWithInput

Use input with the inline mode, useful if you enable textInput

  • Type: boolean
  • Default: false
`,4),$=s(`
Code Example
<template>
-    <Datepicker v-model="date" inline inlineWithInput autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

multiDatesLimit

Limit the number of dates to select when multiDates is enabled

  • Type: number | string
  • Default: null
`,4),U=s(`
Code Example
<template>
-  <Datepicker v-model="date" multiDates multiDatesLimit="3" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-  setup() {
-    const date = ref();
-
-    return {
-      date,
-    }
-  }
-}
-</script>
-

Formatting

Format options for the value displayed in the input or preview

format

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

  • Type: string | (params: Date | Date[]) => string
  • Default:
    • Single picker: 'MM/dd/yyyy HH:mm'
    • Range picker: 'MM/dd/yyyy HH:mm - MM/dd/yyyy HH:mm'
    • Month picker: 'MM/yyyy'
    • Time picker: 'HH:mm'
    • Time picker range: 'HH:mm - HH:mm'

Info

If is24 prop is set to false, hours format will be changed to 'hh:mm aa'

`,7),J=o("For additional information on how to pass custom string format you can check "),K={href:"https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table",target:"_blank",rel:"noopener noreferrer"},Q=o("Unicode tokens"),X=s(`
Code Example
<template>
-    <Datepicker v-model="date" :format="format" />
-</template>
-
-<script>
-// Example using a custom format function
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // In case of a range picker, you'll receive [Date, Date]
-        const format = (date) => {
-            const day = date.getDate();
-            const month = date.getMonth() + 1;
-            const year = date.getFullYear();
-
-            return \`Selected date is \${day}/\${month}/\${year}\`;
-        }
-        
-        return {
-            date,
-            format,
-        }
-    }
-}
-</script>
-

previewFormat

Format the value of the date(s) in the action row

  • Type: string | (params: Date | Date[]) => string
  • Default: null

Same configuration as in format prop

Note: If not provided, it will auto inherit data from the format prop

`,6),Z=s(`
Code Example
<template>
-    <Datepicker v-model="date" :previewFormat="format" />
-</template>
-
-<script>
-// Example using a custom format function
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // In case of a range picker, you'll receive [Date, Date]
-        const format = (date) => {
-            const day = date.getDate();
-            const month = date.getMonth() + 1;
-            const year = date.getFullYear();
-
-            return \`Selected date is \${day}/\${month}/\${year}\`;
-        }
-
-        return {
-            date,
-            format,
-        }
-    }
-}
-</script>
-

monthNameFormat

Set the month name format

  • Type: 'short' | 'long'
  • Default: 'short'
`,4),nn=s(`
Code Example
<template>
-    <Datepicker v-model="date" monthNameFormat="long" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Localization

Localization options and label props

locale

Set datepicker locale. Datepicker will use built in javascript locale formatter to extract month and weekday names

  • Type: string
  • Default: 'en-US'
`,6),sn=s(`
Code Example
<template>
-    <Datepicker v-model="date" locale="de" cancelText="abbrechen" selectText="ausw\xE4hlen" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

formatLocale

Specify localized format output. This prop uses Locale object from date-fns library

`,3),an=o("For more info about supported locales or adding a custom locale object, please visit "),tn={href:"https://date-fns.org/v2.27.0/docs/I18n",target:"_blank",rel:"noopener noreferrer"},pn=e("code",null,"date-fns documentation",-1),en=e("ul",null,[e("li",null,[o("Type: "),e("code",null,"Locale")]),e("li",null,[o("Default: "),e("code",null,"null")])],-1),on=s(`
Code Example
<template>
-    <Datepicker v-model="date" :format-locale="ja" format="E" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { ja } from 'date-fns/locale';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-            ja,
-        }
-    }
-}
-</script>
-

selectText

Select text label in the action row

  • Type: string
  • Default: 'Select'
`,4),cn=s(`
Code Example
<template>
-    <Datepicker v-model="date" selectText="Pick" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

cancelText

Cancel text label in the action row

  • Type: string
  • Default: 'Cancel'
`,4),ln=s(`
Code Example
<template>
-    <Datepicker v-model="date" cancelText="Close" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

nowButtonLabel

Change the text for now button

  • Type: string
  • Default: 'Now'
`,4),un=s(`
Code Example
<template>
-    <Datepicker v-model="date" showNowButton nowButtonLabel="Current" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

weekNumName

Sets the label for the week numbers column

  • Type: string
  • Default: 'W'
`,4),rn=s(`
Code Example
<template>
-    <Datepicker v-model="date" weekNumbers weekNumName="We" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

General configuration

General behavior props configuration

uid

Pass an id to the input and menu elements. If provided, you can select menu id as dp-menu-\${uid} and input id as dp-input-\${uid}

  • Type: string
  • Default: null
`,6),kn=s(`
Code Example
<template>
-    <Datepicker v-model="date" uid="demo" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

monthChangeOnScroll

Scrolling the mouse wheel over the calendar will change the month. Scroll up for next month and vice versa

You can also set the value to 'inverse', so that scroll up will go to the previous month and down on the next

  • Type: boolean | 'inverse'
  • Default: true
`,5),dn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :monthChangeOnScroll="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
`,1),mn={id:"modelvalue",tabindex:"-1"},bn=e("a",{class:"header-anchor",href:"#modelvalue","aria-hidden":"true"},"#",-1),gn=o(" modelValue "),yn=s(`

v-model binding

  • Type:
    • Single picker: Date | string
      • In case of multiDates it will be Date[] | string[]
    • Month picker: { month: number | string; year: number | string }
    • Time picker: { hours: number | string; minutes: number | string; seconds?: number | string }
    • Week picker: [Date, Date] | [string, string]
    • Range picker: [Date, Date] | [string | string]
      • If you use time picker, it will be { hours: number | string; minutes: number | string; seconds?: number | string }[]
      • If you use month picker, it will be { month: number | string; year: number | string }[]
  • Default: null
Code Example
<template>
-   <div>
-       <Datepicker id="manual" :modelValue="date" @update:modelValue="setDate" />
-       <Datepicker id="auto" v-model="date" />
-   </div>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        const setDate = (value) => {
-            date.value = value;
-        }
-        
-        return {
-            date,
-            setDate,
-        }
-    }
-}
-</script>
-

clearable

Add a clear icon to the input field where you can set the value to null

  • Type: boolean
  • Default: true
`,6),hn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :clearable="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

closeOnScroll

Close datepicker menu on page scroll

  • Type: boolean
  • Default: false
`,4),vn=s(`
Code Example
<template>
-    <Datepicker v-model="date" closeOnScroll />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoApply

If set to true, clicking on a date value will automatically select the value

  • Type: boolean
  • Default: false
`,4),fn=s(`
Code Example
<template>
-    <Datepicker v-model="date" autoApply />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

placeholder

Input placeholder

  • Type: string
  • Default: null
`,4),wn=s(`
Code Example
<template>
-    <Datepicker v-model="date" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noToday

Hide today mark from the calendar

  • Type: boolean
  • Default: false
`,4),qn=s(`
Code Example
<template>
-    <Datepicker v-model="date" noToday />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

closeOnAutoApply

If set to false, 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

  • Type: boolean
  • Default: true
`,4),xn=s(`
Code Example
<template>
-    <Datepicker v-model="date" autoApply :closeOnAutoApply="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

markers

Add markers to the specified dates with (optional) tooltips

  • Type:
{ 
-date: Date | string;
-type?: 'dot' | 'line';
-tooltip?: { text: string; color?: string }[];
-color?: string;
-}[]
-
  • Default: []
`,6),Dn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :markers="markers" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import addDays from 'date-fns/addDays';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const markers = ref([
-          {
-            date: addDays(new Date(), 1),
-            type: 'dot',
-            tooltip: [{ text: 'Dot with tooltip', color: 'green' }],
-          },
-          {
-            date: addDays(new Date(), 2),
-            type: 'line',
-            tooltip: [
-              { text: 'First tooltip', color: 'blue' },
-              { text: 'Second tooltip', color: 'yellow' },
-            ],
-          },
-          {
-            date: addDays(new Date(), 3),
-            type: 'dot',
-            color: 'yellow',
-          },
-        ])
-        
-        return {
-            date,
-          markers,
-        }
-    }
-}
-</script>
-

showNowButton

Enable button to select current date and time

  • Type: boolean
  • Default: false
`,4),_n=s(`
Code Example
<template>
-    <Datepicker v-model="date" showNowButton />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

disabled

Disables the input

  • Type: boolean
  • Default: false
`,4),Tn=s(`
Code Example
<template>
-    <Datepicker v-model="date" disabled />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

readonly

Sets the input in readonly state

  • Type: boolean
  • Default: false
`,4),Cn=s(`
Code Example
<template>
-    <Datepicker v-model="date" readonly />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

required

Add required flag to the input field. Use with form tag for built-in validation

  • Type: boolean
  • Default: false
`,4),En=s(`
Code Example
<template>
-    <form @submit.prevent="submitForm">
-      <Datepicker v-model="date" required />
-      <button type="submit">Submit form</button>
-    </form>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        const submitForm = () => {
-          alert('Form submitted');
-        }
-        
-        return {
-            date,
-            submitForm,
-        }
-    }
-}
-</script>
-

name

Sets the input name attribute

  • Type: string
  • Default: null
`,4),jn=s(`
Code Example
<template>
-    <Datepicker v-model="date" name="date-picker" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autocomplete

Sets the input autocomplete attribute

  • Type: string
  • Default: null
`,4),Sn=s(`
Code Example
<template>
-    <Datepicker v-model="date" autocomplete="off" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

keepActionRow

When enabled, it will keep the action row even if the autoApply prop is enabled

  • Type: boolean
  • Default: false
`,4),In=s(`
Code Example
<template>
-    <Datepicker v-model="date" autoApply keepActionRow :closeOnAutoApply="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Calendar configuration

Configure calendar options such as behavior or available dates

weekNumbers

Display week numbers in the calendar

  • Type: boolean
  • Default: false
`,6),Mn=s(`
Code Example
<template>
-    <Datepicker v-model="date" weekNumbers />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hideOffsetDates

Hide dates from the previous/next month in the calendar

  • Type: boolean
  • Default: false
`,4),On=s(`
Code Example
<template>
-    <Datepicker v-model="date" hideOffsetDates />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minDate

All dates before the given date will be disabled

  • Type: Date | string
  • Default: null
`,4),An=s(`
Code Example
<template>
-    <Datepicker v-model="date" :minDate="new Date()" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

maxDate

All dates after the given date will be disabled

  • Type: Date | string
  • Default: null
`,4),Nn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :maxDate="new Date()" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

preventMinMaxNavigation

Prevent navigation after or before the minDate or mixDate

  • Type: boolean
  • Default: false
`,4),Fn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :minDate="minDate" :maxDate="maxDate" preventMinMaxNavigation />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { addMonths, getMonth, getYear, subMonths } from 'date-fns';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        // 2 months before and after the current date
-        const minDate = computed(() => subMonths(new Date(getYear(new Date()), getMonth(new Date())), 2));
-        const maxDate = computed(() => addMonths(new Date(getYear(new Date()), getMonth(new Date())), 2));
-        
-        return {
-            date,
-            minDate,
-            maxDate
-        }
-    }
-}
-</script>
-

startDate

Open the datepicker to some preselected month and year

  • Type: Date | string
  • Default: null
`,4),Pn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :startDate="startDate" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const startDate = ref(new Date(2020, 1));
-        
-        return {
-            date,
-            startDate,
-        }
-    }
-}
-</script>
-

weekStart

Day from which the week starts. 0-6, 0 is Sunday, 6 is Saturday

  • Type: number | string
  • Default: 1
`,4),Rn=s(`
Code Example
<template>
-    <Datepicker v-model="date" weekStart="0" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

filters

Disable specific values from being selected in the month, year, and time picker overlays

  • Type:
{
-  months?: number[]; // 0 = Jan, 11 - Dec
-  years?: number[]; // Array of years to disable
-  times?: {
-    hours?: number[]; // disable specific hours
-    minutes?: number[]; // disable sepcific minutes
-    seconds?: number[] // disable specific seconds
-  }
-}
-
  • Default: null
`,6),Hn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :filters="filters" />
-</template>
-
-<script>
-import { ref } from 'vue';
-import { getMonth, addMonths } from 'date-fns'
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-        // For demo purposes, disable the next 3 months from the current month
-        const filters = computed(() => {
-          const currentDate = new Date()
-          return {
-            months: Array.from(Array(3).keys())
-                    .map((item) => getMonth(addMonths(currentDate, item + 1)))
-          }
-        })
-        
-        return {
-            filters,
-            date,
-        }
-    }
-}
-</script>
-

disableMonthYearSelect

Removes the month and year picker

  • Type: boolean
  • Default: false
`,4),Wn=s(`
Code Example
<template>
-    <Datepicker v-model="date" disableMonthYearSelect />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

yearRange

Specify start and end year for years to generate

  • Type: [number, number]
  • Default: [1900, 2100]
`,4),Yn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :yearRange="[2020, 2040]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

reverseYears

Reverse the order of the years in years overlay

  • Type: boolean
  • Default: false
`,4),Ln=s(`
Code Example
<template>
-    <Datepicker v-model="date" reverseYears :yearRange="[2020, 2040]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

allowedDates

Allow only specific dates

  • Type: string[] | Date[]
  • Default: []
`,4),Bn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :allowedDates="allowedDates" />
-</template>
-
-<script>
-import { ref, computed } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        // For demo purposes, enable only today and tomorrow
-        const allowedDates = computed(() => {
-          return [
-            new Date(),
-            new Date(new Date().setDate(new Date().getDate() + 1))
-          ];
-        });
-        
-        return {
-            date,
-          allowedDates,
-        }
-    }
-}
-</script>
-

disabledDates

Disable specific dates

  • Type: Date[] | string[] | (date: Date) => boolean
  • Default: []

Note: If you use a custom function, make sure to return true for a disabled date and false for enabled

`,5),Gn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :disabledDates="disabledDates" />
-</template>
-
-<script>
-import { ref, computed } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-        // For demo purposes disables the next 2 days from the current date
-        const disabledDates = computed(() => {
-            const today = new Date();
-            
-            const tomorrow = new Date(today)
-            tomorrow.setDate(tomorrow.getDate() + 1)
-            
-            const afterTomorrow = new Date(tomorrow);
-            afterTomorrow.setDate(tomorrow.getDate() + 1);
-            
-            return [tomorrow, afterTomorrow]
-        })
-        
-        return {
-            disabledDates,
-            date,
-        }
-    }
-}
-</script>
-

disabledWeekDays

Disable specific days from the week

  • Type: string[] | number[] - 0-6, 0 is Sunday, 6 is Saturday
  • Default: []
`,4),zn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :disabledWeekDays="[6, 0]" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Time picker configuration

Props to configure time picker, whether using it only as time picker or alongside the datepicker

enableTimePicker

Enable or disable time picker

  • Type: boolean
  • Default: true
`,6),Vn=s(`
Code Example
<template>
-    <Datepicker v-model="date" :enableTimePicker="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

is24

Whether to use 24H or 12H mode

  • Type: boolean
  • Default: true
`,4),$n=s(`
Code Example
<template>
-    <Datepicker v-model="date" :is24="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

enableSeconds

Enable seconds in the time picker

  • Type: boolean
  • Default: false
`,4),Un=s(`
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hoursIncrement

The value which is used to increment hours via arrows in the time picker

  • Type: number | string
  • Default: 1
`,4),Jn=s(`
Code Example
<template>
-    <Datepicker v-model="date" hoursIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutesIncrement

The value which is used to increment minutes via arrows in the time picker

  • Type: number | string
  • Default: 1
`,4),Kn=s(`
Code Example
<template>
-    <Datepicker v-model="date" minutesIncrement="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

secondsIncrement

The value which is used to increment seconds via arrows in the time picker

  • Type: number | string
  • Default: 1
`,4),Qn=s(`
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds secondsIncrement="5" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hoursGridIncrement

The value which is used to increment hours when showing hours overlay

It will always start from 0 until it reaches 24 or 12 depending on the is24 prop

  • Type: number | string
  • Default: 1
`,5),Xn=s(`
Code Example
<template>
-    <Datepicker v-model="date" hoursGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutesGridIncrement

The value which is used to increment minutes when showing minutes overlay

It will always start from 0 to 60 minutes

  • Type: number | string
  • Default: 5
`,5),Zn=s(`
Code Example
<template>
-    <Datepicker v-model="date" minutesGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

secondsGridIncrement

The value which is used to increment seconds when showing seconds overlay

  • Type: number | string
  • Default: 5
`,4),ns=s(`
Code Example
<template>
-    <Datepicker v-model="date" enableSeconds secondsGridIncrement="2" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noHoursOverlay

Disable overlay for the hours, only arrow selection will be available

  • Type: boolean
  • Default: false
`,4),ss=s(`
Code Example
<template>
-    <Datepicker v-model="date" noHoursOverlay />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noMinutesOverlay

Disable overlay for the minutes, only arrow selection will be available

  • Type: boolean
  • Default: false
`,4),as=s(`
Code Example
<template>
-    <Datepicker v-model="date" noMinutesOverlay />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

noSecondsOverlay

Disable overlay for the seconds, only arrow selection will be available

  • Type: boolean
  • Default: false
`,4),ts=s(`
Code Example
<template>
-    <Datepicker v-model="date" noSecondsOverlay enableSeconds />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minTime

Sets the minimal available time to pick

  • Type: { hours?: number | string; minutes?: number | string; seconds?: number | string }
  • Default: null
`,4),ps=s(`
Code Example
<template>
-    <Datepicker v-model="date" :minTime="{ hours: 11, minutes: 30 }" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

maxTime

Sets the maximal available time to pick

  • Type: { hours?: number | string; minutes?: number | string; seconds?: number | string }
  • Default: null
`,4),es=s(`
Code Example
<template>
-    <Datepicker v-model="date" :maxTime="{ hours: 11, minutes: 30 }" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

startTime

Set some default starting time

  • Type:
    • Single picker: { hours?: number | string; minutes?: number | string; seconds?: number | string }
    • Range picker: { hours?: number | string; minutes?: number | string; seconds?: number | string }[]
  • Default: null
`,4),os=s(`
Code Example
<template>
-    <Datepicker v-model="date" :startTime="startTime" placeholder="Select Date" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        const startTime = ref({ hours: 0, minutes: 0 });
-        
-        return {
-            date,
-            startTime,
-        }
-    }
-}
-</script>
-

Positioning

Configure datepicker menu positioning

position

Datepicker menu position

  • Type: 'left' | 'center' | 'right'
  • Default: 'center'
`,6),cs=s(`
Code Example
<template>
-    <Datepicker v-model="date" position="left" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

autoPosition

When enabled, based on viewport space available it will automatically position the menu above or bellow input field

  • Type: boolean
  • Default: true
`,4),ls=s(`
Code Example
<template>
-    <Datepicker v-model="date" :autoPosition="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

altPosition

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 true, 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.

  • Type: boolean | ((el: HTMLElement | undefined) => { top: string; left: string; transform: string })
  • Default: false
`,4),us=s(`
Code Example
<template>
-    <Datepicker v-model="date" altPosition />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

teleport

Set teleport target

  • Type: string
  • Default: 'body'

You can inspect the page and check the menu placement

`,5),is=s(`
Code Example
<template>
-    <Datepicker v-model="date" teleport="#app" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Keyboard

Configure keyboard actions

Info

You can press tab key in the menu, and it will autofocus elements, pressing enter will do a click action like open overlay or select a date.

All keyboard events are enabled by default

openMenuOnFocus

Pressing tab in the form, datepicker menu will open

  • Type: boolean
  • Default: true
`,7),rs=s(`
Code Example
<template>
-    <Datepicker v-model="date" :openMenuOnFocus="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

escClose

Esc key closes the menu

  • Type: boolean
  • Default: true
`,4),ks=s(`
Code Example
<template>
-    <Datepicker v-model="date" :escClose="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

spaceConfirm

space key selects the date (like you pressed the select button)

  • Type: boolean
  • Default: true
`,4),ds=s(`
Code Example
<template>
-    <Datepicker v-model="date" :spaceConfirm="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

monthChangeOnArrows

Change months via arrow keys

  • Type: boolean
  • Default: true
`,4),ms=s(`
Code Example
<template>
-    <Datepicker v-model="date" :monthChangeOnArrows="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Look and feel

Customization options

transitions

`,4),bs=o("Control transitions inside the menu. You can define your own or disable them. Datepicker uses Vue built in "),gs={href:"https://v3.vuejs.org/guide/transitions-overview.html",target:"_blank",rel:"noopener noreferrer"},ys=o("transitions"),hs=o(" component for transitions control. To configure you own, please check the Vue documentation and provide a transition name in the prop"),vs=s("
  • Type: boolean | {open?: string; close?: string; next?: string; previous?: string}
  • Default: true

open and close are added on overlays show/hide

next and previous are added when switching months in the calendar

",3),fs=s(`
Code Example
<template>
-    <Datepicker v-model="date" :transitions="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

dark

Theme switch between the dark and light mode

  • Type: boolean
  • Default: false
`,4),ws=s(`
Code Example
<template>
-    <Datepicker v-model="date" dark />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hideInputIcon

Hide calendar icon in the input field

  • Type: boolean
  • Default: false
`,4),qs=s(`
Code Example
<template>
-    <Datepicker v-model="date" hideInputIcon />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

state

Validation state of the calendar value. Sets the green/red border depending on the value

  • Type: boolean
  • Default: null
`,4),xs=s(`
Code Example
<template>
-    <Datepicker v-model="date" :state="false" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

inputClassName

Add a custom class to the input field

  • Type: string
  • Default: null
`,4),Ds=s(`
Code Example
<template>
-    <Datepicker v-model="date" inputClassName="dp-custom-input" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-input {
-  box-shadow: 0 0 6px #1976d2;
-  color: #1976d2;
-
-  &:hover {
-    border-color: #1976d2;
-  }
-}
-</style>
-

Add a custom class to the datepicker menu wrapper

  • Type: string
  • Default: null
`,4),_s=s(`
Code Example
<template>
-    <Datepicker v-model="date" menuClassName="dp-custom-menu" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-menu {
-  box-shadow: 0 0 6px #1976d2;
-}
-</style>
-

calendarClassName

Add a custom class to the calendar wrapper

  • Type: string
  • Default: null
`,4),Ts=s(`
Code Example
<template>
-    <Datepicker v-model="date" calendarClassName="dp-custom-calendar" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-calendar {
-  .dp__calendar_item {
-    border: 1px solid var(--dp-border-color-hover);
-  }
-}
-</style>
-

calendarCellClassName

Add a custom class to the calendar cell wrapper

  • Type: string
  • Default: null
`,4),Cs=s(`
Code Example
<template>
-    <Datepicker v-model="date" calendarCellClassName="dp-custom-cell" />
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.dp-custom-cell {
-  border-radius: 50%;
-}
-</style>
-
`,1);function Es(js,Ss){const a=p("Demo"),l=p("TextInputDemo"),t=p("EmptyDemo"),u=p("TimezoneDemo"),i=p("PresetRange"),c=p("ExternalLinkIcon"),r=p("FormatDemo"),k=p("PreviewFormatDemo"),d=p("LocalizedOutput"),m=p("Badge"),b=p("DemoMarkers"),g=p("RequiredDemo"),y=p("MinMaxDemo"),h=p("FiltersDemo"),v=p("DisabledDatesDemo"),f=p("DarkDemo");return w(),q(x,null,[T,n(a,{range:!0}),C,n(a,{range:"",autoRange:5,placeholder:"Select Date"}),E,n(a,{range:!0,multiCalendars:!0}),j,n(a,{monthPicker:!0}),S,n(a,{timePicker:!0}),I,n(l,{textInput:!0}),M,n(a,{inline:!0,autoApply:!0}),O,n(t,{multiDates:!0,placeholder:"Select Multiple Dates"}),A,n(t,{flow:["month","year","calendar"],placeholder:"Month > Year > Date"}),N,n(u),F,n(t,{weekPicker:!0,placeholder:"Select week"}),P,n(a,{range:!0,partialRange:!1,placeholder:"Select Date"}),R,n(i),H,n(t,{range:!0,minRange:3,placeholder:"At least 3 days in between"}),W,n(t,{range:!0,maxRange:7,placeholder:"Can't have more than 7 days in between"}),Y,n(a,{range:!0,fixedStart:!0,clearable:!1}),L,n(a,{range:!0,fixedEnd:!0,clearable:!1}),B,n(a,{range:!0,multiCalendars:!0,multiCalendarsSolo:!0}),G,n(l,{textInput:!0,textInputOptions:{format:"MM.dd.yyyy"}},null,8,["textInputOptions"]),z,n(a,{timePicker:!0,modeHeight:120}),V,n(a,{inline:!0,inlineWithInput:!0,autoApply:!0}),$,n(t,{multiDates:!0,placeholder:"Select Multiple Dates",multiDatesLimit:3}),U,e("p",null,[J,e("a",K,[Q,n(c)])]),n(r),X,n(k),Z,n(a,{monthNameFormat:"long"}),nn,n(a,{locale:"de",cancelText:"abbrechen",selectText:"ausw\xE4hlen"}),sn,e("p",null,[an,e("a",tn,[pn,n(c)])]),en,n(d),on,n(a,{selectText:"Pick"}),cn,n(a,{cancelText:"Close"}),ln,n(t,{showNowButton:!0,placeholder:"Select Date",nowButtonLabel:"Current"}),un,n(a,{weekNumbers:"",weekNumName:"We"}),rn,n(a,{uid:"demo"}),kn,n(a,{monthChangeOnScroll:!1}),dn,e("h3",mn,[bn,gn,n(m,{type:"tip",text:"v-model",vertical:"top"})]),yn,n(a,{clearable:!1}),hn,n(a,{closeOnScroll:!0}),vn,n(a,{autoApply:!0}),fn,n(t,{placeholder:"Select Date"}),wn,n(t,{noToday:!0,placeholder:"Select Date"}),qn,n(a,{autoApply:!0,closeOnAutoApply:!1}),xn,n(b),Dn,n(t,{showNowButton:!0,placeholder:"Select Date"}),_n,n(a,{disabled:!0}),Tn,n(a,{readonly:!0}),Cn,n(g,{required:!0}),En,n(a,{name:"date-picker"}),jn,n(a,{autocomplete:"off"}),Sn,n(a,{keepActionRow:!0,autoApply:!0,closeOnAutoApply:!1}),In,n(a,{weekNumbers:!0}),Mn,n(a,{hideOffsetDates:!0}),On,n(a,{minDate:new Date},null,8,["minDate"]),An,n(a,{maxDate:new Date},null,8,["maxDate"]),Nn,n(y),Fn,n(t,{startDate:new Date(2020,1),placeholder:"Select Date"},null,8,["startDate"]),Pn,n(a,{weekStart:"0"}),Rn,n(h),Hn,n(a,{disableMonthYearSelect:!0}),Wn,n(a,{yearRange:[2020,2040]}),Yn,n(a,{reverseYears:!0,yearRange:[2020,2040]}),Ln,n(t,{allowedDates:[new Date],placeholder:"Select Date"},null,8,["allowedDates"]),Bn,n(v),Gn,n(t,{disabledWeekDays:[6,0],placeholder:"Select Date"}),zn,n(a,{enableTimePicker:!1}),Vn,n(a,{is24:!1}),$n,n(a,{enableSeconds:!0}),Un,n(a,{hoursIncrement:"2"}),Jn,n(a,{minutesIncrement:"5"}),Kn,n(a,{secondsIncrement:"5",enableSeconds:!0}),Qn,n(a,{hoursGridIncrement:"2"}),Xn,n(a,{minutesGridIncrement:"2"}),Zn,n(a,{secondsGridIncrement:"2",enableSeconds:!0}),ns,n(a,{noHoursOverlay:!0}),ss,n(a,{noMinutesOverlay:!0}),as,n(a,{noSecondsOverlay:!0,enableSeconds:!0}),ts,n(t,{minTime:{hours:11,minutes:30},placeholder:"Select Date"}),ps,n(t,{maxTime:{hours:11,minutes:30},placeholder:"Select Date"}),es,n(t,{startTime:{hours:0,minutes:0},placeholder:"Select Date"}),os,n(a,{position:"left"}),cs,n(a,{autoPosition:!1}),ls,n(a,{altPosition:!0}),us,n(a,{teleport:"#app"}),is,n(a,{openMenuOnFocus:!1}),rs,n(a,{escClose:!1}),ks,n(a,{spaceConfirm:!1}),ds,n(a,{monthChangeOnArrows:!1}),ms,e("p",null,[bs,e("a",gs,[ys,n(c)]),hs]),vs,n(a,{transitions:!1}),fs,n(f),ws,n(a,{hideInputIcon:!0}),qs,n(a,{state:!1}),xs,n(a,{inputClassName:"dp-custom-input"}),Ds,n(a,{menuClassName:"dp-custom-menu"}),_s,n(a,{calendarClassName:"dp-custom-calendar"}),Ts,n(a,{calendarCellClassName:"dp-custom-cell"}),Cs],64)}var Os=D(_,[["render",Es]]);export{Os as default}; diff --git a/docs/assets/index.html.628a0633.js b/docs/assets/index.html.628a0633.js deleted file mode 100644 index 9277239..0000000 --- a/docs/assets/index.html.628a0633.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:1647091751e3},filePathRelative:"api/props/README.md"};export{e as data}; diff --git a/docs/assets/index.html.94c6d9be.js b/docs/assets/index.html.94c6d9be.js deleted file mode 100644 index 7040ec5..0000000 --- a/docs/assets/index.html.94c6d9be.js +++ /dev/null @@ -1 +0,0 @@ -const e={key:"v-59de75e8",path:"/api/slots/",title:"Slots",lang:"en-US",frontmatter:{title:"Slots",description:"Datepicker available slots lists. Customize parts of the datepicker with custom elements"},excerpt:"",headers:[{level:2,title:"Content",slug:"content",children:[{level:3,title:"calendar-header",slug:"calendar-header",children:[]},{level:3,title:"day",slug:"day",children:[]},{level:3,title:"action-select",slug:"action-select",children:[]},{level:3,title:"action-preview",slug:"action-preview",children:[]},{level:3,title:"now-button",slug:"now-button",children:[]},{level:3,title:"am-pm-button",slug:"am-pm-button",children:[]}]},{level:2,title:"Trigger and input",slug:"trigger-and-input",children:[{level:3,title:"trigger",slug:"trigger",children:[]},{level:3,title:"dp-input",slug:"dp-input",children:[]}]},{level:2,title:"Icons",slug:"icons",children:[{level:3,title:"input-icon",slug:"input-icon",children:[]},{level:3,title:"clear-icon",slug:"clear-icon",children:[]},{level:3,title:"clock-icon",slug:"clock-icon",children:[]},{level:3,title:"arrow-left",slug:"arrow-left",children:[]},{level:3,title:"arrow-right",slug:"arrow-right",children:[]},{level:3,title:"arrow-up",slug:"arrow-up",children:[]},{level:3,title:"arrow-down",slug:"arrow-down",children:[]},{level:3,title:"calendar-icon",slug:"calendar-icon",children:[]}]},{level:2,title:"Overlay",slug:"overlay",children:[{level:3,title:"time-picker-overlay",slug:"time-picker-overlay",children:[]},{level:3,title:"hours",slug:"hours",children:[]},{level:3,title:"minutes",slug:"minutes",children:[]},{level:3,title:"hours-overlay",slug:"hours-overlay",children:[]},{level:3,title:"minutes-overlay",slug:"minutes-overlay",children:[]},{level:3,title:"month",slug:"month",children:[]},{level:3,title:"year",slug:"year",children:[]},{level:3,title:"month-overlay",slug:"month-overlay",children:[]},{level:3,title:"year-overlay",slug:"year-overlay",children:[]}]}],git:{updatedTime:164510209e4},filePathRelative:"api/slots/README.md"};export{e as data}; diff --git a/docs/assets/index.html.997122eb.js b/docs/assets/index.html.997122eb.js deleted file mode 100644 index d471739..0000000 --- a/docs/assets/index.html.997122eb.js +++ /dev/null @@ -1,683 +0,0 @@ -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.232643d3.js";import{_ as r}from"./plugin-vue_export-helper.21dcd24c.js";const k={},b=s('

Slots

Below is a list of available slots which you can use to change some default elements of the datepicker

Content

Customize parts in the datepicker menu

calendar-header

Replace the content in the calendar header cells

Available props are:

  • day: Displayed value in the header cell
  • index: Column index it is rendered by
',8),m=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #calendar-header="{ index, day }">
-        <div :class="index === 5 || index === 6 ? 'red-color' : ''">
-          {{ day }}
-        </div>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-      
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .red-color {
-        color: red;
-    }
-</style>
-

day

This slot allows you to place custom content in the calendar

This slot will also provide 2 props when used

  • day: This is the day number displayed in the calendar
  • date: This is the date value from that day
`,5),d=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #day="{ day, date }">
-            <temlplate v-if="day === tomorrow">
-              <img class="slot-icon" src="/logo.png"/>
-            </temlplate>
-            <template v-else>
-              {{ day }}
-            </template>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const tomorrow = ref(new Date().getDate() + 1);
-        
-        return {
-            date,
-            tomorrow,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

action-select

This slot replaces the select and cancel button section in the action row

`,3),g=s(`
Code Example
<template>
-    <Datepicker v-model="date" ref="dp">
-      <template #action-select>
-        <p class="custom-select" @click="selectDate">Select</p>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const dp = ref();
-        
-        const selectDate = () => {
-          ref.value.selectDate();
-        }
-        
-        return {
-            date,
-            dp,
-            selectDate,
-        }
-    }
-}
-</script>
-
-<style>
-    .custom-select {
-      cursor: pointer;
-      color: var(--c-text-accent);
-      margin: 0;
-      display: inline-block;
-    }
-</style>
-

action-preview

This slot replaces the date preview section in the action row

This slot will provide one prop

  • value: Current selection in the picker, this can be Date object, or in case of range, Date array
`,5),v=s(`
Code Example
<template>
-    <Datepicker v-model="date" ref="dp">
-      <template #action-preview="{ value }">
-        {{ getDate(value) }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        const dp = ref();
-      
-        const getDate = (dateVal) => {
-          const newDate = new Date(dateVal);
-
-          return \`Selected \${newDate.getDate()}\`;
-        }
-        
-        return {
-            date,
-            dp,
-            getDate,
-        }
-    }
-}
-</script>
-

now-button

This slot replaces the content in the now button wrapper

`,3),h={class:"custom-container tip"},y=t("p",{class:"custom-container-title"},"TIP",-1),w=p("To use this slot, make sure that "),q=p("showNowButton prop"),f=p(" is enabled"),x=t("p",null,"One prop is available:",-1),D=t("ul",null,[t("li",null,[t("code",null,"selectCurrentDate"),p(" - Function to call to select the date")])],-1),_=s(`
Code Example
<template>
-    <Datepicker v-model="date" showNowButton>
-      <template #now-button="{ selectCurrentDate }">
-        <span @click="selectCurrentDate()" title="Select current date">
-          <img class="slot-icon" src="/logo.png" />
-        </span>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-  .slot-icon {
-    height: 20px;
-    width: auto;
-    cursor: pointer;
-  }
-</style>
-

am-pm-button

This slot replaces the am-pm button in the time picker when the is24 prop is set to false

Two props are available:

  • toggle - Function to call to switch AM/PM
  • value - Currently active mode, AM or PM
`,5),C=s(`
Code Example
<template>
-    <Datepicker v-model="date" showNowButton>
-      <template #am-pm-button="{ toggle, value }">
-        <button @click="toggle">{{ value }}</button>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Trigger and input

Use custom input or trigger element

trigger

This slot replaces the input element with your custom element

`,5),T=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #trigger>
-            <p class="clickable-text">This is some custom clickable text that will open the datepicker</p>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .clickable-text {
-        color: #1976d2;
-        cursor: pointer;
-    }
-</style>
-

dp-input

This slot replaces the input field. The difference from the trigger slot is that you will have access to the input field properties

Available props are:

`,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("
  • value: Value displayed in the input field
    • type: string
  • onInput: Function called on the @input event
    • type: (event: Event) => void
  • onEnter: Function called on the @keydown.enter event
    • type: () => void
  • onTab: Function called on the @keydown.tab event
    • type: () => void
  • onClear: Function to call if you want to clear date
    • type: () => void
",1),F=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #dp-input="{ value, onInput, onEnter, onTab, onClear }">
-          <input type="text" :value="value" />
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

Icons

Change datepicker icons

input-icon

This slot replaces the calendar icon in the input element with your custom element

`,5),M=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #input-icon>
-            <img class="input-slot-image" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .input-slot-image {
-        height: 20px;
-        width: auto;
-        margin-left: 5px;
-    }
-</style>
-

clear-icon

This slot replaces the clear icon in the input element with your custom element

`,3),N=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #clear-icon="{ clear }">
-            <img class="input-slot-image" src="/logo.png" @click="clear" />
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .input-slot-image {
-        height: 20px;
-        width: auto;
-        margin-right: 5px;
-    }
-</style>
-

clock-icon

This slot replaces the default clock icon used to select the time

`,3),O=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #clock-icon>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-left

This slot replaces the arrow left icon on the month/year select row

`,3),P=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-left>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-right

This slot replaces the arrow right icon on the month/year select row

`,3),H=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-right>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

arrow-up

This slot replaces the arrow up icon in the time picker

`,3),$=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-up>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-       margin: 0 auto;
-    }
-</style>
-

arrow-down

This slot replaces the arrow down icon in the time picker

`,3),R=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #arrow-down>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-        margin: 0 auto;
-    }
-</style>
-

calendar-icon

This slot replaces the back to calendar icon

`,3),z=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-        <template #calendar-icon>
-            <img class="slot-icon" src="/logo.png"/>
-        </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
-<style>
-    .slot-icon {
-        height: 20px;
-        width: auto;
-    }
-</style>
-

Overlay

Customize overlay and overlay triggers

time-picker-overlay

This slot replaces the full overlay in the timepicker

Several props are available:

  • range: Value passed from general props
  • hours: Selected hours value
  • minutes: Selected minutes value
  • seconds: Selected seconds value
  • setHours: Function to call to set hours, (hours: number | number[]) => void
  • setMinutes: Function to call to set minutes, (minutes: number | number[]) => void
  • setSeconds: Function to call to set seconds, (seconds: number | number[]) => void

If you are using range mode, make sure to pass number arrays in functions

`,8),L=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #time-picker-overlay="{ hours, minutes, setHours, setMinutes }">
-        <div class="time-picker-overlay">
-          <select class="select-input" :value="hours" @change="setHours(+$event.target.value)">
-            <option v-for="h in hoursArray" :key="h.value" :value="h.value">{{ h.text }}</option>
-          </select>
-          <select class="select-input" :value="minutes" @change="setMinutes(+$event.target.value)">
-            <option v-for="m in minutesArray" :key="m.value" :value="m.value">{{ m.text }}</option>
-          </select>
-        </div>
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-
-      const hoursArray = computed(() => {
-        const arr = [];
-        for (let i = 0; i < 24; i++) {
-          arr.push({ text: i < 10 ? \`0\${i}\` : i, value: i });
-        }
-        return arr;
-      });
-
-      const minutesArray = computed(() => {
-        const arr = [];
-        for (let i = 0; i < 60; i++) {
-          arr.push({ text: i < 10 ? \`0\${i}\` : i, value: i });
-        }
-        return arr;
-      });
-        
-        return {
-            date,
-            hoursArray,
-            minutesArray,
-        }
-    }
-}
-</script>
-
-<style>
-.time-picker-overlay {
-  display: flex;
-  height: 100%;
-  flex-direction: column;
-}
-</style>
-

hours

This slot replaces the hours text between the arrows in the time picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),U=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #hours="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutes

This slot replaces the minutes text between the arrows in the time picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),Y=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #minutes="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

hours-overlay

This slot replaces the text in the hours overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),Q=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #hours-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

minutes-overlay

This slot replaces the text in the minutes overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),W=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #minutes-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

month

This slot replaces the text in the month picker

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),G=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #month="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

year

This slot replaces the text in the year picker

One props is available

  • year: Displayed year
`,5),J=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #year="{ year }">
-        {{ year }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

month-overlay

This slot replaces the text in the month picker overlay

2 props are available

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),K=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #month-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-

year-overlay

This slot replaces the text in the month picker overlay

2 props are available, although for the year, text and value are the same

  • text: Value displayed in the datepicker by default
  • value: Actual value used in the code
`,5),X=s(`
Code Example
<template>
-    <Datepicker v-model="date">
-      <template #year-overlay="{ text, value }">
-        {{ value }}
-      </template>
-    </Datepicker>
-</template>
-
-<script>
-import { ref } from 'vue';
-
-export default {
-    setup() {
-        const date = ref(new Date());
-        
-        return {
-            date,
-        }
-    }
-}
-</script>
-
`,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}; diff --git a/docs/assets/index.html.b98d62f4.js b/docs/assets/index.html.b98d62f4.js deleted file mode 100644 index dc1ba53..0000000 --- a/docs/assets/index.html.b98d62f4.js +++ /dev/null @@ -1,384 +0,0 @@ -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.232643d3.js";import{_ as b}from"./plugin-vue_export-helper.21dcd24c.js";const d={},y=o('

Components

Customize the datepicker with your custom components

WARNING

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

TIP

You can use css variables inside custom components if you need to style for the theme

monthYearComponent

Create and use a custom component in the header for month/year select

',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("
  • month: number -> This is the value of the selected month
  • year : number -> This is the value of the selected year
  • customProps: Record<string, unknown> -> Your custom props
    • ",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('

    Important

    To update the month and the year value make sure to emit the following:

    • Month
      • Event: update:month
      • Value: number
    • Year
      • Event: update:year
      • Value: number
    • Handler event
      • Event: updateMonthYear
      • Value: boolean (only when updating year)
    ',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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" computed"),n("span",{class:"token punctuation"},","),s(" ref"),n("span",{class:"token punctuation"},","),s(" defineAsyncComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token comment"},"// Lazy load the component we want to pass"),s(` - `),n("span",{class:"token keyword"},"const"),s(" MonthYear "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"defineAsyncComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token keyword"},"import"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'./MonthYearCustom.vue'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),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 comment"},"// Return from computed as it is imported"),s(` - `),n("span",{class:"token keyword"},"const"),s(" monthYear "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(" MonthYear"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - date`),n("span",{class:"token punctuation"},","),s(` - monthYear - `),n("span",{class:"token punctuation"},"}"),s(` - `),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(` -`)])]),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")])],-1),W=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("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("month-year-wrapper"),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("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("custom-month-year-component"),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("select")]),s(` - `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("select-input"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("month"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("$emit("),n("span",{class:"token punctuation"},"'"),s("update:month"),n("span",{class:"token punctuation"},"'"),s(", +$event.target.value)"),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("option")]),s(` - `),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m in months"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m.value"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m.value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("{{ m.text }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("select")]),s(` - `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("select-input"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("year"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("$emit("),n("span",{class:"token punctuation"},"'"),s("update:year"),n("span",{class:"token punctuation"},"'"),s(", +$event.target.value)"),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("option")]),s(` - `),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("y in years"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("y.value"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("y.value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("{{ y.text }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("icons"),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("span")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("custom-icon"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("onPrev"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("ChevronLeftIcon")]),s(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("span")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("custom-icon"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("onNext"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("ChevronRightIcon")]),s(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[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"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` -`),n("span",{class:"token comment"},"// Icons used in the example, you can use your custom ones"),s(` -`),n("span",{class:"token keyword"},"import"),s(" ChevronLeftIcon "),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'./ChevronLeftIcon.vue'"),n("span",{class:"token punctuation"},";"),s(` -`),n("span",{class:"token keyword"},"import"),s(" ChevronRightIcon "),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'./ChevronRightIcon.vue'"),n("span",{class:"token punctuation"},";"),s(` - -`),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" defineComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - -`),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(" ChevronLeftIcon"),n("span",{class:"token punctuation"},","),s(" ChevronRightIcon "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"emits"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'update:month'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'update:year'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token comment"},"// Available props"),s(` - `),n("span",{class:"token literal-property property"},"props"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"months"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Array"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"years"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Array"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"filters"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"null"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"monthPicker"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"month"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Number"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"0"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"year"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Number"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"0"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"customProps"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"null"),s(),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("props"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token punctuation"},"{"),s(" emit "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"const"),s(),n("span",{class:"token function-variable function"},"updateMonthYear"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[s("month"),n("span",{class:"token punctuation"},","),s(" year")]),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token function"},"emit"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'update:month'"),n("span",{class:"token punctuation"},","),s(" month"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token function"},"emit"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'update:year'"),n("span",{class:"token punctuation"},","),s(" year"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"const"),s(),n("span",{class:"token function-variable function"},"onNext"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"let"),s(" month "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("month"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"let"),s(" year "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("year"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("props"),n("span",{class:"token punctuation"},"."),s("month "),n("span",{class:"token operator"},"==="),s(),n("span",{class:"token number"},"11"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - month `),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),s(` - year `),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("year "),n("span",{class:"token operator"},"+"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"else"),s(),n("span",{class:"token punctuation"},"{"),s(` - month `),n("span",{class:"token operator"},"+="),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token function"},"updateMonthYear"),n("span",{class:"token punctuation"},"("),s("month"),n("span",{class:"token punctuation"},","),s(" year"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"const"),s(),n("span",{class:"token function-variable function"},"onPrev"),s(),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"let"),s(" month "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("month"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"let"),s(" year "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("year"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("props"),n("span",{class:"token punctuation"},"."),s("month "),n("span",{class:"token operator"},"==="),s(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - month `),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"11"),n("span",{class:"token punctuation"},";"),s(` - year `),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("year "),n("span",{class:"token operator"},"-"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"else"),s(),n("span",{class:"token punctuation"},"{"),s(` - month `),n("span",{class:"token operator"},"-="),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token function"},"updateMonthYear"),n("span",{class:"token punctuation"},"("),s("month"),n("span",{class:"token punctuation"},","),s(" year"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - onNext`),n("span",{class:"token punctuation"},","),s(` - onPrev`),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` -`),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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("style")]),s(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("scss"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[s(` -`),n("span",{class:"token selector"},".month-year-wrapper"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"align-items"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"justify-content"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` -`),n("span",{class:"token punctuation"},"}"),s(` -`),n("span",{class:"token selector"},".custom-month-year-component"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"align-items"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"justify-content"),n("span",{class:"token punctuation"},":"),s(" flex-start"),n("span",{class:"token punctuation"},";"),s(` -`),n("span",{class:"token punctuation"},"}"),s(` - -`),n("span",{class:"token selector"},".select-input"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),s(" 5px 3px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),s(" 5px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),s(" auto"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),s(" 4px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),s(),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-border-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),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 selector"},".icons"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` -`),n("span",{class:"token punctuation"},"}"),s(` - -`),n("span",{class:"token selector"},".custom-icon"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),s(" 5px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),s(" 25px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"align-items"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"justify-content"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"cursor"),n("span",{class:"token punctuation"},":"),s(" pointer"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),s(" 25px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),s(),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-icon-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"text-align"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),s(" 50%"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token selector"},"svg"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),s(" 20px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),s(" 20px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - - `),n("span",{class:"token selector"},"&:hover"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),s(),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-hover-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),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(` -`)])]),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("
  • hours: number | [number, number] -> This is the hours value
  • minutes: number | [number, number] -> This is the minutes value
  • customProps: Record<string, unknown> -> Your custom props
    • ",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"),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('

    Note: hours and minutes values will be arrays if range picker mode is active.

    Important

    To update the hours and the minutes values make sure to emit the following:

    • Hours
      • Event: update:hours
      • Value: number | [number, number]
    • Minutes
      • Event: update:minutes
      • Value: number | [number, number]

    Note: 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 emit something like this emit('update:hours', [firstValueSaved, newSecondValue])

    ',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("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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" computed"),n("span",{class:"token punctuation"},","),s(" ref"),n("span",{class:"token punctuation"},","),s(" defineAsyncComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token comment"},"// Lazy load the component we want to pass"),s(` - `),n("span",{class:"token keyword"},"const"),s(" TimePicker "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"defineAsyncComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token keyword"},"import"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'./TimePickerCustom.vue'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),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 comment"},"// Return from computed as it is imported"),s(` - `),n("span",{class:"token keyword"},"const"),s(" timePicker "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(" TimePicker"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - date`),n("span",{class:"token punctuation"},","),s(` - timePicker - `),n("span",{class:"token punctuation"},"}"),s(` - `),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(` -`)])]),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")])],-1),Un=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("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("custom-time-picker-component"),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("select")]),s(` - `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("select-input"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("hours"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("$emit("),n("span",{class:"token punctuation"},"'"),s("update:hours"),n("span",{class:"token punctuation"},"'"),s(", +$event.target.value)"),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("option")]),s(` - `),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("h in hoursArray"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("h.value"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("h.value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("{{ h.text }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("select")]),s(` - `),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("select-input"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("minutes"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("$emit("),n("span",{class:"token punctuation"},"'"),s("update:minutes"),n("span",{class:"token punctuation"},"'"),s(", +$event.target.value)"),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("option")]),s(` - `),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m in minutesArray"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m.value"),n("span",{class:"token punctuation"},'"')]),s(` - `),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("m.value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("{{ m.text }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[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"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" computed"),n("span",{class:"token punctuation"},","),s(" defineComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"emits"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'update:hours'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'update:minutes'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"props"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"hoursIncrement"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("Number"),n("span",{class:"token punctuation"},","),s(" String"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"minutesIncrement"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("Number"),n("span",{class:"token punctuation"},","),s(" String"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"is24"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"true"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"hoursGridIncrement"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("String"),n("span",{class:"token punctuation"},","),s(" Number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"1"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"minutesGridIncrement"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("String"),n("span",{class:"token punctuation"},","),s(" Number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"5"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"range"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"filters"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"minTime"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"maxTime"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"timePicker"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"hours"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("Number"),n("span",{class:"token punctuation"},","),s(" Array"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"0"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"minutes"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("Number"),n("span",{class:"token punctuation"},","),s(" Array"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token number"},"0"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"customProps"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Object"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"null"),s(),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token comment"},"// Generate array of hours"),s(` - `),n("span",{class:"token keyword"},"const"),s(" hoursArray "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"const"),s(" arr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"for"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),s(" i "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),s(" i "),n("span",{class:"token operator"},"<"),s(),n("span",{class:"token number"},"24"),n("span",{class:"token punctuation"},";"),s(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - arr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"text"),n("span",{class:"token operator"},":"),s(" i "),n("span",{class:"token operator"},"<"),s(),n("span",{class:"token number"},"10"),s(),n("span",{class:"token operator"},"?"),s(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"0"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("i"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),s(),n("span",{class:"token operator"},":"),s(" i"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),s(" i "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token keyword"},"return"),s(" arr"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token comment"},"// Generate array of minutes"),s(` - `),n("span",{class:"token keyword"},"const"),s(" minutesArray "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"const"),s(" arr "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"for"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"let"),s(" i "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),s(" i "),n("span",{class:"token operator"},"<"),s(),n("span",{class:"token number"},"60"),n("span",{class:"token punctuation"},";"),s(" i"),n("span",{class:"token operator"},"++"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - arr`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"text"),n("span",{class:"token operator"},":"),s(" i "),n("span",{class:"token operator"},"<"),s(),n("span",{class:"token number"},"10"),s(),n("span",{class:"token operator"},"?"),s(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"0"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("i"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),s(),n("span",{class:"token operator"},":"),s(" i"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),s(" i "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token keyword"},"return"),s(" arr"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - hoursArray`),n("span",{class:"token punctuation"},","),s(` - minutesArray`),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("style")]),s(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("scss"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[s(` - `),n("span",{class:"token selector"},".custom-time-picker-component"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"align-items"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"justify-content"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - - `),n("span",{class:"token selector"},".select-input"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),s(" 5px 3px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),s(" 5px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),s(" 100px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),s(" 4px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),s(),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-border-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),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(` -`)])]),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("
  • calendarWidth: number -> Calendar width
  • menuMount: boolean -> True when the parent menu component is mounted
  • customProps: Record<string, unknown> -> Your custom props
    • ",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("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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" computed"),n("span",{class:"token punctuation"},","),s(" ref"),n("span",{class:"token punctuation"},","),s(" defineAsyncComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token comment"},"// Lazy load the component we want to pass"),s(` - `),n("span",{class:"token keyword"},"const"),s(" ActionRow "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"defineAsyncComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token keyword"},"import"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'./ActionRowCustom.vue'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),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 comment"},"// Return from computed as it is imported"),s(` - `),n("span",{class:"token keyword"},"const"),s(" actionRow "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(" ActionRow"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - date`),n("span",{class:"token punctuation"},","),s(` - actionRow - `),n("span",{class:"token punctuation"},"}"),s(` - `),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(` -`)])]),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")])],-1),sa=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("div")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("custom-action-row"),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("p")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("current-selection"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("{{ date }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("button")]),s(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("select-button"),n("span",{class:"token punctuation"},'"')]),s(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("$emit("),n("span",{class:"token punctuation"},"'"),s("selectDate"),n("span",{class:"token punctuation"},"'"),s(")"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),s("Select Date"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[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"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" computed"),n("span",{class:"token punctuation"},","),s(" defineComponent "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"emits"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'selectDate'"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token string"},"'closePicker'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"props"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"selectText"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" String"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'Select'"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"cancelText"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" String"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token string"},"'Cancel'"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"internalModelValue"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("Date"),n("span",{class:"token punctuation"},","),s(" Array"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"null"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"range"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"previewFormat"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"["),s("String"),n("span",{class:"token punctuation"},","),s(" Function"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function-variable function"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"monthPicker"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token literal-property property"},"timePicker"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(),n("span",{class:"token literal-property property"},"type"),n("span",{class:"token operator"},":"),s(" Boolean"),n("span",{class:"token punctuation"},","),s(),n("span",{class:"token keyword"},"default"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token boolean"},"false"),s(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"props"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"const"),s(" date "),n("span",{class:"token operator"},"="),s(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"=>"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"if"),s(),n("span",{class:"token punctuation"},"("),s("props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"const"),s(" date "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getDate"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"const"),s(" month "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getMonth"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token operator"},"+"),s(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"const"),s(" year "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getFullYear"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"const"),s(" hours "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getHours"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"const"),s(" minutes "),n("span",{class:"token operator"},"="),s(" props"),n("span",{class:"token punctuation"},"."),s("internalModelValue"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"getMinutes"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("month"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"/"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("date"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"/"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("year"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},", "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("hours"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},":"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),s("minutes"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - date`),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),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(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("style")]),s(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),s("scss"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[s(` - `),n("span",{class:"token selector"},".custom-action-row"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" flex"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"align-items"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"justify-content"),n("span",{class:"token punctuation"},":"),s(" center"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"flex-direction"),n("span",{class:"token punctuation"},":"),s(" column"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - - `),n("span",{class:"token selector"},".current-selection"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),s(" 10px 0 0 0"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - - `),n("span",{class:"token selector"},".select-button"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),s(" block"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),s(" transparent"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border"),n("span",{class:"token punctuation"},":"),s(" 1px solid "),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-success-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),s(),n("span",{class:"token function"},"var"),n("span",{class:"token punctuation"},"("),s("--dp-success-color"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),s(" 4px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),s(" 5px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),s(" 10px"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token property"},"cursor"),n("span",{class:"token punctuation"},":"),s(" pointer"),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(` -`)])]),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")])],-1),aa=n("h2",{id:"customprops",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#customprops","aria-hidden":"true"},"#"),s(" customProps")],-1),ta=n("p",null,"If you use a custom component you can pass your custom props from the datepicker via this prop",-1),ea=n("ul",null,[n("li",null,[s("Type: "),n("code",null,"Record")]),n("li",null,[s("Default: "),n("code",null,"null")])],-1),oa=s("Also, you can use the "),pa={href:"https://v3.vuejs.org/guide/component-provide-inject.html",target:"_blank",rel:"noopener noreferrer"},ca=s("provide"),la=s(" function and provide needed props from the parent component"),ua=o(`
    Code Example
    <template>
-  <Datepicker :customProps="customProps" v-model="date" />
-</template>
-
-<script>
-import { ref, reactive } from 'vue';
-
-export default {
-    setup() {
-        const date = ref();
-        // We can access this object in our custom components
-        const customProps = reactive({
-          foo: 'bar',
-          hello: 'hi'
-        });
-        
-        return {
-            date,
-            customProps,
-        }
-    }
-}
-</script>
-
    `,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}; diff --git a/docs/assets/index.html.cced2d39.js b/docs/assets/index.html.cced2d39.js deleted file mode 100644 index 278530a..0000000 --- a/docs/assets/index.html.cced2d39.js +++ /dev/null @@ -1 +0,0 @@ -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:1643395726e3},filePathRelative:"README.md"};export{e as data}; diff --git a/docs/assets/index.html.d53513ec.js b/docs/assets/index.html.d53513ec.js deleted file mode 100644 index 1bbd989..0000000 --- a/docs/assets/index.html.d53513ec.js +++ /dev/null @@ -1 +0,0 @@ -const e={key:"v-9014096a",path:"/api/components/",title:"Components",lang:"en-US",frontmatter:{title:"Components",description:"Customize the datepicker with custom components"},excerpt:"",headers:[{level:2,title:"monthYearComponent",slug:"monthyearcomponent",children:[]},{level:2,title:"timePickerComponent",slug:"timepickercomponent",children:[]},{level:2,title:"actionRowComponent",slug:"actionrowcomponent",children:[]},{level:2,title:"customProps",slug:"customprops",children:[]}],git:{updatedTime:1643395001e3},filePathRelative:"api/components/README.md"};export{e as data}; diff --git a/docs/assets/index.html.e93974bd.js b/docs/assets/index.html.e93974bd.js deleted file mode 100644 index 1a56709..0000000 --- a/docs/assets/index.html.e93974bd.js +++ /dev/null @@ -1,74 +0,0 @@ -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.232643d3.js";import{_ as i}from"./plugin-vue_export-helper.21dcd24c.js";const k={},m=c(`

    Installation

    Install the component using the preferred package manager

    yarn add vue3-date-time-picker
-
-# or
-
-npm install vue3-date-time-picker
-

    Then import and register component

    Note: css file is imported separately

    Global

    In the main file

    import { createApp } from "vue";
-import App from './App.vue';
-
-import Datepicker from 'vue3-date-time-picker';
-import 'vue3-date-time-picker/dist/main.css'
-
-const app = createApp(App);
-
-app.component('Datepicker', Datepicker);
-
-app.mount('#app');
-

    Local

    In the .vue files

    `,10),d=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"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[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"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(" Datepicker "),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue3-date-time-picker'"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token string"},"'vue3-date-time-picker/dist/main.css'"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(" Datepicker "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function"},"data"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"date"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token keyword"},"null"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),s(` - `),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(` -`)])]),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")])],-1),b=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"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[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"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" ref "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"import"),s(" Datepicker "),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue3-date-time-picker'"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token string"},"'vue3-date-time-picker/dist/main.css'"),s(` - - `),n("span",{class:"token keyword"},"export"),s(),n("span",{class:"token keyword"},"default"),s(),n("span",{class:"token punctuation"},"{"),s(` - `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),s(),n("span",{class:"token punctuation"},"{"),s(" Datepicker "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),s(` - `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),s(),n("span",{class:"token punctuation"},"{"),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 keyword"},"return"),s(),n("span",{class:"token punctuation"},"{"),s(` - date - `),n("span",{class:"token punctuation"},"}"),s(` - `),n("span",{class:"token punctuation"},"}"),s(` - `),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(` -`)])]),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")])],-1),g=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"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"")]),s(` - -`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),s("script")]),s(),n("span",{class:"token attr-name"},"setup"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token punctuation"},"{"),s(" ref "),n("span",{class:"token punctuation"},"}"),s(),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"import"),s(" Datepicker "),n("span",{class:"token keyword"},"from"),s(),n("span",{class:"token string"},"'vue3-date-time-picker'"),n("span",{class:"token punctuation"},";"),s(` - `),n("span",{class:"token keyword"},"import"),s(),n("span",{class:"token string"},"'vue3-date-time-picker/dist/main.css'"),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(` -`)])]),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(`

    Alternatively, you can import the scss file if you want full control of the component styles

    @import 'vue3-date-time-picker/src/Vue3DatePicker/style/main.scss';
-

    Browser

    Register and use component in the .html file

    Keep in mind that when you use unpkg to import the component, global component name will be Vue3DatePicker

    Add JavaScript files

    <script src="https://unpkg.com/vue@latest"></script>
-<script src="https://unpkg.com/vue3-date-time-picker@latest"></script>
-

    Add CSS file

    <link rel="stylesheet" href="https://unpkg.com/vue3-date-time-picker@latest/dist/main.css">
-

    Register and use the component

    <script>
-    const app = Vue.createApp({
-        components: { Datepicker: Vue3DatePicker },
-    }).mount("#app");
-</script>
-

    That's it, you are ready to go

    `,12);function h(f,y){const e=p("CodeGroupItem"),o=p("CodeGroup");return l(),u(r,null,[m,a(o,null,{default:t(()=>[a(e,{title:"Options API",active:""},{default:t(()=>[d]),_:1}),a(e,{title:"Composition API"},{default:t(()=>[b]),_:1}),a(e,{title:" - SCSS | Vue 3 Datepicker - - - - -
    Vue 3 Datepicker

    SCSS

    For easier style configuration you can import the scss file and modify the default properties

    @import 'vue3-date-time-picker/src/Vue3DatePicker/style/main.scss';
-

    Available properties are:

    // General
-$dp__font_family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans",
-  "Helvetica Neue", sans-serif !default; // Font size for the menu
-$dp__border_radius: 4px !default; // Border radius everywhere
-$dp__cell_border_radius: $dp__border_radius !default; // Specific border radius for the calendar cell
-
-// Transitions
-$dp__transition_length: 22px !default; // Passed to the translateX in animation
-$dp__transition_duration: 0.1s !default; // Transition duration
-
-// Sizing
-$dp__button_height: 35px !default; // size for buttons in overlays
-$dp__month_year_row_height: 35px !default; // height of the month-year select row
-$dp__month_year_row_button_size: 25px !default; // Specific height for the next/previous buttons
-$dp__button_icon_height: 20px !default; // icon sizing in buttons
-$dp__cell_size: 35px !default; // width and height of calendar cell
-$dp__cell_padding: 5px !default; // padding in the cell
-$dp__common_padding: 10px !default;
-$dp__input_padding: 6px 12px !default; // padding in the input
-$dp__input_icon_padding: 35px !default; // Padding on the left side of the input if icon is present
-$dp__menu_min_width: 260px !default; // Adjust the min width of the menu
-$dp__action_buttons_padding: 2px 5px !default; // Adjust padding for the action buttons in action row
-$dp__row_margin: 5px 0 !default; // Adjust the spacing between rows in the calendar
-$dp__calendar_header_cell_padding: 0.5rem !default; // Adjust padding in calendar header cells
-$dp__two_calendars_spacing: 10px !default; // Space between two calendars if using two calendars
-$dp__overlay_col_padding: 3px !default; // Padding in the overlay column
-$dp__time_inc_dec_button_size: 32px !default; // Sizing for arrow buttons in the time picker
-
-// Font sizes
-$dp__font_size: 1rem !default; // overall font-size
-$dp__preview_font_size: 0.8rem !default; // font size of the date preview in the action row
-$dp__time_font_size: 2rem !default; // font size in the time picker
-
    Last Updated:
    - - - diff --git a/docs/customization/theming/index.html b/docs/customization/theming/index.html deleted file mode 100644 index 053d8f6..0000000 --- a/docs/customization/theming/index.html +++ /dev/null @@ -1,73 +0,0 @@ - - - - - - - - - Theming | Vue 3 Datepicker - - - - -
    Vue 3 Datepicker

    Theming

    Datepicker comes with the theme support with css variables. It provides two classes that are applied based on the chosen dark/light mode

    To change variables, simply override the classes with your custom values.

    Dark mode configuration

    .dp__theme_dark {
-    --dp-background-color: #212121;
-    --dp-text-color: #ffffff;
-    --dp-hover-color: #484848;
-    --dp-hover-text-color: #ffffff;
-    --dp-hover-icon-color: #959595;
-    --dp-primary-color: #005cb2;
-    --dp-primary-text-color: #ffffff;
-    --dp-secondary-color: #a9a9a9;
-    --dp-border-color: #2d2d2d;
-    --dp-menu-border-color: #2d2d2d;
-    --dp-border-color-hover: #aaaeb7;
-    --dp-disabled-color: #737373;
-    --dp-scroll-bar-background: #212121;
-    --dp-scroll-bar-color: #484848;
-    --dp-success-color: #00701a;
-    --dp-success-color-disabled: #428f59;
-    --dp-icon-color: #959595;
-    --dp-danger-color: #e53935;
-}
-

    Light mode configration

    .dp__theme_light {
-  --dp-background-color: #ffffff;
-  --dp-text-color: #212121;
-  --dp-hover-color: #f3f3f3;
-  --dp-hover-text-color: #212121;
-  --dp-hover-icon-color: #959595;
-  --dp-primary-color: #1976d2;
-  --dp-primary-text-color: #f8f5f5;
-  --dp-secondary-color: #c0c4cc;
-  --dp-border-color: #ddd;
-  --dp-menu-border-color: #ddd;
-  --dp-border-color-hover: #aaaeb7;
-  --dp-disabled-color: #f6f6f6;
-  --dp-scroll-bar-background: #f3f3f3;
-  --dp-scroll-bar-color: #959595;
-  --dp-success-color: #76d275;
-  --dp-success-color-disabled: #a3d9b1;
-  --dp-icon-color: #959595;
-  --dp-danger-color: #ff6f60;
-}
-
    Last Updated:
    - - - diff --git a/docs/index.html b/docs/index.html deleted file mode 100644 index 6e62324..0000000 --- a/docs/index.html +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - - Vue 3 Datepicker | Vue 3 Datepicker - - - - -
    Vue 3 Datepicker

    ⭐️ If you like the component, give it a star on GitHubopen in new window and consider sponsoringopen in new window its development! ⭐

    vue3-date-time-picker

    The most complete datepicker solution for Vue 3

    Licenseopen in new window npmopen in new window Downloads Open issuesopen in new window CI Release date

    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.

    Getting started

    CodeSandbox Playgroundopen in new window

    Features

    Single date picker

    Range date picker

    Time picker

    Month picker

    Text input

    Locale support

    Week numbers

    Dark and light theme

    SSR support

    Highly configurable

    Accessible

    Types included

    © Vuepic 2021-2022
    Last Updated:
    - - - diff --git a/docs/installation/index.html b/docs/installation/index.html deleted file mode 100644 index af31fd7..0000000 --- a/docs/installation/index.html +++ /dev/null @@ -1,106 +0,0 @@ - - - - - - - - - Installation | Vue 3 Datepicker - - - - -
    Vue 3 Datepicker

    Installation

    Install the component using the preferred package manager

    yarn add vue3-date-time-picker
-
-# or
-
-npm install vue3-date-time-picker
-

    Then import and register component

    Note: css file is imported separately

    Global

    In the main file

    import { createApp } from "vue";
-import App from './App.vue';
-
-import Datepicker from 'vue3-date-time-picker';
-import 'vue3-date-time-picker/dist/main.css'
-
-const app = createApp(App);
-
-app.component('Datepicker', Datepicker);
-
-app.mount('#app');
-

    Local

    In the .vue files

    <template>
-    <Datepicker v-model="date"></Datepicker>
-</template>
-
-<script>
-    import Datepicker from 'vue3-date-time-picker';
-    import 'vue3-date-time-picker/dist/main.css'
-    
-    export default {
-        components: { Datepicker },
-        data() {
-            return {
-                date: null,
-            };
-        }
-    }
-</script>
-
    <template>
-    <Datepicker v-model="date"></Datepicker>
-</template>
-
-<script>
-    import { ref } from 'vue';
-    import Datepicker from 'vue3-date-time-picker';
-    import 'vue3-date-time-picker/dist/main.css'
-    
-    export default {
-        components: { Datepicker },
-        setup() {
-            const date = ref();
-            
-            return {
-                date
-            }
-        }
-    };
-</script>
-
    <template>
-    <Datepicker v-model="date"></Datepicker>
-</template>
-
-<script setup>
-    import { ref } from 'vue';
-    import Datepicker from 'vue3-date-time-picker';
-    import 'vue3-date-time-picker/dist/main.css'
-    
-    const date = ref();
-</script>
-

    Alternatively, you can import the scss file if you want full control of the component styles

    @import 'vue3-date-time-picker/src/Vue3DatePicker/style/main.scss';
-

    Browser

    Register and use component in the .html file

    Keep in mind that when you use unpkg to import the component, global component name will be Vue3DatePicker

    Add JavaScript files

    <script src="https://unpkg.com/vue@latest"></script>
-<script src="https://unpkg.com/vue3-date-time-picker@latest"></script>
-

    Add CSS file

    <link rel="stylesheet" href="https://unpkg.com/vue3-date-time-picker@latest/dist/main.css">
-

    Register and use the component

    <script>
-    const app = Vue.createApp({
-        components: { Datepicker: Vue3DatePicker },
-    }).mount("#app");
-</script>
-

    That's it, you are ready to go

    Last Updated:
    - - - diff --git a/docs/logo.png b/docs/logo.png deleted file mode 100644 index ac79582..0000000 Binary files a/docs/logo.png and /dev/null differ diff --git a/docs/main.css.map b/docs/main.css.map deleted file mode 100644 index bf2e6ce..0000000 --- a/docs/main.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sourceRoot":"","sources":["../src/Vue3DatePicker/style/components/_DatepickerInput.scss","../src/Vue3DatePicker/style/_variables.scss","../src/Vue3DatePicker/style/components/_DatepickerMenu.scss","../src/Vue3DatePicker/style/components/_Calendar.scss","../src/Vue3DatePicker/style/components/_MonthYearInput.scss","../src/Vue3DatePicker/style/components/_SelectionGrid.scss","../src/Vue3DatePicker/style/components/_TimeInput.scss","../src/Vue3DatePicker/style/components/_ActionRow.scss","../src/Vue3DatePicker/style/main.scss"],"names":[],"mappings":"AAAA,gBACE,kBACA,WACA,iBAEA,sBACE,0CACA,aAIJ,WACE,4CACA,cCVkB,IDWlB,YCbgB,mHDchB,wCACA,aACA,iEACA,WACA,UCUc,KDTd,mBACA,QCHkB,SDIlB,2BACA,sBAEA,wBACE,WAGF,iBACE,0CAIJ,iBACE,0CAGF,cACE,oCAEA,2BACE,oCAIJ,iBACE,qBACA,MCnBc,KDoBd,OCpBc,KDqBd,eACA,UCtBc,KDuBd,mBACA,QCnCkB,SDoClB,2BACA,uBAGF,gBACE,kBACA,QACA,OACA,2BACA,2BAGF,gBACE,kBACA,QACA,QACA,2BACA,eACA,2BAGF,oBACE,aCzDuB,KD4DzB,iBACE,2CACA,qCAEA,uBACE,qCAIJ,mBACE,0CACA,oCAEA,yBACE,oCE7FJ,UACE,kBACA,sCACA,kBACA,UDgBmB,MCfnB,YDJgB,mHCKhB,UDuBc,KCtBd,iBACA,6CACA,cACA,sBAEA,iBACE,sBAGF,kBACE,sBAGF,gBACE,6CACA,aAIJ,sCACE,kBACA,MACA,OACA,QACA,SACA,cAGF,mBAGE,gCACA,mBAGF,mBAGE,uBACA,eAGF,eACE,SACA,SACA,YACA,WACA,4CACA,kBACA,kDACA,iDACA,8CAGF,kBACE,SACA,YACA,YACA,WACA,4CACA,kBACA,mDACA,oDACA,6CAGF,cACE,kBACA,cAGF,gBACE,yCACA,8BACA,cACA,iBACA,cDhFkB,ICiFlB,UDvDc,KCwDd,eACA,uBCtFF,mBACE,aACA,uBACA,mBACA,sBACA,YFJgB,mHEKhB,OAGF,qBACE,kBACA,aACA,uBACA,mBACA,2BACA,mBACA,iBAGF,0BACE,kBACA,YACA,OFPc,KEQd,QFPiB,IEQjB,MFTc,KEUd,sBAGF,kBACE,aACA,uBACA,mBACA,OFVe,MEajB,mBACE,kBACA,YACA,sBACA,2BAGF,cACE,kBAGF,0BACE,gDACA,QFzBiC,ME4BnC,gBACE,aACA,mBACA,kBACA,uBACA,cFrDkB,IEsDlB,OF1Cc,KE2Cd,QF1CiB,IE2CjB,MF5Cc,KE6Cd,6BACA,sBACA,kBAGF,wEACE,6BACA,0BAGF,kEACE,4BACA,yBAGF,iDACE,mCACA,mCAGF,oDACE,8CACA,iDAGF,4EACE,iCACA,iCAGF,iBACE,gCAGF,mBACE,gCACA,mBAqCF,mBACE,iCACA,gBACA,2CACA,8CAGF,WACE,yCAGF,cACE,gCACA,kBAGF,qBACE,gBACA,8CACA,iDAGF,2BAIE,+CAGF,yBAIE,gDAGF,+BACE,WACA,WACA,kCAGF,mBACE,YFxJ0B,KE2J5B,iCACE,WACA,wCACA,kBACA,SAGF,gBACE,UACA,kBACA,SACA,2BAKF,iBACE,WACA,OAKF,oBACE,kBACA,cFzMkB,IE0MlB,yCACA,YACA,wCACA,cACA,sBACA,eAGF,qBACE,mBAGF,kBACE,aACA,mBACA,qBACA,2BAGF,kBACE,WACA,UACA,kBACA,sCACA,2BACA,iBAGF,qBACE,SACA,SACA,WACA,UACA,yCACA,kBACA,8CACA,+CACA,6CAGF,uBACE,kBAGF,0CACE,kBACE,uBC3PJ,oBACE,aACA,mBACA,OHS0B,KGR1B,2BACA,sBAGF,eACE,aACA,mBACA,uBACA,eACA,YACA,MHD+B,KGE/B,2BACA,kBACA,kBAEA,mBACE,OHNqB,KGOrB,MHPqB,KGUvB,qBACE,iCACA,iCAIJ,uBACE,UACA,kBACA,eACA,OHtB0B,KGuB1B,aACA,mBACA,uBACA,cHnCkB,IGoClB,sBAEA,6BACE,iCACA,iCC3CJ,aACE,kBACA,gBACA,WACA,YACA,sCACA,MACA,OACA,+BACA,cACA,YJTgB,mHIUhB,2BACA,sBAGF,sCACE,2CACA,iDAGF,gCACE,UACA,iDAGF,sCACE,4CACA,mBAGF,mBACE,YACA,aAGF,uBACE,aACA,YACA,sBAGF,iBACE,UACA,sBACA,aACA,iBACA,kBACA,eACA,eACA,WACA,mBAGF,wCACE,OAGF,iBACE,sBACA,UACA,QJnCwB,IIoCxB,mBAGF,sBACE,eAGF,yBACE,eACA,cJnEkB,IIoElB,kBACA,mCACA,mCAGF,kBACE,eACA,cJ3EkB,II4ElB,kBAEA,wBACE,iCACA,iCAIJ,oBACE,gBACA,SACA,gBAGF,wBACE,UACA,sBAGF,2BACE,mBACA,oCAEA,iCACE,oCAIJ,kCACE,mBACA,4CAEA,wCACE,4CAIJ,yBACE,aACA,WACA,mBACA,8BACA,OJ1Gc,KKfhB,gBACE,WACA,aACA,mBACA,uBACA,iBACA,YLLgB,mHKMhB,2BAGF,kBACE,eAGF,8BACE,eAGF,kBACE,eAGF,8BACE,cAGF,cACE,ULImB,KKHnB,kBACA,aACA,mBACA,uBACA,sBAGF,kBACE,eACA,2BACA,cLnCkB,IKoClB,aACA,mBACA,uBACA,cAEA,wBACE,iCACA,iCAIJ,oBACE,YACA,SACA,OL3B6B,KK4B7B,ML5B6B,KK6B7B,aACA,mBACA,uBACA,eACA,kBACA,2BACA,sBAEA,wBACE,OLtC2B,KKuC3B,MLvC2B,KK0C7B,0BACE,iCACA,8BAIJ,kBACE,mCACA,mCACA,YACA,QL7DmB,KK8DnB,cL5EkB,IK6ElB,eChFF,gBACE,aACA,mBACA,WACA,QNamB,KMZnB,sBACA,2BACA,sCAEA,oBACE,ONIqB,KMHrB,WAIJ,uBACE,UACA,2BACA,UNYsB,MMTxB,oBACE,UACA,iBAGF,YACE,iBACA,eACA,QNR2B,QMS3B,cN3BkB,IM4BlB,oBACA,mBAGF,YACE,8BAGF,qBACE,uCACA,mBAGF,YACE,gCCpCF,gBACE,+BACA,sBACA,0BACA,4BACA,+BACA,4BACA,qCACA,8BACA,8BACA,2BACA,gCACA,iCACA,6BACA,kCACA,oCACA,+BACA,4BACA,qCACA,yBACA,2BACA,2BACA,4BAGF,iBACE,4BACA,yBACA,0BACA,+BACA,+BACA,4BACA,qCACA,iCACA,8BACA,wBACA,6BACA,iCACA,6BACA,oCACA,+BACA,4BACA,qCACA,yBACA,2BACA,2BACA,4BACA,kCAGF,UACE,YP3DgB,mHO4DhB,iBACA,sBAGF,aACE,eAIF,UACE,oBACA,kBAIF,YACE,WACA,kBACA,2BACA,sCACA,eACA,aACA,mBACA,qBACA,uBACA,QPrEmB,KOsEnB,sBACA,OP7EkB,KO+ElB,kBACE,iCACA,iCAGF,gBACE,OPlFqB,KOmFrB,WAIJ,mBACE,0BPnGkB,IOoGlB,2BPpGkB,IOuGpB,kBACE,aAGF,6BACE,sBACA,kBAGF,cACE,kBAGF,0MAQE,kDAGF,0BACE,UACA,2BAGF,wBACE,UACA,4BAGF,0BACE,UACA,4BAGF,wBACE,UACA,2BAGF,oBACE,UACA,4BAGF,kBACE,UACA,2BAGF,qBACE,UACA,2BAGF,mBACE,UACA","file":"main.css"} \ No newline at end of file diff --git a/docs/sitemap.xml b/docs/sitemap.xml deleted file mode 100644 index 354dc56..0000000 --- a/docs/sitemap.xml +++ /dev/null @@ -1,49 +0,0 @@ - - - - - https://vue3datepicker.com/ - 2021-10-12T10:56:15+01:00 - 1.0 - - - https://vue3datepicker.com/installation/ - 2021-10-12T10:56:16+01:00 - 0.8 - - - https://vue3datepicker.com/api/props/ - 2021-10-12T10:56:20+01:00 - 0.6 - - - https://vue3datepicker.com/api/components/ - 2021-10-12T10:56:19+01:00 - 0.6 - - - https://vue3datepicker.com/api/slots/ - 2021-10-12T10:56:22+01:00 - 0.6 - - - https://vue3datepicker.com/api/events/ - 2021-10-12T10:56:20+01:00 - 0.6 - - - https://vue3datepicker.com/api/methods/ - 2021-10-12T10:56:21+01:00 - 0.6 - - - https://vue3datepicker.com/customization/theming/ - 2021-10-12T10:56:21+01:00 - 0.6 - - - https://vue3datepicker.com/customization/scss/ - 2021-10-12T10:56:21+01:00 - 0.6 - - \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index f2b2a2b..cc525b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,13 @@ { "name": "vue3-date-time-picker", - "version": "2.8.0", + "version": "2.8.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "vue3-date-time-picker", - "version": "2.8.0", + "version": "2.8.1", + "hasInstallScript": true, "license": "MIT", "dependencies": { "date-fns": "^2.28.0" diff --git a/package.json b/package.json index a1dc39c..bc61da3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue3-date-time-picker", - "version": "2.8.0", + "version": "2.8.1", "description": "Datepicker component for Vue 3", "author": "Vuepic", "private": false, @@ -26,7 +26,8 @@ "test": "cross-env NODE_ENV=test node_modules/.bin/vue-cli-service test:unit", "lint": "run-s lint:style lint:vue", "lint:style": "stylelint --fix \"src/**/*.scss\"", - "lint:vue": "eslint --fix \"src/**\" --ignore-pattern \"src/**/*.scss\"" + "lint:vue": "eslint --fix \"src/**\" --ignore-pattern \"src/**/*.scss\"", + "postinstall": "node postinstall.js" }, "devDependencies": { "@babel/core": "^7.17.5", diff --git a/postinstall.js b/postinstall.js new file mode 100644 index 0000000..a96d05c --- /dev/null +++ b/postinstall.js @@ -0,0 +1,3 @@ +console.log( + '>>>> "vue3-date-time-picker" is now moved to a new repository with a new name. This package will be deprecated soon. New repository: https://github.com/Vuepic/vue-datepicker', +); diff --git a/src/Vue3DatePicker/components/MonthYearInput.vue b/src/Vue3DatePicker/components/MonthYearInput.vue index cbe6cf8..5ba6f22 100644 --- a/src/Vue3DatePicker/components/MonthYearInput.vue +++ b/src/Vue3DatePicker/components/MonthYearInput.vue @@ -243,7 +243,7 @@ return props.range && props.internalModelValue && props.monthPicker ? (props.internalModelValue as Date[]) : []; }); - const getGroupedList = (items: IDefaultSelect[], reverse: Boolean = false): IDefaultSelect[][] => { + const getGroupedList = (items: IDefaultSelect[], reverse = false): IDefaultSelect[][] => { const list = []; for (let i = 0; i < items.length; i += 3) {