# angular-simple-step-guide

> This is craeted by ng-packagr on Angular6.

Latest version **0.0.2** (published 2018-07-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install angular-simple-step-guide
pnpm add angular-simple-step-guide
yarn add angular-simple-step-guide
bun add angular-simple-step-guide
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2018-07-24 |
| First published | 2018-07-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 174.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | neko2me |
| Maintainers | neko2me |
| Keywords | angular, step guide, component |

## Links

- npm: https://www.npmjs.com/package/angular-simple-step-guide
- Repository: https://github.com/neko2me/simple-step-guide
- Homepage: https://github.com/neko2me/simple-step-guide#readme
- Issues: https://github.com/neko2me/simple-step-guide/issues
- npm.io page: https://npm.io/package/angular-simple-step-guide

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^1.9.0

## Alternatives

- [@progress/kendo-ooxml](https://npm.io/package/@progress/kendo-ooxml.md) — 152.1K weekly downloads
- [@progress/kendo-react-ripple](https://npm.io/package/@progress/kendo-react-ripple.md) — 8.0K weekly downloads
- [@progress/kendo-react-orgchart](https://npm.io/package/@progress/kendo-react-orgchart.md) — 4.3K weekly downloads
- [@praxisui/dynamic-fields](https://npm.io/package/@praxisui/dynamic-fields.md) — 2.4K weekly downloads
- [@progress/kendo-vue-listbox](https://npm.io/package/@progress/kendo-vue-listbox.md) — 932 weekly downloads

## Recent versions

- 0.0.2 (latest) — 2018-07-24
- 0.0.1 — 2018-07-24

## README

# Angular 2+ Simple Step Guide Component

This is craeted by ng-packagr on Angular6.

## Installation

```
npm install angular-simple-step-guide --save
```

## Usage

### In Module:

#### App Module

```typescript
import {SimpleStepGuideModule} from "angular-simple-step-guide";

@NgModule({
	imports: [SimpleStepGuideModule]
})
```

or

#### Shared Module

```typescript
import {SimpleStepGuideModule} from "angular-simple-step-guide";

@NgModule({
	imports: [SimpleStepGuideModule],
	exports: [SimpleStepGuideModule]

})
```

### In Component:

#### Template

```html
<simple-step-guide [guides]="guides" [options]="options"></simple-step-guide>
```

#### Component Class

```typescript
guides = [
  {id: "elementId", message: "text message."},
  ...
];
options = {
  ...
};
```

### "guides" Property values:

|||
-|-
|**id**|Target element id.|
|**message**|Display message.|

### "options" Property values:

|||
-|-
|**next**|"Next" button text.|
|**skip**|"Skip" button text.|
|**complete**|"Complete" button text.|
|**intercept**|Function is called before go to next step.|
|**color**|Base color. format is only "#xxxxxx".|

### Other Properties:

|||
-|-
|**completed**|Output bind, called on Completed.|


### Demo

```
npm run start
```

or

[demo on sandbox](https://codesandbox.io/s/mqy05z5qqx)

---
_Source: https://npm.io/package/angular-simple-step-guide · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._