2.5.2

Bolt Trigger

Trigger Component in Bolt

Published

History

View changes

Install

yarn add @bolt/components-trigger

Source code

View on Github

Dependencies

@bolt/core

Trigger is an unstyled component used to convey a call to action. Part of the Bolt “Components” CSS framework that powers the Bolt Design System.

npm install @bolt/components-trigger

Triggers add button or link behavior to any content without the default button or link styles.

  {% include "@bolt-components-trigger/trigger.twig" with {
  content: "This is a trigger"
} only %}

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-style attributes object with extra attributes to append to this component.	`object`	—	—
content	Main content of the trigger (Twig only).	`string` or `array` or `object`	—	—
url	Contains a URL that the link points to. This may also be passed as part of `attributes`.	`string`	—	—
target	Specifies where to display the linked URL. This may also be passed as part of `attributes`.	`string`	—	—
cursor	Type of cursor shown on hover.	`string`	`pointer`	`auto`, `pointer`, `zoom-in`, `zoom-out`
on_click	The name of a method on the `on_click_target`.	`string`	—	—
on_click_target	`className` (e.g. "js-click-me") used in `querySelector` to reference a web component on the page. `onClick`, the `on_click` method name will be called on this element.	`string`	—	—
display	Set the display property	`string`	`inline`	`inline` or `block`
no_outline	Turn off the default outline on focus	`boolean`	`false`	—