UI outlets reference

Mount with api.ui.mount(name, callback). The callback receives an HTMLElement container and a read-only context. Return cleanup for owned DOM and listeners.

Global outlets

• page-header:actions
• modal-root

Brand-directory outlets

• brands:top
• brands:list:before
• brands:list:after
• brands:card:badges — context includes source: 'brands' and brand

Landing outlets

• landing:top
• landing:shop-actions:before
• landing:shop-actions:after
• landing:featured-brands:before
• landing:featured-brands:after
• landing:brand-card:badges
• landing:new-arrivals:before
• landing:new-arrivals:after
• landing:wheel-card:badges — context includes landing wheel
• landing:wheel-card:actions — context includes landing wheel
• landing:wheel-card:decorations — context includes landing wheel
• landing:bottom

Wheel result and detail outlets

• wheel-card:badges
• wheel-card:actions
• wheel-card:decorations
• wheel-detail:actions

Wheel-card contexts contain source, the post-filter wheel, and the normalized wheelCard being rendered. Sources are by-size, by-vehicle, and by-brand.

Wheel-detail context contains source, wheel, optional exact spec, optional assets, and optional vehicle. Sources identify the spec sheet, exact detail page, vehicle-aware detail, or visualizer modal.

Interaction rules

• Badge and decoration outlets are noninteractive.
• Action outlets should render semantic buttons or accessible links where valid.
• Decorations receive no pointer input and should keep overflow bounded.
• The app remounts repeated outlets when their context changes.
• Empty contributions should return without adding DOM.

Mount callback

type DomMountCallback<TContext> = (
  container: HTMLElement,
  context: Readonly<TContext>,
) => void | (() => void)

The returned function must remove plugin-owned listeners, observers, renderer instances, and DOM. The plugin system removes API-registered mounts and styles during unregistration.

Brand-card context

type BrandsCardOutletContext = Readonly<{
  source: 'brands'
  brand: PluginBrandRecord
}>

Wheel-card context

type WheelCardOutletContext = Readonly<{
  source: 'by-size' | 'by-vehicle' | 'by-brand'
  wheel: PluginWheelRecord
  wheelCard: PluginWheelCardRecord
}>

wheel is the post-filter catalog record. wheelCard contains normalized card display data, including available image, logo, size, summary, and exact-spec fields.

Landing wheel-card context

type LandingWheelCardOutletContext = Readonly<{
  source: 'landing'
  wheel: PluginWheelRecord
}>

Wheel-detail context

type WheelDetailOutletContext = Readonly<{
  source: 'wheel-spec-sheet' | 'wheel-detail' | 'wheel-by-vehicle' | 'visualizer'
  wheel: PluginWheelRecord
  spec: PluginWheelSpecRecord | null
  assets: Record<string, unknown> | null
  vehicle: PluginVehicleRecord | null
}>

spec is null on model-level surfaces. vehicle is present only when the current workflow has vehicle context.

Listed outlets without a specialized context receive a read-only public record that may be empty.