Feedback on the new Beta 📢

[filipkappa]

It's finally here! 🚀

We’re using this discussion as a place for the community to leave general feedback on the latest Tailwind Elements beta version.

Our latest release is a breakthrough, which takes Tailwind Elements to an entirely new level.
With this release, we're setting a new path for the project in hopes of making it a community-driven toolkit fit for professional use.

Read more about the completely new, revamped edition of Tailwind Elements in our latest changelog.

How can I help? ✋

Right now we need 2 simple things from you:

1. If you find any bugs - make sure to open an issue this will help us a lot!
2. Let us know how you feel about the new version! Leave your general feedback in the comments below ☟

What to expect soon? 🤔

• we'll be introducing new spaces & discussions for the community soon, so keep tuned
• we now have a better ground for future development, and the team is highly motivated, so make sure you keep an eye on the upcoming updates (they will be more frequent now)

[magricsi33]

Can the old elements be used in the new version, or do I have to create everything again from scratch?

[filipkappa]

We introduced so many changes in each component that I would definitely suggest starting from scratch.

It is a literal breakthrough version.

The upcoming updates will not add so many core changes - they will build on top of this version.

[Johnrak11]

Dear administrator,
How about Tabs & Pills elements that have been updated on 20-02-2023 is an error on windows os but it's working on mac os, therefore I hope you fix and check again.

[filipkappa]

Please create an issue & describe the bug in detail here:
https://github.com/mdbootstrap/Tailwind-Elements/issues

[witmarr97]

The new version looks very promising. Kudos for the dark theme.

[filipkappa]

Thanks for your feedback!

[M-Hosseini80]

I have problems with the new version, how can I use the old CDN?

[smolenski-mikolaj]

To use previous version please use the following scripts:

<script src="
https://cdn.jsdelivr.net/npm/tw-elements@1.0.0-alpha13/dist/js/index.min.js
"></script>
<link href="
https://cdn.jsdelivr.net/npm/tw-elements@1.0.0-alpha13/dist/css/index.min.css
" rel="stylesheet">

[M-Hosseini80]

Thanks a lot 👌

[codewithmenow]

Looks amazing. I hope you will add some instructions on contributing to the project soon.

[filipkappa]

We're working on it!

[filipkappa]

It's here! Check it out:
https://tailwind-elements.com/docs/standard/getting-started/contribute/

[rohitshakyaa]

Can you also add the documentation of old versions on tailwind elements website?

[RazneshPrajapati]

Yes, I also have some project in which I have use tailwind element. Can you please provide the document for older version as well?

[hiddenkirby]

I would also benefit from the documentation pre-2-20-2023. I can't upgrade my tw-elements version in my angular app without a sizeable amount of refactor.

[filipkappa]

We're planning to release an instruction to set up the legacy docs locally using the repo.
The project is still in beta, so we're not sure if the legacy docs will be hosted separately.

[orliyahTheCoder]

Thank you for this awesome library. I can't believe it's free

[filipkappa]

Thanks for your kind words!

[orliyahTheCoder]

Does it also work for React?

[filipkappa]

We'll be creating integration guides soon & possibly separate fully integrated packages in the future.
Let us know what should have the highest priority in our latest poll #1443

[chaloman]

beta not working on Angular 15

[filipkappa]

We'll be creating an official Angular integration, make sure to leave your vote here #1443 to raise the priority of your technology!

[wglaser-bt]

Hello Tailwind developers,

in order to test Tailwind Elements I have created a new test project with Nuxt 3, Tailwind 3 and Tailwind Elements.
"nuxt": "^3.4.2",
"postcss": "^8.4.23",
"tailwindcss": "^3.3.1"
"tw-elements": "^1.0.0-beta2"
For this I used the instructions from Tailwind Elements:
https://tailwind-elements.com/docs/standard/integrations/nuxt-integration/
I found out that initializing of components incorrect and unstable is.
I took two sample components: Carousel and Megamenu.
If I integrate the two components simultaneously and restart the server nuxt, the page doesn't work and
I get the error message: "500 document is not defined ..../node_modules/tw-elements/dist/js/tw-elements.umd.min.js :12:3074"
If I deactivate the Java Script initialization for both components, the error disappears, but the components don't work.
The only way I can avoid this is to initialize the component after each other.
But the next time the server starts, the page doesn't work again (see video).
https://we.tl/t-CevbZMa7gC

[Trochonovitz]

Hello, for proper displaying some of components (this is required only for SSR frameworks) you have to import Tailwind Elements CSS file (for example in app.vue file): import "tw-elements/dist/css/tw-elements.min.css";. (we have just updated our tutorials but fixes are yet in production). Despite of that Carousel with Mega menu and with some other components which I tested work fine.

[manzanotti]

I'm having an issue upgrading to the new beta-3, but wanted to sanity check it first, as I figure it's mostly likely something I've done wrong.

I'm using Parcel.js as my bundler, and I've updated my project to import and initialise the Modal and Tab components.

However, when I attempt to build it, it fails complaining that it can't find the file:

node_modules\tw-elements\src\js\data\chart\charts.js

Now, that path is missing the dist folder before src, however I'm wondering why this file is even being requested, given that I'm not using charts, at least not intentionally?

I'm sure that at some point in my searching today I've seen a tailwind.config.js file that had charts.js in it, but I haven't been able to find it again.

You can see the build report on GitHub:

https://github.com/manzanotti/saferstreetmaker/actions/runs/4839138453/jobs/8623987964?pr=135

Any suggestions as to what I've done wrong here appreciated.

[Phors-Stephen]

import { Datepicker, Input, initTE } from "tw-elements";

export default {

setup() {

onMounted(() => {

initTE({ Datepicker, Input  });

}) here i use vue3 and i use tw-element beta3 but it error render input when the first time render it work but when i click to the other component and comeback to component that contain input tw-element it say like this ERROR
Cannot read properties of null (reading 'setAttribute')
TypeError: Cannot read properties of null (reading 'setAttribute')
at eval (webpack-internal:///./node_modules/tw-elements/dist/js/tw-elements.es.min.js:133:4536)
at il (webpack-internal:///./node_modules/tw-elements/dist/js/tw-elements.es.min.js:48:2829) help fix me please