hx components Callout - bradwoo8621/hx GitHub Wiki
Inline alert message with icon and text.
<HxCallout kind="info" message="Changes saved." />
<HxCallout kind="success" message="Operation completed." />
<HxCallout kind="warn" message="Subscription expires in 3 days." />
<HxCallout kind="error" message="Payment failed." />
<HxCallout kind="question" message="Proceed with deletion?" />
// Custom icon
<HxCallout kind={<CustomWarning />} message="Custom callout" />| Prop | Type | Default | Description |
|---|---|---|---|
kind |
HxCalloutKind | ReactNode |
— |
'info', 'success', 'question', 'warn', 'error', or custom icon element |
message |
ReactNode |
— | Message content |
kind |
Icon | Color |
|---|---|---|
'info' |
Info |
blue |
'success' |
Success |
green |
'question' |
Question |
neutral |
'warn' |
Exclamation |
yellow |
'error' |
Error |
red |
All standard <div> events forwarded. Callout is a display-only element — rarely needs event listeners in practice.