@frak-labs/nexus-sdk 0.0.3-alpha → 0.0.6

package/dist/react/index.cjs

@@ -0,0 +1,169 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkJXQKTLEEcjs = require('../chunk-JXQKTLEE.cjs');
+
+
+
+
+var _chunk3LF3FGI6cjs = require('../chunk-3LF3FGI6.cjs');
+require('../chunk-2XUJYDD3.cjs');
+
+// src/react/provider/NexusConfigProvider.ts
+var _react = require('react');
+var NexusConfigContext = _react.createContext.call(void 0, void 0);
+function NexusConfigProvider(parameters) {
+  const { children, config } = parameters;
+  return _react.createElement.call(void 0, 
+    NexusConfigContext.Provider,
+    { value: config },
+    children
+  );
+}
+
+// src/react/provider/NexusIFrameClientProvider.ts
+
+
+
+
+
+
+
+
+// src/react/hook/useNexusConfig.ts
+
+function useNexusConfig() {
+  const config = _react.useContext.call(void 0, NexusConfigContext);
+  if (!config) {
+    throw new Error("NexusConfigProvider is not found");
+  }
+  return config;
+}
+
+// src/react/hook/useNexusClient.ts
+
+function useNexusClient() {
+  const client = _react.useContext.call(void 0, NexusIFrameClientContext);
+  if (!client) {
+    throw new Error("NexusIFrameClientProvider is not found");
+  }
+  return client;
+}
+
+// src/react/hook/useArticleUnlockOptions.ts
+var _reactquery = require('@tanstack/react-query');
+function useArticleUnlockOptions({ articleId }) {
+  const client = useNexusClient();
+  return _reactquery.useQuery.call(void 0, {
+    queryKey: ["articleUnlockOptions", _nullishCoalesce(articleId, () => ( "no-article-id"))],
+    queryFn: async () => {
+      if (!articleId) {
+        throw new Error("No article id provided");
+      }
+      return await _chunk3LF3FGI6cjs.getArticleUnlockOptions.call(void 0, client, { articleId });
+    },
+    enabled: !!articleId
+  });
+}
+
+// src/react/hook/useWalletStatus.ts
+
+
+function useWalletStatus() {
+  const queryClient = _reactquery.useQueryClient.call(void 0, );
+  const client = useNexusClient();
+  const newStatusUpdated = _react.useCallback.call(void 0, 
+    (event) => {
+      queryClient.setQueryData(["walletStatusListener"], event);
+    },
+    [queryClient]
+  );
+  return _reactquery.useQuery.call(void 0, {
+    queryKey: ["walletStatusListener"],
+    queryFn: async () => {
+      await _chunk3LF3FGI6cjs.watchWalletStatus.call(void 0, client, newStatusUpdated);
+      return { key: "waiting-response" };
+    }
+  });
+}
+
+// src/react/hook/useArticleUnlockStatus.ts
+
+
+function useArticleUnlockStatus({ articleId }) {
+  const queryClient = _reactquery.useQueryClient.call(void 0, );
+  const client = useNexusClient();
+  const newStatusUpdated = _react.useCallback.call(void 0, 
+    (event) => {
+      queryClient.setQueryData(
+        ["articleUnlockStatusListener", _nullishCoalesce(articleId, () => ( "no-article-id"))],
+        event
+      );
+    },
+    [articleId, queryClient]
+  );
+  return _reactquery.useQuery.call(void 0, {
+    queryKey: ["articleUnlockStatusListener", _nullishCoalesce(articleId, () => ( "no-article-id"))],
+    queryFn: async () => {
+      await _chunk3LF3FGI6cjs.watchUnlockStatus.call(void 0, client, { articleId }, newStatusUpdated);
+      return {
+        status: "waiting-response",
+        key: "waiting-response"
+      };
+    },
+    enabled: !!articleId
+  });
+}
+
+// src/react/provider/NexusIFrameClientProvider.ts
+var NexusIFrameClientContext = _react.createContext.call(void 0, 
+  void 0
+);
+function NexusIFrameClientProvider({
+  children
+}) {
+  const config = useNexusConfig();
+  const [iframeElem, setIframeElem] = _react.useState.call(void 0, 
+    void 0
+  );
+  const client = _react.useMemo.call(void 0, 
+    () => iframeElem ? _chunkJXQKTLEEcjs.createIFrameNexusClient.call(void 0, { iframe: iframeElem, config }) : void 0,
+    [iframeElem, config]
+  );
+  const iFrame = _react.createElement.call(void 0, "iframe", {
+    id: "nexus-wallet",
+    name: "nexus-wallet",
+    src: `${config.walletUrl}/listener`,
+    style: {
+      width: "0",
+      height: "0",
+      border: "0",
+      position: "absolute",
+      top: "-1000px",
+      left: "-1000px"
+    },
+    ref: (iframe) => {
+      if (!iframe) {
+        setIframeElem(void 0);
+        return;
+      }
+      setIframeElem(iframe);
+    }
+  });
+  const providerComponent = _react.createElement.call(void 0, 
+    NexusIFrameClientContext.Provider,
+    { value: client },
+    children
+  );
+  return _react.createElement.call(void 0, _react.Fragment, null, iFrame, providerComponent);
+}
+
+
+
+
+
+
+
+
+
+
+exports.NexusConfigContext = NexusConfigContext; exports.NexusConfigProvider = NexusConfigProvider; exports.NexusIFrameClientContext = NexusIFrameClientContext; exports.NexusIFrameClientProvider = NexusIFrameClientProvider; exports.useArticleUnlockOptions = useArticleUnlockOptions; exports.useArticleUnlockStatus = useArticleUnlockStatus; exports.useNexusClient = useNexusClient; exports.useNexusConfig = useNexusConfig; exports.useWalletStatus = useWalletStatus;

package/dist/react/index.d.cts

@@ -0,0 +1,99 @@
+import * as react from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
+import { a as NexusWalletSdkConfig, N as NexusClient, W as WalletStatusReturnType, A as ArticleUnlockStatusReturnType } from '../client-DWLJ8zR-.cjs';
+import * as _tanstack_react_query from '@tanstack/react-query';
+import { G as GetUnlockOptionsParams, W as WatchUnlockStatusParams } from '../watchUnlockStatus-B4kRztOM.cjs';
+import 'viem';
+import 'viem/chains';
+
+/**
+ * The context that will keep the Nexus Wallet SDK configuration
+ */
+declare const NexusConfigContext: react.Context<Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}> | undefined>;
+/**
+ * Props to instantiate the Nexus Wallet SDK configuration provider
+ */
+type NexusConfigProviderProps = {
+    config: NexusWalletSdkConfig;
+};
+/**
+ * Simple config provider for the Nexus Wallet SDK
+ * @param parameters
+ * @constructor
+ */
+declare function NexusConfigProvider(parameters: PropsWithChildren<NexusConfigProviderProps>): react.FunctionComponentElement<react.ProviderProps<Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}> | undefined>>;
+
+/**
+ * The context that will keep the Nexus Wallet SDK client
+ */
+declare const NexusIFrameClientContext: react.Context<NexusClient | undefined>;
+/**
+ * Props to instantiate the Nexus Wallet SDK configuration provider
+ */
+type NexusIFrameClientProps = {
+    config: NexusWalletSdkConfig;
+};
+/**
+ * IFrame client provider for the Nexus Wallet SDK
+ *  - Automatically set the config provider
+ * @param parameters
+ * @constructor
+ */
+declare function NexusIFrameClientProvider({ children, }: {
+    children?: ReactNode;
+}): react.FunctionComponentElement<{
+    children?: ReactNode;
+}>;
+
+/**
+ * Use the current nexus config
+ */
+declare function useNexusConfig(): Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}>;
+
+/**
+ * Use the current nexus iframe client
+ */
+declare function useNexusClient(): NexusClient;
+
+/**
+ * Hook used to get the unlock options for an article
+ */
+declare function useArticleUnlockOptions({ articleId }: GetUnlockOptionsParams): _tanstack_react_query.UseQueryResult<Readonly<{
+    prices: {
+        index: number;
+        unlockDurationInSec: number;
+        frkAmount: `0x${string}`;
+        isUserAccessible: boolean | null;
+    }[];
+}>, Error>;
+
+type WalletStatusQueryReturnType = WalletStatusReturnType | {
+    key: "waiting-response";
+};
+/**
+ * Hooks used to listen to the current wallet status
+ */
+declare function useWalletStatus(): _tanstack_react_query.UseQueryResult<WalletStatusQueryReturnType, Error>;
+
+type ArticleUnlockStatusQueryReturnType = ArticleUnlockStatusReturnType | {
+    status: "waiting-response";
+    key: "waiting-response";
+};
+/**
+ * Hooks used to listen to the current article unlock status
+ */
+declare function useArticleUnlockStatus({ articleId }: WatchUnlockStatusParams): _tanstack_react_query.UseQueryResult<ArticleUnlockStatusQueryReturnType, Error>;
+
+export { type ArticleUnlockStatusQueryReturnType, NexusConfigContext, NexusConfigProvider, type NexusConfigProviderProps, NexusIFrameClientContext, type NexusIFrameClientProps, NexusIFrameClientProvider, type WalletStatusQueryReturnType, useArticleUnlockOptions, useArticleUnlockStatus, useNexusClient, useNexusConfig, useWalletStatus };

package/dist/react/index.d.ts

@@ -0,0 +1,99 @@
+import * as react from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
+import { a as NexusWalletSdkConfig, N as NexusClient, W as WalletStatusReturnType, A as ArticleUnlockStatusReturnType } from '../client-DWLJ8zR-.js';
+import * as _tanstack_react_query from '@tanstack/react-query';
+import { G as GetUnlockOptionsParams, W as WatchUnlockStatusParams } from '../watchUnlockStatus--7dFtOJr.js';
+import 'viem';
+import 'viem/chains';
+
+/**
+ * The context that will keep the Nexus Wallet SDK configuration
+ */
+declare const NexusConfigContext: react.Context<Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}> | undefined>;
+/**
+ * Props to instantiate the Nexus Wallet SDK configuration provider
+ */
+type NexusConfigProviderProps = {
+    config: NexusWalletSdkConfig;
+};
+/**
+ * Simple config provider for the Nexus Wallet SDK
+ * @param parameters
+ * @constructor
+ */
+declare function NexusConfigProvider(parameters: PropsWithChildren<NexusConfigProviderProps>): react.FunctionComponentElement<react.ProviderProps<Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}> | undefined>>;
+
+/**
+ * The context that will keep the Nexus Wallet SDK client
+ */
+declare const NexusIFrameClientContext: react.Context<NexusClient | undefined>;
+/**
+ * Props to instantiate the Nexus Wallet SDK configuration provider
+ */
+type NexusIFrameClientProps = {
+    config: NexusWalletSdkConfig;
+};
+/**
+ * IFrame client provider for the Nexus Wallet SDK
+ *  - Automatically set the config provider
+ * @param parameters
+ * @constructor
+ */
+declare function NexusIFrameClientProvider({ children, }: {
+    children?: ReactNode;
+}): react.FunctionComponentElement<{
+    children?: ReactNode;
+}>;
+
+/**
+ * Use the current nexus config
+ */
+declare function useNexusConfig(): Readonly<{
+    walletUrl: string;
+    contentId: `0x${string}`;
+    contentTitle: string;
+}>;
+
+/**
+ * Use the current nexus iframe client
+ */
+declare function useNexusClient(): NexusClient;
+
+/**
+ * Hook used to get the unlock options for an article
+ */
+declare function useArticleUnlockOptions({ articleId }: GetUnlockOptionsParams): _tanstack_react_query.UseQueryResult<Readonly<{
+    prices: {
+        index: number;
+        unlockDurationInSec: number;
+        frkAmount: `0x${string}`;
+        isUserAccessible: boolean | null;
+    }[];
+}>, Error>;
+
+type WalletStatusQueryReturnType = WalletStatusReturnType | {
+    key: "waiting-response";
+};
+/**
+ * Hooks used to listen to the current wallet status
+ */
+declare function useWalletStatus(): _tanstack_react_query.UseQueryResult<WalletStatusQueryReturnType, Error>;
+
+type ArticleUnlockStatusQueryReturnType = ArticleUnlockStatusReturnType | {
+    status: "waiting-response";
+    key: "waiting-response";
+};
+/**
+ * Hooks used to listen to the current article unlock status
+ */
+declare function useArticleUnlockStatus({ articleId }: WatchUnlockStatusParams): _tanstack_react_query.UseQueryResult<ArticleUnlockStatusQueryReturnType, Error>;
+
+export { type ArticleUnlockStatusQueryReturnType, NexusConfigContext, NexusConfigProvider, type NexusConfigProviderProps, NexusIFrameClientContext, type NexusIFrameClientProps, NexusIFrameClientProvider, type WalletStatusQueryReturnType, useArticleUnlockOptions, useArticleUnlockStatus, useNexusClient, useNexusConfig, useWalletStatus };

package/dist/react/index.js

@@ -0,0 +1,169 @@
+import {
+  createIFrameNexusClient
+} from "../chunk-OXP3VK26.js";
+import {
+  getArticleUnlockOptions,
+  watchUnlockStatus,
+  watchWalletStatus
+} from "../chunk-DI2REDPX.js";
+import "../chunk-5QWG35A2.js";
+
+// src/react/provider/NexusConfigProvider.ts
+import { createContext, createElement } from "react";
+var NexusConfigContext = createContext(void 0);
+function NexusConfigProvider(parameters) {
+  const { children, config } = parameters;
+  return createElement(
+    NexusConfigContext.Provider,
+    { value: config },
+    children
+  );
+}
+
+// src/react/provider/NexusIFrameClientProvider.ts
+import {
+  Fragment,
+  createContext as createContext2,
+  createElement as createElement2,
+  useMemo,
+  useState
+} from "react";
+
+// src/react/hook/useNexusConfig.ts
+import { useContext } from "react";
+function useNexusConfig() {
+  const config = useContext(NexusConfigContext);
+  if (!config) {
+    throw new Error("NexusConfigProvider is not found");
+  }
+  return config;
+}
+
+// src/react/hook/useNexusClient.ts
+import { useContext as useContext2 } from "react";
+function useNexusClient() {
+  const client = useContext2(NexusIFrameClientContext);
+  if (!client) {
+    throw new Error("NexusIFrameClientProvider is not found");
+  }
+  return client;
+}
+
+// src/react/hook/useArticleUnlockOptions.ts
+import { useQuery } from "@tanstack/react-query";
+function useArticleUnlockOptions({ articleId }) {
+  const client = useNexusClient();
+  return useQuery({
+    queryKey: ["articleUnlockOptions", articleId ?? "no-article-id"],
+    queryFn: async () => {
+      if (!articleId) {
+        throw new Error("No article id provided");
+      }
+      return await getArticleUnlockOptions(client, { articleId });
+    },
+    enabled: !!articleId
+  });
+}
+
+// src/react/hook/useWalletStatus.ts
+import { useQuery as useQuery2, useQueryClient } from "@tanstack/react-query";
+import { useCallback } from "react";
+function useWalletStatus() {
+  const queryClient = useQueryClient();
+  const client = useNexusClient();
+  const newStatusUpdated = useCallback(
+    (event) => {
+      queryClient.setQueryData(["walletStatusListener"], event);
+    },
+    [queryClient]
+  );
+  return useQuery2({
+    queryKey: ["walletStatusListener"],
+    queryFn: async () => {
+      await watchWalletStatus(client, newStatusUpdated);
+      return { key: "waiting-response" };
+    }
+  });
+}
+
+// src/react/hook/useArticleUnlockStatus.ts
+import { useQuery as useQuery3, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
+import { useCallback as useCallback2 } from "react";
+function useArticleUnlockStatus({ articleId }) {
+  const queryClient = useQueryClient2();
+  const client = useNexusClient();
+  const newStatusUpdated = useCallback2(
+    (event) => {
+      queryClient.setQueryData(
+        ["articleUnlockStatusListener", articleId ?? "no-article-id"],
+        event
+      );
+    },
+    [articleId, queryClient]
+  );
+  return useQuery3({
+    queryKey: ["articleUnlockStatusListener", articleId ?? "no-article-id"],
+    queryFn: async () => {
+      await watchUnlockStatus(client, { articleId }, newStatusUpdated);
+      return {
+        status: "waiting-response",
+        key: "waiting-response"
+      };
+    },
+    enabled: !!articleId
+  });
+}
+
+// src/react/provider/NexusIFrameClientProvider.ts
+var NexusIFrameClientContext = createContext2(
+  void 0
+);
+function NexusIFrameClientProvider({
+  children
+}) {
+  const config = useNexusConfig();
+  const [iframeElem, setIframeElem] = useState(
+    void 0
+  );
+  const client = useMemo(
+    () => iframeElem ? createIFrameNexusClient({ iframe: iframeElem, config }) : void 0,
+    [iframeElem, config]
+  );
+  const iFrame = createElement2("iframe", {
+    id: "nexus-wallet",
+    name: "nexus-wallet",
+    src: `${config.walletUrl}/listener`,
+    style: {
+      width: "0",
+      height: "0",
+      border: "0",
+      position: "absolute",
+      top: "-1000px",
+      left: "-1000px"
+    },
+    ref: (iframe) => {
+      if (!iframe) {
+        setIframeElem(void 0);
+        return;
+      }
+      setIframeElem(iframe);
+    }
+  });
+  const providerComponent = createElement2(
+    NexusIFrameClientContext.Provider,
+    { value: client },
+    children
+  );
+  return createElement2(Fragment, null, iFrame, providerComponent);
+}
+export {
+  NexusConfigContext,
+  NexusConfigProvider,
+  NexusIFrameClientContext,
+  NexusIFrameClientProvider,
+  useArticleUnlockOptions,
+  useArticleUnlockStatus,
+  useNexusClient,
+  useNexusConfig,
+  useWalletStatus
+};

package/dist/watchUnlockStatus--7dFtOJr.d.ts

@@ -0,0 +1,38 @@
+import { Hex } from 'viem';
+import { N as NexusClient, A as ArticleUnlockStatusReturnType } from './client-DWLJ8zR-.js';
+
+/**
+ * Type used to get the unlock options
+ */
+type GetUnlockOptionsParams = {
+    articleId: Hex;
+};
+/**
+ * Function used to fetch the unlock option for the given client
+ * @param client
+ * @param articleId
+ */
+declare function getArticleUnlockOptions(client: NexusClient, { articleId }: GetUnlockOptionsParams): Promise<Readonly<{
+    prices: {
+        index: number;
+        unlockDurationInSec: number;
+        frkAmount: `0x${string}`;
+        isUserAccessible: boolean | null;
+    }[];
+}>>;
+
+/**
+ * Type used to get the unlock options
+ */
+type WatchUnlockStatusParams = {
+    articleId: Hex;
+};
+/**
+ * Function used to watch a current article unlock status
+ * @param client
+ * @param articleId
+ * @param callback
+ */
+declare function watchUnlockStatus(client: NexusClient, { articleId }: WatchUnlockStatusParams, callback: (status: ArticleUnlockStatusReturnType) => void): Promise<void>;
+
+export { type GetUnlockOptionsParams as G, type WatchUnlockStatusParams as W, getArticleUnlockOptions as g, watchUnlockStatus as w };

package/dist/watchUnlockStatus-B4kRztOM.d.cts

@@ -0,0 +1,38 @@
+import { Hex } from 'viem';
+import { N as NexusClient, A as ArticleUnlockStatusReturnType } from './client-DWLJ8zR-.cjs';
+
+/**
+ * Type used to get the unlock options
+ */
+type GetUnlockOptionsParams = {
+    articleId: Hex;
+};
+/**
+ * Function used to fetch the unlock option for the given client
+ * @param client
+ * @param articleId
+ */
+declare function getArticleUnlockOptions(client: NexusClient, { articleId }: GetUnlockOptionsParams): Promise<Readonly<{
+    prices: {
+        index: number;
+        unlockDurationInSec: number;
+        frkAmount: `0x${string}`;
+        isUserAccessible: boolean | null;
+    }[];
+}>>;
+
+/**
+ * Type used to get the unlock options
+ */
+type WatchUnlockStatusParams = {
+    articleId: Hex;
+};
+/**
+ * Function used to watch a current article unlock status
+ * @param client
+ * @param articleId
+ * @param callback
+ */
+declare function watchUnlockStatus(client: NexusClient, { articleId }: WatchUnlockStatusParams, callback: (status: ArticleUnlockStatusReturnType) => void): Promise<void>;
+
+export { type GetUnlockOptionsParams as G, type WatchUnlockStatusParams as W, getArticleUnlockOptions as g, watchUnlockStatus as w };

package/package.json

@@ -11,7 +11,7 @@
       "url": "https://twitter.com/QNivelais"
     }
   ],
-  "version": "0.0.3-alpha",
+  "version": "0.0.6",
   "description": "Nexus Wallet client SDK, helping any person to interact with the Frak wallet, and require the unlock of a premium article within the Frak ecosystem.",
   "repository": "https://github.com/frak-id/wallet",
   "homepage": "https://docs.frak.id/wallet-sdk",
@@ -48,6 +48,11 @@
       "types": "./dist/core/actions/index.d.ts",
       "import": "./dist/core/actions/index.js",
       "default": "./dist/core/actions/index.cjs"
+    },
+    "./react": {
+      "types": "./dist/react/index.d.ts",
+      "import": "./dist/react/index.js",
+      "default": "./dist/react/index.cjs"
     }
   },
   "scripts": {
@@ -58,13 +63,16 @@
     "build": "tsup --splitting"
   },
   "peerDependencies": {
-    "viem": "^2.7.10"
+    "viem": "^2.x",
+    "@tanstack/react-query": ">=5.0.0",
+    "react": ">=18"
   },
   "dependencies": {
     "async-lz-string": "^1.1.0",
     "js-sha256": "^0.11.0"
   },
   "devDependencies": {
+    "@tanstack/react-query": ">=5.28.6",
     "@types/node": "^20",
     "tsup": "^8.0.2",
     "typescript": "^5"