timomeh / react-native-material-bottom-navigation

💅🔧👌 a beautiful, customizable and easy-to-use material design bottom navigation for react-native
MIT License
709 stars 127 forks source link

React-native-web compatibility + typescript typings #73

Closed PeterKottas closed 6 years ago

PeterKottas commented 6 years ago

Hi, this solves all the compatibility issues with react-native-web plus I've added typescript typings. Sorry for mixing both in one PR but it's fairly small piece of work so I figured it would save some time.

timomeh commented 6 years ago

Wow, that's totally awesome! Thank you for contributing. I highly appreciate both improvements.

Since you recently pushed a few commits, is it still a WIP or is it finished?

PeterKottas commented 6 years ago

Cheers mate, nah, it's good to go now. I was just fixing some stuff up. I've put a comment into PR about it. BS Android is forces overflow hidden on web so I had to play around with fixing the label being cut off. All good now ;)

PeterKottas commented 6 years ago

There's actually one small issue left. Apparently css transition is not supported by react-native. However, react-native-web forwards unknown props to dom so the result actually animates beautifully. The problem is you get an ugly warning in console about it. I wish this could be solved. I'll look into some ways of solving it but I don't see an obvious one right away. (this only happens on web so we're not breaking anything, just room for improvement)

timomeh commented 6 years ago

I tested it and it works really well. To be honest, I'm really astonished how well it works. I didn't thought that. 😄 I also tested it on my Pixel 2, and the flex-transition looks very smooth.

As I accidentally wrote in #74, I won't release it immediately. I'll first want to add tests, lint everything, and setup a CI.

I will follow up once it's published.

In the meantime you should be able to use npm install git://github.com/timomeh/react-native-material-bottom-navigation.git

PeterKottas commented 6 years ago

Awesome! Good news indeed. I also though this would be an uphill battle but it seems react-native-web is becoming quite mature. Other than dropping LayoutAnimation, there was hardly anything I needed to do. Good stuff! GL with the setup, I am ok for now. Will change it once done

PeterKottas commented 6 years ago

Hey bud, one more thing. I guess you are mid release so I don't want to PR again. It's very small thing. I found a way to fix those anoying warning on web with transition. This works: https://github.com/PeterKottas/react-native-material-bottom-navigation/commit/577edcc088b0528f8d481f3206584c9e78c31dd5 It's very small, I think it will be easier for you to commit it directly. If not I can PR. Let me know.

PeterKottas commented 6 years ago

Some docs about this : https://github.com/necolas/react-native-web/issues/707

timomeh commented 6 years ago

Thank you, I'll include it.

PeterKottas commented 6 years ago

👍

timomeh commented 6 years ago

Released as version 0.9.0 :rocket: