[Calendar] Implement component

[TitusKirch]

Description

I would like to propose the implementation of daily, weekly and monthly calendar components in Nuxt Ui. As these can get quite large and complex, I would also understand if they were Nuxt Ui Pro components.

Examples (from TailwindUI):

• Month view
• Week view
• Day view

Additional context

No response

[MickL]

Isnt this a duplicate of https://github.com/nuxt/ui/issues/209 ? If yes: It has been decided not to add a datepicker to Nuxt UI.

There is an example on how to add a datepicker in the docs: https://ui.nuxt.com/getting-started/examples#datepicker

[TitusKirch]

Isnt this a duplicate of #209 ? If yes: It has been decided not to add a datepicker to Nuxt UI.

There is an example on how to add a datepicker in the docs: https://ui.nuxt.com/getting-started/examples#datepicker

I don't mean a datepicker (see the linked examples)

[MickL]

I dont think it is the idea of Nuxt UI to deliver everything imaginable. From my understanding it is more about interactive UI elements. Tailwind UI on the other hand is preparing kinda everything and I wonder why dont you simply use their calendar? You didnt mention any features that this Nuxt UI calendar should have, so why dont you simply use the code they supply?

[Wafje]

Hi @TitusKirch,

I bumped into this today: https://fullcalendar.io/docs/vue Maybe this can help you?

[TitusKirch]

I dont think it is the idea of Nuxt UI to deliver everything imaginable. From my understanding it is more about interactive UI elements.

This is precisely why I personally see a calendar as a good extension, as there is a lot of interaction logic here. E.g. the drag & drop logic

Tailwind UI on the other hand is preparing kinda everything and I wonder why dont you simply use their calendar?

Tailwind offers you ready-styled components without logic and here I would see NuxtUi as suitable. For example, Tailwind UI also has some tables, but NuxtUi also has a table with features like sorting.

You didnt mention any features that this Nuxt UI calendar should have, so why dont you simply use the code they supply?

I have already answered the last point above. Some examples of features that come to mind:

• Drag & drop of events
• Correct placement of events (next to each other for (partially) parallel events)
• Resizing of events (to adjust the duration) e.g. in a monthly view over days or in a daily view over hours

Hi @TitusKirch,

I bumped into this today: https://fullcalendar.io/docs/vue Maybe this can help you?

This looks very cool, unfortunately this currently does not support theming via Tailwind CSS and an issue for this has been open since Sep 28, 2020 and earmarked for Milestone v7 since Aug 8, 2022 (which is supposed to come in Q1 & Q2 2024 according to the roadmap).

[iamsurelydaveydave]

I hope NuxtUI go for this one, vuetify 3 calendar is not out yet and fullcalendar.io is not that great.

[hywax]

I think we should take https://www.radix-vue.com/components/calendar.html