List

A unified interface for creating lists.

<List>
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

<List>
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

Props

Prop name	Type	Default	Description
`className`	`string`	`null`	A custom className you would like to pass to the Component
`isNumbered`	`bool`	`false`	Whether or not this is a number list
`marker`	`string`	`null`	The style of list marker to be used. Any valid CSS listStyleType can be used, or a custom marker, if required
`padding`	`string`	`null`	The padding value to be applied to the List.
`children`	`union`	`Required`	The content of the List

Numbers

<List isNumbered marker="lower-alpha">
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

<List isNumbered marker="lower-alpha">
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

No Marker

<List marker="none">
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

<List marker="none">
  <ListItem>List item 1</ListItem>
  <ListItem>List item 2</ListItem>
  <ListItem>List item 3</ListItem>
  <ListItem>List item 4</ListItem>
</List>

ListItem

The fundamental buuilding block of a list is, of course, the ListItem. Accepting no props at this stage, this component is simply a wrapper.

<ListItem>Google</ListItem>
<ListItem>Facebook</ListItem>
<ListItem>Twitter</ListItem>

<ListItem>Google</ListItem>
<ListItem>Facebook</ListItem>
<ListItem>Twitter</ListItem>

Props

Prop name	Type	Default	Description
`className`	`string`	`null`	A custom className you would like to pass to the Component
`padding`	`string`	`null`
`children`	`union`	`Required`	The content of the ListItem