@logo-elements/tags-list

List of tags for inform user about what she/he selected

<logo-elements-tags-list 
        items="tagList"
        show-empty="false"
        empty-text="No Content"
        clear-all-text="Clear All"
        show-label="true"
        label-text="Filters"
>
</logo-elements-tags-list>

The items interface is

[
    {
        title: String,
        value: String,
        id: String,
    }
]

The sample data is:

const tagList = [
          {
            "title": "Test Item 1",
            "value": "Patates",
            "id": "4567"
          },
          {
            "title": "Test Item 2",
            "value": "Domates",
            "id": "1234"
          },
        ];

Events

• tagRemoved : Item id fired when single item is removed.
  Interface of the output:

{detail: {id: string}}

• tagsCleared : Fires when all tags are cleared from the list.
  Interface of the output:

{detail: {items: Array}}

Installation

Install the component:

npm i @logo-elements/tags-list -s

Once installed, import the component in your application:

import '@logo-elements/tags-list';

For more detailed information, please visit:

Logo Elements Documentation ↗