Feat/svelte (#68)

.changes/config.json

@@ -36,6 +36,11 @@
       "path": "./packages/client",
       "manager": "javascript"
     },
+    "@qubit-rs/svelte": {
+      "path": "./packages/svelte",
+      "manager": "javascript",
+      "dependencies": ["@qubit-rs/client"]
+    },
     "qubit-macros": {
       "path": "./crates/qubit-macros",
       "manager": "rust"

.changes/svelte-integration.md

@@ -0,0 +1,6 @@
+---
+"@qubit-rs/svelte": patch:feat
+"@qubit-rs/client": patch:feat
+---
+
+create svelte integration

.github/workflows/checks.yml

@@ -22,6 +22,7 @@ jobs:
       matrix:
         dir:
           - packages/client
+          - packages/svelte
           - examples/authentication/auth-demo
           - examples/chaos
           - examples/chat-room-react
@@ -42,7 +43,7 @@ jobs:
         if: ${{ matrix.dir != 'packages/client' }}
       - run: pnpm i
         working-directory: ${{ matrix.dir }}
-      - run: pnpm tsc
+      - run: pnpm check
         working-directory: ${{ matrix.dir }}
 
   clippy:

biome.json

@@ -8,7 +8,7 @@
   },
   "files": {
     "include": ["*.ts", "*.tsx", "*.json"],
-    "ignore": ["bindings*", "package.json"]
+    "ignore": ["bindings*", "package.json", ".svelte-kit*"]
   },
   "organizeImports": {
     "enabled": true

examples/authentication/auth-demo/package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "check": "tsc"
   },
   "dependencies": {
     "typescript": "^5.2.2",

examples/chaos/package.json

@@ -4,7 +4,8 @@
   "private": true,
   "main": "index.js",
   "scripts": {
-    "start": "ts-node ./index.ts"
+    "start": "ts-node ./index.ts",
+    "check": "tsc"
   },
   "dependencies": {
     "@qubit-rs/client": "link:../../packages/client",

examples/chat-room-react/package.json

@@ -5,7 +5,8 @@
   "type": "module",
   "scripts": {
     "dev": "conc -rk \"cargo watch -C ./src-rust -x run -w ./src -w Cargo.toml\" \"vite --clearScreen=false\"",
-    "build": "tsc && vite build"
+    "build": "tsc && vite build",
+    "check": "tsc"
   },
   "dependencies": {
     "@qubit-rs/client": "link:../../packages/client",

examples/counter/package.json

@@ -4,7 +4,8 @@
   "private": true,
   "main": "index.js",
   "scripts": {
-    "start": "ts-node ./index.ts"
+    "start": "ts-node ./index.ts",
+    "check": "tsc"
   },
   "dependencies": {
     "@qubit-rs/client": "link:../../packages/client",

examples/hello-world/package.json

@@ -4,10 +4,12 @@
   "private": true,
   "main": "index.js",
   "scripts": {
-    "start": "ts-node ./index.ts"
+    "start": "ts-node ./index.ts",
+    "check": "tsc"
   },
   "dependencies": {
     "@qubit-rs/client": "link:../../packages/client",
+    "typescript": "^5.2.2",
     "ts-node": "^10.9.2"
   }
 }

packages/client/package.json

@@ -17,8 +17,8 @@
   },
   "type": "module",
   "scripts": {
-    "lint": "tsc",
-    "build": "tsup ./src/index.ts"
+    "build": "tsup ./src/index.ts",
+    "check": "tsc"
   },
   "files": [
     "dist"

packages/client/src/transport/http.ts

@@ -2,17 +2,22 @@ import type { Transport } from ".";
 import { parse_response } from "../jsonrpc";
 
 export type HttpOptions = {
-  fetch: typeof fetch;
+  fetch?: typeof fetch;
 };
 
 export function http(host: string, http_options?: HttpOptions) {
   const fetch_impl = http_options?.fetch || fetch;
 
   return {
     query: async (_id, payload) => {
-      // Encode the payload in to the URL
-      const url = new URL(host);
-      url.searchParams.set("input", encodeURIComponent(JSON.stringify(payload)));
+      // Create a temporary URL with a fallback host to appease the URL constructor
+      const temp_url = new URL(host, "http://example.com");
+
+      // Set the search parameters, to let it do the processing for us
+      temp_url.searchParams.set("input", encodeURIComponent(JSON.stringify(payload)));
+
+      // Use the original host, but replace anything after the `?` with our modified query parameters
+      const url = `${host.replace(/\?.*$/, "")}?${temp_url.searchParams.toString()}`;
 
       const res = await fetch_impl(url, {
         method: "GET",

packages/svelte/.gitignore

@@ -0,0 +1,22 @@
+node_modules
+
+# Output
+.output
+.vercel
+/.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,58 @@
+# create-svelte
+
+Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).
+
+Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```bash
+# create a new project in the current directory
+npm create svelte@latest
+
+# create a new project in my-app
+npm create svelte@latest my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```bash
+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:
+
+```bash
+npm run package
+```
+
+To create a production version of your showcase app:
+
+```bash
+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://kit.svelte.dev/docs/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):
+
+```bash
+npm publish
+```

packages/svelte/package.json

@@ -0,0 +1,68 @@
+{
+	"name": "@qubit-rs/svelte",
+	"version": "0.0.1",
+	"description": "Seamless RPC for Rust & TypeScript - Svelte style",
+	"keywords": [
+		"api",
+		"rust",
+		"svelte",
+		"svelte-kit",
+		"svelte-store",
+		"subscriptions",
+		"rpc-framework",
+		"jsonrpc",
+		"trpc"
+	],
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/andogq/qubit.git",
+		"directory": "pacakges/svelte"
+	},
+	"author": {
+		"name": "Tom Anderson",
+		"email": "[email protected]",
+		"url": "https://ando.gq"
+	},
+	"license": "MIT",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run package",
+		"preview": "vite preview",
+		"package": "svelte-kit sync && svelte-package && publint",
+		"prepublishOnly": "npm run package",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
+	},
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		}
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"peerDependencies": {
+		"svelte": "^4.0.0"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^3.0.0",
+		"@sveltejs/kit": "^2.0.0",
+		"@sveltejs/package": "^2.0.0",
+		"@sveltejs/vite-plugin-svelte": "^3.0.0",
+		"publint": "^0.1.9",
+		"svelte": "^4.2.7",
+		"svelte-check": "^3.6.0",
+		"tslib": "^2.4.1",
+		"typescript": "^5.0.0",
+		"vite": "^5.0.11"
+	},
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module",
+	"dependencies": {
+		"@qubit-rs/client": "link:../client"
+	}
+}