@unifold/connect-react 0.1.65 → 0.1.66

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.
Files changed (3) hide show
  1. package/dist/index.js +34 -9
  2. package/dist/index.mjs +34 -9
  3. package/package.json +4 -4
package/dist/index.js CHANGED
@@ -1353,6 +1353,17 @@ var ArrowUpDown = createLucideIcon("ArrowUpDown", [
1353
1353
  ["path", { d: "M7 4v16", key: "1glfcx" }]
1354
1354
  ]);
1355
1355
 
1356
+ // ../../node_modules/.pnpm/lucide-react@0.454.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/bitcoin.js
1357
+ var Bitcoin = createLucideIcon("Bitcoin", [
1358
+ [
1359
+ "path",
1360
+ {
1361
+ d: "M11.767 19.089c4.924.868 6.14-6.025 1.216-6.894m-1.216 6.894L5.86 18.047m5.908 1.042-.347 1.97m1.563-8.864c4.924.869 6.14-6.025 1.215-6.893m-1.215 6.893-3.94-.694m5.155-6.2L8.29 4.26m5.908 1.042.348-1.97M7.48 20.364l3.126-17.727",
1362
+ key: "yr8idg"
1363
+ }
1364
+ ]
1365
+ ]);
1366
+
1356
1367
  // ../../node_modules/.pnpm/lucide-react@0.454.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/check.js
1357
1368
  var Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]]);
1358
1369
 
@@ -27746,7 +27757,10 @@ function WalletConnect({
27746
27757
  children: [
27747
27758
  /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
27748
27759
  WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(WalletIconWithNetwork, { WalletIcon: WALLET_ICONS3[wallet.id], networks: wallet.networks, size: 40, className: "uf-rounded-lg" }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
27749
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-text-sm uf-font-medium", style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: wallet.name })
27760
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
27761
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-text-sm uf-font-medium", style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: wallet.name }),
27762
+ wallet.id === recentWalletId && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full", style: { backgroundColor: colors2.primary + "20", color: colors2.primary, fontFamily: fonts.medium }, children: "Last used" })
27763
+ ] })
27750
27764
  ] }),
27751
27765
  isPending ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin", style: { color: colors2.primary } }) : wallet.isInstalled ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-px-2 uf-py-1 uf-rounded-full", style: { backgroundColor: colors2.primary + "20", color: colors2.primary, fontFamily: fonts.medium }, children: "Detected" }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
27752
27766
  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: showOpenInApp ? "Open" : "Install" }),
@@ -28547,8 +28561,8 @@ function DepositModal({
28547
28561
  cashAppMenuButton
28548
28562
  ].filter(Boolean);
28549
28563
  const depositTabs = [
28550
- { id: "crypto", label: "Use Crypto", buttons: cryptoMenuButtons },
28551
- { id: "cash", label: "Use Cash", buttons: cashMenuButtons }
28564
+ { id: "crypto", label: "Use Crypto", icon: Bitcoin, buttons: cryptoMenuButtons },
28565
+ { id: "cash", label: "Use Cash", icon: DollarSign, buttons: cashMenuButtons }
28552
28566
  ].filter((tab) => tab.buttons.length > 0);
28553
28567
  const activeDepositTab = depositTabs.find((tab) => tab.id === depositTab) ?? depositTabs[0];
28554
28568
  const renderMainMenuBody = () => {
@@ -28571,18 +28585,16 @@ function DepositModal({
28571
28585
  role: "tablist",
28572
28586
  children: depositTabs.map((tab) => {
28573
28587
  const active = activeDepositTab.id === tab.id;
28574
- return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
28588
+ const TabIcon = tab.icon;
28589
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
28575
28590
  "button",
28576
28591
  {
28577
28592
  type: "button",
28578
28593
  role: "tab",
28579
28594
  "aria-selected": active,
28580
28595
  onClick: () => setDepositTab(tab.id),
28581
- className: "uf-flex-1 uf-py-2 uf-px-3 uf-rounded-lg uf-text-sm uf-transition-all",
28596
+ className: "uf-flex-1 uf-py-2 uf-px-3 uf-rounded-lg uf-text-sm uf-transition-all uf-flex uf-items-center uf-justify-center uf-gap-1.5",
28582
28597
  style: {
28583
- // Active tab is a soft, blurred glass pill — a faint accent
28584
- // tint with its own backdrop blur and a subtle border/shadow,
28585
- // so it looks frosted instead of like a hard solid button.
28586
28598
  backgroundColor: active ? `color-mix(in srgb, ${colors2.primary} 22%, transparent)` : "transparent",
28587
28599
  backdropFilter: active ? "blur(8px)" : void 0,
28588
28600
  WebkitBackdropFilter: active ? "blur(8px)" : void 0,
@@ -28590,7 +28602,19 @@ function DepositModal({
28590
28602
  color: active ? colors2.foreground : colors2.foregroundMuted,
28591
28603
  fontFamily: fonts.medium
28592
28604
  },
28593
- children: tab.label
28605
+ children: [
28606
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
28607
+ "span",
28608
+ {
28609
+ className: "uf-inline-flex uf-items-center uf-justify-center uf-rounded-full uf-w-5 uf-h-5 uf-flex-shrink-0",
28610
+ style: {
28611
+ backgroundColor: active ? colors2.foreground : colors2.foregroundMuted
28612
+ },
28613
+ children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(TabIcon, { size: 12, style: { color: active ? colors2.background : colors2.background }, strokeWidth: 2.5 })
28614
+ }
28615
+ ),
28616
+ tab.label
28617
+ ]
28594
28618
  },
28595
28619
  tab.id
28596
28620
  );
@@ -31718,6 +31742,7 @@ lucide-react/dist/esm/createLucideIcon.js:
31718
31742
  lucide-react/dist/esm/icons/arrow-left-right.js:
31719
31743
  lucide-react/dist/esm/icons/arrow-left.js:
31720
31744
  lucide-react/dist/esm/icons/arrow-up-down.js:
31745
+ lucide-react/dist/esm/icons/bitcoin.js:
31721
31746
  lucide-react/dist/esm/icons/check.js:
31722
31747
  lucide-react/dist/esm/icons/chevron-down.js:
31723
31748
  lucide-react/dist/esm/icons/chevron-right.js:
package/dist/index.mjs CHANGED
@@ -1326,6 +1326,17 @@ var ArrowUpDown = createLucideIcon("ArrowUpDown", [
1326
1326
  ["path", { d: "M7 4v16", key: "1glfcx" }]
1327
1327
  ]);
1328
1328
 
1329
+ // ../../node_modules/.pnpm/lucide-react@0.454.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/bitcoin.js
1330
+ var Bitcoin = createLucideIcon("Bitcoin", [
1331
+ [
1332
+ "path",
1333
+ {
1334
+ d: "M11.767 19.089c4.924.868 6.14-6.025 1.216-6.894m-1.216 6.894L5.86 18.047m5.908 1.042-.347 1.97m1.563-8.864c4.924.869 6.14-6.025 1.215-6.893m-1.215 6.893-3.94-.694m5.155-6.2L8.29 4.26m5.908 1.042.348-1.97M7.48 20.364l3.126-17.727",
1335
+ key: "yr8idg"
1336
+ }
1337
+ ]
1338
+ ]);
1339
+
1329
1340
  // ../../node_modules/.pnpm/lucide-react@0.454.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/check.js
1330
1341
  var Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]]);
1331
1342
 
@@ -27732,7 +27743,10 @@ function WalletConnect({
27732
27743
  children: [
27733
27744
  /* @__PURE__ */ jsxs48("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
27734
27745
  WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ jsx54(WalletIconWithNetwork, { WalletIcon: WALLET_ICONS3[wallet.id], networks: wallet.networks, size: 40, className: "uf-rounded-lg" }) : /* @__PURE__ */ jsx54("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
27735
- /* @__PURE__ */ jsx54("div", { className: "uf-text-sm uf-font-medium", style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: wallet.name })
27746
+ /* @__PURE__ */ jsxs48("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
27747
+ /* @__PURE__ */ jsx54("div", { className: "uf-text-sm uf-font-medium", style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: wallet.name }),
27748
+ wallet.id === recentWalletId && /* @__PURE__ */ jsx54("span", { className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full", style: { backgroundColor: colors2.primary + "20", color: colors2.primary, fontFamily: fonts.medium }, children: "Last used" })
27749
+ ] })
27736
27750
  ] }),
27737
27751
  isPending ? /* @__PURE__ */ jsx54(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin", style: { color: colors2.primary } }) : wallet.isInstalled ? /* @__PURE__ */ jsx54("span", { className: "uf-text-xs uf-px-2 uf-py-1 uf-rounded-full", style: { backgroundColor: colors2.primary + "20", color: colors2.primary, fontFamily: fonts.medium }, children: "Detected" }) : /* @__PURE__ */ jsxs48("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
27738
27752
  /* @__PURE__ */ jsx54("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: showOpenInApp ? "Open" : "Install" }),
@@ -28533,8 +28547,8 @@ function DepositModal({
28533
28547
  cashAppMenuButton
28534
28548
  ].filter(Boolean);
28535
28549
  const depositTabs = [
28536
- { id: "crypto", label: "Use Crypto", buttons: cryptoMenuButtons },
28537
- { id: "cash", label: "Use Cash", buttons: cashMenuButtons }
28550
+ { id: "crypto", label: "Use Crypto", icon: Bitcoin, buttons: cryptoMenuButtons },
28551
+ { id: "cash", label: "Use Cash", icon: DollarSign, buttons: cashMenuButtons }
28538
28552
  ].filter((tab) => tab.buttons.length > 0);
28539
28553
  const activeDepositTab = depositTabs.find((tab) => tab.id === depositTab) ?? depositTabs[0];
28540
28554
  const renderMainMenuBody = () => {
@@ -28557,18 +28571,16 @@ function DepositModal({
28557
28571
  role: "tablist",
28558
28572
  children: depositTabs.map((tab) => {
28559
28573
  const active = activeDepositTab.id === tab.id;
28560
- return /* @__PURE__ */ jsx55(
28574
+ const TabIcon = tab.icon;
28575
+ return /* @__PURE__ */ jsxs49(
28561
28576
  "button",
28562
28577
  {
28563
28578
  type: "button",
28564
28579
  role: "tab",
28565
28580
  "aria-selected": active,
28566
28581
  onClick: () => setDepositTab(tab.id),
28567
- className: "uf-flex-1 uf-py-2 uf-px-3 uf-rounded-lg uf-text-sm uf-transition-all",
28582
+ className: "uf-flex-1 uf-py-2 uf-px-3 uf-rounded-lg uf-text-sm uf-transition-all uf-flex uf-items-center uf-justify-center uf-gap-1.5",
28568
28583
  style: {
28569
- // Active tab is a soft, blurred glass pill — a faint accent
28570
- // tint with its own backdrop blur and a subtle border/shadow,
28571
- // so it looks frosted instead of like a hard solid button.
28572
28584
  backgroundColor: active ? `color-mix(in srgb, ${colors2.primary} 22%, transparent)` : "transparent",
28573
28585
  backdropFilter: active ? "blur(8px)" : void 0,
28574
28586
  WebkitBackdropFilter: active ? "blur(8px)" : void 0,
@@ -28576,7 +28588,19 @@ function DepositModal({
28576
28588
  color: active ? colors2.foreground : colors2.foregroundMuted,
28577
28589
  fontFamily: fonts.medium
28578
28590
  },
28579
- children: tab.label
28591
+ children: [
28592
+ /* @__PURE__ */ jsx55(
28593
+ "span",
28594
+ {
28595
+ className: "uf-inline-flex uf-items-center uf-justify-center uf-rounded-full uf-w-5 uf-h-5 uf-flex-shrink-0",
28596
+ style: {
28597
+ backgroundColor: active ? colors2.foreground : colors2.foregroundMuted
28598
+ },
28599
+ children: /* @__PURE__ */ jsx55(TabIcon, { size: 12, style: { color: active ? colors2.background : colors2.background }, strokeWidth: 2.5 })
28600
+ }
28601
+ ),
28602
+ tab.label
28603
+ ]
28580
28604
  },
28581
28605
  tab.id
28582
28606
  );
@@ -31703,6 +31727,7 @@ lucide-react/dist/esm/createLucideIcon.js:
31703
31727
  lucide-react/dist/esm/icons/arrow-left-right.js:
31704
31728
  lucide-react/dist/esm/icons/arrow-left.js:
31705
31729
  lucide-react/dist/esm/icons/arrow-up-down.js:
31730
+ lucide-react/dist/esm/icons/bitcoin.js:
31706
31731
  lucide-react/dist/esm/icons/check.js:
31707
31732
  lucide-react/dist/esm/icons/chevron-down.js:
31708
31733
  lucide-react/dist/esm/icons/chevron-right.js:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unifold/connect-react",
3
- "version": "0.1.65",
3
+ "version": "0.1.66",
4
4
  "description": "Unifold Connect React - Complete React SDK with UI components for crypto deposits",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
@@ -26,9 +26,9 @@
26
26
  },
27
27
  "dependencies": {
28
28
  "@tanstack/react-query": "^5.90.11",
29
- "@unifold/core": "0.1.65",
30
- "@unifold/ui-react": "0.1.65",
31
- "@unifold/react-provider": "0.1.65"
29
+ "@unifold/core": "0.1.66",
30
+ "@unifold/ui-react": "0.1.66",
31
+ "@unifold/react-provider": "0.1.66"
32
32
  },
33
33
  "devDependencies": {
34
34
  "@types/react": "^19.0.0",