@prosopo/procaptcha-common 2.12.5 → 2.13.0

package/.turbo/turbo-build$colon$cjs.log

@@ -1,5 +1,5 @@
 
-> @prosopo/procaptcha-common@2.12.5 build:cjs
+> @prosopo/procaptcha-common@2.13.0 build:cjs
 > NODE_ENV=${NODE_ENV:-development}; vite build --config vite.cjs.config.ts --mode $NODE_ENV
 
 ViteCommonJSConfig: .
@@ -39,24 +39,25 @@ ViteCommonJSConfig: .
 vite v8.1.5 building ssr environment for production...
 Bundle build started
 
-✓ 16 modules transformed.
+✓ 17 modules transformed.
 rendering chunks...
 computing gzip size...
-dist/cjs/extensionLoader.cjs                 0.27 kB │ gzip: 0.16 kB
-dist/cjs/callbacks/defaultEvents.cjs         0.28 kB │ gzip: 0.16 kB
-dist/cjs/elements/form.cjs                   0.62 kB │ gzip: 0.31 kB
-dist/cjs/simdReadings.cjs                    0.79 kB │ gzip: 0.36 kB
-dist/cjs/clientMetaData.cjs                  0.83 kB │ gzip: 0.47 kB
-dist/cjs/events/trust.cjs                    0.91 kB │ gzip: 0.53 kB
-dist/cjs/elements/window.cjs                 0.96 kB │ gzip: 0.54 kB
-dist/cjs/_virtual/_rolldown/runtime.cjs      1.00 kB │ gzip: 0.50 kB
-dist/cjs/reactComponents/TestModeBanner.cjs  1.36 kB │ gzip: 0.75 kB
-dist/cjs/providers.cjs                       1.54 kB │ gzip: 0.64 kB
-dist/cjs/reactComponents/Honeypot.cjs        2.03 kB │ gzip: 0.91 kB
-dist/cjs/index.cjs                           2.22 kB │ gzip: 0.59 kB
-dist/cjs/reactComponents/Reload.cjs          2.94 kB │ gzip: 1.30 kB
-dist/cjs/state/builder.cjs                   3.13 kB │ gzip: 0.84 kB
-dist/cjs/callbacks/defaultCallbacks.cjs      3.84 kB │ gzip: 1.03 kB
-dist/cjs/reactComponents/Checkbox.cjs        5.39 kB │ gzip: 2.12 kB
+dist/cjs/extensionLoader.cjs                   0.27 kB │ gzip: 0.16 kB
+dist/cjs/callbacks/defaultEvents.cjs           0.28 kB │ gzip: 0.16 kB
+dist/cjs/elements/form.cjs                     0.62 kB │ gzip: 0.31 kB
+dist/cjs/simdReadings.cjs                      0.79 kB │ gzip: 0.36 kB
+dist/cjs/clientMetaData.cjs                    0.83 kB │ gzip: 0.47 kB
+dist/cjs/events/trust.cjs                      0.91 kB │ gzip: 0.53 kB
+dist/cjs/elements/window.cjs                   0.96 kB │ gzip: 0.54 kB
+dist/cjs/_virtual/_rolldown/runtime.cjs        1.00 kB │ gzip: 0.50 kB
+dist/cjs/reactComponents/TestModeBanner.cjs    1.36 kB │ gzip: 0.75 kB
+dist/cjs/providers.cjs                         1.54 kB │ gzip: 0.64 kB
+dist/cjs/reactComponents/Honeypot.cjs          2.03 kB │ gzip: 0.91 kB
+dist/cjs/index.cjs                             2.45 kB │ gzip: 0.63 kB
+dist/cjs/reactComponents/Reload.cjs            2.94 kB │ gzip: 1.30 kB
+dist/cjs/state/builder.cjs                     3.13 kB │ gzip: 0.84 kB
+dist/cjs/callbacks/defaultCallbacks.cjs        3.84 kB │ gzip: 1.03 kB
+dist/cjs/reactComponents/Checkbox.cjs          5.39 kB │ gzip: 2.12 kB
+dist/cjs/reactComponents/ChallengeSurface.cjs  5.84 kB │ gzip: 2.07 kB
 
-✓ built in 39ms
+✓ built in 95ms

package/.turbo/turbo-build$colon$tsc.log

@@ -1,8 +1,8 @@
 
-> @prosopo/procaptcha-common@2.12.5 build:tsc
+> @prosopo/procaptcha-common@2.13.0 build:tsc
 > tsc --build --verbose
 
-1:56:29 PM - Projects in this build: 
+1:15:26 PM - Projects in this build: 
     * ../../dev/config/tsconfig.json
     * ../locale/tsconfig.json
     * ../util/tsconfig.json
@@ -18,35 +18,35 @@
     * ../account/tsconfig.json
     * tsconfig.json
 
-1:56:29 PM - Project '../../dev/config/tsconfig.json' is up to date because newest input '../../dev/config/src/webpack/webpack.config.ts' is older than output '../../dev/config/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../../dev/config/tsconfig.json' is up to date because newest input '../../dev/config/src/webpack/webpack.config.ts' is older than output '../../dev/config/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../locale/tsconfig.json' is up to date because newest input '../locale/src/translationKey.ts' is older than output '../locale/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../locale/tsconfig.json' is up to date because newest input '../locale/src/translationKey.ts' is older than output '../locale/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../util/tsconfig.json' is up to date because newest input '../util/src/url.ts' is older than output '../util/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../util/tsconfig.json' is up to date because newest input '../util/src/url.ts' is older than output '../util/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../logger/tsconfig.json' is up to date because newest input '../logger/src/index.ts' is older than output '../logger/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../logger/tsconfig.json' is up to date because newest input '../logger/src/index.ts' is older than output '../logger/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../util-crypto/tsconfig.json' is up to date because newest input '../util-crypto/src/types.ts' is older than output '../util-crypto/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../util-crypto/tsconfig.json' is up to date because newest input '../util-crypto/src/types.ts' is older than output '../util-crypto/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../types/tsconfig.json' is up to date because newest input '../types/src/index.ts' is older than output '../types/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../types/tsconfig.json' is up to date because newest input '../types/src/types.test-d.ts' is older than output '../types/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../common/tsconfig.json' is up to date because newest input '../common/src/index.ts' is older than output '../common/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../common/tsconfig.json' is up to date because newest input '../common/src/utils/batches.ts' is older than output '../common/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../load-balancer/tsconfig.json' is up to date because newest input '../load-balancer/src/balancer.ts' is older than output '../load-balancer/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../load-balancer/tsconfig.json' is up to date because newest input '../load-balancer/src/balancer.ts' is older than output '../load-balancer/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../widget-skeleton/tsconfig.json' is up to date because newest input '../widget-skeleton/src/constants.ts' is older than output '../widget-skeleton/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../widget-skeleton/tsconfig.json' is up to date because newest input '../widget-skeleton/src/index.ts' is older than output '../widget-skeleton/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../fingerprintjs/tsconfig.json' is up to date because newest input '../fingerprintjs/src/utils/browser.ts' is older than output '../fingerprintjs/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../fingerprintjs/tsconfig.json' is up to date because newest input '../fingerprintjs/src/utils/browser.ts' is older than output '../fingerprintjs/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../fingerprint/tsconfig.json' is up to date because newest input '../fingerprint/src/index.ts' is older than output '../fingerprint/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../fingerprint/tsconfig.json' is up to date because newest input '../fingerprint/src/index.ts' is older than output '../fingerprint/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../keyring/tsconfig.json' is up to date because newest input '../keyring/src/index.ts' is older than output '../keyring/tsconfig.tsbuildinfo'
+1:15:27 PM - Project '../keyring/tsconfig.json' is up to date because newest input '../keyring/src/keyring/keyring.test.ts' is older than output '../keyring/tsconfig.tsbuildinfo'
 
-1:56:29 PM - Project '../account/tsconfig.json' is out of date because output file '../account/tsconfig.tsbuildinfo' does not exist
+1:15:27 PM - Project '../account/tsconfig.json' is out of date because output file '../account/tsconfig.tsbuildinfo' does not exist
 
-1:56:29 PM - Building project '/home/runner/work/captcha/captcha/packages/account/tsconfig.json'...
+1:15:27 PM - Building project '/home/runner/work/captcha/captcha/packages/account/tsconfig.json'...
 
-1:56:31 PM - Project 'tsconfig.json' is out of date because output file 'tsconfig.tsbuildinfo' does not exist
+1:15:30 PM - Project 'tsconfig.json' is out of date because output file 'tsconfig.tsbuildinfo' does not exist
 
-1:56:31 PM - Building project '/home/runner/work/captcha/captcha/packages/procaptcha-common/tsconfig.json'...
+1:15:30 PM - Building project '/home/runner/work/captcha/captcha/packages/procaptcha-common/tsconfig.json'...
 

package/.turbo/turbo-build.log

@@ -1,9 +1,9 @@
 
-> @prosopo/procaptcha-common@2.12.5 build
+> @prosopo/procaptcha-common@2.13.0 build
 > npm run build:cross-env -- --mode ${NODE_ENV:-development}
 
 
-> @prosopo/procaptcha-common@2.12.5 build:cross-env
+> @prosopo/procaptcha-common@2.13.0 build:cross-env
 > vite build --config vite.esm.config.ts --mode production
 
 ViteEsmConfig: .
@@ -43,24 +43,25 @@ ViteEsmConfig: .
 vite v8.1.5 building ssr environment for production...
 Bundle build started
 
-✓ 16 modules transformed.
+✓ 17 modules transformed.
 rendering chunks...
 computing gzip size...
-dist/_virtual/_rolldown/runtime.js      0.04 kB │ gzip: 0.06 kB
-dist/callbacks/defaultEvents.js         0.23 kB │ gzip: 0.15 kB
-dist/extensionLoader.js                 0.25 kB │ gzip: 0.16 kB
-dist/elements/form.js                   0.56 kB │ gzip: 0.30 kB
-dist/simdReadings.js                    0.72 kB │ gzip: 0.35 kB
-dist/clientMetaData.js                  0.81 kB │ gzip: 0.47 kB
-dist/events/trust.js                    0.89 kB │ gzip: 0.52 kB
-dist/elements/window.js                 0.91 kB │ gzip: 0.53 kB
-dist/reactComponents/TestModeBanner.js  1.23 kB │ gzip: 0.71 kB
-dist/index.js                           1.35 kB │ gzip: 0.46 kB
-dist/providers.js                       1.41 kB │ gzip: 0.62 kB
-dist/reactComponents/Honeypot.js        1.86 kB │ gzip: 0.89 kB
-dist/reactComponents/Reload.js          2.69 kB │ gzip: 1.26 kB
-dist/state/builder.js                   3.09 kB │ gzip: 0.84 kB
-dist/callbacks/defaultCallbacks.js      3.64 kB │ gzip: 1.00 kB
-dist/reactComponents/Checkbox.js        4.87 kB │ gzip: 2.04 kB
+dist/_virtual/_rolldown/runtime.js        0.04 kB │ gzip: 0.06 kB
+dist/callbacks/defaultEvents.js           0.23 kB │ gzip: 0.15 kB
+dist/extensionLoader.js                   0.25 kB │ gzip: 0.16 kB
+dist/elements/form.js                     0.56 kB │ gzip: 0.30 kB
+dist/simdReadings.js                      0.72 kB │ gzip: 0.35 kB
+dist/clientMetaData.js                    0.81 kB │ gzip: 0.47 kB
+dist/events/trust.js                      0.89 kB │ gzip: 0.52 kB
+dist/elements/window.js                   0.91 kB │ gzip: 0.53 kB
+dist/reactComponents/TestModeBanner.js    1.23 kB │ gzip: 0.71 kB
+dist/providers.js                         1.41 kB │ gzip: 0.62 kB
+dist/index.js                             1.49 kB │ gzip: 0.50 kB
+dist/reactComponents/Honeypot.js          1.86 kB │ gzip: 0.89 kB
+dist/reactComponents/Reload.js            2.69 kB │ gzip: 1.26 kB
+dist/state/builder.js                     3.09 kB │ gzip: 0.84 kB
+dist/callbacks/defaultCallbacks.js        3.64 kB │ gzip: 1.00 kB
+dist/reactComponents/Checkbox.js          4.87 kB │ gzip: 2.04 kB
+dist/reactComponents/ChallengeSurface.js  5.52 kB │ gzip: 1.99 kB
 
-✓ built in 385ms
+✓ built in 83ms

package/CHANGELOG.md

@@ -1,5 +1,74 @@
 # @prosopo/procaptcha-common
 
+## 2.13.0
+### Minor Changes
+
+- d288371: Let a site choose where a challenge opens, and which button triggers it.
+  
+  - `placement: "popup" | "float"`, also `data-placement`. `popup` is the default and unchanged. `float` opens the challenge directly above the widget and keeps it pinned there as the page scrolls, leaves the page usable behind it, and dismisses on Escape or an outside click. An invisible widget always uses popup.
+  - `bind: "#selector"`, also `data-bind`. The matching host-page button triggers that one widget, in visible or invisible mode. The click's default action is prevented so a submit button does not post the form before a token exists.
+  - `execute(widgetId?)`. Called with no argument every widget responds, as before. Called with the id `render()` returns, only that widget runs. Implicitly rendered invisible buttons now trigger only their own widget.
+  
+  Behaviour changes for existing widgets:
+  
+  - Escape now closes the image and puzzle challenge in both placements. For the image captcha this runs the cancel path, which fires `onClose` and restarts frictionless.
+  - Image and puzzle now present on one shared `ChallengeSurface`. Both were already portalled to `document.body`, so neither moves in the page, but the markup around them changed: the outer layer keeps `prosopo-modalOuter` for the image captcha and also carries `prosopo-challenge-surface`, and a new `prosopo-challenge-content` element sits between it and `prosopo-modalInner`. A direct-child selector such as `.prosopo-modalOuter > .prosopo-modalInner` no longer matches, and the centring transform now lives on `prosopo-challenge-content` rather than on `prosopo-modalInner`.
+  
+  `createConfig` takes a named options object.
+
+### Patch Changes
+
+- Updated dependencies [6f57ee9]
+- Updated dependencies [d288371]
+  - @prosopo/types@5.7.0
+  - @prosopo/account@2.8.88
+  - @prosopo/load-balancer@2.10.40
+
+## 2.12.6
+### Patch Changes
+
+- 89dd38a: chore(deps): batch the outstanding dependabot bumps into one upgrade
+  
+  Rolls up dependabot PRs #3112, #3127-#3134 and #3159. Majors: `mongoose`
+  8 -> 9, `bson` 6 -> 7, `@noble/curves` 1 -> 2, `@polkadot/util-crypto`
+  13 -> 14, `@typegoose/auto-increment` 4 -> 5, `@babel/preset-env` 7 -> 8,
+  `@types/jsdom` 21 -> 30, `@types/bcrypt` 5 -> 6, `@actions/github` 6 -> 9,
+  `testcontainers` 11 -> 12. The rest are minor/patch.
+  
+  Code changes the majors forced:
+  - `@noble/curves` v2 requires `.js` specifiers and renamed the point API,
+    so `secp256k1.ProjectivePoint.fromHex(...).toRawBytes()` becomes
+    `secp256k1.Point.fromBytes(...).toBytes()`, `RistrettoPoint` becomes
+    `ristretto255.Point`, and `abstract/utils` moves to `utils.js`.
+  - mongoose 9 drops `RootFilterQuery` (now `QueryFilter`), no longer sets
+    `background: true` on schema indexes by default, and no longer declares
+    `id` on `Document`, which un-hid a mismatch between
+    `updateDappUserCommitment`'s `Hash` parameter and the `string` `id` it
+    filters on.
+  - mongoose 9 rejects an aggregation-pipeline update (an array) unless the
+    call passes `updatePipeline: true`, so the six pipeline writes in
+    `ProviderDatabase` now opt in explicitly.
+  - mongoose 9's `castUpdate` throws on a `$setOnInsert` key inside `$set`.
+    `storeUserImageCaptchaSolution` passed its record straight in as the
+    update, and mongoose's `moveImmutableProperties` mutates that object on
+    an upsert -- adding the very `$setOnInsert` key the record then carried
+    into `CentralDbStreamer.streamImageRecord`. Image records stopped
+    reaching the central DB (the streamer is fire-and-forget, so it only
+    logged) and signup verification returned 500. The update is now an
+    explicit `$set` over a shallow copy.
+  - `@prosopo/database` moves from mongodb 6.20 to 7.5 to match the driver
+    mongoose 9 pulls, so bson 7 is the only copy resolvable in the package.
+  - `vitest`/`@vitest/coverage-v8` go to 4.1.11 alongside dependabot's
+    `@vitest/spy` bump; leaving them at 4.1.10 installed a second copy of
+    `@vitest/spy` and broke type inference in the provider test utils.
+- Updated dependencies [89dd38a]
+- Updated dependencies [80f73c1]
+- Updated dependencies [8a670d3]
+  - @prosopo/account@2.8.87
+  - @prosopo/load-balancer@2.10.39
+  - @prosopo/types@5.6.0
+  - @prosopo/widget-skeleton@2.8.7
+
 ## 2.12.5
 ### Patch Changes
 

package/dist/cjs/index.cjs

@@ -10,8 +10,10 @@ const require_extensionLoader = require("./extensionLoader.cjs");
 const require_simdReadings = require("./simdReadings.cjs");
 const require_Reload = require("./reactComponents/Reload.cjs");
 const require_Checkbox = require("./reactComponents/Checkbox.cjs");
+const require_ChallengeSurface = require("./reactComponents/ChallengeSurface.cjs");
 const require_Honeypot = require("./reactComponents/Honeypot.cjs");
 const require_TestModeBanner = require("./reactComponents/TestModeBanner.cjs");
+exports.ChallengeSurface = require_ChallengeSurface.ChallengeSurface;
 exports.Checkbox = require_Checkbox.Checkbox;
 exports.ExtensionLoader = require_extensionLoader.ExtensionLoader;
 exports.Honeypot = require_Honeypot.Honeypot;
@@ -20,6 +22,7 @@ exports.SIMD_READINGS_SUBMIT_TIMEOUT_MS = require_simdReadings.SIMD_READINGS_SUB
 exports.TestModeBanner = require_TestModeBanner.TestModeBanner;
 exports.buildClientMetaData = require_clientMetaData.buildClientMetaData;
 exports.buildUpdateState = require_builder.buildUpdateState;
+exports.computeFloatPosition = require_ChallengeSurface.computeFloatPosition;
 exports.getDefaultCallbacks = require_defaultCallbacks.getDefaultCallbacks;
 exports.getDefaultEvents = require_defaultEvents.getDefaultEvents;
 exports.getProcaptchaRandomActiveProvider = require_providers.getProcaptchaRandomActiveProvider;

package/dist/cjs/reactComponents/ChallengeSurface.cjs

@@ -0,0 +1,164 @@
+const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
+let _prosopo_types = require("@prosopo/types");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
+let react_dom = require("react-dom");
+//#region src/reactComponents/ChallengeSurface.tsx
+var SURFACE_Z_INDEX = 2147483646;
+var CONTENT_Z_INDEX = 2147483647;
+var IOS_LIFT_STYLE_ID = "prosopo-challenge-surface-ios-lift";
+var IOS_LIFT_CSS = `
+.prosopo-challenge-content--ios-lift {
+	transform: translate(-50%, -50%);
+}
+@supports (-webkit-touch-callout: none) {
+	.prosopo-challenge-content--ios-lift {
+		transform: translate(-50%, -100%);
+	}
+}
+`;
+var ensureIosLiftStyles = () => {
+	if (typeof document === "undefined") return;
+	if (document.getElementById(IOS_LIFT_STYLE_ID)) return;
+	const style = document.createElement("style");
+	style.id = IOS_LIFT_STYLE_ID;
+	style.textContent = IOS_LIFT_CSS;
+	document.head.appendChild(style);
+};
+var FLOAT_GAP_PX = 8;
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? react.useEffect : react.useLayoutEffect;
+/**
+* Places the panel directly above the anchor, in document coordinates.
+*
+* Document coordinates rather than viewport ones, because the panel is
+* `position: absolute`: the page carries it while scrolling instead of the
+* panel being recomputed against a moving viewport, which is what made it
+* drift. Always above, never flipped, so the challenge does not jump to the
+* other side of the widget as the page moves.
+*/
+var computeFloatPosition = (anchorRect, panelHeight, scrollX, scrollY) => ({
+	top: Math.max(0, anchorRect.top + scrollY - panelHeight - FLOAT_GAP_PX),
+	left: anchorRect.left + scrollX
+});
+var ChallengeSurface = react.default.memo((props) => {
+	const { show, children, placement = _prosopo_types.PlacementEnum.popup, anchor, scrim = "none", onDismiss, popupIosLift = false, className } = props;
+	const contentRef = (0, react.useRef)(null);
+	const [floatPosition, setFloatPosition] = (0, react.useState)(null);
+	const isFloating = placement === _prosopo_types.PlacementEnum.float && !!anchor;
+	const reposition = (0, react.useCallback)(() => {
+		if (!isFloating || !anchor || !contentRef.current) return;
+		const panel = contentRef.current.getBoundingClientRect();
+		const next = computeFloatPosition(anchor.getBoundingClientRect(), panel.height, window.scrollX, window.scrollY);
+		setFloatPosition((current) => current && current.top === next.top && current.left === next.left ? current : next);
+	}, [isFloating, anchor]);
+	useIsomorphicLayoutEffect(() => {
+		if (!show || !isFloating) {
+			setFloatPosition(null);
+			return;
+		}
+		reposition();
+	}, [
+		show,
+		isFloating,
+		reposition
+	]);
+	(0, react.useEffect)(() => {
+		if (!show || !isFloating) return;
+		window.addEventListener("resize", reposition);
+		const observer = typeof ResizeObserver === "function" ? new ResizeObserver(reposition) : null;
+		if (observer && contentRef.current) observer.observe(contentRef.current);
+		if (observer && anchor) observer.observe(anchor);
+		return () => {
+			window.removeEventListener("resize", reposition);
+			observer?.disconnect();
+		};
+	}, [
+		show,
+		isFloating,
+		anchor,
+		reposition
+	]);
+	(0, react.useEffect)(() => {
+		if (!show || !onDismiss) return;
+		const onKeyDown = (event) => {
+			if (event.key === "Escape") onDismiss();
+		};
+		document.addEventListener("keydown", onKeyDown);
+		return () => document.removeEventListener("keydown", onKeyDown);
+	}, [show, onDismiss]);
+	(0, react.useEffect)(() => {
+		if (!show || !isFloating || !onDismiss) return;
+		const onPointerDown = (event) => {
+			const target = event.target;
+			if (!(target instanceof Node)) return;
+			if (contentRef.current?.contains(target)) return;
+			if (anchor?.contains(target)) return;
+			onDismiss();
+		};
+		document.addEventListener("pointerdown", onPointerDown);
+		return () => document.removeEventListener("pointerdown", onPointerDown);
+	}, [
+		show,
+		isFloating,
+		anchor,
+		onDismiss
+	]);
+	(0, react.useEffect)(() => {
+		if (popupIosLift && !isFloating) ensureIosLiftStyles();
+	}, [popupIosLift, isFloating]);
+	if (typeof document === "undefined") return null;
+	const layerStyle = isFloating ? {
+		position: "absolute",
+		top: 0,
+		left: 0,
+		width: 0,
+		height: 0,
+		zIndex: SURFACE_Z_INDEX,
+		display: show ? "block" : "none",
+		pointerEvents: "none"
+	} : {
+		position: "fixed",
+		inset: 0,
+		zIndex: SURFACE_Z_INDEX,
+		display: show ? "flex" : "none",
+		alignItems: "center",
+		justifyContent: "center",
+		minHeight: "100vh",
+		backgroundColor: scrim === "dim" && show ? "rgba(0, 0, 0, 0.4)" : "transparent",
+		transition: "background-color 0.3s ease"
+	};
+	const contentStyle = isFloating ? {
+		position: "absolute",
+		zIndex: CONTENT_Z_INDEX,
+		pointerEvents: "auto",
+		top: `${floatPosition?.top ?? 0}px`,
+		left: `${floatPosition?.left ?? 0}px`,
+		visibility: floatPosition ? "visible" : "hidden"
+	} : {
+		position: "absolute",
+		top: "50%",
+		left: "50%",
+		transform: popupIosLift ? void 0 : "translate(-50%, -50%)",
+		zIndex: CONTENT_Z_INDEX,
+		boxSizing: "border-box"
+	};
+	return (0, react_dom.createPortal)(/* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
+		className: [
+			"prosopo-challenge-surface",
+			`prosopo-challenge-surface--${isFloating ? "float" : "popup"}`,
+			className
+		].filter(Boolean).join(" "),
+		style: layerStyle,
+		children: /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
+			ref: contentRef,
+			className: popupIosLift && !isFloating ? "prosopo-challenge-content prosopo-challenge-content--ios-lift" : "prosopo-challenge-content",
+			style: contentStyle,
+			children
+		})
+	}), document.body);
+});
+ChallengeSurface.displayName = "ChallengeSurface";
+//#endregion
+exports.ChallengeSurface = ChallengeSurface;
+exports.computeFloatPosition = computeFloatPosition;

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export * from "./simdReadings.js";
 export * from "./elements/window.js";
 export * from "./reactComponents/Reload.js";
 export * from "./reactComponents/Checkbox.js";
+export * from "./reactComponents/ChallengeSurface.js";
 export * from "./reactComponents/Honeypot.js";
 export * from "./reactComponents/TestModeBanner.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAcA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,qCAAqC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAcA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uCAAuC,CAAC;AACtD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,qCAAqC,CAAC"}

package/dist/index.js

@@ -10,6 +10,7 @@ import { ExtensionLoader } from "./extensionLoader.js";
 import { SIMD_READINGS_SUBMIT_TIMEOUT_MS, getSimdReadingsForSubmit } from "./simdReadings.js";
 import { ReloadButton } from "./reactComponents/Reload.js";
 import { Checkbox } from "./reactComponents/Checkbox.js";
+import { ChallengeSurface, computeFloatPosition } from "./reactComponents/ChallengeSurface.js";
 import { Honeypot } from "./reactComponents/Honeypot.js";
 import { TestModeBanner } from "./reactComponents/TestModeBanner.js";
-export { Checkbox, ExtensionLoader, Honeypot, ReloadButton, SIMD_READINGS_SUBMIT_TIMEOUT_MS, TestModeBanner, buildClientMetaData, buildUpdateState, getDefaultCallbacks, getDefaultEvents, getProcaptchaRandomActiveProvider, getRetryDelayMs, getSimdReadingsForSubmit, getWindowCallback, isEventTrusted, isSecureBrowserContext, pickIpMode, providerRetry, setUserCallbacks, useProcaptcha };
+export { ChallengeSurface, Checkbox, ExtensionLoader, Honeypot, ReloadButton, SIMD_READINGS_SUBMIT_TIMEOUT_MS, TestModeBanner, buildClientMetaData, buildUpdateState, computeFloatPosition, getDefaultCallbacks, getDefaultEvents, getProcaptchaRandomActiveProvider, getRetryDelayMs, getSimdReadingsForSubmit, getWindowCallback, isEventTrusted, isSecureBrowserContext, pickIpMode, providerRetry, setUserCallbacks, useProcaptcha };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAcA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,qCAAqC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAcA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uCAAuC,CAAC;AACtD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,qCAAqC,CAAC"}

package/dist/reactComponents/ChallengeSurface.d.ts

@@ -0,0 +1,21 @@
+import { type PlacementType } from "@prosopo/types";
+import React, { type ReactNode } from "react";
+export type SurfaceScrim = "none" | "dim";
+interface ChallengeSurfaceProps {
+    show: boolean;
+    children: ReactNode;
+    placement?: PlacementType;
+    anchor?: HTMLElement | null;
+    scrim?: SurfaceScrim;
+    onDismiss?: () => void;
+    popupIosLift?: boolean;
+    className?: string;
+}
+interface FloatPosition {
+    top: number;
+    left: number;
+}
+declare const computeFloatPosition: (anchorRect: DOMRect, panelHeight: number, scrollX: number, scrollY: number) => FloatPosition;
+declare const ChallengeSurface: React.MemoExoticComponent<(props: ChallengeSurfaceProps) => React.ReactPortal | null>;
+export { ChallengeSurface, computeFloatPosition };
+//# sourceMappingURL=ChallengeSurface.d.ts.map

package/dist/reactComponents/ChallengeSurface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChallengeSurface.d.ts","sourceRoot":"","sources":["../../src/reactComponents/ChallengeSurface.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAiB,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACnE,OAAO,KAAK,EAAE,EAEb,KAAK,SAAS,EAMd,MAAM,OAAO,CAAC;AAUf,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,KAAK,CAAC;AAE1C,UAAU,qBAAqB;IAC9B,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAkCD,UAAU,aAAa;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;CACb;AAWD,QAAA,MAAM,oBAAoB,eACb,OAAO,eACN,MAAM,WACV,MAAM,WACN,MAAM,KACb,aAKD,CAAC;AAEH,QAAA,MAAM,gBAAgB,oCAAsB,qBAAqB,8BA6K/D,CAAC;AAIH,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,CAAC"}