Add options on the SplitTextWrapper component

[ReneDrie]

There are some options I think would make this component more useable.

• Option to add a className as a prop to the rendered element
• tag prop for what element is rendered (default a div, but span would fix hydration issues I believe

And this is perhaps a typing issue, but SplitText has an elements field, but it's not in the typing. Now it's impossible to reach the rendered wrapper element in code. How could we achieve this?

[ThaNarie]

tag prop for what element is rendered (default a div, but span would fix hydration issues I believe

From what I understood, the last time I checked this, is that GSAP / SplitText doesn't support anything but div.
At least their documentation says so.

Do you have an example that shows that you can change it? And if so, I presume it only works for certain modes (e.g. never in line mode, maybe only in word/char mode where it doesn't wrap over multiple lines?)

[ReneDrie]

tag prop for what element is rendered (default a div, but span would fix hydration issues I believe

From what I understood, the last time I checked this, is that GSAP / SplitText doesn't support anything but div. At least their documentation says so.

Do you have an example that shows that you can change it? And if so, I presume it only works for certain modes (e.g. never in line mode, maybe only in word/char mode where it doesn't wrap over multiple lines?)

I'm not talking about the tags that SplitText itself renders, you can already change that with the tag option in the SplitTextVariables. While this does cause some issues (which can be resolved by setting the elements to display: inline-block), for me it gives cleaner output.

But I'm talking about the div that the SplitTextWrapper always renders, to apply the SplitText on. I think this could also perfectly be a span as option, because that should resolve Hydration issues when rendering it in a <p> tag.