@faasjs/react 1.4.2 → 1.6.0

package/README.md

@@ -1,11 +1,10 @@
 # @faasjs/react
 
-[![License: MIT](https://img.shields.io/npm/l/@faasjs/react.svg)](https://github.com/faasjs/faasjs/blob/main/packages/faasjs/react/LICENSE)
-[![NPM Stable Version](https://img.shields.io/npm/v/@faasjs/react/stable.svg)](https://www.npmjs.com/package/@faasjs/react)
-[![NPM Beta Version](https://img.shields.io/npm/v/@faasjs/react/beta.svg)](https://www.npmjs.com/package/@faasjs/react)
-
 React plugin for FaasJS.
 
+[![License: MIT](https://img.shields.io/npm/l/@faasjs/react.svg)](https://github.com/faasjs/faasjs/blob/main/packages/faasjs/react/LICENSE)
+[![NPM Version](https://img.shields.io/npm/v/@faasjs/react.svg)](https://www.npmjs.com/package/@faasjs/react)
+
 **If you use [SWR](https://swr.vercel.app) or [React Query / TanStack Query](https://tanstack.com/query), please use [`@faasjs/browser`](https://faasjs.com/doc/browser) directly.**
 
 ## Install
@@ -25,6 +24,7 @@ const client = FaasReactClient({
   domain: 'localhost:8080/api'
 })
 ```
+
 2. Use [faas](#faas), [useFaas](#usefaas) or [FaasDataWrapper](#faasdatawrapper).
 
 ## Usage with [@preact/signal-react](https://github.com/preactjs/signals/blob/main/packages/react/README.md)
@@ -38,456 +38,38 @@ const client = FaasReactClient({
 ```
 3. Add `import '@preact/signals-react/auto'` to your test files.
 
-## Modules
-
-### Classes
+## Classes
 
 - [ErrorBoundary](classes/ErrorBoundary.md)
 - [Response](classes/Response.md)
 - [ResponseError](classes/ResponseError.md)
 
-### Interfaces
+## Interfaces
 
 - [ErrorBoundaryProps](interfaces/ErrorBoundaryProps.md)
 
-### Type Aliases
-
-- [ErrorChildrenProps](#errorchildrenprops)
-- [FaasAction](#faasaction)
-- [FaasData](#faasdata)
-- [FaasDataInjection](#faasdatainjection)
-- [FaasDataWrapperProps](#faasdatawrapperprops)
-- [FaasParams](#faasparams)
-- [FaasReactClientInstance](#faasreactclientinstance)
-- [FaasReactClientOptions](#faasreactclientoptions)
-- [Options](#options)
-- [ResponseHeaders](#responseheaders)
-- [SignalOptions](#signaloptions)
-- [useFaasOptions](#usefaasoptions)
-
-### Functions
-
-- [FaasDataWrapper](#faasdatawrapper)
-- [FaasReactClient](#faasreactclient)
-- [faas](#faas)
-- [getClient](#getclient)
-- [signal](#signal)
-- [useFaas](#usefaas)
-- [useSignalState](#usesignalstate)
-
 ## Type Aliases
 
-### ErrorChildrenProps
-
-Ƭ **ErrorChildrenProps**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `error?` | `Error` |
-| `errorDescription?` | `string` |
-| `errorMessage?` | `string` |
-| `info?` | `any` |
-
-___
-
-### FaasAction
-
-Ƭ **FaasAction**: `FaasActionPaths` \| `Record`\<`string`, `any`\>
-
-___
-
-### FaasData
-
-Ƭ **FaasData**\<`T`\>: `T` extends `FaasActionPaths` ? `FaasActions`[`T`][``"Data"``] : `T`
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `T` | `any` |
-
-___
-
-### 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`\<`Data`\>\> |
-| `reloadTimes` | `number` |
-| `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`\<`Data`\>\>\>\> |
-| `reload` | (`params?`: `Record`\<`string`, `any`\>) => `Promise`\<`any`\> |
-
-___
-
-### FaasDataWrapperProps
-
-Ƭ **FaasDataWrapperProps**\<`PathOrData`\>: `Object`
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends `FaasAction` |
-
-#### Type declaration
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `action` | `string` | - |
-| `children?` | `React.ReactElement`\<`Partial`\<[`FaasDataInjection`](#faasdatainjection)\>\> | - |
-| `data?` | `FaasData`\<`PathOrData`\> | use custom data, should work with setData |
-| `fallback?` | `JSX.Element` \| ``false`` | - |
-| `params?` | `FaasParams`\<`PathOrData`\> | - |
-| `setData?` | `React.Dispatch`\<`React.SetStateAction`\<`FaasData`\<`PathOrData`\>\>\> | use custom setData, should work with data |
-| `onDataChange?` | (`args`: [`FaasDataInjection`](#faasdatainjection)\<`FaasData`\<`PathOrData`\>\>) => `void` | - |
-| `render?` | (`args`: [`FaasDataInjection`](#faasdatainjection)\<`FaasData`\<`PathOrData`\>\>) => `Element` \| `Element`[] | - |
-
-___
-
-### FaasParams
-
-Ƭ **FaasParams**\<`T`\>: `T` extends `FaasActionPaths` ? `FaasActions`[`T`][``"Params"``] : `any`
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `T` | `any` |
-
-___
-
-### FaasReactClientInstance
-
-Ƭ **FaasReactClientInstance**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `faas` | \<PathOrData\>(`action`: `string` \| `PathOrData`, `params`: `FaasParams`\<`PathOrData`\>) => `Promise`\<`Response`\<`FaasData`\<`PathOrData`\>\>\> |
-| `id` | `string` |
-| `useFaas` | \<PathOrData\>(`action`: `string` \| `PathOrData`, `defaultParams`: `FaasParams`\<`PathOrData`\>, `options?`: [`useFaasOptions`](#usefaasoptions)\<`PathOrData`\>) => [`FaasDataInjection`](#faasdatainjection)\<`FaasData`\<`PathOrData`\>\> |
-| `FaasDataWrapper` | \<PathOrData\>(`props`: [`FaasDataWrapperProps`](#faasdatawrapperprops)\<`PathOrData`\>) => `Element` |
-
-___
-
-### FaasReactClientOptions
-
-Ƭ **FaasReactClientOptions**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `domain` | `string` |
-| `onError?` | (`action`: `string`, `params`: `Record`\<`string`, `any`\>) => (`res`: [`ResponseError`](classes/ResponseError.md)) => `Promise`\<`void`\> |
-| `options?` | [`Options`](#options) |
-
-___
-
-### Options
-
-Ƭ **Options**: `RequestInit` & \{ `beforeRequest?`: (`{
-    action,
-    params,
-    options,
-    headers,
-  }`: \{ `action`: `string` ; `headers`: `Record`\<`string`, `string`\> ; `options`: [`Options`](#options) ; `params`: `Record`\<`string`, `any`\>  }) => `Promise`\<`void`\> ; `headers?`: `Record`\<`string`, `string`\> ; `request?`: \<PathOrData\>(`url`: `string`, `options`: [`Options`](#options)) => `Promise`\<[`Response`](classes/Response.md)\<[`FaasData`](#faasdata)\<`PathOrData`\>\>\>  }
-
-___
-
-### ResponseHeaders
-
-Ƭ **ResponseHeaders**: `Object`
-
-#### Index signature
-
-▪ [key: `string`]: `string`
-
-___
-
-### SignalOptions
-
-Ƭ **SignalOptions**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `debugName?` | `string` |
-
-___
-
-### useFaasOptions
-
-Ƭ **useFaasOptions**\<`PathOrData`\>: `Object`
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends `FaasAction` |
-
-#### Type declaration
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `data?` | `FaasData`\<`PathOrData`\> | - |
-| `debounce?` | `number` | send the last request after milliseconds |
-| `params?` | `FaasParams`\<`PathOrData`\> | - |
-| `setData?` | `React.Dispatch`\<`React.SetStateAction`\<`FaasData`\<`PathOrData`\>\>\> | - |
-| `skip?` | `boolean` \| (`params`: `FaasParams`\<`PathOrData`\>) => `boolean` | if skip is true, will not send request |
+- [ErrorChildrenProps](type-aliases/ErrorChildrenProps.md)
+- [FaasAction](type-aliases/FaasAction.md)
+- [FaasData](type-aliases/FaasData.md)
+- [FaasDataInjection](type-aliases/FaasDataInjection.md)
+- [FaasDataWrapperProps](type-aliases/FaasDataWrapperProps.md)
+- [FaasParams](type-aliases/FaasParams.md)
+- [FaasReactClientInstance](type-aliases/FaasReactClientInstance.md)
+- [FaasReactClientOptions](type-aliases/FaasReactClientOptions.md)
+- [Options](type-aliases/Options.md)
+- [ResponseHeaders](type-aliases/ResponseHeaders.md)
+- [SignalOptions](type-aliases/SignalOptions.md)
+- [useFaasOptions](type-aliases/useFaasOptions.md)
 
 ## Functions
 
-### FaasDataWrapper
-
-▸ **FaasDataWrapper**\<`PathOrData`\>(`props`): `JSX.Element`
-
-A data wrapper for react components
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends `Record`\<`string`, `any`\> |
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `props` | [`FaasDataWrapperProps`](#faasdatawrapperprops)\<`PathOrData`\> |
-
-#### Returns
-
-`JSX.Element`
-
-**`Example`**
-
-```tsx
-<FaasDataWrapper<{
-  id: string
-  title: string
-}>
-  action='post/get'
-  params={ { id: 1 } }
-  render={ ({ data }) => <h1>{ data.title }</h1> }
-/>
-```
-
-___
-
-### FaasReactClient
-
-▸ **FaasReactClient**(`«destructured»`): [`FaasReactClientInstance`](#faasreactclientinstance)
-
-Before use faas, you should initialize a FaasReactClient.
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `«destructured»` | [`FaasReactClientOptions`](#faasreactclientoptions) |
-
-#### Returns
-
-[`FaasReactClientInstance`](#faasreactclientinstance)
-
-**`Example`**
-
-```ts
-const client = FaasReactClient({
-  domain: 'localhost:8080/api'
-})
-```
-
-___
-
-### faas
-
-▸ **faas**\<`PathOrData`\>(`action`, `params`): `Promise`\<[`Response`](classes/Response.md)\<[`FaasData`](#faasdata)\<`PathOrData`\>\>\>
-
-Request faas server
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends `Record`\<`string`, `any`\> |
-
-#### Parameters
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `action` | `string` \| `PathOrData` | {string} action name |
-| `params` | [`FaasParams`](#faasparams)\<`PathOrData`\> | {object} action params |
-
-#### Returns
-
-`Promise`\<[`Response`](classes/Response.md)\<[`FaasData`](#faasdata)\<`PathOrData`\>\>\>
-
-**`Example`**
-
-```ts
-faas<{ title: string }>('post/get', { id: 1 }).then(res => {
-  console.log(res.data.title)
-})
-```
-
-___
-
-### getClient
-
-▸ **getClient**(`domain?`): [`FaasReactClientInstance`](#faasreactclientinstance)
-
-Get FaasReactClient instance
-
-#### Parameters
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `domain?` | `string` | {string} empty string for default domain |
-
-#### Returns
-
-[`FaasReactClientInstance`](#faasreactclientinstance)
-
-**`Example`**
-
-```ts
-getClient()
-// or
-getClient('another-domain')
-```
-
-___
-
-### signal
-
-▸ **signal**\<`T`\>(`initialValue`, `options?`): `Signal`\<`T`\>
-
-Create a [signal](https://preactjs.com/guide/v10/signals) with options
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `T` | `any` |
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `initialValue` | `any` |
-| `options` | [`SignalOptions`](#signaloptions) |
-
-#### Returns
-
-`Signal`\<`T`\>
-
-**`Example`**
-
-```ts
-import { signal } from '@faasjs/react'
-
-const count = signal(0, { debugName: 'count' })
-
-count.value = 1
-```
-
-___
-
-### useFaas
-
-▸ **useFaas**\<`PathOrData`\>(`action`, `defaultParams`, `options?`): [`FaasDataInjection`](#faasdatainjection)\<[`FaasData`](#faasdata)\<`PathOrData`\>\>
-
-Request faas server with React hook
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `PathOrData` | extends `Record`\<`string`, `any`\> |
-
-#### Parameters
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `action` | `string` \| `PathOrData` | {string} action name |
-| `defaultParams` | [`FaasParams`](#faasparams)\<`PathOrData`\> | {object} initial action params |
-| `options?` | [`useFaasOptions`](#usefaasoptions)\<`PathOrData`\> | - |
-
-#### Returns
-
-[`FaasDataInjection`](#faasdatainjection)\<[`FaasData`](#faasdata)\<`PathOrData`\>\>
-
-**`Example`**
-
-```tsx
-function Post ({ id }) {
-  const { data } = useFaas<{ title: string }>('post/get', { id })
-  return <h1>{data.title}</h1>
-}
-```
-
-___
-
-### useSignalState
-
-▸ **useSignalState**\<`T`\>(`initialValue`, `options?`): readonly [`T`, (`changes`: `SetStateAction`\<`T`\>) => `void`]
-
-Create a [signal](https://preactjs.com/guide/v10/signals) like useState.
-
-```tsx
-import { useSignalState, useSignalEffect } from '@faasjs/react'
-
-function App () {
-  const [count, setCount] = useSignalState(0, { debugName: 'count' })
-
-  useSignalEffect(() => console.log('count', count))
-
-  return <div>
-    <button onClick={() => setCount(count + 1)}>+</button>
-    <span>{count}</span>
-  </div>
-}
-```
-
-#### Type parameters
-
-| Name | Type |
-| :------ | :------ |
-| `T` | `any` |
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `initialValue` | `T` |
-| `options` | [`SignalOptions`](#signaloptions) |
-
-#### Returns
-
-readonly [`T`, (`changes`: `SetStateAction`\<`T`\>) => `void`]
+- [FaasDataWrapper](functions/FaasDataWrapper.md)
+- [FaasReactClient](functions/FaasReactClient.md)
+- [faas](functions/faas.md)
+- [getClient](functions/getClient.md)
+- [signal](functions/signal.md)
+- [useConstant](functions/useConstant.md)
+- [useFaas](functions/useFaas.md)
+- [useSignalState](functions/useSignalState.md)

package/dist/index.d.mts

@@ -8,6 +8,11 @@ import * as _preact_signals_core from '@preact/signals-core';
 export { batch, computed, effect, signal as originSignal } from '@preact/signals-react';
 export { useSignal as originUseSignal, useComputed, useSignalEffect, useSignals } from '@preact/signals-react/runtime';
 
+/**
+ * Returns a constant value that is created by the given function.
+ */
+declare function useConstant<T>(fn: () => T): T;
+
 type FaasReactClientInstance = {
   id: string
   faas: <PathOrData extends FaasAction>(
@@ -212,4 +217,4 @@ declare function signal<T = any>(initialValue: any, options?: SignalOptions): _p
  */
 declare function useSignalState<T = any>(initialValue: T, options?: SignalOptions): readonly [T, (changes: SetStateAction<T>) => void];
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type SignalOptions, faas, getClient, signal, useFaas, type useFaasOptions, useSignalState };
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type SignalOptions, faas, getClient, signal, useConstant, useFaas, type useFaasOptions, useSignalState };

package/dist/index.d.ts

@@ -8,6 +8,11 @@ import * as _preact_signals_core from '@preact/signals-core';
 export { batch, computed, effect, signal as originSignal } from '@preact/signals-react';
 export { useSignal as originUseSignal, useComputed, useSignalEffect, useSignals } from '@preact/signals-react/runtime';
 
+/**
+ * Returns a constant value that is created by the given function.
+ */
+declare function useConstant<T>(fn: () => T): T;
+
 type FaasReactClientInstance = {
   id: string
   faas: <PathOrData extends FaasAction>(
@@ -212,4 +217,4 @@ declare function signal<T = any>(initialValue: any, options?: SignalOptions): _p
  */
 declare function useSignalState<T = any>(initialValue: T, options?: SignalOptions): readonly [T, (changes: SetStateAction<T>) => void];
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type SignalOptions, faas, getClient, signal, useFaas, type useFaasOptions, useSignalState };
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type SignalOptions, faas, getClient, signal, useConstant, useFaas, type useFaasOptions, useSignalState };

package/dist/index.js

@@ -6,7 +6,14 @@ var jsxRuntime = require('react/jsx-runtime');
 var signalsReact = require('@preact/signals-react');
 var runtime = require('@preact/signals-react/runtime');
 
-// src/client.tsx
+// src/constant.ts
+function useConstant(fn) {
+  const ref = react.useRef();
+  if (!ref.current) {
+    ref.current = { v: fn() };
+  }
+  return ref.current.v;
+}
 var clients = {};
 function FaasReactClient({
   domain,
@@ -271,5 +278,6 @@ exports.FaasReactClient = FaasReactClient;
 exports.faas = faas;
 exports.getClient = getClient;
 exports.signal = signal;
+exports.useConstant = useConstant;
 exports.useFaas = useFaas;
 exports.useSignalState = useSignalState;

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { useState, useEffect, cloneElement, Component } from 'react';
+import { useRef, useState, useEffect, cloneElement, Component } from 'react';
 import { FaasBrowserClient } from '@faasjs/browser';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { signal as signal$1, effect } from '@preact/signals-react';
@@ -6,7 +6,14 @@ export { batch, computed, effect, signal as originSignal } from '@preact/signals
 import { useSignal, useSignalEffect } from '@preact/signals-react/runtime';
 export { useSignal as originUseSignal, useComputed, useSignalEffect, useSignals } from '@preact/signals-react/runtime';
 
-// src/client.tsx
+// src/constant.ts
+function useConstant(fn) {
+  const ref = useRef();
+  if (!ref.current) {
+    ref.current = { v: fn() };
+  }
+  return ref.current.v;
+}
 var clients = {};
 function FaasReactClient({
   domain,
@@ -233,4 +240,4 @@ function useSignalState(initialValue, options = {}) {
   ];
 }
 
-export { ErrorBoundary, FaasDataWrapper, FaasReactClient, faas, getClient, signal, useFaas, useSignalState };
+export { ErrorBoundary, FaasDataWrapper, FaasReactClient, faas, getClient, signal, useConstant, useFaas, useSignalState };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/react",
-  "version": "1.4.2",
+  "version": "1.6.0",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -22,7 +22,7 @@
     "dist"
   ],
   "dependencies": {
-    "@faasjs/browser": "1.4.2"
+    "@faasjs/browser": "1.6.0"
   },
   "peerDependencies": {
     "react": "*",