Bolt Design System

Twig Usage

{% include '@bolt-components-banner/banner.twig' with {
  content: 'This is a banner component.'
} only %}

Schema

Note: when assigning component props as HTML attributes on a web component, make sure to use kebab-case.

Prop Name	Description	Type	Default Value	Option(s)
attributes	A Drupal attributes object. Applies extra HTML attributes to banner.	`object`	—	—
content	The main banner content.	`any`	—	—
status	Sets the status that the banner is trying to convey.	`string`	`information`	`information`, `error`, `warning`, `success`
align	Sets the text alignment of the content.	`string`	`center`	`start`, `center`, `end`
dismiss	Accepts a button to be used for dismissal.	`any`	—	—

Install

npm install @bolt/components-banner

Dependencies

@bolt/core

Banner