@vechain/vechain-kit 1.10.0 → 1.10.2

package/dist/index.d.cts

@@ -83,7 +83,7 @@ type VechainKitProviderProps = {
     feeDelegation?: {
         delegatorUrl: string;
         delegateAllTransactions: boolean;
-        b3trTransfers: {
+        b3trTransfers?: {
             minAmountInEther: number;
         };
     };
@@ -108,6 +108,7 @@ type VechainKitProviderProps = {
     network: {
         type: NETWORK_TYPE;
         nodeUrl?: string;
+        genesisId?: string;
         requireCertificate?: boolean;
         connectionCertificate?: {
             message?: Connex.Vendor.CertMessage;

package/dist/index.d.ts

@@ -83,7 +83,7 @@ type VechainKitProviderProps = {
     feeDelegation?: {
         delegatorUrl: string;
         delegateAllTransactions: boolean;
-        b3trTransfers: {
+        b3trTransfers?: {
             minAmountInEther: number;
         };
     };
@@ -108,6 +108,7 @@ type VechainKitProviderProps = {
     network: {
         type: NETWORK_TYPE;
         nodeUrl?: string;
+        genesisId?: string;
         requireCertificate?: boolean;
         connectionCertificate?: {
             message?: Connex.Vendor.CertMessage;

package/dist/index.js

@@ -12,7 +12,7 @@ import React10, { createContext, useEffect, useState, useRef, useMemo, useCallba
 import { useQuery, useQueryClient, useQueries, useInfiniteQuery, QueryClient, QueryClientContext, QueryClientProvider } from '@tanstack/react-query';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { motion } from 'framer-motion';
-import { createMultiStyleConfigHelpers, defineStyle, defineStyleConfig, extendTheme, createStandaloneToast, IconButton, VStack, Text, InputGroup, InputLeftElement, Icon, Input, InputRightElement, HStack, Link, Box, useMediaQuery, Modal, ModalOverlay, ModalContent, Button, Image, useDisclosure, GridItem, ModalHeader, ModalCloseButton, ModalBody, ModalFooter, Tag, Heading, Grid, useColorModeValue, Card, CardBody, Alert, AlertIcon, CardHeader, Center, CardFooter, Divider, Container, FormControl, Select, FormLabel, Textarea, Circle, AlertTitle, AlertDescription, Popover, PopoverTrigger, PopoverContent, PopoverBody, PopoverFooter, Spinner, Skeleton, Checkbox, useSteps, PinInput, PinInputField, Stack, Accordion, AccordionItem, AccordionButton, AccordionPanel, List, ColorModeScript, ChakraProvider, Flex, ListItem, Wrap, WrapItem } from '@chakra-ui/react';
+import { createMultiStyleConfigHelpers, defineStyle, defineStyleConfig, createStandaloneToast, IconButton, VStack, Text, InputGroup, InputLeftElement, Icon, Input, InputRightElement, HStack, Link, Box, useMediaQuery, Modal, ModalOverlay, ModalContent, Button, Image, useDisclosure, GridItem, ModalHeader, ModalCloseButton, ModalBody, ModalFooter, Tag, Heading, Grid, useColorModeValue, Card, CardBody, Alert, AlertIcon, CardHeader, Center, CardFooter, Divider, Container, FormControl, Select, FormLabel, Textarea, Circle, AlertTitle, AlertDescription, Popover, PopoverTrigger, PopoverContent, PopoverBody, PopoverFooter, Spinner, Skeleton, Checkbox, useSteps, extendTheme, PinInput, PinInputField, Stack, Accordion, AccordionItem, AccordionButton, AccordionPanel, List, ColorModeScript, ChakraProvider, Flex, ListItem, Wrap, WrapItem } from '@chakra-ui/react';
 import { IoChevronBack, IoCheckmarkOutline, IoCopyOutline, IoWalletOutline, IoCloseCircle, IoCogSharp, IoShieldOutline, IoSettingsOutline, IoOpenOutline, IoTrashBin, IoLanguage, IoChevronUp, IoChevronDown, IoCloseOutline, IoTrashOutline } from 'react-icons/io5';
 import { FaRegAddressCard, FaExternalLinkAlt, FaGlobe, FaEnvelope, FaArrowRight, FaTelegramPlane, FaChevronDown, FaEdit, FaGoogle, FaTwitter, FaPhone, FaSpotify, FaApple, FaInstagram, FaTiktok, FaGithub, FaLinkedin, FaTelegram, FaDiscord as FaDiscord$1, FaWallet, FaPlus } from 'react-icons/fa';
 import { HiOutlineWallet, HiOutlineShieldCheck } from 'react-icons/hi2';
@@ -4811,7 +4811,7 @@ var AddressDisplay = ({
 
 // package.json
 var package_default = {
-  version: "1.10.0"};
+  version: "1.10.2"};
 var VersionFooter = ({ ...props }) => {
   const { darkMode: isDark } = useVeChainKitConfig();
   return /* @__PURE__ */ jsxs(
@@ -22034,7 +22034,10 @@ var VeChainKitProvider = (props) => {
               DAppKitProvider,
               {
                 nodeUrl: network.nodeUrl ?? getConfig(network.type).nodeUrl,
-                genesis: getConfig(network.type).network.genesis,
+                genesis: network.genesisId ? {
+                  ...getConfig(network.type).network.genesis,
+                  id: network.genesisId
+                } : getConfig(network.type).network.genesis,
                 i18n: i18nConfig,
                 language,
                 logLevel: dappKit.logLevel,
@@ -22084,66 +22087,39 @@ var VeChainKitProvider = (props) => {
   ] });
 };
 var { definePartsStyle, defineMultiStyleConfig } = createMultiStyleConfigHelpers(modalAnatomy.keys);
-var variants = {
-  vechainKitBase: (props) => definePartsStyle({
+var getModalVariants = (darkMode) => ({
+  vechainKitBase: definePartsStyle({
     dialog: {
       scrollbarWidth: "none",
       overflow: "scroll",
       overflowX: "hidden",
       maxHeight: "550px",
       borderRadius: "24px",
-      backgroundColor: props.colorMode === "dark" ? "#1f1f1e" : "white"
-      // backdropFilter: 'blur(15px)',
+      backgroundColor: darkMode ? "#1f1f1e" : "white"
     },
     closeButton: {
       borderRadius: "50%"
     },
     header: {
       w: "full",
-      color: props.colorMode === "dark" ? "#dfdfdd" : "#2e2e2e",
+      color: darkMode ? "#dfdfdd" : "#2e2e2e",
       fontSize: "md",
       fontWeight: "700",
       textAlign: "center"
     }
-    // overlay: {
-    //     backgroundColor:
-    //         props.colorMode === 'dark' ? '#00000026' : '#00000024',
-    // },
-  }),
-  vechainKitTransactionToast: (props) => definePartsStyle({
-    dialog: {
-      borderRadius: "15px",
-      position: "fixed",
-      bottom: "10px",
-      left: "10px",
-      mimHeight: "70px",
-      minWidth: "300px",
-      maxWidth: "400px",
-      width: "fit-content",
-      pointerEvents: "auto",
-      boxShadow: "0px 0px 10px 0px rgba(0, 0, 0, 0.1)",
-      py: "10px",
-      backgroundColor: props.colorMode === "dark" ? "#1f1f1e" : "white"
-    },
-    closeButton: {
-      borderRadius: "50%",
-      width: "25px",
-      height: "25px",
-      size: "10px"
-    }
   })
-};
-var modalTheme = defineMultiStyleConfig({
-  variants,
+});
+var getModalTheme = (darkMode) => defineMultiStyleConfig({
+  variants: getModalVariants(darkMode),
   defaultProps: {
     variant: "vechainKitBase"
   }
 });
 var { definePartsStyle: definePartsStyle2, defineMultiStyleConfig: defineMultiStyleConfig2 } = createMultiStyleConfigHelpers(cardAnatomy.keys);
-var variants2 = {
-  vechainKitBase: (props) => definePartsStyle2({
+var getCardVariants = (darkMode) => ({
+  vechainKitBase: definePartsStyle2({
     container: {
-      backgroundColor: props.colorMode === "dark" ? "#1c1c1b" : "#f5f5f5",
+      backgroundColor: darkMode ? "#1c1c1b" : "#f5f5f5",
       borderRadius: "14px",
       width: "full",
       border: "none"
@@ -22162,23 +22138,23 @@ var variants2 = {
       borderRadius: "0 0 14px 14px"
     }
   }),
-  featureAnnouncement: (props) => definePartsStyle2({
+  featureAnnouncement: definePartsStyle2({
     body: {
-      backgroundColor: props.colorMode === "dark" ? "#ffffff0a" : "blackAlpha.50",
+      backgroundColor: darkMode ? "#ffffff0a" : "blackAlpha.50",
       borderRadius: "12px",
-      color: props.colorMode === "dark" ? "#ffffff12" : "blackAlpha.200"
+      color: darkMode ? "#ffffff12" : "blackAlpha.200"
     },
     container: {
       borderRadius: "12px",
       backgroundColor: "transparent"
     }
   }),
-  vechainKitAppCard: (props) => definePartsStyle2({
+  vechainKitAppCard: definePartsStyle2({
     body: {
       height: "full",
       borderRadius: "12px",
-      backgroundColor: props.colorMode === "dark" ? "#1f1f1e" : "white",
-      border: props.colorMode === "dark" ? "1px solid #2d2d2d" : "1px solid #eaeaea"
+      backgroundColor: darkMode ? "#1f1f1e" : "white",
+      border: darkMode ? "1px solid #2d2d2d" : "1px solid #eaeaea"
     },
     container: {
       height: "150px",
@@ -22186,9 +22162,9 @@ var variants2 = {
       backgroundColor: "transparent"
     }
   })
-};
-var cardTheme = defineMultiStyleConfig2({
-  variants: variants2,
+});
+var getCardTheme = (darkMode) => defineMultiStyleConfig2({
+  variants: getCardVariants(darkMode),
   defaultProps: {
     variant: "vechainKitBase"
     // default is solid
@@ -22197,7 +22173,7 @@ var cardTheme = defineMultiStyleConfig2({
 var baseStyle = defineStyle({
   borderRadius: "12px"
 });
-var variants3 = {
+var variants = {
   loginIn: defineStyle(() => ({
     bg: "white",
     color: "#1a1a1a",
@@ -22333,18 +22309,18 @@ var variants3 = {
 };
 var buttonTheme = defineStyleConfig({
   baseStyle,
-  variants: variants3
+  variants
 });
 var { definePartsStyle: definePartsStyle3, defineMultiStyleConfig: defineMultiStyleConfig3 } = createMultiStyleConfigHelpers(popoverAnatomy.keys);
-var variants4 = {
-  vechainKitBase: (props) => definePartsStyle3({
+var getPopoverVariants = (darkMode) => ({
+  vechainKitBase: definePartsStyle3({
     popper: {
       zIndex: 1e3
     },
     content: {
       borderRadius: "24px",
       border: "none",
-      backgroundColor: props.colorMode === "dark" ? "#1f1f1e" : "white",
+      backgroundColor: darkMode ? "#1f1f1e" : "white",
       boxShadow: "0px 4px 16px rgba(0, 0, 0, 0.12)",
       minWidth: "380px"
     },
@@ -22352,28 +22328,28 @@ var variants4 = {
       padding: "16px"
     }
   })
-};
-var popoverTheme = defineMultiStyleConfig3({
-  variants: variants4,
+});
+var getPopoverTheme = (darkMode) => defineMultiStyleConfig3({
+  variants: getPopoverVariants(darkMode),
   defaultProps: {
     variant: "vechainKitBase"
   }
 });
 
 // src/theme/theme.tsx
-var themeConfig = {
+var getThemeConfig = (darkMode) => ({
   useSystemColorMode: false,
   disableTransitionOnChange: false,
   // @ts-ignore
   components: {
-    Modal: modalTheme,
-    Card: cardTheme,
+    Modal: getModalTheme(darkMode),
+    Card: getCardTheme(darkMode),
     Button: buttonTheme,
-    Popover: popoverTheme
+    Popover: getPopoverTheme(darkMode)
   },
   cssVarPrefix: "vechainKit"
-};
-var VechainKitTheme = extendTheme(themeConfig);
+});
+var getVechainKitTheme = (darkMode) => extendTheme(getThemeConfig(darkMode));
 var { ToastContainer } = createStandaloneToast();
 var EnsureChakraProvider = ({
   children,
@@ -22410,9 +22386,9 @@ var VechainKitThemeProvider = ({
 }) => {
   const theme = useMemo(
     () => ({
-      ...VechainKitTheme,
+      ...getVechainKitTheme(darkMode),
       config: {
-        ...VechainKitTheme.config,
+        ...getVechainKitTheme(darkMode).config,
         initialColorMode: darkMode ? "dark" : "light"
       }
     }),