@faasjs/react 2.9.0 → 3.0.0-canary.1

package/README.md

@@ -28,7 +28,7 @@ npm install @faasjs/react
 import { FaasReactClient } from '@faasjs/react'
 
 const client = FaasReactClient({
-  domain: 'localhost:8080/api'
+  baseUrl: 'localhost:8080/api/'
 })
 ```
 
@@ -54,6 +54,7 @@ const client = FaasReactClient({
 - [FaasParams](type-aliases/FaasParams.md)
 - [FaasReactClientInstance](type-aliases/FaasReactClientInstance.md)
 - [FaasReactClientOptions](type-aliases/FaasReactClientOptions.md)
+- [OnError](type-aliases/OnError.md)
 - [OptionalWrapperProps](type-aliases/OptionalWrapperProps.md)
 - [Options](type-aliases/Options.md)
 - [ResponseHeaders](type-aliases/ResponseHeaders.md)
@@ -61,7 +62,6 @@ const client = FaasReactClient({
 
 ## Functions
 
-- [createSplitedContext](functions/createSplitedContext.md)
 - [createSplittingContext](functions/createSplittingContext.md)
 - [faas](functions/faas.md)
 - [FaasDataWrapper](functions/FaasDataWrapper.md)

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import { FaasAction, FaasParams, FaasData } from '@faasjs/types';
 export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
-import { Options, ResponseError, Response as Response$1 } from '@faasjs/browser';
+import { Options, FaasBrowserClient, ResponseError, BaseUrl, Response as Response$1 } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
 import * as react from 'react';
 import { ReactNode, ReactElement, Component, ComponentType, ComponentProps } from 'react';
@@ -67,16 +67,13 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
     }) => react.ReactNode;
     use: () => Readonly<T>;
 };
-/**
- * @deprecated Use `createSplittingContext` instead.
- */
-declare const createSplitedContext: typeof createSplittingContext;
 
 type FaasReactClientInstance = {
   id: string
   faas: <PathOrData extends FaasAction>(
     action: string | PathOrData,
-    params: FaasParams<PathOrData>
+    params: FaasParams<PathOrData>,
+    options?: Options
   ) => Promise<Response<FaasData<PathOrData>>>
   useFaas: <PathOrData extends FaasAction>(
     action: string | PathOrData,
@@ -86,6 +83,8 @@ type FaasReactClientInstance = {
   FaasDataWrapper<PathOrData extends FaasAction>(
     props: FaasDataWrapperProps<PathOrData>
   ): JSX.Element
+  onError: OnError
+  browserClient: FaasBrowserClient
 }
 
 /**
@@ -119,7 +118,7 @@ type FaasDataWrapperProps<PathOrData extends FaasAction> = {
   data?: FaasData<PathOrData>
   /** use custom setData, should work with data */
   setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>
-  domain?: string
+  baseUrl?: string
 }
 
 type useFaasOptions<PathOrData extends FaasAction> = {
@@ -130,42 +129,46 @@ type useFaasOptions<PathOrData extends FaasAction> = {
   skip?: boolean | ((params: FaasParams<PathOrData>) => boolean)
   /** send the last request after milliseconds */
   debounce?: number
+  baseUrl?: string
 }
 
+type OnError$1 = (action: string, params: Record<string, any>) => (res: ResponseError) => Promise<void>;
 type FaasReactClientOptions = {
-    domain: string;
+    /** @default `/` */
+    baseUrl?: BaseUrl;
     options?: Options;
-    onError?: (action: string, params: Record<string, any>) => (res: ResponseError) => Promise<void>;
+    onError?: OnError$1;
 };
 /**
  * Before use faas, you should initialize a FaasReactClient.
  *
- * @param props.domain {string} The domain of your faas server
+ * @param props.baseUrl {string} The baseUrl of your faas server
  * @param props.options {Options} The options of client
  * @returns {FaasReactClientInstance}
  *
  * @example
  * ```ts
  * const client = FaasReactClient({
- *   domain: 'localhost:8080/api'
+ *   baseUrl: 'localhost:8080/api/'
  * })
  * ```
  */
-declare function FaasReactClient({ domain, options, onError, }: FaasReactClientOptions): FaasReactClientInstance;
+declare function FaasReactClient({ baseUrl, options, onError }?: FaasReactClientOptions): FaasReactClientInstance;
 /**
  * Get FaasReactClient instance
  *
- * @param domain {string} empty string for default domain
+ * @param host {string} empty string for default host
  * @returns {FaasReactClientInstance}
  *
  * @example
  * ```ts
  * getClient()
  * // or
- * getClient('another-domain')
+ * getClient('another-host')
  * ```
  */
-declare function getClient(domain?: string): FaasReactClientInstance;
+declare function getClient(host?: string): FaasReactClientInstance;
+
 /**
  * Request faas server
  *
@@ -180,23 +183,7 @@ declare function getClient(domain?: string): FaasReactClientInstance;
  * })
  * ```
  */
-declare function faas<PathOrData extends FaasAction>(action: string | PathOrData, params: FaasParams<PathOrData>): Promise<Response$1<FaasData<PathOrData>>>;
-/**
- * Request faas server with React hook
- *
- * @param action {string} action name
- * @param defaultParams {object} initial action params
- * @returns {FaasDataInjection<any>}
- *
- * @example
- * ```tsx
- * 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?: useFaasOptions<PathOrData>): FaasDataInjection<FaasData<PathOrData>>;
+declare function faas<PathOrData extends FaasAction>(action: PathOrData | string, params: FaasParams<PathOrData>, options?: Options): Promise<Response$1<FaasData<PathOrData>>>;
 
 interface ErrorBoundaryProps {
     children?: ReactNode;
@@ -221,7 +208,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, {
     render(): string | number | boolean | Iterable<ReactNode> | react_jsx_runtime.JSX.Element;
 }
 
-declare function FaasDataWrapper<PathOrData extends FaasAction>({ action, params, fallback, render, children, onDataChange, data, setData, domain, }: FaasDataWrapperProps<PathOrData>): JSX.Element;
+declare function FaasDataWrapper<PathOrData extends FaasAction>({ action, params, fallback, render, children, onDataChange, data, setData, baseUrl, }: FaasDataWrapperProps<PathOrData>): JSX.Element;
 declare namespace FaasDataWrapper {
     var whyDidYouRender: boolean;
 }
@@ -265,4 +252,24 @@ declare const OptionalWrapper: React.FC<OptionalWrapperProps> & {
     whyDidYouRender: boolean;
 };
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, OptionalWrapper, type OptionalWrapperProps, createSplitedContext, createSplittingContext, faas, getClient, useConstant, useFaas, type useFaasOptions, withFaasData };
+/**
+ * Request faas server with React hook
+ *
+ * @param action {string} action name
+ * @param defaultParams {object} initial action params
+ * @returns {FaasDataInjection<any>}
+ *
+ * @example
+ * ```tsx
+ * function Post ({ id }) {
+ *   const { data } = useFaas<{ title: string }>('post/get', { id })
+ *   return <h1>{data.title}</h1>
+ * }
+ * ```
+ */
+declare function useFaas<PathOrData extends FaasAction>(action: PathOrData | string, defaultParams: FaasParams<PathOrData>, options?: useFaasOptions<PathOrData>): FaasDataInjection<FaasData<PathOrData>>;
+declare namespace useFaas {
+    var whyDidYouRender: boolean;
+}
+
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type OnError$1 as OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, faas, getClient, useConstant, useFaas, type useFaasOptions, withFaasData };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { FaasAction, FaasParams, FaasData } from '@faasjs/types';
 export { FaasAction, FaasData, FaasParams } from '@faasjs/types';
-import { Options, ResponseError, Response as Response$1 } from '@faasjs/browser';
+import { Options, FaasBrowserClient, ResponseError, BaseUrl, Response as Response$1 } from '@faasjs/browser';
 export { Options, Response, ResponseError, ResponseHeaders } from '@faasjs/browser';
 import * as react from 'react';
 import { ReactNode, ReactElement, Component, ComponentType, ComponentProps } from 'react';
@@ -67,16 +67,13 @@ declare function createSplittingContext<T extends Record<string, any>>(defaultVa
     }) => react.ReactNode;
     use: () => Readonly<T>;
 };
-/**
- * @deprecated Use `createSplittingContext` instead.
- */
-declare const createSplitedContext: typeof createSplittingContext;
 
 type FaasReactClientInstance = {
   id: string
   faas: <PathOrData extends FaasAction>(
     action: string | PathOrData,
-    params: FaasParams<PathOrData>
+    params: FaasParams<PathOrData>,
+    options?: Options
   ) => Promise<Response<FaasData<PathOrData>>>
   useFaas: <PathOrData extends FaasAction>(
     action: string | PathOrData,
@@ -86,6 +83,8 @@ type FaasReactClientInstance = {
   FaasDataWrapper<PathOrData extends FaasAction>(
     props: FaasDataWrapperProps<PathOrData>
   ): JSX.Element
+  onError: OnError
+  browserClient: FaasBrowserClient
 }
 
 /**
@@ -119,7 +118,7 @@ type FaasDataWrapperProps<PathOrData extends FaasAction> = {
   data?: FaasData<PathOrData>
   /** use custom setData, should work with data */
   setData?: React.Dispatch<React.SetStateAction<FaasData<PathOrData>>>
-  domain?: string
+  baseUrl?: string
 }
 
 type useFaasOptions<PathOrData extends FaasAction> = {
@@ -130,42 +129,46 @@ type useFaasOptions<PathOrData extends FaasAction> = {
   skip?: boolean | ((params: FaasParams<PathOrData>) => boolean)
   /** send the last request after milliseconds */
   debounce?: number
+  baseUrl?: string
 }
 
+type OnError$1 = (action: string, params: Record<string, any>) => (res: ResponseError) => Promise<void>;
 type FaasReactClientOptions = {
-    domain: string;
+    /** @default `/` */
+    baseUrl?: BaseUrl;
     options?: Options;
-    onError?: (action: string, params: Record<string, any>) => (res: ResponseError) => Promise<void>;
+    onError?: OnError$1;
 };
 /**
  * Before use faas, you should initialize a FaasReactClient.
  *
- * @param props.domain {string} The domain of your faas server
+ * @param props.baseUrl {string} The baseUrl of your faas server
  * @param props.options {Options} The options of client
  * @returns {FaasReactClientInstance}
  *
  * @example
  * ```ts
  * const client = FaasReactClient({
- *   domain: 'localhost:8080/api'
+ *   baseUrl: 'localhost:8080/api/'
  * })
  * ```
  */
-declare function FaasReactClient({ domain, options, onError, }: FaasReactClientOptions): FaasReactClientInstance;
+declare function FaasReactClient({ baseUrl, options, onError }?: FaasReactClientOptions): FaasReactClientInstance;
 /**
  * Get FaasReactClient instance
  *
- * @param domain {string} empty string for default domain
+ * @param host {string} empty string for default host
  * @returns {FaasReactClientInstance}
  *
  * @example
  * ```ts
  * getClient()
  * // or
- * getClient('another-domain')
+ * getClient('another-host')
  * ```
  */
-declare function getClient(domain?: string): FaasReactClientInstance;
+declare function getClient(host?: string): FaasReactClientInstance;
+
 /**
  * Request faas server
  *
@@ -180,23 +183,7 @@ declare function getClient(domain?: string): FaasReactClientInstance;
  * })
  * ```
  */
-declare function faas<PathOrData extends FaasAction>(action: string | PathOrData, params: FaasParams<PathOrData>): Promise<Response$1<FaasData<PathOrData>>>;
-/**
- * Request faas server with React hook
- *
- * @param action {string} action name
- * @param defaultParams {object} initial action params
- * @returns {FaasDataInjection<any>}
- *
- * @example
- * ```tsx
- * 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?: useFaasOptions<PathOrData>): FaasDataInjection<FaasData<PathOrData>>;
+declare function faas<PathOrData extends FaasAction>(action: PathOrData | string, params: FaasParams<PathOrData>, options?: Options): Promise<Response$1<FaasData<PathOrData>>>;
 
 interface ErrorBoundaryProps {
     children?: ReactNode;
@@ -221,7 +208,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, {
     render(): string | number | boolean | Iterable<ReactNode> | react_jsx_runtime.JSX.Element;
 }
 
-declare function FaasDataWrapper<PathOrData extends FaasAction>({ action, params, fallback, render, children, onDataChange, data, setData, domain, }: FaasDataWrapperProps<PathOrData>): JSX.Element;
+declare function FaasDataWrapper<PathOrData extends FaasAction>({ action, params, fallback, render, children, onDataChange, data, setData, baseUrl, }: FaasDataWrapperProps<PathOrData>): JSX.Element;
 declare namespace FaasDataWrapper {
     var whyDidYouRender: boolean;
 }
@@ -265,4 +252,24 @@ declare const OptionalWrapper: React.FC<OptionalWrapperProps> & {
     whyDidYouRender: boolean;
 };
 
-export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, OptionalWrapper, type OptionalWrapperProps, createSplitedContext, createSplittingContext, faas, getClient, useConstant, useFaas, type useFaasOptions, withFaasData };
+/**
+ * Request faas server with React hook
+ *
+ * @param action {string} action name
+ * @param defaultParams {object} initial action params
+ * @returns {FaasDataInjection<any>}
+ *
+ * @example
+ * ```tsx
+ * function Post ({ id }) {
+ *   const { data } = useFaas<{ title: string }>('post/get', { id })
+ *   return <h1>{data.title}</h1>
+ * }
+ * ```
+ */
+declare function useFaas<PathOrData extends FaasAction>(action: PathOrData | string, defaultParams: FaasParams<PathOrData>, options?: useFaasOptions<PathOrData>): FaasDataInjection<FaasData<PathOrData>>;
+declare namespace useFaas {
+    var whyDidYouRender: boolean;
+}
+
+export { ErrorBoundary, type ErrorBoundaryProps, type ErrorChildrenProps, type FaasDataInjection, FaasDataWrapper, type FaasDataWrapperProps, FaasReactClient, type FaasReactClientInstance, type FaasReactClientOptions, type OnError$1 as OnError, OptionalWrapper, type OptionalWrapperProps, createSplittingContext, faas, getClient, useConstant, useFaas, type useFaasOptions, withFaasData };

package/dist/index.js

@@ -18,11 +18,10 @@ function createSplittingContext(defaultValue) {
   const keys = Object.keys(defaultValue);
   for (const key of keys) contexts[key] = react.createContext(defaultValue[key]);
   function Provider(props) {
-    var _a, _b;
     let children = props.children;
     for (const key of keys) {
       const Context = contexts[key];
-      const value = (_b = (_a = props.value) == null ? void 0 : _a[key]) != null ? _b : defaultValue[key];
+      const value = props.value?.[key] ?? defaultValue[key];
       children = /* @__PURE__ */ jsxRuntime.jsx(Context.Provider, { value, children });
     }
     return children;
@@ -43,7 +42,6 @@ function createSplittingContext(defaultValue) {
     use
   };
 }
-var createSplitedContext = createSplittingContext;
 function FaasDataWrapper({
   action,
   params,
@@ -53,9 +51,9 @@ function FaasDataWrapper({
   onDataChange,
   data,
   setData,
-  domain
+  baseUrl
 }) {
-  const request = getClient(domain).useFaas(action, params, {
+  const request = getClient(baseUrl).useFaas(action, params, {
     data,
     setData
   });
@@ -86,145 +84,142 @@ FaasDataWrapper.whyDidYouRender = true;
 function withFaasData(Component2, faasProps) {
   return (props) => /* @__PURE__ */ jsxRuntime.jsx(FaasDataWrapper, { ...faasProps, children: /* @__PURE__ */ jsxRuntime.jsx(Component2, { ...props }) });
 }
-var clients = {};
-function FaasReactClient({
-  domain,
-  options,
-  onError
-}) {
-  const client = new browser.FaasBrowserClient(domain, options);
-  async function faas2(action, params) {
-    if (onError)
-      return client.action(action, params).catch(async (res) => {
-        await onError(action, params)(res);
-        return Promise.reject(res);
-      });
-    return client.action(action, params);
-  }
-  function useFaas2(action, defaultParams, options2) {
-    if (!options2) options2 = {};
-    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);
-    const [skip, setSkip] = react.useState(
-      typeof options2.skip === "function" ? options2.skip(defaultParams) : options2.skip
+function useFaas(action, defaultParams, options) {
+  if (!options) options = {};
+  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);
+  const [skip, setSkip] = react.useState(
+    typeof options.skip === "function" ? options.skip(defaultParams) : options.skip
+  );
+  const client = getClient(options.baseUrl);
+  react.useEffect(() => {
+    setSkip(
+      typeof options.skip === "function" ? options.skip(params) : options.skip
     );
-    react.useEffect(() => {
-      setSkip(
-        typeof options2.skip === "function" ? options2.skip(params) : options2.skip
+  }, [
+    typeof options.skip === "function" ? JSON.stringify(params) : options.skip
+  ]);
+  react.useEffect(() => {
+    if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
+      setParams(defaultParams);
+    }
+  }, [JSON.stringify(defaultParams)]);
+  react.useEffect(() => {
+    if (!action || skip) {
+      setLoading(false);
+      return;
+    }
+    setLoading(true);
+    const controller = new AbortController();
+    function send() {
+      const request = client.faas(
+        action,
+        options.params || params,
+        { signal: controller.signal }
       );
-    }, [
-      typeof options2.skip === "function" ? JSON.stringify(params) : options2.skip
-    ]);
-    react.useEffect(() => {
-      if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
-        setParams(defaultParams);
-      }
-    }, [JSON.stringify(defaultParams)]);
-    react.useEffect(() => {
-      if (!action || skip) {
+      setPromise(request);
+      request.then((r) => {
+        options?.setData ? options.setData(r.data) : setData(r.data);
         setLoading(false);
-        return;
-      }
-      setLoading(true);
-      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);
-          setLoading(false);
-        }).catch(async (e) => {
-          if (typeof (e == null ? void 0 : e.message) === "string" && e.message.toLowerCase().indexOf("aborted") >= 0)
-            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();
+      }).catch(async (e) => {
+        if (typeof e?.message === "string" && e.message.toLowerCase().indexOf("aborted") >= 0)
+          return;
+        if (!fails && typeof e?.message === "string" && e.message.indexOf("Failed to fetch") >= 0) {
+          console.warn(`FaasReactClient: ${e.message} retry...`);
+          setFails(1);
+          return send();
+        }
+        if (client.onError)
+          try {
+            await client.onError(action, params)(e);
+          } catch (error2) {
+            setError(error2);
           }
-          if (onError)
-            try {
-              await onError(action, params)(e);
-            } catch (error2) {
-              setError(error2);
-            }
-          else setError(e);
-          setLoading(false);
-          return Promise.reject(e);
-        });
-      }
-      if (options2 == null ? void 0 : options2.debounce) {
-        const timeout = setTimeout(send, options2.debounce);
-        return () => {
-          clearTimeout(timeout);
-          controller.abort();
-          setLoading(false);
-        };
-      }
-      send();
+        else setError(e);
+        setLoading(false);
+        return Promise.reject(e);
+      });
+    }
+    if (options?.debounce) {
+      const timeout = setTimeout(send, options.debounce);
       return () => {
+        clearTimeout(timeout);
         controller.abort();
         setLoading(false);
       };
-    }, [action, JSON.stringify(options2.params || params), reloadTimes, skip]);
-    const reload = react.useCallback(
-      (params2) => {
-        if (params2) setParams(params2);
-        setReloadTimes((prev) => prev + 1);
-        return promise;
-      },
-      [params]
-    );
-    return {
-      action,
-      params,
-      loading,
-      data: (options2 == null ? void 0 : options2.data) || data,
-      reloadTimes,
-      error,
-      promise,
-      reload,
-      setData: (options2 == null ? void 0 : options2.setData) || setData,
-      setLoading,
-      setPromise,
-      setError
+    }
+    send();
+    return () => {
+      controller.abort();
+      setLoading(false);
     };
-  }
-  useFaas2.whyDidYouRender = true;
+  }, [action, JSON.stringify(options.params || params), reloadTimes, skip]);
+  const reload = react.useCallback(
+    (params2) => {
+      if (params2) setParams(params2);
+      setReloadTimes((prev) => prev + 1);
+      return promise;
+    },
+    [params]
+  );
+  return {
+    action,
+    params,
+    loading,
+    data: options?.data || data,
+    reloadTimes,
+    error,
+    promise,
+    reload,
+    setData: options?.setData || setData,
+    setLoading,
+    setPromise,
+    setError
+  };
+}
+useFaas.whyDidYouRender = true;
+
+// src/faas.ts
+async function faas(action, params, options) {
+  const client = getClient(options?.baseUrl);
+  if (client.onError)
+    return client.faas(action, params, options).catch(async (res) => {
+      await client.onError(action, params)(res);
+      return Promise.reject(res);
+    });
+  return client.browserClient.action(action, params, options);
+}
+var clients = {};
+function FaasReactClient({ baseUrl, options, onError } = {
+  baseUrl: "/"
+}) {
+  const client = new browser.FaasBrowserClient(baseUrl, options);
   const reactClient = {
     id: client.id,
-    faas: faas2,
-    useFaas: useFaas2,
-    FaasDataWrapper: (props) => /* @__PURE__ */ jsxRuntime.jsx(FaasDataWrapper, { domain, ...props })
+    faas: async (action, params, options2) => faas(action, params, options2),
+    useFaas: (action, defaultParams, options2) => useFaas(action, defaultParams, options2),
+    FaasDataWrapper: (props) => /* @__PURE__ */ jsxRuntime.jsx(FaasDataWrapper, { baseUrl, ...props }),
+    onError,
+    browserClient: client
   };
-  clients[domain] = reactClient;
+  clients[baseUrl] = reactClient;
   return reactClient;
 }
-function getClient(domain) {
-  const client = clients[domain || Object.keys(clients)[0]];
+function getClient(host) {
+  const client = clients[host || Object.keys(clients)[0]];
   if (!client) {
     console.warn("FaasReactClient is not initialized manually, use default.");
-    return FaasReactClient({
-      domain: "/"
-    });
+    return FaasReactClient();
   }
   return client;
 }
-async function faas(action, params) {
-  return getClient().faas(action, params);
-}
-function useFaas(action, defaultParams, options) {
-  return getClient().useFaas(action, defaultParams, options);
-}
 var ErrorBoundary = class extends react.Component {
+  static whyDidYouRender = true;
   constructor(props) {
     super(props);
     this.state = {
@@ -239,9 +234,8 @@ var ErrorBoundary = class extends react.Component {
     });
   }
   render() {
-    var _a;
     const errorMessage = (this.state.error || "").toString();
-    const errorDescription = ((_a = this.state.info) == null ? void 0 : _a.componentStack) ? this.state.info.componentStack : null;
+    const errorDescription = this.state.info?.componentStack ? this.state.info.componentStack : null;
     if (this.state.error) {
       if (this.props.onError)
         this.props.onError(this.state.error, this.state.info);
@@ -261,9 +255,7 @@ var ErrorBoundary = class extends react.Component {
   }
 };
 ErrorBoundary.whyDidYouRender = true;
-ErrorBoundary.whyDidYouRender = true;
 var OptionalWrapper = ({ condition, Wrapper, wrapperProps, children }) => {
-  console.debug("[OptionalWrapper] %s %s", Wrapper.name, condition);
   return condition ? /* @__PURE__ */ jsxRuntime.jsx(Wrapper, { ...wrapperProps, children }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 };
 OptionalWrapper.whyDidYouRender = true;
@@ -272,7 +264,6 @@ exports.ErrorBoundary = ErrorBoundary;
 exports.FaasDataWrapper = FaasDataWrapper;
 exports.FaasReactClient = FaasReactClient;
 exports.OptionalWrapper = OptionalWrapper;
-exports.createSplitedContext = createSplitedContext;
 exports.createSplittingContext = createSplittingContext;
 exports.faas = faas;
 exports.getClient = getClient;

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { useRef, createContext, useState, useEffect, useMemo, cloneElement, Component, useContext, useCallback } from 'react';
+import { useRef, createContext, useState, useEffect, useMemo, cloneElement, useCallback, Component, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { FaasBrowserClient } from '@faasjs/browser';
 
@@ -16,11 +16,10 @@ function createSplittingContext(defaultValue) {
   const keys = Object.keys(defaultValue);
   for (const key of keys) contexts[key] = createContext(defaultValue[key]);
   function Provider(props) {
-    var _a, _b;
     let children = props.children;
     for (const key of keys) {
       const Context = contexts[key];
-      const value = (_b = (_a = props.value) == null ? void 0 : _a[key]) != null ? _b : defaultValue[key];
+      const value = props.value?.[key] ?? defaultValue[key];
       children = /* @__PURE__ */ jsx(Context.Provider, { value, children });
     }
     return children;
@@ -41,7 +40,6 @@ function createSplittingContext(defaultValue) {
     use
   };
 }
-var createSplitedContext = createSplittingContext;
 function FaasDataWrapper({
   action,
   params,
@@ -51,9 +49,9 @@ function FaasDataWrapper({
   onDataChange,
   data,
   setData,
-  domain
+  baseUrl
 }) {
-  const request = getClient(domain).useFaas(action, params, {
+  const request = getClient(baseUrl).useFaas(action, params, {
     data,
     setData
   });
@@ -84,145 +82,142 @@ FaasDataWrapper.whyDidYouRender = true;
 function withFaasData(Component2, faasProps) {
   return (props) => /* @__PURE__ */ jsx(FaasDataWrapper, { ...faasProps, children: /* @__PURE__ */ jsx(Component2, { ...props }) });
 }
-var clients = {};
-function FaasReactClient({
-  domain,
-  options,
-  onError
-}) {
-  const client = new FaasBrowserClient(domain, options);
-  async function faas2(action, params) {
-    if (onError)
-      return client.action(action, params).catch(async (res) => {
-        await onError(action, params)(res);
-        return Promise.reject(res);
-      });
-    return client.action(action, params);
-  }
-  function useFaas2(action, defaultParams, options2) {
-    if (!options2) options2 = {};
-    const [loading, setLoading] = useState(true);
-    const [data, setData] = useState();
-    const [error, setError] = useState();
-    const [promise, setPromise] = useState();
-    const [params, setParams] = useState(defaultParams);
-    const [reloadTimes, setReloadTimes] = useState(0);
-    const [fails, setFails] = useState(0);
-    const [skip, setSkip] = useState(
-      typeof options2.skip === "function" ? options2.skip(defaultParams) : options2.skip
+function useFaas(action, defaultParams, options) {
+  if (!options) options = {};
+  const [loading, setLoading] = useState(true);
+  const [data, setData] = useState();
+  const [error, setError] = useState();
+  const [promise, setPromise] = useState();
+  const [params, setParams] = useState(defaultParams);
+  const [reloadTimes, setReloadTimes] = useState(0);
+  const [fails, setFails] = useState(0);
+  const [skip, setSkip] = useState(
+    typeof options.skip === "function" ? options.skip(defaultParams) : options.skip
+  );
+  const client = getClient(options.baseUrl);
+  useEffect(() => {
+    setSkip(
+      typeof options.skip === "function" ? options.skip(params) : options.skip
     );
-    useEffect(() => {
-      setSkip(
-        typeof options2.skip === "function" ? options2.skip(params) : options2.skip
+  }, [
+    typeof options.skip === "function" ? JSON.stringify(params) : options.skip
+  ]);
+  useEffect(() => {
+    if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
+      setParams(defaultParams);
+    }
+  }, [JSON.stringify(defaultParams)]);
+  useEffect(() => {
+    if (!action || skip) {
+      setLoading(false);
+      return;
+    }
+    setLoading(true);
+    const controller = new AbortController();
+    function send() {
+      const request = client.faas(
+        action,
+        options.params || params,
+        { signal: controller.signal }
       );
-    }, [
-      typeof options2.skip === "function" ? JSON.stringify(params) : options2.skip
-    ]);
-    useEffect(() => {
-      if (JSON.stringify(defaultParams) !== JSON.stringify(params)) {
-        setParams(defaultParams);
-      }
-    }, [JSON.stringify(defaultParams)]);
-    useEffect(() => {
-      if (!action || skip) {
+      setPromise(request);
+      request.then((r) => {
+        options?.setData ? options.setData(r.data) : setData(r.data);
         setLoading(false);
-        return;
-      }
-      setLoading(true);
-      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);
-          setLoading(false);
-        }).catch(async (e) => {
-          if (typeof (e == null ? void 0 : e.message) === "string" && e.message.toLowerCase().indexOf("aborted") >= 0)
-            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();
+      }).catch(async (e) => {
+        if (typeof e?.message === "string" && e.message.toLowerCase().indexOf("aborted") >= 0)
+          return;
+        if (!fails && typeof e?.message === "string" && e.message.indexOf("Failed to fetch") >= 0) {
+          console.warn(`FaasReactClient: ${e.message} retry...`);
+          setFails(1);
+          return send();
+        }
+        if (client.onError)
+          try {
+            await client.onError(action, params)(e);
+          } catch (error2) {
+            setError(error2);
           }
-          if (onError)
-            try {
-              await onError(action, params)(e);
-            } catch (error2) {
-              setError(error2);
-            }
-          else setError(e);
-          setLoading(false);
-          return Promise.reject(e);
-        });
-      }
-      if (options2 == null ? void 0 : options2.debounce) {
-        const timeout = setTimeout(send, options2.debounce);
-        return () => {
-          clearTimeout(timeout);
-          controller.abort();
-          setLoading(false);
-        };
-      }
-      send();
+        else setError(e);
+        setLoading(false);
+        return Promise.reject(e);
+      });
+    }
+    if (options?.debounce) {
+      const timeout = setTimeout(send, options.debounce);
       return () => {
+        clearTimeout(timeout);
         controller.abort();
         setLoading(false);
       };
-    }, [action, JSON.stringify(options2.params || params), reloadTimes, skip]);
-    const reload = useCallback(
-      (params2) => {
-        if (params2) setParams(params2);
-        setReloadTimes((prev) => prev + 1);
-        return promise;
-      },
-      [params]
-    );
-    return {
-      action,
-      params,
-      loading,
-      data: (options2 == null ? void 0 : options2.data) || data,
-      reloadTimes,
-      error,
-      promise,
-      reload,
-      setData: (options2 == null ? void 0 : options2.setData) || setData,
-      setLoading,
-      setPromise,
-      setError
+    }
+    send();
+    return () => {
+      controller.abort();
+      setLoading(false);
     };
-  }
-  useFaas2.whyDidYouRender = true;
+  }, [action, JSON.stringify(options.params || params), reloadTimes, skip]);
+  const reload = useCallback(
+    (params2) => {
+      if (params2) setParams(params2);
+      setReloadTimes((prev) => prev + 1);
+      return promise;
+    },
+    [params]
+  );
+  return {
+    action,
+    params,
+    loading,
+    data: options?.data || data,
+    reloadTimes,
+    error,
+    promise,
+    reload,
+    setData: options?.setData || setData,
+    setLoading,
+    setPromise,
+    setError
+  };
+}
+useFaas.whyDidYouRender = true;
+
+// src/faas.ts
+async function faas(action, params, options) {
+  const client = getClient(options?.baseUrl);
+  if (client.onError)
+    return client.faas(action, params, options).catch(async (res) => {
+      await client.onError(action, params)(res);
+      return Promise.reject(res);
+    });
+  return client.browserClient.action(action, params, options);
+}
+var clients = {};
+function FaasReactClient({ baseUrl, options, onError } = {
+  baseUrl: "/"
+}) {
+  const client = new FaasBrowserClient(baseUrl, options);
   const reactClient = {
     id: client.id,
-    faas: faas2,
-    useFaas: useFaas2,
-    FaasDataWrapper: (props) => /* @__PURE__ */ jsx(FaasDataWrapper, { domain, ...props })
+    faas: async (action, params, options2) => faas(action, params, options2),
+    useFaas: (action, defaultParams, options2) => useFaas(action, defaultParams, options2),
+    FaasDataWrapper: (props) => /* @__PURE__ */ jsx(FaasDataWrapper, { baseUrl, ...props }),
+    onError,
+    browserClient: client
   };
-  clients[domain] = reactClient;
+  clients[baseUrl] = reactClient;
   return reactClient;
 }
-function getClient(domain) {
-  const client = clients[domain || Object.keys(clients)[0]];
+function getClient(host) {
+  const client = clients[host || Object.keys(clients)[0]];
   if (!client) {
     console.warn("FaasReactClient is not initialized manually, use default.");
-    return FaasReactClient({
-      domain: "/"
-    });
+    return FaasReactClient();
   }
   return client;
 }
-async function faas(action, params) {
-  return getClient().faas(action, params);
-}
-function useFaas(action, defaultParams, options) {
-  return getClient().useFaas(action, defaultParams, options);
-}
 var ErrorBoundary = class extends Component {
+  static whyDidYouRender = true;
   constructor(props) {
     super(props);
     this.state = {
@@ -237,9 +232,8 @@ var ErrorBoundary = class extends Component {
     });
   }
   render() {
-    var _a;
     const errorMessage = (this.state.error || "").toString();
-    const errorDescription = ((_a = this.state.info) == null ? void 0 : _a.componentStack) ? this.state.info.componentStack : null;
+    const errorDescription = this.state.info?.componentStack ? this.state.info.componentStack : null;
     if (this.state.error) {
       if (this.props.onError)
         this.props.onError(this.state.error, this.state.info);
@@ -259,11 +253,9 @@ var ErrorBoundary = class extends Component {
   }
 };
 ErrorBoundary.whyDidYouRender = true;
-ErrorBoundary.whyDidYouRender = true;
 var OptionalWrapper = ({ condition, Wrapper, wrapperProps, children }) => {
-  console.debug("[OptionalWrapper] %s %s", Wrapper.name, condition);
   return condition ? /* @__PURE__ */ jsx(Wrapper, { ...wrapperProps, children }) : /* @__PURE__ */ jsx(Fragment, { children });
 };
 OptionalWrapper.whyDidYouRender = true;
 
-export { ErrorBoundary, FaasDataWrapper, FaasReactClient, OptionalWrapper, createSplitedContext, createSplittingContext, faas, getClient, useConstant, useFaas, withFaasData };
+export { ErrorBoundary, FaasDataWrapper, FaasReactClient, OptionalWrapper, createSplittingContext, faas, getClient, useConstant, useFaas, withFaasData };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/react",
-  "version": "2.9.0",
+  "version": "3.0.0-canary.1",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -34,7 +34,7 @@
     "dist"
   ],
   "dependencies": {
-    "@faasjs/browser": "2.9.0"
+    "@faasjs/browser": "3.0.0-canary.1"
   },
   "peerDependencies": {
     "react": "*"
@@ -44,7 +44,7 @@
     "react": "*"
   },
   "engines": {
-    "npm": ">=9.0.0",
-    "node": ">=18.0.0"
+    "node": ">=22.0.0",
+    "npm": ">=10.0.0"
   }
 }