ember-highlight

Highlight a given term(s) inside the `{{highlight-terms}}` component block

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
ember-highlight
1051.2.85 years ago7 years agoMinified + gzip package size for ember-highlight in KB

Readme

ember-highlight
Highlight a given term(s) inside the {{highlight-terms}} component block.
!NPMnpm-badge-imgnpm-badge-link !Build Statustravis-badgetravis-badge-url !Ember Observer Scoreember-observer-badgeember-observer-url !Ember Versionember-version
See the demo.
Uses jquery-highlight internally.
```no-highlight ember install ember-highlight
## Usage

```hbs
<!-- list=['joh', 'fail'] -->
{{#highlight-terms 'hello' list 'other'}}
  Hello my name is Johnny.
{{/highlight-terms}}

Default term wrapper is span.highlight which is styled automatically by a single style, see vendor/simple.css. To override just add your own style to .highlight-terms .highlight.

Attributes

The positional params map to term. Each param can be an array of terms, which are automatically flattened.
  • caseSensitive - Defaults to false.
  • wordsOnly - Defaults to false.
  • term - String or Array of strings, or an Array of arrays of strings.

Testing

```no-highlight ember test --server
Visit `http://localhost:4200/ember-highlight/` to see the demo app.

### Building Demo (Github Pages)

Build by checking out the relevant branch, since the test dummy app
is actually the demo app.

Run the following command:

```no-highlight
ember github-pages:commit --message <message describing demo release>