# type-writer-xs

> angular type writer

Latest version **1.1.10** (published 2022-12-22) · ISC license · 0 weekly downloads

## Install

```sh
npm install type-writer-xs
pnpm add type-writer-xs
yarn add type-writer-xs
bun add type-writer-xs
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.10 |
| Published | 2022-12-22 |
| First published | 2022-07-19 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 11 |
| Unpacked size | 642.4 KB |
| Known vulnerabilities | 0 (+23 in 4 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | XeNDeR |
| Maintainers | xender |
| Keywords | type-writer, angular, typescript, ts, angilar type writer, angular-typewriter, typewriter effect, typewriter, angular-cli, Angular CLI, typing, animated, animated text, text effect, cursor, blinking, browser, component, latest, auto typing, simple typewriter, typewriter browser |

## Links

- npm: https://www.npmjs.com/package/type-writer-xs
- Repository: https://github.com/Xender007/angular-type-writer
- Homepage: https://github.com/Xender007/angular-type-writer.git#readme
- Issues: https://github.com/Xender007/angular-type-writer/issues
- npm.io page: https://npm.io/package/type-writer-xs

## Dependencies (11)

- [rxjs](https://npm.io/package/rxjs.md) ~7.5.0
- [tslib](https://npm.io/package/tslib.md) ^2.3.0
- [zone.js](https://npm.io/package/zone.js.md) ~0.11.4
- [@angular/core](https://npm.io/package/@angular/core.md) ^14.0.0
- [@angular/forms](https://npm.io/package/@angular/forms.md) ^14.0.0
- [@angular/common](https://npm.io/package/@angular/common.md) ^14.0.0
- [@angular/router](https://npm.io/package/@angular/router.md) ^14.0.0
- [@angular/compiler](https://npm.io/package/@angular/compiler.md) ^14.0.0
- [@angular/animations](https://npm.io/package/@angular/animations.md) ^14.0.0
- [@angular/platform-browser](https://npm.io/package/@angular/platform-browser.md) ^14.0.0
- [@angular/platform-browser-dynamic](https://npm.io/package/@angular/platform-browser-dynamic.md) ^14.0.0

## Alternatives

- [csv-to-markdown-table](https://npm.io/package/csv-to-markdown-table.md) — 47.0K weekly downloads
- [@sapphire/ratelimits](https://npm.io/package/@sapphire/ratelimits.md) — 4.4K weekly downloads
- [js-csvparser](https://npm.io/package/js-csvparser.md) — 2.0K weekly downloads
- [@adadapted/js-sdk](https://npm.io/package/@adadapted/js-sdk.md) — 251 weekly downloads
- [@grapecity/spread-sheets-sparklines](https://npm.io/package/@grapecity/spread-sheets-sparklines.md) — 103 weekly downloads

## Recent versions

- 1.1.10 (latest) — 2022-12-22
- 1.1.9 — 2022-12-22
- 1.1.8 — 2022-12-22
- 1.1.7 — 2022-12-22
- 1.1.5 — 2022-07-23
- 1.1.4 — 2022-07-23
- 1.1.3 — 2022-07-21
- 1.1.2 — 2022-07-21
- 1.1.1 — 2022-07-21
- 1.1.0 — 2022-07-21
- 1.0.5 — 2022-07-21
- 1.0.4 — 2022-07-21
- 1.0.3 — 2022-07-21
- 1.0.2 — 2022-07-21
- 1.0.1 — 2022-07-21
- … 16 more at https://npm.io/package/type-writer-xs/versions

## README

<p align="center">
<img src="https://img.shields.io/badge/language-typescript-green?style=round-square&logo=typescript" /> 
<img src="https://img.shields.io/badge/angular-v14.0.0-%2361DBFB?style=round-square&logo=angular" />
<a href="https://github.com/Xender007/angular-type-writer" target="_blank">
<img src="https://img.shields.io/badge/version-v1.1.10-green?style=flat-round&logo=github" />
</a>
<a href="https://www.npmjs.com/package/type-writer-xs" target="_blank">
<img src="https://img.shields.io/badge/package-npm-red?style=flat-square&logo=npm" />
</a>

<img src="https://raw.githubusercontent.com/Xender007/angular-type-writer/master/type-writer-main.gif" />
</p>
Angular Typewriter made with typescript language.

## Installation

```sh
npm i type-writer-xs
```

## Example usage

```tsx
import { TypeWriterXsComponent } from 'type-writer-xs';

@Component({
  selector: 'your-component',
  template: `
    <div class="whitespace"></div>
  `,
  styles: []
})

export default function InsideYourComponent() {

    //TypeWriterXsComponent -> (HTMLElement, loop = false (default), typeSpeed = 50 (default), DeleteSpeed = 50 (default))
    //Note All speeds in milliseconds.
    const writer = new TypeWriterXsComponent(document.querySelector(".whitespace") as HTMLDivElement ,true, 130, 150);

    writer.typeString('hello there').typeString(' its type writer ').typeString(' Made by XeNDeR ').pauseFor(2000).deleteUpto(12).typeString(' visit : www.ixender.com').deleteAll().typeString('Bye').deleteAll().start();
}
```

## Inside Details
<table>
<thead>
    <tr><td><b>Name</b></td><td><b>Type</b></td><td><b>Description</b></td><td><b>Required</b></td><td><b>Default</b></td></tr>
</thead>
<tbody>
    <tr><td>userInput</td><td>string</td><td>Text to display as string </td><td>true</td></tr>
    <tr><td>loop</td><td>boolean</td><td>Set to true if the typewriter should loop after finishing typing the string(s)</td><td>true</td><td>false</td></tr>
    <tr><td>typeSpeed</td><td>number</td><td>How long (in ms) does the the typewriter wait after typing one character</td><td>true</td><td>50ms</td></tr>
    <tr><td>deleteSpeed</td><td>number</td><td>How long (in ms) does the the typewriter wait after deleting one character</td><td>true</td><td>50ms</td></tr>
    <tr><td>typeString(userInput: string)</td><td>function()</td><td>It will start the typing animation</td><td></td><td></td></tr>
    <tr><td>pauseFor(duration: number)</td><td>function()</td><td>It will start pause the typing animation upto "duration"</td><td></td><td></td></tr>
    <tr><td>deleteUpto(chars : number)</td><td>function()</td><td>It will delete upto "chars" given by user.</td><td></td><td></td></tr>
    <tr><td>deleteAll()</td><td>function()</td><td>It will delete complete text.</td><td></td><td></td></tr>
</tbody>
</table>

---
_Source: https://npm.io/package/type-writer-xs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._