A combination of Select and two direction Buttons for use as a means of choosing how to sort something.

NOTE: This component comes from the grommet-addons repository. You will need to add a dependency to that repository in order to use it.


direction asc|desc
The active direction.
onChange function ({ value: , direction: }) {}
Function that will be called when the user makes a choice. It is passed an object describing the current option value and direction.
options [{label: , value: , direction: }, ...]
Array of possible options. When an option is chosen, the intial direction will be set as defined for that option.
value {string}
The active option value.


import Sort from 'grommet-addons/components/Sort';

<Sort options={[]}
  onChange={...} />