lf-pagebuilder-vue 0.0.5 → 0.0.7

package/dist/index.js

@@ -1,11 +1,13 @@
-import { defineComponent as H, ref as S, computed as K, createElementBlock as i, openBlock as s, Fragment as B, createElementVNode as t, createCommentVNode as P, withModifiers as oe, withDirectives as R, vModelText as Y, normalizeClass as L, toDisplayString as p, renderList as V, vModelSelect as J, vModelCheckbox as te, createBlock as ie, createTextVNode as T, unref as G, onMounted as le, createVNode as q, watch as ee, nextTick as be, withCtx as de, vShow as ge, reactive as fe } from "vue";
-import { listComponents as pe } from "libreria-astro-lefebvre";
-import { QuillEditor as ve } from "@vueup/vue-quill";
-import ue from "vuedraggable";
-const xe = H({
+import { defineComponent as W, ref as $, computed as Q, createElementBlock as d, openBlock as s, createCommentVNode as k, createElementVNode as t, withModifiers as le, withDirectives as R, vModelText as K, normalizeClass as G, toDisplayString as f, Fragment as B, renderList as N, vModelSelect as H, vModelCheckbox as ne, createBlock as ue, createTextVNode as D, unref as q, onMounted as ae, createVNode as L, watch as oe, nextTick as pe, withCtx as ce, vShow as ve, reactive as xe } from "vue";
+import { listComponents as me } from "libreria-astro-lefebvre";
+import { QuillEditor as he } from "@vueup/vue-quill";
+import be from "vuedraggable";
+const we = W({
   props: {
     isComponentMode: Boolean,
     fullwidthMode: Boolean,
+    debugMode: Boolean,
+    submitForm: Boolean,
     toggleComponentModeFunction: Function,
     toggleFullwidthMode: Function,
     importConfigurationFunction: Function,
@@ -28,183 +30,200 @@ const xe = H({
     "update:parametersPageConfiguration.seo.description"
   ],
   setup(e) {
-    const o = e.renderApiDomain || "http://localhost:8003", g = S(""), x = S(!1), f = K({
+    const o = e.renderApiDomain || "http://localhost:8003", b = $(""), h = $(!1), g = $(!1), c = $(null), a = Q({
       get() {
-        var k, A;
-        const m = (k = e.globalPageConfiguration) == null ? void 0 : k.find((w) => w.section === e.sectionSelected);
-        return ((A = m == null ? void 0 : m.config) == null ? void 0 : A.width) || "";
+        var v, n;
+        const j = (v = e.globalPageConfiguration) == null ? void 0 : v.find((r) => r.section === e.sectionSelected);
+        return ((n = j == null ? void 0 : j.config) == null ? void 0 : n.width) || "";
       },
-      set(m) {
-        var A;
-        const k = (A = e.globalPageConfiguration) == null ? void 0 : A.find((w) => w.section === e.sectionSelected);
-        k && (k.config || (k.config = {}), k.config.width = m);
+      set(j) {
+        var n;
+        const v = (n = e.globalPageConfiguration) == null ? void 0 : n.find((r) => r.section === e.sectionSelected);
+        v && (v.config || (v.config = {}), v.config.width = j);
       }
-    }), u = () => {
-      const m = {
+    }), m = () => {
+      const j = {
         pageConfig: e.globalPageConfiguration,
         paramsConfig: e.parametersPageConfiguration
-      }, k = JSON.stringify(m), A = new CustomEvent("lf-pagebuilder:export", {
-        detail: { ...m, inputId: e.inputId }
+      }, v = JSON.stringify(j), n = new CustomEvent("lf-pagebuilder:export", {
+        detail: { ...j, inputId: e.inputId }
       });
-      document.dispatchEvent(A);
-      const w = window.open("", "Preview", "width='100vw',height='100vh'");
-      w && (w.document.body.innerText = k, w.document.close());
-    }, a = () => {
-      const m = {
+      document.dispatchEvent(n);
+      const r = window.open("", "Preview", "width='100vw',height='100vh'");
+      r && (r.document.body.innerText = v, r.document.close());
+    }, C = () => {
+      const j = {
         pageConfig: e.globalPageConfiguration,
         paramsConfig: e.parametersPageConfiguration
-      }, k = JSON.stringify(m);
-      b(k);
-      const A = new CustomEvent("lf-pagebuilder:save", {
-        detail: { ...m, inputId: e.inputId }
+      }, v = JSON.stringify(j);
+      M(v);
+      const n = new CustomEvent("lf-pagebuilder:save", {
+        detail: { ...j, inputId: e.inputId }
       });
-      if (document.dispatchEvent(A), e.inputId) {
-        const w = document.getElementById(e.inputId);
-        w && (w.value = k);
+      if (document.dispatchEvent(n), e.inputId) {
+        const r = document.getElementById(e.inputId);
+        r && (r.value = v);
+      }
+      if (g.value = !0, setTimeout(() => {
+        g.value = !1;
+      }, 3e3), e.submitForm && c.value) {
+        const r = c.value.closest("form");
+        r && r.submit();
       }
-    }, b = (m) => {
-      const k = e.inputId ? `pageBuilderConfig_${e.inputId}` : "pageBuilderConfig";
-      localStorage.setItem(k, m);
+    }, M = (j) => {
+      const v = e.inputId ? `pageBuilderConfig_${e.inputId}` : "pageBuilderConfig";
+      localStorage.setItem(v, j);
     };
     return {
       validateSeo: () => {
-        const m = {
+        const j = {
           pageConfig: e.globalPageConfiguration,
           paramsConfig: e.parametersPageConfiguration
-        }, k = JSON.stringify(m, null, 2);
+        }, v = JSON.stringify(j, null, 2);
         fetch(o + "/api/render-html/", {
           method: "POST",
           headers: {
             "Content-Type": "application/json"
           },
-          body: k
-        }).then((A) => A.text()).then((A) => {
-          const w = window.open("", "Preview", "width='100vw',height='100vh'");
-          if (!w) return;
-          const c = new DOMParser().parseFromString(A, "text/html"), $ = [];
-          function j(N, X = 0) {
-            if (!N || N.nodeType !== 1) return;
-            const Z = N.tagName.toLowerCase();
-            ["h1", "h2", "h3", "h4", "h5", "h6", "a", "p", "article", "section", "header", "footer"].includes(Z) && $.push({
-              tag: Z,
-              text: (N.textContent || "").trim().slice(0, 80),
-              depth: X
-            }), Array.from(N.children).forEach((_) => j(_, X + 1));
+          body: v
+        }).then((n) => n.text()).then((n) => {
+          const r = window.open("", "Preview", "width='100vw',height='100vh'");
+          if (!r) return;
+          const F = new DOMParser().parseFromString(n, "text/html"), E = [];
+          function U(J, _ = 0) {
+            if (!J || J.nodeType !== 1) return;
+            const ee = J.tagName.toLowerCase();
+            ["h1", "h2", "h3", "h4", "h5", "h6", "a", "p", "article", "section", "header", "footer"].includes(ee) && E.push({
+              tag: ee,
+              text: (J.textContent || "").trim().slice(0, 80),
+              depth: _
+            }), Array.from(J.children).forEach((te) => U(te, _ + 1));
           }
-          j(c.body);
-          let D = '<h2>Estructura SEO</h2><ul style="font-family:monospace">';
-          $.forEach((N) => {
-            D += `<li style="margin-left:${N.depth * 20}px"><b>${N.tag}</b>: ${N.text}</li>`;
-          }), D += "</ul>", w.document.body.innerHTML = D, w.document.close();
+          U(F.body);
+          let X = '<h2>Estructura SEO</h2><ul style="font-family:monospace">';
+          E.forEach((J) => {
+            X += `<li style="margin-left:${J.depth * 20}px"><b>${J.tag}</b>: ${J.text}</li>`;
+          }), X += "</ul>", r.document.body.innerHTML = X, r.document.close();
         });
       },
-      importConfig: g,
-      showAdvancedConfig: x,
+      importConfig: b,
+      showAdvancedConfig: h,
       previewFunction: () => {
-        const m = {
+        const j = {
           pageConfig: e.globalPageConfiguration,
           paramsConfig: e.parametersPageConfiguration
-        }, k = JSON.stringify(m, null, 2);
+        }, v = JSON.stringify(j, null, 2);
         fetch(o + "/api/render-html/", {
           method: "POST",
           headers: {
             "Content-Type": "application/json"
           },
-          body: k
-        }).then((A) => A.text()).then((A) => {
-          const w = window.open("", "Preview", "width='100vw',height='100vh'");
-          w && (w.document.body.innerHTML = A, w.document.querySelectorAll("script").forEach((c) => {
-            var j;
-            const $ = w.document.createElement("script");
-            c.src ? $.src = c.src : $.textContent = c.textContent, (j = c.parentNode) == null || j.replaceChild($, c);
-          }), w.document.close());
+          body: v
+        }).then((n) => n.text()).then((n) => {
+          const r = window.open("", "Preview", "width='100vw',height='100vh'");
+          r && (r.document.body.innerHTML = n, r.document.querySelectorAll("script").forEach((F) => {
+            var U;
+            const E = r.document.createElement("script");
+            F.src ? E.src = F.src : E.textContent = F.textContent, (U = F.parentNode) == null || U.replaceChild(E, F);
+          }), r.document.close());
         });
       },
       importFunction: () => {
-        e.importConfigurationFunction && e.importConfigurationFunction(g.value), g.value = "";
+        e.importConfigurationFunction && e.importConfigurationFunction(b.value), b.value = "";
       },
-      exportFunction: u,
-      saveButtonAction: a,
+      exportFunction: m,
+      saveButtonAction: C,
       loadFromLocalStorage: () => {
-        const m = e.inputId ? `pageBuilderConfig_${e.inputId}` : "pageBuilderConfig", k = localStorage.getItem(m);
-        if (k && e.importConfigurationFunction) {
-          const A = JSON.parse(k);
-          e.importConfigurationFunction(A);
+        const j = e.inputId ? `pageBuilderConfig_${e.inputId}` : "pageBuilderConfig", v = localStorage.getItem(j);
+        if (v && e.importConfigurationFunction) {
+          const n = JSON.parse(v);
+          e.importConfigurationFunction(n);
         }
       },
       toggleExpandScreen: () => {
-        const m = document.querySelector(".lf-page-builder");
-        m && m.classList.toggle("expanded-page-builder");
+        const j = document.querySelector(".lf-page-builder");
+        j && j.classList.toggle("expanded-page-builder");
       },
-      sectionWidth: f
+      sectionWidth: a,
+      isSaved: g,
+      componentRoot: c
     };
   }
-}), he = (e, o) => {
-  const g = e.__vccOpts || e;
-  for (const [x, f] of o)
-    g[x] = f;
-  return g;
-}, we = { class: "flex justify-end items-center w-full p-3 gap-3" }, ye = { class: "flex justify-between gap-3 px-5 py-3 bg-white mx-3 rounded-xl border border-slate-200 mb-6 sticky top-2 z-9999 shadow-lg backdrop-blur-sm" }, Ce = { class: "flex gap-2" }, $e = { class: "flex gap-2" }, ke = ["value"], Se = ["value"], Pe = { value: "full" }, Fe = { value: "1/2" }, je = { value: "1/3" }, Ie = { value: "2/3" }, Me = { value: "1/4" }, Ae = { value: "3/4" }, Be = { value: "1/5" }, Ee = { value: "2/5" }, Te = { value: "3/5" }, De = { value: "4/5" }, Oe = { key: 0 }, Re = { key: 1 }, Ne = { class: "flex items-center gap-2" }, Ve = {
+}), ye = (e, o) => {
+  const b = e.__vccOpts || e;
+  for (const [h, g] of o)
+    b[h] = g;
+  return b;
+}, Ce = { ref: "componentRoot" }, $e = {
   key: 0,
+  class: "flex justify-end items-center w-full p-3 gap-3"
+}, ke = { class: "flex justify-end items-center p-2 gap-3 bg-gradient-to-l from-lime-50 to-green-100 border border-lime-400 rounded-lg w-auto" }, Se = { class: "flex justify-between gap-3 px-5 py-3 bg-white mx-3 rounded-xl border border-slate-200 mb-6 sticky top-2 z-9999 shadow-lg backdrop-blur-sm" }, Fe = { class: "flex gap-2" }, Pe = { class: "flex gap-2" }, je = ["value"], Me = ["value"], Ie = { value: "full" }, Ae = { value: "1/2" }, Be = { value: "1/3" }, Ee = { value: "2/3" }, Te = { value: "1/4" }, De = { value: "3/4" }, Oe = { value: "1/5" }, Re = { value: "2/5" }, Ne = { value: "3/5" }, Ve = { value: "4/5" }, Ue = { key: 0 }, ze = { key: 1 }, qe = { class: "flex items-center gap-2" }, Le = {
+  key: 1,
   class: "bg-white border border-slate-200 rounded-2xl p-5 mx-3 mb-6 shadow-lg"
-}, Ue = { class: "flex flex-row gap-4 w-full" }, ze = { class: "border border-slate-200 rounded-xl p-5 w-full bg-gradient-to-br from-slate-50 to-white" }, qe = { class: "flex flex-col gap-3 border-b border-slate-200 pb-4 w-full" }, Le = { class: "mb-3" }, Ge = { class: "flex items-center gap-3 cursor-pointer group" }, Je = { class: "mb-3" }, He = { class: "flex items-center gap-3 cursor-pointer group" }, We = { class: "mb-3" }, Ye = { class: "mb-3" }, Ke = { class: "mb-3" }, Qe = { class: "border border-slate-200 rounded-xl p-5 w-full bg-gradient-to-br from-slate-50 to-white" }, Xe = { class: "flex justify-between items-center mb-4" }, Ze = { class: "flex flex-col gap-3 border-b border-slate-200 pb-4 w-full" }, _e = { class: "mb-3" }, et = { class: "mb-3" }, tt = { class: "mb-3" };
-function ot(e, o, g, x, f, u) {
-  return s(), i(B, null, [
-    t("div", we, [
-      o[30] || (o[30] = t("span", { class: "bg-rose-50 px-3 py-1 rounded-full border border-rose-200 text-rose-400 text-xs font-medium me-4" }, "Todo lo de esta barra desaparecerá →", -1)),
-      t("form", {
-        onSubmit: o[2] || (o[2] = oe(() => {
-        }, ["prevent"])),
-        class: "flex gap-2"
-      }, [
-        R(t("input", {
-          "onUpdate:modelValue": o[0] || (o[0] = (a) => e.importConfig = a),
-          type: "text",
-          class: "bg-white border border-slate-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400",
-          name: "",
-          id: "",
-          placeholder: "Pegar configuración..."
-        }, null, 512), [
-          [Y, e.importConfig]
-        ]),
+}, Ge = { class: "flex flex-row gap-4 w-full" }, Je = { class: "border border-slate-200 rounded-xl p-5 w-full bg-gradient-to-br from-slate-50 to-white" }, He = { class: "flex flex-col gap-3 border-b border-slate-200 pb-4 w-full" }, We = { class: "mb-3" }, Ye = { class: "flex items-center gap-3 cursor-pointer group" }, Ke = { class: "mb-3" }, Qe = { class: "flex items-center gap-3 cursor-pointer group" }, Xe = { class: "mb-3" }, Ze = { class: "mb-3" }, _e = { class: "mb-3" }, et = { class: "border border-slate-200 rounded-xl p-5 w-full bg-gradient-to-br from-slate-50 to-white" }, tt = { class: "flex justify-between items-center mb-4" }, ot = { class: "flex flex-col gap-3 border-b border-slate-200 pb-4 w-full" }, nt = { class: "mb-3" }, lt = { class: "mb-3" }, at = { class: "mb-3" };
+function rt(e, o, b, h, g, c) {
+  return s(), d("div", Ce, [
+    e.debugMode ? (s(), d("div", $e, [
+      t("div", ke, [
+        o[30] || (o[30] = t("span", { class: "bg-gradient-to-r from-lime-200 to-green-300 px-3 py-1 rounded-full border border-lime-600 text-lime-800 text-xs font-medium me-4 italic" }, "MODO DEBUG 🐞", -1)),
+        t("form", {
+          onSubmit: o[2] || (o[2] = le(() => {
+          }, ["prevent"])),
+          class: "flex gap-2"
+        }, [
+          R(t("input", {
+            "onUpdate:modelValue": o[0] || (o[0] = (a) => e.importConfig = a),
+            type: "text",
+            class: "bg-white border border-slate-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400",
+            name: "",
+            id: "",
+            placeholder: "Pegar configuración..."
+          }, null, 512), [
+            [K, e.importConfig]
+          ]),
+          t("button", {
+            type: "button",
+            onClick: o[1] || (o[1] = (a) => e.importFunction()),
+            class: "cursor-pointer bg-white hover:bg-slate-700 hover:text-white border border-slate-200 hover:border-slate-700 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
+          }, "🏯 Importar")
+        ], 32),
         t("button", {
-          onClick: o[1] || (o[1] = (a) => e.importFunction()),
+          type: "button",
+          onClick: o[3] || (o[3] = (a) => e.exportFunction()),
           class: "cursor-pointer bg-white hover:bg-slate-700 hover:text-white border border-slate-200 hover:border-slate-700 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
-        }, "🏯 Importar")
-      ], 32),
-      t("button", {
-        onClick: o[3] || (o[3] = (a) => e.exportFunction()),
-        class: "cursor-pointer bg-white hover:bg-slate-700 hover:text-white border border-slate-200 hover:border-slate-700 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
-      }, "🚀 Exportar")
-    ]),
-    t("div", ye, [
-      t("div", Ce, [
+        }, "🚀 Exportar")
+      ])
+    ])) : k("", !0),
+    t("div", Se, [
+      t("div", Fe, [
         t("button", {
-          class: L([[e.isComponentMode ? "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md" : "bg-white hover:bg-slate-100"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
+          type: "button",
+          class: G([[e.isComponentMode ? "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md" : "bg-white hover:bg-slate-100"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
           onClick: o[4] || (o[4] = (a) => {
-            var b;
-            return (b = e.toggleComponentModeFunction) == null ? void 0 : b.call(e);
+            var m;
+            return (m = e.toggleComponentModeFunction) == null ? void 0 : m.call(e);
           })
-        }, p(e.isComponentMode ? "⚒️ Modo Configuración" : "👁️ Modo Visual"), 3),
+        }, f(e.isComponentMode ? "⚒️ Modo Configuración" : "👁️ Modo Visual"), 3),
         t("button", {
-          class: L([[e.fullwidthMode ? "bg-white hover:bg-slate-100" : "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
+          type: "button",
+          class: G([[e.fullwidthMode ? "bg-white hover:bg-slate-100" : "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
           onClick: o[5] || (o[5] = (a) => {
-            var b;
-            return (b = e.toggleFullwidthMode) == null ? void 0 : b.call(e);
+            var m;
+            return (m = e.toggleFullwidthMode) == null ? void 0 : m.call(e);
           })
-        }, p(e.fullwidthMode ? "⚒️ Comps. Plegados" : "👁️ Comps. Desplegados"), 3)
+        }, f(e.fullwidthMode ? "⚒️ Comps. Plegados" : "👁️ Comps. Desplegados"), 3)
       ]),
-      t("div", $e, [
+      t("div", Pe, [
         t("select", {
           value: e.sectionSelected,
           onChange: o[6] || (o[6] = (a) => e.$emit("update:sectionSelected", a.target.value)),
           class: "bg-white border border-slate-200 rounded-lg px-3 py-1.5 cursor-pointer text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 transition-colors"
         }, [
-          (s(!0), i(B, null, V(e.availableSections, (a, b) => (s(), i("option", {
-            key: b,
+          (s(!0), d(B, null, N(e.availableSections, (a, m) => (s(), d("option", {
+            key: m,
             value: a
-          }, p(a), 9, Se))), 128))
-        ], 40, ke),
+          }, f(a), 9, Me))), 128))
+        ], 40, je),
         R(t("select", {
           class: "bg-white border border-slate-200 rounded-lg px-3 py-1.5 cursor-pointer text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 transition-colors",
           "onUpdate:modelValue": o[7] || (o[7] = (a) => e.sectionWidth = a)
@@ -213,84 +232,90 @@ function ot(e, o, g, x, f, u) {
             disabled: "",
             value: ""
           }, "Selecciona el ancho de la sección", -1)),
-          t("option", Pe, "Sección " + p(e.sectionSelected) + " ocupa todo el ancho de la página", 1),
-          t("option", Fe, "Sección " + p(e.sectionSelected) + " ocupa 1/2 del ancho de la página", 1),
-          t("option", je, "Sección " + p(e.sectionSelected) + " ocupa 1/3 del ancho de la página", 1),
-          t("option", Ie, "Sección " + p(e.sectionSelected) + " ocupa 2/3 del ancho de la página", 1),
-          t("option", Me, "Sección " + p(e.sectionSelected) + " ocupa 1/4 del ancho de la página", 1),
-          t("option", Ae, "Sección " + p(e.sectionSelected) + " ocupa 3/4 del ancho de la página", 1),
-          t("option", Be, "Sección " + p(e.sectionSelected) + " ocupa 1/5 del ancho de la página", 1),
-          t("option", Ee, "Sección " + p(e.sectionSelected) + " ocupa 2/5 del ancho de la página", 1),
-          t("option", Te, "Sección " + p(e.sectionSelected) + " ocupa 3/5 del ancho de la página", 1),
-          t("option", De, "Sección " + p(e.sectionSelected) + " ocupa 4/5 del ancho de la página", 1)
+          t("option", Ie, "Sección " + f(e.sectionSelected) + " ocupa todo el ancho de la página", 1),
+          t("option", Ae, "Sección " + f(e.sectionSelected) + " ocupa 1/2 del ancho de la página", 1),
+          t("option", Be, "Sección " + f(e.sectionSelected) + " ocupa 1/3 del ancho de la página", 1),
+          t("option", Ee, "Sección " + f(e.sectionSelected) + " ocupa 2/3 del ancho de la página", 1),
+          t("option", Te, "Sección " + f(e.sectionSelected) + " ocupa 1/4 del ancho de la página", 1),
+          t("option", De, "Sección " + f(e.sectionSelected) + " ocupa 3/4 del ancho de la página", 1),
+          t("option", Oe, "Sección " + f(e.sectionSelected) + " ocupa 1/5 del ancho de la página", 1),
+          t("option", Re, "Sección " + f(e.sectionSelected) + " ocupa 2/5 del ancho de la página", 1),
+          t("option", Ne, "Sección " + f(e.sectionSelected) + " ocupa 3/5 del ancho de la página", 1),
+          t("option", Ve, "Sección " + f(e.sectionSelected) + " ocupa 4/5 del ancho de la página", 1)
         ], 512), [
-          [J, e.sectionWidth]
+          [H, e.sectionWidth]
         ]),
         t("button", {
-          class: L([
+          type: "button",
+          class: G([
             "cursor-pointer border rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200 flex items-center gap-2",
             e.showAdvancedConfig ? "bg-gradient-to-r from-amber-500 to-orange-500 border-amber-500 text-white shadow-md" : "bg-white border-slate-200 hover:bg-slate-100"
           ]),
           onClick: o[8] || (o[8] = (a) => e.showAdvancedConfig = !e.showAdvancedConfig)
         }, [
           o[32] || (o[32] = t("span", null, "⚙️ Página", -1)),
-          e.showAdvancedConfig ? (s(), i("span", Oe, "▲")) : (s(), i("span", Re, "▼"))
+          e.showAdvancedConfig ? (s(), d("span", Ue, "▲")) : (s(), d("span", ze, "▼"))
         ], 2)
       ]),
-      t("div", Ne, [
+      t("div", qe, [
         t("button", {
+          type: "button",
           onClick: o[9] || (o[9] = (a) => e.previewFunction()),
           class: "cursor-pointer bg-white hover:bg-violet-500 hover:text-white hover:border-violet-500 border border-slate-200 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
         }, "🔎 Preview"),
         t("button", {
+          type: "button",
           onClick: o[10] || (o[10] = (a) => e.saveButtonAction()),
-          title: "No es un guardado real, simplemente almacena la configuración en el navegador para recuperarla luego",
+          title: "Guardar configuración en localStorage y disparar evento global",
           class: "cursor-pointer bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white border border-emerald-500 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
-        }, "💾 Guardar"),
-        t("button", {
+        }, f(e.isSaved ? e.submitForm ? "⏳ Submiteando formulario" : "✅ Se ha guardado correctamente" : "💾 Guardar"), 1),
+        e.debugMode ? (s(), d("button", {
+          key: 0,
+          type: "button",
           onClick: o[11] || (o[11] = (a) => e.loadFromLocalStorage()),
           class: "cursor-pointer bg-white hover:bg-blue-500 hover:text-white hover:border-blue-500 border border-slate-200 rounded-lg px-3 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
-        }, "⤵️ Cargar"),
+        }, "⤵️ Cargar")) : k("", !0),
         t("button", {
+          type: "button",
           onClick: o[12] || (o[12] = (a) => e.toggleExpandScreen()),
           title: "Expandir / Contraer Pagebuilder",
           class: "cursor-pointer bg-white hover:bg-slate-700 hover:text-white hover:border-slate-700 border border-slate-200 rounded-lg px-3 py-1.5 text-xl transition-all duration-200 shadow-sm hover:shadow-md ms-2"
         }, "◳")
       ])
     ]),
-    e.showAdvancedConfig && e.parametersPageConfiguration ? (s(), i("div", Ve, [
-      t("div", Ue, [
-        t("div", ze, [
+    e.showAdvancedConfig && e.parametersPageConfiguration ? (s(), d("div", Le, [
+      t("div", Ge, [
+        t("div", Je, [
           o[38] || (o[38] = t("h2", { class: "text-lg font-bold mb-4 text-slate-700" }, "Configuración Avanzada", -1)),
           o[39] || (o[39] = t("h3", { class: "font-semibold mb-3 text-slate-600" }, "Configuración Global", -1)),
-          t("div", qe, [
-            t("div", Le, [
-              t("label", Ge, [
+          t("div", He, [
+            t("div", We, [
+              t("label", Ye, [
                 R(t("input", {
                   type: "checkbox",
                   "onUpdate:modelValue": o[13] || (o[13] = (a) => e.parametersPageConfiguration.global.sidebarEnabled = a),
                   onChange: o[14] || (o[14] = (a) => e.$emit("update:parametersPageConfiguration.global.sidebarEnabled", a.target.value)),
                   class: "w-5 h-5 rounded border-slate-300 text-emerald-500 focus:ring-emerald-500 cursor-pointer"
                 }, null, 544), [
-                  [te, e.parametersPageConfiguration.global.sidebarEnabled]
+                  [ne, e.parametersPageConfiguration.global.sidebarEnabled]
                 ]),
                 o[33] || (o[33] = t("span", { class: "text-slate-600 group-hover:text-slate-800 transition-colors" }, "Sidebar Habilitado", -1))
               ])
             ]),
-            t("div", Je, [
-              t("label", He, [
+            t("div", Ke, [
+              t("label", Qe, [
                 R(t("input", {
                   type: "checkbox",
                   "onUpdate:modelValue": o[15] || (o[15] = (a) => e.parametersPageConfiguration.global.renderAsBodyPart = a),
                   onChange: o[16] || (o[16] = (a) => e.$emit("update:parametersPageConfiguration.global.renderAsBodyPart", a.target.value)),
                   class: "w-5 h-5 rounded border-slate-300 text-emerald-500 focus:ring-emerald-500 cursor-pointer"
                 }, null, 544), [
-                  [te, e.parametersPageConfiguration.global.renderAsBodyPart]
+                  [ne, e.parametersPageConfiguration.global.renderAsBodyPart]
                 ]),
                 o[34] || (o[34] = t("span", { class: "text-slate-600 group-hover:text-slate-800 transition-colors" }, "Renderizar como parte del BODY (Sin etiquetas HTML, HEAD, BODY)", -1))
               ])
             ]),
-            t("div", We, [
+            t("div", Xe, [
               o[35] || (o[35] = t("label", {
                 for: "headSlot",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -303,10 +328,10 @@ function ot(e, o, g, x, f, u) {
                 placeholder: "Contenido para el head",
                 rows: "3"
               }, null, 544), [
-                [Y, e.parametersPageConfiguration.global.headSlot]
+                [K, e.parametersPageConfiguration.global.headSlot]
               ])
             ]),
-            t("div", Ye, [
+            t("div", Ze, [
               o[36] || (o[36] = t("label", {
                 for: "bodyBeginSlot",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -319,10 +344,10 @@ function ot(e, o, g, x, f, u) {
                 placeholder: "Contenido para el inicio del body",
                 rows: "3"
               }, null, 544), [
-                [Y, e.parametersPageConfiguration.global.bodyBeginSlot]
+                [K, e.parametersPageConfiguration.global.bodyBeginSlot]
               ])
             ]),
-            t("div", Ke, [
+            t("div", _e, [
               o[37] || (o[37] = t("label", {
                 for: "footerSlot",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -335,21 +360,22 @@ function ot(e, o, g, x, f, u) {
                 placeholder: "Contenido para el footer",
                 rows: "3"
               }, null, 544), [
-                [Y, e.parametersPageConfiguration.global.footerSlot]
+                [K, e.parametersPageConfiguration.global.footerSlot]
               ])
             ])
           ])
         ]),
-        t("div", Qe, [
-          t("div", Xe, [
+        t("div", et, [
+          t("div", tt, [
             o[40] || (o[40] = t("h2", { class: "text-lg font-bold text-slate-700" }, "Configuración SEO", -1)),
             t("button", {
+              type: "button",
               onClick: o[23] || (o[23] = (a) => e.validateSeo()),
               class: "cursor-pointer bg-gradient-to-r from-violet-500 to-purple-500 hover:from-violet-600 hover:to-purple-600 text-white border border-violet-500 rounded-lg px-4 py-1.5 text-sm font-medium transition-all duration-200 shadow-sm hover:shadow-md"
             }, "🦄 Validar SEO")
           ]),
-          t("div", Ze, [
-            t("div", _e, [
+          t("div", ot, [
+            t("div", nt, [
               o[42] || (o[42] = t("label", {
                 for: "robotsIndex",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -363,10 +389,10 @@ function ot(e, o, g, x, f, u) {
                 t("option", { value: "index, follow" }, "Index Follow", -1),
                 t("option", { value: "noindex, nofollow" }, "Noindex Nofollow", -1)
               ])], 544), [
-                [J, e.parametersPageConfiguration.seo.robots]
+                [H, e.parametersPageConfiguration.seo.robots]
               ])
             ]),
-            t("div", et, [
+            t("div", lt, [
               o[43] || (o[43] = t("label", {
                 for: "pageTitle",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -379,10 +405,10 @@ function ot(e, o, g, x, f, u) {
                 class: "w-full px-4 py-2.5 border border-slate-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-white text-sm transition-colors",
                 placeholder: "Ingresa el título de la página"
               }, null, 544), [
-                [Y, e.parametersPageConfiguration.seo.title]
+                [K, e.parametersPageConfiguration.seo.title]
               ])
             ]),
-            t("div", tt, [
+            t("div", at, [
               o[44] || (o[44] = t("label", {
                 for: "pageDescription",
                 class: "block text-sm font-medium text-slate-600 mb-2"
@@ -395,22 +421,22 @@ function ot(e, o, g, x, f, u) {
                 placeholder: "Ingresa la descripción de la página",
                 rows: "3"
               }, null, 544), [
-                [Y, e.parametersPageConfiguration.seo.description]
+                [K, e.parametersPageConfiguration.seo.description]
               ])
             ])
           ])
         ])
       ])
-    ])) : P("", !0)
-  ], 64);
+    ])) : k("", !0)
+  ], 512);
 }
-const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
+const st = /* @__PURE__ */ ye(we, [["render", rt]]), it = {
   key: 0,
   class: "absolute top-0 left-0 bg-white/90 w-full h-full z-100"
-}, at = { class: "w-full flex justify-end p-4" }, rt = ["for"], st = {
+}, dt = { class: "w-full flex justify-end p-4" }, ut = ["for"], ct = {
   key: 0,
   class: "text-red-500"
-}, it = ["id", "name", "placeholder", "required", "value", "onInput"], dt = ["id", "name", "data-mandatoryCrops", "placeholder", "required", "value", "onInput"], ut = ["id", "name", "required", "value", "onInput"], ct = ["value"], mt = ["id", "name", "required", "checked", "onChange"], re = /* @__PURE__ */ H({
+}, mt = ["id", "name", "placeholder", "required", "value", "onInput"], bt = ["id", "name", "data-mandatoryCrops", "placeholder", "required", "value", "onInput"], gt = ["id", "name", "required", "value", "onInput"], ft = ["value"], pt = ["id", "name", "required", "checked", "onChange"], ie = /* @__PURE__ */ W({
   __name: "FieldsForm",
   props: {
     object: {
@@ -427,111 +453,111 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     }
   },
   setup(e) {
-    const o = e, g = (x, f) => {
-      const u = (o.object.fields || []).find((a) => a.name === x);
-      u && (u.example_value = f);
+    const o = e, b = (h, g) => {
+      const c = (o.object.fields || []).find((a) => a.name === h);
+      c && (c.example_value = g);
     };
-    return (x, f) => (s(), i(B, null, [
-      e.showForm ? (s(), i("div", nt)) : P("", !0),
+    return (h, g) => (s(), d(B, null, [
+      e.showForm ? (s(), d("div", it)) : k("", !0),
       t("div", {
-        class: L(e.showForm ? "relative top-0 w-full text-slate-600 border-1 my-2 px-4 pt-2 pb-3 w-full border-slate-200 bg-slate-50 inline-block rounded-lg flex flex-col z-101" : "hidden")
+        class: G(e.showForm ? "relative top-0 w-full text-slate-600 border-1 my-2 px-4 pt-2 pb-3 w-full border-slate-200 bg-slate-50 inline-block rounded-lg flex flex-col z-101" : "hidden")
       }, [
-        t("div", at, [
+        t("div", dt, [
           t("span", {
-            onClick: f[0] || (f[0] = //@ts-ignore
-            (...u) => e.toggleShowForm && e.toggleShowForm(...u)),
+            onClick: g[0] || (g[0] = //@ts-ignore
+            (...c) => e.toggleShowForm && e.toggleShowForm(...c)),
             class: "cursor-pointer hover:scale-125 transition-all duration-300"
           }, "❌")
         ]),
         t("form", null, [
-          (s(!0), i(B, null, V(e.object.fields, (u, a) => (s(), i("div", {
+          (s(!0), d(B, null, N(e.object.fields, (c, a) => (s(), d("div", {
             key: a,
             class: "mb-4"
           }, [
             t("label", {
-              for: `${e.object.id}-${u.name}-${a}`,
+              for: `${e.object.id}-${c.name}-${a}`,
               class: "block text-sm font-medium mb-1"
             }, [
-              T(p(u.label) + " ", 1),
-              u.mandatory ? (s(), i("span", st, "*")) : P("", !0)
-            ], 8, rt),
-            u.type === "text" ? (s(), i("input", {
+              D(f(c.label) + " ", 1),
+              c.mandatory ? (s(), d("span", ct, "*")) : k("", !0)
+            ], 8, ut),
+            c.type === "text" ? (s(), d("input", {
               key: 0,
-              id: `${e.object.id}-${u.name}-${a}`,
-              name: `${e.object.id}-${u.name}-${a}`,
+              id: `${e.object.id}-${c.name}-${a}`,
+              name: `${e.object.id}-${c.name}-${a}`,
               type: "text",
               class: "w-full px-3 py-2 border border-slate-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-400",
-              placeholder: u.label,
-              required: u.mandatory,
-              value: u.example_value,
-              onInput: (b) => g(u.name, b.target.value)
-            }, null, 40, it)) : P("", !0),
-            u.type === "image" ? (s(), i("input", {
+              placeholder: c.label,
+              required: c.mandatory,
+              value: c.example_value,
+              onInput: (m) => b(c.name, m.target.value)
+            }, null, 40, mt)) : k("", !0),
+            c.type === "image" ? (s(), d("input", {
               key: 1,
-              id: `${e.object.id}-${u.name}-${a}`,
-              name: `${e.object.id}-${u.name}-${a}`,
-              "data-mandatoryCrops": u.image_cuts ? JSON.stringify(u.image_cuts) : null,
+              id: `${e.object.id}-${c.name}-${a}`,
+              name: `${e.object.id}-${c.name}-${a}`,
+              "data-mandatoryCrops": c.image_cuts ? JSON.stringify(c.image_cuts) : null,
               type: "text",
               class: "js-limbo w-full px-3 py-2 border border-slate-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-400",
-              placeholder: u.label,
-              required: u.mandatory,
-              value: u.example_value,
-              onInput: (b) => g(u.name, b.target.value)
-            }, null, 40, dt)) : u.type === "textArea" ? (s(), ie(G(ve), {
+              placeholder: c.label,
+              required: c.mandatory,
+              value: c.example_value,
+              onInput: (m) => b(c.name, m.target.value)
+            }, null, 40, bt)) : c.type === "textArea" ? (s(), ue(q(he), {
               key: 2,
               theme: "snow",
-              id: `${e.object.id}-${u.name}-${a}`,
-              name: `${e.object.id}-${u.name}-${a}`,
+              id: `${e.object.id}-${c.name}-${a}`,
+              name: `${e.object.id}-${c.name}-${a}`,
               rows: "3",
               class: "w-full px-3 py-2 border border-slate-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-400 z-9999",
-              placeholder: u.label,
-              required: u.mandatory,
-              "onUpdate:content": (b) => {
-                g(u.name, b);
+              placeholder: c.label,
+              required: c.mandatory,
+              "onUpdate:content": (m) => {
+                b(c.name, m);
               },
-              content: u.example_value,
-              modelValue: u.example_value,
-              "onUpdate:modelValue": (b) => u.example_value = b,
+              content: c.example_value,
+              modelValue: c.example_value,
+              "onUpdate:modelValue": (m) => c.example_value = m,
               contentType: "html"
-            }, null, 8, ["id", "name", "placeholder", "required", "onUpdate:content", "content", "modelValue", "onUpdate:modelValue"])) : u.type === "select" ? (s(), i("select", {
+            }, null, 8, ["id", "name", "placeholder", "required", "onUpdate:content", "content", "modelValue", "onUpdate:modelValue"])) : c.type === "select" ? (s(), d("select", {
               key: 3,
-              id: `${e.object.id}-${u.name}-${a}`,
-              name: `${e.object.id}-${u.name}-${a}`,
+              id: `${e.object.id}-${c.name}-${a}`,
+              name: `${e.object.id}-${c.name}-${a}`,
               class: "w-full px-3 py-2 border border-slate-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-400",
-              required: u.mandatory,
-              value: u.example_value,
-              onInput: (b) => g(u.name, b.target.value)
+              required: c.mandatory,
+              value: c.example_value,
+              onInput: (m) => b(c.name, m.target.value)
             }, [
-              f[1] || (f[1] = t("option", {
+              g[1] || (g[1] = t("option", {
                 disabled: "",
                 value: ""
               }, "Seleccione una opción", -1)),
-              (s(!0), i(B, null, V(u.options || [], (b, C) => (s(), i("option", {
+              (s(!0), d(B, null, N(c.options || [], (m, C) => (s(), d("option", {
                 key: C,
-                value: b
-              }, p(b), 9, ct))), 128))
-            ], 40, ut)) : u.type === "boolean" ? (s(), i("input", {
+                value: m
+              }, f(m), 9, ft))), 128))
+            ], 40, gt)) : c.type === "boolean" ? (s(), d("input", {
               key: 4,
-              id: `${e.object.id}-${u.name}-${a}`,
-              name: `${e.object.id}-${u.name}-${a}`,
+              id: `${e.object.id}-${c.name}-${a}`,
+              name: `${e.object.id}-${c.name}-${a}`,
               type: "checkbox",
               class: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-slate-300 rounded inline-block",
-              required: u.mandatory,
-              checked: u.example_value,
-              onChange: (b) => g(u.name, b.target.checked)
-            }, null, 40, mt)) : P("", !0)
+              required: c.mandatory,
+              checked: c.example_value,
+              onChange: (m) => b(c.name, m.target.checked)
+            }, null, 40, pt)) : k("", !0)
           ]))), 128))
         ])
       ], 2)
     ], 64));
   }
-}), bt = { class: "space-y-4" }, gt = ["disabled"], ft = ["value"], pt = { class: "space-y-3" }, vt = {
+}), vt = { class: "space-y-4" }, xt = ["disabled"], ht = ["value"], wt = { class: "space-y-3" }, yt = {
   key: 0,
   class: "overflow-y-auto space-y-3"
-}, xt = { class: "block text-sm font-semibold text-slate-600 mb-2" }, ht = ["onChange", "disabled"], wt = ["value"], yt = ["onChange", "disabled"], Ct = ["onInput", "disabled", "placeholder"], $t = ["disabled"], kt = {
+}, Ct = { class: "block text-sm font-semibold text-slate-600 mb-2" }, $t = ["onChange", "disabled"], kt = ["value"], St = ["onChange", "disabled"], Ft = ["onInput", "disabled", "placeholder"], Pt = ["disabled"], jt = {
   key: 0,
   class: "animate-spin"
-}, St = { key: 1 }, Pt = /* @__PURE__ */ H({
+}, Mt = { key: 1 }, It = /* @__PURE__ */ W({
   __name: "SourceFilter",
   props: {
     onSubmit: {
@@ -548,13 +574,13 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     }
   },
   setup(e) {
-    const o = e, g = S(!1), x = S(null), f = S({}), u = K(() => {
-      const r = o.isProduction;
+    const o = e, b = $(!1), h = $(null), g = $({}), c = Q(() => {
+      const u = o.isProduction;
       return [
         {
           id: "origen1",
           name: "El Derecho",
-          apiUrl: r ? "https://elderecho.com/feed" : "https://led-dev-elderecho-dev.eu.els.local/feed",
+          apiUrl: u ? "https://elderecho.com/feed" : "https://led-dev-elderecho-dev.eu.els.local/feed",
           filters: [
             { id: "title", label: "Título del Post", type: "text" },
             { id: "category", label: "Slug de la Categoría", type: "text" },
@@ -568,7 +594,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         {
           id: "origen2",
           name: "Formación",
-          apiUrl: r ? "https://lefebvre.es/formacion/feed" : "http://led-dev-lefebvre-dev.eu.els.local/formacion/feed",
+          apiUrl: u ? "https://lefebvre.es/formacion/feed" : "http://led-dev-lefebvre-dev.eu.els.local/formacion/feed",
           filters: [
             { id: "id", label: "ID del curso", type: "text" },
             { id: "title", label: "Título del Post", type: "text" },
@@ -580,152 +606,153 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         {
           id: "origen3",
           name: "Derecholocal",
-          apiUrl: r ? "https://derecholocal.es/feed" : "https://led-dev-derecholocal-dev.eu.els.local/feed",
+          apiUrl: u ? "https://derecholocal.es/feed" : "https://led-dev-derecholocal-dev.eu.els.local/feed",
           filters: []
         },
         {
           id: "origen4",
           name: "EspacioAsesoría",
-          apiUrl: r ? "https://espacioasesoria.com/feed" : "https://led-dev-espacioasesoria-dev.eu.els.local/feed",
+          apiUrl: u ? "https://espacioasesoria.com/feed" : "https://led-dev-espacioasesoria-dev.eu.els.local/feed",
           filters: []
         },
         {
           id: "origen5",
           name: "EspacioPymes",
-          apiUrl: r ? "https://espaciopymes.com/feed" : "https://led-dev-espaciopymes-dev.eu.els.local/feed",
+          apiUrl: u ? "https://espaciopymes.com/feed" : "https://led-dev-espaciopymes-dev.eu.els.local/feed",
           filters: []
         }
       ];
-    }), a = K(() => {
-      if (!x.value)
+    }), a = Q(() => {
+      if (!h.value)
         return [];
-      const r = u.value.find((l) => l.id === x.value);
-      return r ? r.filters : [];
-    }), b = (r, l) => {
-      f.value[r] = l;
+      const u = c.value.find((l) => l.id === h.value);
+      return u ? u.filters : [];
+    }), m = (u, l) => {
+      g.value[u] = l;
     }, C = () => {
-      f.value = {};
-    }, I = async () => {
-      g.value = !0;
-      const r = u.value.find((n) => n.id === x.value);
-      if (!r) {
-        console.error("Origen no encontrado"), g.value = !1;
+      g.value = {};
+    }, M = async () => {
+      b.value = !0;
+      const u = c.value.find((i) => i.id === h.value);
+      if (!u) {
+        console.error("Origen no encontrado"), b.value = !1;
         return;
       }
-      const l = new URL(r.apiUrl);
-      Object.keys(f.value).forEach((n) => {
-        f.value[n] && l.searchParams.append(n, f.value[n]);
+      const l = new URL(u.apiUrl);
+      Object.keys(g.value).forEach((i) => {
+        g.value[i] && l.searchParams.append(i, g.value[i]);
       });
       try {
-        const m = await (await fetch(l.toString(), {
+        const w = await (await fetch(l.toString(), {
           method: "GET",
           headers: {
             Accept: "text/xml, application/xml"
           }
-        })).text(), A = new DOMParser().parseFromString(m, "text/xml"), w = Array.from(A.querySelectorAll("item")).map((d) => {
-          const c = {};
-          return Array.from(d.children).forEach(($) => {
-            $.children.length > 0 ? Array.from($.children).forEach((j) => {
-              const D = `${$.nodeName}_${j.nodeName}`;
-              c[D] = j.textContent || "";
-            }) : c[$.nodeName] = $.textContent || "";
-          }), c;
+        })).text(), j = new DOMParser().parseFromString(w, "text/xml"), v = Array.from(j.querySelectorAll("item")).map((n) => {
+          const r = {};
+          return Array.from(n.children).forEach((S) => {
+            S.children.length > 0 ? Array.from(S.children).forEach((F) => {
+              const E = `${S.nodeName}_${F.nodeName}`;
+              r[E] = F.textContent || "";
+            }) : r[S.nodeName] = S.textContent || "";
+          }), r;
         });
-        o.onSubmit(w);
-      } catch (n) {
-        console.error("Error al aplicar filtros:", n), o.onSubmit([]);
+        o.onSubmit(v);
+      } catch (i) {
+        console.error("Error al aplicar filtros:", i), o.onSubmit([]);
       } finally {
-        const n = {
-          name: r.name,
+        const i = {
+          name: u.name,
           url: l.toString()
         };
-        o.updateFeedCriteria(n), g.value = !1;
+        o.updateFeedCriteria(i), b.value = !1;
       }
     };
-    return (r, l) => (s(), i("div", bt, [
+    return (u, l) => (s(), d("div", vt, [
       t("div", null, [
         l[1] || (l[1] = t("label", { class: "block text-sm font-semibold text-slate-600 mb-2" }, "Seleccionar origen:", -1)),
         R(t("select", {
-          "onUpdate:modelValue": l[0] || (l[0] = (n) => x.value = n),
+          "onUpdate:modelValue": l[0] || (l[0] = (i) => h.value = i),
           class: "w-full px-3 py-2.5 bg-white border border-slate-200 rounded-lg shadow-sm focus:border-emerald-400 focus:ring-2 focus:ring-emerald-500/20 transition-all duration-200 disabled:bg-slate-100 disabled:cursor-not-allowed cursor-pointer",
           onChange: C,
-          disabled: g.value
+          disabled: b.value
         }, [
-          (s(!0), i(B, null, V(u.value, (n) => (s(), i("option", {
-            key: n.id,
-            value: n.id
-          }, p(n.name), 9, ft))), 128))
-        ], 40, gt), [
-          [J, x.value]
+          (s(!0), d(B, null, N(c.value, (i) => (s(), d("option", {
+            key: i.id,
+            value: i.id
+          }, f(i.name), 9, ht))), 128))
+        ], 40, xt), [
+          [H, h.value]
         ])
       ]),
-      t("div", pt, [
-        a.value.length > 0 ? (s(), i("div", vt, [
-          (s(!0), i(B, null, V(a.value, (n) => (s(), i("div", {
-            key: n.id,
+      t("div", wt, [
+        a.value.length > 0 ? (s(), d("div", yt, [
+          (s(!0), d(B, null, N(a.value, (i) => (s(), d("div", {
+            key: i.id,
             class: "bg-gradient-to-br from-slate-50 to-white p-4 rounded-xl border border-slate-200"
           }, [
-            t("label", xt, p(n.label) + ":", 1),
-            n.type === "select" ? (s(), i("select", {
+            t("label", Ct, f(i.label) + ":", 1),
+            i.type === "select" ? (s(), d("select", {
               key: 0,
               class: "w-full px-3 py-2.5 bg-white border border-slate-200 rounded-lg shadow-sm focus:border-emerald-400 focus:ring-2 focus:ring-emerald-500/20 transition-all duration-200 disabled:bg-slate-100 disabled:cursor-not-allowed cursor-pointer",
-              onChange: (m) => b(n.id, m.target.value),
-              disabled: g.value
+              onChange: (w) => m(i.id, w.target.value),
+              disabled: b.value
             }, [
               l[2] || (l[2] = t("option", { value: "" }, "Seleccionar...", -1)),
-              (s(!0), i(B, null, V(n.options, (m) => (s(), i("option", {
-                key: m,
-                value: m
-              }, p(m), 9, wt))), 128))
-            ], 40, ht)) : n.type === "date" ? (s(), i("input", {
+              (s(!0), d(B, null, N(i.options, (w) => (s(), d("option", {
+                key: w,
+                value: w
+              }, f(w), 9, kt))), 128))
+            ], 40, $t)) : i.type === "date" ? (s(), d("input", {
               key: 1,
               type: "date",
               class: "w-full px-3 py-2.5 bg-white border border-slate-200 rounded-lg shadow-sm focus:border-emerald-400 focus:ring-2 focus:ring-emerald-500/20 transition-all duration-200 disabled:bg-slate-100 disabled:cursor-not-allowed",
-              onChange: (m) => b(n.id, m.target.value),
-              disabled: g.value
-            }, null, 40, yt)) : n.type === "text" ? (s(), i("input", {
+              onChange: (w) => m(i.id, w.target.value),
+              disabled: b.value
+            }, null, 40, St)) : i.type === "text" ? (s(), d("input", {
               key: 2,
               type: "text",
               class: "w-full px-3 py-2.5 bg-white border border-slate-200 rounded-lg shadow-sm focus:border-emerald-400 focus:ring-2 focus:ring-emerald-500/20 transition-all duration-200 disabled:bg-slate-100 disabled:cursor-not-allowed",
-              onInput: (m) => b(n.id, m.target.value),
-              disabled: g.value,
-              placeholder: n.label
-            }, null, 40, Ct)) : P("", !0)
+              onInput: (w) => m(i.id, w.target.value),
+              disabled: b.value,
+              placeholder: i.label
+            }, null, 40, Ft)) : k("", !0)
           ]))), 128))
-        ])) : P("", !0),
+        ])) : k("", !0),
         t("button", {
-          onClick: I,
+          type: "button",
+          onClick: M,
           class: "cursor-pointer w-full bg-gradient-to-r from-emerald-500 to-teal-500 text-white font-semibold px-4 py-3 rounded-xl shadow-md hover:from-emerald-600 hover:to-teal-600 hover:shadow-lg transform hover:-translate-y-0.5 transition-all duration-200 disabled:from-slate-300 disabled:to-slate-400 disabled:cursor-not-allowed disabled:transform-none disabled:shadow-none flex items-center justify-center gap-2",
-          disabled: g.value
+          disabled: b.value
         }, [
-          g.value ? (s(), i("span", kt, "⏳")) : (s(), i("span", St, "🔍")),
-          T(" " + p(g.value ? "Conectando con el feed..." : "Aplicar Filtros"), 1)
-        ], 8, $t)
+          b.value ? (s(), d("span", jt, "⏳")) : (s(), d("span", Mt, "🔍")),
+          D(" " + f(b.value ? "Conectando con el feed..." : "Aplicar Filtros"), 1)
+        ], 8, Pt)
       ])
     ]));
   }
-}), Ft = { class: "fixed top-0 left-0 w-full h-full bg-gradient-to-br from-slate-50 via-white to-slate-100 flex flex-col z-9999 p-6" }, jt = { class: "w-full flex justify-between items-center mb-4" }, It = { class: "w-full flex-1 bg-white/60 rounded-2xl flex gap-5 p-5 overflow-hidden backdrop-blur-sm border border-slate-200 shadow-inner" }, Mt = { class: "flex-1 flex flex-col gap-5" }, At = { class: "flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, Bt = {
+}), At = { class: "fixed top-0 left-0 w-full h-full bg-gradient-to-br from-slate-50 via-white to-slate-100 flex flex-col z-9999 p-6" }, Bt = { class: "w-full flex justify-between items-center mb-4" }, Et = { class: "w-full flex-1 bg-white/60 rounded-2xl flex gap-5 p-5 overflow-hidden backdrop-blur-sm border border-slate-200 shadow-inner" }, Tt = { class: "flex-1 flex flex-col gap-5" }, Dt = { class: "flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, Ot = {
   key: 0,
   class: "mb-4 p-4 bg-gradient-to-br from-emerald-50 to-teal-50 rounded-xl border border-emerald-200 w-full flex-shrink-0 text-sm font-medium text-emerald-700"
-}, Et = { class: "list-none mt-3 space-y-2 text-slate-600" }, Tt = { class: "flex items-start gap-2" }, Dt = { class: "font-semibold text-slate-700" }, Ot = { class: "flex items-start gap-2" }, Rt = { class: "font-semibold text-slate-700" }, Nt = { class: "font-semibold text-slate-700" }, Vt = { class: "flex items-start gap-2" }, Ut = { class: "flex flex-wrap gap-2 mt-1" }, zt = { class: "font-semibold text-slate-700" }, qt = { class: "text-emerald-600" }, Lt = { class: "flex flex-col gap-4 w-full" }, Gt = { class: "flex items-center gap-3 cursor-pointer group" }, Jt = {
+}, Rt = { class: "list-none mt-3 space-y-2 text-slate-600" }, Nt = { class: "flex items-start gap-2" }, Vt = { class: "font-semibold text-slate-700" }, Ut = { class: "flex items-start gap-2" }, zt = { class: "font-semibold text-slate-700" }, qt = { class: "font-semibold text-slate-700" }, Lt = { class: "flex items-start gap-2" }, Gt = { class: "flex flex-wrap gap-2 mt-1" }, Jt = { class: "font-semibold text-slate-700" }, Ht = { class: "text-emerald-600" }, Wt = { class: "flex flex-col gap-4 w-full" }, Yt = { class: "flex items-center gap-3 cursor-pointer group" }, Kt = {
   key: 0,
   class: "flex flex-col gap-4 ml-8 p-4 bg-gradient-to-br from-slate-50 to-white rounded-xl border border-slate-200"
-}, Ht = { class: "flex flex-col gap-2" }, Wt = { class: "flex flex-col gap-2" }, Yt = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, Kt = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, Qt = {
+}, Qt = { class: "flex flex-col gap-2" }, Xt = { class: "flex flex-col gap-2" }, Zt = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, _t = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, eo = {
   key: 0,
   class: "flex-1 flex flex-col items-center justify-center text-slate-400"
-}, Xt = {
+}, to = {
   key: 1,
   class: "space-y-3"
-}, Zt = ["onClick"], _t = { class: "font-bold text-slate-800 mb-2" }, eo = { class: "text-sm text-slate-600 line-clamp-2" }, to = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, oo = {
+}, oo = ["onClick"], no = { class: "font-bold text-slate-800 mb-2" }, lo = { class: "text-sm text-slate-600 line-clamp-2" }, ao = { class: "flex-1 flex flex-col bg-white rounded-2xl shadow-lg border border-slate-200 p-5 overflow-y-auto" }, ro = {
   key: 0,
   class: "flex-1 flex flex-col items-center justify-center text-slate-400"
-}, lo = {
+}, so = {
   key: 1,
   class: "space-y-3"
-}, no = { class: "block text-sm font-bold text-slate-700 mb-2 flex items-center gap-2" }, ao = ["onUpdate:modelValue"], ro = ["value"], so = {
+}, io = { class: "block text-sm font-bold text-slate-700 mb-2 flex items-center gap-2" }, uo = ["onUpdate:modelValue"], co = ["value"], mo = {
   key: 0,
   class: "mt-3 p-3 bg-gradient-to-br from-emerald-50 to-teal-50 rounded-lg border border-emerald-200"
-}, io = { class: "mt-1 text-sm font-medium text-slate-700 break-words" }, uo = /* @__PURE__ */ H({
+}, bo = { class: "mt-1 text-sm font-medium text-slate-700 break-words" }, go = /* @__PURE__ */ W({
   __name: "FeedComponent",
   props: {
     object: {
@@ -746,274 +773,274 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     }
   },
   setup(e) {
-    const o = e, g = S(null), x = S(null), f = S(!1), u = S(1), a = S("horizontal"), b = S({}), C = S(null), I = (w) => {
-      g.value = w;
-    }, r = (w) => {
-      x.value = w;
+    const o = e, b = $(null), h = $(null), g = $(!1), c = $(1), a = $("horizontal"), m = $({}), C = $(null), M = (v) => {
+      b.value = v;
+    }, u = (v) => {
+      h.value = v;
     }, l = () => {
-      const w = o.object.fields.filter((d) => d.mappedTo).map((d) => {
-        var c;
+      const v = o.object.fields.filter((n) => n.mappedTo).map((n) => {
+        var r;
         return {
-          fieldName: d.name,
-          mappedTo: d.mappedTo,
-          value: ((c = x.value) == null ? void 0 : c[d.mappedTo]) ?? null
+          fieldName: n.name,
+          mappedTo: n.mappedTo,
+          value: ((r = h.value) == null ? void 0 : r[n.mappedTo]) ?? null
         };
       });
       C.value = {
-        ...b.value,
-        dynamicUpdate: f.value,
-        elementCount: u.value,
+        ...m.value,
+        dynamicUpdate: g.value,
+        elementCount: c.value,
         orientation: a.value,
-        mapping: w.map(({ fieldName: d, mappedTo: c }) => ({ fieldName: d, mappedTo: c }))
-      }, o.updateObjectByFeedContent && o.updateObjectByFeedContent(w, C.value), o.toggleFeedSection();
-    }, n = (w) => {
-      b.value = w;
-    }, m = () => {
-      var w;
-      (w = o.object) != null && w.repeat_data && (C.value = o.object.repeat_data, f.value = o.object.repeat_data.dynamicUpdate || !1, u.value = o.object.repeat_data.elementCount || 1, a.value = o.object.repeat_data.orientation || "horizontal", b.value = {
+        mapping: v.map(({ fieldName: n, mappedTo: r }) => ({ fieldName: n, mappedTo: r }))
+      }, o.updateObjectByFeedContent && o.updateObjectByFeedContent(v, C.value), o.toggleFeedSection();
+    }, i = (v) => {
+      m.value = v;
+    }, w = () => {
+      var v;
+      (v = o.object) != null && v.repeat_data && (C.value = o.object.repeat_data, g.value = o.object.repeat_data.dynamicUpdate || !1, c.value = o.object.repeat_data.elementCount || 1, a.value = o.object.repeat_data.orientation || "horizontal", m.value = {
         name: o.object.repeat_data.name,
         url: o.object.repeat_data.url
       });
-    }, k = () => {
-      C.value = null, f.value = !1, u.value = 1, a.value = "horizontal", b.value = {}, o.updateObjectByFeedContent && o.updateObjectByFeedContent([], null);
-    }, A = () => {
-      var w;
+    }, I = () => {
+      C.value = null, g.value = !1, c.value = 1, a.value = "horizontal", m.value = {}, o.updateObjectByFeedContent && o.updateObjectByFeedContent([], null);
+    }, j = () => {
+      var v;
       C.value && (C.value = {
         ...C.value,
-        dynamicUpdate: f.value,
-        elementCount: u.value,
+        dynamicUpdate: g.value,
+        elementCount: c.value,
         orientation: a.value
-      }, o.updateObjectByFeedContent && o.updateObjectByFeedContent(((w = C.value.mapping) == null ? void 0 : w.map((d) => ({
-        fieldName: d.fieldName,
-        mappedTo: d.mappedTo,
+      }, o.updateObjectByFeedContent && o.updateObjectByFeedContent(((v = C.value.mapping) == null ? void 0 : v.map((n) => ({
+        fieldName: n.fieldName,
+        mappedTo: n.mappedTo,
         value: null
       }))) || [], C.value));
     };
-    return le(() => {
-      m();
-    }), (w, d) => (s(), i("div", Ft, [
-      t("div", jt, [
-        d[5] || (d[5] = t("h2", { class: "text-2xl font-bold bg-gradient-to-r from-slate-700 to-slate-500 bg-clip-text text-transparent flex items-center gap-3" }, [
+    return ae(() => {
+      w();
+    }), (v, n) => (s(), d("div", At, [
+      t("div", Bt, [
+        n[5] || (n[5] = t("h2", { class: "text-2xl font-bold bg-gradient-to-r from-slate-700 to-slate-500 bg-clip-text text-transparent flex items-center gap-3" }, [
           t("span", { class: "text-3xl" }, "🍺"),
-          T(" Configuración de Feed ")
+          D(" Configuración de Feed ")
         ], -1)),
         t("button", {
-          onClick: d[0] || (d[0] = //@ts-ignore
-          (...c) => e.toggleFeedSection && e.toggleFeedSection(...c)),
+          onClick: n[0] || (n[0] = //@ts-ignore
+          (...r) => e.toggleFeedSection && e.toggleFeedSection(...r)),
           class: "cursor-pointer group w-10 h-10 flex items-center justify-center bg-white hover:bg-red-50 border border-red-200 hover:border-red-400 text-red-400 hover:text-red-600 rounded-full font-semibold shadow-sm hover:shadow-lg transition-all duration-200"
-        }, [...d[4] || (d[4] = [
+        }, [...n[4] || (n[4] = [
           t("span", { class: "text-lg" }, "✕", -1)
         ])])
       ]),
-      t("div", It, [
-        t("div", Mt, [
-          t("div", At, [
-            C.value && C.value.dynamicUpdate ? (s(), i("div", Bt, [
+      t("div", Et, [
+        t("div", Tt, [
+          t("div", Dt, [
+            C.value && C.value.dynamicUpdate ? (s(), d("div", Ot, [
               t("div", { class: "flex justify-between items-start" }, [
-                d[8] || (d[8] = t("p", { class: "flex items-center gap-2" }, [
+                n[8] || (n[8] = t("p", { class: "flex items-center gap-2" }, [
                   t("span", { class: "text-emerald-500" }, "✓"),
-                  T(" Hay un criterio de feed establecido: ")
+                  D(" Hay un criterio de feed establecido: ")
                 ], -1)),
                 t("div", { class: "flex items-center gap-2" }, [
                   t("button", {
-                    onClick: A,
+                    onClick: j,
                     class: "cursor-pointer px-3 py-1.5 bg-white hover:bg-emerald-50 text-emerald-500 hover:text-emerald-600 border border-emerald-200 hover:border-emerald-300 rounded-lg text-xs font-semibold transition-all duration-200 flex items-center gap-1 shadow-sm"
-                  }, [...d[6] || (d[6] = [
+                  }, [...n[6] || (n[6] = [
                     t("span", null, "💾", -1),
-                    T(" Guardar ", -1)
+                    D(" Guardar ", -1)
                   ])]),
                   t("button", {
-                    onClick: k,
+                    onClick: I,
                     class: "cursor-pointer px-3 py-1.5 bg-white hover:bg-red-50 text-red-500 hover:text-red-600 border border-red-200 hover:border-red-300 rounded-lg text-xs font-semibold transition-all duration-200 flex items-center gap-1 shadow-sm"
-                  }, [...d[7] || (d[7] = [
+                  }, [...n[7] || (n[7] = [
                     t("span", null, "✕", -1),
-                    T(" Borrar ", -1)
+                    D(" Borrar ", -1)
                   ])])
                 ])
               ]),
-              t("ul", Et, [
-                t("li", Tt, [
-                  d[9] || (d[9] = t("span", { class: "text-emerald-400" }, "→", -1)),
-                  d[10] || (d[10] = T(" Conectar con ", -1)),
-                  t("span", Dt, p(C.value.name), 1)
+              t("ul", Rt, [
+                t("li", Nt, [
+                  n[9] || (n[9] = t("span", { class: "text-emerald-400" }, "→", -1)),
+                  n[10] || (n[10] = D(" Conectar con ", -1)),
+                  t("span", Vt, f(C.value.name), 1)
                 ]),
-                t("li", Ot, [
-                  d[11] || (d[11] = t("span", { class: "text-emerald-400" }, "→", -1)),
-                  d[12] || (d[12] = T(" Recuperar ", -1)),
-                  t("span", Rt, p(C.value.elementCount), 1),
-                  d[13] || (d[13] = T(" items (", -1)),
-                  t("span", Nt, p(C.value.orientation), 1),
-                  d[14] || (d[14] = T(")", -1))
+                t("li", Ut, [
+                  n[11] || (n[11] = t("span", { class: "text-emerald-400" }, "→", -1)),
+                  n[12] || (n[12] = D(" Recuperar ", -1)),
+                  t("span", zt, f(C.value.elementCount), 1),
+                  n[13] || (n[13] = D(" items (", -1)),
+                  t("span", qt, f(C.value.orientation), 1),
+                  n[14] || (n[14] = D(")", -1))
                 ]),
-                t("li", Vt, [
-                  d[17] || (d[17] = t("span", { class: "text-emerald-400" }, "→", -1)),
+                t("li", Lt, [
+                  n[17] || (n[17] = t("span", { class: "text-emerald-400" }, "→", -1)),
                   t("div", null, [
-                    d[16] || (d[16] = T(" Mapeo: ", -1)),
-                    t("div", Ut, [
-                      (s(!0), i(B, null, V(C.value.mapping, (c, $) => (s(), i("span", {
-                        key: $,
+                    n[16] || (n[16] = D(" Mapeo: ", -1)),
+                    t("div", Gt, [
+                      (s(!0), d(B, null, N(C.value.mapping, (r, S) => (s(), d("span", {
+                        key: S,
                         class: "inline-flex items-center gap-1 px-2 py-0.5 bg-white rounded-full text-xs border border-slate-200"
                       }, [
-                        t("span", zt, p(c.fieldName), 1),
-                        d[15] || (d[15] = t("span", { class: "text-slate-400" }, "←", -1)),
-                        t("span", qt, p(c.mappedTo), 1)
+                        t("span", Jt, f(r.fieldName), 1),
+                        n[15] || (n[15] = t("span", { class: "text-slate-400" }, "←", -1)),
+                        t("span", Ht, f(r.mappedTo), 1)
                       ]))), 128))
                     ])
                   ])
                 ])
               ])
-            ])) : P("", !0),
-            t("div", Lt, [
-              t("label", Gt, [
+            ])) : k("", !0),
+            t("div", Wt, [
+              t("label", Yt, [
                 R(t("input", {
                   type: "checkbox",
-                  "onUpdate:modelValue": d[1] || (d[1] = (c) => f.value = c),
+                  "onUpdate:modelValue": n[1] || (n[1] = (r) => g.value = r),
                   class: "w-5 h-5 text-emerald-500 border-2 border-slate-300 rounded focus:ring-emerald-500 cursor-pointer"
                 }, null, 512), [
-                  [te, f.value]
+                  [ne, g.value]
                 ]),
-                d[18] || (d[18] = t("span", { class: "font-medium text-slate-700 group-hover:text-slate-900 transition-colors" }, "Actualizar dinámicamente según criterios del feed", -1))
+                n[18] || (n[18] = t("span", { class: "font-medium text-slate-700 group-hover:text-slate-900 transition-colors" }, "Actualizar dinámicamente según criterios del feed", -1))
               ]),
-              f.value ? (s(), i("div", Jt, [
-                t("div", Ht, [
-                  d[19] || (d[19] = t("label", { class: "text-sm font-semibold text-slate-600" }, "Cantidad de elementos:", -1)),
+              g.value ? (s(), d("div", Kt, [
+                t("div", Qt, [
+                  n[19] || (n[19] = t("label", { class: "text-sm font-semibold text-slate-600" }, "Cantidad de elementos:", -1)),
                   R(t("input", {
                     type: "number",
-                    "onUpdate:modelValue": d[2] || (d[2] = (c) => u.value = c),
+                    "onUpdate:modelValue": n[2] || (n[2] = (r) => c.value = r),
                     min: "1",
                     class: "w-32 px-3 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 transition-colors"
                   }, null, 512), [
                     [
-                      Y,
-                      u.value,
+                      K,
+                      c.value,
                       void 0,
                       { number: !0 }
                     ]
                   ])
                 ]),
-                t("div", Wt, [
-                  d[21] || (d[21] = t("label", { class: "text-sm font-semibold text-slate-600" }, "Orientación:", -1)),
+                t("div", Xt, [
+                  n[21] || (n[21] = t("label", { class: "text-sm font-semibold text-slate-600" }, "Orientación:", -1)),
                   R(t("select", {
-                    "onUpdate:modelValue": d[3] || (d[3] = (c) => a.value = c),
+                    "onUpdate:modelValue": n[3] || (n[3] = (r) => a.value = r),
                     class: "w-48 px-3 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-white transition-colors cursor-pointer"
-                  }, [...d[20] || (d[20] = [
+                  }, [...n[20] || (n[20] = [
                     t("option", {
                       value: "horizontal",
                       selected: ""
                     }, "Horizontal", -1),
                     t("option", { value: "vertical" }, "Vertical", -1)
                   ])], 512), [
-                    [J, a.value]
+                    [H, a.value]
                   ])
                 ])
-              ])) : P("", !0)
+              ])) : k("", !0)
             ])
           ]),
-          t("div", Yt, [
-            d[22] || (d[22] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
+          t("div", Zt, [
+            n[22] || (n[22] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
               t("span", { class: "text-xl" }, "🔍"),
-              T(" Orígenes y Filtros ")
+              D(" Orígenes y Filtros ")
             ], -1)),
-            q(Pt, {
-              onSubmit: I,
-              updateFeedCriteria: n,
+            L(It, {
+              onSubmit: M,
+              updateFeedCriteria: i,
               isProduction: e.isProduction
             }, null, 8, ["isProduction"])
           ])
         ]),
-        t("div", Kt, [
-          d[24] || (d[24] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
+        t("div", _t, [
+          n[24] || (n[24] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
             t("span", { class: "text-xl" }, "📰"),
-            T(" Noticias ")
+            D(" Noticias ")
           ], -1)),
-          !g.value || g.value.length === 0 ? (s(), i("div", Qt, [...d[23] || (d[23] = [
+          !b.value || b.value.length === 0 ? (s(), d("div", eo, [...n[23] || (n[23] = [
             t("span", { class: "text-5xl mb-3 opacity-50" }, "📭", -1),
             t("p", { class: "text-sm font-medium" }, "No hay noticias disponibles", -1),
             t("p", { class: "text-xs mt-1 text-slate-300" }, "Selecciona un origen para cargar noticias", -1)
-          ])])) : (s(), i("ul", Xt, [
-            (s(!0), i(B, null, V(g.value, (c, $) => (s(), i("li", {
-              key: $,
+          ])])) : (s(), d("ul", to, [
+            (s(!0), d(B, null, N(b.value, (r, S) => (s(), d("li", {
+              key: S,
               class: "p-4 bg-gradient-to-br from-slate-50 to-white rounded-xl shadow-sm hover:shadow-md cursor-pointer hover:scale-[1.01] transition-all duration-200 border border-slate-200 hover:border-emerald-300",
-              onClick: (j) => r(c)
+              onClick: (F) => u(r)
             }, [
-              t("h4", _t, p(c.title || c.titulo || "Sin título"), 1),
-              t("p", eo, p(c.description || c.descripcion || c.content || "Sin descripción"), 1)
-            ], 8, Zt))), 128))
+              t("h4", no, f(r.title || r.titulo || "Sin título"), 1),
+              t("p", lo, f(r.description || r.descripcion || r.content || "Sin descripción"), 1)
+            ], 8, oo))), 128))
           ]))
         ]),
-        t("div", to, [
-          d[30] || (d[30] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
+        t("div", ao, [
+          n[30] || (n[30] = t("h3", { class: "text-lg font-bold mb-5 text-slate-700 pb-2 flex items-center gap-2 border-b border-slate-100" }, [
             t("span", { class: "text-xl" }, "🔗"),
-            T(" Relacionar Noticia ")
+            D(" Relacionar Noticia ")
           ], -1)),
-          x.value ? (s(), i("div", lo, [
-            (s(!0), i(B, null, V(e.object.fields, (c, $) => (s(), i("div", {
-              key: $,
+          h.value ? (s(), d("div", so, [
+            (s(!0), d(B, null, N(e.object.fields, (r, S) => (s(), d("div", {
+              key: S,
               class: "p-4 bg-gradient-to-br from-slate-50 to-white rounded-xl border border-slate-200"
             }, [
-              t("label", no, [
-                d[26] || (d[26] = t("span", { class: "text-base" }, "⚙️", -1)),
-                T(" " + p(c.name), 1)
+              t("label", io, [
+                n[26] || (n[26] = t("span", { class: "text-base" }, "⚙️", -1)),
+                D(" " + f(r.name), 1)
               ]),
               R(t("select", {
-                "onUpdate:modelValue": (j) => c.mappedTo = j,
+                "onUpdate:modelValue": (F) => r.mappedTo = F,
                 class: "w-full px-3 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 transition-all bg-white cursor-pointer"
               }, [
-                d[27] || (d[27] = t("option", { value: "" }, "-- Seleccionar campo --", -1)),
-                (s(!0), i(B, null, V(x.value, (j, D) => (s(), i("option", {
-                  key: D,
-                  value: D
-                }, p(D), 9, ro))), 128))
-              ], 8, ao), [
-                [J, c.mappedTo]
+                n[27] || (n[27] = t("option", { value: "" }, "-- Seleccionar campo --", -1)),
+                (s(!0), d(B, null, N(h.value, (F, E) => (s(), d("option", {
+                  key: E,
+                  value: E
+                }, f(E), 9, co))), 128))
+              ], 8, uo), [
+                [H, r.mappedTo]
               ]),
-              c.mappedTo ? (s(), i("div", so, [
-                d[28] || (d[28] = t("span", { class: "text-xs font-semibold text-emerald-600 uppercase tracking-wide" }, "Vista previa:", -1)),
-                t("p", io, p(x.value[c.mappedTo]), 1)
-              ])) : P("", !0)
+              r.mappedTo ? (s(), d("div", mo, [
+                n[28] || (n[28] = t("span", { class: "text-xs font-semibold text-emerald-600 uppercase tracking-wide" }, "Vista previa:", -1)),
+                t("p", bo, f(h.value[r.mappedTo]), 1)
+              ])) : k("", !0)
             ]))), 128)),
             t("button", {
               onClick: l,
               class: "cursor-pointer w-full mt-4 px-5 py-3 bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white font-semibold rounded-xl shadow-md hover:shadow-lg transition-all duration-200 transform hover:scale-[1.01] flex items-center justify-center gap-2"
-            }, [...d[29] || (d[29] = [
+            }, [...n[29] || (n[29] = [
               t("span", { class: "text-lg" }, "✓", -1),
               t("span", null, "Alimentar el componente", -1)
             ])])
-          ])) : (s(), i("div", oo, [...d[25] || (d[25] = [
+          ])) : (s(), d("div", ro, [...n[25] || (n[25] = [
             t("span", { class: "text-5xl mb-3 opacity-50" }, "👆", -1),
             t("p", { class: "text-sm font-medium text-center" }, [
-              T("Selecciona una noticia"),
+              D("Selecciona una noticia"),
               t("br"),
-              T("para relacionar")
+              D("para relacionar")
             ], -1)
           ])]))
         ])
       ])
     ]));
   }
-}), co = { class: "absolute -top-2.5 left-3 text-[11px] font-medium tracking-wide bg-gradient-to-r from-slate-700 to-slate-600 text-white px-3 py-0.5 rounded-full shadow-sm" }, mo = { class: "w-full text-right flex justify-between items-center mt-1" }, bo = { class: "flex gap-3 items-center" }, go = { class: "bg-rose-50 border border-rose-200 text-rose-500 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wider rounded-md" }, fo = {
+}), fo = { class: "absolute -top-2.5 left-3 text-[11px] font-medium tracking-wide bg-gradient-to-r from-slate-700 to-slate-600 text-white px-3 py-0.5 rounded-full shadow-sm" }, po = { class: "w-full text-right flex justify-between items-center mt-1" }, vo = { class: "flex gap-3 items-center" }, xo = { class: "bg-rose-50 border border-rose-200 text-rose-500 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wider rounded-md" }, ho = {
   key: 0,
   class: "flex-1 flex justify-center"
-}, po = { class: "flex justify-end items-center gap-3" }, vo = { class: "bg-violet-50 border border-violet-200 text-violet-600 rounded-md px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wider" }, xo = {
+}, wo = { class: "flex justify-end items-center gap-3" }, yo = { class: "bg-violet-50 border border-violet-200 text-violet-600 rounded-md px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wider" }, Co = {
   key: 0,
   class: "flex gap-1 bg-slate-50 rounded-lg p-1"
-}, ho = {
+}, $o = {
   key: 0,
   class: "text-[10px] bg-amber-100 text-amber-700 px-1.5 rounded-full font-medium"
-}, wo = { class: "mt-2 flex items-center" }, yo = { class: "font-medium text-slate-700" }, Co = { key: 0 }, $o = { key: 1 }, ko = {
+}, ko = { class: "mt-2 flex items-center" }, So = { class: "font-medium text-slate-700" }, Fo = { key: 0 }, Po = { key: 1 }, jo = {
   key: 0,
   class: "mt-3 p-3 bg-gradient-to-r from-sky-50 to-blue-50 rounded-lg text-sm text-slate-600 border border-sky-100"
-}, So = { class: "mt-3 flex gap-1.5 flex-wrap" }, Po = { class: "absolute top-0 left-0 w-full h-full opacity-0 group-hover:opacity-100 bg-gradient-to-br from-white/90 via-slate-50/95 to-slate-100/90 backdrop-blur-[2px] z-99 transition-all duration-300 rounded-xl" }, Fo = { class: "flex justify-center h-full items-center p-4 gap-3" }, jo = {
+}, Mo = { class: "mt-3 flex gap-1.5 flex-wrap" }, Io = { class: "absolute top-0 left-0 w-full h-full opacity-0 group-hover:opacity-100 bg-gradient-to-br from-white/90 via-slate-50/95 to-slate-100/90 backdrop-blur-[2px] z-99 transition-all duration-300 rounded-xl" }, Ao = { class: "flex justify-center h-full items-center p-4 gap-3" }, Bo = {
   key: 0,
   title: "Mover componente",
   class: "handle cursor-grab flex items-center bg-white border border-slate-200 px-4 py-2 rounded-xl hover:bg-slate-700 hover:border-slate-700 hover:text-white shadow-sm hover:shadow-md transition-all duration-200 group/btn"
-}, Io = {
+}, Eo = {
   key: 1,
   class: "flex-1 flex justify-center items-center"
-}, Mo = { class: "flex flex-col items-center" }, Ao = {
+}, To = { class: "flex flex-col items-center" }, Do = {
   key: 0,
   class: "text-[10px] mt-0.5 opacity-70"
-}, Bo = ["id"], ce = /* @__PURE__ */ H({
+}, Oo = ["id"], ge = /* @__PURE__ */ W({
   __name: "InitialComponent",
   props: {
     object: {
@@ -1037,91 +1064,91 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     }
   },
   setup(e) {
-    const o = e, g = Math.random().toString(36).substring(2, 15), x = S(!1), f = S(!1), u = S(null), a = S(null), b = S(!1), C = S(!1);
-    ee(() => o.isComponentMode, (d) => {
-      d || I();
-    }), ee(() => o.object, () => {
-      I();
-    }, { deep: !0 }), ee(b, async (d) => {
-      d && (await be(), w());
+    const o = e, b = Math.random().toString(36).substring(2, 15), h = $(!1), g = $(!1), c = $(null), a = $(null), m = $(!1), C = $(!1);
+    oe(() => o.isComponentMode, (n) => {
+      n || M();
+    }), oe(() => o.object, () => {
+      M();
+    }, { deep: !0 }), oe(m, async (n) => {
+      n && (await pe(), v());
     });
-    const I = () => {
-      u.value && clearTimeout(u.value), u.value = setTimeout(() => {
-        w();
+    const M = () => {
+      c.value && clearTimeout(c.value), c.value = setTimeout(() => {
+        v();
       }, 500);
-    }, r = () => {
+    }, u = () => {
       if (o.isComponentMode) return;
-      const d = new IntersectionObserver((c) => {
-        c.forEach(($) => {
-          $.isIntersecting && !b.value && (b.value = !0, d.disconnect());
+      const n = new IntersectionObserver((r) => {
+        r.forEach((S) => {
+          S.isIntersecting && !m.value && (m.value = !0, n.disconnect());
         });
       }, { threshold: 0.1 });
-      a.value && d.observe(a.value);
-    }, l = (d, c) => {
-      const $ = (o.object.fields || []).find((j) => j.name === d);
-      $ && ($.example_value = c);
-    }, n = (d, c) => {
-      d.forEach(($) => {
-        $.value !== void 0 && l($.fieldName, $.value);
-      }), o.object.repeat_data = c;
-    }, m = () => {
-      f.value = !f.value;
-    }, k = () => {
+      a.value && n.observe(a.value);
+    }, l = (n, r) => {
+      const S = (o.object.fields || []).find((F) => F.name === n);
+      S && (S.example_value = r);
+    }, i = (n, r) => {
+      n.forEach((S) => {
+        S.value !== void 0 && l(S.fieldName, S.value);
+      }), o.object.repeat_data = r;
+    }, w = () => {
+      g.value = !g.value;
+    }, I = () => {
       C.value = !C.value;
-    }, A = () => {
-      w(!0).then((d) => {
-        const c = window.open("", "Preview", "width=1200,height=800");
-        if (!c) {
+    }, j = () => {
+      v(!0).then((n) => {
+        const r = window.open("", "Preview", "width=1200,height=800");
+        if (!r) {
           alert("El navegador bloqueó la ventana emergente. Por favor, permite los popups para este sitio.");
           return;
         }
-        c.document.body.innerHTML = d, c.document.querySelectorAll("script").forEach((j) => {
-          var N;
-          const D = c.document.createElement("script");
-          j.src ? D.src = j.src : D.textContent = j.textContent, (N = j.parentNode) == null || N.replaceChild(D, j);
-        }), c.document.close();
+        r.document.body.innerHTML = n, r.document.querySelectorAll("script").forEach((F) => {
+          var U;
+          const E = r.document.createElement("script");
+          F.src ? E.src = F.src : E.textContent = F.textContent, (U = F.parentNode) == null || U.replaceChild(E, F);
+        }), r.document.close();
       });
-    }, w = (d = !1) => {
-      var j;
-      if (!((j = o.object) != null && j.category) || o.object.category === "Repetidor") {
-        const D = '<div style="color:white; padding: 1em 2em;background-color:#001978;border-radius:1em;border:4px solid #711978;">Componente que contiene elementos repetidos: TODO: GENERAR PREVIEW DE REPETIDORES</div>';
-        if (d)
-          return Promise.resolve(D);
-        const N = document.getElementById(g);
-        return N && (N.innerHTML = D), Promise.resolve("");
+    }, v = (n = !1) => {
+      var F;
+      if (!((F = o.object) != null && F.category) || o.object.category === "Repetidor") {
+        const E = '<div style="color:white; padding: 1em 2em;background-color:#001978;border-radius:1em;border:4px solid #711978;">Componente que contiene elementos repetidos: TODO: GENERAR PREVIEW DE REPETIDORES</div>';
+        if (n)
+          return Promise.resolve(E);
+        const U = document.getElementById(b);
+        return U && (U.innerHTML = E), Promise.resolve("");
       }
-      const c = o.renderApiDomain ? o.renderApiDomain + "/api/preview-comp/" : "http://localhost:8003/api/preview-comp/", $ = JSON.stringify({ obj: o.object }, null, 2);
-      return fetch(c, {
+      const r = o.renderApiDomain ? o.renderApiDomain + "/api/preview-comp/" : "http://localhost:8003/api/preview-comp/", S = JSON.stringify({ obj: o.object }, null, 2);
+      return fetch(r, {
         method: "POST",
         headers: { "Content-Type": "application/json" },
-        body: $
-      }).then((D) => D.text()).then((D) => {
-        if (d)
-          return D;
-        const N = document.getElementById(g);
-        return N && (N.innerHTML = D), "";
+        body: S
+      }).then((E) => E.text()).then((E) => {
+        if (n)
+          return E;
+        const U = document.getElementById(b);
+        return U && (U.innerHTML = E), "";
       });
     };
-    return le(() => {
-      r();
-    }), (d, c) => (s(), i("div", null, [
-      C.value ? (s(), ie(uo, {
+    return ae(() => {
+      u();
+    }), (n, r) => (s(), d("div", null, [
+      C.value ? (s(), ue(go, {
         key: 0,
-        updateObjectByFeedContent: n,
-        toggleFeedSection: k,
+        updateObjectByFeedContent: i,
+        toggleFeedSection: I,
         object: e.object,
         isProduction: e.isProduction
-      }, null, 8, ["object", "isProduction"])) : P("", !0),
+      }, null, 8, ["object", "isProduction"])) : k("", !0),
       t("div", {
         ref_key: "rootElement",
         ref: a,
-        class: L(["min-h-[100px] relative group hover:shadow-lg hover:shadow-slate-200/50 duration-300 ease-out js-draggable-element text-slate-600 border border-slate-200 hover:border-slate-300 px-5 pt-3 pb-4 w-full bg-white inline-block rounded-xl flex flex-col mb-3 z-0 shadow-sm", { "overflow-hidden": !e.isComponentMode }])
+        class: G(["min-h-[100px] relative group hover:shadow-lg hover:shadow-slate-200/50 duration-300 ease-out js-draggable-element text-slate-600 border border-slate-200 hover:border-slate-300 px-5 pt-3 pb-4 w-full bg-white inline-block rounded-xl flex flex-col mb-3 z-0 shadow-sm", { "overflow-hidden": !e.isComponentMode }])
       }, [
-        e.isComponentMode ? (s(), i(B, { key: 0 }, [
-          t("span", co, p(e.object.component_name), 1),
-          t("div", mo, [
-            t("div", bo, [
-              c[8] || (c[8] = t("div", { class: "handle cursor-grab text-slate-400 hover:text-slate-600 text-lg transition-colors" }, [
+        e.isComponentMode ? (s(), d(B, { key: 0 }, [
+          t("span", fo, f(e.object.component_name), 1),
+          t("div", po, [
+            t("div", vo, [
+              r[8] || (r[8] = t("div", { class: "handle cursor-grab text-slate-400 hover:text-slate-600 text-lg transition-colors" }, [
                 t("svg", {
                   class: "w-5 h-5",
                   fill: "currentColor",
@@ -1130,72 +1157,73 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
                   t("path", { d: "M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z" })
                 ])
               ], -1)),
-              t("span", go, p(e.object.category), 1)
+              t("span", xo, f(e.object.category), 1)
             ]),
-            e.fullwidthMode ? (s(), i("div", fo, [
+            e.fullwidthMode ? (s(), d("div", ho, [
               t("div", {
                 class: "bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white rounded-lg px-4 py-1.5 text-xs font-medium cursor-pointer shadow-sm hover:shadow transition-all duration-200",
-                onClick: c[0] || (c[0] = ($) => {
-                  var j;
-                  return (j = e.addComponentToColumn) == null ? void 0 : j.call(e, e.object);
+                onClick: r[0] || (r[0] = (S) => {
+                  var F;
+                  return (F = e.addComponentToColumn) == null ? void 0 : F.call(e, e.object);
                 })
               }, "Seleccionar")
-            ])) : P("", !0),
-            t("div", po, [
-              t("span", vo, p(e.object.framework), 1),
-              e.insideComponentBox ? P("", !0) : (s(), i("div", xo, [
+            ])) : k("", !0),
+            t("div", wo, [
+              t("span", yo, f(e.object.framework), 1),
+              e.insideComponentBox ? k("", !0) : (s(), d("div", Co, [
                 t("div", {
                   title: "Previsualizar Dummy",
-                  onClick: c[1] || (c[1] = ($) => A()),
+                  onClick: r[1] || (r[1] = (S) => j()),
                   class: "p-1.5 rounded-md hover:bg-white hover:shadow-sm cursor-pointer transition-all duration-200 text-base"
                 }, "🔍"),
                 t("div", {
                   title: "Editar configuración",
-                  onClick: c[2] || (c[2] = ($) => f.value = !f.value),
+                  onClick: r[2] || (r[2] = (S) => g.value = !g.value),
                   class: "p-1.5 rounded-md hover:bg-white hover:shadow-sm cursor-pointer transition-all duration-200 text-base"
                 }, "⚙️"),
                 t("div", {
                   title: "Beber de contenido",
-                  onClick: k,
+                  onClick: I,
                   class: "p-1.5 rounded-md hover:bg-white hover:shadow-sm cursor-pointer transition-all duration-200 text-base flex items-center gap-1"
                 }, [
-                  c[9] || (c[9] = T("⚡ ", -1)),
-                  e.object.repeat_data ? (s(), i("span", ho, p(e.object.repeat_data.elementCount), 1)) : P("", !0)
+                  r[9] || (r[9] = D("⚡ ", -1)),
+                  e.object.repeat_data ? (s(), d("span", $o, f(e.object.repeat_data.elementCount), 1)) : k("", !0)
                 ]),
-                e.removeComponent ? (s(), i("div", {
+                e.removeComponent ? (s(), d("div", {
                   key: 0,
                   title: "Eliminar componente",
-                  onClick: c[3] || (c[3] = ($) => e.removeComponent(e.object, e.section || "")),
+                  onClick: r[3] || (r[3] = (S) => e.removeComponent(e.object, e.section || "")),
                   class: "p-1.5 rounded-md hover:bg-red-50 hover:shadow-sm cursor-pointer transition-all duration-200 text-base"
-                }, "🗑️")) : P("", !0)
+                }, "🗑️")) : k("", !0)
               ]))
             ])
           ]),
-          q(re, {
-            toggleShowForm: m,
+          L(ie, {
+            toggleShowForm: w,
             object: e.object,
-            showForm: f.value
+            showForm: g.value
           }, null, 8, ["object", "showForm"]),
-          t("div", wo, [
-            t("span", yo, p(e.object.name), 1),
+          t("div", ko, [
+            t("span", So, f(e.object.name), 1),
             t("button", {
-              onClick: c[4] || (c[4] = ($) => x.value = !x.value),
+              type: "button",
+              onClick: r[4] || (r[4] = (S) => h.value = !h.value),
               class: "ms-2 cursor-pointer text-xs text-slate-400 hover:text-slate-600 transition-colors w-5 h-5 rounded-full hover:bg-slate-100 flex items-center justify-center"
             }, [
-              x.value ? (s(), i("span", $o, "▲")) : (s(), i("span", Co, "▼"))
+              h.value ? (s(), d("span", Po, "▲")) : (s(), d("span", Fo, "▼"))
             ])
           ]),
-          x.value ? (s(), i("div", ko, p(e.object.description), 1)) : P("", !0),
-          t("div", So, [
-            (s(!0), i(B, null, V(e.object.tags, ($, j) => (s(), i("span", {
-              key: j,
+          h.value ? (s(), d("div", jo, f(e.object.description), 1)) : k("", !0),
+          t("div", Mo, [
+            (s(!0), d(B, null, N(e.object.tags, (S, F) => (s(), d("span", {
+              key: F,
               class: "bg-slate-50 text-slate-500 px-2.5 py-1 rounded-full text-[11px] font-medium border border-slate-100 hover:border-slate-200 hover:bg-slate-100 transition-colors cursor-default"
-            }, p($), 1))), 128))
+            }, f(S), 1))), 128))
           ])
-        ], 64)) : b.value ? (s(), i(B, { key: 1 }, [
-          t("div", Po, [
-            t("div", Fo, [
-              e.insideComponentBox && !e.fullwidthMode || !e.insideComponentBox ? (s(), i("div", jo, [...c[10] || (c[10] = [
+        ], 64)) : m.value ? (s(), d(B, { key: 1 }, [
+          t("div", Io, [
+            t("div", Ao, [
+              e.insideComponentBox && !e.fullwidthMode || !e.insideComponentBox ? (s(), d("div", Bo, [...r[10] || (r[10] = [
                 t("div", { class: "flex flex-col items-center" }, [
                   t("svg", {
                     class: "w-6 h-6 mb-1 text-slate-400 group-hover/btn:text-white",
@@ -1206,28 +1234,28 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
                   ]),
                   t("span", { class: "text-xs font-medium" }, "Mover")
                 ], -1)
-              ])])) : P("", !0),
-              e.insideComponentBox && e.fullwidthMode ? (s(), i("div", Io, [
+              ])])) : k("", !0),
+              e.insideComponentBox && e.fullwidthMode ? (s(), d("div", Eo, [
                 t("div", {
                   title: "Agregar componente a la columna",
-                  onClick: c[5] || (c[5] = ($) => {
-                    var j;
-                    return (j = e.addComponentToColumn) == null ? void 0 : j.call(e, e.object);
+                  onClick: r[5] || (r[5] = (S) => {
+                    var F;
+                    return (F = e.addComponentToColumn) == null ? void 0 : F.call(e, e.object);
                   }),
                   class: "cursor-pointer flex items-center bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white px-6 py-3 rounded-xl shadow-md hover:shadow-lg transition-all duration-200"
-                }, [...c[11] || (c[11] = [
+                }, [...r[11] || (r[11] = [
                   t("div", { class: "flex flex-col items-center" }, [
                     t("span", { class: "text-2xl mb-1" }, "🚀"),
                     t("span", { class: "text-sm font-medium" }, "Seleccionar")
                   ], -1)
                 ])])
-              ])) : P("", !0),
-              e.insideComponentBox ? P("", !0) : (s(), i(B, { key: 2 }, [
+              ])) : k("", !0),
+              e.insideComponentBox ? k("", !0) : (s(), d(B, { key: 2 }, [
                 t("div", {
                   title: "Configurar componente",
-                  onClick: c[6] || (c[6] = ($) => f.value = !f.value),
+                  onClick: r[6] || (r[6] = (S) => g.value = !g.value),
                   class: "cursor-pointer flex items-center bg-white border border-slate-200 px-4 py-2 rounded-xl hover:bg-slate-700 hover:border-slate-700 hover:text-white shadow-sm hover:shadow-md transition-all duration-200 group/btn"
-                }, [...c[12] || (c[12] = [
+                }, [...r[12] || (r[12] = [
                   t("div", { class: "flex flex-col items-center" }, [
                     t("span", { class: "text-xl mb-1" }, "⚙️"),
                     t("span", { class: "text-xs font-medium" }, "Configurar")
@@ -1235,55 +1263,55 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
                 ])]),
                 t("div", {
                   title: "Configurar componente",
-                  onClick: k,
+                  onClick: I,
                   class: "cursor-pointer flex items-center bg-white border border-slate-200 px-4 py-2 rounded-xl hover:bg-amber-500 hover:border-amber-500 hover:text-white shadow-sm hover:shadow-md transition-all duration-200 group/btn"
                 }, [
-                  t("div", Mo, [
-                    c[13] || (c[13] = t("span", { class: "text-xl mb-1" }, "⚡", -1)),
-                    c[14] || (c[14] = t("span", { class: "text-xs font-medium" }, "Beber de contenido", -1)),
-                    e.object.repeat_data && e.object.repeat_data.dynamicUpdate ? (s(), i("span", Ao, "Carga " + p(e.object.repeat_data.elementCount) + " elementos", 1)) : P("", !0)
+                  t("div", To, [
+                    r[13] || (r[13] = t("span", { class: "text-xl mb-1" }, "⚡", -1)),
+                    r[14] || (r[14] = t("span", { class: "text-xs font-medium" }, "Beber de contenido", -1)),
+                    e.object.repeat_data && e.object.repeat_data.dynamicUpdate ? (s(), d("span", Do, "Carga " + f(e.object.repeat_data.elementCount) + " elementos", 1)) : k("", !0)
                   ])
                 ]),
-                e.removeComponent ? (s(), i("div", {
+                e.removeComponent ? (s(), d("div", {
                   key: 0,
                   title: "Eliminar componente",
-                  onClick: c[7] || (c[7] = ($) => e.removeComponent(e.object, e.section || "")),
+                  onClick: r[7] || (r[7] = (S) => e.removeComponent(e.object, e.section || "")),
                   class: "cursor-pointer flex items-center bg-white border border-slate-200 px-4 py-2 rounded-xl hover:bg-red-500 hover:border-red-500 hover:text-white shadow-sm hover:shadow-md transition-all duration-200 group/btn"
-                }, [...c[15] || (c[15] = [
+                }, [...r[15] || (r[15] = [
                   t("div", { class: "flex flex-col items-center" }, [
                     t("span", { class: "text-xl mb-1" }, "🗑️"),
                     t("span", { class: "text-xs font-medium" }, "Eliminar")
                   ], -1)
-                ])])) : P("", !0)
+                ])])) : k("", !0)
               ], 64))
             ])
           ]),
-          q(re, {
-            toggleShowForm: m,
+          L(ie, {
+            toggleShowForm: w,
             object: e.object,
-            showForm: f.value
+            showForm: g.value
           }, null, 8, ["object", "showForm"]),
           t("div", {
-            id: G(g),
+            id: q(b),
             class: "w-full h-full flex items-center justify-center"
-          }, null, 8, Bo)
-        ], 64)) : P("", !0)
+          }, null, 8, Oo)
+        ], 64)) : k("", !0)
       ], 2)
     ]));
   }
-}), Eo = { class: "absolute top-1 left-2 px-2 flex gap-3 items-center" }, To = {
+}), Ro = { class: "absolute top-1 left-2 px-2 flex gap-3 items-center" }, No = {
   key: 0,
   class: "text-[10px] font-medium text-slate-400 bg-white/80 backdrop-blur-sm px-2 py-0.5 rounded-full shadow-sm"
-}, Do = { class: "text-slate-600" }, Oo = {
+}, Vo = { class: "text-slate-600" }, Uo = {
   key: 1,
   class: "text-[10px] font-medium text-slate-400 bg-white/80 backdrop-blur-sm px-2 py-0.5 rounded-full shadow-sm"
-}, Ro = { class: "text-slate-600" }, No = {
+}, zo = { class: "text-slate-600" }, qo = {
   key: 2,
   class: "text-[10px] font-medium text-slate-400 bg-white/80 backdrop-blur-sm px-2 py-0.5 rounded-full shadow-sm"
-}, Vo = { class: "text-slate-600" }, Uo = {
+}, Lo = { class: "text-slate-600" }, Go = {
   key: 0,
   class: "my-4 w-full rounded-xl bg-white border border-slate-200 p-4 z-10 hidden group-hover:block shadow-lg"
-}, zo = { class: "p-4 bg-gradient-to-br from-slate-50 to-white rounded-lg w-full" }, qo = { class: "flex flex-col" }, Lo = ["for"], Go = ["id"], Jo = ["value"], Ho = { class: "flex flex-col" }, Wo = ["for"], Yo = ["id"], Ko = ["value"], Qo = { class: "flex flex-col" }, Xo = ["for"], Zo = ["id"], _o = ["value"], el = { class: "absolute bottom-0 flex flex-col gap-1 w-full opacity-0 transition-all duration-300 group-hover:opacity-100" }, tl = { class: "flex justify-between gap-2 bg-white/90 backdrop-blur-sm rounded-t-xl px-3 py-1.5 shadow-sm border border-b-0 border-slate-200" }, ol = { class: "flex gap-1" }, ll = /* @__PURE__ */ H({
+}, Jo = { class: "p-4 bg-gradient-to-br from-slate-50 to-white rounded-lg w-full" }, Ho = { class: "flex flex-col" }, Wo = ["for"], Yo = ["id"], Ko = ["value"], Qo = { class: "flex flex-col" }, Xo = ["for"], Zo = ["id"], _o = ["value"], en = { class: "flex flex-col" }, tn = ["for"], on = ["id"], nn = ["value"], ln = { class: "absolute bottom-0 flex flex-col gap-1 w-full opacity-0 transition-all duration-300 group-hover:opacity-100" }, an = { class: "flex justify-between gap-2 bg-white/90 backdrop-blur-sm rounded-t-xl px-3 py-1.5 shadow-sm border border-b-0 border-slate-200" }, rn = { class: "flex gap-1" }, sn = /* @__PURE__ */ W({
   __name: "ColConfig",
   props: {
     globalPageConfiguration: Array,
@@ -1304,7 +1332,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     section: String
   },
   setup(e) {
-    const o = e, g = {
+    const o = e, b = {
       width: [
         { label: "Ancho completo", value: "full" },
         { label: "1/2", value: "1/2" },
@@ -1328,189 +1356,193 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         { label: "Columna (componentes unos encima de otros)", value: "flex-col" },
         { label: "Fila (componentes unos al lado de otros)", value: "flex-row" }
       ]
-    }, x = S(""), f = S(""), u = S(""), a = S(!1), b = K(() => {
-      var l, n, m, k;
-      const I = (l = o.globalPageConfiguration) == null ? void 0 : l.find(
-        (A) => A.section === o.section
-      ), r = (k = (m = (n = I == null ? void 0 : I.rows) == null ? void 0 : n[o.rowIndex]) == null ? void 0 : m.columns) == null ? void 0 : k[o.columnIndex];
-      return (r == null ? void 0 : r.config) || {};
-    }), C = (I, r) => {
-      var k;
-      const l = x.value || g.width[0].value, n = f.value || g.gap[0].value, m = u.value || "";
-      (k = o.updateColConfig) == null || k.call(o, I, r, o.section || "", l, n, m), a.value = !1;
+    }, h = $(""), g = $(""), c = $(""), a = $(!1), m = Q(() => {
+      var l, i, w, I;
+      const M = (l = o.globalPageConfiguration) == null ? void 0 : l.find(
+        (j) => j.section === o.section
+      ), u = (I = (w = (i = M == null ? void 0 : M.rows) == null ? void 0 : i[o.rowIndex]) == null ? void 0 : w.columns) == null ? void 0 : I[o.columnIndex];
+      return (u == null ? void 0 : u.config) || {};
+    }), C = (M, u) => {
+      var I;
+      const l = h.value || b.width[0].value, i = g.value || b.gap[0].value, w = c.value || "";
+      (I = o.updateColConfig) == null || I.call(o, M, u, o.section || "", l, i, w), a.value = !1;
     };
-    return (I, r) => (s(), i(B, null, [
-      t("div", Eo, [
-        b.value.width !== void 0 ? (s(), i("span", To, [
-          r[12] || (r[12] = T(" Ancho: ", -1)),
-          t("span", Do, p(b.value.width), 1)
-        ])) : P("", !0),
-        b.value.gap !== void 0 ? (s(), i("span", Oo, [
-          r[13] || (r[13] = T(" Gap: ", -1)),
-          t("span", Ro, p(b.value.gap), 1)
-        ])) : P("", !0),
-        b.value.flexDirection !== void 0 ? (s(), i("span", No, [
-          r[14] || (r[14] = T(" Flex: ", -1)),
-          t("span", Vo, p(b.value.flexDirection), 1)
-        ])) : P("", !0)
+    return (M, u) => (s(), d(B, null, [
+      t("div", Ro, [
+        m.value.width !== void 0 ? (s(), d("span", No, [
+          u[12] || (u[12] = D(" Ancho: ", -1)),
+          t("span", Vo, f(m.value.width), 1)
+        ])) : k("", !0),
+        m.value.gap !== void 0 ? (s(), d("span", Uo, [
+          u[13] || (u[13] = D(" Gap: ", -1)),
+          t("span", zo, f(m.value.gap), 1)
+        ])) : k("", !0),
+        m.value.flexDirection !== void 0 ? (s(), d("span", qo, [
+          u[14] || (u[14] = D(" Flex: ", -1)),
+          t("span", Lo, f(m.value.flexDirection), 1)
+        ])) : k("", !0)
       ]),
-      a.value ? (s(), i("div", Uo, [
-        t("div", zo, [
+      a.value ? (s(), d("div", Go, [
+        t("div", Jo, [
           t("form", {
-            onSubmit: r[4] || (r[4] = oe(() => {
+            onSubmit: u[4] || (u[4] = le(() => {
             }, ["prevent"])),
             class: "flex gap-5 w-full justify-center items-end flex-wrap"
           }, [
-            t("div", qo, [
+            t("div", Ho, [
               t("label", {
                 for: `colwidth-${e.rowIndex}-${e.columnIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Ancho:", 8, Lo),
+              }, "Ancho:", 8, Wo),
               R(t("select", {
-                "onUpdate:modelValue": r[0] || (r[0] = (l) => x.value = l),
+                "onUpdate:modelValue": u[0] || (u[0] = (l) => h.value = l),
                 id: `colwidth-${e.rowIndex}-${e.columnIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-white hover:border-slate-300 transition-colors"
               }, [
-                r[15] || (r[15] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.width, (l) => (s(), i("option", {
+                u[15] || (u[15] = t("option", { value: "" }, "Selecciona...", -1)),
+                (s(!0), d(B, null, N(b.width, (l) => (s(), d("option", {
                   key: l.value,
                   value: l.value
-                }, p(l.label), 9, Jo))), 128))
-              ], 8, Go), [
-                [J, x.value]
+                }, f(l.label), 9, Ko))), 128))
+              ], 8, Yo), [
+                [H, h.value]
               ])
             ]),
-            t("div", Ho, [
+            t("div", Qo, [
               t("label", {
                 for: `colgap-${e.rowIndex}-${e.columnIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Gap:", 8, Wo),
+              }, "Gap:", 8, Xo),
               R(t("select", {
-                "onUpdate:modelValue": r[1] || (r[1] = (l) => f.value = l),
+                "onUpdate:modelValue": u[1] || (u[1] = (l) => g.value = l),
                 id: `colgap-${e.rowIndex}-${e.columnIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-white hover:border-slate-300 transition-colors"
               }, [
-                r[16] || (r[16] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.gap, (l) => (s(), i("option", {
+                u[16] || (u[16] = t("option", { value: "" }, "Selecciona...", -1)),
+                (s(!0), d(B, null, N(b.gap, (l) => (s(), d("option", {
                   key: l.value,
                   value: l.value
-                }, p(l.label), 9, Ko))), 128))
-              ], 8, Yo), [
-                [J, f.value]
+                }, f(l.label), 9, _o))), 128))
+              ], 8, Zo), [
+                [H, g.value]
               ])
             ]),
-            t("div", Qo, [
+            t("div", en, [
               t("label", {
                 for: `flexdir-${e.rowIndex}-${e.columnIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Dirección:", 8, Xo),
+              }, "Dirección:", 8, tn),
               R(t("select", {
-                "onUpdate:modelValue": r[2] || (r[2] = (l) => u.value = l),
+                "onUpdate:modelValue": u[2] || (u[2] = (l) => c.value = l),
                 id: `flexdir-${e.rowIndex}-${e.columnIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-white hover:border-slate-300 transition-colors"
               }, [
-                r[17] || (r[17] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.flexDirection, (l) => (s(), i("option", {
+                u[17] || (u[17] = t("option", { value: "" }, "Selecciona...", -1)),
+                (s(!0), d(B, null, N(b.flexDirection, (l) => (s(), d("option", {
                   key: l.value,
                   value: l.value
-                }, p(l.label), 9, _o))), 128))
-              ], 8, Zo), [
-                [J, u.value]
+                }, f(l.label), 9, nn))), 128))
+              ], 8, on), [
+                [H, c.value]
               ])
             ]),
             t("button", {
-              type: "submit",
+              type: "button",
               class: "bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white px-5 py-2 rounded-lg font-medium shadow-sm hover:shadow-md transition-all duration-200 cursor-pointer",
-              onClick: r[3] || (r[3] = (l) => {
+              onClick: u[3] || (u[3] = (l) => {
                 C(e.rowIndex, e.columnIndex), a.value = !1;
               })
             }, " Guardar ")
           ], 32)
         ])
-      ])) : P("", !0),
-      t("div", el, [
+      ])) : k("", !0),
+      t("div", ln, [
         t("div", {
-          class: L(["flex flex-row", { "justify-between": e.section && e.section !== "Sidebar", "justify-center": e.section === "Sidebar" }])
+          class: G(["flex flex-row", { "justify-between": e.section && e.section !== "Sidebar", "justify-center": e.section === "Sidebar" }])
         }, [
-          e.section && e.section !== "Sidebar" ? (s(), i("button", {
+          e.section && e.section !== "Sidebar" ? (s(), d("button", {
             key: 0,
+            type: "button",
             title: "Añadir columna a la izquierda",
-            onClick: r[5] || (r[5] = (l) => {
-              var n;
-              return (n = e.addCol) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section, "left");
+            onClick: u[5] || (u[5] = (l) => {
+              var i;
+              return (i = e.addCol) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section, "left");
             }),
             class: "ms-2 bg-white px-3 py-1 cursor-pointer rounded-t-lg border border-b-0 border-slate-200 hover:bg-emerald-500 hover:border-emerald-500 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md font-medium"
-          }, "+")) : P("", !0),
-          t("div", tl, [
+          }, "+")) : k("", !0),
+          t("div", an, [
             t("button", {
+              type: "button",
               title: "Configurar columna",
-              onClick: r[6] || (r[6] = (l) => a.value = !a.value),
-              class: L(["px-2.5 py-1 rounded-lg cursor-pointer transition-all duration-200", a.value ? "bg-amber-100 text-amber-700 shadow-sm" : "bg-slate-100 text-slate-600 hover:bg-amber-500 hover:text-white"])
+              onClick: u[6] || (u[6] = (l) => a.value = !a.value),
+              class: G(["px-2.5 py-1 rounded-lg cursor-pointer transition-all duration-200", a.value ? "bg-amber-100 text-amber-700 shadow-sm" : "bg-slate-100 text-slate-600 hover:bg-amber-500 hover:text-white"])
             }, "⚙️", 2),
-            t("div", ol, [
-              e.section && e.section !== "Sidebar" ? (s(), i("span", {
+            t("div", rn, [
+              e.section && e.section !== "Sidebar" ? (s(), d("span", {
                 key: 0,
                 title: "Mover columna a la izquierda",
-                onClick: r[7] || (r[7] = (l) => {
-                  var n;
-                  return (n = e.moveCol) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section, "left");
+                onClick: u[7] || (u[7] = (l) => {
+                  var i;
+                  return (i = e.moveCol) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section, "left");
                 }),
                 class: "bg-slate-100 px-2.5 py-1 cursor-pointer rounded-lg transition-all duration-200 text-slate-400 hover:bg-blue-500 hover:text-white"
-              }, "◁")) : P("", !0),
-              e.fullwidthMode ? (s(), i("span", {
+              }, "◁")) : k("", !0),
+              e.fullwidthMode ? (s(), d("span", {
                 key: 1,
                 title: "Añadir componente",
-                onClick: r[8] || (r[8] = (l) => {
-                  var n;
-                  return (n = e.addComponentFunction) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section || "");
+                onClick: u[8] || (u[8] = (l) => {
+                  var i;
+                  return (i = e.addComponentFunction) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section || "");
                 }),
                 class: "bg-slate-100 px-2.5 py-1 cursor-pointer rounded-lg transition-all duration-200 text-slate-400 hover:bg-violet-500 hover:text-white"
-              }, " 📦 ")) : P("", !0),
-              e.section && e.section !== "Sidebar" ? (s(), i("span", {
+              }, " 📦 ")) : k("", !0),
+              e.section && e.section !== "Sidebar" ? (s(), d("span", {
                 key: 2,
                 title: "Mover columna a la derecha",
-                onClick: r[9] || (r[9] = (l) => {
-                  var n;
-                  return (n = e.moveCol) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section, "right");
+                onClick: u[9] || (u[9] = (l) => {
+                  var i;
+                  return (i = e.moveCol) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section, "right");
                 }),
                 class: "bg-slate-100 px-2.5 py-1 cursor-pointer rounded-lg transition-all duration-200 text-slate-400 hover:bg-blue-500 hover:text-white"
-              }, "▷ ")) : P("", !0)
+              }, "▷ ")) : k("", !0)
             ]),
             t("button", {
+              type: "button",
               title: "Eliminar columna",
-              onClick: r[10] || (r[10] = (l) => {
-                var n;
-                return (n = e.removeCol) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section || "");
+              onClick: u[10] || (u[10] = (l) => {
+                var i;
+                return (i = e.removeCol) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section || "");
               }),
               class: "bg-slate-100 px-2.5 py-1 rounded-lg cursor-pointer transition-all duration-200 text-slate-600 hover:bg-red-500 hover:text-white"
             }, "🗑️")
           ]),
-          e.section && e.section !== "Sidebar" ? (s(), i("button", {
+          e.section && e.section !== "Sidebar" ? (s(), d("button", {
             key: 1,
+            type: "button",
             title: "Añadir columna a la derecha",
-            onClick: r[11] || (r[11] = (l) => {
-              var n;
-              return (n = e.addCol) == null ? void 0 : n.call(e, e.rowIndex, e.columnIndex, e.section, "right");
+            onClick: u[11] || (u[11] = (l) => {
+              var i;
+              return (i = e.addCol) == null ? void 0 : i.call(e, e.rowIndex, e.columnIndex, e.section, "right");
             }),
             class: "me-2 bg-white px-3 py-1 cursor-pointer rounded-t-lg border border-b-0 border-slate-200 hover:bg-emerald-500 hover:border-emerald-500 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md font-medium"
-          }, "+")) : P("", !0)
+          }, "+")) : k("", !0)
         ], 2)
       ])
     ], 64));
   }
-}), nl = { class: "absolute -top-1 px-2 gap-4 w-full justify-between hidden css-pb-row-config" }, al = { class: "flex gap-1.5" }, rl = { class: "flex gap-4 items-center" }, sl = { class: "inline-block" }, il = {
+}), dn = { class: "absolute -top-1 px-2 gap-4 w-full justify-between hidden css-pb-row-config" }, un = { class: "flex gap-1.5" }, cn = { class: "flex gap-4 items-center" }, mn = { class: "inline-block" }, bn = {
   key: 0,
   class: "text-xs font-medium text-slate-400 bg-slate-50 px-2 py-1 rounded-full"
-}, dl = { class: "text-slate-600" }, ul = {
+}, gn = { class: "text-slate-600" }, fn = {
   key: 1,
   class: "text-xs font-medium text-slate-400 bg-slate-50 px-2 py-1 rounded-full"
-}, cl = { class: "text-slate-600" }, ml = {
+}, pn = { class: "text-slate-600" }, vn = {
   key: 2,
   class: "text-xs font-medium text-slate-400 bg-slate-50 px-2 py-1 rounded-full"
-}, bl = { class: "text-slate-600" }, gl = { class: "flex gap-1.5" }, fl = {
+}, xn = { class: "text-slate-600" }, hn = { class: "flex gap-1.5" }, wn = {
   key: 0,
   class: "z-1"
-}, pl = { class: "p-5 bg-white rounded-xl shadow-lg border border-slate-100 w-full mt-8" }, vl = { class: "flex flex-col" }, xl = ["for"], hl = ["id"], wl = ["value"], yl = { class: "flex flex-col" }, Cl = ["for"], $l = ["id"], kl = ["value"], Sl = { class: "flex flex-col" }, Pl = ["for"], Fl = ["id"], jl = ["value"], Il = /* @__PURE__ */ H({
+}, yn = { class: "p-5 bg-white rounded-xl shadow-lg border border-slate-100 w-full mt-8" }, Cn = { class: "flex flex-col" }, $n = ["for"], kn = ["id"], Sn = ["value"], Fn = { class: "flex flex-col" }, Pn = ["for"], jn = ["id"], Mn = ["value"], In = { class: "flex flex-col" }, An = ["for"], Bn = ["id"], En = ["value"], Tn = /* @__PURE__ */ W({
   __name: "RowConfig",
   props: {
     rowIndex: {
@@ -1525,7 +1557,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     moveRow: Function
   },
   setup(e) {
-    const o = e, g = {
+    const o = e, b = {
       padding: [
         { label: "Ninguno", value: "0" },
         { label: "Leve", value: "4" },
@@ -1551,158 +1583,163 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         { label: "3/5", value: "3/5" },
         { label: "4/5", value: "4/5" }
       ]
-    }, x = S(""), f = S(""), u = S(""), a = S(!1), b = S(!1), C = K(() => {
-      var l, n;
-      const r = (l = o.globalPageConfiguration) == null ? void 0 : l.find(
-        (m) => m.section === o.section
+    }, h = $(""), g = $(""), c = $(""), a = $(!1), m = $(!1), C = Q(() => {
+      var l, i;
+      const u = (l = o.globalPageConfiguration) == null ? void 0 : l.find(
+        (w) => w.section === o.section
       );
-      return (n = r == null ? void 0 : r.rows) != null && n[o.rowIndex] ? r.rows[o.rowIndex].config || {} : {};
-    }), I = (r) => {
-      var k;
-      const l = x.value || g.padding[0].value, n = f.value || g.gap[0].value, m = u.value || g.width[0].value;
-      (k = o.updateRowConfig) == null || k.call(o, r, o.section || "", l, n, m), a.value = !1;
+      return (i = u == null ? void 0 : u.rows) != null && i[o.rowIndex] ? u.rows[o.rowIndex].config || {} : {};
+    }), M = (u) => {
+      var I;
+      const l = h.value || b.padding[0].value, i = g.value || b.gap[0].value, w = c.value || b.width[0].value;
+      (I = o.updateRowConfig) == null || I.call(o, u, o.section || "", l, i, w), a.value = !1;
     };
-    return (r, l) => (s(), i(B, null, [
-      t("div", nl, [
+    return (u, l) => (s(), d(B, null, [
+      t("div", dn, [
         t("div", null, [
-          t("div", al, [
+          t("div", un, [
             t("button", {
+              type: "button",
               title: "Agregar fila",
-              onClick: l[0] || (l[0] = (n) => {
-                var m;
-                (m = e.addRow) == null || m.call(e, e.rowIndex, e.section || ""), b.value = !1;
+              onClick: l[0] || (l[0] = (i) => {
+                var w;
+                (w = e.addRow) == null || w.call(e, e.rowIndex, e.section || ""), m.value = !1;
               }),
               class: "cursor-pointer rounded-b-lg border border-t-0 border-slate-200 bg-white hover:bg-emerald-500 hover:border-emerald-500 px-3 py-1 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md font-medium"
             }, "+"),
             t("button", {
+              type: "button",
               title: "Mover fila hacia arriba",
-              onClick: l[1] || (l[1] = (n) => {
-                var m;
-                (m = e.moveRow) == null || m.call(e, e.rowIndex, e.section || "", "up"), b.value = !1;
+              onClick: l[1] || (l[1] = (i) => {
+                var w;
+                (w = e.moveRow) == null || w.call(e, e.rowIndex, e.section || "", "up"), m.value = !1;
               }),
               class: "cursor-pointer rounded-b-lg border border-t-0 border-slate-200 bg-white hover:bg-blue-500 hover:border-blue-500 px-3 py-1 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md"
             }, "△"),
             t("button", {
+              type: "button",
               title: "Mover fila hacia abajo",
-              onClick: l[2] || (l[2] = (n) => {
-                var m;
-                (m = e.moveRow) == null || m.call(e, e.rowIndex, e.section || "", "down"), b.value = !1;
+              onClick: l[2] || (l[2] = (i) => {
+                var w;
+                (w = e.moveRow) == null || w.call(e, e.rowIndex, e.section || "", "down"), m.value = !1;
               }),
               class: "cursor-pointer rounded-b-lg border border-t-0 border-slate-200 bg-white hover:bg-blue-500 hover:border-blue-500 px-3 py-1 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md"
             }, "▽")
           ])
         ]),
-        t("div", rl, [
-          t("div", sl, [
+        t("div", cn, [
+          t("div", mn, [
             t("button", {
+              type: "button",
               title: "Configurar la fila",
-              onClick: l[3] || (l[3] = (n) => a.value = !a.value),
-              class: L(["cursor-pointer rounded-b-lg border border-t-0 px-3 py-1 transition-all duration-200 shadow-sm hover:shadow-md", a.value ? "bg-amber-100 border-amber-300 text-amber-700" : "bg-white border-slate-200 text-slate-600 hover:bg-amber-500 hover:border-amber-500 hover:text-white"])
+              onClick: l[3] || (l[3] = (i) => a.value = !a.value),
+              class: G(["cursor-pointer rounded-b-lg border border-t-0 px-3 py-1 transition-all duration-200 shadow-sm hover:shadow-md", a.value ? "bg-amber-100 border-amber-300 text-amber-700" : "bg-white border-slate-200 text-slate-600 hover:bg-amber-500 hover:border-amber-500 hover:text-white"])
             }, "⚙️", 2)
           ]),
-          C.value.padding !== void 0 ? (s(), i("span", il, [
-            l[10] || (l[10] = T(" Padding: ", -1)),
-            t("span", dl, p(C.value.padding), 1)
-          ])) : P("", !0),
-          C.value.gap !== void 0 ? (s(), i("span", ul, [
-            l[11] || (l[11] = T(" Gap: ", -1)),
-            t("span", cl, p(C.value.gap), 1)
-          ])) : P("", !0),
-          C.value.width !== void 0 ? (s(), i("span", ml, [
-            l[12] || (l[12] = T(" Ancho: ", -1)),
-            t("span", bl, p(C.value.width), 1)
-          ])) : P("", !0)
+          C.value.padding !== void 0 ? (s(), d("span", bn, [
+            l[10] || (l[10] = D(" Padding: ", -1)),
+            t("span", gn, f(C.value.padding), 1)
+          ])) : k("", !0),
+          C.value.gap !== void 0 ? (s(), d("span", fn, [
+            l[11] || (l[11] = D(" Gap: ", -1)),
+            t("span", pn, f(C.value.gap), 1)
+          ])) : k("", !0),
+          C.value.width !== void 0 ? (s(), d("span", vn, [
+            l[12] || (l[12] = D(" Ancho: ", -1)),
+            t("span", xn, f(C.value.width), 1)
+          ])) : k("", !0)
         ]),
         t("div", null, [
-          t("div", gl, [
+          t("div", hn, [
             t("button", {
+              type: "button",
               title: "Eliminar fila",
-              onClick: l[4] || (l[4] = (n) => {
-                var m;
-                (m = e.removeRow) == null || m.call(e, e.rowIndex, e.section || ""), b.value = !1;
+              onClick: l[4] || (l[4] = (i) => {
+                var w;
+                (w = e.removeRow) == null || w.call(e, e.rowIndex, e.section || ""), m.value = !1;
               }),
               class: "cursor-pointer rounded-b-lg border border-t-0 border-slate-200 bg-white hover:bg-red-500 hover:border-red-500 px-3 py-1 hover:text-white text-slate-600 transition-all duration-200 shadow-sm hover:shadow-md"
             }, "🗑️")
           ])
         ])
       ]),
-      a.value ? (s(), i("div", fl, [
-        t("div", pl, [
+      a.value ? (s(), d("div", wn, [
+        t("div", yn, [
           t("form", {
-            onSubmit: l[9] || (l[9] = oe(() => {
+            onSubmit: l[9] || (l[9] = le(() => {
             }, ["prevent"])),
             class: "flex gap-6 w-full justify-center items-end flex-wrap"
           }, [
-            t("div", vl, [
+            t("div", Cn, [
               t("label", {
                 for: `padding-${e.rowIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Padding:", 8, xl),
+              }, "Padding:", 8, $n),
               R(t("select", {
-                "onUpdate:modelValue": l[5] || (l[5] = (n) => x.value = n),
+                "onUpdate:modelValue": l[5] || (l[5] = (i) => h.value = i),
                 id: `padding-${e.rowIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-slate-50 hover:bg-white transition-colors"
               }, [
                 l[13] || (l[13] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.padding, (n) => (s(), i("option", {
-                  key: n.value,
-                  value: n.value
-                }, p(n.label), 9, wl))), 128))
-              ], 8, hl), [
-                [J, x.value]
+                (s(!0), d(B, null, N(b.padding, (i) => (s(), d("option", {
+                  key: i.value,
+                  value: i.value
+                }, f(i.label), 9, Sn))), 128))
+              ], 8, kn), [
+                [H, h.value]
               ])
             ]),
-            t("div", yl, [
+            t("div", Fn, [
               t("label", {
                 for: `gap-${e.rowIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Gap:", 8, Cl),
+              }, "Gap:", 8, Pn),
               R(t("select", {
-                "onUpdate:modelValue": l[6] || (l[6] = (n) => f.value = n),
+                "onUpdate:modelValue": l[6] || (l[6] = (i) => g.value = i),
                 id: `gap-${e.rowIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-slate-50 hover:bg-white transition-colors"
               }, [
                 l[14] || (l[14] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.gap, (n) => (s(), i("option", {
-                  key: n.value,
-                  value: n.value
-                }, p(n.label), 9, kl))), 128))
-              ], 8, $l), [
-                [J, f.value]
+                (s(!0), d(B, null, N(b.gap, (i) => (s(), d("option", {
+                  key: i.value,
+                  value: i.value
+                }, f(i.label), 9, Mn))), 128))
+              ], 8, jn), [
+                [H, g.value]
               ])
             ]),
-            t("div", Sl, [
+            t("div", In, [
               t("label", {
                 for: `width-${e.rowIndex}`,
                 class: "block text-sm font-medium text-slate-600 mb-1.5"
-              }, "Ancho:", 8, Pl),
+              }, "Ancho:", 8, An),
               R(t("select", {
-                "onUpdate:modelValue": l[7] || (l[7] = (n) => u.value = n),
+                "onUpdate:modelValue": l[7] || (l[7] = (i) => c.value = i),
                 id: `width-${e.rowIndex}`,
                 class: "block w-full border border-slate-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 bg-slate-50 hover:bg-white transition-colors"
               }, [
                 l[15] || (l[15] = t("option", { value: "" }, "Selecciona...", -1)),
-                (s(!0), i(B, null, V(g.width, (n) => (s(), i("option", {
-                  key: n.value,
-                  value: n.value
-                }, p(n.label), 9, jl))), 128))
-              ], 8, Fl), [
-                [J, u.value]
+                (s(!0), d(B, null, N(b.width, (i) => (s(), d("option", {
+                  key: i.value,
+                  value: i.value
+                }, f(i.label), 9, En))), 128))
+              ], 8, Bn), [
+                [H, c.value]
               ])
             ]),
             t("button", {
-              type: "submit",
+              type: "button",
               class: "bg-gradient-to-r from-emerald-500 to-teal-500 hover:from-emerald-600 hover:to-teal-600 text-white px-5 py-2 rounded-lg font-medium shadow-sm hover:shadow-md transition-all duration-200 cursor-pointer",
-              onClick: l[8] || (l[8] = (n) => {
-                I(e.rowIndex), b.value = !1;
+              onClick: l[8] || (l[8] = (i) => {
+                M(e.rowIndex), m.value = !1;
               })
             }, " Guardar ")
           ], 32)
         ])
-      ])) : P("", !0)
+      ])) : k("", !0)
     ], 64));
   }
-}), Ml = ["id"], Al = { class: "flex flex-row w-full gap-3 mt-6" }, Bl = ["id"], El = /* @__PURE__ */ H({
+}), Dn = ["id"], On = { class: "flex flex-row w-full gap-3 mt-6" }, Rn = ["id"], Nn = /* @__PURE__ */ W({
   __name: "BodySection",
   props: {
     isComponentMode: Boolean,
@@ -1726,49 +1763,49 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
     }
   },
   setup(e) {
-    const o = e, g = S(!1), x = K(() => {
-      var u;
-      const f = (u = o.globalPageConfiguration) == null ? void 0 : u.find(
+    const o = e, b = $(!1), h = Q(() => {
+      var c;
+      const g = (c = o.globalPageConfiguration) == null ? void 0 : c.find(
         (a) => a.section === o.sectionSelected
       );
-      return (f == null ? void 0 : f.rows) || [];
+      return (g == null ? void 0 : g.rows) || [];
     });
-    return (f, u) => (s(!0), i(B, null, V(x.value, (a, b) => (s(), i("div", {
-      key: "row-" + b,
-      id: "row-" + e.sectionSelected + "-" + b,
+    return (g, c) => (s(!0), d(B, null, N(h.value, (a, m) => (s(), d("div", {
+      key: "row-" + m,
+      id: "row-" + e.sectionSelected + "-" + m,
       class: "flex flex-col gap-3 w-full p-5 bg-white border border-slate-200 rounded-2xl js-row relative items-center hover:border-slate-300 hover:shadow-lg transition-all duration-300 css-pb-row group/row"
     }, [
-      q(Il, {
+      L(Tn, {
         moveRow: e.moveRow,
         addRow: e.addRow,
         removeRow: e.removeRow,
         globalPageConfiguration: e.globalPageConfiguration,
         updateRowConfig: e.updateRowConfig,
-        rowIndex: b,
+        rowIndex: m,
         section: e.sectionSelected
       }, null, 8, ["moveRow", "addRow", "removeRow", "globalPageConfiguration", "updateRowConfig", "rowIndex", "section"]),
-      t("div", Al, [
-        (s(!0), i(B, null, V(a.columns, (C, I) => (s(), i("div", {
-          class: L([
+      t("div", On, [
+        (s(!0), d(B, null, N(a.columns, (C, M) => (s(), d("div", {
+          class: G([
             "hover:shadow-md overflow-hidden dragging-zone border relative border-slate-200 shadow-sm w-full p-5 pt-10 min-h-[200px] rounded-xl flex flex-col gap-3 items-center before:content-['Columna'] before:absolute before:text-slate-300 before:text-7xl before:font-bold before:bottom-4 before:left-2 before:-rotate-12 before:opacity-30 before:duration-300 before:transition-opacity group hover:before:opacity-50 transition-all duration-300",
-            g.value ? "bg-gradient-to-b from-emerald-50 to-emerald-100 border-emerald-300 shadow-emerald-100" : "bg-gradient-to-b from-slate-50 to-slate-100"
+            b.value ? "bg-gradient-to-b from-emerald-50 to-emerald-100 border-emerald-300 shadow-emerald-100" : "bg-gradient-to-b from-slate-50 to-slate-100"
           ]),
-          key: "column-" + I,
-          id: "col-" + e.sectionSelected + "-" + b + "-" + I
+          key: "column-" + M,
+          id: "col-" + e.sectionSelected + "-" + m + "-" + M
         }, [
-          q(G(ue), {
+          L(q(be), {
             class: "h-full w-full mb-4",
             list: C.components,
             group: { name: "draggingGroup", pull: !0, put: !0 },
             "item-key": "name",
             handle: ".handle",
-            onStart: u[0] || (u[0] = (r) => g.value = !0),
-            onEnd: u[1] || (u[1] = (r) => g.value = !1)
+            onStart: c[0] || (c[0] = (u) => b.value = !0),
+            onEnd: c[1] || (c[1] = (u) => b.value = !1)
           }, {
-            item: de(({ element: r }) => [
-              q(ce, {
+            item: ce(({ element: u }) => [
+              L(ge, {
                 renderApiDomain: e.renderApiDomain,
-                object: r,
+                object: u,
                 "is-component-mode": e.isComponentMode,
                 removeComponent: e.removeComponent,
                 section: e.sectionSelected,
@@ -1777,7 +1814,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
             ]),
             _: 1
           }, 8, ["list"]),
-          q(ll, {
+          L(sn, {
             section: e.sectionSelected,
             globalPageConfiguration: e.globalPageConfiguration,
             updateColConfig: e.updateColConfig,
@@ -1786,17 +1823,17 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
             addCol: e.addCol,
             removeCol: e.removeCol,
             moveCol: e.moveCol,
-            rowIndex: b,
-            columnIndex: I
+            rowIndex: m,
+            columnIndex: M
           }, null, 8, ["section", "globalPageConfiguration", "updateColConfig", "addComponentFunction", "fullwidthMode", "addCol", "removeCol", "moveCol", "rowIndex", "columnIndex"])
-        ], 10, Bl))), 128))
+        ], 10, Rn))), 128))
       ])
-    ], 8, Ml))), 128));
+    ], 8, Dn))), 128));
   }
-}), Tl = { class: "flex justify-between items-center mb-4" }, Dl = { class: "text-xs" }, Ol = { class: "flex flex-wrap gap-2 mb-4 bg-white border border-slate-200 p-4 rounded-xl shadow-sm" }, Rl = ["value", "checked"], Nl = { class: "my-3" }, Vl = { class: "relative" }, Ul = { class: "component-library dragging-zone w-full p-5 min-h-[200px] border border-slate-200 bg-white rounded-xl flex flex-col gap-4 items-center shadow-sm" }, zl = {
+}), Vn = { class: "flex justify-between items-center mb-4" }, Un = { class: "text-xs" }, zn = { class: "flex flex-wrap gap-2 mb-4 bg-white border border-slate-200 p-4 rounded-xl shadow-sm" }, qn = ["value", "checked"], Ln = { class: "my-3" }, Gn = { class: "relative" }, Jn = { class: "component-library dragging-zone w-full p-5 min-h-[200px] border border-slate-200 bg-white rounded-xl flex flex-col gap-4 items-center shadow-sm" }, Hn = {
   key: 0,
   class: "text-center py-8 text-slate-400"
-}, se = /* @__PURE__ */ H({
+}, de = /* @__PURE__ */ W({
   __name: "ComponentsBox",
   props: {
     isComponentMode: Boolean,
@@ -1823,25 +1860,26 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
       "Formulario",
       "Título",
       "SEO"
-    ], g = S(!0), x = S([]), f = S(""), u = S(pe()), a = K(() => {
-      const I = f.value.toLowerCase(), r = Object.values(u.value), l = (n) => (n.name.toLowerCase() + n.description.toLowerCase() + n.tags.join(" ").toLowerCase()).includes(I);
-      return x.value.length > 0 ? r.filter(
-        (n) => x.value.includes(n.category) && l(n)
-      ) : r.filter(l);
-    }), b = (I) => {
-      f.value = I.target.value;
-    }, C = (I) => {
-      const r = I.target, l = r.value;
-      r.checked ? x.value.includes(l) || x.value.push(l) : x.value = x.value.filter((n) => n !== l);
+    ], b = $(!0), h = $([]), g = $(""), c = $(me()), a = Q(() => {
+      const M = g.value.toLowerCase(), u = Object.values(c.value), l = (i) => (i.name.toLowerCase() + i.description.toLowerCase() + i.tags.join(" ").toLowerCase()).includes(M);
+      return h.value.length > 0 ? u.filter(
+        (i) => h.value.includes(i.category) && l(i)
+      ) : u.filter(l);
+    }), m = (M) => {
+      g.value = M.target.value;
+    }, C = (M) => {
+      const u = M.target, l = u.value;
+      u.checked ? h.value.includes(l) || h.value.push(l) : h.value = h.value.filter((i) => i !== l);
     };
-    return (I, r) => (s(), i(B, null, [
-      r[6] || (r[6] = t("h1", { class: "text-center text-2xl font-semibold mb-4 text-slate-700 tracking-tight" }, "Componentes", -1)),
-      t("div", Tl, [
+    return (M, u) => (s(), d(B, null, [
+      u[6] || (u[6] = t("h1", { class: "text-center text-2xl font-semibold mb-4 text-slate-700 tracking-tight" }, "Componentes", -1)),
+      t("div", Vn, [
         t("button", {
-          onClick: r[0] || (r[0] = (l) => g.value = !g.value),
+          type: "button",
+          onClick: u[0] || (u[0] = (l) => b.value = !b.value),
           class: "mb-3 px-4 py-2 bg-white rounded-lg border border-slate-200 hover:border-slate-300 hover:shadow-sm transition-all duration-200 cursor-pointer text-slate-600 font-medium flex items-center gap-2"
         }, [
-          r[2] || (r[2] = t("svg", {
+          u[2] || (u[2] = t("svg", {
             class: "w-4 h-4",
             fill: "none",
             stroke: "currentColor",
@@ -1854,37 +1892,38 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
               d: "M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z"
             })
           ], -1)),
-          r[3] || (r[3] = t("span", null, "Filtros", -1)),
-          t("span", Dl, p(g.value ? "▲" : "▼"), 1)
+          u[3] || (u[3] = t("span", null, "Filtros", -1)),
+          t("span", Un, f(b.value ? "▲" : "▼"), 1)
         ]),
         t("button", {
-          class: L([[e.isComponentMode ? "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md" : "bg-white hover:bg-slate-100"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
-          onClick: r[1] || (r[1] = (l) => {
-            var n;
-            return (n = e.toggleComponentModeFunction) == null ? void 0 : n.call(e);
+          type: "button",
+          class: G([[e.isComponentMode ? "bg-gradient-to-r from-slate-600 to-slate-700 border-slate-700 text-white shadow-md" : "bg-white hover:bg-slate-100"], "cursor-pointer border border-slate-200 rounded-lg py-1.5 px-3 text-sm font-medium transition-all duration-200"]),
+          onClick: u[1] || (u[1] = (l) => {
+            var i;
+            return (i = e.toggleComponentModeFunction) == null ? void 0 : i.call(e);
           })
-        }, p(e.isComponentMode ? "⚒️ Modo Configuración" : "👁️ Modo Visual"), 3)
+        }, f(e.isComponentMode ? "⚒️ Modo Configuración" : "👁️ Modo Visual"), 3)
       ]),
-      R(t("div", Ol, [
-        (s(), i(B, null, V(o, (l) => t("label", {
+      R(t("div", zn, [
+        (s(), d(B, null, N(o, (l) => t("label", {
           key: l,
-          class: L(["flex items-center gap-2 text-xs bg-slate-50 hover:bg-slate-100 px-3 py-2 rounded-lg cursor-pointer transition-colors duration-200 border border-transparent hover:border-slate-200", { "bg-emerald-50 border-emerald-200 text-emerald-700": x.value.includes(l) }])
+          class: G(["flex items-center gap-2 text-xs bg-slate-50 hover:bg-slate-100 px-3 py-2 rounded-lg cursor-pointer transition-colors duration-200 border border-transparent hover:border-slate-200", { "bg-emerald-50 border-emerald-200 text-emerald-700": h.value.includes(l) }])
         }, [
           t("input", {
             type: "checkbox",
             value: l,
-            checked: x.value.includes(l),
+            checked: h.value.includes(l),
             onInput: C,
             class: "w-4 h-4 rounded border-slate-300 text-emerald-500 focus:ring-emerald-500"
-          }, null, 40, Rl),
-          T(" " + p(l), 1)
+          }, null, 40, qn),
+          D(" " + f(l), 1)
         ], 2)), 64))
       ], 512), [
-        [ge, g.value]
+        [ve, b.value]
       ]),
-      t("div", Nl, [
-        t("div", Vl, [
-          r[4] || (r[4] = t("svg", {
+      t("div", Ln, [
+        t("div", Gn, [
+          u[4] || (u[4] = t("svg", {
             class: "absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400",
             fill: "none",
             stroke: "currentColor",
@@ -1898,23 +1937,23 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
             })
           ], -1)),
           t("input", {
-            onInput: b,
+            onInput: m,
             type: "text",
             placeholder: "Buscar componente...",
             class: "duration-300 border border-slate-200 bg-white rounded-xl py-3 px-4 pl-11 w-full focus:outline-none focus:ring-2 focus:ring-emerald-500/20 focus:border-emerald-400 hover:border-slate-300 shadow-sm"
           }, null, 32)
         ])
       ]),
-      t("div", Ul, [
-        q(G(ue), {
+      t("div", Jn, [
+        L(q(be), {
           class: "w-full flex flex-col gap-4",
           list: a.value,
           group: { name: "draggingGroup", pull: "clone", put: !1 },
           itemKey: "name",
           clone: (l) => JSON.parse(JSON.stringify(l))
         }, {
-          item: de(({ element: l }) => [
-            q(ce, {
+          item: ce(({ element: l }) => [
+            L(ge, {
               renderApiDomain: e.renderApiDomain,
               object: l,
               "is-component-mode": e.isComponentMode,
@@ -1927,7 +1966,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
           ]),
           _: 1
         }, 8, ["list", "clone"]),
-        a.value.length === 0 ? (s(), i("div", zl, [...r[5] || (r[5] = [
+        a.value.length === 0 ? (s(), d("div", Hn, [...u[5] || (u[5] = [
           t("svg", {
             class: "w-12 h-12 mx-auto mb-3 opacity-50",
             fill: "none",
@@ -1943,21 +1982,25 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
           ], -1),
           t("p", { class: "text-sm font-medium" }, "No se encontraron componentes", -1),
           t("p", { class: "text-xs mt-1" }, "Intenta con otros filtros o términos de búsqueda", -1)
-        ])])) : P("", !0)
+        ])])) : k("", !0)
       ])
     ], 64));
   }
-}), ql = { class: "flex flex-col w-full transition-all duration-300 lf-page-builder bg-gradient-to-br from-slate-50 to-slate-100 min-h-screen" }, Ll = { class: "relative flex flex-row flex-wrap" }, Gl = { class: "w-full flex justify-end py-4 pe-4" }, Jl = { class: "w-3/4" }, Hl = {
+}), Wn = { class: "flex flex-col w-full transition-all duration-300 lf-page-builder bg-gradient-to-br from-slate-50 to-slate-100 min-h-screen" }, Yn = { class: "relative flex flex-row flex-wrap" }, Kn = { class: "w-full flex justify-end py-4 pe-4" }, Qn = { class: "w-3/4" }, Xn = {
   key: 1,
   class: "w-1/4 px-3 overflow-y-auto h-screen sticky top-0"
-}, Xl = /* @__PURE__ */ H({
+}, ol = /* @__PURE__ */ W({
   __name: "Pagebuilder",
   props: {
     isProduction: { type: Boolean },
+    debugMode: { type: Boolean },
+    submitForm: { type: Boolean },
     inputId: {}
   },
   setup(e) {
-    const o = e, g = o.isProduction ?? !1, x = o.inputId ?? null, f = g ? "https://render-api.lefebvre.es" : "https://led-dev-astro-render-api-dev.eu.els.local", u = S(!0), a = S(void 0), b = S([]), C = S({ rowIndex: null, columnIndex: null, section: null }), I = S(!1), r = S(!1), l = S({
+    const o = e, b = o.isProduction ?? !1, h = o.debugMode ?? !1, g = o.submitForm ?? !1, c = o.inputId ?? null, a = b ? "https://render-api.lefebvre.es" : "https://led-dev-astro-render-api-dev.eu.els.local", m = $(!0), C = $(void 0), M = $([]), u = $({ rowIndex: null, columnIndex: null, section: null }), l = $(!1), i = $(!1);
+    console.log("Render API Domain:", me());
+    const w = $({
       global: {
         sidebarEnabled: !1,
         renderAsBodyPart: !1,
@@ -1970,7 +2013,7 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         description: "",
         robots: "index, follow"
       }
-    }), n = fe([
+    }), I = xe([
       {
         section: "Header",
         config: { width: "full" },
@@ -1992,187 +2035,189 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
         rows: [{ config: {}, columns: [{ config: {}, components: [] }] }]
       }
     ]);
-    le(() => {
-      m();
+    ae(() => {
+      j();
     });
-    const m = () => {
-      if (b.value = ["Header", "Footer", "Body", "Sidebar"], a.value = "Body", x) {
-        const y = document.getElementById(x);
+    const j = () => {
+      if (M.value = ["Header", "Footer", "Body", "Sidebar"], C.value = "Body", c) {
+        const y = document.getElementById(c);
         if (y) {
-          const h = y.value;
-          if (h)
+          const x = y.value;
+          if (x)
             try {
-              const v = typeof h == "string" ? JSON.parse(h) : h;
-              (v && typeof v == "object" && !Array.isArray(v) ? Object.keys(v).length > 0 : Array.isArray(v) ? v.length > 0 : !1) && ae(h);
-            } catch (v) {
-              console.error("Error parsing input value:", v);
+              const p = typeof x == "string" ? JSON.parse(x) : x;
+              (p && typeof p == "object" && !Array.isArray(p) ? Object.keys(p).length > 0 : Array.isArray(p) ? p.length > 0 : !1) && se(x);
+            } catch (p) {
+              console.error("Error parsing input value:", p);
             }
         }
       }
-    }, k = () => {
-      r.value = !r.value;
-    }, A = () => {
-      u.value = !u.value;
-    }, w = (y, h, v, F, M) => {
+    }, v = () => {
+      i.value = !i.value;
+    }, n = () => {
+      m.value = !m.value;
+    }, r = (y, x, p, P, A) => {
       var O;
-      const E = n.find((U) => U.section === h);
-      (O = E == null ? void 0 : E.rows) != null && O[y] && (E.rows[y].config = {
-        padding: v,
-        gap: F,
-        width: M
+      const T = I.find((V) => V.section === x);
+      (O = T == null ? void 0 : T.rows) != null && O[y] && (T.rows[y].config = {
+        padding: p,
+        gap: P,
+        width: A
       });
-    }, d = (y, h, v, F, M, E) => {
-      var U, z, W;
-      const O = n.find((Q) => Q.section === v);
-      (W = (z = (U = O == null ? void 0 : O.rows) == null ? void 0 : U[y]) == null ? void 0 : z.columns) != null && W[h] && (O.rows[y].columns[h].config = {
-        width: F,
-        gap: M,
-        flexDirection: E
+    }, S = (y, x, p, P, A, T) => {
+      var V, z, Y;
+      const O = I.find((Z) => Z.section === p);
+      (Y = (z = (V = O == null ? void 0 : O.rows) == null ? void 0 : V[y]) == null ? void 0 : z.columns) != null && Y[x] && (O.rows[y].columns[x].config = {
+        width: P,
+        gap: A,
+        flexDirection: T
       });
-    }, c = async (y, h) => {
-      const v = n.find((F) => F.section === h);
-      if (v) {
-        const F = {
+    }, F = async (y, x) => {
+      const p = I.find((P) => P.section === x);
+      if (p) {
+        const P = {
           config: {},
           columns: [{ config: {}, components: [] }]
         };
-        y !== null && y >= 0 && y < v.rows.length ? v.rows.splice(y + 1, 0, F) : v.rows.push(F);
+        y !== null && y >= 0 && y < p.rows.length ? p.rows.splice(y + 1, 0, P) : p.rows.push(P);
       }
-      await new Promise((F) => {
+      await new Promise((P) => {
         setTimeout(() => {
-          const M = document.getElementById(`row-${h}-${(y ?? 0) + 1}`);
-          M ? (M.scrollIntoView({ behavior: "smooth", block: "center" }), M.classList.add("selected-delay"), setTimeout(() => {
-            M.classList.remove("selected-delay"), F();
-          }, 3e3)) : F();
+          const A = document.getElementById(`row-${x}-${(y ?? 0) + 1}`);
+          A ? (A.scrollIntoView({ behavior: "smooth", block: "center" }), A.classList.add("selected-delay"), setTimeout(() => {
+            A.classList.remove("selected-delay"), P();
+          }, 3e3)) : P();
         }, 0);
       });
-    }, $ = (y, h) => {
-      const v = n.find((F) => F.section === h);
-      !(v != null && v.rows) || v.rows.length <= 1 || v.rows.splice(y, 1);
-    }, j = (y, h, v = "down") => {
-      var U;
-      const F = n.find((z) => z.section === h);
-      if (!((U = F == null ? void 0 : F.rows) != null && U[y]) || v === "up" && y === 0 || v === "down" && y === F.rows.length - 1)
+    }, E = (y, x) => {
+      const p = I.find((P) => P.section === x);
+      !(p != null && p.rows) || p.rows.length <= 1 || p.rows.splice(y, 1);
+    }, U = (y, x, p = "down") => {
+      var V;
+      const P = I.find((z) => z.section === x);
+      if (!((V = P == null ? void 0 : P.rows) != null && V[y]) || p === "up" && y === 0 || p === "down" && y === P.rows.length - 1)
         return;
-      const M = F.rows, E = M.splice(y, 1)[0], O = v === "down" ? y + 1 : y - 1;
-      M.splice(O, 0, E);
-    }, D = async (y, h, v, F = "right") => {
+      const A = P.rows, T = A.splice(y, 1)[0], O = p === "down" ? y + 1 : y - 1;
+      A.splice(O, 0, T);
+    }, X = async (y, x, p, P = "right") => {
       var O;
-      const M = F === "left" ? h : h + 1, E = n.find((U) => U.section === v);
-      (O = E == null ? void 0 : E.rows) != null && O[y] && E.rows[y].columns.splice(M, 0, {
+      const A = P === "left" ? x : x + 1, T = I.find((V) => V.section === p);
+      (O = T == null ? void 0 : T.rows) != null && O[y] && T.rows[y].columns.splice(A, 0, {
         config: {},
         components: []
-      }), await new Promise((U) => {
+      }), await new Promise((V) => {
         setTimeout(() => {
-          const z = document.getElementById(`col-${v}-${y}-${M}`);
+          const z = document.getElementById(`col-${p}-${y}-${A}`);
           z ? (z.scrollIntoView({ behavior: "smooth", block: "center" }), z.classList.add("selected-delay"), setTimeout(() => {
-            z.classList.remove("selected-delay"), U();
-          }, 3e3)) : U();
+            z.classList.remove("selected-delay"), V();
+          }, 3e3)) : V();
         }, 0);
       });
-    }, N = (y, h, v) => {
-      var E, O;
-      const F = n.find((U) => U.section === v), M = (O = (E = F == null ? void 0 : F.rows) == null ? void 0 : E[y]) == null ? void 0 : O.columns;
-      !M || M.length <= 1 || M.splice(h, 1);
-    }, X = (y, h, v, F = "right") => {
+    }, J = (y, x, p) => {
+      var T, O;
+      const P = I.find((V) => V.section === p), A = (O = (T = P == null ? void 0 : P.rows) == null ? void 0 : T[y]) == null ? void 0 : O.columns;
+      !A || A.length <= 1 || A.splice(x, 1);
+    }, _ = (y, x, p, P = "right") => {
       var z;
-      const M = n.find((W) => W.section === v);
-      if (!((z = M == null ? void 0 : M.rows) != null && z[y]) || F === "left" && h === 0 || F === "right" && h === M.rows[y].columns.length - 1)
+      const A = I.find((Y) => Y.section === p);
+      if (!((z = A == null ? void 0 : A.rows) != null && z[y]) || P === "left" && x === 0 || P === "right" && x === A.rows[y].columns.length - 1)
         return;
-      const E = M.rows[y].columns, O = E.splice(h, 1)[0], U = F === "right" ? h + 1 : h - 1;
-      E.splice(U, 0, O);
-    }, Z = (y, h) => {
-      var F;
-      const v = n.find((M) => M.section === h);
-      (F = v == null ? void 0 : v.rows) == null || F.forEach((M) => {
-        M.columns.forEach((E) => {
-          const O = E.components.indexOf(y);
-          O !== -1 && E.components.splice(O, 1);
+      const T = A.rows[y].columns, O = T.splice(x, 1)[0], V = P === "right" ? x + 1 : x - 1;
+      T.splice(V, 0, O);
+    }, ee = (y, x) => {
+      var P;
+      const p = I.find((A) => A.section === x);
+      (P = p == null ? void 0 : p.rows) == null || P.forEach((A) => {
+        A.columns.forEach((T) => {
+          const O = T.components.indexOf(y);
+          O !== -1 && T.components.splice(O, 1);
         });
       });
-    }, _ = (y, h, v) => {
-      I.value = !0, C.value = { rowIndex: y, columnIndex: h, section: v };
-    }, ne = (y) => {
-      var M, E, O, U;
-      const { rowIndex: h, columnIndex: v, section: F } = C.value;
-      if (h !== null && v !== null) {
-        const z = JSON.parse(JSON.stringify(y)), W = n.find((me) => me.section === F), Q = (U = (O = (E = (M = W == null ? void 0 : W.rows) == null ? void 0 : M[h]) == null ? void 0 : E.columns) == null ? void 0 : O[v]) == null ? void 0 : U.components;
-        Q == null || Q.push(z);
+    }, te = (y, x, p) => {
+      l.value = !0, u.value = { rowIndex: y, columnIndex: x, section: p };
+    }, re = (y) => {
+      var A, T, O, V;
+      const { rowIndex: x, columnIndex: p, section: P } = u.value;
+      if (x !== null && p !== null) {
+        const z = JSON.parse(JSON.stringify(y)), Y = I.find((fe) => fe.section === P), Z = (V = (O = (T = (A = Y == null ? void 0 : Y.rows) == null ? void 0 : A[x]) == null ? void 0 : T.columns) == null ? void 0 : O[p]) == null ? void 0 : V.components;
+        Z == null || Z.push(z);
       }
-      I.value = !1;
-    }, ae = (y) => {
-      const h = typeof y == "string" ? JSON.parse(y) : y;
-      n.length = 0, n.push(...h.pageConfig || []), h.paramsConfig && (l.value = { ...l.value, ...h.paramsConfig });
+      l.value = !1;
+    }, se = (y) => {
+      const x = typeof y == "string" ? JSON.parse(y) : y;
+      I.length = 0, I.push(...x.pageConfig || []), x.paramsConfig && (w.value = { ...w.value, ...x.paramsConfig });
     };
-    return (y, h) => (s(), i("div", ql, [
-      q(lt, {
-        sectionSelected: a.value,
-        "onUpdate:sectionSelected": h[0] || (h[0] = (v) => a.value = v),
-        parametersPageConfiguration: l.value,
-        "onUpdate:parametersPageConfiguration": h[1] || (h[1] = (v) => l.value = v),
-        globalPageConfiguration: n,
-        availableSections: b.value,
-        importConfigurationFunction: ae,
-        isComponentMode: r.value,
-        toggleComponentModeFunction: k,
-        fullwidthMode: u.value,
-        toggleFullwidthMode: A,
-        renderApiDomain: G(f),
-        inputId: G(x)
-      }, null, 8, ["sectionSelected", "parametersPageConfiguration", "globalPageConfiguration", "availableSections", "isComponentMode", "fullwidthMode", "renderApiDomain", "inputId"]),
-      t("div", Ll, [
-        u.value ? (s(), i("div", {
+    return (y, x) => (s(), d("div", Wn, [
+      L(st, {
+        sectionSelected: C.value,
+        "onUpdate:sectionSelected": x[0] || (x[0] = (p) => C.value = p),
+        parametersPageConfiguration: w.value,
+        "onUpdate:parametersPageConfiguration": x[1] || (x[1] = (p) => w.value = p),
+        globalPageConfiguration: I,
+        availableSections: M.value,
+        importConfigurationFunction: se,
+        isComponentMode: i.value,
+        toggleComponentModeFunction: v,
+        fullwidthMode: m.value,
+        toggleFullwidthMode: n,
+        renderApiDomain: q(a),
+        inputId: q(c),
+        debugMode: q(h),
+        submitForm: q(g)
+      }, null, 8, ["sectionSelected", "parametersPageConfiguration", "globalPageConfiguration", "availableSections", "isComponentMode", "fullwidthMode", "renderApiDomain", "inputId", "debugMode", "submitForm"]),
+      t("div", Yn, [
+        m.value ? (s(), d("div", {
           key: 0,
-          class: L(["w-full overflow-y-auto fixed top-0 left-0 h-full bg-gradient-to-br from-slate-100 via-white to-slate-50 z-9999 px-4 flex justify-start flex flex-col items-center backdrop-blur-sm", I.value ? "" : "hidden"])
+          class: G(["w-full overflow-y-auto fixed top-0 left-0 h-full bg-gradient-to-br from-slate-100 via-white to-slate-50 z-9999 px-4 flex justify-start flex flex-col items-center backdrop-blur-sm", l.value ? "" : "hidden"])
         }, [
-          t("div", Gl, [
+          t("div", Kn, [
             t("div", {
               class: "cursor-pointer w-10 h-10 flex items-center justify-center rounded-full bg-white shadow-md hover:shadow-lg hover:bg-red-50 text-slate-400 hover:text-red-500 transition-all duration-200 text-xl font-light",
-              onClick: h[2] || (h[2] = (v) => I.value = !1)
+              onClick: x[2] || (x[2] = (p) => l.value = !1)
             }, "✕")
           ]),
-          t("div", Jl, [
-            q(se, {
-              renderApiDomain: G(f),
-              isComponentMode: r.value,
-              fullwidthMode: u.value,
-              columnToInsert: C.value,
-              addComponentToColumn: ne,
-              toggleComponentModeFunction: k,
-              isProduction: G(g)
+          t("div", Qn, [
+            L(de, {
+              renderApiDomain: q(a),
+              isComponentMode: i.value,
+              fullwidthMode: m.value,
+              columnToInsert: u.value,
+              addComponentToColumn: re,
+              toggleComponentModeFunction: v,
+              isProduction: q(b)
             }, null, 8, ["renderApiDomain", "isComponentMode", "fullwidthMode", "columnToInsert", "isProduction"])
           ])
-        ], 2)) : (s(), i("div", Hl, [
-          q(se, {
-            renderApiDomain: G(f),
-            isComponentMode: r.value,
-            fullwidthMode: u.value,
-            columnToInsert: C.value,
-            addComponentToColumn: ne,
-            toggleComponentModeFunction: k,
-            isProduction: G(g)
+        ], 2)) : (s(), d("div", Xn, [
+          L(de, {
+            renderApiDomain: q(a),
+            isComponentMode: i.value,
+            fullwidthMode: m.value,
+            columnToInsert: u.value,
+            addComponentToColumn: re,
+            toggleComponentModeFunction: v,
+            isProduction: q(b)
           }, null, 8, ["renderApiDomain", "isComponentMode", "fullwidthMode", "columnToInsert", "isProduction"])
         ])),
         t("div", {
-          class: L([u.value ? "w-full px-4" : "w-3/4 ps-3", "flex flex-col gap-5"])
+          class: G([m.value ? "w-full px-4" : "w-3/4 ps-3", "flex flex-col gap-5"])
         }, [
-          q(El, {
-            globalPageConfiguration: n,
-            isComponentMode: r.value,
-            removeComponent: Z,
-            addComponentFunction: _,
-            fullwidthMode: u.value,
-            addCol: D,
-            addRow: c,
-            removeRow: $,
-            removeCol: N,
-            moveCol: X,
-            updateRowConfig: w,
-            updateColConfig: d,
-            moveRow: j,
-            sectionSelected: a.value,
-            renderApiDomain: G(f),
-            isProduction: G(g)
+          L(Nn, {
+            globalPageConfiguration: I,
+            isComponentMode: i.value,
+            removeComponent: ee,
+            addComponentFunction: te,
+            fullwidthMode: m.value,
+            addCol: X,
+            addRow: F,
+            removeRow: E,
+            removeCol: J,
+            moveCol: _,
+            updateRowConfig: r,
+            updateColConfig: S,
+            moveRow: U,
+            sectionSelected: C.value,
+            renderApiDomain: q(a),
+            isProduction: q(b)
           }, null, 8, ["globalPageConfiguration", "isComponentMode", "fullwidthMode", "sectionSelected", "renderApiDomain", "isProduction"])
         ], 2)
       ])
@@ -2180,15 +2225,15 @@ const lt = /* @__PURE__ */ he(xe, [["render", ot]]), nt = {
   }
 });
 export {
-  El as BodySection,
-  ll as ColConfig,
-  se as ComponentsBox,
-  uo as FeedComponent,
-  re as FieldsForm,
-  lt as GlobalConfig,
-  ce as InitialComponent,
-  Xl as Pagebuilder,
-  Il as RowConfig,
-  Pt as SourceFilter,
-  Xl as default
+  Nn as BodySection,
+  sn as ColConfig,
+  de as ComponentsBox,
+  go as FeedComponent,
+  ie as FieldsForm,
+  st as GlobalConfig,
+  ge as InitialComponent,
+  ol as Pagebuilder,
+  Tn as RowConfig,
+  It as SourceFilter,
+  ol as default
 };