@nibgate/sdk 0.2.6 → 0.2.8

package/SKILL.md

@@ -42,37 +42,51 @@ If the widget loads after app code, the SDK queues events and flushes them when
 
 **Adblocker bypass:** The widget now sends events to `/api/hub/evt` instead of `/api/hub/track` to avoid adblocker filter lists that target the word "track". The old `/api/hub/track` endpoint is preserved for backward compatibility. If you self-host the backend, ensure both routes are registered.
 
+**Hosted mode (zero backend code):** If you don't want to run your own access route, mark premium content with a data attribute and the widget handles everything:
+
+```html
+<div data-nibgate-premium="0.01" data-nibgate-recipient="0xYourWallet">
+  <p>Teaser text shown to everyone...</p>
+  <div data-nibgate-unlock-card>
+    <span data-nibgate-wallet-label>No wallet</span>
+    <button data-nibgate-connect>Connect</button>
+    <button data-nibgate-unlock-btn>Unlock for 0.01 USDC</button>
+    <p data-nibgate-status></p>
+  </div>
+  <div data-nibgate-unlocked hidden>
+    Full premium content here...
+  </div>
+</div>
+```
+
+No SDK import, no server access route, no env vars. The default wallet is set once in the Nibgate dashboard — or override per-post with `data-nibgate-recipient`. Custom price per-post: change `data-nibgate-premium="0.05"`.
+
 ---
 
-## 2. Resource Shape
+## 2. Resource Shape (Minimal)
 
-Define one stable resource per paid route, CMS row, media item, file, or API product:
+The SDK auto-derives most fields from meta tags and defaults. You only need:
 
 ```ts
 const resource = {
   id: post.id,
-  title: post.title,
-  description: post.excerpt,
-  type: 'article',
-  price: '0.01',
-  currency: 'USDC',
-  recipient: post.creatorWallet,
+  title: post.title,       // auto-fallsback to og:title → document.title
   path: `/posts/${post.slug}`,
-  url: `https://creator.example/posts/${post.slug}`,
-  tags: ['essay', 'research'],
-  access: { humans: 'paid', agents: 'paid' },
-  unlock: { mode: 'one_time' }
+  price: '0.01'            // sets access: { humans: 'paid', agents: 'paid' } automatically
 }
 ```
 
-Allowed types: `article`, `image`, `music`, `video` (aliases like `audio→music`, `photo→image` are normalized). Use stable IDs — changing IDs breaks continuity for Explore, receipts, and reputation.
-
-**Auto-derived fields:** When running in a browser, the SDK auto-fills:
-- `url` from `window.location.origin + path` if `path` is provided but `url` is not
-- `imageUrl` from `<meta property="og:image">` if not explicitly set
-- `recipient` is **not required client-side** — the server's 402 payment challenge provides the canonical wallet address. Missing it generates a warning, not an error.
+The rest fills in automatically from your page's HTML:
+- `url` from `window.location.origin + path`
+- `type` from `<meta property="og:type">` (defaults to `article`)
+- `imageUrl` from `<meta property="og:image">`
+- `description` from `<meta property="og:description">` → `<meta name="description">`
+- `tags` from `<meta name="keywords">`
+- `currency` defaults to `USDC`
+- `access` defaults to `paid` when `price > 0`, otherwise `free`
+- `recipient` is optional (server's 402 challenge provides the real wallet)
 
-So a minimal client-side resource only needs `id`, `title`, `path`, and `price` — the rest is filled in automatically.
+Allowed types: `article`, `image`, `music`, `video` (aliases like `audio→music`, `photo→image` are normalized). Use stable IDs — changing IDs breaks continuity for Explore, receipts, and reputation.
 
 **Important:** The `image`, `description`, and `title` fields become the public thumbnail and card copy on the Explore page. Use a teaser preview, not the actual paid file.
 

package/dist/nibgate.js

@@ -38,6 +38,27 @@ var Nibgate = (() => {
   __export(gateway_exports, {
     createCircleGatewayBrowserAdapter: () => createCircleGatewayBrowserAdapter
   });
+  async function getCircleClient(options = {}) {
+    if (cachedCircleModule) return cachedCircleModule;
+    if (options.clientModule) {
+      cachedCircleModule = options.clientModule;
+      return cachedCircleModule;
+    }
+    const moduleUrl = options.clientModuleUrl || "@circle-fin/x402-batching/client";
+    try {
+      cachedCircleModule = await import(moduleUrl);
+      return cachedCircleModule;
+    } catch (error) {
+      if (!options.clientModuleUrl) {
+        throw new Error(
+          `Could not load @circle-fin/x402-batching/client from node_modules. Provide a clientModuleUrl option (e.g. "https://esm.sh/@circle-fin/x402-batching@3.2.0/client?bundle") to load from CDN. Original error: ${error.message}`
+        );
+      }
+      throw new Error(
+        `Could not load Circle Gateway client from CDN: ${error.message}. Check that ${options.clientModuleUrl} is reachable.`
+      );
+    }
+  }
   function encodeBase64(value) {
     const text = typeof value === "string" ? value : stringifyJson(value);
     if (typeof Buffer !== "undefined") return Buffer.from(text).toString("base64");
@@ -52,7 +73,7 @@ var Nibgate = (() => {
     if (!signer?.address || typeof signer.signTypedData !== "function") {
       throw new Error("Circle Gateway browser adapter requires an EVM signer with address and signTypedData.");
     }
-    const circleClientModule = options.clientModule || (options.clientModuleUrl ? await runtimeImport(options.clientModuleUrl) : await runtimeImport("@circle-fin/x402-batching/client"));
+    const circleClientModule = await getCircleClient(options);
     const { BatchEvmScheme } = circleClientModule;
     const scheme = new BatchEvmScheme(signer);
     const network = options.network || options.chainId && `eip155:${options.chainId}` || "eip155:5042002";
@@ -110,11 +131,11 @@ var Nibgate = (() => {
       }
     };
   }
-  var runtimeImport;
+  var cachedCircleModule;
   var init_gateway = __esm({
     "src/browser/gateway.js"() {
       init_json();
-      runtimeImport = new Function("specifier", "return import(specifier)");
+      cachedCircleModule = null;
     }
   });
 
@@ -137,6 +158,7 @@ var Nibgate = (() => {
     createCircleGatewayBrowserAdapter: () => createCircleGatewayBrowserAdapter2,
     createEvmGatewayUnlock: () => createEvmGatewayUnlock,
     createGate: () => createGate,
+    createHostedUnlock: () => createHostedUnlock,
     createNibgate: () => createNibgate,
     createNibgateContentSettings: () => createNibgateContentSettings,
     createOnchainRating: () => createOnchainRating,
@@ -314,7 +336,7 @@ var Nibgate = (() => {
     const normalized = normalizeResource(resource);
     const warnings = [];
     const errors = [];
-    const required = options.required || ["id"];
+    const required = options.required || ["id", "type"];
     const recommended = options.recommended || ["title", "url", "description", "imageUrl", "tags"];
     for (const field of required) {
       if (!hasValue(normalized[field])) errors.push(`Missing required content metadata: ${field}`);
@@ -782,10 +804,16 @@ var Nibgate = (() => {
     const gateway = await Promise.resolve().then(() => (init_gateway(), gateway_exports));
     return gateway.createCircleGatewayBrowserAdapter(options);
   }
+  var DEFAULT_CIRCLE_CDN = "https://esm.sh/@circle-fin/x402-batching@3.2.0/client?bundle";
+  var HOSTED_PAY_URL = "https://api.nibgate.xyz/api/hub/pay";
+  function resolveAccessPath(resource, options) {
+    if (options.hosted || options.accessPath === "hosted") return HOSTED_PAY_URL;
+    return options.accessPath || resource.accessPath || "/api/nibgate/access";
+  }
   function createEvmGatewayUnlock(resource, options = {}) {
     const item = createGate(resource, options.gateOptions || {});
     const win = browserWindow();
-    const accessPath = options.accessPath || item.resource.accessPath || "/api/nibgate/access";
+    const accessPath = resolveAccessPath(item.resource, options);
     const source = options.source || "nibgate-evm-gateway";
     const network = options.network || "eip155:5042002";
     const statusTarget = typeof options.status === "string" ? win?.document.querySelector(options.status) : options.status;
@@ -876,7 +904,7 @@ var Nibgate = (() => {
           signTypedData: (typedData) => evm.request({ method: "eth_signTypedData_v4", params: [walletAddress, stringifyJson(typedData)] })
         },
         clientModule: options.circleClientModule,
-        clientModuleUrl: options.circleClientModuleUrl
+        clientModuleUrl: options.circleClientModuleUrl || DEFAULT_CIRCLE_CDN
       });
       return gatewayWallet.pay(input);
     }
@@ -938,6 +966,14 @@ var Nibgate = (() => {
     if (options.autoMount !== false) mount();
     return controller;
   }
+  function createHostedUnlock(resource, options = {}) {
+    return createEvmGatewayUnlock(resource, {
+      ...options,
+      hosted: true,
+      circleClientModuleUrl: options.circleClientModuleUrl || DEFAULT_CIRCLE_CDN,
+      noWalletMessage: options.noWalletMessage || "Install MetaMask or another EVM wallet to unlock premium content."
+    });
+  }
 
   // src/browser/reputation.js
   var RATE_CONTENT_SELECTOR = "0xc62fad09";