@faasjs/react 0.0.5-beta.1 → 0.0.5-beta.2

package/dist/index.d.mts

@@ -3,9 +3,9 @@ export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 import { Options, ResponseError, Response as Response$1 } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode, ReactElement, Component } from 'react';
+import { ReactNode, ReactElement, Component, SetStateAction } from 'react';
 import * as _preact_signals_core from '@preact/signals-core';
-export { batch, computed, effect, signal as originSignal, useComputed, useSignal, useSignalEffect } from '@preact/signals-react';
+export { batch, computed, effect, signal as originSignal, useSignal as originUseSignal, useComputed, useSignalEffect } from '@preact/signals-react';
 
 type FaasReactClientInstance = {
   id: string
@@ -184,5 +184,24 @@ type SignalOptions = {
  * ```
  */
 declare function signal<T = any>(initialValue: any, options?: SignalOptions): _preact_signals_core.Signal<T>;
+/**
+ * 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>
+ * }
+ * ```
+ */
+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 };
+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 };

package/dist/index.d.ts

@@ -3,9 +3,9 @@ export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
 import { Options, ResponseError, Response as Response$1 } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode, ReactElement, Component } from 'react';
+import { ReactNode, ReactElement, Component, SetStateAction } from 'react';
 import * as _preact_signals_core from '@preact/signals-core';
-export { batch, computed, effect, signal as originSignal, useComputed, useSignal, useSignalEffect } from '@preact/signals-react';
+export { batch, computed, effect, signal as originSignal, useSignal as originUseSignal, useComputed, useSignalEffect } from '@preact/signals-react';
 
 type FaasReactClientInstance = {
   id: string
@@ -184,5 +184,24 @@ type SignalOptions = {
  * ```
  */
 declare function signal<T = any>(initialValue: any, options?: SignalOptions): _preact_signals_core.Signal<T>;
+/**
+ * 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>
+ * }
+ * ```
+ */
+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 };
+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 };

package/dist/index.js

@@ -219,6 +219,18 @@ function signal(initialValue, options = {}) {
     signalsReact.effect(() => console.debug(options.debugName, state.value));
   return state;
 }
+function useSignalState(initialValue, options = {}) {
+  const state = signalsReact.useSignal(initialValue);
+  if (options.debugName) {
+    signalsReact.useSignalEffect(() => console.log(options.debugName, state.value));
+  }
+  return [
+    state.value,
+    (changes) => {
+      state.value = typeof changes === "function" ? changes(state.value) : changes;
+    }
+  ];
+}
 
 Object.defineProperty(exports, 'batch', {
   enumerable: true,
@@ -236,13 +248,13 @@ Object.defineProperty(exports, 'originSignal', {
   enumerable: true,
   get: function () { return signalsReact.signal; }
 });
-Object.defineProperty(exports, 'useComputed', {
+Object.defineProperty(exports, 'originUseSignal', {
   enumerable: true,
-  get: function () { return signalsReact.useComputed; }
+  get: function () { return signalsReact.useSignal; }
 });
-Object.defineProperty(exports, 'useSignal', {
+Object.defineProperty(exports, 'useComputed', {
   enumerable: true,
-  get: function () { return signalsReact.useSignal; }
+  get: function () { return signalsReact.useComputed; }
 });
 Object.defineProperty(exports, 'useSignalEffect', {
   enumerable: true,
@@ -255,3 +267,4 @@ exports.faas = faas;
 exports.getClient = getClient;
 exports.signal = signal;
 exports.useFaas = useFaas;
+exports.useSignalState = useSignalState;

package/dist/index.mjs

@@ -1,8 +1,8 @@
 import { 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';
-export { batch, computed, effect, signal as originSignal, useComputed, useSignal, useSignalEffect } from '@preact/signals-react';
+import { signal as signal$1, effect, useSignal, useSignalEffect } from '@preact/signals-react';
+export { batch, computed, effect, signal as originSignal, useSignal as originUseSignal, useComputed, useSignalEffect } from '@preact/signals-react';
 
 // src/client.tsx
 var clients = {};
@@ -218,5 +218,17 @@ function signal(initialValue, options = {}) {
     effect(() => console.debug(options.debugName, state.value));
   return state;
 }
+function useSignalState(initialValue, options = {}) {
+  const state = useSignal(initialValue);
+  if (options.debugName) {
+    useSignalEffect(() => console.log(options.debugName, state.value));
+  }
+  return [
+    state.value,
+    (changes) => {
+      state.value = typeof changes === "function" ? changes(state.value) : changes;
+    }
+  ];
+}
 
-export { ErrorBoundary, FaasDataWrapper, FaasReactClient, faas, getClient, signal, useFaas };
+export { ErrorBoundary, FaasDataWrapper, FaasReactClient, faas, getClient, signal, useFaas, useSignalState };

package/package.json

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