> For the complete documentation index, see [llms.txt](https://developer.unstack.com/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developer.unstack.com/docs/e-commerce/quantity-selector.md).

# Quantity Selector

Adds a quantity selector to a product:

```jsx
<QuantitySelector
  dataRef={content.productQuantitySelector}
  defaultType="secondary"
  defaultValue={1}
  minValue={1}
  maxValue={20}
/>
```

## Attributes

* **dataRef**: DataLocator - the data-element storing the Quantity Selector tag's configuration
* **defaultType**: string - The style of the buttons used with the control: either `"primary"` or `"secondary"` (Default: `"secondary"`)
* **defaultValue**: number - The default value for the Quantity Selector (Default: `1`)
* **minValue**: number - The minimum value of the Quantity Selector (Default: `1`)
* **maxValue**: number - The max value for the Quantity Selector (Default: `∞`)