Getting Started

Installation

Add the following script tag once on any page where you want to use Unify Widgets:

<script type="module" src="https://assets.unify-retail.com/widget/latest/unify-widget.js"></script>

Your API key is available in the Unify Admin app. Each widget requires api-key as a mandatory attribute.

Available Widgets

Widget	Tag	Description
E-Reservation	`<unify-ereservation-widget>`	In-store reservation flow
Store Availability	`<unify-store-availability-widget>`	Search stores with real-time stock
Stock	`<unify-stock-widget>`	Display stock availability with add-to-cart
Order Details	`<unify-order-details-widget>`	Show order summary and tracking
Return	`<unify-return-widget>`	Multi-step return management
Payment	`<unify-payment-widget>`	Cash register / QR code payment
Event Tracker	`<unify-event-tracker-widget>`	Track customer interactions

Common Attributes

All widgets share the following attributes:

Attribute	Type	Required	Description
`api-key`	String	Yes	Your Unify API key
`demo`	Boolean	No	Enable demo mode — requests include `X-Demo-Mode: true`

Customization

All widgets expose CSS custom properties prefixed with --unify- for styling (colors, spacing, typography). Set them on the widget element or any ancestor:

unify-ereservation-widget {
  --unify-confirm-button-bg: #0066cc;
  --unify-dialog-bg: #ffffff;
}

Structural elements can also be targeted via ::part() — see each widget's documentation for available parts.