A list of items with statuses.
statusList {
items {
item {
title = "Set up your card"
description = "Get set up in seconds with a digital card."
icon = Icon.Named("chip")
status = StatusListLayout.Status.DONE
}
item {
title = "Open an account"
description = "Open a balance in one of 50+ currencies"
icon = Icon.Named("globe")
}
}
}When to use
- When showing a list of actions for the user to take and their states.
When not to use
- When the items are all instructions, and do not have a 'state', for example password requirements, consider using an Instructions Layout instead.
| Property | Type | Required | Description |
|---|---|---|---|
analyticsId | String | No | An optional identifier to be used in analytics tracking. |
control | String | No | Specify a particular control to use to represent the layout. If the control is unknown, it will be ignored. |
items | Array<StatusListLayout.Item> | Yes | Array of items. |
margin | Size | No | The vertical margin to apply after this component. Defaults to md. |
| Array<String> | No | An optional list of identifiers used to configure renderers.
|
title | String | No | The user-facing title. |
type | String | Yes | It must be status-list. |
A single entry in a Status List Layout.
| Property | Type | Required | Description |
|---|---|---|---|
| String | No | An optional identifier to be used in analytics tracking.
|
| No | A titled call to action which can be performed by the user.
| |
description | String | No | A user-facing description. |
icon | Icon | Yes | An icon to represent the item. |
status | StatusListLayout.Status | No | The status of the item, if it has one. |
| String | No | An optional identifier to be used in custom renderers.
⚠️ Deprecated - Please use 'tags' instead |
| Array<String> | No | An optional list of identifiers used to configure renderers.
|
title | String | Yes | A user-facing title. |
Represents the state of an item in a Status List Layout.
| Value | Description |
|---|---|
done | The item is complete. |
not-done | The item has not been started or is waiting for input from the user. |
pending | The item is in progress and no input is needed from the user. |
The call to action configuration to be used by the Item.
| Property | Type | Required | Description |
|---|---|---|---|
accessibilityDescription | String | No | A description of the call to action to be used by screen readers. |
behavior | Behavior | Yes | The Behavior that should be performed when user interacts with call to action. |
| No | The semantics of the call-to-action button. Defaults to neutral.
| |
title | String | Yes | A user-facing title. |