@vechain/vechain-kit 1.10.3 → 1.10.5

package/README.md

@@ -27,10 +27,25 @@ It offers:
 -   [Sample Next.js App](https://github.com/vechain/vechain-kit/tree/main/examples/next-template)
 -   [Smart Account Factory](https://vechain.github.io/smart-accounts/)
 
-# Installation
+# Install dependencies
 
 ```bash
-yarn add @tanstack/react-query@"^5.64.2" @chakra-ui/react@"^2.8.2" @vechain/dapp-kit-react@"1.5.0" @vechain/vechain-kit
+yarn add \
+  @emotion/styled@^11.14.0 \
+  @emotion/react@^11.14.0 \
+  framer-motion@^11.14.0 \
+  @tanstack/react-query@^5.64.2 \
+  @chakra-ui/react@^2.8.2 \
+  @vechain/dapp-kit-react@2.0.4 \
+  @vechain/sdk-core@1.2.0 \
+  @vechain/sdk-network@1.2.0
+
+```
+
+# Install vechain kit
+
+```bash
+yarn @vechain/vechain-kit@1.10.4
 ```
 
 # Quick Start

package/dist/index.cjs

@@ -50,6 +50,8 @@ var si = require('react-icons/si');
 var bi = require('react-icons/bi');
 var go = require('react-icons/go');
 var anatomy = require('@chakra-ui/anatomy');
+var react$1 = require('@emotion/react');
+var createCache = require('@emotion/cache');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -57,6 +59,7 @@ var i18n__default = /*#__PURE__*/_interopDefault(i18n);
 var React10__default = /*#__PURE__*/_interopDefault(React10);
 var VeChainKitMixpanel__default = /*#__PURE__*/_interopDefault(VeChainKitMixpanel);
 var imageCompression__default = /*#__PURE__*/_interopDefault(imageCompression);
+var createCache__default = /*#__PURE__*/_interopDefault(createCache);
 
 // src/languages/en.json
 var en_default = {
@@ -4817,7 +4820,7 @@ var AddressDisplay = ({
 
 // package.json
 var package_default = {
-  version: "1.10.3"};
+  version: "1.10.5"};
 var VersionFooter = ({ ...props }) => {
   const { darkMode: isDark } = useVeChainKitConfig();
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -22357,21 +22360,55 @@ var getThemeConfig = (darkMode) => ({
 });
 var getVechainKitTheme = (darkMode) => react.extendTheme(getThemeConfig(darkMode));
 var { ToastContainer } = react.createStandaloneToast();
+var createVeChainKitCache = () => {
+  return createCache__default.default({
+    key: "vechain-kit",
+    // consistent with our layer and class names
+    prepend: true
+    // CSS layers will be handled via Global component injection
+  });
+};
+var LayerSetup = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react$1.Global,
+    {
+      styles: react$1.css`
+                /* define CSS layers with proper priority order */
+                @layer vechain-kit, host-app;
+
+                /* All vechain-kit styles go in the vechain-kit layer */
+                @layer vechain-kit {
+                    /* scope all Chakra styles to vechain-kit-root */
+                    .vechain-kit-root {
+                        /* vechain-kit styles are contained here */
+                    }
+                }
+            `
+    }
+  );
+};
 var EnsureChakraProvider = ({
   children,
   theme
 }) => {
+  const cache = React10.useMemo(() => createVeChainKitCache(), []);
   try {
     const chakraVars = document.documentElement.style.getPropertyValue(
       "--chakra-colors-transparent"
     );
     if (chakraVars) {
-      return /* @__PURE__ */ jsxRuntime.jsx(react.ChakraProvider, { theme, resetCSS: false, children });
+      return /* @__PURE__ */ jsxRuntime.jsxs(react$1.CacheProvider, { value: cache, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(LayerSetup, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(react.ChakraProvider, { theme, resetCSS: false, children })
+      ] });
     }
   } catch (e) {
     console.error(e);
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(react.ChakraProvider, { theme, resetCSS: true, children });
+  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.CacheProvider, { value: cache, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(LayerSetup, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(react.ChakraProvider, { theme, resetCSS: true, children })
+  ] });
 };
 var EnsureColorModeScript = ({ darkMode }) => {
   try {