# Standard Component API

All components share a standard API for attaching them to the DOM and interacting with them.

<div id="foo">
  Let's attach a hotspot to this div on page load.
</div>

import { Hotspot } from '@onboardist/ui';

document.addEventListener('DOMContentLoaded', () => {
  const h = new Hotspot({ attach: '#foo' });
});

# Options

# attach

• Type: string|Node
• Default: none

Either a DOM selector or a DOM node. If a selector is given and the element is not present, Onboardist will wait up to 2 seconds to appear in the DOM.

# backdrop

• Type: boolean
• Default: false

Put a backdrop over the screen beneath the component

# name

• Type: string
• Default: undefined

Name for the component instance. This can be used in tours to attach components to each other. If no name is given, a random string will be generated.