Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hakimio/ngx-ui-tour
✈️ UI tour for Angular apps
https://github.com/hakimio/ngx-ui-tour
angular angular-material angular-material-components ionic ionic-framework material-components ng-bootstrap ngx ngx-bootstrap onboarding onboarding-tour product-tour tour ui-tour
Last synced: 7 days ago
JSON representation
✈️ UI tour for Angular apps
- Host: GitHub
- URL: https://github.com/hakimio/ngx-ui-tour
- Owner: hakimio
- License: mit
- Created: 2021-03-31T09:54:53.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-09-16T11:17:34.000Z (3 months ago)
- Last Synced: 2024-11-29T14:13:10.084Z (14 days ago)
- Topics: angular, angular-material, angular-material-components, ionic, ionic-framework, material-components, ng-bootstrap, ngx, ngx-bootstrap, onboarding, onboarding-tour, product-tour, tour, ui-tour
- Language: TypeScript
- Homepage: https://hakimio.github.io/ngx-ui-tour
- Size: 22.3 MB
- Stars: 174
- Watchers: 3
- Forks: 28
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-angular - ngx-ui-tour - A UI tour library inspired by [angular-ui-tour](https://github.com/benmarch/angular-ui-tour). (Table of contents / Third Party Components)
- fucking-awesome-angular - ngx-ui-tour - A UI tour library inspired by <b><code> 163⭐</code></b> <b><code> 49🍴</code></b> [angular-ui-tour](https://github.com/benmarch/angular-ui-tour)). (Table of contents / Third Party Components)
README
> UI tour library for Angular
Angular Material, Ionic, Taiga UI, Ng Bootstrap and Ngx Bootstrap UIs are supported.
`ngx-ui-tour` is a fork of __Isaac Mann's__ `ngx-tour`. The project had to be forked since the original is no longer
maintained.
---
[](https://www.npmjs.com/package/ngx-ui-tour-core)
[](https://www.npmjs.com/package/ngx-ui-tour-core)
[](https://www.npmjs.com/package/ngx-ui-tour-core)
## Table of contents
- [Demo and documentation](#demo-and-documentation)
- [Compatibility](#compatibility)
- [Installation and Usage](#installation-and-usage)
- [FAQ](#faq)
- [TourService](#tourservice)
- [Step Configuration](#step-configuration)
- [Defaults](#defaults)
- [Hotkeys](#hotkeys)
- [Event Observables](#event-observables)
- [Custom template](#custom-template)
- [Styling Active Tour Anchor](#styling-active-tour-anchor)
- [Targeting Third Party Elements](#targeting-third-party-elements)
- [License](#license)
## Demo and documentation
Demo and documentation can be found at [hakimio.github.io/ngx-ui-tour](https://hakimio.github.io/ngx-ui-tour)
## Compatibility
### Material Design and Ngx Bootstrap tour UIs
| Angular | RxJS | ngx-ui-tour |
|---------|------|-------------|
| 18 | 7 | 13 |
| 17 | 7 | 12 |
| 16 | 7 | 11 |
| 15 | 7 | 10 |
| 14 | 6, 7 | 9 |
| 12-13 | 6, 7 | 8 |
| 9-12 | 6 | 7 |
### NG Bootstrap tour UI
| Angular | RxJS | ngx-ui-tour |
|---------|------|-------------|
| 18 | 7 | 15 |
| 17 | 7 | 14 |
| 16 | 7 | 13 |
| 15 | 7 | 12 |
| 14 | 6, 7 | 11 |
| 12-13 | 6, 7 | 10 |
| 9-12 | 6 | 9 |
### Ionic tour UI
| Angular | RxJS | Ionic | ngx-ui-tour |
|---------|------|-------|-------------|
| 18 | 7 | 8 | 5 |
| 18 | 7 | 7, 8 | 4 |
| 17 | 7 | 7, 8 | 3 |
| 16 | 7 | 6, 7 | 2 |
| 15 | 7 | 6, 7 | 1 |
### Taiga UI tour UI
| Angular | RxJS | Taiga UI | ngx-ui-tour |
|---------|------|----------|-------------|
| 18 | 7 | 3 | 7 |
| 17 | 7 | 3 | 6 |
| 16 | 7 | 3 | 5 |
| 15 | 7 | 3 | 4 |
| 14 | 6, 7 | 3 | 3 |
| 12-13 | 6, 7 | 2 | 2 |
| 9-12 | 6 | 2 | 1 |
## Installation and Usage
- [Material Design UI](https://hakimio.github.io/ngx-ui-tour/md-menu/Setup)
- [Ionic UI](https://hakimio.github.io/ngx-ui-tour/ion-popover/Setup)
- [NG Bootstrap UI](https://hakimio.github.io/ngx-ui-tour/ng-bootstrap/Setup)
- [Ngx Bootstrap UI](https://hakimio.github.io/ngx-ui-tour/ngx-bootstrap/Setup)
- [Taiga UI Dropdown UI](https://hakimio.github.io/ngx-ui-tour/tui-dropdown/Setup)
- [Taiga UI Hint UI](https://hakimio.github.io/ngx-ui-tour/tui-hint/Setup)
- [JavaScript Console UI](https://hakimio.github.io/ngx-ui-tour/console/Setup)
## FAQ
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/FAQ)
## Step Configuration
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/API#step-config)
## Defaults
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/Misc#defauls)
## TourService
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/API#tour-service)
## Event Observables
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/API#events)
## Hotkeys
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/Misc#hotkeys)
## Custom template
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/Misc#custom-template)
## Styling Active Tour Anchor
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/Misc#styling-active-anchor)
## Targeting third party elements
[Documentation page](https://hakimio.github.io/ngx-ui-tour/md-menu/Misc#targeting-third-party-elements)
## License
MIT