mdeck 2.3.0 → 3.1.0

package/src/build/check.js

@@ -26,13 +26,6 @@ export function checkDeck(slidesPath, registry, source = readFileSync(slidesPath
     if (record.source !== 'local') continue
     for (const problem of paletteProblems(record.manifest)) diagnostics.push({ severity: 'warning', code: 'palette-contrast', message: `Palette "${record.id}", ${problem}`, line: 1, column: 1 })
   }
-  // A theme or palette installed for this user only: the slide file needs it
-  // beside it to work on another computer.
-  const config = deck.deckConfig ?? {}
-  for (const [kind, id] of [['theme', config.theme], ['palette', config.palette]]) {
-    const record = id && registry[`${kind}s`][id]
-    if (record?.source === 'user') diagnostics.push({ severity: 'warning', code: 'user-extension', message: `The ${kind} "${id}" is installed only on this computer (${dirname(record.dir)}); copy it into the deck's extensions folder, for example with mdeck themes install, so the slide file works elsewhere`, line: 1, column: 1 })
-  }
   // The deck's drawings file: readable, and only for slides that still exist.
   const inkPath = inkFileFor(resolve(slidesPath))
   const renamed = drawingsDiagnostic(slidesPath)

package/src/build/editorPlugin.js

@@ -5,8 +5,9 @@
 import { createHash } from 'node:crypto'
 import { existsSync, readFileSync, writeFileSync, mkdirSync, readdirSync, rmSync, unlinkSync } from 'node:fs'
 import { resolve, basename, dirname, relative } from 'node:path'
-import { builtInRegistry, loadRegistry, serializeRegistry } from '../extensions/discover.js'
-import { fetchIndex, findPack, installedPacks, installFromIndex, PackError } from '../extensions/packs.js'
+import { loadRegistry, removedBuiltIns, serializeRegistry, userExtensionsDir } from '../extensions/discover.js'
+import { findEntry, installedPackages, keyOf, loadCatalogue, PackageError } from '../extensions/packages.js'
+import { installHere, removeHere, target } from '../extensions/installed.js'
 import { createRequire } from 'node:module'
 import { ManifestError, KINDS, ID_RE, MANIFEST_FILENAME, parseManifestText, validateManifest } from '../extensions/manifest.js'
 
@@ -180,7 +181,6 @@ export function createExtensionStore(deckDir, { registryFor }) {
 }
 
 export function editorMiddleware(deckFile, { registryFor, extensions = createExtensionStore(dirname(deckFile.path), { registryFor }) }) {
-  const extensionsDir = resolve(dirname(deckFile.path), 'extensions')
   return async (request, response, next) => {
     const pathname = new URL(request.url, 'http://localhost').pathname
     if (!isAllowedRequest(request)) return send(response, 403, { error: 'Requests are only accepted from this editor on this computer' })
@@ -201,18 +201,31 @@ export function editorMiddleware(deckFile, { registryFor, extensions = createExt
         response.setHeader('Allow', 'GET, PUT, DELETE')
         return send(response, 405, { error: 'Method not allowed' })
       }
-      // The theme repository: what it offers, and installing a pack into the
-      // deck's extensions folder.
-      if (pathname === '/themes/index' && request.method === 'GET') {
-        const index = await fetchIndex()
-        return send(response, 200, { ...index, installed: installedPacks(extensionsDir) })
+      // Themes and palettes: what mdeck and the repository offer, and
+      // installing or removing one for every deck (as mdeck themes does).
+      if (pathname === '/themes/catalogue' && request.method === 'GET') {
+        const catalogue = await loadCatalogue()
+        const hidden = removedBuiltIns()
+        const installed = installedPackages(userExtensionsDir())
+        const entries = catalogue.entries.map(({ dir, ...entry }) => {
+          const key = keyOf(entry.kind, entry.id)
+          const removed = entry.builtIn && hidden.includes(key)
+          return { ...entry, removed, available: Boolean(installed[key]) || (entry.builtIn && !removed), ...(entry.preview ? { preview: new URL(entry.preview, catalogue.url).href } : {}) }
+        })
+        return send(response, 200, { url: catalogue.url, offline: catalogue.offline, entries })
       }
       if (pathname === '/themes/install' && request.method === 'POST') {
         const body = await readJson(request)
-        const index = await fetchIndex()
-        const registry = builtInRegistry()
-        const result = await installFromIndex(index, findPack(index, String(body?.id ?? '')), { root: extensionsDir, known: { themes: registry.themes, palettes: registry.palettes }, mdeckVersion: VERSION })
-        return send(response, 200, { ...result, registry: serializeRegistry(registryFor()) })
+        const kind = String(body?.kind ?? ''), id = String(body?.id ?? '')
+        const catalogue = await loadCatalogue()
+        findEntry(catalogue, kind, id)
+        const steps = await installHere(catalogue, kind, id, target(null, false), { mdeckVersion: VERSION })
+        return send(response, 200, { steps, registry: serializeRegistry(registryFor()) })
+      }
+      if (pathname === '/themes/remove' && request.method === 'POST') {
+        const body = await readJson(request)
+        const removed = removeHere(String(body?.kind ?? ''), String(body?.id ?? ''), target(null, false))
+        return send(response, 200, { removed, registry: serializeRegistry(registryFor()) })
       }
       if (pathname === '/deck' && request.method === 'GET') {
         const registry = registryFor()
@@ -230,7 +243,7 @@ export function editorMiddleware(deckFile, { registryFor, extensions = createExt
       if (['/deck', '/source'].includes(pathname)) { response.setHeader('Allow', pathname === '/deck' ? 'GET' : 'POST'); return send(response, 405, { error: 'Method not allowed' }) }
       return next()
     } catch (error) {
-      if (error instanceof PackError) return send(response, 400, { error: error.message })
+      if (error instanceof PackageError) return send(response, 400, { error: error.message })
       if (error instanceof ManifestError) return send(response, 500, { error: error.message })
       return send(response, error.status ?? 500, { error: error.message })
     }

package/src/build/themeCheck.js

@@ -11,6 +11,7 @@ import { resolve } from 'node:path'
 import { launchChrome } from './chrome.js'
 import { frameworkRoot } from '../paths.js'
 import { sampleDeck, SAMPLE_PICTURE } from '../editor/sampleDeck.js'
+import { loadRegistry } from '../extensions/discover.js'
 
 // Runs in the page before the deck: keeps what the page reports.
 const RECORDER = `window.__report = [];
@@ -80,18 +81,28 @@ const MEASURE = `(() => {
   return problems
 })()`
 
-// Builds the sample deck with `extensions` ({ id: folder }) beside it and
-// opens it in Chrome for `use({ open, ids })`. Installed user extensions are
-// left out, so the result depends only on what is given.
-export async function withSampleDeck({ extensions = {} } = {}, use) {
+// Builds the sample deck with `extensions` ({ id: folder }) beside it into
+// `outDir`, as a folder to host. Installed user extensions are left out, so
+// the result depends only on what is given. Returns the registry it used.
+export function buildSampleDeck({ extensions = {}, outDir }) {
   const temp = mkdtempSync(resolve(tmpdir(), 'mdeck-sample-'))
   try {
     writeFileSync(resolve(temp, 'slides.md'), sampleDeck())
     writeFileSync(resolve(temp, 'picture.svg'), SAMPLE_PICTURE)
-    for (const [id, dir] of Object.entries(extensions)) cpSync(dir, resolve(temp, 'extensions', id), { recursive: true })
+    // Keyed by id, or by "kind:id" to keep a theme and a palette of one name apart.
+    for (const [key, dir] of Object.entries(extensions)) cpSync(dir, resolve(temp, 'extensions', ...key.split(':').map((part, i, all) => all.length > 1 && i === 0 ? `${part}s` : part)), { recursive: true })
     mkdirSync(resolve(temp, 'home'))
-    execFileSync(process.execPath, [resolve(frameworkRoot, 'bin/mdeck.js'), 'build', resolve(temp, 'slides.md'), '-o', resolve(temp, 'out/index.html')],
+    execFileSync(process.execPath, [resolve(frameworkRoot, 'bin/mdeck.js'), 'build', resolve(temp, 'slides.md'), '-o', resolve(outDir, 'index.html')],
       { cwd: temp, stdio: 'pipe', env: { ...process.env, MDECK_HOME: resolve(temp, 'home') } })
+    return loadRegistry(resolve(temp, 'slides.md'), { userRoot: null })
+  } finally { rmSync(temp, { recursive: true, force: true }) }
+}
+
+// The sample deck built with `extensions`, opened in Chrome for `use({ open })`.
+export async function withSampleDeck({ extensions = {} } = {}, use) {
+  const temp = mkdtempSync(resolve(tmpdir(), 'mdeck-sample-'))
+  try {
+    buildSampleDeck({ extensions, outDir: resolve(temp, 'out') })
     const browser = await launchChrome({ dir: resolve(temp, 'out') })
     try {
       // A page with the deck in a look, recording what it reports.

package/src/cli/args.js

@@ -7,7 +7,8 @@ const commands = {
   run: { ...common, '--network': flag, '--server': optional, max: 1 },
   edit: { ...common, max: 1 },
   design: { ...common, max: 1 },
-  themes: { '--global': flag, '--force': flag, '--check': flag, '--output': value, '-o': '--output', max: 4 },
+  themes: { '--local': flag, '--force': flag, '--check': flag, '--output': value, '-o': '--output', max: 4 },
+  palettes: { '--local': flag, '--force': flag, max: 4 },
   build: { ...output, '--single-file': flag, '--launchers': flag, '--reader': flag, '--notes': flag, max: 1 },
   send: { ...output, '--notes': flag, '--no-pdf': flag, max: 1 },
   pdf: { ...output, max: 1 },

package/src/cli/index.js

@@ -19,7 +19,7 @@ import { createPairing, pairingPlugin } from '../build/pairing.js'
 import { isAllowedRequest } from '../build/editorPlugin.js'
 import { renderPdf, attachPdf, findChrome } from '../build/pdf.js'
 import { installSkill, readSkill, TARGETS } from './skill.js'
-import { runThemes } from './themes.js'
+import { runPackages } from './themes.js'
 import { ManifestError, KINDS } from '../extensions/manifest.js'
 
 import { frameworkRoot } from '../paths.js'
@@ -313,9 +313,10 @@ const HELP = `
     ${c.green}mdeck edit${c.reset} [slides.md]                    Edit slides in the browser; saves to the file
     ${c.green}mdeck design${c.reset} [folder | slides.md]         Look at and fine-tune themes and palettes on a sample deck;
                                               saves to the folder's extensions/ (default: this folder)
-    ${c.green}mdeck themes${c.reset} search [words]               Themes and palettes from the online repository
-      install <pack> [slides.md | folder]   into the deck's extensions/ (--global: for every deck)
-      remove <pack>, update [pack], list    --force replaces files changed by hand
+    ${c.green}mdeck themes${c.reset} search [words]               Themes from mdeck and the theme repository; install <theme>
+      install <theme>, remove <theme>       brings its default palette along; for every deck, or add
+      update [theme], list                  slides.md or --local for one deck; --force replaces edited files
+    ${c.green}mdeck palettes${c.reset} search | install | remove | update | list   The same for palettes
 
   ${c.dim}Make something to hand out${c.reset}
     ${c.green}mdeck build${c.reset} [slides.md] [-o dir/index.html]   A folder to host
@@ -613,8 +614,8 @@ if (command === 'new') {
   tip(`Changes are saved to the file as you type. Before the first change, a copy goes to ${BACKUP_DIR}/ beside it.\n`)
 
 // ── themes ────────────────────────────────────────────────────────────────────
-} else if (command === 'themes') {
-  await runThemes({ positionals: positionals(), flag: name => hasFlag(name), output: outputOption, ui: { ok, err, tip, c } })
+} else if (command === 'themes' || command === 'palettes') {
+  await runPackages({ kind: command.slice(0, -1), positionals: positionals(), flag: name => hasFlag(name), output: outputOption, ui: { ok, err, tip, c } })
 
 // ── design ────────────────────────────────────────────────────────────────────
 // The design page: with a deck, beside its editor; with a folder (or nothing),

package/src/cli/themes.js

@@ -1,140 +1,170 @@
-// `mdeck themes`: themes and palettes from the theme repository. Installs go
-// into a deck's extensions/ folder, or with --global into the user's
-// (~/.mdeck/extensions), where every deck finds them. `build` is for the
-// repository itself: it checks the packs and writes what is served.
-import { existsSync, readFileSync, statSync, writeFileSync } from 'node:fs'
+// `mdeck themes` and `mdeck palettes`: install, update and remove themes and
+// palettes, each on its own. Some come with mdeck, the others from the theme
+// repository. A theme brings its default palette along, a palette that
+// belongs to one theme brings that theme. They are installed for every deck
+// (~/.mdeck/extensions) unless a deck or folder is named, or --local is
+// given: then into the extensions folder beside it, so the slide folder
+// carries them. A built-in one is removed by hiding it and installed again
+// from mdeck's own copy, so that works offline. `mdeck themes build` is for
+// the repository itself.
+import { existsSync, statSync, writeFileSync } from 'node:fs'
 import { createRequire } from 'node:module'
-import { dirname, resolve } from 'node:path'
-import { builtInRegistry, loadRegistry, userExtensionsDir } from '../extensions/discover.js'
+import { resolve } from 'node:path'
+import { loadRegistry, manifestsOf, removedBuiltIns, userExtensionsDir } from '../extensions/discover.js'
+import { target, installHere, removeHere } from '../extensions/installed.js'
+import { palettesFor } from '../extensions/tokens.js'
 import { ManifestError } from '../extensions/manifest.js'
-import { buildRepository, compareVersions, fetchIndex, findPack, installedPacks, installFromIndex, PackError, removePack } from '../extensions/packs.js'
+import { buildRepository, compareVersions, findEntry, installedPackages, keyOf, loadCatalogue, PackageError } from '../extensions/packages.js'
 
 const VERSION = createRequire(import.meta.url)('../../package.json').version
 
-const USAGE = 'search [words] | install <pack> | remove <pack> | update [pack] | list, each with [slides.md or folder] and --global; build <packs> -o <out> [--check]'
+const usage = kind => `search [words] | install <${kind}> | remove <${kind}> | update [${kind}] | list — for every deck, or beside a deck with [slides.md or folder] or --local${kind === 'theme' ? '; build <repository> -o <out> [--check]' : ''}`
 
-// The built-in themes and palettes a pack may name and must not reuse the ids of.
-const builtIns = () => {
-  const registry = builtInRegistry()
-  return { themes: registry.themes, palettes: registry.palettes }
-}
-
-// The extensions folder a command works on, and a slides path to load the
-// registry with: the user's with --global, else beside the deck or in the folder.
-function target(where, global) {
-  if (global) return { root: userExtensionsDir(), deck: resolve('slides.md'), label: 'for every deck' }
-  const given = resolve(where ?? '.')
-  const folder = existsSync(given) && statSync(given).isDirectory() ? given : dirname(given)
-  return { root: resolve(folder, 'extensions'), deck: existsSync(given) && !statSync(given).isDirectory() ? given : resolve(folder, 'slides.md'), label: `in ${resolve(folder, 'extensions')}` }
+// Every theme with the palettes it offers, and every palette's colours, each
+// marked as built in or from the repository: for the theme browser.
+function looksOf(registry, catalogue) {
+  const builtIn = new Set([...catalogue.themes, ...catalogue.palettes].filter(entry => entry.builtIn).map(entry => entry.id + (catalogue.themes.includes(entry) ? ':t' : ':p')))
+  const palettes = manifestsOf(registry, 'palette')
+  const colours = tokens => Object.fromEntries(['--bg', '--surface', '--ink', '--accent', '--accent-2'].map(key => [key, tokens?.[key] ?? null]))
+  return {
+    mdeck: VERSION,
+    themes: Object.values(manifestsOf(registry, 'theme')).map(theme => ({ id: theme.id, title: theme.title, description: theme.description ?? '', builtIn: builtIn.has(theme.id + ':t'),
+      palette: theme.palette, appearance: theme.appearance ?? 'light', palettes: palettesFor(theme, palettes).map(p => p.id) })),
+    palettes: Object.values(palettes).map(palette => ({ id: palette.id, title: palette.title, description: palette.description ?? '', builtIn: builtIn.has(palette.id + ':p'),
+      ...(palette.theme ? { theme: palette.theme } : {}), light: colours(palette.light), dark: colours(palette.dark) })),
+  }
 }
 
-const install = (index, entry, { root, force }) => installFromIndex(index, entry, { root, known: builtIns(), mdeckVersion: VERSION, force })
-
-export async function runThemes({ positionals, flag, output, ui: { ok, err, tip, c } }) {
+export async function runPackages({ kind, positionals, flag, output, ui: { ok, err, tip, c } }) {
+  const kinds = `${kind}s`
   const [sub = 'search', ...rest] = positionals
-  const global = flag('--global'), force = flag('--force')
+  const local = flag('--local'), force = flag('--force')
+  const warnOffline = catalogue => { if (catalogue.offline) tip(`The theme repository could not be reached (${catalogue.offline}); showing the ${kinds} that come with mdeck.`) }
+  const label = step => `the ${step.kind} ${step.id}`
   try {
     if (sub === 'search') {
-      const index = await fetchIndex()
+      const catalogue = await loadCatalogue()
+      warnOffline(catalogue)
       const words = rest.map(word => word.toLowerCase())
-      const local = installedPacks(target(null, false).root), mine = installedPacks(userExtensionsDir())
-      const found = index.packs.filter(pack => words.every(word => [pack.id, pack.title, pack.description, ...pack.themes, ...pack.palettes].join(' ').toLowerCase().includes(word)))
-      if (!found.length) return tip(`No pack matches${words.length ? ` "${words.join(' ')}"` : ''} in ${index.url}`)
-      for (const pack of found) {
-        const have = local[pack.id] ?? mine[pack.id]
-        const state = !have ? '' : compareVersions(pack.version, have.version) > 0 ? ` ${c.yellow}(${have.version} installed, update available)${c.reset}` : ` ${c.green}(installed)${c.reset}`
-        console.log(`\n  ${c.cyan}${pack.id}${c.reset} ${pack.version} — ${pack.title}${state}`)
-        if (pack.description) console.log(`    ${pack.description}`)
-        console.log(`    ${c.dim}${[pack.themes.length ? `themes: ${pack.themes.join(', ')}` : '', pack.palettes.length ? `palettes: ${pack.palettes.join(', ')}` : ''].filter(Boolean).join(' · ')} · by ${pack.author}, ${pack.license}${c.reset}`)
+      const forEvery = installedPackages(userExtensionsDir()), here = installedPackages(resolve('extensions')), hidden = removedBuiltIns()
+      const found = catalogue.entries.filter(entry => entry.kind === kind && words.every(word => [entry.id, entry.title, entry.description, entry.palette ?? '', entry.theme ?? ''].join(' ').toLowerCase().includes(word)))
+      if (!found.length) return tip(`No ${kind} matches${words.length ? ` "${words.join(' ')}"` : ''}`)
+      for (const entry of found) {
+        const key = keyOf(kind, entry.id)
+        const have = here[key] ?? forEvery[key]
+        const state = have ? (compareVersions(entry.version, have.version ?? '0.0.0') > 0 ? ` ${c.yellow}(${have.version} installed, update available)${c.reset}` : ` ${c.green}(installed)${c.reset}`)
+          : entry.builtIn ? (hidden.includes(key) ? ` ${c.dim}(comes with mdeck, removed)${c.reset}` : ` ${c.green}(comes with mdeck)${c.reset}`)
+          : entry.builtInVersion ? ` ${c.yellow}(comes with mdeck as ${entry.builtInVersion}, update available)${c.reset}` : ''
+        console.log(`\n  ${c.cyan}${entry.id}${c.reset} ${entry.version} — ${entry.title}${state}`)
+        if (entry.description) console.log(`    ${entry.description}`)
+        const facts = [kind === 'theme' ? `palette: ${entry.palette}` : entry.theme ? `only for the theme ${entry.theme}` : '', entry.author ? `by ${entry.author}` : '', entry.license].filter(Boolean)
+        if (facts.length) console.log(`    ${c.dim}${facts.join(' · ')}${c.reset}`)
       }
       console.log()
-      return tip('Install one with: mdeck themes install <pack> [slides.md]   (--global for every deck)')
+      return tip(`Install one for every deck with: mdeck ${kinds} install <${kind}>   (beside a deck: add slides.md or --local)`)
     }
 
     if (sub === 'install') {
       const [id, where] = rest
-      if (!id) { err('Name a pack.'); return tip('Usage: mdeck themes install <pack> [slides.md or folder] [--global]; mdeck themes search lists them.') }
-      const { root, deck, label } = target(where, global)
-      const index = await fetchIndex()
-      const result = await install(index, findPack(index, id), { root, force })
-      loadRegistry(deck)
-      ok(`${result.replaced ? `Updated ${id} from ${result.replaced}` : `Installed ${id}`} ${label}`)
-      if (result.themes.length) tip(`Themes: ${result.themes.join(', ')}. Use one with "theme: ${result.themes[0]}" in the deck settings.`)
-      if (result.palettes.length) tip(`Palettes: ${result.palettes.join(', ')}. Use one with "palette: ${result.palettes[0]}".`)
-      return tip('Look at it on a sample deck: mdeck design')
+      if (!id) { err(`Name a ${kind}.`); return tip(`Usage: mdeck ${kinds} install <${kind}> [slides.md or folder] [--local]; mdeck ${kinds} search lists them.`) }
+      const at = target(where, local)
+      const catalogue = await loadCatalogue()
+      warnOffline(catalogue)
+      findEntry(catalogue, kind, id)
+      for (const step of await installHere(catalogue, kind, id, at, { mdeckVersion: VERSION, force })) {
+        const what = step.requested ? label(step) : `${label(step)}, which it needs,`
+        if (step.kept) tip(`${what[0].toUpperCase() + what.slice(1)} is there already`)
+        else if (step.builtIn) step.wasRemoved || step.requested ? ok(`${label(step)[0].toUpperCase() + label(step).slice(1)} comes with mdeck${step.wasRemoved ? ' and is offered again' : ''}`) : null
+        else ok(`${step.replaced ? `Updated ${label(step)} from ${step.replaced} to ${step.version}` : `Installed ${label(step)} ${step.version}`} ${at.label}`)
+      }
+      tip(`Use it with "${kind}: ${id}" at the top of a slide file. Look at it on a sample deck: mdeck design`)
+      return
     }
 
     if (sub === 'remove') {
       const [id, where] = rest
-      if (!id) { err('Name a pack.'); return tip('Usage: mdeck themes remove <pack> [slides.md or folder] [--global]') }
-      const { root, label } = target(where, global)
-      const pack = removePack(id, { root, force })
-      return ok(`Removed ${id} ${label} (${pack.folders.join(', ')})`)
+      if (!id) { err(`Name a ${kind}.`); return tip(`Usage: mdeck ${kinds} remove <${kind}> [slides.md or folder] [--local]`) }
+      const at = target(where, local)
+      for (const step of removeHere(kind, id, at, { force })) {
+        ok(step.hidden ? `${label(step)[0].toUpperCase() + label(step).slice(1)} comes with mdeck and is no longer offered; mdeck ${step.kind}s install ${step.id} brings it back` : `Removed ${label(step)} ${at.label}`)
+      }
+      return
     }
 
     if (sub === 'update') {
       const [first, second] = rest
       const named = first && !/\.md$/i.test(first) && !(existsSync(first) && statSync(first).isDirectory()) ? first : null
-      const { root, deck, label } = target(named ? second : first, global)
-      const installed = installedPacks(root)
-      const ids = named ? [named] : Object.keys(installed)
-      if (!ids.length) return tip(`No packs installed ${label}`)
-      const index = await fetchIndex()
+      const at = target(named ? second : first, local)
+      const catalogue = await loadCatalogue()
+      warnOffline(catalogue)
+      const installed = Object.values(installedPackages(at.root)).filter(item => item.kind === kind)
+      const ids = named ? [named] : installed.map(item => item.id)
+      if (!ids.length) return tip(`No ${kinds} installed ${at.label}`)
       for (const id of ids) {
-        if (!installed[id]) throw new PackError(`The pack ${id} is not installed ${label}`)
-        const entry = findPack(index, id)
-        if (compareVersions(entry.version, installed[id].version) <= 0) { tip(`${id} ${installed[id].version} is up to date`); continue }
-        await install(index, entry, { root, force })
-        ok(`Updated ${id} ${installed[id].version} → ${entry.version}`)
+        const have = installed.find(item => item.id === id)
+        if (!have) throw new PackageError(`The ${kind} ${id} is not installed ${at.label}`)
+        const entry = findEntry(catalogue, kind, id)
+        if (entry.builtIn || compareVersions(entry.version, have.version ?? '0.0.0') <= 0) { tip(`The ${kind} ${id} ${have.version} is up to date`); continue }
+        await installHere(catalogue, kind, id, at, { mdeckVersion: VERSION, force })
+        ok(`Updated the ${kind} ${id} ${have.version} → ${entry.version}`)
       }
-      loadRegistry(deck)
+      loadRegistry(at.deck)
       return
     }
 
     if (sub === 'list') {
       const [where] = rest
-      for (const [label, root] of [['This folder', target(where, false).root], ['Every deck (--global)', userExtensionsDir()]]) {
-        const packs = installedPacks(root)
-        console.log(`\n  ${c.bold}${label}${c.reset} ${c.dim}${root}${c.reset}`)
-        if (!Object.keys(packs).length) console.log(`    ${c.dim}none${c.reset}`)
-        for (const [id, pack] of Object.entries(packs)) console.log(`    ${c.cyan}${id}${c.reset} ${pack.version} — ${pack.folders.join(', ')}`)
+      const hidden = removedBuiltIns()
+      const catalogue = await loadCatalogue({ online: false })
+      console.log(`\n  ${c.bold}Come with mdeck${c.reset}`)
+      for (const entry of catalogue.entries.filter(entry => entry.kind === kind)) console.log(`    ${c.cyan}${entry.id}${c.reset}${hidden.includes(keyOf(kind, entry.id)) ? ` ${c.dim}(removed; mdeck ${kinds} install ${entry.id} brings it back)${c.reset}` : ''}`)
+      const sections = [['For every deck', userExtensionsDir()], ...(where || local ? [['Beside the deck', target(where, true).root]] : [])]
+      for (const [title, root] of sections) {
+        const items = Object.values(installedPackages(root)).filter(item => item.kind === kind)
+        console.log(`\n  ${c.bold}${title}${c.reset} ${c.dim}${root}${c.reset}`)
+        if (!items.length) console.log(`    ${c.dim}none${c.reset}`)
+        for (const item of items) console.log(`    ${c.cyan}${item.id}${c.reset} ${item.version}`)
       }
       console.log()
       return
     }
 
-    if (sub === 'build') {
-      const [packsDir] = rest
+    if (sub === 'build' && kind === 'theme') {
+      const [repoDir] = rest
       const out = output()
-      if (!packsDir || !out) { err('Name the packs folder and the output folder.'); return tip('Usage: mdeck themes build <packs folder> -o <output folder> [--check]') }
-      const index = buildRepository(resolve(packsDir), resolve(out), { known: builtIns() })
-      // Every theme and palette of every pack, from the pack folders.
-      const extensions = Object.fromEntries(index.packs.flatMap(pack => [...pack.themes, ...pack.palettes].map(id => [id, resolve(packsDir, pack.id, id)])))
-      const paletteTheme = id => {
-        const text = readFileSync(resolve(extensions[id], 'extension.toml'), 'utf8')
-        return /^theme\s*=\s*"([^"]+)"/m.exec(text)?.[1] ?? 'neue'
-      }
-      const { checkLooks, renderPreviews } = await import('../build/themeCheck.js')
-      const looks = index.packs.flatMap(pack => [...pack.themes.map(theme => ({ id: theme, theme })), ...pack.palettes.map(palette => ({ id: palette, theme: paletteTheme(palette), palette }))])
+      if (!repoDir || !out) { err('Name the repository folder and the output folder.'); return tip('Usage: mdeck themes build <repository folder> -o <output folder> [--check]') }
+      const { catalogue, dirs } = buildRepository(resolve(repoDir), resolve(out))
+      // The repository's own themes and palettes go beside the sample deck;
+      // the built-in ones are in it already.
+      const repo = [...catalogue.themes.map(e => ({ ...e, kind: 'theme' })), ...catalogue.palettes.map(e => ({ ...e, kind: 'palette' }))].filter(entry => !entry.builtIn)
+      const extensions = Object.fromEntries(repo.map(entry => [keyOf(entry.kind, entry.id), dirs[keyOf(entry.kind, entry.id)]]))
+      const { checkLooks, renderPreviews, buildSampleDeck } = await import('../build/themeCheck.js')
+      const looks = [...catalogue.themes, ...catalogue.palettes.map(p => ({ ...p, isPalette: true }))].map(entry => entry.isPalette
+        ? { key: `palettes/${entry.id}`, theme: entry.theme ?? 'neue', palette: entry.id }
+        : { key: `themes/${entry.id}`, theme: entry.id })
       if (flag('--check')) {
         const failures = await checkLooks(looks, { extensions })
         if (failures.length) { err(`The theme check found ${failures.length} problem(s):`); for (const line of failures) console.error(`    ${line}`); process.exitCode = 1; return }
-        ok(`Checked ${looks.map(look => look.id).join(', ')}, light and dark, on every kind of slide`)
+        ok(`Checked ${catalogue.themes.length} themes and ${catalogue.palettes.length} palettes, light and dark, on every kind of slide`)
       }
       // Themes on the title slide, palettes on the chapter slide (the third).
-      await renderPreviews(looks.map(look => ({ file: resolve(out, 'previews', `${look.id}.webp`), theme: look.theme, palette: look.palette ?? '', slide: look.palette ? 3 : 1 })), { extensions })
-      for (const pack of index.packs) pack.previews = Object.fromEntries([...pack.themes, ...pack.palettes].map(id => [id, `previews/${id}.webp`]))
-      writeFileSync(resolve(out, 'index.json'), JSON.stringify(index, null, 2) + '\n')
-      return ok(`Built ${index.packs.length} pack(s) into ${resolve(out)}`)
+      await renderPreviews(looks.map(look => ({ file: resolve(out, 'previews', `${look.key}.webp`), theme: look.theme, palette: look.palette ?? '', slide: look.palette ? 3 : 1 })), { extensions })
+      for (const entry of catalogue.themes) entry.preview = `previews/themes/${entry.id}.webp`
+      for (const entry of catalogue.palettes) entry.preview = `previews/palettes/${entry.id}.webp`
+      writeFileSync(resolve(out, 'catalogue.json'), JSON.stringify(catalogue, null, 2) + '\n')
+      // For the repository's theme browser: the sample deck with every theme
+      // and palette, and what each theme offers.
+      const registry = buildSampleDeck({ extensions, outDir: resolve(out, 'preview') })
+      writeFileSync(resolve(out, 'looks.json'), JSON.stringify(looksOf(registry, catalogue), null, 2) + '\n')
+      return ok(`Built ${catalogue.themes.length} themes and ${catalogue.palettes.length} palettes into ${resolve(out)}`)
     }
 
-    err(`Unknown: mdeck themes ${sub}`)
-    tip(`Use: mdeck themes ${USAGE}`)
+    err(`Unknown: mdeck ${kinds} ${sub}`)
+    tip(`Use: mdeck ${kinds} ${usage(kind)}`)
     process.exitCode = 1
   } catch (error) {
-    if (!(error instanceof PackError || error instanceof ManifestError)) throw error
+    if (!(error instanceof PackageError || error instanceof ManifestError)) throw error
     err(error.message)
     process.exitCode = 1
   }
 }
-

package/src/core/validateDeck.js

@@ -3,6 +3,7 @@ import { isPlainObject, RENAMED_DECK_KEYS } from './parseSlides.js'
 import { palettesFor } from '../extensions/tokens.js'
 import { LABEL_KEYS, CALLOUT_TYPES } from './labels.js'
 import { resolveLayoutProps, propertyErrors } from '../layouts/layoutProps.js'
+import { movedHint } from '../extensions/moved.js'
 
 // `layouts`, `themes` and `palettes` are manifest maps from the extension
 // registry (see src/extensions/discover.js). Checks for a kind are skipped when
@@ -49,11 +50,12 @@ export function validateDeck(deck, { layouts = null, themes = null, palettes = n
       if (config.show[key] != null && !values.includes(config.show[key])) add('invalid-config', `show.${key} must be one of: ${values.join(', ')}`, deck.configSource?.start)
     }
   }
-  if (themes && config.theme != null && !Object.hasOwn(themes, config.theme)) add('unknown-theme', `Unknown theme "${config.theme}"; available: ${Object.keys(themes).join(', ')}`, deck.configSource?.start)
+  if (themes && config.theme != null && !Object.hasOwn(themes, config.theme)) add('unknown-theme', movedHint('theme', config.theme) ?? `Unknown theme "${config.theme}"; available: ${Object.keys(themes).join(', ') || 'none'}. mdeck themes search lists more to install`, deck.configSource?.start)
+  if (themes && config.theme == null && !Object.hasOwn(themes, 'neue')) add('unknown-theme', `This deck sets no theme, so it uses neue, which is not installed: run mdeck themes install neue, or set a theme${Object.keys(themes).length ? ` (${Object.keys(themes).join(', ')})` : ''}`, deck.configSource?.start ?? 0)
   if (palettes && themes && config.palette != null) {
     const theme = themes[config.theme ?? 'neue']
     const offered = theme ? palettesFor(theme, palettes).map(palette => palette.id) : Object.keys(palettes)
-    if (!Object.hasOwn(palettes, config.palette)) add('unknown-palette', `Unknown palette "${config.palette}"; available: ${offered.join(', ')}`, deck.configSource?.start)
+    if (!Object.hasOwn(palettes, config.palette)) add('unknown-palette', movedHint('palette', config.palette) ?? `Unknown palette "${config.palette}"; available: ${offered.join(', ')}`, deck.configSource?.start)
     else if (theme && !offered.includes(config.palette)) add('unknown-palette', `The theme "${theme.id}" does not offer the palette "${config.palette}"; available: ${offered.join(', ')}`, deck.configSource?.start)
   }
   if (themes && config.params != null && isPlainObject(config.params) && Object.hasOwn(themes, config.theme ?? 'neue')) {

package/src/editor/api.js

@@ -52,16 +52,25 @@ export async function deleteExtension(kind, id) {
   return response.json()
 }
 
-// The theme repository: its packs, with those installed beside the deck.
-export async function loadThemeIndex() {
-  const response = await fetch('/__mdeck/themes/index', { headers: { Accept: 'application/json' } })
+// Every theme and palette mdeck and the theme repository offer, each marked
+// whether it is available to every deck already.
+export async function loadCatalogue() {
+  const response = await fetch('/__mdeck/themes/catalogue', { headers: { Accept: 'application/json' } })
   if (!response.ok) throw await failure(response)
   return response.json()
 }
 
-// Installs a pack into the deck's extensions folder. Returns the new registry.
-export async function installThemePack(id) {
-  const response = await fetch('/__mdeck/themes/install', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ id }) })
+// Installs a theme (with its default palette) or a palette for every deck.
+// Returns the steps and the new registry.
+export async function installPackage(kind, id) {
+  const response = await fetch('/__mdeck/themes/install', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ kind, id }) })
+  if (!response.ok) throw await failure(response)
+  return response.json()
+}
+
+// Removes a theme or palette for every deck (a built-in one is hidden).
+export async function removePackage(kind, id) {
+  const response = await fetch('/__mdeck/themes/remove', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ kind, id }) })
   if (!response.ok) throw await failure(response)
   return response.json()
 }

package/src/editor/components/App.jsx

@@ -10,7 +10,7 @@ import { DeckSettings } from './DeckSettings.jsx'
 import { LayoutPicker } from './LayoutPicker.jsx'
 import { ConflictBanner } from './ConflictBanner.jsx'
 import { Resizer, readInspectorWidth, storeInspectorWidth } from './Resizer.jsx'
-import { DESIGN_URL, DESIGN_TAB } from '../designLink.js'
+import { designUrl, DESIGN_TAB, launchPageUrl } from '../designLink.js'
 import markUrl from '../../../assets/logo/mark.svg'
 
 const STATUS = { saved: 'Saved', unsaved: 'Unsaved changes', saving: 'Saving…', conflict: 'Conflict', error: 'Could not save' }
@@ -20,6 +20,7 @@ export function App() {
   const [picker, setPicker] = useState(false)
   const [inspectorWidth, setInspectorWidth] = useState(readInspectorWidth)
   const resize = width => { setInspectorWidth(width); storeInspectorWidth(width) }
+  const [home] = useState(launchPageUrl)
 
   const select = index => dispatch({ type: 'select', index })
   const actions = {
@@ -50,7 +51,8 @@ export function App() {
       <span class="spacer" />
       <button class="btn is-small" onClick={actions.undo} disabled={!state.history.past.length} title="Undo (⌘Z)">Undo</button>
       <button class="btn is-small" onClick={actions.redo} disabled={!state.history.future.length} title="Redo (⇧⌘Z)">Redo</button>
-      <a class="btn is-small" href={DESIGN_URL} target={DESIGN_TAB} title="Make and change themes, palettes and layouts, on a sample deck">Design themes</a>
+      {home && <a class="btn is-small" href={home}>Launch page</a>}
+      <a class="btn is-small" href={designUrl()} target={DESIGN_TAB} title="Make and change themes, palettes and layouts, on a sample deck">Design themes</a>
       <a class="btn is-small" href="/?view=presenter" target="_blank" rel="noopener">Present</a>
       <a class="btn is-small" href="/" target="_blank" rel="noopener">Open deck</a>
     </header>