@gladesinger/vue3-yandex-smartcaptcha
Version:
Yandex Smart Captcha Vue component
124 lines (123 loc) • 4.4 kB
JavaScript
import { ref as H, computed as L, onMounted as P, onBeforeUnmount as T, openBlock as V, createBlock as z, h as I } from "vue";
const K = {
__name: "YandexSmartCaptcha",
props: {
siteKey: {
type: String,
required: !0
},
language: {
type: String,
default: "ru",
validator: (r) => ["ru", "en", "be", "kk", "tt", "uk", "uz", "tr"].includes(r)
},
test: {
type: Boolean,
default: !1
},
webview: {
type: Boolean,
default: !1
},
invisible: {
type: Boolean,
default: !1
},
shieldPosition: {
type: String,
default: "bottom-right"
},
hideShield: {
type: Boolean,
default: !1
},
loadWidget: {
type: Boolean,
default: !0
}
},
emits: [
"callback",
"onChallengeVisible",
"onChallengeHidden",
"onNetworkError",
"onJavaScriptError",
"onSuccess",
"onTokenExpired"
],
setup(r, { expose: c, emit: m }) {
const n = r, o = m, e = H("captcha-container");
let t;
const i = () => {
var a, s, d, l, u, p, h;
if (window && document && (window != null && window.smartCaptcha) && e.value) {
const w = document == null ? void 0 : document.getElementById(e.value);
w && (e.value = (a = window == null ? void 0 : window.smartCaptcha) == null ? void 0 : a.render(w, {
sitekey: n.siteKey,
hl: n.language,
test: n.test,
webview: n.webview,
invisible: n.invisible,
shieldPosition: n.shieldPosition,
hideShield: n.hideShield,
callback: b
}), (s = window == null ? void 0 : window.smartCaptcha) == null || s.subscribe(e.value, "success", y), (d = window == null ? void 0 : window.smartCaptcha) == null || d.subscribe(e.value, "challenge-visible", g), (l = window == null ? void 0 : window.smartCaptcha) == null || l.subscribe(e.value, "challenge-hidden", v), (u = window == null ? void 0 : window.smartCaptcha) == null || u.subscribe(e.value, "network-error", f), (p = window == null ? void 0 : window.smartCaptcha) == null || p.subscribe(e.value, "javascript-error", C), (h = window == null ? void 0 : window.smartCaptcha) == null || h.subscribe(e.value, "token-expired", k));
}
}, b = (a) => {
o("callback", a);
}, g = () => {
o("onChallengeVisible");
}, v = () => {
o("onChallengeHidden");
}, f = () => {
o("onNetworkError", { message: "Network error occured" });
}, C = (a) => {
o("onJavaScriptError", a);
}, y = (a) => {
o("onSuccess", a);
}, k = () => {
o("onTokenExpired");
}, x = () => {
window != null && window.smartCaptcha && window.smartCaptcha.execute(e.value);
}, E = () => {
window != null && window.smartCaptcha && window.smartCaptcha.getResponse(e.value);
}, S = () => {
window != null && window.smartCaptcha && window.smartCaptcha.reset(e.value);
}, B = () => {
window != null && window.smartCaptcha && window.smartCaptcha.destroy(e.value);
}, _ = (a, s) => {
window != null && window.smartCaptcha && window.smartCaptcha.subscribe(e.value, a, s);
}, j = L(() => n.invisible ? { height: 0, width: 0 } : { width: "100px" });
P(() => {
n.loadWidget && (t = Array.from(document.getElementsByTagName("script")).find((a) => a.src.includes("smartcaptcha.yandexcloud.net/captcha.js")), t ? t.loaded ? i() : t.addEventListener("load", i) : (t = document.createElement("script"), t.src = "https://smartcaptcha.yandexcloud.net/captcha.js?render=onload&onload=onloadFunction", t.type = "text/javascript", t.defer = !0, t.crossOrigin = "anonymous", document.head.appendChild(t), t.onload = function() {
t.loaded = !0, i();
}));
}), T(() => {
if (window && (window != null && window.smartCaptcha))
try {
window.smartCaptcha.destroy(e.value);
} catch {
}
document && document.getElementsByClassName("smart-captcha").length == 1 && t && t.remove();
}), c({
widgetId: e,
execute: x,
getResponse: E,
reset: S,
destroy: B,
subscribe: _
});
const N = () => I(
"div",
{
style: j.value,
id: e.value,
class: "smart-captcha"
}
);
return (a, s) => (V(), z(N));
}
};
export {
K as YandexSmartCaptcha
};