Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Does not work with tailwind styling approaches #4

Open
1finedev opened this issue Jul 27, 2023 · 7 comments
Open

Does not work with tailwind styling approaches #4

1finedev opened this issue Jul 27, 2023 · 7 comments

Comments

@1finedev
Copy link

I want to thank you for this amazing package which makes creating beautiful shimmers a breeze.

I style using nativewind in react native hence i have children that might look like this

      <View className="w-[6vh] h-[6vh] bg-primary rounded-full" />

but it does not show up unless i use the style attribute.
any insight is appreciated

@LucasVeloz
Copy link
Owner

Thank you for your issue. It seems legit. I'll take a look and try to find a solution. If you already have a solution feel free to send your PR.
I work on this project in my free time. I'll look this issue on the weekend.

@MariyaAntonenko
Copy link

@LucasVeloz thank you for your amazing package, unfortunately it doesn't work with styled component as well.

@LucasVeloz
Copy link
Owner

@MariyaAntonenko @Klin-Coders Could you test if this version is supporting?

@PopBot
Copy link

PopBot commented Nov 14, 2023

Hi, I just tested the latest edition with the twrnc package, and unfortunately didn't find it to be compatible. Willing to help out.

@LucasVeloz
Copy link
Owner

Hi! I'll take a look and fix it. It might take a while... because I work on this in my free time.
If you wanna collaborate, you could help fixing the issue, with documentation... any help are welcome!
thank you guys for the participation

@LucasVeloz
Copy link
Owner

I was thinking in creating a fallback props, if the library doesn't get the style of the child. it appeals to the fallback index. It might resolve for you guys? @PopBot @1finedev @MariyaAntonenko

@PopBot
Copy link

PopBot commented Dec 2, 2023

I looked react-native-shimmer-placeholder because twrnc is working there.

After taking a brief look at the code of both packages, I do think it has to do with the defaultStyles, and our issue lies within createChildensWithStyles in utils.ts. I think it's when the cssStyles are being reduced where the the twrnc styling breaks.

Perhaps if we just spread the style prop and removed the reducing in createChildrensWithStyles, that might help?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants