npm - @unifold/ui-react - Versions diffs - 0.1.37 → 0.1.38 - Mend

@unifold/ui-react 0.1.37 → 0.1.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.d.mts CHANGED Viewed

@@ -52,6 +52,16 @@ interface DepositModalProps {
     userId: string;
     publishableKey: string;
     modalTitle?: string;
+    /** Main menu — Transfer Crypto row title. @default `"Transfer Crypto"` (from `i18n.depositModal.transferCrypto.title`) */
+    transferCryptoTitle?: string;
+    /** Main menu — Deposit with Card row title. @default `"Deposit with Card"` */
+    depositWithCardTitle?: string;
+    /** Main menu — Pay with Exchange row title. @default `"Pay with Exchange"` */
+    payWithExchangeTitle?: string;
+    /** Main menu — Deposit Tracker row title. @default `"Deposit Tracker"` */
+    depositTrackerTitle?: string;
+    /** Main menu — Deposit Tracker row description. @default `"Track your deposit progress"` */
+    depositTrackerSubTitle?: string;
     destinationTokenSymbol?: string;
     recipientAddress?: string;
     destinationChainType?: ChainType;
@@ -72,6 +82,10 @@ interface DepositModalProps {
     enableConnectWallet?: boolean;
     /** Enable "Pay with Exchange" option. Overrides dashboard default. Defaults to dashboard value or true. */
     enablePayWithExchange?: boolean;
+    /** Deposit with Card — onramp step: hide the You use / You buy / You receive card. @default false */
+    hideDepositFlowInfo?: boolean;
+    /** Deposit with Card — onramp step: hide the temporary wallet address disclaimer. @default false */
+    hideDisplayDescription?: boolean;
     onDepositSuccess?: (data: {
         message: string;
         transaction?: unknown;
@@ -88,7 +102,7 @@ interface DepositModalProps {
     /** First screen when the modal opens. Default `main` (deposit menu). */
     initialScreen?: DepositModalInitialScreen;
 }
-declare function DepositModal({ open, onOpenChange, userId, publishableKey, modalTitle, destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, hideDepositTracker, showBalanceHeader, transferInputVariant, depositConfirmationMode, enableConnectWallet, enablePayWithExchange, onDepositSuccess, onDepositError, theme, hideOverlay, initialScreen, }: DepositModalProps): react_jsx_runtime.JSX.Element;
+declare function DepositModal({ open, onOpenChange, userId, publishableKey, modalTitle, destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, hideDepositTracker, showBalanceHeader, transferInputVariant, depositConfirmationMode, enableConnectWallet, enablePayWithExchange, hideDepositFlowInfo, hideDisplayDescription, onDepositSuccess, onDepositError, theme, hideOverlay, initialScreen, transferCryptoTitle, depositWithCardTitle, payWithExchangeTitle, depositTrackerTitle, depositTrackerSubTitle, }: DepositModalProps): react_jsx_runtime.JSX.Element;
 interface DepositHeaderProps {
     title: string;
@@ -192,9 +206,13 @@ interface BuyWithCardProps {
     themeClass?: string;
     wallets?: Wallet[];
     assetCdnUrl?: string;
+    /** When true, hides the onramp “You use / You buy / You receive” flow card. @default false */
+    hideDepositFlowInfo?: boolean;
+    /** When true, hides the temporary wallet address disclaimer below the flow. @default false */
+    hideDisplayDescription?: boolean;
 }
 declare function BuyWithCard({ userId, publishableKey, view: externalView, onViewChange, maxAmountUsd, accentColor, // Keep prop for backward compatibility but don't use default
-destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, onDepositSuccess, onDepositError, themeClass, wallets: externalWallets, assetCdnUrl, }: BuyWithCardProps): react_jsx_runtime.JSX.Element;
+destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, onDepositSuccess, onDepositError, themeClass, wallets: externalWallets, assetCdnUrl, hideDepositFlowInfo, hideDisplayDescription, }: BuyWithCardProps): react_jsx_runtime.JSX.Element;
 interface CurrencyModalProps {
     open: boolean;
@@ -720,4 +738,4 @@ declare function cn(...inputs: ClassValue[]): string;
  */
 declare function truncateAddress(address: string, startChars?: number, endChars?: number): string;
-export { type AllowedCountryResult, Button, type ButtonProps, type ButtonTokens, BuyWithCard, type CardTokens, type ComponentConfig, type ComponentOverrides, type ComponentTokens, type ContainerTokens, CurrencyListItem, CurrencyListSection, CurrencyModal, type CustomThemeColors, type DepositConfirmationMode, DepositDetailContent, DepositExecutionItem, DepositHeader, DepositModal, type DepositModalInitialScreen, DepositPollingUi, DepositSuccessToast, DepositTrackerButton, DepositWithCardButton, DepositsModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, type FontConfig, type HeaderTokens, type InputTokens, type ListTokens, type ResolvedFonts, type SearchTokens, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, StyledQRCode, type ThemeColors, type ThemeConfig, type ThemeMode, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransferCryptoButton, TransferCryptoDoubleInput, TransferCryptoSingleInput, buttonVariants, cn, colors, defaultColors, getColors, mergeColors, resolveComponentTokens, truncateAddress, useAllowedCountry, useDepositPolling, useTheme };
+export { type AllowedCountryResult, Button, type ButtonProps, type ButtonTokens, BuyWithCard, type BuyWithCardProps, type CardTokens, type ComponentConfig, type ComponentOverrides, type ComponentTokens, type ContainerTokens, CurrencyListItem, CurrencyListSection, CurrencyModal, type CustomThemeColors, type DepositConfirmationMode, DepositDetailContent, DepositExecutionItem, DepositHeader, DepositModal, type DepositModalInitialScreen, type DepositModalProps, DepositPollingUi, DepositSuccessToast, DepositTrackerButton, DepositWithCardButton, DepositsModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, type FontConfig, type HeaderTokens, type InputTokens, type ListTokens, type ResolvedFonts, type SearchTokens, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, StyledQRCode, type ThemeColors, type ThemeConfig, type ThemeMode, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransferCryptoButton, TransferCryptoDoubleInput, TransferCryptoSingleInput, buttonVariants, cn, colors, defaultColors, getColors, mergeColors, resolveComponentTokens, truncateAddress, useAllowedCountry, useDepositPolling, useTheme };

package/dist/index.d.ts CHANGED Viewed

@@ -52,6 +52,16 @@ interface DepositModalProps {
     userId: string;
     publishableKey: string;
     modalTitle?: string;
+    /** Main menu — Transfer Crypto row title. @default `"Transfer Crypto"` (from `i18n.depositModal.transferCrypto.title`) */
+    transferCryptoTitle?: string;
+    /** Main menu — Deposit with Card row title. @default `"Deposit with Card"` */
+    depositWithCardTitle?: string;
+    /** Main menu — Pay with Exchange row title. @default `"Pay with Exchange"` */
+    payWithExchangeTitle?: string;
+    /** Main menu — Deposit Tracker row title. @default `"Deposit Tracker"` */
+    depositTrackerTitle?: string;
+    /** Main menu — Deposit Tracker row description. @default `"Track your deposit progress"` */
+    depositTrackerSubTitle?: string;
     destinationTokenSymbol?: string;
     recipientAddress?: string;
     destinationChainType?: ChainType;
@@ -72,6 +82,10 @@ interface DepositModalProps {
     enableConnectWallet?: boolean;
     /** Enable "Pay with Exchange" option. Overrides dashboard default. Defaults to dashboard value or true. */
     enablePayWithExchange?: boolean;
+    /** Deposit with Card — onramp step: hide the You use / You buy / You receive card. @default false */
+    hideDepositFlowInfo?: boolean;
+    /** Deposit with Card — onramp step: hide the temporary wallet address disclaimer. @default false */
+    hideDisplayDescription?: boolean;
     onDepositSuccess?: (data: {
         message: string;
         transaction?: unknown;
@@ -88,7 +102,7 @@ interface DepositModalProps {
     /** First screen when the modal opens. Default `main` (deposit menu). */
     initialScreen?: DepositModalInitialScreen;
 }
-declare function DepositModal({ open, onOpenChange, userId, publishableKey, modalTitle, destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, hideDepositTracker, showBalanceHeader, transferInputVariant, depositConfirmationMode, enableConnectWallet, enablePayWithExchange, onDepositSuccess, onDepositError, theme, hideOverlay, initialScreen, }: DepositModalProps): react_jsx_runtime.JSX.Element;
+declare function DepositModal({ open, onOpenChange, userId, publishableKey, modalTitle, destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, hideDepositTracker, showBalanceHeader, transferInputVariant, depositConfirmationMode, enableConnectWallet, enablePayWithExchange, hideDepositFlowInfo, hideDisplayDescription, onDepositSuccess, onDepositError, theme, hideOverlay, initialScreen, transferCryptoTitle, depositWithCardTitle, payWithExchangeTitle, depositTrackerTitle, depositTrackerSubTitle, }: DepositModalProps): react_jsx_runtime.JSX.Element;
 interface DepositHeaderProps {
     title: string;
@@ -192,9 +206,13 @@ interface BuyWithCardProps {
     themeClass?: string;
     wallets?: Wallet[];
     assetCdnUrl?: string;
+    /** When true, hides the onramp “You use / You buy / You receive” flow card. @default false */
+    hideDepositFlowInfo?: boolean;
+    /** When true, hides the temporary wallet address disclaimer below the flow. @default false */
+    hideDisplayDescription?: boolean;
 }
 declare function BuyWithCard({ userId, publishableKey, view: externalView, onViewChange, maxAmountUsd, accentColor, // Keep prop for backward compatibility but don't use default
-destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, onDepositSuccess, onDepositError, themeClass, wallets: externalWallets, assetCdnUrl, }: BuyWithCardProps): react_jsx_runtime.JSX.Element;
+destinationTokenSymbol, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, onDepositSuccess, onDepositError, themeClass, wallets: externalWallets, assetCdnUrl, hideDepositFlowInfo, hideDisplayDescription, }: BuyWithCardProps): react_jsx_runtime.JSX.Element;
 interface CurrencyModalProps {
     open: boolean;
@@ -720,4 +738,4 @@ declare function cn(...inputs: ClassValue[]): string;
  */
 declare function truncateAddress(address: string, startChars?: number, endChars?: number): string;
-export { type AllowedCountryResult, Button, type ButtonProps, type ButtonTokens, BuyWithCard, type CardTokens, type ComponentConfig, type ComponentOverrides, type ComponentTokens, type ContainerTokens, CurrencyListItem, CurrencyListSection, CurrencyModal, type CustomThemeColors, type DepositConfirmationMode, DepositDetailContent, DepositExecutionItem, DepositHeader, DepositModal, type DepositModalInitialScreen, DepositPollingUi, DepositSuccessToast, DepositTrackerButton, DepositWithCardButton, DepositsModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, type FontConfig, type HeaderTokens, type InputTokens, type ListTokens, type ResolvedFonts, type SearchTokens, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, StyledQRCode, type ThemeColors, type ThemeConfig, type ThemeMode, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransferCryptoButton, TransferCryptoDoubleInput, TransferCryptoSingleInput, buttonVariants, cn, colors, defaultColors, getColors, mergeColors, resolveComponentTokens, truncateAddress, useAllowedCountry, useDepositPolling, useTheme };
+export { type AllowedCountryResult, Button, type ButtonProps, type ButtonTokens, BuyWithCard, type BuyWithCardProps, type CardTokens, type ComponentConfig, type ComponentOverrides, type ComponentTokens, type ContainerTokens, CurrencyListItem, CurrencyListSection, CurrencyModal, type CustomThemeColors, type DepositConfirmationMode, DepositDetailContent, DepositExecutionItem, DepositHeader, DepositModal, type DepositModalInitialScreen, type DepositModalProps, DepositPollingUi, DepositSuccessToast, DepositTrackerButton, DepositWithCardButton, DepositsModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, type FontConfig, type HeaderTokens, type InputTokens, type ListTokens, type ResolvedFonts, type SearchTokens, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, StyledQRCode, type ThemeColors, type ThemeConfig, type ThemeMode, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransferCryptoButton, TransferCryptoDoubleInput, TransferCryptoSingleInput, buttonVariants, cn, colors, defaultColors, getColors, mergeColors, resolveComponentTokens, truncateAddress, useAllowedCountry, useDepositPolling, useTheme };

package/dist/index.js CHANGED Viewed

@@ -1382,6 +1382,10 @@ var en_default = {
     payWithExchange: {
       title: "Pay with Exchange",
       subtitle: "Transfer from exchange"
+    },
+    depositTracker: {
+      title: "Deposit Tracker",
+      subtitle: "Track your deposit progress"
     }
   },
   payWithExchange: {
@@ -2362,7 +2366,9 @@ function BuyWithCard({
   onDepositError,
   themeClass = "",
   wallets: externalWallets,
-  assetCdnUrl
+  assetCdnUrl,
+  hideDepositFlowInfo = false,
+  hideDisplayDescription = false
 }) {
   const { colors: colors2, fonts, components } = useTheme();
   const [amount, setAmount] = (0, import_react7.useState)("");
@@ -3181,7 +3187,7 @@ function BuyWithCard({
                   children: t.onramp.canCloseModal
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
+              !hideDepositFlowInfo && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-min-w-[72px]", children: [
                   /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uf-h-8 uf-flex uf-items-center uf-justify-center uf-mb-1.5", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                     "img",
@@ -3295,7 +3301,7 @@ function BuyWithCard({
                   )
                 ] })
               ] }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              !hideDisplayDescription && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                 "p",
                 {
                   className: "uf-text-xs uf-leading-relaxed",
@@ -10992,11 +10998,18 @@ function DepositModal({
   depositConfirmationMode = "auto_ui",
   enableConnectWallet = false,
   enablePayWithExchange,
+  hideDepositFlowInfo = false,
+  hideDisplayDescription = false,
   onDepositSuccess,
   onDepositError,
   theme = "dark",
   hideOverlay = false,
-  initialScreen = "main"
+  initialScreen = "main",
+  transferCryptoTitle = t6.transferCrypto.title,
+  depositWithCardTitle = t6.depositWithCard.title,
+  payWithExchangeTitle = t6.payWithExchange.title,
+  depositTrackerTitle = t6.depositTracker.title,
+  depositTrackerSubTitle = t6.depositTracker.subtitle
 }) {
   const { colors: colors2, fonts, components } = useTheme();
   const effectiveInitialScreen = (0, import_react16.useMemo)(() => {
@@ -11334,7 +11347,7 @@ function DepositModal({
                     TransferCryptoButton,
                     {
                       onClick: () => setView("transfer"),
-                      title: t6.transferCrypto.title,
+                      title: transferCryptoTitle,
                       subtitle: t6.transferCrypto.subtitle,
                       featuredTokens: projectConfig?.transfer_crypto.networks
                     }
@@ -11353,7 +11366,7 @@ function DepositModal({
                     DepositWithCardButton,
                     {
                       onClick: () => setView("card"),
-                      title: t6.depositWithCard.title,
+                      title: depositWithCardTitle,
                       subtitle: t6.depositWithCard.subtitle,
                       paymentNetworks: projectConfig?.payment_networks.networks
                     }
@@ -11362,7 +11375,7 @@ function DepositModal({
                     PayWithExchangeButton,
                     {
                       onClick: () => setView("exchange"),
-                      title: t6.payWithExchange.title,
+                      title: payWithExchangeTitle,
                       subtitle: t6.payWithExchange.subtitle,
                       exchanges,
                       loading: exchangesLoading
@@ -11375,8 +11388,8 @@ function DepositModal({
                         setAllExecutions(depositExecutions);
                         setView("tracker");
                       },
-                      title: "Deposit Tracker",
-                      subtitle: "Track your deposit progress",
+                      title: depositTrackerTitle,
+                      subtitle: depositTrackerSubTitle,
                       badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
                     }
                   )
@@ -11387,7 +11400,7 @@ function DepositModal({
               /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
                 DepositHeader,
                 {
-                  title: t6.transferCrypto.title,
+                  title: transferCryptoTitle,
                   showBack: showBackTransfer,
                   onBack: handleBack,
                   onClose: handleClose,
@@ -11438,7 +11451,7 @@ function DepositModal({
               /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
                 DepositHeader,
                 {
-                  title: selectedExecution ? "Deposit Details" : "Deposit Tracker",
+                  title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
                   showBack: showBackTracker,
                   onBack: handleBack,
                   onClose: handleClose
@@ -11466,7 +11479,7 @@ function DepositModal({
               /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
                 DepositHeader,
                 {
-                  title: cardView === "quotes" ? t6.quotes : t6.depositWithCard.title,
+                  title: cardView === "quotes" ? t6.quotes : depositWithCardTitle,
                   showBack: showBackCard,
                   onBack: handleBack,
                   onClose: handleClose,
@@ -11497,7 +11510,9 @@ function DepositModal({
                     onDepositError,
                     themeClass,
                     wallets,
-                    assetCdnUrl: projectConfig?.asset_cdn_url
+                    assetCdnUrl: projectConfig?.asset_cdn_url,
+                    hideDepositFlowInfo,
+                    hideDisplayDescription
                   }
                 ),
                 depositPoweredByFooter
@@ -11506,7 +11521,7 @@ function DepositModal({
               /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
                 DepositHeader,
                 {
-                  title: t6.payWithExchange.title,
+                  title: payWithExchangeTitle,
                   showBack: true,
                   onBack: handleBack,
                   onClose: handleClose

package/dist/index.mjs CHANGED Viewed

@@ -1311,6 +1311,10 @@ var en_default = {
     payWithExchange: {
       title: "Pay with Exchange",
       subtitle: "Transfer from exchange"
+    },
+    depositTracker: {
+      title: "Deposit Tracker",
+      subtitle: "Track your deposit progress"
     }
   },
   payWithExchange: {
@@ -2303,7 +2307,9 @@ function BuyWithCard({
   onDepositError,
   themeClass = "",
   wallets: externalWallets,
-  assetCdnUrl
+  assetCdnUrl,
+  hideDepositFlowInfo = false,
+  hideDisplayDescription = false
 }) {
   const { colors: colors2, fonts, components } = useTheme();
   const [amount, setAmount] = useState9("");
@@ -3122,7 +3128,7 @@ function BuyWithCard({
                   children: t.onramp.canCloseModal
                 }
               ),
-              /* @__PURE__ */ jsx10("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ jsxs8("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
+              !hideDepositFlowInfo && /* @__PURE__ */ jsx10("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ jsxs8("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
                 /* @__PURE__ */ jsxs8("div", { className: "uf-flex uf-flex-col uf-items-center uf-min-w-[72px]", children: [
                   /* @__PURE__ */ jsx10("div", { className: "uf-h-8 uf-flex uf-items-center uf-justify-center uf-mb-1.5", children: /* @__PURE__ */ jsx10(
                     "img",
@@ -3236,7 +3242,7 @@ function BuyWithCard({
                   )
                 ] })
               ] }) }),
-              /* @__PURE__ */ jsx10("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ jsx10(
+              !hideDisplayDescription && /* @__PURE__ */ jsx10("div", { className: "uf-w-full uf-p-4 uf-mb-4", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: /* @__PURE__ */ jsx10(
                 "p",
                 {
                   className: "uf-text-xs uf-leading-relaxed",
@@ -10980,11 +10986,18 @@ function DepositModal({
   depositConfirmationMode = "auto_ui",
   enableConnectWallet = false,
   enablePayWithExchange,
+  hideDepositFlowInfo = false,
+  hideDisplayDescription = false,
   onDepositSuccess,
   onDepositError,
   theme = "dark",
   hideOverlay = false,
-  initialScreen = "main"
+  initialScreen = "main",
+  transferCryptoTitle = t6.transferCrypto.title,
+  depositWithCardTitle = t6.depositWithCard.title,
+  payWithExchangeTitle = t6.payWithExchange.title,
+  depositTrackerTitle = t6.depositTracker.title,
+  depositTrackerSubTitle = t6.depositTracker.subtitle
 }) {
   const { colors: colors2, fonts, components } = useTheme();
   const effectiveInitialScreen = useMemo8(() => {
@@ -11322,7 +11335,7 @@ function DepositModal({
                     TransferCryptoButton,
                     {
                       onClick: () => setView("transfer"),
-                      title: t6.transferCrypto.title,
+                      title: transferCryptoTitle,
                       subtitle: t6.transferCrypto.subtitle,
                       featuredTokens: projectConfig?.transfer_crypto.networks
                     }
@@ -11341,7 +11354,7 @@ function DepositModal({
                     DepositWithCardButton,
                     {
                       onClick: () => setView("card"),
-                      title: t6.depositWithCard.title,
+                      title: depositWithCardTitle,
                       subtitle: t6.depositWithCard.subtitle,
                       paymentNetworks: projectConfig?.payment_networks.networks
                     }
@@ -11350,7 +11363,7 @@ function DepositModal({
                     PayWithExchangeButton,
                     {
                       onClick: () => setView("exchange"),
-                      title: t6.payWithExchange.title,
+                      title: payWithExchangeTitle,
                       subtitle: t6.payWithExchange.subtitle,
                       exchanges,
                       loading: exchangesLoading
@@ -11363,8 +11376,8 @@ function DepositModal({
                         setAllExecutions(depositExecutions);
                         setView("tracker");
                       },
-                      title: "Deposit Tracker",
-                      subtitle: "Track your deposit progress",
+                      title: depositTrackerTitle,
+                      subtitle: depositTrackerSubTitle,
                       badge: depositExecutions.length > 0 ? depositExecutions.length : void 0
                     }
                   )
@@ -11375,7 +11388,7 @@ function DepositModal({
               /* @__PURE__ */ jsx49(
                 DepositHeader,
                 {
-                  title: t6.transferCrypto.title,
+                  title: transferCryptoTitle,
                   showBack: showBackTransfer,
                   onBack: handleBack,
                   onClose: handleClose,
@@ -11426,7 +11439,7 @@ function DepositModal({
               /* @__PURE__ */ jsx49(
                 DepositHeader,
                 {
-                  title: selectedExecution ? "Deposit Details" : "Deposit Tracker",
+                  title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
                   showBack: showBackTracker,
                   onBack: handleBack,
                   onClose: handleClose
@@ -11454,7 +11467,7 @@ function DepositModal({
               /* @__PURE__ */ jsx49(
                 DepositHeader,
                 {
-                  title: cardView === "quotes" ? t6.quotes : t6.depositWithCard.title,
+                  title: cardView === "quotes" ? t6.quotes : depositWithCardTitle,
                   showBack: showBackCard,
                   onBack: handleBack,
                   onClose: handleClose,
@@ -11485,7 +11498,9 @@ function DepositModal({
                     onDepositError,
                     themeClass,
                     wallets,
-                    assetCdnUrl: projectConfig?.asset_cdn_url
+                    assetCdnUrl: projectConfig?.asset_cdn_url,
+                    hideDepositFlowInfo,
+                    hideDisplayDescription
                   }
                 ),
                 depositPoweredByFooter
@@ -11494,7 +11509,7 @@ function DepositModal({
               /* @__PURE__ */ jsx49(
                 DepositHeader,
                 {
-                  title: t6.payWithExchange.title,
+                  title: payWithExchangeTitle,
                   showBack: true,
                   onBack: handleBack,
                   onClose: handleClose

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@unifold/ui-react",
-  "version": "0.1.37",
+  "version": "0.1.38",
   "description": "Unifold UI React - Deposit and onramp components for React applications",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -43,7 +43,7 @@
     "lucide-react": "^0.454.0",
     "qr-code-styling": "^1.6.0-rc.1",
     "tailwind-merge": "^2.0.0",
-    "@unifold/core": "0.1.37"
+    "@unifold/core": "0.1.38"
   },
   "devDependencies": {
     "@solana/spl-token": "^0.3.8",