gform-react 2.5.4 → 2.6.0

package/dist/esm/index.development.js

@@ -1,761 +1,4 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import React, { useSyncExternalStore, useRef, useCallback, useEffect, createContext, useContext, forwardRef, useMemo, memo } from 'react';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-
-const isObject = o => o && typeof o === 'object' && !Array.isArray(o);
-const defaultFieldProps = {
-  text: {
-    value: ''
-  },
-  checkbox: {
-    value: false
-  },
-  number: {
-    value: 0
-  }
-};
-const typeValueDict = {
-  checkbox: 'checked',
-  number: 'valueAsNumber'
-};
-const generateId = () => (+new Date()).toString(36) + (1 - Math.random()).toString(36).substring(2, 16);
-const _buildFormInitialValues = (rows = []) => {
-  const fields = {};
-  if (!Array.isArray(rows)) rows = [rows];
-  for (const row of rows) {
-    const inputConfigs = _findInputs(row);
-    inputConfigs.forEach(config => {
-      if (fields[config.formKey]) {
-        console.warn(`DEV ONLY - [Duplicate Keys] - field with key '${config.formKey}' has already been defined.`);
-      }
-      const {
-        required = false,
-        max,
-        maxLength,
-        min,
-        minLength,
-        step,
-        pattern,
-        type = 'text',
-        defaultValue,
-        value,
-        checked,
-        defaultChecked,
-        formKey,
-        debounce,
-        validatorKey
-      } = config;
-      const defaultProps = defaultFieldProps[type] || defaultFieldProps.text;
-      const inputValue = value || defaultValue || checked || defaultChecked || defaultProps.value;
-      fields[config.formKey] = {
-        formKey,
-        type,
-        required,
-        max,
-        maxLength,
-        min,
-        minLength,
-        step,
-        pattern,
-        value: inputValue,
-        validatorKey,
-        debounce,
-        dirty: false,
-        touched: false,
-        gid: generateId()
-      };
-      Object.keys(fields[config.formKey]).forEach(key => {
-        if (typeof fields[config.formKey][key] === 'undefined') delete fields[config.formKey][key];
-      });
-    });
-  }
-  return {
-    fields: fields,
-    key: generateId()
-  };
-};
-const _findInputs = (root, total = []) => {
-  var _root$props, _root$props2;
-  if (!root) return total;
-  if (Array.isArray(root)) {
-    root.forEach(element => _findInputs(element, total));
-    return total;
-  }
-  if ((_root$props = root.props) !== null && _root$props !== void 0 && _root$props.formKey) {
-    total.push(root.props);
-    return total;
-  }
-  return _findInputs((_root$props2 = root.props) === null || _root$props2 === void 0 ? void 0 : _root$props2.children, total);
-};
-const _findValidityKey = (validity, exclude = []) => {
-  for (const key in validity) {
-    if (exclude.includes(key)) continue;
-    if (key !== 'valid' && validity[key]) {
-      return key;
-    }
-  }
-};
-const _checkTypeMismatch = input => {
-  var _input$value;
-  const value = (_input$value = input.value) === null || _input$value === void 0 ? void 0 : _input$value.toString().trim();
-  if (!value) return false;
-  switch (input.type) {
-    case 'email':
-      return !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
-    case 'url':
-      try {
-        new URL(value);
-        return false;
-      } catch (_unused) {
-        return true;
-      }
-    case 'tel':
-      return !/^\+?[0-9\s\-().]{7,}$/.test(value);
-    default:
-      return false;
-  }
-};
-const hasSubmitter = form => {
-  if (!form) return false;
-  for (const element of form) {
-    if (element.type === 'submit') return true;
-  }
-  return false;
-};
-const _checkIfFormIsValid = fields => {
-  for (const f in fields) {
-    if (fields[f].error) {
-      return false;
-    }
-  }
-  return true;
-};
-const _toRawData = (fields, options = {}) => {
-  const data = {};
-  const {
-    include,
-    exclude,
-    transform
-  } = options;
-  if (include) {
-    include.forEach(key => {
-      var _fields$key;
-      return data[key] = (_fields$key = fields[key]) === null || _fields$key === void 0 ? void 0 : _fields$key.value;
-    });
-  } else for (const f in fields) {
-    data[f] = fields[f].value;
-  }
-  exclude === null || exclude === void 0 || exclude.forEach(key => delete data[key]);
-  if (transform) {
-    for (const key in transform) {
-      var _fields$key2;
-      const set = transform[key];
-      data[key] = set(((_fields$key2 = fields[key]) === null || _fields$key2 === void 0 ? void 0 : _fields$key2.value) || fields[key]);
-    }
-  }
-  return data;
-};
-const _toFormData = (form, options) => {
-  if (!form) return new FormData();
-  return new FormData(form);
-};
-function _toURLSearchParams(options) {
-  let data;
-  if (options) {
-    const {
-      exclude,
-      include,
-      transform
-    } = options;
-    if (include) {
-      data = {};
-      include.forEach(key => {
-        var _this$key;
-        return data[key] = (_this$key = this[key]) === null || _this$key === void 0 ? void 0 : _this$key.value;
-      });
-    } else {
-      data = this.toRawData();
-      exclude === null || exclude === void 0 || exclude.forEach(key => delete data[key]);
-    }
-    if (transform) {
-      for (const key in transform) {
-        var _this$key2;
-        const set = transform[key];
-        data[key] = set((_this$key2 = this[key]) === null || _this$key2 === void 0 ? void 0 : _this$key2.value);
-      }
-    }
-  } else data = this.toRawData();
-  return new URLSearchParams(data);
-}
-function __debounce(timeout, id) {
-  return new Promise(resolve => {
-    var _this$id;
-    if ((_this$id = this[id]) !== null && _this$id !== void 0 && _this$id.timerId) clearTimeout(this[id].timerId);
-    const timerId = setTimeout(() => resolve(), timeout);
-    if (this[id]) {
-      this[id].timerId = timerId;
-    } else this[id] = {
-      timerId
-    };
-  });
-}
-const _debounce = __debounce.bind({});
-const _extractValue = (e, unknown) => {
-  if (e !== null && e !== void 0 && e.target) {
-    if (Object.hasOwn(typeValueDict, e.target.type)) return e.target[typeValueDict[e.target.type]];
-    return e.target.value;
-  }
-  return (e === null || e === void 0 ? void 0 : e.value) || (isObject(unknown) ? unknown.value : unknown);
-};
-const _checkResult = (handlerResult, value) => typeof handlerResult === 'boolean' ? handlerResult : typeof value === 'string' ? typeof handlerResult === 'string' ? !new RegExp(handlerResult).test(value) : !handlerResult.test(value) : false;
-const _merge = (target = {}, ...nodes) => {
-  if (!nodes.length) return target;
-  const next = nodes.shift();
-  if (isObject(next)) {
-    for (const key in next) {
-      target[key] = target[key] ? _objectSpread(_objectSpread({}, target[key]), next[key]) : next[key];
-    }
-  }
-  return _merge(target, ...nodes);
-};
-
-let handlersMap;
-let validityMap;
-{
-  handlersMap = {
-    minLength: 'withMinLengthMessage',
-    maxLength: 'withMaxLengthMessage',
-    required: 'withRequiredMessage',
-    pattern: 'withPatternMismatchMessage',
-    min: 'withRangeUnderflowMessage',
-    max: 'withRangeOverflowMessage',
-    step: 'withStepMismatchMessage',
-    type: 'withTypeMismatchMessage'
-  };
-  validityMap = {
-    tooShort: 'minLength',
-    valueMissing: 'required',
-    tooLong: 'maxLength',
-    patternMismatch: 'pattern',
-    rangeOverflow: 'max',
-    rangeUnderflow: 'min',
-    stepMismatch: 'step',
-    typeMismatch: 'type'
-  };
-}
-class GValidator {
-  get handlers() {
-    return this._handlers;
-  }
-  get constraintHandlers() {
-    return this._constraintHandlers;
-  }
-  get asyncHandlers() {
-    return this._asyncHandlers;
-  }
-  constructor(baseValidator) {
-    _defineProperty(this, "_handlers", void 0);
-    _defineProperty(this, "_constraintHandlers", void 0);
-    _defineProperty(this, "_asyncHandlers", void 0);
-    _defineProperty(this, "track", void 0);
-    const baseHandlers = (baseValidator === null || baseValidator === void 0 ? void 0 : baseValidator.handlers) || [];
-    const baseConstraintHandlers = (baseValidator === null || baseValidator === void 0 ? void 0 : baseValidator.constraintHandlers) || [];
-    const baseHandlersAsync = (baseValidator === null || baseValidator === void 0 ? void 0 : baseValidator.asyncHandlers) || [];
-    this._handlers = [].concat(baseHandlers);
-    this._constraintHandlers = [].concat(baseConstraintHandlers);
-    this._asyncHandlers = [].concat(baseHandlersAsync);
-    {
-      this.track = [];
-      if (baseValidator !== null && baseValidator !== void 0 && baseValidator.track) {
-        this.track = this.track.concat(baseValidator.track);
-      }
-    }
-  }
-  hasConstraint(constraint) {
-    var _this$track;
-    return ((_this$track = this.track) === null || _this$track === void 0 ? void 0 : _this$track.includes(constraint)) || false;
-  }
-  withRequiredMessage(message) {
-    return this.__addConstraintValidationHandler('valueMissing', message);
-  }
-  withMaxLengthMessage(message) {
-    return this.__addConstraintValidationHandler('tooLong', message);
-  }
-  withMinLengthMessage(message) {
-    return this.__addConstraintValidationHandler('tooShort', message);
-  }
-  withPatternMismatchMessage(message) {
-    return this.__addConstraintValidationHandler('patternMismatch', message);
-  }
-  withBadInputMessage(message) {
-    return this.__addConstraintValidationHandler('badInput', message);
-  }
-  withRangeUnderflowMessage(message) {
-    return this.__addConstraintValidationHandler('rangeUnderflow', message);
-  }
-  withRangeOverflowMessage(message) {
-    return this.__addConstraintValidationHandler('rangeOverflow', message);
-  }
-  withTypeMismatchMessage(message) {
-    return this.__addConstraintValidationHandler('typeMismatch', message);
-  }
-  withStepMismatchMessage(message) {
-    return this.__addConstraintValidationHandler('stepMismatch', message);
-  }
-  withCustomValidation(handler) {
-    this._handlers.push(handler);
-    return this;
-  }
-  withCustomValidationAsync(handler) {
-    this._asyncHandlers.push(handler);
-    return this;
-  }
-  __addConstraintValidationHandler(validityKey, message) {
-    if (this.track) {
-      if (this.track.includes(validityKey)) {
-        console.warn(`DEV ONLY - [Duplicate Handlers] - handler for '${validityKey}' has already been defined`);
-      }
-      this.track.push(validityKey);
-    }
-    this._constraintHandlers.push((input, key) => {
-      {
-        if (validityKey && validityMap[validityKey] && typeof input[validityMap[validityKey]] === 'undefined') {
-          console.warn(`DEV ONLY - [Missing Prop] - the input '${input.formKey}' has registered validator for the violation '${validityKey}' but the input hasn't described the constraint '${validityMap[validityKey]}'.\nadd '${validityMap[validityKey]}' to the input props.\nexample:\n<GInput formKey='${input.formKey}' ${validityMap[validityKey]}={...} />\n\nor either remove '.${handlersMap[validityMap[validityKey]]}(...)' validation`);
-        }
-      }
-      if (key === validityKey) {
-        input.errorText = typeof message === 'string' ? message : message(input);
-        return true;
-      }
-      return false;
-    });
-    return this;
-  }
-}
-
-const useFormHandlers = (getState, setState, validators = {}, optimized = false) => {
-  const _viHandler = (input, e) => {
-    if (!input) return;
-    const element = e && e.target;
-    const hasInitialValue = !input.dirty && input.value && !input.touched;
-    if (!element && !hasInitialValue) return;
-    if (typeof document !== 'undefined' && (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement || element instanceof HTMLSelectElement)) {
-      if (!input.checkValidity) input.checkValidity = () => element.checkValidity();
-      if (hasInitialValue) {
-        _checkInputManually(input);
-        _dispatchChanges(input, input.formKey);
-        return;
-      }
-      element.setCustomValidity('');
-      const exclude = input.type && (input.pattern || hasCustomValidation(input)) ? ['typeMismatch'] : [];
-      const validityKey = _findValidityKey(element.validity, exclude);
-      _validateInput(input, validityKey, v => element.setCustomValidity(v));
-      if (!validityKey && input.error) {
-        element.setCustomValidity(input.errorText || 'error');
-      }
-      _dispatchChanges(input, input.formKey);
-    } else {
-      input.checkValidity = () => _checkInputManually(input);
-      input.checkValidity();
-      _dispatchChanges(input, input.formKey);
-    }
-  };
-  const _checkInputManually = input => {
-    const exclude = input.type && (input.pattern || hasCustomValidation(input)) ? ['typeMismatch'] : [];
-    let validityKey = _findValidityKey({
-      valueMissing: input.required && !input.value || false,
-      typeMismatch: _checkTypeMismatch(input),
-      tooShort: input.minLength && input.value.toString().length < input.minLength || false,
-      tooLong: input.maxLength && input.value.toString().length > input.maxLength || false,
-      patternMismatch: input.pattern && _checkResult(input.pattern, input.value) || false,
-      rangeUnderflow: input.min && Number(input.value) < Number(input.min) || false,
-      rangeOverflow: input.max && Number(input.value) > Number(input.max) || false
-    }, exclude);
-    if (!validityKey && input.error) {
-      validityKey = 'customError';
-    }
-    _validateInput(input, validityKey);
-    return !input.error;
-  };
-  const _updateInputHandler = (input, e, unknown) => {
-    input.value = _extractValue(e, unknown);
-    _viHandler(input, e);
-  };
-  const _validateInput = (input, validityKey, setValidity) => {
-    const inputValidator = validators[input.validatorKey || input.formKey] || validators['*'];
-    {
-      if (validityKey && !(inputValidator !== null && inputValidator !== void 0 && inputValidator.hasConstraint(validityKey))) {
-        if (validityKey === 'typeMismatch') console.warn(`DEV ONLY - [Missing Validator] - the input '${input.formKey}' has described the constraint '${validityMap[validityKey]}' however, a correspond validator / custom validation / pattern validator are missing.\nadd '${handlersMap[validityMap[validityKey]]}' or 'withCustomValidation' or '${handlersMap[validityMap.patternMismatch]}' to the input validator.\nexample:\nconst validators: GValidators = {\n\temail: new GValidator().withPatternMismatchMessage('pattern mismatch'),\n\t...\n}\n\nor either remove the constraint '${validityMap[validityKey]}' from the input props`);else console.warn(`DEV ONLY - [Missing Validator] - the input '${input.formKey}' has described the constraint '${validityMap[validityKey]}' however, a correspond validator is missing.\nadd '${handlersMap[validityMap[validityKey]]}' to the input validator.\nexample:\nconst validators: GValidators = {\n\temail: new GValidator().withPatternMismatchMessage('pattern mismatch'),\n\t...\n}\n\nor either remove the constraint '${validityMap[validityKey]}' from the input props`);
-      }
-    }
-    if (inputValidator) {
-      __validateInput(input, inputValidator, validityKey, setValidity);
-    }
-    input.touched = true;
-  };
-  const _dispatchChanges = (changes, key) => setState(prev => {
-    if (key) {
-      return _objectSpread(_objectSpread({}, prev), {}, {
-        fields: _objectSpread(_objectSpread({}, prev.fields), {}, {
-          [key]: _objectSpread(_objectSpread({}, prev.fields[key]), changes)
-        })
-      });
-    }
-    return _objectSpread(_objectSpread({}, prev), changes);
-  });
-  const __validateInput = (input, inputValidator, validityKey, setValidity) => {
-    const fields = getState().fields;
-    for (const index in inputValidator.constraintHandlers) {
-      const result = inputValidator.constraintHandlers[index](input, validityKey);
-      input.error = _checkResult(result, input.value);
-      if (input.error) return;
-    }
-    for (const index in inputValidator.handlers) {
-      const result = inputValidator.handlers[index](input, fields);
-      input.error = _checkResult(result, input.value);
-      if (input.error) return;
-    }
-    input.errorText = '';
-    if (inputValidator.asyncHandlers.length) {
-      input.error = true;
-      _debounce(input.debounce || 300, `${input.gid}-async`).then(() => {
-        const validateAsync = async () => {
-          for (const index in inputValidator.asyncHandlers) {
-            const result = await inputValidator.asyncHandlers[index](input, fields);
-            input.error = _checkResult(result, input.value);
-            if (input.error) break;
-          }
-          if (!input.error) input.errorText = '';
-          _dispatchChanges({
-            error: input.error,
-            errorText: input.errorText
-          }, input.formKey);
-          if (setValidity) {
-            setValidity(input.errorText);
-          }
-        };
-        validateAsync();
-      });
-    }
-  };
-  const hasCustomValidation = input => {
-    const validator = validators[input.validatorKey || input.formKey] || validators['*'];
-    return validator && (validator.asyncHandlers.length > 0 || validator.handlers.length > 0);
-  };
-  return {
-    _updateInputHandler,
-    _viHandler,
-    _dispatchChanges,
-    optimized,
-    _createInputChecker: _checkInputManually
-  };
-};
-
-const GFormContext = createContext({});
-const GFormContextProvider = ({
-  children,
-  initialState,
-  validators,
-  optimized
-}) => {
-  const stateRef = useRef(initialState);
-  const listeners = useRef(new Set());
-  const setState = useCallback(updater => {
-    stateRef.current = typeof updater === 'function' ? updater(stateRef.current) : updater;
-    listeners.current.forEach(l => l());
-  }, []);
-  const handlers = useFormHandlers(() => stateRef.current, setState, validators, optimized);
-  const getState = useCallback(() => stateRef.current, []);
-  const subscribe = useCallback(listener => {
-    listeners.current.add(listener);
-    return () => listeners.current.delete(listener);
-  }, []);
-  useEffect(() => {
-    for (const fieldKey in initialState.fields) {
-      initialState.fields[fieldKey].dispatchChanges = changes => handlers._dispatchChanges(changes, fieldKey);
-    }
-  }, []);
-  const store = useRef({
-    getState,
-    setState,
-    subscribe,
-    handlers
-  });
-  return React.createElement(GFormContext.Provider, {
-    value: store.current
-  }, children);
-};
-const useFormStore = () => {
-  const store = useContext(GFormContext);
-  if (!store) throw new Error('useGFormStore must be used within `GForm` component');
-  return store;
-};
-const useFormSelector = selector => {
-  const store = useFormStore();
-  return useSyncExternalStore(store.subscribe, () => selector(store.getState()), () => selector(store.getState()));
-};
-function createSelector(selectors, combiner) {
-  let lastArgs = [];
-  let lastResult;
-  return state => {
-    const args = selectors.map(fn => fn(state));
-    if (lastArgs.length === args.length && args.every((val, i) => val === lastArgs[i])) {
-      return lastResult;
-    }
-    lastArgs = args;
-    lastResult = combiner(...args);
-    return lastResult;
-  };
-}
-
-const _excluded$1 = ["stateRef", "onSubmit", "onChange", "onPaste", "onKeyDown", "onKeyUp", "children", "onInit"],
-  _excluded2 = ["children", "validators", "optimized"];
-const FormRenderer = forwardRef((_ref, ref) => {
-  let {
-      stateRef,
-      onSubmit,
-      onChange,
-      onPaste,
-      onKeyDown,
-      onKeyUp,
-      children,
-      onInit
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded$1);
-  const formRef = useRef(null);
-  const {
-    getState,
-    handlers
-  } = useFormStore();
-  const fields = useFormSelector(state => state.fields);
-  const refHandler = useCallback(element => {
-    if (ref) {
-      if (typeof ref === 'function') {
-        ref(element);
-      } else {
-        ref.current = element;
-      }
-    }
-    formRef.current = element;
-  }, [ref]);
-  const getFormState = useCallback(() => {
-    const isFormValid = _checkIfFormIsValid(fields);
-    const formState = _objectSpread(_objectSpread({}, fields), {}, {
-      isValid: isFormValid,
-      isInvalid: !isFormValid,
-      toRawData: options => _toRawData(fields, options),
-      toFormData: () => _toFormData(formRef.current),
-      toURLSearchParams: _toURLSearchParams,
-      checkValidity: function () {
-        this.isValid = formRef.current && formRef.current.checkValidity() || false;
-        this.isInvalid = !this.isValid;
-        return this.isValid;
-      },
-      dispatchChanges: changes => handlers._dispatchChanges({
-        fields: _merge({}, fields, changes)
-      })
-    });
-    if (stateRef) stateRef.current = formState;
-    return formState;
-  }, [fields]);
-  const formComponent = useMemo(() => {
-    const state = getFormState();
-    const formChildren = typeof children === 'function' ? children(state) : children;
-    const _onSubmit = e => {
-      const state = getFormState();
-      if (state.isValid && onSubmit) {
-        onSubmit(state, e);
-      }
-    };
-    let _onPaste, _onChange, _onKeyDown, _onKeyUp;
-    if (onPaste) {
-      _onPaste = e => onPaste(state, e);
-    }
-    if (onKeyDown) {
-      _onKeyDown = e => onKeyDown(state, e);
-    }
-    if (onKeyUp) {
-      _onKeyUp = e => onKeyUp(state, e);
-    }
-    if (handlers.optimized) {
-      if (onChange) {
-        _onChange = (e, unknown) => {
-          handlers._updateInputHandler(state[e.target.name], e, unknown);
-          onChange(state, e);
-        };
-      } else {
-        _onChange = (e, unknown) => {
-          handlers._updateInputHandler(state[e.target.name], e, unknown);
-        };
-      }
-      return React.createElement("form", _extends({}, rest, {
-        ref: refHandler,
-        onPaste: _onPaste,
-        onKeyDown: _onKeyDown,
-        onKeyUp: _onKeyUp,
-        onBlur: e => handlers._viHandler(state[e.target.name], e),
-        onInvalid: e => {
-          e.preventDefault();
-          handlers._viHandler(state[e.target.name], e);
-        },
-        onChange: _onChange,
-        onSubmit: _onSubmit
-      }), formChildren);
-    }
-    if (onChange) {
-      _onChange = e => onChange(state, e);
-    }
-    return React.createElement("form", _extends({}, rest, {
-      ref: refHandler,
-      onSubmit: _onSubmit,
-      onChange: _onChange,
-      onPaste: _onPaste,
-      onKeyDown: _onKeyDown,
-      onKeyUp: _onKeyUp
-    }), formChildren);
-  }, [children, getFormState]);
-  useEffect(() => {
-    const state = getFormState();
-    if (!hasSubmitter(formRef.current)) {
-      console.warn(`DEV ONLY - [No Submit Button] - you have created a form without a button type=submit, this will prevent the onSubmit event from being fired.\nif you have a button with onClick event that handle the submission of the form then ignore this warning\nbut don't forget to manually invoke the checkValidity() function to check if the form is valid before perfoming any action, for example:\nif (formState.checkValidity()) { \n\t//do somthing\n}\n`);
-    }
-    if (onInit) {
-      const changes = onInit(state);
-      if (changes) {
-        const _handler = _c => handlers._dispatchChanges({
-          fields: _merge({}, state, _c)
-        });
-        if (changes instanceof Promise) {
-          changes.then(_handler);
-        } else _handler(changes);
-      }
-    }
-    const fields = getState().fields;
-    for (const fieldKey in fields) {
-      const field = fields[fieldKey];
-      if (!field.value) continue;
-      handlers._viHandler(field);
-    }
-  }, [getFormState]);
-  return formComponent;
-});
-const GForm = forwardRef((_ref2, ref) => {
-  let {
-      children,
-      validators,
-      optimized
-    } = _ref2,
-    props = _objectWithoutProperties(_ref2, _excluded2);
-  const initialState = useMemo(() => {
-    return _buildFormInitialValues(typeof children === 'function' ? children({}) : children);
-  }, [children]);
-  return React.createElement(GFormContextProvider, {
-    key: initialState.key,
-    initialState: initialState,
-    validators: validators,
-    optimized: optimized
-  }, React.createElement(FormRenderer, _extends({
-    ref: ref
-  }, props), children));
-});
-
-const selectFields = [state => state.fields];
-const makeSelectFields = (keys = []) => createSelector(selectFields, fields => {
-  const selected = keys.map(key => fields[key]).filter(Boolean);
-  return selected.length ? selected : null;
-});
-
-const _excluded = ["formKey", "element", "title", "type", "fetch", "fetchDeps", "optimized", "debounce", "defaultChecked", "defaultValue", "checked", "validatorKey", "value"];
-const _GInput = forwardRef((_ref, ref) => {
-  let {
-      formKey,
-      element,
-      title,
-      type = 'text',
-      fetch,
-      fetchDeps,
-      optimized,
-      debounce = 300,
-      defaultChecked,
-      defaultValue,
-      checked,
-      validatorKey,
-      value
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  const inputState = useFormSelector(state => state.fields[formKey]);
-  const store = useFormStore();
-  const _element = useMemo(() => {
-    let value, checked;
-    if (type === 'checkbox') checked = inputState.value || false;else value = inputState.value || '';
-    const _props = _objectSpread(_objectSpread({}, rest), {}, {
-      type,
-      name: formKey,
-      value,
-      checked,
-      ref,
-      'aria-invalid': inputState.error,
-      'aria-required': inputState.required,
-      title: title || inputState.errorText
-    });
-    if (!store.handlers.optimized || !optimized) {
-      _props.onBlur = rest.onBlur ? e => {
-        store.handlers._viHandler(inputState, e);
-        rest.onBlur(e);
-      } : e => {
-        store.handlers._viHandler(inputState, e);
-      };
-      _props.onInvalid = rest.onInvalid ? e => {
-        e.preventDefault();
-        store.handlers._viHandler(inputState, e);
-        rest.onInvalid(e);
-      } : e => {
-        e.preventDefault();
-        store.handlers._viHandler(inputState, e);
-      };
-      _props.onChange = rest.onChange ? (e, unknown) => {
-        store.handlers._updateInputHandler(inputState, e, unknown);
-        rest.onChange(e);
-      } : (e, unknown) => {
-        store.handlers._updateInputHandler(inputState, e, unknown);
-      };
-      if (!inputState.touched && inputState.dispatchChanges) {
-        _props.onFocus = rest.onFocus ? e => {
-          rest.onFocus(e);
-          inputState.dispatchChanges({
-            touched: true
-          });
-        } : () => {
-          inputState.dispatchChanges({
-            touched: true
-          });
-        };
-      }
-    }
-    if (element) {
-      return element(inputState, _props);
-    }
-    return React.createElement("input", _props);
-  }, [inputState, element]);
-  const _fetchDeps = useFormSelector(makeSelectFields(fetchDeps));
-  const stableFetchDeps = useMemo(() => JSON.stringify(_fetchDeps), [_fetchDeps]);
-  useEffect(() => {
-    if (fetch) {
-      _debounce(debounce, `${inputState.gid}-fetch`).then(() => {
-        const res = fetch(inputState, store.getState().fields);
-        if (res instanceof Promise) {
-          res.then(state => state && store.handlers._dispatchChanges(state, formKey));
-        } else if (res) {
-          store.handlers._dispatchChanges(res, formKey);
-        }
-      });
-    }
-  }, [stableFetchDeps]);
-  return _element;
-});
-const GInput = memo(_GInput);
-
-export { GForm, GInput, GValidator, useFormSelector };
-//# sourceMappingURL=index.development.js.map
+export { GForm } from './GForm.development.js';
+export { GInput } from './GInput.development.js';
+export { GValidator } from './GValidator.development.js';
+export { useFormSelector } from './useFormSelector.development.js';