0.12.5 • Published 5 days ago
@igloo-ui/tag-picker v0.12.5
TagPicker
A multiselect of items displayed as tags.
Installation
To install @igloo-ui/tag-picker
in your project, you will need to run the following command using npm:
npm install @igloo-ui/tag-picker
If you prefer Yarn, use the following command instead:
yarn add @igloo-ui/tag-picker
Usage
Then to use the component in your code just import it!
import TagPicker from '@igloo-ui/tag-picker';
import { mockData } from './data';
const [selected, setSelected] = React.useState([]);
const [results, setResults] = React.useState([]);
const onInput = (value) => {
setResults(
mockData.filter(
(d) =>
d.text.toLowerCase().includes(value.toLowerCase()) &&
!selected.includes(d)
)
);
};
const select = (id) => {
const selectedItem = mockData.find((d) => d.id === id);
if (selectedItem) {
setSelected([...selected, selectedItem]);
} else {
setSelected([...selected]);
}
};
const remove = (id) => {
setSelected(selected.filter((s) => s.id !== id));
};
<TagPicker
{...args}
results={results}
selectedResults={selected}
onInput={onInput}
onSelection={select}
onTagRemove={remove}
noResultsText="No results"
placeholder="Enter Team or Bob"
/>;
0.12.5
5 days ago
0.12.4
13 days ago
0.12.3
20 days ago
0.12.2
1 month ago
0.12.1
1 month ago
0.12.0
2 months ago
0.11.0
3 months ago
0.10.0
3 months ago
0.9.0
3 months ago
0.9.1
3 months ago
0.8.1
4 months ago
0.8.0
4 months ago
0.6.7
4 months ago
0.7.0
4 months ago
0.6.6
4 months ago
0.6.5
5 months ago
0.6.4
5 months ago
0.6.3
5 months ago
0.6.2
5 months ago
0.5.0
9 months ago
0.4.1
10 months ago
0.3.2
10 months ago
0.4.0
10 months ago
0.3.1
11 months ago
0.6.1
6 months ago
0.6.0
8 months ago
0.3.3
10 months ago
0.3.0
11 months ago
0.2.1
11 months ago
0.2.0
12 months ago
0.1.2
1 year ago
0.1.1
1 year ago
0.1.4
1 year ago
0.1.3
1 year ago
0.1.0
1 year ago
0.0.0
1 year ago