Analytics & Reports


The container for selecting the active collection.

Provided Aliases: $collections


  <gb-select options="{ $collections.collections }" on-select="{ $collections.onSelect }">
        <span>{ $option.label }</span>
        <gb-badge>{ $ }</gb-badge>

Example Implementation

Add this to your html.



Property Type Default Required
labels object {}

These are configurable via tags: read more under configuration.


Property Type Default Notes Description
collections { value: string, label: string, selected?: boolean, total?: number }[] [] An array of collection options. An array of collections options, where value is the collection’s value, label is the collection’s label, selected is optional and only set when true which indicates the collection is selected, total is optional and indicates the total number of products in that collection.
onSelect(index) function Sets the collection with the specified index to active. index: number index: number - index of the selected collection. Sends an action to request the selected collection.


Event Affected State Properties
'collection_updated' collections
'selected_collection_updated' collections

Child Components: Collections Option

The container for displaying a collection option.

  • This component does not have any properties.
  • This component does not have any properties in state.
  • This component does not listen for any events.


Add this to your html.