Skip to main content

Hooks Overview

The package exports these public use* helpers:

Lifecycle & state

  • useProductConfigurator — configurator lifecycle and status
  • useMessages — validation and notification messages

Products

  • useProductOffer — a single product offer
  • useStoreProductOffers — all loaded product offers
  • useProductSelection — pick between selectable products
  • useAdjacentProducts — products connected to the current one

Layout

  • useLayoutEntity — a single layout entity (routed by type)
  • useStoreLayouts — all layout entities
  • useProductOfferLayout — the resolved layout tree for an offer

Attributes

  • useAttribute — a single attribute (routed by type)
  • useStoreAttributes — all attributes

Pricing & output

  • usePriceBreakdown — line-by-line price breakdown
  • useBomBreakdown — bill-of-materials breakdown
  • useVisualization2d — 2D product visualization
  • useMediaService — media library access
  • usePaletteService — color palette access
  • useDownloadDesign — render/download the current design
  • useRequestQuote — offer inquiry / quote forms

Initialization rule​

Every hook controller that extends HookController requires the configurator status to already be LOADED or READY. If not, the constructor throws:

throw new Error("Product configurator is not initialized.");

In practice:

  • Use useProductConfigurator(configurator) first.
  • Wait for READY.
  • Then create other controllers.

Controller style​

Most hooks return class instances, not reactive Vue refs. They follow a consistent pattern:

  • getters for current data
  • subscribe(...) methods for store updates
  • imperative methods for mutations
  • serialize() and parse() on stateful controllers where persistence matters

Dynamic hook routing​

Two hooks return different controller subclasses based on runtime type:

  • useAttribute(configurator, cid) picks a controller from the attribute rtti
  • useLayoutEntity(configurator, cid) picks a controller from the layout entity rtti

That is why the useAttribute section is split into a common controller page and individual pages for each concrete attribute-controller type.