create-quicklook 0.1.0 → 0.2.1

package/README.markdown

@@ -1,5 +1,9 @@
 # create-quicklook
 
+![License](https://img.shields.io/npm/l/quicklook-kit?style=for-the-badge)
+[![Version](https://img.shields.io/npm/v/quicklook-kit?style=for-the-badge)](https://www.npmjs.org/package/quicklook-kit)
+[![Build](https://img.shields.io/github/actions/workflow/status/idleberg/quicklook-kit/ci.yml?style=for-the-badge)](https://github.com/idleberg/quicklook-kit/actions)
+
 > Create a macOS QuickLook preview with any Vite-based web framework
 
 ```sh

package/dist/index.mjs

@@ -1,4 +1,5 @@
 #!/usr/bin/env node
+import { execFileSync } from "node:child_process";
 import { existsSync } from "node:fs";
 import { cp, readFile, readdir, writeFile } from "node:fs/promises";
 import { basename, relative, resolve } from "node:path";
@@ -47,7 +48,9 @@ const release = values.release ?? answer(await confirm({
 	initialValue: false
 }));
 await cp(`${pkgRoot}/templates/${template}`, dir, { recursive: true });
-await cp(`${pkgRoot}/files/mise.toml`, `${dir}/mise.toml`);
+for (const file of ["mise.toml", "hk.pkl"]) await cp(`${pkgRoot}/files/${file}`, `${dir}/${file}`);
+await cp(`${pkgRoot}/files/biome.template.jsonc`, `${dir}/biome.jsonc`);
+await cp(`${pkgRoot}/files/ci.yml`, `${dir}/.github/workflows/ci.yml`);
 await cp(`${pkgRoot}/files/gitignore`, `${dir}/.gitignore`);
 if (release) await cp(`${pkgRoot}/files/release.yml`, `${dir}/.github/workflows/release.yml`);
 const pkg = JSON.parse(await readFile(`${dir}/package.json`, "utf8"));
@@ -55,6 +58,19 @@ pkg.name = basename(dir);
 const pnpm = process.env.npm_config_user_agent?.match(/^pnpm\/(\S+)/)?.[1];
 if (pnpm) pkg.packageManager = `pnpm@${pnpm}`;
 await writeFile(`${dir}/package.json`, `${JSON.stringify(pkg, null, "	")}\n`);
+function git(...args) {
+	execFileSync("git", args, {
+		cwd: dir,
+		stdio: "ignore"
+	});
+}
+try {
+	git("rev-parse", "--is-inside-work-tree");
+} catch {
+	try {
+		git("init", "--quiet");
+	} catch {}
+}
 note([
 	`cd ${relative(process.cwd(), dir)}`,
 	"mise install    # or: pnpm install, with Xcode and XcodeGen installed",

package/files/biome.template.jsonc

@@ -0,0 +1,28 @@
+{
+	"$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
+	"vcs": {
+		"enabled": true,
+		"clientKind": "git",
+		"useIgnoreFile": true
+	},
+	"formatter": {
+		"indentStyle": "tab",
+		"lineWidth": 100
+	},
+	"javascript": {
+		"formatter": {
+			"quoteStyle": "single",
+			"trailingCommas": "all"
+		}
+	},
+	"html": {
+		"experimentalFullSupportEnabled": true
+	},
+	"assist": {
+		"actions": {
+			"source": {
+				"organizeImports": "on"
+			}
+		}
+	}
+}

package/files/ci.yml

@@ -0,0 +1,27 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+jobs:
+  check:
+    # Same runner as the release workflow, XcodeGen from mise.toml needs macOS.
+    runs-on: macos-15
+    steps:
+      - uses: actions/checkout@v4
+
+      # pnpm's default store on macOS.
+      - uses: actions/cache@v6
+        with:
+          path: ~/Library/pnpm/store
+          key: pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: pnpm-
+
+      - uses: jdx/mise-action@v2
+
+      - run: pnpm run lint
+
+      - run: pnpm run check

package/files/hk.pkl

@@ -0,0 +1,27 @@
+amends "package://github.com/jdx/hk/releases/download/v2.5.0/hk@2.5.0#/Config.pkl"
+import "package://github.com/jdx/hk/releases/download/v2.5.0/hk@2.5.0#/Builtins.pkl"
+
+local linters = new Mapping<String, Step> {
+    // pnpm exec runs the project's own Biome, whatever else is on PATH.
+    ["biome"] = (Builtins.biome) {
+        // The builtin only matches JS, TS and JSON.
+        glob = List("**/*.{js,jsx,ts,tsx,json,jsonc,css,html,svelte,astro,vue}")
+        check = "pnpm exec biome check --no-errors-on-unmatched --files-ignore-unknown=true {{ files }}"
+        fix = "pnpm exec biome check --write --no-errors-on-unmatched --files-ignore-unknown=true {{ files }}"
+    }
+}
+
+hooks {
+    ["pre-commit"] {
+        fix = true
+        stash = "git"
+        steps = linters
+    }
+    ["fix"] {
+        fix = true
+        steps = linters
+    }
+    ["check"] {
+        steps = linters
+    }
+}

package/files/mise.toml

@@ -1,13 +1,21 @@
 [tools]
 node = "24"
 xcodegen = "latest"
+hk = "latest"
+pkl = "latest"
 
 [settings]
 # Node ships pnpm through corepack, pinned by packageManager in package.json
 node.corepack = true
 
 [env]
+HK_MISE = 1
 COREPACK_ENABLE_DOWNLOAD_PROMPT = 0
+_.path = ["{{config_root}}/node_modules/.bin"]
 
+# The pre-commit hook needs a git repository; run `hk install --mise` after `git init`.
 [hooks]
-postinstall = "pnpm install"
+postinstall = """
+  pnpm install
+  if git rev-parse --git-dir >/dev/null 2>&1; then hk install --mise; fi
+"""

package/files/release.yml

@@ -18,6 +18,12 @@ jobs:
     steps:
       - uses: actions/checkout@v4
 
+      - uses: actions/cache@v6
+        with:
+          path: ~/Library/pnpm/store
+          key: pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: pnpm-
+
       - uses: jdx/mise-action@v2
 
       # Release builds are universal (arm64 + x86_64) by default.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-quicklook",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Create a macOS QuickLook preview with any Vite-based web framework",
   "license": "MIT",
   "keywords": [
@@ -35,7 +35,7 @@
   },
   "devDependencies": {
     "@types/node": "24.19.2",
-    "tsdown": "0.23.0",
+    "tsdown": "0.23.1",
     "typescript": "6.0.3"
   },
   "dependencies": {

package/templates/analog/package.json

@@ -7,20 +7,23 @@
 		"build": "quicklook build",
 		"register": "quicklook build && quicklook register",
 		"unregister": "quicklook unregister",
-		"check": "ngc -p tsconfig.json --noEmit"
+		"check": "ngc -p tsconfig.json --noEmit",
+		"lint": "biome check",
+		"format": "biome check --write"
 	},
 	"devDependencies": {
-		"@analogjs/vite-plugin-angular": "2.7.5",
-		"@angular/build": "22.2.0",
-		"@angular/common": "22.2.0",
-		"@angular/compiler": "22.2.0",
-		"@angular/compiler-cli": "22.2.0",
-		"@angular/core": "22.2.0",
-		"@angular/platform-browser": "22.2.0",
-		"quicklook-kit": "^0.3.0",
+		"@analogjs/vite-plugin-angular": "2.8.0",
+		"@angular/build": "22.2.2",
+		"@angular/common": "22.2.2",
+		"@angular/compiler": "22.2.2",
+		"@angular/compiler-cli": "22.2.2",
+		"@angular/core": "22.2.2",
+		"@angular/platform-browser": "22.2.2",
+		"@biomejs/biome": "2.5.15",
+		"quicklook-kit": "^0.4.0",
 		"rxjs": "7.8.2",
 		"tslib": "2.8.1",
 		"typescript": "6.0.3",
-		"vite": "8.3.0"
+		"vite": "8.3.4"
 	}
 }

package/templates/analog/quicklook.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'quicklook-kit';
 
 export default defineConfig({
-	name: 'Example Preview',
-	bundleId: 'com.example.ExamplePreview',
+	name: 'QuickLook Example',
+	bundleId: 'com.example.QuickLookExample',
 	types: [
 		{
-			id: 'com.example.ExamplePreview.example',
+			id: 'com.example.QuickLookExample.example',
 			description: 'Example File',
 			extensions: ['example'],
 			conformsTo: ['public.plain-text'],

package/templates/astro/package.json

@@ -7,12 +7,15 @@
 		"build": "quicklook build",
 		"register": "quicklook build && quicklook register",
 		"unregister": "quicklook unregister",
-		"check": "astro check"
+		"check": "astro check",
+		"lint": "biome check",
+		"format": "biome check --write"
 	},
 	"devDependencies": {
 		"@astrojs/check": "0.9.10",
-		"astro": "7.3.5",
-		"quicklook-kit": "^0.3.0",
+		"@biomejs/biome": "2.5.15",
+		"astro": "7.3.8",
+		"quicklook-kit": "^0.4.0",
 		"typescript": "6.0.3"
 	}
 }

package/templates/astro/quicklook.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'quicklook-kit';
 
 export default defineConfig({
-	name: 'Example Preview',
-	bundleId: 'com.example.ExamplePreview',
+	name: 'QuickLook Example',
+	bundleId: 'com.example.QuickLookExample',
 	types: [
 		{
-			id: 'com.example.ExamplePreview.example',
+			id: 'com.example.QuickLookExample.example',
 			description: 'Example File',
 			extensions: ['example'],
 			conformsTo: ['public.plain-text'],

package/templates/nuxt/package.json

@@ -8,13 +8,16 @@
 		"build": "quicklook build",
 		"register": "quicklook build && quicklook register",
 		"unregister": "quicklook unregister",
-		"check": "nuxt typecheck"
+		"check": "nuxt typecheck",
+		"lint": "biome check",
+		"format": "biome check --write"
 	},
 	"devDependencies": {
-		"nuxt": "4.5.2",
-		"quicklook-kit": "^0.3.0",
+		"@biomejs/biome": "2.5.15",
+		"nuxt": "4.6.1",
+		"quicklook-kit": "^0.4.0",
 		"typescript": "6.0.3",
 		"vue": "3.5.43",
-		"vue-tsc": "3.3.11"
+		"vue-tsc": "3.3.13"
 	}
 }

package/templates/nuxt/quicklook.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'quicklook-kit';
 
 export default defineConfig({
-	name: 'Example Preview',
-	bundleId: 'com.example.ExamplePreview',
+	name: 'QuickLook Example',
+	bundleId: 'com.example.QuickLookExample',
 	types: [
 		{
-			id: 'com.example.ExamplePreview.example',
+			id: 'com.example.QuickLookExample.example',
 			description: 'Example File',
 			extensions: ['example'],
 			conformsTo: ['public.plain-text'],

package/templates/solid-start/package.json

@@ -7,15 +7,18 @@
 		"build": "quicklook build",
 		"register": "quicklook build && quicklook register",
 		"unregister": "quicklook unregister",
-		"check": "tsc --noEmit"
+		"check": "tsc --noEmit",
+		"lint": "biome check",
+		"format": "biome check --write"
 	},
 	"devDependencies": {
+		"@biomejs/biome": "2.5.15",
 		"@solidjs/router": "1.0.0",
 		"@solidjs/start": "2.0.6",
 		"nitro": "3.0.260903-beta",
-		"quicklook-kit": "^0.3.0",
+		"quicklook-kit": "^0.4.0",
 		"solid-js": "1.9.17",
 		"typescript": "6.0.3",
-		"vite": "8.3.0"
+		"vite": "8.3.4"
 	}
 }

package/templates/solid-start/quicklook.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'quicklook-kit';
 
 export default defineConfig({
-	name: 'Example Preview',
-	bundleId: 'com.example.ExamplePreview',
+	name: 'QuickLook Example',
+	bundleId: 'com.example.QuickLookExample',
 	types: [
 		{
-			id: 'com.example.ExamplePreview.example',
+			id: 'com.example.QuickLookExample.example',
 			description: 'Example File',
 			extensions: ['example'],
 			conformsTo: ['public.plain-text'],

package/templates/solid-start/src/entry-server.tsx

@@ -13,7 +13,6 @@ export default createHandler(() => (
 					{assets}
 				</head>
 				<body>
-					{/* biome-ignore lint/correctness/useUniqueElementIds: the document renders once; entry-client.tsx mounts into #app. */}
 					<div id="app">{children}</div>
 					{scripts}
 				</body>

package/templates/sveltekit/package.json

@@ -7,16 +7,19 @@
 		"build": "quicklook build",
 		"register": "quicklook build && quicklook register",
 		"unregister": "quicklook unregister",
-		"check": "svelte-kit sync && svelte-check"
+		"check": "svelte-kit sync && svelte-check",
+		"lint": "biome check",
+		"format": "biome check --write"
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-static": "3.0.10",
-		"@sveltejs/kit": "2.70.3",
+		"@biomejs/biome": "2.5.15",
+		"@sveltejs/adapter-static": "4.0.0",
+		"@sveltejs/kit": "3.0.1",
 		"@sveltejs/vite-plugin-svelte": "7.3.1",
-		"quicklook-kit": "^0.3.0",
-		"svelte": "5.57.1",
+		"quicklook-kit": "^0.4.0",
+		"svelte": "5.57.2",
 		"svelte-check": "4.7.6",
 		"typescript": "6.0.3",
-		"vite": "8.3.0"
+		"vite": "8.3.4"
 	}
 }

package/templates/sveltekit/quicklook.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'quicklook-kit';
 
 export default defineConfig({
-	name: 'Example Preview',
-	bundleId: 'com.example.ExamplePreview',
+	name: 'QuickLook Example',
+	bundleId: 'com.example.QuickLookExample',
 	types: [
 		{
-			id: 'com.example.ExamplePreview.example',
+			id: 'com.example.QuickLookExample.example',
 			description: 'Example File',
 			extensions: ['example'],
 			conformsTo: ['public.plain-text'],

package/templates/sveltekit/src/routes/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { browserFile, nativeFile, type QuickLookFile } from 'virtual:quicklook';
-	import FileViewer from '$lib/FileViewer.svelte';
+	import FileViewer from '../lib/FileViewer.svelte';
 
 	let file = $state<QuickLookFile | undefined>(nativeFile());
 

package/templates/sveltekit/tsconfig.json

@@ -1,5 +1,6 @@
 {
-	"extends": "./.svelte-kit/tsconfig.json",
+	"extends": "$app/tsconfig",
+	"include": ["src", "*"],
 	"compilerOptions": {
 		"strict": true,
 		"allowImportingTsExtensions": true,

package/templates/sveltekit/vite.config.ts

@@ -1,7 +1,17 @@
+import adapter from '@sveltejs/adapter-static';
 import { sveltekit } from '@sveltejs/kit/vite';
 import { quicklook } from 'quicklook-kit/vite';
 import { defineConfig } from 'vite';
 
 export default defineConfig({
-	plugins: [sveltekit(), quicklook()],
+	plugins: [
+		sveltekit({
+			// A static build; the extension serves it and sets the CSP from quicklook.config.ts.
+			adapter: adapter(),
+
+			// Builds a client-only app shell, which is all the preview needs.
+			router: { type: 'hash' },
+		}),
+		quicklook(),
+	],
 });

package/templates/sveltekit/svelte.config.js

@@ -1,11 +0,0 @@
-import adapter from '@sveltejs/adapter-static';
-
-/** @type {import('@sveltejs/kit').Config} */
-export default {
-	kit: {
-		// A static build; the extension serves it and sets the CSP from quicklook.config.ts.
-		adapter: adapter(),
-		// Builds a client-only app shell, which is all the preview needs.
-		router: { type: 'hash' },
-	},
-};