The “Inline Onboarding” empty state introduces the user to a product feature they haven’t used yet and helps them get started. It’s displayed inside the content area on a page.
Anatomy
Anatomy summary lists and describes all the elements that exist within a component (including other components nested within).
- Image: Default image that appears when none is defined by the content creator.
- Heading: Default heading informs the user that no ‘ENTITIES’ are present.
- Description: Provides the user with encouragement to perform an action.
- Primary action (Optional): For example - Allows the user to add their first entity.
- Secondary action (Optional): For example - Certificates has a secondary View Archive button.
- Documentation link (Optional): Directs the user to the relevant Octo Docs.
Variants
Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.
| Property | Values | Default |
|---|---|---|
| ↳ showHideSecondary Boolean | true | false | true |
| ↳ showHideLink Boolean | true | false | true |
| hasActions Boolean | true | false | true |
| illustration InstanceSwap | ||
| ✏️ heading Text | string | You don’t have any _ENTITIES_ yet |
| ✏️ description Text | string | Start creating by clicking on ‘Add _ENTITY_`. |
Help and support