@instructure/ui-list

---

category: packages

ui-list

   

Components for displaying vertical or horizontal lists.

Components

The ui-list package contains the following:

• InlineList
• List

Installation

npm install @instructure/ui-list

Usage

import React from 'react'
import { List } from '@instructure/ui-list'

const MyList = () => {
  return (
    <List>
      <List.Item>List Item One</List.Item>
      <List.Item>List Item Two</List.Item>
      <List.Item>List Item Three</List.Item>
    </List>
  )
}

import React from 'react'
import { InlineList } from '@instructure/ui-list'

const MyList = () => {
  return (
    <InlineList>
      <InlineList.Item>List Item One</InlineList.Item>
      <InlineList.Item>List Item Two</InlineList.Item>
      <InlineList.Item>List Item Three</InlineList.Item>
    </InlineList>
  )
}