📄️ ItemStock
Displays product stock status and availability as color-coded badges. Reads from a ProductInventory object and renders up to two inline badges: an availability indicator (available / not available) and a stock level indicator (in stock / low stock / out of stock) with the exact quantity.
📄️ ItemsOverview
A read-only cart items display component that renders each line item as a compact row with optional image, SKU, quantity, availability, and price. Supports normal products, cluster items with child variants, and bundle items with leader/non-leader breakdown.
📄️ PriceToggle
A lightweight UI toggle that lets users switch between displaying prices including VAT or excluding VAT. The component does not perform price calculations — it broadcasts the user's preference so other components can adjust which price they display.
📄️ ProductBulkPrices
Displays volume/tiered pricing for a product in a table format, showing quantity ranges alongside their corresponding unit prices.
📄️ ProductBundles
Displays product bundles (combo deals) for a given product. Each bundle shows its constituent items with images and prices, a total bundle price with discount badge, and an "Add to cart" button. After a successful add-to-cart, the component can show either an inline toast notification or a confirmation modal with "Continue shopping" and "Proceed to checkout" options.
📄️ ProductCard
A complete product card component that renders an image with optional badge overlays, product details (name, SKU, manufacturer, short description, price), a favourite toggle, and an embedded AddToCart control. Supports both grid and row layouts.
📄️ ProductDescription
Renders a product's HTML description with optional truncation and expand/collapse functionality. Resolves the correct localized description from the product's descriptions array and renders it as raw HTML using dangerouslySetInnerHTML.
📄️ ProductDownloads
Renders a list of downloadable documents associated with a product. Each item is displayed as a styled link that opens in a new tab with a native download prompt. When no documents are available, an empty-state message is shown instead.
📄️ ProductGallery
Image gallery for product detail pages with thumbnail navigation, hover zoom, and fullscreen lightbox.
📄️ ProductGrid
A self-contained product listing component that handles data fetching, pagination, sorting, filtering, and cart integration. It can operate in two modes: self-fetching (provide a graphqlClient and let it query the API internally) or controlled (pass pre-fetched products directly).
📄️ ProductInfo
Displays core product identification -- the product name and SKU. It can either render a pre-fetched Product object or fetch one internally via the Propeller SDK when given a productId and graphqlClient. The onProductLoaded callback lets sibling components (gallery, price, descriptions) hydrate from the same product data, making ProductInfo the ideal orchestrator for a product detail page.
📄️ ProductPrice
Displays a product's price with automatic VAT toggle support, secondary price line, cluster option price aggregation, and semi-closed portal mode for catalog-only storefronts.
📄️ ProductShortDescription
Renders a product's short description as HTML content, resolving the correct entry from the product's localized descriptions array.
📄️ ProductSlider
A horizontally scrollable product carousel with built-in data fetching, navigation arrows, and responsive breakpoints. Renders ProductCard and ClusterCard components with full add-to-cart, stock, and favorites support.
📄️ ProductSpecifications
Renders product attributes/specifications as a table or stacked list, with optional grouping by attribute group. The component can fetch attributes autonomously via the SDK or accept pre-fetched data.
📄️ ProductTabs
A tabbed content organizer for product detail pages. Combines four sub-components — Description, Specifications, Downloads, and Videos — into a unified interface with horizontal tabs on desktop and an accordion on mobile.
📄️ ProductVideos
Renders product videos as embedded players (YouTube, Vimeo) or native HTML5 `` elements. Automatically detects the video platform from the URI and converts it to an embeddable format. Resolves localized video URIs and titles based on the provided language code.