JavaScript SDK

Install the Tablelist script once, mount widgets where you need them, and optionally run headless cart controls from your own UI.

1) Install the script

Add this script tag before your closing </body> tag.

<script src="https://buy.tablelist.com/widgets.umd.js"></script>

2) Mount a default embed

Use the SDK to mount any widget type inline or in a modal.

window.Tablelist.init({ siteOrigin: 'https://buy.tablelist.com' })
window.Tablelist.mount('#inventory-slot', {
  widget: 'inventory-list',
  venueId: 'your_venue_id',
  theme: 'theme-dark',
  checkoutMode: 'cart',
})

3) Headless cart pattern

Keep the cart button in your own UI and sync state from the SDK.

const unsubscribe = window.Tablelist.onCartStateChange((state) => {
  if (state.venueId !== 'your_venue_id') return
  document.querySelector('#cart-count').textContent = String(state.itemCount)
})

document.querySelector('#open-cart').addEventListener('click', () => {
  window.Tablelist.openCart({ venueId: 'your_venue_id' })
})

Widget catalog

Every supported widget uses the same canonical icon/image source as the widget builder.