# ngx-text-highlighter

> Angular 5+ module for displaying editable textarea where you can highlight text selections and filter your previous selection based on highlighting color.

Latest version **0.0.4** (published 2018-11-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install ngx-text-highlighter
pnpm add ngx-text-highlighter
yarn add ngx-text-highlighter
bun add ngx-text-highlighter
```

## 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.4 |
| Published | 2018-11-03 |
| First published | 2018-11-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 360.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | mmounirf |
| Maintainers | mmounirf |
| Keywords | angular2, angular4, angular5, highlight, text, marker, bookmark, selection |

## Links

- npm: https://www.npmjs.com/package/ngx-text-highlighter
- Repository: https://github.com/mmounirf/ngx-text-highlighter
- Issues: https://github.com/mmounirf/ngx-text-highlighter/issues
- npm.io page: https://npm.io/package/ngx-text-highlighter

## Dependencies (1)

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

## Alternatives

- [@oh-my-pi/pi-natives](https://npm.io/package/@oh-my-pi/pi-natives.md) — 51.8K weekly downloads
- [@capgo/capacitor-light-sensor](https://npm.io/package/@capgo/capacitor-light-sensor.md) — 3.0K weekly downloads
- [@heyhuynhgiabuu/pi-diff](https://npm.io/package/@heyhuynhgiabuu/pi-diff.md) — 492 weekly downloads
- [@lotsa/verdant-lang-asm](https://npm.io/package/@lotsa/verdant-lang-asm.md) — 38 weekly downloads
- [new-era-syntax](https://npm.io/package/new-era-syntax.md) — 20 weekly downloads

## Recent versions

- 0.0.4 (latest) — 2018-11-03
- 0.0.3 — 2018-11-03
- 0.0.2 — 2018-11-03
- 0.0.1 — 2018-11-03

## README

[![npm version](https://badge.fury.io/js/ngx-text-highlighter.svg)](https://badge.fury.io/js/ngx-text-highlighter)
[![GitHub release](https://img.shields.io/github/release/mmounirf/ngx-text-highlighter.svg)](https://github.com/mmounirf/ngx-text-highlighter/releases)
[![Build Status](https://travis-ci.org/mmounirf/ngx-text-highlighter.svg?branch=master)](https://travis-ci.org/mmounirf/ngx-text-highlighter)
[![GitHub issues](https://img.shields.io/github/issues/mmounirf/ngx-text-highlighter.svg)](https://github.com/mmounirf/ngx-text-highlighter/issues)

## Text Highlighter

Angular 5+ module for displaying editable textarea where you can highlight text selections and filter your previous selection based on highlighting color. Check it out live demo and play around with the options [here](https://mmounirf.github.io/ngx-text-highlighter/)

### Table of Contents

* [Installation](#installation)
* [Usage](#usage)
* [Options](#options)
* [Example](#example)
* [Demo](https://mmounirf.github.io/ngx-text-highlighter/)

### Installation

```bash
npm install ngx-text-highlighter --save
```

### Usage

In your module add the following:
```
import { NgxTextHighlighterModule } from 'ngx-text-highlighter';

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

In your component add the following:
```
<th-container></th-container>
```

### Options

| Key | Description | Type | Default |
| ----- | ----- | ----- | ----- |
| ```[colors]``` | Set of marker colors | ```Array<string>``` | ```['#f44336', '#ffeb3b', '#4caf50']``` |
| ```[markerStyle]``` | Marker Style, changes marker appearance | ```string``` | ```'fixed'```

### Example

```html
<th-container [colors]="['#e22525', '#25b2e2', '#3ee225','#e225d']" [markerStyle]="'float'"></th-container>
```

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