@elliemae/ds-shared 2.3.0-alpha.9 → 2.3.0-next.11

package/esm/GroupContext/Group.js

@@ -0,0 +1,118 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { Component } from 'react';
+import { GroupContext } from './GroupContext.js';
+
+const getValueItem = e => {
+  const {
+    target,
+    currentTarget
+  } = e;
+
+  if (target) {
+    const {
+      value
+    } = target;
+    return value;
+  }
+
+  if (currentTarget) {
+    const {
+      value
+    } = currentTarget;
+    return value;
+  }
+
+  return e;
+};
+
+const toggleItemValue = (array, e) => {
+  const newvalue = getValueItem(e);
+  const res = array;
+  const index = array.indexOf(newvalue);
+
+  if (index === -1) {
+    res.push(newvalue);
+  } else {
+    res.splice(index, 1);
+  }
+
+  return res;
+};
+
+const {
+  Provider
+} = GroupContext;
+/** deprecated use CheckableGroup instead */
+
+class Group extends Component {
+  constructor(props) {
+    super(props);
+    const {
+      activeValue,
+      disabled
+    } = props;
+    this.state = {
+      activeValue,
+      disabled,
+      prevValue: null,
+      onChange: this.handleChange.bind(this)
+    };
+  }
+
+  static getDerivedStateFromProps(nextProps, _ref) {
+    let {
+      prevValue
+    } = _ref;
+    if (nextProps.activeValue === prevValue) return null;
+    return {
+      activeValue: nextProps.activeValue,
+      prevValue: nextProps.activeValue
+    };
+  }
+
+  handleChange(e) {
+    const {
+      multiple,
+      onChange
+    } = this.props;
+    const {
+      activeValue
+    } = this.state;
+    const value = getValueItem(e);
+    let newValue;
+
+    if (multiple) {
+      newValue = toggleItemValue(activeValue || [], value);
+    } else if (activeValue !== value) {
+      // default behaviour it will be toggle the active value
+      newValue = value;
+    }
+
+    this.setState({
+      activeValue: newValue
+    });
+
+    for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      rest[_key - 1] = arguments[_key];
+    }
+
+    if (onChange) onChange(newValue, ...rest);
+  }
+
+  render() {
+    const {
+      children
+    } = this.props;
+    return /*#__PURE__*/_jsx(Provider, {
+      value: this.state
+    }, void 0, children);
+  }
+
+}
+
+Group.defaultProps = {
+  multiple: false
+};
+
+export { Group as default };

package/esm/GroupContext/GroupContext.js

@@ -0,0 +1,5 @@
+import React from 'react';
+
+const GroupContext = /*#__PURE__*/React.createContext();
+
+export { GroupContext };

package/esm/GroupContext/GroupItem.js

@@ -0,0 +1,16 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
+import { GroupContext } from './GroupContext.js';
+
+const {
+  Consumer
+} = GroupContext;
+
+const GroupItem = _ref => {
+  let {
+    render
+  } = _ref;
+  return /*#__PURE__*/_jsx(Consumer, {}, void 0, context => render(context));
+};
+
+export { GroupItem as default };

package/esm/GroupContext/index.js

@@ -0,0 +1,3 @@
+export { default as Group } from './Group.js';
+export { GroupContext } from './GroupContext.js';
+export { default as GroupItem } from './GroupItem.js';

package/{dist/esm → esm}/ScrollSync/ScrollSync.js

@@ -1,59 +1,83 @@
-import * as React from "react";
-import React2, { Component } from "react";
-const ScrollSyncContext = React2.createContext();
-const { Provider } = ScrollSyncContext;
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+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.find.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import React, { Component } from 'react';
+
+const ScrollSyncContext = /*#__PURE__*/React.createContext();
+const {
+  Provider
+} = ScrollSyncContext;
 class ScrollSync extends Component {
   constructor(props) {
     super(props);
     this.panes = {};
+
     this.registerPane = (node, groups) => {
-      groups.forEach((group) => {
+      groups.forEach(group => {
         if (!this.panes[group]) {
           this.panes[group] = [];
         }
+
         if (this.panes[group].length > 0) {
           this.syncScrollPosition(this.panes[group][0], node);
         }
+
         this.panes[group].push(node);
       });
       this.addEvents(node, groups);
     };
+
     this.unregisterPane = (node, groups) => {
-      groups.forEach((group) => {
+      groups.forEach(group => {
         if (this.findPane(node, group)) {
           this.removeEvents(node);
           this.panes[group].splice(this.panes[group].indexOf(node), 1);
         }
       });
     };
+
     this.addEvents = (node, groups) => {
-      node.onscroll = this.handlePaneScroll.bind(this, node, groups);
+      /* For some reason element.addEventListener doesnt work with document.body */
+      node.onscroll = this.handlePaneScroll.bind(this, node, groups); // eslint-disable-line
     };
-    this.removeEvents = (node) => {
-      node.onscroll = null;
+
+    this.removeEvents = node => {
+      /* For some reason element.removeEventListener doesnt work with document.body */
+      node.onscroll = null; // eslint-disable-line
     };
+
     this.findPane = (node, group) => {
       if (!this.panes[group]) {
         return false;
       }
-      return this.panes[group].find((pane) => pane === node);
+
+      return this.panes[group].find(pane => pane === node);
     };
+
     this.handlePaneScroll = (node, groups, e) => {
-      const { enabled } = this.props;
-      if (this.props.onScroll)
-        this.props.onScroll(e);
-      if (!enabled)
-        return;
+      const {
+        enabled
+      } = this.props;
+      if (this.props.onScroll) this.props.onScroll(e);
+      if (!enabled) return;
       window.requestAnimationFrame(() => {
         this.syncScrollPositions(node, groups);
       });
     };
+
     this.syncScrollPositions = (scrolledPane, groups) => {
-      groups.forEach((group) => {
-        this.panes[group].forEach((pane) => {
+      groups.forEach(group => {
+        this.panes[group].forEach(pane => {
+          /* For all panes beside the currently scrolling one */
           if (scrolledPane !== pane) {
+            /* Remove event listeners from the node that we'll manipulate */
             this.removeEvents(pane, group);
             this.syncScrollPosition(scrolledPane, pane);
+            /* Re-attach event listeners after we're done scrolling */
+
             window.requestAnimationFrame(() => {
               this.addEvents(pane, groups);
             });
@@ -61,11 +85,13 @@ class ScrollSync extends Component {
         });
       });
     };
+
     this.syncContext = {
       registerPane: this.registerPane,
       unregisterPane: this.unregisterPane
     };
   }
+
   syncScrollPosition(scrolledPane, pane) {
     const {
       scrollTop,
@@ -77,22 +103,35 @@ class ScrollSync extends Component {
     } = scrolledPane;
     const scrollTopOffset = scrollHeight - clientHeight;
     const scrollLeftOffset = scrollWidth - clientWidth;
-    const { proportional, vertical, horizontal } = this.props;
+    const {
+      proportional,
+      vertical,
+      horizontal
+    } = this.props;
+    /* Calculate the actual pane height */
+
     const paneHeight = pane.scrollHeight - clientHeight;
     const paneWidth = pane.scrollWidth - clientWidth;
+    /* Adjust the scrollTop position of it accordingly */
+
     if (vertical && scrollTopOffset > 0) {
-      pane.scrollTop = proportional ? paneHeight * scrollTop / scrollTopOffset : scrollTop;
+      pane.scrollTop = proportional ? paneHeight * scrollTop / scrollTopOffset : scrollTop; // eslint-disable-line
     }
+
     if (horizontal && scrollLeftOffset > 0) {
-      pane.scrollLeft = proportional ? paneWidth * scrollLeft / scrollLeftOffset : scrollLeft;
+      pane.scrollLeft = proportional ? paneWidth * scrollLeft / scrollLeftOffset : scrollLeft; // eslint-disable-line
     }
   }
+
   render() {
-    const { children } = this.props;
-    return /* @__PURE__ */ React2.createElement(Provider, {
+    const {
+      children
+    } = this.props;
+    return /*#__PURE__*/_jsx(Provider, {
       value: this.syncContext
-    }, React2.Children.only(children));
+    }, void 0, React.Children.only(children));
   }
+
 }
 ScrollSync.defaultProps = {
   proportional: true,
@@ -100,10 +139,5 @@ ScrollSync.defaultProps = {
   horizontal: true,
   enabled: true
 };
-var ScrollSync_default = ScrollSync;
-export {
-  ScrollSync,
-  ScrollSyncContext,
-  ScrollSync_default as default
-};
-//# sourceMappingURL=ScrollSync.js.map
+
+export { ScrollSyncContext, ScrollSync as default };

package/esm/ScrollSync/ScrollSyncPane.js

@@ -0,0 +1,74 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.constructor.js';
+import 'core-js/modules/esnext.async-iterator.to-array.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.to-array.js';
+import 'core-js/modules/esnext.async-iterator.filter.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 { Component } from 'react';
+import { ScrollSyncContext } from './ScrollSync.js';
+import { jsx } from 'react/jsx-runtime';
+
+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; }
+
+class ScrollSyncPane extends Component {
+  constructor() {
+    super(...arguments);
+
+    this.toArray = groups => [].concat(groups);
+  }
+
+  componentWillUnmount() {
+    const {
+      enabled,
+      group,
+      syncContext
+    } = this.props;
+    const {
+      unregisterPane
+    } = syncContext;
+    if (enabled) unregisterPane(this.node, this.toArray(group));
+  }
+
+  render() {
+    const {
+      children,
+      group,
+      syncContext,
+      notPaginated
+    } = this.props;
+    const {
+      registerPane
+    } = syncContext;
+    return children({
+      registerPane: node => {
+        if (notPaginated) {
+          const virtualizedBody = node.querySelector('.virtualized-body-wrapper');
+
+          if (virtualizedBody) {
+            registerPane(virtualizedBody, this.toArray(group));
+          }
+        }
+
+        return registerPane(node, this.toArray(group));
+      }
+    });
+  }
+
+}
+
+ScrollSyncPane.defaultProps = {
+  group: 'default',
+  enabled: true
+};
+var ScrollSyncPane$1 = (props => /*#__PURE__*/_jsx(ScrollSyncContext.Consumer, {}, void 0, context => /*#__PURE__*/jsx(ScrollSyncPane, _objectSpread(_objectSpread({}, props), {}, {
+  syncContext: context
+}))));
+
+export { ScrollSyncPane$1 as default };

package/esm/ScrollSync/ScrollSyncProvider.js

@@ -0,0 +1,59 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+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.find.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import React from 'react';
+import raf from 'raf';
+
+const ScrollSyncContext = /*#__PURE__*/React.createContext();
+const {
+  Provider
+} = ScrollSyncContext;
+
+function ScrollSyncProvider(_ref) {
+  let {
+    enabled,
+    horizontal,
+    vertical,
+    children
+  } = _ref;
+  useRef();
+
+  raf((scrolledPane, pane) => {
+    const {
+      scrollTop,
+      scrollHeight,
+      clientHeight,
+      scrollLeft,
+      scrollWidth,
+      clientWidth
+    } = scrolledPane;
+    const scrollTopOffset = scrollHeight - clientHeight;
+    const scrollLeftOffset = scrollWidth - clientWidth;
+    const {
+      proportional,
+      vertical,
+      horizontal
+    } = this.props;
+    /* Calculate the actual pane height */
+
+    const paneHeight = pane.scrollHeight - clientHeight;
+    const paneWidth = pane.scrollWidth - clientWidth;
+    /* Adjust the scrollTop position of it accordingly */
+
+    if (vertical && scrollTopOffset > 0) {
+      pane.scrollTop = proportional ? paneHeight * scrollTop / scrollTopOffset : scrollTop; // eslint-disable-line
+    }
+
+    if (horizontal && scrollLeftOffset > 0) {
+      pane.scrollLeft = proportional ? paneWidth * scrollLeft / scrollLeftOffset : scrollLeft; // eslint-disable-line
+    }
+  });
+  return /*#__PURE__*/_jsx(Provider, {}, void 0, children);
+}
+
+ScrollSyncProvider.defaultProps = {};
+
+export { ScrollSyncProvider as default };

package/esm/ScrollSync/index.js

@@ -0,0 +1,2 @@
+export { default as ScrollSync } from './ScrollSync.js';
+export { default as ScrollSyncPane } from './ScrollSyncPane.js';

package/esm/ScrollSync/useScrollSync.js

@@ -0,0 +1,8 @@
+function useScrollSync(props) {
+  return {};
+}
+
+useScrollSync.propTypes = {};
+useScrollSync.defaultProps = {};
+
+export { useScrollSync as default };

package/esm/constants.js

@@ -0,0 +1,32 @@
+const DEFAULT_DELAY_OPEN = 200;
+const DEFAULT_DELAY_CLOSE = 300;
+const sizeOptions = ['small', 'medium', 'large', 'x-large'];
+const AM = 'am';
+const PM = 'pm';
+const ARROW_UP = 'ArrowUp';
+const ARROW_DOWN = 'ArrowDown';
+const BACKSPACE = 'Backspace';
+const ESCAPE = 'Escape';
+const HOME = 'Home';
+const SHIFT = 'Shift';
+const END = 'End';
+const HOUR_RANGE_12 = {
+  min: 0,
+  max: 12
+};
+const HOUR_RANGE_24 = {
+  min: 0,
+  max: 24
+};
+const GENERAL_TIME_RANGE = {
+  min: 0,
+  max: 59
+};
+const PLACEHOLDER_TIME = {
+  hour: 'hour',
+  minutes: 'minutes',
+  seconds: 'seconds',
+  meridiem: 'meridiem'
+};
+
+export { AM, ARROW_DOWN, ARROW_UP, BACKSPACE, DEFAULT_DELAY_CLOSE, DEFAULT_DELAY_OPEN, END, ESCAPE, GENERAL_TIME_RANGE, HOME, HOUR_RANGE_12, HOUR_RANGE_24, PLACEHOLDER_TIME, PM, SHIFT, sizeOptions };

package/esm/createDataInstance/createInstancePlugin.js

@@ -0,0 +1,30 @@
+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/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/web.dom-collections.iterator.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; }
+
+function getDecoratorsFromHooks(hooks, decorators) {
+  const nextDecorators = _objectSpread({}, decorators);
+
+  Object.keys(hooks).forEach(decorator => {
+    if (Array.isArray(decorators[decorator])) {
+      nextDecorators[decorator] = [...decorators[decorator], hooks[decorator]];
+    } else {
+      nextDecorators[decorator] = hooks[decorator];
+    }
+  });
+  return nextDecorators;
+}
+
+function createInstancePlugin(name, hooks) {
+  return decorators => getDecoratorsFromHooks(hooks, decorators);
+}
+
+export { createInstancePlugin as default };

package/esm/createDataInstance/createInstanceRef.js

@@ -0,0 +1,90 @@
+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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+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.reduce.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import { v4 } from 'uuid';
+import { useRef, useState, useMemo } from 'react';
+import { orderBy } from 'lodash';
+import { mergeInstance, registerStateHookToInstance, registerHotKeysHookToInstance } from './utils.js';
+
+const _excluded = ["uuid", "data", "renderers", "plugins", "customDecorators"];
+
+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 defaultDecorators = {
+  instance: [],
+  state: [],
+  hotKeys: [],
+  renderers: [],
+  composeData: []
+};
+function createDataInstanceRef(_ref) {
+  let {
+    uuid: uuidProp,
+    data,
+    renderers,
+    plugins,
+    customDecorators
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const instance = useRef(); // eslint-disable-next-line react-hooks/rules-of-hooks
+
+  const [uuid] = useState(uuidProp || (() => v4()));
+  instance.current = {
+    uuid,
+    state: {},
+    actions: {},
+    hotKeys: {},
+    // keyboard hotkeys to run specific actions
+    originalData: data,
+    records: [],
+    // item abstraction with meta data for originalData
+    renderers,
+
+    ref(key) {
+      // eslint-disable-next-line no-return-assign
+      return node => instance.current.refs[key] = node;
+    },
+
+    getInstance() {
+      return instance.current;
+    },
+
+    props
+  }; // eslint-disable-next-line react-hooks/rules-of-hooks
+
+  const decorators = useMemo(() => {
+    let nextDecorators = _objectSpread(_objectSpread({}, defaultDecorators), customDecorators);
+
+    plugins.forEach(plugin => {
+      if (!plugin) return;
+      nextDecorators = plugin(nextDecorators);
+    });
+    Object.keys(nextDecorators).forEach(key => {
+      if (Array.isArray(nextDecorators[key])) nextDecorators[key] = orderBy(nextDecorators[key], item => item.order);
+    });
+    return nextDecorators;
+  }, []); // the plugins are defined on creation, but not changed at runtime
+  // todo: test if getting the hooks without registering them
+  //  here would be beneficial to memoize instance and squeeze performance
+
+  instance.current = decorators.instance.reduce(mergeInstance, instance.current);
+  instance.current = decorators.state.reduce(registerStateHookToInstance, instance.current);
+  instance.current = decorators.hotKeys.reduce(registerHotKeysHookToInstance, instance.current);
+  instance.current.renderers = decorators.renderers.reduce((result, decorator) => decorator(result, instance.current), renderers);
+  return {
+    instance,
+    decorators
+  };
+}
+
+export { createDataInstanceRef as default };