simplify-captcha
Version:
A modern React CAPTCHA component library with advanced human verification
1,077 lines (1,028 loc) • 32.7 kB
JavaScript
import se, { memo as ae, useMemo as ce, forwardRef as ie, useEffect as K, useState as A, useRef as le, useCallback as O, useImperativeHandle as ue } from "react";
var q = { exports: {} }, F = {};
/**
* @license React
* react-jsx-runtime.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ee;
function de() {
if (ee) return F;
ee = 1;
var l = Symbol.for("react.transitional.element"), v = Symbol.for("react.fragment");
function u(g, m, h) {
var f = null;
if (h !== void 0 && (f = "" + h), m.key !== void 0 && (f = "" + m.key), "key" in m) {
h = {};
for (var w in m)
w !== "key" && (h[w] = m[w]);
} else h = m;
return m = h.ref, {
$$typeof: l,
type: g,
key: f,
ref: m !== void 0 ? m : null,
props: h
};
}
return F.Fragment = v, F.jsx = u, F.jsxs = u, F;
}
var B = {};
/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var te;
function fe() {
return te || (te = 1, process.env.NODE_ENV !== "production" && function() {
function l(e) {
if (e == null) return null;
if (typeof e == "function")
return e.$$typeof === L ? null : e.displayName || e.name || null;
if (typeof e == "string") return e;
switch (e) {
case N:
return "Fragment";
case E:
return "Profiler";
case V:
return "StrictMode";
case I:
return "Suspense";
case G:
return "SuspenseList";
case Q:
return "Activity";
}
if (typeof e == "object")
switch (typeof e.tag == "number" && console.error(
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
), e.$$typeof) {
case H:
return "Portal";
case $:
return (e.displayName || "Context") + ".Provider";
case J:
return (e._context.displayName || "Context") + ".Consumer";
case X:
var a = e.render;
return e = e.displayName, e || (e = a.displayName || a.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
case D:
return a = e.displayName || null, a !== null ? a : l(e.type) || "Memo";
case T:
a = e._payload, e = e._init;
try {
return l(e(a));
} catch {
}
}
return null;
}
function v(e) {
return "" + e;
}
function u(e) {
try {
v(e);
var a = !1;
} catch {
a = !0;
}
if (a) {
a = console;
var s = a.error, n = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
return s.call(
a,
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
n
), v(e);
}
}
function g(e) {
if (e === N) return "<>";
if (typeof e == "object" && e !== null && e.$$typeof === T)
return "<...>";
try {
var a = l(e);
return a ? "<" + a + ">" : "<...>";
} catch {
return "<...>";
}
}
function m() {
var e = z.A;
return e === null ? null : e.getOwner();
}
function h() {
return Error("react-stack-top-frame");
}
function f(e) {
if (W.call(e, "key")) {
var a = Object.getOwnPropertyDescriptor(e, "key").get;
if (a && a.isReactWarning) return !1;
}
return e.key !== void 0;
}
function w(e, a) {
function s() {
U || (U = !0, console.error(
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
a
));
}
s.isReactWarning = !0, Object.defineProperty(e, "key", {
get: s,
configurable: !0
});
}
function S() {
var e = l(this.type);
return r[e] || (r[e] = !0, console.error(
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
)), e = this.props.ref, e !== void 0 ? e : null;
}
function M(e, a, s, n, t, c, d, k) {
return s = c.ref, e = {
$$typeof: j,
type: e,
key: a,
props: c,
_owner: t
}, (s !== void 0 ? s : null) !== null ? Object.defineProperty(e, "ref", {
enumerable: !1,
get: S
}) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
configurable: !1,
enumerable: !1,
writable: !0,
value: 0
}), Object.defineProperty(e, "_debugInfo", {
configurable: !1,
enumerable: !1,
writable: !0,
value: null
}), Object.defineProperty(e, "_debugStack", {
configurable: !1,
enumerable: !1,
writable: !0,
value: d
}), Object.defineProperty(e, "_debugTask", {
configurable: !1,
enumerable: !1,
writable: !0,
value: k
}), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
}
function P(e, a, s, n, t, c, d, k) {
var i = a.children;
if (i !== void 0)
if (n)
if (Z(i)) {
for (n = 0; n < i.length; n++)
_(i[n]);
Object.freeze && Object.freeze(i);
} else
console.error(
"React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
);
else _(i);
if (W.call(a, "key")) {
i = l(e);
var x = Object.keys(a).filter(function(re) {
return re !== "key";
});
n = 0 < x.length ? "{key: someKey, " + x.join(": ..., ") + ": ...}" : "{key: someKey}", R[i + n] || (x = 0 < x.length ? "{" + x.join(": ..., ") + ": ...}" : "{}", console.error(
`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`,
n,
i,
x,
i
), R[i + n] = !0);
}
if (i = null, s !== void 0 && (u(s), i = "" + s), f(a) && (u(a.key), i = "" + a.key), "key" in a) {
s = {};
for (var C in a)
C !== "key" && (s[C] = a[C]);
} else s = a;
return i && w(
s,
typeof e == "function" ? e.displayName || e.name || "Unknown" : e
), M(
e,
i,
c,
t,
m(),
s,
d,
k
);
}
function _(e) {
typeof e == "object" && e !== null && e.$$typeof === j && e._store && (e._store.validated = 1);
}
var b = se, j = Symbol.for("react.transitional.element"), H = Symbol.for("react.portal"), N = Symbol.for("react.fragment"), V = Symbol.for("react.strict_mode"), E = Symbol.for("react.profiler"), J = Symbol.for("react.consumer"), $ = Symbol.for("react.context"), X = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), G = Symbol.for("react.suspense_list"), D = Symbol.for("react.memo"), T = Symbol.for("react.lazy"), Q = Symbol.for("react.activity"), L = Symbol.for("react.client.reference"), z = b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, W = Object.prototype.hasOwnProperty, Z = Array.isArray, Y = console.createTask ? console.createTask : function() {
return null;
};
b = {
"react-stack-bottom-frame": function(e) {
return e();
}
};
var U, r = {}, y = b["react-stack-bottom-frame"].bind(
b,
h
)(), p = Y(g(h)), R = {};
B.Fragment = N, B.jsx = function(e, a, s, n, t) {
var c = 1e4 > z.recentlyCreatedOwnerStacks++;
return P(
e,
a,
s,
!1,
n,
t,
c ? Error("react-stack-top-frame") : y,
c ? Y(g(e)) : p
);
}, B.jsxs = function(e, a, s, n, t) {
var c = 1e4 > z.recentlyCreatedOwnerStacks++;
return P(
e,
a,
s,
!0,
n,
t,
c ? Error("react-stack-top-frame") : y,
c ? Y(g(e)) : p
);
};
}()), B;
}
var ne;
function me() {
return ne || (ne = 1, process.env.NODE_ENV === "production" ? q.exports = de() : q.exports = fe()), q.exports;
}
var o = me();
const he = `
/* SimplifyCaptcha Styles */
.sc-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.7);
display: flex;
justify-content: center;
align-items: flex-start;
padding-top: 50px;
z-index: 9999;
}
.sc-container {
background-color: #1a1a1a;
border-radius: 15px;
padding: 20px;
width: 85%;
max-width: 400px;
border: 1px solid #48d1cc;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}
.sc-text-captcha-container {
display: flex;
flex-direction: column;
align-items: stretch;
}
.sc-title {
font-size: 18px;
font-weight: bold;
color: #ffffff;
margin-bottom: 8px;
text-align: center;
}
.sc-subtitle {
font-size: 14px;
color: #b0b0b0;
margin-bottom: 20px;
text-align: center;
}
.sc-captcha-container {
margin-bottom: 20px;
position: relative;
}
.sc-captcha-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.sc-captcha-text {
font-family: 'Courier New', monospace;
font-size: 28px;
font-weight: bold;
color: #48d1cc;
text-decoration: line-through;
letter-spacing: 8px;
text-align: center;
user-select: none;
background: linear-gradient(45deg, #48d1cc, #20b2aa);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
flex: 1;
padding: 10px 0;
}
.sc-refresh-button {
background: none;
border: none;
cursor: pointer;
padding: 8px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.2s;
}
.sc-refresh-button:hover {
background-color: rgba(72, 209, 204, 0.1);
}
.sc-refresh-button:active {
transform: scale(0.95);
}
.sc-input-section {
margin-bottom: 20px;
}
.sc-input-label {
font-size: 14px;
color: #ffffff;
margin-bottom: 8px;
display: block;
}
.sc-input {
width: 100%;
padding: 12px;
font-size: 16px;
border: 2px solid #333;
border-radius: 8px;
background-color: #2a2a2a;
color: #ffffff;
transition: border-color 0.2s;
box-sizing: border-box;
}
.sc-input:focus {
outline: none;
border-color: #48d1cc;
}
.sc-button-container {
display: flex;
gap: 10px;
justify-content: flex-end;
}
.sc-button {
padding: 10px 20px;
font-size: 14px;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: bold;
transition: background-color 0.2s, transform 0.1s;
}
.sc-button:active {
transform: scale(0.98);
}
.sc-verify-button {
background-color: #48d1cc;
color: #000000;
}
.sc-verify-button:hover {
background-color: #40c7c4;
}
.sc-verify-button:disabled {
background-color: #666;
color: #999;
cursor: not-allowed;
}
.sc-verify-button:disabled:hover {
background-color: #666;
}
.sc-cancel-button {
background-color: #666;
color: #ffffff;
}
.sc-cancel-button:hover {
background-color: #777;
}
.sc-attempts-text {
font-size: 12px;
color: #ff6b6b;
text-align: center;
margin-top: 10px;
}
/* Animation classes */
.sc-fade-in {
animation: scFadeIn 0.3s ease-out;
}
.sc-fade-out {
animation: scFadeOut 0.3s ease-in;
}
@keyframes scFadeIn {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
@keyframes scFadeOut {
from {
opacity: 1;
transform: scale(1);
}
to {
opacity: 0;
transform: scale(0.9);
}
}
/* Responsive design */
@media (max-width: 480px) {
.sc-container {
width: 95%;
padding: 15px;
}
.sc-title {
font-size: 16px;
}
.sc-captcha-text {
font-size: 24px;
letter-spacing: 6px;
}
.sc-input {
font-size: 14px;
padding: 10px;
}
.sc-button {
padding: 8px 16px;
font-size: 13px;
}
}
/* Accessibility improvements */
.sc-button:focus,
.sc-input:focus,
.sc-refresh-button:focus {
outline: 2px solid #48d1cc;
outline-offset: 2px;
}
/* High contrast mode support */
@media (prefers-contrast: high) {
.sc-container {
border: 2px solid #48d1cc;
}
.sc-captcha-text {
-webkit-text-fill-color: #48d1cc;
color: #48d1cc;
}
}
/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
.sc-fade-in,
.sc-fade-out {
animation: none;
}
.sc-button,
.sc-refresh-button {
transition: none;
}
}
/* Dark mode adjustments */
@media (prefers-color-scheme: light) {
.sc-overlay {
background-color: rgba(255, 255, 255, 0.9);
}
.sc-container {
background-color: #ffffff;
border: 1px solid #48d1cc;
color: #000000;
}
.sc-title {
color: #000000;
}
.sc-subtitle {
color: #666666;
}
.sc-input-label {
color: #000000;
}
.sc-input {
background-color: #f5f5f5;
border: 2px solid #ddd;
color: #000000;
}
.sc-cancel-button {
background-color: #e0e0e0;
color: #000000;
}
.sc-cancel-button:hover {
background-color: #d0d0d0;
}
}
/* Print styles */
@media print {
.sc-overlay {
display: none !important;
}
}
`;
let oe = !1;
const pe = () => {
if (oe || typeof document > "u")
return;
const l = document.createElement("style");
l.id = "simplify-captcha-styles", l.textContent = he, document.getElementById("simplify-captcha-styles") || (document.head.appendChild(l), oe = !0);
}, ge = () => /* @__PURE__ */ o.jsxs("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", children: [
/* @__PURE__ */ o.jsx(
"path",
{
d: "M4 12a8 8 0 018-8V2.5L14 4.5 12 6.5V5a7 7 0 00-7 7h2z",
fill: "#48D1CC"
}
),
/* @__PURE__ */ o.jsx(
"path",
{
d: "M20 12a8 8 0 01-8 8v1.5L10 19.5 12 17.5V19a7 7 0 007-7h-2z",
fill: "#48D1CC"
}
)
] }), xe = ae(({ text: l }) => {
const v = ce(() => {
const u = () => {
const b = [
"#2C3E50",
"#34495E",
"#7F8C8D",
"#95A5A6",
"#BDC3C7",
"#E74C3C",
"#C0392B",
"#E67E22",
"#D35400",
"#F39C12",
"#F1C40F",
"#27AE60",
"#2ECC71",
"#16A085",
"#1ABC9C",
"#3498DB",
"#2980B9",
"#9B59B6",
"#8E44AD"
];
return b[Math.floor(Math.random() * b.length)];
}, g = () => Math.random() * 30 - 15, m = () => 0.8 + Math.random() * 0.4, h = () => Math.random() * 10 - 5, f = () => {
const b = [];
for (let j = 0; j < 50; j++)
b.push({
x: Math.random() * 280,
y: Math.random() * 80,
radius: Math.random() * 2 + 1
});
return b;
}, w = l.split("").map(() => ({
color: u(),
rotation: g(),
scale: m(),
offsetY: h()
})), S = f(), M = Math.floor(Math.random() * 100), P = [
{
path: `M${Math.random() * 50},${20 + Math.random() * 40} Q${70 + Math.random() * 50},${10 + Math.random() * 60} ${150 + Math.random() * 50},${30 + Math.random() * 20}`
},
{
path: `M${200 + Math.random() * 30},${15 + Math.random() * 50} Q${230 + Math.random() * 20},${40 + Math.random() * 20} ${260 + Math.random() * 15},${25 + Math.random() * 30}`
}
], _ = {
circle: {
cx: 50 + Math.random() * 180,
cy: 20 + Math.random() * 40
},
rect: {
x: 100 + Math.random() * 80,
y: 55 + Math.random() * 15,
rotation: Math.random() * 60 - 30
}
};
return {
characterConfigs: w,
noisePoints: S,
turbulenceSeed: M,
distractionLines: P,
distractionElements: _
};
}, [l]);
return /* @__PURE__ */ o.jsxs(
"svg",
{
width: "280",
height: "80",
viewBox: "0 0 280 80",
className: "sc-svg-captcha",
style: { userSelect: "none" },
onContextMenu: (u) => u.preventDefault(),
onDragStart: (u) => u.preventDefault(),
children: [
/* @__PURE__ */ o.jsxs("defs", { children: [
/* @__PURE__ */ o.jsxs("linearGradient", { id: "bgGradient", x1: "0%", y1: "0%", x2: "100%", y2: "100%", children: [
/* @__PURE__ */ o.jsx("stop", { offset: "0%", stopColor: "#f8f9fa", stopOpacity: "0.8" }),
/* @__PURE__ */ o.jsx("stop", { offset: "50%", stopColor: "#e9ecef", stopOpacity: "0.6" }),
/* @__PURE__ */ o.jsx("stop", { offset: "100%", stopColor: "#dee2e6", stopOpacity: "0.4" })
] }),
/* @__PURE__ */ o.jsxs("filter", { id: "distortion", x: "-20%", y: "-20%", width: "140%", height: "140%", children: [
/* @__PURE__ */ o.jsx(
"feTurbulence",
{
baseFrequency: "0.02 0.03",
numOctaves: "2",
result: "turbulence",
seed: v.turbulenceSeed
}
),
/* @__PURE__ */ o.jsx("feDisplacementMap", { in: "SourceGraphic", in2: "turbulence", scale: "3" })
] }),
/* @__PURE__ */ o.jsx("filter", { id: "shadow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: /* @__PURE__ */ o.jsx(
"feDropShadow",
{
dx: "1",
dy: "1",
stdDeviation: "1",
floodColor: "rgba(0,0,0,0.3)"
}
) }),
/* @__PURE__ */ o.jsxs(
"pattern",
{
id: "linePattern",
patternUnits: "userSpaceOnUse",
width: "4",
height: "4",
children: [
/* @__PURE__ */ o.jsx("rect", { width: "4", height: "4", fill: "none" }),
/* @__PURE__ */ o.jsx("path", { d: "M0,4 L4,0", stroke: "rgba(0,0,0,0.1)", strokeWidth: "0.5" })
]
}
)
] }),
/* @__PURE__ */ o.jsx("rect", { width: "280", height: "80", fill: "url(#bgGradient)" }),
/* @__PURE__ */ o.jsx("rect", { width: "280", height: "80", fill: "url(#linePattern)", opacity: "0.5" }),
v.noisePoints.map((u, g) => /* @__PURE__ */ o.jsx(
"circle",
{
cx: u.x,
cy: u.y,
r: u.radius,
fill: "rgba(0,0,0,0.1)",
opacity: "0.3"
},
`noise-${g}`
)),
v.distractionLines.map((u, g) => /* @__PURE__ */ o.jsx(
"path",
{
d: u.path,
stroke: "rgba(0,0,0,0.2)",
strokeWidth: "1.5",
fill: "none",
opacity: "0.6"
},
`line-${g}`
)),
l.split("").map((u, g) => {
const m = 35 + g * 45, h = 45, f = v.characterConfigs[g];
return /* @__PURE__ */ o.jsxs("g", { children: [
/* @__PURE__ */ o.jsx(
"text",
{
x: m + 1,
y: h + f.offsetY + 1,
fontSize: "32",
fontFamily: "Arial, sans-serif",
fontWeight: "bold",
fill: "rgba(0,0,0,0.3)",
textAnchor: "middle",
dominantBaseline: "middle",
transform: `rotate(${f.rotation} ${m} ${h + f.offsetY}) scale(${f.scale})`,
filter: "url(#distortion)",
children: u
}
),
/* @__PURE__ */ o.jsx(
"text",
{
x: m,
y: h + f.offsetY,
fontSize: "32",
fontFamily: "Arial, sans-serif",
fontWeight: "bold",
fill: f.color,
textAnchor: "middle",
dominantBaseline: "middle",
transform: `rotate(${f.rotation} ${m} ${h + f.offsetY}) scale(${f.scale})`,
filter: "url(#distortion)",
children: u
}
)
] }, `char-${g}`);
}),
/* @__PURE__ */ o.jsx(
"circle",
{
cx: v.distractionElements.circle.cx,
cy: v.distractionElements.circle.cy,
r: "2",
fill: "rgba(0,0,0,0.2)",
opacity: "0.5"
}
),
/* @__PURE__ */ o.jsx(
"rect",
{
x: v.distractionElements.rect.x,
y: v.distractionElements.rect.y,
width: "3",
height: "8",
fill: "rgba(0,0,0,0.15)",
transform: `rotate(${v.distractionElements.rect.rotation})`,
opacity: "0.4"
}
)
]
}
);
}), ve = ie(
({ onMessage: l, style: v, className: u }, g) => {
K(() => {
pe();
}, []);
const [m, h] = A(!1), [f, w] = A(""), [S, M] = A(""), [P, _] = A(0), [b, j] = A(!1), [H, N] = A(!1), V = 30, E = le({
mountTime: Date.now(),
// Mouse tracking
mouseMovements: [],
mouseTotalDistance: 0,
mouseVelocityChanges: 0,
clickCount: 0,
clickTimings: [],
// Touch tracking
touchPoints: [],
touchGestures: 0,
multiTouchEvents: 0,
// Scroll tracking
scrollEvents: 0,
scrollDirection: { up: 0, down: 0, left: 0, right: 0 },
// Keyboard tracking
keystrokeCount: 0,
keystrokeTiming: [],
// General interaction patterns
totalInteractions: 0,
userActive: !1,
lastActivityTime: Date.now(),
interactionPattern: 0,
naturalBehaviorScore: 0,
// Device capabilities
hasTouch: "ontouchstart" in window,
hasMouse: !0,
// Assume mouse availability, adjust based on interactions
devicePixelRatio: window.devicePixelRatio || 1
});
K(() => {
E.current.mountTime = Date.now(), E.current.lastActivityTime = Date.now();
const r = (s) => {
const n = Date.now(), t = E.current, c = { x: s.clientX, y: s.clientY, timestamp: n };
if (t.mouseMovements.push(c), t.mouseMovements.length > 50 && t.mouseMovements.shift(), t.mouseMovements.length > 1) {
const d = t.mouseMovements[t.mouseMovements.length - 2], k = Math.sqrt(
Math.pow(c.x - d.x, 2) + Math.pow(c.y - d.y, 2)
);
if (t.mouseTotalDistance += k, t.mouseMovements.length > 2) {
const i = t.mouseMovements[t.mouseMovements.length - 3], x = Math.sqrt(
Math.pow(d.x - i.x, 2) + Math.pow(d.y - i.y, 2)
) / (d.timestamp - i.timestamp), C = k / (n - d.timestamp);
Math.abs(C - x) > 0.1 && t.mouseVelocityChanges++;
}
}
t.userActive = !0, t.lastActivityTime = n, t.totalInteractions++, t.hasMouse = !0;
}, y = () => {
const s = Date.now(), n = E.current;
if (n.clickCount++, n.clickTimings.push(s), n.clickTimings.length > 10 && n.clickTimings.shift(), n.userActive = !0, n.lastActivityTime = s, n.totalInteractions++, n.clickTimings.length > 1) {
const t = s - n.clickTimings[n.clickTimings.length - 2];
t > 100 && t < 2e3 && (n.naturalBehaviorScore += 1);
}
}, p = (s) => {
const n = Date.now(), t = E.current;
t.touchGestures++, t.userActive = !0, t.lastActivityTime = n, t.totalInteractions++, s.touches.length > 1 && t.multiTouchEvents++, Array.from(s.touches).forEach((c) => {
t.touchPoints.push({
x: c.clientX,
y: c.clientY,
timestamp: n,
pressure: c.force || 1
});
}), t.touchPoints.length > 20 && t.touchPoints.shift(), t.hasMouse = !1;
}, R = (s) => {
const n = Date.now(), t = E.current;
if (t.userActive = !0, t.lastActivityTime = n, t.totalInteractions++, s.touches.length === 1 && t.touchPoints.length > 0) {
const c = s.touches[0], d = t.touchPoints[t.touchPoints.length - 1], k = Math.sqrt(
Math.pow(c.clientX - d.x, 2) + Math.pow(c.clientY - d.y, 2)
);
k > 5 && k < 100 && (t.naturalBehaviorScore += 0.5);
}
}, e = () => {
const s = Date.now(), n = E.current;
n.scrollEvents++, n.userActive = !0, n.lastActivityTime = s, n.totalInteractions++, n.naturalBehaviorScore += 0.2;
}, a = () => {
const s = Date.now(), n = E.current;
if (n.keystrokeCount++, n.keystrokeTiming.push(s), n.keystrokeTiming.length > 20 && n.keystrokeTiming.shift(), n.userActive = !0, n.lastActivityTime = s, n.totalInteractions++, n.keystrokeTiming.length > 1) {
const t = s - n.keystrokeTiming[n.keystrokeTiming.length - 2];
t > 50 && t < 500 && (n.naturalBehaviorScore += 0.3);
}
};
return document.addEventListener("mousemove", r, {
passive: !0
}), document.addEventListener("click", y, { passive: !0 }), document.addEventListener("touchstart", p, {
passive: !0
}), document.addEventListener("touchmove", R, {
passive: !0
}), document.addEventListener("scroll", e, { passive: !0 }), document.addEventListener("keydown", a, { passive: !0 }), () => {
document.removeEventListener("mousemove", r), document.removeEventListener("click", y), document.removeEventListener("touchstart", p), document.removeEventListener("touchmove", R), document.removeEventListener("scroll", e), document.removeEventListener("keydown", a);
};
}, []);
const [J, $] = A(!1), [X, I] = A(!1), G = O(() => {
const r = E.current, y = Date.now();
let p = 0;
const R = y - r.mountTime, e = Math.min(Math.max((R - 2e3) / 1e3, 0), 15);
if (p += e, r.hasMouse && r.mouseMovements.length > 5) {
const t = Math.min(r.mouseTotalDistance / 100, 15), c = Math.min(r.mouseVelocityChanges / 5, 10);
p += t + c;
}
if (r.hasTouch && r.touchGestures > 0) {
const t = Math.min(r.touchGestures * 3, 15), c = Math.min(r.multiTouchEvents * 5, 10);
p += t + c;
}
if (r.clickCount > 0) {
const t = Math.min(r.clickCount * 2, 10);
let c = 0;
if (r.clickTimings.length > 2) {
const d = [];
for (let x = 1; x < r.clickTimings.length; x++)
d.push(r.clickTimings[x] - r.clickTimings[x - 1]);
const k = d.reduce((x, C) => x + C, 0) / d.length, i = d.reduce(
(x, C) => x + Math.pow(C - k, 2),
0
) / d.length;
c = Math.min(Math.sqrt(i) / 100, 5);
}
p += t + c;
}
if (r.keystrokeCount > 0) {
const t = Math.min(r.keystrokeCount * 0.5, 5);
let c = 0;
if (r.keystrokeTiming.length > 3) {
const d = [];
for (let i = 1; i < r.keystrokeTiming.length; i++)
d.push(
r.keystrokeTiming[i] - r.keystrokeTiming[i - 1]
);
c = d.some(
(i) => i > 80 && i < 400
) ? 5 : 0;
}
p += t + c;
}
if (r.scrollEvents > 0) {
const t = Math.min(r.scrollEvents * 1, 10);
p += t;
}
const a = Math.min(r.naturalBehaviorScore, 15);
p += a;
let s = 0;
return r.hasTouch && r.touchGestures > 0 ? s = 3 : !r.hasTouch && r.mouseMovements.length > 0 && (s = 5), p += s, R < 1e3 ? p *= 0.3 : r.totalInteractions === 0 && (p *= 0.1), Math.min(Math.round(p), 100);
}, []), D = O(() => {
const r = "ABCDEFGHIJKLMNPQRSTUVWXYZ123456789";
let y = "";
for (let p = 0; p < 5; p++)
y += r.charAt(Math.floor(Math.random() * r.length));
return y;
}, []), T = O(() => {
h(!1), M(""), N(!1), j(!1), $(!1), I(!1);
}, []), Q = O(() => {
const r = D();
w(r), M(""), _(0), h(!0), N(!1), j(!0), $(!0), I(!0), setTimeout(() => {
const y = G();
$(!1), I(!1), y >= 80 ? (j(!1), T(), l({ nativeEvent: { data: "verified" } })) : (j(!1), N(!0));
}, 1500);
}, [D, G, T, l]), L = O(() => {
const r = D();
w(r), M("");
}, [D]), z = O(() => {
T(), l({ nativeEvent: { data: "cancel" } });
}, [T, l]), W = O(() => {
if (S.toUpperCase() === f.toUpperCase())
T(), l({ nativeEvent: { data: "verified" } });
else {
const r = P + 1;
_(r), r >= V ? (T(), l({ nativeEvent: { data: "error" } })) : (alert(
`Incorrect Captcha. Please try again. ${V - r} attempts remaining.`
), L());
}
}, [S, f, P, T, l, L]), Z = () => /* @__PURE__ */ o.jsxs("div", { className: "sc-gesture-container", children: [
/* @__PURE__ */ o.jsx("h3", { className: "sc-gesture-title", children: "Human Verification" }),
/* @__PURE__ */ o.jsx("p", { className: "sc-gesture-subtitle", children: "We've been analyzing your natural interaction patterns" }),
/* @__PURE__ */ o.jsx("div", { className: "sc-gesture-area", children: /* @__PURE__ */ o.jsx("div", { className: "sc-gesture-instructions", children: /* @__PURE__ */ o.jsx("p", { className: "sc-gesture-instruction-text", children: "Analyzing your interaction patterns..." }) }) }),
/* @__PURE__ */ o.jsx("p", { className: "sc-gesture-hint", children: "This helps us verify you're human without additional steps" })
] }), Y = () => /* @__PURE__ */ o.jsxs("div", { className: "sc-checking-container", children: [
/* @__PURE__ */ o.jsx("h3", { className: "sc-checking-title", children: "Analyzing..." }),
/* @__PURE__ */ o.jsxs("div", { className: "sc-checking-content", children: [
/* @__PURE__ */ o.jsx(
"div",
{
className: `sc-checking-spinner ${J ? "sc-rotating" : ""}`,
children: /* @__PURE__ */ o.jsx(
"div",
{
className: `sc-spinner-dot ${X ? "sc-pulsing" : ""}`
}
)
}
),
/* @__PURE__ */ o.jsx("p", { className: "sc-checking-text", children: "Verifying you are a Human" })
] })
] }), U = () => /* @__PURE__ */ o.jsxs("div", { className: "sc-text-captcha-container", children: [
/* @__PURE__ */ o.jsx("h3", { className: "sc-title", children: "Humanity Verification" }),
/* @__PURE__ */ o.jsx("p", { className: "sc-subtitle", children: "Please enter the text shown below" }),
/* @__PURE__ */ o.jsx("div", { className: "sc-captcha-container", children: /* @__PURE__ */ o.jsxs("div", { className: "sc-captcha-svg-container", children: [
/* @__PURE__ */ o.jsx(xe, { text: f }),
/* @__PURE__ */ o.jsx(
"button",
{
className: "sc-refresh-button",
onClick: L,
type: "button",
children: /* @__PURE__ */ o.jsx(ge, {})
}
)
] }) }),
/* @__PURE__ */ o.jsx(
"input",
{
className: "sc-input",
value: S,
onChange: (r) => M(r.target.value),
placeholder: "Enter the text above",
maxLength: 5,
autoComplete: "off"
}
),
/* @__PURE__ */ o.jsxs("div", { className: "sc-button-container", children: [
/* @__PURE__ */ o.jsx(
"button",
{
className: "sc-button sc-cancel-button",
onClick: z,
type: "button",
children: "Cancel"
}
),
/* @__PURE__ */ o.jsx(
"button",
{
className: "sc-button sc-submit-button",
onClick: W,
type: "button",
children: "Verify"
}
)
] })
] });
return ue(g, () => ({
show: Q,
hide: T
})), m ? /* @__PURE__ */ o.jsx("div", { className: "sc-overlay", children: /* @__PURE__ */ o.jsx("div", { className: `sc-container ${u || ""}`, style: v, children: b ? Y() : H ? U() : Z() }) }) : null;
}
);
ve.displayName = "SimplifyCaptcha";
export {
ve as SimplifyCaptcha,
pe as injectStyles
};