I'm having trouble pinning down where and how exactly to fix this issue, but it's been plaguing me pretty consistently. Usually I notice it during HMR, so I'm unsure if that's related. I also found a Github Issue (https://github.com/nativewind/nativewind/issues/873#issuecomment-2051724627) that discusses this, but it was closed without much of a resolution. I have a fairly new project and haven't altered any of the Gluestack components. Has anyone been able to fix this?

 WARN  CssInterop upgrade warning.

Making a component inheritable should only happen during the initial render otherwise it will remount the component.

To prevent this warning avoid dynamically adding CSS variables or 'container' styles to components after the initial render, or ensure it has a default style that sets either a CSS variable, "container: none" or "container-type: none".

If add/removing sibling components cause this warning, add a unique "key" prop so React can correctly track this component.
    at CssInterop.Avatar.FallbackText (http://192.168.68.50:8081/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:10654:45)
    at AvatarFallbackText (http://192.168.68.50:8081/components/ui/avatar/index.bundle//&platform=ios&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app&dev=true&minify=false&modulesOnly=true&runModule=false&shallow=true:139:26)
...

 WARN  The previous warning was caused by a component with these props: {"style":{"color":"#FFFFFF"},"children":"SB","className":"text-typography-0 font-semibold overflow-hidden text-transform:uppercase web:cursor-default cursor-default text-xl"}
    at CssInterop.Avatar.FallbackText (http://192.168.68.50:8081/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:10654:45)