@elliemae/ds-shared 2.3.0-alpha.8 → 2.3.0-next.2

package/esm/createDataInstance/utils.js

@@ -0,0 +1,107 @@
+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/esnext.async-iterator.reduce.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+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.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; }
+const reducePropsGetter = function () {
+  let decorators = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  let grid = arguments.length > 1 ? arguments[1] : undefined;
+  return function () {
+    let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    let extraParams = arguments.length > 1 ? arguments[1] : undefined;
+    let nextProps = props;
+    decorators.forEach(decorator => {
+      nextProps = decorator(nextProps, grid, extraParams);
+    });
+    return nextProps;
+  };
+};
+/* eslint-disable-next-line max-params */
+
+function evaluateTransforms(transforms, value) {
+  let extraParams = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  let props = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+  let grid = arguments.length > 4 ? arguments[4] : undefined;
+  let nextProps = props;
+  transforms.forEach(transform => {
+    nextProps = transform(value, extraParams, nextProps, grid);
+  });
+  return nextProps;
+}
+/* eslint-disable-next-line max-params */
+
+function evaluateFormatters(formatters, value) {
+  let extraParams = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  let grid = arguments.length > 3 ? arguments[3] : undefined;
+  return formatters.reduce((result, formatter) => formatter(result, extraParams, grid), value);
+}
+function composeFormatters(formatters, instance) {
+  let getItemValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : record => record.data.name;
+  // todo: make the formatters subscribe to the item props instead of getting the whole instance
+  // todo: addd should formatter update to memoize specific ones
+  return props => formatters.reduce((result, formatter) => formatter(result, props, instance), getItemValue(props.record));
+}
+const applyDecorators = function (subject) {
+  let decorators = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  return decorators.reduce((nextSubject, decorator) => decorator(nextSubject, ...args), subject);
+};
+const decorateColumns = (columns, decorators, grid) => {
+  const nextColumns = applyDecorators(columns, decorators.decorateColumns, grid);
+  return nextColumns.map((column, index) => applyDecorators(column, decorators.decorateColumn, grid, index));
+};
+const mergeInstance = (instance, instanceHook) => _objectSpread(_objectSpread({}, instance), instanceHook(instance));
+const registerStateHookToInstance = (instance, stateHook) => {
+  const {
+    state,
+    actions
+  } = stateHook(instance);
+  return _objectSpread(_objectSpread({}, instance), {}, {
+    state: _objectSpread(_objectSpread({}, instance.state), state),
+    actions: _objectSpread(_objectSpread({}, instance.actions), actions)
+  });
+};
+
+const reduceHotKey = (instance, _ref) => {
+  let {
+    key,
+    handler,
+    options,
+    allowDocumentHandler
+  } = _ref;
+  return _objectSpread(_objectSpread({}, instance), {}, {
+    hotKeys: _objectSpread(_objectSpread({}, instance.hotKeys), {}, {
+      [key]: {
+        handler,
+        options,
+        allowDocumentHandler
+      }
+    })
+  });
+};
+
+const registerHotKeysHookToInstance = (instance, hotKeysHook) => {
+  const hotKeys = hotKeysHook(instance);
+
+  if (Array.isArray(hotKeys)) {
+    return hotKeys.reduce(reduceHotKey, instance);
+  }
+
+  return reduceHotKey(instance, hotKeys);
+};
+
+export { applyDecorators, composeFormatters, decorateColumns, evaluateFormatters, evaluateTransforms, mergeInstance, reducePropsGetter, registerHotKeysHookToInstance, registerStateHookToInstance };

package/esm/defer-render-hoc/index.js

@@ -0,0 +1,41 @@
+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 'core-js/modules/web.dom-collections.iterator.js';
+import { PureComponent } from 'react';
+import raf from 'raf';
+import hoistNonReactStatic from 'hoist-non-react-statics';
+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; }
+function deferComponentRender(WrappedComponent, fallback) {
+  class DeferredRenderWrapper extends PureComponent {
+    constructor() {
+      super(...arguments);
+      this.state = {
+        shouldRender: false
+      };
+    }
+
+    componentDidMount() {
+      raf(() => raf(() => this.setState({
+        shouldRender: true
+      })));
+    }
+
+    render() {
+      // eslint-disable-next-line react/destructuring-assignment
+      return this.state.shouldRender ? /*#__PURE__*/jsx(WrappedComponent, _objectSpread({}, this.props)) : fallback;
+    }
+
+  }
+
+  return hoistNonReactStatic(DeferredRenderWrapper, WrappedComponent);
+}
+
+export { deferComponentRender as default };

package/esm/dimsum.config.js

@@ -0,0 +1,5 @@
+var dimsum_config = {
+  classNamePrefix: 'em-ds'
+};
+
+export { dimsum_config as default };

package/esm/index.js

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

package/esm/prop-types.js

@@ -0,0 +1,43 @@
+const dsBasicSizes = ['s', 'm', 'l'];
+const sizes = ['xsmall', 'small', 'medium', 'large', 'xlarge'];
+const iconSizes = ['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl'];
+const iconColors = [['neutral', '900'], ['neutral', '0'], ['danger', '900'], ['warning', '500'], ['success', '900'], ['brand-primary', '600']];
+const CHECKBOX_VARIANT = {
+  DEFAULT: 'variant-default',
+  FOCUS: 'variant-focus',
+  ACTIVE: 'variant-active',
+  DISABLED: 'variant-disabled',
+  ERROR: 'variant-error'
+};
+const checkboxVariants = [CHECKBOX_VARIANT.DEFAULT, CHECKBOX_VARIANT.FOCUS, CHECKBOX_VARIANT.ACTIVE, CHECKBOX_VARIANT.DISABLED, CHECKBOX_VARIANT.ERROR];
+const COMBOBOX_VARIANT = {
+  DEFAULT: 'variant-default',
+  FOCUS: 'variant-focus-input',
+  FOCUS_ICON: 'variant-focus-icon',
+  ACTIVE: 'variant-active-input',
+  ACTIVE_ICON: 'variant-active-icon',
+  DISABLED: 'variant-disabled',
+  ERROR: 'variant-error'
+};
+const comboBoxVariants = [COMBOBOX_VARIANT.DEFAULT, COMBOBOX_VARIANT.FOCUS, COMBOBOX_VARIANT.FOCUS_ICON, COMBOBOX_VARIANT.ACTIVE, COMBOBOX_VARIANT.ACTIVE_ICON, COMBOBOX_VARIANT.DISABLED, COMBOBOX_VARIANT.ERROR];
+const sizeVariants = {
+  S: 's',
+  M: 'm',
+  L: 'l'
+};
+const position = {
+  LEFT: 'left',
+  RIGHT: 'right',
+  CENTER: 'center'
+};
+const fontColor = {
+  NEUTRAL500: 'neutral500',
+  NEUTRAL700: 'neutral700'
+};
+const orientation = ['horizontal', 'vertical'];
+const orientationVariants = {
+  HORIZONTAL: 'horizontal',
+  VERTICAL: 'vertical'
+};
+
+export { CHECKBOX_VARIANT, COMBOBOX_VARIANT, checkboxVariants, comboBoxVariants, dsBasicSizes, fontColor, iconColors, iconSizes, orientation, orientationVariants, position, sizeVariants, sizes };

package/esm/react-spring/index.js

@@ -0,0 +1 @@
+export * from 'react-spring/web';

package/esm/react-spring/renderprops.js

@@ -0,0 +1 @@
+export * from 'react-spring/renderprops';

package/esm/toolbar/ToolbarProvider.js

@@ -0,0 +1,111 @@
+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 'core-js/modules/web.dom-collections.iterator.js';
+import React, { useRef, useState, useEffect, useMemo } from 'react';
+import DSPopover from '@elliemae/ds-popper';
+import { useOnClickOutside } from '@elliemae/ds-utilities';
+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; }
+const ToolbarContext = /*#__PURE__*/React.createContext();
+const {
+  Provider
+} = ToolbarContext;
+
+const useScrollListener = (callback, dependencies) => {
+  useEffect(() => {
+    window.addEventListener('scroll', callback, true);
+    return () => {
+      window.removeEventListener('scroll', callback, true);
+    };
+  }, [dependencies]);
+};
+
+const noop = () => null;
+
+function ToolbarProvider(_ref) {
+  let {
+    delay = 200,
+    children,
+    onHide = noop,
+    onShow = noop
+  } = _ref;
+  const showTimer = useRef();
+  const hideTimer = useRef();
+  const toolbarRef = useRef();
+  const [tooltipState, setTooltipState] = useState({});
+
+  const show = state => {
+    if (state.reference === tooltipState.reference) clearTimeout(hideTimer.current);
+    showTimer.current = setTimeout(() => setTooltipState(_objectSpread(_objectSpread({}, state), {}, {
+      visible: true
+    })), delay);
+    onShow();
+  };
+
+  const hide = (e, force) => {
+    if (!force) clearTimeout(showTimer.current);
+    hideTimer.current = setTimeout(() => setTooltipState(prevState => _objectSpread(_objectSpread({}, prevState), {}, {
+      visible: false
+    })), 100);
+    onHide(tooltipState, e);
+  };
+
+  useScrollListener(e => hide(e, true), tooltipState.visible);
+  useOnClickOutside(toolbarRef, () => hide());
+
+  const keyDownHandler = e => {
+    if (e.key === 'Escape') {
+      hide(e);
+    }
+  };
+
+  useEffect(() => {
+    window.addEventListener('keydown', keyDownHandler);
+    return () => {
+      window.removeEventListener('keydown', keyDownHandler);
+    };
+  });
+  const value = useMemo(() => ({
+    state: tooltipState,
+    show,
+    hide
+  }), [tooltipState.reference]);
+  return /*#__PURE__*/_jsx(Provider, {
+    value: value
+  }, void 0, children, /*#__PURE__*/jsx(DSPopover, _objectSpread(_objectSpread({
+    boundaries: "scrollParent"
+  }, tooltipState.options || {}), {}, {
+    content: tooltipState.renderer,
+    placement: "left",
+    referenceEl: tooltipState.reference,
+    renderer: _ref2 => {
+      let {
+        as: Component,
+        style,
+        children: Content
+      } = _ref2;
+      return /*#__PURE__*/jsx("div", {
+        ref: toolbarRef,
+        onMouseEnter: e => show(tooltipState),
+        onMouseLeave: hide,
+        children: /*#__PURE__*/_jsx(Component, {
+          style: style
+        }, void 0, Content)
+      });
+    },
+    style: tooltipState.style,
+    visible: tooltipState.visible
+  })));
+}
+
+var ToolbarProvider$1 = /*#__PURE__*/React.memo(ToolbarProvider);
+
+export { ToolbarContext, ToolbarProvider$1 as default };

package/esm/useDataGrid/VolatileRowsListener.js

@@ -0,0 +1,22 @@
+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 { safeCall } from '@elliemae/ds-utilities';
+
+class VolatileRowsListener {
+  constructor() {
+    this.observers = [];
+  }
+
+  observe(listener) {
+    this.observers.push(listener);
+  }
+
+  notify(nextRows) {
+    this.observers.forEach(observer => safeCall(observer, nextRows));
+    this.observers = [];
+  }
+
+}
+
+export { VolatileRowsListener as default };

package/esm/useDataGrid/index.js

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

package/esm/useDataGrid/initColumnDefinition.js

@@ -0,0 +1,134 @@
+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 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.string.replace.js';
+import 'react';
+import { v4 } from 'uuid';
+import { curry, get, cloneDeep, set, isFunction } from '@elliemae/ds-utilities';
+
+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 appendHeaderFormatter = curry((formatter, column) => _objectSpread(_objectSpread({}, column), {}, {
+  header: _objectSpread(_objectSpread({}, column.header), {}, {
+    formatters: [...get(column, 'header.formatters', []), formatter]
+  })
+}));
+const appendCellFormatter = curry(function (formatter, column) {
+  let path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'formatters';
+  const nextColumn = cloneDeep(column);
+  const formatters = get(nextColumn, ['cell', path], []);
+  const scrollingFormatters = get(nextColumn, 'cell.scrollingFormatters', []);
+
+  if (Array.isArray(formatter)) {
+    if (formatter[1]) scrollingFormatters.push(formatter[1]);
+    formatters.push(formatter[0]);
+  } else {
+    formatters.push(formatter);
+    scrollingFormatters.push(formatter);
+  }
+
+  set(nextColumn, ['cell', path], formatters);
+  set(nextColumn, 'cell.scrollingFormatters', scrollingFormatters);
+  return nextColumn;
+});
+const defaultColumnDefinitionOptions = {
+  normalize: false,
+  useTextTruncation: true,
+  isUserColumn: true,
+  visible: true
+};
+const mergeClassNameToColumnHeader = curry((className, column) => {
+  const headerProps = get(column, ['header', 'props'], {});
+  const headerClassName = headerProps.className || '';
+  return _objectSpread(_objectSpread({}, column), {}, {
+    header: _objectSpread(_objectSpread({}, column.header), {}, {
+      props: _objectSpread(_objectSpread({}, headerProps), {}, {
+        className: "".concat(headerClassName, " ").concat(className)
+      })
+    })
+  });
+});
+function initColumnDefinition() {
+  let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  // eslint-disable-next-line complexity
+  return column => {
+    // todo: clean this
+    if (column.type === 'number') {
+      // eslint-disable-next-line no-param-reassign
+      column.cellStyle = {
+        textAlign: 'right'
+      };
+    }
+
+    const {
+      useTextTruncation = true,
+      isUserColumn,
+      visible,
+      normalize
+    } = _objectSpread(_objectSpread({}, defaultColumnDefinitionOptions), options);
+
+    if (normalize) {
+      // eslint-disable-next-line no-param-reassign
+      column.originalProperty = column.property; // eslint-disable-next-line no-param-reassign
+
+      column.property = column.property.replace(/\s+/g, '');
+    } // eslint-disable-next-line no-param-reassign
+
+
+    column.props = _objectSpread(_objectSpread({}, column.props), {}, {
+      style: {}
+    }); // eslint-disable-next-line no-param-reassign
+
+    column.header = _objectSpread(_objectSpread({}, column.header), {}, {
+      label: column.label,
+      formatters: [...get(column, ['header', 'formatters'], [])],
+      props: {
+        style: column.headerStyle || {}
+      }
+    });
+
+    if (useTextTruncation && !(isFunction(column.customHeaderRenderer) || column.header.formatters.length)) {
+      column.header.formatters.push(value => /*#__PURE__*/_jsx("span", {
+        className: "cell-value"
+      }, void 0, value));
+    } // eslint-disable-next-line no-param-reassign
+
+
+    column.cell = _objectSpread(_objectSpread({}, column.cell), {}, {
+      transforms: [],
+      formatters: [...get(column, ['cell', 'formatters'], [])],
+      scrollingFormatters: [...get(column, ['cell', 'formatters'], [])],
+      props: {
+        style: column.cellStyle || {}
+      }
+    });
+
+    if (useTextTruncation && !(isFunction(column.customRenderer) || column.cell.formatters.length)) {
+      column.cell.formatters.push(value => /*#__PURE__*/_jsx("span", {
+        className: "cell-value",
+        style: {
+          justifyContent: column.type === 'number' ? 'flex-end' : 'flex-start'
+        }
+      }, void 0, value));
+    } // eslint-disable-next-line no-param-reassign
+
+
+    column.uuid = column.uuid || v4(); // eslint-disable-next-line no-param-reassign
+
+    column.visible = column.visible === undefined ? visible : column.visible; // eslint-disable-next-line no-param-reassign, max-lines
+
+    column.isUserColumn = column.isUserColumn || isUserColumn; // eslint-disable-next-line no-param-reassign
+
+    column.headerHookEffects = [];
+    return column;
+  };
+}
+
+export { appendCellFormatter, appendHeaderFormatter, initColumnDefinition as default, mergeClassNameToColumnHeader };