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

package/esm/useDataList/index.js

@@ -0,0 +1 @@
+export { default } from './useDataList.js';

package/esm/useDataList/recordIterator.js

@@ -0,0 +1,27 @@
+const defaultStrategy = () => {
+  throw Error('Implement an iterator strategy for record iterator');
+};
+
+function recordIterator(records) {
+  let strategy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultStrategy;
+  let decorators = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  let instance = arguments.length > 3 ? arguments[3] : undefined;
+  const nextRows = [];
+  strategy({
+    data: records,
+    cb: row => {
+      let nextRow = row; // eslint-disable-next-line no-loops/no-loops,no-plusplus
+
+      for (let i = 0; i < decorators.length; i++) {
+        nextRow = decorators[i](nextRow, instance);
+        if (!nextRow) break;
+      }
+
+      if (nextRow) nextRows.push(nextRow);
+    },
+    instance
+  });
+  return nextRows;
+}
+
+export { recordIterator };

package/esm/useDataList/useDataList.js

@@ -0,0 +1,90 @@
+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 _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.reduce.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import { useRef, useMemo } from 'react';
+import { setRef } from '@elliemae/ds-utilities';
+import get from 'lodash/get';
+import { reducePropsGetter, composeFormatters } from '../createDataInstance/utils.js';
+import { recordIterator } from './recordIterator.js';
+import createDataInstanceRef from '../createDataInstance/createInstanceRef.js';
+
+const _excluded = ["data", "plugins", "renderers", "itemRenderer", "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 getItemLabel = function (record) {
+  let nameKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'name';
+  return get(record, ['data', nameKey]);
+};
+const getItemChildren = function (record) {
+  let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
+  return get(record, ['data', childrenKey]);
+};
+const listRenderers = {
+  list: 'ul',
+  item: 'li'
+}; // todo: check if a plugin is a LIST plugin rather than GRID
+
+function useDataList(_ref) {
+  let {
+    data = [],
+    plugins = [],
+    renderers = listRenderers,
+    itemRenderer = [],
+    customDecorators
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  const listRef = useRef();
+  const {
+    instance,
+    decorators
+  } = createDataInstanceRef(_objectSpread({
+    data,
+    renderers,
+    plugins,
+    customDecorators: _objectSpread(_objectSpread({}, customDecorators), {}, {
+      recordIterator,
+      getListProps: [],
+      getItemProps: [],
+      itemRenderer: [...itemRenderer],
+      // components reduce to compose item content
+      record: [],
+      records: []
+    })
+  }, props));
+
+  instance.current.getListRef = () => listRef;
+
+  instance.current.setListRef = ref => {
+    listRef.current = ref;
+  };
+
+  instance.current.getItemLabel = record => getItemLabel(record, props.nameKey);
+
+  instance.current.getItemChildren = record => getItemChildren(record, props.childrenKey);
+
+  instance.current.decorators = decorators;
+  instance.current.getListProps = reducePropsGetter(decorators.getListProps, instance.current);
+  instance.current.getItemProps = reducePropsGetter(decorators.getItemProps, instance.current);
+  instance.current.itemRenderer = composeFormatters(instance.current.decorators.itemRenderer, instance.current);
+  instance.current.records = useMemo(() => {
+    // record iterator TREE / Simple
+    let nextRecords = recordIterator(data, instance.current.decorators.recordIterator, decorators.record, instance.current); // compose all records
+
+    nextRecords = decorators.records.reduce((nextRows, getter) => getter(nextRows, instance.current), nextRecords);
+    return nextRecords;
+  });
+  if (props.instanceRef) setRef(props.instanceRef, instance.current);
+  return instance.current;
+}
+
+export { useDataList as default, getItemChildren, getItemLabel };

package/esm/utils.js

@@ -0,0 +1,95 @@
+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 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+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';
+
+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; }
+
+/* eslint-disable no-cond-assign */
+const objectType = obj => Object.prototype.toString.call(obj).slice(8, -1);
+const isDefined = param => typeof param !== 'undefined';
+const isUndefined = param => typeof param === 'undefined';
+const isFunction = param => typeof param === 'function';
+const isNumber = param => typeof param === 'number' && !isNaN(param); // eslint-disable-line
+
+const isString = str => objectType(str) === 'String';
+const isArray = arr => objectType(arr) === 'Array';
+const closest = (target, selector) => {
+  // closest(e.target, '.field')
+  while (target) {
+    // eslint-disable-line
+    if (target.matches && target.matches(selector)) return target;
+    if (target.msMatchesSelector && target.msMatchesSelector(selector)) return target; // eslint-disable-next-line no-param-reassign
+
+    target = target.parentNode;
+  }
+
+  return null;
+};
+const getOffsetRect = elem => {
+  // (1)
+  const box = elem.getBoundingClientRect();
+  const {
+    body,
+    documentElement
+  } = document; // (2)
+
+  const scrollTop = window.pageYOffset || documentElement.scrollTop || body.scrollTop;
+  const scrollLeft = window.pageXOffset || documentElement.scrollLeft || body.scrollLeft; // (3)
+
+  const clientTop = documentElement.clientTop || body.clientTop || 0;
+  const clientLeft = documentElement.clientLeft || body.clientLeft || 0; // (4)
+
+  const top = box.top + scrollTop - clientTop;
+  const left = box.left + scrollLeft - clientLeft;
+  return {
+    top: Math.round(top),
+    left: Math.round(left)
+  };
+};
+const getTotalScroll = elem => {
+  let top = 0;
+  let left = 0; // eslint-disable-next-line no-param-reassign
+
+  while (elem = elem.parentNode) {
+    top += elem.scrollTop || 0;
+    left += elem.scrollLeft || 0;
+  }
+
+  return {
+    top,
+    left
+  };
+};
+const getTransformProps = (x, y) => ({
+  transform: "translate(".concat(x, "px, ").concat(y, "px)")
+});
+const listWithChildren = (list, childrenProp) => list.map(item => _objectSpread(_objectSpread({}, item), {}, {
+  [childrenProp]: item[childrenProp] ? listWithChildren(item[childrenProp], childrenProp) : []
+}));
+const getAllNonEmptyNodesIds = (items, childrenProp) => {
+  let childrenIds = [];
+  const ids = items.filter(item => item[childrenProp].length).map(item => {
+    childrenIds = childrenIds.concat(getAllNonEmptyNodesIds(item[childrenProp], childrenProp));
+    return item.id;
+  });
+  return ids.concat(childrenIds);
+};
+const isInternetExplorer = () => {
+  const ua = window.navigator.userAgent;
+  const msie = ua.indexOf('MSIE '); // If Internet Explorer, return version number
+
+  if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv:11\./)) {
+    return true;
+  }
+
+  return false;
+};
+
+export { closest, getAllNonEmptyNodesIds, getOffsetRect, getTotalScroll, getTransformProps, isArray, isDefined, isFunction, isInternetExplorer, isNumber, isString, isUndefined, listWithChildren, objectType };

package/esm/virtualization/AutoHeightList.js

@@ -0,0 +1,52 @@
+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 { forwardRef, useRef } from 'react';
+import { FixedSizeList } from 'react-window';
+import { useWindowScrollerList, mergeRefs, cx } from '@elliemae/ds-utilities';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["itemCount", "className", "innerRef", "itemData", "itemKey", "itemSize", "outerRef", "component"];
+
+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 AutoHeightList = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    itemCount,
+    className,
+    innerRef,
+    itemData,
+    itemKey,
+    itemSize,
+    outerRef,
+    component: ListComponent = FixedSizeList
+  } = _ref,
+      otherProps = _objectWithoutProperties(_ref, _excluded);
+
+  const listRef = useRef();
+  const outerListRef = useRef();
+  useWindowScrollerList({
+    listInstance: listRef,
+    outerListRef
+  });
+  return /*#__PURE__*/jsx(ListComponent, _objectSpread(_objectSpread({}, otherProps), {}, {
+    ref: mergeRefs(ref, listRef),
+    className: cx(className, 'window-scroller-override'),
+    height: window.innerHeight,
+    innerRef: innerRef,
+    itemCount: itemCount,
+    itemData: itemData,
+    itemKey: itemKey,
+    itemSize: itemSize,
+    outerRef: mergeRefs(outerListRef, outerRef),
+    overscanCount: 10,
+    useIsScrolling: true
+  }));
+});
+
+export { AutoHeightList };

package/esm/virtualization/FluidHeightList.js

@@ -0,0 +1,38 @@
+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 _jsx from '@babel/runtime/helpers/esm/jsx';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import AutoSizer from 'react-virtualized-auto-sizer';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["component"];
+
+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 FluidHeightList = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    component: Component
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/_jsx(AutoSizer, {
+    disableWidth: true
+  }, void 0, _ref2 => {
+    let {
+      height: fluidHeight
+    } = _ref2;
+    return /*#__PURE__*/jsx(Component, _objectSpread(_objectSpread({}, props), {}, {
+      ref: ref,
+      height: fluidHeight - 32 // taking in count the margins of the list
+
+    }));
+  });
+});
+
+export { FluidHeightList };

package/esm/virtualization/index.js

@@ -0,0 +1,18 @@
+import { FluidHeightList } from './FluidHeightList.js';
+export { FluidHeightList } from './FluidHeightList.js';
+import { AutoHeightList } from './AutoHeightList.js';
+export { AutoHeightList } from './AutoHeightList.js';
+
+function getVirtualListComponent(_ref) {
+  let {
+    component: Component,
+    fluid,
+    height,
+    autoHeight
+  } = _ref;
+  if (autoHeight) return AutoHeightList;
+  if (fluid) return FluidHeightList;
+  return Component;
+}
+
+export { getVirtualListComponent };