relay-forms-nodeps 1.0.0

package/lib/es/relay/RelayStoreUtils.js

@@ -0,0 +1,199 @@
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @format
+ */
+export function isPromise(p) {
+  return !!p && typeof p.then === 'function';
+}
+'use strict';
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ *
+ */
+var aStackPool = [];
+var bStackPool = [];
+/**
+ * Checks if two values are equal. Values may be primitives, arrays, or objects.
+ * Returns true if both arguments have the same keys and values.
+ *
+ * @see http://underscorejs.org
+ * @copyright 2009-2013 Jeremy Ashkenas, DocumentCloud Inc.
+ * @license MIT
+ */
+export function areEqual(a, b) {
+  var aStack = aStackPool.length ? aStackPool.pop() : [];
+  var bStack = bStackPool.length ? bStackPool.pop() : [];
+  var result = eq(a, b, aStack, bStack);
+  aStack.length = 0;
+  bStack.length = 0;
+  aStackPool.push(aStack);
+  bStackPool.push(bStack);
+  return result;
+}
+function eq(a, b, aStack, bStack) {
+  if (a === b) {
+    // Identical objects are equal. `0 === -0`, but they aren't identical.
+    return a !== 0 || 1 / a == 1 / b;
+  }
+  if (a == null || b == null) {
+    // a or b can be `null` or `undefined`
+    return false;
+  }
+  if (typeof a != 'object' || typeof b != 'object') {
+    return false;
+  }
+  var objToStr = Object.prototype.toString;
+  var className = objToStr.call(a);
+  if (className != objToStr.call(b)) {
+    return false;
+  }
+  switch (className) {
+    case '[object String]':
+      return a == String(b);
+    case '[object Number]':
+      return isNaN(a) || isNaN(b) ? false : a == Number(b);
+    case '[object Date]':
+    case '[object Boolean]':
+      return +a == +b;
+    case '[object RegExp]':
+      return a.source == b.source && a.global == b.global && a.multiline == b.multiline && a.ignoreCase == b.ignoreCase;
+  } // Assume equality for cyclic structures.
+  var length = aStack.length;
+  // eslint-disable-next-line no-plusplus
+  while (length--) {
+    if (aStack[length] == a) {
+      return bStack[length] == b;
+    }
+  }
+  aStack.push(a);
+  bStack.push(b);
+  var size = 0; // Recursively compare objects and arrays.
+  if (className === '[object Array]') {
+    size = a.length;
+    if (size !== b.length) {
+      return false;
+    } // Deep compare the contents, ignoring non-numeric properties.
+    // eslint-disable-next-line no-plusplus
+    while (size--) {
+      if (!eq(a[size], b[size], aStack, bStack)) {
+        return false;
+      }
+    }
+  } else {
+    if (a.constructor !== b.constructor) {
+      return false;
+    }
+    if (a.hasOwnProperty('valueOf') && b.hasOwnProperty('valueOf')) {
+      return a.valueOf() == b.valueOf();
+    }
+    var keys = Object.keys(a);
+    if (keys.length != Object.keys(b).length) {
+      return false;
+    }
+    for (var i = 0; i < keys.length; i++) {
+      if (!eq(a[keys[i]], b[keys[i]], aStack, bStack)) {
+        return false;
+      }
+    }
+  }
+  aStack.pop();
+  bStack.pop();
+  return true;
+}
+/**
+ * Constants shared by all implementations of RecordSource/MutableRecordSource/etc.
+ */
+export var RelayStoreUtils = {
+  ID_KEY: '__id',
+  REF_KEY: '__ref',
+  REFS_KEY: '__refs',
+  ROOT_ID: 'client:root'
+};
+export var RelayRecordState;
+(function (RelayRecordState) {
+  /**
+   * Record exists (either fetched from the server or produced by a local,
+   * optimistic update).
+   */
+  RelayRecordState["EXISTENT"] = "EXISTENT";
+  /**
+   * Record is known not to exist (either as the result of a mutation, or
+   * because the server returned `null` when queried for the record).
+   */
+  RelayRecordState["NONEXISTENT"] = "NONEXISTENT";
+  /**
+   * Record State is unknown because it has not yet been fetched from the
+   * server.
+   */
+  RelayRecordState["UNKNOWN"] = "UNKNOWN";
+})(RelayRecordState || (RelayRecordState = {}));
+export var LINKED_FIELD = 'LinkedField';
+//const hasWeakSetDefined = typeof WeakSet !== 'undefined';
+//const hasWeakMapDefined = typeof WeakMap !== 'undefined';
+function checkRecycleData(data) {
+  return typeof data !== 'object' || data instanceof Set || data instanceof Map ||
+  //(hasWeakSetDefined && nextData instanceof WeakSet) ||
+  //(hasWeakMapDefined && nextData instanceof WeakMap) ||
+  !data;
+}
+/**
+ * Recycles subtrees from `prevData` by replacing equal subtrees in `nextData`.
+ */
+export function recycleNodesInto(prevData, nextData) {
+  if (prevData === nextData || checkRecycleData(prevData) || checkRecycleData(nextData)) {
+    return nextData;
+  }
+  var canRecycle = false;
+  // Assign local variables to preserve Flow type refinement.
+  var prevArray = Array.isArray(prevData) ? prevData : null;
+  var nextArray = Array.isArray(nextData) ? nextData : null;
+  if (prevArray && nextArray) {
+    canRecycle = nextArray.reduce(function (wasEqual, nextItem, ii) {
+      var prevValue = prevArray[ii];
+      var nextValue = recycleNodesInto(prevValue, nextItem);
+      if (nextValue !== nextArray[ii]) {
+        nextArray[ii] = nextValue;
+      }
+      return wasEqual && nextValue === prevArray[ii];
+    }, true) && prevArray.length === nextArray.length;
+  } else if (!prevArray && !nextArray) {
+    // Assign local variables to preserve Flow type refinement.
+    var prevObject_1 = prevData;
+    var nextObject_1 = nextData;
+    var prevKeys = Object.keys(prevObject_1);
+    var nextKeys = Object.keys(nextObject_1);
+    canRecycle = nextKeys.reduce(function (wasEqual, key) {
+      var prevValue = prevObject_1[key];
+      var nextValue = recycleNodesInto(prevValue, nextObject_1[key]);
+      if (nextValue !== nextObject_1[key]) {
+        nextObject_1[key] = nextValue;
+      }
+      return wasEqual && nextValue === prevObject_1[key];
+    }, true) && prevKeys.length === nextKeys.length;
+  }
+  return canRecycle ? prevData : nextData;
+}
+var ITERATOR_KEY = Symbol.iterator;
+export function hasOverlappingIDs(seenRecords, updatedRecordIDs) {
+  // $FlowFixMe: Set is an iterable type, accessing its iterator is allowed.
+  var iterator = seenRecords[ITERATOR_KEY]();
+  var next = iterator.next();
+  while (!next.done) {
+    var key = next.value;
+    if (updatedRecordIDs.has(key)) {
+      return true;
+    }
+    next = iterator.next();
+  }
+  return false;
+}

package/lib/es/relay/RelayTypes.d.ts

@@ -0,0 +1,92 @@
+import { RelayRecordState } from './RelayStoreUtils';
+export declare type Disposable = {
+    dispose(): void;
+};
+export interface RecordProxy {
+    getDataID(): string;
+    getLinkedRecords(name: string): Array<RecordProxy | null | undefined> | null | undefined;
+    setLinkedRecord(record: RecordProxy, name: string): RecordProxy;
+    setLinkedRecords(records: Array<RecordProxy>, name: string): RecordProxy;
+    setValue(value: any, name: string): RecordProxy;
+}
+export interface RecordSourceProxy {
+    create(string: string): RecordProxy;
+    delete(string: string): void;
+    get(string: string): RecordProxy | null | undefined;
+    getRoot(): RecordProxy;
+}
+export declare type StoreUpdater = (store: RecordSourceProxy) => void;
+export declare type Record = {
+    [key: string]: any;
+};
+export declare type SelectorData = {
+    [key: string]: any;
+};
+export declare type RecordState = keyof typeof RelayRecordState;
+export interface RecordSource {
+    get(dataID: string): Record | null | undefined;
+    getRecordIDs(): Array<string>;
+    getStatus(dataID: string): RecordState;
+    has(dataID: string): boolean;
+    size(): number;
+    toJSON(): {
+        [key: string]: Record | null | undefined;
+    };
+}
+export declare type Snapshot = {
+    data: SelectorData | null | undefined;
+    seenRecords: Set<string>;
+    selector: any;
+};
+export declare type OperationDescriptor = {
+    fragment: any;
+    request: any;
+    root: any;
+};
+export interface Store {
+    /**
+     * Commit an updater to the environment. This mutation cannot be reverted and
+     * should therefore not be used for optimistic updates. This is mainly
+     * intended for updating fields from client schema extensions.
+     */
+    commitUpdate(updater: StoreUpdater): void;
+    /**
+     * Get a read-only view of the store's internal RecordSource.
+     */
+    getSource(): RecordSource;
+    /**
+     * Read the results of a selector from in-memory records in the store.
+     */
+    lookup(selector: any): Snapshot;
+    /**
+     * Notify subscribers (see `subscribe`) of any data that was published
+     * (`publish()`) since the last time `notify` was called.
+     * Optionally provide an OperationDescriptor indicating the source operation
+     * that was being processed to produce this run.
+     */
+    notify(sourceOperation?: OperationDescriptor, invalidateStore?: boolean): any;
+    /**
+     * Publish new information (e.g. from the network) to the store, updating its
+     * internal record source. Subscribers are not immediately notified - this
+     * occurs when `notify()` is called.
+     */
+    publish(source: RecordSource): void;
+    /**
+     * Ensure that all the records necessary to fulfill the given selector are
+     * retained in memory. The records will not be eligible for garbage collection
+     * until the returned reference is disposed.
+     */
+    retain(operation: OperationDescriptor): Disposable;
+    /**
+     * Subscribe to changes to the results of a selector. The callback is called
+     * when `notify()` is called *and* records have been published that affect the
+     * selector results relative to the last `notify()`.
+     */
+    subscribe(snapshot: Snapshot, callback: (snapshot: Snapshot) => void): Disposable;
+}
+export interface MutableRecordSource extends RecordSource {
+    clear(): void;
+    delete(dataID: string): void;
+    remove(dataID: string): void;
+    set(dataID: string, record: Record): void;
+}

package/lib/es/relay/queries.d.ts

@@ -0,0 +1,86 @@
+export declare type QueryErrorsData = {
+    readonly form: {
+        readonly entries: ReadonlyArray<{
+            readonly check: string | null;
+            readonly error: string | null;
+            readonly id: string;
+            readonly key: string;
+        } | null> | null;
+        readonly isSubmitting: boolean | null;
+        readonly isValidating: boolean | null;
+    } | null;
+};
+export declare const QueryErrors: {
+    id: string;
+    fragment: {
+        kind: string;
+        name: string;
+        selections: {
+            kind: string;
+            name: string;
+            plural: boolean;
+            selections: ({
+                name: string;
+                kind?: undefined;
+                plural?: undefined;
+                selections?: undefined;
+            } | {
+                kind: string;
+                name: string;
+                plural: boolean;
+                selections: {
+                    name: string;
+                }[];
+            })[];
+        }[];
+    };
+};
+export declare type QueryFieldsData = {
+    readonly form: {
+        readonly entries: ReadonlyArray<{
+            readonly check: string | null;
+            readonly error: string | null;
+            readonly id: string;
+            readonly key: string;
+            readonly value: string | null;
+        } | null> | null;
+    } | null;
+};
+export declare const QueryFields: {
+    id: string;
+    fragment: {
+        kind: string;
+        name: string;
+        selections: {
+            kind: string;
+            name: string;
+            plural: boolean;
+            selections: {
+                kind: string;
+                name: string;
+                plural: boolean;
+                selections: {
+                    name: string;
+                }[];
+            }[];
+        }[];
+    };
+};
+export declare type FragmentSetData = {
+    readonly check: string | null;
+    readonly id: string;
+};
+export declare const FragmentSet: {
+    kind: string;
+    name: string;
+    selections: {
+        name: string;
+    }[];
+};
+export declare const FragmentValue: {
+    kind: string;
+    name: string;
+    selections: {
+        name: string;
+    }[];
+};

package/lib/es/relay/queries.js

@@ -0,0 +1,68 @@
+import { LINKED_FIELD } from './RelayStoreUtils';
+var id = {
+  name: 'id'
+};
+var key = {
+  name: 'key'
+};
+var check = {
+  name: 'check'
+};
+var error = {
+  name: 'error'
+};
+var value = {
+  name: 'value'
+};
+var kindFragment = 'Fragment';
+export var QueryErrors = {
+  id: '1',
+  fragment: {
+    kind: kindFragment,
+    name: 'queryErrors',
+    selections: [{
+      kind: LINKED_FIELD,
+      name: 'form',
+      plural: false,
+      selections: [{
+        name: 'isSubmitting'
+      }, {
+        name: 'isValidating'
+      }, {
+        kind: LINKED_FIELD,
+        name: 'entries',
+        plural: true,
+        selections: [id, key, error, check]
+      }]
+    }] /*: any*/
+  }
+};
+
+export var QueryFields = {
+  id: '0',
+  fragment: {
+    kind: kindFragment,
+    name: 'queryFields',
+    selections: [{
+      kind: LINKED_FIELD,
+      name: 'form',
+      plural: false,
+      selections: [{
+        kind: LINKED_FIELD,
+        name: 'entries',
+        plural: true,
+        selections: [id, key, value, error, check]
+      }]
+    }]
+  }
+};
+export var FragmentSet = {
+  kind: kindFragment,
+  name: 'fragmentSet',
+  selections: [id, check]
+};
+export var FragmentValue = {
+  kind: kindFragment,
+  name: 'fragmentValue',
+  selections: [id, value, error]
+};

package/lib/es/useForceUpdate.d.ts

@@ -0,0 +1 @@
+export declare function useForceUpdate(): () => void;

package/lib/es/useForceUpdate.js

@@ -0,0 +1,8 @@
+import { useReducer } from 'react';
+export function useForceUpdate() {
+  var _a = useReducer(function (x) {
+      return x + 1;
+    }, 0),
+    forceUpdate = _a[1];
+  return forceUpdate;
+}

package/lib/es/useFormSetValue.d.ts

@@ -0,0 +1,2 @@
+import { FormSetValueOptions, FormSetValueReturn } from './RelayFormsTypes';
+export declare function useFormSetValue<ValueType>({ key, initialValue, validate, validateOnChange, }: FormSetValueOptions<ValueType>): FormSetValueReturn<ValueType>;

package/lib/es/useFormSetValue.js

@@ -0,0 +1,84 @@
+import React from 'react';
+import { FragmentSet } from './relay/queries';
+import { useStore } from './relay/RelayStoreProvider';
+import { isPromise } from './relay/RelayStoreUtils';
+import { useForceUpdate } from './useForceUpdate';
+import { commitValue, commitErrorIntoRelay, commitResetField, getSnapshot } from './Utils';
+export function useFormSetValue(_a) {
+  var key = _a.key,
+    initialValue = _a.initialValue,
+    validate = _a.validate,
+    validateOnChange = _a.validateOnChange;
+  var forceUpdate = useForceUpdate();
+  var environment = useStore();
+  var ref = React.useRef({
+    value: initialValue,
+    error: undefined,
+    check: validate ? 'INIT' : 'DONE',
+    isChecking: false
+  });
+  var setValue = React.useCallback(function (newValue) {
+    ref.current.value = newValue;
+    if (ref.current.check === 'DONE' && validate) {
+      ref.current.check = 'START';
+    }
+    commitValue(key, newValue, ref.current.check, environment);
+    forceUpdate();
+  }, [environment, key, validate, forceUpdate]);
+  React.useEffect(function () {
+    //commitResetField(environment, key);
+    commitValue(key, initialValue, ref.current.check, environment);
+    var snapshot = getSnapshot(environment, FragmentSet, key);
+    var disposeSubscrition = environment.subscribe(snapshot, function (s) {
+      var check = s.data.check;
+      var isStart = check === 'START';
+      var isReset = check === 'RESET';
+      ref.current.check = check;
+      if (isReset) {
+        ref.current.check = validate ? 'INIT' : 'DONE';
+        setValue(initialValue);
+      } else {
+        if (!validate) {
+          commitErrorIntoRelay(key, undefined, environment);
+          return;
+        }
+        if (isStart && !ref.current.isChecking) {
+          internalValidate(ref.current.value);
+        }
+      }
+    }).dispose;
+    var dispose = function () {
+      disposeSubscrition();
+      commitResetField(environment, key);
+    };
+    function finalizeCheck(error) {
+      ref.current.isChecking = false;
+      if (ref.current.error !== error) {
+        ref.current.error = error;
+        forceUpdate();
+      }
+      commitErrorIntoRelay(key, error, environment);
+    }
+    function internalValidate(value) {
+      ref.current.isChecking = true;
+      var result = validate(value);
+      function internalFinalize(error) {
+        if (value !== ref.current.value) {
+          internalValidate(ref.current.value);
+          return;
+        }
+        finalizeCheck(error);
+      }
+      if (isPromise(result)) {
+        result.then(internalFinalize).catch(internalFinalize);
+      } else {
+        internalFinalize(result);
+      }
+    }
+    if (validateOnChange) {
+      internalValidate(initialValue);
+    }
+    return dispose;
+  }, [environment, initialValue, key, setValue, validate, validateOnChange, forceUpdate]);
+  return [ref.current, setValue];
+}

package/lib/es/useFormState.d.ts

@@ -0,0 +1,2 @@
+import { FormStateReturn } from './RelayFormsTypes';
+export declare const useFormState: () => FormStateReturn;

package/lib/es/useFormState.js

@@ -0,0 +1,49 @@
+import React from 'react';
+import { useStore } from './relay/RelayStoreProvider';
+import { areEqual } from './relay/RelayStoreUtils';
+import { useForceUpdate } from './useForceUpdate';
+import { operationQueryErrorsForm } from './Utils';
+export var useFormState = function () {
+  var ref = React.useRef({
+    errors: undefined,
+    isValidating: false,
+    isSubmitting: false,
+    isValid: false
+  });
+  var forceUpdate = useForceUpdate();
+  var environment = useStore();
+  React.useEffect(function () {
+    function checkError(s) {
+      var data = s.data;
+      var form = data.form;
+      var entries = form.entries;
+      var current = ref.current;
+      var entryErrors = entries.filter(function (value) {
+        return !!value.error;
+      });
+      var entryValidated = entries.filter(function (value) {
+        return value.check === 'DONE';
+      });
+      var errors = entryErrors.length > 0 ? entryErrors : undefined;
+      var isValidating = form.isValidating;
+      var isSubmitting = form.isSubmitting;
+      var isValid = entries.length === entryValidated.length && (!errors || Object.keys(errors).length === 0);
+      var newState = {
+        errors: errors,
+        isValid: isValid,
+        isValidating: isValidating,
+        isSubmitting: isSubmitting
+      };
+      if (!areEqual(current, newState)) {
+        ref.current = newState;
+        forceUpdate();
+      }
+    }
+    var snapshot = environment.lookup(operationQueryErrorsForm.fragment);
+    checkError(snapshot);
+    return environment.subscribe(snapshot, function (s) {
+      checkError(s);
+    }).dispose;
+  }, [environment, forceUpdate]);
+  return ref.current;
+};

package/lib/es/useFormSubmit.d.ts

@@ -0,0 +1,2 @@
+import { FormSubmitOptions, FormSubmitReturn } from './RelayFormsTypes';
+export declare const useFormSubmit: <ValueType extends object = object>({ onSubmit, }: FormSubmitOptions<ValueType>) => FormSubmitReturn;