Form Field

The FormField component allows the user to enter or edit information in text format. Additionally, it provides a label, and a conditional help text that can be used to provide additional context on a validation scenario.

import React from "react";
import { FormField } from "@nimbus-ds/patterns";
import { ExclamationCircleIcon } from "@nimbus-ds/icons";

const Example: React.FC = () => (
  <FormField.Input
    label="Label text"
    helpText="Help text"
    showHelpText={true}
    id="input-id"
    helpIcon={ExclamationCircleIcon}
    placeholder="Placeholder"
  />
);

export default Example;

Ver no Figma

Implementação

Instale o componente via terminal.

npm install @nimbus-ds/formfield

Props

Additional props are passed to the <FormField> element. See div docs for a list of props accepted by the <FormField> element.