@rhinestone/deposit-modal 0.1.66 → 0.1.68

package/dist/styles.css

@@ -293,6 +293,7 @@
   flex-direction: column;
   min-height: 280px;
   overflow-y: auto;
+  overscroll-behavior: none;
 }
 
 .rs-modal-body::-webkit-scrollbar {
@@ -1189,7 +1190,7 @@
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  padding: 40px 12px;
+  padding: 24px 12px 16px;
   gap: 6px;
 }
 
@@ -1215,6 +1216,25 @@
   border-radius: 6px;
 }
 
+.rs-empty-disconnect {
+  margin-top: 8px;
+  padding: 0;
+  font-size: 11px;
+  font-weight: 400;
+  color: var(--rs-muted-foreground);
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  transition: color 0.15s;
+  font-family: inherit;
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
+
+.rs-empty-disconnect:hover {
+  color: var(--rs-foreground);
+}
+
 /* =============================================================================
    Link Styles
    ============================================================================= */
@@ -1350,17 +1370,17 @@
   width: 100%;
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: 6px;
 }
 
 .rs-connect-wallet-row {
   display: flex;
   align-items: center;
-  gap: 12px;
+  gap: 10px;
   width: 100%;
-  padding: 10px 12px;
+  padding: 12px 14px;
   border: 1px solid var(--rs-border-surface);
-  border-radius: var(--rs-radius-md);
+  border-radius: var(--rs-radius-lg);
   background: var(--rs-background-secondary);
   color: inherit;
   cursor: pointer;
@@ -1388,9 +1408,9 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 36px;
-  height: 36px;
-  min-width: 36px;
+  width: 32px;
+  height: 32px;
+  min-width: 32px;
   border-radius: 50%;
   background: var(--rs-surface);
   color: var(--rs-muted);
@@ -1400,8 +1420,8 @@
 }
 
 .rs-connect-wallet-icon svg {
-  width: 18px;
-  height: 18px;
+  width: 20px;
+  height: 20px;
 }
 
 .rs-connect-wallet-icon--selected {
@@ -1448,14 +1468,14 @@
 }
 
 .rs-connect-wallet-label {
-  font-size: 12px;
-  color: var(--rs-muted);
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--rs-foreground);
 }
 
 .rs-connect-wallet-address {
-  font-size: 13px;
-  font-weight: 600;
-  color: var(--rs-foreground);
+  font-size: 12px;
+  color: var(--rs-muted);
 }
 
 .rs-connect-wallet-manage {
@@ -2515,9 +2535,203 @@
 
 .rs-deposit-address-dropdown-label {
   font-size: 11px;
-  color: var(--rs-muted-foreground);
+  color: var(--rs-foreground);
   margin-bottom: 4px;
   font-weight: 500;
+  opacity: 0.65;
+}
+
+.rs-deposit-address-dropdown-label--with-min {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 6px;
+}
+
+.rs-deposit-address-min {
+  display: inline-flex;
+  align-items: center;
+  gap: 3px;
+}
+
+.rs-deposit-address-min-icon {
+  width: 12px;
+  height: 12px;
+  flex-shrink: 0;
+}
+
+.rs-price-impact {
+  width: 100%;
+  margin-top: 10px;
+  border-radius: var(--rs-radius-md);
+  background: var(--color-gray2);
+  overflow: hidden;
+}
+
+.rs-price-impact-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 10px 14px;
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  font-family: inherit;
+  color: var(--rs-foreground);
+  text-align: left;
+  transition: background-color 0.15s;
+}
+
+.rs-price-impact-header:hover {
+  background: var(--rs-surface);
+}
+
+.rs-price-impact-row-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 18px;
+  height: 18px;
+  color: var(--rs-muted-foreground);
+  flex-shrink: 0;
+}
+
+.rs-price-impact-row-icon svg {
+  width: 18px;
+  height: 18px;
+}
+
+.rs-price-impact-label {
+  font-size: 13px;
+  color: var(--rs-muted-foreground);
+  font-weight: 500;
+}
+
+.rs-price-impact-label strong {
+  color: var(--rs-foreground);
+  font-weight: 600;
+}
+
+.rs-price-impact-info {
+  color: var(--rs-muted-foreground);
+}
+
+.rs-price-impact-info .rs-tooltip-trigger svg {
+  width: 13px;
+  height: 13px;
+  display: block;
+}
+
+.rs-price-impact-chevron {
+  width: 14px;
+  height: 14px;
+  margin-left: auto;
+  color: var(--rs-muted-foreground);
+  flex-shrink: 0;
+  transition: transform 0.2s ease;
+}
+
+.rs-price-impact--open .rs-price-impact-chevron {
+  transform: rotate(180deg);
+}
+
+.rs-price-impact-panel {
+  display: grid;
+  grid-template-rows: 0fr;
+  transition: grid-template-rows 0.25s ease;
+}
+
+.rs-price-impact--open .rs-price-impact-panel {
+  grid-template-rows: 1fr;
+}
+
+.rs-price-impact-panel-inner {
+  overflow: hidden;
+  min-height: 0;
+}
+
+.rs-price-impact-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 14px 10px;
+  font-size: 13px;
+}
+
+.rs-price-impact-row:last-child {
+  padding-bottom: 12px;
+}
+
+/* =============================================================================
+   Tooltip
+   ============================================================================= */
+
+.rs-tooltip {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.rs-tooltip-trigger {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  color: inherit;
+  outline: none;
+  border-radius: 50%;
+}
+
+.rs-tooltip-trigger:focus-visible {
+  box-shadow: 0 0 0 2px var(--rs-primary-tint);
+}
+
+.rs-tooltip-bubble {
+  position: fixed;
+  z-index: 2147483000;
+  transform: translate(-50%, calc(-100% - 8px));
+  min-width: 120px;
+  max-width: 220px;
+  padding: 6px 8px;
+  background: #202020;
+  color: #fcfcfc;
+  border-radius: 6px;
+  font-size: 10.5px;
+  line-height: 1.35;
+  font-weight: 500;
+  text-align: center;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
+    sans-serif;
+  box-shadow:
+    0 4px 12px rgba(0, 0, 0, 0.18),
+    0 1px 3px rgba(0, 0, 0, 0.12);
+  pointer-events: none;
+  white-space: normal;
+  animation: rs-tooltip-in 0.12s ease-out;
+}
+
+.rs-tooltip-bubble::after {
+  content: "";
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  transform: translateX(-50%);
+  border: 5px solid transparent;
+  border-top-color: #202020;
+}
+
+@keyframes rs-tooltip-in {
+  from {
+    opacity: 0;
+    transform: translate(-50%, calc(-100% - 6px));
+  }
+  to {
+    opacity: 1;
+    transform: translate(-50%, calc(-100% - 8px));
+  }
 }
 
 .rs-deposit-address-dropdown-trigger {
@@ -2576,6 +2790,7 @@
   gap: 2px;
   max-height: 200px;
   overflow-y: auto;
+  overscroll-behavior: none;
   animation: rs-dropdown-in 0.12s ease-out;
 }
 
@@ -2610,28 +2825,30 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 16px;
+  padding: 4px;
   background: var(--rs-surface);
-  border-radius: var(--rs-radius-lg);
+  border-radius: var(--rs-radius-md);
   margin: 4px 0;
 }
 
+.rs-deposit-address-qr canvas,
 .rs-deposit-address-qr svg {
-  border-radius: var(--rs-radius-sm);
+  display: block;
+  border-radius: var(--rs-radius-md);
 }
 
 .rs-deposit-address-info {
   display: flex;
   flex-direction: column;
-  align-items: center;
-  gap: 8px;
+  gap: 0;
   width: 100%;
 }
 
 .rs-deposit-address-label {
   font-size: 13px;
-  font-weight: 500;
-  color: var(--rs-muted-foreground);
+  font-weight: 600;
+  color: var(--rs-muted);
+  margin-bottom: 8px;
 }
 
 .rs-deposit-address-value {
@@ -2641,31 +2858,35 @@
     monospace;
   color: var(--rs-foreground);
   word-break: break-all;
-  text-align: center;
-  padding: 10px 12px;
-  background: var(--rs-surface);
+  text-align: left;
+  padding: 8px 12px;
+  background: transparent;
   border: 1px solid var(--rs-border-surface);
-  border-radius: var(--rs-radius-sm);
+  border-radius: var(--rs-radius-sm) var(--rs-radius-sm) 0 0;
+  border-bottom: none;
   width: 100%;
 }
 
 .rs-deposit-address-copy {
   display: flex;
   align-items: center;
+  justify-content: center;
   gap: 6px;
+  width: 100%;
   padding: 8px 16px;
-  border: none;
-  background: transparent;
-  color: var(--rs-muted-foreground);
+  border: 1px solid var(--rs-border-surface);
+  border-radius: 0 0 var(--rs-radius-sm) var(--rs-radius-sm);
+  background: var(--color-gray2);
+  color: var(--rs-foreground);
   font-size: 13px;
   font-weight: 500;
   cursor: pointer;
-  transition: color 0.15s;
+  transition: background 0.15s;
   font-family: inherit;
 }
 
 .rs-deposit-address-copy:hover {
-  color: var(--rs-foreground);
+  background: var(--rs-surface);
 }
 
 .rs-deposit-address-balance {
@@ -2744,6 +2965,209 @@
   color: var(--rs-foreground);
 }
 
+/* =============================================================================
+   Deposit Notifications (QR flow toast cards)
+   ============================================================================= */
+
+.rs-step--with-notifications {
+  position: relative;
+}
+
+.rs-deposit-notifications {
+  position: absolute;
+  bottom: 12px;
+  left: 12px;
+  right: 12px;
+  z-index: 10;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  pointer-events: none;
+}
+
+.rs-deposit-notification {
+  pointer-events: auto;
+  background: var(--rs-background);
+  border: 1px solid var(--rs-border);
+  border-radius: var(--rs-radius-lg);
+  overflow: hidden;
+  box-shadow:
+    0 -4px 20px rgba(0, 0, 0, 0.10),
+    0 -1px 6px rgba(0, 0, 0, 0.06);
+  animation: rs-notification-slide-up 0.3s ease-out;
+}
+
+@keyframes rs-notification-slide-up {
+  from {
+    opacity: 0;
+    transform: translateY(16px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.rs-deposit-notification-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 10px;
+  padding: 14px 14px 0;
+}
+
+.rs-deposit-notification-icon {
+  flex-shrink: 0;
+  padding-top: 1px;
+}
+
+.rs-deposit-notification-badge {
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.rs-deposit-notification-badge svg {
+  width: 14px;
+  height: 14px;
+}
+
+.rs-deposit-notification-badge .rs-spinner {
+  width: 16px;
+  height: 16px;
+}
+
+.rs-deposit-notification-badge--complete {
+  background-color: var(--rs-success-tint);
+  color: var(--rs-success);
+}
+
+.rs-deposit-notification-badge--failed {
+  background-color: var(--rs-error-tint);
+  color: var(--rs-error);
+}
+
+.rs-deposit-notification-badge--processing {
+  background-color: var(--rs-primary-tint);
+  color: var(--rs-primary);
+}
+
+.rs-deposit-notification-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.rs-deposit-notification-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--rs-foreground);
+  line-height: 1.3;
+}
+
+.rs-deposit-notification-subtitle {
+  font-size: 12px;
+  color: var(--rs-muted-foreground);
+  line-height: 1.4;
+  margin-top: 2px;
+}
+
+.rs-deposit-notification-close {
+  flex-shrink: 0;
+  width: 24px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: none;
+  background: transparent;
+  color: var(--rs-muted-foreground);
+  cursor: pointer;
+  border-radius: 4px;
+  padding: 0;
+  transition: color 0.15s, background 0.15s;
+}
+
+.rs-deposit-notification-close:hover {
+  color: var(--rs-foreground);
+  background: var(--rs-surface);
+}
+
+.rs-deposit-notification-close svg {
+  width: 16px;
+  height: 16px;
+}
+
+.rs-deposit-notification-details {
+  margin: 10px 14px 0;
+  padding: 8px 10px;
+  background: var(--rs-surface);
+  border-radius: var(--rs-radius-sm);
+}
+
+.rs-deposit-notification-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 5px 0;
+}
+
+.rs-deposit-notification-row + .rs-deposit-notification-row {
+  border-top: 1px solid var(--rs-border-surface);
+}
+
+.rs-deposit-notification-label {
+  font-size: 12px;
+  color: var(--rs-muted-foreground);
+}
+
+.rs-deposit-notification-value {
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--rs-muted);
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
+}
+
+.rs-deposit-notification-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 3px;
+  color: var(--rs-muted);
+  text-decoration: none;
+  transition: color 0.15s;
+}
+
+.rs-deposit-notification-link:hover {
+  color: var(--rs-foreground);
+}
+
+.rs-deposit-notification-link-icon {
+  width: 10px;
+  height: 10px;
+}
+
+.rs-deposit-notification-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 10px 0;
+  border: none;
+  border-top: 1px solid var(--rs-border-surface);
+  background: transparent;
+  color: var(--rs-muted-foreground);
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: color 0.15s;
+  margin-top: 10px;
+}
+
+.rs-deposit-notification-toggle:hover {
+  color: var(--rs-foreground);
+}
+
 /* =============================================================================
    Step Indicator (numbered circles with dotted line)
    ============================================================================= */

package/dist/{types-ymKENnUK.d.ts → types-DGQzvl6v.d.ts}

@@ -74,6 +74,14 @@ interface ErrorEventData {
     message: string;
     code?: string;
 }
+interface OutputTokenRule {
+    match: {
+        chain?: string;
+        token?: string;
+        symbol?: string;
+    };
+    outputToken: string;
+}
 interface RouteConfig {
     sourceChains?: number[];
     sourceTokens?: string[];
@@ -93,6 +101,8 @@ interface DepositModalProps {
     defaultAmount?: string;
     recipient: Address;
     postBridgeActions?: PostBridgeAction[];
+    outputTokenRules?: OutputTokenRule[];
+    rejectUnmapped?: boolean;
     backendUrl?: string;
     solanaRpcUrl?: string;
     rhinestoneApiKey?: string;
@@ -224,4 +234,4 @@ type WithdrawEvent = {
 };
 type ModalEvent = DepositEvent | WithdrawEvent;
 
-export type { AssetOption as A, ChainId as C, DepositCompleteEventData as D, ErrorEventData as E, ModalEvent as M, OrderBookSwapAction as O, PostBridgeAction as P, RouteConfig as R, WithdrawCompleteEventData as W, ConnectedEventData as a, DepositEvent as b, DepositFailedEventData as c, DepositModalBranding as d, DepositModalProps as e, DepositModalTheme as f, DepositModalUIConfig as g, DepositSubmittedEventData as h, WithdrawEvent as i, WithdrawFailedEventData as j, WithdrawModalProps as k, WithdrawSubmittedEventData as l };
+export type { AssetOption as A, ChainId as C, DepositCompleteEventData as D, ErrorEventData as E, ModalEvent as M, OrderBookSwapAction as O, PostBridgeAction as P, RouteConfig as R, WithdrawCompleteEventData as W, ConnectedEventData as a, DepositEvent as b, DepositFailedEventData as c, DepositModalBranding as d, DepositModalProps as e, DepositModalTheme as f, DepositModalUIConfig as g, DepositSubmittedEventData as h, OutputTokenRule as i, WithdrawEvent as j, WithdrawFailedEventData as k, WithdrawModalProps as l, WithdrawSubmittedEventData as m };

package/dist/{types-DjaZ9sa8.d.cts → types-DJ1fzNC7.d.cts}

@@ -74,6 +74,14 @@ interface ErrorEventData {
     message: string;
     code?: string;
 }
+interface OutputTokenRule {
+    match: {
+        chain?: string;
+        token?: string;
+        symbol?: string;
+    };
+    outputToken: string;
+}
 interface RouteConfig {
     sourceChains?: number[];
     sourceTokens?: string[];
@@ -93,6 +101,8 @@ interface DepositModalProps {
     defaultAmount?: string;
     recipient: Address;
     postBridgeActions?: PostBridgeAction[];
+    outputTokenRules?: OutputTokenRule[];
+    rejectUnmapped?: boolean;
     backendUrl?: string;
     solanaRpcUrl?: string;
     rhinestoneApiKey?: string;
@@ -224,4 +234,4 @@ type WithdrawEvent = {
 };
 type ModalEvent = DepositEvent | WithdrawEvent;
 
-export type { AssetOption as A, ChainId as C, DepositCompleteEventData as D, ErrorEventData as E, ModalEvent as M, OrderBookSwapAction as O, PostBridgeAction as P, RouteConfig as R, WithdrawCompleteEventData as W, ConnectedEventData as a, DepositEvent as b, DepositFailedEventData as c, DepositModalBranding as d, DepositModalProps as e, DepositModalTheme as f, DepositModalUIConfig as g, DepositSubmittedEventData as h, WithdrawEvent as i, WithdrawFailedEventData as j, WithdrawModalProps as k, WithdrawSubmittedEventData as l };
+export type { AssetOption as A, ChainId as C, DepositCompleteEventData as D, ErrorEventData as E, ModalEvent as M, OrderBookSwapAction as O, PostBridgeAction as P, RouteConfig as R, WithdrawCompleteEventData as W, ConnectedEventData as a, DepositEvent as b, DepositFailedEventData as c, DepositModalBranding as d, DepositModalProps as e, DepositModalTheme as f, DepositModalUIConfig as g, DepositSubmittedEventData as h, OutputTokenRule as i, WithdrawEvent as j, WithdrawFailedEventData as k, WithdrawModalProps as l, WithdrawSubmittedEventData as m };

package/dist/withdraw.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunk75LRORPOcjs = require('./chunk-75LRORPO.cjs');
-require('./chunk-JZWCK7C3.cjs');
-require('./chunk-R6U6BHCV.cjs');
+var _chunkLTLFJPHOcjs = require('./chunk-LTLFJPHO.cjs');
+require('./chunk-FLVSQDP4.cjs');
+require('./chunk-MUWVDVY4.cjs');
 
 
-exports.WithdrawModal = _chunk75LRORPOcjs.WithdrawModal;
+exports.WithdrawModal = _chunkLTLFJPHOcjs.WithdrawModal;

package/dist/withdraw.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { k as WithdrawModalProps } from './types-DjaZ9sa8.cjs';
-export { A as AssetOption, a as ConnectedEventData, E as ErrorEventData, W as WithdrawCompleteEventData, j as WithdrawFailedEventData, l as WithdrawSubmittedEventData } from './types-DjaZ9sa8.cjs';
+import { l as WithdrawModalProps } from './types-DJ1fzNC7.cjs';
+export { A as AssetOption, a as ConnectedEventData, E as ErrorEventData, W as WithdrawCompleteEventData, k as WithdrawFailedEventData, m as WithdrawSubmittedEventData } from './types-DJ1fzNC7.cjs';
 export { SafeTransactionRequest } from './safe.cjs';
 import 'viem';
 

package/dist/withdraw.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { k as WithdrawModalProps } from './types-ymKENnUK.js';
-export { A as AssetOption, a as ConnectedEventData, E as ErrorEventData, W as WithdrawCompleteEventData, j as WithdrawFailedEventData, l as WithdrawSubmittedEventData } from './types-ymKENnUK.js';
+import { l as WithdrawModalProps } from './types-DGQzvl6v.js';
+export { A as AssetOption, a as ConnectedEventData, E as ErrorEventData, W as WithdrawCompleteEventData, k as WithdrawFailedEventData, m as WithdrawSubmittedEventData } from './types-DGQzvl6v.js';
 export { SafeTransactionRequest } from './safe.js';
 import 'viem';
 

package/dist/withdraw.mjs

@@ -1,8 +1,8 @@
 import {
   WithdrawModal
-} from "./chunk-CULXRW6U.mjs";
-import "./chunk-FWGLRTWF.mjs";
-import "./chunk-CIXHTOO3.mjs";
+} from "./chunk-5FDIQNJJ.mjs";
+import "./chunk-IUW3SJQT.mjs";
+import "./chunk-SDZKKUCJ.mjs";
 export {
   WithdrawModal
 };