intelicoreact 0.1.20 → 0.1.23

package/dist/Functions/useFormTools.js

@@ -1,429 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useFormTools;
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = require("react");
-
-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) { (0, _defineProperty2.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 useFormTools(_ref) {
-  var form = _ref.form,
-      setForm = _ref.setForm,
-      FormType = _ref.FormType,
-      FormFields = _ref.FormFields;
-
-  ///////////////////////////////////////////////////////////////
-  //--- OnChange Observer ---//--- START ---//
-  var _useState = (0, _react.useState)({}),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      onChangeObservers = _useState2[0],
-      setOnChangeObservers = _useState2[1];
-
-  var addOnChangeObserver = function addOnChangeObserver(key, cb) {
-    var observerId = null;
-    setOnChangeObservers(function (state) {
-      //Set Default Value
-      if (!state[key]) state[key] = {};
-      observerId = state[key].length;
-      state[key][observerId] = cb;
-      return state;
-    });
-    return observerId;
-  };
-
-  var removeOnChangeObserver = function removeOnChangeObserver(key, id) {
-    setOnChangeObservers(function (state) {
-      //Set Default Value
-      if (!state[key]) return state;
-      state[key] = Object.keys(state).filter(function (cbId) {
-        return cbId !== id;
-      }).map(function (cbId) {
-        return state[key][cbId];
-      });
-      return state;
-    });
-  };
-
-  var onChangeObserver = function onChangeObserver(key, value) {
-    if (!onChangeObservers[key] || (0, _typeof2.default)(onChangeObservers[key]) !== 'object') return;
-    var Observers = onChangeObservers[key];
-    Object.values(Observers).map(function (cb) {
-      cb({
-        value: value,
-        form: form
-      });
-      return null;
-    });
-  };
-
-  var onFieldChange = function onFieldChange(key, value) {
-    var _form$fields$key;
-
-    if (value === (form === null || form === void 0 ? void 0 : (_form$fields$key = form.fields[key]) === null || _form$fields$key === void 0 ? void 0 : _form$fields$key.value)) return false;
-    onChangeObserver(key, value);
-    setForm(function (form) {
-      return _objectSpread(_objectSpread({}, form), {}, {
-        fields: _objectSpread(_objectSpread({}, form.fields), {}, (0, _defineProperty2.default)({}, key, _objectSpread(_objectSpread({}, form.fields[key]), {}, {
-          error: '',
-          value: value
-        })))
-      });
-    });
-  }; //--- OnChange Observer ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- Form Submit Blocker ---//--- START ---//
-
-
-  var _useState3 = (0, _react.useState)([]),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      formSubmitBlockers = _useState4[0],
-      setFormSubmitBlockers = _useState4[1];
-
-  var toggleFormSubmitBlock = function toggleFormSubmitBlock(key, value) {
-    setFormSubmitBlockers(function (state) {
-      return state.includes(key) || !value ? (0, _toConsumableArray2.default)(state.filter(function (k) {
-        return k !== key;
-      })) : [].concat((0, _toConsumableArray2.default)(state), [key]);
-    });
-  };
-
-  var clearFormSubmitBlockers = function clearFormSubmitBlockers() {
-    return setFormSubmitBlockers([]);
-  }; //--- Form Submit Blocker ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- Property Observer Blocker ---//--- START ---//
-  // const [propertyObservers, setPropertyObservers] = useState({});
-  // function addPropertyObserver () {
-  // };
-  //--- Property Observer Blocker ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- Render Fields Controller ---//--- START ---//
-
-
-  var _useState5 = (0, _react.useState)([]),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      renderFormFields = _useState6[0],
-      setRenderFormFields = _useState6[1];
-
-  var addRenderFields = function addRenderFields(fields) {
-    setForm(function (state) {
-      return _objectSpread(_objectSpread({}, state), {}, {
-        fields: _objectSpread(_objectSpread({}, state.fields), fields.reduce(function (result, fieldKey) {
-          result[fieldKey] = FormFields[fieldKey];
-          return result;
-        }, {}))
-      });
-    });
-    setRenderFormFields(function (state) {
-      return [].concat((0, _toConsumableArray2.default)(state), (0, _toConsumableArray2.default)(fields));
-    });
-  };
-
-  var removeRenderFields = function removeRenderFields(fields) {
-    setRenderFormFields(function (state) {
-      return state.filter(function (field) {
-        return !fields.includes(field);
-      });
-    });
-  }; //On Render Fields Change
-
-
-  (0, _react.useEffect)(function () {
-    //Add Form Fields
-    setForm(function (state) {
-      var fields = _objectSpread({}, state.fields);
-
-      renderFormFields.forEach(function (key) {
-        var _FormFields$key2;
-
-        if (!fields[key]) {
-          var _fields$key$className;
-
-          fields[key] = FormFields[key]; // eslint-disable-next-line no-use-before-define
-
-          if (!fields[key].className || ((_fields$key$className = fields[key].className) === null || _fields$key$className === void 0 ? void 0 : _fields$key$className.indexOf(getFieldClassName(key, FormType))) === -1) {
-            var _FormFields$key;
-
-            fields[key].className = "".concat((_FormFields$key = FormFields[key]) === null || _FormFields$key === void 0 ? void 0 : _FormFields$key.className, " ").concat(getFieldClassName(key, FormType));
-          }
-        }
-
-        if ((0, _typeof2.default)((_FormFields$key2 = FormFields[key]) === null || _FormFields$key2 === void 0 ? void 0 : _FormFields$key2.label) === 'object') {
-          fields[key].label = FormFields[key].label[FormType] || FormFields[key].label.default;
-        } // (node, key) => { refs.current[key] = node); }
-
-
-        fields[key].ref = /*#__PURE__*/(0, _react.createRef)();
-      });
-      return _objectSpread(_objectSpread({}, state), {}, {
-        fields: fields
-      });
-    });
-  }, [renderFormFields]); //--- Render Fields Controller ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- HIGHTLIGHT LABELS IF FIELD WITH ERROR ---//--- START ---//
-
-  var hightliteErrorLabels = function hightliteErrorLabels() {
-    var filtered = Object.keys(form.fields).reduce(function (result, field) {
-      var _form$fields$field;
-
-      if ((_form$fields$field = form.fields[field]) !== null && _form$fields$field !== void 0 && _form$fields$field.errorLabelHightlite) {
-        // eslint-disable-next-line no-use-before-define
-        result.push(_objectSpread(_objectSpread({}, form.fields[field]), {}, {
-          className: getFieldClassName(field, FormType)
-        }));
-      }
-
-      return result;
-    }, []);
-    filtered.map(function (field) {
-      var formField = document.querySelector(".".concat(field === null || field === void 0 ? void 0 : field.className));
-      if (!formField) return null;
-      formField.classList.remove('errorLabelHightlite');
-
-      if (field !== null && field !== void 0 && field.error) {
-        formField.classList.add('errorLabelHightlite');
-      }
-
-      return null;
-    });
-  };
-
-  (0, _react.useEffect)(function () {
-    hightliteErrorLabels();
-  }, [form]); //--- HIGHTLIGHT LABELS IF FIELD WITH ERROR ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- Fields Focus Controller ---//--- START ---//
-
-  var _useState7 = (0, _react.useState)(false),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      isInitFocused = _useState8[0],
-      setIsInitFocused = _useState8[1];
-
-  var initFocused = function initFocused() {
-    return setIsInitFocused(true);
-  };
-
-  var resetIsInitFocused = function resetIsInitFocused() {
-    return setIsInitFocused(false);
-  };
-
-  var setFieldFocus = function setFieldFocus(_ref2) {
-    var key = _ref2.key,
-        _ref2$cb = _ref2.cb,
-        cb = _ref2$cb === void 0 ? function () {} : _ref2$cb,
-        argForm = _ref2.form;
-    if (!key) return null;
-    if (!argForm) argForm = form;
-    var formField = argForm.fields[key];
-
-    if (!formField || !formField.ref) {
-      return false;
-    }
-
-    setTimeout(function () {
-      formField.ref.current.querySelector((formField === null || formField === void 0 ? void 0 : formField.focusSelector) || 'input').focus();
-      cb();
-    }, 1);
-  };
-
-  var setFirstFieldFocus = function setFirstFieldFocus() {
-    var _renderFormFields = (0, _slicedToArray2.default)(renderFormFields, 1),
-        firstField = _renderFormFields[0];
-
-    setFieldFocus({
-      key: firstField,
-      cb: initFocused,
-      form: form
-    });
-  };
-
-  var _useState9 = (0, _react.useState)([]),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      focusOnRenderFields = _useState10[0],
-      setFocusOnRenderFields = _useState10[1];
-
-  var addFocusFieldOnRender = function addFocusFieldOnRender(key) {
-    setFocusOnRenderFields(function (state) {
-      return [].concat((0, _toConsumableArray2.default)(state), [key]);
-    });
-  };
-
-  var removeFocusFieldOnRender = function removeFocusFieldOnRender(key) {
-    setFocusOnRenderFields(function (state) {
-      return state.filter(function (field) {
-        return field !== key;
-      });
-    });
-  };
-
-  (0, _react.useEffect)(function () {
-    Object.keys(form === null || form === void 0 ? void 0 : form.fields).map(function (field) {
-      if (focusOnRenderFields.includes(field)) {
-        setFieldFocus({
-          key: field,
-          form: form,
-          cb: function cb() {
-            return removeFocusFieldOnRender(field);
-          }
-        });
-      }
-
-      return null;
-    });
-  }, [form.fields]); //--- Fields Focus Controller ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-  //--- OnFieldRendered Observer ---//--- START ---//
-
-  var _useState11 = (0, _react.useState)({}),
-      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-      onFieldRenderedObservers = _useState12[0],
-      setOnFieldRenderedObservers = _useState12[1];
-
-  var _useState13 = (0, _react.useState)([]),
-      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
-      workedOutFieldRenderedObservers = _useState14[0],
-      setWorkedOutFieldRenderedObservers = _useState14[1];
-
-  var addWorkedOutField = function addWorkedOutField(key) {
-    return setWorkedOutFieldRenderedObservers(function (state) {
-      return [].concat((0, _toConsumableArray2.default)(state), [key]);
-    });
-  };
-
-  var addOnFieldRenderedObserver = function addOnFieldRenderedObserver(key, cb) {
-    var isOnceCallable = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var observerId = null;
-    setOnFieldRenderedObservers(function (state) {
-      //Set Default Value
-      if (!state[key]) state[key] = {};
-      observerId = Object.keys(state[key]).length || 0;
-      state[key][observerId] = {
-        f: cb,
-        isOnceCallable: isOnceCallable
-      };
-      return state;
-    });
-    return observerId;
-  };
-
-  var removeOnFieldRenderedObserver = function removeOnFieldRenderedObserver(key, id) {
-    setOnFieldRenderedObservers(function (state) {
-      //Set Default Value
-      if (!state[key]) return state;
-      state[key] = Object.keys(state).filter(function (cbId) {
-        return cbId !== id;
-      }).map(function (cbId) {
-        return state[key][cbId];
-      });
-      return state;
-    });
-  };
-
-  var onFieldRenderedObserver = function onFieldRenderedObserver(key) {
-    if (!onFieldRenderedObservers[key] || (0, _typeof2.default)(onFieldRenderedObservers[key]) !== 'object') return;
-    var Observers = onFieldRenderedObservers[key];
-    Object.values(Observers).map(function (_ref3) {
-      var f = _ref3.f,
-          isOnceCallable = _ref3.isOnceCallable;
-      f();
-      if (isOnceCallable) addWorkedOutField(key);
-      return null;
-    });
-  };
-
-  (0, _react.useEffect)(function () {
-    Object.keys(form.fields).map(function (key) {
-      //OnFieldRendered
-      if (!workedOutFieldRenderedObservers.includes(key)) onFieldRenderedObserver(key);
-      return null;
-    });
-  }, [form.fields]); //--- OnFieldRendered Observer ---//--- END ---//
-  ///////////////////////////////////////////////////////////////
-  ///////////////////////////////////////////////////////////////
-
-  var getFieldClassName = function getFieldClassName(key, type) {
-    return "form-".concat(type, "_field-").concat(key);
-  }; //Detect What Changed || TRY TO DO
-  // const compare = async (prev, current) => {
-  //   if (!prev) return current;
-  //   return new Promise((resolve) => {
-  //     Object.keys(current).reduce((result, key, i, arr) => {
-  //       //If PROPERTY is NOT EXISTS BEFORE
-  //       if ([null, undefined].includes(prev[key])) {
-  //         result[key] = current[key];
-  //       }
-  //       //If PROPERTY is AN OBJECT
-  //       else if (typeof current[key] === 'object') {
-  //         //If PROPERTY is EXISTS BEFORE
-  //         const innerCompare = compare(prev[key], current[key]);
-  //         // //If SOMETHING CHANGED
-  //         if (innerCompare?.length) result[key] = innerCompare;
-  //       }
-  //       //If PROPERTY is AN SIMPLE VALUE and PROPERTY CHANGED
-  //       else if (prev[key] !== current[key]) {
-  //         result[key] = current[key];
-  //       }
-  //       if (i === arr.length-1) {
-  //         resolve(result);
-  //       }
-  //       return result;
-  //     }, {});
-  //   });
-  // };
-
-
-  return {
-    //OnChangeObserver
-    addOnChangeObserver: addOnChangeObserver,
-    removeOnChangeObserver: removeOnChangeObserver,
-    onChangeObservers: onChangeObservers,
-    //OnChangeHandler
-    onFieldChange: onFieldChange,
-    //Form Submit Blocker
-    toggleFormSubmitBlock: toggleFormSubmitBlock,
-    clearFormSubmitBlockers: clearFormSubmitBlockers,
-    isFormSubmitBlocked: Boolean(formSubmitBlockers.length),
-    //Property Observers
-    // addPropertyObserver,
-    //Render Fields
-    renderFormFields: renderFormFields,
-    setRenderFormFields: setRenderFormFields,
-    addRenderFields: addRenderFields,
-    removeRenderFields: removeRenderFields,
-    getFieldClassName: getFieldClassName,
-    //Field Focus Controller
-    isInitFocused: isInitFocused,
-    initFocused: initFocused,
-    resetIsInitFocused: resetIsInitFocused,
-    setFieldFocus: setFieldFocus,
-    setFirstFieldFocus: setFirstFieldFocus,
-    addFocusFieldOnRender: addFocusFieldOnRender,
-    removeFocusFieldOnRender: removeFocusFieldOnRender,
-    //Field Render Controller
-    addOnFieldRenderedObserver: addOnFieldRenderedObserver,
-    removeOnFieldRenderedObserver: removeOnFieldRenderedObserver,
-    onFieldRenderedObservers: onFieldRenderedObservers
-  };
-}