@fluentui/react-tags NPM | npm.io

9.3.20 • Published 7 months ago

Install

Weekly downloads

-

License

MIT

Repository

Last release

7 months ago

@fluentui/react-tags

React Tags components for Fluent UI React

Tag provides visual representation of an attribute, person or asset.
InteractionTag follows the same characteristics as Tag, but with the added functionality of having a primary interaction.
TagGroup is used to group multiple tags together.

Usage

To import Tag:

import { Tag, TagGroup, InteractionTag } from '@fluentui/react-components';

Examples

Tag

// basic
<Tag>Content</Tag>
// with icon
<Tag icon={<SVGIcon />}>Content</Tag>
// different appearance
<Tag appearance='outlined'>Content</Tag>
// with dismiss icon
<Tag dismissible>Content</Tag>
// different size
<Tag size="small">Content</Tag>

InteractionTag

// basic
<InteractionTag>
  <InteractionTagPrimary>Content</InteractionTagPrimary>
</InteractionTag>

// with icon
<InteractionTag>
  <InteractionTagPrimary icon={<SVGIcon />}>Content</InteractionTagPrimary>
</InteractionTag>

// different appearance
<InteractionTag appearance="outlined">
  <InteractionTagPrimary>Content</InteractionTagPrimary>
</InteractionTag>

// with secondary action
<InteractionTag>
  <InteractionTagPrimary hasSecondaryAction>Content</InteractionTagPrimary>
  <InteractionTagSecondary />
</InteractionTag>

// different size
<InteractionTag size="small">
  <InteractionTagPrimary>Content</InteractionTagPrimary>
</InteractionTag>

TagGroup

<TagGroup>
  <Tag>Tag 1</Tag>
  <Tag>Tag 2</Tag>
  <Tag>Tag 3</Tag>
</TagGroup>

@fluentui/keyboard-keys @fluentui/react-aria @fluentui/react-avatar @fluentui/react-icons @fluentui/react-jsx-runtime @fluentui/react-shared-contexts @fluentui/react-tabster @fluentui/react-theme @fluentui/react-utilities @griffel/react @swc/helpers

@everything-registry/sub-chunk-330 @fluentui/react-components @fluentui/react-tag-picker @fluentui/react-tag-picker-preview

0.0.0-nightly-20241101-0407.1

7 months ago

0.0.0-nightly-20241031-0408.1

7 months ago

0.0.0-nightly-20241030-0406.1

8 months ago

0.0.0-nightly-20241028-0410.1

8 months ago

0.0.0-nightly-20241029-0406.1

8 months ago

0.0.0-nightly-20241025-0408.1

8 months ago

0.0.0-nightly-20241023-0407.1

8 months ago

0.0.0-nightly-20241022-0408.1

8 months ago

0.0.0-nightly-20241017-0409.1

8 months ago

0.0.0-nightly-20241018-0406.1

8 months ago

8 months ago

0.0.0-nightly-20241015-1519.1

8 months ago

0.0.0-nightly-20241016-0407.1

8 months ago

0.0.0-nightly-20241015-0407.1

8 months ago

0.0.0-nightly-20241014-0408.1

8 months ago

0.0.0-nightly-20241011-0406.1

8 months ago

8 months ago

0.0.0-nightly-20241002-0405.1

8 months ago

0.0.0-nightly-20241003-0406.1

8 months ago

0.0.0-nightly-20241008-0405.1

8 months ago

0.0.0-nightly-20240926-0406.1

9 months ago

0.0.0-nightly-20240930-0408.1

9 months ago

0.0.0-nightly-20241007-0407.1

8 months ago

0.0.0-nightly-20241004-0410.1

8 months ago

0.0.0-nightly-20241010-0408.1

8 months ago

0.0.0-nightly-20241009-0406.1

8 months ago

0.0.0-nightly-20240927-0406.1

9 months ago

0.0.0-nightly-20241001-0407.1

8 months ago

0.0.0-nightly-20240925-0407.1

9 months ago

0.0.0-nightly-20240924-0407.1

9 months ago

9 months ago

0.0.0-nightly-20240916-0409.1

9 months ago

0.0.0-nightly-20240917-0407.1

9 months ago

0.0.0-nightly-20240919-0407.1

9 months ago

0.0.0-nightly-20240918-0406.1

9 months ago

0.0.0-nightly-20240920-0408.1

9 months ago

0.0.0-nightly-20240913-0407.1

9 months ago

0.0.0-nightly-20240912-0407.1

9 months ago

9 months ago

0.0.0-nightly-20240911-0407.1

9 months ago

0.0.0-nightly-20240910-0407.1

9 months ago

0.0.0-nightly-20240909-0407.1

9 months ago

0.0.0-nightly-20240906-0406.1

9 months ago

0.0.0-nightly-20240905-0407.1

9 months ago

0.0.0-nightly-20240904-0407.1

9 months ago

0.0.0-nightly-20240903-0407.1

9 months ago

0.0.0-nightly-20240902-0406.1

9 months ago

0.0.0-nightly-20240830-0406.1

10 months ago

0.0.0-nightly-20240829-0406.1

10 months ago

0.0.0-nightly-20240828-0407.1

10 months ago

0.0.0-nightly-20240827-0406.1

10 months ago

0.0.0-nightly-20240719-0407.1

11 months ago

0.0.0-nightly-20240531-0406.1

1 year ago

0.0.0-nightly-20240727-2000.1

11 months ago

0.0.0-nightly-20240528-0406.1

1 year ago

0.0.0-nightly-20240823-1802.1

10 months ago

0.0.0-nightly-20240722-0407.1

11 months ago

0.0.0-nightly-20240822-1237.1

10 months ago

0.0.0-nightly-20240711-0408.1

11 months ago

0.0.0-nightly-20240702-0406.1

12 months ago

10 months ago

11 months ago

11 months ago

11 months ago

0.0.0-nightly-20240607-1142.1

1 year ago

10 months ago

10 months ago

12 months ago

0.0.0-nightly-20240730-0407.1

11 months ago

0.0.0-nightly-20240820-2210.1

10 months ago

0.0.0-nightly-20240604-0406.1

1 year ago

0.0.0-nightly-20240823-0407.1

10 months ago

0.0.0-nightly-20240826-0407.1

10 months ago

0.0.0-nightly-20240724-0407.1

11 months ago

0.0.0-nightly-20240612-0406.1

1 year ago

0.0.0-nightly-20240522-0406.1

1 year ago

0.0.0-nightly-20240606-0405.1

1 year ago

0.0.0-nightly-20240819-2110.1

10 months ago

1 year ago

0.0.0-nightly-20240717-0406.1

11 months ago

12 months ago

1 year ago

0.0.0-nightly-20240725-0409.1

11 months ago

0.0.0-nightly-20240625-0406.1

12 months ago

0.0.0-nightly-20240621-0406.1

12 months ago

0.0.0-nightly-20240610-0407.1

1 year ago

0.0.0-nightly-20240627-0406.1

12 months ago

0.0.0-nightly-20240709-0406.1

11 months ago

0.0.0-nightly-20240726-0407.1

11 months ago

0.0.0-nightly-20240529-0405.1

1 year ago

0.0.0-nightly-20240704-0407.1

11 months ago

0.0.0-nightly-20240723-0406.1

11 months ago

0.0.0-nightly-20240819-2052.1

10 months ago

0.0.0-nightly-20240605-0405.1

1 year ago

0.0.0-nightly-20240717-1138.1

11 months ago

0.0.0-nightly-20240606-0726.1

1 year ago

0.0.0-nightly-20240816-2133.1

10 months ago

0.0.0-nightly-20240530-0408.1

1 year ago

0.0.0-nightly-20240524-0405.1

1 year ago

0.0.0-nightly-20240726-2023.1

11 months ago

0.0.0-nightly-20240611-0405.1

1 year ago

0.0.0-nightly-20240603-0406.1

1 year ago

0.0.0-nightly-20240822-0407.1

10 months ago

0.0.0-nightly-20240614-0405.1

12 months ago

0.0.0-nightly-20240718-0406.1

11 months ago

0.0.0-nightly-20240716-0408.1

11 months ago

0.0.0-nightly-20240523-0405.1

1 year ago

0.0.0-nightly-20240729-0406.1

11 months ago

0.0.0-nightly-20240527-0405.1

1 year ago

0.0.0-nightly-20240712-1436.1

11 months ago

0.0.0-nightly-20240703-0406.1

11 months ago

0.0.0-nightly-20240731-0407.1

11 months ago

0.0.0-nightly-20240610-0945.1

1 year ago

0.0.0-nightly-20240613-0406.1

12 months ago

0.0.0-nightly-20240620-0405.1

12 months ago

0.0.0-nightly-20240727-0949.1

11 months ago

0.0.0-nightly-20240607-0405.1

1 year ago

0.0.0-nightly-20240819-2137.1

10 months ago

0.0.0-nightly-20240618-0404.1

12 months ago

0.0.0-nightly-20240712-0407.1

11 months ago

0.0.0-nightly-20240701-0407.1

12 months ago

0.0.0-nightly-20240710-0407.1

11 months ago

0.0.0-nightly-20240628-0406.1

12 months ago

0.0.0-nightly-20240624-0406.1

12 months ago

0.0.0-nightly-20240617-0407.1

12 months ago

0.0.0-nightly-20240626-0406.1

12 months ago

0.0.0-nightly-20240619-0407.1

12 months ago

0.0.0-nightly-20240521-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240517-0405.1

1 year ago

0.0.0-nightly-20240520-0407.1

1 year ago

1 year ago

0.0.0-nightly-20240516-0406.1

1 year ago

0.0.0-nightly-20240515-0405.1

1 year ago

0.0.0-nightly-20240514-0405.1

1 year ago

0.0.0-nightly-20240513-0408.1

1 year ago

1 year ago

0.0.0-nightly-20240510-0407.1

1 year ago

0.0.0-nightly-20240509-0405.1

1 year ago

0.0.0-nightly-20240508-0405.1

1 year ago

0.0.0-nightly-20240506-0407.1

1 year ago

0.0.0-nightly-20240507-0407.1

1 year ago

1 year ago

1 year ago

0.0.0-nightly-20240503-0405.1

1 year ago

0.0.0-nightly-20240502-0405.1

1 year ago

0.0.0-nightly-20240501-0406.1

1 year ago

0.0.0-nightly-20240430-0406.1

1 year ago

0.0.0-nightly-20240429-0407.1

1 year ago

0.0.0-nightly-20240426-0405.1

1 year ago

0.0.0-nightly-20240425-0408.1

1 year ago

0.0.0-nightly-20240424-0405.1

1 year ago

0.0.0-nightly-20240423-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240422-0407.1

1 year ago

0.0.0-nightly-20240419-0408.1

1 year ago

0.0.0-nightly-20240418-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240417-0406.1

1 year ago

0.0.0-nightly-20240415-0407.1

1 year ago

0.0.0-nightly-20240411-0405.1

1 year ago

0.0.0-nightly-20240409-0405.1

1 year ago

0.0.0-nightly-20240408-0406.1

1 year ago

0.0.0-nightly-20240405-0409.1

1 year ago

0.0.0-nightly-20240404-0406.1

1 year ago

0.0.0-nightly-20240403-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240402-0405.1

1 year ago

0.0.0-nightly-20240401-0408.1

1 year ago

0.0.0-nightly-20240329-0405.1

1 year ago

0.0.0-nightly-20240328-0407.1

1 year ago

0.0.0-nightly-20240327-0404.1

1 year ago

0.0.0-nightly-20240326-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240325-0409.1

1 year ago

0.0.0-nightly-20240322-0406.1

1 year ago

0.0.0-nightly-20240321-0406.1

1 year ago

0.0.0-nightly-20240320-0406.1

1 year ago

0.0.0-nightly-20240319-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240318-0408.1

1 year ago

1 year ago

0.0.0-nightly-20240315-0408.1

1 year ago

0.0.0-nightly-20240314-0406.1

1 year ago

0.0.0-nightly-20240312-0405.1

1 year ago

0.0.0-nightly-20240313-0405.1

1 year ago

0.0.0-nightly-20240311-0406.1

1 year ago

0.0.0-nightly-20240308-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240307-0406.1

1 year ago

0.0.0-nightly-20240306-0405.1

1 year ago

0.0.0-nightly-20240305-1651.1

1 year ago

0.0.0-nightly-20240305-0405.1

1 year ago

0.0.0-nightly-20240304-0405.1

1 year ago

0.0.0-nightly-20240301-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240228-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240229-0406.1

1 year ago

0.0.0-nightly-20240226-0407.1

1 year ago

0.0.0-nightly-20240227-0405.1

1 year ago

0.0.0-nightly-20240222-0407.1

1 year ago

0.0.0-nightly-20240223-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240221-0405.1

1 year ago

0.0.0-nightly-20240220-0405.1

1 year ago

0.0.0-nightly-20240219-0407.1

1 year ago

0.0.0-nightly-20240216-0405.1

1 year ago

0.0.0-nightly-20240215-0406.1

1 year ago

0.0.0-nightly-20240214-0405.1

1 year ago

0.0.0-nightly-20240213-0403.1

1 year ago

0.0.0-nightly-20240212-0406.1

1 year ago

0.0.0-nightly-20240209-0405.1

1 year ago

0.0.0-nightly-20240208-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240207-0406.1

1 year ago

0.0.0-nightly-20240206-0405.1

1 year ago

0.0.0-nightly-20240205-0406.1

1 year ago

0.0.0-nightly-20240202-0405.1

1 year ago

0.0.0-nightly-20240201-0407.1

1 year ago

1 year ago

1 year ago

0.0.0-nightly-20240131-0406.1

1 year ago

0.0.0-nightly-20240129-0407.1

1 year ago

0.0.0-nightly-20240126-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240125-0407.1

1 year ago

0.0.0-nightly-20240124-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240123-0405.1

1 year ago

0.0.0-nightly-20240122-0406.1

1 year ago

0.0.0-nightly-20240119-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240118-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240117-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240115-0407.1

1 year ago

0.0.0-nightly-20240116-0406.1

1 year ago

0.0.0-nightly-20240111-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240112-0405.1

1 year ago

0.0.0-nightly-20240110-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240109-0405.1

1 year ago

1 year ago

0.0.0-nightly-20240108-0406.1

1 year ago

0.0.0-nightly-20240105-0405.1

1 year ago

0.0.0-nightly-20240104-0405.1

1 year ago

0.0.0-nightly-20240103-0406.1

1 year ago

1 year ago

0.0.0-nightly-20240101-0406.1

1 year ago

0.0.0-nightly-20231229-0405.1

1 year ago

0.0.0-nightly-20231228-0406.1

1 year ago

0.0.0-nightly-20231226-0405.1

1 year ago

0.0.0-nightly-20231227-0406.1

1 year ago

0.0.0-nightly-20231225-0406.1

1 year ago

0.0.0-nightly-20231222-0405.1

1 year ago

0.0.0-nightly-20231221-0406.1

1 year ago

0.0.0-nightly-20231220-0405.1

1 year ago

0.0.0-nightly-20231219-0407.1

1 year ago

1 year ago

1 year ago

0.0.0-nightly-20231218-0406.1

1 year ago

0.0.0-nightly-20231215-0405.1

1 year ago

1 year ago

0.0.0-nightly-20231214-0405.1

1 year ago

0.0.0-nightly-20231213-0405.1

1 year ago

0.0.0-nightly-20231211-0406.1

2 years ago

0.0.0-nightly-20231212-0405.1

2 years ago

0.0.0-nightly-20231208-0405.1

2 years ago

0.0.0-nightly-20231207-0407.1

2 years ago

0.0.0-nightly-20231206-0406.1

2 years ago

0.0.0-nightly-20231205-0406.1

2 years ago

0.0.0-nightly-20231204-0407.1

2 years ago

0.0.0-nightly-20231201-0406.1

2 years ago

2 years ago

0.0.0-nightly-20231130-0405.1

2 years ago

0.0.0-nightly-20231129-0405.1

2 years ago

0.0.0-nightly-20231127-0407.1

2 years ago

0.0.0-nightly-20231124-0406.1

2 years ago

0.0.0-nightly-20231123-0406.1

2 years ago

0.0.0-nightly-20231122-0406.1

2 years ago

0.0.0-nightly-20231121-0406.1

2 years ago

2 years ago

0.0.0-nightly-20231120-0407.1

2 years ago

0.0.0-nightly-20231117-0406.1

2 years ago

0.0.0-nightly-20231116-0411.1

2 years ago

0.0.0-nightly-20231115-0405.1

2 years ago

2 years ago

0.0.0-nightly-20231114-0405.1

2 years ago

0.0.0-nightly-20231113-0406.1

2 years ago

0.0.0-nightly-20231110-0405.1

2 years ago

2 years ago

0.0.0-nightly-20231109-0405.1

2 years ago

0.0.0-nightly-20231108-0405.1

2 years ago

0.0.0-nightly-20231107-0406.1

2 years ago

0.0.0-nightly-20231106-0406.1

2 years ago

0.0.0-nightly-20231103-0406.1

2 years ago

0.0.0-nightly-20231102-0406.1

2 years ago

0.0.0-nightly-20231101-1848.1

2 years ago

2 years ago

0.0.0-nightly-20231101-0406.1

2 years ago

0.0.0-nightly-20231031-0414.1

2 years ago

0.0.0-nightly-20231030-0406.1

2 years ago

2 years ago

0.0.0-nightly-20231028-2304.1

2 years ago

0.0.0-nightly-20231028-0053.1

2 years ago

0.0.0-nightly-20231027-0413.1

2 years ago

0.0.0-nightly-20231026-0414.1

2 years ago

0.0.0-nightly-20231025-0415.1

2 years ago

0.0.0-nightly-20231024-0413.1

2 years ago

2 years ago

0.0.0-nightly-20231023-0416.1

2 years ago

0.0.0-nightly-20231020-0415.1

2 years ago

0.0.0-nightly-20231019-0416.1

2 years ago

2 years ago

0.0.0-nightly-20231018-0416.1

2 years ago

0.0.0-nightly-20231017-0415.1

2 years ago

0.0.0-nightly-20231016-0417.1

2 years ago

0.0.0-nightly-20231013-0415.1

2 years ago

2 years ago

0.0.0-nightly-20231012-0415.1

2 years ago

2 years ago

0.0.0-nightly-20231011-0416.1

2 years ago

0.0.0-nightly-20231010-0415.1

2 years ago

2 years ago

0.0.0-nightly-20231009-0416.1

2 years ago

0.0.0-nightly-20231006-0415.1

2 years ago

2 years ago

0.0.0-nightly-20231005-0415.1

2 years ago

2 years ago

0.0.0-nightly-20231004-0414.1

2 years ago