react-better-html 1.1.158 → 1.1.159

package/dist/index.mjs

@@ -1526,19 +1526,6 @@ import { memo as memo7 } from "react";
 import { memo as memo6, useCallback as useCallback2, useEffect as useEffect3, useMemo, useRef, useState } from "react";
 import styled6 from "styled-components";
 
-// src/plugins/react-router-dom.ts
-import { Link as RouterLink, NavLink as RouterNavLink } from "react-router-dom";
-var reactRouterDomPlugin = () => ({
-  name: "react-router-dom",
-  components: {
-    Link: RouterLink,
-    NavLink: RouterNavLink
-  },
-  initialize: () => {
-    console.log("react-router-dom plugin initialized");
-  }
-});
-
 // src/plugins/alerts.ts
 var defaultAlertsPluginOptions = {
   position: "bottom",
@@ -1559,6 +1546,39 @@ var alertsPlugin = (options) => ({
   })
 });
 
+// src/plugins/reactRouterDom.ts
+import { Link as RouterLink, NavLink as RouterNavLink } from "react-router-dom";
+var defaultReactRouterDomPluginOptions = {};
+var reactRouterDomPlugin = (options) => ({
+  name: "react-router-dom",
+  components: {
+    Link: RouterLink,
+    NavLink: RouterNavLink
+  },
+  initialize: () => {
+    console.log("react-router-dom plugin initialized");
+  },
+  getConfig: () => ({
+    ...defaultReactRouterDomPluginOptions,
+    ...options
+  })
+});
+
+// src/plugins/localStorage.ts
+var defaultLocalStoragePluginOptions = {
+  encryption: {}
+};
+var localStoragePlugin = (options) => ({
+  name: "localStorage",
+  initialize: () => {
+    console.log("localStorage plugin initialized");
+  },
+  getConfig: () => ({
+    ...defaultLocalStoragePluginOptions,
+    ...options
+  })
+});
+
 // src/components/Icon.tsx
 import { forwardRef, memo, useEffect } from "react";
 import styled from "styled-components";
@@ -5339,6 +5359,62 @@ var countries = [
   }
 ];
 
+// src/utils/functions.ts
+import CryptoJS from "crypto-js";
+
+// src/utils/variableFunctions.ts
+var checkBetterHtmlContextValue = (value, functionsName) => {
+  if (value === void 0) {
+    throw new Error(
+      `\`${functionsName}()\` must be used within a \`<BetterHtmlProvider>\`. Make sure to add one at the root of your component tree.`
+    );
+  }
+  return value !== void 0;
+};
+var loaderControls = {
+  startLoading: (loaderName) => {
+    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "loaderControls.startLoading")) return;
+    externalBetterHtmlContextValue.setLoaders((oldValue) => ({
+      ...oldValue,
+      [loaderName.toString()]: true
+    }));
+  },
+  stopLoading: (loaderName) => {
+    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "loaderControls.stopLoading")) return;
+    externalBetterHtmlContextValue.setLoaders((oldValue) => ({
+      ...oldValue,
+      [loaderName.toString()]: false
+    }));
+  }
+};
+var alertControls = {
+  createAlert: (alert) => {
+    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "alertControls.createAlert"))
+      return void 0;
+    const readyAlert = {
+      id: crypto.randomUUID(),
+      ...alert
+    };
+    externalBetterHtmlContextValue.setAlerts((oldValue) => [...oldValue, readyAlert]);
+    return readyAlert;
+  },
+  removeAlert: (alertId) => {
+    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "alertControls.removeAlert")) return;
+    externalBetterHtmlContextValue.setAlerts((oldValue) => oldValue.filter((alert) => alert.id !== alertId));
+  }
+};
+var colorThemeControls = {
+  toggleTheme: (theme2) => {
+    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "colorThemeControls.toggleTheme")) return;
+    const currentColorTheme = externalBetterHtmlContextValue.colorTheme;
+    const newColorTheme = theme2 ?? (currentColorTheme === "dark" ? "light" : "dark");
+    setTimeout(() => {
+      window.document.body.parentElement?.setAttribute("data-theme", newColorTheme);
+      localStorage.setItem("theme", newColorTheme);
+    }, 0.01 * 1e3);
+  }
+};
+
 // src/utils/functions.ts
 var generateRandomString = (stringLength, options) => {
   const capitals = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
@@ -5410,6 +5486,40 @@ var eventPreventStop = (event) => {
   event.preventDefault();
   event.stopPropagation();
 };
+var encryptString = (text) => {
+  if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "encryptString")) return void 0;
+  const localStoragePlugin2 = externalBetterHtmlContextValue.plugins.find((plugin) => plugin.name === "localStorage");
+  if (!localStoragePlugin2) {
+    throw new Error(
+      "`encryptString` hook requires the `localStorage` plugin to be added to the `plugins` prop in `<BetterHtmlProvider>`."
+    );
+  }
+  const pluginConfig = localStoragePlugin2.getConfig?.() ?? {};
+  if (!pluginConfig?.encryption?.enabled) return text;
+  const encrypted = CryptoJS.AES.encrypt(text, CryptoJS.enc.Hex.parse(pluginConfig.encryption.secretKey), {
+    iv: CryptoJS.enc.Hex.parse(pluginConfig.encryption.iv),
+    mode: CryptoJS.mode.CBC,
+    padding: CryptoJS.pad.Pkcs7
+  }).toString();
+  return encrypted;
+};
+var decryptString = (text) => {
+  if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "decryptString")) return void 0;
+  const localStoragePlugin2 = externalBetterHtmlContextValue.plugins.find((plugin) => plugin.name === "localStorage");
+  if (!localStoragePlugin2) {
+    throw new Error(
+      "`decryptString` hook requires the `localStorage` plugin to be added to the `plugins` prop in `<BetterHtmlProvider>`."
+    );
+  }
+  const pluginConfig = localStoragePlugin2.getConfig?.() ?? {};
+  if (!pluginConfig?.encryption?.enabled) return text;
+  const decrypted = CryptoJS.AES.decrypt(text, CryptoJS.enc.Hex.parse(pluginConfig.encryption.secretKey), {
+    iv: CryptoJS.enc.Hex.parse(pluginConfig.encryption.iv),
+    mode: CryptoJS.mode.CBC,
+    padding: CryptoJS.pad.Pkcs7
+  });
+  return decrypted.toString(CryptoJS.enc.Utf8);
+};
 
 // src/components/Label.tsx
 import { memo as memo15 } from "react";
@@ -7374,61 +7484,6 @@ var FormRow_default = FormRow2;
 
 // src/components/ColorThemeSwitch.tsx
 import { memo as memo21, useEffect as useEffect9 } from "react";
-
-// src/utils/variableFunctions.ts
-var checkBetterHtmlContextValue = (value, functionsName) => {
-  if (value === void 0) {
-    throw new Error(
-      `\`${functionsName}()\` must be used within a \`<BetterHtmlProvider>\`. Make sure to add one at the root of your component tree.`
-    );
-  }
-  return value !== void 0;
-};
-var loaderControls = {
-  startLoading: (loaderName) => {
-    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "loaderControls.startLoading")) return;
-    externalBetterHtmlContextValue.setLoaders((oldValue) => ({
-      ...oldValue,
-      [loaderName.toString()]: true
-    }));
-  },
-  stopLoading: (loaderName) => {
-    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "loaderControls.stopLoading")) return;
-    externalBetterHtmlContextValue.setLoaders((oldValue) => ({
-      ...oldValue,
-      [loaderName.toString()]: false
-    }));
-  }
-};
-var alertControls = {
-  createAlert: (alert) => {
-    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "alertControls.createAlert"))
-      return void 0;
-    const readyAlert = {
-      id: crypto.randomUUID(),
-      ...alert
-    };
-    externalBetterHtmlContextValue.setAlerts((oldValue) => [...oldValue, readyAlert]);
-    return readyAlert;
-  },
-  removeAlert: (alertId) => {
-    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "alertControls.removeAlert")) return;
-    externalBetterHtmlContextValue.setAlerts((oldValue) => oldValue.filter((alert) => alert.id !== alertId));
-  }
-};
-var colorThemeControls = {
-  toggleTheme: (theme2) => {
-    if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "colorThemeControls.toggleTheme")) return;
-    const currentColorTheme = externalBetterHtmlContextValue.colorTheme;
-    const newColorTheme = theme2 ?? (currentColorTheme === "dark" ? "light" : "dark");
-    setTimeout(() => {
-      window.document.body.parentElement?.setAttribute("data-theme", newColorTheme);
-      localStorage.setItem("theme", newColorTheme);
-    }, 0.01 * 1e3);
-  }
-};
-
-// src/components/ColorThemeSwitch.tsx
 import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
 var ColorThemeSwitchComponent = function ColorThemeSwitch({
   withMoon,
@@ -9042,6 +9097,71 @@ FoldableComponent.box = forwardRef18(function Box3({ ...props }, ref) {
 var Foldable2 = memo25(FoldableComponent);
 Foldable2.box = FoldableComponent.box;
 var Foldable_default = Foldable2;
+
+// src/utils/localStorage.ts
+function generateLocalStorage() {
+  return {
+    setItem: (name, value) => {
+      if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "generateLocalStorage"))
+        return void 0;
+      const localStoragePlugin2 = externalBetterHtmlContextValue.plugins.find(
+        (plugin) => plugin.name === "localStorage"
+      );
+      if (!localStoragePlugin2) {
+        throw new Error(
+          "`generateLocalStorage` hook requires the `localStorage` plugin to be added to the `plugins` prop in `<BetterHtmlProvider>`."
+        );
+      }
+      const pluginConfig = localStoragePlugin2.getConfig?.() ?? {};
+      const encryptionEnabled = pluginConfig.encryption?.enabled ?? false;
+      const readyName = encryptionEnabled ? encryptString(name.toString()) : name;
+      const readyValue = encryptionEnabled ? encryptString(JSON.stringify(value)) : JSON.stringify(value);
+      if (value) localStorage.setItem(readyName.toString(), readyValue);
+      else localStorage.removeItem(readyName.toString());
+    },
+    getItem: (name) => {
+      if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "generateLocalStorage"))
+        return void 0;
+      const localStoragePlugin2 = externalBetterHtmlContextValue.plugins.find(
+        (plugin) => plugin.name === "localStorage"
+      );
+      if (!localStoragePlugin2) {
+        throw new Error(
+          "`generateLocalStorage` hook requires the `localStorage` plugin to be added to the `plugins` prop in `<BetterHtmlProvider>`."
+        );
+      }
+      const pluginConfig = localStoragePlugin2.getConfig?.() ?? {};
+      const encryptionEnabled = pluginConfig.encryption?.enabled ?? false;
+      const readyName = encryptionEnabled ? encryptString(name.toString()) : name;
+      const item = localStorage.getItem(readyName.toString());
+      if (item === null) return void 0;
+      try {
+        return encryptionEnabled ? JSON.parse(decryptString(item)) : JSON.parse(item);
+      } catch (error) {
+        return void 0;
+      }
+    },
+    removeItem: (name) => {
+      if (!checkBetterHtmlContextValue(externalBetterHtmlContextValue, "generateLocalStorage"))
+        return void 0;
+      const localStoragePlugin2 = externalBetterHtmlContextValue.plugins.find(
+        (plugin) => plugin.name === "localStorage"
+      );
+      if (!localStoragePlugin2) {
+        throw new Error(
+          "`generateLocalStorage` hook requires the `localStorage` plugin to be added to the `plugins` prop in `<BetterHtmlProvider>`."
+        );
+      }
+      const pluginConfig = localStoragePlugin2.getConfig?.() ?? {};
+      const encryptionEnabled = pluginConfig.encryption?.enabled ?? false;
+      const readyName = encryptionEnabled ? encryptString(name.toString()) : name;
+      localStorage.removeItem(readyName.toString());
+    },
+    removeAllItems: () => {
+      localStorage.clear();
+    }
+  };
+}
 export {
   BetterHtmlProvider_default as BetterHtmlProvider,
   Button_default as Button,
@@ -9072,17 +9192,21 @@ export {
   countries,
   darkenColor,
   defaultAlertsPluginOptions,
+  defaultLocalStoragePluginOptions,
+  defaultReactRouterDomPluginOptions,
   desaturateColor,
   eventPreventDefault,
   eventPreventStop,
   eventStopPropagation,
   formatPhoneNumber,
+  generateLocalStorage,
   generateRandomString,
   getBrowser,
   getFormErrorObject,
   isMobileDevice,
   lightenColor,
   loaderControls,
+  localStoragePlugin,
   reactRouterDomPlugin,
   saturateColor,
   useAlertControls,