@elliemae/ds-query-builder 1.60.0 → 2.0.0-alpha.12

package/esm/components/QueryBuilderImpl.js

@@ -1,12 +1,12 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
+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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _classCallCheck from '@babel/runtime/helpers/esm/classCallCheck';
-import _createClass from '@babel/runtime/helpers/esm/createClass';
-import _inherits from '@babel/runtime/helpers/esm/inherits';
-import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
-import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
-import React, { Component } from 'react';
+import { Component } from 'react';
 import Nestable from './Nestable/Nestable.js';
 import { QueryBuilderContext } from './QueryBuilderContext/QueryBuilderContext.js';
 import { QB_ADD_FILTER_METHOD_TYPES, QB_GROUP_FILTER_METHOD_TYPES, QB_DRAG_TYPES } from './helpers/types.js';
@@ -14,300 +14,258 @@ import QueryBuilderStore from './helpers/store.js';
 import AndOrController from './AndOrController/AndOrController.js';
 import QueryBuilderItem from './QueryBuilderItem/QueryBuilderItem.js';
 import DisplayOutput from './DisplayOutput/DisplayOutput.js';
-import '@babel/runtime/helpers/esm/assertThisInitialized';
-import 'prop-types';
-import 'classnames';
-import '@elliemae/ds-shared/utils';
-import '@elliemae/ds-utilities';
-import './Nestable/actions/tryIncreaseDepth.js';
-import './Nestable/actions/tryDecreaseDepth.js';
-import './Nestable/actions/moveItem.js';
-import 'react-addons-update';
-import './Nestable/actions/paths.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import './Nestable/actions/events.js';
-import './Nestable/actions/getItemOptions.js';
-import './Nestable/NestableItem.js';
-import './helpers/actions.js';
-import './format/format.js';
-import './format/sqlFormat.js';
-import './format/xmlFormat.js';
-import './format/sqlSafeFormat.js';
-import '@elliemae/ds-classnames';
-import '@elliemae/ds-tooltip';
-import '@elliemae/ds-popper';
-import '@elliemae/ds-form';
-import '@elliemae/ds-button';
-import '@elliemae/ds-icons';
-import '@elliemae/ds-icon';
-import './helpers/constants.js';
-import './ToolBarAnimation/ToolBarAnimation.js';
-import '@elliemae/ds-shared/Animations/GrowRight';
-import './DragContainerController/DragContainerController.js';
-import './QueryBuilderRow/QueryBuilderRow.js';
-import './helpers/dependencies.js';
-import 'lodash';
-import '@elliemae/ds-utilities/operators';
-import './ConditionController/ConditionController.js';
-import './DragControllerRow/DragControllerRow.js';
-import '@babel/runtime/helpers/esm/typeof';
-import '@elliemae/ds-grid';
-import '@elliemae/ds-accordion';
+import { jsxs } from 'react/jsx-runtime';
 
-var _excluded = ["format"];
+const _excluded = ["format"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+class QueryBuilderImpl extends Component {
+  constructor(props) {
+    super(props);
+    this.isDraggableItem = true;
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var QueryBuilderImpl = /*#__PURE__*/function (_Component) {
-  _inherits(QueryBuilderImpl, _Component);
-
-  var _super = _createSuper(QueryBuilderImpl);
-
-  function QueryBuilderImpl(props) {
-    var _this;
-
-    _classCallCheck(this, QueryBuilderImpl);
-
-    _this = _super.call(this, props);
-    _this.isDraggableItem = true;
-
-    _this.onOrderDragAndDrop = function (items, item) {
-      var newFilters = _this.store.onOrderDragAndDrop(items, item);
-
-      _this.sendCall('reOrderOnDragAndDrop', {
-        items: items
+    this.onOrderDragAndDrop = (items, item) => {
+      const newFilters = this.store.onOrderDragAndDrop(items, item);
+      this.sendCall('reOrderOnDragAndDrop', {
+        items
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.onAddFilterToGroup = function (idGroup) {
-      var newFilters = _this.store.addFilter(idGroup);
-
-      _this.sendCall('onAddFilterToGroup', {
-        idGroup: idGroup
+    this.onAddFilterToGroup = idGroup => {
+      const newFilters = this.store.addFilter(idGroup);
+      this.sendCall('onAddFilterToGroup', {
+        idGroup
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.onAddFilter = function (idGroup, idFilter) {
-      var addFilterMethod = _this.props.addFilterMethod;
-      var newFilters = addFilterMethod === QB_ADD_FILTER_METHOD_TYPES.IN_PLACE ? _this.store.addFilterNextToFilterId(idGroup, idFilter) : _this.onAddFilterToGroup(idGroup);
-
-      _this.sendCall('onAddFilter', {
-        idGroup: idGroup,
-        idFilter: idFilter
+    this.onAddFilter = (idGroup, idFilter) => {
+      const {
+        addFilterMethod
+      } = this.props;
+      const newFilters = addFilterMethod === QB_ADD_FILTER_METHOD_TYPES.IN_PLACE ? this.store.addFilterNextToFilterId(idGroup, idFilter) : this.onAddFilterToGroup(idGroup);
+      this.sendCall('onAddFilter', {
+        idGroup,
+        idFilter
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.onAddRuleContainer = function (idGroup, idFilter) {
-      var groupFilterMethod = _this.props.groupFilterMethod;
-      var newFilters = groupFilterMethod === QB_GROUP_FILTER_METHOD_TYPES.IN_PLACE ? _this.store.addRuleContainerInPlace(idGroup, idFilter) : _this.store.addRuleContainer(idGroup, idFilter);
-
-      _this.sendCall('onAddRuleContainer', {
-        idGroup: idGroup,
-        idFilter: idFilter
+    this.onAddRuleContainer = (idGroup, idFilter) => {
+      const {
+        groupFilterMethod
+      } = this.props;
+      const newFilters = groupFilterMethod === QB_GROUP_FILTER_METHOD_TYPES.IN_PLACE ? this.store.addRuleContainerInPlace(idGroup, idFilter) : this.store.addRuleContainer(idGroup, idFilter);
+      this.sendCall('onAddRuleContainer', {
+        idGroup,
+        idFilter
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.onRemoveFilter = function (idFilter) {
-      var newFilters = _this.store.onRemoveFilter(idFilter);
-
-      _this.sendCall('onRemoveFilter', {
-        idFilter: idFilter
+    this.onRemoveFilter = idFilter => {
+      const newFilters = this.store.onRemoveFilter(idFilter);
+      this.sendCall('onRemoveFilter', {
+        idFilter
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleFieldChange = function (data) {
-      var fieldsSharedActions = _this.props.fieldsSharedActions;
-
-      var newFilters = _this.store.changeFilter(_objectSpread(_objectSpread({}, data), {}, {
-        fieldsSharedActions: fieldsSharedActions
+    this.handleFieldChange = data => {
+      const {
+        fieldsSharedActions
+      } = this.props;
+      const newFilters = this.store.changeFilter(_objectSpread(_objectSpread({}, data), {}, {
+        fieldsSharedActions
       }));
-
-      _this.sendCall('handleFieldChange', {
-        data: data
+      this.sendCall('handleFieldChange', {
+        data
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleRuleContainerOperator = function (idGroup, value) {
-      var newFilters = _this.store.changeGroupOperator(idGroup, value);
-
-      _this.sendCall('handleRuleContainerOperator', {
-        idGroup: idGroup,
-        value: value
+    this.handleRuleContainerOperator = (idGroup, value) => {
+      const newFilters = this.store.changeGroupOperator(idGroup, value);
+      this.sendCall('handleRuleContainerOperator', {
+        idGroup,
+        value
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleRuleContainerUnGroup = function (idGroup) {
-      var newFilters = _this.store.unGroup(idGroup);
-
-      _this.sendCall('handleRuleContainerUnGroup', {
-        idGroup: idGroup
+    this.handleRuleContainerUnGroup = idGroup => {
+      const newFilters = this.store.unGroup(idGroup);
+      this.sendCall('handleRuleContainerUnGroup', {
+        idGroup
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleDropFilter = function (filter, dragTo) {
-      var oldPosition = filter.position,
-          idGroup = filter.idGroup,
-          idFilter = filter.idFilter;
-      var newPosition = dragTo.position,
-          targetIdGroup = dragTo.targetIdGroup;
-
-      var newFilters = _this.store.reOrderFilter(idFilter, idGroup, oldPosition, newPosition, targetIdGroup);
-
-      _this.sendCall('handleDropFilter', {
-        filter: filter,
-        dragTo: dragTo
+    this.handleDropFilter = (filter, dragTo) => {
+      const {
+        position: oldPosition,
+        idGroup,
+        idFilter
+      } = filter;
+      const {
+        position: newPosition,
+        targetIdGroup
+      } = dragTo;
+      const newFilters = this.store.reOrderFilter(idFilter, idGroup, oldPosition, newPosition, targetIdGroup);
+      this.sendCall('handleDropFilter', {
+        filter,
+        dragTo
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleDropGroup = function (group, dragTo) {
-      var oldPosition = group.position,
-          idFilter = group.idFilter,
-          idGroup = group.idGroup;
-      var newPosition = dragTo.position,
-          targetIdGroup = dragTo.targetIdGroup;
-
-      var newFilters = _this.store.reOrderFilter(idFilter, idGroup, oldPosition, newPosition, targetIdGroup);
-
-      _this.sendCall('handleDropGroup', {
-        group: group,
-        dragTo: dragTo
+    this.handleDropGroup = (group, dragTo) => {
+      const {
+        position: oldPosition,
+        idFilter,
+        idGroup
+      } = group;
+      const {
+        position: newPosition,
+        targetIdGroup
+      } = dragTo;
+      const newFilters = this.store.reOrderFilter(idFilter, idGroup, oldPosition, newPosition, targetIdGroup);
+      this.sendCall('handleDropGroup', {
+        group,
+        dragTo
       });
-
-      _this.sendChange(newFilters);
+      this.sendChange(newFilters);
     };
 
-    _this.handleDrop = function (dragElement, dragTo) {
-      var type = dragElement.type;
-      if (type === QB_DRAG_TYPES.FILTER) return _this.handleDropFilter(dragElement, dragTo);
-      return _this.handleDropGroup(dragElement, dragTo);
+    this.handleDrop = (dragElement, dragTo) => {
+      const {
+        type
+      } = dragElement;
+      if (type === QB_DRAG_TYPES.FILTER) return this.handleDropFilter(dragElement, dragTo);
+      return this.handleDropGroup(dragElement, dragTo);
     };
 
-    _this.sendChange = function (_ref) {
-      var format = _ref.format,
+    this.sendChange = _ref => {
+      let {
+        format
+      } = _ref,
           newFilters = _objectWithoutProperties(_ref, _excluded);
 
-      _this.setState(_objectSpread({
-        format: format
+      this.setState(_objectSpread({
+        format
       }, newFilters));
-
-      var onChange = _this.props.onChange;
+      const {
+        onChange
+      } = this.props;
       onChange(format, newFilters);
     };
 
-    _this.sendCall = function (action, data) {
-      var callback = _this.props[action];
+    this.sendCall = (action, data) => {
+      const {
+        [action]: callback
+      } = this.props;
       if (callback) callback(data);
     };
 
-    _this.setDraggableItems = function (drag) {
-      _this.isDraggableItem = true;
+    this.setDraggableItems = drag => {
+      this.isDraggableItem = true;
 
       try {
-        var ua = window.navigator.userAgent;
-        var msie = ua.indexOf('MSIE '); // eslint-disable-next-line no-useless-escape
+        const ua = window.navigator.userAgent;
+        const msie = ua.indexOf('MSIE '); // eslint-disable-next-line no-useless-escape
 
         if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) {
-          var isDraggableItem = _this.state.isDraggableItem;
+          const {
+            isDraggableItem
+          } = this.state;
 
           if (drag !== isDraggableItem) {
-            _this.setState({
+            this.setState({
               isDraggableItem: drag
             });
           }
 
-          _this.isDraggableItem = drag;
+          this.isDraggableItem = drag;
         }
       } catch (error) {
-        _this.isDraggableItem = true;
+        this.isDraggableItem = true;
       }
     };
 
-    _this.store = new QueryBuilderStore(props.init, props.format);
-    _this.state = _this.store.getInitialState();
-    return _this;
+    this.store = new QueryBuilderStore(props.init, props.format);
+    this.state = this.store.getInitialState();
   }
 
-  _createClass(QueryBuilderImpl, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate() {
-      if (QueryBuilderImpl.recalculateStore) {
-        this.store = QueryBuilderImpl.recalculateStore;
-        QueryBuilderImpl.recalculateStore = null;
-      }
+  static getDerivedStateFromProps(props, state) {
+    if (props.init && props.init.step !== undefined && Number.isInteger(props.init.step) && props.init.step !== state.step) {
+      const store = new QueryBuilderStore(props.init, props.format);
+      QueryBuilderImpl.recalculateStore = store;
+      return store.getInitialState();
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
 
-      var _this$state = this.state,
-          mapGroups = _this$state.mapGroups,
-          main = _this$state.main,
-          mapFilters = _this$state.mapFilters,
-          step = _this$state.step,
-          items = _this$state.items,
-          format = _this$state.format;
-      var _this$props = this.props,
-          containerProps = _this$props.containerProps,
-          ruleContainerClassName = _this$props.ruleContainerClassName,
-          fields = _this$props.fields,
-          displayFixedOutput = _this$props.displayFixedOutput,
-          displayOutput = _this$props.displayOutput,
-          displayOutputLabel = _this$props.displayOutputLabel,
-          singleRow = _this$props.singleRow,
-          toolTipZIndex = _this$props.toolTipZIndex; // const { children } = items[0]
+    return null;
+  }
 
-      var condition = mapGroups[main].condition;
-      return /*#__PURE__*/React.createElement(QueryBuilderContext.Provider, {
-        value: {
-          toolTipZIndex: toolTipZIndex,
-          fields: fields,
-          handleDrop: this.handleDrop,
-          handleFieldChange: this.handleFieldChange,
-          handleRuleContainerOperator: this.handleRuleContainerOperator,
-          handleRuleContainerUnGroup: this.handleRuleContainerUnGroup,
-          mapFilters: mapFilters,
-          mapGroups: mapGroups,
-          onAddFilter: this.onAddFilter,
-          onAddFilterToGroup: this.onAddFilterToGroup,
-          onAddRuleContainer: this.onAddRuleContainer,
-          onRemoveFilter: this.onRemoveFilter,
-          ruleContainerClassName: ruleContainerClassName,
-          showDragController: false,
-          format: format,
-          step: step,
-          items: items,
-          isDraggableItem: this.isDraggableItem,
-          setDraggableItems: this.setDraggableItems,
-          singleRow: singleRow
-        }
-      }, /*#__PURE__*/React.createElement("div", _extends({}, containerProps, {
-        className: "nested-main-group ".concat(condition !== true ? 'is-or-group' : 'is-and-groupL', " ").concat(singleRow ? 'query-main-single-row' : 'query-main-multiple-row')
-      }), /*#__PURE__*/React.createElement(Nestable, {
+  componentDidUpdate() {
+    if (QueryBuilderImpl.recalculateStore) {
+      this.store = QueryBuilderImpl.recalculateStore;
+      QueryBuilderImpl.recalculateStore = null;
+    }
+  }
+
+  render() {
+    const {
+      mapGroups,
+      main,
+      mapFilters,
+      step,
+      items,
+      format
+    } = this.state;
+    const {
+      containerProps,
+      ruleContainerClassName,
+      fields,
+      displayFixedOutput,
+      displayOutput,
+      displayOutputLabel,
+      singleRow,
+      toolTipZIndex
+    } = this.props; // const { children } = items[0]
+
+    const {
+      condition
+    } = mapGroups[main];
+    return /*#__PURE__*/_jsx(QueryBuilderContext.Provider, {
+      value: {
+        toolTipZIndex,
+        fields,
+        handleDrop: this.handleDrop,
+        handleFieldChange: this.handleFieldChange,
+        handleRuleContainerOperator: this.handleRuleContainerOperator,
+        handleRuleContainerUnGroup: this.handleRuleContainerUnGroup,
+        mapFilters,
+        mapGroups,
+        onAddFilter: this.onAddFilter,
+        onAddFilterToGroup: this.onAddFilterToGroup,
+        onAddRuleContainer: this.onAddRuleContainer,
+        onRemoveFilter: this.onRemoveFilter,
+        ruleContainerClassName,
+        showDragController: false,
+        format,
+        step,
+        items,
+        isDraggableItem: this.isDraggableItem,
+        setDraggableItems: this.setDraggableItems,
+        singleRow
+      }
+    }, void 0, /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
+      className: "nested-main-group ".concat(condition !== true ? 'is-or-group' : 'is-and-groupL', " ").concat(singleRow ? 'query-main-single-row' : 'query-main-multiple-row'),
+      children: [/*#__PURE__*/_jsx(Nestable, {
         isAndItem: condition === true,
         isDraggableItem: this.isDraggableItem,
         isOrItem: condition !== true,
@@ -317,46 +275,27 @@ var QueryBuilderImpl = /*#__PURE__*/function (_Component) {
         setDraggableItems: this.setDraggableItems,
         step: step,
         singleRow: singleRow
-      }), !singleRow && /*#__PURE__*/React.createElement("div", {
+      }), !singleRow && /*#__PURE__*/_jsx("div", {
         className: "rule-container-options"
-      }, /*#__PURE__*/React.createElement(AndOrController, {
+      }, void 0, /*#__PURE__*/_jsx(AndOrController, {
         allowUnGroup: false,
         condition: condition,
-        handleRuleContainerOperator: function handleRuleContainerOperator(value) {
-          return _this2.handleRuleContainerOperator(main, value);
-        },
-        handleRuleContainerUnGroup: function handleRuleContainerUnGroup() {
-          return _this2.handleRuleContainerUnGroup(main);
-        },
+        handleRuleContainerOperator: value => this.handleRuleContainerOperator(main, value),
+        handleRuleContainerUnGroup: () => this.handleRuleContainerUnGroup(main),
         isMain: true,
-        onAddFilter: function onAddFilter() {
-          return _this2.onAddFilterToGroup(main);
-        },
+        onAddFilter: () => this.onAddFilterToGroup(main),
         showDragController: false,
         step: step,
         toolTipZIndex: toolTipZIndex
-      }))), (displayOutput || displayFixedOutput) && /*#__PURE__*/React.createElement(DisplayOutput, {
-        displayFixedOutput: displayFixedOutput,
-        hideLabel: displayOutputLabel.hide,
-        showLabel: displayOutputLabel.show,
-        show: displayOutputLabel.open
-      }));
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(props, state) {
-      if (props.init && props.init.step !== undefined && Number.isInteger(props.init.step) && props.init.step !== state.step) {
-        var store = new QueryBuilderStore(props.init, props.format);
-        QueryBuilderImpl.recalculateStore = store;
-        return store.getInitialState();
-      }
-
-      return null;
-    }
-  }]);
+      }))]
+    })), (displayOutput || displayFixedOutput) && /*#__PURE__*/_jsx(DisplayOutput, {
+      displayFixedOutput: displayFixedOutput,
+      hideLabel: displayOutputLabel.hide,
+      showLabel: displayOutputLabel.show,
+      show: displayOutputLabel.open
+    }));
+  }
 
-  return QueryBuilderImpl;
-}(Component);
+}
 
 export { QueryBuilderImpl as default };
-//# sourceMappingURL=QueryBuilderImpl.js.map