Helper Text

The RhHelperText is a component that allows you to add helper text to form inputs, select menus, or other components. It is used to display additional information or instructions related to the input field, such as validation messages or tips on how to correctly fill out the form.

Usage

Once installed, you can import the RhHelperText component into your React application:

copy

import {RhHelperText} from "@rhythm-ui/react"

Helper Text Props

Name	Type	Description
error	boolean	Defines the color of the helper text (the same as with Input, Select, etc.)
className	string	String that defines the styles
children	any	Children component

Then, you can use the RhHelperText component in your JSX code:

Valid and InValid Text

The error prop determines whether the text is displayed as an error or not.

copy

<div className={"flex flex-col gap-4"}>
  <RhHelperText error={false}>This is HelperText Component</RhHelperText>
  <RhHelperText error={true}>This is HelperText Component</RhHelperText>
</div>