@loafmarkets/ui 0.1.325 → 0.1.327

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.
package/dist/index.d.mts CHANGED
@@ -943,6 +943,29 @@ type AssetSelectorBarProps = {
943
943
  };
944
944
  declare function AssetSelectorBar({ propertyName, tokenPrice, offeringValuation, metrics: metricsProp, currentTokenName, selectorItems, onSelect, trailing, imageUrl, }: AssetSelectorBarProps): react_jsx_runtime.JSX.Element;
945
945
 
946
+ type ToastVariant = 'success' | 'error' | 'info' | 'pending' | 'sell';
947
+ type ToastData = {
948
+ id: string;
949
+ variant: ToastVariant;
950
+ title: string;
951
+ /** Human-readable amount e.g. "20,000 USDC" */
952
+ amount?: string;
953
+ /** On-chain tx hash — shown truncated with a block explorer link */
954
+ txHash?: string;
955
+ /** Explorer base URL, defaults to Base Sepolia */
956
+ explorerUrl?: string;
957
+ /** Auto-dismiss after ms. 0 = never. Default 6000 */
958
+ duration?: number;
959
+ };
960
+ type ToastContextValue = {
961
+ toast: (data: Omit<ToastData, 'id'>) => string;
962
+ dismiss: (id: string) => void;
963
+ };
964
+ declare function ToastProvider({ children }: {
965
+ children: React__default.ReactNode;
966
+ }): react_jsx_runtime.JSX.Element;
967
+ declare function useToast(): ToastContextValue;
968
+
946
969
  type IpoStatus = 'PENDING' | 'LIVE' | 'CLOSED' | 'CANCELLED';
947
970
  type SaleData = {
948
971
  loading: boolean;
@@ -1013,8 +1036,9 @@ type PropertyBuyProps = {
1013
1036
  };
1014
1037
  newsItems?: PropertyNewsItem[];
1015
1038
  newsConnectionStatus?: 'live' | 'connecting';
1039
+ toast: ReturnType<typeof useToast>['toast'];
1016
1040
  };
1017
- declare function PropertyBuy({ propertyName, propertyLocation: propertyLocationLabel, tokenDisplayName, tokenSymbol, tokenName, isAuthenticated, onSignIn, saleData, walletUsdcBalance, walletPropertyTokenBalance, onPurchase, purchaseStatus, purchaseError, onDeposit, opensAt, isPrivateClient, recentOrders, ordersAllocated, subscribers, isLoadingActivity, selectorItems, onSelectorSelect, onVerifyIdentity, portfolioActivity, newsItems, newsConnectionStatus, }: PropertyBuyProps): react_jsx_runtime.JSX.Element;
1041
+ declare function PropertyBuy({ propertyName, propertyLocation: propertyLocationLabel, tokenDisplayName, tokenSymbol, tokenName, isAuthenticated, onSignIn, saleData, walletUsdcBalance, walletPropertyTokenBalance, onPurchase, purchaseStatus, purchaseError, onDeposit, opensAt, isPrivateClient, recentOrders, ordersAllocated, subscribers, isLoadingActivity, selectorItems, onSelectorSelect, onVerifyIdentity, portfolioActivity, newsItems, newsConnectionStatus, toast, }: PropertyBuyProps): react_jsx_runtime.JSX.Element;
1018
1042
 
1019
1043
  type OfferingProgressCardProps = {
1020
1044
  ipoStarted: boolean;
@@ -1125,29 +1149,6 @@ type PropertyPhotoGalleryProps = {
1125
1149
  };
1126
1150
  declare function PropertyPhotoGallery({ isOpen, onClose, startIndex, title, subtitle, images, }: PropertyPhotoGalleryProps): react_jsx_runtime.JSX.Element | null;
1127
1151
 
1128
- type ToastVariant = 'success' | 'error' | 'info' | 'pending' | 'sell';
1129
- type ToastData = {
1130
- id: string;
1131
- variant: ToastVariant;
1132
- title: string;
1133
- /** Human-readable amount e.g. "20,000 USDC" */
1134
- amount?: string;
1135
- /** On-chain tx hash — shown truncated with a block explorer link */
1136
- txHash?: string;
1137
- /** Explorer base URL, defaults to Base Sepolia */
1138
- explorerUrl?: string;
1139
- /** Auto-dismiss after ms. 0 = never. Default 6000 */
1140
- duration?: number;
1141
- };
1142
- type ToastContextValue = {
1143
- toast: (data: Omit<ToastData, 'id'>) => string;
1144
- dismiss: (id: string) => void;
1145
- };
1146
- declare function ToastProvider({ children }: {
1147
- children: React__default.ReactNode;
1148
- }): react_jsx_runtime.JSX.Element;
1149
- declare function useToast(): ToastContextValue;
1150
-
1151
1152
  type UseAdaptivePollingOptions = {
1152
1153
  enabled: boolean;
1153
1154
  onPoll: () => void | Promise<void>;
package/dist/index.d.ts CHANGED
@@ -943,6 +943,29 @@ type AssetSelectorBarProps = {
943
943
  };
944
944
  declare function AssetSelectorBar({ propertyName, tokenPrice, offeringValuation, metrics: metricsProp, currentTokenName, selectorItems, onSelect, trailing, imageUrl, }: AssetSelectorBarProps): react_jsx_runtime.JSX.Element;
945
945
 
946
+ type ToastVariant = 'success' | 'error' | 'info' | 'pending' | 'sell';
947
+ type ToastData = {
948
+ id: string;
949
+ variant: ToastVariant;
950
+ title: string;
951
+ /** Human-readable amount e.g. "20,000 USDC" */
952
+ amount?: string;
953
+ /** On-chain tx hash — shown truncated with a block explorer link */
954
+ txHash?: string;
955
+ /** Explorer base URL, defaults to Base Sepolia */
956
+ explorerUrl?: string;
957
+ /** Auto-dismiss after ms. 0 = never. Default 6000 */
958
+ duration?: number;
959
+ };
960
+ type ToastContextValue = {
961
+ toast: (data: Omit<ToastData, 'id'>) => string;
962
+ dismiss: (id: string) => void;
963
+ };
964
+ declare function ToastProvider({ children }: {
965
+ children: React__default.ReactNode;
966
+ }): react_jsx_runtime.JSX.Element;
967
+ declare function useToast(): ToastContextValue;
968
+
946
969
  type IpoStatus = 'PENDING' | 'LIVE' | 'CLOSED' | 'CANCELLED';
947
970
  type SaleData = {
948
971
  loading: boolean;
@@ -1013,8 +1036,9 @@ type PropertyBuyProps = {
1013
1036
  };
1014
1037
  newsItems?: PropertyNewsItem[];
1015
1038
  newsConnectionStatus?: 'live' | 'connecting';
1039
+ toast: ReturnType<typeof useToast>['toast'];
1016
1040
  };
1017
- declare function PropertyBuy({ propertyName, propertyLocation: propertyLocationLabel, tokenDisplayName, tokenSymbol, tokenName, isAuthenticated, onSignIn, saleData, walletUsdcBalance, walletPropertyTokenBalance, onPurchase, purchaseStatus, purchaseError, onDeposit, opensAt, isPrivateClient, recentOrders, ordersAllocated, subscribers, isLoadingActivity, selectorItems, onSelectorSelect, onVerifyIdentity, portfolioActivity, newsItems, newsConnectionStatus, }: PropertyBuyProps): react_jsx_runtime.JSX.Element;
1041
+ declare function PropertyBuy({ propertyName, propertyLocation: propertyLocationLabel, tokenDisplayName, tokenSymbol, tokenName, isAuthenticated, onSignIn, saleData, walletUsdcBalance, walletPropertyTokenBalance, onPurchase, purchaseStatus, purchaseError, onDeposit, opensAt, isPrivateClient, recentOrders, ordersAllocated, subscribers, isLoadingActivity, selectorItems, onSelectorSelect, onVerifyIdentity, portfolioActivity, newsItems, newsConnectionStatus, toast, }: PropertyBuyProps): react_jsx_runtime.JSX.Element;
1018
1042
 
1019
1043
  type OfferingProgressCardProps = {
1020
1044
  ipoStarted: boolean;
@@ -1125,29 +1149,6 @@ type PropertyPhotoGalleryProps = {
1125
1149
  };
1126
1150
  declare function PropertyPhotoGallery({ isOpen, onClose, startIndex, title, subtitle, images, }: PropertyPhotoGalleryProps): react_jsx_runtime.JSX.Element | null;
1127
1151
 
1128
- type ToastVariant = 'success' | 'error' | 'info' | 'pending' | 'sell';
1129
- type ToastData = {
1130
- id: string;
1131
- variant: ToastVariant;
1132
- title: string;
1133
- /** Human-readable amount e.g. "20,000 USDC" */
1134
- amount?: string;
1135
- /** On-chain tx hash — shown truncated with a block explorer link */
1136
- txHash?: string;
1137
- /** Explorer base URL, defaults to Base Sepolia */
1138
- explorerUrl?: string;
1139
- /** Auto-dismiss after ms. 0 = never. Default 6000 */
1140
- duration?: number;
1141
- };
1142
- type ToastContextValue = {
1143
- toast: (data: Omit<ToastData, 'id'>) => string;
1144
- dismiss: (id: string) => void;
1145
- };
1146
- declare function ToastProvider({ children }: {
1147
- children: React__default.ReactNode;
1148
- }): react_jsx_runtime.JSX.Element;
1149
- declare function useToast(): ToastContextValue;
1150
-
1151
1152
  type UseAdaptivePollingOptions = {
1152
1153
  enabled: boolean;
1153
1154
  onPoll: () => void | Promise<void>;
package/dist/index.js CHANGED
@@ -12431,192 +12431,6 @@ var HomeSpinner = styled9__default.default.span`
12431
12431
  to { transform: rotate(360deg); }
12432
12432
  }
12433
12433
  `;
12434
- var slideIn2 = styled9.keyframes`
12435
- from { transform: translateX(110%); opacity: 0; }
12436
- to { transform: translateX(0); opacity: 1; }
12437
- `;
12438
- var slideOut2 = styled9.keyframes`
12439
- from { transform: translateX(0); opacity: 1; }
12440
- to { transform: translateX(110%); opacity: 0; }
12441
- `;
12442
- var progressShrink = styled9.keyframes`
12443
- from { width: 100%; }
12444
- to { width: 0%; }
12445
- `;
12446
- var VARIANT_COLORS = {
12447
- success: { accent: "#0ecb81", icon: "\u2713" },
12448
- error: { accent: "#f6465d", icon: "\u2715" },
12449
- sell: { accent: "#f6465d", icon: "\u2713" },
12450
- info: { accent: "#E6C656", icon: "\u2139" },
12451
- pending: { accent: "#7EB3E6", icon: "\u25CC" }
12452
- };
12453
- var Wrapper2 = styled9__default.default.div`
12454
- position: relative;
12455
- display: flex;
12456
- flex-direction: column;
12457
- gap: 0;
12458
- width: 340px;
12459
- background: #0d0f1a;
12460
- border: 1px solid rgba(255, 255, 255, 0.08);
12461
- border-radius: 10px;
12462
- overflow: hidden;
12463
- box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255,255,255,0.04);
12464
- animation: ${({ $exiting }) => $exiting ? styled9.css`${slideOut2} 0.28s cubic-bezier(0.4,0,1,1) forwards` : styled9.css`${slideIn2} 0.32s cubic-bezier(0,0,0.2,1) forwards`};
12465
- pointer-events: all;
12466
- `;
12467
- var Body = styled9__default.default.div`
12468
- display: flex;
12469
- align-items: flex-start;
12470
- gap: 12px;
12471
- padding: 14px 16px 12px;
12472
- `;
12473
- var IconDot = styled9__default.default.div`
12474
- flex-shrink: 0;
12475
- width: 28px;
12476
- height: 28px;
12477
- border-radius: 50%;
12478
- background: ${({ $color }) => $color}1a;
12479
- border: 1px solid ${({ $color }) => $color}55;
12480
- display: flex;
12481
- align-items: center;
12482
- justify-content: center;
12483
- font-size: 0.75rem;
12484
- font-weight: 700;
12485
- color: ${({ $color }) => $color};
12486
- margin-top: 1px;
12487
- `;
12488
- var Content = styled9__default.default.div`
12489
- flex: 1;
12490
- min-width: 0;
12491
- `;
12492
- var Title2 = styled9__default.default.p`
12493
- margin: 0 0 2px;
12494
- font-size: 0.8rem;
12495
- font-weight: 600;
12496
- color: #fff;
12497
- letter-spacing: 0.01em;
12498
- `;
12499
- var Amount = styled9__default.default.p`
12500
- margin: 0 0 6px;
12501
- font-size: 1.05rem;
12502
- font-weight: 700;
12503
- color: #E6C656;
12504
- letter-spacing: -0.01em;
12505
- `;
12506
- var TxRow = styled9__default.default.a`
12507
- display: inline-flex;
12508
- align-items: center;
12509
- gap: 5px;
12510
- font-family: 'IBM Plex Mono', 'Space Mono', monospace;
12511
- font-size: 0.68rem;
12512
- color: rgba(255, 255, 255, 0.4);
12513
- text-decoration: none;
12514
- transition: color 0.15s;
12515
- &:hover {
12516
- color: #7EB3E6;
12517
- }
12518
- `;
12519
- var TxArrow = styled9__default.default.span`
12520
- font-size: 0.6rem;
12521
- opacity: 0.6;
12522
- `;
12523
- var CloseBtn = styled9__default.default.button`
12524
- flex-shrink: 0;
12525
- background: none;
12526
- border: none;
12527
- padding: 2px 4px;
12528
- cursor: pointer;
12529
- color: rgba(255, 255, 255, 0.25);
12530
- font-size: 0.9rem;
12531
- line-height: 1;
12532
- transition: color 0.15s;
12533
- &:hover { color: rgba(255, 255, 255, 0.7); }
12534
- `;
12535
- var ProgressBar = styled9__default.default.div`
12536
- height: 2px;
12537
- background: rgba(255, 255, 255, 0.06);
12538
- position: relative;
12539
- &::after {
12540
- content: '';
12541
- position: absolute;
12542
- left: 0;
12543
- top: 0;
12544
- height: 100%;
12545
- background: ${({ $color }) => $color};
12546
- animation: ${styled9.css`${progressShrink} ${({ $duration }) => $duration}ms linear forwards`};
12547
- }
12548
- `;
12549
- var Container2 = styled9__default.default.div`
12550
- position: fixed;
12551
- bottom: 24px;
12552
- right: 24px;
12553
- z-index: 9999;
12554
- display: flex;
12555
- flex-direction: column-reverse;
12556
- gap: 10px;
12557
- pointer-events: none;
12558
- `;
12559
- var DEFAULT_EXPLORER = "https://sepolia.basescan.org/tx/";
12560
- function truncateHash(hash) {
12561
- return `${hash.slice(0, 6)}\u2026${hash.slice(-4)}`;
12562
- }
12563
- function ToastItem({ toast, onDismiss }) {
12564
- const [exiting, setExiting] = React5.useState(false);
12565
- const timerRef = React5.useRef(null);
12566
- const dismiss = React5.useCallback(() => {
12567
- setExiting(true);
12568
- setTimeout(() => onDismiss(toast.id), 280);
12569
- }, [onDismiss, toast.id]);
12570
- React5.useEffect(() => {
12571
- const duration2 = toast.duration ?? 6e3;
12572
- if (duration2 > 0) {
12573
- timerRef.current = setTimeout(dismiss, duration2);
12574
- }
12575
- return () => {
12576
- if (timerRef.current) clearTimeout(timerRef.current);
12577
- };
12578
- }, [dismiss, toast.duration]);
12579
- const { accent, icon } = VARIANT_COLORS[toast.variant];
12580
- const duration = toast.duration ?? 6e3;
12581
- const explorerBase = toast.explorerUrl ?? DEFAULT_EXPLORER;
12582
- const txUrl = toast.txHash ? `${explorerBase}${toast.txHash}` : void 0;
12583
- return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper2, { $exiting: exiting, children: [
12584
- /* @__PURE__ */ jsxRuntime.jsxs(Body, { children: [
12585
- /* @__PURE__ */ jsxRuntime.jsx(IconDot, { $color: accent, children: icon }),
12586
- /* @__PURE__ */ jsxRuntime.jsxs(Content, { children: [
12587
- /* @__PURE__ */ jsxRuntime.jsx(Title2, { children: toast.title }),
12588
- toast.amount && /* @__PURE__ */ jsxRuntime.jsx(Amount, { children: toast.amount }),
12589
- toast.txHash && txUrl && /* @__PURE__ */ jsxRuntime.jsxs(TxRow, { href: txUrl, target: "_blank", rel: "noopener noreferrer", children: [
12590
- truncateHash(toast.txHash),
12591
- /* @__PURE__ */ jsxRuntime.jsx(TxArrow, { children: "\u2197" })
12592
- ] })
12593
- ] }),
12594
- /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { type: "button", onClick: dismiss, "aria-label": "Dismiss", children: "\u2715" })
12595
- ] }),
12596
- duration > 0 && /* @__PURE__ */ jsxRuntime.jsx(ProgressBar, { $color: accent, $duration: duration })
12597
- ] });
12598
- }
12599
- var ToastContext = React5.createContext(null);
12600
- function ToastProvider({ children }) {
12601
- const [toasts, setToasts] = React5.useState([]);
12602
- const addToast = React5.useCallback((data) => {
12603
- const id = `toast-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`;
12604
- setToasts((prev) => [...prev, { ...data, id }]);
12605
- return id;
12606
- }, []);
12607
- const dismiss = React5.useCallback((id) => {
12608
- setToasts((prev) => prev.filter((t) => t.id !== id));
12609
- }, []);
12610
- return /* @__PURE__ */ jsxRuntime.jsxs(ToastContext.Provider, { value: { toast: addToast, dismiss }, children: [
12611
- children,
12612
- /* @__PURE__ */ jsxRuntime.jsx(Container2, { children: toasts.map((t) => /* @__PURE__ */ jsxRuntime.jsx(ToastItem, { toast: t, onDismiss: dismiss }, t.id)) })
12613
- ] });
12614
- }
12615
- function useToast() {
12616
- const ctx = React5.useContext(ToastContext);
12617
- if (!ctx) throw new Error("useToast must be used within a ToastProvider");
12618
- return ctx;
12619
- }
12620
12434
  function useCountdown(opensAt) {
12621
12435
  const [now, setNow] = React5.useState(() => Math.floor(Date.now() / 1e3));
12622
12436
  React5.useEffect(() => {
@@ -12665,9 +12479,9 @@ function OrderPanel({
12665
12479
  onDeposit,
12666
12480
  onVerifyIdentity,
12667
12481
  tokenDisplayName,
12668
- tokenSymbol
12482
+ tokenSymbol,
12483
+ toast
12669
12484
  }) {
12670
- const { toast } = useToast();
12671
12485
  const countdown = useCountdown(opensAt);
12672
12486
  const [payInputValue, setPayInputValue] = React5.useState("");
12673
12487
  const [receiveInputValue, setReceiveInputValue] = React5.useState("");
@@ -14166,7 +13980,7 @@ function PortfolioActivityPanel({
14166
13980
  const handleTabChange = (tab) => {
14167
13981
  setActiveTab(tab);
14168
13982
  };
14169
- return /* @__PURE__ */ jsxRuntime.jsxs(Container3, { className, style, children: [
13983
+ return /* @__PURE__ */ jsxRuntime.jsxs(Container2, { className, style, children: [
14170
13984
  /* @__PURE__ */ jsxRuntime.jsx(PanelTitle, { children: "Activity" }),
14171
13985
  /* @__PURE__ */ jsxRuntime.jsxs(TabContainer, { children: [
14172
13986
  showPositionsTab && /* @__PURE__ */ jsxRuntime.jsxs(Tab, { $active: activeTab === "positions", onClick: () => handleTabChange("positions"), children: [
@@ -14349,11 +14163,11 @@ function PortfolioActivityPanel({
14349
14163
  ] })
14350
14164
  ] }),
14351
14165
  onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
14352
- /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
14166
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
14353
14167
  e.stopPropagation();
14354
14168
  onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice);
14355
14169
  }, children: "Market Sell" }),
14356
- /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
14170
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
14357
14171
  e.stopPropagation();
14358
14172
  onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
14359
14173
  }, children: "Limit Sell" })
@@ -14590,7 +14404,7 @@ function PortfolioActivityPanel({
14590
14404
  ] }) })
14591
14405
  ] });
14592
14406
  }
14593
- var Container3 = styled9__default.default.div`
14407
+ var Container2 = styled9__default.default.div`
14594
14408
  display: flex;
14595
14409
  flex-direction: column;
14596
14410
  overflow: hidden;
@@ -15014,7 +14828,7 @@ var CloseActions = styled9__default.default.div`
15014
14828
  gap: 0.35rem;
15015
14829
  align-items: center;
15016
14830
  `;
15017
- var CloseBtn2 = styled9__default.default.button`
14831
+ var CloseBtn = styled9__default.default.button`
15018
14832
  background: transparent;
15019
14833
  border: 1px solid rgba(230, 200, 126, 0.25);
15020
14834
  border-radius: 4px;
@@ -15368,7 +15182,8 @@ function PropertyBuy({
15368
15182
  onVerifyIdentity,
15369
15183
  portfolioActivity,
15370
15184
  newsItems = [],
15371
- newsConnectionStatus
15185
+ newsConnectionStatus,
15186
+ toast
15372
15187
  }) {
15373
15188
  const [sliderValue, setSliderValue] = React5.useState(0);
15374
15189
  const [availableBalance, setAvailableBalance] = React5.useState(walletUsdcBalance ?? 0);
@@ -15603,7 +15418,8 @@ function PropertyBuy({
15603
15418
  hasInsufficientFunds,
15604
15419
  onPlaceAnotherOrder: handlePlaceAnotherOrder,
15605
15420
  onDeposit,
15606
- onVerifyIdentity
15421
+ onVerifyIdentity,
15422
+ toast
15607
15423
  }
15608
15424
  ),
15609
15425
  purchaseError && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: "0.75rem", padding: "0.75rem 1rem", borderRadius: "8px", background: "rgba(246,70,93,0.1)", border: "1px solid rgba(246,70,93,0.3)", color: "#f6465d", fontSize: "0.8rem", fontWeight: 500 }, children: purchaseError })
@@ -18268,6 +18084,192 @@ function GalleryContent({ galleryImages, startIndex, title, subtitle, onClose })
18268
18084
  }
18269
18085
  );
18270
18086
  }
18087
+ var slideIn2 = styled9.keyframes`
18088
+ from { transform: translateX(110%); opacity: 0; }
18089
+ to { transform: translateX(0); opacity: 1; }
18090
+ `;
18091
+ var slideOut2 = styled9.keyframes`
18092
+ from { transform: translateX(0); opacity: 1; }
18093
+ to { transform: translateX(110%); opacity: 0; }
18094
+ `;
18095
+ var progressShrink = styled9.keyframes`
18096
+ from { width: 100%; }
18097
+ to { width: 0%; }
18098
+ `;
18099
+ var VARIANT_COLORS = {
18100
+ success: { accent: "#0ecb81", icon: "\u2713" },
18101
+ error: { accent: "#f6465d", icon: "\u2715" },
18102
+ sell: { accent: "#f6465d", icon: "\u2713" },
18103
+ info: { accent: "#E6C656", icon: "\u2139" },
18104
+ pending: { accent: "#7EB3E6", icon: "\u25CC" }
18105
+ };
18106
+ var Wrapper2 = styled9__default.default.div`
18107
+ position: relative;
18108
+ display: flex;
18109
+ flex-direction: column;
18110
+ gap: 0;
18111
+ width: 340px;
18112
+ background: #0d0f1a;
18113
+ border: 1px solid rgba(255, 255, 255, 0.08);
18114
+ border-radius: 10px;
18115
+ overflow: hidden;
18116
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255,255,255,0.04);
18117
+ animation: ${({ $exiting }) => $exiting ? styled9.css`${slideOut2} 0.28s cubic-bezier(0.4,0,1,1) forwards` : styled9.css`${slideIn2} 0.32s cubic-bezier(0,0,0.2,1) forwards`};
18118
+ pointer-events: all;
18119
+ `;
18120
+ var Body = styled9__default.default.div`
18121
+ display: flex;
18122
+ align-items: flex-start;
18123
+ gap: 12px;
18124
+ padding: 14px 16px 12px;
18125
+ `;
18126
+ var IconDot = styled9__default.default.div`
18127
+ flex-shrink: 0;
18128
+ width: 28px;
18129
+ height: 28px;
18130
+ border-radius: 50%;
18131
+ background: ${({ $color }) => $color}1a;
18132
+ border: 1px solid ${({ $color }) => $color}55;
18133
+ display: flex;
18134
+ align-items: center;
18135
+ justify-content: center;
18136
+ font-size: 0.75rem;
18137
+ font-weight: 700;
18138
+ color: ${({ $color }) => $color};
18139
+ margin-top: 1px;
18140
+ `;
18141
+ var Content = styled9__default.default.div`
18142
+ flex: 1;
18143
+ min-width: 0;
18144
+ `;
18145
+ var Title2 = styled9__default.default.p`
18146
+ margin: 0 0 2px;
18147
+ font-size: 0.8rem;
18148
+ font-weight: 600;
18149
+ color: #fff;
18150
+ letter-spacing: 0.01em;
18151
+ `;
18152
+ var Amount = styled9__default.default.p`
18153
+ margin: 0 0 6px;
18154
+ font-size: 1.05rem;
18155
+ font-weight: 700;
18156
+ color: #E6C656;
18157
+ letter-spacing: -0.01em;
18158
+ `;
18159
+ var TxRow = styled9__default.default.a`
18160
+ display: inline-flex;
18161
+ align-items: center;
18162
+ gap: 5px;
18163
+ font-family: 'IBM Plex Mono', 'Space Mono', monospace;
18164
+ font-size: 0.68rem;
18165
+ color: rgba(255, 255, 255, 0.4);
18166
+ text-decoration: none;
18167
+ transition: color 0.15s;
18168
+ &:hover {
18169
+ color: #7EB3E6;
18170
+ }
18171
+ `;
18172
+ var TxArrow = styled9__default.default.span`
18173
+ font-size: 0.6rem;
18174
+ opacity: 0.6;
18175
+ `;
18176
+ var CloseBtn2 = styled9__default.default.button`
18177
+ flex-shrink: 0;
18178
+ background: none;
18179
+ border: none;
18180
+ padding: 2px 4px;
18181
+ cursor: pointer;
18182
+ color: rgba(255, 255, 255, 0.25);
18183
+ font-size: 0.9rem;
18184
+ line-height: 1;
18185
+ transition: color 0.15s;
18186
+ &:hover { color: rgba(255, 255, 255, 0.7); }
18187
+ `;
18188
+ var ProgressBar = styled9__default.default.div`
18189
+ height: 2px;
18190
+ background: rgba(255, 255, 255, 0.06);
18191
+ position: relative;
18192
+ &::after {
18193
+ content: '';
18194
+ position: absolute;
18195
+ left: 0;
18196
+ top: 0;
18197
+ height: 100%;
18198
+ background: ${({ $color }) => $color};
18199
+ animation: ${styled9.css`${progressShrink} ${({ $duration }) => $duration}ms linear forwards`};
18200
+ }
18201
+ `;
18202
+ var Container3 = styled9__default.default.div`
18203
+ position: fixed;
18204
+ bottom: 24px;
18205
+ right: 24px;
18206
+ z-index: 9999;
18207
+ display: flex;
18208
+ flex-direction: column-reverse;
18209
+ gap: 10px;
18210
+ pointer-events: none;
18211
+ `;
18212
+ var DEFAULT_EXPLORER = "https://sepolia.basescan.org/tx/";
18213
+ function truncateHash(hash) {
18214
+ return `${hash.slice(0, 6)}\u2026${hash.slice(-4)}`;
18215
+ }
18216
+ function ToastItem({ toast, onDismiss }) {
18217
+ const [exiting, setExiting] = React5.useState(false);
18218
+ const timerRef = React5.useRef(null);
18219
+ const dismiss = React5.useCallback(() => {
18220
+ setExiting(true);
18221
+ setTimeout(() => onDismiss(toast.id), 280);
18222
+ }, [onDismiss, toast.id]);
18223
+ React5.useEffect(() => {
18224
+ const duration2 = toast.duration ?? 6e3;
18225
+ if (duration2 > 0) {
18226
+ timerRef.current = setTimeout(dismiss, duration2);
18227
+ }
18228
+ return () => {
18229
+ if (timerRef.current) clearTimeout(timerRef.current);
18230
+ };
18231
+ }, [dismiss, toast.duration]);
18232
+ const { accent, icon } = VARIANT_COLORS[toast.variant];
18233
+ const duration = toast.duration ?? 6e3;
18234
+ const explorerBase = toast.explorerUrl ?? DEFAULT_EXPLORER;
18235
+ const txUrl = toast.txHash ? `${explorerBase}${toast.txHash}` : void 0;
18236
+ return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper2, { $exiting: exiting, children: [
18237
+ /* @__PURE__ */ jsxRuntime.jsxs(Body, { children: [
18238
+ /* @__PURE__ */ jsxRuntime.jsx(IconDot, { $color: accent, children: icon }),
18239
+ /* @__PURE__ */ jsxRuntime.jsxs(Content, { children: [
18240
+ /* @__PURE__ */ jsxRuntime.jsx(Title2, { children: toast.title }),
18241
+ toast.amount && /* @__PURE__ */ jsxRuntime.jsx(Amount, { children: toast.amount }),
18242
+ toast.txHash && txUrl && /* @__PURE__ */ jsxRuntime.jsxs(TxRow, { href: txUrl, target: "_blank", rel: "noopener noreferrer", children: [
18243
+ truncateHash(toast.txHash),
18244
+ /* @__PURE__ */ jsxRuntime.jsx(TxArrow, { children: "\u2197" })
18245
+ ] })
18246
+ ] }),
18247
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { type: "button", onClick: dismiss, "aria-label": "Dismiss", children: "\u2715" })
18248
+ ] }),
18249
+ duration > 0 && /* @__PURE__ */ jsxRuntime.jsx(ProgressBar, { $color: accent, $duration: duration })
18250
+ ] });
18251
+ }
18252
+ var ToastContext = React5.createContext(null);
18253
+ function ToastProvider({ children }) {
18254
+ const [toasts, setToasts] = React5.useState([]);
18255
+ const addToast = React5.useCallback((data) => {
18256
+ const id = `toast-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`;
18257
+ setToasts((prev) => [...prev, { ...data, id }]);
18258
+ return id;
18259
+ }, []);
18260
+ const dismiss = React5.useCallback((id) => {
18261
+ setToasts((prev) => prev.filter((t) => t.id !== id));
18262
+ }, []);
18263
+ return /* @__PURE__ */ jsxRuntime.jsxs(ToastContext.Provider, { value: { toast: addToast, dismiss }, children: [
18264
+ children,
18265
+ /* @__PURE__ */ jsxRuntime.jsx(Container3, { children: toasts.map((t) => /* @__PURE__ */ jsxRuntime.jsx(ToastItem, { toast: t, onDismiss: dismiss }, t.id)) })
18266
+ ] });
18267
+ }
18268
+ function useToast() {
18269
+ const ctx = React5.useContext(ToastContext);
18270
+ if (!ctx) throw new Error("useToast must be used within a ToastProvider");
18271
+ return ctx;
18272
+ }
18271
18273
  var INTERVALS = [1e3, 2e3, 4e3, 5e3, 7e3, 1e4, 12e3];
18272
18274
  function useAdaptivePolling({ enabled, onPoll }) {
18273
18275
  const onPollRef = React5.useRef(onPoll);