1 min read


Last Updated - Platform 23.0 - SDK 18.0


The widget initialises itself with an empty CarouselWidgetState. Use setup(with content:) to populate the carousel.

Container Dependencies

Containers can be used to replace most feature dependencies with one line of code. It should be done in the AppModule on didAddToPlatform in an organised function such as setUpDependencies.

  1. Create a new file for your custom mapper in Sources/Foundation/Mappers.
  2. Subclass the PoqImageCarouselContentItemMapper.
struct CustomImageCarouselContentItem: Codable, Hashable {
class CustomImageCarouselContentItemMapper: PoqImageCarouselContentItemMapper {
override func map(bannerItem: PoqHomeBannerCarouselItem) -> ImageCarouselContentItem? {
var contentItem = super.map(bannerItem: bannerItem)
contentItem?.customData = bannerItem.customData?.decode(CustomImageCarouselContentItem.self)
return contentItem
  1. Inject your custom mapper.
// Inject the mapper in your AppModule.
Container.shared.mappers.imageCarouselContentItemMapper.replace { CustomImageCarouselContentItemMapper() }

Customise the ImageCarouselWidget via subclassing. Instead of a builder, the widget has overridable functions for creating its reducers and middleware.

  1. Create a new file for your widget in Sources/Foundation/Views.
  2. Subclass the ImageCarouselWidget and customise.
class CustomImageCarouselWidget: ImageCarouselWidget {
override func makeAnalyticsMiddleware() -> Middleware<ImageCarouselState>? {
Middleware { store, action in
defer { store.continue(action) }
switch action {
case CustomImageCarouselAction:
// Track your custom event.
super.makeAnalyticsMiddleware()?.execute(store: store, action: action)
  1. Inject your custom widget.
// Inject the widget in your AppModule.
Container.shared.views.imageCarouselWidget.replace { CustomImageCarouselWidget() }