WorkRoot/WRNexusJSDoc
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: update portal for WRNexusJS 0.8.0

Browse Source
This commit is contained in:
Clintchiz
2026-08-02 23:57:41 +05:30
parent 9366895f78
commit 8d5d4b8f12
183 changed files with 14433 additions and 2492 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/pages/packages/captcha.wrn
+25 -6
View File
@@ -10,11 +10,11 @@ page wrnexuscaptcha {
<header class="topbar">
<a class="brand" href="/"><span>W</span> WRNexusJS</a>
<nav aria-label="Primary"><a href="/getting-started">Get started</a><a href="/packages">Packages</a><a href="https://component.wrnexusjs.dev/">Components</a><a href="/language">Language</a><a href="/architecture">Architecture</a></nav>
<div class="topbar-actions"><a class="preview-pill" href="/access">Private preview · v0.7.0</a><button data-wire-theme-toggle class="theme-button" aria-label="Toggle color theme" title="Toggle color theme">◐</button></div>
<div class="topbar-actions"><a class="preview-pill" href="/access">Private preview · v0.8.0</a><button data-wire-theme-toggle class="theme-button" aria-label="Toggle color theme" title="Toggle color theme">◐</button></div>
</header>
<div class="mobile-doc-nav"><details><summary>Browse documentation</summary><nav><a href="/getting-started">Get started</a><a href="/packages">Packages</a><a href="https://component.wrnexusjs.dev/">Components</a><a href="/language">Language</a><a href="/architecture">Architecture</a><a href="/tutorial">Tutorial</a><a href="/guides/project-structure">Guides</a><a href="/examples">Examples</a><a href="/search">Search</a></nav></details></div>
<main class="portal-main docs-layout">
<article id="main" class="documentation prose standalone package-document"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span>/</span><a href="/packages">Packages</a><span>/</span><span aria-current="page">@wrnexus/captcha</span></nav><section class="doc-intro"><span class="eyebrow">Security · Package reference</span><h1>@wrnexus/captcha</h1><p>Managed CAPTCHA verification, middleware, and UI integration.</p><div class="doc-meta"><span>v0.7.0</span><span>Private registry</span><span>Security</span></div><section id="access" class="access-callout"><h2>Install the package</h2><p>After WorkRoot approves private registry access, install the release-aligned package:</p><pre><code>bun add @wrnexus/captcha@0.7.0</code><button type="button" class="copy-button" aria-label="Copy installation command">Copy</button></pre><p><a href="/access">Request preview access</a>. Never put registry tokens in source control.</p></section></section><section id="guide"><p>A first-class CAPTCHA and anti-automation package for WRNexusJS. It supports self-hosted challenges, a managed WRNexus service, external providers, form submission guards, page gates, accessible audio, adaptive risk checks, and a Tailwind-only <code>.wrn</code> component.</p>
<article id="main" class="documentation prose standalone package-document"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span>/</span><a href="/packages">Packages</a><span>/</span><span aria-current="page">@wrnexus/captcha</span></nav><section class="doc-intro"><span class="eyebrow">Security · Package reference</span><h1>@wrnexus/captcha</h1><p>Managed CAPTCHA verification, middleware, and UI integration.</p><div class="doc-meta"><span>v0.8.0</span><span>Private registry</span><span>Security</span></div><section id="access" class="access-callout"><h2>Install the package</h2><p>After WorkRoot approves private registry access, install the release-aligned package:</p><pre><code>bun add @wrnexus/captcha@0.8.0</code><button type="button" class="copy-button" aria-label="Copy installation command">Copy</button></pre><p><a href="/access">Request preview access</a>. Never put registry tokens in source control.</p></section></section><section id="guide"><p>A first-class CAPTCHA and anti-automation package for WRNexusJS. It supports self-hosted challenges, a managed WRNexus service, external providers, form submission guards, page gates, accessible audio, adaptive risk checks, and a Tailwind-only <code>.wrn</code> component.</p>
<h3 id="install">Install</h3>
<pre data-language="bash"><code>bun add @wrnexus/captcha</code></pre>
<p>WRNexusJS automatically discovers the package plugin, component, client runtime, styles, and DevToolbar audit. Use <code>&lt;Captcha /&gt;</code> directly after installation. The browser runtime is injected once only on responses that render a CAPTCHA; no script tag, public-file copy, or manual plugin registration is required. Call <code>captchaPlugin(options)</code> explicitly only when an application needs to override the discovered package configuration.</p>
@@ -253,7 +253,16 @@ const wordChallenge = defineCaptchaGenerator(&#123;
&#125;);
const engine = createCaptchaEngine(&#123; secret, generators: [wordChallenge] &#125;);</code></pre>
<p>Applications may also implement <code>CaptchaStore</code>, <code>CaptchaAudioRenderer</code>, or use <code>defineCaptchaProvider()</code> for a completely custom service.</p></section><section id="api" class="api"><h2>Complete TypeScript API</h2><p>Generated from the exact installed package declarations.</p><pre data-language="typescript"><code>export &#123; CaptchaAudioRenderer, CaptchaBinding, CaptchaChallenge, CaptchaChallengeGenerator, CaptchaChallengeRecord, CaptchaChallengeType, CaptchaConcreteImageStyle, CaptchaDifficulty, CaptchaEngine, CaptchaEngineOptions, CaptchaFailureCode, CaptchaGeneratorContext, CaptchaGuardOptions, CaptchaHttpHandlers, CaptchaImageItem, CaptchaImageStyle, CaptchaMiddleware, CaptchaPageGateOptions, CaptchaPolicyMode, CaptchaPolicyOptions, CaptchaPresentation, CaptchaProvider, CaptchaProviderClientConfig, CaptchaProviderName, CaptchaResponseTokenRecord, CaptchaRiskResult, CaptchaRiskSignals, CaptchaStore, CaptchaVerificationResult, CreateCaptchaOptions, GeneratedCaptchaChallenge, VerifyCaptchaInput &#125; from './types.js';
<p>Applications may also implement <code>CaptchaStore</code>, <code>CaptchaAudioRenderer</code>, or use <code>defineCaptchaProvider()</code> for a completely custom service.</p>
<h3 id="helper-and-block-kit">Helper and block kit</h3>
<p>The package exports <code>captchaTokenFrom</code>, <code>captchaHeaders</code>, <code>captchaFields</code>, <code>verifyCaptcha</code>, <code>verifyCaptchaOrThrow</code>, <code>captchaResultResponse</code>, and <code>captchaContext</code> for consistent server and client integration.</p>
<p>Enable the CAPTCHA plugin to use the low-level <code>&lt;Captcha /&gt;</code> challenge plus complete UI-composed blocks:</p>
<ul>
<li><code>&lt;CaptchaField /&gt;</code></li>
<li><code>&lt;CaptchaStatus /&gt;</code></li>
</ul>
<p><code>CaptchaField</code> composes <code>Card</code> from <code>@wrnexus/ui</code> and keeps the CAPTCHA-specific size separate from the surrounding UI size.</p></section><section id="api" class="api"><h2>Complete TypeScript API</h2><p>Generated from the exact installed package declarations.</p><pre data-language="typescript"><code>import &#123; CaptchaVerificationResult, CaptchaProvider, CaptchaEngine, VerifyCaptchaInput &#125; from './types.js';
export &#123; CaptchaAudioRenderer, CaptchaBinding, CaptchaChallenge, CaptchaChallengeGenerator, CaptchaChallengeRecord, CaptchaChallengeType, CaptchaConcreteImageStyle, CaptchaDifficulty, CaptchaEngineOptions, CaptchaFailureCode, CaptchaGeneratorContext, CaptchaGuardOptions, CaptchaHttpHandlers, CaptchaImageItem, CaptchaImageStyle, CaptchaMiddleware, CaptchaPageGateOptions, CaptchaPolicyMode, CaptchaPolicyOptions, CaptchaPresentation, CaptchaProviderClientConfig, CaptchaProviderName, CaptchaResponseTokenRecord, CaptchaRiskResult, CaptchaRiskSignals, CaptchaStore, CreateCaptchaOptions, GeneratedCaptchaChallenge &#125; from './types.js';
export &#123; CaptchaHttpOptions, CaptchaParseResult, CaptchaSessionGrant, DefaultCaptchaEngine, ParseWithCaptchaOptions, bindingHash, bytesToBase64Url, captchaGuard, captchaPageGate, clearCaptchaGrants, constantTimeEqual, createCaptchaEngine, createCaptchaHttpHandlers, defaultRandomBytes, evaluateCaptchaRisk, hmacSha256, parseWithCaptcha, randomId, sha256, shouldRequireCaptcha, validCaptchaGrant &#125; from './server/index.js';
export &#123; CaptchaAuditIssue, CaptchaPluginOptions, captchaComponentsDir, captchaPlugin &#125; from './plugin.js';
export &#123; MemoryCaptchaStore, MemoryCaptchaStoreOptions, createMemoryCaptchaStore &#125; from './stores/memory.js';
@@ -268,9 +277,19 @@ export &#123; ManagedCaptchaProvider, ManagedCaptchaProviderOptions, managedCapt
export &#123; defineCaptchaProvider &#125; from './providers/custom.js';
export &#123; CAPTCHA_CONCRETE_IMAGE_STYLES, CAPTCHA_IMAGE_STYLES, CalculationCaptchaGenerator, ImageCaptchaGenerator, InvisibleCaptchaGenerator, ResolveCaptchaImageStyleOptions, ResolvedCaptchaImageStyle, Rgba, RgbaImage, TextCaptchaGenerator, alphaCaptchaGenerator, alphanumericCaptchaGenerator, bytesToBase64, calculationCaptchaGenerator, createImage, defaultCaptchaGenerators, defineCaptchaGenerator, drawGlyph, drawLine, drawText, encodePng, fillCircle, fillPolygon, fillRect, honeypotCaptchaGenerator, imageCaptchaGenerator, isCaptchaImageStyle, normalizeCaptchaImageStyle, normalizeCaptchaImageStyleList, notRobotCaptchaGenerator, numberCaptchaGenerator, pngDataUri, resolveCaptchaImageStyle, setPixel, timingCaptchaGenerator &#125; from './challenges/index.js';
export &#123; AssetAudioRenderer, AssetAudioRendererOptions, createAssetAudioRenderer, resolveCaptchaAudioAssetsDir &#125; from './audio/index.js';
import '@wrnexus/core';
import &#123; Context &#125; from '@wrnexus/core';
import '@wrnexus/validation';
import '@wrnexus/plugin';
declare function captchaTokenFrom(value: Request | Headers | FormData | URLSearchParams | Record&lt;string, unknown&gt;, field?: string): Promise&lt;string | undefined&gt; | string | undefined;
declare function captchaHeaders(token: string): HeadersInit;
declare function captchaFields(token: string, field?: string): Record&lt;string, string&gt;;
declare function verifyCaptcha(providerOrEngine: CaptchaProvider | CaptchaEngine, input: VerifyCaptchaInput): Promise&lt;CaptchaVerificationResult&gt;;
declare function verifyCaptchaOrThrow(providerOrEngine: CaptchaProvider | CaptchaEngine, input: VerifyCaptchaInput): Promise&lt;CaptchaVerificationResult&gt;;
declare function captchaResultResponse(result: CaptchaVerificationResult): Response;
declare function captchaContext(ctx: Context): CaptchaVerificationResult | null;
export &#123; CaptchaEngine, CaptchaProvider, CaptchaVerificationResult, VerifyCaptchaInput, captchaContext, captchaFields, captchaHeaders, captchaResultResponse, captchaTokenFrom, verifyCaptcha, verifyCaptchaOrThrow &#125;;
</code></pre></section><section id="examples" class="examples"><h2>Examples</h2><p>Copy-ready examples from the installed package documentation.</p><div class="example-grid"><article class="example-card"><h3>## Install</h3><pre data-language="bash"><code>bun add @wrnexus/captcha</code></pre></article><article class="example-card"><h3>## Create the self-hosted engine</h3><pre data-language="ts"><code>import &#123;
createCaptchaEngine,
createCaptchaHttpHandlers,
@@ -312,9 +331,9 @@ export const HEAD = POST;</code></pre></article><article class="example-card"><h
&lt;Captcha size=&quot;normal&quot; action=&quot;standard-form&quot; /&gt;
&lt;Captcha size=&quot;big&quot; action=&quot;security-page&quot; /&gt;</code></pre></article><article class="example-card"><h3>Listen button visibility</h3><pre data-language="wrn"><code>&lt;Captcha showListen=&quot;false&quot; action=&quot;without-listen-button&quot; /&gt;
&lt;Captcha showAudio=&quot;false&quot; action=&quot;without-audio-alternative&quot; /&gt;</code></pre></article></div></section></article>
<aside class="on-this-page"><h2>On this page</h2><nav><a class="toc-level-2" href="#guide">Guide</a><a class="toc-level-3" href="#install">Install</a><a class="toc-level-3" href="#included-challenge-modes">Included challenge modes</a><a class="toc-level-3" href="#create-the-self-hosted-engine">Create the self-hosted engine</a><a class="toc-level-3" href="#use-the-component">Use the component</a><a class="toc-level-4" href="#main-props">Main props</a><a class="toc-level-4" href="#component-sizes">Component sizes</a><a class="toc-level-4" href="#listen-button-visibility">Listen button visibility</a><a class="toc-level-4" href="#i-m-not-a-robot-checkbox">I’m not a robot checkbox</a><a class="toc-level-4" href="#visual-disturbance">Visual disturbance</a><a class="toc-level-4" href="#generated-image-renderer-styles">Generated image renderer styles</a><a class="toc-level-4" href="#events">Events</a><a class="toc-level-3" href="#protect-a-validated-form-api">Protect a validated form API</a><a class="toc-level-4" href="#retryable-operations-such-as-login">Retryable operations such as login</a><a class="toc-level-3" href="#validate-a-schema-and-captcha-together">Validate a schema and CAPTCHA together</a><a class="toc-level-3" href="#page-gate">Page gate</a><a class="toc-level-3" href="#external-providers">External providers</a><a class="toc-level-3" href="#managed-provider">Managed provider</a><a class="toc-level-3" href="#stores">Stores</a><a class="toc-level-3" href="#audio">Audio</a><a class="toc-level-3" href="#devtoolbar">DevToolbar</a><a class="toc-level-3" href="#testing">Testing</a><a class="toc-level-3" href="#custom-challenge-generator">Custom challenge generator</a><a class="toc-level-2" href="#api">Complete API</a><a class="toc-level-2" href="#examples">Examples</a></nav></aside>
<aside class="on-this-page"><h2>On this page</h2><nav><a class="toc-level-2" href="#guide">Guide</a><a class="toc-level-3" href="#install">Install</a><a class="toc-level-3" href="#included-challenge-modes">Included challenge modes</a><a class="toc-level-3" href="#create-the-self-hosted-engine">Create the self-hosted engine</a><a class="toc-level-3" href="#use-the-component">Use the component</a><a class="toc-level-4" href="#main-props">Main props</a><a class="toc-level-4" href="#component-sizes">Component sizes</a><a class="toc-level-4" href="#listen-button-visibility">Listen button visibility</a><a class="toc-level-4" href="#i-m-not-a-robot-checkbox">I’m not a robot checkbox</a><a class="toc-level-4" href="#visual-disturbance">Visual disturbance</a><a class="toc-level-4" href="#generated-image-renderer-styles">Generated image renderer styles</a><a class="toc-level-4" href="#events">Events</a><a class="toc-level-3" href="#protect-a-validated-form-api">Protect a validated form API</a><a class="toc-level-4" href="#retryable-operations-such-as-login">Retryable operations such as login</a><a class="toc-level-3" href="#validate-a-schema-and-captcha-together">Validate a schema and CAPTCHA together</a><a class="toc-level-3" href="#page-gate">Page gate</a><a class="toc-level-3" href="#external-providers">External providers</a><a class="toc-level-3" href="#managed-provider">Managed provider</a><a class="toc-level-3" href="#stores">Stores</a><a class="toc-level-3" href="#audio">Audio</a><a class="toc-level-3" href="#devtoolbar">DevToolbar</a><a class="toc-level-3" href="#testing">Testing</a><a class="toc-level-3" href="#custom-challenge-generator">Custom challenge generator</a><a class="toc-level-3" href="#helper-and-block-kit">Helper and block kit</a><a class="toc-level-2" href="#api">Complete API</a><a class="toc-level-2" href="#examples">Examples</a></nav></aside>
</main>
<footer><div class="footer-brand"><span class="footer-mark" aria-hidden="true">W</span><p><strong>WRNexusJS 0.7.0</strong><span>Complete API documentation generated from installed package declarations.</span></p></div><nav aria-label="Footer"><a href="/packages">All packages</a><a href="/getting-started">Get started</a><a href="/security">Security</a><a href="/support">Support</a><a href="/llms.txt">AI guide</a></nav><p class="footer-meta">Private Developer Preview · Bun-native</p></footer>
<footer><div class="footer-brand"><span class="footer-mark" aria-hidden="true">W</span><p><strong>WRNexusJS 0.8.0</strong><span>Complete API documentation generated from installed package declarations.</span></p></div><nav aria-label="Footer"><a href="/packages">All packages</a><a href="/getting-started">Get started</a><a href="/security">Security</a><a href="/support">Support</a><a href="/llms.txt">AI guide</a></nav><p class="footer-meta">Private Developer Preview · Bun-native</p></footer>
<BackToTop />
</div>
}