usablica / intro.js

Lightweight, user-friendly onboarding tour library
http://introjs.com
Other
22.79k stars 2.59k forks source link

How to use intro.js with popover API? #2030

Open lgcavalheiro opened 9 months ago

lgcavalheiro commented 9 months ago

Description

I'd like to know if there is a way to have intro.js use popover api to have the steps/hints show up in the top layer

Expected Behavior

I would expect intro.js's steps to show on top of a dialog/modal that uses the popover API, instead of having the steps/hints show below the dialog.

Actual Behavior

Steps/hints show behind the dialog/modal, making them useless for walking a user through said modal/dialog.

Errors and Screenshots (optional)

Give us any additional information if you have.

Example (recommended)

I'm currently working on a intro.js POC for this project, here's the file in my branch so you guys can see how i have this setup: https://github.com/lgcavalheiro/HeroicGamesLauncher/blob/2050-introjs-onboarding-poc/src/frontend/components/HelpComponents/SideloadHelp/index.tsx

It is using the react wrapper instead of vanilla intro.js at the moment as i thought it could be successful with the wrapper, but no dice at the moment.

Environment (optional)

Package.json: https://github.com/lgcavalheiro/HeroicGamesLauncher/blob/2050-introjs-onboarding-poc/package.json Node version: v20.6.1 Yarn version: 1.22.19

stale[bot] commented 6 months ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.