The problem

I needed merchant-designed popup layouts to render inside a Shopify storefront, even though the editor and its React components live in the app admin. The extension receives popup content as JSON, so the storefront had to turn an element tree into real DOM nodes without shipping the admin UI or showing a half-built popup.

Context

The theme app block creates empty overlay containers and loads a set of deferred assets. Popup data comes from a shop metafield, while separate UI modules handle full-page, lightbox, and floating-bar variants. A shared renderer is responsible for converting sections, containers, text, images, inputs, buttons, and forms into DOM elements. It also applies responsive styles and connects special buttons to popup behavior.

What I tried first 😞