Fusion UI

Overview

prefix and suffix of the Input add content at the start or end of the field via FormFieldPrefix and FormFieldSuffix, e.g. a unit, a currency or a button.

"use client";

import React from "react";
import {
  Button,
  FormFieldPrefix,
  FormFieldSuffix,
  IconAdd,
  IconDeleteBin5,
  Input,
} from "@brynlabs/fusion-ui";

export const InputPrefixSuffixExample = () => (
  <Input
    value={""}
    onChange={() => {}}
    prefix={
      <FormFieldPrefix>
        <Button size={"small"} primaryIcon={<IconAdd />}></Button>
      </FormFieldPrefix>
    }
    suffix={
      <FormFieldSuffix>
        <IconDeleteBin5 />
      </FormFieldSuffix>
    }></Input>
);

Prefix & Suffix

Overview