deck-plugin-sdk 1.2.0 → 1.5.0

package/README.md

@@ -1,77 +1,96 @@
-# deck-plugin-sdk
-
-Build a plugin for [Deck](https://deck.hasan-zarif.com), outside Deck's own repository.
-
-```sh
-npm create deck-plugin my-thing
-cd my-thing
-npm run dev            # build, and rebuild as you edit
-npm run install-local  # copy it into Deck, which loads it without a restart
-```
-
-## What a plugin is
-
-A folder with a `plugin.json` and a built `plugin.js`, read from
-`%APPDATA%\Deck\plugins\<id>\` when Deck starts. It becomes a tab, or a readout in the footer,
-or a panel, or commands in the palette — `plugins/API.md` in the Deck repository lists every
-slot a plugin can fill. One is enough.
-
-Your sources import `react`, `lucide-react` and the shim modules as ordinary code does. At run
-time those resolve to **Deck's** copies, handed over on `window.__deck`. For React that is not
-an optimisation but a requirement: two Reacts in one tree break hooks.
-
-## Commands
-
-| | |
-|---|---|
-| `deck-plugin build` | bundle `src/` into `plugin.js` |
-| `deck-plugin dev` | the same, rebuilt whenever a source changes |
-| `deck-plugin check` | validate `plugin.json` without building |
-| `deck-plugin install` | build, then copy into Deck's plugins folder |
-
-`install` prefers `%APPDATA%\Deck-Dev` when it exists, since anyone writing a plugin is probably
-running a debug build beside the installed one.
-
-## What you can import
-
-```ts
-import { configRead, configWrite } from "../shim/bridge.js";   // Deck's Tauri commands
-import { listen } from "../shim/event.js";                     // Deck's event bus
-import { getSettings } from "../shim/settings.js";             // Deck's settings store
-import { Field, GhostButton } from "../shim/ui.js";            // Deck's form controls
-import { getLayout } from "../shim/terminals.js";              // the terminal layout
-import { monaco } from "../shim/monaco.js";                    // the editor
-```
-
-`shim/` and `types/` are written by the build. They are not yours to edit and belong in
-`.gitignore` — the template already ignores them.
-
-The types are generated from Deck's own source, so what your editor tells you is what Deck
-actually exposes rather than a hand-written approximation that has drifted.
-
-## What a plugin cannot do
-
-Add native capability. Every Tauri command is compiled into Deck, so a plugin calls what already
-exists. Anything needing new Rust belongs in Deck itself.
-
-## What a plugin CAN do, which is worth saying plainly
-
-**Everything Deck can.** A plugin runs inside Deck with the whole bridge: every Tauri command,
-the config directory, the filesystem, the terminal, a Google access token if one is connected.
-There is no sandbox and no permission prompt.
-
-That is a deliberate position rather than an oversight — a plugin is code you chose to run, like
-a VS Code extension or a shell script. It is also why the plugin registry is curated rather than
-open: an entry exists there because it was reviewed, and installing a plugin from anywhere else
-is the same decision as running any other program.
-
-## Versions
-
-The SDK's major and minor track Deck's, so an SDK 0.15 builds plugins for Deck 0.15. Declare the
-oldest Deck you work with as `minDeck` in `plugin.json`; Deck refuses to load a plugin that
-needs a newer one, with a sentence rather than an error from inside your module.
-
-## Publishing
-
-A plugin is published by being listed in Deck's registry, which points at a release in your own
-repository. Until that is open to submissions, ask.
+# deck-plugin-sdk
+
+Build a plugin for Deck, outside Deck's own repository.
+
+```sh
+npm create deck-plugin my-thing
+cd my-thing
+npm run dev            # rebuild as you edit; each save shows in your test Deck
+npm run install-local  # when it is done: install it into your real Deck
+```
+
+Develop in a **test Deck**: a second Deck beside yours, with its own settings and data, started
+from Settings › Plugins › Open a test Deck (or `deck.exe --test`). `npm run dev` installs into it
+after every build and it reloads the plugin, so a save shows there within a few seconds, while your
+real Deck and its data are never touched.
+
+The project comes with an `AGENTS.md` (and a `CLAUDE.md` that points to it), so Claude Code,
+Codex or another agent started in the folder knows the commands, the API and the rules.
+
+## What a plugin is
+
+A folder with a `plugin.json` and a built `plugin.js`, read from
+`%APPDATA%\Deck\plugins\<id>\` when Deck starts. It becomes a tab, or a readout in the footer,
+or a panel, or commands in the palette — `docs/guide/api.md` in the Deck repository lists every
+slot a plugin can fill. One is enough.
+
+Your sources import `react`, `lucide-react` and `deck-plugin-sdk/*` as ordinary code does. At run
+time those resolve to **Deck's** copies, handed over on `window.__deck`. For React that is not
+an optimisation but a requirement: two Reacts in one tree break hooks.
+
+## Commands
+
+| | |
+|---|---|
+| `deck-plugin build` | bundle `src/` into `plugin.js` |
+| `deck-plugin dev` | rebuild whenever a source changes, and install each build into the test Deck |
+| `deck-plugin check` | validate `plugin.json` without building |
+| `deck-plugin install` | build once, then install into your real Deck |
+
+`--target test` or `--target main` picks the other Deck for either command. The test Deck keeps
+its plugins in `%APPDATA%\Deck-Dev\plugins`, your real Deck in `%APPDATA%\Deck\plugins`.
+
+## What you can import
+
+```ts
+import { configRead, configWrite } from "deck-plugin-sdk/bridge";  // Deck's Tauri commands
+import { listen } from "deck-plugin-sdk/event";                     // Deck's event bus
+import { getSettings } from "deck-plugin-sdk/settings";             // Deck's settings store
+import { Field, GhostButton } from "deck-plugin-sdk/ui";            // Deck's form controls
+import { getLayout } from "deck-plugin-sdk/terminals";              // the terminal layout
+import { monaco } from "deck-plugin-sdk/monaco";                    // the editor
+```
+
+They come from the package, so the project holds only your own code. A plugin made with an
+older SDK imports `../shim/bridge.js` instead; the build still copies `shim/` and `types/` in
+for one of those, and switching its imports over makes both unnecessary.
+
+The types are generated from Deck's own source, so what your editor tells you is what Deck
+actually exposes rather than a hand-written approximation that has drifted.
+
+Any other npm package is `npm install` and import: the build bundles it into `plugin.js`, with the
+images, fonts and CSS it brings. Writing a plugin, in the Docs, says what cannot work that way.
+
+When the build needs more than that (a worker bundled into the plugin, a dependency's locales left
+out), export esbuild plugins from `deck-plugin.config.mjs` beside `plugin.json`:
+
+```js
+export const esbuildPlugins = [{ name: "my-step", setup(build) { /* ... */ } }];
+```
+
+## What a plugin cannot do
+
+Add native capability. Every Tauri command is compiled into Deck, so a plugin calls what already
+exists. Anything needing new Rust belongs in Deck itself.
+
+## What a plugin CAN do, which is worth saying plainly
+
+**Everything Deck can.** A plugin runs inside Deck with the whole bridge: every Tauri command,
+the config directory, the filesystem, the terminal, a Google access token if one is connected.
+There is no sandbox and no permission prompt.
+
+That is a deliberate position rather than an oversight — a plugin is code you chose to run, like
+a VS Code extension or a shell script. It is also why the plugin registry is curated rather than
+open: an entry exists there because it was reviewed, and installing a plugin from anywhere else
+is the same decision as running any other program.
+
+## Versions
+
+The SDK's major and minor track Deck's, so an SDK 0.15 builds plugins for Deck 0.15. Declare the
+oldest Deck you work with as `minDeck` in `plugin.json`; Deck refuses to load a plugin that
+needs a newer one, with a sentence rather than an error from inside your module.
+
+## Publishing
+
+A plugin is published by being listed in Deck's registry, which points at a release in your own
+repository. Until that is open to submissions, ask.

package/bin/deck-plugin.mjs

@@ -1,117 +1,150 @@
 #!/usr/bin/env node
-// The Deck plugin CLI.
-//
-//   deck-plugin build          bundle src/ into plugin.js
-//   deck-plugin dev            rebuild whenever a source changes
-//   deck-plugin check          validate plugin.json without building
-//   deck-plugin install        copy the built plugin into Deck's plugins folder
-//
-// Run from a plugin's own directory.
-import { watch } from "node:fs";
-import { cpSync, existsSync, mkdirSync, readFileSync } from "node:fs";
-import { join } from "node:path";
-import { buildPlugin } from "../build-plugin.mjs";
-
-const [cmd = "build"] = process.argv.slice(2);
-const dir = process.cwd();
-
-const die = (msg) => { console.error(msg); process.exit(1); };
-
-/**
- * What Deck will refuse at install time, refused here instead.
- *
- * Every rule is one Deck's loader or install_from_registry applies — the id charset especially,
- * because the id becomes a config key and a path component. Finding out here costs a second;
- * finding out from a failed install costs a round trip.
- */
-function check() {
-  const p = join(dir, "plugin.json");
-  if (!existsSync(p)) die("no plugin.json here — is this a plugin directory?");
-
-  let manifest;
-  try { manifest = JSON.parse(readFileSync(p, "utf8")); }
-  catch (e) { die(`plugin.json is not valid JSON: ${e.message}`); }
-
-  const id = (manifest.id ?? "").trim();
-  if (!id) die("plugin.json has no id");
-  if (!/^[a-zA-Z0-9][a-zA-Z0-9-]*$/.test(id)) {
-    die(`id "${id}" must be letters, digits and dashes, starting with a letter or digit`);
-  }
-  if (!existsSync(join(dir, "src", "plugin.tsx"))) {
-    die("no src/plugin.tsx — that is the entry point");
-  }
-
-  // Not fatal, but worth saying: the registry's plugin page renders a README, and a published
-  // plugin without one gets an empty page.
-  const warn = [];
-  if (!manifest.version) warn.push("no version — Settings shows one, and the registry orders by it");
-  if (!manifest.description) warn.push("no description — the row says only a name");
-  if (!existsSync(join(dir, "README.md"))) warn.push("no README.md — publishing needs one");
-
-  console.log(`${manifest.name ?? id} ${manifest.version ?? ""}`.trim());
-  for (const w of warn) console.log(`  note: ${w}`);
-  return manifest;
-}
-
-/** Where Deck reads plugins from on this machine. */
-function pluginsDir() {
-  const appData = process.env.APPDATA;
-  if (!appData) die("APPDATA is not set — this command is for Windows, where Deck runs");
-  // Deck-Dev is the debug build's directory; prefer it when it exists, since someone building a
-  // plugin is almost certainly running a dev build beside it.
-  const dev = join(appData, "Deck-Dev", "plugins");
-  return existsSync(dev) ? dev : join(appData, "Deck", "plugins");
-}
-
-switch (cmd) {
-  case "check": {
-    check();
-    break;
-  }
-
-  case "build": {
-    const manifest = check();
-    await buildPlugin(dir);
-    console.log(`built ${manifest.id} -> plugin.js`);
-    break;
-  }
-
-  case "install": {
-    const manifest = check();
-    await buildPlugin(dir);
-    const dest = join(pluginsDir(), manifest.id);
-    mkdirSync(dest, { recursive: true });
-    for (const f of ["plugin.json", "plugin.js", "mcp.js"]) {
-      if (existsSync(join(dir, f))) cpSync(join(dir, f), join(dest, f));
-    }
-    console.log(`installed ${manifest.id} -> ${dest}`);
-    console.log("Deck watches that folder, so it is loaded already — no restart.");
-    break;
-  }
-
-  case "dev": {
-    check();
-    let building = false;
-    let again = false;
-    const once = async () => {
-      if (building) { again = true; return; }
-      building = true;
-      try { await buildPlugin(dir); console.log(`rebuilt at ${new Date().toLocaleTimeString()}`); }
-      catch (e) { console.error(e.message); }
-      building = false;
-      if (again) { again = false; void once(); }
-    };
-    await once();
-    // Debounced: an editor writing a file emits several events, and each would start a build.
-    let timer;
-    watch(join(dir, "src"), { recursive: true }, () => {
-      clearTimeout(timer);
-      timer = setTimeout(() => void once(), 120);
-    });
-    console.log("watching src/ — ctrl+c to stop");
-    break;
-  }
-
-  default:
-    die(`unknown command "${cmd}" — try build, dev, check or install`);
-}
+// The Deck plugin CLI.
+//
+//   deck-plugin build          bundle src/ into plugin.js
+//   deck-plugin dev            rebuild whenever a source changes, into the test Deck each time
+//   deck-plugin check          validate plugin.json without building
+//   deck-plugin install        build once and copy into your Deck
+//
+//   --target test|main         which Deck dev and install write to (defaults: dev -> test, install -> main)
+//
+// Run from a plugin's own directory.
+import { watch } from "node:fs";
+import { cpSync, existsSync, mkdirSync, readFileSync } from "node:fs";
+import { join } from "node:path";
+import { buildPlugin } from "../build-plugin.mjs";
+
+const argv = process.argv.slice(2);
+const at = argv.indexOf("--target");
+const targetFlag = at >= 0 ? argv[at + 1] : undefined;
+const cmd = argv.find((a, i) => !a.startsWith("-") && !(at >= 0 && i === at + 1)) ?? "build";
+const dir = process.cwd();
+
+const die = (msg) => { console.error(msg); process.exit(1); };
+
+/**
+ * What Deck will refuse at install time, refused here instead.
+ *
+ * Every rule is one Deck's loader or install_from_registry applies — the id charset especially,
+ * because the id becomes a config key and a path component. Finding out here costs a second;
+ * finding out from a failed install costs a round trip.
+ */
+function check() {
+  const p = join(dir, "plugin.json");
+  if (!existsSync(p)) die("no plugin.json here — is this a plugin directory?");
+
+  let manifest;
+  try { manifest = JSON.parse(readFileSync(p, "utf8")); }
+  catch (e) { die(`plugin.json is not valid JSON: ${e.message}`); }
+
+  const id = (manifest.id ?? "").trim();
+  if (!id) die("plugin.json has no id");
+  if (!/^[a-zA-Z0-9][a-zA-Z0-9-]*$/.test(id)) {
+    die(`id "${id}" must be letters, digits and dashes, starting with a letter or digit`);
+  }
+  if (!existsSync(join(dir, "src", "plugin.tsx"))) {
+    die("no src/plugin.tsx — that is the entry point");
+  }
+
+  // Not fatal, but worth saying: the registry's plugin page renders a README, and a published
+  // plugin without one gets an empty page.
+  const warn = [];
+  if (!manifest.version) warn.push("no version — Settings shows one, and the registry orders by it");
+  if (!manifest.description) warn.push("no description — the row says only a name");
+  if (!existsSync(join(dir, "README.md"))) warn.push("no README.md — publishing needs one");
+
+  console.log(`${manifest.name ?? id} ${manifest.version ?? ""}`.trim());
+  for (const w of warn) console.log(`  note: ${w}`);
+  return manifest;
+}
+
+/**
+ * The plugins folder of one of the two Decks on this machine.
+ *
+ * "test" is the test Deck (`deck.exe --test`, or Settings › Plugins › Open a test Deck), which keeps
+ * its own folder, Deck-Dev, apart from your real data. `dev` always writes there, so a plugin you
+ * are still writing never lands in your real Deck, even when the test Deck is closed. `install`
+ * writes to your real Deck ("main"), for when the plugin is done.
+ */
+function pluginsDir(defaultTarget) {
+  const appData = process.env.APPDATA;
+  if (!appData) die("APPDATA is not set — this command is for Windows, where Deck runs");
+  const target = targetFlag ?? defaultTarget;
+  if (target !== "test" && target !== "main") die(`--target is "test" or "main", not "${target}"`);
+  return { target, dir: join(appData, target === "test" ? "Deck-Dev" : "Deck", "plugins") };
+}
+
+/** Copy the built plugin into a Deck's plugins folder. Deck watches it and reloads the plugin. */
+function copyInto(manifest, defaultTarget) {
+  const { target, dir: plugins } = pluginsDir(defaultTarget);
+  const dest = join(plugins, manifest.id);
+  mkdirSync(dest, { recursive: true });
+  for (const f of ["plugin.json", "plugin.js", "mcp.js"]) {
+    if (existsSync(join(dir, f))) cpSync(join(dir, f), join(dest, f));
+  }
+  return { target, dest };
+}
+
+/** Whether the test Deck is running: it answers on its own port. */
+async function testDeckRunning() {
+  try { return (await fetch("http://127.0.0.1:8791/health", { signal: AbortSignal.timeout(800) })).ok; }
+  catch { return false; }
+}
+
+switch (cmd) {
+  case "check": {
+    check();
+    break;
+  }
+
+  case "build": {
+    const manifest = check();
+    await buildPlugin(dir);
+    console.log(`built ${manifest.id} -> plugin.js`);
+    break;
+  }
+
+  case "install": {
+    const manifest = check();
+    await buildPlugin(dir);
+    const { target, dest } = copyInto(manifest, "main");
+    console.log(`installed ${manifest.id} into your ${target === "test" ? "test " : ""}Deck -> ${dest}`);
+    console.log("Deck watches that folder, so it is loaded already — no restart.");
+    break;
+  }
+
+  case "dev": {
+    const manifest = check();
+    let building = false;
+    let again = false;
+    const once = async () => {
+      if (building) { again = true; return; }
+      building = true;
+      try {
+        await buildPlugin(dir);
+        // Into the test Deck after every build: it reloads the plugin when its folder changes, so
+        // a save shows there within a few seconds.
+        const { target, dest } = copyInto(manifest, "test");
+        console.log(`rebuilt at ${new Date().toLocaleTimeString()} -> ${target} Deck (${dest})`);
+      } catch (e) { console.error(e.message); }
+      building = false;
+      if (again) { again = false; void once(); }
+    };
+    if ((targetFlag ?? "test") === "test" && !(await testDeckRunning())) {
+      console.log("No test Deck is running, so you will not see changes yet. Start one from");
+      console.log("Settings › Plugins › Open a test Deck (or run deck.exe --test); it loads this plugin.");
+    }
+    await once();
+    // Debounced: an editor writing a file emits several events, and each would start a build.
+    let timer;
+    watch(join(dir, "src"), { recursive: true }, () => {
+      clearTimeout(timer);
+      timer = setTimeout(() => void once(), 120);
+    });
+    console.log("watching src/ — ctrl+c to stop");
+    break;
+  }
+
+  default:
+    die(`unknown command "${cmd}" — try build, dev, check or install`);
+}

package/build-plugin.mjs

@@ -13,16 +13,20 @@
 // DECK'S React — which is not an optimisation but a requirement, since two Reacts in one tree
 // break hooks.
 import { build } from "esbuild";
-import { cpSync, existsSync, readdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
+import { cpSync, existsSync, mkdirSync, readdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
 import { createRequire } from "node:module";
 import { dirname, join } from "node:path";
-import { fileURLToPath } from "node:url";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import { assetLoaders, fromPackage, packageCss, rawImports } from "./packages.mjs";
 
 const sdk = dirname(fileURLToPath(import.meta.url));
 const require = createRequire(import.meta.url);
 
-/** The module names a plugin may import, and the shipped file each resolves to. */
-function shimMap(shimDir) {
+/**
+ * The module names a plugin may import, and the file each resolves to: shipped ones in `shimDir`,
+ * the two generated per plugin in `genDir`.
+ */
+function shimMap(shimDir, genDir) {
   return {
     react: join(shimDir, "react.js"),
     "deckreact/jsx-runtime": join(shimDir, "jsx-runtime.js"),
@@ -31,17 +35,21 @@ function shimMap(shimDir) {
     // Deck's react-dom (needs Deck 1.1); only bundled when a plugin or its library imports it.
     "react-dom": join(shimDir, "react-dom.js"),
     "@tauri-apps/api/event": join(shimDir, "event.js"),
-    "lucide-react": join(shimDir, "icons.js"),
-    "framer-motion": join(shimDir, "motion.js"),
+    "lucide-react": join(genDir, "icons.js"),
+    "framer-motion": join(genDir, "motion.js"),
   };
 }
 
 /**
  * Build the plugin in `dir`.
  *
- * The shim is copied in rather than imported from node_modules, because a plugin's sources refer
- * to it by relative path (`../shim/bridge.js`) and that has to resolve on disk. Copied on every
- * build so updating the SDK updates the shim, which is the behaviour someone upgrading expects.
+ * A plugin imports the shim from this package (`deck-plugin-sdk/bridge`), so its project holds
+ * only its own code: the editor and esbuild both find the shim and its types in node_modules.
+ * The two files generated per plugin go to node_modules/.cache, for the length of a build.
+ *
+ * A project made before that imports `../shim/bridge.js`, a path that has to exist on disk, so
+ * for one of those the shim and its types are still copied in beside `src/`, on every build so
+ * updating the SDK updates them.
  */
 export async function buildPlugin(dir, { entry = "plugin.tsx" } = {}) {
   const manifestPath = join(dir, "plugin.json");
@@ -50,14 +58,31 @@ export async function buildPlugin(dir, { entry = "plugin.tsx" } = {}) {
   }
   const manifest = JSON.parse(readFileSync(manifestPath, "utf8"));
 
-  const shimDir = join(dir, "shim");
-  rmSync(shimDir, { recursive: true, force: true });
-  cpSync(join(sdk, "shim"), shimDir, { recursive: true });
-  // The declarations the shim's .d.ts files point at, as ../types/. Copied beside it for the
-  // same reason: a relative reference has to find something.
-  const typesDir = join(dir, "types");
-  rmSync(typesDir, { recursive: true, force: true });
-  cpSync(join(sdk, "types"), typesDir, { recursive: true });
+  // A plugin that needs more from esbuild than this build gives (a worker bundled into it, a
+  // dependency's locales left out) exports `esbuildPlugins` from deck-plugin.config.mjs beside
+  // plugin.json. They run after Deck's own, so they never take over react or the shim.
+  const configPath = join(dir, "deck-plugin.config.mjs");
+  const config = existsSync(configPath) ? await import(pathToFileURL(configPath).href) : {};
+
+  const sources = readdirSync(join(dir, "src"), { recursive: true })
+    .filter((f) => typeof f === "string" && /\.tsx?$/.test(f))
+    .map((f) => readFileSync(join(dir, "src", f), "utf8"));
+
+  const legacy = sources.some((src) => /from\s*["'](\.\.\/)+shim\//.test(src));
+  let shimDir = join(sdk, "shim");
+  let genDir = join(dir, "node_modules", ".cache", "deck-plugin");
+  if (legacy) {
+    shimDir = genDir = join(dir, "shim");
+    rmSync(shimDir, { recursive: true, force: true });
+    cpSync(join(sdk, "shim"), shimDir, { recursive: true });
+    // The declarations the shim's .d.ts files point at, as ../types/. Copied beside it for the
+    // same reason: a relative reference has to find something.
+    const typesDir = join(dir, "types");
+    rmSync(typesDir, { recursive: true, force: true });
+    cpSync(join(sdk, "types"), typesDir, { recursive: true });
+  } else {
+    mkdirSync(genDir, { recursive: true });
+  }
 
   // ---- icons and animation, generated per plugin ----
   //
@@ -68,10 +93,6 @@ export async function buildPlugin(dir, { entry = "plugin.tsx" } = {}) {
   //
   // Nothing about this needs Deck's source, only the plugin's own and the real package, so it
   // runs here the same way it runs inside the Deck repository.
-  const sources = readdirSync(join(dir, "src"), { recursive: true })
-    .filter((f) => typeof f === "string" && /\.tsx?$/.test(f))
-    .map((f) => readFileSync(join(dir, "src", f), "utf8"));
-
   for (const [pkg, file, global] of [
     ["lucide-react", "icons.js", "icons"],
     ["framer-motion", "motion.js", "motion"],
@@ -90,7 +111,7 @@ export async function buildPlugin(dir, { entry = "plugin.tsx" } = {}) {
       for (const n of names) if (!(n in real)) throw new Error(`${pkg} has no export "${n}"`);
     }
 
-    writeFileSync(join(shimDir, file), `// GENERATED by the Deck plugin build — do not edit.
+    writeFileSync(join(genDir, file), `// GENERATED by the Deck plugin build — do not edit.
 //
 // Deck's ${pkg}, so this plugin does not bundle its own copy. Only the names this plugin
 // imports: naming every export would defeat tree-shaking and make the bundle larger.
@@ -99,7 +120,7 @@ ${names.map((n) => `export const ${n} = __src.${n};`).join("\n")}
 `);
   }
 
-  const shims = shimMap(shimDir);
+  const shims = shimMap(shimDir, genDir);
 
   await build({
     entryPoints: [join(dir, "src", entry)],
@@ -118,7 +139,8 @@ ${names.map((n) => `export const ${n} = __src.${n};`).join("\n")}
     // A .wasm import becomes a Uint8Array inlined in the bundle rather than a sidecar file. A
     // plugin is installed as plugin.json + plugin.js, so a file beside them would never arrive.
     // A .css import becomes its text, for the plugin to inject as a <style>, for the same reason.
-    loader: { ".wasm": "binary", ".css": "text" },
+    // Images and fonts become data: URLs, for the same reason (packages.mjs).
+    loader: { ".wasm": "binary", ".css": "text", ...assetLoaders },
     // A resolve plugin rather than esbuild's `alias`, which maps package to package while these
     // point at single files.
     plugins: [{
@@ -126,9 +148,9 @@ ${names.map((n) => `export const ${n} = __src.${n};`).join("\n")}
       setup(b) {
         const filter = new RegExp(`^(${Object.keys(shims)
           .map((k) => k.replace(/[/\\^$*+?.()|[\]{}]/g, "\\$&")).join("|")})$`);
-        b.onResolve({ filter }, (a) => ({ path: shims[a.path] }));
+        b.onResolve({ filter }, (a) => (fromPackage(a, dir) ? undefined : { path: shims[a.path] }));
       },
-    }],
+    }, rawImports, packageCss(manifest.id, dir), ...(config.esbuildPlugins ?? [])],
     logLevel: "info",
   });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "deck-plugin-sdk",
-  "version": "1.2.0",
+  "version": "1.5.0",
   "description": "Build a plugin for Deck, outside the Deck repository.",
   "type": "module",
   "license": "MIT",
@@ -9,6 +9,10 @@
   },
   "exports": {
     "./build": "./build-plugin.mjs",
+    "./*": {
+      "types": "./shim/*.d.ts",
+      "default": "./shim/*.js"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -17,6 +21,7 @@
     "types",
     "template",
     "build-plugin.mjs",
+    "packages.mjs",
     "README.md"
   ],
   "dependencies": {