Wishlist Slots

Overview

Learn about the slots provided in the Wishlist drop-in component for customizing container appearance and behavior.

Version: 2.0.1

Tip

Extending drop-in components describes default properties available to all slots.

What are Slots?

Slots are customization points that allow you to replace or extend parts of a container’s UI. Each container can expose multiple slots for different sections of its interface.

Wishlist slots

The slots for the Wishlist container allow you to customize its appearance and behavior.

interface WishlistProps

slots?: {
image?: SlotProps<{
      defaultImageProps: ImageProps;
      item: Item;
    }>;
};

image slot

The image slot allows you to customize the image section of the Wishlist container.

 provider.render(Wishlist, {
  slots: {
    image: (ctx) => {
      // Your custom implementation
      const element = document.createElement('div');
      element.innerText = 'Custom image';
      ctx.appendChild(element);
    }
  }
});

---