quicklook-kit 0.1.1 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quicklook-kit",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Build macOS QuickLook previews with any Vite-based web framework",
   "license": "MIT",
   "keywords": [

package/readme.markdown

@@ -58,6 +58,7 @@ The config can also be `quicklook.config.js`, `.json`, `.yaml` or `.toml`, or a
 | `bundleId`     | required     | The extension gets `<bundleId>.Extension`                                          |
 | `types`        | required     | File types to preview                                                              |
 | `framework`    | required     | `'sveltekit'`, `'astro'`, `'solid-start'`, `'nuxt'`, `'analog'`, or an integration |
+| `icon`         | none         | Path to an `.icns` file for the app                                                |
 | `macOS`        | `'14.0'`     | Minimum macOS version                                                              |
 | `integrations` | `[]`         | See [Integrations](#integrations)                                                  |
 | `csp`          | locked down  | Directives here replace the defaults of the same name                              |

package/src/cli.ts

@@ -4,7 +4,7 @@
 import { createHash } from 'node:crypto';
 import { existsSync } from 'node:fs';
 import { cp, rm } from 'node:fs/promises';
-import { resolve } from 'node:path';
+import { basename, resolve } from 'node:path';
 import process from 'node:process';
 import { fileURLToPath } from 'node:url';
 import { $, Glob } from 'bun';
@@ -13,11 +13,11 @@ import {
 	type DeclaredType,
 	loadConfig,
 	serializeCsp,
-	type XcodeSpec
+	type XcodeSpec,
 } from './config.ts';
 
 const config = await loadConfig();
-const { root, name, bundleId, macOS, types, framework } = config;
+const { root, name, bundleId, macOS, types, framework, icon } = config;
 const target = name.replace(/[^A-Za-z0-9]/g, '');
 // Everything generated lives here, away from the framework's own output.
 const work = `${root}/.quicklook`;
@@ -35,7 +35,7 @@ const inlineScript = /<script\b(?![^>]*\ssrc=)[^>]*>([\s\S]*?)<\/script>/gi;
 async function run(command: string[]) {
 	const child = Bun.spawn(['bun', 'run', ...command], {
 		cwd: root,
-		stdio: ['inherit', 'inherit', 'inherit']
+		stdio: ['inherit', 'inherit', 'inherit'],
 	});
 	const code = await child.exited;
 	if (code !== 0) {
@@ -81,20 +81,24 @@ async function build() {
 				CURRENT_PROJECT_VERSION: '1',
 				// Ad-hoc signing: enough for QuickLook to load it, no Apple Developer account needed.
 				CODE_SIGN_STYLE: 'Manual',
-				CODE_SIGN_IDENTITY: '-'
-			}
+				CODE_SIGN_IDENTITY: '-',
+			},
 		},
 		targets: {
 			[target]: {
 				type: 'application',
 				platform: 'macOS',
-				sources: [`${native}/App`],
+				sources: [
+					`${native}/App`,
+					...(icon ? [{ path: resolve(root, icon), buildPhase: 'resources' }] : []),
+				],
 				settings: { PRODUCT_NAME: name, PRODUCT_BUNDLE_IDENTIFIER: bundleId },
 				dependencies: [{ target: `${target}Extension`, embed: true, codeSign: true }],
 				info: {
 					path: `${work}/App/Info.plist`,
 					properties: {
 						CFBundleName: name,
+						...(icon && { CFBundleIconFile: basename(icon, '.icns') }),
 						LSMinimumSystemVersion: macOS,
 						UTExportedTypeDeclarations: types
 							.filter((type): type is DeclaredType => typeof type !== 'string')
@@ -102,10 +106,10 @@ async function build() {
 								UTTypeIdentifier: type.id,
 								UTTypeDescription: type.description,
 								UTTypeConformsTo: type.conformsTo,
-								UTTypeTagSpecification: { 'public.filename-extension': type.extensions }
-							}))
-					}
-				}
+								UTTypeTagSpecification: { 'public.filename-extension': type.extensions },
+							})),
+					},
+				},
 			},
 			[`${target}Extension`]: {
 				type: 'app-extension',
@@ -121,8 +125,8 @@ async function build() {
 						'com.apple.security.files.user-selected.read-only': true,
 						// WKWebView's content process won't launch in a sandbox without this,
 						// even for a page that loads nothing. The page's CSP blocks all requests.
-						'com.apple.security.network.client': true
-					}
+						'com.apple.security.network.client': true,
+					},
 				},
 				info: {
 					path: `${work}/Extension/Info.plist`,
@@ -136,15 +140,15 @@ async function build() {
 							NSExtensionPrincipalClass: 'PreviewViewController',
 							NSExtensionAttributes: {
 								QLSupportedContentTypes: types.map((type) =>
-									typeof type === 'string' ? type : type.id
+									typeof type === 'string' ? type : type.id,
 								),
-								QLSupportsSearchableItems: false
-							}
-						}
-					}
-				}
-			}
-		}
+								QLSupportsSearchableItems: false,
+							},
+						},
+					},
+				},
+			},
+		},
 	};
 	for (const integration of config.integrations) {
 		await integration.hooks?.['xcode:spec']?.(spec, config);

package/src/config.ts

@@ -52,6 +52,8 @@ export interface QuickLookConfig {
 	/** App name, shown in Finder and System Settings. */
 	name: string;
 	bundleId: string;
+	/** Path to the app's .icns icon, relative to the project root. */
+	icon?: string;
 	/** Minimum macOS version. Defaults to 14.0. */
 	macOS?: string;
 	types: FileType[];
@@ -70,7 +72,8 @@ export interface QuickLookConfig {
 export type PageConfig = Pick<ResolvedConfig, 'name' | 'bundleId' | 'types' | 'public'>;
 
 export interface ResolvedConfig
-	extends Required<Omit<QuickLookConfig, 'framework' | 'integrations'>> {
+	extends Required<Omit<QuickLookConfig, 'framework' | 'integrations' | 'icon'>>,
+		Pick<QuickLookConfig, 'icon'> {
 	root: string;
 	framework: Integration & { build: NonNullable<Integration['build']> };
 	/** The framework first, then the configured integrations, in order. */
@@ -84,7 +87,7 @@ export const defaultCsp: Csp = {
 	'style-src': ["'self'", "'unsafe-inline'"],
 	'img-src': ["'self'", 'data:', 'blob:'],
 	'font-src': ["'self'", 'data:'],
-	'media-src': ["'self'", 'data:', 'blob:']
+	'media-src': ["'self'", 'data:', 'blob:'],
 };
 
 export const defineConfig = (config: QuickLookConfig) => config;
@@ -97,7 +100,7 @@ export const serializeCsp = (csp: Csp) =>
 /** `csp` with `sources` appended to `directive`. */
 export const addSources = (csp: Csp, directive: string, ...sources: string[]): Csp => ({
 	...csp,
-	[directive]: [...(csp[directive] ?? []), ...sources]
+	[directive]: [...(csp[directive] ?? []), ...sources],
 });
 
 /**
@@ -114,7 +117,7 @@ const frameworkBuilds: Record<string, [dev: string[], command: string[], outDir:
 	// `solidStart({ ssr: false })` and Nitro's static preset prerendering `/`.
 	'solid-start': [['vite', 'dev'], ['vite', 'build'], '.output/public'],
 	// @sveltejs/adapter-static, writing `build`.
-	sveltekit: [['vite', 'dev'], ['vite', 'build'], 'build']
+	sveltekit: [['vite', 'dev'], ['vite', 'build'], 'build'],
 };
 
 function builtinFramework(name: string, options?: unknown): Integration | undefined {
@@ -125,7 +128,7 @@ function builtinFramework(name: string, options?: unknown): Integration | undefi
 	const [dev, command, outDir] = builtin;
 	return {
 		name,
-		build: { dev, command, outDir: (options as { outDir?: string } | undefined)?.outDir ?? outDir }
+		build: { dev, command, outDir: (options as { outDir?: string } | undefined)?.outDir ?? outDir },
 	};
 }
 
@@ -167,7 +170,7 @@ export async function loadConfig(root = process.cwd()): Promise<ResolvedConfig>
 		csp: { ...defaultCsp, ...config.csp },
 		root,
 		framework: { ...framework, build: framework.build },
-		integrations
+		integrations,
 	};
 	for (const integration of integrations) {
 		await integration.hooks?.['config:resolved']?.(resolved);

package/src/runtime.ts

@@ -22,7 +22,7 @@ export function nativeFile(): QuickLookFile | undefined {
 	return {
 		name: injected.name,
 		extension: injected.extension,
-		bytes: Uint8Array.from(atob(injected.base64), (c) => c.charCodeAt(0))
+		bytes: Uint8Array.from(atob(injected.base64), (c) => c.charCodeAt(0)),
 	};
 }
 
@@ -31,6 +31,6 @@ export async function browserFile(file: File): Promise<QuickLookFile> {
 	return {
 		name: file.name,
 		extension: file.name.includes('.') ? (file.name.split('.').pop() ?? '').toLowerCase() : '',
-		bytes: new Uint8Array(await file.arrayBuffer())
+		bytes: new Uint8Array(await file.arrayBuffer()),
 	};
 }

package/src/vite.ts

@@ -20,8 +20,8 @@ export { browserFile, nativeFile } from 'quicklook-kit/runtime';`;
 			addSources(config.csp, 'script-src', "'unsafe-inline'"),
 			'connect-src',
 			"'self'",
-			'ws:'
-		)
+			'ws:',
+		),
 	);
 
 	return [
@@ -34,8 +34,8 @@ export { browserFile, nativeFile } from 'quicklook-kit/runtime';`;
 					response.setHeader('Content-Security-Policy-Report-Only', devCsp);
 					next();
 				});
-			}
+			},
 		},
-		...config.integrations.flatMap((integration) => integration.hooks?.vite?.() ?? [])
+		...config.integrations.flatMap((integration) => integration.hooks?.vite?.() ?? []),
 	];
 }