Trigger

An call to action with no styles.

Published Last updated: 4.0.0 Change log Github NPM
Twig Usage
  {% include "@bolt-components-trigger/trigger.twig" with {
  content: "This is a trigger"
} 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-style attributes object with extra attributes to append to this component.

object
content

Main content of the trigger (Twig only).

string , array , object
url

Optional. Contains a URL that the chip points to. When URL is present, tag changes to a, otherwise tag would be span.

string
target

A valid HTML target attribute to modify the behavior when clicking this element. Only valid when "url" is also present.

string _self
  • _blank, _self, _parent, _top, framename
type

Determines the button tag type for semantic buttons

string button
  • button, submit, reset
cursor

Type of cursor shown on hover.

string pointer
  • auto, pointer, zoom-in, zoom-out
on_click

When used with on_click_target, an event to fire on the targeted elements when this element is clicked. When used without on_click_target, arbitrary javascript to execute when this element is clicked.

string
on_click_target

Requires on_click. A CSS selector for elements that the on_click event will fire on when this element is clicked.

string
onClick
(deprecated)

Use on_click instead.

onClickTarget
(deprecated)

Use on_click_target instead.

display

Set the display property

string inline
  • inline or block
no_outline

Turn off the default outline on focus

boolean false
disabled

Make trigger unusable and un-clickable. Only applies to button.

boolean false
Install Install
  npm install @bolt/components-trigger
Dependencies @bolt/core-v3.x @bolt/lazy-queue