@elliemae/ds-shared 2.2.0-alpha.4 → 3.0.0-next.2

package/esm/FocusGroup/FocusGroup.js

@@ -1,51 +1,86 @@
-import * as React from "react";
-import { isFunction, get } from "@elliemae/ds-utilities";
-import hotkeys from "hotkeys-js";
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import { get, isFunction } from '@elliemae/ds-utilities';
+import hotkeys from 'hotkeys-js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const defaultOptions = {
-  orientation: "vertical"
+  orientation: 'vertical'
 };
-const safeCallAction = (e, fun, ...args) => {
+
+const safeCallAction = function (e, fun) {
   if (isFunction(fun)) {
     e.preventDefault();
+
+    for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
     fun(...args);
   }
 };
-const registerHotkeys = (hotKeys = {}, params, getContainer = () => document) => {
-  Object.keys(hotKeys).forEach((hotkey) => {
-    const { options, handler, allowDocumentHandler = false } = hotKeys[hotkey];
-    const parameterizedHandler = (e) => {
+
+const registerHotkeys = function () {
+  let hotKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let params = arguments.length > 1 ? arguments[1] : undefined;
+  let getContainer = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : () => document;
+  Object.keys(hotKeys).forEach(hotkey => {
+    const {
+      options,
+      handler,
+      allowDocumentHandler = false
+    } = hotKeys[hotkey];
+
+    const parameterizedHandler = e => {
       const handlerParams = isFunction(params) ? params() : params;
-      if (!allowDocumentHandler && handlerParams.item !== document.activeElement)
-        return;
+      if (!allowDocumentHandler && handlerParams.item !== document.activeElement) return;
       e.preventDefault();
       handler(handlerParams);
     };
-    hotkeys(hotkey, { element: getContainer(), ...options }, parameterizedHandler);
+
+    hotkeys(hotkey, _objectSpread({
+      element: getContainer()
+    }, options), parameterizedHandler);
   });
 };
-const unregisterHotKeys = (hotKeys = {}) => {
-  Object.keys(hotKeys).forEach((hotkey) => {
+
+const unregisterHotKeys = function () {
+  let hotKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  Object.keys(hotKeys).forEach(hotkey => {
     hotkeys.unbind(hotkey);
   });
 };
+
 const noop = () => null;
+
 class FocusGroup {
-  constructor(options = {}) {
+  constructor() {
+    let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     this.items = [];
-    this.options = { ...defaultOptions, ...options };
-    const { orientation } = this.options;
-    this.keyBindings = {
-      ArrowUp: orientation !== "horizontal" && "previous",
-      ArrowRight: orientation !== "vertical" && "next",
-      ArrowDown: orientation !== "horizontal" && "next",
-      ArrowLeft: orientation !== "vertical" && "previous",
-      Home: "first",
-      End: "last",
-      PageUp: "first",
-      PageDown: "last",
-      Escape: "exit",
-      ...options.keyBindings
-    };
+    this.options = _objectSpread(_objectSpread({}, defaultOptions), options);
+    const {
+      orientation
+    } = this.options;
+    this.keyBindings = _objectSpread({
+      ArrowUp: orientation !== 'horizontal' && 'previous',
+      ArrowRight: orientation !== 'vertical' && 'next',
+      ArrowDown: orientation !== 'horizontal' && 'next',
+      ArrowLeft: orientation !== 'vertical' && 'previous',
+      Home: 'first',
+      End: 'last',
+      PageUp: 'first',
+      PageDown: 'last',
+      Escape: 'exit'
+    }, options.keyBindings);
     this.currentFocusedItem = null;
     this.currIndex = null;
     this.mapActions = {
@@ -67,154 +102,200 @@ class FocusGroup {
     this.focusCurrent = this.focusCurrent.bind(this);
     this.getHotKeysParams = this.getHotKeysParams.bind(this);
   }
+
   getHotKeysParams() {
     const item = this.currentFocusedItem;
-    const { index } = get(item, ["dataset"], {});
+    const {
+      index
+    } = get(item, ['dataset'], {});
     return {
       item,
       index
     };
   }
+
   activate() {
-    const { getContainer } = this.options;
-    document.addEventListener("keydown", this.handleKeyDown, true);
+    const {
+      getContainer
+    } = this.options;
+    document.addEventListener('keydown', this.handleKeyDown, true);
     registerHotkeys(this.options.hotKeys, this.getHotKeysParams, getContainer);
   }
+
   deactivate() {
-    document.removeEventListener("keydown", this.handleKeyDown, true);
+    document.removeEventListener('keydown', this.handleKeyDown, true);
     unregisterHotKeys(this.options.hotKeys);
   }
+
   handleKeyDown(e) {
-    if (!this.isGroupActive())
-      return;
+    if (!this.isGroupActive()) return;
     this.executeActionByEvent(e);
   }
+
   executeActionByEvent(e) {
     const actions = Array.isArray(this.keyBindings[e.key]) ? this.keyBindings[e.key] : [this.keyBindings[e.key]];
-    return actions.map((action) => typeof action === "string" ? safeCallAction(e, this.mapActions[action]) : safeCallAction(e, action));
+    return actions.map(action => typeof action === 'string' ? safeCallAction(e, this.mapActions[action]) : safeCallAction(e, action));
   }
-  register(node, props = {}) {
-    const afterIndex = this.items.findIndex((item) => item.compareDocumentPosition(node) === Node.DOCUMENT_POSITION_PRECEDING);
+
+  register(node) {
+    let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    const afterIndex = this.items.findIndex(item => item.compareDocumentPosition(node) === Node.DOCUMENT_POSITION_PRECEDING);
     node.specialOnFocus = props.onFocus || noop;
     node.specialOnBlur = props.onBlur || noop;
+
     node.onclick = () => this.focusItem(node);
+
     node.onfocus = () => {
       this.focusItem(node);
     };
+
     if (afterIndex === -1) {
       this.items.push(node);
     } else {
       this.items.splice(afterIndex, 0, node);
     }
   }
+
   unregister(node) {
     const index = this.getItemIndexByNode(node);
-    if (index > -1)
-      this.items.splice(index, 1);
+    if (index > -1) this.items.splice(index, 1);
   }
+
   exit() {
-    const { onExitFocusGroup } = this.options;
+    const {
+      onExitFocusGroup
+    } = this.options;
     onExitFocusGroup();
   }
+
   focusItem(node) {
     if (this.currentFocusedItem && this.currentFocusedItem !== node) {
       this.currentFocusedItem.specialOnBlur();
-      this.currentFocusedItem.setAttribute("tabindex", -1);
+      this.currentFocusedItem.setAttribute('tabindex', -1);
     }
-    if (!node)
-      return;
+
+    if (!node) return;
     this.currentFocusedItem = node;
-    node.setAttribute("tabindex", 0);
+    node.setAttribute('tabindex', 0);
     node.focus();
     node.specialOnFocus();
   }
+
   focusNext() {
     const item = this.getNextItem();
     this.focusItem(item);
   }
+
   focusByNode(node) {
     const index = this.getItemIndexByNode(node);
     this.focusByIndex(index);
   }
+
   focusByIndex(index) {
     const item = this.getItemByIndex(index);
     this.focusItem(item);
   }
+
   focusPrevious() {
     const prevItem = this.getPreviousItem();
     this.focusItem(prevItem);
   }
+
   focusFirst() {
     const item = this.getFirstItem();
     this.focusItem(item);
   }
+
   focusLast() {
     const item = this.getLastItem();
     this.focusItem(item);
   }
+
   focusCurrent() {
     this.focusItem(this.currentFocusedItem);
   }
+
   focusNextGroup() {
-    const { onFocusNextGroup } = this.options;
+    const {
+      onFocusNextGroup
+    } = this.options;
     this.exit();
     onFocusNextGroup();
   }
+
   focusPreviousGroup() {
-    const { onFocusPreviousGroup } = this.options;
+    const {
+      onFocusPreviousGroup
+    } = this.options;
     this.exit();
     onFocusPreviousGroup();
   }
+
   getNextItem() {
-    const { loop } = this.options;
+    const {
+      loop
+    } = this.options;
     const currentIndex = this.getFocusedIndex();
     const supposedNextIndex = currentIndex + 1;
+
     if (!this.checkCanFocusNext(supposedNextIndex)) {
       return loop ? this.getFirstItem() : this.focusNextGroup();
     }
+
     return this.getItemByIndex(supposedNextIndex);
   }
+
   getPreviousItem() {
-    const { loop } = this.options;
+    const {
+      loop
+    } = this.options;
     const currentIndex = this.getFocusedIndex();
     const supposedPrevIndex = currentIndex - 1;
+
     if (!this.checkCanFocusPrev(supposedPrevIndex)) {
       return loop ? this.getLastItem() : this.focusPreviousGroup();
     }
+
     return this.getItemByIndex(supposedPrevIndex);
   }
+
   checkCanFocusNext(index) {
     return this.items.length > index;
   }
+
   checkCanFocusPrev(index) {
     return index >= 0;
   }
+
   getItemByIndex(index) {
     return this.items[index];
   }
+
   getItemIndexByNode(node) {
-    return this.items.findIndex((item) => item === node);
+    return this.items.findIndex(item => item === node);
   }
+
   getFocusedIndex() {
     return this.getItemIndexByNode(document.activeElement);
   }
+
   getFocusedItem() {
     const index = this.getFocusedIndex();
     return index > -1 && this.items[index];
   }
+
   isGroupActive() {
     return this.getFocusedIndex() !== -1;
   }
+
   getFirstItem() {
     return !!this.items.length && this.items[0];
   }
+
   getLastItem() {
     return !!this.items.length && this.items[this.items.length - 1];
   }
+
 }
-var FocusGroup_default = FocusGroup;
-export {
-  FocusGroup,
-  FocusGroup_default as default
-};
-//# sourceMappingURL=FocusGroup.js.map
+
+export { FocusGroup as default };

package/esm/FocusGroup/FocusGroupContext.js

@@ -1,9 +1,5 @@
-import * as React from "react";
-import React2 from "react";
-const FocusGroupContext = React2.createContext();
-var FocusGroupContext_default = FocusGroupContext;
-export {
-  FocusGroupContext,
-  FocusGroupContext_default as default
-};
-//# sourceMappingURL=FocusGroupContext.js.map
+import React from 'react';
+
+var FocusGroupContext = /*#__PURE__*/React.createContext();
+
+export { FocusGroupContext as default };

package/esm/FocusGroup/FocusGroupManager.js

@@ -1,9 +1,11 @@
-import * as React from "react";
-import React2, { Component } from "react";
-import { isFunction } from "@elliemae/ds-utilities";
-import { FocusGroup } from "./FocusGroup";
-import { FocusGroupContext } from "./FocusGroupContext";
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { Component } from 'react';
+import { isFunction } from '@elliemae/ds-utilities';
+import FocusGroup from './FocusGroup.js';
+import FocusGroupContext from './FocusGroupContext.js';
+
 const noop = () => null;
+
 class FocusGroupProvider extends Component {
   constructor(props) {
     super(props);
@@ -25,58 +27,75 @@ class FocusGroupProvider extends Component {
       focusPrevious: this.focusGroup.focusPrevious
     };
   }
+
   componentDidMount() {
-    const { autoFocusOnMount } = this.props;
+    const {
+      autoFocusOnMount
+    } = this.props;
     this.activate();
+
     if (autoFocusOnMount) {
       setTimeout(() => {
         this.actions.focusFirst();
       }, 0);
     }
   }
+
   componentWillUnmount() {
     this.deactivate();
   }
+
   activate() {
-    const { onActivate } = this.props;
+    const {
+      onActivate
+    } = this.props;
     this.focusGroup.activate();
     this.activated = true;
-    if (isFunction(onActivate))
-      onActivate();
+    if (isFunction(onActivate)) onActivate();
   }
+
   deactivate() {
-    const { onExitFocusGroup } = this.props;
+    const {
+      onExitFocusGroup
+    } = this.props;
     this.activated = false;
     this.focusGroup.deactivate();
+
     if (isFunction(onExitFocusGroup)) {
       onExitFocusGroup();
     }
   }
+
   register(item) {
     this.focusGroup.register(item);
   }
+
   unregister(item) {
     this.focusGroup.unregister(item);
   }
+
   focusItemByIndex(index) {
-    if (!this.activated)
-      this.activate();
+    if (!this.activated) this.activate();
     setTimeout(() => {
       this.focusGroup.focusByIndex(index);
     }, 200);
   }
+
   focusItemByNode(node) {
-    if (!this.activated)
-      this.activate();
+    if (!this.activated) this.activate();
     const index = this.focusGroup.getItemIndexByNode(node);
     this.focusItemByIndex(index);
   }
+
   render() {
-    const { children } = this.props;
-    return /* @__PURE__ */ React2.createElement(FocusGroupContext.Provider, {
+    const {
+      children
+    } = this.props;
+    return /*#__PURE__*/_jsx(FocusGroupContext.Provider, {
       value: this.actions
-    }, children);
+    }, void 0, children);
   }
+
 }
 FocusGroupProvider.defaultProps = {
   exitWhenNoPrevious: false,
@@ -88,10 +107,5 @@ FocusGroupProvider.defaultProps = {
   onFocusNextGroup: noop,
   onFocusGroupSet: noop
 };
-var FocusGroupManager_default = FocusGroupProvider;
-export {
-  FocusGroupProvider as FocusGroupManager,
-  FocusGroupProvider,
-  FocusGroupManager_default as default
-};
-//# sourceMappingURL=FocusGroupManager.js.map
+
+export { FocusGroupProvider as default };

package/esm/FocusGroup/focusGroupManagerHoc.js

@@ -1,25 +1,37 @@
-import * as React from "react";
-import React2 from "react";
-import { FocusGroupProvider } from "./FocusGroupManager";
-function FocusGroupHoc(WrappedComponent, options = {}) {
-  return ({
-    onExitFocusGroup,
-    onFocusPrevGroup,
-    focusKeyBindings,
-    ...props
-  }) => /* @__PURE__ */ React2.createElement(FocusGroupProvider, {
-    keyBindings: focusKeyBindings,
-    onExitFocusGroup,
-    onFocusPrevGroup,
-    ...options
-  }, /* @__PURE__ */ React2.createElement(WrappedComponent, {
-    ...props,
-    ...options
-  }));
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'react';
+import FocusGroupProvider from './FocusGroupManager.js';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["onExitFocusGroup", "onFocusPrevGroup", "focusKeyBindings"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function FocusGroupHoc(WrappedComponent) {
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return _ref => {
+    let {
+      onExitFocusGroup,
+      onFocusPrevGroup,
+      focusKeyBindings
+    } = _ref,
+        props = _objectWithoutProperties(_ref, _excluded);
+
+    return /*#__PURE__*/jsx(FocusGroupProvider, _objectSpread(_objectSpread({
+      keyBindings: focusKeyBindings,
+      onExitFocusGroup: onExitFocusGroup,
+      onFocusPrevGroup: onFocusPrevGroup
+    }, options), {}, {
+      children: /*#__PURE__*/jsx(WrappedComponent, _objectSpread(_objectSpread({}, props), options))
+    }));
+  };
 }
-var focusGroupManagerHoc_default = FocusGroupHoc;
-export {
-  FocusGroupHoc,
-  focusGroupManagerHoc_default as default
-};
-//# sourceMappingURL=focusGroupManagerHoc.js.map
+
+export { FocusGroupHoc as default };

package/esm/FocusGroup/index.js

@@ -1,18 +1,6 @@
-import * as React from "react";
-import { FocusGroup } from "./FocusGroup";
-import { FocusGroupContext } from "./FocusGroupContext";
-import { FocusGroupManager } from "./FocusGroupManager";
-import { useFocusGroupItem, useFocusGroupWithState } from "./useFocusGroupItem";
-import { FocusGroupHoc } from "./focusGroupManagerHoc";
-import { FocusGridProvider, FocusGridContext } from "./FocusGrid";
-export {
-  FocusGridProvider as FocusGrid,
-  FocusGridContext,
-  FocusGroup,
-  FocusGroupContext,
-  FocusGroupManager,
-  FocusGroupHoc as focusGroupManagerHoc,
-  useFocusGroupItem,
-  useFocusGroupWithState
-};
-//# sourceMappingURL=index.js.map
+export { default as FocusGroup } from './FocusGroup.js';
+export { default as FocusGroupContext } from './FocusGroupContext.js';
+export { default as FocusGroupManager } from './FocusGroupManager.js';
+export { default as useFocusGroupItem, useFocusGroupWithState } from './useFocusGroupItem.js';
+export { default as focusGroupManagerHoc } from './focusGroupManagerHoc.js';
+export { default as FocusGrid, FocusGridContext } from './FocusGrid.js';

package/esm/FocusGroup/useFocusGroupItem.js

@@ -1,38 +1,50 @@
-import * as React from "react";
-import { useContext, useEffect } from "react";
-import { FocusGroupContext } from "./FocusGroupContext";
-function useFocusGroupItem(ref = {}, props) {
-  const { register, unregister, ...otherActions } = useContext(FocusGroupContext) || {};
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { useContext, useEffect } from 'react';
+import FocusGroupContext from './FocusGroupContext.js';
+
+const _excluded = ["register", "unregister"],
+      _excluded2 = ["register", "unregister"];
+function useFocusGroupItem() {
+  let ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let props = arguments.length > 1 ? arguments[1] : undefined;
+
+  const _ref = useContext(FocusGroupContext) || {},
+        {
+    register,
+    unregister
+  } = _ref,
+        otherActions = _objectWithoutProperties(_ref, _excluded);
+
   useEffect(() => {
-    if (ref.current && register)
-      register(ref.current, props);
+    if (ref.current && register) register(ref.current, props);
     return () => {
-      if (ref.current && unregister)
-        unregister(ref.current);
+      if (ref.current && unregister) unregister(ref.current);
     };
-  });
-  if (!register)
-    return {};
+  }); // if the focus item is not wrapped with the focus provider then return null
+
+  if (!register) return {};
   return otherActions;
 }
-const useFocusGroupWithState = (ref = {}, props) => {
-  const { register, unregister, ...otherActions } = useContext(FocusGroupContext) || {};
+const useFocusGroupWithState = function () {
+  let ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let props = arguments.length > 1 ? arguments[1] : undefined;
+
+  const _ref2 = useContext(FocusGroupContext) || {},
+        {
+    register,
+    unregister
+  } = _ref2,
+        otherActions = _objectWithoutProperties(_ref2, _excluded2);
+
   useEffect(() => {
-    if (ref && register)
-      register(ref, props);
+    if (ref && register) register(ref, props);
     return () => {
-      if (ref && unregister)
-        unregister(ref);
+      if (ref && unregister) unregister(ref);
     };
-  }, [ref]);
-  if (!register)
-    return {};
+  }, [ref]); // if the focus item is not wrapped with the focus provider then return null
+
+  if (!register) return {};
   return otherActions;
 };
-var useFocusGroupItem_default = useFocusGroupItem;
-export {
-  useFocusGroupItem_default as default,
-  useFocusGroupItem,
-  useFocusGroupWithState
-};
-//# sourceMappingURL=useFocusGroupItem.js.map
+
+export { useFocusGroupItem as default, useFocusGroupWithState };