LiveRegion

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();