kenhyuwa / litepie-datepicker Goto Github PK

View Code? Open in Web Editor NEW

372.0 5.0 76.0 763 KB

Litepie Datepicker is a date range picker component for Vue.js and Tailwind CSS, dependent to day.js.

Home Page: https://litepie.com

License: MIT License

JavaScript 16.30% Vue 83.70%

litepie litepie-datepicker vue-datepicker vue-daterange-picker

litepie-datepicker's Introduction

Litepie Datepicker is a date range picker component for Vue.js and Tailwind CSS, dependent to day.js.

Documentation

For full documentation, visit litepie.com.

Simple Usage

How it works,

<template>
  <div>
    <litepie-datepicker
      ref="myRef"
      :formatter="formatter"
      v-model="dateValue"
    />
  </div>
</template>

<script>
import { ref } from 'vue';
import LitepieDatepicker from 'litepie-datepicker';

export default {
  components: {
    LitepieDatepicker
  },
  setup() {
    const myRef = ref(null);
    const dateValue = ref([]);
    const formatter = ref({
      date: 'DD MMM YYYY',
      month: 'MMM'
    });

    return {
      myRef,
      dateValue,
      formatter
    };
  }
};
</script>

Theming options

Light mode
Dark mode

Changelog

All notable changes to this project will be documented in this file, Read.

License

The MIT License. Please see for more information.

Thanks to

Vue
Tailwind CSS
day.js
and other support...

litepie-datepicker's People

Contributors

Stargazers

Watchers

Forkers

lubnaabidah tomhuijer rut2 swiftalker batnieluyo nezamy howard0401 mariusspring jangcool ivanroslov roguesherlock insolita stevebauman manogi hognevevle gregoriohc lorune asrori7 tdmichaelis wasxxm devheniik thangtq1009 lautaroml bjimdar elreco sasureshkumar muarachmann kangata cgtarmenta arctic-media-solutions tamaasrory ascenea jayjfletcher aditgege ievgeniibrovdii gabstafari luisfws msoftware dammy001 aryraditya skadid killix anand-patel notedsource andresayej dungfv alexswtlsk turbovue envatic flexponsive nh-nico atunjeafolabi aymaneoggvo suraj740 davmixcool webitsdk previdifr discoverlunar limweb jonathanwiley jreyesgs syifeng dommer1 elliottcoe manjumjn ronnorthrip curiousteam alexdoffgit almirhodzic

litepie-datepicker's Issues

How can i select single date

is there are any way to select a single date in double date-picker view

I have some questions about Tailwind css.

1.Do I need to download all the Tailwind CSS to display this plugin UI properly?

2.Don't you provide a small version of CSS to express the calendar UI?

It is burdensome to use in projects that do not use Tailwind CSS.

Plug-in is so good and I want to use it. Thank you for providing this plug-in.

Small bug: change month

https://litepie.com

Select range
Open datapicker again
Change month (It's ok now)
Then change month back (On the right, the month will change too)

Formatter not changed in setup

@kenhyuwa, I recently used the vue2-litepie in Nuxt.js using the @nuxt/composition-api and it works correctly basically, I had an issue with the format where I created a simple format using ssrRef

setup(props) {
    const myRef = ssrRef(null);
    const dateValue = ssrRef([]);
    const formatter = ssrRef({
      date: 'DD MMM YYYY',
      month: 'MMM',
    });

    watch(dateValue, (oldValue, newValue) => {
      props.context.model = newValue;
    });
    return {
      myRef,
      dateValue,
      formatter,
    };
  }

then I passed the formatter to the litepie in the template but nothing changed, it takes the default formatter always

is there any solution for that ?

Disabling current date

Hello, and awesome library!

I believe there is a bug with disabling current date. If you use :disable-date prop to try and disable today, it doesn't work, the date can still be picked.

Example:
I set :disable-date to disable 22.06.2021 (today), user can still select date.

Looking forward to a response!

AutoApply on customShortcuts

On mobile, when using customShortcuts, it's impossible to apply changes when autoApply is set to false.

It could be great to set dates directly and submitting it.

Here is the code of my shortcuts, maybe I missed something :

      return [
        {
          label: '7 derniers jours',
          atClick: () => {
            const date = new Date()
            return [
              new Date(date.setDate(date.getDate() - 7)),
              new Date(),
            ]
          },
        },
// ...

RTL Support Issue

Hello, @kenhyuwa
Thanks for this awesome component

I have an issue with RTL direction

I suggest using tailwindcss-rtl pluging to fix the direction by replacing classes like pl-3 pr-12 left-3 right-3 text-left to ps-3 pe-12 start-3 end-3 text-start

I'm using version 1.0.12 and still i18n="ar" not work with the Arabic language and it's listed here

Shortcuts for single?

We can't we have shortcuts working together with as-single? I'd like to use a button, for example "7 days ahead" which selects 7 days from now, on single.

Uncaught ReferenceError: start is not defined

I came upon this error today:
Uncaught ReferenceError: start is not defined

On this line:

litepie-datepicker/src/litepie-datepicker.vue

Line 747 in 655bced

obj[start] = s;

I think this is missing on the line before:
const [start, end] = Object.keys(props.modelValue);

Trigger don't work in tailwind modal

Hi, i have a strange situation. Datepicker works ok in a custom page, but when i try to show in a modal, trigger doesn't work and datepicker doesn't show.

As you can see, display:none is the status of the class, even when i focused or used custom trigger.

I tried without a modal and it's work ok...

Thanks in advance.

Support for multiple langues

First of all, great work! Love that you use Tailwind and support Vue 3.

I saw in the props that you planned i18n support in the next major release. Do you know approximately when would that be? Would you be open to accept a PR for i18n support sooner than next major version if I submit one?

formatter issue because of class based component

I have this date picker component where I'm using class-based component using extends Vue, the majority of props are passed correctly and the date picker is rendered correctly, but the problem is that passing the formatted is not possible because I'm using extends Vue instead of export const defineComponent({}) where : defineComponent is imported from '@nuxtjs/composition-api'

this is the source code of the component:

<template>
  <client-only>
    <litepie-datepicker
      :as-single="asSingle"
      :overlay="overlayDatepicker"
      :disable-date="disableDate"
      :shortcuts="dateShortcuts"
      :disable-in-range="disableInRange"
      :options="datepickerOptions"
      :i18n="i18n"
      :auto-apply="autoApply"
      :trigger="triggerDatepicker"
      v-model="context.model"
    />
  </client-only>
</template>
<script lang="ts">
import { ssrRef, watch } from '@nuxtjs/composition-api';
import LitepieDatepicker from 'vue2-litepie-datepicker';
import { Vue, Component, Prop } from 'vue-property-decorator';
@Component({
  name: 'datepicker',
  components: {
    LitepieDatepicker,
  },
})
export default class Datepicker extends Vue {
  @Prop({
    type: Object,
    required: true,
  })
  private context!: any;
  private asSingle: Boolean = false;
  private overlayDatepicker: Boolean = false;
  private dateShortcuts: Boolean = false;
  private disableInRange: Boolean = false;
  private triggerDatepicker = '';
  private autoApply: Boolean = false;
  private i18n = '';
  private disableDate = '';
  private slot = null;
  private datepickerOptions = null;
  setup(props) {
    const myRef = ssrRef(null);
    const dateValue = ssrRef([]);
    const formatter = ssrRef({
      date: 'DD MMM YYYY',
      month: 'MMM',
    });
    watch(dateValue, (oldValue, newValue) => {
      props.context.model = newValue;
    });
    return {
      myRef,
      dateValue,
      formatter,
    };
  }

  mounted() {
    this.asSingle = this.context?.attributes['as-single'];
    this.overlayDatepicker = this.context?.attributes['overlay-datepicker'];
    this.disableDate = this.context?.attributes['disable-date'];
    this.dateShortcuts = this.context?.attributes['date-shortcuts'];
    this.disableInRange = this.context?.attributes['disable-in-range'];
    this.triggerDatepicker = this.context?.attributes['trigger-datepicker'];
    this.datepickerOptions = this.context?.attributes['datepicker-options'];
    this.slot = this.context?.attributes['v-slot-datepicker'];
    this.i18n = this.context?.attributes['i18n-datepicker'];
    this.autoApply = this.context?.attributes['auto-apply'];
  }
}
</script>

<style lang="scss">
*[style*='display: none'] {
  display: none !important;
}

.focus\:ring:focus {
  @apply ring-2 focus:ring-primary-600;
}

.border-litepie-secondary-300 {
  @apply border-solid border border-gray-300 focus:ring-gray-300 focus:border-primary-300;
}

.border-litepie-secondary-300:hover {
  @apply ring-1 hover:bg-gray-200 ring-gray-300;
}
#litepie {
  @apply my-2;
}

.bg-litepie-primary-500 {
  @apply bg-primary-500;
}
.text-litepie-primary-600 {
  @apply text-primary-600;
}
.bg-litepie-secondary-100 {
  @apply bg-primary-100;
}
.text-litepie-secondary-700 {
  @apply text-gray-700;
}

.placeholder-litepie-secondary-400 {
  @apply placeholder-gray-300;
}

.text-litepie-secondary-400 {
  @apply text-gray-400;
}
</style>

the issue is that the formatter is not detected from setup() function in the template,
How can I make this class-based component a component based on defineComponent({}) to pass correctly the new format of dates?

Support Vue v2.x / Nuxt v2.x

I tried to install litepie-datepicker in my Nuxt 2.x project which has Vue v2.x under the hood and having some issues. Even though I was able to add litepie-datepicker as a plugin - it's throwing errors such as:

litepie-datepicker.esm.js?8527:119 Uncaught TypeError: Object(...) is not a function
    at eval (litepie-datepicker.esm.js?8527:119)
    at Module../node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js (app.js:2133)
    at __webpack_require__ (runtime.js:854)
    at fn (runtime.js:151)
    at eval (litepie-datepicker.js?3366:1)
    at Module../plugins/litepie-datepicker.js (app.js:994)
    at __webpack_require__ (runtime.js:854)
    at fn (runtime.js:151)
    at eval (index.js:70)
    at Module../.nuxt/index.js (app.js:322)

./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:86-94"export 'Fragment' was not found in 'vue'

This is my Nuxt.js plugin file:

import Vue from "vue"
import LitepieDatepicker from "litepie-datepicker"

Vue.use(LitepieDatepicker)

manually set the date

I have a search filter and I need to keep the filter state even if the user closes the page, how do I set the date manually? Assuming that I saved it in the session storage for example

week start?

Hi all,
How can I set week start day to Monday?
BR
Hasan

How can I disable datepicker?

Hi, thanks for awesome library!

Is there a way to pass disabled prop to disable whole component?
For now, if I'm passing disabled: false - I can still click and see the dropdown.
To disable click I can add style with pointer-events: none, but still with tab button I can make focus on button:

Possibility to style the Datepicker itself?

Hello,

is it possible to customize the datepicker's element (not the input form) to match the "look & feel" of my web app?

E.g. use no radius here:

Litepie-datepicker doesn't support tailwind config with max size small screen configuration

It won't display properly the datepicker with this custom tailwind screen sizes configuration

theme: {
extend: {
screens: {
'xs': {'min': '320px', 'max': '639px'},
'sm': {'min': '640px', 'max': '767px'},
'md': {'min': '768px', 'max': '1024px'},
'lg': {'min': '1025px'},
}
}
},

set date range programmatically

I initiate the datepicker with default value, and it is working fine....

data: function(){
    return {
        date: ['01 Jan 2022', '10 Jan 2022'], 
    };
},

..this is working fine...

the string value in the input field will become 01 Jan 2022 ~ 10 Jan 2022...

but when I update the model value, it is not working

methods:{
    updateDate()
    {
        this.date = ['20 Jan 2022', '26 Jan 2022'];
    }
}

the string value in the input field still show previous value 01 Jan 2022 ~ 10 Jan 2022...

i expected the string value in the input field become 20 Jan 2022 ~ 26 Jan 2022.. but it's not

how to solve this?

Calendar doesn't get trigger while loading inside `Portal`

When this date-picker get used inside modal which renders inside portal (teleport: https://v3.vuejs.org/guide/teleport.html), the show and hide method doesn't get triggered. Which means, the calendar will not appear.

Error/Warning Integration Laravel 8

Guys, I'm trying to insert the DataPicker into a Laravel 8 instance.
All dependencies are installed and validated, but when I run "npm run dev" I get several Warnings and I can't insert the Template in my Laravel Blade.
I tried several things but nothing worked.
Does anyone know what can it be? Are there any compatibility issues?

WARNING in ./resources/js/components/NewDataPicker.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib/index.js??clonedRuleSet-5[0].rules[0].use[0]!./node_modules/vue-loader/lib/index.js??vue-loader-options!./resources/js/components/NewDataPicker.vue?vue&type=script&lang=js&) 15:20-23
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./resources/js/app.js 13:10-19
export 'createApp' (imported as 'createApp') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 119:13-28
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:9-18
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:22-33
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:54-65
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:86-100
export 'withDirectives' (imported as 'withDirectives') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:101-112
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 168:134-145
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 172:7-16
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 172:20-31
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 172:52-63
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 177:36-41
export 'vShow' (imported as 'vShow') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 177:88-99
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 177:120-131
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 177:153-164
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 180:17-32
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 182:34-45
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 182:67-78
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 185:17-32
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 187:36-47
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 187:68-82
export 'withDirectives' (imported as 'withDirectives') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 187:83-94
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 187:116-127
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 191:7-16
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 191:20-31
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 191:53-64
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 196:36-41
export 'vShow' (imported as 'vShow') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 201:15-30
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:9-18
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:22-33
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:57-66
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:74-85
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:86-94
export 'Fragment' (imported as 'Fragment') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 217:102-112
export 'renderList' (imported as 'renderList') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 218:11-20
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 218:24-35
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 221:8-19
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 221:43-54
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 224:19-34
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 232:15-30
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:9-18
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:22-33
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:57-66
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:74-85
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:86-94
export 'Fragment' (imported as 'Fragment') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 244:102-112
export 'renderList' (imported as 'renderList') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 245:11-20
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 245:24-35
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 248:8-19
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 249:19-34
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 256:15-30
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:9-18
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:22-33
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:57-66
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:74-85
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:86-94
export 'Fragment' (imported as 'Fragment') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 273:102-112
export 'renderList' (imported as 'renderList') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 274:11-20
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 274:24-35
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 277:8-19
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 277:43-54
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 280:19-34
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 288:15-30
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 300:27-33
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 301:32-38
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 302:30-36
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 303:24-30
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 318:9-18
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 318:22-33
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 318:56-67
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 318:68-83
export 'TransitionGroup' (imported as 'TransitionGroup') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 326:13-20
export 'withCtx' (imported as 'withCtx') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 326:29-38
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 326:46-57
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 326:58-66
export 'Fragment' (imported as 'Fragment') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 326:74-84
export 'renderList' (imported as 'renderList') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 327:13-22
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 327:26-37
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 333:10-21
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 333:22-32
export 'Transition' (imported as 'Transition') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 341:17-24
export 'withCtx' (imported as 'withCtx') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 341:79-88
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 341:92-103
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 344:23-41
export 'createCommentVNode' (imported as 'createCommentVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 346:16-27
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 353:21-36
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 363:15-30
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 374:23-29
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 375:27-33
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 376:25-31
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 377:27-33
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 378:27-33
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 379:32-38
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:43-52
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:56-67
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:113-122
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:126-137
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:160-169
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:177-188
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:189-197
export 'Fragment' (imported as 'Fragment') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 415:205-215
export 'renderList' (imported as 'renderList') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 416:11-20
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 416:24-35
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 418:8-19
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 421:15-28
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 422:19-34
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 424:18-27
export 'openBlock' (imported as 'openBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 424:31-42
export 'createBlock' (imported as 'createBlock') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 424:64-75
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 424:89-100
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 427:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 428:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 428:45-56
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 428:70-81
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 431:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 432:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 432:49-60
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 432:74-85
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 435:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 436:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 436:47-58
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 436:72-83
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 439:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 440:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 440:48-59
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 440:73-84
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 443:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 444:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 444:52-63
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 444:77-88
export 'createVNode' (imported as 'createVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 447:39-52
export 'withModifiers' (imported as 'withModifiers') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 448:5-20
export 'toDisplayString' (imported as 'toDisplayString') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 448:56-74
export 'createCommentVNode' (imported as 'createCommentVNode') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 602:28-43
export 'defineComponent' (imported as 'defineComponent') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 697:23-26
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 698:33-36
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 699:28-31
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 700:19-22
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 701:22-25
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 702:29-32
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 703:22-25
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 704:24-27
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 705:23-26
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 706:23-26
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 707:21-24
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 708:17-20
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 709:18-26
export 'reactive' (imported as 'reactive') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 721:23-26
export 'ref' (imported as 'ref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 731:18-26
export 'computed' (imported as 'computed') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 732:19-27
export 'computed' (imported as 'computed') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 733:21-29
export 'computed' (imported as 'computed') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 738:10-15
export 'unref' (imported as 'unref') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 805:12-20
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 823:14-22
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 897:12-20
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 916:14-22
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1591:4-9
export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1592:6-14
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1596:4-9
export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1606:4-15
export 'watchEffect' (imported as 'watchEffect') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1617:4-15
export 'watchEffect' (imported as 'watchEffect') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1619:6-14
export 'nextTick' (imported as 'nextTick') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1632:19-26
export 'isProxy' (imported as 'isProxy') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1733:4-11
export 'provide' (imported as 'provide') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1734:4-11
export 'provide' (imported as 'provide') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1735:4-11
export 'provide' (imported as 'provide') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1736:4-11
export 'provide' (imported as 'provide') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1737:4-11
export 'provide' (imported as 'provide') was not found in 'vue' (possible exports: default)

WARNING in ./node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js 1738:4-11

Datepicker Position top / bottom

The date-picker always open at bottom of page.

But it some case it may be needed to open at top, please check this screenshot:

Ideally here if component automatically adjust based on window then it would be great.

How can I view only "month" mode or "year" mode ranges

I would like to offer view for users in these 3 modes: complete with day, month and year and only month ranges or year ranges.
Something like this:

Showing only "Month range" mode

Showing only "Year range" mode

How can I achieve the same with litepie-datepicker ??

Thanks!

Start date is not reactive

Hello!

I have a computed property for "startDate". I expect when this computed propety changes, then the datepicker will react to that and change the start position also. At the moment it only takes into account the first computed value, and not updated ones.

Build failed with 7 errors: node_modules/litepie-datepicker/dist/litepie-datepicker.esm.js:1:18: error: Could not resolve "dayjs" (mark it as external to exclude it from the bundle)

Datepicker alignment

Hi,

Thank you for your work !

As you can see below, the right calendar isn't available, because it's the end of my screen.

It would be great to be able to define if the div under the label has to be on the left or on right side.
Maybe something like this :

To do so, I simply added a right-0 here <div class="absolute z-50 inset-x-auto top-full sm:mt-2.5 right-0" and set the right-3 in the .litepie-datepicker::before class instead of the left-3.

Active state for Shortcuts

I used custom Shortcuts. There is no active state for Shortcuts. So i want the active state like below image. How can i do this?

Display format and get other format

Hello,
How I can display date format in input and get another format as a value

Events

Hi, I am using this plugin in order to select a date and a range, but I need to get when use select a date (or range) and when It clicks on apply and cancel button. Is this possible?

Thanks.

Typescript Support

Hello Ken, any plans for typescript typings for the project?

strange behavior calendar

I don't know what's happening is not giving any error I've done all the procedures, even so layout messed up.

tailwind is `base` utility is creating conflicts in existing project.

As litepie-datepicker is rely on tailwind, after successful integration of tailwind, it's conflicting with existing CSS that causes lots of design issues.

How can I integrate litepie without affecting existing design?

Invalid date when startDate is outside of endDate month

Hi,

When setting startDate outside of the endDate month, the datepicker is showing Invalid Date. This issue can be seen on your home page also.

When opening the date picker and selecting a custom filter, it fixes the issue. When manually selecting a new range, the issue still occurs.

There's a way to indicate availability??

I would like to use this module to filter data, I would like to know if is possible to add the data availability making the days green or something similar the selection range

Thnaks

Allow manual input

When a user manually inputs a date, the model is not updated, even if the entered date is valid

Enabling only a few dates

Hello! I'm creating a checkin and checkout calendar, however, I only see you are able to disable specific dates. Using the function callback on :disable-date would not work, because the disabled dates would rely on other component data, and the function would not rerun whenever that data changes. Using a computed property would require me to return an array of ALL dates except available checkin dates.

Is there a similar :disable-date but instead for :enable-date? That way I could only have a computed property returning an array of available checkin and checkout dates, disabling all other dates.

Thanks for help!

i18n - Vite

Using vite, i18n doesn't work.

/app/node_modules/.vite/litepie-datepicker.js
1997|        const locale = props.i18n;
1998|        nextTick(() => {
1999|          import(`dayjs/locale/${locale}.js`).then(() => {
|   |                 ^
2000|            import_dayjs.default.locale(locale);
2001|            let s, e;
The above dynamic import cannot be analyzed by vite.
See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.```

Tailwind 3 support

Hi,

Thanks for the great package,

It there a plan to support Tailwind 3 as i get this error while installing:

npm ERR! While resolving: undefined@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/tailwindcss
npm ERR!   dev tailwindcss@"^3.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer tailwindcss@"^2.0.3" from [email protected]
npm ERR! node_modules/litepie-datepicker
npm ERR!   litepie-datepicker@"*" from the root project

Thanks.

Do you support hours, minutes, seconds?

I think this is so good.
However, I can't see an example of selecting a time.
Are you not applying?

Is it not supported as in the image below?

Need to change input style

Hello,
I want to change the input style you may add something like input-class="px-2 py-1" props and this replacing the default classes
litepie-datepicker.vue line 21

:class="inputClass ||  'relative block w-full pl-3 pr-12 py-2.5 rounded-lg overflow-hidden text-sm text-litepie-secondary-700 placeholder-litepie-secondary-400 transition-colors bg-white border border-litepie-secondary-300 focus:border-litepie-primary-300 focus:ring focus:ring-litepie-primary-500 focus:ring-opacity-10 focus:outline-none dark:bg-litepie-secondary-800 dark:border-litepie-secondary-700 dark:text-litepie-secondary-100 dark:placeholder-litepie-secondary-500 dark:focus:border-litepie-primary-500 dark:focus:ring-opacity-20'"

Provide alternative pre-builded css/sass instead of tailwind dep

It looks like really bad practice - to require tailwind as a component dependency, without default style

Missing CustomParseFormat plugin

The dayjs CustomParseFormat is required to properly parse custom date formats.

Without this plugin using a DD-MM-YYYY format flips the day/month on selection.

How can I add custom styles ?

is there any prop to pass custom theme classes?
just like https://vue-tailwind-picker.netlify.app/options/#theme

Support Vue 2

It should support Vue 2 via @vue/composition-api

nuxt v2

Hi this is possible implement with nuxt?any sample

Start week on Monday

Is there a way to have Mondays appear first in the datepicker, instead of Sundays?

If not, please consider this a feature request.

npm run prod issue

When I perform npm run dev on my environment, this component works exactly as expected. Once I run npm run prod, this component does not display correctly when expanded. Functionally it works, visually it does not. The calendar essentially runs vertically down the page (not side by side calendar). Not sure why that is happening.