@clockpay/react-native 1.0.0 → 1.0.1

package/lib/module/components/payment-button.js

@@ -1,20 +1,24 @@
 "use strict";
 
-import { useMemo, useState } from 'react';
-import { ActivityIndicator, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
-import { ClockPayClient } from '../api/client';
+import { useMemo, useRef, useState } from 'react';
+import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
 import { resolveTheme } from '../internal/theme';
+import { SelectionSheet } from './selection-sheet';
 import { PaymentSheet } from './payment-sheet';
 import { LogoIcon } from './icons';
 
 /**
  * Drop-in payment button for React Native. Renders a "Pay with Clockpay" trigger
- * that initiates a checkout and opens a Stripe-style bottom-sheet payment modal.
+ * that opens a coin/network selection sheet, generates a payment link, then opens
+ * a Stripe-style bottom-sheet payment modal.
  */
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function PaymentButton({
   publicKey,
-  clientSecret,
+  amount,
+  currency,
+  reference,
+  meta,
   appearance,
   label = 'Pay with Clockpay',
   disabled,
@@ -24,62 +28,72 @@ export function PaymentButton({
   onError,
   onClose
 }) {
+  const [selecting, setSelecting] = useState(false);
   const [checkout, setCheckout] = useState(null);
-  const [visible, setVisible] = useState(false);
-  const [loading, setLoading] = useState(false);
+  const [paymentVisible, setPaymentVisible] = useState(false);
+  // Holds the checkout produced by the selection sheet until it finishes closing,
+  // so the two sheets never present at the same time.
+  const pending = useRef(null);
   const theme = useMemo(() => resolveTheme(appearance), [appearance]);
-  const initiate = async () => {
-    if (loading) return;
-    setLoading(true);
-    try {
-      const client = new ClockPayClient(publicKey, apiBaseUrl);
-      const response = await client.initiatePayment(clientSecret);
-      setCheckout(response.data);
-      setVisible(true);
-    } catch (error) {
-      onError?.(error instanceof Error ? error : new Error('Payment initialization failed.'));
-    } finally {
-      setLoading(false);
+  const handleProceed = data => {
+    pending.current = data;
+    setSelecting(false); // animate the selection sheet out first
+  };
+  const handleSelectionClosed = () => {
+    if (pending.current) {
+      setCheckout(pending.current);
+      pending.current = null;
+      setPaymentVisible(true);
+    } else {
+      onClose?.();
     }
   };
-  const handleClosed = () => {
+  const handlePaymentClosed = () => {
     setCheckout(null);
     onClose?.();
   };
   return /*#__PURE__*/_jsxs(View, {
-    children: [/*#__PURE__*/_jsx(TouchableOpacity, {
+    children: [/*#__PURE__*/_jsxs(TouchableOpacity, {
       activeOpacity: 0.8,
-      disabled: disabled || loading,
-      onPress: initiate,
+      disabled: disabled,
+      onPress: () => setSelecting(true),
       style: [styles.button, {
         backgroundColor: theme.buttonBg,
         borderColor: theme.buttonBorder,
         borderRadius: theme.radius,
-        opacity: disabled || loading ? 0.6 : 1
+        opacity: disabled ? 0.6 : 1
       }],
-      children: loading ? /*#__PURE__*/_jsx(ActivityIndicator, {
-        size: "small",
-        color: theme.buttonFg
-      }) : /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(LogoIcon, {
-          size: 16
-        }), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
-          style: [styles.label, {
-            color: theme.buttonFg,
-            fontFamily: theme.fontFamily
-          }],
-          children: label
-        }) : label]
-      })
+      children: [/*#__PURE__*/_jsx(LogoIcon, {
+        size: 16
+      }), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
+        style: [styles.label, {
+          color: theme.buttonFg,
+          fontFamily: theme.fontFamily
+        }],
+        children: label
+      }) : label]
+    }), /*#__PURE__*/_jsx(SelectionSheet, {
+      visible: selecting,
+      publicKey: publicKey,
+      apiBaseUrl: apiBaseUrl,
+      theme: theme,
+      amount: amount,
+      currency: currency,
+      reference: reference,
+      meta: meta,
+      onRequestClose: () => setSelecting(false),
+      onClosed: handleSelectionClosed,
+      onProceed: handleProceed,
+      onError: onError
     }), checkout && /*#__PURE__*/_jsx(PaymentSheet, {
-      visible: visible,
+      visible: paymentVisible,
       checkout: checkout,
       publicKey: publicKey,
       apiBaseUrl: apiBaseUrl,
       theme: theme,
       redirectUrl: redirectUrl,
-      onRequestClose: () => setVisible(false),
-      onClosed: handleClosed,
+      onRequestClose: () => setPaymentVisible(false),
+      onClosed: handlePaymentClosed,
       onSuccess: onSuccess,
       onError: onError
     })]

package/lib/module/components/payment-button.js.map

@@ -1 +1 @@
-{"version":3,"names":["useMemo","useState","ActivityIndicator","StyleSheet","Text","TouchableOpacity","View","ClockPayClient","resolveTheme","PaymentSheet","LogoIcon","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","PaymentButton","publicKey","clientSecret","appearance","label","disabled","apiBaseUrl","redirectUrl","onSuccess","onError","onClose","checkout","setCheckout","visible","setVisible","loading","setLoading","theme","initiate","client","response","initiatePayment","data","error","Error","handleClosed","children","activeOpacity","onPress","style","styles","button","backgroundColor","buttonBg","borderColor","buttonBorder","borderRadius","radius","opacity","size","color","buttonFg","fontFamily","onRequestClose","onClosed","create","flexDirection","alignItems","justifyContent","gap","paddingVertical","paddingHorizontal","borderWidth","fontSize","fontWeight"],"sourceRoot":"..\\..\\..\\src","sources":["components/payment-button.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useMemo","useRef","useState","StyleSheet","Text","TouchableOpacity","View","resolveTheme","SelectionSheet","PaymentSheet","LogoIcon","jsx","_jsx","jsxs","_jsxs","PaymentButton","publicKey","amount","currency","reference","meta","appearance","label","disabled","apiBaseUrl","redirectUrl","onSuccess","onError","onClose","selecting","setSelecting","checkout","setCheckout","paymentVisible","setPaymentVisible","pending","theme","handleProceed","data","current","handleSelectionClosed","handlePaymentClosed","children","activeOpacity","onPress","style","styles","button","backgroundColor","buttonBg","borderColor","buttonBorder","borderRadius","radius","opacity","size","color","buttonFg","fontFamily","visible","onRequestClose","onClosed","onProceed","create","flexDirection","alignItems","justifyContent","gap","paddingVertical","paddingHorizontal","borderWidth","fontSize","fontWeight"],"sourceRoot":"..\\..\\..\\src","sources":["components/payment-button.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/selection-sheet.js

@@ -0,0 +1,391 @@
+"use strict";
+
+import { useEffect, useMemo, useState } from 'react';
+import { ActivityIndicator, Pressable, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { SvgUri } from 'react-native-svg';
+import { ClockPayClient } from '../api/client';
+import { formatMoney } from '../internal/format';
+import { BottomSheet } from './bottom-sheet';
+import { ChevronDownIcon, CloseIcon, LogoIcon } from './icons';
+
+/** Renders a coin's remote SVG logo. Falls back to a neutral placeholder circle. */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function CoinLogo({
+  uri
+}) {
+  if (!uri) return null;
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.logo,
+    children: /*#__PURE__*/_jsx(SvgUri, {
+      width: 20,
+      height: 20,
+      uri: uri
+    })
+  });
+}
+/** A lightweight inline dropdown — taps to expand a list of options in place. */
+function Dropdown({
+  label,
+  placeholder,
+  value,
+  options,
+  disabled,
+  loading,
+  theme,
+  onSelect
+}) {
+  const [open, setOpen] = useState(false);
+  const selected = options.find(o => o.id === value);
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.field, open && styles.fieldOpen],
+    children: [/*#__PURE__*/_jsxs(Text, {
+      style: styles.label,
+      children: [label, " ", /*#__PURE__*/_jsx(Text, {
+        style: styles.req,
+        children: "*"
+      })]
+    }), /*#__PURE__*/_jsxs(TouchableOpacity, {
+      activeOpacity: 0.7,
+      disabled: disabled,
+      style: [styles.select, disabled && styles.selectDisabled],
+      onPress: () => setOpen(o => !o),
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.selectValue,
+        children: [selected?.image && /*#__PURE__*/_jsx(CoinLogo, {
+          uri: selected.image
+        }), /*#__PURE__*/_jsx(Text, {
+          style: [styles.selectText, !selected && styles.placeholder],
+          children: loading ? 'Loading…' : selected ? selected.label : placeholder
+        })]
+      }), loading ? /*#__PURE__*/_jsx(ActivityIndicator, {
+        size: "small",
+        color: "#94a3b8"
+      }) : /*#__PURE__*/_jsx(ChevronDownIcon, {})]
+    }), open && !disabled && /*#__PURE__*/_jsx(View, {
+      style: styles.options,
+      children: options.map(o => /*#__PURE__*/_jsxs(TouchableOpacity, {
+        style: styles.option,
+        onPress: () => {
+          onSelect(o.id);
+          setOpen(false);
+        },
+        children: [o.image && /*#__PURE__*/_jsx(CoinLogo, {
+          uri: o.image
+        }), /*#__PURE__*/_jsx(Text, {
+          style: [styles.optionText, o.id === value && {
+            color: theme.accent,
+            fontWeight: '600'
+          }],
+          children: o.label
+        })]
+      }, o.id))
+    })]
+  });
+}
+
+/**
+ * First step of the payment flow: the buyer picks a coin and then a settlement
+ * network. On continue, a payment link is generated (`create-link`) and the
+ * resulting checkout initiated, handing a {@link CheckoutData} to the caller so
+ * the payment sheet can open.
+ */
+export function SelectionSheet({
+  visible,
+  publicKey,
+  apiBaseUrl,
+  theme,
+  amount,
+  currency,
+  reference,
+  meta,
+  onRequestClose,
+  onClosed,
+  onProceed,
+  onError
+}) {
+  const client = useMemo(() => new ClockPayClient(publicKey, apiBaseUrl), [publicKey, apiBaseUrl]);
+  const [coins, setCoins] = useState([]);
+  const [networks, setNetworks] = useState([]);
+  const [coinId, setCoinId] = useState('');
+  const [networkId, setNetworkId] = useState('');
+  const [loadingCoins, setLoadingCoins] = useState(false);
+  const [loadingNetworks, setLoadingNetworks] = useState(false);
+  const [submitting, setSubmitting] = useState(false);
+  const [error, setError] = useState(null);
+
+  // Load the available coins once the sheet opens.
+  useEffect(() => {
+    if (!visible) return;
+    let active = true;
+    setLoadingCoins(true);
+    setError(null);
+    client.getCoins().then(list => active && setCoins(list)).catch(e => active && setError(e.message)).finally(() => active && setLoadingCoins(false));
+    return () => {
+      active = false;
+    };
+  }, [visible, client]);
+
+  // Load the networks for the selected coin.
+  useEffect(() => {
+    setNetworks([]);
+    setNetworkId('');
+    if (!coinId) return;
+    let active = true;
+    setLoadingNetworks(true);
+    setError(null);
+    client.getNetworks(coinId).then(list => active && setNetworks(list)).catch(e => active && setError(e.message)).finally(() => active && setLoadingNetworks(false));
+    return () => {
+      active = false;
+    };
+  }, [coinId, client]);
+  const canSubmit = Boolean(coinId && networkId && !submitting);
+  const proceed = async () => {
+    if (!canSubmit) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      const link = await client.createLink({
+        amount,
+        currency,
+        coinId,
+        networkId,
+        reference,
+        meta
+      });
+      const response = await client.initiatePayment(link.clientSecret);
+      onProceed(response.data);
+    } catch (e) {
+      const err = e instanceof Error ? e : new Error('Failed to start checkout.');
+      setError(err.message);
+      onError?.(err);
+    } finally {
+      setSubmitting(false);
+    }
+  };
+  const coinOptions = coins.map(c => ({
+    id: c.id,
+    label: c.name.toUpperCase(),
+    image: c.image
+  }));
+  const networkOptions = networks.map(n => ({
+    id: n.id,
+    label: n.name.toUpperCase()
+  }));
+  return /*#__PURE__*/_jsxs(BottomSheet, {
+    visible: visible,
+    onClose: onRequestClose,
+    onClosed: onClosed,
+    closeOnBackdropPress: false,
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.header,
+      children: [/*#__PURE__*/_jsx(LogoIcon, {
+        size: 18
+      }), /*#__PURE__*/_jsx(Text, {
+        style: [styles.title, {
+          color: theme.accent
+        }],
+        children: "Pay with Clockpay"
+      }), /*#__PURE__*/_jsx(Pressable, {
+        onPress: onRequestClose,
+        style: styles.cancel,
+        hitSlop: 8,
+        accessibilityRole: "button",
+        accessibilityLabel: "Cancel",
+        children: /*#__PURE__*/_jsx(CloseIcon, {
+          size: 22
+        })
+      })]
+    }), /*#__PURE__*/_jsxs(ScrollView, {
+      showsVerticalScrollIndicator: false,
+      keyboardShouldPersistTaps: "handled",
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.card,
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: styles.muted,
+          children: "You are paying"
+        }), /*#__PURE__*/_jsx(Text, {
+          style: styles.amount,
+          children: formatMoney(amount, currency)
+        })]
+      }), /*#__PURE__*/_jsx(Dropdown, {
+        label: "Select coin",
+        placeholder: "Select a coin",
+        value: coinId,
+        options: coinOptions,
+        disabled: submitting,
+        loading: loadingCoins,
+        theme: theme,
+        onSelect: setCoinId
+      }), /*#__PURE__*/_jsx(Dropdown, {
+        label: "Select preferred network",
+        placeholder: !coinId ? 'Select a coin first' : 'Select a network',
+        value: networkId,
+        options: networkOptions,
+        disabled: !coinId || submitting,
+        loading: loadingNetworks,
+        theme: theme,
+        onSelect: setNetworkId
+      }), error && /*#__PURE__*/_jsx(Text, {
+        style: styles.error,
+        children: error
+      }), /*#__PURE__*/_jsx(TouchableOpacity, {
+        style: [styles.primaryBtn, {
+          backgroundColor: canSubmit ? theme.accent : '#dff0f7',
+          borderRadius: theme.radius
+        }],
+        disabled: !canSubmit,
+        onPress: proceed,
+        children: submitting ? /*#__PURE__*/_jsx(ActivityIndicator, {
+          size: "small",
+          color: "#fff"
+        }) : /*#__PURE__*/_jsx(Text, {
+          style: [styles.primaryBtnText, {
+            color: canSubmit ? '#fff' : '#9ca3af'
+          }],
+          children: "Continue"
+        })
+      })]
+    })]
+  });
+}
+const styles = StyleSheet.create({
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: 8,
+    paddingBottom: 16
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: '700'
+  },
+  cancel: {
+    position: 'absolute',
+    right: 0,
+    top: -2,
+    padding: 4
+  },
+  card: {
+    borderWidth: 1,
+    borderColor: '#edf1f6',
+    borderRadius: 16,
+    padding: 20,
+    alignItems: 'center',
+    marginBottom: 20
+  },
+  muted: {
+    fontSize: 13,
+    color: '#94a3b8'
+  },
+  amount: {
+    fontSize: 24,
+    fontWeight: '700',
+    color: '#000',
+    marginTop: 4
+  },
+  field: {
+    marginBottom: 16,
+    position: 'relative'
+  },
+  // Lift the open dropdown (and its overlay list) above the fields below it.
+  fieldOpen: {
+    zIndex: 20,
+    elevation: 20
+  },
+  label: {
+    fontSize: 14,
+    fontWeight: '500',
+    color: '#1e1e1e',
+    marginBottom: 6
+  },
+  req: {
+    color: '#fb7185'
+  },
+  select: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    borderWidth: 1,
+    borderColor: '#d9d9d9',
+    borderRadius: 8,
+    paddingVertical: 12,
+    paddingHorizontal: 12
+  },
+  selectDisabled: {
+    backgroundColor: '#f5f5f5'
+  },
+  selectValue: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8,
+    flexShrink: 1
+  },
+  selectText: {
+    fontSize: 14,
+    color: '#1e1e1e'
+  },
+  placeholder: {
+    color: '#9ca3af'
+  },
+  logo: {
+    width: 20,
+    height: 20,
+    borderRadius: 10,
+    overflow: 'hidden',
+    backgroundColor: '#f0f2f5',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  options: {
+    position: 'absolute',
+    top: '100%',
+    left: 0,
+    right: 0,
+    marginTop: 6,
+    zIndex: 20,
+    elevation: 8,
+    backgroundColor: '#ffffff',
+    borderWidth: 1,
+    borderColor: '#edf1f6',
+    borderRadius: 8,
+    maxHeight: 220,
+    overflow: 'hidden',
+    shadowColor: '#0f172a',
+    shadowOpacity: 0.18,
+    shadowRadius: 12,
+    shadowOffset: {
+      width: 0,
+      height: 6
+    }
+  },
+  option: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8,
+    paddingVertical: 12,
+    paddingHorizontal: 12,
+    borderBottomWidth: 1,
+    borderBottomColor: '#f1f5f9'
+  },
+  optionText: {
+    fontSize: 14,
+    color: '#1e1e1e'
+  },
+  error: {
+    color: '#ef4444',
+    fontSize: 13,
+    marginBottom: 12
+  },
+  primaryBtn: {
+    width: '100%',
+    paddingVertical: 15,
+    alignItems: 'center',
+    marginTop: 4
+  },
+  primaryBtnText: {
+    fontSize: 16,
+    fontWeight: '600'
+  }
+});
+//# sourceMappingURL=selection-sheet.js.map

package/lib/module/components/selection-sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useMemo","useState","ActivityIndicator","Pressable","ScrollView","StyleSheet","Text","TouchableOpacity","View","SvgUri","ClockPayClient","formatMoney","BottomSheet","ChevronDownIcon","CloseIcon","LogoIcon","jsx","_jsx","jsxs","_jsxs","CoinLogo","uri","style","styles","logo","children","width","height","Dropdown","label","placeholder","value","options","disabled","loading","theme","onSelect","open","setOpen","selected","find","o","id","field","fieldOpen","req","activeOpacity","select","selectDisabled","onPress","selectValue","image","selectText","size","color","map","option","optionText","accent","fontWeight","SelectionSheet","visible","publicKey","apiBaseUrl","amount","currency","reference","meta","onRequestClose","onClosed","onProceed","onError","client","coins","setCoins","networks","setNetworks","coinId","setCoinId","networkId","setNetworkId","loadingCoins","setLoadingCoins","loadingNetworks","setLoadingNetworks","submitting","setSubmitting","error","setError","active","getCoins","then","list","catch","e","message","finally","getNetworks","canSubmit","Boolean","proceed","link","createLink","response","initiatePayment","clientSecret","data","err","Error","coinOptions","c","name","toUpperCase","networkOptions","n","onClose","closeOnBackdropPress","header","title","cancel","hitSlop","accessibilityRole","accessibilityLabel","showsVerticalScrollIndicator","keyboardShouldPersistTaps","card","muted","primaryBtn","backgroundColor","borderRadius","radius","primaryBtnText","create","flexDirection","alignItems","justifyContent","gap","paddingBottom","fontSize","position","right","top","padding","borderWidth","borderColor","marginBottom","marginTop","zIndex","elevation","paddingVertical","paddingHorizontal","flexShrink","overflow","left","maxHeight","shadowColor","shadowOpacity","shadowRadius","shadowOffset","borderBottomWidth","borderBottomColor"],"sourceRoot":"..\\..\\..\\src","sources":["components/selection-sheet.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/internal/format.js

@@ -9,6 +9,16 @@ export function formatTime(totalSeconds) {
   const seconds = safe % 60;
   return `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
 }
+const CURRENCY_SYMBOLS = {
+  ngn: '₦',
+  usd: '$'
+};
+
+/** Formats a fiat amount with its currency symbol, e.g. `formatMoney(20000, 'ngn')` → `₦20,000`. */
+export function formatMoney(amount, currency) {
+  const symbol = CURRENCY_SYMBOLS[currency?.toLowerCase()] ?? '';
+  return `${symbol}${amount.toLocaleString()}`;
+}
 
 /** Resolves the on-chain code used to verify a transaction for a given checkout. */
 export function resolveNetworkCode(network, fallback) {

package/lib/module/internal/format.js.map

@@ -1 +1 @@
-{"version":3,"names":["NETWORK_CODES","formatTime","totalSeconds","safe","Math","max","minutes","floor","seconds","String","padStart","resolveNetworkCode","network","fallback","key","toLowerCase","truncateMiddle","value","lead","tail","length","slice"],"sourceRoot":"..\\..\\..\\src","sources":["internal/format.ts"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,aAAa;;AAE3C;AACA,OAAO,SAASC,UAAUA,CAACC,YAAoB,EAAU;EACvD,MAAMC,IAAI,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,YAAY,CAAC;EACtC,MAAMI,OAAO,GAAGF,IAAI,CAACG,KAAK,CAACJ,IAAI,GAAG,EAAE,CAAC;EACrC,MAAMK,OAAO,GAAGL,IAAI,GAAG,EAAE;EACzB,OAAO,GAAGM,MAAM,CAACH,OAAO,CAAC,CAACI,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAID,MAAM,CAACD,OAAO,CAAC,CAACE,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AAClF;;AAEA;AACA,OAAO,SAASC,kBAAkBA,CAACC,OAAgB,EAAEC,QAAiB,EAAU;EAC9E,MAAMC,GAAG,GAAGF,OAAO,EAAEG,WAAW,CAAC,CAAC,IAAI,EAAE;EACxC,OAAOf,aAAa,CAACc,GAAG,CAAC,IAAID,QAAQ,IAAI,EAAE;AAC7C;;AAEA;AACA,OAAO,SAASG,cAAcA,CAACC,KAAa,EAAEC,IAAI,GAAG,EAAE,EAAEC,IAAI,GAAG,CAAC,EAAU;EACzE,IAAIF,KAAK,CAACG,MAAM,IAAIF,IAAI,GAAGC,IAAI,GAAG,CAAC,EAAE,OAAOF,KAAK;EACjD,OAAO,GAAGA,KAAK,CAACI,KAAK,CAAC,CAAC,EAAEH,IAAI,CAAC,IAAID,KAAK,CAACI,KAAK,CAAC,CAACF,IAAI,CAAC,EAAE;AACxD","ignoreList":[]}
+{"version":3,"names":["NETWORK_CODES","formatTime","totalSeconds","safe","Math","max","minutes","floor","seconds","String","padStart","CURRENCY_SYMBOLS","ngn","usd","formatMoney","amount","currency","symbol","toLowerCase","toLocaleString","resolveNetworkCode","network","fallback","key","truncateMiddle","value","lead","tail","length","slice"],"sourceRoot":"..\\..\\..\\src","sources":["internal/format.ts"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,aAAa;;AAE3C;AACA,OAAO,SAASC,UAAUA,CAACC,YAAoB,EAAU;EACvD,MAAMC,IAAI,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,YAAY,CAAC;EACtC,MAAMI,OAAO,GAAGF,IAAI,CAACG,KAAK,CAACJ,IAAI,GAAG,EAAE,CAAC;EACrC,MAAMK,OAAO,GAAGL,IAAI,GAAG,EAAE;EACzB,OAAO,GAAGM,MAAM,CAACH,OAAO,CAAC,CAACI,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAID,MAAM,CAACD,OAAO,CAAC,CAACE,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AAClF;AAEA,MAAMC,gBAAwC,GAAG;EAAEC,GAAG,EAAE,GAAG;EAAEC,GAAG,EAAE;AAAI,CAAC;;AAEvE;AACA,OAAO,SAASC,WAAWA,CAACC,MAAc,EAAEC,QAAgB,EAAU;EACpE,MAAMC,MAAM,GAAGN,gBAAgB,CAACK,QAAQ,EAAEE,WAAW,CAAC,CAAC,CAAC,IAAI,EAAE;EAC9D,OAAO,GAAGD,MAAM,GAAGF,MAAM,CAACI,cAAc,CAAC,CAAC,EAAE;AAC9C;;AAEA;AACA,OAAO,SAASC,kBAAkBA,CAACC,OAAgB,EAAEC,QAAiB,EAAU;EAC9E,MAAMC,GAAG,GAAGF,OAAO,EAAEH,WAAW,CAAC,CAAC,IAAI,EAAE;EACxC,OAAOlB,aAAa,CAACuB,GAAG,CAAC,IAAID,QAAQ,IAAI,EAAE;AAC7C;;AAEA;AACA,OAAO,SAASE,cAAcA,CAACC,KAAa,EAAEC,IAAI,GAAG,EAAE,EAAEC,IAAI,GAAG,CAAC,EAAU;EACzE,IAAIF,KAAK,CAACG,MAAM,IAAIF,IAAI,GAAGC,IAAI,GAAG,CAAC,EAAE,OAAOF,KAAK;EACjD,OAAO,GAAGA,KAAK,CAACI,KAAK,CAAC,CAAC,EAAEH,IAAI,CAAC,IAAID,KAAK,CAACI,KAAK,CAAC,CAACF,IAAI,CAAC,EAAE;AACxD","ignoreList":[]}

package/lib/typescript/api/client.d.ts

@@ -1,4 +1,4 @@
-import type { CheckoutResponse, VerifyCryptoPayload, VerifyCryptoResponse } from '../types';
+import type { CheckoutResponse, Coin, CreateLinkData, CreateLinkPayload, Network, VerifyCryptoPayload, VerifyCryptoResponse } from '../types';
 /**
  * A small, typed wrapper around the ClockPay REST API.
  *
@@ -9,6 +9,12 @@ import type { CheckoutResponse, VerifyCryptoPayload, VerifyCryptoResponse } from
 export declare class ClockPayClient {
     private readonly http;
     constructor(publicKey: string, apiBaseUrl?: string);
+    /** Lists the coins a buyer can pay with. */
+    getCoins(): Promise<Coin[]>;
+    /** Lists the settlement networks available for a given coin. */
+    getNetworks(coinId: string): Promise<Network[]>;
+    /** Generates a payment link, returning its reference and client secret. */
+    createLink(payload: CreateLinkPayload): Promise<CreateLinkData>;
     /** Initiates a checkout for the given client secret. */
     initiatePayment(clientSecret: string): Promise<CheckoutResponse>;
     /** Verifies an on-chain transaction by hash. */

package/lib/typescript/api/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../src/api/client.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,gBAAgB,EAChB,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,UAAU,CAAC;AAclB;;;;;;GAMG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAgB;gBAEzB,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM;IAclD,wDAAwD;IAClD,eAAe,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC,gBAAgB,CAAC;IAetE,gDAAgD;IAC1C,YAAY,CAChB,OAAO,EAAE,mBAAmB,GAC3B,OAAO,CAAC,oBAAoB,CAAC;CAWjC"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../src/api/client.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,gBAAgB,EAChB,IAAI,EAEJ,cAAc,EACd,iBAAiB,EAEjB,OAAO,EAEP,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,UAAU,CAAC;AAclB;;;;;;GAMG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAgB;gBAEzB,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM;IAclD,4CAA4C;IACtC,QAAQ,IAAI,OAAO,CAAC,IAAI,EAAE,CAAC;IASjC,gEAAgE;IAC1D,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,OAAO,EAAE,CAAC;IAcrD,2EAA2E;IACrE,UAAU,CAAC,OAAO,EAAE,iBAAiB,GAAG,OAAO,CAAC,cAAc,CAAC;IAYrE,wDAAwD;IAClD,eAAe,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC,gBAAgB,CAAC;IAetE,gDAAgD;IAC1C,YAAY,CAChB,OAAO,EAAE,mBAAmB,GAC3B,OAAO,CAAC,oBAAoB,CAAC;CAWjC"}

package/lib/typescript/api/endpoints.d.ts

@@ -1,4 +1,7 @@
 export declare const endpoints: Readonly<{
+    coins: "/wallet/client/checkout/coins";
+    networks: "/wallet/client/checkout/networks";
+    createLink: "/payment/client/create-link";
     initiatePayment: "/payment/client/checkout";
     verifyCrypto: "/transactions/verify-crypto";
 }>;

package/lib/typescript/api/endpoints.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"endpoints.d.ts","sourceRoot":"","sources":["../../../src/api/endpoints.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;EAGpB,CAAC"}
+{"version":3,"file":"endpoints.d.ts","sourceRoot":"","sources":["../../../src/api/endpoints.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;EAMpB,CAAC"}

package/lib/typescript/components/icons.d.ts

@@ -7,6 +7,7 @@ export declare function LogoIcon({ size }: IconProps): import("react").JSX.Eleme
 export declare function CloseIcon({ size, color }: IconProps): import("react").JSX.Element;
 export declare function CopyIcon({ size, color }: IconProps): import("react").JSX.Element;
 export declare function InfoIcon({ size }: IconProps): import("react").JSX.Element;
+export declare function ChevronDownIcon({ size, color }: IconProps): import("react").JSX.Element;
 export declare function CheckIcon({ size }: IconProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=icons.d.ts.map