@farming-labs/docs 0.0.2-beta.5 → 0.0.2-beta.7

package/dist/cli/index.mjs

@@ -128,14 +128,65 @@ function spawnAndWaitFor(command, args, cwd, waitFor, timeoutMs = 6e4) {
 
 //#endregion
 //#region src/cli/templates.ts
+const THEME_INFO = {
+	fumadocs: {
+		factory: "fumadocs",
+		nextImport: "@farming-labs/theme",
+		svelteImport: "@farming-labs/svelte-theme",
+		nextCssImport: "default",
+		svelteCssTheme: "fumadocs"
+	},
+	darksharp: {
+		factory: "darksharp",
+		nextImport: "@farming-labs/theme/darksharp",
+		svelteImport: "@farming-labs/svelte-theme/darksharp",
+		nextCssImport: "darksharp",
+		svelteCssTheme: "darksharp"
+	},
+	"pixel-border": {
+		factory: "pixelBorder",
+		nextImport: "@farming-labs/theme/pixel-border",
+		svelteImport: "@farming-labs/svelte-theme/pixel-border",
+		nextCssImport: "pixel-border",
+		svelteCssTheme: "pixel-border"
+	}
+};
+function getThemeInfo(theme) {
+	return THEME_INFO[theme] ?? THEME_INFO.fumadocs;
+}
+/** Config import for Next.js app/layout.tsx → root docs.config */
+function nextRootLayoutConfigImport(useAlias) {
+	return useAlias ? "@/docs.config" : "../docs.config";
+}
+/** Config import for Next.js app/{entry}/layout.tsx → root docs.config */
+function nextDocsLayoutConfigImport(useAlias) {
+	return useAlias ? "@/docs.config" : "../../docs.config";
+}
+/** Config import for SvelteKit src/lib/docs.server.ts → src/lib/docs.config.js */
+function svelteServerConfigImport(useAlias) {
+	return useAlias ? "$lib/docs.config.js" : "./docs.config.js";
+}
+/** Config import for SvelteKit src/routes/{entry}/+layout.svelte → src/lib/docs.config.js */
+function svelteLayoutConfigImport(useAlias) {
+	return useAlias ? "$lib/docs.config.js" : "../../lib/docs.config.js";
+}
+/** Config import for SvelteKit src/routes/{entry}/[...slug]/+page.svelte → src/lib/docs.config.js */
+function sveltePageConfigImport(useAlias) {
+	return useAlias ? "$lib/docs.config.js" : "../../../lib/docs.config.js";
+}
+/** Server import for SvelteKit +layout.server.js → src/lib/docs.server.js */
+function svelteLayoutServerImport(useAlias) {
+	return useAlias ? "$lib/docs.server.js" : "../../lib/docs.server.js";
+}
 function docsConfigTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 import { defineDocs } from "@farming-labs/docs";
-import { fumadocs } from "@farming-labs/theme";
+import { ${t.factory} } from "${t.nextImport}";
 
 export default defineDocs({
   entry: "${cfg.entry}",
-  theme: fumadocs({
+  theme: ${t.factory}({
     ui: {
       colors: { primary: "#6366f1" },
     },
@@ -172,7 +223,7 @@ function nextConfigMergedTemplate(existingContent) {
 	}
 	return lines.join("\n");
 }
-function rootLayoutTemplate(globalCssRelPath = "app/globals.css") {
+function rootLayoutTemplate(cfg, globalCssRelPath = "app/globals.css") {
 	let cssImport;
 	if (globalCssRelPath.startsWith("app/")) cssImport = "./" + globalCssRelPath.slice(4);
 	else if (globalCssRelPath.startsWith("src/app/")) cssImport = "./" + globalCssRelPath.slice(8);
@@ -180,7 +231,7 @@ function rootLayoutTemplate(globalCssRelPath = "app/globals.css") {
 	return `\
 import type { Metadata } from "next";
 import { RootProvider } from "@farming-labs/theme";
-import docsConfig from "@/docs.config";
+import docsConfig from "${nextRootLayoutConfigImport(cfg.useAlias)}";
 import "${cssImport}";
 
 export const metadata: Metadata = {
@@ -209,25 +260,22 @@ export default function RootLayout({
 function globalCssTemplate(theme) {
 	return `\
 @import "tailwindcss";
-@import "@farming-labs/${theme}/css";
+@import "@farming-labs/theme/${getThemeInfo(theme).nextCssImport}/css";
 `;
 }
-/**
-* Inject the fumadocs CSS import into an existing global.css.
-* Returns the modified content, or null if already present.
-*/
 function injectCssImport(existingContent, theme) {
-	const importLine = `@import "@farming-labs/${theme}/css";`;
+	const importLine = `@import "@farming-labs/theme/${getThemeInfo(theme).nextCssImport}/css";`;
 	if (existingContent.includes(importLine)) return null;
+	if (existingContent.includes("@farming-labs/theme/") && existingContent.includes("/css")) return null;
 	const lines = existingContent.split("\n");
 	const lastImportIdx = lines.reduce((acc, l, i) => l.trimStart().startsWith("@import") ? i : acc, -1);
 	if (lastImportIdx >= 0) lines.splice(lastImportIdx + 1, 0, importLine);
 	else lines.unshift(importLine);
 	return lines.join("\n");
 }
-function docsLayoutTemplate() {
+function docsLayoutTemplate(cfg) {
 	return `\
-import docsConfig from "@/docs.config";
+import docsConfig from "${nextDocsLayoutConfigImport(cfg.useAlias)}";
 import { createDocsLayout } from "@farming-labs/theme";
 
 export default createDocsLayout(docsConfig);
@@ -307,6 +355,7 @@ Start by reading the [Installation](/${cfg.entry}/installation) guide, then foll
 `;
 }
 function installationPageTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 ---
 title: "Installation"
@@ -333,11 +382,11 @@ Your project includes a \`docs.config.ts\` at the root:
 
 \`\`\`ts
 import { defineDocs } from "@farming-labs/docs";
-import { fumadocs } from "@farming-labs/theme";
+import { ${t.factory} } from "${t.nextImport}";
 
 export default defineDocs({
   entry: "${cfg.entry}",
-  theme: fumadocs({
+  theme: ${t.factory}({
     ui: { colors: { primary: "#6366f1" } },
   }),
 });
@@ -364,6 +413,7 @@ Head to the [Quickstart](/${cfg.entry}/quickstart) guide to start writing your f
 `;
 }
 function quickstartPageTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 ---
 title: "Quickstart"
@@ -426,7 +476,7 @@ console.log(greet("World"));
 Edit \`docs.config.ts\` to change colors, typography, and component defaults:
 
 \`\`\`ts
-theme: fumadocs({
+theme: ${t.factory}({
   ui: {
     colors: { primary: "#22c55e" },
   },
@@ -445,14 +495,15 @@ Deploy to Vercel, Netlify, or any Node.js hosting platform.
 `;
 }
 function svelteDocsConfigTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 import { defineDocs } from "@farming-labs/docs";
-import { fumadocs } from "@farming-labs/svelte-theme";
+import { ${t.factory} } from "${t.svelteImport}";
 
 export default defineDocs({
   entry: "${cfg.entry}",
   contentDir: "${cfg.entry}",
-  theme: fumadocs({
+  theme: ${t.factory}({
     ui: {
       colors: { primary: "#6366f1" },
     },
@@ -475,7 +526,7 @@ export default defineDocs({
 function svelteDocsServerTemplate(cfg) {
 	return `\
 import { createDocsServer } from "@farming-labs/svelte/server";
-import config from "../../docs.config.js";
+import config from "${svelteServerConfigImport(cfg.useAlias)}";
 
 export const { load, GET, POST } = createDocsServer(config);
 `;
@@ -484,7 +535,7 @@ function svelteDocsLayoutTemplate(cfg) {
 	return `\
 <script>
   import { DocsLayout } from "@farming-labs/svelte-theme";
-  import config from "../../../docs.config.js";
+  import config from "${svelteLayoutConfigImport(cfg.useAlias)}";
 
   let { data, children } = $props();
 <\/script>
@@ -494,16 +545,16 @@ function svelteDocsLayoutTemplate(cfg) {
 </DocsLayout>
 `;
 }
-function svelteDocsLayoutServerTemplate() {
+function svelteDocsLayoutServerTemplate(cfg) {
 	return `\
-export { load } from "$lib/docs.server.js";
+export { load } from "${svelteLayoutServerImport(cfg.useAlias)}";
 `;
 }
 function svelteDocsPageTemplate(cfg) {
 	return `\
 <script>
   import { DocsContent } from "@farming-labs/svelte-theme";
-  import config from "../../../../docs.config.js";
+  import config from "${sveltePageConfigImport(cfg.useAlias)}";
 
   let { data } = $props();
 <\/script>
@@ -573,6 +624,7 @@ Start by reading the [Installation](/${cfg.entry}/installation) guide, then foll
 `;
 }
 function svelteInstallationPageTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 ---
 title: "Installation"
@@ -596,16 +648,16 @@ pnpm add @farming-labs/docs @farming-labs/svelte @farming-labs/svelte-theme
 
 ## Configuration
 
-Your project includes a \`docs.config.ts\` at the root:
+Your project includes a \`docs.config.ts\` in \`src/lib/\`:
 
-\`\`\`ts title="docs.config.ts"
+\`\`\`ts title="src/lib/docs.config.ts"
 import { defineDocs } from "@farming-labs/docs";
-import { fumadocs } from "@farming-labs/svelte-theme";
+import { ${t.factory} } from "${t.svelteImport}";
 
 export default defineDocs({
   entry: "${cfg.entry}",
   contentDir: "${cfg.entry}",
-  theme: fumadocs({
+  theme: ${t.factory}({
     ui: { colors: { primary: "#6366f1" } },
   }),
 });
@@ -622,6 +674,7 @@ ${cfg.entry}/                   # Markdown content
     page.md                    # /${cfg.entry}/quickstart
 src/
   lib/
+    docs.config.ts             # Docs configuration
     docs.server.ts             # Server-side docs loader
   routes/
     ${cfg.entry}/
@@ -629,7 +682,6 @@ src/
       +layout.server.js        # Layout data loader
       [...slug]/
         +page.svelte           # Dynamic doc page
-docs.config.ts                 # Docs configuration
 \`\`\`
 
 ## What's Next?
@@ -638,6 +690,7 @@ Head to the [Quickstart](/${cfg.entry}/quickstart) guide to start writing your f
 `;
 }
 function svelteQuickstartPageTemplate(cfg) {
+	const t = getThemeInfo(cfg.theme);
 	return `\
 ---
 title: "Quickstart"
@@ -685,10 +738,10 @@ console.log(greet("World"));
 
 ## Customizing the Theme
 
-Edit \`docs.config.ts\` to change colors, typography, and component defaults:
+Edit \`src/lib/docs.config.ts\` to change colors, typography, and component defaults:
 
-\`\`\`ts title="docs.config.ts"
-theme: fumadocs({
+\`\`\`ts title="src/lib/docs.config.ts"
+theme: ${t.factory}({
   ui: {
     colors: { primary: "#22c55e" },
   },
@@ -736,27 +789,39 @@ async function init() {
 		}
 		framework = picked;
 	}
-	const themeOptions = framework === "sveltekit" ? [{
-		value: "default",
-		label: "Default",
-		hint: "Clean, modern docs theme with sidebar, search, and dark mode"
-	}, {
-		value: "pixel-border",
-		label: "Pixel Border",
-		hint: "Sharp pixel-art inspired theme with monospace text"
-	}] : [{
-		value: "fumadocs",
-		label: "Fumadocs",
-		hint: "Clean, modern docs theme with sidebar, search, and dark mode"
-	}];
 	const theme = await p.select({
 		message: "Which theme would you like to use?",
-		options: themeOptions
+		options: [
+			{
+				value: "fumadocs",
+				label: "Fumadocs (Default)",
+				hint: "Clean, modern docs theme with sidebar, search, and dark mode"
+			},
+			{
+				value: "darksharp",
+				label: "Darksharp",
+				hint: "All-black, sharp edges, zero-radius look"
+			},
+			{
+				value: "pixel-border",
+				label: "Pixel Border",
+				hint: "Rounded borders, pixel-perfect spacing, refined sidebar"
+			}
+		]
 	});
 	if (p.isCancel(theme)) {
 		p.outro(pc.red("Init cancelled."));
 		process.exit(0);
 	}
+	const aliasHint = framework === "nextjs" ? `Uses ${pc.cyan("@/")} prefix (requires tsconfig paths)` : `Uses ${pc.cyan("$lib/")} prefix (SvelteKit built-in)`;
+	const useAlias = await p.confirm({
+		message: `Use path aliases for imports? ${pc.dim(aliasHint)}`,
+		initialValue: false
+	});
+	if (p.isCancel(useAlias)) {
+		p.outro(pc.red("Init cancelled."));
+		process.exit(0);
+	}
 	const entry = await p.text({
 		message: "Where should your docs live?",
 		placeholder: "docs",
@@ -807,12 +872,14 @@ async function init() {
 		}
 		globalCssRelPath = cssPath;
 	}
-	const pkgJson = JSON.parse(readFileSafe(path.join(cwd, "package.json")));
+	const pkgJsonContent = readFileSafe(path.join(cwd, "package.json"));
+	const pkgJson = pkgJsonContent ? JSON.parse(pkgJsonContent) : { name: "my-project" };
 	const cfg = {
 		entry: entryPath,
 		theme,
 		projectName: pkgJson.name || "My Project",
-		framework
+		framework,
+		useAlias
 	};
 	const s = p.spinner();
 	s.start("Scaffolding docs files");
@@ -918,7 +985,7 @@ function scaffoldNextJs(cwd, cfg, globalCssRelPath, write, skipped, written) {
 			written.push(configFile + " (updated)");
 		} else skipped.push(configFile + " (already configured)");
 	} else write("next.config.ts", nextConfigTemplate());
-	write("app/layout.tsx", rootLayoutTemplate(globalCssRelPath));
+	write("app/layout.tsx", rootLayoutTemplate(cfg, globalCssRelPath));
 	const globalCssAbsPath = path.join(cwd, globalCssRelPath);
 	const existingGlobalCss = readFileSafe(globalCssAbsPath);
 	if (existingGlobalCss) {
@@ -928,7 +995,7 @@ function scaffoldNextJs(cwd, cfg, globalCssRelPath, write, skipped, written) {
 			written.push(globalCssRelPath + " (updated)");
 		} else skipped.push(globalCssRelPath + " (already configured)");
 	} else write(globalCssRelPath, globalCssTemplate(cfg.theme));
-	write(`app/${cfg.entry}/layout.tsx`, docsLayoutTemplate());
+	write(`app/${cfg.entry}/layout.tsx`, docsLayoutTemplate(cfg));
 	write("postcss.config.mjs", postcssConfigTemplate());
 	if (!fileExists(path.join(cwd, "tsconfig.json"))) write("tsconfig.json", tsconfigTemplate());
 	write(`app/${cfg.entry}/page.mdx`, welcomePageTemplate(cfg));
@@ -936,18 +1003,19 @@ function scaffoldNextJs(cwd, cfg, globalCssRelPath, write, skipped, written) {
 	write(`app/${cfg.entry}/quickstart/page.mdx`, quickstartPageTemplate(cfg));
 }
 function scaffoldSvelteKit(cwd, cfg, globalCssRelPath, write, skipped, written) {
-	write("docs.config.ts", svelteDocsConfigTemplate(cfg));
+	write("src/lib/docs.config.ts", svelteDocsConfigTemplate(cfg));
 	write("src/lib/docs.server.ts", svelteDocsServerTemplate(cfg));
 	write(`src/routes/${cfg.entry}/+layout.svelte`, svelteDocsLayoutTemplate(cfg));
-	write(`src/routes/${cfg.entry}/+layout.server.js`, svelteDocsLayoutServerTemplate());
+	write(`src/routes/${cfg.entry}/+layout.server.js`, svelteDocsLayoutServerTemplate(cfg));
 	write(`src/routes/${cfg.entry}/[...slug]/+page.svelte`, svelteDocsPageTemplate(cfg));
 	if (!readFileSafe(path.join(cwd, "src/routes/+layout.svelte"))) write("src/routes/+layout.svelte", svelteRootLayoutTemplate(globalCssRelPath));
 	const globalCssAbsPath = path.join(cwd, globalCssRelPath);
 	const existingGlobalCss = readFileSafe(globalCssAbsPath);
 	const cssTheme = {
-		default: "fumadocs",
+		fumadocs: "fumadocs",
+		darksharp: "darksharp",
 		"pixel-border": "pixel-border",
-		fumadocs: "fumadocs"
+		default: "fumadocs"
 	}[cfg.theme] || "fumadocs";
 	if (existingGlobalCss) {
 		const injected = injectSvelteCssImport(existingGlobalCss, cssTheme);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@farming-labs/docs",
-  "version": "0.0.2-beta.5",
+  "version": "0.0.2-beta.7",
   "description": "Modern, flexible MDX-based docs framework — core types, config, and CLI",
   "type": "module",
   "main": "./dist/index.mjs",