Overview

The Elite Bundle Builder SDK lets developers build fully custom storefront UIs for bundles, without being locked into the default templates.

When the SDK is enabled, the app exposes a global window.eliteBundle.sdk object on every bundle product page. It gives you live access to bundle data, cart state, and actions — so you can render your own product cards, step indicators, cart drawers, price calculators, or anything else, and hook our add-to-cart and checkout logic from it.

What you can build

• A completely custom BYOB (Build Your Own Bundle) UI with your own product cards, step tabs, and side cart
• A custom MOB (Multi-Option Bundle) picker with your own swatches, dropdowns, or variant selectors
• A headless bundle experience that fits your theme's design system without any Puck component overrides

How it works

The app injects window.eliteBundle on every bundle product page before your scripts run. It contains:

• app — shop-level globals: domain, money format, currency, access token, feature flags
• byob — raw BYOB bundle data from Liquid (template, config, product/variant IDs)
• mob — raw MOB bundle data from Liquid
• sdk.byob — live BYOB React state and actions, updated on every render
• sdk.mob — live MOB React state and actions, updated on every render

The default Puck-rendered UI still works normally. The SDK is additive — you can use parts of it (e.g. just addToCart) or replace the entire UI.

Prerequisites

• Elite Bundle Builder installed and set up on a Shopify store
• SDK access enabled in App → Settings → Developer SDK (requires a developer email)
• Basic JavaScript or TypeScript knowledge

Documentation

• Getting Started
• Global Object Reference
• BYOB SDK Reference
• MOB SDK Reference
• Events Reference
• Guide: Custom BYOB UI
• Guide: Custom MOB UI
• Guide: Using with React