kelt-ui-kit-react 2.0.8 → 2.0.9

package/src/_core/hooks/HistoryProvider.tsx

@@ -1,25 +1,25 @@
-import { createContext, useContext, useEffect, useRef, useState } from "react";
-import { useLocation } from "react-router-dom";
-
-const HistoryDepthContext = createContext<number>(1);
-
-export function HistoryProvider({ children }: { children: React.ReactNode }) {
-  const location = useLocation();
-  const depthRef = useRef(1);
-  const [depth, setDepth] = useState(1);
-
-  useEffect(() => {
-    depthRef.current += 1;
-    setDepth(depthRef.current);
-  }, [location]);
-
-  return (
-    <HistoryDepthContext.Provider value={depth}>
-      {children}
-    </HistoryDepthContext.Provider>
-  );
-}
-
-export function useHistoryDepth() {
-  return useContext(HistoryDepthContext);
-}
+import { createContext, useContext, useEffect, useRef, useState } from "react";
+import { useLocation } from "react-router-dom";
+
+const HistoryDepthContext = createContext<number>(1);
+
+export function HistoryProvider({ children }: { children: React.ReactNode }) {
+  const location = useLocation();
+  const depthRef = useRef(1);
+  const [depth, setDepth] = useState(1);
+
+  useEffect(() => {
+    depthRef.current += 1;
+    setDepth(depthRef.current);
+  }, [location]);
+
+  return (
+    <HistoryDepthContext.Provider value={depth}>
+      {children}
+    </HistoryDepthContext.Provider>
+  );
+}
+
+export function useHistoryDepth() {
+  return useContext(HistoryDepthContext);
+}

package/src/_core/hooks/ImageChecker.tsx

@@ -1,26 +1,26 @@
-import React, { useEffect, useState } from "react";
-
-interface ImageCheckerProps {
-  imageUrl: string;
-}
-
-export const ImageChecker: React.FC<ImageCheckerProps> = ({ imageUrl }) => {
-  const [imageExists, setImageExists] = useState<boolean | null>(null);
-  const testImg = async (path: string) => {
-    try {
-      const response = await fetch(path, { method: "HEAD" });
-      console.log(response);
-      return response.ok;
-    } catch {
-      return false;
-    }
-  };
-  useEffect(() => {
-    testImg(imageUrl).then((res) => setImageExists(res));
-  }, [imageUrl]);
-
-  if (imageExists === null) return <p>Vérification en cours...</p>;
-  if (!imageExists) return <p>L'image n'existe pas.</p>;
-
-  return <img src={imageUrl} alt="Vérifiée" />;
-};
+import React, { useEffect, useState } from "react";
+
+interface ImageCheckerProps {
+  imageUrl: string;
+}
+
+export const ImageChecker: React.FC<ImageCheckerProps> = ({ imageUrl }) => {
+  const [imageExists, setImageExists] = useState<boolean | null>(null);
+  const testImg = async (path: string) => {
+    try {
+      const response = await fetch(path, { method: "HEAD" });
+      console.log(response);
+      return response.ok;
+    } catch {
+      return false;
+    }
+  };
+  useEffect(() => {
+    testImg(imageUrl).then((res) => setImageExists(res));
+  }, [imageUrl]);
+
+  if (imageExists === null) return <p>Vérification en cours...</p>;
+  if (!imageExists) return <p>L'image n'existe pas.</p>;
+
+  return <img src={imageUrl} alt="Vérifiée" />;
+};

package/src/_core/hooks/imageExist.tsx

@@ -1,9 +1,9 @@
-import React from "react";
-
-interface ImageCheckerProps {
-  imageUrl: string;
-}
-
-export const ImageExist: React.FC<ImageCheckerProps> = ({ imageUrl }) => {
-  return <img src={imageUrl} alt="" />;
-};
+import React from "react";
+
+interface ImageCheckerProps {
+  imageUrl: string;
+}
+
+export const ImageExist: React.FC<ImageCheckerProps> = ({ imageUrl }) => {
+  return <img src={imageUrl} alt="" />;
+};

package/src/_core/hooks/isEAN13.tsx

@@ -1,16 +1,16 @@
-export const isValidEAN13 = (value: string): boolean => {
-  if (!/^\d{13}$/.test(value)) return false; // Vérifie que c'est bien 13 chiffres
-
-  // Calcul de la clé de contrôle (checksum)
-  const digits = value.split("").map(Number);
-  const checkDigit = digits.pop(); // Dernier chiffre (clé de contrôle)
-
-  const sum = digits.reduce(
-    (acc, digit, index) => acc + digit * (index % 2 === 0 ? 1 : 3),
-    0
-  );
-
-  const computedCheckDigit = (10 - (sum % 10)) % 10;
-
-  return checkDigit === computedCheckDigit;
-};
+export const isValidEAN13 = (value: string): boolean => {
+  if (!/^\d{13}$/.test(value)) return false; // Vérifie que c'est bien 13 chiffres
+
+  // Calcul de la clé de contrôle (checksum)
+  const digits = value.split("").map(Number);
+  const checkDigit = digits.pop(); // Dernier chiffre (clé de contrôle)
+
+  const sum = digits.reduce(
+    (acc, digit, index) => acc + digit * (index % 2 === 0 ? 1 : 3),
+    0
+  );
+
+  const computedCheckDigit = (10 - (sum % 10)) % 10;
+
+  return checkDigit === computedCheckDigit;
+};

package/src/_core/hooks/objectToQueryParams.tsx

@@ -1,32 +1,32 @@
-export const objectToQueryParams = (
-  obj: Record<string, any>,
-  prefix = ""
-): string => {
-  const params = new URLSearchParams();
-
-  const processObject = (currentObj: any, currentPrefix: string) => {
-    Object.entries(currentObj).forEach(([key, value]) => {
-      const fullKey = currentPrefix ? `${currentPrefix}[${key}]` : key;
-
-      if (value === null || value === undefined) {
-        // Ignorer les valeurs null ou undefined
-        return;
-      }
-
-      if (typeof value === "object" && !Array.isArray(value)) {
-        // Appel récursif pour les objets imbriqués
-        processObject(value, fullKey);
-      } else if (Array.isArray(value)) {
-        // Gérer les tableaux
-        value.forEach((item) => params.append(fullKey, String(item)));
-      } else {
-        // Gérer les types primitifs
-        params.append(fullKey, String(value));
-      }
-    });
-  };
-
-  processObject(obj, prefix);
-
-  return params.toString();
-};
+export const objectToQueryParams = (
+  obj: Record<string, any>,
+  prefix = ""
+): string => {
+  const params = new URLSearchParams();
+
+  const processObject = (currentObj: any, currentPrefix: string) => {
+    Object.entries(currentObj).forEach(([key, value]) => {
+      const fullKey = currentPrefix ? `${currentPrefix}[${key}]` : key;
+
+      if (value === null || value === undefined) {
+        // Ignorer les valeurs null ou undefined
+        return;
+      }
+
+      if (typeof value === "object" && !Array.isArray(value)) {
+        // Appel récursif pour les objets imbriqués
+        processObject(value, fullKey);
+      } else if (Array.isArray(value)) {
+        // Gérer les tableaux
+        value.forEach((item) => params.append(fullKey, String(item)));
+      } else {
+        // Gérer les types primitifs
+        params.append(fullKey, String(value));
+      }
+    });
+  };
+
+  processObject(obj, prefix);
+
+  return params.toString();
+};

package/src/_core/hooks/useCurrency.tsx

@@ -1,18 +1,18 @@
-import { useCallback } from "react";
-
-export const useCurrency = (
-  locale: string = "fr-FR",
-  currency: string = "EUR"
-) => {
-  const format = useCallback(
-    (value: number) => {
-      return new Intl.NumberFormat(locale, {
-        style: "currency",
-        currency,
-      }).format(value);
-    },
-    [locale, currency]
-  );
-
-  return { formatCurrency: format };
-};
+import { useCallback } from "react";
+
+export const useCurrency = (
+  locale: string = "fr-FR",
+  currency: string = "EUR"
+) => {
+  const format = useCallback(
+    (value: number) => {
+      return new Intl.NumberFormat(locale, {
+        style: "currency",
+        currency,
+      }).format(value);
+    },
+    [locale, currency]
+  );
+
+  return { formatCurrency: format };
+};

package/src/_core/hooks/useDateutils.ts

@@ -1,64 +1,64 @@
-export function FormatDate(date: Date, format: string): string {
-  const days = [
-    "Dimanche",
-    "Lundi",
-    "Mardi",
-    "Mercredi",
-    "Jeudi",
-    "Vendredi",
-    "Samedi",
-  ];
-  const months = [
-    "janvier",
-    "février",
-    "mars",
-    "avril",
-    "mai",
-    "juin",
-    "juillet",
-    "août",
-    "septembre",
-    "octobre",
-    "novembre",
-    "décembre",
-  ];
-
-  if (!date) return "";
-
-  const year = date.getFullYear().toString();
-  const month = String(date.getMonth() + 1).padStart(2, "0"); // Mois en chiffres
-  const day = String(date.getDate()).padStart(2, "0");
-  const hours = String(date.getHours()).padStart(2, "0");
-  const minutes = String(date.getMinutes()).padStart(2, "0");
-  const seconds = String(date.getSeconds()).padStart(2, "0");
-
-  const dayName = days[date.getDay()];
-  const monthName = months[date.getMonth()];
-
-  return format
-    .replace("dddd", dayName) // Remplace d'abord "dddd"
-    .replace("MMMM", monthName) // Puis "MMMM" pour éviter de modifier "MM"
-    .replace("YYYY", year)
-    .replace("MM", month) // Enfin, "MM" pour éviter d'écraser les valeurs de "MMMM"
-    .replace("DD", day)
-    .replace("HH", hours)
-    .replace("mm", minutes)
-    .replace("ss", seconds);
-}
-export function LocalDateStringToUTC(dateStr: string): string {
-  const [year, month, day] = dateStr.split("-").map(Number);
-
-  // Crée une date en heure locale
-  const localDate = new Date(year, month - 1, day, 0, 0, 0);
-
-  // Convertit en UTC ISO
-  return localDate.toISOString();
-}
-export function localDateStartToUTC(dateStr: string): Date {
-  const [y, m, d] = dateStr.split("-").map(Number);
-  return new Date(y, m - 1, d, 0, 0, 0, 0);
-}
-export function localDateEndToUTC(dateStr: string): Date {
-  const [y, m, d] = dateStr.split("-").map(Number);
-  return new Date(y, m - 1, d, 23, 59, 59, 999);
-}
+export function FormatDate(date: Date, format: string): string {
+  const days = [
+    "Dimanche",
+    "Lundi",
+    "Mardi",
+    "Mercredi",
+    "Jeudi",
+    "Vendredi",
+    "Samedi",
+  ];
+  const months = [
+    "janvier",
+    "février",
+    "mars",
+    "avril",
+    "mai",
+    "juin",
+    "juillet",
+    "août",
+    "septembre",
+    "octobre",
+    "novembre",
+    "décembre",
+  ];
+
+  if (!date) return "";
+
+  const year = date.getFullYear().toString();
+  const month = String(date.getMonth() + 1).padStart(2, "0"); // Mois en chiffres
+  const day = String(date.getDate()).padStart(2, "0");
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  const seconds = String(date.getSeconds()).padStart(2, "0");
+
+  const dayName = days[date.getDay()];
+  const monthName = months[date.getMonth()];
+
+  return format
+    .replace("dddd", dayName) // Remplace d'abord "dddd"
+    .replace("MMMM", monthName) // Puis "MMMM" pour éviter de modifier "MM"
+    .replace("YYYY", year)
+    .replace("MM", month) // Enfin, "MM" pour éviter d'écraser les valeurs de "MMMM"
+    .replace("DD", day)
+    .replace("HH", hours)
+    .replace("mm", minutes)
+    .replace("ss", seconds);
+}
+export function LocalDateStringToUTC(dateStr: string): string {
+  const [year, month, day] = dateStr.split("-").map(Number);
+
+  // Crée une date en heure locale
+  const localDate = new Date(year, month - 1, day, 0, 0, 0);
+
+  // Convertit en UTC ISO
+  return localDate.toISOString();
+}
+export function localDateStartToUTC(dateStr: string): Date {
+  const [y, m, d] = dateStr.split("-").map(Number);
+  return new Date(y, m - 1, d, 0, 0, 0, 0);
+}
+export function localDateEndToUTC(dateStr: string): Date {
+  const [y, m, d] = dateStr.split("-").map(Number);
+  return new Date(y, m - 1, d, 23, 59, 59, 999);
+}

package/src/_core/hooks/useIsMobile.ts

@@ -1,18 +1,18 @@
-import { useEffect, useState } from "react";
-
-export const useIsMobile = (maxWidth: number = 768) => {
-  const [isMobile, setIsMobile] = useState(
-    typeof window !== "undefined" ? window.innerWidth <= maxWidth : false
-  );
-
-  useEffect(() => {
-    const handleResize = () => {
-      setIsMobile(window.innerWidth <= maxWidth);
-    };
-
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, [maxWidth]);
-
-  return isMobile;
-};
+import { useEffect, useState } from "react";
+
+export const useIsMobile = (maxWidth: number = 768) => {
+  const [isMobile, setIsMobile] = useState(
+    typeof window !== "undefined" ? window.innerWidth <= maxWidth : false
+  );
+
+  useEffect(() => {
+    const handleResize = () => {
+      setIsMobile(window.innerWidth <= maxWidth);
+    };
+
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [maxWidth]);
+
+  return isMobile;
+};

package/src/_core/hooks/useToken.tsx

@@ -1,19 +1,19 @@
-import { jwtDecode } from "jwt-decode";
-import { useCallback } from "react";
-
-export const useToken = () => {
-  const getTokenValidate = useCallback((): string | null => {
-    const token = localStorage.getItem("token");
-    if (!token) {
-      return null;
-    }
-    const decoded = jwtDecode(token);
-    const currentTime = Date.now() / 1000; // Convertir en secondes
-    if (!decoded.exp || decoded.exp < currentTime) {
-      return null;
-    }
-    return token;
-  }, []);
-
-  return { getTokenValidate };
-};
+import { jwtDecode } from "jwt-decode";
+import { useCallback } from "react";
+
+export const useToken = () => {
+  const getTokenValidate = useCallback((): string | null => {
+    const token = localStorage.getItem("token");
+    if (!token) {
+      return null;
+    }
+    const decoded = jwtDecode(token);
+    const currentTime = Date.now() / 1000; // Convertir en secondes
+    if (!decoded.exp || decoded.exp < currentTime) {
+      return null;
+    }
+    return token;
+  }, []);
+
+  return { getTokenValidate };
+};

package/src/_core/hooks/useValidate.tsx

@@ -1,18 +1,18 @@
-export const useValidate = () => {
-  const isValidateEmail = (input: string): boolean => {
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    return emailRegex.test(input);
-  };
-
-  const isValidateTel = (input: string): boolean => {
-    const emailRegex = /^\+?[0-9\s.-]{7,15}$/;
-    return emailRegex.test(input);
-  };
-
-  const isValidateCodePostal = (input: string): boolean => {
-    const emailRegex = /^[0-9]{5}$/;
-    return emailRegex.test(input);
-  };
-
-  return { isValidateEmail, isValidateTel, isValidateCodePostal };
-};
+export const useValidate = () => {
+  const isValidateEmail = (input: string): boolean => {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(input);
+  };
+
+  const isValidateTel = (input: string): boolean => {
+    const emailRegex = /^\+?[0-9\s.-]{7,15}$/;
+    return emailRegex.test(input);
+  };
+
+  const isValidateCodePostal = (input: string): boolean => {
+    const emailRegex = /^[0-9]{5}$/;
+    return emailRegex.test(input);
+  };
+
+  return { isValidateEmail, isValidateTel, isValidateCodePostal };
+};

package/src/_core/hooks/widgetSupport.tsx

@@ -1,39 +1,39 @@
-import { useEffect, useRef } from "react";
-
-export const WidgetSupport = () => {
-  const targetRef = useRef<HTMLDivElement>(null);
-  useEffect(() => {
-    if (!targetRef.current) return;
-    const script = document.createElement("script");
-    script.type = "text/javascript";
-    script.innerHTML = `
-      !function(e,t,n){
-        function a(){
-          var e = t.getElementsByTagName("script")[0],
-              n = t.createElement("script");
-          n.type = "text/javascript";
-          n.async = true;
-          n.src = "https://beacon-v2.helpscout.net";
-          e.parentNode.insertBefore(n,e);
-        }
-        if(e.Beacon = n = function(t,n,a){
-          e.Beacon.readyQueue.push({method: t, options: n, data: a});
-        }, n.readyQueue = [], t.readyState === "complete") return a();
-        e.attachEvent ? e.attachEvent("onload", a) : e.addEventListener("load", a, false);
-      }(window, document, window.Beacon || function(){});
-
-      window.Beacon('init', '5deebca7-9d32-4a66-abba-f94a05fa0522');
-    `;
-    targetRef.current.appendChild(script);
-
-    return () => {
-      targetRef?.current?.removeChild(script);
-    };
-  }, []);
-
-  return (
-    <div>
-      <div ref={targetRef} />
-    </div>
-  );
-};
+import { useEffect, useRef } from "react";
+
+export const WidgetSupport = () => {
+  const targetRef = useRef<HTMLDivElement>(null);
+  useEffect(() => {
+    if (!targetRef.current) return;
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.innerHTML = `
+      !function(e,t,n){
+        function a(){
+          var e = t.getElementsByTagName("script")[0],
+              n = t.createElement("script");
+          n.type = "text/javascript";
+          n.async = true;
+          n.src = "https://beacon-v2.helpscout.net";
+          e.parentNode.insertBefore(n,e);
+        }
+        if(e.Beacon = n = function(t,n,a){
+          e.Beacon.readyQueue.push({method: t, options: n, data: a});
+        }, n.readyQueue = [], t.readyState === "complete") return a();
+        e.attachEvent ? e.attachEvent("onload", a) : e.addEventListener("load", a, false);
+      }(window, document, window.Beacon || function(){});
+
+      window.Beacon('init', '5deebca7-9d32-4a66-abba-f94a05fa0522');
+    `;
+    targetRef.current.appendChild(script);
+
+    return () => {
+      targetRef?.current?.removeChild(script);
+    };
+  }, []);
+
+  return (
+    <div>
+      <div ref={targetRef} />
+    </div>
+  );
+};

package/src/_core/type/generiqueType.tsx

@@ -0,0 +1,4 @@
+export interface EnumerableType {
+  label: string;
+  value: string;
+}

package/src/action/Action.view.tsx

@@ -1,21 +1,21 @@
-import { ButtonAction } from "./ButtonAction";
-
-export const ActionView = (): JSX.Element => {
-  return (
-    <div className="d-flex">
-      <ButtonAction
-        className="mr-2"
-        onClick={() => console.log("Envoyer")}
-        title="Envoyer"
-        classIcon="bi-send"
-        badge={{
-          className: "badge--primary",
-          title: "Badge",
-          sizeIcon: undefined,
-          classIcon: "bi-check-circle",
-          onClick: () => console.log("Badge clicked"),
-        }}
-      />
-    </div>
-  );
-};
+import { ButtonAction } from "./ButtonAction";
+
+export const ActionView = (): JSX.Element => {
+  return (
+    <div className="d-flex">
+      <ButtonAction
+        className="mr-2"
+        onClick={() => console.log("Envoyer")}
+        title="Envoyer"
+        classIcon="bi-send"
+        badge={{
+          className: "badge--primary",
+          title: "Badge",
+          sizeIcon: undefined,
+          classIcon: "bi-check-circle",
+          onClick: () => console.log("Badge clicked"),
+        }}
+      />
+    </div>
+  );
+};