List

import List, { ListItem } from "@kiwicom/orbit-components/lib/List";
<List>
<ListItem>Hello world!</ListItem>
</List>

Props

NameTypeDefaultDescription
childrenReact.NodeThe content of the List, normally ListItem.
dataTeststringOptional prop for testing purposes.
idstringSet id for List
sizeenum"normal"The size of the List.
spaceAfterenumAdditional margin-bottom after component. See this docs
typeenum"primary"The color type of the List.

ListItem Props

NameTypeDefaultDescription
childrenReact.NodeThe content of the ListItem.
dataTeststringOptional prop for testing purposes.
iconReact.Node"CircleSmall"The displayed Icon or CarrierLogo component. See Functional specs
labelTranslationAdds a label to ListItem

enum

sizetype
"small""primary"
"normal""secondary"
"large"

Functional specs

  • You can color your icon if you pass some value into color or customColor prop of the Icon. Be aware of using other components, because they are not styled by default.