@faasjs/react 0.0.3-beta.9 → 0.0.3-beta.90

package/README.md

@@ -10,7 +10,7 @@ React plugin for FaasJS.
 
 ## Install
 
-    npm install @faasjs/react
+    npm install @faasjs/react react react-dom
 
 ## Modules
 
@@ -20,14 +20,17 @@ React plugin for FaasJS.
 - [Response](classes/Response.md)
 - [ResponseError](classes/ResponseError.md)
 
+### Interfaces
+
+- [FaasDataInjection](interfaces/FaasDataInjection.md)
+- [FaasDataWrapperProps](interfaces/FaasDataWrapperProps.md)
+- [FaasReactClientInstance](interfaces/FaasReactClientInstance.md)
+
 ### Type Aliases
 
 - [FaasAction](#faasaction)
 - [FaasData](#faasdata)
-- [FaasDataInjection](#faasdatainjection)
-- [FaasDataWrapperProps](#faasdatawrapperprops)
 - [FaasParams](#faasparams)
-- [FaasReactClientInstance](#faasreactclientinstance)
 - [Options](#options)
 - [ResponseHeaders](#responseheaders)
 
@@ -59,60 +62,6 @@ ___
 
 ___
 
-### FaasDataInjection
-
-Ƭ **FaasDataInjection**<`Data`\>: `Object`
-
-Injects FaasData props.
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `Data` | `any` |
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `action` | `string` \| `any` |
-| `data` | `Data` |
-| `error` | `any` |
-| `loading` | `boolean` |
-| `params` | `Record`<`string`, `any`\> |
-| `promise` | `Promise`<[`Response`](classes/Response.md)<`Data`\>\> |
-| `setData` | `React.Dispatch`<`React.SetStateAction`<`Data`\>\> |
-| `setError` | `React.Dispatch`<`React.SetStateAction`<`any`\>\> |
-| `setLoading` | `React.Dispatch`<`React.SetStateAction`<`boolean`\>\> |
-| `setPromise` | `React.Dispatch`<`React.SetStateAction`<`Promise`<[`Response`](classes/Response.md)<`Data`\>\>\>\> |
-| `reload` | (`params?`: `Record`<`string`, `any`\>) => `Promise`<[`Response`](classes/Response.md)<`Data`\>\> |
-
-___
-
-### FaasDataWrapperProps
-
-Ƭ **FaasDataWrapperProps**<`PathOrData`\>: `Object`
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends [`FaasAction`](#faasaction) |
-
-#### Type declaration
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `action` | `string` | - |
-| `data?` | [`FaasData`](#faasdata)<`PathOrData`\> | use custom data, should work with setData |
-| `fallback?` | `JSX.Element` \| ``false`` | - |
-| `params?` | [`FaasParams`](#faasparams)<`PathOrData`\> | - |
-| `setData?` | `React.Dispatch`<`React.SetStateAction`<[`FaasData`](#faasdata)<`PathOrData`\>\>\> | use custom setData, should work with data |
-| `onDataChange?` | (`args`: [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>) => `void` | - |
-| `render?` | (`args`: [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>) => `Element` \| `Element`[] | - |
-
-___
-
 ### FaasParams
 
 Ƭ **FaasParams**<`T`\>: `T` extends `FaasActionPaths` ? `FaasActions`[`T`][``"Params"``] : `any`
@@ -125,20 +74,6 @@ ___
 
 ___
 
-### FaasReactClientInstance
-
-Ƭ **FaasReactClientInstance**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `faas` | <PathOrData\>(`action`: `string` \| `PathOrData`, `params`: [`FaasParams`](#faasparams)<`PathOrData`\>) => `Promise`<[`Response`](classes/Response.md)<[`FaasData`](#faasdata)<`PathOrData`\>\>\> |
-| `useFaas` | <PathOrData\>(`action`: `string` \| `PathOrData`, `defaultParams`: [`FaasParams`](#faasparams)<`PathOrData`\>) => [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\> |
-| `FaasDataWrapper` | <PathOrData\>(`props`: [`FaasDataWrapperProps`](#faasdatawrapperprops)<`PathOrData`\>) => `Element` |
-
-___
-
 ### Options
 
 Ƭ **Options**: `RequestInit` & { `beforeRequest?`: (`{
@@ -173,7 +108,7 @@ A data wrapper for react components
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`FaasDataWrapperProps`](#faasdatawrapperprops)<`PathOrData`\> |
+| `props` | [`FaasDataWrapperProps`](interfaces/FaasDataWrapperProps.md)<`PathOrData`\> |
 
 #### Returns
 
@@ -194,7 +129,7 @@ ___
 
 ### FaasReactClient
 
-▸ **FaasReactClient**(`__namedParameters`): [`FaasReactClientInstance`](#faasreactclientinstance)
+▸ **FaasReactClient**(`«destructured»`): [`FaasReactClientInstance`](interfaces/FaasReactClientInstance.md)
 
 Before use faas, you should initialize a FaasReactClient.
 
@@ -202,14 +137,14 @@ Before use faas, you should initialize a FaasReactClient.
 
 | Name | Type |
 | :------ | :------ |
-| `__namedParameters` | `Object` |
-| `__namedParameters.domain` | `string` |
-| `__namedParameters.onError?` | (`action`: `string`, `params`: `Record`<`string`, `any`\>) => (`res`: [`ResponseError`](classes/ResponseError.md)) => `Promise`<`void`\> |
-| `__namedParameters.options?` | [`Options`](#options) |
+| `«destructured»` | `Object` |
+| › `domain` | `string` |
+| › `onError?` | (`action`: `string`, `params`: `Record`<`string`, `any`\>) => (`res`: [`ResponseError`](classes/ResponseError.md)) => `Promise`<`void`\> |
+| › `options?` | [`Options`](#options) |
 
 #### Returns
 
-[`FaasReactClientInstance`](#faasreactclientinstance)
+[`FaasReactClientInstance`](interfaces/FaasReactClientInstance.md)
 
 ```ts
 const client = FaasReactClient({
@@ -252,7 +187,7 @@ ___
 
 ### getClient
 
-▸ **getClient**(`domain?`): [`FaasReactClientInstance`](#faasreactclientinstance)
+▸ **getClient**(`domain?`): [`FaasReactClientInstance`](interfaces/FaasReactClientInstance.md)
 
 Get FaasReactClient instance
 
@@ -264,7 +199,7 @@ Get FaasReactClient instance
 
 #### Returns
 
-[`FaasReactClientInstance`](#faasreactclientinstance)
+[`FaasReactClientInstance`](interfaces/FaasReactClientInstance.md)
 
 ```ts
 getClient()
@@ -276,7 +211,7 @@ ___
 
 ### useFaas
 
-▸ **useFaas**<`PathOrData`\>(`action`, `defaultParams`): [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>
+▸ **useFaas**<`PathOrData`\>(`action`, `defaultParams`, `options?`): [`FaasDataInjection`](interfaces/FaasDataInjection.md)<[`FaasData`](#faasdata)<`PathOrData`\>\>
 
 Request faas server with React hook
 
@@ -292,10 +227,14 @@ Request faas server with React hook
 | :------ | :------ | :------ |
 | `action` | `string` \| `PathOrData` | {string} action name |
 | `defaultParams` | [`FaasParams`](#faasparams)<`PathOrData`\> | {object} initial action params |
+| `options?` | `Object` | - |
+| `options.data?` | [`FaasData`](#faasdata)<`PathOrData`\> | - |
+| `options.setData?` | `Dispatch`<`SetStateAction`<[`FaasData`](#faasdata)<`PathOrData`\>\>\> | - |
+| `options.skip?` | `boolean` | - |
 
 #### Returns
 
-[`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>
+[`FaasDataInjection`](interfaces/FaasDataInjection.md)<[`FaasData`](#faasdata)<`PathOrData`\>\>
 
 ```ts
 function Post ({ id }) {

package/dist/index.d.mts

@@ -0,0 +1,122 @@
+import { Response, Options, ResponseError } from '@faasjs/browser';
+export { FaasBrowserClient, Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
+import { FaasAction, FaasData, FaasParams } from '@faasjs/types';
+export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
+
+/**
+ * Injects FaasData props.
+ */
+interface FaasDataInjection<Data = any> {
+    action: string | any;
+    params: Record<string, any>;
+    loading: boolean;
+    data: Data;
+    error: any;
+    promise: Promise<Response<Data>>;
+    reload(params?: Record<string, any>): Promise<Response<Data>>;
+    setData: React.Dispatch<React.SetStateAction<Data>>;
+    setLoading: React.Dispatch<React.SetStateAction<boolean>>;
+    setPromise: React.Dispatch<React.SetStateAction<Promise<Response<Data>>>>;
+    setError: React.Dispatch<React.SetStateAction<any>>;
+}
+interface FaasDataWrapperProps<PathOrData extends FaasAction> {
+    render?(args: FaasDataInjection<FaasData<PathOrData>>): JSX.Element | JSX.Element[];
+    children?: React.ReactElement<Partial<FaasDataInjection>>;
+    fallback?: JSX.Element | false;
+    action: string;
+    params?: FaasParams<PathOrData>;
+    onDataChange?(args: FaasDataInjection<FaasData<PathOrData>>): void;
+    /** use custom data, should work with setData */
+    data?: FaasData<PathOrData>;
+    /** use custom setData, should work with data */
+    setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>;
+}
+interface FaasReactClientInstance {
+    faas: <PathOrData extends FaasAction>(action: string | PathOrData, params: FaasParams<PathOrData>) => Promise<Response<FaasData<PathOrData>>>;
+    useFaas: <PathOrData extends FaasAction>(action: string | PathOrData, defaultParams: FaasParams<PathOrData>, options?: {
+        data?: FaasData<PathOrData>;
+        setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>;
+        skip?: boolean;
+    }) => FaasDataInjection<FaasData<PathOrData>>;
+    FaasDataWrapper<PathOrData extends FaasAction>(props: FaasDataWrapperProps<PathOrData>): JSX.Element;
+}
+/**
+ * Before use faas, you should initialize a FaasReactClient.
+ *
+ * @param props.domain {string} The domain of your faas server
+ * @param props.options {Options} The options of client
+ * @returns {FaasReactClientInstance}
+ *
+ * ```ts
+ * const client = FaasReactClient({
+ *   domain: 'localhost:8080/api'
+ * })
+ * ```
+ */
+declare function FaasReactClient({ domain, options, onError }: {
+    domain: string;
+    options?: Options;
+    onError?: (action: string, params: Record<string, any>) => (res: ResponseError) => Promise<void>;
+}): FaasReactClientInstance;
+/**
+ * Get FaasReactClient instance
+ * @param domain {string} empty string for default domain
+ * @returns {FaasReactClientInstance}
+ *
+ * ```ts
+ * getClient()
+ * // or
+ * getClient('another-domain')
+ * ```
+ */
+declare function getClient(domain?: string): FaasReactClientInstance;
+/**
+ * Request faas server
+ *
+ * @param action {string} action name
+ * @param params {object} action params
+ * @returns {Promise<Response<any>>}
+ *
+ * ```ts
+ * faas<{ title: string }>('post/get', { id: 1 }).then(res => {
+ *   console.log(res.data.title)
+ * })
+ * ```
+ */
+declare function faas<PathOrData extends FaasAction>(action: string | PathOrData, params: FaasParams<PathOrData>): Promise<Response<FaasData<PathOrData>>>;
+/**
+ * Request faas server with React hook
+ * @param action {string} action name
+ * @param defaultParams {object} initial action params
+ * @returns {FaasDataInjection<any>}
+ *
+ * ```ts
+ * function Post ({ id }) {
+ *   const { data } = useFaas<{ title: string }>('post/get', { id })
+ *   return <h1>{data.title}</h1>
+ * }
+ * ```
+ */
+declare function useFaas<PathOrData extends FaasAction>(action: string | PathOrData, defaultParams: FaasParams<PathOrData>, options?: {
+    data?: FaasData<PathOrData>;
+    setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>;
+    skip?: boolean;
+}): FaasDataInjection<FaasData<PathOrData>>;
+/**
+ * A data wrapper for react components
+ * @returns {JSX.Element}
+ *
+ * ```ts
+ * <FaasDataWrapper<{
+ *   id: string
+ *   title: string
+ * }>
+ *   action='post/get'
+ *   params={ { id: 1 } }
+ *   render={ ({ data }) => <h1>{ data.title }</h1> }
+ * />
+ * ```
+ */
+declare function FaasDataWrapper<PathOrData extends FaasAction>(props: FaasDataWrapperProps<PathOrData>): JSX.Element;
+
+export { FaasDataInjection, FaasDataWrapper, FaasDataWrapperProps, FaasReactClient, FaasReactClientInstance, faas, getClient, useFaas };

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 /**
  * Injects FaasData props.
  */
-type FaasDataInjection<Data = any> = {
+interface FaasDataInjection<Data = any> {
     action: string | any;
     params: Record<string, any>;
     loading: boolean;
@@ -18,9 +18,10 @@ type FaasDataInjection<Data = any> = {
     setLoading: React.Dispatch<React.SetStateAction<boolean>>;
     setPromise: React.Dispatch<React.SetStateAction<Promise<Response<Data>>>>;
     setError: React.Dispatch<React.SetStateAction<any>>;
-};
-type FaasDataWrapperProps<PathOrData extends FaasAction> = {
+}
+interface FaasDataWrapperProps<PathOrData extends FaasAction> {
     render?(args: FaasDataInjection<FaasData<PathOrData>>): JSX.Element | JSX.Element[];
+    children?: React.ReactElement<Partial<FaasDataInjection>>;
     fallback?: JSX.Element | false;
     action: string;
     params?: FaasParams<PathOrData>;
@@ -29,8 +30,8 @@ type FaasDataWrapperProps<PathOrData extends FaasAction> = {
     data?: FaasData<PathOrData>;
     /** use custom setData, should work with data */
     setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>;
-};
-type FaasReactClientInstance = {
+}
+interface FaasReactClientInstance {
     faas: <PathOrData extends FaasAction>(action: string | PathOrData, params: FaasParams<PathOrData>) => Promise<Response<FaasData<PathOrData>>>;
     useFaas: <PathOrData extends FaasAction>(action: string | PathOrData, defaultParams: FaasParams<PathOrData>, options?: {
         data?: FaasData<PathOrData>;
@@ -38,7 +39,7 @@ type FaasReactClientInstance = {
         skip?: boolean;
     }) => FaasDataInjection<FaasData<PathOrData>>;
     FaasDataWrapper<PathOrData extends FaasAction>(props: FaasDataWrapperProps<PathOrData>): JSX.Element;
-};
+}
 /**
  * Before use faas, you should initialize a FaasReactClient.
  *

package/dist/index.js

@@ -1,41 +1,16 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+'use strict';
+
+var browser = require('@faasjs/browser');
+var react = require('react');
 
 // src/index.tsx
-var src_exports = {};
-__export(src_exports, {
-  FaasDataWrapper: () => FaasDataWrapper,
-  FaasReactClient: () => FaasReactClient,
-  faas: () => faas,
-  getClient: () => getClient,
-  useFaas: () => useFaas
-});
-module.exports = __toCommonJS(src_exports);
-var import_browser = require("@faasjs/browser");
-var import_react = require("react");
 var clients = {};
 function FaasReactClient({
   domain,
   options,
   onError
 }) {
-  const client = new import_browser.FaasBrowserClient(domain, options);
+  const client = new browser.FaasBrowserClient(domain, options);
   async function faas2(action, params) {
     if (onError)
       return client.action(action, params).catch(async (res) => {
@@ -47,40 +22,55 @@ function FaasReactClient({
   function useFaas2(action, defaultParams, options2) {
     if (!options2)
       options2 = {};
-    const [loading, setLoading] = (0, import_react.useState)(true);
-    const [data, setData] = (0, import_react.useState)();
-    const [error, setError] = (0, import_react.useState)();
-    const [promise, setPromise] = (0, import_react.useState)();
-    const [params, setParams] = (0, import_react.useState)(defaultParams);
-    const [reloadTimes, setReloadTimes] = (0, import_react.useState)(0);
-    (0, import_react.useEffect)(function() {
+    const [loading, setLoading] = react.useState(true);
+    const [data, setData] = react.useState();
+    const [error, setError] = react.useState();
+    const [promise, setPromise] = react.useState();
+    const [params, setParams] = react.useState(defaultParams);
+    const [reloadTimes, setReloadTimes] = react.useState(0);
+    const [fails, setFails] = react.useState(0);
+    react.useEffect(function() {
       if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
         setParams(defaultParams);
       }
     }, [JSON.stringify(defaultParams)]);
-    (0, import_react.useEffect)(function() {
-      if (options2 == null ? void 0 : options2.skip) {
+    react.useEffect(function() {
+      if (!action || (options2 == null ? void 0 : options2.skip)) {
         setLoading(false);
         return;
       }
       setLoading(true);
-      const request = client.action(action, params);
-      setPromise(request);
-      request.then((r) => (options2 == null ? void 0 : options2.setData) ? options2.setData(r.data) : setData(r.data)).catch(async (e) => {
-        if (onError)
-          try {
-            await onError(action, params)(e);
-          } catch (error2) {
-            setError(error2);
+      const controller = new AbortController();
+      function send() {
+        const request = client.action(action, options2.params || params, { signal: controller.signal });
+        setPromise(request);
+        request.then((r) => (options2 == null ? void 0 : options2.setData) ? options2.setData(r.data) : setData(r.data)).catch(async (e) => {
+          if ((e == null ? void 0 : e.message) === "The user aborted a request." || (e == null ? void 0 : e.message) === "Aborted")
+            return;
+          if (!fails && typeof (e == null ? void 0 : e.message) === "string" && e.message.indexOf("Failed to fetch") >= 0) {
+            console.warn(`FaasReactClient: ${e.message} retry...`);
+            setFails(1);
+            return send();
           }
-        else
-          setError(e);
-        return Promise.reject(e);
-      }).finally(() => setLoading(false));
-      return () => setLoading(false);
+          if (onError)
+            try {
+              await onError(action, params)(e);
+            } catch (error2) {
+              setError(error2);
+            }
+          else
+            setError(e);
+          return Promise.reject(e);
+        }).finally(() => setLoading(false));
+      }
+      send();
+      return () => {
+        controller.abort();
+        setLoading(false);
+      };
     }, [
       action,
-      JSON.stringify(params),
+      JSON.stringify(options2.params || params),
       reloadTimes,
       options2.skip
     ]);
@@ -111,6 +101,7 @@ function FaasReactClient({
       params,
       fallback,
       render,
+      children,
       onDataChange,
       data,
       setData
@@ -119,17 +110,21 @@ function FaasReactClient({
         data,
         setData
       });
-      const [loaded, setLoaded] = (0, import_react.useState)(false);
-      (0, import_react.useEffect)(function() {
+      const [loaded, setLoaded] = react.useState(false);
+      react.useEffect(function() {
         if (!loaded && !request.loading)
           setLoaded(true);
       }, [request.loading]);
-      (0, import_react.useEffect)(function() {
+      react.useEffect(function() {
         if (onDataChange)
           onDataChange(request);
       }, [JSON.stringify(request.data)]);
-      if (loaded)
-        return render(request);
+      if (loaded) {
+        if (children)
+          return react.cloneElement(children, request);
+        if (render)
+          return render(request);
+      }
       return fallback || null;
     }
   };
@@ -149,21 +144,23 @@ function useFaas(action, defaultParams, options) {
   return getClient().useFaas(action, defaultParams, options);
 }
 function FaasDataWrapper(props) {
-  const [client, setClient] = (0, import_react.useState)();
-  (0, import_react.useEffect)(() => {
+  const [client, setClient] = react.useState();
+  react.useEffect(() => {
     if (client)
       return;
     setClient(getClient());
   }, []);
   if (!client)
     return props.fallback || null;
-  return (0, import_react.createElement)(client.FaasDataWrapper, props);
+  return react.createElement(client.FaasDataWrapper, props);
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  FaasDataWrapper,
-  FaasReactClient,
-  faas,
-  getClient,
-  useFaas
+
+Object.defineProperty(exports, 'FaasBrowserClient', {
+  enumerable: true,
+  get: function () { return browser.FaasBrowserClient; }
 });
+exports.FaasDataWrapper = FaasDataWrapper;
+exports.FaasReactClient = FaasReactClient;
+exports.faas = faas;
+exports.getClient = getClient;
+exports.useFaas = useFaas;

package/dist/index.mjs

@@ -1,12 +1,8 @@
+import { FaasBrowserClient } from '@faasjs/browser';
+export { FaasBrowserClient } from '@faasjs/browser';
+import { useState, useEffect, createElement, cloneElement } from 'react';
+
 // src/index.tsx
-import {
-  FaasBrowserClient
-} from "@faasjs/browser";
-import {
-  useState,
-  useEffect,
-  createElement
-} from "react";
 var clients = {};
 function FaasReactClient({
   domain,
@@ -31,34 +27,49 @@ function FaasReactClient({
     const [promise, setPromise] = useState();
     const [params, setParams] = useState(defaultParams);
     const [reloadTimes, setReloadTimes] = useState(0);
+    const [fails, setFails] = useState(0);
     useEffect(function() {
       if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
         setParams(defaultParams);
       }
     }, [JSON.stringify(defaultParams)]);
     useEffect(function() {
-      if (options2 == null ? void 0 : options2.skip) {
+      if (!action || (options2 == null ? void 0 : options2.skip)) {
         setLoading(false);
         return;
       }
       setLoading(true);
-      const request = client.action(action, params);
-      setPromise(request);
-      request.then((r) => (options2 == null ? void 0 : options2.setData) ? options2.setData(r.data) : setData(r.data)).catch(async (e) => {
-        if (onError)
-          try {
-            await onError(action, params)(e);
-          } catch (error2) {
-            setError(error2);
+      const controller = new AbortController();
+      function send() {
+        const request = client.action(action, options2.params || params, { signal: controller.signal });
+        setPromise(request);
+        request.then((r) => (options2 == null ? void 0 : options2.setData) ? options2.setData(r.data) : setData(r.data)).catch(async (e) => {
+          if ((e == null ? void 0 : e.message) === "The user aborted a request." || (e == null ? void 0 : e.message) === "Aborted")
+            return;
+          if (!fails && typeof (e == null ? void 0 : e.message) === "string" && e.message.indexOf("Failed to fetch") >= 0) {
+            console.warn(`FaasReactClient: ${e.message} retry...`);
+            setFails(1);
+            return send();
           }
-        else
-          setError(e);
-        return Promise.reject(e);
-      }).finally(() => setLoading(false));
-      return () => setLoading(false);
+          if (onError)
+            try {
+              await onError(action, params)(e);
+            } catch (error2) {
+              setError(error2);
+            }
+          else
+            setError(e);
+          return Promise.reject(e);
+        }).finally(() => setLoading(false));
+      }
+      send();
+      return () => {
+        controller.abort();
+        setLoading(false);
+      };
     }, [
       action,
-      JSON.stringify(params),
+      JSON.stringify(options2.params || params),
       reloadTimes,
       options2.skip
     ]);
@@ -89,6 +100,7 @@ function FaasReactClient({
       params,
       fallback,
       render,
+      children,
       onDataChange,
       data,
       setData
@@ -106,8 +118,12 @@ function FaasReactClient({
         if (onDataChange)
           onDataChange(request);
       }, [JSON.stringify(request.data)]);
-      if (loaded)
-        return render(request);
+      if (loaded) {
+        if (children)
+          return cloneElement(children, request);
+        if (render)
+          return render(request);
+      }
       return fallback || null;
     }
   };
@@ -137,10 +153,5 @@ function FaasDataWrapper(props) {
     return props.fallback || null;
   return createElement(client.FaasDataWrapper, props);
 }
-export {
-  FaasDataWrapper,
-  FaasReactClient,
-  faas,
-  getClient,
-  useFaas
-};
+
+export { FaasDataWrapper, FaasReactClient, faas, getClient, useFaas };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/react",
-  "version": "0.0.3-beta.9",
+  "version": "0.0.3-beta.90",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -16,15 +16,15 @@
   },
   "funding": "https://github.com/sponsors/faasjs",
   "scripts": {
-    "build": "tsup src/index.tsx --format esm,cjs",
-    "build:types": "tsup-node src/index.tsx --dts-only"
+    "build": "tsup src/index.tsx --config ../../tsup.config.json"
   },
   "files": [
     "dist"
   ],
   "dependencies": {
-    "@faasjs/browser": "^0.0.3-beta.9",
-    "@faasjs/types": "^0.0.3-beta.9",
+    "@faasjs/browser": "^0.0.3-beta.90"
+  },
+  "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {