@b3dotfun/sdk 0.0.39-alpha.0 → 0.0.40-alpha.0

package/src/anyspend/react/components/common/TransferCryptoDetails.tsx

@@ -11,7 +11,9 @@ import { QRCodeSVG } from "qrcode.react";
 import { memo, useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
 import { b3 } from "viem/chains";
+import { CryptoPaymentMethodType } from "./CryptoPaymentMethod";
 import { OrderDetailsCollapsible } from "./OrderDetailsCollapsible";
+import { PaymentMethodSwitch } from "./PaymentMethodSwitch";
 
 type Order = components["schemas"]["Order"];
 type Token = components["schemas"]["Token"];
@@ -26,6 +28,7 @@ interface TransferCryptoDetailsProps {
   nft?: NFT;
   onBack: () => void;
   recipientName?: string;
+  onPaymentMethodChange?: (method: CryptoPaymentMethodType) => void;
 }
 
 export const TransferCryptoDetails = memo(function TransferCryptoDetails({
@@ -36,6 +39,7 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
   nft,
   onBack,
   recipientName,
+  onPaymentMethodChange,
 }: TransferCryptoDetailsProps) {
   const [timeLeft, setTimeLeft] = useState(0);
 
@@ -98,21 +102,21 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
   };
 
   return (
-    <div className="flex w-full flex-col gap-6">
+    <div className="order-transfer-crypto flex w-full flex-col gap-6">
       {/* Header */}
-      <div className="flex items-center justify-between">
+      <div className="order-transfer-crypto-header flex items-center justify-between">
         <button
           onClick={onBack}
-          className="text-as-primary/60 hover:text-as-primary flex h-10 w-10 items-center justify-center rounded-full transition-colors"
+          className="order-transfer-crypto-back-btn text-as-primary/60 hover:text-as-primary flex h-10 w-10 items-center justify-center rounded-full transition-colors"
         >
           <ChevronLeft size={24} className="text-as-quaternary" />
         </button>
 
-        <h2 className="text-as-primary text-lg font-semibold">Transfer crypto</h2>
+        <h2 className="order-transfer-crypto-title text-as-primary text-lg font-semibold">Transfer crypto</h2>
 
         {/* Countdown Timer */}
-        <div className="relative flex h-11 w-11 items-center justify-center">
-          <svg className="h-11 w-11 -rotate-90" viewBox="0 0 44 44">
+        <div className="order-transfer-crypto-timer relative flex h-11 w-11 items-center justify-center">
+          <svg className="order-transfer-crypto-timer-svg h-11 w-11 -rotate-90" viewBox="0 0 44 44">
             <circle
               cx="22"
               cy="22"
@@ -120,7 +124,7 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
               stroke="currentColor"
               strokeWidth="3"
               fill="none"
-              className="text-gray-200"
+              className="order-transfer-crypto-timer-bg text-gray-200"
             />
             <circle
               cx="22"
@@ -130,7 +134,7 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
               strokeWidth="3"
               fill="none"
               strokeLinecap="round"
-              className="text-blue-500"
+              className="order-transfer-crypto-timer-progress text-blue-500"
               strokeDasharray={`${2 * Math.PI * 18}`}
               strokeDashoffset={`${2 * Math.PI * 18 * (1 - timeLeft / totalTime)}`}
               style={{
@@ -138,57 +142,66 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
               }}
             />
           </svg>
-          <div className="absolute inset-0 flex items-center justify-center">
+          <div className="order-transfer-crypto-timer-text absolute inset-0 flex items-center justify-center">
             <span className="text-as-primary text-[10px] font-semibold">{formatTime(timeLeft)}</span>
           </div>
         </div>
       </div>
 
       {/* Main Content Cards */}
-      <div className="flex w-full flex-col gap-4">
+      <div className="order-transfer-crypto-content flex w-full flex-col gap-4">
         {/* Amount Card */}
-        <div className="flex items-center gap-4">
-          <div className="w-full">
-            <span className="text-as-content-secondary text-sm font-medium">Amount</span>
-            <div className="border-as-border-primary rounded-lg border p-2 shadow-sm">
+        <div className="order-transfer-crypto-cards flex items-center gap-4">
+          <div className="order-transfer-crypto-amount-card w-full">
+            <span className="order-transfer-crypto-amount-label text-as-content-secondary text-sm font-medium">
+              Amount
+            </span>
+            <div className="order-transfer-crypto-amount-container border-as-border-primary rounded-lg border p-2 shadow-sm">
               <CopyToClipboard
                 text={roundedUpSrcAmount || ""}
                 onCopy={() => {
                   toast.success("Amount copied to clipboard");
                 }}
               >
-                <div className="flex cursor-pointer items-center justify-between gap-2">
-                  <strong className="text-as-primary font-semibold">
+                <div className="order-transfer-crypto-amount-copy flex cursor-pointer items-center justify-between gap-2">
+                  <strong className="order-transfer-crypto-amount-text text-as-primary font-semibold">
                     {roundedUpSrcAmount} {srcToken.symbol}
                   </strong>
-                  <Copy className="text-as-primary/50 hover:text-as-primary h-4 w-4 transition-all duration-200" />
+                  <Copy className="order-transfer-crypto-amount-copy-icon text-as-primary/50 hover:text-as-primary h-4 w-4 transition-all duration-200" />
                 </div>
               </CopyToClipboard>
             </div>
           </div>
 
           {/* Chain Card */}
-          <div className="w-full">
-            <span className="text-as-content-secondary text-sm font-medium">Chain</span>
-            <div className="border-as-border-primary rounded-lg border p-2 shadow-sm">
-              <div className="flex items-center gap-2">
+          <div className="order-transfer-crypto-chain-card w-full">
+            <span className="order-transfer-crypto-chain-label text-as-content-secondary text-sm font-medium">
+              Chain
+            </span>
+            <div className="order-transfer-crypto-chain-container border-as-border-primary rounded-lg border p-2 shadow-sm">
+              <div className="order-transfer-crypto-chain-info flex items-center gap-2">
                 <img
                   src={ALL_CHAINS[order.srcChain].logoUrl}
                   alt={getChainName(order.srcChain)}
-                  className={cn("h-6 rounded-full", order.srcChain === b3.id && "h-5 rounded-none")}
+                  className={cn(
+                    "order-transfer-crypto-chain-logo h-6 rounded-full",
+                    order.srcChain === b3.id && "h-5 rounded-none",
+                  )}
                 />
-                <span className="text-as-primary text-sm font-semibold">{getChainName(order.srcChain)}</span>
+                <span className="order-transfer-crypto-chain-name text-as-primary text-sm font-semibold">
+                  {getChainName(order.srcChain)}
+                </span>
               </div>
             </div>
           </div>
         </div>
 
         {/* QR Code and Deposit Address Card */}
-        <div className="border-b3-react-border bg-as-surface-secondary grid h-[220px] grid-cols-2 overflow-hidden rounded-xl border">
+        <div className="order-transfer-crypto-qr-deposit-card border-b3-react-border bg-as-surface-secondary grid h-[220px] grid-cols-2 overflow-hidden rounded-xl border">
           {/* QR Code Section */}
-          <div className="border-as-border-primary h-full w-full border-r">
-            <div className="flex justify-center">
-              <div className="bg-as-surface-secondary flex flex-col items-center rounded-lg p-6">
+          <div className="order-transfer-crypto-qr-section border-as-border-primary h-full w-full border-r">
+            <div className="order-transfer-crypto-qr-wrapper flex justify-center">
+              <div className="order-transfer-crypto-qr-container bg-as-surface-secondary flex flex-col items-center rounded-lg p-6">
                 <QRCodeSVG
                   value={getPaymentUrl(
                     order.globalAddress,
@@ -197,15 +210,17 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
                     order.srcChain,
                     srcToken?.decimals,
                   )}
-                  className="bg-as-surface-secondary max-h-48 max-w-48"
+                  className="order-transfer-crypto-qr-code bg-as-surface-secondary max-h-48 max-w-48"
                 />
-                <div className="mt-3 flex items-center justify-center gap-2 text-sm">
-                  <span className="text-as-brand/70 text-sm font-medium">SCAN WITH</span>
+                <div className="order-transfer-crypto-wallet-hint mt-3 flex items-center justify-center gap-2 text-sm">
+                  <span className="order-transfer-crypto-wallet-text text-as-brand/70 text-sm font-medium">
+                    SCAN WITH
+                  </span>
                   <TextLoop interval={3}>
-                    <WalletMetamask className="h-5 w-5" variant="branded" />
-                    <WalletCoinbase className="h-5 w-5" variant="branded" />
-                    <WalletPhantom className="h-5 w-5" variant="branded" />
-                    <WalletTrust className="h-5 w-5" variant="branded" />
+                    <WalletMetamask className="order-transfer-crypto-wallet-icon h-5 w-5" variant="branded" />
+                    <WalletCoinbase className="order-transfer-crypto-wallet-icon h-5 w-5" variant="branded" />
+                    <WalletPhantom className="order-transfer-crypto-wallet-icon h-5 w-5" variant="branded" />
+                    <WalletTrust className="order-transfer-crypto-wallet-icon h-5 w-5" variant="branded" />
                   </TextLoop>
                 </div>
               </div>
@@ -213,17 +228,19 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
           </div>
 
           {/* Deposit Address Section */}
-          <div className="flex h-full w-full flex-col gap-2 p-6">
-            <span className="text-as-content-secondary text-sm font-medium">Deposit address:</span>
+          <div className="order-transfer-crypto-address-section flex h-full w-full flex-col gap-2 p-6">
+            <span className="order-transfer-crypto-address-label text-as-content-secondary text-sm font-medium">
+              Deposit address:
+            </span>
             <div
-              className="flex h-full cursor-pointer flex-col items-stretch justify-between gap-4"
+              className="order-transfer-crypto-address-copy flex h-full cursor-pointer flex-col items-stretch justify-between gap-4"
               onClick={handleCopyAddress}
             >
-              <div className="text-as-primary break-all font-mono text-sm font-semibold leading-relaxed">
+              <div className="order-transfer-crypto-address-text text-as-primary break-all font-mono text-sm font-semibold leading-relaxed">
                 {order.globalAddress}
               </div>
-              <div className="place-self-end">
-                <Copy className="group-hover:text-as-brand text-as-tertiarry h-4 w-4 cursor-pointer transition-all duration-200" />
+              <div className="order-transfer-crypto-address-copy-icon-wrapper place-self-end">
+                <Copy className="order-transfer-crypto-address-copy-icon group-hover:text-as-brand text-as-tertiarry h-4 w-4 cursor-pointer transition-all duration-200" />
               </div>
             </div>
           </div>
@@ -240,23 +257,28 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({
       </div>
 
       {/* Action Buttons */}
-      <div className="flex flex-col gap-3">
+      <div className="order-transfer-crypto-actions flex flex-col gap-3">
         <ShinyButton
           accentColor="hsl(var(--as-brand))"
           textColor="text-white"
-          className="w-full py-3"
+          className="order-transfer-crypto-copy-btn w-full py-3"
           onClick={handleCopyAddress}
         >
           Copy deposit address
         </ShinyButton>
 
         {/* <button
-          className="text-as-primary/60 hover:text-as-primary flex w-full items-center justify-center gap-2 py-2 transition-colors"
+          className="order-transfer-crypto-cancel-btn text-as-primary/60 hover:text-as-primary flex w-full items-center justify-center gap-2 py-2 transition-colors"
           onClick={onBack}
         >
           <RefreshCcw className="h-4 w-4" />
           Cancel and start over
         </button> */}
+
+        <PaymentMethodSwitch
+          currentMethod={CryptoPaymentMethodType.TRANSFER_CRYPTO}
+          onMethodChange={onPaymentMethodChange}
+        />
       </div>
     </div>
   );

package/src/global-account/react/components/B3Provider/B3Provider.tsx

@@ -1,12 +1,8 @@
-import { Users } from "@b3dotfun/b3-api";
 import { RelayKitProviderWrapper, TooltipProvider, useAuthStore } from "@b3dotfun/sdk/global-account/react";
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { loadGA4Script } from "@b3dotfun/sdk/global-account/utils/analytics";
 import { supportedChains } from "@b3dotfun/sdk/shared/constants/chains/supported";
-import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
-import "@reservoir0x/relay-kit-ui/styles.css";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { inAppWalletConnector } from "@thirdweb-dev/wagmi-adapter";
 import { useCallback, useEffect, useState } from "react";
 import { Toaster } from "sonner";
 import {
@@ -22,6 +18,9 @@ import { ClientType, setClientType } from "../../../client-manager";
 import { StyleRoot } from "../StyleRoot";
 import { B3Context, B3ContextType } from "./types";
 
+import { Users } from "@b3dotfun/b3-api";
+import "@reservoir0x/relay-kit-ui/styles.css";
+
 /**
  * Default permissions configuration for B3 provider
  */
@@ -35,13 +34,6 @@ const DEFAULT_PERMISSIONS = {
 export const wagmiConfig = createConfig({
   chains: [supportedChains[0], ...supportedChains.slice(1)],
   transports: Object.fromEntries(supportedChains.map(chain => [chain.id, http()])) as any,
-  connectors: [
-    inAppWalletConnector({
-      client,
-    }),
-    // injected(),
-    // coinbaseWallet({ appName: "HypeDuel" }),
-  ],
 });
 
 // Create queryClient instance

package/dist/cjs/global-account/examples/client-selection-example.d.ts

@@ -1,5 +0,0 @@
-/**
- * Example app showing different client configurations
- */
-export declare function ClientSelectionApp(): import("react/jsx-runtime").JSX.Element;
-export default ClientSelectionApp;

package/dist/cjs/global-account/examples/client-selection-example.js

@@ -1,96 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ClientSelectionApp = ClientSelectionApp;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("../../global-account/react");
-const react_2 = require("react");
-/**
- * Example component showing how to use the client selection system
- */
-function ClientSelectionExample() {
-    const { clientType, switchClientType, getCurrentClient, authenticateWithType } = (0, react_1.useClient)();
-    const { user } = (0, react_1.useB3)();
-    const [data, setData] = (0, react_2.useState)(null);
-    const [loading, setLoading] = (0, react_2.useState)(false);
-    const handleSwitchClient = (type) => {
-        switchClientType(type);
-    };
-    const handleFetchData = async () => {
-        setLoading(true);
-        try {
-            const client = getCurrentClient();
-            const result = await client.service("users").find();
-            setData(result);
-        }
-        catch (error) {
-            console.error("Failed to fetch data:", error);
-        }
-        finally {
-            setLoading(false);
-        }
-    };
-    const handleAuthenticateWithType = async (type) => {
-        try {
-            const result = await authenticateWithType(type, "your-access-token", "your-identity-token");
-            console.log(`Authenticated with ${type}:`, result);
-        }
-        catch (error) {
-            console.error(`Authentication failed with ${type}:`, error);
-        }
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { padding: "20px", fontFamily: "Arial, sans-serif" }, children: [(0, jsx_runtime_1.jsx)("h2", { children: "Client Selection Example" }), (0, jsx_runtime_1.jsxs)("div", { style: { marginBottom: "20px" }, children: [(0, jsx_runtime_1.jsxs)("h3", { children: ["Current Client Type: ", clientType] }), (0, jsx_runtime_1.jsxs)("div", { style: { display: "flex", gap: "10px", marginBottom: "10px" }, children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => handleSwitchClient("socket"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: clientType === "socket" ? "#007bff" : "#f8f9fa",
-                                    color: clientType === "socket" ? "white" : "black",
-                                    border: "1px solid #007bff",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Switch to Socket" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => handleSwitchClient("rest"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: clientType === "rest" ? "#007bff" : "#f8f9fa",
-                                    color: clientType === "rest" ? "white" : "black",
-                                    border: "1px solid #007bff",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Switch to REST" })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: { marginBottom: "20px" }, children: [(0, jsx_runtime_1.jsx)("h3", { children: "Test API Calls" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleFetchData, disabled: loading, style: {
-                            padding: "8px 16px",
-                            backgroundColor: "#28a745",
-                            color: "white",
-                            border: "none",
-                            borderRadius: "4px",
-                            cursor: loading ? "not-allowed" : "pointer"
-                        }, children: loading ? "Loading..." : "Fetch Data" }), data && ((0, jsx_runtime_1.jsx)("pre", { style: {
-                            marginTop: "10px",
-                            padding: "10px",
-                            backgroundColor: "#f8f9fa",
-                            borderRadius: "4px",
-                            overflow: "auto"
-                        }, children: JSON.stringify(data, null, 2) }))] }), (0, jsx_runtime_1.jsxs)("div", { style: { marginBottom: "20px" }, children: [(0, jsx_runtime_1.jsx)("h3", { children: "Authentication Tests" }), (0, jsx_runtime_1.jsxs)("div", { style: { display: "flex", gap: "10px" }, children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => handleAuthenticateWithType("socket"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: "#17a2b8",
-                                    color: "white",
-                                    border: "none",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Auth with Socket" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => handleAuthenticateWithType("rest"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: "#17a2b8",
-                                    color: "white",
-                                    border: "none",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Auth with REST" })] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: "User Status" }), (0, jsx_runtime_1.jsxs)("p", { children: ["Authenticated: ", user ? "Yes" : "No"] }), user && ((0, jsx_runtime_1.jsx)("pre", { style: {
-                            padding: "10px",
-                            backgroundColor: "#f8f9fa",
-                            borderRadius: "4px",
-                            overflow: "auto"
-                        }, children: JSON.stringify(user, null, 2) }))] })] }));
-}
-/**
- * Example app showing different client configurations
- */
-function ClientSelectionApp() {
-    const [clientType, setClientType] = (0, react_2.useState)("socket");
-    return ((0, jsx_runtime_1.jsx)(react_1.B3Provider, { environment: "development", clientType: clientType, automaticallySetFirstEoa: true, theme: "light", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { children: "B3 SDK Client Selection Demo" }), (0, jsx_runtime_1.jsx)("div", { style: { marginBottom: "20px" }, children: (0, jsx_runtime_1.jsxs)("label", { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Provider Client Type:" }), (0, jsx_runtime_1.jsxs)("select", { value: clientType, onChange: (e) => setClientType(e.target.value), style: { marginLeft: "10px", padding: "4px 8px" }, children: [(0, jsx_runtime_1.jsx)("option", { value: "socket", children: "Socket (Default)" }), (0, jsx_runtime_1.jsx)("option", { value: "rest", children: "REST" })] })] }) }), (0, jsx_runtime_1.jsx)(ClientSelectionExample, {})] }) }));
-}
-exports.default = ClientSelectionApp;

package/dist/esm/global-account/examples/client-selection-example.d.ts

@@ -1,5 +0,0 @@
-/**
- * Example app showing different client configurations
- */
-export declare function ClientSelectionApp(): import("react/jsx-runtime").JSX.Element;
-export default ClientSelectionApp;

package/dist/esm/global-account/examples/client-selection-example.js

@@ -1,93 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { B3Provider, useB3, useClient } from "../../global-account/react/index.js";
-import { useState } from "react";
-/**
- * Example component showing how to use the client selection system
- */
-function ClientSelectionExample() {
-    const { clientType, switchClientType, getCurrentClient, authenticateWithType } = useClient();
-    const { user } = useB3();
-    const [data, setData] = useState(null);
-    const [loading, setLoading] = useState(false);
-    const handleSwitchClient = (type) => {
-        switchClientType(type);
-    };
-    const handleFetchData = async () => {
-        setLoading(true);
-        try {
-            const client = getCurrentClient();
-            const result = await client.service("users").find();
-            setData(result);
-        }
-        catch (error) {
-            console.error("Failed to fetch data:", error);
-        }
-        finally {
-            setLoading(false);
-        }
-    };
-    const handleAuthenticateWithType = async (type) => {
-        try {
-            const result = await authenticateWithType(type, "your-access-token", "your-identity-token");
-            console.log(`Authenticated with ${type}:`, result);
-        }
-        catch (error) {
-            console.error(`Authentication failed with ${type}:`, error);
-        }
-    };
-    return (_jsxs("div", { style: { padding: "20px", fontFamily: "Arial, sans-serif" }, children: [_jsx("h2", { children: "Client Selection Example" }), _jsxs("div", { style: { marginBottom: "20px" }, children: [_jsxs("h3", { children: ["Current Client Type: ", clientType] }), _jsxs("div", { style: { display: "flex", gap: "10px", marginBottom: "10px" }, children: [_jsx("button", { onClick: () => handleSwitchClient("socket"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: clientType === "socket" ? "#007bff" : "#f8f9fa",
-                                    color: clientType === "socket" ? "white" : "black",
-                                    border: "1px solid #007bff",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Switch to Socket" }), _jsx("button", { onClick: () => handleSwitchClient("rest"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: clientType === "rest" ? "#007bff" : "#f8f9fa",
-                                    color: clientType === "rest" ? "white" : "black",
-                                    border: "1px solid #007bff",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Switch to REST" })] })] }), _jsxs("div", { style: { marginBottom: "20px" }, children: [_jsx("h3", { children: "Test API Calls" }), _jsx("button", { onClick: handleFetchData, disabled: loading, style: {
-                            padding: "8px 16px",
-                            backgroundColor: "#28a745",
-                            color: "white",
-                            border: "none",
-                            borderRadius: "4px",
-                            cursor: loading ? "not-allowed" : "pointer"
-                        }, children: loading ? "Loading..." : "Fetch Data" }), data && (_jsx("pre", { style: {
-                            marginTop: "10px",
-                            padding: "10px",
-                            backgroundColor: "#f8f9fa",
-                            borderRadius: "4px",
-                            overflow: "auto"
-                        }, children: JSON.stringify(data, null, 2) }))] }), _jsxs("div", { style: { marginBottom: "20px" }, children: [_jsx("h3", { children: "Authentication Tests" }), _jsxs("div", { style: { display: "flex", gap: "10px" }, children: [_jsx("button", { onClick: () => handleAuthenticateWithType("socket"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: "#17a2b8",
-                                    color: "white",
-                                    border: "none",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Auth with Socket" }), _jsx("button", { onClick: () => handleAuthenticateWithType("rest"), style: {
-                                    padding: "8px 16px",
-                                    backgroundColor: "#17a2b8",
-                                    color: "white",
-                                    border: "none",
-                                    borderRadius: "4px",
-                                    cursor: "pointer"
-                                }, children: "Auth with REST" })] })] }), _jsxs("div", { children: [_jsx("h3", { children: "User Status" }), _jsxs("p", { children: ["Authenticated: ", user ? "Yes" : "No"] }), user && (_jsx("pre", { style: {
-                            padding: "10px",
-                            backgroundColor: "#f8f9fa",
-                            borderRadius: "4px",
-                            overflow: "auto"
-                        }, children: JSON.stringify(user, null, 2) }))] })] }));
-}
-/**
- * Example app showing different client configurations
- */
-export function ClientSelectionApp() {
-    const [clientType, setClientType] = useState("socket");
-    return (_jsx(B3Provider, { environment: "development", clientType: clientType, automaticallySetFirstEoa: true, theme: "light", children: _jsxs("div", { children: [_jsx("h1", { children: "B3 SDK Client Selection Demo" }), _jsx("div", { style: { marginBottom: "20px" }, children: _jsxs("label", { children: [_jsx("strong", { children: "Provider Client Type:" }), _jsxs("select", { value: clientType, onChange: (e) => setClientType(e.target.value), style: { marginLeft: "10px", padding: "4px 8px" }, children: [_jsx("option", { value: "socket", children: "Socket (Default)" }), _jsx("option", { value: "rest", children: "REST" })] })] }) }), _jsx(ClientSelectionExample, {})] }) }));
-}
-export default ClientSelectionApp;

package/dist/types/global-account/examples/client-selection-example.d.ts

@@ -1,5 +0,0 @@
-/**
- * Example app showing different client configurations
- */
-export declare function ClientSelectionApp(): import("react/jsx-runtime").JSX.Element;
-export default ClientSelectionApp;

package/src/global-account/app.d.ts

@@ -1,14 +0,0 @@
-import { ClientApplication } from "@b3dotfun/b3-api";
-import { ClientType } from "./client-manager";
-
-// Hybrid app type that is both a client instance AND a function
-export interface HybridApp extends ClientApplication {
-  (clientType: "socket"): ClientApplication;
-  (clientType: "rest"): ClientApplication;
-  (clientType: ClientType): ClientApplication;
-}
-
-// Export the hybrid app as the default
-declare const app: HybridApp;
-export default app;
-