I’m looking to recreate this Checkout UI extension on Brick (https://getbrick.app)
I’ve gotten very close apart from one issue:
As you can see in my version, the popover appears above the trigger (the word “Modify”) obscuring the title of the product.
Claude Sonnet 4.5 (connected to the Shopify Dev MCP) tells me:
”The s-popover component’s positioning is entirely controlled by Shopify’s rendering system and doesn’t expose any properties to control placement (above/below the trigger).
The positioning is automatic and based on available viewport space - it will try to position itself where it fits best, which often means appearing above the trigger if there’s limited space below.”
Looking at the docs, it’s true that there doesn’t seem to be any property I can use to tell it to show above or below.
My issue with this is that if Shopify “will try to position itself where it fits best”, why is it not positioning it below?
I think objectively, it doesn’t make sense that it would sit above the “Modify” text.
And, I know it’s possible to get it to show underneath because I can see it on Brick’s checkout.
Please help me figure out how to fix this annoying bug!