Displays characters remaining from a given total. Used with form inputs. Adds classes when active/above/below/equal the total character allowance.
Tests [y] Accessibility tested [n]
Displays a Modal dialog using the HTML5 <dialog> element. Uses dialogPolyfill for backwards compatibility (full browser compatibility hasn't been tested).
Tests [y] Accessibility tested [n]
Used to toggle display of elements within a container.
Tests [y] Accessibility tested [n]
Removes a class from an element after a set duration. On the CMS it is used in conjuction CSS3 transitions CMS to fade out and hide status messages.
Tests [y] Accessibility tested [n]
Mirrors the entered value of an <input> into a target <input>. If the target <input> is updated, then the link between the two is broken and any further updates aren't copied into the target. This is used on the CMS to auto-populate the Meta title input when the user enters an Article title. The link breaking could be made an optional and controlled via the component's config.
Tests [y] Accessibility tested [n]
A dynamic tooltip component. Extends Collapsable. Used on CMS for inline menus/activity log popup. Options for horizontal/vertical alignment , top/right/bottom/left positioning and hide on blur.
Tests [y] Accessibility tested [n] - Has accessibility from Collapsable but needs further review.
Submits a form when a <select> box value is changed.
Tests [y] Accessibility tested [n] But shouldn't provide any accessibility concerns.
Changes the URL of the page based on which radio button is selected. In the CMS this is used in conjunction with the CSS toggle button component, but they can be used independently of one another.
Tests [n] Accessibility tested [n] - But shouldn't provide any accessibility concerns.
Displays a live word count. This is currently restricted to a contentEditable element but could be easily updated to work with form inputs.
Tests [y] Accessibility tested [n]
Used to filter events from eventsWithPromises.
Image previews for these components can be found within this repo.
Enhances two radio buttons to provide a toggle switch (similar to iOS toggles).
Accessibility tested [n] - Should work fine with screen readers as it uses standard radio buttons. Further testing is required to assess Dragon Naturally Speaking compatibility.
CSS companion to Dialog.js.
Provides a pseudo-table options grid.
Simple pagination component.
CSS companion to Popover.js.
