Tabs component response to a breakpoint

[Jurgyte]

Summary

In AppBridge modal Tabs are rendered as they would be in a mobile with dropdown on the right. After any change in the screen or resize it falls back to normal view. It is happening in any size of the modal.

Initial screen:

It seems that it is rendered before the screen gets it's size and it is rendered as in a very small screen.

The initial conversation:
https://shopify.slack.com/archives/C4Y8N30KD/p1713874644325089?thread_ts=1712755920.322749&cid=C4Y8N30KD

Expected behavior

I think it should not jump and change looks. I found out, that if we render tabs after modal i loaded it shows tabs as expected, however this rendering logic feels like extra step which could be avoided.

Actual behavior

Wrap animated gifs/videos in a details tag:

Summary of your gif(s)

Steps to reproduce

1. Create an AppBridge modal.
2. Add Tabs component.

Are you using React components?

Yes

Polaris version number

12

Browser

Chrome

Device

Macbook