@data-driven-forms/react-form-renderer/condition/condition.js

React Form Renderer. Data Driven Forms converts JSON form definitions into fully functional React forms.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.reducer = exports["default"] = void 0;

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));

var _react = require("react");

var _isEqual = _interopRequireDefault(require("lodash/isEqual"));

var _useFormApi = _interopRequireDefault(require("../use-form-api"));

var _parseCondition = _interopRequireDefault(require("../parse-condition"));

var _rendererContext = _interopRequireDefault(require("../renderer-context/renderer-context"));

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) { (0, _defineProperty2["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; }

var setterValueCheck = function setterValueCheck(setterValue) {
  if (setterValue === null || Array.isArray(setterValue)) {
    console.error('Received invalid setterValue. Expected object, received: ', setterValue);
    return false;
  }

  return (0, _typeof2["default"])(setterValue) === 'object';
};

var reducer = function reducer(state, _ref) {
  var type = _ref.type,
      sets = _ref.sets;

  switch (type) {
    case 'formResetted':
      return _objectSpread(_objectSpread({}, state), {}, {
        initial: true
      });

    case 'rememberSets':
      return _objectSpread(_objectSpread({}, state), {}, {
        initial: false,
        sets: sets
      });

    default:
      return state;
  }
};

exports.reducer = reducer;

var Condition = function Condition(_ref2) {
  var condition = _ref2.condition,
      children = _ref2.children,
      field = _ref2.field;
  var formOptions = (0, _useFormApi["default"])();
  var formState = formOptions.getState();

  var _useContext = (0, _react.useContext)(_rendererContext["default"]),
      conditionMapper = _useContext.conditionMapper;

  var _useReducer = (0, _react.useReducer)(reducer, {
    sets: [],
    initial: true
  }),
      _useReducer2 = (0, _slicedToArray2["default"])(_useReducer, 2),
      state = _useReducer2[0],
      dispatch = _useReducer2[1]; // It is required to get the context state values from in order to get the latest state.
  // Using the trigger values can cause issues with the radio field as each input is registered separately to state and does not yield the actual field value.


  var conditionResult = (0, _react.useMemo)(function () {
    return (0, _parseCondition["default"])(condition, formState.values, field, conditionMapper);
  }, [formState.values, condition, field, conditionMapper]);
  var setters = conditionResult.set ? [conditionResult.set] : conditionResult.sets;
  (0, _react.useEffect)(function () {
    if (!formState.dirty) {
      dispatch({
        type: 'formResetted'
      });
    }
  }, [formState.dirty]);
  var setValue = (0, _react.useCallback)(function (setter) {
    Object.entries(setter).forEach(function (_ref3) {
      var _ref4 = (0, _slicedToArray2["default"])(_ref3, 2),
          name = _ref4[0],
          value = _ref4[1];

      formOptions.change(name, value);
    });
  }, []);
  (0, _react.useEffect)(function () {
    if (setters && setters.length > 0 && (state.initial || !(0, _isEqual["default"])(setters, state.sets))) {
      setters.forEach(function (setter, index) {
        if (setter && (state.initial || !(0, _isEqual["default"])(setter, state.sets[index]))) {
          setTimeout(function () {
            /**
             * We have to get the meta in the timetout to wait for state initialization
             */
            var meta = formOptions.getFieldState(field.name);
            var isFormModified = Object.values(formOptions.getState().modified).some(Boolean);
            /**
             * Apply setter only
             *    - field has no initial value
             *    - form is modified
             *    - when meta is false = field was unmounted before timeout, we finish the condition
             */

            if (!meta || isFormModified || typeof meta.initial === 'undefined') {
              formOptions.batch(function () {
                if (typeof setter !== 'function') {
                  setValue(setter);
                } else {
                  var setterValue = setter(formOptions.getState(), formOptions.getFieldState);

                  if (setterValueCheck(setterValue)) {
                    setValue(setterValue);
                  } else {
                    console.error('Received invalid setterValue. Expected object, received: ', setterValue);
                  }
                }
              });
            }
          });
        }
      });
      dispatch({
        type: 'rememberSets',
        sets: setters
      });
    }
  }, [setters, state.initial]);
  return conditionResult.visible ? children : null;
};

var _default = Condition;
exports["default"] = _default;