FormDescription
FormDescription
Section titled “FormDescription”Form description component with theme-aware styling for providing additional field context
Automatically connects to form controls via aria-describedby Uses CSS custom properties from @sparkle/theme for consistent theming.
Import
Section titled “Import”import { FormDescription } from '@sparkle/ui'| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
children | React.ReactNode | ✓ | “ | Description text content |
disabled | boolean | undefined | “ | Whether the description is for a disabled field |
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
- FormField
- FormInput
- FormLabel
- FormMessage
- FormPassword
- FormSelect
- FormSelectItem
- FormSubmit
- FormTextarea