@instructure/ui-a11y-utils 8.33.2-snapshot-0 → 8.33.2

package/lib/KeyboardFocusRegion.js

@@ -1,36 +1,22 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.KeyboardFocusRegion = void 0;
-
 var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
-
 var _findTabbable = require("@instructure/ui-dom-utils/lib/findTabbable.js");
-
 var _findFocusable = require("@instructure/ui-dom-utils/lib/findFocusable.js");
-
 var _ownerWindow = require("@instructure/ui-dom-utils/lib/ownerWindow.js");
-
 var _getActiveElement = require("@instructure/ui-dom-utils/lib/getActiveElement.js");
-
 var _addEventListener = require("@instructure/ui-dom-utils/lib/addEventListener.js");
-
 var _ownerDocument = require("@instructure/ui-dom-utils/lib/ownerDocument.js");
-
 var _containsActiveElement = require("@instructure/ui-dom-utils/lib/containsActiveElement.js");
-
 var _requestAnimationFrame = require("@instructure/ui-dom-utils/lib/requestAnimationFrame.js");
-
 var _console = require("@instructure/console");
-
 var _keycode = _interopRequireDefault(require("keycode"));
-
 var _scopeTab = require("./scopeTab");
-
 /*
  * The MIT License (MIT)
  *
@@ -54,6 +40,7 @@ var _scopeTab = require("./scopeTab");
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 class KeyboardFocusRegion {
   constructor(element, options) {
     this._options = void 0;
@@ -64,141 +51,110 @@ class KeyboardFocusRegion {
     this._active = false;
     this._wasDocumentClick = void 0;
     this._contextElement = void 0;
-
     this.handleKeyDown = event => {
       if (event.keyCode === _keycode.default.codes.tab) {
         (0, _scopeTab.scopeTab)(this._contextElement, event);
       }
     };
-
     this.handleClick = () => {
       this._wasDocumentClick = true;
     };
-
     this.handleWindowBlur = () => {
       if (this._wasDocumentClick) {
         this._wasDocumentClick = false;
         return;
       }
-
       this._needToFocus = true;
     };
-
     this.handleFocus = () => {
       if (this._needToFocus) {
         this._needToFocus = false;
-
         if (!this._contextElement) {
           return;
-        } // need to see how jQuery shims document.on('focusin') so we don't need the
+        }
+        // need to see how jQuery shims document.on('focusin') so we don't need the
         // setTimeout, firefox doesn't support focusin, if it did, we could focus
         // the element outside of a setTimeout. Side-effect of this implementation
         // is that the document.body gets focus, and then we focus our element right
         // after, seems fine.
-
-
         this._raf.push((0, _requestAnimationFrame.requestAnimationFrame)(() => {
           if ((0, _containsActiveElement.containsActiveElement)(this._contextElement)) {
             return;
           }
-
           this.focusDefaultElement();
         }));
       }
     };
-
     this.handleFirstTabbableKeyDown = event => {
       if (event.keyCode === _keycode.default.codes.tab && event.shiftKey) {
         var _this$_options$onBlur, _this$_options;
-
         (_this$_options$onBlur = (_this$_options = this._options).onBlur) === null || _this$_options$onBlur === void 0 ? void 0 : _this$_options$onBlur.call(_this$_options, event);
       }
     };
-
     this.handleLastTabbableKeyDown = event => {
       if (event.keyCode === _keycode.default.codes.tab && !event.shiftKey) {
         var _this$_options$onBlur2, _this$_options2;
-
         (_this$_options$onBlur2 = (_this$_options2 = this._options).onBlur) === null || _this$_options$onBlur2 === void 0 ? void 0 : _this$_options$onBlur2.call(_this$_options2, event);
       }
     };
-
     this._contextElement = (0, _findDOMNode.findDOMNode)(element);
     this._options = options || {
       shouldContainFocus: true,
       shouldReturnFocus: true,
       defaultFocusElement: null
     };
-
     if (this._options.shouldReturnFocus) {
       this._focusLaterElement = (0, _getActiveElement.getActiveElement)(this.doc);
     }
   }
-
   get focused() {
     return (0, _containsActiveElement.containsActiveElement)(this._contextElement);
   }
-
   get shouldContainFocus() {
     const shouldContainFocus = this._options.shouldContainFocus;
     return shouldContainFocus === true || Array.isArray(shouldContainFocus) && shouldContainFocus.includes('keyboard');
   }
-
   get focusable() {
     return (0, _findFocusable.findFocusable)(this._contextElement, () => true, true) || [];
   }
-
   get tabbable() {
     return (0, _findTabbable.findTabbable)(this._contextElement) || [];
   }
-
   get firstTabbable() {
     return this.tabbable[0];
   }
-
   get lastTabbable() {
     return this.tabbable.pop();
   }
-
   get firstFocusable() {
     return this.focusable[0];
   }
-
   get lastFocusable() {
     return this.focusable.pop();
   }
-
   get doc() {
     return (0, _ownerDocument.ownerDocument)(this._contextElement);
   }
-
   get win() {
     return (0, _ownerWindow.ownerWindow)(this._contextElement);
   }
-
   get defaultFocusElement() {
     const defaultFocusElement = this._options.defaultFocusElement;
     const element = (0, _findDOMNode.findDOMNode)(typeof defaultFocusElement === 'function' ? defaultFocusElement() : defaultFocusElement);
-
     if (element && this._contextElement && this._contextElement.contains(element)) {
       return element;
     }
-
     if (this.firstTabbable) {
       return this.firstTabbable;
     }
-
     if (this._contextElement && this.focusable.includes(this._contextElement)) {
       return this._contextElement;
     }
-
     return null;
   }
-
   updateElement(element) {
     this._contextElement = (0, _findDOMNode.findDOMNode)(element);
   }
-
   focusDefaultElement() {
     if (this.defaultFocusElement) {
       ;
@@ -214,22 +170,18 @@ class KeyboardFocusRegion {
       }
     }
   }
-
   focus() {
     if (this.focused) {
       return;
     }
-
     this._raf.push((0, _requestAnimationFrame.requestAnimationFrame)(() => {
       this.focusDefaultElement();
     }));
   }
-
   blur() {
     if (this._options.shouldReturnFocus && this._focusLaterElement) {
       try {
         ;
-
         this._focusLaterElement.focus();
       } catch (e) {
         (0, _console.logError)(false, `
@@ -237,53 +189,39 @@ class KeyboardFocusRegion {
           but it is not in the DOM anymore: ${e}
           `);
       }
-
       this._focusLaterElement = null;
     }
   }
-
   activate() {
     const defaultFocusElement = this.defaultFocusElement,
-          shouldContainFocus = this.shouldContainFocus;
-
+      shouldContainFocus = this.shouldContainFocus;
     if (!this._active) {
       if (defaultFocusElement || shouldContainFocus) {
         if (shouldContainFocus) {
           this._listeners.push((0, _addEventListener.addEventListener)(this.doc, 'keydown', this.handleKeyDown));
         } else {
           this._listeners.push((0, _addEventListener.addEventListener)(this.firstTabbable || defaultFocusElement, 'keydown', this.handleFirstTabbableKeyDown));
-
           this._listeners.push((0, _addEventListener.addEventListener)(this.lastTabbable || defaultFocusElement, 'keydown', this.handleLastTabbableKeyDown));
         }
-
         this._listeners.push((0, _addEventListener.addEventListener)(this.doc, 'click', this.handleClick, true));
-
         this._listeners.push((0, _addEventListener.addEventListener)(this.win, 'blur', this.handleWindowBlur, false));
-
         this._listeners.push((0, _addEventListener.addEventListener)(this.doc, 'focus', this.handleFocus, true));
-
         this._active = true;
       }
     }
   }
-
   deactivate() {
     if (this._active) {
       this._listeners.forEach(listener => {
         listener.remove();
       });
-
       this._listeners = [];
-
       this._raf.forEach(request => request.cancel());
-
       this._raf = [];
       this._active = false;
     }
   }
-
 }
-
 exports.KeyboardFocusRegion = KeyboardFocusRegion;
 var _default = KeyboardFocusRegion;
 exports.default = _default;

package/lib/ScreenReaderFocusRegion.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ScreenReaderFocusRegion = void 0;
-
 var _console = require("@instructure/console");
-
 /*
  * The MIT License (MIT)
  *
@@ -30,6 +28,7 @@ var _console = require("@instructure/console");
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 class ScreenReaderFocusRegion {
   constructor(element) {
     let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {
@@ -43,7 +42,6 @@ class ScreenReaderFocusRegion {
     this._options = void 0;
     this._observer = null;
     this._attributes = [];
-
     this.handleDOMMutation = records => {
       records.forEach(record => {
         const addedNodes = Array.from(record.addedNodes);
@@ -55,7 +53,6 @@ class ScreenReaderFocusRegion {
           if (removedNode.tagName.toLowerCase() !== 'iframe') {
             this.restoreNode(removedNode);
           }
-
           const iframeBodies = this.parseIframeBodies(removedNode);
           iframeBodies.forEach(iframeBody => {
             this.restoreNode(iframeBody);
@@ -63,17 +60,14 @@ class ScreenReaderFocusRegion {
         });
       });
     };
-
     const liveRegion = typeof options.liveRegion === 'function' ? options.liveRegion() : options.liveRegion;
     this._liveRegion = Array.isArray(liveRegion) ? liveRegion : [liveRegion];
     this._contextElement = element;
     this._options = options;
   }
-
   updateElement(element) {
     this._contextElement = element;
   }
-
   muteNode(node) {
     if (node && node.tagName.toLowerCase() !== 'script') {
       // When we are trapping screen reader focus on an element that
@@ -86,31 +80,24 @@ class ScreenReaderFocusRegion {
       ['role', 'aria-label', 'aria-hidden' // this should never happen right?
       ].forEach(attribute => {
         const value = node.getAttribute(attribute);
-
         if (value !== null) {
           this._attributes.push([node, attribute, value]);
-
           node.removeAttribute(attribute);
         }
       });
-
       this._observer.observe(node, {
         childList: true
       });
     }
   }
-
   hideNodes(nodes) {
     nodes.forEach(node => {
       var _node$getAttribute;
-
       const ariaLive = typeof node.getAttribute === 'function' && ((_node$getAttribute = node.getAttribute('aria-live')) === null || _node$getAttribute === void 0 ? void 0 : _node$getAttribute.toLowerCase());
-
       if (node && node.nodeType === 1 && node.tagName.toLowerCase() !== 'script' && ariaLive !== 'assertive' && ariaLive !== 'polite' && this._parents.indexOf(node) === -1 && this._nodes.indexOf(node) === -1 && this._liveRegion.indexOf(node) === -1 && !this._contextElement.contains(node)) {
         if (node.tagName.toLowerCase() !== 'iframe') {
           this.hideNode(node);
         }
-
         const iframeBodies = this.parseIframeBodies(node);
         iframeBodies.forEach(iframeBody => {
           this.hideNode(iframeBody);
@@ -118,29 +105,22 @@ class ScreenReaderFocusRegion {
       }
     });
   }
-
   hideNode(node) {
     if (node.getAttribute('aria-hidden') !== 'true') {
       node.setAttribute('aria-hidden', 'true');
-
       this._nodes.push(node);
     }
   }
-
   restoreNode(removedNode) {
     const index = this._nodes.indexOf(removedNode);
-
     if (index >= 0) {
       removedNode.removeAttribute('aria-hidden');
-
       this._nodes.splice(index, 1);
     }
   }
-
   parseIframeBodies(node) {
     if (!node) return [];
     let iframes = [];
-
     if (node.tagName.toLowerCase() === 'iframe') {
       iframes.push(node);
     } else {
@@ -148,38 +128,29 @@ class ScreenReaderFocusRegion {
         iframes = Array.from(node.getElementsByTagName('iframe'));
       }
     }
-
     return iframes.map(iframe => {
       let body = null;
-
       try {
         body = iframe.contentDocument.body;
       } catch (e) {
         (0, _console.logWarn)(false, `[ui-a11y] could not find a document for iframe: ${e} ${iframe}`);
       }
-
       return body;
     }).filter(body => body !== null);
   }
-
   activate() {
     if (!this._options.shouldContainFocus) {
       return;
     }
-
     this._observer = new MutationObserver(this.handleDOMMutation);
     let node = this._contextElement;
-
     while (node && node.nodeType === Node.ELEMENT_NODE && node.tagName.toLowerCase() !== 'body') {
       const parent = node.parentElement;
-
       if (parent) {
         this._parents.push(parent);
-
         this.muteNode(parent);
         this.hideNodes(Array.prototype.slice.call(parent.childNodes));
       }
-
       node = node.parentNode; // should never be null, will default to doc element
     }
   }
@@ -187,26 +158,19 @@ class ScreenReaderFocusRegion {
   deactivate() {
     if (this._observer) {
       this._observer.disconnect();
-
       this._observer = null;
     }
-
     this._nodes.forEach(node => {
       node.removeAttribute('aria-hidden');
     });
-
     this._nodes = [];
-
     this._attributes.forEach(attribute => {
       attribute[0].setAttribute(attribute[1], attribute[2] || '');
     });
-
     this._attributes = [];
     this._parents = [];
   }
-
 }
-
 exports.ScreenReaderFocusRegion = ScreenReaderFocusRegion;
 var _default = ScreenReaderFocusRegion;
 exports.default = _default;

package/lib/hasVisibleChildren.js

@@ -1,19 +1,14 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 exports.hasVisibleChildren = hasVisibleChildren;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
-
 var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
-
 /*
  * The MIT License (MIT)
  *
@@ -37,17 +32,15 @@ var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReade
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 function hasVisibleChildren(children) {
   let visible = false;
-
   _react.default.Children.forEach(children, child => {
     if (child && !(0, _matchComponentTypes.matchComponentTypes)(child, [_ScreenReaderContent.ScreenReaderContent])) {
       visible = true;
     }
   });
-
   return visible;
 }
-
 var _default = hasVisibleChildren;
 exports.default = _default;

package/lib/index.js

@@ -39,15 +39,9 @@ Object.defineProperty(exports, "scopeTab", {
     return _scopeTab.scopeTab;
   }
 });
-
 var _FocusRegion = require("./FocusRegion");
-
 var _FocusRegionManager = require("./FocusRegionManager");
-
 var _hasVisibleChildren = require("./hasVisibleChildren");
-
 var _KeyboardFocusRegion = require("./KeyboardFocusRegion");
-
 var _scopeTab = require("./scopeTab");
-
 var _ScreenReaderFocusRegion = require("./ScreenReaderFocusRegion");

package/lib/scopeTab.js

@@ -5,17 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 exports.scopeTab = scopeTab;
-
 var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
-
 var _findTabbable = require("@instructure/ui-dom-utils/lib/findTabbable.js");
-
 var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
-
 var _containsActiveElement = require("@instructure/ui-dom-utils/lib/containsActiveElement.js");
-
 var _getActiveElement = require("@instructure/ui-dom-utils/lib/getActiveElement.js");
-
 /*
  * The MIT License (MIT)
  *
@@ -39,40 +33,37 @@ var _getActiveElement = require("@instructure/ui-dom-utils/lib/getActiveElement.
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 function scopeTab(element, event, onLeavingFinalTabbable) {
   const node = (0, _findDOMNode.findDOMNode)(element);
   const tabbable = (0, _findTabbable.findTabbable)(node);
-
   if (!tabbable.length) {
     event.preventDefault();
     return;
-  } // Account for a changing tabindex of the active element
-  // (a case that happens with Menu for KO a11y)
-
+  }
 
+  // Account for a changing tabindex of the active element
+  // (a case that happens with Menu for KO a11y)
   if ((0, _containsActiveElement.containsActiveElement)(element)) {
     const activeElement = (0, _getActiveElement.getActiveElement)();
-
     if (activeElement && tabbable.indexOf(activeElement) === -1) {
       tabbable.push(activeElement);
     }
   }
-
   const finalTabbable = tabbable[event.shiftKey ? 0 : tabbable.length - 1];
-  const leavingFinalTabbable = (0, _isActiveElement.isActiveElement)(finalTabbable) || // handle immediate shift+tab after opening with mouse
-  (0, _isActiveElement.isActiveElement)(node) || // already left final tabbable
+  const leavingFinalTabbable = (0, _isActiveElement.isActiveElement)(finalTabbable) ||
+  // handle immediate shift+tab after opening with mouse
+  (0, _isActiveElement.isActiveElement)(node) ||
+  // already left final tabbable
   !(0, _containsActiveElement.containsActiveElement)(element);
   if (!leavingFinalTabbable) return;
-
   if (typeof onLeavingFinalTabbable === 'function') {
     onLeavingFinalTabbable();
     return;
   }
-
   event.preventDefault();
   const target = tabbable[event.shiftKey ? tabbable.length - 1 : 0];
   target.focus();
 }
-
 var _default = scopeTab;
 exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-a11y-utils",
-  "version": "8.33.2-snapshot-0",
+  "version": "8.33.2",
   "description": "A collection of utilities for managing focus and screen reader behavior",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,19 +23,19 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.33.2-snapshot-0",
-    "@instructure/ui-a11y-content": "8.33.2-snapshot-0",
-    "@instructure/ui-dom-utils": "8.33.2-snapshot-0",
-    "@instructure/ui-react-utils": "8.33.2-snapshot-0",
-    "@instructure/ui-testable": "8.33.2-snapshot-0",
-    "@instructure/uid": "8.33.2-snapshot-0",
+    "@instructure/console": "8.33.2",
+    "@instructure/ui-a11y-content": "8.33.2",
+    "@instructure/ui-dom-utils": "8.33.2",
+    "@instructure/ui-react-utils": "8.33.2",
+    "@instructure/ui-testable": "8.33.2",
+    "@instructure/uid": "8.33.2",
     "keycode": "^2",
     "prop-types": "^15"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.33.2-snapshot-0",
-    "@instructure/ui-color-utils": "8.33.2-snapshot-0",
-    "@instructure/ui-test-utils": "8.33.2-snapshot-0"
+    "@instructure/ui-babel-preset": "8.33.2",
+    "@instructure/ui-color-utils": "8.33.2",
+    "@instructure/ui-test-utils": "8.33.2"
   },
   "peerDependencies": {
     "react": ">=16.8 <=18"