As a DS designer and developer, I want to implement a message component in the system, because it is needed for the Query Builder hike in order to communicate the system status to users.

ACs

• The message component is implemented according to the Figma specs. They are defined using system tokens
• The message component-level tokens are created according to the naming convention used to style the component
• The message component is shown in Storybook according to the specification in the specs States

Typologies:

• Notice
• Error
• Warning
• Success

Notes:

• A Vue version of this component was already implemented during the Bridge hike. How much is that implementation reusable as a base for the system component?

Worth looking into, but it probably could take more time trying to adjust it (component-level tokens should still have to be created, etc.)

• We can only anticipate the use of the notice and error message typologies in the context of the Query builder. Whether we should still implement the other two typologies (Warning, Success)is up for discussion.

Initial response: Adding all typologies doesn't look like a lot of work. Tentatively, we could agree to create all the typologies.

• Is the message component using the box component?

Postponed decision: we could extract the box component later

Assets:

• Icon: check (Success message)

• Icon: info filled (Notice message)