0.10.0 • Published 10 months ago

@igloo-ui/list v0.10.0

Weekly downloads
-
License
Apache-2.0
Repository
github
Last release
10 months ago

List

Lists render possible actions or selectable options for a given element. This component is usually placed under a kebab menu icon.

Installation

To install @igloo-ui/list in your project, you will need to run the following command using npm:

npm install @igloo-ui/list

If you prefer Yarn, use the following command instead:

yarn add @igloo-ui/list

Usage

Then to use the component in your code just import it!

import List from '@igloo-ui/list';

const optionList = [
  {
    type: 'list',
    label: 'Item 1',
    value: '1',
    description: 'just adding some description',
  },
  {
    type: 'list',
    label: 'Item 2 (disabled)',
    value: '2',
    disabled: true,
  },
  {
    type: 'list',
    label: 'Item 3 (focused)',
    value: '3',
    description: 'just adding some description',
  },
  {
    type: 'list',
    label: 'Item 4 (selected)',
    value: '4',
  },
  {
    type: 'list',
    label: 'Item 5',
    value: '5',
    color: '#74DCC9',
  },
];

const [selectedOption, setSeletedOption] = React.useState(optionList[3]);
const [focusedOption, setFocusedOption] = React.useState(optionList[2]);

function handleOptionSelect(option) {
  setSeletedOption(option);
}

function handleOptionFocus(option) {
  setFocusedOption(option);
}

<List
  options={optionList}
  onOptionChange={handleOptionSelect}
  onOptionFocus={handleOptionFocus}
  selectedOption={selectedOption}
  focusedOption={focusedOption}
/>;
0.10.0

10 months ago

0.9.1

10 months ago

0.9.0

11 months ago

0.8.1

11 months ago

0.8.0

1 year ago

0.8.2

11 months ago

0.7.4

1 year ago

0.7.3

1 year ago

0.7.2

1 year ago

0.7.1

1 year ago

0.7.0

1 year ago

0.6.7

1 year ago

0.6.6

1 year ago

0.6.3

1 year ago

0.6.5

1 year ago

0.6.4

1 year ago

0.6.2

1 year ago

0.6.1

1 year ago

0.6.0

1 year ago

0.5.5

1 year ago

0.5.4

2 years ago

0.5.3

2 years ago

0.5.2

2 years ago

0.5.0

2 years ago

0.4.1

2 years ago

0.4.3

2 years ago

0.5.1

2 years ago

0.4.2

2 years ago

0.4.0

2 years ago

0.3.0

2 years ago

0.2.1

2 years ago

0.3.1

2 years ago

0.1.2

2 years ago

0.2.0

2 years ago

0.1.1

2 years ago

0.1.2-0

2 years ago

0.1.3

2 years ago

0.1.0

2 years ago

0.0.0

2 years ago