salla-loyalty-points-banner

A short banner on a product page that tells the customer how many loyalty points they earn when they buy the product. It has no props: it reads the product id from the data-product-id attribute, or from the page.id store config value when the attribute is missing, and loads the points from the loyalty API. Nothing is rendered when there is no product id or the product earns no points.

Use itCopy Anchor Link

In HTML or JSX, use the tag <salla-loyalty-points-banner> with the Attribute names below. In React, the wrapper takes the Property names (camelCase).

import { SallaLoyaltyPointsBanner } from '@salla.sa/twilight-components-react/loyalty-points-banner';

ExampleCopy Anchor Link

import { SallaLoyaltyPointsBanner } from '@salla.sa/twilight-components-react/loyalty-points-banner';

export function Example() {
  return (
    <SallaLoyaltyPointsBanner dataProductId="123456" />
  );
}