@trustsig/react 1.1.6 → 1.2.0

package/README.md

@@ -8,11 +8,14 @@ React Context Provider and hooks for TrustSig bot protection.
 npm install @trustsig/react
 ```
 
-## Setup
+## Usage (Next.js App Router)
+
+### 1. Root Layout
 
 Wrap your application or specific routes with the provider.
 
 ```tsx
+"use client";
 import { TrustSigProvider } from '@trustsig/react';
 
 export default function RootLayout({ children }) {
@@ -24,11 +27,12 @@ export default function RootLayout({ children }) {
 }
 ```
 
-## Usage
+### 2. Usage in Client Components
 
 Use the hook inside any component nested under the provider.
 
 ```tsx
+"use client";
 import { useTrustSig } from '@trustsig/react';
 
 export function LoginForm() {
@@ -52,3 +56,10 @@ export function LoginForm() {
   );
 }
 ```
+
+## API
+
+| Export | Type | Description |
+| --- | --- | --- |
+| `TrustSigProvider` | Component | The React context provider. |
+| `useTrustSig` | Hook | Hook to get the response token and status. |

package/dist/index.cjs

@@ -0,0 +1,116 @@
+"use client";
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  TrustSigProvider: () => TrustSigProvider,
+  useTrustSig: () => useTrustSig,
+  useTrustSigContext: () => useTrustSigContext
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/TrustSigProvider.tsx
+var import_react = __toESM(require("react"), 1);
+var import_client = require("@trustsig/client");
+var TrustSigContext = (0, import_react.createContext)(null);
+var TrustSigProvider = ({
+  siteKey,
+  endpoint,
+  wasmUrl,
+  scriptUrl,
+  interceptRequests,
+  debug,
+  nonce,
+  env,
+  customData,
+  children
+}) => {
+  const [isLoaded, setIsLoaded] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
+  const client = (0, import_react.useMemo)(
+    () => new import_client.TrustSigClient({
+      siteKey,
+      endpoint,
+      wasmUrl,
+      scriptUrl,
+      interceptRequests,
+      debug,
+      nonce,
+      env,
+      customData
+    }),
+    [siteKey, endpoint, wasmUrl, scriptUrl, interceptRequests, debug, nonce, env, JSON.stringify(customData)]
+  );
+  (0, import_react.useEffect)(() => {
+    let mounted = true;
+    client.load().then(() => {
+      if (mounted) {
+        setIsLoaded(true);
+      }
+    }).catch((err) => {
+      if (mounted) {
+        setError(err);
+      }
+    });
+    return () => {
+      mounted = false;
+    };
+  }, [client]);
+  const value = (0, import_react.useMemo)(
+    () => ({
+      isLoaded,
+      error,
+      getResponse: () => client.getResponse(),
+      setCustomData: (data) => client.setCustomData(data)
+    }),
+    [isLoaded, error, client]
+  );
+  return import_react.default.createElement(TrustSigContext.Provider, { value }, children);
+};
+var useTrustSigContext = () => {
+  const context = (0, import_react.useContext)(TrustSigContext);
+  if (!context) {
+    throw new Error("USE_TRUSTSIG_CONTEXT_ERROR");
+  }
+  return context;
+};
+
+// src/useTrustSig.ts
+var useTrustSig = () => {
+  return useTrustSigContext();
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TrustSigProvider,
+  useTrustSig,
+  useTrustSigContext
+});

package/dist/index.d.cts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { TrustSigEnv } from '@trustsig/types';
+
+interface TrustSigContextValue {
+    isLoaded: boolean;
+    error: Error | null;
+    getResponse: () => Promise<string | null>;
+    setCustomData: (data: Record<string, any>) => void;
+}
+interface TrustSigProviderProps {
+    siteKey: string;
+    endpoint?: string;
+    wasmUrl?: string;
+    scriptUrl?: string;
+    interceptRequests?: boolean;
+    debug?: boolean;
+    nonce?: string;
+    env?: TrustSigEnv;
+    customData?: Record<string, any>;
+    children: React.ReactNode;
+}
+declare const TrustSigProvider: React.FC<TrustSigProviderProps>;
+declare const useTrustSigContext: () => TrustSigContextValue;
+
+declare const useTrustSig: () => TrustSigContextValue;
+
+export { type TrustSigContextValue, TrustSigProvider, type TrustSigProviderProps, useTrustSig, useTrustSigContext };

package/dist/index.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { TrustSigEnv } from '@trustsig/types';
+
+interface TrustSigContextValue {
+    isLoaded: boolean;
+    error: Error | null;
+    getResponse: () => Promise<string | null>;
+    setCustomData: (data: Record<string, any>) => void;
+}
+interface TrustSigProviderProps {
+    siteKey: string;
+    endpoint?: string;
+    wasmUrl?: string;
+    scriptUrl?: string;
+    interceptRequests?: boolean;
+    debug?: boolean;
+    nonce?: string;
+    env?: TrustSigEnv;
+    customData?: Record<string, any>;
+    children: React.ReactNode;
+}
+declare const TrustSigProvider: React.FC<TrustSigProviderProps>;
+declare const useTrustSigContext: () => TrustSigContextValue;
+
+declare const useTrustSig: () => TrustSigContextValue;
+
+export { type TrustSigContextValue, TrustSigProvider, type TrustSigProviderProps, useTrustSig, useTrustSigContext };

package/dist/index.js

@@ -0,0 +1,78 @@
+"use client";
+"use client";
+
+// src/TrustSigProvider.tsx
+import React, { createContext, useContext, useEffect, useState, useMemo } from "react";
+import { TrustSigClient } from "@trustsig/client";
+var TrustSigContext = createContext(null);
+var TrustSigProvider = ({
+  siteKey,
+  endpoint,
+  wasmUrl,
+  scriptUrl,
+  interceptRequests,
+  debug,
+  nonce,
+  env,
+  customData,
+  children
+}) => {
+  const [isLoaded, setIsLoaded] = useState(false);
+  const [error, setError] = useState(null);
+  const client = useMemo(
+    () => new TrustSigClient({
+      siteKey,
+      endpoint,
+      wasmUrl,
+      scriptUrl,
+      interceptRequests,
+      debug,
+      nonce,
+      env,
+      customData
+    }),
+    [siteKey, endpoint, wasmUrl, scriptUrl, interceptRequests, debug, nonce, env, JSON.stringify(customData)]
+  );
+  useEffect(() => {
+    let mounted = true;
+    client.load().then(() => {
+      if (mounted) {
+        setIsLoaded(true);
+      }
+    }).catch((err) => {
+      if (mounted) {
+        setError(err);
+      }
+    });
+    return () => {
+      mounted = false;
+    };
+  }, [client]);
+  const value = useMemo(
+    () => ({
+      isLoaded,
+      error,
+      getResponse: () => client.getResponse(),
+      setCustomData: (data) => client.setCustomData(data)
+    }),
+    [isLoaded, error, client]
+  );
+  return React.createElement(TrustSigContext.Provider, { value }, children);
+};
+var useTrustSigContext = () => {
+  const context = useContext(TrustSigContext);
+  if (!context) {
+    throw new Error("USE_TRUSTSIG_CONTEXT_ERROR");
+  }
+  return context;
+};
+
+// src/useTrustSig.ts
+var useTrustSig = () => {
+  return useTrustSigContext();
+};
+export {
+  TrustSigProvider,
+  useTrustSig,
+  useTrustSigContext
+};

package/package.json

@@ -1,10 +1,13 @@
 {
   "name": "@trustsig/react",
-  "version": "1.1.6",
+  "version": "1.2.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -17,11 +20,11 @@
     "build": "tsup"
   },
   "dependencies": {
-    "@trustsig/client": "^1.1.5",
-    "@trustsig/types": "^1.1.5"
+    "@trustsig/client": "^1.1.11",
+    "@trustsig/types": "^1.1.11"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   }
-}
+}

package/src/TrustSigProvider.tsx

@@ -1,80 +0,0 @@
-import React, { createContext, useContext, useEffect, useState, useMemo } from 'react';
-import { TrustSigClient, ClientOptions } from '@trustsig/client';
-
-export interface TrustSigContextValue {
-  isLoaded: boolean;
-  error: Error | null;
-  getResponse: () => Promise<string | null>;
-}
-
-const TrustSigContext = createContext<TrustSigContextValue | null>(null);
-
-export interface TrustSigProviderProps extends ClientOptions {
-  children: React.ReactNode;
-}
-
-export const TrustSigProvider: React.FC<TrustSigProviderProps> = ({
-  siteKey,
-  endpoint,
-  wasmUrl,
-  interceptRequests,
-  debug,
-  nonce,
-  children,
-}) => {
-  const [isLoaded, setIsLoaded] = useState(false);
-  const [error, setError] = useState<Error | null>(null);
-
-  const client = useMemo(
-    () =>
-      new TrustSigClient({
-        siteKey,
-        endpoint,
-        wasmUrl,
-        interceptRequests,
-        debug,
-        nonce,
-      }),
-    [siteKey, endpoint, wasmUrl, interceptRequests, debug, nonce]
-  );
-
-  useEffect(() => {
-    let mounted = true;
-
-    client
-      .load()
-      .then(() => {
-        if (mounted) {
-          setIsLoaded(true);
-        }
-      })
-      .catch((err) => {
-        if (mounted) {
-          setError(err);
-        }
-      });
-
-    return () => {
-      mounted = false;
-    };
-  }, [client]);
-
-  const value = useMemo(
-    () => ({
-      isLoaded,
-      error,
-      getResponse: () => client.getResponse(),
-    }),
-    [isLoaded, error, client]
-  );
-
-  return React.createElement(TrustSigContext.Provider, { value }, children);
-};
-
-export const useTrustSigContext = () => {
-  const context = useContext(TrustSigContext);
-  if (!context) {
-    throw new Error("USE_TRUSTSIG_CONTEXT_ERROR");
-  }
-  return context;
-};

package/src/index.ts

@@ -1,4 +0,0 @@
-"use client";
-
-export * from './TrustSigProvider';
-export * from './useTrustSig';

package/src/useTrustSig.ts

@@ -1,5 +0,0 @@
-import { useTrustSigContext } from './TrustSigProvider';
-
-export const useTrustSig = () => {
-  return useTrustSigContext();
-};

package/tests/react.test.tsx

@@ -1,45 +0,0 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { render, screen } from '@testing-library/react';
-import React from 'react';
-import { TrustSigProvider, useTrustSig } from '../src/index';
-
-const TestComponent = () => {
-  const { isLoaded, getResponse } = useTrustSig();
-  return React.createElement(
-    'div',
-    null,
-    isLoaded ? 'Loaded' : 'Loading',
-    React.createElement('button', { onClick: getResponse }, 'Get')
-  );
-};
-
-describe('TrustSig React Provider', () => {
-  beforeEach(() => {
-    document.head.innerHTML = '';
-    delete (window as any).TrustSig;
-    
-    // Prevent happy-dom from actually trying to download the remote script
-    vi.spyOn(document.head, 'appendChild').mockImplementation((node) => {
-      if (node instanceof HTMLScriptElement) {
-        setTimeout(() => {
-          if (node.onload) node.onload(new Event('load'));
-        }, 10);
-      }
-      return node;
-    });
-  });
-
-  it('renders children and provides context', async () => {
-    render(
-      React.createElement(
-        TrustSigProvider,
-        { siteKey: 'TEST' },
-        React.createElement(TestComponent)
-      )
-    );
-    expect(screen.getByText('Loading')).toBeDefined();
-    
-    const appendCall = (document.head.appendChild as any).mock.calls[0][0];
-    expect(appendCall.getAttribute('data-site-key')).toBe('TEST');
-  });
-});

package/tsup.config.ts

@@ -1,13 +0,0 @@
-import { defineConfig } from 'tsup';
-export default defineConfig({ 
-  entry: ['src/index.ts'], 
-  format: ['cjs', 'esm'], 
-  dts: true, 
-  clean: true, 
-  external: ['react', 'react-dom'],
-  esbuildOptions(options) {
-    options.banner = {
-      js: '"use client";',
-    };
-  },
-});