removed nextjs example implementation

src/lib/AuthSig.svelte

@@ -0,0 +1,56 @@
+<script>
+	import { onMount } from 'svelte';
+	import { checkAndSignAuthMessage } from '@lit-protocol/lit-node-client';
+	import { LOCAL_STORAGE_KEYS } from '@lit-protocol/constants';
+
+	let authSig = null;
+	let error = null;
+
+	async function generateAuthSig() {
+		authSig = null;
+		error = null;
+		try {
+			authSig = await checkAndSignAuthMessage({
+				chain: 'xdai'
+			});
+		} catch (err) {
+			console.error(err);
+			error = `Failed to sign auth message: ${err.message}`;
+		}
+	}
+	onMount(() => {
+		const storedAuthSig = localStorage.getItem(LOCAL_STORAGE_KEYS.AUTH_SIGNATURE);
+		if (storedAuthSig) {
+			authSig = JSON.parse(storedAuthSig);
+		}
+	});
+</script>
+
+<!-- AuthSig Address Displayed -->
+{#if authSig}
+	<div class="bg-gray-100 p-4 rounded-lg shadow-md mb-4 flex items-center">
+		<p class="text-gray-700 font-medium">
+			AuthSig Address: <span class="text-orange-500">{authSig.address}</span>
+		</p>
+	</div>
+	<!-- Error Message -->
+{:else if error}
+	<div class="bg-red-100 p-4 rounded-lg shadow-md mb-4 flex items-center">
+		<p class="text-red-700 font-medium">{error}</p>
+	</div>
+	<!-- Login Button -->
+{:else}
+	<div class="flex justify-center">
+		<button
+			class="bg-orange-500 hover:bg-orange-600 text-white font-bold py-2 px-4 rounded-lg shadow-lg flex items-center m-2"
+			on:click={generateAuthSig}
+		>
+			<img
+				src="https://upload.wikimedia.org/wikipedia/commons/3/36/MetaMask_Fox.svg"
+				alt="MetaMask"
+				class="w-6 h-6 mr-2"
+			/>
+			<span class="text-lg">Login</span>
+		</button>
+	</div>
+{/if}

src/lib/LitStatus.svelte

@@ -0,0 +1,40 @@
+<!-- src/routes/LitStatus.svelte -->
+
+<script>
+	import { onMount } from 'svelte';
+	import Lit from '../lib/lit';
+
+	let networkStatus = 'Disconnected';
+	let isNetworkLoading = true;
+
+	// Connect to the LIT network on component mount
+	onMount(() => {
+		Lit.connect();
+
+		// Define the event handler
+		const handleLitReady = () => {
+			networkStatus = 'Connected';
+			isNetworkLoading = false;
+		};
+
+		// Listen for the lit-ready event
+		document.addEventListener('lit-ready', handleLitReady, false);
+
+		// Cleanup the event listener on component destroy
+		return () => {
+			document.removeEventListener('lit-ready', handleLitReady);
+		};
+	});
+</script>
+
+<div class="bg-gray-100 p-4 rounded-lg shadow-md mb-4">
+	{#if isNetworkLoading}
+		<p class="text-gray-700 font-medium">
+			LIT Network Status: <span class="text-blue-500">Loading ...</span>
+		</p>
+	{:else}
+		<p class="text-gray-700 font-medium">
+			LIT Network Status: <span class="text-green-600">{networkStatus}</span>
+		</p>
+	{/if}
+</div>

src/lib/Send.svelte

@@ -0,0 +1,67 @@
+<script>
+	import { onMount } from 'svelte';
+
+	import { PKPEthersWallet } from '@lit-protocol/pkp-ethers';
+	import { LOCAL_STORAGE_KEYS } from '@lit-protocol/constants';
+
+	let pkpWallet;
+	let authSig = null;
+
+	// Load wallet on component mount
+	onMount(async () => {
+		const storedAuthSig = localStorage.getItem(LOCAL_STORAGE_KEYS.AUTH_SIGNATURE);
+
+		if (storedAuthSig) {
+			authSig = JSON.parse(storedAuthSig);
+			pkpWallet = new PKPEthersWallet({
+				controllerAuthSig: authSig,
+				pkpPubKey:
+					'046da3ba67065fd1e2726242ca01cd4601524893f4aa4b0042578fa6cbec28fa8c9a28eb9f7893932fc09717edc9e1db57e157a21eed346247c1db5a722a01f571',
+				rpc: 'https://rpc.gnosischain.com/'
+			});
+			await pkpWallet.init();
+			console.log(pkpWallet);
+		} else {
+			alert('no authsig');
+		}
+	});
+
+	const sendTransaction = async () => {
+		if (!authSig) {
+			alert('no authsig');
+		} else {
+			console.log('transaction initiated');
+			const from = pkpWallet.address;
+			const to = '0x1A5cfC9EA11afb50011F847fb7dC07bA1e18b05A';
+			const value = BigInt(10000000000000000);
+			const gasLimit = 21000;
+
+			// @lit-protocol/pkp-ethers will automatically add missing fields (nonce, chainId, gasPrice, gasLimit)
+			const transactionRequest = {
+				from,
+				to,
+				value,
+				gasLimit
+			};
+			console.log('transaction request created');
+
+			const signedTransactionRequest = await pkpWallet.signTransaction(transactionRequest);
+			await pkpWallet.sendTransaction(signedTransactionRequest);
+			console.log('transaction sent');
+		}
+	};
+</script>
+
+<div class="p-4 bg-gray-200 flex justify-center items-center flex-col">
+	{#if pkpWallet}
+		<div class="mb-4 text-lg font-medium">
+			PKP Wallet: <span class="text-blue-600">{pkpWallet.address}</span>
+		</div>
+	{/if}
+	<button
+		class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full shadow-lg focus:outline-none focus:shadow-outline-blue active:bg-blue-800 transition duration-150 ease-in-out"
+		on:click={sendTransaction}
+	>
+		send 0.01 xdai
+	</button>
+</div>

src/lib/lit.js

@@ -0,0 +1,15 @@
+// src/lib/lit.js
+
+import * as Lit from "@lit-protocol/lit-node-client";
+
+const client = new Lit.LitNodeClient();
+
+class LitConnector {
+  litNodeClient;
+  async connect() {
+    await client.connect();
+    this.litNodeClient = client;
+  }
+}
+
+export default new LitConnector();