@creopse/react 0.0.19 → 0.0.21

package/dist/{content-j9XJsmqN.js → content-BrpVuVxT.js}

@@ -2499,6 +2499,18 @@ const {
   getAdapter,
   mergeConfig
 } = axios;
+const api = axios.create({
+  withCredentials: true,
+  xsrfCookieName: "XSRF-TOKEN",
+  xsrfHeaderName: "X-XSRF-TOKEN"
+});
+api.interceptors.request.use((config) => {
+  const token2 = document.cookie.split("; ").find((row) => row.startsWith("XSRF-TOKEN="))?.split("=")[1];
+  if (token2) {
+    config.headers["X-XSRF-TOKEN"] = decodeURIComponent(token2);
+  }
+  return config;
+});
 var MediaFileType;
 (function(MediaFileType2) {
   MediaFileType2[MediaFileType2["DOCUMENT"] = 1] = "DOCUMENT";
@@ -6810,15 +6822,12 @@ const useConfig = () => {
     return {
       ...config,
       apiBaseUrl,
-      apiUrl: `${apiBaseUrl}/api`,
-      apiRequestHeaders: {
-        "X-API-Key": config.xApiKey
-      }
+      apiUrl: `${apiBaseUrl}/api`
     };
   }, [config]);
 };
 const useApi = () => {
-  const { apiUrl, apiRequestHeaders, debug } = useConfig();
+  const { apiUrl, apiBaseUrl, debug } = useConfig();
   const handleError = useCallback(
     (error) => {
       if (debug) {
@@ -6837,32 +6846,29 @@ const useApi = () => {
     [debug]
   );
   const request = useCallback(
-    async (payload, accessToken, accessForbiddenCallback) => {
+    async (payload, accessForbiddenCallback) => {
       let success = false;
       let response = null;
       let error = null;
       try {
-        const headers = { ...apiRequestHeaders };
-        if (accessToken) {
-          headers["Authorization"] = `Bearer ${accessToken}`;
-        }
-        response = await axios.request({
+        response = await api.request({
           method: payload.method || "get",
           params: payload.params || {},
           data: payload.data || {},
           url: payload.url || "/",
-          baseURL: apiUrl,
-          headers
+          baseURL: payload.useApiBaseUrl ? apiBaseUrl : apiUrl,
+          headers: payload.headers,
+          ...payload.responseType && { responseType: payload.responseType }
         });
         success = true;
       } catch (err) {
         error = err;
         success = false;
-        if (err.response && err.response.status === 401) {
+        if (err.response?.status == 401) {
           accessForbiddenCallback?.();
-        } else {
-          handleError(err);
-        }
+        } else if (err.response?.status == 419) {
+          console.error("CSRF token mismatch");
+        } else handleError(err);
       }
       return {
         success,
@@ -6871,9 +6877,9 @@ const useApi = () => {
         error
       };
     },
-    [apiUrl, apiRequestHeaders, handleError]
+    [apiBaseUrl, apiUrl, handleError]
   );
-  const addItem = useCallback(
+  const postItemRequest = useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}`,
@@ -6884,7 +6890,7 @@ const useApi = () => {
     },
     [request]
   );
-  const deleteItem = useCallback(
+  const deleteItemRequest = useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`,
@@ -6894,7 +6900,7 @@ const useApi = () => {
     },
     [request]
   );
-  const updateItem = useCallback(
+  const putItemRequest = useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`,
@@ -6905,7 +6911,7 @@ const useApi = () => {
     },
     [request]
   );
-  const getAllItems = useCallback(
+  const getAllItemsRequest = useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}`
@@ -6914,7 +6920,7 @@ const useApi = () => {
     },
     [request]
   );
-  const getItem = useCallback(
+  const getItemRequest = useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`
@@ -6925,11 +6931,11 @@ const useApi = () => {
   );
   return {
     request,
-    getItem,
-    addItem,
-    updateItem,
-    deleteItem,
-    getAllItems,
+    getItemRequest,
+    postItemRequest,
+    putItemRequest,
+    deleteItemRequest,
+    getAllItemsRequest,
     handleError
   };
 };
@@ -7027,7 +7033,7 @@ const useHelper = () => {
         userLanguage = props.userData.preferences.locale;
       }
       if (!lang2) {
-        lang2 = localStorage.getItem(langKey) || userLanguage || props.appLocale || config?.locale || "en";
+        lang2 = localStorage.getItem(langKey) || props.appLocale || config?.locale || userLanguage || "en";
       }
       try {
         parsedData = JSON.parse(data);

package/dist/{content-CGhgyzQQ.cjs → content-I5YJXH3C.cjs}

@@ -2500,6 +2500,18 @@ const {
   getAdapter,
   mergeConfig
 } = axios;
+const api = axios.create({
+  withCredentials: true,
+  xsrfCookieName: "XSRF-TOKEN",
+  xsrfHeaderName: "X-XSRF-TOKEN"
+});
+api.interceptors.request.use((config) => {
+  const token2 = document.cookie.split("; ").find((row) => row.startsWith("XSRF-TOKEN="))?.split("=")[1];
+  if (token2) {
+    config.headers["X-XSRF-TOKEN"] = decodeURIComponent(token2);
+  }
+  return config;
+});
 var MediaFileType;
 (function(MediaFileType2) {
   MediaFileType2[MediaFileType2["DOCUMENT"] = 1] = "DOCUMENT";
@@ -6811,15 +6823,12 @@ const useConfig = () => {
     return {
       ...config,
       apiBaseUrl,
-      apiUrl: `${apiBaseUrl}/api`,
-      apiRequestHeaders: {
-        "X-API-Key": config.xApiKey
-      }
+      apiUrl: `${apiBaseUrl}/api`
     };
   }, [config]);
 };
 const useApi = () => {
-  const { apiUrl, apiRequestHeaders, debug } = useConfig();
+  const { apiUrl, apiBaseUrl, debug } = useConfig();
   const handleError = React.useCallback(
     (error) => {
       if (debug) {
@@ -6838,32 +6847,29 @@ const useApi = () => {
     [debug]
   );
   const request = React.useCallback(
-    async (payload, accessToken, accessForbiddenCallback) => {
+    async (payload, accessForbiddenCallback) => {
       let success = false;
       let response = null;
       let error = null;
       try {
-        const headers = { ...apiRequestHeaders };
-        if (accessToken) {
-          headers["Authorization"] = `Bearer ${accessToken}`;
-        }
-        response = await axios.request({
+        response = await api.request({
           method: payload.method || "get",
           params: payload.params || {},
           data: payload.data || {},
           url: payload.url || "/",
-          baseURL: apiUrl,
-          headers
+          baseURL: payload.useApiBaseUrl ? apiBaseUrl : apiUrl,
+          headers: payload.headers,
+          ...payload.responseType && { responseType: payload.responseType }
         });
         success = true;
       } catch (err) {
         error = err;
         success = false;
-        if (err.response && err.response.status === 401) {
+        if (err.response?.status == 401) {
           accessForbiddenCallback?.();
-        } else {
-          handleError(err);
-        }
+        } else if (err.response?.status == 419) {
+          console.error("CSRF token mismatch");
+        } else handleError(err);
       }
       return {
         success,
@@ -6872,9 +6878,9 @@ const useApi = () => {
         error
       };
     },
-    [apiUrl, apiRequestHeaders, handleError]
+    [apiBaseUrl, apiUrl, handleError]
   );
-  const addItem = React.useCallback(
+  const postItemRequest = React.useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}`,
@@ -6885,7 +6891,7 @@ const useApi = () => {
     },
     [request]
   );
-  const deleteItem = React.useCallback(
+  const deleteItemRequest = React.useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`,
@@ -6895,7 +6901,7 @@ const useApi = () => {
     },
     [request]
   );
-  const updateItem = React.useCallback(
+  const putItemRequest = React.useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`,
@@ -6906,7 +6912,7 @@ const useApi = () => {
     },
     [request]
   );
-  const getAllItems = React.useCallback(
+  const getAllItemsRequest = React.useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}`
@@ -6915,7 +6921,7 @@ const useApi = () => {
     },
     [request]
   );
-  const getItem = React.useCallback(
+  const getItemRequest = React.useCallback(
     async (payload) => {
       const task = await request({
         url: `/${payload.routeBase}/${payload.id}`
@@ -6926,11 +6932,11 @@ const useApi = () => {
   );
   return {
     request,
-    getItem,
-    addItem,
-    updateItem,
-    deleteItem,
-    getAllItems,
+    getItemRequest,
+    postItemRequest,
+    putItemRequest,
+    deleteItemRequest,
+    getAllItemsRequest,
     handleError
   };
 };
@@ -7028,7 +7034,7 @@ const useHelper = () => {
         userLanguage = props.userData.preferences.locale;
       }
       if (!lang2) {
-        lang2 = localStorage.getItem(langKey) || userLanguage || props.appLocale || config?.locale || "en";
+        lang2 = localStorage.getItem(langKey) || props.appLocale || config?.locale || userLanguage || "en";
       }
       try {
         parsedData = JSON.parse(data);

package/dist/hooks/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const content = require("../content-CGhgyzQQ.cjs");
+const content = require("../content-I5YJXH3C.cjs");
 const React = require("react");
 const useNewsletter = () => {
   const { request } = content.useApi();

package/dist/hooks/index.mjs

@@ -1,5 +1,5 @@
-import { e as useApi } from "../content-j9XJsmqN.js";
-import { f, a, u, b } from "../content-j9XJsmqN.js";
+import { e as useApi } from "../content-BrpVuVxT.js";
+import { f, a, u, b } from "../content-BrpVuVxT.js";
 import { useState, useCallback } from "react";
 const useNewsletter = () => {
   const { request } = useApi();

package/dist/index.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const content = require("./content-CGhgyzQQ.cjs");
+const content = require("./content-I5YJXH3C.cjs");
 const react = require("@inertiajs/react");
 const reactDom = require("react-dom");
 function _interopNamespaceDefault(e) {
@@ -5537,29 +5537,29 @@ function transformPoint(info, transformPagePoint) {
 function subtractPoint(a, b) {
   return { x: a.x - b.x, y: a.y - b.y };
 }
-function getPanInfo({ point }, history) {
+function getPanInfo({ point }, history2) {
   return {
     point,
-    delta: subtractPoint(point, lastDevicePoint(history)),
-    offset: subtractPoint(point, startDevicePoint(history)),
-    velocity: getVelocity(history, 0.1)
+    delta: subtractPoint(point, lastDevicePoint(history2)),
+    offset: subtractPoint(point, startDevicePoint(history2)),
+    velocity: getVelocity(history2, 0.1)
   };
 }
-function startDevicePoint(history) {
-  return history[0];
+function startDevicePoint(history2) {
+  return history2[0];
 }
-function lastDevicePoint(history) {
-  return history[history.length - 1];
+function lastDevicePoint(history2) {
+  return history2[history2.length - 1];
 }
-function getVelocity(history, timeDelta) {
-  if (history.length < 2) {
+function getVelocity(history2, timeDelta) {
+  if (history2.length < 2) {
     return { x: 0, y: 0 };
   }
-  let i = history.length - 1;
+  let i = history2.length - 1;
   let timestampedPoint = null;
-  const lastPoint = lastDevicePoint(history);
+  const lastPoint = lastDevicePoint(history2);
   while (i >= 0) {
-    timestampedPoint = history[i];
+    timestampedPoint = history2[i];
     if (lastPoint.timestamp - timestampedPoint.timestamp > /* @__PURE__ */ secondsToMilliseconds(timeDelta)) {
       break;
     }
@@ -8231,6 +8231,57 @@ const RootContainer$1 = () => {
     return () => clearTimeout(timer);
   }, [page.props.sectionData, sections]);
   React.useEffect(() => {
+    const lockIframeNavigation = () => {
+      document.addEventListener(
+        "click",
+        (e) => {
+          const link = e.target.closest("a");
+          if (link) {
+            e.preventDefault();
+            e.stopPropagation();
+            e.stopImmediatePropagation();
+            console.debug("🚫 Navigation blocked:", link.href);
+            return false;
+          }
+        },
+        true
+      );
+      ["assign", "replace"].forEach((method) => {
+        Object.defineProperty(window.location, method, {
+          value: function() {
+            console.debug(`🚫 location.${method}() blocked`);
+          },
+          writable: false,
+          configurable: false
+        });
+      });
+      const currentHref = window.location.href;
+      Object.defineProperty(window.location, "href", {
+        get: () => currentHref,
+        set: (value) => {
+          console.debug("🚫 location.href = blocked:", value);
+        },
+        configurable: false
+      });
+      window.open = function() {
+        console.debug("🚫 window.open() blocked");
+        return null;
+      };
+      ["pushState", "replaceState"].forEach((method) => {
+        history[method] = function() {
+          console.debug(`🚫 history.${method}() blocked`);
+        };
+      });
+      document.addEventListener(
+        "submit",
+        (e) => {
+          e.preventDefault();
+          console.debug("🚫 Form submission blocked");
+        },
+        true
+      );
+      console.debug("✅ Navigation lock activated");
+    };
     const deselectAllSections = () => {
       Object.keys(sectionsStateRef.current).forEach((key) => {
         sectionsStateRef.current[key].isActive = false;
@@ -8283,6 +8334,7 @@ const RootContainer$1 = () => {
               }
             }
           });
+          lockIframeNavigation();
           break;
         }
         case content.EditorMessageType.DESELECT_ALL_SECTIONS:

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import * as React from "react";
 import React__default, { useState, useEffect, createContext, useRef, useLayoutEffect, useId, useContext, useInsertionEffect, useMemo, useCallback, Children, isValidElement, Fragment, createElement, forwardRef, Component } from "react";
-import { u as useHelper, a as useContent, b as useProps, P as PropsContext, R as ResolveSectionsContext, c as cloneDeep, s as slideToId, E as EditorMessageType, d as RouterContext, C as ConfigContext } from "./content-j9XJsmqN.js";
+import { u as useHelper, a as useContent, b as useProps, P as PropsContext, R as ResolveSectionsContext, c as cloneDeep, s as slideToId, E as EditorMessageType, d as RouterContext, C as ConfigContext } from "./content-BrpVuVxT.js";
 import { router } from "@inertiajs/react";
 import { createPortal } from "react-dom";
 var jsxRuntime = { exports: {} };
@@ -5519,29 +5519,29 @@ function transformPoint(info, transformPagePoint) {
 function subtractPoint(a, b) {
   return { x: a.x - b.x, y: a.y - b.y };
 }
-function getPanInfo({ point }, history) {
+function getPanInfo({ point }, history2) {
   return {
     point,
-    delta: subtractPoint(point, lastDevicePoint(history)),
-    offset: subtractPoint(point, startDevicePoint(history)),
-    velocity: getVelocity(history, 0.1)
+    delta: subtractPoint(point, lastDevicePoint(history2)),
+    offset: subtractPoint(point, startDevicePoint(history2)),
+    velocity: getVelocity(history2, 0.1)
   };
 }
-function startDevicePoint(history) {
-  return history[0];
+function startDevicePoint(history2) {
+  return history2[0];
 }
-function lastDevicePoint(history) {
-  return history[history.length - 1];
+function lastDevicePoint(history2) {
+  return history2[history2.length - 1];
 }
-function getVelocity(history, timeDelta) {
-  if (history.length < 2) {
+function getVelocity(history2, timeDelta) {
+  if (history2.length < 2) {
     return { x: 0, y: 0 };
   }
-  let i = history.length - 1;
+  let i = history2.length - 1;
   let timestampedPoint = null;
-  const lastPoint = lastDevicePoint(history);
+  const lastPoint = lastDevicePoint(history2);
   while (i >= 0) {
-    timestampedPoint = history[i];
+    timestampedPoint = history2[i];
     if (lastPoint.timestamp - timestampedPoint.timestamp > /* @__PURE__ */ secondsToMilliseconds(timeDelta)) {
       break;
     }
@@ -8213,6 +8213,57 @@ const RootContainer$1 = () => {
     return () => clearTimeout(timer);
   }, [page.props.sectionData, sections]);
   useEffect(() => {
+    const lockIframeNavigation = () => {
+      document.addEventListener(
+        "click",
+        (e) => {
+          const link = e.target.closest("a");
+          if (link) {
+            e.preventDefault();
+            e.stopPropagation();
+            e.stopImmediatePropagation();
+            console.debug("🚫 Navigation blocked:", link.href);
+            return false;
+          }
+        },
+        true
+      );
+      ["assign", "replace"].forEach((method) => {
+        Object.defineProperty(window.location, method, {
+          value: function() {
+            console.debug(`🚫 location.${method}() blocked`);
+          },
+          writable: false,
+          configurable: false
+        });
+      });
+      const currentHref = window.location.href;
+      Object.defineProperty(window.location, "href", {
+        get: () => currentHref,
+        set: (value) => {
+          console.debug("🚫 location.href = blocked:", value);
+        },
+        configurable: false
+      });
+      window.open = function() {
+        console.debug("🚫 window.open() blocked");
+        return null;
+      };
+      ["pushState", "replaceState"].forEach((method) => {
+        history[method] = function() {
+          console.debug(`🚫 history.${method}() blocked`);
+        };
+      });
+      document.addEventListener(
+        "submit",
+        (e) => {
+          e.preventDefault();
+          console.debug("🚫 Form submission blocked");
+        },
+        true
+      );
+      console.debug("✅ Navigation lock activated");
+    };
     const deselectAllSections = () => {
       Object.keys(sectionsStateRef.current).forEach((key) => {
         sectionsStateRef.current[key].isActive = false;
@@ -8265,6 +8316,7 @@ const RootContainer$1 = () => {
               }
             }
           });
+          lockIframeNavigation();
           break;
         }
         case EditorMessageType.DESELECT_ALL_SECTIONS:

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@creopse/react",
   "description": "Creopse React Toolkit",
-  "version": "0.0.19",
+  "version": "0.0.21",
   "private": false,
   "author": "Noé Gnanih <noegnanih@gmail.com>",
   "license": "MIT",
@@ -43,7 +43,7 @@
     "react-dom": "^19.1.0"
   },
   "dependencies": {
-    "@creopse/utils": "^0.0.12",
+    "@creopse/utils": "^0.0.13",
     "@vueuse/core": "^14.1.0",
     "axios": "^1.13.2",
     "framer-motion": "^12.23.9",

package/types/core/api.d.ts

@@ -0,0 +1,2 @@
+declare const api: import("axios").AxiosInstance;
+export default api;

package/types/hooks/api.d.ts

@@ -1,23 +1,25 @@
-import type { ApiResponse, Payload } from '@/types/api';
+import type { Payload, Response } from '@/types/api';
+import type { AxiosError } from 'axios';
 /**
- * This hook is used to make API requests.
+ * A hook that provides a way to make API requests.
  *
- * @function useApi
- * @returns {Object} An object containing the following methods:
+ * The hook provides the following methods:
  *  - `request`: Makes an API request with the given payload.
- *  - `addItem`: Adds an item to the API.
- *  - `deleteItem`: Deletes an item from the API.
- *  - `updateItem`: Updates an item in the API.
- *  - `getAllItems`: Gets all items from the API.
- *  - `getItem`: Gets an item from the API.
+ *  - `getItemRequest`: Makes a GET request to the specified API endpoint with the given payload.
+ *  - `postItemRequest`: Makes a POST request to the specified API endpoint with the given payload.
+ *  - `putItemRequest`: Makes a PUT request to the specified API endpoint with the given payload.
+ *  - `deleteItemRequest`: Makes a DELETE request to the specified API endpoint with the given payload.
+ *  - `getAllItemsRequest`: Makes a GET request to the specified API endpoint with the given payload.
  *  - `handleError`: Handles an error from the API.
+ *
+ * @returns {Object} An object containing the methods listed above.
  */
 export declare const useApi: () => {
-    request: (payload: Payload, accessToken?: string, accessForbiddenCallback?: () => void) => Promise<ApiResponse>;
-    getItem: (payload: Payload) => Promise<ApiResponse>;
-    addItem: (payload: Payload) => Promise<ApiResponse>;
-    updateItem: (payload: Payload) => Promise<ApiResponse>;
-    deleteItem: (payload: Payload) => Promise<ApiResponse>;
-    getAllItems: (payload: Payload) => Promise<ApiResponse>;
-    handleError: (error: any) => void;
+    request: <T = any>(payload: Payload, accessForbiddenCallback?: () => void) => Promise<Response<T>>;
+    getItemRequest: <T = any>(payload: Payload) => Promise<Response<T>>;
+    postItemRequest: <T = any>(payload: Payload) => Promise<Response<T>>;
+    putItemRequest: <T = any>(payload: Payload) => Promise<Response<T>>;
+    deleteItemRequest: <T = any>(payload: Payload) => Promise<Response<T>>;
+    getAllItemsRequest: <T = any>(payload: Payload) => Promise<Response<T>>;
+    handleError: (error: AxiosError) => void;
 };

package/types/hooks/config.d.ts

@@ -10,12 +10,8 @@
 export declare const useConfig: () => {
     apiBaseUrl: string;
     apiUrl: string;
-    apiRequestHeaders: {
-        'X-API-Key': string;
-    };
     debug: boolean;
     appUrl: string;
-    xApiKey: string;
     locale: string;
     fallbackLocale: string;
     encryptionKey: string;

package/types/types/api.d.ts

@@ -1,15 +1,22 @@
+import type { ResponseType } from 'axios';
 export type Method = 'get' | 'post' | 'put' | 'delete';
 export interface Payload {
     method?: Method;
     routeBase?: string;
-    params?: object;
-    data?: object;
+    responseType?: ResponseType;
+    params?: Record<string, any>;
+    data?: Record<string, any>;
     url?: string;
     id?: string;
+    headers?: Record<string, string>;
+    useApiBaseUrl?: boolean;
 }
-export interface ApiResponse {
+export interface Response<T> {
     success: boolean;
     failure: boolean;
-    result: any;
-    error: any;
+    result: {
+        [key: string]: any;
+        data?: T;
+    };
+    error?: any;
 }

package/types/types/plugin.d.ts

@@ -7,7 +7,6 @@ export type Props = SharedProps & PageProps & {
 export interface PluginConfig {
     debug: boolean;
     appUrl: string;
-    xApiKey: string;
     locale: string;
     fallbackLocale: string;
     encryptionKey: string;