@pollar/react 0.10.1-rc.6 → 0.10.1-rc.8

package/dist/index.d.mts

@@ -349,8 +349,13 @@ type RampStep = 'input' | 'loading_quote' | 'select_route' | 'contact' | 'status
 interface RampFieldSpec {
     key: string;
     label: string;
-    type: 'text' | 'email' | 'tel';
-    bankType?: 'CLABE' | 'PIX' | 'PSE' | 'ACH';
+    type: 'text' | 'email' | 'tel' | 'select';
+    bankType?: 'CLABE' | 'PIX' | 'PSE' | 'ACH' | 'BREB';
+    /** For `type: 'select'` — dropdown choices (e.g. Stereum's Bolivian banks). */
+    options?: {
+        value: string;
+        label: string;
+    }[];
 }
 interface RampWidgetTemplateProps {
     theme: string;
@@ -372,6 +377,8 @@ interface RampWidgetTemplateProps {
     kycUrl: string | null;
     tosUrl: string | null;
     stellarTxHash: string | null;
+    /** Stellar Expert URL for `stellarTxHash` (network-aware); null when unknown. */
+    explorerUrl: string | null;
     depositInstructions: Record<string, unknown> | null;
     canComplete: boolean;
     completing: boolean;
@@ -390,7 +397,7 @@ interface RampWidgetTemplateProps {
     onRefresh: () => void;
     onClose: () => void;
 }
-declare function RampWidgetTemplate({ theme, accentColor, step, direction, amount, currency, country, requiredFields, fieldValues, countries, countriesLoading, refreshing, quotes, isLoading, provider, txStatus, kycUrl, tosUrl, stellarTxHash, depositInstructions, canComplete, completing, errorMsg, onDirectionChange, onAmountChange, onFieldChange, onCountryChange, onFindRoute, onSelectQuote, onContactContinue, onOpenKyc, onOpenTos, onCompleteWithdraw, onRetry, onRefresh, onClose, }: RampWidgetTemplateProps): react_jsx_runtime.JSX.Element;
+declare function RampWidgetTemplate({ theme, accentColor, step, direction, amount, currency, country, requiredFields, fieldValues, countries, countriesLoading, refreshing, quotes, isLoading, provider, txStatus, kycUrl, tosUrl, stellarTxHash, explorerUrl, depositInstructions, canComplete, completing, errorMsg, onDirectionChange, onAmountChange, onFieldChange, onCountryChange, onFindRoute, onSelectQuote, onContactContinue, onOpenKyc, onOpenTos, onCompleteWithdraw, onRetry, onRefresh, onClose, }: RampWidgetTemplateProps): react_jsx_runtime.JSX.Element;
 
 interface TransactionModalTemplateProps {
     theme: string;

package/dist/index.d.ts

@@ -349,8 +349,13 @@ type RampStep = 'input' | 'loading_quote' | 'select_route' | 'contact' | 'status
 interface RampFieldSpec {
     key: string;
     label: string;
-    type: 'text' | 'email' | 'tel';
-    bankType?: 'CLABE' | 'PIX' | 'PSE' | 'ACH';
+    type: 'text' | 'email' | 'tel' | 'select';
+    bankType?: 'CLABE' | 'PIX' | 'PSE' | 'ACH' | 'BREB';
+    /** For `type: 'select'` — dropdown choices (e.g. Stereum's Bolivian banks). */
+    options?: {
+        value: string;
+        label: string;
+    }[];
 }
 interface RampWidgetTemplateProps {
     theme: string;
@@ -372,6 +377,8 @@ interface RampWidgetTemplateProps {
     kycUrl: string | null;
     tosUrl: string | null;
     stellarTxHash: string | null;
+    /** Stellar Expert URL for `stellarTxHash` (network-aware); null when unknown. */
+    explorerUrl: string | null;
     depositInstructions: Record<string, unknown> | null;
     canComplete: boolean;
     completing: boolean;
@@ -390,7 +397,7 @@ interface RampWidgetTemplateProps {
     onRefresh: () => void;
     onClose: () => void;
 }
-declare function RampWidgetTemplate({ theme, accentColor, step, direction, amount, currency, country, requiredFields, fieldValues, countries, countriesLoading, refreshing, quotes, isLoading, provider, txStatus, kycUrl, tosUrl, stellarTxHash, depositInstructions, canComplete, completing, errorMsg, onDirectionChange, onAmountChange, onFieldChange, onCountryChange, onFindRoute, onSelectQuote, onContactContinue, onOpenKyc, onOpenTos, onCompleteWithdraw, onRetry, onRefresh, onClose, }: RampWidgetTemplateProps): react_jsx_runtime.JSX.Element;
+declare function RampWidgetTemplate({ theme, accentColor, step, direction, amount, currency, country, requiredFields, fieldValues, countries, countriesLoading, refreshing, quotes, isLoading, provider, txStatus, kycUrl, tosUrl, stellarTxHash, explorerUrl, depositInstructions, canComplete, completing, errorMsg, onDirectionChange, onAmountChange, onFieldChange, onCountryChange, onFindRoute, onSelectQuote, onContactContinue, onOpenKyc, onOpenTos, onCompleteWithdraw, onRetry, onRefresh, onClose, }: RampWidgetTemplateProps): react_jsx_runtime.JSX.Element;
 
 interface TransactionModalTemplateProps {
     theme: string;

package/dist/index.js

@@ -1035,7 +1035,7 @@ var PollarModalFooter = () => {
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pollar-footer-name", children: "Pollar" }),
       /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "pollar-footer-version", children: [
         "v",
-        "0.10.1-rc.6"
+        "0.10.1-rc.8"
       ] })
     ] })
   ] });
@@ -2596,6 +2596,7 @@ function RampWidgetTemplate({
   kycUrl,
   tosUrl,
   stellarTxHash,
+  explorerUrl,
   depositInstructions,
   canComplete,
   completing,
@@ -2756,7 +2757,18 @@ function RampWidgetTemplate({
     step === "contact" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       requiredFields.map((f) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pollar-ramp-field", children: [
         /* @__PURE__ */ jsxRuntime.jsx("label", { className: "pollar-ramp-label", children: f.label }),
-        /* @__PURE__ */ jsxRuntime.jsx(
+        f.type === "select" ? /* @__PURE__ */ jsxRuntime.jsxs(
+          "select",
+          {
+            className: "pollar-ramp-input",
+            value: fieldValues[f.key] ?? "",
+            onChange: (e) => onFieldChange(f.key, e.target.value),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: "Select\u2026" }),
+              (f.options ?? []).map((o) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: o.value, children: o.label }, o.value))
+            ]
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
           "input",
           {
             type: f.type,
@@ -2792,11 +2804,29 @@ function RampWidgetTemplate({
       ] }),
       stellarTxHash && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pollar-ramp-payment-field", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pollar-ramp-payment-label", children: "Stellar tx" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pollar-ramp-payment-value", children: /* @__PURE__ */ jsxRuntime.jsxs("code", { children: [
-          stellarTxHash.slice(0, 8),
-          "\u2026",
-          stellarTxHash.slice(-8)
-        ] }) })
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pollar-ramp-payment-value", style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("code", { style: { flex: 1, wordBreak: "break-all" }, children: [
+            stellarTxHash.slice(0, 8),
+            "\u2026",
+            stellarTxHash.slice(-8)
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { value: stellarTxHash, label: "Copy transaction hash" }),
+          explorerUrl && /* @__PURE__ */ jsxRuntime.jsx(
+            "a",
+            {
+              href: explorerUrl,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "pollar-copy-btn",
+              "aria-label": "View on Stellar Expert",
+              title: "View on Stellar Expert",
+              children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "13", height: "13", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 3H3v8h8V8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+                /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8.5 2.5h3v3M11 3L6.5 7.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+              ] })
+            }
+          )
+        ] })
       ] }),
       depositInstructions && txStatus !== "completed" && flattenInstructions(depositInstructions).map(({ key, label, value, kind }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pollar-ramp-payment-field", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pollar-ramp-payment-label", children: label }),
@@ -2835,7 +2865,7 @@ function requiredFieldsOf(quote) {
   return quote.requiredFields ?? [];
 }
 function RampWidget({ onClose }) {
-  const { getClient, signTx, wallet, styles } = usePollar();
+  const { getClient, signTx, wallet, styles, network } = usePollar();
   const walletAddress = wallet?.address ?? "";
   const client = getClient();
   const { theme = "light", accentColor = "#005DB4" } = styles;
@@ -3010,12 +3040,16 @@ function RampWidget({ onClose }) {
     try {
       const base = { quoteId: quote.quoteId, amount: Number(amount), currency, country };
       if (walletAddress) base.walletAddress = walletAddress;
+      const STANDARD_BODY_KEYS = /* @__PURE__ */ new Set(["email", "fullName", "taxId", "qrCode"]);
+      const extraFields = {};
       for (const f of requiredFieldsOf(quote)) {
         const val = (fieldValues[f.key] ?? "").trim();
         if (!val) continue;
         if (f.bankType) base.bankDetails = { type: f.bankType, value: val };
-        else base[f.key] = val;
+        else if (STANDARD_BODY_KEYS.has(f.key)) base[f.key] = val;
+        else extraFields[f.key] = val;
       }
+      if (Object.keys(extraFields).length > 0) base.fields = extraFields;
       const result = direction === "onramp" ? await client.createOnRamp(base) : await client.createOffRamp(base);
       await applyResult(result);
     } catch (e) {
@@ -3075,6 +3109,7 @@ function RampWidget({ onClose }) {
       kycUrl,
       tosUrl,
       stellarTxHash,
+      explorerUrl: stellarTxHash ? `https://stellar.expert/explorer/${network === "mainnet" ? "public" : "testnet"}/tx/${stellarTxHash}` : null,
       depositInstructions,
       canComplete,
       completing,