• Getting Started
  • Components
  • Advanced

List Panel

Ready for production
Responsive
Check the source

Simple Use

Show Code
Edit on Stackblitz
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Multiple Use

Show Code
Edit on Stackblitz
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Disabled Use

Show Code
Edit on Stackblitz
disabled On Whole List
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
disabled On List Items
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Bordered

Show Code
Edit on Stackblitz
ListPanel Item has a bordered property for top border default is bordered for all List Panel Items
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Default Selected

Show Code
Edit on Stackblitz
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Custom Sizes

Show Code
Edit on Stackblitz
size="small"
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
size="medium" default
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

size="large"

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

size="40px"

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Custom List

Show Code
Edit on Stackblitz
  • Apple
  • Android
  • Amazon
  • Audible
  • Bitcoin

Theme Use

Show Code
Edit on Stackblitz
Primary theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Secondary theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Dark theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Light theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Info theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Warning theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Danger theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Success theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Mixed theme
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
  • Item 6
  • Item 7
  • Item 8
  • Item 9

Events Code

Show Code
Edit on Stackblitz
*Listpanel item can also be unseletable via prop isSelectable={false}
  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Quick LinksGithubTwitter