Salla Offer Modal - Twilight Documentation

The <salla-offer-modal> web component shows a list of products with an offer given by the store admin. These offered products are related to a specific product. It consists of Button component to which Merchants can select offers related to product(s) they added to the cart, and that can be customized using the slots' parameters available.

note

Available API Endpoints for the Offer component is:

Product Offer Details

Example

Usage

HTML

SASS

Methods

The pre-defined methods allow for calling functions built by Salla to carry out certain actvities, such as show a specific product or offer.

Method	Description	Return Type
`open(product_id: number)`	Opens the available offers for a specific product	`Promise<any>`
`showOffer(offer: any)`	Shows offer details for a specific product	`Promise<void>`

Tip

To use a method, you can for instance open the component via the event:

Slots

Theslots makes it customizable to modify certain labels, such as header.

Slot	Description
`header`	The top of the popup, which has replaceable properties `{name}`, `{message}`.
`category`	Replaces Category badge, which has replaceable properties `{name}`, `{url}`.
`product`	Replaces product card, which has replaceable properties `{name}`, `{url}`, `{image}`, `{price}`.

Offer Modal

Example#

Usage#

Methods#

Slots#

Example

Usage

Methods

Slots