List

A unified interface for creating lists.

List item 1
List item 2
List item 3
List item 4

<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 item 1
List item 2
List item 3
List item 4

<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 item 1
List item 2
List item 3
List item 4

<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.

Google

Facebook

Twitter

<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