HiDeoo / intro.js-react

Intro.js react wrapper
MIT License
395 stars 58 forks source link

Title property is missing on Step type #89

Closed toman92 closed 1 year ago

toman92 commented 1 year ago

Describe the bug

When using intro.js-react in a TypeScript project, we are unable to set the title of the step as it is missing from the type definition.

To Reproduce

import { Step } from "intro.js-react";  
...  

// Create Steps array and attempt to set title property  
const steps: Step[] = [  
    { title: "Welcome", intro: "Welcome to our app, this tour will bring you through the important parts" }  
];  
// above shows shows error - Type '{ title: string; intro: string; }' is not assignable to type 'Step'.  
// Object literal may only specify known properties, and 'title' does not exist in type 'Step'. ts(2322)  

When checking the type definition for Step, we can see title isn't defined:

interface Step {  
    /**  
     * CSS selector or element to use for the step.  
     * /  
    element?: string | HTMLElement | Element;  
    /**  
     * The tooltip content.  
     */  
    intro: string | React.ReactNode;  
    /**  
     * Position of the tooltip.  
     */  
    position?: string;  
    /**  
     * CSS class of the tooltip.  
     */  
    tooltipClass?: string;  
    /**  
     * CSS class of the helperLayer.  
     */  
    highlightClass?: string;  
  }

Expected behavior

The title property should be in the Step type definition as it is available in intro.js as shown in the documentation

How often does this bug happen?

Every time

System Info

react 17.0.2 intro.js 6.0.0 intro.js-react 0.6.0

Additional Context

We can get around this by setting the data-title property on the element but this doesn't work if we want to introduce the whole page without attaching the tour to a specific element.

E.g. The first step when a new user logs in, we might want to welcome them and let them start the tour if they wish or exit at that point - without highlighting any specific element.

HiDeoo commented 1 year ago

This should be fixed by #90 when released.