Displays a status indicator with an icon and label.
<Flag state="enabled" label="Active" />
label
string
state
loading
<Flag state="enabled" label="Enabled" />
<Flag state="error" label="Blocked" />
<Flag state="warning" label="Warning" />
The disabled state uses a circle-backslash icon and does not use a marker background.
disabled
<Flag state="disabled" label="Disabled" />
Use the loading prop to show a skeleton placeholder while loading data.
<Flag state="enabled" label="Loading integration" loading />
<Flex direction="column" gap="4" align="start"> <Flag state="enabled" label="Active" /> <Flag state="error" label="Blocked" /> <Flag state="warning" label="Warning" /> <Flag state="disabled" label="Disabled" /> </Flex>
4 variants found
"disabled" | "error" | "enabled" | "warning"
boolean
Used 23 times across 1 package
14 files
Show 4 more files