@khanacademy/wonder-blocks-data 10.0.2 → 10.0.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @khanacademy/wonder-blocks-data
 
+## 10.0.4
+
+### Patch Changes
+
+-   Updated dependencies [496119f2]
+    -   @khanacademy/wonder-blocks-core@4.6.2
+
+## 10.0.3
+
+### Patch Changes
+
+-   @khanacademy/wonder-blocks-core@4.6.1
+
 ## 10.0.2
 
 ### Patch Changes

package/dist/index.js

@@ -0,0 +1,1009 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var wonderBlocksCore = require('@khanacademy/wonder-blocks-core');
+var wonderStuffCore = require('@khanacademy/wonder-stuff-core');
+var _extends = require('@babel/runtime/helpers/extends');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
+var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const FetchPolicy = require("flow-enums-runtime").Mirrored(["CacheBeforeNetwork", "CacheAndNetwork", "CacheOnly", "NetworkOnly"]);
+
+const DataErrors = Object.freeze({
+  Unknown: "Unknown",
+  Internal: "Internal",
+  InvalidInput: "InvalidInput",
+  Network: "Network",
+  NotAllowed: "NotAllowed",
+  Parse: "Parse",
+  Hydrated: "Hydrated"
+});
+class DataError extends wonderStuffCore.KindError {
+  constructor(message, kind, {
+    metadata,
+    cause
+  } = {}) {
+    super(message, kind, {
+      metadata,
+      cause,
+      name: "Data"
+    });
+  }
+
+}
+
+class ScopedInMemoryCache {
+  constructor(initialCache = {}) {
+    this._cache = initialCache;
+  }
+
+  get inUse() {
+    return Object.keys(this._cache).length > 0;
+  }
+
+  set(scope, id, value) {
+    var _this$_cache$scope;
+
+    if (!id || typeof id !== "string") {
+      throw new DataError("id must be non-empty string", DataErrors.InvalidInput);
+    }
+
+    if (!scope || typeof scope !== "string") {
+      throw new DataError("scope must be non-empty string", DataErrors.InvalidInput);
+    }
+
+    if (typeof value === "function") {
+      throw new DataError("value must be a non-function value", DataErrors.InvalidInput);
+    }
+
+    this._cache[scope] = (_this$_cache$scope = this._cache[scope]) != null ? _this$_cache$scope : {};
+    this._cache[scope][id] = value;
+  }
+
+  get(scope, id) {
+    var _this$_cache$scope$id, _this$_cache$scope2;
+
+    return (_this$_cache$scope$id = (_this$_cache$scope2 = this._cache[scope]) == null ? void 0 : _this$_cache$scope2[id]) != null ? _this$_cache$scope$id : null;
+  }
+
+  purge(scope, id) {
+    var _this$_cache$scope3;
+
+    if (!((_this$_cache$scope3 = this._cache[scope]) != null && _this$_cache$scope3[id])) {
+      return;
+    }
+
+    delete this._cache[scope][id];
+
+    if (Object.keys(this._cache[scope]).length === 0) {
+      delete this._cache[scope];
+    }
+  }
+
+  purgeScope(scope, predicate) {
+    if (!this._cache[scope]) {
+      return;
+    }
+
+    if (predicate == null) {
+      delete this._cache[scope];
+      return;
+    }
+
+    for (const key of Object.keys(this._cache[scope])) {
+      if (predicate(key, this._cache[scope][key])) {
+        delete this._cache[scope][key];
+      }
+    }
+
+    if (Object.keys(this._cache[scope]).length === 0) {
+      delete this._cache[scope];
+    }
+  }
+
+  purgeAll(predicate) {
+    if (predicate == null) {
+      this._cache = {};
+      return;
+    }
+
+    for (const scope of Object.keys(this._cache)) {
+      this.purgeScope(scope, (id, value) => predicate(scope, id, value));
+    }
+  }
+
+}
+
+class SerializableInMemoryCache extends ScopedInMemoryCache {
+  constructor(initialCache = {}) {
+    try {
+      super(wonderStuffCore.clone(initialCache));
+    } catch (e) {
+      throw new DataError(`An error occurred trying to initialize from a response cache snapshot: ${e}`, DataErrors.InvalidInput);
+    }
+  }
+
+  set(scope, id, value) {
+    super.set(scope, id, Object.freeze(wonderStuffCore.clone(value)));
+  }
+
+  clone() {
+    try {
+      return wonderStuffCore.clone(this._cache);
+    } catch (e) {
+      throw new DataError("An error occurred while trying to clone the cache", DataErrors.Internal, {
+        cause: e
+      });
+    }
+  }
+
+}
+
+const DefaultScope$2 = "default";
+
+let _default$2;
+
+class SsrCache {
+  static get Default() {
+    if (!_default$2) {
+      _default$2 = new SsrCache();
+    }
+
+    return _default$2;
+  }
+
+  constructor(hydrationCache = null, ssrOnlyCache = null) {
+    this.initialize = source => {
+      if (this._hydrationCache.inUse) {
+        throw new Error("Cannot initialize data response cache more than once");
+      }
+
+      this._hydrationCache = new SerializableInMemoryCache({
+        [DefaultScope$2]: source
+      });
+    };
+
+    this.cacheData = (id, data, hydrate) => this._setCachedResponse(id, {
+      data
+    }, hydrate);
+
+    this.cacheError = (id, error, hydrate) => {
+      const errorMessage = typeof error === "string" ? error : error.message;
+      return this._setCachedResponse(id, {
+        error: errorMessage
+      }, hydrate);
+    };
+
+    this.getEntry = id => {
+      const ssrEntry = wonderBlocksCore.Server.isServerSide() ? this._ssrOnlyCache.get(DefaultScope$2, id) : null;
+      const internalEntry = ssrEntry != null ? ssrEntry : this._hydrationCache.get(DefaultScope$2, id);
+
+      if (!wonderBlocksCore.Server.isServerSide() && internalEntry != null) {
+        this._hydrationCache.purge(DefaultScope$2, id);
+      }
+
+      return internalEntry;
+    };
+
+    this.purgeData = predicate => {
+      const realPredicate = predicate ? (_, key, cachedEntry) => predicate(key, cachedEntry) : undefined;
+
+      this._hydrationCache.purgeAll(realPredicate);
+
+      this._ssrOnlyCache.purgeAll(realPredicate);
+    };
+
+    this.cloneHydratableData = () => {
+      var _cache$DefaultScope;
+
+      const cache = this._hydrationCache.clone();
+
+      return (_cache$DefaultScope = cache[DefaultScope$2]) != null ? _cache$DefaultScope : {};
+    };
+
+    this._ssrOnlyCache = ssrOnlyCache || new SerializableInMemoryCache();
+    this._hydrationCache = hydrationCache || new SerializableInMemoryCache();
+  }
+
+  _setCachedResponse(id, entry, hydrate) {
+    const frozenEntry = Object.freeze(entry);
+
+    if (wonderBlocksCore.Server.isServerSide()) {
+      if (hydrate) {
+        this._hydrationCache.set(DefaultScope$2, id, frozenEntry);
+      } else {
+        this._ssrOnlyCache.set(DefaultScope$2, id, frozenEntry);
+      }
+    }
+
+    return frozenEntry;
+  }
+
+}
+
+const initializeHydrationCache = source => SsrCache.Default.initialize(source);
+const purgeHydrationCache = predicate => SsrCache.Default.purgeData(predicate);
+
+let _default$1;
+
+class RequestFulfillment {
+  constructor() {
+    this._requests = {};
+
+    this.fulfill = (id, {
+      handler,
+      hydrate: _hydrate = true
+    }) => {
+      const inflight = this._requests[id];
+
+      if (inflight) {
+        return inflight;
+      }
+
+      const request = handler().then(data => ({
+        status: "success",
+        data
+      })).catch(error => {
+        const actualError = typeof error === "string" ? new DataError("Request failed", DataErrors.Unknown, {
+          metadata: {
+            unexpectedError: error
+          }
+        }) : error;
+
+        if (actualError.name === "AbortError") {
+          return {
+            status: "aborted"
+          };
+        }
+
+        return {
+          status: "error",
+          error: actualError
+        };
+      }).finally(() => {
+        delete this._requests[id];
+      });
+      this._requests[id] = request;
+      return request;
+    };
+
+    this.abort = id => {
+      delete this._requests[id];
+    };
+
+    this.abortAll = () => {
+      Object.keys(this._requests).forEach(id => this.abort(id));
+    };
+  }
+
+  static get Default() {
+    if (!_default$1) {
+      _default$1 = new RequestFulfillment();
+    }
+
+    return _default$1;
+  }
+
+}
+
+const TrackerContext = React__namespace.createContext(null);
+
+let _default;
+
+class RequestTracker {
+  static get Default() {
+    if (!_default) {
+      _default = new RequestTracker();
+    }
+
+    return _default;
+  }
+
+  constructor(responseCache = undefined) {
+    this._trackedRequests = {};
+
+    this.trackDataRequest = (id, handler, hydrate) => {
+      if (this._trackedRequests[id] == null) {
+        this._trackedRequests[id] = {
+          handler,
+          hydrate
+        };
+      }
+    };
+
+    this.reset = () => {
+      this._trackedRequests = {};
+    };
+
+    this.fulfillTrackedRequests = () => {
+      const promises = [];
+      const {
+        cacheData,
+        cacheError
+      } = this._responseCache;
+
+      for (const requestKey of Object.keys(this._trackedRequests)) {
+        const options = this._trackedRequests[requestKey];
+
+        try {
+          promises.push(this._requestFulfillment.fulfill(requestKey, _extends__default["default"]({}, options)).then(result => {
+            switch (result.status) {
+              case "success":
+                cacheData(requestKey, result.data, options.hydrate);
+                break;
+
+              case "error":
+                cacheError(requestKey, result.error, options.hydrate);
+                break;
+            }
+
+            return;
+          }));
+        } catch (e) {
+          promises.push(Promise.resolve(cacheError(requestKey, e, options.hydrate)));
+        }
+      }
+
+      this.reset();
+      return Promise.all(promises).then(() => this._responseCache.cloneHydratableData());
+    };
+
+    this._responseCache = responseCache || SsrCache.Default;
+    this._requestFulfillment = new RequestFulfillment();
+  }
+
+  get hasUnfulfilledRequests() {
+    return Object.keys(this._trackedRequests).length > 0;
+  }
+
+}
+
+const SSRCheck = () => {
+  if (wonderBlocksCore.Server.isServerSide()) {
+    return null;
+  }
+
+  if (process.env.NODE_ENV === "production") {
+    return new DataError("No CSR tracking", DataErrors.NotAllowed);
+  } else {
+    return new DataError("Data requests are not tracked for fulfillment when when client-side", DataErrors.NotAllowed);
+  }
+};
+
+const fetchTrackedRequests = () => {
+  const ssrCheck = SSRCheck();
+
+  if (ssrCheck != null) {
+    return Promise.reject(ssrCheck);
+  }
+
+  return RequestTracker.Default.fulfillTrackedRequests();
+};
+const hasTrackedRequestsToBeFetched = () => {
+  const ssrCheck = SSRCheck();
+
+  if (ssrCheck != null) {
+    throw ssrCheck;
+  }
+
+  return RequestTracker.Default.hasUnfulfilledRequests;
+};
+const abortInflightRequests = () => {
+  RequestFulfillment.Default.abortAll();
+};
+
+const cache$1 = new ScopedInMemoryCache();
+const SharedCache = cache$1;
+const useSharedCache = (id, scope, initialValue) => {
+  if (!id || typeof id !== "string") {
+    throw new DataError("id must be a non-empty string", DataErrors.InvalidInput);
+  }
+
+  if (!scope || typeof scope !== "string") {
+    throw new DataError("scope must be a non-empty string", DataErrors.InvalidInput);
+  }
+
+  const cacheValue = React__namespace.useCallback(value => value == null ? cache$1.purge(scope, id) : cache$1.set(scope, id, value), [id, scope]);
+  let currentValue = cache$1.get(scope, id);
+
+  if (currentValue == null && initialValue !== undefined) {
+    const value = typeof initialValue === "function" ? initialValue() : initialValue;
+
+    if (value != null) {
+      cacheValue(value);
+      currentValue = value;
+    }
+  }
+
+  return [currentValue, cacheValue];
+};
+
+const purgeCaches = () => {
+  SharedCache.purgeAll();
+  purgeHydrationCache();
+};
+
+class TrackData extends React__namespace.Component {
+  render() {
+    if (!wonderBlocksCore.Server.isServerSide()) {
+      throw new Error("This component is not for use during client-side rendering");
+    }
+
+    return React__namespace.createElement(TrackerContext.Provider, {
+      value: RequestTracker.Default.trackDataRequest
+    }, this.props.children);
+  }
+
+}
+
+const loadingStatus = Object.freeze({
+  status: "loading"
+});
+const abortedStatus = Object.freeze({
+  status: "aborted"
+});
+const Status = Object.freeze({
+  loading: () => loadingStatus,
+  aborted: () => abortedStatus,
+  success: data => ({
+    status: "success",
+    data
+  }),
+  error: error => ({
+    status: "error",
+    error
+  })
+});
+
+const resultFromCachedResponse = cacheEntry => {
+  if (cacheEntry == null) {
+    return null;
+  }
+
+  const {
+    data,
+    error
+  } = cacheEntry;
+
+  if (error != null) {
+    return Status.error(new DataError(error, DataErrors.Hydrated));
+  }
+
+  if (data != null) {
+    return Status.success(data);
+  }
+
+  return Status.aborted();
+};
+
+const InterceptContext = React__namespace.createContext([]);
+
+const useRequestInterception = (requestId, handler) => {
+  const interceptors = React__namespace.useContext(InterceptContext);
+  const interceptedHandler = React__namespace.useCallback(() => {
+    const interceptResponse = interceptors.reduceRight((prev, interceptor) => {
+      if (prev != null) {
+        return prev;
+      }
+
+      return interceptor(requestId);
+    }, null);
+    return interceptResponse != null ? interceptResponse : handler();
+  }, [handler, interceptors, requestId]);
+  return interceptedHandler;
+};
+
+const useServerEffect = (requestId, handler, options = {}) => {
+  const {
+    hydrate = true,
+    skip = false
+  } = options;
+  const interceptedHandler = useRequestInterception(requestId, handler);
+  const cachedResult = SsrCache.Default.getEntry(requestId);
+  const maybeTrack = React.useContext(TrackerContext);
+
+  if (!skip && cachedResult == null && wonderBlocksCore.Server.isServerSide()) {
+    maybeTrack == null ? void 0 : maybeTrack(requestId, interceptedHandler, hydrate);
+  }
+
+  return cachedResult == null ? null : resultFromCachedResponse(cachedResult);
+};
+
+const DefaultScope$1 = "useCachedEffect";
+const useCachedEffect = (requestId, handler, options = {}) => {
+  var _ref;
+
+  const {
+    fetchPolicy = FetchPolicy.CacheBeforeNetwork,
+    skip: hardSkip = false,
+    retainResultOnChange = false,
+    onResultChanged,
+    scope = DefaultScope$1
+  } = options;
+  const interceptedHandler = useRequestInterception(requestId, handler);
+  const [mostRecentResult, setMostRecentResult] = useSharedCache(requestId, scope);
+  const forceUpdate = wonderBlocksCore.useForceUpdate();
+  const networkResultRef = React__namespace.useRef();
+  const currentRequestRef = React__namespace.useRef();
+  const fetchRequest = React__namespace.useMemo(() => {
+    var _currentRequestRef$cu;
+
+    (_currentRequestRef$cu = currentRequestRef.current) == null ? void 0 : _currentRequestRef$cu.cancel();
+    currentRequestRef.current = null;
+    networkResultRef.current = null;
+
+    const fetchFn = () => {
+      var _currentRequestRef$cu2, _currentRequestRef$cu3;
+
+      if (fetchPolicy === FetchPolicy.CacheOnly) {
+        throw new DataError("Cannot fetch with CacheOnly policy", DataErrors.NotAllowed);
+      }
+
+      const request = RequestFulfillment.Default.fulfill(`${requestId}|${scope}`, {
+        handler: interceptedHandler
+      });
+
+      if (request === ((_currentRequestRef$cu2 = currentRequestRef.current) == null ? void 0 : _currentRequestRef$cu2.request)) {
+        return;
+      }
+
+      networkResultRef.current = null;
+      (_currentRequestRef$cu3 = currentRequestRef.current) == null ? void 0 : _currentRequestRef$cu3.cancel();
+      let cancel = false;
+      request.then(result => {
+        currentRequestRef.current = null;
+
+        if (cancel) {
+          return;
+        }
+
+        setMostRecentResult(result);
+        networkResultRef.current = result;
+
+        if (onResultChanged != null) {
+          onResultChanged(result);
+        } else {
+          forceUpdate();
+        }
+
+        return;
+      });
+      currentRequestRef.current = {
+        requestId,
+        request,
+
+        cancel() {
+          cancel = true;
+          RequestFulfillment.Default.abort(requestId);
+        }
+
+      };
+    };
+
+    return fetchFn;
+  }, [requestId, onResultChanged, forceUpdate, setMostRecentResult, fetchPolicy]);
+  const shouldFetch = React__namespace.useMemo(() => {
+    if (hardSkip) {
+      return false;
+    }
+
+    switch (fetchPolicy) {
+      case FetchPolicy.CacheOnly:
+        return false;
+
+      case FetchPolicy.CacheBeforeNetwork:
+        return mostRecentResult == null;
+
+      case FetchPolicy.CacheAndNetwork:
+      case FetchPolicy.NetworkOnly:
+        return networkResultRef.current == null;
+    }
+  }, [mostRecentResult, fetchPolicy, hardSkip]);
+  React__namespace.useEffect(() => {
+    if (!shouldFetch) {
+      return;
+    }
+
+    fetchRequest();
+    return () => {
+      var _currentRequestRef$cu4;
+
+      (_currentRequestRef$cu4 = currentRequestRef.current) == null ? void 0 : _currentRequestRef$cu4.cancel();
+      currentRequestRef.current = null;
+    };
+  }, [shouldFetch, fetchRequest]);
+  const lastResultAgnosticOfIdRef = React__namespace.useRef(Status.loading());
+  const loadingResult = retainResultOnChange ? lastResultAgnosticOfIdRef.current : Status.loading();
+  const result = (_ref = fetchPolicy === FetchPolicy.NetworkOnly ? networkResultRef.current : mostRecentResult) != null ? _ref : loadingResult;
+  lastResultAgnosticOfIdRef.current = result;
+  return [result, fetchRequest];
+};
+
+const WhenClientSide = require("flow-enums-runtime").Mirrored(["DoNotHydrate", "ExecuteWhenNoResult", "ExecuteWhenNoSuccessResult", "AlwaysExecute"]);
+const DefaultScope = "useHydratableEffect";
+const useHydratableEffect = (requestId, handler, options = {}) => {
+  const {
+    clientBehavior = WhenClientSide.ExecuteWhenNoSuccessResult,
+    skip = false,
+    retainResultOnChange = false,
+    onResultChanged,
+    scope = DefaultScope
+  } = options;
+  const serverResult = useServerEffect(requestId, handler, {
+    hydrate: clientBehavior !== WhenClientSide.DoNotHydrate,
+    skip
+  });
+  const getDefaultCacheValue = React__namespace.useCallback(() => {
+    switch (clientBehavior) {
+      case WhenClientSide.DoNotHydrate:
+      case WhenClientSide.AlwaysExecute:
+        return null;
+
+      case WhenClientSide.ExecuteWhenNoResult:
+        return serverResult;
+
+      case WhenClientSide.ExecuteWhenNoSuccessResult:
+        if ((serverResult == null ? void 0 : serverResult.status) === "success") {
+          return serverResult;
+        }
+
+        return null;
+    }
+  }, [serverResult]);
+  useSharedCache(requestId, scope, getDefaultCacheValue);
+  const [clientResult] = useCachedEffect(requestId, handler, {
+    skip,
+    onResultChanged,
+    retainResultOnChange,
+    scope,
+    fetchPolicy: FetchPolicy.CacheBeforeNetwork
+  });
+  return serverResult != null ? serverResult : clientResult;
+};
+
+const Data = ({
+  requestId,
+  handler,
+  children,
+  retainResultOnChange: _retainResultOnChange = false,
+  clientBehavior: _clientBehavior = WhenClientSide.ExecuteWhenNoSuccessResult
+}) => {
+  const result = useHydratableEffect(requestId, handler, {
+    retainResultOnChange: _retainResultOnChange,
+    clientBehavior: _clientBehavior
+  });
+  return children(result);
+};
+
+const InterceptRequests = ({
+  interceptor,
+  children
+}) => {
+  const interceptors = React__namespace.useContext(InterceptContext);
+  const updatedInterceptors = React__namespace.useMemo(() => [].concat(interceptors, [interceptor]), [interceptors, interceptor]);
+  return React__namespace.createElement(InterceptContext.Provider, {
+    value: updatedInterceptors
+  }, children);
+};
+
+const toString = value => {
+  var _JSON$stringify;
+
+  if (typeof value === "string") {
+    return value;
+  }
+
+  if (typeof value === "object" && value != null) {
+    if (value instanceof Date) {
+      return value.toISOString();
+    } else if (typeof value.toString === "function") {
+      return value.toString();
+    }
+  }
+
+  return (_JSON$stringify = JSON.stringify(value)) != null ? _JSON$stringify : "";
+};
+
+const toStringifiedVariables = (acc, key, value) => {
+  if (typeof value === "object" && value !== null) {
+    const subValues = wonderStuffCore.entries(value);
+
+    if (subValues.length !== 0) {
+      return subValues.reduce((innerAcc, [i, v]) => {
+        const subKey = `${key}.${i}`;
+        return toStringifiedVariables(innerAcc, subKey, v);
+      }, acc);
+    }
+  }
+
+  acc[key] = toString(value);
+  return acc;
+};
+
+const getGqlRequestId = (operation, variables, context) => {
+  const parts = [];
+  const sortableContext = new URLSearchParams(context);
+  sortableContext.sort();
+  parts.push(sortableContext.toString());
+  parts.push(operation.id);
+
+  if (variables != null) {
+    const stringifiedVariables = Object.keys(variables).reduce((acc, key) => {
+      const value = variables[key];
+      return toStringifiedVariables(acc, key, value);
+    }, {});
+    const sortableVariables = new URLSearchParams(stringifiedVariables);
+    sortableVariables.sort();
+    parts.push(sortableVariables.toString());
+  }
+
+  return parts.join("|");
+};
+
+const GqlErrors = Object.freeze({
+  Internal: "Internal",
+  BadResponse: "BadResponse",
+  ErrorResult: "ErrorResult"
+});
+class GqlError extends wonderStuffCore.KindError {
+  constructor(message, kind, {
+    metadata,
+    cause
+  } = {}) {
+    super(message, kind, {
+      metadata,
+      cause,
+      name: "Gql"
+    });
+  }
+
+}
+
+const getGqlDataFromResponse = async response => {
+  const bodyText = await response.text();
+  let result;
+
+  try {
+    result = JSON.parse(bodyText);
+  } catch (e) {
+    throw new DataError("Failed to parse response", DataErrors.Parse, {
+      metadata: {
+        statusCode: response.status,
+        bodyText
+      },
+      cause: e
+    });
+  }
+
+  if (response.status >= 300) {
+    throw new DataError("Response unsuccessful", DataErrors.Network, {
+      metadata: {
+        statusCode: response.status,
+        result
+      }
+    });
+  }
+
+  if (!Object.prototype.hasOwnProperty.call(result, "data") && !Object.prototype.hasOwnProperty.call(result, "errors")) {
+    throw new GqlError("Server response missing", GqlErrors.BadResponse, {
+      metadata: {
+        statusCode: response.status,
+        result
+      }
+    });
+  }
+
+  if (result.errors != null && Array.isArray(result.errors) && result.errors.length > 0) {
+    throw new GqlError("GraphQL errors", GqlErrors.ErrorResult, {
+      metadata: {
+        statusCode: response.status,
+        result
+      }
+    });
+  }
+
+  return result.data;
+};
+
+const DocumentTypes = Object.freeze({
+  query: "query",
+  mutation: "mutation"
+});
+const cache = new Map();
+function graphQLDocumentNodeParser(document) {
+  var _definition$name;
+
+  const cached = cache.get(document);
+
+  if (cached) {
+    return cached;
+  }
+
+  if (!(document != null && document.kind)) {
+    if (process.env.NODE_ENV === "production") {
+      throw new DataError("Bad DocumentNode", DataErrors.InvalidInput);
+    } else {
+      throw new DataError(`Argument of ${JSON.stringify(document)} passed to parser was not a valid GraphQL ` + `DocumentNode. You may need to use 'graphql-tag' or another method ` + `to convert your operation into a document`, DataErrors.InvalidInput);
+    }
+  }
+
+  const fragments = document.definitions.filter(x => x.kind === "FragmentDefinition");
+  const queries = document.definitions.filter(x => x.kind === "OperationDefinition" && x.operation === "query");
+  const mutations = document.definitions.filter(x => x.kind === "OperationDefinition" && x.operation === "mutation");
+  const subscriptions = document.definitions.filter(x => x.kind === "OperationDefinition" && x.operation === "subscription");
+
+  if (fragments.length && !queries.length && !mutations.length) {
+    if (process.env.NODE_ENV === "production") {
+      throw new DataError("Fragment only", DataErrors.InvalidInput);
+    } else {
+      throw new DataError(`Passing only a fragment to 'graphql' is not supported. ` + `You must include a query or mutation as well`, DataErrors.InvalidInput);
+    }
+  }
+
+  if (subscriptions.length) {
+    if (process.env.NODE_ENV === "production") {
+      throw new DataError("No subscriptions", DataErrors.InvalidInput);
+    } else {
+      throw new DataError(`We do not support subscriptions. ` + `${JSON.stringify(document)} had ${subscriptions.length} subscriptions`, DataErrors.InvalidInput);
+    }
+  }
+
+  if (queries.length + mutations.length > 1) {
+    if (process.env.NODE_ENV === "production") {
+      throw new DataError("Too many ops", DataErrors.InvalidInput);
+    } else {
+      throw new DataError(`We only support one query or mutation per component. ` + `${JSON.stringify(document)} had ${queries.length} queries and ` + `${mutations.length} mutations. `, DataErrors.InvalidInput);
+    }
+  }
+
+  const type = queries.length ? DocumentTypes.query : DocumentTypes.mutation;
+  const definitions = queries.length ? queries : mutations;
+  const definition = definitions[0];
+  const variables = definition.variableDefinitions || [];
+  const name = ((_definition$name = definition.name) == null ? void 0 : _definition$name.kind) === "Name" ? definition.name.value : "data";
+  const payload = {
+    name,
+    type,
+    variables
+  };
+  cache.set(document, payload);
+  return payload;
+}
+
+const toGqlOperation = documentNode => {
+  const definition = graphQLDocumentNodeParser(documentNode);
+  const wbDataOperation = {
+    id: definition.name,
+    type: definition.type
+  };
+  return wbDataOperation;
+};
+
+const GqlRouterContext = React__namespace.createContext(null);
+
+const GqlRouter = ({
+  defaultContext: thisDefaultContext,
+  fetch: thisFetch,
+  children
+}) => {
+  const configuration = React__namespace.useMemo(() => ({
+    fetch: thisFetch,
+    defaultContext: thisDefaultContext
+  }), [thisDefaultContext, thisFetch]);
+  return React__namespace.createElement(GqlRouterContext.Provider, {
+    value: configuration
+  }, children);
+};
+
+const mergeGqlContext = (defaultContext, overrides) => {
+  return Object.keys(overrides).reduce((acc, key) => {
+    if (overrides[key] !== undefined) {
+      if (overrides[key] === null) {
+        delete acc[key];
+      } else {
+        acc[key] = overrides[key];
+      }
+    }
+
+    return acc;
+  }, _extends__default["default"]({}, defaultContext));
+};
+
+const useGqlRouterContext = (contextOverrides = {}) => {
+  const gqlRouterContext = React.useContext(GqlRouterContext);
+
+  if (gqlRouterContext == null) {
+    throw new GqlError("No GqlRouter", GqlErrors.Internal);
+  }
+
+  const {
+    fetch,
+    defaultContext
+  } = gqlRouterContext;
+  const contextRef = React.useRef(defaultContext);
+  const mergedContext = mergeGqlContext(defaultContext, contextOverrides);
+  const refKeys = Object.keys(contextRef.current);
+  const mergedKeys = Object.keys(mergedContext);
+  const shouldWeUpdateRef = refKeys.length !== mergedKeys.length || mergedKeys.every(key => contextRef.current[key] !== mergedContext[key]);
+
+  if (shouldWeUpdateRef) {
+    contextRef.current = mergedContext;
+  }
+
+  const finalContext = contextRef.current;
+  const finalRouterContext = React.useMemo(() => ({
+    fetch,
+    defaultContext: finalContext
+  }), [fetch, finalContext]);
+  return finalRouterContext;
+};
+
+const useGql = (context = {}) => {
+  const gqlRouterContext = useGqlRouterContext(context);
+  const gqlFetch = React.useCallback((operation, options = Object.freeze({})) => {
+    const {
+      fetch,
+      defaultContext
+    } = gqlRouterContext;
+    const {
+      variables,
+      context = {}
+    } = options;
+    const finalContext = mergeGqlContext(defaultContext, context);
+    return fetch(operation, variables, finalContext).then(getGqlDataFromResponse);
+  }, [gqlRouterContext]);
+  return gqlFetch;
+};
+
+exports.Data = Data;
+exports.DataError = DataError;
+exports.DataErrors = DataErrors;
+exports.FetchPolicy = FetchPolicy;
+exports.GqlError = GqlError;
+exports.GqlErrors = GqlErrors;
+exports.GqlRouter = GqlRouter;
+exports.InterceptRequests = InterceptRequests;
+exports.ScopedInMemoryCache = ScopedInMemoryCache;
+exports.SerializableInMemoryCache = SerializableInMemoryCache;
+exports.SharedCache = SharedCache;
+exports.Status = Status;
+exports.TrackData = TrackData;
+exports.WhenClientSide = WhenClientSide;
+exports.abortInflightRequests = abortInflightRequests;
+exports.fetchTrackedRequests = fetchTrackedRequests;
+exports.getGqlDataFromResponse = getGqlDataFromResponse;
+exports.getGqlRequestId = getGqlRequestId;
+exports.graphQLDocumentNodeParser = graphQLDocumentNodeParser;
+exports.hasTrackedRequestsToBeFetched = hasTrackedRequestsToBeFetched;
+exports.initializeHydrationCache = initializeHydrationCache;
+exports.purgeCaches = purgeCaches;
+exports.purgeHydrationCache = purgeHydrationCache;
+exports.toGqlOperation = toGqlOperation;
+exports.useCachedEffect = useCachedEffect;
+exports.useGql = useGql;
+exports.useHydratableEffect = useHydratableEffect;
+exports.useServerEffect = useServerEffect;
+exports.useSharedCache = useSharedCache;

package/dist/index.js.flow

@@ -0,0 +1,2 @@
+// @flow
+export * from "../src/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@khanacademy/wonder-blocks-data",
-  "version": "10.0.2",
+  "version": "10.0.4",
   "design": "v1",
   "publishConfig": {
     "access": "public"
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.6",
-    "@khanacademy/wonder-blocks-core": "^4.6.0"
+    "@khanacademy/wonder-blocks-core": "^4.6.2"
   },
   "peerDependencies": {
     "@khanacademy/wonder-stuff-core": "^1.0.1",
@@ -22,7 +22,7 @@
     "react": "16.14.0"
   },
   "devDependencies": {
-    "wb-dev-build-settings": "^0.5.0"
+    "wb-dev-build-settings": "^0.7.0"
   },
   "author": "",
   "license": "MIT"