@faasjs/react 0.0.3-beta.3 → 0.0.3-beta.31

package/README.md

@@ -104,6 +104,7 @@ ___
 | Name | Type | Description |
 | :------ | :------ | :------ |
 | `action` | `string` | - |
+| `children?` | `JSX.Element` | - |
 | `data?` | [`FaasData`](#faasdata)<`PathOrData`\> | use custom data, should work with setData |
 | `fallback?` | `JSX.Element` \| ``false`` | - |
 | `params?` | [`FaasParams`](#faasparams)<`PathOrData`\> | - |
@@ -134,7 +135,7 @@ ___
 | 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`\>\> |
+| `useFaas` | <PathOrData\>(`action`: `string` \| `PathOrData`, `defaultParams`: [`FaasParams`](#faasparams)<`PathOrData`\>, `options?`: { `data?`: [`FaasData`](#faasdata)<`PathOrData`\> ; `setData?`: `React.Dispatch`<`React.SetStateAction`<[`FaasData`](#faasdata)<`PathOrData`\>\>\> ; `skip?`: `boolean`  }) => [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\> |
 | `FaasDataWrapper` | <PathOrData\>(`props`: [`FaasDataWrapperProps`](#faasdatawrapperprops)<`PathOrData`\>) => `Element` |
 
 ___
@@ -194,7 +195,7 @@ ___
 
 ### FaasReactClient
 
-▸ **FaasReactClient**(`__namedParameters`): [`FaasReactClientInstance`](#faasreactclientinstance)
+▸ **FaasReactClient**(`«destructured»`): [`FaasReactClientInstance`](#faasreactclientinstance)
 
 Before use faas, you should initialize a FaasReactClient.
 
@@ -202,10 +203,10 @@ 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
 
@@ -276,7 +277,7 @@ ___
 
 ### useFaas
 
-▸ **useFaas**<`PathOrData`\>(`action`, `defaultParams`): [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>
+▸ **useFaas**<`PathOrData`\>(`action`, `defaultParams`, `options?`): [`FaasDataInjection`](#faasdatainjection)<[`FaasData`](#faasdata)<`PathOrData`\>\>
 
 Request faas server with React hook
 
@@ -292,6 +293,10 @@ 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
 

package/dist/index.d.ts

@@ -21,6 +21,7 @@ type FaasDataInjection<Data = any> = {
 };
 type FaasDataWrapperProps<PathOrData extends FaasAction> = {
     render?(args: FaasDataInjection<FaasData<PathOrData>>): JSX.Element | JSX.Element[];
+    children?: JSX.Element;
     fallback?: JSX.Element | false;
     action: string;
     params?: FaasParams<PathOrData>;

package/dist/index.js

@@ -64,9 +64,12 @@ function FaasReactClient({
         return;
       }
       setLoading(true);
-      const request = client.action(action, params);
+      const controller = new AbortController();
+      const request = client.action(action, 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.")
+          return;
         if (onError)
           try {
             await onError(action, params)(e);
@@ -77,7 +80,10 @@ function FaasReactClient({
           setError(e);
         return Promise.reject(e);
       }).finally(() => setLoading(false));
-      return () => setLoading(false);
+      return () => {
+        controller.abort();
+        setLoading(false);
+      };
     }, [
       action,
       JSON.stringify(params),
@@ -111,6 +117,7 @@ function FaasReactClient({
       params,
       fallback,
       render,
+      children,
       onDataChange,
       data,
       setData
@@ -128,8 +135,12 @@ function FaasReactClient({
         if (onDataChange)
           onDataChange(request);
       }, [JSON.stringify(request.data)]);
-      if (loaded)
-        return render(request);
+      if (loaded) {
+        if (children)
+          return (0, import_react.cloneElement)(children, request);
+        if (render)
+          return render(request);
+      }
       return fallback || null;
     }
   };

package/dist/index.mjs

@@ -5,7 +5,8 @@ import {
 import {
   useState,
   useEffect,
-  createElement
+  createElement,
+  cloneElement
 } from "react";
 var clients = {};
 function FaasReactClient({
@@ -42,9 +43,12 @@ function FaasReactClient({
         return;
       }
       setLoading(true);
-      const request = client.action(action, params);
+      const controller = new AbortController();
+      const request = client.action(action, 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.")
+          return;
         if (onError)
           try {
             await onError(action, params)(e);
@@ -55,7 +59,10 @@ function FaasReactClient({
           setError(e);
         return Promise.reject(e);
       }).finally(() => setLoading(false));
-      return () => setLoading(false);
+      return () => {
+        controller.abort();
+        setLoading(false);
+      };
     }, [
       action,
       JSON.stringify(params),
@@ -89,6 +96,7 @@ function FaasReactClient({
       params,
       fallback,
       render,
+      children,
       onDataChange,
       data,
       setData
@@ -106,8 +114,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;
     }
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/react",
-  "version": "0.0.3-beta.3",
+  "version": "0.0.3-beta.31",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -23,8 +23,8 @@
     "dist"
   ],
   "dependencies": {
-    "@faasjs/browser": "^0.0.3-beta.3",
-    "@faasjs/types": "^0.0.3-beta.3",
+    "@faasjs/browser": "^0.0.3-beta.31",
+    "@faasjs/types": "^0.0.3-beta.31",
     "react": "*"
   },
   "devDependencies": {