thirdweb 5.31.1 → 5.32.0

package/dist/cjs/react/core/utils/wallet.js

@@ -0,0 +1,85 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useConnectedWalletDetails = useConnectedWalletDetails;
+exports.useWalletInfo = useWalletInfo;
+exports.useWalletImage = useWalletImage;
+const react_query_1 = require("@tanstack/react-query");
+const ethereum_js_1 = require("../../../chains/chain-definitions/ethereum.js");
+const resolve_avatar_js_1 = require("../../../extensions/ens/resolve-avatar.js");
+const resolve_name_js_1 = require("../../../extensions/ens/resolve-name.js");
+const getWalletInfo_js_1 = require("../../../wallets/__generated__/getWalletInfo.js");
+const useWalletBalance_js_1 = require("../hooks/others/useWalletBalance.js");
+const addresses_js_1 = require("./addresses.js");
+/**
+ * @internal
+ */
+function useConnectedWalletDetails(client, walletChain, activeAccount, displayBalanceToken) {
+    const tokenAddress = walletChain && displayBalanceToken
+        ? displayBalanceToken[Number(walletChain.id)]
+        : undefined;
+    const ensNameQuery = (0, react_query_1.useQuery)({
+        queryKey: ["ens-name", activeAccount?.address],
+        enabled: !!activeAccount?.address,
+        queryFn: () => (0, resolve_name_js_1.resolveName)({
+            client,
+            address: activeAccount?.address || "",
+            resolverChain: ethereum_js_1.ethereum,
+        }),
+    });
+    const ensAvatarQuery = (0, react_query_1.useQuery)({
+        queryKey: ["ens-avatar", ensNameQuery.data],
+        enabled: !!ensNameQuery.data,
+        queryFn: async () => (0, resolve_avatar_js_1.resolveAvatar)({
+            client,
+            name: ensNameQuery.data || "",
+        }),
+    });
+    const shortAddress = activeAccount?.address
+        ? (0, addresses_js_1.shortenString)(activeAccount.address, false)
+        : "";
+    const balanceQuery = (0, useWalletBalance_js_1.useWalletBalance)({
+        chain: walletChain ? walletChain : undefined,
+        tokenAddress,
+        address: activeAccount?.address,
+        client,
+    });
+    const addressOrENS = ensNameQuery.data || shortAddress;
+    return {
+        ensNameQuery,
+        ensAvatarQuery,
+        addressOrENS,
+        shortAddress,
+        balanceQuery,
+    };
+}
+/**
+ * Returns the wallet info for the provided wallet id.
+ * @wallet
+ */
+function useWalletInfo(id) {
+    return (0, react_query_1.useQuery)({
+        queryKey: ["wallet-info", id],
+        queryFn: () => {
+            return (0, getWalletInfo_js_1.getWalletInfo)(id, false);
+        },
+        retry: false,
+        refetchOnWindowFocus: false,
+        refetchOnMount: false,
+    });
+}
+/**
+ * Returns the wallet image for the provided wallet id.
+ * @wallet
+ */
+function useWalletImage(id) {
+    return (0, react_query_1.useQuery)({
+        queryKey: ["wallet-image", id],
+        queryFn: () => {
+            return (0, getWalletInfo_js_1.getWalletInfo)(id, true);
+        },
+        retry: false,
+        refetchOnWindowFocus: false,
+        refetchOnMount: false,
+    });
+}
+//# sourceMappingURL=wallet.js.map

package/dist/cjs/react/core/utils/wallet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wallet.js","sourceRoot":"","sources":["../../../../../src/react/core/utils/wallet.ts"],"names":[],"mappings":";;AAgBA,8DAoDC;AAMD,sCAUC;AAMD,wCAUC;AApGD,uDAAiD;AACjD,+EAAyE;AAGzE,iFAA0E;AAC1E,6EAAsE;AACtE,sFAAgF;AAIhF,6EAAuE;AACvE,iDAA+C;AAE/C;;GAEG;AACH,SAAgB,yBAAyB,CACvC,MAAsB,EACtB,WAA8B,EAC9B,aAAkC,EAClC,mBAA4C;IAE5C,MAAM,YAAY,GAChB,WAAW,IAAI,mBAAmB;QAChC,CAAC,CAAC,mBAAmB,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;QAC7C,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,YAAY,GAAG,IAAA,sBAAQ,EAAC;QAC5B,QAAQ,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,OAAO,CAAC;QAC9C,OAAO,EAAE,CAAC,CAAC,aAAa,EAAE,OAAO;QACjC,OAAO,EAAE,GAAG,EAAE,CACZ,IAAA,6BAAW,EAAC;YACV,MAAM;YACN,OAAO,EAAE,aAAa,EAAE,OAAO,IAAI,EAAE;YACrC,aAAa,EAAE,sBAAQ;SACxB,CAAC;KACL,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,IAAA,sBAAQ,EAAC;QAC9B,QAAQ,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC,IAAI,CAAC;QAC3C,OAAO,EAAE,CAAC,CAAC,YAAY,CAAC,IAAI;QAC5B,OAAO,EAAE,KAAK,IAAI,EAAE,CAClB,IAAA,iCAAa,EAAC;YACZ,MAAM;YACN,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,EAAE;SAC9B,CAAC;KACL,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,aAAa,EAAE,OAAO;QACzC,CAAC,CAAC,IAAA,4BAAa,EAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC;QAC7C,CAAC,CAAC,EAAE,CAAC;IAEP,MAAM,YAAY,GAAG,IAAA,sCAAgB,EAAC;QACpC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS;QAC5C,YAAY;QACZ,OAAO,EAAE,aAAa,EAAE,OAAO;QAC/B,MAAM;KACP,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,YAAY,CAAC,IAAI,IAAI,YAAY,CAAC;IAEvD,OAAO;QACL,YAAY;QACZ,cAAc;QACd,YAAY;QACZ,YAAY;QACZ,YAAY;KACb,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,SAAgB,aAAa,CAAC,EAAY;IACxC,OAAO,IAAA,sBAAQ,EAAa;QAC1B,QAAQ,EAAE,CAAC,aAAa,EAAE,EAAE,CAAC;QAC7B,OAAO,EAAE,GAAG,EAAE;YACZ,OAAO,IAAA,gCAAa,EAAC,EAAE,EAAE,KAAK,CAAC,CAAC;QAClC,CAAC;QACD,KAAK,EAAE,KAAK;QACZ,oBAAoB,EAAE,KAAK;QAC3B,cAAc,EAAE,KAAK;KACtB,CAAC,CAAC;AACL,CAAC;AAED;;;GAGG;AACH,SAAgB,cAAc,CAAC,EAAY;IACzC,OAAO,IAAA,sBAAQ,EAAC;QACd,QAAQ,EAAE,CAAC,cAAc,EAAE,EAAE,CAAC;QAC9B,OAAO,EAAE,GAAG,EAAE;YACZ,OAAO,IAAA,gCAAa,EAAC,EAAE,EAAE,IAAI,CAAC,CAAC;QACjC,CAAC;QACD,KAAK,EAAE,KAAK;QACZ,oBAAoB,EAAE,KAAK;QAC3B,cAAc,EAAE,KAAK;KACtB,CAAC,CAAC;AACL,CAAC"}

package/dist/cjs/react/native/design-system/index.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fontSize = exports.radius = exports.spacing = void 0;
+exports.spacing = {
+    xxs: 2,
+    xs: 4,
+    sm: 8,
+    smd: 12,
+    md: 16,
+    lg: 24,
+    xl: 32,
+    xxl: 48,
+    "3xl": 64,
+};
+exports.radius = {
+    none: 0,
+    sm: 4,
+    md: 8,
+    lg: 12,
+    xl: 24,
+    xxl: 32,
+    full: 9999,
+};
+exports.fontSize = {
+    xxs: 10,
+    xs: 12,
+    sm: 14,
+    md: 16,
+    lg: 20,
+    xl: 24,
+    xxl: 32,
+};
+//# sourceMappingURL=index.js.map

package/dist/cjs/react/native/design-system/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/react/native/design-system/index.ts"],"names":[],"mappings":";;;AAAa,QAAA,OAAO,GAAG;IACrB,GAAG,EAAE,CAAC;IACN,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,GAAG,EAAE,EAAE;IACP,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,EAAE;IACP,KAAK,EAAE,EAAE;CACV,CAAC;AAEW,QAAA,MAAM,GAAG;IACpB,IAAI,EAAE,CAAC;IACP,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,EAAE;IACP,IAAI,EAAE,IAAI;CACX,CAAC;AAEW,QAAA,QAAQ,GAAG;IACtB,GAAG,EAAE,EAAE;IACP,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,EAAE;CACR,CAAC"}

package/dist/cjs/react/native/hooks/wallets/useAutoConnect.js

@@ -4,6 +4,7 @@ exports.useAutoConnect = useAutoConnect;
 const nativeStorage_js_1 = require("../../../../utils/storage/nativeStorage.js");
 const useAutoConnect_js_1 = require("../../../core/hooks/wallets/useAutoConnect.js");
 const index_js_1 = require("../../index.js");
+const defaultWallets_js_1 = require("../../wallets/defaultWallets.js");
 /**
  * Autoconnect the last previously connected wallet.
  *
@@ -24,6 +25,9 @@ const index_js_1 = require("../../index.js");
  * @returns whether the auto connect was successful.
  */
 function useAutoConnect(props) {
-    return (0, useAutoConnect_js_1.useAutoConnectCore)(index_js_1.connectionManager, nativeStorage_js_1.nativeLocalStorage, props);
+    return (0, useAutoConnect_js_1.useAutoConnectCore)(index_js_1.connectionManager, nativeStorage_js_1.nativeLocalStorage, {
+        ...props,
+        wallets: props.wallets || (0, defaultWallets_js_1.getDefaultWallets)(props),
+    });
 }
 //# sourceMappingURL=useAutoConnect.js.map

package/dist/cjs/react/native/hooks/wallets/useAutoConnect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoConnect.js","sourceRoot":"","sources":["../../../../../../src/react/native/hooks/wallets/useAutoConnect.ts"],"names":[],"mappings":";;AAwBA,wCAEC;AA1BD,iFAAgF;AAEhF,qFAAmF;AACnF,6CAAmD;AAEnD;;;;;;;;;;;;;;;;;;GAkBG;AACH,SAAgB,cAAc,CAAC,KAAuB;IACpD,OAAO,IAAA,sCAAkB,EAAC,4BAAiB,EAAE,qCAAkB,EAAE,KAAK,CAAC,CAAC;AAC1E,CAAC"}
+{"version":3,"file":"useAutoConnect.js","sourceRoot":"","sources":["../../../../../../src/react/native/hooks/wallets/useAutoConnect.ts"],"names":[],"mappings":";;AAyBA,wCAKC;AA9BD,iFAAgF;AAEhF,qFAAmF;AACnF,6CAAmD;AACnD,uEAAoE;AAEpE;;;;;;;;;;;;;;;;;;GAkBG;AACH,SAAgB,cAAc,CAAC,KAAuB;IACpD,OAAO,IAAA,sCAAkB,EAAC,4BAAiB,EAAE,qCAAkB,EAAE;QAC/D,GAAG,KAAK;QACR,OAAO,EAAE,KAAK,CAAC,OAAO,IAAI,IAAA,qCAAiB,EAAC,KAAK,CAAC;KACnD,CAAC,CAAC;AACL,CAAC"}

package/dist/cjs/react/native/hooks/wallets/useSendToken.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSendToken = useSendToken;
+const useSendToken_js_1 = require("../../../core/hooks/wallets/useSendToken.js");
+const useActiveWallet_js_1 = require("./useActiveWallet.js");
+/**
+ * Send Native or ERC20 tokens from active wallet to given address.
+ * @example
+ * ```tsx
+ * const { mutate: sendToken } = useSendToken(client);
+ *
+ * // send native currency
+ * sendToken({
+ *    receiverAddress: "0x...",
+ *    amount: "0.1",
+ * });
+ *
+ * // send ERC20
+ * sendToken({
+ *   tokenAddress,
+ *   receiverAddress: "0x...",
+ *   amount: "0.5",
+ * });
+ * ```
+ * @wallet
+ */
+function useSendToken(client) {
+    const wallet = (0, useActiveWallet_js_1.useActiveWallet)();
+    return (0, useSendToken_js_1.useSendTokenCore)(client, wallet);
+}
+//# sourceMappingURL=useSendToken.js.map

package/dist/cjs/react/native/hooks/wallets/useSendToken.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSendToken.js","sourceRoot":"","sources":["../../../../../../src/react/native/hooks/wallets/useSendToken.ts"],"names":[],"mappings":";;AAyBA,oCAGC;AA3BD,iFAA+E;AAC/E,6DAAuD;AAEvD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAgB,YAAY,CAAC,MAAsB;IACjD,MAAM,MAAM,GAAG,IAAA,oCAAe,GAAE,CAAC;IACjC,OAAO,IAAA,kCAAgB,EAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,CAAC"}

package/dist/cjs/react/native/ui/components/Address.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Address = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const clipboard_1 = require("@react-native-clipboard/clipboard");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const index_js_1 = require("../../design-system/index.js");
+const svgs_js_1 = require("../icons/svgs.js");
+const RNImage_js_1 = require("./RNImage.js");
+const text_js_1 = require("./text.js");
+const Address = ({ account, theme, addressOrENS }) => {
+    const [copySuccess, setCopySuccess] = (0, react_1.useState)(false);
+    return ((0, jsx_runtime_1.jsxs)(react_native_1.TouchableOpacity, { style: styles.addressContainer, onPress: () => {
+            // @ts-ignore - missing native types
+            clipboard_1.default.setString(account.address);
+            setCopySuccess(true);
+            setTimeout(() => {
+                setCopySuccess(false);
+            }, 2500);
+        }, children: [(0, jsx_runtime_1.jsx)(text_js_1.ThemedText, { theme: theme, type: "defaultSemiBold", children: addressOrENS }), (0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: theme, data: copySuccess ? svgs_js_1.CHECK : svgs_js_1.COPY_ICON, size: 15, color: copySuccess ? theme.colors.success : theme.colors.secondaryIconColor })] }));
+};
+exports.Address = Address;
+const styles = react_native_1.StyleSheet.create({
+    addressContainer: {
+        flexDirection: "row",
+        gap: index_js_1.spacing.sm,
+        alignItems: "center",
+    },
+});
+//# sourceMappingURL=Address.js.map

package/dist/cjs/react/native/ui/components/Address.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Address.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/Address.tsx"],"names":[],"mappings":";;;;AAAA,iEAA0D;AAC1D,iCAAiC;AACjC,+CAA4D;AAG5D,2DAAuD;AACvD,8CAAoD;AACpD,6CAAuC;AACvC,uCAAuC;AAQhC,MAAM,OAAO,GAAG,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAgB,EAAE,EAAE;IACxE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACtD,OAAO,CACL,wBAAC,+BAAgB,IACf,KAAK,EAAE,MAAM,CAAC,gBAAgB,EAC9B,OAAO,EAAE,GAAG,EAAE;YACZ,oCAAoC;YACpC,mBAAS,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YACrC,cAAc,CAAC,IAAI,CAAC,CAAC;YACrB,UAAU,CAAC,GAAG,EAAE;gBACd,cAAc,CAAC,KAAK,CAAC,CAAC;YACxB,CAAC,EAAE,IAAI,CAAC,CAAC;QACX,CAAC,aAED,uBAAC,oBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,iBAAiB,YAC7C,YAAY,GACF,EACb,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,eAAK,CAAC,CAAC,CAAC,mBAAS,EACrC,IAAI,EAAE,EAAE,EACR,KAAK,EACH,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,kBAAkB,GAEtE,IACe,CACpB,CAAC;AACJ,CAAC,CAAC;AA3BW,QAAA,OAAO,WA2BlB;AAEF,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,gBAAgB,EAAE;QAChB,aAAa,EAAE,KAAK;QACpB,GAAG,EAAE,kBAAO,CAAC,EAAE;QACf,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC"}

package/dist/cjs/react/native/ui/components/ChainIcon.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChainIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const ipfs_js_1 = require("../../../../utils/ipfs.js");
+const useChainQuery_js_1 = require("../../../core/hooks/others/useChainQuery.js");
+const svgs_js_1 = require("../icons/svgs.js");
+const RNImage_js_1 = require("./RNImage.js");
+const ChainIcon = (props) => {
+    const chainQuery = (0, useChainQuery_js_1.useChainQuery)(props.chain);
+    const data = (0, react_1.useMemo)(() => {
+        const url = chainQuery?.data?.icon?.url;
+        if (!url) {
+            return svgs_js_1.CHAIN_ICON;
+        }
+        try {
+            return (0, ipfs_js_1.resolveScheme)({
+                uri: url,
+                client: props.client,
+            });
+        }
+        catch {
+            return svgs_js_1.CHAIN_ICON;
+        }
+    }, [props, chainQuery?.data?.icon?.url]);
+    return ((0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: props.theme, size: props.size, data: data, placeholder: svgs_js_1.CHAIN_ICON, color: props.theme.colors.secondaryIconColor }));
+};
+exports.ChainIcon = ChainIcon;
+//# sourceMappingURL=ChainIcon.js.map

package/dist/cjs/react/native/ui/components/ChainIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChainIcon.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/ChainIcon.tsx"],"names":[],"mappings":";;;;AAAA,iCAAgC;AAGhC,uDAA0D;AAE1D,kFAA4E;AAC5E,8CAA8C;AAC9C,6CAAuC;AAShC,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;IACjD,MAAM,UAAU,GAAG,IAAA,gCAAa,EAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,IAAI,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACxB,MAAM,GAAG,GAAG,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,CAAC;QACxC,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAO,oBAAU,CAAC;QACpB,CAAC;QACD,IAAI,CAAC;YACH,OAAO,IAAA,uBAAa,EAAC;gBACnB,GAAG,EAAE,GAAG;gBACR,MAAM,EAAE,KAAK,CAAC,MAAM;aACrB,CAAC,CAAC;QACL,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,oBAAU,CAAC;QACpB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC;IACzC,OAAO,CACL,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,oBAAU,EACvB,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,kBAAkB,GAC5C,CACH,CAAC;AACJ,CAAC,CAAC;AAzBW,QAAA,SAAS,aAyBpB"}

package/dist/cjs/react/native/ui/components/Header.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = Header;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_native_1 = require("react-native");
+const index_js_1 = require("../../design-system/index.js");
+const svgs_js_1 = require("../icons/svgs.js");
+const RNImage_js_1 = require("./RNImage.js");
+const text_js_1 = require("./text.js");
+function Header({ theme, title, onClose, onBack, containerType, }) {
+    if (containerType === "embed") {
+        return onBack ? ((0, jsx_runtime_1.jsxs)(react_native_1.TouchableOpacity, { onPress: onBack, style: {
+                flexDirection: "row",
+                gap: index_js_1.spacing.sm,
+                alignItems: "center",
+                paddingTop: index_js_1.spacing.lg,
+            }, children: [(0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: theme, data: svgs_js_1.BACK_ICON, size: 14, color: theme.colors.secondaryIconColor }), (0, jsx_runtime_1.jsx)(text_js_1.ThemedText, { theme: theme, type: "subtext", children: "Back" })] })) : null;
+    }
+    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: styles.headerModal, children: [onBack && ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { onPress: onBack, children: (0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: theme, data: svgs_js_1.BACK_ICON, size: 24, color: theme.colors.secondaryIconColor }) })), (0, jsx_runtime_1.jsx)(text_js_1.ThemedText, { theme: theme, type: "title", children: title ? title : "Sign in" }), onClose && ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { onPress: onClose, children: (0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: theme, data: svgs_js_1.CLOSE_ICON, size: 24, color: theme.colors.secondaryIconColor }) }))] }));
+}
+const styles = react_native_1.StyleSheet.create({
+    headerModal: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        paddingHorizontal: index_js_1.spacing.lg,
+        paddingTop: index_js_1.spacing.lg,
+    },
+});
+//# sourceMappingURL=Header.js.map

package/dist/cjs/react/native/ui/components/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/Header.tsx"],"names":[],"mappings":";;AASA,wBAgEC;;AAzED,+CAAkE;AAElE,2DAAuD;AACvD,8CAAyD;AACzD,6CAAuC;AACvC,uCAAuC;AAIvC,SAAgB,MAAM,CAAC,EACrB,KAAK,EACL,KAAK,EACL,OAAO,EACP,MAAM,EACN,aAAa,GAOd;IACC,IAAI,aAAa,KAAK,OAAO,EAAE,CAAC;QAC9B,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,wBAAC,+BAAgB,IACf,OAAO,EAAE,MAAM,EACf,KAAK,EAAE;gBACL,aAAa,EAAE,KAAK;gBACpB,GAAG,EAAE,kBAAO,CAAC,EAAE;gBACf,UAAU,EAAE,QAAQ;gBACpB,UAAU,EAAE,kBAAO,CAAC,EAAE;aACvB,aAED,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,mBAAS,EACf,IAAI,EAAE,EAAE,EACR,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,GACtC,EACF,uBAAC,oBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,SAAS,qBAE3B,IACI,CACpB,CAAC,CAAC,CAAC,IAAI,CAAC;IACX,CAAC;IAED,OAAO,CACL,wBAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,WAAW,aAC5B,MAAM,IAAI,CACT,uBAAC,+BAAgB,IAAC,OAAO,EAAE,MAAM,YAC/B,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,mBAAS,EACf,IAAI,EAAE,EAAE,EACR,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,GACtC,GACe,CACpB,EACD,uBAAC,oBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,OAAO,YACnC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,GACf,EACZ,OAAO,IAAI,CACV,uBAAC,+BAAgB,IAAC,OAAO,EAAE,OAAO,YAChC,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,oBAAU,EAChB,IAAI,EAAE,EAAE,EACR,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB,GACtC,GACe,CACpB,IACI,CACR,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,WAAW,EAAE;QACX,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,eAAe;QAC/B,iBAAiB,EAAE,kBAAO,CAAC,EAAE;QAC7B,UAAU,EAAE,kBAAO,CAAC,EAAE;KACvB;CACF,CAAC,CAAC"}

package/dist/cjs/react/native/ui/components/RNImage.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RNImage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const react_native_svg_1 = require("react-native-svg");
+const index_js_1 = require("../../design-system/index.js");
+const Skeleton_js_1 = require("./Skeleton.js");
+function getImage(data) {
+    if (data.startsWith("data:image/svg+xml;base64,")) {
+        const image = globalThis.atob(data.replace("data:image/svg+xml;base64,", ""));
+        return { image, type: "xml" };
+    }
+    if (data.startsWith("data:image/")) {
+        return { image: data, type: "image" };
+    }
+    if (data.startsWith("<svg")) {
+        return { image: data, type: "xml" };
+    }
+    return { image: data, type: "url" };
+}
+const RNImage = (props) => {
+    const { data, size, color, placeholder } = props;
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    if (!data) {
+        return null;
+    }
+    const { image, type } = (0, react_1.useMemo)(() => getImage(data), [data]);
+    switch (type) {
+        case "url":
+        case "image":
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [loading && ((0, jsx_runtime_1.jsx)(Skeleton_js_1.Skeleton, { theme: props.theme, style: { width: size, height: size } })), (0, jsx_runtime_1.jsx)(react_native_1.Image, { source: { uri: image }, loadingIndicatorSource: { uri: placeholder }, width: size, height: size, onLoadStart: () => setLoading(true), onLoadEnd: () => setLoading(false), style: [
+                            { borderRadius: index_js_1.radius.md, display: loading ? "none" : "flex" },
+                        ] })] }));
+        case "xml":
+            return (0, jsx_runtime_1.jsx)(react_native_svg_1.SvgXml, { xml: image, width: size, height: size, color: color });
+        default:
+            return null;
+    }
+};
+exports.RNImage = RNImage;
+//# sourceMappingURL=RNImage.js.map

package/dist/cjs/react/native/ui/components/RNImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RNImage.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/RNImage.tsx"],"names":[],"mappings":";;;;AAAA,iCAA0C;AAC1C,+CAAqC;AACrC,uDAA0C;AAE1C,2DAAsD;AACtD,+CAAyC;AAUzC,SAAS,QAAQ,CAAC,IAAY;IAI5B,IAAI,IAAI,CAAC,UAAU,CAAC,4BAA4B,CAAC,EAAE,CAAC;QAClD,MAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAC3B,IAAI,CAAC,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC,CAC/C,CAAC;QACF,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;IAChC,CAAC;IACD,IAAI,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,CAAC;QACnC,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;IACxC,CAAC;IACD,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,CAAC;QAC5B,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;IACtC,CAAC;IACD,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;AACtC,CAAC;AAEM,MAAM,OAAO,GAAG,CAAC,KAAgB,EAAE,EAAE;IAC1C,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACjD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAC7C,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,IAAI,CAAC;IACd,CAAC;IACD,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAC9D,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,KAAK,CAAC;QACX,KAAK,OAAO;YACV,OAAO,CACL,6DACG,OAAO,IAAI,CACV,uBAAC,sBAAQ,IACP,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GACpC,CACH,EACD,uBAAC,oBAAK,IACJ,MAAM,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,EACtB,sBAAsB,EAAE,EAAE,GAAG,EAAE,WAAW,EAAE,EAC5C,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,WAAW,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EACnC,SAAS,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EAClC,KAAK,EAAE;4BACL,EAAE,YAAY,EAAE,iBAAM,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE;yBAChE,GACD,IACD,CACJ,CAAC;QACJ,KAAK,KAAK;YACR,OAAO,uBAAC,yBAAM,IAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,GAAI,CAAC;QACzE;YACE,OAAO,IAAI,CAAC;IAChB,CAAC;AACH,CAAC,CAAC;AApCW,QAAA,OAAO,WAoClB"}

package/dist/cjs/react/native/ui/components/Skeleton.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const index_js_1 = require("../../design-system/index.js");
+const { width } = react_native_1.Dimensions.get("window");
+const Skeleton = ({ style, color, theme, }) => {
+    const translateX = (0, react_1.useRef)(new react_native_1.Animated.Value(-width));
+    (0, react_1.useEffect)(() => {
+        const animation = react_native_1.Animated.loop(react_native_1.Animated.sequence([
+            react_native_1.Animated.timing(translateX.current, {
+                toValue: width,
+                duration: 2500,
+                useNativeDriver: true,
+            }),
+            react_native_1.Animated.timing(translateX.current, {
+                toValue: -width,
+                duration: 0,
+                useNativeDriver: true,
+            }),
+        ]));
+        animation.start();
+        return () => animation.stop();
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
+            styles.container,
+            { backgroundColor: color || theme.colors.borderColor },
+            style,
+        ], children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles.skeleton }), (0, jsx_runtime_1.jsx)(react_native_1.Animated.View, { style: [
+                    styles.gradient,
+                    {
+                        transform: [{ translateX: translateX.current }],
+                    },
+                ], children: (0, jsx_runtime_1.jsx)(react_native_1.View, { style: styles.innerGradient }) })] }));
+};
+exports.Skeleton = Skeleton;
+const styles = react_native_1.StyleSheet.create({
+    container: {
+        overflow: "hidden",
+        borderRadius: index_js_1.radius.lg,
+    },
+    skeleton: {
+        height: "100%",
+        width: "100%",
+    },
+    gradient: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        width: "100%",
+    },
+    innerGradient: {
+        width: "100%",
+        height: "100%",
+        backgroundColor: "rgba(255,255,255,0.5)",
+        opacity: 0.3,
+        transform: [{ skewX: "-20deg" }],
+    },
+});
+//# sourceMappingURL=Skeleton.js.map

package/dist/cjs/react/native/ui/components/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/Skeleton.tsx"],"names":[],"mappings":";;;;AACA,iCAA0C;AAC1C,+CAMsB;AAEtB,2DAAsD;AAEtD,MAAM,EAAE,KAAK,EAAE,GAAG,yBAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AAQpC,MAAM,QAAQ,GAAkC,CAAC,EACtD,KAAK,EACL,KAAK,EACL,KAAK,GACN,EAAE,EAAE;IACH,MAAM,UAAU,GAAG,IAAA,cAAM,EAAC,IAAI,uBAAQ,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;IAEtD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,uBAAQ,CAAC,IAAI,CAC7B,uBAAQ,CAAC,QAAQ,CAAC;YAChB,uBAAQ,CAAC,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE;gBAClC,OAAO,EAAE,KAAK;gBACd,QAAQ,EAAE,IAAI;gBACd,eAAe,EAAE,IAAI;aACtB,CAAC;YACF,uBAAQ,CAAC,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE;gBAClC,OAAO,EAAE,CAAC,KAAK;gBACf,QAAQ,EAAE,CAAC;gBACX,eAAe,EAAE,IAAI;aACtB,CAAC;SACH,CAAC,CACH,CAAC;QACF,SAAS,CAAC,KAAK,EAAE,CAAC;QAElB,OAAO,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;IAChC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,wBAAC,mBAAI,IACH,KAAK,EAAE;YACL,MAAM,CAAC,SAAS;YAChB,EAAE,eAAe,EAAE,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,WAAW,EAAE;YACtD,KAAK;SACN,aAED,uBAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,GAAI,EAChC,uBAAC,uBAAQ,CAAC,IAAI,IACZ,KAAK,EAAE;oBACL,MAAM,CAAC,QAAQ;oBACf;wBACE,SAAS,EAAE,CAAC,EAAE,UAAU,EAAE,UAAU,CAAC,OAAO,EAAE,CAAC;qBAChD;iBACF,YAED,uBAAC,mBAAI,IAAC,KAAK,EAAE,MAAM,CAAC,aAAa,GAAI,GACvB,IACX,CACR,CAAC;AACJ,CAAC,CAAC;AAhDW,QAAA,QAAQ,YAgDnB;AAEF,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,iBAAM,CAAC,EAAE;KACxB;IACD,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,MAAM;KACd;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,CAAC;QACN,MAAM,EAAE,CAAC;QACT,KAAK,EAAE,MAAM;KACd;IACD,aAAa,EAAE;QACb,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,eAAe,EAAE,uBAAuB;QACxC,OAAO,EAAE,GAAG;QACZ,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;KACjC;CACF,CAAC,CAAC"}

package/dist/cjs/react/native/ui/components/TokenIcon.js

@@ -0,0 +1,16 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TokenIcon = TokenIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const socialIcons_js_1 = require("../../../core/utils/socialIcons.js");
+const ChainIcon_js_1 = require("./ChainIcon.js");
+const RNImage_js_1 = require("./RNImage.js");
+// Note: Must not use useConnectUI here
+/**
+ * @internal
+ */
+function TokenIcon(props) {
+    return props.token ? ((0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: props.theme, data: props.token?.icon || socialIcons_js_1.genericTokenIcon, size: props.size })) : ((0, jsx_runtime_1.jsx)(ChainIcon_js_1.ChainIcon, { ...props }));
+}
+//# sourceMappingURL=TokenIcon.js.map

package/dist/cjs/react/native/ui/components/TokenIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenIcon.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/TokenIcon.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;AAcb,8BAgBC;;AAzBD,uEAAsE;AACtE,iDAA2C;AAC3C,6CAAuC;AAEvC,uCAAuC;AAEvC;;GAEG;AACH,SAAgB,SAAS,CAAC,KAMzB;IACC,OAAO,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CACnB,uBAAC,oBAAO,IACN,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,IAAI,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,IAAI,iCAAgB,EAC3C,IAAI,EAAE,KAAK,CAAC,IAAI,GAChB,CACH,CAAC,CAAC,CAAC,CACF,uBAAC,wBAAS,OAAK,KAAK,GAAI,CACzB,CAAC;AACJ,CAAC"}

package/dist/cjs/react/native/ui/components/WalletImage.js

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WalletImage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_query_1 = require("@tanstack/react-query");
+const nativeStorage_js_1 = require("../../../../utils/storage/nativeStorage.js");
+const getWalletInfo_js_1 = require("../../../../wallets/__generated__/getWalletInfo.js");
+const index_js_1 = require("../../../../wallets/manager/index.js");
+const storage_js_1 = require("../../../core/utils/storage.js");
+const svgs_js_1 = require("../icons/svgs.js");
+const RNImage_js_1 = require("./RNImage.js");
+const WalletImage = (props) => {
+    const { wallet, ensAvatar, size } = props;
+    const { data: imageData } = (0, react_query_1.useQuery)({
+        queryKey: ["wallet-image", wallet.id, wallet.getAccount()?.address],
+        queryFn: async () => {
+            let activeEOAId = wallet.id;
+            if (wallet.id === "smart") {
+                // TODO (rn) investigate why the first render this returns null from storage
+                const storedId = await (0, index_js_1.getStoredActiveWalletId)(nativeStorage_js_1.nativeLocalStorage);
+                if (storedId) {
+                    activeEOAId = storedId;
+                }
+                else {
+                    throw new Error("No active EOA wallet");
+                }
+            }
+            let imageData;
+            if (activeEOAId === "inApp" &&
+                (wallet.id === "inApp" || wallet.id === "smart")) {
+                const lastAuthProvider = await (0, storage_js_1.getLastAuthProvider)(nativeStorage_js_1.nativeLocalStorage);
+                switch (lastAuthProvider) {
+                    case "phone":
+                        imageData = svgs_js_1.PHONE_ICON;
+                        break;
+                    case "email":
+                        imageData = svgs_js_1.EMAIL_ICON;
+                        break;
+                    case "google":
+                        imageData = svgs_js_1.GOOGLE_ICON;
+                        break;
+                    case "apple":
+                        imageData = svgs_js_1.APPLE_ICON;
+                        break;
+                    case "facebook":
+                        imageData = svgs_js_1.FACEBOOK_ICON;
+                        break;
+                    default:
+                        imageData = svgs_js_1.WALLET_ICON;
+                        break;
+                }
+                return imageData;
+            }
+            try {
+                const externalWalletImage = await (0, getWalletInfo_js_1.getWalletInfo)(activeEOAId, true);
+                if (externalWalletImage) {
+                    return externalWalletImage;
+                }
+            }
+            catch { }
+            return svgs_js_1.WALLET_ICON;
+        },
+        enabled: !ensAvatar,
+    });
+    const data = ensAvatar || imageData || svgs_js_1.WALLET_ICON;
+    return (0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: props.theme, data: data, size: size });
+};
+exports.WalletImage = WalletImage;
+//# sourceMappingURL=WalletImage.js.map

package/dist/cjs/react/native/ui/components/WalletImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WalletImage.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/WalletImage.tsx"],"names":[],"mappings":";;;;AAAA,uDAAiD;AACjD,iFAAgF;AAChF,yFAAmF;AAEnF,mEAA+E;AAE/E,+DAAqE;AACrE,8CAO0B;AAC1B,6CAAuC;AAEhC,MAAM,WAAW,GAAG,CAAC,KAK3B,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAE1C,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAA,sBAAQ,EAAC;QACnC,QAAQ,EAAE,CAAC,cAAc,EAAE,MAAM,CAAC,EAAE,EAAE,MAAM,CAAC,UAAU,EAAE,EAAE,OAAO,CAAC;QACnE,OAAO,EAAE,KAAK,IAAqB,EAAE;YACnC,IAAI,WAAW,GAAG,MAAM,CAAC,EAAE,CAAC;YAC5B,IAAI,MAAM,CAAC,EAAE,KAAK,OAAO,EAAE,CAAC;gBAC1B,4EAA4E;gBAC5E,MAAM,QAAQ,GAAG,MAAM,IAAA,kCAAuB,EAAC,qCAAkB,CAAC,CAAC;gBACnE,IAAI,QAAQ,EAAE,CAAC;oBACb,WAAW,GAAG,QAAQ,CAAC;gBACzB,CAAC;qBAAM,CAAC;oBACN,MAAM,IAAI,KAAK,CAAC,sBAAsB,CAAC,CAAC;gBAC1C,CAAC;YACH,CAAC;YACD,IAAI,SAAiB,CAAC;YACtB,IACE,WAAW,KAAK,OAAO;gBACvB,CAAC,MAAM,CAAC,EAAE,KAAK,OAAO,IAAI,MAAM,CAAC,EAAE,KAAK,OAAO,CAAC,EAChD,CAAC;gBACD,MAAM,gBAAgB,GAAG,MAAM,IAAA,gCAAmB,EAAC,qCAAkB,CAAC,CAAC;gBACvE,QAAQ,gBAAgB,EAAE,CAAC;oBACzB,KAAK,OAAO;wBACV,SAAS,GAAG,oBAAU,CAAC;wBACvB,MAAM;oBACR,KAAK,OAAO;wBACV,SAAS,GAAG,oBAAU,CAAC;wBACvB,MAAM;oBACR,KAAK,QAAQ;wBACX,SAAS,GAAG,qBAAW,CAAC;wBACxB,MAAM;oBACR,KAAK,OAAO;wBACV,SAAS,GAAG,oBAAU,CAAC;wBACvB,MAAM;oBACR,KAAK,UAAU;wBACb,SAAS,GAAG,uBAAa,CAAC;wBAC1B,MAAM;oBACR;wBACE,SAAS,GAAG,qBAAW,CAAC;wBACxB,MAAM;gBACV,CAAC;gBACD,OAAO,SAAS,CAAC;YACnB,CAAC;YACD,IAAI,CAAC;gBACH,MAAM,mBAAmB,GAAG,MAAM,IAAA,gCAAa,EAAC,WAAW,EAAE,IAAI,CAAC,CAAC;gBACnE,IAAI,mBAAmB,EAAE,CAAC;oBACxB,OAAO,mBAAmB,CAAC;gBAC7B,CAAC;YACH,CAAC;YAAC,MAAM,CAAC,CAAA,CAAC;YAEV,OAAO,qBAAW,CAAC;QACrB,CAAC;QACD,OAAO,EAAE,CAAC,SAAS;KACpB,CAAC,CAAC;IAEH,MAAM,IAAI,GAAG,SAAS,IAAI,SAAS,IAAI,qBAAW,CAAC;IACnD,OAAO,uBAAC,oBAAO,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;AACjE,CAAC,CAAC;AA/DW,QAAA,WAAW,eA+DtB"}

package/dist/cjs/react/native/ui/components/button.js

@@ -1,29 +1,44 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ThemedButton = ThemedButton;
+exports.ThemedButtonWithIcon = ThemedButtonWithIcon;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_native_1 = require("react-native");
+const index_js_1 = require("../../design-system/index.js");
+const RNImage_js_1 = require("./RNImage.js");
+const text_js_1 = require("./text.js");
 function ThemedButton(props) {
     const variant = props.variant ?? "primary";
-    const bg = props.theme.colors.primaryButtonBg;
-    const { style: styleOverride, ...restProps } = props;
+    const { style: styleOverride, theme, ...restProps } = props;
     return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { activeOpacity: 0.5, style: [
             styles.button,
             {
-                borderColor: variant === "secondary" ? bg : "transparent",
+                borderColor: variant === "secondary" ? theme.colors.borderColor : "transparent",
                 borderWidth: variant === "secondary" ? 1 : 0,
-                backgroundColor: variant === "secondary" ? "transparent" : bg,
+                backgroundColor: variant === "secondary"
+                    ? "transparent"
+                    : variant === "accent"
+                        ? props.theme.colors.accentButtonBg
+                        : props.theme.colors.primaryButtonBg,
             },
             styleOverride,
         ], ...restProps, children: props.children }));
 }
+function ThemedButtonWithIcon(props) {
+    const { theme, title, icon, onPress } = props;
+    return ((0, jsx_runtime_1.jsx)(ThemedButton, { theme: theme, variant: "secondary", onPress: onPress, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: {
+                flexDirection: "row",
+                gap: index_js_1.spacing.md,
+                paddingLeft: index_js_1.spacing.sm,
+                alignContent: "center",
+                width: "100%",
+            }, children: [(0, jsx_runtime_1.jsx)(RNImage_js_1.RNImage, { theme: theme, size: 24, data: icon }), (0, jsx_runtime_1.jsx)(text_js_1.ThemedText, { theme: theme, children: title })] }) }));
+}
 const styles = react_native_1.StyleSheet.create({
     button: {
-        flex: 1,
         flexDirection: "row",
-        gap: 8,
-        padding: 12,
-        borderRadius: 6,
+        padding: index_js_1.spacing.md,
+        borderRadius: index_js_1.radius.lg,
         justifyContent: "center",
         alignItems: "center",
     },

package/dist/cjs/react/native/ui/components/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/button.tsx"],"names":[],"mappings":";;AAYA,oCAqBC;;AAjCD,+CAIsB;AAQtB,SAAgB,YAAY,CAAC,KAAwB;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,SAAS,CAAC;IAC3C,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC;IAC9C,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACrD,OAAO,CACL,uBAAC,+BAAgB,IACf,aAAa,EAAE,GAAG,EAClB,KAAK,EAAE;YACL,MAAM,CAAC,MAAM;YACb;gBACE,WAAW,EAAE,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa;gBACzD,WAAW,EAAE,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC5C,eAAe,EAAE,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE;aAC9D;YACD,aAAa;SACd,KACG,SAAS,YAEZ,KAAK,CAAC,QAAQ,GACE,CACpB,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,aAAa,EAAE,KAAK;QACpB,GAAG,EAAE,CAAC;QACN,OAAO,EAAE,EAAE;QACX,YAAY,EAAE,CAAC;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC"}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../../src/react/native/ui/components/button.tsx"],"names":[],"mappings":";;AAgBA,oCA0BC;AAED,oDAuBC;;AAnED,+CAKsB;AAEtB,2DAA+D;AAC/D,6CAAuC;AACvC,uCAAuC;AAOvC,SAAgB,YAAY,CAAC,KAAwB;IACnD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,SAAS,CAAC;IAC3C,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC5D,OAAO,CACL,uBAAC,+BAAgB,IACf,aAAa,EAAE,GAAG,EAClB,KAAK,EAAE;YACL,MAAM,CAAC,MAAM;YACb;gBACE,WAAW,EACT,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa;gBACpE,WAAW,EAAE,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC5C,eAAe,EACb,OAAO,KAAK,WAAW;oBACrB,CAAC,CAAC,aAAa;oBACf,CAAC,CAAC,OAAO,KAAK,QAAQ;wBACpB,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc;wBACnC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,eAAe;aAC3C;YACD,aAAa;SACd,KACG,SAAS,YAEZ,KAAK,CAAC,QAAQ,GACE,CACpB,CAAC;AACJ,CAAC;AAED,SAAgB,oBAAoB,CAClC,KAGC;IAED,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAC9C,OAAO,CACL,uBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,OAAO,YAC9D,wBAAC,mBAAI,IACH,KAAK,EAAE;gBACL,aAAa,EAAE,KAAK;gBACpB,GAAG,EAAE,kBAAO,CAAC,EAAE;gBACf,WAAW,EAAE,kBAAO,CAAC,EAAE;gBACvB,YAAY,EAAE,QAAQ;gBACtB,KAAK,EAAE,MAAM;aACd,aAED,uBAAC,oBAAO,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,GAAI,EAC/C,uBAAC,oBAAU,IAAC,KAAK,EAAE,KAAK,YAAG,KAAK,GAAc,IACzC,GACM,CAChB,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,MAAM,EAAE;QACN,aAAa,EAAE,KAAK;QACpB,OAAO,EAAE,kBAAO,CAAC,EAAE;QACnB,YAAY,EAAE,iBAAM,CAAC,EAAE;QACvB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC"}