FormSubmit
FormSubmit
Section titled “FormSubmit”Form submit button component with theme-aware styling and proper form association
Uses CSS custom properties from @sparkle/theme for consistent theming across light/dark modes and follows the same patterns as the Button component.
Import
Section titled “Import”import { FormSubmit } from '@sparkle/ui'| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
size | "sm" | "md" | "lg" | undefined | “ | Size variant for the submit button | |
variant | "primary" | "secondary" | "outline" | undefined | “ | Visual variant for the submit button | |
disabled | boolean | undefined | “ | Whether the submit button is disabled | |
children | React.ReactNode | ✓ | “ | Submit button children content |
Theme Integration
Section titled “Theme Integration”This component uses CSS custom properties from @sparkle/theme for consistent styling across light and dark modes.
Design Tokens Used
Section titled “Design Tokens Used”--theme-*: Uses theme design tokens for consistent styling
You can customize the appearance by:
- Theme Variables: Modify theme tokens in your
@sparkle/themeconfiguration - CSS Classes: Apply custom CSS classes via the
classNameprop - CSS-in-JS: Use styled-components or emotion with the component
Accessibility
Section titled “Accessibility”This component follows accessibility best practices with proper ARIA attributes and keyboard support.
Related Components
Section titled “Related Components”- Form
- FormControl
- FormDescription
- FormField
- FormInput
- FormLabel
- FormMessage
- FormPassword
- FormSelect
- FormSelectItem
- FormTextarea