@creopse/react 0.0.17 → 0.0.19

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

@@ -6974,6 +6974,7 @@ const useHelper = () => {
   const page = react.usePage();
   const { request } = useApi();
   const { apiBaseUrl, langKey } = useConfig();
+  const config = React.useContext(ConfigContext);
   const currentRoutePath = React.useMemo(() => page.url, [page.url]);
   const resolveUrl = React.useCallback(
     (path) => {
@@ -7017,15 +7018,26 @@ const useHelper = () => {
   const getTranslation = React.useCallback(
     (data, lang2) => {
       let parsedData;
-      if (!lang2) lang2 = localStorage.getItem(langKey) || "en";
+      let userLanguage = (
+        // @ts-expect-error ignore
+        (window.navigator.language || window.navigator.userLanguage)?.split(
+          "-"
+        )[0]
+      );
+      if (props.userData && props.userData.preferences && props.userData.preferences.locale) {
+        userLanguage = props.userData.preferences.locale;
+      }
+      if (!lang2) {
+        lang2 = localStorage.getItem(langKey) || userLanguage || props.appLocale || config?.locale || "en";
+      }
       try {
         parsedData = JSON.parse(data);
       } catch (e) {
         parsedData = {};
       }
-      return parsedData ? parsedData[lang2.toUpperCase()] || parsedData[lang2] || parsedData["en"] || "" : "";
+      return parsedData ? parsedData[lang2.toUpperCase()] || parsedData[lang2] || "" : "";
     },
-    [langKey]
+    [config?.locale, langKey, props.appLocale, props.userData]
   );
   const tr = React.useCallback(
     (data, lang2) => {
@@ -7082,7 +7094,7 @@ const useHelper = () => {
   const languages = React.useMemo(
     () => [
       {
-        label: "French",
+        label: "Français",
         value: "fr",
         flag: "flag:fr-1x1"
       },

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

@@ -6973,6 +6973,7 @@ const useHelper = () => {
   const page = usePage();
   const { request } = useApi();
   const { apiBaseUrl, langKey } = useConfig();
+  const config = useContext(ConfigContext);
   const currentRoutePath = useMemo(() => page.url, [page.url]);
   const resolveUrl = useCallback(
     (path) => {
@@ -7016,15 +7017,26 @@ const useHelper = () => {
   const getTranslation = useCallback(
     (data, lang2) => {
       let parsedData;
-      if (!lang2) lang2 = localStorage.getItem(langKey) || "en";
+      let userLanguage = (
+        // @ts-expect-error ignore
+        (window.navigator.language || window.navigator.userLanguage)?.split(
+          "-"
+        )[0]
+      );
+      if (props.userData && props.userData.preferences && props.userData.preferences.locale) {
+        userLanguage = props.userData.preferences.locale;
+      }
+      if (!lang2) {
+        lang2 = localStorage.getItem(langKey) || userLanguage || props.appLocale || config?.locale || "en";
+      }
       try {
         parsedData = JSON.parse(data);
       } catch (e) {
         parsedData = {};
       }
-      return parsedData ? parsedData[lang2.toUpperCase()] || parsedData[lang2] || parsedData["en"] || "" : "";
+      return parsedData ? parsedData[lang2.toUpperCase()] || parsedData[lang2] || "" : "";
     },
-    [langKey]
+    [config?.locale, langKey, props.appLocale, props.userData]
   );
   const tr = useCallback(
     (data, lang2) => {
@@ -7081,7 +7093,7 @@ const useHelper = () => {
   const languages = useMemo(
     () => [
       {
-        label: "French",
+        label: "Français",
         value: "fr",
         flag: "flag:fr-1x1"
       },

package/dist/hooks/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const content = require("../content-yneKOQn5.cjs");
+const content = require("../content-CGhgyzQQ.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-CfIj9nZq.js";
-import { f, a, u, b } from "../content-CfIj9nZq.js";
+import { e as useApi } from "../content-j9XJsmqN.js";
+import { f, a, u, b } from "../content-j9XJsmqN.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-yneKOQn5.cjs");
+const content = require("./content-CGhgyzQQ.cjs");
 const react = require("@inertiajs/react");
 const reactDom = require("react-dom");
 function _interopNamespaceDefault(e) {
@@ -349,8 +349,8 @@ class PropsManager {
     this.state = { props: initialProps };
     this.listeners = /* @__PURE__ */ new Set();
   }
-  update(payload) {
-    this.state.props = this.deepMerge(this.state.props, payload);
+  update(payload, strategy = "merge") {
+    this.state.props = strategy === "merge" ? this.deepMerge(this.state.props, payload) : this.deepOverride(this.state.props, payload);
     this.notify();
   }
   getState() {
@@ -384,6 +384,20 @@ class PropsManager {
     }
     return output;
   }
+  deepOverride(target, source) {
+    if (!this.isObject(source)) {
+      return source;
+    }
+    const output = { ...source };
+    if (this.isObject(target)) {
+      Object.keys(source).forEach((key) => {
+        if (this.isObject(source[key]) && this.isObject(target[key])) {
+          output[key] = this.deepOverride(target[key], source[key]);
+        }
+      });
+    }
+    return output;
+  }
   isObject(item) {
     return item && typeof item === "object" && !Array.isArray(item);
   }
@@ -8426,7 +8440,7 @@ function CreopseProvider({ children, options }) {
   React.useEffect(() => {
     if (options.router) {
       const handleNavigate = (event) => {
-        manager.update(event.detail.page.props);
+        manager.sync(event.detail.page.props);
       };
       options.router.on("navigate", handleNavigate);
     } else {

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-CfIj9nZq.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-j9XJsmqN.js";
 import { router } from "@inertiajs/react";
 import { createPortal } from "react-dom";
 var jsxRuntime = { exports: {} };
@@ -331,8 +331,8 @@ class PropsManager {
     this.state = { props: initialProps };
     this.listeners = /* @__PURE__ */ new Set();
   }
-  update(payload) {
-    this.state.props = this.deepMerge(this.state.props, payload);
+  update(payload, strategy = "merge") {
+    this.state.props = strategy === "merge" ? this.deepMerge(this.state.props, payload) : this.deepOverride(this.state.props, payload);
     this.notify();
   }
   getState() {
@@ -366,6 +366,20 @@ class PropsManager {
     }
     return output;
   }
+  deepOverride(target, source) {
+    if (!this.isObject(source)) {
+      return source;
+    }
+    const output = { ...source };
+    if (this.isObject(target)) {
+      Object.keys(source).forEach((key) => {
+        if (this.isObject(source[key]) && this.isObject(target[key])) {
+          output[key] = this.deepOverride(target[key], source[key]);
+        }
+      });
+    }
+    return output;
+  }
   isObject(item) {
     return item && typeof item === "object" && !Array.isArray(item);
   }
@@ -8408,7 +8422,7 @@ function CreopseProvider({ children, options }) {
   useEffect(() => {
     if (options.router) {
       const handleNavigate = (event) => {
-        manager.update(event.detail.page.props);
+        manager.sync(event.detail.page.props);
       };
       options.router.on("navigate", handleNavigate);
     } else {

package/package.json

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

package/types/core/props-manager.d.ts

@@ -3,7 +3,7 @@ declare class PropsManager<T extends Props = Props> {
     private state;
     private listeners;
     constructor(initialProps: T);
-    update(payload: T): void;
+    update(payload: T, strategy?: 'merge' | 'override'): void;
     getState(): {
         props: T;
     };
@@ -11,6 +11,7 @@ declare class PropsManager<T extends Props = Props> {
     subscribe(callback: (props: T) => void): () => void;
     private notify;
     private deepMerge;
+    private deepOverride;
     private isObject;
 }
 export default PropsManager;

package/types/hooks/config.d.ts

@@ -16,6 +16,8 @@ export declare const useConfig: () => {
     debug: boolean;
     appUrl: string;
     xApiKey: string;
+    locale: string;
+    fallbackLocale: string;
     encryptionKey: string;
     langKey: string;
 };

package/types/types/plugin.d.ts

@@ -8,6 +8,8 @@ export interface PluginConfig {
     debug: boolean;
     appUrl: string;
     xApiKey: string;
+    locale: string;
+    fallbackLocale: string;
     encryptionKey: string;
     langKey: string;
 }