Label

A styled label component for displaying a label next to a form input. Other form inputs such as TextInput, Dropdown, Checkbox and Radio are already wrapped in a label component. Use this if you want to use the label for other purposes.

See all the examples and details in the Storybook.

Usage

import { Label } from "@samgl/graffiti-ui";

const MyLabel = () => {
  return (
    <Label>
      Username <input type="text" />
    </Label>
  );
};

Props

Prop	Type	Default	Optional	Description
$layout	string	column	❌	Should the label and input be above and below each other (column) or alongside each other (row)?
children	ReactNode		❌	The content of the Label.
className	string		✅	The class name of the component, generally used when extending the component with a styled component.