Skip to content

Title property is missing on Step type #89

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
toman92 opened this issue Aug 24, 2022 · 1 comment
Closed

Title property is missing on Step type #89

toman92 opened this issue Aug 24, 2022 · 1 comment

Comments

@toman92
Copy link

toman92 commented Aug 24, 2022

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
Copy link
Owner

HiDeoo commented Sep 17, 2022

This should be fixed by #90 when released.

@HiDeoo HiDeoo closed this as completed Sep 17, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants