Usage
import { Status } from "chakra-ui-solid";<Status.Root>
<Status.Indicator />
</Status.Root>Examples
Label
Render the label within the Status.Root component.
Error
Info
Warning
Success
Sizes
Use the size prop to change the size of the status component.
In Review
Error
Approved
In Review
Error
Approved
In Review
Error
Approved
Props
| Prop | Default | Type |
|---|---|---|
size | 'md' | ConditionalValue<'sm' | 'md' | 'lg' | PresetVariant<'status', 'size'>>The label's type scale. The dot follows it rather than taking a size of its own — it is `0.64em`, so it scales with whatever the root's font size resolves to. |
Plus HTMLChakraProps<"div"> — the whole style-prop surface and the DOM attributes of the element it renders, several hundred names listed as their sources rather than expanded — and the three every component takes: as, render and unstyled.