input label on non-active state

[tesis]

Hi, on my input fields, I have an issue: after focus-out, the label is displayed over the input and I can't find solution. Can someone help me? When looses focus, looks like this (the html is from documentation): otherwise like this:

I'm using vueJs, and my last code looks like this:

onMounted(async () => {
    const { Input, Ripple, initTE } = await import('tw-elements')
    // other tries:

    // const importTE = async () => {
    //          await import("tw-elements");
     //       };
     //       importTE();

})

[juujisai]

Hello! Did you try initializing the component via initTE method? Try calling initTE( { Input, Ripple } ) under the async import of those elements. I suppose the border is not changing colors on focus aswell?

[tesis]

Hello, juujisai I tried, is still the same. Borders are not shown at all :(

[juujisai]

If the borders do no appear at all it suggest that the Input was not initialized. To make sure, you can try checking whether element with data-te-input-notch-ref attribute was created. It looks like this:

Did you try following our vue integration tutorial? https://tw-elements.com/docs/standard/integrations/vue-integration/

[tesis]

I'm using other components and are working fine. The only issue I have are Input elements.

[juujisai]

Would you mind sharing a code snippet with us to help troubleshoot the issue? Also, have you had a chance to verify if the element with data-te-input-notch-ref is present in the input wrapper?