golden-logic-ui 1.2.375 → 1.3.0

package/dist/components/GeneralComponents/GlCodeMirrorTranslate.vue.js

@@ -1,13 +1,15 @@
-import { ref as k, onMounted as j, watch as w, onUnmounted as A, createElementBlock as g, openBlock as c, Fragment as q, createCommentVNode as S, normalizeClass as f, createElementVNode as l, withDirectives as D, toDisplayString as d, vModelText as M } from "vue";
-import { EditorState as G, StateEffect as U } from "../../node_modules/@codemirror/state/dist/index.js";
-import { highlightActiveLineGutter as h, keymap as L, EditorView as u, lineNumbers as W } from "../../node_modules/@codemirror/view/dist/index.js";
-import { defaultKeymap as T } from "../../node_modules/@codemirror/commands/dist/index.js";
-import { javascript as z } from "../../node_modules/@codemirror/lang-javascript/dist/index.js";
-import { html as F } from "../../node_modules/@codemirror/lang-html/dist/index.js";
-import { oneDark as E } from "../../node_modules/@codemirror/theme-one-dark/dist/index.js";
-import { autocompletion as C } from "../../node_modules/@codemirror/autocomplete/dist/index.js";
+import { ref as q, watch as S, onMounted as D, onUnmounted as F, createElementBlock as g, openBlock as h, Fragment as G, createCommentVNode as E, normalizeClass as s, createElementVNode as n, toDisplayString as r, unref as u } from "vue";
+import { glLocale as b } from "../../localeStore.js";
+import { useTranslations as M } from "../../useTranslations.js";
+import { EditorState as z, StateEffect as H } from "../../node_modules/@codemirror/state/dist/index.js";
+import { highlightActiveLineGutter as L, keymap as J, EditorView as y, lineNumbers as K } from "../../node_modules/@codemirror/view/dist/index.js";
+import { defaultKeymap as O } from "../../node_modules/@codemirror/commands/dist/index.js";
+import { javascript as U } from "../../node_modules/@codemirror/lang-javascript/dist/index.js";
+import { html as W } from "../../node_modules/@codemirror/lang-html/dist/index.js";
+import { oneDark as _ } from "../../node_modules/@codemirror/theme-one-dark/dist/index.js";
+import { autocompletion as I } from "../../node_modules/@codemirror/autocomplete/dist/index.js";
 /* empty css                           */
-const H = { class: "font-bold ptext-lg dark:text-white" }, I = ["id"], K = ["name", "id"], O = ["for"], J = ["name", "id"], P = ["name", "id"], Q = { class: "gl-span-form-error" }, R = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, ie = {
+const P = { class: "font-bold ptext-lg dark:text-white" }, Q = ["id"], R = ["name", "id", "value"], X = ["for"], Y = { class: "language-label js-language-label bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300" }, Z = ["name", "id", "value"], $ = ["name", "id"], ee = { class: "gl-span-form-error" }, te = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, fe = {
   __name: "GlCodeMirrorTranslate",
   props: {
     modelValue: {
@@ -43,152 +45,134 @@ const H = { class: "font-bold ptext-lg dark:text-white" }, I = ["id"], K = ["nam
       default: !0
     }
   },
-  emits: ["update:modelValue", "change"],
-  setup(e, { emit: N }) {
-    const n = e, r = N, m = k(null), s = k(null);
-    let i = null;
-    const p = (t) => {
+  emits: ["update:modelValue", "update:modelValueTranslate", "change"],
+  setup(e, { emit: C }) {
+    const a = e, p = C, d = q(null);
+    let i = null, m = !1;
+    const v = () => {
+      if (!i)
+        return;
+      const t = i.state.doc.toString();
+      t !== o.value && (m = !0, i.dispatch({
+        changes: { from: 0, to: t.length, insert: o.value }
+      }), m = !1);
+    }, { asJson: x, currentText: o, setCurrent: N } = M(
+      a,
+      p,
+      v
+    ), V = (t) => {
+      m || !b.current || o.value !== t && (N(t), p("change", t));
+    };
+    S(
+      () => b.current,
+      () => {
+        v();
+      }
+    );
+    const B = (t) => {
       switch (t) {
         case "javascript":
-          return z();
+          return U();
         case "html":
-          return F();
+          return W();
         // Add more languages here
         default:
           return [];
       }
-    }, y = (t) => t === "one-dark" ? E : document.body.classList.contains("dark") ? E : [], b = (t) => t ? [W()] : [], v = (t) => t ? [h()] : [], B = () => {
-      s.value && r("update:modelValueTranslate", s.value.value);
-    };
-    return j(() => {
-      if (m.value) {
-        const t = G.create({
-          doc: n.modelValue,
-          extensions: [
-            ...b(n.showLineNumbers),
-            ...v(n.highlightActiveLine),
-            h(),
-            //
-            L.of(T),
-            p(n.language),
-            ...y(n.theme),
-            C(),
-            u.updateListener.of((a) => {
-              if (a.docChanged) {
-                const o = a.state.doc.toString();
-                r("update:modelValue", o), r("change", o);
-              }
-            }),
-            u.lineWrapping
-          ]
+    }, T = (t) => t === "one-dark" ? _ : document.body.classList.contains("dark") ? _ : [], j = (t) => t ? [K()] : [], A = (t) => t ? [L()] : [], w = (t, l, c, f) => [
+      ...j(c),
+      ...A(f),
+      L(),
+      J.of(O),
+      B(t),
+      ...T(l),
+      I(),
+      y.updateListener.of((k) => {
+        k.docChanged && V(k.state.doc.toString());
+      }),
+      y.lineWrapping
+    ];
+    return D(() => {
+      if (d.value) {
+        const t = z.create({
+          doc: o.value,
+          extensions: w(
+            a.language,
+            a.theme,
+            a.showLineNumbers,
+            a.highlightActiveLine
+          )
         });
-        i = new u({
+        i = new y({
           state: t,
-          parent: m.value
+          parent: d.value
         });
       }
-      n.modelValueTranslate && (r("update:modelValueTranslate", n.modelValueTranslate), s.value.value = n.modelValueTranslate), m.value.classList.add("gl-multilanguage");
-    }), w(
-      () => n.modelValue,
-      (t) => {
-        if (i) {
-          const a = i.state.doc.toString();
-          t !== a && i.dispatch({
-            changes: {
-              from: 0,
-              to: a.length,
-              insert: t
-            }
-          });
-        }
-      }
-    ), w(
-      () => [n.language, n.theme, n.showLineNumbers, n.highlightActiveLine],
-      ([t, a, o, _]) => {
+    }), S(
+      () => [a.language, a.theme, a.showLineNumbers, a.highlightActiveLine],
+      ([t, l, c, f]) => {
         i && i.dispatch({
-          effects: U.reconfigure.of([
-            ...b(o),
-            ...v(_),
-            h(),
-            // Ensure it's included if highlightActiveLine is true
-            L.of([...T]),
-            p(t),
-            ...y(a),
-            C(),
-            u.updateListener.of((V) => {
-              if (V.docChanged) {
-                const x = V.state.doc.toString();
-                r("update:modelValue", x), r("change", x);
-              }
-            }),
-            u.lineWrapping
-          ])
+          effects: H.reconfigure.of(
+            w(t, l, c, f)
+          )
         });
       }
-    ), A(() => {
+    ), F(() => {
       i && i.destroy();
-    }), (t, a) => (c(), g(q, null, [
-      e.show ? (c(), g("div", {
+    }), (t, l) => (h(), g(G, null, [
+      e.show ? (h(), g("div", {
         key: 0,
-        class: f(e.field_name)
+        class: s(e.field_name)
       }, [
-        l("h3", H, d(e.label_name), 1),
-        l("p", {
+        n("h3", P, r(e.label_name), 1),
+        n("p", {
           id: e.field_name,
-          class: "mb-4 text-base text-gray-900 input_tr_show dark:text-white"
-        }, d(e.model_value), 9, I),
-        D(l("input", {
+          class: "mb-4 text-base text-gray-900 gl-multilanguage input_tr_show dark:text-white"
+        }, r(u(o)), 9, Q),
+        n("input", {
           type: "hidden",
-          "data-i18n": "true",
           name: e.field_name + "_i18n",
           id: e.field_name + "_i18n",
-          ref_key: "input_translate",
-          ref: s,
-          "onUpdate:modelValue": a[0] || (a[0] = (o) => t.inputTranslateValue = o)
-        }, null, 8, K), [
-          [M, t.inputTranslateValue]
-        ]),
-        a[1] || (a[1] = l("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
-      ], 2)) : S("", !0),
-      e.show ? S("", !0) : (c(), g("div", {
+          value: u(x)()
+        }, null, 8, R),
+        l[0] || (l[0] = n("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
+      ], 2)) : E("", !0),
+      e.show ? E("", !0) : (h(), g("div", {
         key: 1,
-        class: f(["mb-4", e.field_name])
+        class: s(["mb-4", e.field_name])
       }, [
-        l("label", {
-          class: f({
+        n("label", {
+          class: s({
             "gl-label-translation-form": e.error_message == "",
             "gl-label-translation-form-invalid": e.error_message !== "",
             required: e.is_required
           }),
           for: e.field_name
-        }, d(e.label_name), 11, O),
-        a[2] || (a[2] = l("span", { class: "language-label js-language-label bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300" }, null, -1)),
-        l("input", {
+        }, r(e.label_name), 11, X),
+        n("span", Y, r(u(b).current), 1),
+        n("input", {
           class: "mb-4",
           type: "hidden",
-          "data-i18n": "true",
           name: e.field_name + "_i18n",
           id: e.field_name + "_i18n",
-          onChange: B,
-          ref_key: "input_translate",
-          ref: s
-        }, null, 40, J),
-        l("div", {
+          value: u(x)()
+        }, null, 8, Z),
+        n("div", {
           ref_key: "editor",
-          ref: m,
-          class: f(["CodeEditor custom-editor form-input-translation", {
+          ref: d,
+          class: s(["CodeEditor custom-editor form-input-translation gl-multilanguage", {
             "gl-input-form": e.error_message == "",
             "gl-input-form-invalid ": e.error_message !== ""
           }]),
           name: e.field_name,
           id: e.field_name
-        }, null, 10, P),
-        l("span", Q, d(e.error_message), 1),
-        l("small", R, d(e.description), 1)
+        }, null, 10, $),
+        n("span", ee, r(e.error_message), 1),
+        n("small", te, r(e.description), 1)
       ], 2))
     ], 64));
   }
 };
 export {
-  ie as default
+  fe as default
 };

package/dist/components/GeneralComponents/GlLanguageSelector.vue.js

@@ -1,7 +1,7 @@
-import { createElementBlock as o, openBlock as s, Fragment as n, renderList as g, createElementVNode as c, normalizeClass as u, toDisplayString as i } from "vue";
-import _ from "../../_virtual/_plugin-vue_export-helper.js";
-const m = {
-  components: {},
+import { glLocale as n, setGlLocales as i } from "../../localeStore.js";
+import { createElementBlock as a, openBlock as c, normalizeClass as s, Fragment as m, renderList as f, withDirectives as _, createElementVNode as g, vModelRadio as p, toDisplayString as b } from "vue";
+import h from "../../_virtual/_plugin-vue_export-helper.js";
+const y = {
   props: {
     field_name: {
       type: String,
@@ -11,6 +11,9 @@ const m = {
       type: String,
       default: "i18n_selector"
     },
+    // Kept on the element from first render (it used to be added only after
+    // the locales request returned): consuming apps count elements carrying
+    // it to decide when a modal has finished loading.
     selectorClass: {
       type: String,
       default: "gl-multilanguage"
@@ -18,17 +21,13 @@ const m = {
   },
   data() {
     return {
-      locals: [],
-      default_language: ""
+      glLocale: n
     };
   },
   methods: {
     getLocals() {
-      const d = {
-        id: this.menu_id
-      };
-      axios.get("/admin/get_locals", { params: d }).then((e) => {
-        this.locals = e.data.locals, this.default_language = e.data.default_language, this.$refs.language_selector.classList.add(this.selectorClass);
+      n.locals.length > 0 || axios.get("/admin/get_locals").then((e) => {
+        i(e.data.locals, e.data.default_language);
       }).catch((e) => {
         console.error(e);
       });
@@ -36,37 +35,37 @@ const m = {
   },
   created() {
     this.getLocals();
-  },
-  mounted() {
   }
-}, f = {
-  class: "grid w-full gap-1 mt-5 mb-5 md:gap-0 md:grid-cols-10 language-selector",
-  ref: "language_selector"
-}, h = ["name", "value", "id", "checked"], p = ["for"];
-function b(d, e, l, k, r, y) {
-  return s(), o("ul", f, [
-    (s(!0), o(n, null, g(r.locals, (t, a) => (s(), o("li", null, [
-      c("input", {
+}, k = ["name", "value", "id"], L = ["for"];
+function v(e, d, l, x, r, S) {
+  return c(), a("ul", {
+    class: s(["grid w-full gap-1 mt-5 mb-5 md:gap-0 md:grid-cols-10 language-selector", l.selectorClass]),
+    ref: "language_selector"
+  }, [
+    (c(!0), a(m, null, f(r.glLocale.locals, (t, o) => (c(), a("li", { key: t }, [
+      _(g("input", {
         type: "radio",
         name: l.trans_selector_name,
         value: t,
         class: "hidden! peer",
         id: t + "_" + l.field_name,
         autocomplete: "off",
-        checked: t === r.default_language
-      }, null, 8, h),
-      c("label", {
+        "onUpdate:modelValue": d[0] || (d[0] = (u) => r.glLocale.current = u)
+      }, null, 8, k), [
+        [p, r.glLocale.current]
+      ]),
+      g("label", {
         for: t + "_" + l.field_name,
-        class: u([{
-          "border md:rounded-s-lg!": a === 0,
-          "border md:rounded-e-lg!": a === r.locals.length - 1,
-          "border-t border-b": a !== 0 && a !== r.locals.length - 1
+        class: s([{
+          "border md:rounded-s-lg!": o === 0,
+          "border md:rounded-e-lg!": o === r.glLocale.locals.length - 1,
+          "border-t border-b": o !== 0 && o !== r.glLocale.locals.length - 1
         }, "block w-full p-1 font-bold text-center text-gray-500 uppercase bg-white border-gray-200 rounded-lg cursor-pointer md:rounded-none dark:hover:text-gray-300 dark:border-gray-700 dark:peer-checked:text-blue-500 peer-checked:border-blue-600 peer-checked:text-blue-600 hover:text-gray-600 hover:bg-gray-100 dark:text-gray-400 dark:bg-gray-800 dark:hover:bg-gray-700"])
-      }, i(t), 11, p)
-    ]))), 256))
-  ], 512);
+      }, b(t), 11, L)
+    ]))), 128))
+  ], 2);
 }
-const L = /* @__PURE__ */ _(m, [["render", b]]);
+const D = /* @__PURE__ */ h(y, [["render", v]]);
 export {
-  L as default
+  D as default
 };

package/dist/components/GeneralComponents/GlTabsWrapper.vue.js

@@ -1,5 +1,5 @@
-import { useSlots as T, ref as m, Comment as C, provide as _, watch as b, onMounted as S, onBeforeUnmount as L, createElementBlock as o, openBlock as n, Fragment as h, createElementVNode as s, withDirectives as B, normalizeClass as l, renderList as D, createCommentVNode as E, createTextVNode as F, toDisplayString as H, renderSlot as I, vShow as M } from "vue";
-const N = ["onClick"], U = ["innerHTML"], V = { class: "relative flex flex-col w-full min-w-0 mb-6 wrap-break-word rounded-[20px] border border-gray-200 dark:border-gray-700" }, W = { class: "flex-auto px-4 py-5" }, R = { class: "tab-content tab-space" }, z = {
+import { useSlots as C, ref as f, Comment as _, provide as S, watch as m, onMounted as L, onBeforeUnmount as H, createElementBlock as o, openBlock as n, Fragment as b, createElementVNode as s, withDirectives as B, normalizeClass as l, renderList as D, createCommentVNode as E, createTextVNode as F, toDisplayString as I, renderSlot as M, vShow as N } from "vue";
+const U = ["onClick"], V = ["innerHTML"], W = { class: "relative flex flex-col w-full min-w-0 mb-6 wrap-break-word rounded-[20px] border border-gray-200 dark:border-gray-700" }, R = { class: "flex-auto px-4 py-5" }, $ = { class: "tab-content tab-space" }, A = {
   __name: "GlTabsWrapper",
   props: {
     autoFlexTabs: {
@@ -16,14 +16,16 @@ const N = ["onClick"], U = ["innerHTML"], V = { class: "relative flex flex-col w
     }
   },
   emits: ["TabChange"],
-  setup(i, { expose: v, emit: f }) {
-    const c = i, y = f, x = T(), d = m(
-      (x.default?.() ?? []).filter((e) => e.type !== C && e.props !== null).map((e) => e.props)
-    ), k = (e) => typeof e == "string" && /<\s*(svg|path|g|circle|rect)\b/i.test(e), a = m("");
-    _("selectedTitle", a);
-    const g = (e) => e.trim().toLowerCase().replace(/\s+/g, "-"), w = (e) => {
-      const r = g(e);
-      window.location.hash = encodeURIComponent(r), y("TabChange", e);
+  setup(i, { expose: v, emit: y }) {
+    const c = i, x = y, w = C(), d = f(
+      (w.default?.() ?? []).filter((e) => e.type !== _ && e.props !== null).map((e) => e.props)
+    ), k = (e) => typeof e == "string" && /<\s*(svg|path|g|circle|rect)\b/i.test(e), a = f("");
+    S("selectedTitle", a);
+    const g = (e) => e.trim().toLowerCase().replace(/\s+/g, "-");
+    let u = !1;
+    const T = (e) => {
+      const r = g(e), t = encodeURIComponent(r);
+      window.location.hash.replace("#", "") !== t && (u = !0, window.location.hash = t), x("TabChange", e);
     }, p = (e) => {
       if (typeof e != "string") return;
       d.value.find((t) => t.title === e) && (a.value = e);
@@ -31,25 +33,29 @@ const N = ["onClick"], U = ["innerHTML"], V = { class: "relative flex flex-col w
     v({
       setActiveTab: p
     });
-    const u = () => {
+    const h = () => {
+      if (u) {
+        u = !1;
+        return;
+      }
       const e = decodeURIComponent(window.location.hash.replace("#", "")), r = d.value.find((t) => g(t.title) === e);
       r && (a.value = r.title);
     };
-    return b(a, (e) => {
-      w(e);
-    }), b(() => c.activeTab, (e) => {
+    return m(a, (e) => {
+      T(e);
+    }), m(() => c.activeTab, (e) => {
       e && e !== a.value && p(e);
-    }), S(() => {
-      u(), !a.value && c.activeTab && p(c.activeTab), window.addEventListener("hashchange", u);
     }), L(() => {
-      window.removeEventListener("hashchange", u);
-    }), (e, r) => (n(), o(h, null, [
+      h(), !a.value && c.activeTab && p(c.activeTab), window.addEventListener("hashchange", h);
+    }), H(() => {
+      window.removeEventListener("hashchange", h);
+    }), (e, r) => (n(), o(b, null, [
       s("ul", {
         class: l(["flex flex-row flex-wrap gap-2 pt-3 pb-4 mb-0 list-none text-gray-500 dark:text-gray-400", i.tabsWrapperClass])
       }, [
-        (n(!0), o(h, null, D(d.value, (t) => (n(), o("li", {
+        (n(!0), o(b, null, D(d.value, (t) => (n(), o("li", {
           key: t.title,
-          onClick: ($) => a.value = t.title,
+          onClick: (j) => a.value = t.title,
           class: l(["-mb-px text-center", {
             "flex-auto ": i.autoFlexTabs
           }])
@@ -61,26 +67,26 @@ const N = ["onClick"], U = ["innerHTML"], V = { class: "relative flex flex-col w
               key: 0,
               class: "inline-flex items-center justify-center me-2 align-middle",
               innerHTML: t.icon
-            }, null, 8, U)) : t.icon ? (n(), o("i", {
+            }, null, 8, V)) : t.icon ? (n(), o("i", {
               key: 1,
               class: l([t.icon, "me-2 text-sm"])
             }, null, 2)) : E("", !0),
-            F(H(t.title), 1)
+            F(I(t.title), 1)
           ], 2)
-        ], 10, N))), 128))
+        ], 10, U))), 128))
       ], 2),
-      B(s("div", V, [
-        s("div", W, [
-          s("div", R, [
-            I(e.$slots, "default")
+      B(s("div", W, [
+        s("div", R, [
+          s("div", $, [
+            M(e.$slots, "default")
           ])
         ])
       ], 512), [
-        [M, a.value]
+        [N, a.value]
       ])
     ], 64));
   }
 };
 export {
-  z as default
+  A as default
 };

package/dist/components/GeneralComponents/GlTextTranslate.vue.js

@@ -1,5 +1,7 @@
-import { ref as f, onMounted as V, createElementBlock as g, openBlock as y, Fragment as h, createCommentVNode as b, normalizeClass as d, createElementVNode as t, toDisplayString as i } from "vue";
-const x = { class: "font-bold ptext-lg dark:text-white" }, p = ["name", "id"], T = ["id"], w = ["for"], S = ["name", "id"], q = ["required", "name", "id", "type"], _ = { class: "gl-span-form-error" }, B = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, j = {
+import { ref as v, createElementBlock as s, openBlock as d, Fragment as w, createCommentVNode as f, normalizeClass as i, createElementVNode as t, toDisplayString as a, unref as l } from "vue";
+import { glLocale as S } from "../../localeStore.js";
+import { useTranslations as p } from "../../useTranslations.js";
+const q = { class: "font-bold ptext-lg dark:text-white" }, T = ["name", "id", "value"], V = ["id"], _ = ["for"], B = { class: "language-label js-language-label bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300" }, j = ["name", "id", "value"], C = ["required", "name", "id", "type", "value"], N = { class: "gl-span-form-error" }, E = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, D = {
   __name: "GlTextTranslate",
   props: {
     is_required: {
@@ -48,77 +50,69 @@ const x = { class: "font-bold ptext-lg dark:text-white" }, p = ["name", "id"], T
     }
   },
   emits: ["update:modelValue", "update:modelValueTranslate", "keydown"],
-  setup(e, { expose: c, emit: v }) {
-    const n = e, s = v, a = f(null), u = f(null), r = f(null), k = () => {
-      u.value && s("update:modelValueTranslate", u.value.value);
+  setup(e, { expose: g, emit: c }) {
+    const y = e, b = c, u = v(null), { asJson: o, currentText: m, setCurrent: x } = p(y, b), h = (r) => {
+      x(r.target.value);
     };
-    return V(() => {
-      a.value !== null && a.value.hasAttribute("autofocus") && a.value.focus(), n.modelValue && (s("update:modelValue", n.modelValue), a.value && (a.value.value = n.modelValue)), n.modelValueTranslate && (s("update:modelValueTranslate", n.modelValueTranslate), u.value && (u.value.value = n.modelValueTranslate)), a.value && a.value.classList.add("gl-multilanguage"), r.value && r.value.classList.add("gl-multilanguage");
-    }), c({ focus: () => a.value.focus() }), (o, l) => (y(), g(h, null, [
-      e.show ? (y(), g("div", {
+    return g({ focus: () => u.value?.focus() }), (r, n) => (d(), s(w, null, [
+      e.show ? (d(), s("div", {
         key: 0,
-        class: d(e.field_name)
+        class: i(e.field_name)
       }, [
-        t("h3", x, i(e.label_name), 1),
+        t("h3", q, a(e.label_name), 1),
         t("input", {
           type: "hidden",
-          "data-i18n": "true",
           name: e.field_name + "_i18n",
           id: e.field_name + "_i18n",
-          ref_key: "input_translate",
-          ref: u
-        }, null, 8, p),
+          value: l(o)()
+        }, null, 8, T),
         t("p", {
-          ref_key: "output_translate",
-          ref: r,
           id: e.field_name,
-          class: "mb-4 text-base text-gray-900 input_tr_show dark:text-white"
-        }, i(o.model_value), 9, T),
-        l[2] || (l[2] = t("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
-      ], 2)) : b("", !0),
-      e.show ? b("", !0) : (y(), g("div", {
+          class: "mb-4 text-base text-gray-900 gl-multilanguage input_tr_show dark:text-white"
+        }, a(l(m)), 9, V),
+        n[1] || (n[1] = t("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
+      ], 2)) : f("", !0),
+      e.show ? f("", !0) : (d(), s("div", {
         key: 1,
-        class: d(["mb-4", e.field_name])
+        class: i(["mb-4", e.field_name])
       }, [
         t("label", {
-          class: d({
+          class: i({
             "gl-label-translation-form": e.error_message == "",
             "gl-label-translation-form-invalid": e.error_message !== "",
             required: e.is_required
           }),
           for: e.field_name
-        }, i(e.label_name), 11, w),
-        l[3] || (l[3] = t("span", { class: "language-label js-language-label bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300" }, null, -1)),
+        }, a(e.label_name), 11, _),
+        t("span", B, a(l(S).current), 1),
         t("input", {
           class: "mb-4",
           type: "hidden",
-          "data-i18n": "true",
           name: e.field_name + "_i18n",
           id: e.field_name + "_i18n",
-          onChange: k,
-          ref_key: "input_translate",
-          ref: u
-        }, null, 40, S),
+          value: l(o)()
+        }, null, 8, j),
         t("input", {
           required: e.is_required,
           name: e.field_name,
           id: e.field_name,
-          class: d(["mt-2 form-input-translation", {
+          class: i(["mt-2 form-input-translation gl-multilanguage", {
             " gl-input-form": e.error_message == "",
             " gl-input-form-invalid": e.error_message !== ""
           }]),
           type: e.type,
-          onInput: l[0] || (l[0] = (m) => o.$emit("update:modelValue", m.target.value)),
-          onKeydown: l[1] || (l[1] = (m) => o.$emit("keydown", m)),
+          value: l(m),
+          onInput: h,
+          onKeydown: n[0] || (n[0] = (k) => r.$emit("keydown", k)),
           ref_key: "input",
-          ref: a
-        }, null, 42, q),
-        t("span", _, i(e.error_message), 1),
-        t("small", B, i(e.description), 1)
+          ref: u
+        }, null, 42, C),
+        t("span", N, a(e.error_message), 1),
+        t("small", E, a(e.description), 1)
       ], 2))
     ], 64));
   }
 };
 export {
-  j as default
+  D as default
 };