grommet/react-components

PublicApache 2.0
1 Likes

React components that focus on the essential experience (c) https://github.com/grommet/grommet

comp

A paragraph of text


1
Fail100.0.2

components

A text link


1
Fail100.0.2

A standard HTML5 article


1
Fail320.0.7

An HTML heading, one of h1, h2, h3, h4, h5, h6


1
Fail650.0.2

controls

A collapsible accordion component.


1
Fail100.0.6

A button


1
Fail130.0.3

Presents a list of choices responsively


1
Fail100.0.5

A responsive search control.


1
Fail100.0.5

A tabular view component


1
Fail100.0.3

An attention getter used to highlight an aspect of the interface that might not be apparent at first glance


1
Pass100.0.3

forms

A check box in a web form


1
Fail100.0.2

An input field for a date and/or time.


1
Fail100.0.7

A web form.


1
Fail100.0.3

A field in a web form.


1
Fail210.0.2

The form used to log in.


1
Fail100.0.10

A number input in a web form


1
Fail100.0.3

A text input in a web form


2
Pass100.0.3

A radio button in a web form


1
Fail100.0.2

An input field with a search control.


1
Fail100.0.4

An select-like field with optional search capability.


1
Fail100.0.7

A text input field with optional suggestions.


1
Fail100.0.3

icons

Grommet icon


1
Fail100.0.5

Pulse icon


1
Fail210.0.2

A social media share icon button.


1
Fail100.0.3

Spinning icon


1
Fail210.0.2

Blank SVG Icon.


1
Pass210.0.2

layout

General purpose flexible box layout


1
Pass100.0.3

Organize children into multiple components based on available width.


1
Fail100.0.3

A modal overlay


1
Fail210.0.3

A full height container with two children laid out horizontally


1
Fail100.0.3

listing

A list of items


1
Fail100.0.5

Table of items


1
Fail100.0.5

A table header that can be used as a sort control.


1
Fail100.0.4

A grid of items


1
Fail100.0.6

media

Image carousel.


1
Fail100.0.6

An Image


1
Fail100.0.3

Video built on the HTML5 video element


1
Fail100.0.8

structure

This is the primary Grommet container outer


1
Fail100.0.2

An annotated summary of something


1
Fail100.0.11

Put things at the bottom.


1
Fail210.0.3

Combines Title and Menu elements responsively


1
Fail320.0.3

A Hero image or video, overlaid with text.


1
Fail100.0.5

A box to display notification messages


1
Fail100.0.8

A standard HTML5 section


1
Fail610.0.3

A full height, fixed width container


1
Fail100.0.3

A terse notification that will only be displayed for a short period of time, overlaying whatever the user is currently doing.


1
Fail100.0.5

Value component, focusing on a single number.


1
Fail100.0.3

text

Headline text, usually used in marketing pages.


1
Fail210.0.2

A simple text label


1
Fail100.0.3

Render markdown content using Grommet components.


1
Fail210.0.7

A quote with a colored border


1
Fail100.0.4

A localized timestamp.


1
Fail100.0.2

Title component usually rendered inside a Header.


1
Fail210.0.3

utils

An animation wrapper to transition components in & out.


1
Fail100.0.3

Utility functions for announcing things in a page


1
Pass1640.0.2

Utility function for being notified when the window size crosses the threshold between mobile and desktop


1
Pass1360.0.2

Utility functions for performing REST calls


1
Pass100.0.2

visualization

The normalize util includes a normalize method in order to help


1
Fail100.0.5

Shows a graphic of relatively sized items


1
Fail100.0.3

A legend, typically associated with a data visualization such as Meter, Distribution, SunBurst, or WorldMap.


1
Fail100.0.4

Shows a graph of nodes and links between them.


1
Fail100.0.2

Shows a bar, arc, or circular meter graphic.


1
Fail320.0.3

A SunBurst visualization.


1
Fail100.0.3

Visualize structure and connectivity


1
Fail100.0.4

A world map of continents


1
Fail100.0.2