svelte package

package.json

@@ -12,8 +12,8 @@
     "@changesets/cli": "^2.29.8"
   },
   "scripts": {
-    "build": "bun run --filter='coco-cashu-core' build && bun run --filter='coco-cashu-adapter-tests' build && bun run --filter='coco-cashu-indexeddb' build && bun run --filter='coco-cashu-expo-sqlite' build && bun run --filter='coco-cashu-sqlite3' build && bun run --filter='coco-cashu-sqlite-bun' build && bun run --filter='coco-cashu-react' build",
-    "typecheck": "bun run --filter='coco-cashu-core' typecheck && bun run --filter='coco-cashu-adapter-tests' typecheck && bun run --filter='coco-cashu-indexeddb' typecheck && bun run --filter='coco-cashu-expo-sqlite' typecheck && bun run --filter='coco-cashu-sqlite3' typecheck && bun run --filter='coco-cashu-sqlite-bun' typecheck && bun run --filter='coco-cashu-react' typecheck",
+    "build": "bun run --filter='coco-cashu-core' build && bun run --filter='coco-cashu-adapter-tests' build && bun run --filter='coco-cashu-indexeddb' build && bun run --filter='coco-cashu-expo-sqlite' build && bun run --filter='coco-cashu-sqlite3' build && bun run --filter='coco-cashu-sqlite-bun' build && bun run --filter='coco-cashu-react' typecheck && bun run --filter='coco-cashu-svelte' build",
+    "typecheck": "bun run --filter='coco-cashu-core' typecheck && bun run --filter='coco-cashu-adapter-tests' typecheck && bun run --filter='coco-cashu-indexeddb' typecheck && bun run --filter='coco-cashu-expo-sqlite' typecheck && bun run --filter='coco-cashu-sqlite3' typecheck && bun run --filter='coco-cashu-sqlite-bun' typecheck && bun run --filter='coco-cashu-react' typecheck && bun run --filter='coco-cashu-svelte' typecheck",
     "docs:dev": "vitepress dev packages/docs",
     "docs:build": "vitepress build packages/docs",
     "docs:preview": "vitepress preview packages/docs"

packages/svelte/.gitignore

@@ -0,0 +1,24 @@
+node_modules
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
+/.svelte-kit
+/build
+/dist
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
+.env
+.env.*
+!.env.example
+!.env.test
+
+# Vite
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*

packages/svelte/.npmrc

@@ -0,0 +1 @@
+engine-strict=true

packages/svelte/README.md

@@ -0,0 +1,65 @@
+# Svelte library
+
+Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
+
+Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```sh
+# create a new project in the current directory
+npx sv create
+
+# create a new project in my-app
+npx sv create my-app
+```
+
+To recreate this project with the same configuration:
+
+```sh
+# recreate this project
+bun x sv create --template library --types ts --add eslint --install bun svelte
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```sh
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
+
+## Building
+
+To build your library:
+
+```sh
+npm pack
+```
+
+To create a production version of your showcase app:
+
+```sh
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
+
+## Publishing
+
+Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
+
+To publish your library to [npm](https://www.npmjs.com):
+
+```sh
+npm publish
+```

packages/svelte/eslint.config.js

@@ -0,0 +1,36 @@
+import path from 'node:path';
+import { includeIgnoreFile } from '@eslint/compat';
+import js from '@eslint/js';
+import svelte from 'eslint-plugin-svelte';
+import { defineConfig } from 'eslint/config';
+import globals from 'globals';
+import ts from 'typescript-eslint';
+import svelteConfig from './svelte.config.js';
+
+const gitignorePath = path.resolve(import.meta.dirname, '.gitignore');
+
+export default defineConfig(
+	includeIgnoreFile(gitignorePath),
+	js.configs.recommended,
+	...ts.configs.recommended,
+	...svelte.configs.recommended,
+	{
+		languageOptions: { globals: { ...globals.browser, ...globals.node } },
+		rules: {
+			// typescript-eslint strongly recommend that you do not use the no-undef lint rule on TypeScript projects.
+			// see: https://typescript-eslint.io/troubleshooting/faqs/eslint/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors
+			"no-undef": 'off'
+		}
+	},
+	{
+		files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
+		languageOptions: {
+			parserOptions: {
+				projectService: true,
+				extraFileExtensions: ['.svelte'],
+				parser: ts.parser,
+				svelteConfig
+			}
+		}
+	}
+);

packages/svelte/package.json

@@ -0,0 +1,61 @@
+{
+	"name": "coco-cashu-svelte",
+	"version": "1.1.2-rc.42",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run prepack",
+		"preview": "vite preview",
+		"prepare": "svelte-kit sync || echo ''",
+		"prepack": "svelte-kit sync && svelte-package && publint",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "eslint ."
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"sideEffects": [
+		"**/*.css"
+	],
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		}
+	},
+	"peerDependencies": {
+		"svelte": "^5.0.0",
+		"coco-cashu-core": "1.1.2-rc.47",
+		"coco-cashu-indexeddb": "1.1.2-rc.47"
+	},
+	"devDependencies": {
+		"@eslint/compat": "^2.0.2",
+		"@eslint/js": "^9.39.2",
+		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/kit": "^2.50.2",
+		"@sveltejs/package": "^2.5.7",
+		"@sveltejs/vite-plugin-svelte": "^6.2.4",
+		"@types/node": "^24",
+		"coco-cashu-core": "1.1.2-rc.47",
+		"coco-cashu-indexeddb": "1.1.2-rc.47",
+		"eslint": "^9.39.2",
+		"eslint-plugin-svelte": "^3.14.0",
+		"globals": "^17.3.0",
+		"publint": "^0.3.17",
+		"svelte": "^5.49.2",
+		"svelte-check": "^4.3.6",
+		"typescript": "^5.9.3",
+		"typescript-eslint": "^8.54.0",
+		"vite": "^7.3.1"
+	},
+	"keywords": [
+		"svelte"
+	],
+	"dependencies": {
+	}
+}

packages/svelte/src/app.d.ts

@@ -0,0 +1,13 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {};

packages/svelte/src/app.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.svg" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>
+

packages/svelte/src/lib/components/CocoCashuProvider.svelte

@@ -0,0 +1,13 @@
+<script lang="ts">
+  import type { Manager } from 'coco-cashu-core';
+  import type { Snippet } from 'svelte';
+  import { setManagerContext } from '../context.js';
+
+  let { manager, children }: { manager: Manager; children: Snippet } = $props();
+
+  // setContext must be called synchronously during component init,
+  // NOT inside onMount — otherwise child components won't see it.
+  setManagerContext(manager);
+</script>
+
+{@render children()}

packages/svelte/src/lib/composables/useBalance.svelte.ts

@@ -0,0 +1,52 @@
+import { onDestroy } from 'svelte';
+import { getManagerContext } from '../context.js';
+
+export type BalanceValue = {
+  [mintUrl: string]: number;
+  total: number;
+};
+
+/**
+ * Reactive balance composable.
+ * Returns an object with a reactive `balance` property (Svelte 5 `$state`).
+ *
+ * Must be called during component initialisation inside a CocoCashuProvider tree.
+ */
+export function useBalance() {
+  const manager = getManagerContext();
+
+  let balance = $state<BalanceValue>({ total: 0 });
+
+  async function refresh() {
+    try {
+      const bal = await manager.wallet.getBalances();
+      const total = Object.values(bal || {}).reduce<number>((acc, cur) => acc + (cur as number), 0);
+      balance = { ...(bal || {}), total };
+    } catch (error) {
+      console.error(error);
+    }
+  }
+
+  refresh();
+
+  manager.on('proofs:saved', refresh);
+  manager.on('proofs:state-changed', refresh);
+  manager.on('proofs:deleted', refresh);
+  manager.on('proofs:reserved', refresh);
+  manager.on('proofs:released', refresh);
+
+  onDestroy(() => {
+    manager.off('proofs:saved', refresh);
+    manager.off('proofs:state-changed', refresh);
+    manager.off('proofs:deleted', refresh);
+    manager.off('proofs:reserved', refresh);
+    manager.off('proofs:released', refresh);
+  });
+
+  return {
+    get balance() {
+      return balance;
+    },
+    refresh,
+  };
+}

packages/svelte/src/lib/composables/useMints.svelte.ts

@@ -0,0 +1,74 @@
+import type { Mint } from 'coco-cashu-core';
+import { onDestroy } from 'svelte';
+import { getManagerContext } from '../context.js';
+
+/**
+ * Reactive mints composable using Svelte 5 runes.
+ * Returns a reactive object whose `.mints` and `.trustedMints` properties
+ * update automatically when the underlying core events fire.
+ *
+ * Must be called during component initialisation inside a CocoCashuProvider tree.
+ */
+export function useMints() {
+  const manager = getManagerContext();
+
+  let mints = $state<Mint[]>([]);
+  let trustedMints = $state<Mint[]>([]);
+
+  async function refresh() {
+    try {
+      const all = await manager.mint.getAllMints();
+      mints = all;
+      trustedMints = all.filter((m) => m.trusted);
+    } catch (error) {
+      console.error('[useMints] refresh error:', error);
+    }
+  }
+
+  // Initial load
+  refresh();
+
+  // Re-fetch whenever core emits relevant events
+  const handler = () => {
+    refresh();
+  };
+
+  manager.on('mint:added', handler);
+  manager.on('mint:updated', handler);
+  manager.on('mint:trusted', handler);
+  manager.on('mint:untrusted', handler);
+
+  onDestroy(() => {
+    manager.off('mint:added', handler);
+    manager.off('mint:updated', handler);
+    manager.off('mint:trusted', handler);
+    manager.off('mint:untrusted', handler);
+  });
+
+  async function addMint(mintUrl: string, options?: { trusted?: boolean }) {
+    await manager.mint.addMint(mintUrl, options);
+    // Eagerly refresh so the caller doesn't have to
+    await refresh();
+  }
+
+  async function trustMint(mintUrl: string) {
+    await manager.mint.trustMint(mintUrl);
+  }
+
+  async function untrustMint(mintUrl: string) {
+    await manager.mint.untrustMint(mintUrl);
+  }
+
+  return {
+    get mints() {
+      return mints;
+    },
+    get trustedMints() {
+      return trustedMints;
+    },
+    refresh,
+    addMint,
+    trustMint,
+    untrustMint,
+  };
+}