@mochabug/adapt-astro 1.0.0-rc12 → 1.0.0-rc15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mochabug/adapt-astro",
-  "version": "1.0.0-rc12",
+  "version": "1.0.0-rc15",
   "description": "Astro component for Adapt automation platform",
   "type": "module",
   "main": "./src/index.ts",
@@ -31,6 +31,6 @@
     "astro": "^3.0.0 || ^4.0.0 || ^5.0.0"
   },
   "dependencies": {
-    "@mochabug/adapt-web": "^1.0.0-rc34"
+    "@mochabug/adapt-web": "^1.0.0-rc37"
   }
 }

package/src/Adapt.astro

@@ -9,6 +9,9 @@ export interface Props
     | "authToken"
     | "transmitter"
     | "signals"
+    | "challengeToken"
+    | "requiresChallenge"
+    | "capWidgetOptions"
     | "inheritToken"
     | "inheritFrom"
     | "forkDisplayMode"
@@ -32,6 +35,9 @@ const {
   authToken,
   transmitter,
   signals,
+  challengeToken,
+  requiresChallenge = false,
+  capWidgetOptions,
   inheritToken,
   inheritFrom,
   forkDisplayMode = "side-by-side",
@@ -58,6 +64,9 @@ const containerId = `adapt-${Math.random().toString(36).slice(2, 11)}`;
   data-adapt-auth-token={authToken}
   data-adapt-transmitter={transmitter}
   data-adapt-signals={signals ? JSON.stringify(signals) : undefined}
+  data-adapt-challenge-token={challengeToken}
+  data-adapt-requires-challenge={requiresChallenge}
+  data-adapt-cap-widget-options={capWidgetOptions ? JSON.stringify(capWidgetOptions) : undefined}
   data-adapt-inherit-token={inheritToken}
   data-adapt-inherit-from={inheritFrom ? JSON.stringify(inheritFrom) : undefined}
   data-adapt-fork-display-mode={forkDisplayMode}
@@ -78,6 +87,7 @@ const containerId = `adapt-${Math.random().toString(36).slice(2, 11)}`;
     const inheritFromStr = container.dataset.adaptInheritFrom;
     const classNamesStr = container.dataset.adaptClassNames;
     const signalsStr = container.dataset.adaptSignals;
+    const capWidgetOptionsStr = container.dataset.adaptCapWidgetOptions;
 
     const client = new AdaptWebClient({
       container: container.id,
@@ -86,6 +96,9 @@ const containerId = `adapt-${Math.random().toString(36).slice(2, 11)}`;
       authToken: container.dataset.adaptAuthToken,
       transmitter: container.dataset.adaptTransmitter,
       signals: signalsStr ? JSON.parse(signalsStr) : undefined,
+      challengeToken: container.dataset.adaptChallengeToken,
+      requiresChallenge: container.dataset.adaptRequiresChallenge === "true",
+      capWidgetOptions: capWidgetOptionsStr ? JSON.parse(capWidgetOptionsStr) : undefined,
       inheritToken: container.dataset.adaptInheritToken,
       inheritFrom: inheritFromStr ? JSON.parse(inheritFromStr) : undefined,
       forkDisplayMode: container.dataset.adaptForkDisplayMode as "side-by-side" | "dialog",

package/src/AdaptCap.astro

@@ -0,0 +1,161 @@
+---
+import type { CapWidgetI18n } from "@mochabug/adapt-web";
+
+export interface Props {
+  /** Automation ID for challenge endpoints */
+  automationId: string;
+  /** Number of workers for Cap.js */
+  workerCount?: number;
+  /** Custom labels for Cap.js widget */
+  i18n?: CapWidgetI18n;
+  /** Enable dark mode styling */
+  darkMode?: boolean;
+  /** CSS class name for the container */
+  class?: string;
+  /** Inline styles for the container */
+  style?: string;
+}
+
+const {
+  automationId,
+  workerCount,
+  i18n,
+  darkMode = false,
+  class: className,
+  style,
+} = Astro.props;
+
+const containerId = `adapt-cap-${Math.random().toString(36).slice(2, 11)}`;
+---
+
+<!--
+  AdaptCap Astro component for proof-of-work challenges.
+
+  Since the client object is only available at runtime, you must initialize it
+  via JavaScript after creating the client:
+
+  ```js
+  import { createConnectClient } from "@mochabug/adapt-core/connect";
+
+  const rawClient = createConnectClient({ id: "my-automation" });
+
+  // Find the container and dispatch the init event with the client
+  const container = document.querySelector('[data-adapt-cap-automation-id="my-automation"]');
+  container.dispatchEvent(new CustomEvent('adapt-cap:init', {
+    detail: { client: rawClient }
+  }));
+
+  // Listen for solve event
+  container.addEventListener('adapt-cap:solve', (e) => {
+    const { token, expires } = e.detail;
+    // Use token with client.run({ challengeToken: token })
+  });
+  ```
+-->
+<div
+  id={containerId}
+  class={className}
+  style={style}
+  data-adapt-cap-automation-id={automationId}
+  data-adapt-cap-worker-count={workerCount}
+  data-adapt-cap-i18n={i18n ? JSON.stringify(i18n) : undefined}
+  data-adapt-cap-dark-mode={darkMode}
+>
+</div>
+
+<script>
+  import {
+    AdaptCapWidget,
+    type AdaptCapWidgetOptions,
+  } from "@mochabug/adapt-web";
+  import type { AutomationClient } from "@mochabug/adapt-core";
+
+  function initAdaptCap(container: HTMLElement, client: AutomationClient) {
+    const automationId = container.dataset.adaptCapAutomationId;
+    if (!automationId) return;
+
+    // Cleanup existing widget if any
+    const existingWidget = (container as any).__adaptCapWidget;
+    if (existingWidget) {
+      existingWidget.destroy();
+    }
+
+    const i18nStr = container.dataset.adaptCapI18n;
+
+    const options: AdaptCapWidgetOptions = {
+      container,
+      automationId,
+      client,
+      onSolve: (token, expires) => {
+        container.dispatchEvent(
+          new CustomEvent("adapt-cap:solve", {
+            detail: { token, expires },
+            bubbles: true,
+          })
+        );
+      },
+      onError: (error) => {
+        container.dispatchEvent(
+          new CustomEvent("adapt-cap:error", {
+            detail: { error },
+            bubbles: true,
+          })
+        );
+      },
+    };
+
+    // Parse optional props
+    const workerCount = container.dataset.adaptCapWorkerCount;
+    if (workerCount) {
+      options.workerCount = Number(workerCount);
+    }
+    if (i18nStr) {
+      options.i18n = JSON.parse(i18nStr);
+    }
+
+    const widget = new AdaptCapWidget(options);
+
+    // Apply dark mode
+    if (container.dataset.adaptCapDarkMode === "true") {
+      widget.setDarkMode(true);
+    }
+
+    // Store reference for cleanup
+    (container as any).__adaptCapWidget = widget;
+  }
+
+  function cleanupAdaptCap(container: HTMLElement) {
+    const widget = (container as any).__adaptCapWidget;
+    if (widget) {
+      widget.destroy();
+      delete (container as any).__adaptCapWidget;
+    }
+  }
+
+  // Set up init event listeners for all containers
+  function setupInitListeners() {
+    document
+      .querySelectorAll<HTMLElement>("[data-adapt-cap-automation-id]")
+      .forEach((container) => {
+        // Listen for init event with client
+        container.addEventListener("adapt-cap:init", ((
+          e: CustomEvent<{ client: AutomationClient }>
+        ) => {
+          initAdaptCap(container, e.detail.client);
+        }) as EventListener);
+      });
+  }
+
+  // Initial setup
+  setupInitListeners();
+
+  // Handle Astro View Transitions (page navigation without full reload)
+  document.addEventListener("astro:page-load", setupInitListeners);
+
+  // Cleanup before page swap (View Transitions)
+  document.addEventListener("astro:before-swap", () => {
+    document
+      .querySelectorAll<HTMLElement>("[data-adapt-cap-automation-id]")
+      .forEach(cleanupAdaptCap);
+  });
+</script>