@google-translate-select/vue3
Version:
🚀 The package offer vue3 library for @google-translate-select!
96 lines (95 loc) • 3.76 kB
JavaScript
import p from "./index5.mjs";
import { openBlock as l, createElementBlock as a, Fragment as r, normalizeClass as n, createElementVNode as o, createTextVNode as i, toDisplayString as t, createCommentVNode as v, createVNode as g, Transition as m, withCtx as w, withDirectives as h, normalizeStyle as f, renderList as b, withModifiers as u, vShow as C } from "vue";
import L from "./index6.mjs";
const y = /* @__PURE__ */ o("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [
/* @__PURE__ */ o("path", {
fill: "currentColor",
d: "M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"
})
], -1), c = [
y
], S = ["data-language-code", "onClick", "onMouseenter"], D = ["id"];
function M(e, d, k, B, N, H) {
return l(), a(r, null, [
e.hasLanguages ? (l(), a("div", {
key: 0,
ref: "googleTranslateSelectEl",
class: n(e.getClass),
onMouseenter: d[1] || (d[1] = (...s) => e.handleDropdownShowByHover && e.handleDropdownShowByHover(...s)),
onMouseleave: d[2] || (d[2] = (...s) => e.handleDropdownHideByHover && e.handleDropdownHideByHover(...s))
}, [
o("div", {
class: n([e.ns.b("dropdown")])
}, [
o("div", {
class: n([e.ns.be("dropdown", "activator")])
}, [
o("div", {
class: n([e.ns.b("language")])
}, [
o("div", {
class: n([e.ns.b("flag")])
}, [
o("div", {
class: n([e.ns.be("flag", e.selectedLanguageOption.code)])
}, null, 2)
], 2),
i(" " + t(e.selectedLanguageOption.name), 1)
], 2),
e.showArrow ? (l(), a("div", {
key: 0,
class: n([e.ns.b("icon"), e.visible ? e.ns.is("reverse") : ""])
}, c, 2)) : v("", !0)
], 2),
g(m, { name: "google-translate-select-zoom-in-top" }, {
default: w(() => [
h(o("div", {
class: n([e.ns.be("dropdown", "menu"), e.dropdownClassName]),
style: f(e.dropdownStyle)
}, [
o("ul", null, [
(l(!0), a(r, null, b(e.languages, (s) => (l(), a("li", {
key: `language-${s.code}`,
class: n([
e.ns.be("dropdown", "menu__item"),
e.hoveredLanguageCode === s.code ? "hover" : "",
e.selectedLanguageCode === s.code ? "selected" : ""
]),
"data-language-code": s.code,
onClick: () => e.handleTranslate(s.code),
onMouseenter: u(() => e.hoveredLanguageCode = s.code, ["stop"]),
onMouseleave: d[0] || (d[0] = u(() => e.hoveredLanguageCode = "", ["stop"]))
}, [
o("div", {
class: n([e.ns.b("language")])
}, [
o("div", {
class: n([e.ns.b("flag")])
}, [
o("div", {
class: n([e.ns.be("flag", s.code)])
}, null, 2)
], 2),
i(" " + t(s.name), 1)
], 2)
], 42, S))), 128))
])
], 6), [
[C, e.visible]
])
]),
_: 1
})
], 2)
], 34)) : v("", !0),
o("div", { id: e.GOOGLE_TRANSLATE_ORIGINAL_DOM_ID }, null, 8, D)
], 64);
}
const $ = /* @__PURE__ */ L(p, [["render", M]]);
export {
$ as default
};
//# sourceMappingURL=index2.mjs.map