Submit Button
SubmitButton is a reusable button component for Shaddy Form that supports loading and disabled states.
SubmitButton is a reusable button component designed for use within a Shaddy Form. It accepts all generic button props, supports loading and disabled states, and allows for custom labels and icons. Use this button inside a Shaddy Form to submit form data.
Installation
pnpm dlx shadcn@latest add https://shaddy-docs.vercel.app/r/submit-button
Props
| Name | Type | Default | Description |
|---|---|---|---|
isLoading | boolean | false | Shows loading state and disables the button when true. |
disabled | boolean | false | Disables the button when true. |
label | string | "Save Changes" | The text displayed on the button. |
loadingLabel | string | "Saving..." | The text displayed when loading. |
icon | ReactNode | Icon to display before the label. | |
loadingIcon | ReactNode | Icon to display when loading. | |
className | string | Additional CSS classes for the button. | |
| ...Button props | All props from your Button component | Inherits all other props from your Button. |
Usage
import { ShaddyForm, TextField, SubmitButton } from "@/components";
function MyForm() {
return (
<ShaddyForm>
<div className="space-y-4">
<TextField
name="email"
label="Email"
required
placeholder="Enter your email"
/>
<SubmitButton
label="Submit"
loadingLabel="Submitting..."
isLoading={false}
/>
</div>
</ShaddyForm>
);
}