# Product

### Settings

<table><thead><tr><th width="198.33333333333331">Setting</th><th width="150">Value</th><th>Description</th></tr></thead><tbody><tr><td>Container</td><td>true</td><td>Accepts nested children components.</td></tr><tr><td>Droppable</td><td>true</td><td>Added as a nested child component inside a container.</td></tr><tr><td>Editable</td><td>true</td><td>Can be edited</td></tr><tr><td>Interactive</td><td>false</td><td>Can receive events</td></tr></tbody></table>

### Properties

<table><thead><tr><th width="179.49923195084486">Property</th><th width="150">Type</th><th width="150">Default</th><th>Description</th></tr></thead><tbody><tr><td>Data</td><td>General</td><td></td><td>Product object</td></tr><tr><td>Variants</td><td>General</td><td></td><td>List of variants</td></tr></tbody></table>

### Actions

| Action               | Description                                                  |
| -------------------- | ------------------------------------------------------------ |
| addToCart            | Adds the product to the cart                                 |
| areSpecsVisible      | Checks if the features table should be displayed             |
| areVariantsVisible   | Checks if the product variants should be displayed           |
| canAddToCart         | Checks if the product can be added to the cart               |
| getCartCTA           | Returns the add-to-cart button title                         |
| getDescription       | Returns the product description                              |
| getId                | Returns the product Id                                       |
| getImage             | Returns the product image                                    |
| getPrice             | Returns the product price                                    |
| getSlot              | Returns the product slot title (if available)                |
| getSpecs             | Returns the product features table (if available)            |
| getTitle             | Returns the product title                                    |
| getVariantId         | Returns the current selected product variant Id              |
| getVariants          | Returns the products variants (if available)                 |
| getViewCTA           | Returns the view button title                                |
| isAddingToCart       | Checks if it is in a busy state adding to the cart           |
| isCartButtonVisible  | Checks if the product add-to-cart button should be displayed |
| isDescriptionVisible | Checks if the description should be displayed                |
| isPriceVisible       | Checks if the price should be displayed                      |
| isViewButtonVisible  | Checks if the product view button should be displayed        |
| setVariant(id)       | Select the variant Id                                        |
| view                 | Go to the product page                                       |

### Events

No events defined.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.pickzen.com/design-system/components/product.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.