kaleido-ui 0.1.29 → 0.1.30

package/dist/web/index.cjs

@@ -5111,6 +5111,10 @@ function DepositNetworkDefaultModal({
 
 // src/web/components/btc-unified-receive.tsx
 var import_jsx_runtime55 = require("react/jsx-runtime");
+function formatSatsForRow(value) {
+  if (!value || value <= 0 || !Number.isFinite(value)) return null;
+  return `${value.toLocaleString("en-US")} sats`;
+}
 function BtcUnifiedReceive({
   btcSelectedAccount,
   accountReceiveResult,
@@ -5210,7 +5214,13 @@ function BtcUnifiedReceive({
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", network.bg), children: network.icon }),
               /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
+                /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
+                  (() => {
+                    const amountLabel = formatSatsForRow(address.amountSats);
+                    return amountLabel ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "rounded-full bg-white/10 px-1.5 py-0.5 text-tiny font-bold tabular-nums text-white/70", children: amountLabel }) : null;
+                  })()
+                ] }),
                 /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.value.length > 50 ? `${address.value.slice(0, 18)}...${address.value.slice(-14)}` : address.value })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(CopyIcon, { copied })

package/dist/web/index.d.cts

@@ -1106,6 +1106,15 @@ interface BtcUnifiedReceiveAddress {
     network: DepositNetworkKey;
     label: string;
     value: string;
+    /**
+     * Amount the address / invoice is bound to, in satoshis. Surfaced as
+     * a small "10,000 sats" tag next to the row label so the user can see
+     * at a glance what the LN invoice / Spark invoice / BIP21 link
+     * actually encodes — bolt11 invoices and Spark invoices carry the
+     * amount internally, but the user couldn't see it without decoding.
+     * Omit (or pass 0) for amountless / open-ended addresses.
+     */
+    amountSats?: number;
 }
 interface BtcUnifiedReceiveResult {
     qrValue: string;

package/dist/web/index.d.ts

@@ -1106,6 +1106,15 @@ interface BtcUnifiedReceiveAddress {
     network: DepositNetworkKey;
     label: string;
     value: string;
+    /**
+     * Amount the address / invoice is bound to, in satoshis. Surfaced as
+     * a small "10,000 sats" tag next to the row label so the user can see
+     * at a glance what the LN invoice / Spark invoice / BIP21 link
+     * actually encodes — bolt11 invoices and Spark invoices carry the
+     * amount internally, but the user couldn't see it without decoding.
+     * Omit (or pass 0) for amountless / open-ended addresses.
+     */
+    amountSats?: number;
 }
 interface BtcUnifiedReceiveResult {
     qrValue: string;

package/dist/web/index.js

@@ -4956,6 +4956,10 @@ function DepositNetworkDefaultModal({
 
 // src/web/components/btc-unified-receive.tsx
 import { jsx as jsx55, jsxs as jsxs42 } from "react/jsx-runtime";
+function formatSatsForRow(value) {
+  if (!value || value <= 0 || !Number.isFinite(value)) return null;
+  return `${value.toLocaleString("en-US")} sats`;
+}
 function BtcUnifiedReceive({
   btcSelectedAccount,
   accountReceiveResult,
@@ -5055,7 +5059,13 @@ function BtcUnifiedReceive({
             children: [
               /* @__PURE__ */ jsx55("div", { className: cn("flex size-5 flex-shrink-0 items-center justify-center rounded-md", network.bg), children: network.icon }),
               /* @__PURE__ */ jsxs42("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ jsx55("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
+                /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ jsx55("p", { className: cn("text-xxs font-bold uppercase tracking-widest", network.text), children: address.label }),
+                  (() => {
+                    const amountLabel = formatSatsForRow(address.amountSats);
+                    return amountLabel ? /* @__PURE__ */ jsx55("span", { className: "rounded-full bg-white/10 px-1.5 py-0.5 text-tiny font-bold tabular-nums text-white/70", children: amountLabel }) : null;
+                  })()
+                ] }),
                 /* @__PURE__ */ jsx55("p", { className: "mt-0.5 truncate font-mono text-tiny text-muted-foreground", children: address.value.length > 50 ? `${address.value.slice(0, 18)}...${address.value.slice(-14)}` : address.value })
               ] }),
               /* @__PURE__ */ jsx55(CopyIcon, { copied })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kaleido-ui",
-  "version": "0.1.29",
+  "version": "0.1.30",
   "description": "KaleidoSwap shared UI library — design tokens, web components (Tailwind + Radix), and React Native components extending WDK UI Kit",
   "license": "MIT",
   "type": "module",