@prismicio/adapter-sveltekit 0.0.1

package/src/hooks/project-init.ts

@@ -0,0 +1,315 @@
+import * as path from "node:path";
+
+import type {
+	ProjectInitHook,
+	ProjectInitHookData,
+	PluginSystemContext,
+} from "@prismicio/plugin-kit";
+import {
+	checkHasProjectFile,
+	writeProjectFile,
+} from "@prismicio/plugin-kit/fs";
+import { source } from "common-tags";
+import { loadFile } from "magicast";
+
+import { checkIsTypeScriptProject } from "../lib/checkIsTypeScriptProject";
+import { getJSFileExtension } from "../lib/getJSFileExtension";
+import { getSvelteMajor } from "../lib/getSvelteMajor";
+import { rejectIfNecessary } from "../lib/rejectIfNecessary";
+import { upsertSliceLibraryIndexFile } from "../lib/upsertSliceLibraryIndexFile";
+import type { PluginOptions } from "../types";
+
+import {
+	previewAPIRouteTemplate,
+	prismicIOFileTemplate,
+	rootLayoutTemplate,
+} from "./project-init.templates";
+
+type InstallDependenciesArgs = {
+	installDependencies: ProjectInitHookData["installDependencies"];
+};
+
+const installDependencies = async ({
+	installDependencies,
+}: InstallDependenciesArgs) => {
+	await installDependencies({
+		dependencies: {
+			"@prismicio/client": "latest",
+			"@prismicio/svelte": "latest",
+		},
+	});
+};
+
+type CreatePrismicIOFileArgs = PluginSystemContext<PluginOptions>;
+
+const createPrismicIOFile = async ({
+	helpers,
+	options,
+}: CreatePrismicIOFileArgs) => {
+	const extension = await getJSFileExtension({ helpers, options });
+	const filename = path.join(`src/lib/prismicio.${extension}`);
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const typescript = await checkIsTypeScriptProject({ helpers, options });
+	const contents = prismicIOFileTemplate({ typescript });
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+const createPreviewRouteMatcherFile = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	const extension = await getJSFileExtension({ helpers, options });
+	const filename = path.join(`src/params/preview.${extension}`);
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const contents = source`
+		export function match(param) {
+			return param === 'preview';
+		}
+	`;
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+const createPreviewAPIRoute = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	const extension = await getJSFileExtension({ helpers, options });
+	const filename = path.join(
+		"src",
+		"routes",
+		"api",
+		"preview",
+		`+server.${extension}`,
+	);
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const typescript = await checkIsTypeScriptProject({ helpers, options });
+	const contents = previewAPIRouteTemplate({ typescript });
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+const createPreviewRouteDirectory = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	const filename = path.join(
+		"src",
+		"routes",
+		"[[preview=preview]]",
+		"README.md",
+	);
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const contents = source`
+		This directory adds support for optional \`/preview\` routes. Do not remove this directory.
+
+		All routes within this directory will be served using the following URLs:
+
+		- \`/example-route\` (prerendered)
+		- \`/preview/example-route\` (server-rendered)
+
+		See <https://prismic.io/docs/svelte-preview> for more information.
+	`;
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+const createRootLayoutServerFile = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	const extension = await getJSFileExtension({ helpers, options });
+	const filename = path.join(`src/routes/+layout.server.${extension}`);
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const contents = source`
+		export const prerender = "auto";
+	`;
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+const createRootLayoutFile = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	const filename = path.join("src", "routes", "+layout.svelte");
+
+	if (await checkHasProjectFile({ filename, helpers })) {
+		return;
+	}
+
+	const contents = rootLayoutTemplate({ version: await getSvelteMajor() });
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		formatOptions: {
+			prettier: {
+				plugins: ["prettier-plugin-svelte"],
+				parser: "svelte",
+			},
+		},
+		helpers,
+	});
+};
+
+const modifyPrismicConfig = async ({
+	helpers,
+	options,
+	actions,
+}: PluginSystemContext<PluginOptions>) => {
+	const project = await helpers.getProject();
+
+	// Nest the default Slice Library in the src directory if it exists and
+	// is empty.
+	if (
+		(await checkHasProjectFile({
+			filename: "./src/lib",
+			helpers,
+		})) &&
+		project.config.libraries &&
+		JSON.stringify(project.config.libraries) === JSON.stringify(["./slices"])
+	) {
+		const sliceLibrary = await actions.readSliceLibrary({
+			libraryID: project.config.libraries[0],
+		});
+
+		if (sliceLibrary.sliceIDs.length < 1) {
+			project.config.libraries = ["./src/lib/slices"];
+		}
+	}
+
+	await helpers.updatePrismicConfig(project.config, {
+		format: options.format,
+	});
+};
+
+const upsertSliceLibraryIndexFiles = async (
+	context: PluginSystemContext<PluginOptions>,
+) => {
+	// We must use the `getProject()` helper to get the latest version of
+	// the project config. The config may have been modified in
+	// `modifyPrismicConfig()` and will not be reflected in
+	// `context.project`.
+	const project = await context.helpers.getProject();
+
+	if (!project.config.libraries) {
+		return;
+	}
+
+	await Promise.all(
+		project.config.libraries.map(async (libraryID) => {
+			await upsertSliceLibraryIndexFile({ libraryID, ...context });
+		}),
+	);
+};
+
+const modifyViteConfig = async ({
+	helpers,
+	options,
+}: PluginSystemContext<PluginOptions>) => {
+	let filename = "vite.config.js";
+	if (!(await checkHasProjectFile({ filename, helpers }))) {
+		filename = "vite.config.ts";
+	}
+	if (!(await checkHasProjectFile({ filename, helpers }))) {
+		// Couldn't find the config file.
+		return;
+	}
+	const filepath = helpers.joinPathFromRoot(filename);
+
+	const mod = await loadFile(filepath);
+	if (mod.exports.default.$type !== "function-call") {
+		// Invalid config file.
+		return;
+	}
+
+	// Add `./prismic.config.json` to allowed files.
+	const config = mod.exports.default.$args[0];
+	config.server ??= {};
+	config.server.fs ??= {};
+	config.server.fs.allow ??= [];
+	if (!config.server.fs.allow.includes("./prismic.config.json")) {
+		config.server.fs.allow.push("./prismic.config.json");
+	}
+
+	// Remove an empty line above the `server` property.
+	const contents = mod.generate().code.replace(/\n\s*\n(?=\s*server:)/, "\n");
+
+	await writeProjectFile({
+		filename,
+		contents,
+		format: options.format,
+		helpers,
+	});
+};
+
+export const projectInit: ProjectInitHook<PluginOptions> = async (
+	{ installDependencies: _installDependencies },
+	context,
+) => {
+	rejectIfNecessary(
+		await Promise.allSettled([
+			installDependencies({ installDependencies: _installDependencies }),
+			modifyPrismicConfig(context),
+			createPrismicIOFile(context),
+			createPreviewAPIRoute(context),
+			createPreviewRouteDirectory(context),
+			createPreviewRouteMatcherFile(context),
+			createRootLayoutServerFile(context),
+			createRootLayoutFile(context),
+			modifyViteConfig(context),
+		]),
+	);
+
+	// This must happen after `modifyPrismicConfig()` since the
+	// location of the default Slice library may change.
+	await upsertSliceLibraryIndexFiles(context);
+};

package/src/hooks/slice-create.templates.ts

@@ -0,0 +1,82 @@
+import TypesInternal from "@prismicio/types-internal/lib/customtypes/index.js";
+import { source as svelte } from "common-tags";
+
+import { pascalCase } from "../lib/pascalCase";
+
+const PLACEHOLDER = `
+Placeholder component for {slice.slice_type} (variation: {slice.variation}) slices.
+<br />
+<strong>You can edit this slice directly in your code editor.</strong>
+<!--
+💡 Use the Prismic MCP server with your code editor
+📚 Docs: https://prismic.io/docs/ai#code-with-prismics-mcp-server
+-->
+`;
+
+export function sliceTemplate(args: {
+	model: TypesInternal.SharedSlice;
+	typescript: boolean;
+	version: number;
+}): string {
+	const { model, typescript, version } = args;
+
+	const pascalName = pascalCase(model.name);
+
+	const v5TS = svelte`
+		<script lang="ts">
+			import type { Content } from '@prismicio/client';
+			import type { SliceComponentProps } from '@prismicio/svelte';
+
+			type Props = SliceComponentProps<Content.${pascalName}Slice>;
+
+			const { slice }: Props = $props();
+		</script>
+
+		<section data-slice-type={slice.slice_type} data-slice-variation={slice.variation}>
+			${PLACEHOLDER}
+		</section>
+	`;
+
+	const v5JS = svelte`
+		<script>
+			/* @typedef {import("@prismicio/client").Content} Content */
+			/* @typedef {import("@prismicio/svelte").SliceComponentProps} SliceComponentProps */
+
+			/* @type {SliceComponentProps<Content.${pascalName}Slice>} */
+			const { slice } = $props();
+		</script>
+
+		<section data-slice-type={slice.slice_type} data-slice-variation={slice.variation}>
+			${PLACEHOLDER}
+		</section>
+	`;
+
+	const v4TS = svelte`
+		<script lang="ts">
+			import type { Content } from '@prismicio/client';
+
+			export let slice: Content.${pascalName}Slice;
+		</script>
+
+		<section data-slice-type={slice.slice_type} data-slice-variation={slice.variation}>
+			${PLACEHOLDER}
+		</section>
+	`;
+
+	const v4JS = svelte`
+		<script>
+			/** @type {import("@prismicio/client").Content.${pascalName}Slice} */
+			export let slice;
+		</script>
+
+		<section data-slice-type={slice.slice_type} data-slice-variation={slice.variation}>
+			${PLACEHOLDER}
+		</section>
+	`;
+
+	if (typescript) {
+		return version <= 4 ? v4TS : v5TS;
+	}
+
+	return version <= 4 ? v4JS : v5JS;
+}

package/src/hooks/slice-create.ts

@@ -0,0 +1,84 @@
+import type {
+	SliceCreateHook,
+	SliceCreateHookData,
+	PluginSystemContext,
+} from "@prismicio/plugin-kit";
+import {
+	upsertGlobalTypeScriptTypes,
+	writeSliceFile,
+	writeSliceModel,
+} from "@prismicio/plugin-kit/fs";
+
+import { checkIsTypeScriptProject } from "../lib/checkIsTypeScriptProject";
+import { getSvelteMajor } from "../lib/getSvelteMajor";
+import { rejectIfNecessary } from "../lib/rejectIfNecessary";
+import { upsertSliceLibraryIndexFile } from "../lib/upsertSliceLibraryIndexFile";
+import type { PluginOptions } from "../types";
+
+import { sliceTemplate } from "./slice-create.templates";
+
+type Args = {
+	data: SliceCreateHookData;
+} & PluginSystemContext<PluginOptions>;
+
+const createComponentFile = async ({
+	data,
+	helpers,
+	actions,
+	options,
+}: Args) => {
+	const { model, componentContents } = data;
+
+	const typescript = await checkIsTypeScriptProject({ helpers, options });
+	const contents =
+		componentContents ??
+		sliceTemplate({ model, typescript, version: await getSvelteMajor() });
+
+	await writeSliceFile({
+		libraryID: data.libraryID,
+		model: data.model,
+		filename: "index.svelte",
+		contents,
+		format: options.format,
+		actions,
+		helpers,
+		formatOptions: {
+			prettier: {
+				plugins: ["prettier-plugin-svelte"],
+				parser: "svelte",
+			},
+		},
+	});
+};
+
+export const sliceCreate: SliceCreateHook<PluginOptions> = async (
+	data,
+	context,
+) => {
+	rejectIfNecessary(
+		await Promise.allSettled([
+			writeSliceModel({
+				libraryID: data.libraryID,
+				model: data.model,
+				format: context.options.format,
+				helpers: context.helpers,
+			}),
+			createComponentFile({ data, ...context }),
+		]),
+	);
+
+	rejectIfNecessary(
+		await Promise.allSettled([
+			upsertSliceLibraryIndexFile({
+				libraryID: data.libraryID,
+				...context,
+			}),
+			upsertGlobalTypeScriptTypes({
+				filename: context.options.generatedTypesFilePath,
+				format: context.options.format,
+				helpers: context.helpers,
+				actions: context.actions,
+			}),
+		]),
+	);
+};

package/src/index.ts

@@ -0,0 +1,3 @@
+export { plugin as default } from "./plugin";
+
+export type { PluginOptions } from "./types";

package/src/lib/checkIsTypeScriptProject.ts

@@ -0,0 +1,18 @@
+import { PluginSystemContext } from "@prismicio/plugin-kit";
+import { checkIsTypeScriptProject as baseCheckIsTypeScriptProject } from "@prismicio/plugin-kit/fs";
+
+import { PluginOptions } from "../types";
+
+type CheckIsTypeScriptProjectArgs = {
+	helpers: PluginSystemContext<PluginOptions>["helpers"];
+	options: PluginSystemContext<PluginOptions>["options"];
+};
+
+export const checkIsTypeScriptProject = async (
+	args: CheckIsTypeScriptProjectArgs,
+): Promise<boolean> => {
+	return (
+		args.options.typescript ??
+		baseCheckIsTypeScriptProject({ helpers: args.helpers })
+	);
+};

package/src/lib/getJSFileExtension.ts

@@ -0,0 +1,22 @@
+import { PluginSystemContext } from "@prismicio/plugin-kit";
+
+import { PluginOptions } from "../types";
+
+import { checkIsTypeScriptProject } from "./checkIsTypeScriptProject";
+
+type GetJSFileExtensionArgs = Pick<
+	PluginSystemContext<PluginOptions>,
+	"helpers" | "options"
+>;
+
+export const getJSFileExtension = async ({
+	helpers,
+	options,
+}: GetJSFileExtensionArgs): Promise<string> => {
+	const isTypeScriptProject = await checkIsTypeScriptProject({
+		helpers,
+		options,
+	});
+
+	return isTypeScriptProject ? "ts" : "js";
+};

package/src/lib/getSvelteMajor.ts

@@ -0,0 +1,23 @@
+import { join } from "node:path";
+
+import { requireResolve } from "./requireResolve";
+
+export const getSvelteMajor = async (): Promise<number> => {
+	// A dynamic import lets us easily mock the module.
+	const { readFile } = await import("node:fs/promises");
+
+	const packageJSONPath = requireResolve(
+		"svelte/package.json",
+		join(process.cwd(), "package.json"),
+	);
+	const { version } = JSON.parse(await readFile(packageJSONPath, "utf8"));
+
+	const major = Number.parseInt(version.split(".")[0]);
+	if (Number.isNaN(major)) {
+		throw new Error(
+			`Unable to parse svelte's installed version number: "${version}"`,
+		);
+	}
+
+	return major;
+};

package/src/lib/pascalCase.ts

@@ -0,0 +1,12 @@
+import { pascalCase as basePascalCase } from "pascal-case";
+
+/**
+ * Converts a string to a Pascal cased string.
+ *
+ * @param input - String to convert into a Pascal cased string.
+ *
+ * @returns Pascal cased string version of `input`.
+ */
+export const pascalCase = (...input: (string | undefined)[]): string => {
+	return basePascalCase(input.filter(Boolean).join(" "));
+};

package/src/lib/rejectIfNecessary.ts

@@ -0,0 +1,16 @@
+export const rejectIfNecessary = <
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	TPromiseSettledResults extends readonly PromiseSettledResult<any>[],
+>(
+	promiseSettledResults: TPromiseSettledResults,
+): void => {
+	const rejectedReasons = promiseSettledResults
+		.filter(
+			(result): result is PromiseRejectedResult => result.status === "rejected",
+		)
+		.map((result) => result.reason);
+
+	if (rejectedReasons.length > 0) {
+		throw rejectedReasons[0];
+	}
+};

package/src/lib/requireResolve.ts

@@ -0,0 +1,30 @@
+import _module, { createRequire } from "node:module";
+
+/**
+ * Resolves a module path with `createRequire().resolve()` with Yarn PnP
+ * support.
+ *
+ * @param id - Module to resolve.
+ * @param from - Location to resolve the module from.
+ *
+ * @returns - Resolved module path.
+ */
+export const requireResolve = (id: string, from: string): string => {
+	let resolvedID = id;
+
+	// Support Yarn PnP
+	if (
+		process.versions.pnp &&
+		"findPnpApi" in _module &&
+		typeof _module.findPnpApi === "function"
+	) {
+		const pnpApi = _module.findPnpApi(from);
+		if (pnpApi) {
+			resolvedID = pnpApi.resolveRequest(id, from);
+		}
+	}
+
+	const require = createRequire(from);
+
+	return require.resolve(resolvedID);
+};

package/src/lib/upsertSliceLibraryIndexFile.ts

@@ -0,0 +1,78 @@
+import * as path from "node:path";
+
+import { PluginSystemContext } from "@prismicio/plugin-kit";
+import {
+	buildSliceDirectoryPath,
+	buildSliceLibraryDirectoryPath,
+	writeProjectFile,
+} from "@prismicio/plugin-kit/fs";
+import { stripIndent } from "common-tags";
+
+import { NON_EDITABLE_FILE_BANNER } from "../constants";
+import { PluginOptions } from "../types";
+
+import { getJSFileExtension } from "./getJSFileExtension";
+import { pascalCase } from "./pascalCase";
+
+type UpsertSliceLibraryIndexFileArgs = {
+	libraryID: string;
+} & PluginSystemContext<PluginOptions>;
+
+export const upsertSliceLibraryIndexFile = async (
+	args: UpsertSliceLibraryIndexFileArgs,
+): Promise<void> => {
+	const slices = await args.actions.readAllSliceModelsForLibrary({
+		libraryID: args.libraryID,
+	});
+
+	const contents = stripIndent`
+		${NON_EDITABLE_FILE_BANNER}
+
+		${(
+			await Promise.all(
+				slices.map(async (slice) => {
+					const dirName = path.basename(
+						await buildSliceDirectoryPath({
+							model: slice.model,
+							helpers: args.helpers,
+							libraryID: args.libraryID,
+						}),
+					);
+					const componentName = pascalCase(slice.model.name);
+
+					return `import ${componentName} from "./${dirName}/index.svelte";`;
+				}),
+			)
+		).join("\n")}
+
+		export const components = {
+			${slices
+				.map((slice) => {
+					const id = slice.model.id;
+					const componentName = pascalCase(slice.model.name);
+
+					return `${id}: ${componentName},`;
+				})
+				.join("\n")}
+		}
+	`;
+
+	const extension = await getJSFileExtension({
+		helpers: args.helpers,
+		options: args.options,
+	});
+	const filePath = path.join(
+		buildSliceLibraryDirectoryPath({
+			libraryID: args.libraryID,
+			helpers: args.helpers,
+		}),
+		`index.${extension}`,
+	);
+
+	await writeProjectFile({
+		filename: filePath,
+		contents,
+		format: args.options.format,
+		helpers: args.helpers,
+	});
+};