Form Status
Installation
Run the following command
npx vibes@latest add form-statusUsage
import { FormStatus } from '@/vibes/soul/form/form-status';function Usage() { return ( <FormStatus>Login was successful</FormStatus> <FormStatus type="error">Could not login</FormStatus> );}API Reference
| Prop | Type | Default |
|---|---|---|
children* | ReactNode | |
className | string | |
type | 'error' | 'success' | 'success' |
colorScheme | 'light' | 'dark' | 'light' |
CSS Variables
This component supports various CSS variables for theming. Here's a comprehensive list.
:root { --form-status-light-background-error: var(--error-highlight); --form-status-light-text-error: var(--error-shadow); --form-status-light-background-success: var(--success-highlight); --form-status-light-text-success: var(--success-shadow); --form-status-dark-background-error: var(--error-highlight); --form-status-dark-text-error: var(--error-shadow); --form-status-dark-background-success: var(--success-highlight); --form-status-dark-text-success: var(--success-shadow);}