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

package/cjs/components/Nestable/Nestable.js

@@ -1,86 +1,105 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var Nestable_exports = {};
-__export(Nestable_exports, {
-  default: () => Nestable_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_classnames = __toESM(require("classnames"));
-var import_utils = require("@elliemae/ds-shared/utils");
-var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_actions = require("./actions");
-var import_NestableItem = __toESM(require("./NestableItem"));
-const shallowCompare = (instance, nextProps, nextState) => !(0, import_ds_utilities.isEqualWith)(instance.props, nextProps) || !(0, import_ds_utilities.isEqualWith)(instance.state, nextState);
-class Nestable extends import_react.Component {
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.find.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.find.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var cn = require('classnames');
+var utils = require('@elliemae/ds-shared/utils');
+var dsUtilities = require('@elliemae/ds-utilities');
+var tryIncreaseDepth = require('./actions/tryIncreaseDepth.js');
+var tryDecreaseDepth = require('./actions/tryDecreaseDepth.js');
+var moveItem = require('./actions/moveItem.js');
+var paths = require('./actions/paths.js');
+var events = require('./actions/events.js');
+var getItemOptions = require('./actions/getItemOptions.js');
+var NestableItem = require('./NestableItem.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+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__default["default"](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 shallowCompare = (instance, nextProps, nextState) => !dsUtilities.isEqualWith(instance.props, nextProps) || !dsUtilities.isEqualWith(instance.state, nextState);
+
+class Nestable extends React.Component {
   constructor(props) {
     super(props);
+
     this.onDragStart = (e, item) => {
-      import_actions.onDragStart.call(this, e, item);
+      events.onDragStart.call(this, e, item);
     };
-    this.onDragEnd = (e, isCancel) => import_actions.onDragEnd.call(this, e, isCancel);
-    this.onMouseMove = (e) => import_actions.onMouseMove.call(this, e);
-    this.onMouseEnter = (e, item) => import_actions.onMouseEnter.call(this, e, item);
-    this.onToggleCollapse = (item, isGetter) => import_actions.onToggleCollapse.call(this, item, isGetter);
-    this.onKeyDown = (e) => import_actions.onKeyDown.call(this, e);
+
+    this.onDragEnd = (e, isCancel) => events.onDragEnd.call(this, e, isCancel);
+
+    this.onMouseMove = e => events.onMouseMove.call(this, e);
+
+    this.onMouseEnter = (e, item) => events.onMouseEnter.call(this, e, item);
+
+    this.onToggleCollapse = (item, isGetter) => events.onToggleCollapse.call(this, item, isGetter);
+
+    this.onKeyDown = e => events.onKeyDown.call(this, e);
+
     this.getDefaultItems = () => {
-      const { items } = this.state;
+      const {
+        items
+      } = this.state;
       return items;
     };
-    this.getItemDepth = (item) => import_actions.getItemDepth.call(this, item);
+
+    this.getItemDepth = item => paths.getItemDepth.call(this, item);
+
     this.startTrackMouse = () => {
-      document.addEventListener("mousemove", this.onMouseMove);
-      document.addEventListener("mouseup", this.onDragEnd);
-      document.addEventListener("keydown", this.onKeyDown);
+      document.addEventListener('mousemove', this.onMouseMove);
+      document.addEventListener('mouseup', this.onDragEnd);
+      document.addEventListener('keydown', this.onKeyDown);
     };
+
     this.stopTrackMouse = () => {
-      document.removeEventListener("mousemove", this.onMouseMove);
-      document.removeEventListener("mouseup", this.onDragEnd);
-      document.removeEventListener("keydown", this.onKeyDown);
+      document.removeEventListener('mousemove', this.onMouseMove);
+      document.removeEventListener('mouseup', this.onDragEnd);
+      document.removeEventListener('keydown', this.onKeyDown);
       this.elCopyStyles = null;
     };
-    this.isCollapsed = (item) => {
-      const { collapsed } = this.props;
-      const { collapsedGroups } = this.state;
+
+    this.isCollapsed = item => {
+      const {
+        collapsed
+      } = this.props;
+      const {
+        collapsedGroups
+      } = this.state;
       return !!(collapsedGroups.indexOf(item.id) > -1 ^ collapsed);
     };
-    this.checkFilterChildren = (items) => items.find((current) => {
+
+    this.checkFilterChildren = items => items.find(current => {
       const {
-        element: { type },
+        element: {
+          type
+        },
         children
       } = current;
-      if (type === "filter" && children.length > 0)
-        return true;
+      if (type === 'filter' && children.length > 0) return true;
       return this.checkFilterChildren(children);
     });
+
     this.dragRevert = () => {
-      const { itemsOld } = this.state;
+      const {
+        itemsOld
+      } = this.state;
       this.setState({
         items: itemsOld,
         itemsOld: null,
@@ -88,6 +107,7 @@ class Nestable extends import_react.Component {
         isDirty: false
       });
     };
+
     this.state = {
       items: [],
       itemsOld: null,
@@ -100,101 +120,163 @@ class Nestable extends import_react.Component {
     this.el = null;
     this.elCopyStyles = null;
     this.mouse = {
-      last: { x: 0 },
-      shift: { x: 0 }
+      last: {
+        x: 0
+      },
+      shift: {
+        x: 0
+      }
     };
   }
+
   componentDidMount() {
-    const { childrenProp } = this.props;
-    let { items } = this.props;
-    items = (0, import_utils.listWithChildren)(items, childrenProp);
-    this.setState({ items });
+    const {
+      childrenProp
+    } = this.props;
+    let {
+      items
+    } = this.props; // make sure every item has property 'children'
+
+    items = utils.listWithChildren(items, childrenProp);
+    this.setState({
+      items
+    });
   }
+
   componentWillUnmount() {
     this.stopTrackMouse();
   }
+
   static getDerivedStateFromProps(props, state) {
-    const { items: itemsNew, childrenProp } = props;
-    const { stopTrackingMouse, oldProps } = state;
-    if (shallowCompare({ props: oldProps, state: {} }, props, {})) {
+    const {
+      items: itemsNew,
+      childrenProp
+    } = props;
+    const {
+      stopTrackingMouse,
+      oldProps
+    } = state;
+
+    if (shallowCompare({
+      props: oldProps,
+      state: {}
+    }, props, {})) {
       stopTrackingMouse();
       const extra = {};
+
       if (oldProps.collapsed !== props.collapsed) {
         extra.collapsedGroups = [];
       }
-      return {
-        items: (0, import_utils.listWithChildren)(itemsNew, childrenProp),
+
+      return _objectSpread({
+        items: utils.listWithChildren(itemsNew, childrenProp),
         dragItem: null,
         isDirty: false,
-        oldProps: props,
-        ...extra
-      };
+        oldProps: props
+      }, extra);
     }
+
     return null;
   }
-  getPathById(id, items = this.getDefaultItems()) {
-    return import_actions.getPathById.call(this, id, items);
+
+  getPathById(id) {
+    let items = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.getDefaultItems();
+    return paths.getPathById.call(this, id, items);
   }
-  getItemByPath(path, items = this.getDefaultItems()) {
-    return import_actions.getItemByPath.call(this, path, items);
+
+  getItemByPath(path) {
+    let items = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.getDefaultItems();
+    return paths.getItemByPath.call(this, path, items);
   }
-  getSplicePath(path, options = {}) {
-    return import_actions.getSplicePath.call(this, path, options);
+
+  getSplicePath(path) {
+    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return paths.getSplicePath.call(this, path, options);
   }
+
   getRealNextPath(prevPath, nextPath) {
-    return import_actions.getRealNextPath.call(this, prevPath, nextPath);
+    return paths.getRealNextPath.call(this, prevPath, nextPath);
   }
+
   getItemOptions() {
-    return import_actions.getItemOptions.call(this);
+    return getItemOptions.getItemOptions.call(this);
   }
+
   dragApply() {
-    const { onChange } = this.props;
-    const { items, isDirty, dragItem } = this.state;
+    const {
+      onChange
+    } = this.props;
+    const {
+      items,
+      isDirty,
+      dragItem
+    } = this.state;
     this.setState({
       itemsOld: null,
       dragItem: null,
       isDirty: false
     });
-    if (onChange && isDirty)
-      onChange(items, dragItem);
+    if (onChange && isDirty) onChange(items, dragItem);
   }
+
   tryIncreaseDepth(dragItem) {
-    import_actions.tryIncreaseDepth.call(this, dragItem);
+    tryIncreaseDepth.tryIncreaseDepth.call(this, dragItem);
   }
+
   tryDecreaseDepth(dragItem) {
-    import_actions.tryDecreaseDepth.call(this, dragItem);
+    tryDecreaseDepth.tryDecreaseDepth.call(this, dragItem);
   }
-  moveItem({ dragItem, pathFrom, pathTo }, extraProps = {}) {
-    import_actions.moveItem.call(this, { dragItem, pathFrom, pathTo }, extraProps);
+
+  moveItem(_ref) {
+    let {
+      dragItem,
+      pathFrom,
+      pathTo
+    } = _ref;
+    let extraProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    moveItem.moveItem.call(this, {
+      dragItem,
+      pathFrom,
+      pathTo
+    }, extraProps);
   }
+
   renderDragLayer() {
-    const { group } = this.props;
-    const { dragItem } = this.state;
-    const el = document.querySelector(`.nestable-${group} .nestable-item-${dragItem.id}`);
+    const {
+      group
+    } = this.props;
+    const {
+      dragItem
+    } = this.state;
+    const el = document.querySelector(".nestable-".concat(group, " .nestable-item-").concat(dragItem.id));
     let listStyles = {};
+
     if (el) {
       listStyles.width = el.clientWidth;
     }
+
     if (this.elCopyStyles) {
-      listStyles = {
-        ...listStyles,
-        ...this.elCopyStyles
-      };
+      listStyles = _objectSpread(_objectSpread({}, listStyles), this.elCopyStyles);
     }
+
     const options = this.getItemOptions();
-    return /* @__PURE__ */ import_react.default.createElement("div", {
+    return /*#__PURE__*/_jsx__default["default"]("div", {
       className: "nestable-drag-layer"
-    }, /* @__PURE__ */ import_react.default.createElement("ol", {
+    }, void 0, /*#__PURE__*/_jsx__default["default"]("ol", {
       className: "nestable-list",
       style: listStyles
-    }, /* @__PURE__ */ import_react.default.createElement(import_NestableItem.default, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](NestableItem, {
       isCopy: true,
       item: dragItem,
-      options
+      options: options
     })));
   }
+
   render() {
-    const { items, dragItem } = this.state;
+    const {
+      items,
+      dragItem
+    } = this.state;
     const {
       group,
       isAndItem,
@@ -205,50 +287,34 @@ class Nestable extends import_react.Component {
     } = this.props;
     const options = this.getItemOptions();
     const childLength = items.length;
-    let childClass = "single";
-    if (childLength === 0)
-      childClass = "empty";
-    else if (childLength > 1)
-      childClass = "multiple";
-    return /* @__PURE__ */ import_react.default.createElement("div", {
-      className: (0, import_classnames.default)("nestable", `nestable-${group}`, {
-        "is-drag-active": dragItem
+    let childClass = 'single';
+    if (childLength === 0) childClass = 'empty';else if (childLength > 1) childClass = 'multiple';
+    return /*#__PURE__*/_jsx__default["default"]("div", {
+      className: cn__default["default"]('nestable', "nestable-".concat(group), {
+        'is-drag-active': dragItem
       })
-    }, /* @__PURE__ */ import_react.default.createElement("ol", {
-      className: `nestable-list nestable-group nestable-child-count-${childClass}`
-    }, items.map((item, i) => /* @__PURE__ */ import_react.default.createElement(import_NestableItem.default, {
-      key: item.id,
+    }, void 0, /*#__PURE__*/_jsx__default["default"]("ol", {
+      className: "nestable-list nestable-group nestable-child-count-".concat(childClass)
+    }, void 0, items.map((item, i) => /*#__PURE__*/_jsx__default["default"](NestableItem, {
       index: i,
-      isAndItem,
-      isDraggableItem,
-      isOrItem,
-      item,
-      options,
-      setDraggableItems,
-      singleRow
-    }))), dragItem && this.renderDragLayer());
+      isAndItem: isAndItem,
+      isDraggableItem: isDraggableItem,
+      isOrItem: isOrItem,
+      item: item,
+      options: options,
+      setDraggableItems: setDraggableItems,
+      singleRow: singleRow
+    }, item.id))), dragItem && this.renderDragLayer());
   }
+
 }
+
 Nestable.defaultProps = {
   items: [],
   collapsed: false,
   group: Math.random().toString(36).slice(2),
-  childrenProp: "children",
-  onChange: () => {
-  }
-};
-Nestable.propTypes = {
-  childrenProp: import_prop_types.default.string,
-  group: import_prop_types.default.string,
-  items: import_prop_types.default.arrayOf(import_prop_types.default.shape({})),
-  collapsed: import_prop_types.default.bool,
-  onChange: import_prop_types.default.func,
-  isAndItem: import_prop_types.default.bool,
-  isOrItem: import_prop_types.default.bool,
-  isDraggableItem: import_prop_types.default.bool,
-  setDraggableItems: import_prop_types.default.func,
-  singleRow: import_prop_types.default.bool
+  childrenProp: 'children',
+  onChange: () => {}
 };
-var Nestable_default = Nestable;
-module.exports = __toCommonJS(Nestable_exports);
-//# sourceMappingURL=Nestable.js.map
+
+module.exports = Nestable;