> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cevoid.com/llms.txt
> Use this file to discover all available pages before exploring further.

# widget.view

> Analytics SDK payload reference for the widget.view event.

Sent when a widget becomes visible to the shopper.

<Panel>
  <RequestExample>
    ```ts SDK input theme={"theme":{"light":"github-light","dark":"github-dark"}}
    trackEvent('widget.view', {
      widgetId: 'gallery-homepage',
      widgetType: 'gallery',
      marketId: 'market_se',
      postsLoadedCount: 12,
      fallbackPostsCount: 0,
      pagePositionX: 0,
      pagePositionY: 640
    })
    ```
  </RequestExample>

  <ResponseExample>
    ```json Browser event detail theme={"theme":{"light":"github-light","dark":"github-dark"}}
    {
      "widgetId": "gallery-homepage",
      "widgetType": "gallery",
      "marketId": "market_se",
      "postsLoadedCount": 12,
      "fallbackPostsCount": 0,
      "pagePositionX": 0,
      "pagePositionY": 640
    }
    ```
  </ResponseExample>
</Panel>

The browser event is emitted as `cevoid:widget.view`. The forwarded payload is available on `event.detail`.

## Payload fields

<ResponseField name="widgetId" type="string" required>
  Your Cevoid widget instance ID.
</ResponseField>

<ResponseField name="widgetType" type="'gallery' | 'card'" required>
  The rendered widget type.
</ResponseField>

<ResponseField name="marketId" type="string">
  Market identifier for localized storefronts.
</ResponseField>

<ResponseField name="postsLoadedCount" type="number">
  Number of posts loaded into the widget.
</ResponseField>

<ResponseField name="fallbackPostsCount" type="number">
  Number of fallback posts used.
</ResponseField>

<ResponseField name="pagePositionX" type="number">
  Horizontal page position.
</ResponseField>

<ResponseField name="pagePositionY" type="number">
  Vertical page position.
</ResponseField>

## Related

* [widget.load](./widget-load)
* [SDK API](../api)