About UI Kit 2
UI Kit 2 components
UI kit components
Product bridge APIs
Jira bridge APIs

This section describes a Forge preview feature. Preview features are deemed stable; however, they remain under active development and may be subject to shorter deprecation windows. Preview features are suitable for early adopters in production environments.

We release preview features so partners and developers can study, test, and integrate them prior to General Availability (GA). For more information, see Forge release phases: EAP, Preview, and GA.

Toggle

To add the Toggle component to your app:

1
2
import { Toggle } from "@forge/react";

Description

A toggle for viewing or switching between enabled or disabled states.

Props

NameTypeRequiredDescription
labelstringYesThe label text to display.
namestringYesThe key the input value is assigned to in the form object returned.
defaultCheckedbooleanWhether the toggle is initially checked. Defaults to false
onChange(value: boolean) => void | PromiseNoAn event handler that can be asynchronous. Allows you to read values from the component without having to submit as part of a Form.

Example

1
2
const App = () => {
  return (
    <Toggle
      label="Show section"
      name="isSectionVisible"
      onChange={(value) => console.log(value)}
    />
  );
};

Output

Example image of rendered toggle

Rate this page: