Add zero-config web support

[nandorojo]

Details

(Still a draft)

Removes any dependency on React Native, React Native Web, for Web users. Nothing changes for native. This should drastically fix any installation steps / config issues for Web users. Without these changes, web users will flood your issues constantly lol.

• Rename .web.tsx files to be .native.tsx
• Remove usages of inline Platform.select in favor of .native.tsx
• Use web-specific code as the main file for any cross-platform files.
• Remove StyleSheet.create
• Remove StyleSheet.flatten (slow and not useful for this case)
• Use inherit for caretColor instead of StyleSheet.flatten(props.style).color (pure CSS implementation, reproduction)
• Address webStyleUtils
• Remove the erroneous style = {} in the web file which broke memoization entirely for no benefit.

Breaking change

There is one breaking change: Consumers using StyleSheet.create on web will no longer work. They should be converted to plain style objects. This can be easily addressed with an error message. This breaking change could be easily reverted, but I recommend keeping it. Zeego made this change, and it was well worth it.

Related Issues

GH_LINK

Closes #579

Manual Tests

Linked PRs

[nandorojo]

Some feedback:

Currently webStyleUtils uses the following from React Native Web. I recommend removing or upstreaming them to get rid of the dependency on react-native-web.

1. createReactDOMStyle (code)
   a. This adds support for a bunch of stuff that's basically never used, such as marginInline
   b. I'm thinking this could be simplified and implemented directly in library code, especially as React Native starts to support web code
   c. The only one that we might want to keep is the flex styles. I think this should be implemented by this lib instead of importing from RNW.
2. preprocessStyle (code)
   a. The only real function this modules serves is to give deprecation warnings about the styles. I think this step should also get removed, as React Native now supports (and prefers) the web styles.
3. dangerousStyleValue (code)
   a. This is nothing more than checking for nullish values / numbers / empty strings. This should be upstreamed to this library.

Tamagui, Gluestack, etc have all upstreamed these functions into their own libs, as seen here.

I haven't implemented these changes yet, I'll wait for feedback first. CC @tomekzaw

[natew]

I can vouch for these changes as being beneficial generally for web compat. Ideally it'd be a mostly headless setup and all native files are in .native, with web being the "default". This makes for no-config setups.