vue3-translate-select
Version:
🚀 The package offer vue3 library for @google-translate-select!
204 lines (203 loc) • 6.72 kB
JavaScript
import { defineComponent as p, ref as u, computed as v, unref as o, onMounted as ee, onBeforeUnmount as ne, defineExpose as te, watch as ae } from "vue";
import { createNamespace as oe, useMutationObserver as I, createStyleTag as ue, createGoogleTranslateJsonpCallback as ge, createScriptTag as le, removeIcon as se, isString as ie, GoogleTranslateFireEvent as re, getCookie as ce } from "./index8.mjs";
import { GOOGLE_TRANSLATE_STOP_TRANSLATE_CLASSNAME as de, GOOGLE_TRANSLATE_ORIGINAL_DOM_ID as fe, GOOGLE_TRANSLATE_JSSDK_URL as Le, GOOGLE_TRANSLATE_ORIGINAL_SELECT_CLASSNAME as N, GOOGLE_TRANSLATE_COOKIE_NAME as me } from "./index7.mjs";
import "./index9.mjs";
import { googleTranslateProps as ve } from "./index4.mjs";
const T = oe("select"), Ce = p({
name: T.n,
inheritAttrs: !1,
props: ve,
emits: ["select"],
setup(n, { emit: _, attrs: y }) {
const r = u(null), c = u(!1), g = u(""), x = u(""), f = u(-1), O = u(""), S = u(null), s = u({}), L = u(
{}
), m = u(!1), D = v(() => [T.b(), de, y.class]), R = v(
() => n.languages && n.languages.length
), B = v(() => A()), M = v(() => H());
function A() {
const e = n.languages.find(
(t) => t.code === o(g)
);
return e || n.languages.find(
(a) => a.code === n.defaultLanguageCode
);
}
function H() {
if (!n.languages.length)
return n.languages[0];
const e = n.languages.findIndex(
(a) => a.code === o(g)
);
if (e === -1)
return n.languages[0];
const t = e === n.languages.length - 1 ? 0 : e + 1;
return n.languages[t];
}
function U() {
return ue(
"body { top: 0 !important; } .skiptranslate { display: none !important; }"
);
}
function V() {
const e = n.defaultPageLanguageCode, { jsonpCallbackName: t } = ge(
{
pageLanguage: e
},
z
);
O.value = t;
}
function $() {
return le(
n.googleScriptUrl.length ? `${n.googleScriptUrl}?cb=${o(O)}` : `${Le}?cb=${o(O)}`
);
}
function q() {
U(), V(), S.value = $();
}
function F() {
s.value = I(
document.querySelector(N),
(e) => {
e.forEach((t) => {
t.addedNodes[0] && t.addedNodes[0].value && g.value === t.addedNodes[0].value && w(
t.addedNodes[0].value
);
});
},
{
childList: !0,
subtree: !0
}
), o(s).start();
}
function J() {
L.value = I(
document.querySelector("html"),
(e) => {
e.forEach((t) => {
if (t.attributeName === "lang") {
const a = t.target.getAttribute(
"lang"
), l = t.oldValue;
l !== a && l && l !== "auto" && a === "auto" && i(o(g));
}
}), se();
},
{
attributes: !0,
attributeOldValue: !0
}
), o(L).start();
}
function w(e) {
if (!e)
return;
const t = ie(e) ? e : e.value ?? "", a = document.querySelector(
N
), l = document.querySelector(`.${T.b()}`);
t == n.defaultLanguageCode && g.value && t != g.value && (console.log("reload"), n.reload()), !l || !a || l.innerHTML.length === 0 || a.options.length === 0 ? F() : (a.value = t, re(a, "change"), o(s) && o(s).stop());
}
function K(e) {
return n.languages.find((a) => a.code === e) ? e : "en";
}
function P() {
const e = window.navigator.language || document.documentElement.lang || "en";
return ["zh-CN", "zh-TW"].every((a) => a !== e) && e.indexOf("-") > -1 ? e.split("-")[0] : e;
}
function j() {
const e = ce(me);
if (e) {
const t = e.split("/");
return t[2] ? t[2] : "en";
} else
return "";
}
function z() {
const e = n.fetchBrowserLanguage, t = e ? K(P()) : "", a = j(), l = !!a, h = () => n.defaultLanguageCode ? n.defaultLanguageCode : "en", X = () => n.languages.find(
(C) => C.code === t
) ? t : h(), Y = () => n.languages.find(
(C) => C.code === a
) ? a : h();
let E = h();
l ? E = Y() : e && (E = X()), i(E);
}
function i(e) {
w(e), g.value = e, _("select", A());
}
function b() {
clearTimeout(o(f)), f.value = -1;
}
function W(e) {
n.trigger === "hover" && (b(), f.value = window.setTimeout(() => {
var a;
const t = e.target;
o(r) && ((a = o(r)) != null && a.contains(t)) && (c.value = !0);
}, 0));
}
function Q() {
n.trigger === "hover" && (b(), f.value = window.setTimeout(() => {
c.value = !1;
}, n.animateTimeout));
}
function k(e) {
var a;
const t = e.target;
o(r) && ((a = o(r)) != null && a.contains(t)) ? c.value = !0 : c.value = !1;
}
function d(e) {
n.type === "carousel" && e.key === "ArrowRight" && (e.preventDefault(), G());
}
function G() {
if (!n.languages.length || m.value)
return;
const e = n.languages.findIndex(
(a) => a.code === g.value
);
if (e === -1) {
i(n.languages[0].code);
return;
}
const t = e === n.languages.length - 1 ? 0 : e + 1;
m.value = !0, setTimeout(() => {
i(n.languages[t].code), setTimeout(() => {
m.value = !1;
}, 300);
}, 50);
}
return ee(() => {
q(), J(), n.trigger === "click" && document.addEventListener("click", k), n.type === "carousel" && document.addEventListener("keydown", d);
}), ne(() => {
var e, t, a;
(e = o(s)) != null && e.stop && o(s).stop(), (t = o(L)) != null && t.stop && o(L).stop(), (a = o(S)) != null && a.unload && o(S).unload(), n.trigger === "click" && document.removeEventListener("click", k), n.type === "carousel" && document.removeEventListener("keydown", d);
}), te({
handleTranslate: i
}), ae(
() => n.isCarouselListenerDisabled,
(e) => {
e ? document.removeEventListener("keydown", d) : document.addEventListener("keydown", d);
}
), {
ns: T,
googleTranslateSelectEl: r,
visible: c,
selectedLanguageCode: g,
hoveredLanguageCode: x,
isAnimating: m,
getClass: D,
hasLanguages: R,
selectedLanguageOption: B,
nextLanguageOption: M,
handleTranslate: i,
handleDropdownShowByHover: W,
handleDropdownHideByHover: Q,
handleKeyDown: d,
handleNextLanguage: G,
GOOGLE_TRANSLATE_ORIGINAL_DOM_ID: fe
};
}
});
export {
Ce as default
};
//# sourceMappingURL=index5.mjs.map