live-region

1.1.3 • Public • Published

LiveRegion

CircleCI

Creates a configurable offscreen live region.

Installation

$ npm install live-region --save

Usage

var liveRegion = new LiveRegion();
liveRegion.announce('Hello Fred');

This will create an offscreen live region:

<div role="log" aria-live="polite" aria-relevant="additions" aria-atomic="false"></div>

Browserify/Webpack/whatever bundler you use

var LiveRegion = require('live-region');
var liveRegion = new LiveRegion();

Configuration

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.
region.announce('Hello Fred', 5e3);

LiveRegion#destroy

removes the live region DOM node inserted on initialization

region.destroy();

Readme

Keywords

none

Package Sidebar

Install

npm i live-region

Weekly Downloads

4,373

Version

1.1.3

License

MIT

Unpacked Size

8 kB

Total Files

6

Last publish

Collaborators

  • schne324