StepOptionsButton

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:314

Properties

action?

optional action?: (this) => void

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:326

A function executed when the button is clicked on It is automatically bound to the tour the step is associated with, so things like this.next will work inside the action. You can use action to skip steps or navigate to specific steps, with something like:

action() {
  return this.show('some_step_name');
}

Parameters

this

Tour

Returns

void

---

attrs?

optional attrs?: Record<string, string | number | boolean>

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:352

Additional HTML attributes to apply to the button element.

This is useful for adding data attributes for testing or analytics, or other custom attributes that don’t have dedicated properties.

Note: These attributes are applied before Shepherd’s core attributes, so they cannot override critical properties like type, onclick, class, disabled, aria-label, or tabindex. Use the dedicated properties (classes, disabled, label, action) to control those.

Example

{
  text: 'Next',
  action: tour.next,
  attrs: {
    'data-test': 'next-button',
    'data-analytics-id': 'tour-next',
    'title': 'Proceed to the next step'
  }
}

---

classes?

optional classes?: string

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:357

Extra classes to apply to the <a>

---

disabled?

optional disabled?: boolean | (() => boolean)

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:363

Whether the button should be disabled When the value is true, or the function returns true the button will be disabled

---

label?

optional label?: StringOrStringFunction

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:368

The aria-label text of the button

---

secondary?

optional secondary?: boolean

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:373

A boolean, that when true, adds a shepherd-button-secondary class to the button.

---

text?

optional text?: StringOrStringFunction

Defined in: docs-src/node_modules/shepherd.js/src/step.ts:378

The HTML text of the button