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

ChoiceList in a BlockStack renders an empty space below it in Safari #12503

Open
rclayton-shopify opened this issue Aug 2, 2024 · 0 comments
Labels
Bug Something is broken and not working as intended in the system. untriaged

Comments

@rclayton-shopify
Copy link

rclayton-shopify commented Aug 2, 2024

Summary

When viewing our form in Safari we noticed a large gap below a ChoiceList component. It seems to only happen when the ChoiceList is rendered as a direct child in a BlockStack. Also, once the component rerenders, the gap disappears.

ex: (this will have a gap below ChoiceList)

<BlockStack>
  <ChoiceList />
</BlockStack>

It does not matter where in the BlockStack it is rendered. But if the ChoiceList is is wrapped in another component, there is no gap.

ex: (this will have no gap)

<BlockStack>
  <div>
    <ChoiceList />
  </div>
</BlocKStack>

Expected behavior

No gap is displayed a ChoiceList

Actual behavior

02-02-q8irg-imtgc
Component in Admin

https://screenshot.click/02-33-qozmb-xunb1.mp4

Are you using React components?

Yes

Polaris version number

13.23.0

Browser

Safari

Device

Desktop

@rclayton-shopify rclayton-shopify added Bug Something is broken and not working as intended in the system. untriaged labels Aug 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Something is broken and not working as intended in the system. untriaged
Projects
None yet
Development

No branches or pull requests

1 participant