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

package/cjs/components/QueryBuilderImpl.js

@@ -1,376 +1,309 @@
 'use strict';
 
-var _extends = require('@babel/runtime/helpers/extends');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.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 _jsx = require('@babel/runtime/helpers/jsx');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _classCallCheck = require('@babel/runtime/helpers/classCallCheck');
-var _createClass = require('@babel/runtime/helpers/createClass');
-var _inherits = require('@babel/runtime/helpers/inherits');
-var _possibleConstructorReturn = require('@babel/runtime/helpers/possibleConstructorReturn');
-var _getPrototypeOf = require('@babel/runtime/helpers/getPrototypeOf');
 var React = require('react');
-var components_Nestable_Nestable = require('./Nestable/Nestable.js');
-var components_QueryBuilderContext_QueryBuilderContext = require('./QueryBuilderContext/QueryBuilderContext.js');
-var components_helpers_types = require('./helpers/types.js');
-var components_helpers_store = require('./helpers/store.js');
-var components_AndOrController_AndOrController = require('./AndOrController/AndOrController.js');
-var components_QueryBuilderItem_QueryBuilderItem = require('./QueryBuilderItem/QueryBuilderItem.js');
-var components_DisplayOutput_DisplayOutput = require('./DisplayOutput/DisplayOutput.js');
-require('@babel/runtime/helpers/assertThisInitialized');
-require('prop-types');
-require('classnames');
-require('@elliemae/ds-shared/utils');
-require('@elliemae/ds-utilities');
-require('./Nestable/actions/tryIncreaseDepth.js');
-require('./Nestable/actions/tryDecreaseDepth.js');
-require('./Nestable/actions/moveItem.js');
-require('react-addons-update');
-require('./Nestable/actions/paths.js');
-require('@babel/runtime/helpers/toConsumableArray');
-require('./Nestable/actions/events.js');
-require('./Nestable/actions/getItemOptions.js');
-require('./Nestable/NestableItem.js');
-require('./helpers/actions.js');
-require('./format/format.js');
-require('./format/sqlFormat.js');
-require('./format/xmlFormat.js');
-require('./format/sqlSafeFormat.js');
-require('@elliemae/ds-classnames');
-require('@elliemae/ds-tooltip');
-require('@elliemae/ds-popper');
-require('@elliemae/ds-form');
-require('@elliemae/ds-button');
-require('@elliemae/ds-icons');
-require('@elliemae/ds-icon');
-require('./helpers/constants.js');
-require('./ToolBarAnimation/ToolBarAnimation.js');
-require('@elliemae/ds-shared/Animations/GrowRight');
-require('./DragContainerController/DragContainerController.js');
-require('./QueryBuilderRow/QueryBuilderRow.js');
-require('./helpers/dependencies.js');
-require('lodash');
-require('@elliemae/ds-utilities/operators');
-require('./ConditionController/ConditionController.js');
-require('./DragControllerRow/DragControllerRow.js');
-require('@babel/runtime/helpers/typeof');
-require('@elliemae/ds-grid');
-require('@elliemae/ds-accordion');
+var Nestable = require('./Nestable/Nestable.js');
+var QueryBuilderContext = require('./QueryBuilderContext/QueryBuilderContext.js');
+var types = require('./helpers/types.js');
+var store = require('./helpers/store.js');
+var AndOrController = require('./AndOrController/AndOrController.js');
+var QueryBuilderItem = require('./QueryBuilderItem/QueryBuilderItem.js');
+var DisplayOutput = require('./DisplayOutput/DisplayOutput.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _classCallCheck__default = /*#__PURE__*/_interopDefaultLegacy(_classCallCheck);
-var _createClass__default = /*#__PURE__*/_interopDefaultLegacy(_createClass);
-var _inherits__default = /*#__PURE__*/_interopDefaultLegacy(_inherits);
-var _possibleConstructorReturn__default = /*#__PURE__*/_interopDefaultLegacy(_possibleConstructorReturn);
-var _getPrototypeOf__default = /*#__PURE__*/_interopDefaultLegacy(_getPrototypeOf);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-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__default['default'](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 _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__default["default"](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__default['default'](Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf__default['default'](this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn__default['default'](this, result); }; }
+class QueryBuilderImpl extends React.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__default['default'](QueryBuilderImpl, _Component);
-
-  var _super = _createSuper(QueryBuilderImpl);
-
-  function QueryBuilderImpl(props) {
-    var _this;
-
-    _classCallCheck__default['default'](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 === components_helpers_types.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 === types.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 === components_helpers_types.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 === types.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 === components_helpers_types.QB_DRAG_TYPES.FILTER) return _this.handleDropFilter(dragElement, dragTo);
-      return _this.handleDropGroup(dragElement, dragTo);
+    this.handleDrop = (dragElement, dragTo) => {
+      const {
+        type
+      } = dragElement;
+      if (type === types.QB_DRAG_TYPES.FILTER) return this.handleDropFilter(dragElement, dragTo);
+      return this.handleDropGroup(dragElement, dragTo);
     };
 
-    _this.sendChange = function (_ref) {
-      var format = _ref.format,
-          newFilters = _objectWithoutProperties__default['default'](_ref, _excluded);
+    this.sendChange = _ref => {
+      let {
+        format
+      } = _ref,
+          newFilters = _objectWithoutProperties__default["default"](_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 components_helpers_store(props.init, props.format);
-    _this.state = _this.store.getInitialState();
-    return _this;
+    this.store = new store(props.init, props.format);
+    this.state = this.store.getInitialState();
   }
 
-  _createClass__default['default'](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$1 = new store(props.init, props.format);
+      QueryBuilderImpl.recalculateStore = store$1;
+      return store$1.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]
-
-      var condition = mapGroups[main].condition;
-      return /*#__PURE__*/React__default['default'].createElement(components_QueryBuilderContext_QueryBuilderContext.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__default['default'].createElement("div", _extends__default['default']({}, 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__default['default'].createElement(components_Nestable_Nestable, {
+
+    return null;
+  }
+
+  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__default["default"](QueryBuilderContext.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__*/jsxRuntime.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__default["default"](Nestable, {
         isAndItem: condition === true,
         isDraggableItem: this.isDraggableItem,
         isOrItem: condition !== true,
         items: items,
         onChange: this.onOrderDragAndDrop,
-        renderItem: components_QueryBuilderItem_QueryBuilderItem,
+        renderItem: QueryBuilderItem,
         setDraggableItems: this.setDraggableItems,
         step: step,
         singleRow: singleRow
-      }), !singleRow && /*#__PURE__*/React__default['default'].createElement("div", {
+      }), !singleRow && /*#__PURE__*/_jsx__default["default"]("div", {
         className: "rule-container-options"
-      }, /*#__PURE__*/React__default['default'].createElement(components_AndOrController_AndOrController, {
+      }, void 0, /*#__PURE__*/_jsx__default["default"](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__default['default'].createElement(components_DisplayOutput_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 components_helpers_store(props.init, props.format);
-        QueryBuilderImpl.recalculateStore = store;
-        return store.getInitialState();
-      }
-
-      return null;
-    }
-  }]);
+      }))]
+    })), (displayOutput || displayFixedOutput) && /*#__PURE__*/_jsx__default["default"](DisplayOutput, {
+      displayFixedOutput: displayFixedOutput,
+      hideLabel: displayOutputLabel.hide,
+      showLabel: displayOutputLabel.show,
+      show: displayOutputLabel.open
+    }));
+  }
 
-  return QueryBuilderImpl;
-}(React.Component);
+}
 
 module.exports = QueryBuilderImpl;
-//# sourceMappingURL=QueryBuilderImpl.js.map