QuantitySelector

The QuantitySelector component allows customers to select the quantity of a given product to purchase.

Import

import { QuantitySelector } from '@faststore/ui'

Usage

Props

quantity*string | number

Description

Sets the current value that should be displayed on the input at the center of the quantity selector.

leftButtonProps*Omit<Props, "aria-label">

Description

Object with properties that will be passed forward the inner IconButton atom at the left of the input.

inputProps*InputProps

Description

Object with properties that will be passed forward the inner Input atom between the two buttons.

rightButtonProps*Omit<Props, "aria-label">

Description

Object with properties that will be passed forward the inner IconButton atom at the right of the input.

testIdstring

Description

ID to find this component in testing tools (e.g.: cypress, testing library, and jest).

Default value

store-quantity-selector

Customization

data-store-quantity-selector

data-quantity-selector-input

data-quantity-selector-button='(left|right)