stepItem[]stepItem means how many highlight element in this step.
stepItem[].selectorstringany selector like #id, .class etc.
stepItem[].hintobjecthint is optional, you can only highlight elements without hint
stepItem[].hint?.textstringhint text
stepItem[].hint?.positionstringtophint text position
stepItem[].isPointerEventsDisabledbooleanfalsedisabled your highlight element's pointer-events
interface Props {  stepItem: {    selector: string    hint?: {      text: string      position?: 'top' | 'right' | 'bottom' | 'left'    }    isPointerEventsDisabled?: boolean  }[]}


For customize hint

Slots nameDescription
hint-${index}customize this step's hint, the index is stepItem's index
main-hintsometimes, we need multiple highlight elements, but only need one hint, we can use the main-hint slot to do this, but the main-hint slot is a very advance slot, you need detail some style.
Table of Contents