A pack of extensions for grommet 2
created:4/30/2021
updated:4/30/2021
loc
99
comments
3%
passed
12
failed
12
coverage
75%

Tag

avatar of atanasster
grommet-controls
3.0.1

A tag control with a label and icon.

import { Tag } from 'grommet-controls';

Main

Tag
Name
Description
Default
Controls
ITagOwnProps(8 properties)
onChange

Function that will be called when the user clicks the icon on the tag, or presses the Space key

(event: MouseEvent<HTMLSpanElement, MouseEvent>) => void
-
disabled

Displays a disabled style for the tag

boolean
-
label

Label text to place next to the control

ReactNode
Text
reverse

Whether to show the label in front of the checkbox

boolean
-
icon

Icon element to place in the tag

ReactNode
-
focusable

Whether the tag is focusable

boolean
true
size

The font size of the label

string
-
truncate

Whether to truncate the label text

boolean
-
Attributes(1 properties)
HTMLAttributes(44 properties)
AriaAttributes(48 properties)
DOMAttributes(159 properties)
BoxProps(28 properties)
RefAttributes(1 properties)

Commits

Date
Author
Commit Message
8/31/2020

atanasster

avatar of atanasster
update stories titles and navigation
8/30/2020

atanasster

avatar of atanasster
update eslint and add component-controls
2/9/2020

atanasster

avatar of atanasster
formatting
12/7/2019

atanasster

avatar of atanasster
ts cleanup
10/24/2019

atanasster

avatar of atanasster
typescript fixes
8/27/2019

atanasster

avatar of atanasster
initial commit 2.x alpha
6 commits
package
imports
peer
grommet
^2.15.0
TextKeyboard
*
FormClose
*
react
^17.0.1
React
*
ThemeContext
*
file
imports
"./StyledTag"
StyledTagStyledIcon
"./TagProps"
ITagProps

Stories

A 11 Y Title

Icon

Disabled

Focusable

Background

Border

Round

On Click

On Change

Reverse

Size