List

Berlitz List Component takes in an array of strings which is outputted as list items. This can be set as a unordered list (with a blue dot point on the left side), or an ordered list (that is numbered along the left side). This list has responsive settings allowing you to collapse to a single column layout on the choosen breakpoint as well as setting the number of columns.

Installation

yarn add @berlitz/List

Props

Argument	Type	Required	Default	Example
Data	array	true	-	['one', 'two', 'three', 'four']
IsOrdered	bool	false	false
cols	number	false	1
collapse	array	false	false	['xs', 'sm', 'md', 'lg', 'xl']

Usage

import React from 'react'
import List from '@berlitz/List'
const MyApp = () => (
  <>
    <h2>Unordered</h2>
    <List data={data} cols={2} collapse={['xs', 'sm', 'md']} />
    <h2>Ordered</h2>
    <List data={data} cols={2} collapse={['xs', 'sm', 'md']} ordered />
  </>
)

When to use this component

• Bullet Points
• Privacy Policy / TOS