@paprika/tag NPM

@paprika/tag

Description

Tag can be both static UI labels or removable components. Static Tag is mostly used to show an item’s status. A removable Tag should be used to add or group objects.

Installation

yarn add @paprika/tag

or with npm:

npm install @paprika/tag

Props

Tag

Prop	Type	required	default	Description
a11yText	string	false	null	used in aria-tag on the root element
avatar	node	false	null	Can pass a avatar to be displayed to the left of the tag content
children	node	true	-	Content to show in the central area of the tag
isDisabled	bool	false	false	Disables tag onClick and remove button functionality
onClick	func	false	null	Fires when clicking the root element. Should also pass value for a11yText when using this
onRemove	func	false	null	Pass a function to show a remove button
size	Tag.types.size.MEDIUM, Tag.types.size.LARGE	false	Tag.types.size.MEDIUM	Size of the tag(font size, min-height, padding, etc).
theme	Tag.types.theme.BLACK, Tag.types.theme.BLUE, Tag.types.theme.GREEN, Tag.types.theme.GREY, Tag.types.theme.LIGHT_BLUE, Tag.types.theme.LIGHT_ORANGE, Tag.types.theme.ORANGE, Tag.types.severityTheme.NO_RISK, Tag.types.severityTheme.LOW_RISK, Tag.types.severityTheme.MEDIUM_RISK, Tag.types.severityTheme.HIGH_RISK, Tag.types.severityTheme.ALERT	false	Tag.types.theme.GREY	Visual theme of the tag