Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/schne324/live-region
https://github.com/schne324/live-region
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/schne324/live-region
- Owner: schne324
- License: mit
- Created: 2017-04-03T22:58:23.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-03-16T00:46:22.000Z (almost 7 years ago)
- Last Synced: 2024-11-10T18:46:45.246Z (about 2 months ago)
- Language: JavaScript
- Homepage: https://github.com/schne324/live-region#readme
- Size: 118 KB
- Stars: 12
- Watchers: 2
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# LiveRegion
[![CircleCI](https://circleci.com/gh/schne324/live-region.svg?style=svg)](https://circleci.com/gh/schne324/live-region)
Creates a configurable offscreen live region.
## Installation
```bash
$ npm install live-region --save
```## Usage
```js
var liveRegion = new LiveRegion();
liveRegion.announce('Hello Fred');
```This will create an offscreen live region:
```html
```### Browserify/Webpack/whatever bundler you use
```js
var LiveRegion = require('live-region');
var liveRegion = new LiveRegion();
```## Configuration
```js
var assertive = new LiveRegion({
ariaLive: 'assertive',
role: 'log',
ariaRelevant: 'all',
ariaAtomic: 'true'
});
```### Options
- `ariaLive` (_String_): `"polite"` or `"assertive"` - the desired value of the `aria-live` attribute. Defaults to `"polite"`.
- `role` (_String_): `"status"`, `"alert"`, or `"log"` - the desired value of the `role` attribute. Defaults to `"log"`.
- `ariaRelevant` (_String_): `"additions"`, `"removals"`, `"text"`, `"all"`, or `"additions text"` - the desired value of the `aria-relevant` attribute. Defaults to `"additions"`.
- `ariaAtomic` (_String_): `"true"` or `"false"` - the desired value of the `aria-atomic` attribute. Defaults to `"false"`.## Methods
### `LiveRegion#announce`
- *@param* `message` (_String_): the message to be announced
- *@param* `expire` (_Number_): the number of ms to wait before cleaning up the inserted message. This prevents the region from getting full of useless nodes. Defaults to `7000`. *NOTE*: to prevent the announcements from expiring, set to `false`.```js
region.announce('Hello Fred', 5e3);
```### `LiveRegion#destroy`
removes the live region DOM node inserted on initialization
```js
region.destroy();
```