kaleido-ui 0.1.14 → 0.1.16

package/dist/web/index.cjs

@@ -5207,7 +5207,9 @@ function DepositGeneratedView({
   setAddress,
   setRecipientId,
   setAmount,
-  setInvoiceStatus
+  setInvoiceStatus,
+  showQrNetworkBadge = true,
+  onRegenerate
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
     (network === "lightning" || network === "arkade" && arkSubMode === "ark") && isBtc && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex flex-col gap-1.5 rounded-xl border border-white/8 bg-white/3 p-2.5", children: [
@@ -5264,7 +5266,7 @@ function DepositGeneratedView({
           ),
           style: net.qrGlow,
           children: [
-            network !== "spark" && network !== "arkade" && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+            showQrNetworkBadge && network !== "spark" && network !== "arkade" && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
               "div",
               {
                 className: cn(
@@ -5279,7 +5281,10 @@ function DepositGeneratedView({
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(QrCode, { value: address, size: 188 }),
-            isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PaidOverlay, {})
+            isInvoicePaid && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PaidOverlay, {}),
+            loading && !isInvoicePaid && // Loading scrim — sits over the QR while a fresh address/invoice
+            // is being fetched (e.g. after the New Address button).
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-white/80 backdrop-blur-sm", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "material-symbols-outlined animate-spin text-icon-3xl text-network-bitcoin", children: "progress_activity" }) })
           ]
         }
       ),
@@ -5352,22 +5357,31 @@ function DepositGeneratedView({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
       "button",
       {
         type: "button",
+        "aria-label": `New ${network === "lightning" ? "invoice" : "address"}`,
+        title: `New ${network === "lightning" ? "invoice" : "address"}`,
+        disabled: loading,
         onClick: () => {
+          if (onRegenerate) {
+            void onRegenerate();
+            return;
+          }
           setAddress("");
           setRecipientId("");
           setAmount("");
           setInvoiceStatus(null);
         },
-        className: "flex items-center justify-center gap-1.5 rounded-xl bg-primary/15 px-5 py-3 text-xs font-bold text-primary transition-all hover:bg-primary/25 active:scale-[0.98]",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "material-symbols-outlined text-icon-sm", children: "refresh" }),
-          "New ",
-          network === "lightning" ? "Invoice" : "Address"
-        ]
+        className: "flex size-10 items-center justify-center rounded-full bg-primary/15 text-primary transition-all hover:bg-primary/25 active:scale-[0.98] disabled:opacity-50",
+        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+          "span",
+          {
+            className: cn("material-symbols-outlined text-icon-md", loading && "animate-spin"),
+            children: "refresh"
+          }
+        )
       }
     ) })
   ] });
@@ -5410,11 +5424,12 @@ function DepositPreGeneration({
   getUnitLabel,
   generateInvoice,
   needsColorableUtxos = false,
-  onOpenCreateUtxos
+  onOpenCreateUtxos,
+  showReceiveSummary = true
 }) {
   const method = METHOD_META2[currentMethod];
   return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "rounded-2xl border border-white/8 bg-white/4 p-3", children: [
+    showReceiveSummary && /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "rounded-2xl border border-white/8 bg-white/4 p-3", children: [
       /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Receive Summary" }),
       /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "mt-2 grid grid-cols-1 gap-2 text-xs", children: [
         /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
@@ -6008,6 +6023,7 @@ function DepositInvoiceGeneration({
   const addressLabel = network === "spark" ? "Spark Address" : network === "arkade" ? arkSubMode === "boarding" ? "Boarding Address" : "Arkade Address" : network === "lightning" ? "Lightning Invoice" : "Deposit Address";
   const showChannelWarning = selectedAccount === "RGB" && network === "lightning" && !channelsLoading && channels.length === 0 && !isSparkConnected;
   const showLiquidityWarning = !isSparkLightning && network === "lightning" && maxDepositAmount === 0 && !channelsLoading && !isBtc;
+  const isNewRgbAsset = isNewAsset && assetFamily === "RGB";
   return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex h-screen flex-col overflow-hidden bg-background font-display text-foreground", children: [
     /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       PageHeader,
@@ -6137,7 +6153,8 @@ function DepositInvoiceGeneration({
         getUnitLabel,
         generateInvoice,
         needsColorableUtxos,
-        onOpenCreateUtxos
+        onOpenCreateUtxos,
+        showReceiveSummary: !isNewRgbAsset
       }
     ) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       DepositGeneratedView,
@@ -6165,7 +6182,8 @@ function DepositInvoiceGeneration({
         setRecipientId,
         setAmount,
         setInvoiceStatus,
-        handleDone
+        handleDone,
+        showQrNetworkBadge: false
       }
     ) })
   ] });

package/dist/web/index.d.cts

@@ -1136,14 +1136,22 @@ interface DepositGeneratedViewProps {
     setRecipientId: (value: string) => void;
     setAmount: (value: string) => void;
     setInvoiceStatus: (value: string | null) => void;
+    showQrNetworkBadge?: boolean;
     /**
      * @deprecated Done button removed in v0.1.8 per the v1.0.0 wallet redesign;
      * users navigate away via the standard back button. Prop kept for source
      * compatibility — it is no longer invoked.
      */
     handleDone?: () => void;
+    /**
+     * Optional regenerate callback. When provided, the "New Address" button
+     * calls it directly (instead of just clearing local state via the
+     * setters above). Required for flows whose auto-generation effect does
+     * not refire on cleared state — e.g. RGB on-chain.
+     */
+    onRegenerate?: () => Promise<void> | void;
 }
-declare function DepositGeneratedView({ network, net, isBtc, address, addressLabel, recipientId, arkSubMode, invoiceStatus, isInvoicePending, isInvoicePaid, isInvoiceFailedOrExpired, amount, handleAmountChange, loading, copied, copyToClipboard, getUnitLabel, selectedAsset, maxDepositAmount, setAddress, setRecipientId, setAmount, setInvoiceStatus, }: DepositGeneratedViewProps): react_jsx_runtime.JSX.Element;
+declare function DepositGeneratedView({ network, net, isBtc, address, addressLabel, recipientId, arkSubMode, invoiceStatus, isInvoicePending, isInvoicePaid, isInvoiceFailedOrExpired, amount, handleAmountChange, loading, copied, copyToClipboard, getUnitLabel, selectedAsset, maxDepositAmount, setAddress, setRecipientId, setAmount, setInvoiceStatus, showQrNetworkBadge, onRegenerate, }: DepositGeneratedViewProps): react_jsx_runtime.JSX.Element;
 
 interface DepositPreGenerationAsset {
     ticker?: string;
@@ -1174,8 +1182,9 @@ interface DepositPreGenerationProps {
     needsColorableUtxos?: boolean;
     /** Invoked by the inline "Create Colorable UTXOs" CTA. */
     onOpenCreateUtxos?: () => void;
+    showReceiveSummary?: boolean;
 }
-declare function DepositPreGeneration({ selectedAsset, isBtc, network, net, selectedAccount, currentMethod, channelsLoading, showChannelWarning, showLiquidityWarning, isAutoGenerate, loading, usePrivacy, setUsePrivacy, amount, handleAmountChange, getUnitLabel, generateInvoice, needsColorableUtxos, onOpenCreateUtxos, }: DepositPreGenerationProps): react_jsx_runtime.JSX.Element;
+declare function DepositPreGeneration({ selectedAsset, isBtc, network, net, selectedAccount, currentMethod, channelsLoading, showChannelWarning, showLiquidityWarning, isAutoGenerate, loading, usePrivacy, setUsePrivacy, amount, handleAmountChange, getUnitLabel, generateInvoice, needsColorableUtxos, onOpenCreateUtxos, showReceiveSummary, }: DepositPreGenerationProps): react_jsx_runtime.JSX.Element;
 
 interface DepositSelectionAsset {
     asset_id: string;

package/dist/web/index.d.ts

@@ -1136,14 +1136,22 @@ interface DepositGeneratedViewProps {
     setRecipientId: (value: string) => void;
     setAmount: (value: string) => void;
     setInvoiceStatus: (value: string | null) => void;
+    showQrNetworkBadge?: boolean;
     /**
      * @deprecated Done button removed in v0.1.8 per the v1.0.0 wallet redesign;
      * users navigate away via the standard back button. Prop kept for source
      * compatibility — it is no longer invoked.
      */
     handleDone?: () => void;
+    /**
+     * Optional regenerate callback. When provided, the "New Address" button
+     * calls it directly (instead of just clearing local state via the
+     * setters above). Required for flows whose auto-generation effect does
+     * not refire on cleared state — e.g. RGB on-chain.
+     */
+    onRegenerate?: () => Promise<void> | void;
 }
-declare function DepositGeneratedView({ network, net, isBtc, address, addressLabel, recipientId, arkSubMode, invoiceStatus, isInvoicePending, isInvoicePaid, isInvoiceFailedOrExpired, amount, handleAmountChange, loading, copied, copyToClipboard, getUnitLabel, selectedAsset, maxDepositAmount, setAddress, setRecipientId, setAmount, setInvoiceStatus, }: DepositGeneratedViewProps): react_jsx_runtime.JSX.Element;
+declare function DepositGeneratedView({ network, net, isBtc, address, addressLabel, recipientId, arkSubMode, invoiceStatus, isInvoicePending, isInvoicePaid, isInvoiceFailedOrExpired, amount, handleAmountChange, loading, copied, copyToClipboard, getUnitLabel, selectedAsset, maxDepositAmount, setAddress, setRecipientId, setAmount, setInvoiceStatus, showQrNetworkBadge, onRegenerate, }: DepositGeneratedViewProps): react_jsx_runtime.JSX.Element;
 
 interface DepositPreGenerationAsset {
     ticker?: string;
@@ -1174,8 +1182,9 @@ interface DepositPreGenerationProps {
     needsColorableUtxos?: boolean;
     /** Invoked by the inline "Create Colorable UTXOs" CTA. */
     onOpenCreateUtxos?: () => void;
+    showReceiveSummary?: boolean;
 }
-declare function DepositPreGeneration({ selectedAsset, isBtc, network, net, selectedAccount, currentMethod, channelsLoading, showChannelWarning, showLiquidityWarning, isAutoGenerate, loading, usePrivacy, setUsePrivacy, amount, handleAmountChange, getUnitLabel, generateInvoice, needsColorableUtxos, onOpenCreateUtxos, }: DepositPreGenerationProps): react_jsx_runtime.JSX.Element;
+declare function DepositPreGeneration({ selectedAsset, isBtc, network, net, selectedAccount, currentMethod, channelsLoading, showChannelWarning, showLiquidityWarning, isAutoGenerate, loading, usePrivacy, setUsePrivacy, amount, handleAmountChange, getUnitLabel, generateInvoice, needsColorableUtxos, onOpenCreateUtxos, showReceiveSummary, }: DepositPreGenerationProps): react_jsx_runtime.JSX.Element;
 
 interface DepositSelectionAsset {
     asset_id: string;

package/dist/web/index.js

@@ -5052,7 +5052,9 @@ function DepositGeneratedView({
   setAddress,
   setRecipientId,
   setAmount,
-  setInvoiceStatus
+  setInvoiceStatus,
+  showQrNetworkBadge = true,
+  onRegenerate
 }) {
   return /* @__PURE__ */ jsxs43("div", { className: "space-y-3 animate-in fade-in zoom-in-95 duration-300", children: [
     (network === "lightning" || network === "arkade" && arkSubMode === "ark") && isBtc && /* @__PURE__ */ jsxs43("div", { className: "flex flex-col gap-1.5 rounded-xl border border-white/8 bg-white/3 p-2.5", children: [
@@ -5109,7 +5111,7 @@ function DepositGeneratedView({
           ),
           style: net.qrGlow,
           children: [
-            network !== "spark" && network !== "arkade" && /* @__PURE__ */ jsxs43(
+            showQrNetworkBadge && network !== "spark" && network !== "arkade" && /* @__PURE__ */ jsxs43(
               "div",
               {
                 className: cn(
@@ -5124,7 +5126,10 @@ function DepositGeneratedView({
               }
             ),
             /* @__PURE__ */ jsx56(QrCode, { value: address, size: 188 }),
-            isInvoicePaid && /* @__PURE__ */ jsx56(PaidOverlay, {})
+            isInvoicePaid && /* @__PURE__ */ jsx56(PaidOverlay, {}),
+            loading && !isInvoicePaid && // Loading scrim — sits over the QR while a fresh address/invoice
+            // is being fetched (e.g. after the New Address button).
+            /* @__PURE__ */ jsx56("div", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-white/80 backdrop-blur-sm", children: /* @__PURE__ */ jsx56("span", { className: "material-symbols-outlined animate-spin text-icon-3xl text-network-bitcoin", children: "progress_activity" }) })
           ]
         }
       ),
@@ -5197,22 +5202,31 @@ function DepositGeneratedView({
         ]
       }
     ),
-    /* @__PURE__ */ jsx56("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ jsxs43(
+    /* @__PURE__ */ jsx56("div", { className: "flex justify-center pt-1", children: /* @__PURE__ */ jsx56(
       "button",
       {
         type: "button",
+        "aria-label": `New ${network === "lightning" ? "invoice" : "address"}`,
+        title: `New ${network === "lightning" ? "invoice" : "address"}`,
+        disabled: loading,
         onClick: () => {
+          if (onRegenerate) {
+            void onRegenerate();
+            return;
+          }
           setAddress("");
           setRecipientId("");
           setAmount("");
           setInvoiceStatus(null);
         },
-        className: "flex items-center justify-center gap-1.5 rounded-xl bg-primary/15 px-5 py-3 text-xs font-bold text-primary transition-all hover:bg-primary/25 active:scale-[0.98]",
-        children: [
-          /* @__PURE__ */ jsx56("span", { className: "material-symbols-outlined text-icon-sm", children: "refresh" }),
-          "New ",
-          network === "lightning" ? "Invoice" : "Address"
-        ]
+        className: "flex size-10 items-center justify-center rounded-full bg-primary/15 text-primary transition-all hover:bg-primary/25 active:scale-[0.98] disabled:opacity-50",
+        children: /* @__PURE__ */ jsx56(
+          "span",
+          {
+            className: cn("material-symbols-outlined text-icon-md", loading && "animate-spin"),
+            children: "refresh"
+          }
+        )
       }
     ) })
   ] });
@@ -5255,11 +5269,12 @@ function DepositPreGeneration({
   getUnitLabel,
   generateInvoice,
   needsColorableUtxos = false,
-  onOpenCreateUtxos
+  onOpenCreateUtxos,
+  showReceiveSummary = true
 }) {
   const method = METHOD_META2[currentMethod];
   return /* @__PURE__ */ jsxs44("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxs44("div", { className: "rounded-2xl border border-white/8 bg-white/4 p-3", children: [
+    showReceiveSummary && /* @__PURE__ */ jsxs44("div", { className: "rounded-2xl border border-white/8 bg-white/4 p-3", children: [
       /* @__PURE__ */ jsx57("p", { className: "text-xxs font-bold uppercase tracking-widest text-white/35", children: "Receive Summary" }),
       /* @__PURE__ */ jsxs44("div", { className: "mt-2 grid grid-cols-1 gap-2 text-xs", children: [
         /* @__PURE__ */ jsxs44("div", { className: "flex items-center justify-between gap-3", children: [
@@ -5853,6 +5868,7 @@ function DepositInvoiceGeneration({
   const addressLabel = network === "spark" ? "Spark Address" : network === "arkade" ? arkSubMode === "boarding" ? "Boarding Address" : "Arkade Address" : network === "lightning" ? "Lightning Invoice" : "Deposit Address";
   const showChannelWarning = selectedAccount === "RGB" && network === "lightning" && !channelsLoading && channels.length === 0 && !isSparkConnected;
   const showLiquidityWarning = !isSparkLightning && network === "lightning" && maxDepositAmount === 0 && !channelsLoading && !isBtc;
+  const isNewRgbAsset = isNewAsset && assetFamily === "RGB";
   return /* @__PURE__ */ jsxs46("div", { className: "flex h-screen flex-col overflow-hidden bg-background font-display text-foreground", children: [
     /* @__PURE__ */ jsx59(
       PageHeader,
@@ -5982,7 +5998,8 @@ function DepositInvoiceGeneration({
         getUnitLabel,
         generateInvoice,
         needsColorableUtxos,
-        onOpenCreateUtxos
+        onOpenCreateUtxos,
+        showReceiveSummary: !isNewRgbAsset
       }
     ) : /* @__PURE__ */ jsx59(
       DepositGeneratedView,
@@ -6010,7 +6027,8 @@ function DepositInvoiceGeneration({
         setRecipientId,
         setAmount,
         setInvoiceStatus,
-        handleDone
+        handleDone,
+        showQrNetworkBadge: false
       }
     ) })
   ] });

package/package.json

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