+++
# -----------------------------------------------------------------------
# Do not edit this file. It is automatically generated by API Documenter.
# -----------------------------------------------------------------------
title = "Forms"
keywords = ["grafana","documentation","sdk","@grafana/ui"]
type = "docs"
draft = true
+++
## Forms variable
### Forms variable
Signature
```typescript
Forms: {
RadioButtonGroup: typeof RadioButtonGroup;
Switch: import("react").ForwardRefExoticComponent & import("react").RefAttributes>;
getFormStyles: (theme: import("@grafana/data").GrafanaTheme, options: {
variant: import("./Button").ButtonVariant;
size: import("../Button/types").ButtonSize;
invalid: boolean;
}) => {
label: {
label: string;
description: string;
};
legend: {
legend: string;
};
fieldValidationMessage: {
fieldValidationMessage: string;
fieldValidationMessageIcon: string;
};
button: {
button: string;
buttonWithIcon: string;
iconButton: string;
iconWrap: string;
};
input: {
wrapper: string;
inputWrapper: string;
input: string;
inputDisabled: string;
addon: string;
prefix: string;
suffix: string;
loadingIndicator: string;
};
switch: {
switch: string;
};
checkbox: {
label: string;
description: string;
wrapper: string;
input: string;
checkmark: string;
};
};
Label: import("react").FC;
Input: import("react").ForwardRefExoticComponent & import("react").RefAttributes>;
Form: typeof Form;
Field: import("react").FC;
Button: import("react").ForwardRefExoticComponent<{
size?: "xs" | "sm" | "md" | "lg" | undefined;
variant?: "link" | "primary" | "secondary" | "destructive" | undefined;
icon?: string | undefined;
className?: string | undefined;
} & import("react").ButtonHTMLAttributes & import("react").RefAttributes>;
LinkButton: import("react").ForwardRefExoticComponent<{
size?: "xs" | "sm" | "md" | "lg" | undefined;
variant?: "link" | "primary" | "secondary" | "destructive" | undefined;
icon?: string | undefined;
className?: string | undefined;
} & import("react").AnchorHTMLAttributes & import("react").RefAttributes>;
Select: typeof Select;
ButtonSelect: typeof ButtonSelect;
InputControl: ({ name, rules, as: InnerComponent, onChange, onBlur, onChangeName, onBlurName, valueName, defaultValue, control, ...rest }: import("react-hook-form").ControllerProps) => JSX.Element;
AsyncSelect: typeof AsyncSelect;
TextArea: import("react").FC;
}
```
Import
```typescript
import { Forms } from '@grafana/ui';
```