@kheopskit/react 0.0.1-alpha.1 → 0.0.1

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @kheopskit/react
 
+## 0.0.1
+
+### Patch Changes
+
+- [`e1cebed`](https://github.com/kheopskit/kheopskit/commit/e1cebed92d303f041070e0ae146ee34d9eb717bd) Thanks [@0xKheops](https://github.com/0xKheops)! - refactor property names
+
+- [`e1cebed`](https://github.com/kheopskit/kheopskit/commit/e1cebed92d303f041070e0ae146ee34d9eb717bd) Thanks [@0xKheops](https://github.com/0xKheops)! - initial alpha release
+
+- Updated dependencies [[`e1cebed`](https://github.com/kheopskit/kheopskit/commit/e1cebed92d303f041070e0ae146ee34d9eb717bd), [`e1cebed`](https://github.com/kheopskit/kheopskit/commit/e1cebed92d303f041070e0ae146ee34d9eb717bd)]:
+  - @kheopskit/core@0.0.1
+
 ## 0.0.1-alpha.1
 
 ### Patch Changes

package/dist/index.d.mts

@@ -1,21 +1,11 @@
-import { FC, PropsWithChildren } from 'react';
 import * as _kheopskit_core from '@kheopskit/core';
 import { KheopskitConfig } from '@kheopskit/core';
+import { FC, PropsWithChildren } from 'react';
 
-declare const SuspenseMonitorInner: FC<{
-    label: string;
-}>;
-declare const SuspenseMonitor: FC<{
-    label: string;
-}>;
-
-declare const useWallets: () => {
-    wallets: _kheopskit_core.Wallet[];
-    accounts: _kheopskit_core.WalletAccount[];
-};
+declare const useWallets: () => _kheopskit_core.KheopskitState;
 
 declare const KheopskitProvider: FC<PropsWithChildren & {
-    config: KheopskitConfig;
+    config?: Partial<KheopskitConfig>;
 }>;
 
-export { KheopskitProvider, SuspenseMonitor, SuspenseMonitorInner, useWallets };
+export { KheopskitProvider, useWallets };

package/dist/index.d.ts

@@ -1,21 +1,11 @@
-import { FC, PropsWithChildren } from 'react';
 import * as _kheopskit_core from '@kheopskit/core';
 import { KheopskitConfig } from '@kheopskit/core';
+import { FC, PropsWithChildren } from 'react';
 
-declare const SuspenseMonitorInner: FC<{
-    label: string;
-}>;
-declare const SuspenseMonitor: FC<{
-    label: string;
-}>;
-
-declare const useWallets: () => {
-    wallets: _kheopskit_core.Wallet[];
-    accounts: _kheopskit_core.WalletAccount[];
-};
+declare const useWallets: () => _kheopskit_core.KheopskitState;
 
 declare const KheopskitProvider: FC<PropsWithChildren & {
-    config: KheopskitConfig;
+    config?: Partial<KheopskitConfig>;
 }>;
 
-export { KheopskitProvider, SuspenseMonitor, SuspenseMonitorInner, useWallets };
+export { KheopskitProvider, useWallets };

package/dist/index.js

@@ -21,74 +21,75 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   KheopskitProvider: () => KheopskitProvider,
-  SuspenseMonitor: () => SuspenseMonitor,
-  SuspenseMonitorInner: () => SuspenseMonitorInner,
   useWallets: () => useWallets
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/SuspenseMonitor.tsx
+// src/useWallets.ts
+var import_react2 = require("react");
+
+// src/context.ts
 var import_react = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-var SHOULD_LOG = true;
-var SuspenseMonitorInner = ({ label }) => {
-  const refStart = (0, import_react.useRef)(performance.now());
-  (0, import_react.useEffect)(() => {
-    const timeout = setTimeout(() => {
-      console.warn(`[Suspense] ${label} is hanging`);
-    }, 500);
-    return () => {
-      console.debug(
-        "[Suspense] %s : %s ms",
-        label,
-        (performance.now() - refStart.current).toFixed(2)
-      );
-      clearTimeout(timeout);
-    };
-  }, [label]);
-  return null;
+var KheopskitContext = (0, import_react.createContext)(null);
+
+// src/useWallets.ts
+var useWallets = () => {
+  const ctx = (0, import_react2.useContext)(KheopskitContext);
+  if (!ctx)
+    throw new Error("useWallets can't be used without a KheopskitProvider");
+  return ctx.state;
 };
-var SuspenseMonitor = ({ label }) => SHOULD_LOG ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SuspenseMonitorInner, { label }) : null;
 
-// src/useKheopskit.ts
+// src/KheopskitProvider.tsx
 var import_core = require("@kheopskit/core");
-var import_core2 = require("@react-rxjs/core");
 var import_react3 = require("react");
 
-// src/context.ts
-var import_react2 = require("react");
-var KheopskitContext = (0, import_react2.createContext)(null);
-
-// src/useKheopskit.ts
-var DEFAULT_VALUE = {
-  wallets: [],
-  accounts: []
-};
-var [useKheopskit] = (0, import_core2.bind)(
-  (config) => (0, import_core.getKheopskit$)(config),
-  DEFAULT_VALUE
-);
-var useWallets = () => {
-  const ctx = (0, import_react3.useContext)(KheopskitContext);
-  if (!ctx)
-    throw new Error("useWallets must be used within a KheopskitProvider");
-  return useKheopskit(ctx.config);
+// src/createStore.ts
+var import_rxjs = require("rxjs");
+var createStore = (observable$, initialValue) => {
+  const subject = new import_rxjs.BehaviorSubject(initialValue);
+  const sub = observable$.subscribe((value) => {
+    subject.next(value);
+  });
+  const getSnapshot = () => subject.getValue();
+  const subscribe = (callback) => {
+    const sub2 = subject.subscribe(callback);
+    return () => {
+      sub2.unsubscribe();
+    };
+  };
+  const destroy = () => {
+    sub.unsubscribe();
+  };
+  return {
+    getSnapshot,
+    subscribe,
+    destroy
+  };
 };
 
 // src/KheopskitProvider.tsx
-var import_core3 = require("@react-rxjs/core");
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime = require("react/jsx-runtime");
 var KheopskitProvider = ({ children, config }) => {
-  return (
-    // TODO set source
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(KheopskitContext.Provider, { value: { config }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core3.Subscribe, { fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SuspenseMonitor, { label: "KheopskitProvider" }), children }) })
+  const defaultValue = (0, import_react3.useMemo)(
+    () => ({
+      wallets: [],
+      accounts: [],
+      config: (0, import_core.resolveConfig)(config)
+    }),
+    [config]
+  );
+  const store = (0, import_react3.useMemo)(
+    () => createStore((0, import_core.getKheopskit$)(config), defaultValue),
+    [config, defaultValue]
   );
+  const state = (0, import_react3.useSyncExternalStore)(store.subscribe, store.getSnapshot);
+  const value = (0, import_react3.useMemo)(() => ({ state }), [state]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(KheopskitContext.Provider, { value, children });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   KheopskitProvider,
-  SuspenseMonitor,
-  SuspenseMonitorInner,
   useWallets
 });
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/SuspenseMonitor.tsx","../src/useKheopskit.ts","../src/context.ts","../src/KheopskitProvider.tsx"],"sourcesContent":["export * from \"./SuspenseMonitor\";\nexport * from \"./useKheopskit\";\nexport * from \"./KheopskitProvider\";\n","import { type FC, useEffect, useRef } from \"react\";\n\nconst SHOULD_LOG = true; // TODO only DEV\n\nexport const SuspenseMonitorInner: FC<{ label: string }> = ({ label }) => {\n  const refStart = useRef(performance.now());\n\n  useEffect(() => {\n    const timeout = setTimeout(() => {\n      console.warn(`[Suspense] ${label} is hanging`);\n    }, 500);\n\n    return () => {\n      console.debug(\n        \"[Suspense] %s : %s ms\",\n        label,\n        (performance.now() - refStart.current).toFixed(2)\n      );\n      clearTimeout(timeout);\n    };\n  }, [label]);\n\n  return null;\n};\n\nexport const SuspenseMonitor: FC<{ label: string }> = ({ label }) =>\n  SHOULD_LOG ? <SuspenseMonitorInner label={label} /> : null;\n","import { getKheopskit$, type KheopskitConfig } from \"@kheopskit/core\";\nimport { bind } from \"@react-rxjs/core\";\nimport { useContext } from \"react\";\nimport { KheopskitContext } from \"./context\";\n\nconst DEFAULT_VALUE = {\n  wallets: [],\n  accounts: [],\n};\n\nconst [useKheopskit] = bind(\n  (config: KheopskitConfig) => getKheopskit$(config),\n  DEFAULT_VALUE\n);\n\nexport const useWallets = () => {\n  const ctx = useContext(KheopskitContext);\n  if (!ctx)\n    throw new Error(\"useWallets must be used within a KheopskitProvider\");\n\n  return useKheopskit(ctx.config);\n};\n","import type { KheopskitConfig } from \"@kheopskit/core\";\nimport { createContext } from \"react\";\n\nexport const KheopskitContext = createContext<{\n  config: KheopskitConfig;\n} | null>(null);\n","import type { KheopskitConfig } from \"@kheopskit/core\";\nimport { Subscribe } from \"@react-rxjs/core\";\nimport type { FC, PropsWithChildren } from \"react\";\nimport { KheopskitContext } from \"./context\";\nimport { SuspenseMonitor } from \"./SuspenseMonitor\";\n\nexport const KheopskitProvider: FC<\n  PropsWithChildren & { config: KheopskitConfig }\n> = ({ children, config }) => {\n  return (\n    // TODO set source\n    <KheopskitContext.Provider value={{ config }}>\n      <Subscribe fallback={<SuspenseMonitor label=\"KheopskitProvider\" />}>\n        {children}\n      </Subscribe>\n    </KheopskitContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA2C;AA0B5B;AAxBf,IAAM,aAAa;AAEZ,IAAM,uBAA8C,CAAC,EAAE,MAAM,MAAM;AACxE,QAAM,eAAW,qBAAO,YAAY,IAAI,CAAC;AAEzC,8BAAU,MAAM;AACd,UAAM,UAAU,WAAW,MAAM;AAC/B,cAAQ,KAAK,cAAc,KAAK,aAAa;AAAA,IAC/C,GAAG,GAAG;AAEN,WAAO,MAAM;AACX,cAAQ;AAAA,QACN;AAAA,QACA;AAAA,SACC,YAAY,IAAI,IAAI,SAAS,SAAS,QAAQ,CAAC;AAAA,MAClD;AACA,mBAAa,OAAO;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,KAAK,CAAC;AAEV,SAAO;AACT;AAEO,IAAM,kBAAyC,CAAC,EAAE,MAAM,MAC7D,aAAa,4CAAC,wBAAqB,OAAc,IAAK;;;AC1BxD,kBAAoD;AACpD,IAAAA,eAAqB;AACrB,IAAAC,gBAA2B;;;ACD3B,IAAAC,gBAA8B;AAEvB,IAAM,uBAAmB,6BAEtB,IAAI;;;ADAd,IAAM,gBAAgB;AAAA,EACpB,SAAS,CAAC;AAAA,EACV,UAAU,CAAC;AACb;AAEA,IAAM,CAAC,YAAY,QAAI;AAAA,EACrB,CAAC,eAA4B,2BAAc,MAAM;AAAA,EACjD;AACF;AAEO,IAAM,aAAa,MAAM;AAC9B,QAAM,UAAM,0BAAW,gBAAgB;AACvC,MAAI,CAAC;AACH,UAAM,IAAI,MAAM,oDAAoD;AAEtE,SAAO,aAAa,IAAI,MAAM;AAChC;;;AEpBA,IAAAC,eAA0B;AAWC,IAAAC,sBAAA;AANpB,IAAM,oBAET,CAAC,EAAE,UAAU,OAAO,MAAM;AAC5B;AAAA;AAAA,IAEE,6CAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,OAAO,GACzC,uDAAC,0BAAU,UAAU,6CAAC,mBAAgB,OAAM,qBAAoB,GAC7D,UACH,GACF;AAAA;AAEJ;","names":["import_core","import_react","import_react","import_core","import_jsx_runtime"]}
+{"version":3,"sources":["../src/index.ts","../src/useWallets.ts","../src/context.ts","../src/KheopskitProvider.tsx","../src/createStore.ts"],"sourcesContent":["export * from \"./useWallets\";\nexport * from \"./KheopskitProvider\";\n","import { useContext } from \"react\";\nimport { KheopskitContext } from \"./context\";\n\nexport const useWallets = () => {\n  const ctx = useContext(KheopskitContext);\n\n  // useEffect(() => {\n  //   console.debug(\n  //     \"useWallets wallets:%s accounts:%s\",\n  //     ctx?.state.wallets.length ?? 0,\n  //     ctx?.state.accounts.length ?? 0,\n  //   );\n  // }, [ctx?.state]);\n\n  if (!ctx)\n    throw new Error(\"useWallets can't be used without a KheopskitProvider\");\n\n  return ctx.state;\n};\n","import type { KheopskitState } from \"@kheopskit/core\";\nimport { createContext } from \"react\";\n\nexport const KheopskitContext = createContext<{\n  state: KheopskitState;\n} | null>(null);\n","import {\n  type KheopskitConfig,\n  type KheopskitState,\n  getKheopskit$,\n  resolveConfig,\n} from \"@kheopskit/core\";\nimport {\n  type FC,\n  type PropsWithChildren,\n  useMemo,\n  useSyncExternalStore,\n} from \"react\";\nimport { KheopskitContext } from \"./context\";\nimport { createStore } from \"./createStore\";\n\nexport const KheopskitProvider: FC<\n  PropsWithChildren & { config?: Partial<KheopskitConfig> }\n> = ({ children, config }) => {\n  const defaultValue = useMemo<KheopskitState>(\n    () => ({\n      wallets: [],\n      accounts: [],\n      config: resolveConfig(config),\n    }),\n    [config],\n  );\n\n  const store = useMemo(\n    () => createStore(getKheopskit$(config), defaultValue),\n    [config, defaultValue],\n  );\n\n  const state = useSyncExternalStore(store.subscribe, store.getSnapshot);\n\n  const value = useMemo(() => ({ state }), [state]);\n\n  return (\n    <KheopskitContext.Provider value={value}>\n      {children}\n    </KheopskitContext.Provider>\n  );\n};\n","import { BehaviorSubject, type Observable } from \"rxjs\";\n\nexport const createStore = <T>(observable$: Observable<T>, initialValue: T) => {\n  const subject = new BehaviorSubject<T>(initialValue);\n\n  const sub = observable$.subscribe((value) => {\n    subject.next(value);\n  });\n\n  const getSnapshot = () => subject.getValue();\n\n  const subscribe = (callback: (value: T) => void) => {\n    const sub = subject.subscribe(callback);\n\n    return () => {\n      sub.unsubscribe();\n    };\n  };\n\n  const destroy = () => {\n    sub.unsubscribe();\n  };\n\n  return {\n    getSnapshot,\n    subscribe,\n    destroy,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAA2B;;;ACC3B,mBAA8B;AAEvB,IAAM,uBAAmB,4BAEtB,IAAI;;;ADFP,IAAM,aAAa,MAAM;AAC9B,QAAM,UAAM,0BAAW,gBAAgB;AAUvC,MAAI,CAAC;AACH,UAAM,IAAI,MAAM,sDAAsD;AAExE,SAAO,IAAI;AACb;;;AElBA,kBAKO;AACP,IAAAC,gBAKO;;;ACXP,kBAAiD;AAE1C,IAAM,cAAc,CAAI,aAA4B,iBAAoB;AAC7E,QAAM,UAAU,IAAI,4BAAmB,YAAY;AAEnD,QAAM,MAAM,YAAY,UAAU,CAAC,UAAU;AAC3C,YAAQ,KAAK,KAAK;AAAA,EACpB,CAAC;AAED,QAAM,cAAc,MAAM,QAAQ,SAAS;AAE3C,QAAM,YAAY,CAAC,aAAiC;AAClD,UAAMC,OAAM,QAAQ,UAAU,QAAQ;AAEtC,WAAO,MAAM;AACX,MAAAA,KAAI,YAAY;AAAA,IAClB;AAAA,EACF;AAEA,QAAM,UAAU,MAAM;AACpB,QAAI,YAAY;AAAA,EAClB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;;;ADSI;AAtBG,IAAM,oBAET,CAAC,EAAE,UAAU,OAAO,MAAM;AAC5B,QAAM,mBAAe;AAAA,IACnB,OAAO;AAAA,MACL,SAAS,CAAC;AAAA,MACV,UAAU,CAAC;AAAA,MACX,YAAQ,2BAAc,MAAM;AAAA,IAC9B;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,YAAQ;AAAA,IACZ,MAAM,gBAAY,2BAAc,MAAM,GAAG,YAAY;AAAA,IACrD,CAAC,QAAQ,YAAY;AAAA,EACvB;AAEA,QAAM,YAAQ,oCAAqB,MAAM,WAAW,MAAM,WAAW;AAErE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC;AAEhD,SACE,4CAAC,iBAAiB,UAAjB,EAA0B,OACxB,UACH;AAEJ;","names":["import_react","import_react","sub"]}

package/dist/index.mjs

@@ -1,64 +1,73 @@
-// src/SuspenseMonitor.tsx
-import { useEffect, useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-var SHOULD_LOG = true;
-var SuspenseMonitorInner = ({ label }) => {
-  const refStart = useRef(performance.now());
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      console.warn(`[Suspense] ${label} is hanging`);
-    }, 500);
-    return () => {
-      console.debug(
-        "[Suspense] %s : %s ms",
-        label,
-        (performance.now() - refStart.current).toFixed(2)
-      );
-      clearTimeout(timeout);
-    };
-  }, [label]);
-  return null;
-};
-var SuspenseMonitor = ({ label }) => SHOULD_LOG ? /* @__PURE__ */ jsx(SuspenseMonitorInner, { label }) : null;
-
-// src/useKheopskit.ts
-import { getKheopskit$ } from "@kheopskit/core";
-import { bind } from "@react-rxjs/core";
+// src/useWallets.ts
 import { useContext } from "react";
 
 // src/context.ts
 import { createContext } from "react";
 var KheopskitContext = createContext(null);
 
-// src/useKheopskit.ts
-var DEFAULT_VALUE = {
-  wallets: [],
-  accounts: []
-};
-var [useKheopskit] = bind(
-  (config) => getKheopskit$(config),
-  DEFAULT_VALUE
-);
+// src/useWallets.ts
 var useWallets = () => {
   const ctx = useContext(KheopskitContext);
   if (!ctx)
-    throw new Error("useWallets must be used within a KheopskitProvider");
-  return useKheopskit(ctx.config);
+    throw new Error("useWallets can't be used without a KheopskitProvider");
+  return ctx.state;
+};
+
+// src/KheopskitProvider.tsx
+import {
+  getKheopskit$,
+  resolveConfig
+} from "@kheopskit/core";
+import {
+  useMemo,
+  useSyncExternalStore
+} from "react";
+
+// src/createStore.ts
+import { BehaviorSubject } from "rxjs";
+var createStore = (observable$, initialValue) => {
+  const subject = new BehaviorSubject(initialValue);
+  const sub = observable$.subscribe((value) => {
+    subject.next(value);
+  });
+  const getSnapshot = () => subject.getValue();
+  const subscribe = (callback) => {
+    const sub2 = subject.subscribe(callback);
+    return () => {
+      sub2.unsubscribe();
+    };
+  };
+  const destroy = () => {
+    sub.unsubscribe();
+  };
+  return {
+    getSnapshot,
+    subscribe,
+    destroy
+  };
 };
 
 // src/KheopskitProvider.tsx
-import { Subscribe } from "@react-rxjs/core";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 var KheopskitProvider = ({ children, config }) => {
-  return (
-    // TODO set source
-    /* @__PURE__ */ jsx2(KheopskitContext.Provider, { value: { config }, children: /* @__PURE__ */ jsx2(Subscribe, { fallback: /* @__PURE__ */ jsx2(SuspenseMonitor, { label: "KheopskitProvider" }), children }) })
+  const defaultValue = useMemo(
+    () => ({
+      wallets: [],
+      accounts: [],
+      config: resolveConfig(config)
+    }),
+    [config]
+  );
+  const store = useMemo(
+    () => createStore(getKheopskit$(config), defaultValue),
+    [config, defaultValue]
   );
+  const state = useSyncExternalStore(store.subscribe, store.getSnapshot);
+  const value = useMemo(() => ({ state }), [state]);
+  return /* @__PURE__ */ jsx(KheopskitContext.Provider, { value, children });
 };
 export {
   KheopskitProvider,
-  SuspenseMonitor,
-  SuspenseMonitorInner,
   useWallets
 };
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/SuspenseMonitor.tsx","../src/useKheopskit.ts","../src/context.ts","../src/KheopskitProvider.tsx"],"sourcesContent":["import { type FC, useEffect, useRef } from \"react\";\n\nconst SHOULD_LOG = true; // TODO only DEV\n\nexport const SuspenseMonitorInner: FC<{ label: string }> = ({ label }) => {\n  const refStart = useRef(performance.now());\n\n  useEffect(() => {\n    const timeout = setTimeout(() => {\n      console.warn(`[Suspense] ${label} is hanging`);\n    }, 500);\n\n    return () => {\n      console.debug(\n        \"[Suspense] %s : %s ms\",\n        label,\n        (performance.now() - refStart.current).toFixed(2)\n      );\n      clearTimeout(timeout);\n    };\n  }, [label]);\n\n  return null;\n};\n\nexport const SuspenseMonitor: FC<{ label: string }> = ({ label }) =>\n  SHOULD_LOG ? <SuspenseMonitorInner label={label} /> : null;\n","import { getKheopskit$, type KheopskitConfig } from \"@kheopskit/core\";\nimport { bind } from \"@react-rxjs/core\";\nimport { useContext } from \"react\";\nimport { KheopskitContext } from \"./context\";\n\nconst DEFAULT_VALUE = {\n  wallets: [],\n  accounts: [],\n};\n\nconst [useKheopskit] = bind(\n  (config: KheopskitConfig) => getKheopskit$(config),\n  DEFAULT_VALUE\n);\n\nexport const useWallets = () => {\n  const ctx = useContext(KheopskitContext);\n  if (!ctx)\n    throw new Error(\"useWallets must be used within a KheopskitProvider\");\n\n  return useKheopskit(ctx.config);\n};\n","import type { KheopskitConfig } from \"@kheopskit/core\";\nimport { createContext } from \"react\";\n\nexport const KheopskitContext = createContext<{\n  config: KheopskitConfig;\n} | null>(null);\n","import type { KheopskitConfig } from \"@kheopskit/core\";\nimport { Subscribe } from \"@react-rxjs/core\";\nimport type { FC, PropsWithChildren } from \"react\";\nimport { KheopskitContext } from \"./context\";\nimport { SuspenseMonitor } from \"./SuspenseMonitor\";\n\nexport const KheopskitProvider: FC<\n  PropsWithChildren & { config: KheopskitConfig }\n> = ({ children, config }) => {\n  return (\n    // TODO set source\n    <KheopskitContext.Provider value={{ config }}>\n      <Subscribe fallback={<SuspenseMonitor label=\"KheopskitProvider\" />}>\n        {children}\n      </Subscribe>\n    </KheopskitContext.Provider>\n  );\n};\n"],"mappings":";AAAA,SAAkB,WAAW,cAAc;AA0B5B;AAxBf,IAAM,aAAa;AAEZ,IAAM,uBAA8C,CAAC,EAAE,MAAM,MAAM;AACxE,QAAM,WAAW,OAAO,YAAY,IAAI,CAAC;AAEzC,YAAU,MAAM;AACd,UAAM,UAAU,WAAW,MAAM;AAC/B,cAAQ,KAAK,cAAc,KAAK,aAAa;AAAA,IAC/C,GAAG,GAAG;AAEN,WAAO,MAAM;AACX,cAAQ;AAAA,QACN;AAAA,QACA;AAAA,SACC,YAAY,IAAI,IAAI,SAAS,SAAS,QAAQ,CAAC;AAAA,MAClD;AACA,mBAAa,OAAO;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,KAAK,CAAC;AAEV,SAAO;AACT;AAEO,IAAM,kBAAyC,CAAC,EAAE,MAAM,MAC7D,aAAa,oBAAC,wBAAqB,OAAc,IAAK;;;AC1BxD,SAAS,qBAA2C;AACpD,SAAS,YAAY;AACrB,SAAS,kBAAkB;;;ACD3B,SAAS,qBAAqB;AAEvB,IAAM,mBAAmB,cAEtB,IAAI;;;ADAd,IAAM,gBAAgB;AAAA,EACpB,SAAS,CAAC;AAAA,EACV,UAAU,CAAC;AACb;AAEA,IAAM,CAAC,YAAY,IAAI;AAAA,EACrB,CAAC,WAA4B,cAAc,MAAM;AAAA,EACjD;AACF;AAEO,IAAM,aAAa,MAAM;AAC9B,QAAM,MAAM,WAAW,gBAAgB;AACvC,MAAI,CAAC;AACH,UAAM,IAAI,MAAM,oDAAoD;AAEtE,SAAO,aAAa,IAAI,MAAM;AAChC;;;AEpBA,SAAS,iBAAiB;AAWC,gBAAAA,YAAA;AANpB,IAAM,oBAET,CAAC,EAAE,UAAU,OAAO,MAAM;AAC5B;AAAA;AAAA,IAEE,gBAAAA,KAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,OAAO,GACzC,0BAAAA,KAAC,aAAU,UAAU,gBAAAA,KAAC,mBAAgB,OAAM,qBAAoB,GAC7D,UACH,GACF;AAAA;AAEJ;","names":["jsx"]}
+{"version":3,"sources":["../src/useWallets.ts","../src/context.ts","../src/KheopskitProvider.tsx","../src/createStore.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { KheopskitContext } from \"./context\";\n\nexport const useWallets = () => {\n  const ctx = useContext(KheopskitContext);\n\n  // useEffect(() => {\n  //   console.debug(\n  //     \"useWallets wallets:%s accounts:%s\",\n  //     ctx?.state.wallets.length ?? 0,\n  //     ctx?.state.accounts.length ?? 0,\n  //   );\n  // }, [ctx?.state]);\n\n  if (!ctx)\n    throw new Error(\"useWallets can't be used without a KheopskitProvider\");\n\n  return ctx.state;\n};\n","import type { KheopskitState } from \"@kheopskit/core\";\nimport { createContext } from \"react\";\n\nexport const KheopskitContext = createContext<{\n  state: KheopskitState;\n} | null>(null);\n","import {\n  type KheopskitConfig,\n  type KheopskitState,\n  getKheopskit$,\n  resolveConfig,\n} from \"@kheopskit/core\";\nimport {\n  type FC,\n  type PropsWithChildren,\n  useMemo,\n  useSyncExternalStore,\n} from \"react\";\nimport { KheopskitContext } from \"./context\";\nimport { createStore } from \"./createStore\";\n\nexport const KheopskitProvider: FC<\n  PropsWithChildren & { config?: Partial<KheopskitConfig> }\n> = ({ children, config }) => {\n  const defaultValue = useMemo<KheopskitState>(\n    () => ({\n      wallets: [],\n      accounts: [],\n      config: resolveConfig(config),\n    }),\n    [config],\n  );\n\n  const store = useMemo(\n    () => createStore(getKheopskit$(config), defaultValue),\n    [config, defaultValue],\n  );\n\n  const state = useSyncExternalStore(store.subscribe, store.getSnapshot);\n\n  const value = useMemo(() => ({ state }), [state]);\n\n  return (\n    <KheopskitContext.Provider value={value}>\n      {children}\n    </KheopskitContext.Provider>\n  );\n};\n","import { BehaviorSubject, type Observable } from \"rxjs\";\n\nexport const createStore = <T>(observable$: Observable<T>, initialValue: T) => {\n  const subject = new BehaviorSubject<T>(initialValue);\n\n  const sub = observable$.subscribe((value) => {\n    subject.next(value);\n  });\n\n  const getSnapshot = () => subject.getValue();\n\n  const subscribe = (callback: (value: T) => void) => {\n    const sub = subject.subscribe(callback);\n\n    return () => {\n      sub.unsubscribe();\n    };\n  };\n\n  const destroy = () => {\n    sub.unsubscribe();\n  };\n\n  return {\n    getSnapshot,\n    subscribe,\n    destroy,\n  };\n};\n"],"mappings":";AAAA,SAAS,kBAAkB;;;ACC3B,SAAS,qBAAqB;AAEvB,IAAM,mBAAmB,cAEtB,IAAI;;;ADFP,IAAM,aAAa,MAAM;AAC9B,QAAM,MAAM,WAAW,gBAAgB;AAUvC,MAAI,CAAC;AACH,UAAM,IAAI,MAAM,sDAAsD;AAExE,SAAO,IAAI;AACb;;;AElBA;AAAA,EAGE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EAGE;AAAA,EACA;AAAA,OACK;;;ACXP,SAAS,uBAAwC;AAE1C,IAAM,cAAc,CAAI,aAA4B,iBAAoB;AAC7E,QAAM,UAAU,IAAI,gBAAmB,YAAY;AAEnD,QAAM,MAAM,YAAY,UAAU,CAAC,UAAU;AAC3C,YAAQ,KAAK,KAAK;AAAA,EACpB,CAAC;AAED,QAAM,cAAc,MAAM,QAAQ,SAAS;AAE3C,QAAM,YAAY,CAAC,aAAiC;AAClD,UAAMA,OAAM,QAAQ,UAAU,QAAQ;AAEtC,WAAO,MAAM;AACX,MAAAA,KAAI,YAAY;AAAA,IAClB;AAAA,EACF;AAEA,QAAM,UAAU,MAAM;AACpB,QAAI,YAAY;AAAA,EAClB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;;;ADSI;AAtBG,IAAM,oBAET,CAAC,EAAE,UAAU,OAAO,MAAM;AAC5B,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,MACL,SAAS,CAAC;AAAA,MACV,UAAU,CAAC;AAAA,MACX,QAAQ,cAAc,MAAM;AAAA,IAC9B;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,QAAQ;AAAA,IACZ,MAAM,YAAY,cAAc,MAAM,GAAG,YAAY;AAAA,IACrD,CAAC,QAAQ,YAAY;AAAA,EACvB;AAEA,QAAM,QAAQ,qBAAqB,MAAM,WAAW,MAAM,WAAW;AAErE,QAAM,QAAQ,QAAQ,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC;AAEhD,SACE,oBAAC,iBAAiB,UAAjB,EAA0B,OACxB,UACH;AAEJ;","names":["sub"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kheopskit/react",
-  "version": "0.0.1-alpha.1",
+  "version": "0.0.1",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -16,24 +16,28 @@
     }
   },
   "keywords": [],
-  "author": "",
+  "author": "Kheops (https://github.com/0xKheops)",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kheopskit/kheopskit.git"
+  },
   "license": "ISC",
   "peerDependencies": {
-    "rxjs": ">=7.8.0",
+    "polkadot-api": ">=1.10.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "polkadot-api": ">=1.10.0"
+    "rxjs": ">=7.8.0"
   },
   "dependencies": {
-    "@react-rxjs/core": "^0.10.8",
-    "@kheopskit/core": "0.0.1-alpha.1"
+    "@kheopskit/core": "0.0.1"
   },
   "devDependencies": {
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "@types/react": "^19.0.10",
-    "@types/react-dom": "^19.0.4",
-    "polkadot-api": "^1.10.0"
+    "@types/react": "^19.1.5",
+    "@types/react-dom": "^19.1.5",
+    "polkadot-api": "^1.12.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "rxjs": "^7.8.2"
   },
   "tsup": {
     "entry": [
@@ -53,6 +57,6 @@
     "test": "echo \"Error: no test specified\" && exit 1",
     "dev": "tsup --watch",
     "build": "tsup",
-    "clean": "rm -rf dist"
+    "clean": "rm -rf ./dist && rm -rf ./node_modules"
   }
 }

package/src/KheopskitProvider.tsx

@@ -1,18 +1,42 @@
-import type { KheopskitConfig } from "@kheopskit/core";
-import { Subscribe } from "@react-rxjs/core";
-import type { FC, PropsWithChildren } from "react";
+import {
+  type KheopskitConfig,
+  type KheopskitState,
+  getKheopskit$,
+  resolveConfig,
+} from "@kheopskit/core";
+import {
+  type FC,
+  type PropsWithChildren,
+  useMemo,
+  useSyncExternalStore,
+} from "react";
 import { KheopskitContext } from "./context";
-import { SuspenseMonitor } from "./SuspenseMonitor";
+import { createStore } from "./createStore";
 
 export const KheopskitProvider: FC<
-  PropsWithChildren & { config: KheopskitConfig }
+  PropsWithChildren & { config?: Partial<KheopskitConfig> }
 > = ({ children, config }) => {
+  const defaultValue = useMemo<KheopskitState>(
+    () => ({
+      wallets: [],
+      accounts: [],
+      config: resolveConfig(config),
+    }),
+    [config],
+  );
+
+  const store = useMemo(
+    () => createStore(getKheopskit$(config), defaultValue),
+    [config, defaultValue],
+  );
+
+  const state = useSyncExternalStore(store.subscribe, store.getSnapshot);
+
+  const value = useMemo(() => ({ state }), [state]);
+
   return (
-    // TODO set source
-    <KheopskitContext.Provider value={{ config }}>
-      <Subscribe fallback={<SuspenseMonitor label="KheopskitProvider" />}>
-        {children}
-      </Subscribe>
+    <KheopskitContext.Provider value={value}>
+      {children}
     </KheopskitContext.Provider>
   );
 };

package/src/context.ts

@@ -1,6 +1,6 @@
-import type { KheopskitConfig } from "@kheopskit/core";
+import type { KheopskitState } from "@kheopskit/core";
 import { createContext } from "react";
 
 export const KheopskitContext = createContext<{
-  config: KheopskitConfig;
+  state: KheopskitState;
 } | null>(null);

package/src/createStore.ts

@@ -0,0 +1,29 @@
+import { BehaviorSubject, type Observable } from "rxjs";
+
+export const createStore = <T>(observable$: Observable<T>, initialValue: T) => {
+  const subject = new BehaviorSubject<T>(initialValue);
+
+  const sub = observable$.subscribe((value) => {
+    subject.next(value);
+  });
+
+  const getSnapshot = () => subject.getValue();
+
+  const subscribe = (callback: (value: T) => void) => {
+    const sub = subject.subscribe(callback);
+
+    return () => {
+      sub.unsubscribe();
+    };
+  };
+
+  const destroy = () => {
+    sub.unsubscribe();
+  };
+
+  return {
+    getSnapshot,
+    subscribe,
+    destroy,
+  };
+};

package/src/index.ts

@@ -1,3 +1,2 @@
-export * from "./SuspenseMonitor";
-export * from "./useKheopskit";
+export * from "./useWallets";
 export * from "./KheopskitProvider";

package/src/useWallets.ts

@@ -0,0 +1,19 @@
+import { useContext } from "react";
+import { KheopskitContext } from "./context";
+
+export const useWallets = () => {
+  const ctx = useContext(KheopskitContext);
+
+  // useEffect(() => {
+  //   console.debug(
+  //     "useWallets wallets:%s accounts:%s",
+  //     ctx?.state.wallets.length ?? 0,
+  //     ctx?.state.accounts.length ?? 0,
+  //   );
+  // }, [ctx?.state]);
+
+  if (!ctx)
+    throw new Error("useWallets can't be used without a KheopskitProvider");
+
+  return ctx.state;
+};

package/src/SuspenseMonitor.tsx

@@ -1,27 +0,0 @@
-import { type FC, useEffect, useRef } from "react";
-
-const SHOULD_LOG = true; // TODO only DEV
-
-export const SuspenseMonitorInner: FC<{ label: string }> = ({ label }) => {
-  const refStart = useRef(performance.now());
-
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      console.warn(`[Suspense] ${label} is hanging`);
-    }, 500);
-
-    return () => {
-      console.debug(
-        "[Suspense] %s : %s ms",
-        label,
-        (performance.now() - refStart.current).toFixed(2)
-      );
-      clearTimeout(timeout);
-    };
-  }, [label]);
-
-  return null;
-};
-
-export const SuspenseMonitor: FC<{ label: string }> = ({ label }) =>
-  SHOULD_LOG ? <SuspenseMonitorInner label={label} /> : null;

package/src/useKheopskit.ts

@@ -1,22 +0,0 @@
-import { getKheopskit$, type KheopskitConfig } from "@kheopskit/core";
-import { bind } from "@react-rxjs/core";
-import { useContext } from "react";
-import { KheopskitContext } from "./context";
-
-const DEFAULT_VALUE = {
-  wallets: [],
-  accounts: [],
-};
-
-const [useKheopskit] = bind(
-  (config: KheopskitConfig) => getKheopskit$(config),
-  DEFAULT_VALUE
-);
-
-export const useWallets = () => {
-  const ctx = useContext(KheopskitContext);
-  if (!ctx)
-    throw new Error("useWallets must be used within a KheopskitProvider");
-
-  return useKheopskit(ctx.config);
-};