limbo-component 1.5.2 → 1.6.1

package/dist/limbo.es.js

@@ -32555,15 +32555,65 @@ function useStockServices(prod = false) {
   return { services, loading, error, invalidateCache };
 }
 function TabStock({ prod, disabled, onSelected }) {
+  const lastSearchPayloadRef = React.useRef(null);
   const stockServicesHook = useStockServices(prod);
+  const loadSavedState = (key, defaultValue) => {
+    try {
+      const saved = sessionStorage.getItem(`limbo_stock_${key}`);
+      return saved ? JSON.parse(saved) : defaultValue;
+    } catch {
+      return defaultValue;
+    }
+  };
+  const [selectedService, setSelectedService] = useState(
+    () => loadSavedState("selectedService", "")
+  );
+  const [dynamicForm, setDynamicForm] = useState(
+    () => loadSavedState("dynamicForm", {})
+  );
+  const [stockImages, setStockImages] = useState(
+    () => loadSavedState("stockImages", [])
+  );
+  const [currentPage, setCurrentPage] = useState(
+    () => loadSavedState("currentPage", 1)
+  );
+  const [paginationInfo, setPaginationInfo] = useState(
+    () => loadSavedState("paginationInfo", null)
+  );
   const imageParamsHook = useImageParams(prod);
-  const [selectedService, setSelectedService] = useState("");
-  const [dynamicForm, setDynamicForm] = useState({});
   const [stockLoading, setStockLoading] = useState(false);
   const [stockError, setStockError] = useState(null);
-  const [stockImages, setStockImages] = useState([]);
-  const [currentPage, setCurrentPage] = useState(1);
   const [downloadingId, setDownloadingId] = useState(null);
+  React.useEffect(() => {
+    sessionStorage.setItem(
+      "limbo_stock_selectedService",
+      JSON.stringify(selectedService)
+    );
+  }, [selectedService]);
+  React.useEffect(() => {
+    sessionStorage.setItem(
+      "limbo_stock_dynamicForm",
+      JSON.stringify(dynamicForm)
+    );
+  }, [dynamicForm]);
+  React.useEffect(() => {
+    sessionStorage.setItem(
+      "limbo_stock_stockImages",
+      JSON.stringify(stockImages)
+    );
+  }, [stockImages]);
+  React.useEffect(() => {
+    sessionStorage.setItem(
+      "limbo_stock_currentPage",
+      JSON.stringify(currentPage)
+    );
+  }, [currentPage]);
+  React.useEffect(() => {
+    sessionStorage.setItem(
+      "limbo_stock_paginationInfo",
+      JSON.stringify(paginationInfo)
+    );
+  }, [paginationInfo]);
   const serviceLabels = {
     shutterstock: "Shutterstock",
     freepikstock: "Freepik"
@@ -32608,23 +32658,60 @@ function TabStock({ prod, disabled, onSelected }) {
     setStockError(null);
     if (page === 1) setStockImages([]);
     try {
-      const params = imageParamsHook.params?.[selectedService]?.parameters;
-      const formData = { ...dynamicForm };
-      Object.entries(params || {}).forEach(([key, cfg]) => {
-        if (!(key in formData)) formData[key] = cfg.default ?? "";
-      });
-      formData.service = selectedService;
-      formData.page = page;
-      const data = await searchStockImages(formData, prod);
-      const result = data?.result?.data || [];
-      setStockImages(Array.isArray(result) ? result : []);
-      setCurrentPage(page);
+      let payload;
+      if (page === 1) {
+        const params = imageParamsHook.params?.[selectedService]?.parameters;
+        const formData = { ...dynamicForm };
+        Object.entries(params || {}).forEach(([key, cfg]) => {
+          if (!(key in formData)) formData[key] = cfg.default ?? "";
+        });
+        formData.per_page = parseInt(formData.per_page);
+        formData.service = selectedService;
+        formData.page = page;
+        payload = formData;
+        lastSearchPayloadRef.current = { ...formData };
+      } else {
+        payload = { ...lastSearchPayloadRef.current, page };
+      }
+      const data = await searchStockImages(payload, prod);
+      const result = data?.data?.images || [];
+      let paginationRaw = data?.data?.pagination || null;
+      let pagination = null;
+      if (paginationRaw) {
+        pagination = {
+          total: paginationRaw.total_count ?? paginationRaw.total ?? result.length,
+          per_page: paginationRaw.per_page ?? (Array.isArray(result) ? result.length : 0),
+          current_page: paginationRaw.page ?? paginationRaw.current_page ?? page
+        };
+      }
+      setStockImages(normalizeImages(Array.isArray(result) ? result : []));
+      setPaginationInfo(pagination);
+      setCurrentPage(pagination?.current_page || page);
     } catch (err) {
       setStockError(err.message || "Error al buscar imágenes");
     } finally {
       setStockLoading(false);
     }
   };
+  const normalizeImages = (imagesRaw) => {
+    const seenUrls = /* @__PURE__ */ new Set();
+    const allImages = [];
+    (imagesRaw || []).forEach((img, idx) => {
+      const imageUrl = img.url || img.preview_url || img.full || img.preview;
+      if (!imageUrl || seenUrls.has(imageUrl)) return;
+      seenUrls.add(imageUrl);
+      allImages.push({
+        ...img,
+        preview: img.preview_url || img.preview || img.url || img.full,
+        full: img.url || img.full || img.preview_url,
+        id: img.id || idx,
+        title: img.title || img.filename || `Imagen ${idx + 1}`,
+        source: img.service || selectedService,
+        sourceTitle: serviceLabels?.[selectedService] || selectedService
+      });
+    });
+    return allImages;
+  };
   const handleDynamicFormSubmit = async (e) => {
     e.preventDefault();
     const query = dynamicForm.query || dynamicForm.search || dynamicForm.term || "";
@@ -32670,8 +32757,20 @@ function TabStock({ prod, disabled, onSelected }) {
   const renderDynamicForm = () => {
     const params = imageParamsHook.params?.[selectedService]?.parameters;
     if (!params) return null;
-    const visibleFields = Object.entries(params).filter(([_, config]) => !config.disabled);
+    const visibleFields = Object.entries(params).filter(
+      ([, config]) => !config.disabled
+    );
     const useGridLayout = visibleFields.length > 3;
+    const handleMultiCheckboxChange = (key, value) => {
+      setDynamicForm((prev) => {
+        const arr = Array.isArray(prev[key]) ? prev[key] : [];
+        if (arr.includes(value)) {
+          return { ...prev, [key]: arr.filter((v) => v !== value) };
+        } else {
+          return { ...prev, [key]: [...arr, value] };
+        }
+      });
+    };
     return /* @__PURE__ */ jsxs(
       "form",
       {
@@ -32680,60 +32779,79 @@ function TabStock({ prod, disabled, onSelected }) {
         className: "flex flex-col gap-3 mt-4 border-t-1 pt-4 border-brand-blue-200",
         "aria-label": "Formulario búsqueda de imágenes de Stock",
         children: [
-          /* @__PURE__ */ jsx("div", { className: useGridLayout ? "grid grid-cols-1 md:grid-cols-2 gap-3" : "flex flex-col gap-3", children: visibleFields.map(([key, config]) => {
-            let placeholder = config.placeholder || "";
-            if (!placeholder) {
-              if (config.type === "integer") {
-                placeholder = config.minValue && config.maxValue ? `Entre ${config.minValue} y ${config.maxValue}` : config.minValue ? `Mínimo ${config.minValue}` : config.maxValue ? `Máximo ${config.maxValue}` : "Introduce un número";
-              } else if (key.toLowerCase().includes("query") || key.toLowerCase().includes("search") || key.toLowerCase().includes("term")) {
-                placeholder = "Buscar imágenes...";
-              } else {
-                placeholder = `Introduce ${(config.label || key).toLowerCase()}`;
-              }
-            }
-            return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
-              /* @__PURE__ */ jsxs(
-                "label",
-                {
-                  htmlFor: `stock-${key}`,
-                  className: "text-xs font-medium text-brand-blue-900",
-                  children: [
-                    config.label || key,
-                    config.required && /* @__PURE__ */ jsx("span", { className: "text-red-600 ml-1", children: "*" })
-                  ]
-                }
-              ),
-              config.options ? /* @__PURE__ */ jsx(
-                "select",
-                {
-                  id: `stock-${key}`,
-                  name: key,
-                  value: dynamicForm[key] ?? "",
-                  onChange: handleDynamicFormChange,
-                  className: "limbo-input",
-                  disabled,
-                  title: config.label || key,
-                  children: config.options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt))
-                }
-              ) : /* @__PURE__ */ jsx(
-                "input",
-                {
-                  id: `stock-${key}`,
-                  type: config.type === "integer" ? "number" : "text",
-                  name: key,
-                  value: dynamicForm[key] ?? "",
-                  onChange: handleDynamicFormChange,
-                  className: "limbo-input",
-                  disabled,
-                  required: config.required,
-                  min: config.minValue,
-                  max: config.maxValue,
-                  placeholder,
-                  title: config.label || key
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: useGridLayout ? "grid grid-cols-1 md:grid-cols-2 gap-3" : "flex flex-col gap-3",
+              children: visibleFields.map(([key, config]) => {
+                let placeholder = config.placeholder || "";
+                if (!placeholder) {
+                  if (config.type === "integer") {
+                    placeholder = config.minValue && config.maxValue ? `Entre ${config.minValue} y ${config.maxValue}` : config.minValue ? `Mínimo ${config.minValue}` : config.maxValue ? `Máximo ${config.maxValue}` : "Introduce un número";
+                  } else if (key.toLowerCase().includes("query") || key.toLowerCase().includes("search") || key.toLowerCase().includes("term")) {
+                    placeholder = "Buscar imágenes...";
+                  } else {
+                    placeholder = `Introduce ${(config.label || key).toLowerCase()}`;
+                  }
                 }
-              )
-            ] }, key);
-          }) }),
+                return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+                  /* @__PURE__ */ jsxs(
+                    "label",
+                    {
+                      htmlFor: `stock-${key}`,
+                      className: "text-xs font-medium text-brand-blue-900",
+                      children: [
+                        config.label || key,
+                        config.required && /* @__PURE__ */ jsx("span", { className: "text-red-600 ml-1", children: "*" })
+                      ]
+                    }
+                  ),
+                  config.options && config.multiple ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2 min-h-[50px] px-2 justify-between border-2 border-gray-transparent-500 rounded-lg", children: config.options.map((opt) => /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1", children: [
+                    /* @__PURE__ */ jsx(
+                      "input",
+                      {
+                        type: "checkbox",
+                        name: `stock-${key}`,
+                        value: opt,
+                        checked: Array.isArray(dynamicForm[key]) && dynamicForm[key].includes(opt),
+                        onChange: () => handleMultiCheckboxChange(key, opt),
+                        disabled
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("span", { className: "text-xs", children: opt })
+                  ] }, opt)) }) : config.options ? /* @__PURE__ */ jsx(
+                    "select",
+                    {
+                      id: `stock-${key}`,
+                      name: key,
+                      value: dynamicForm[key] ?? "",
+                      onChange: handleDynamicFormChange,
+                      className: "limbo-input",
+                      disabled,
+                      title: config.label || key,
+                      children: config.options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt))
+                    }
+                  ) : /* @__PURE__ */ jsx(
+                    "input",
+                    {
+                      id: `stock-${key}`,
+                      type: config.type === "integer" ? "number" : "text",
+                      name: key,
+                      value: dynamicForm[key] ?? "",
+                      onChange: handleDynamicFormChange,
+                      className: "limbo-input",
+                      disabled,
+                      required: config.required,
+                      min: config.minValue,
+                      max: config.maxValue,
+                      placeholder,
+                      title: config.label || key
+                    }
+                  )
+                ] }, key);
+              })
+            }
+          ),
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -32778,74 +32896,93 @@ function TabStock({ prod, disabled, onSelected }) {
     selectedService && renderDynamicForm(),
     stockError && /* @__PURE__ */ jsx("div", { className: "alert alert-danger", children: stockError }),
     stockImages.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsxs(
         "div",
         {
-          className: "mt-6 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4",
+          className: "mt-6 grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 relative",
           "aria-live": "polite",
-          children: stockImages.map((img, idx) => /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "border border-brand-blue-200 rounded-lg overflow-hidden bg-white shadow-sm hover:shadow-md transition-shadow",
-              children: [
-                /* @__PURE__ */ jsxs("div", { className: "relative aspect-video bg-neutral-100", children: [
-                  /* @__PURE__ */ jsx(
-                    "img",
+          children: [
+            stockLoading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-white/80 z-10 flex items-center justify-center rounded-lg", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "limbo-loader" }),
+              /* @__PURE__ */ jsx("span", { className: "text-sm text-brand-blue-800", children: "Buscando imágenes..." })
+            ] }) }),
+            stockImages.map((img, idx) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: "border border-brand-blue-200 rounded-lg overflow-hidden bg-white shadow-sm hover:shadow-md transition-shadow",
+                children: [
+                  /* @__PURE__ */ jsxs("div", { className: "relative aspect-video bg-neutral-100", children: [
+                    /* @__PURE__ */ jsx(
+                      "img",
+                      {
+                        src: img.preview || img.thumbnail || img.url,
+                        alt: img.title || `Resultado ${idx + 1}`,
+                        className: "object-cover w-full h-full",
+                        loading: "lazy"
+                      }
+                    ),
+                    img.id && /* @__PURE__ */ jsxs("span", { className: "absolute bottom-1 right-1 bg-black/60 text-white text-xs px-2 py-1 rounded", children: [
+                      "ID: ",
+                      img.id
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsx(
+                    "button",
                     {
-                      src: img.preview || img.thumbnail || img.url,
-                      alt: img.title || `Resultado ${idx + 1}`,
-                      className: "object-cover w-full h-full",
-                      loading: "lazy"
+                      className: `limbo-btn w-full text-sm ${downloadingId === img.id ? "limbo-btn-disabled cursor-not-allowed" : "limbo-btn-primary"}`,
+                      onClick: () => handleImageSelect(img),
+                      disabled: stockLoading || disabled || downloadingId === img.id,
+                      children: downloadingId === img.id ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx("span", { className: "limbo-loader limbo-loader--sm mr-1" }),
+                        "Descargando..."
+                      ] }) : "Seleccionar"
                     }
-                  ),
-                  img.id && /* @__PURE__ */ jsxs("span", { className: "absolute bottom-1 right-1 bg-black/60 text-white text-xs px-2 py-1 rounded", children: [
-                    "ID: ",
-                    img.id
-                  ] })
-                ] }),
-                /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    className: `limbo-btn w-full text-sm ${downloadingId === img.id ? "limbo-btn-disabled cursor-not-allowed" : "limbo-btn-primary"}`,
-                    onClick: () => handleImageSelect(img),
-                    disabled: stockLoading || disabled || downloadingId === img.id,
-                    children: downloadingId === img.id ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                      /* @__PURE__ */ jsx("span", { className: "limbo-loader limbo-loader--sm mr-1" }),
-                      "Descargando..."
-                    ] }) : "Seleccionar"
-                  }
-                ) })
-              ]
-            },
-            img.id || idx
-          ))
+                  ) })
+                ]
+              },
+              img.id || idx
+            ))
+          ]
         }
       ),
-      /* @__PURE__ */ jsxs("div", { className: "mt-6 flex items-center justify-center gap-2", children: [
+      paginationInfo && /* @__PURE__ */ jsxs("div", { className: "mt-6 flex items-center justify-center gap-2", children: [
         /* @__PURE__ */ jsxs(
           "button",
           {
-            onClick: () => handlePageChange(currentPage - 1),
-            disabled: currentPage === 1 || stockLoading,
-            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-50",
+            onClick: () => handlePageChange(paginationInfo.current_page - 1),
+            disabled: paginationInfo.current_page <= 1 || stockLoading,
+            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-25" + (paginationInfo.current_page <= 1 || stockLoading ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
             children: [
               /* @__PURE__ */ jsx("span", { className: "icon icon-arrow-left-white icon--sm" }),
-              " Anterior"
+              " ",
+              "Anterior"
             ]
           }
         ),
         /* @__PURE__ */ jsxs("span", { className: "px-4 py-2 text-sm text-neutral-700", children: [
           "Página ",
-          currentPage
+          paginationInfo.current_page,
+          " de",
+          " ",
+          Math.max(
+            1,
+            Math.ceil(paginationInfo.total / paginationInfo.per_page)
+          ),
+          /* @__PURE__ */ jsxs("span", { className: "text-xs text-neutral-500 block", children: [
+            "(",
+            paginationInfo.total,
+            " imágenes totales)"
+          ] })
         ] }),
         /* @__PURE__ */ jsxs(
           "button",
           {
-            onClick: () => handlePageChange(currentPage + 1),
-            disabled: stockLoading || stockImages.length === 0,
-            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-50",
+            onClick: () => handlePageChange(paginationInfo.current_page + 1),
+            disabled: stockLoading || paginationInfo.current_page >= Math.ceil(paginationInfo.total / paginationInfo.per_page),
+            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-25" + (stockLoading || paginationInfo.current_page >= Math.ceil(paginationInfo.total / paginationInfo.per_page) ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
             children: [
-              "Siguiente ",
+              "Siguiente",
+              " ",
               /* @__PURE__ */ jsx("span", { className: "icon icon-arrow-right-white icon--sm" })
             ]
           }
@@ -32948,6 +33085,7 @@ const ValidatedImage = ({ src, alt, className, onError }) => {
   );
 };
 function TabPortals({ prod, disabled, onSelected }) {
+  const lastSearchPayloadRef = React.useRef(null);
   const portalSourcesHook = usePortalSources(prod);
   const loadSavedState = (key, defaultValue) => {
     try {
@@ -32957,38 +33095,63 @@ function TabPortals({ prod, disabled, onSelected }) {
       return defaultValue;
     }
   };
-  const [selectedPortals, setSelectedPortals] = useState(() => loadSavedState("selectedPortals", []));
-  const [searchName, setSearchName] = useState(() => loadSavedState("searchName", ""));
+  const [selectedPortals, setSelectedPortals] = useState(
+    () => loadSavedState("selectedPortals", [])
+  );
+  const [searchName, setSearchName] = useState(
+    () => loadSavedState("searchName", "")
+  );
   const [limit, setLimit] = useState(() => loadSavedState("limit", 20));
-  const [currentPage, setCurrentPage] = useState(() => loadSavedState("currentPage", 1));
+  const [currentPage, setCurrentPage] = useState(
+    () => loadSavedState("currentPage", 1)
+  );
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
   const [images, setImages] = useState(() => loadSavedState("images", []));
-  const [portalResults, setPortalResults] = useState(() => loadSavedState("portalResults", {}));
-  const [paginationInfo, setPaginationInfo] = useState(() => loadSavedState("paginationInfo", null));
+  const [portalResults, setPortalResults] = useState(
+    () => loadSavedState("portalResults", {})
+  );
+  const [paginationInfo, setPaginationInfo] = useState(
+    () => loadSavedState("paginationInfo", null)
+  );
   const [downloadingUrl, setDownloadingUrl] = useState(null);
   const searchCacheRef = useRef({});
   const [failedImages, setFailedImages] = useState(/* @__PURE__ */ new Set());
   React.useEffect(() => {
-    sessionStorage.setItem("limbo_portals_selectedPortals", JSON.stringify(selectedPortals));
+    sessionStorage.setItem(
+      "limbo_portals_selectedPortals",
+      JSON.stringify(selectedPortals)
+    );
   }, [selectedPortals]);
   React.useEffect(() => {
-    sessionStorage.setItem("limbo_portals_searchName", JSON.stringify(searchName));
+    sessionStorage.setItem(
+      "limbo_portals_searchName",
+      JSON.stringify(searchName)
+    );
   }, [searchName]);
   React.useEffect(() => {
     sessionStorage.setItem("limbo_portals_limit", JSON.stringify(limit));
   }, [limit]);
   React.useEffect(() => {
-    sessionStorage.setItem("limbo_portals_currentPage", JSON.stringify(currentPage));
+    sessionStorage.setItem(
+      "limbo_portals_currentPage",
+      JSON.stringify(currentPage)
+    );
   }, [currentPage]);
   React.useEffect(() => {
     sessionStorage.setItem("limbo_portals_images", JSON.stringify(images));
   }, [images]);
   React.useEffect(() => {
-    sessionStorage.setItem("limbo_portals_portalResults", JSON.stringify(portalResults));
+    sessionStorage.setItem(
+      "limbo_portals_portalResults",
+      JSON.stringify(portalResults)
+    );
   }, [portalResults]);
   React.useEffect(() => {
-    sessionStorage.setItem("limbo_portals_paginationInfo", JSON.stringify(paginationInfo));
+    sessionStorage.setItem(
+      "limbo_portals_paginationInfo",
+      JSON.stringify(paginationInfo)
+    );
   }, [paginationInfo]);
   const getCacheKey = (portals, name, limitVal, page) => {
     return `${portals.sort().join(",")}_${name}_${limitVal}_${page}`;
@@ -33033,14 +33196,19 @@ function TabPortals({ prod, disabled, onSelected }) {
       setPaginationInfo(null);
     }
     try {
-      const params = {
-        sources: selectedPortals,
-        // Ya son strings de IDs
-        limit,
-        page,
-        name: searchName.trim()
-      };
-      const data = await getExternalImages(params, prod);
+      let payload;
+      if (page === 1) {
+        payload = {
+          sources: selectedPortals,
+          limit,
+          page,
+          name: searchName.trim()
+        };
+        lastSearchPayloadRef.current = { ...payload };
+      } else {
+        payload = { ...lastSearchPayloadRef.current, page };
+      }
+      const data = await getExternalImages(payload, prod);
       const sources = data?.data?.sources || {};
       const allImages = [];
       const newPortalResults = {};
@@ -33110,7 +33278,9 @@ function TabPortals({ prod, disabled, onSelected }) {
         throw new Error("No se encontró URL de la imagen");
       }
       const apiBaseUrl = getBaseUrl({ prod });
-      const proxyUrl = `${apiBaseUrl}/api/atenea/proxy?url=${encodeURIComponent(imageUrl)}`;
+      const proxyUrl = `${apiBaseUrl}/api/atenea/proxy?url=${encodeURIComponent(
+        imageUrl
+      )}`;
       const response = await fetch(proxyUrl);
       if (!response.ok) {
         throw new Error(`Error al descargar: ${response.status}`);
@@ -33344,7 +33514,7 @@ function TabPortals({ prod, disabled, onSelected }) {
           {
             onClick: () => handlePageChange(currentPage - 1),
             disabled: currentPage === 1 || loading,
-            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-50" + (currentPage === 1 || loading ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
+            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-25" + (currentPage === 1 || loading ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
             children: [
               /* @__PURE__ */ jsx("span", { className: "icon icon-arrow-left-white icon--sm" }),
               " ",
@@ -33371,7 +33541,7 @@ function TabPortals({ prod, disabled, onSelected }) {
           {
             onClick: () => handlePageChange(currentPage + 1),
             disabled: loading || paginationInfo && currentPage >= paginationInfo.pages,
-            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-50" + (loading || paginationInfo && currentPage >= paginationInfo.pages ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
+            className: "limbo-btn limbo-btn-secondary px-4 py-2 disabled:opacity-25" + (loading || paginationInfo && currentPage >= paginationInfo.pages ? " pointer-events-none cursor-default" : " limbo-btn-primary"),
             children: [
               "Siguiente",
               " ",
@@ -38167,6 +38337,17 @@ function App({
   itemsPerPage = 10
   // Número de elementos por página
 }) {
+  sessionStorage.removeItem("limbo_stock_selectedService");
+  sessionStorage.removeItem("limbo_stock_dynamicForm");
+  sessionStorage.removeItem("limbo_stock_stockImages");
+  sessionStorage.removeItem("limbo_stock_currentPage");
+  sessionStorage.removeItem("limbo_stock_paginationInfo");
+  sessionStorage.removeItem("limbo_portals_searchName");
+  sessionStorage.removeItem("limbo_portals_limit");
+  sessionStorage.removeItem("limbo_portals_currentPage");
+  sessionStorage.removeItem("limbo_portals_images");
+  sessionStorage.removeItem("limbo_portals_portalResults");
+  sessionStorage.removeItem("limbo_portals_paginationInfo");
   const getFilteredFeatures = () => {
     switch (modeUI) {
       case "gallery-only":
@@ -38193,10 +38374,7 @@ function App({
   const [activeTab, setActiveTab] = useState(getInitialTab());
   const [selectedImage, setSelectedImage] = useState(null);
   const [currentPage, setCurrentPage] = useState(1);
-  const {
-    isTokenExpired,
-    handleTokenExpiredClose
-  } = useTokenExpiration();
+  const { isTokenExpired, handleTokenExpiredClose } = useTokenExpiration();
   const handlePageChange = (newPage) => {
     setCurrentPage(newPage);
   };
@@ -38240,7 +38418,9 @@ function App({
       feature: "cropper"
     }
   ];
-  const tabs = availableTabs.filter((tab) => activeFeatures.includes(tab.feature));
+  const tabs = availableTabs.filter(
+    (tab) => activeFeatures.includes(tab.feature)
+  );
   const handleUpload = async (file) => {
     const result = await upload(file);
     if (result) {
@@ -41705,9 +41885,7 @@ if (typeof window !== "undefined" && document.querySelector("#root")) {
   Limbo.configure({
     prod: false,
     publicKey: PUBLIC_KEY,
-    authMode: "session",
-    tokenEndpoint: "/auth/token"
-    // Endpoint que acepta solo public_key
+    authMode: "session"
   });
   Limbo.create({
     container: "#root",