npm - @compiiile/compiiile - Versions diffs - 2.16.1 → 2.17.1 - Mend

@compiiile/compiiile 2.16.1 → 2.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/.compiiile/src/layouts/BaseLayout.astro +26 -0
package/.compiiile/src/style/texts.css +0 -1
package/4-pro-features.mdx +6 -6
package/README.md +28 -22
package/bin/config.js +4 -141
package/bin/loadConfig.js +175 -0
package/bin/vitePluginCompiiile/index.js +102 -1
package/bin/vitePluginCompiiile/models/Context.js +23 -17
package/package.json +1 -1
package/.compiiile/components.d.ts +0 -23
package/bin/.compiiile/src/env.d.ts +0 -1

package/.compiiile/src/layouts/BaseLayout.astro CHANGED Viewed

@@ -40,5 +40,31 @@ const defaultTheme = site.theme
 </head>
 <body>
 <slot></slot>
+<script>
+    /*
+        Using HMR, we send a custom event when the `asSlides` frontmatter parameter changed.
+        The event contains the old and new route path based on whether the page needs to display slides.
+        We store the new page URL to redirect to in the sessionStorage because it follows this flow:
+        - the `switch-page-render` event is sent
+        - we receive it just below, and check if we are on the updated file's URL : we store the new URL to redirect to
+        - the whole page reloads because Compiiile vite's module in invalidated to reload its config and all files
+        - only when the reload is done, we get to the second `if`, where we change the current route URL
+        - the redirect is not made before the vite's module invalidation because the reload prevents the redirection from happening
+    */
+    if (import.meta.hot) {
+        import.meta.hot.on('switch-page-render', (data) => {
+            if(window.location.pathname === data.oldRoutePath){
+                sessionStorage.setItem("COMPIIILE_SWITCH_PAGE_RENDER", window.location.origin + data.newRoutePath)
+            }
+        })
+    }
+    if(sessionStorage.getItem("COMPIIILE_SWITCH_PAGE_RENDER")){
+        window.location.href = sessionStorage.getItem("COMPIIILE_SWITCH_PAGE_RENDER")
+        sessionStorage.removeItem("COMPIIILE_SWITCH_PAGE_RENDER")
+    }
+</script>
 </body>
 </html>

package/.compiiile/src/style/texts.css CHANGED Viewed

@@ -88,7 +88,6 @@ body {
 	visibility: hidden;
 }
 details summary {
 	cursor: pointer;
 }

package/4-pro-features.mdx CHANGED Viewed

@@ -19,9 +19,9 @@ Here is an example of a CSS file content to set some colors and the default font
 @import url(https://fonts.bunny.net/css?family=inter:200i,400,400i,900);
 :root {
-    --layout-background-color: #0000FF;
-    --darker-background-color: #00FF00;
-    --default-font: 'Inter', sans-serif;
+	--layout-background-color: #0000ff;
+	--darker-background-color: #00ff00;
+	--default-font: "Inter", sans-serif;
 }
 ```
@@ -627,10 +627,10 @@ The `CDetails` component allows you to hide a block and reveal it by clicking on
 </CDetails>
 <CDetails summary="Source">
-    ```mdx
-    <CDetails summary="Example">
+	```mdx
+	<CDetails summary="Example">
         > [!TIP]
         > This is lit! :sparkles:
     </CDetails>
-    ```
+	```
 </CDetails>

package/README.md CHANGED Viewed

@@ -99,11 +99,16 @@ To make yourself an idea and quickly get started using Compiiile, here are some
 terminal to get Compiiile running with a couple of markdown files as tests:
 ```bash
-mkdir test-compiiile && cd test-compiiile # creating a new folder and go into this folder
-yarn global add @compiiile/compiiile # installing compiiile as global dependency using yarn
-echo '# Test Compiiile\n\n> Here is a blockquote for you\n\n## Your markdown awaits below' > README.md # a first test file
-echo '---\nasSlides: true\n---\n\n# Slide 1\n\n---\n\n# And this is slide 2' > slides.md # a second test file as slides
-compiiile --title="📚 Compiiile" # running Compiiile for these 2 files
+# creating a new folder and go into this folder
+mkdir test-compiiile && cd test-compiiile
+# installing compiiile as global dependency using npm
+npm i -g @compiiile/compiiile
+# a first test file
+echo '# Test Compiiile\n\n> Here is a blockquote for you\n\n## Your markdown awaits below' > README.md
+# a second test file as slides
+echo '---\nasSlides: true\n---\n\n# Slide 1\n\n---\n\n# And this is slide 2' > slides.md
+# running Compiiile for these 2 files
+compiiile --title="📚 Compiiile"
 ```
 Et voilà, you should be able to preview your files in your browser :tada:.
@@ -196,23 +201,24 @@ The home page of Compiiile (`/`) points to a `README.md` file located at the roo
 Here is the list of parameters that you can set to customize Compiiile (none are required):
-| Parameter              | Type       | Description                                                                                                          |
-|------------------------|------------|----------------------------------------------------------------------------------------------------------------------|
-| `title`                | `string`   | The title to display on the top-left of the User Interface                                                           |
-| `description`          | `string`   | The description that is rendered by default for the SEO                                                              |
-| `logo`                 | `string`   | The relative path of the logo to display in the TopBar and as favicon                                                |
-| `logoUrl`              | `string`   | The url to go to when clicking on the logo, defaults to the home page if not set                                     |
-| `dest`                 | `string`   | The folder in which to build files, defaults to `./.compiiile/dist`                                                  |
-| `siteUrl`              | `string`   | The url of the website in production (without trailing slash), used for the SEO tag `og:image`                       |
-| `astroConfig`          | `Object`   | Override [default Astro config](https://docs.astro.build/en/reference/configuration-reference/)                      |
-| `data`                 | `Object`   | An object with data to use in MDX files (check use case below)                                                       |
-| `theme`                | `string`   | The website theme, value can be : `auto` (default value: adapts to system preferences) \| `light` \| `dark`          |
-| `useAutoTitles`        | `Boolean`  | If set to `true`, use the first file heading as title to be displayed in the navbar and for SEO. Defaults to `false` |
-| `noIndex`              | `Boolean`  | If set to `true`, the `robots.txt` file will disallow all routes, preventing indexation. Defaults to `false`         |
-| `publicDir`            | `string`   | The folder name in which you can serve public files, defaults to `public`                                            |
-| `vite.server.fs.allow` | `string[]` | Add local paths to vite's server fs allow list                                                                       |
-| `printReady`           | `Boolean`  | Add a `/print` page to display a full ready-to-print content (uses `@compiiile/compiiile-print`)                     |
-| `css`                  | `string`   | A relative path to a custom CSS file to customize the style <br/>:warning: Requires `compiiile-pro`                  |
+| Parameter              | Type       | Description                                                                                                                                                                             |
+|------------------------| ---------- |-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `title`                | `string`   | The title to display on the top-left of the User Interface                                                                                                                              |
+| `description`          | `string`   | The description that is rendered by default for the SEO                                                                                                                                 |
+| `logo`                 | `string`   | The relative path of the logo to display in the TopBar and as favicon                                                                                                                   |
+| `logoUrl`              | `string`   | The url to go to when clicking on the logo, defaults to the home page if not set                                                                                                        |
+| `dest`                 | `string`   | The folder in which to build files, defaults to `./.compiiile/dist`                                                                                                                     |
+| `siteUrl`              | `string`   | The url of the website in production (without trailing slash), used for the SEO tag `og:image`                                                                                          |
+| `astroConfig`          | `Object`   | Override [default Astro config](https://docs.astro.build/en/reference/configuration-reference/)                                                                                         |
+| `data`                 | `Object`   | An object with data to use in MDX files (check use case below)                                                                                                                          |
+| `theme`                | `string`   | The website theme, value can be : `auto` (default value: adapts to system preferences) \| `light` \| `dark`                                                                             |
+| `useAutoTitles`        | `Boolean`  | If set to `true`, use the first file heading as title to be displayed in the navbar and for SEO. Defaults to `false`                                                                    |
+| `noIndex`              | `Boolean`  | If set to `true`, the `robots.txt` file will disallow all routes, preventing indexation. Defaults to `false`                                                                            |
+| `publicDir`            | `string`   | The folder name in which you can serve public files, defaults to `public`                                                                                                               |
+| `vite.server.fs.allow` | `string[]` | Add local paths to vite's server fs allow list                                                                                                                                          |
+| `printReady`           | `Boolean`  | Add a `/print` page to display a full ready-to-print content (uses `@compiiile/compiiile-print`)                                                                                        |
+| `css`                  | `string`   | A relative path to a custom CSS file to customize the style <br/>:warning: Requires `compiiile-pro`                                                                                     |
+| `integrations`         | `AstroIntegration[]`   | An array of Astro Integrations for [custom Astro hooks implementations](https://docs.astro.build/en/reference/integrations-reference/#astroconfigsetup): injecting CSS, javascript, etc |
 You can use these parameters in 2 ways:

package/bin/config.js CHANGED Viewed

@@ -4,114 +4,17 @@ import { passthroughImageService } from "astro/config"
 import compiiile from "./vitePluginCompiiile/index.js"
 import mdx from "@astrojs/mdx"
 import path from "node:path"
-import { copyFileSync, cpSync, existsSync } from "node:fs"
 import { fileURLToPath } from "node:url"
 import markdownConfig from "./vitePluginCompiiile/markdownConfig.js"
 import sitemap from "@astrojs/sitemap"
-import { loadConfig } from "c12"
-import yargs from "yargs/yargs"
-import { hideBin } from "yargs/helpers"
-import { readFile } from "node:fs/promises"
 // Making sure fonts are accessible by vite's server
 import { createRequire } from "node:module"
 import { packageDirectory } from "pkg-dir"
-const source = process.cwd()
-process.env.COMPIIILE_SOURCE = source
+import { loadConfig } from "./loadConfig.js"
-const packageJSON = JSON.parse(await readFile(fileURLToPath(new URL("../package.json", import.meta.url))))
-/*
- Order of options by priority:
- 1. command arguments
- 2. user-defined config in dedicated file
- 3. default config as fallback
- */
-let configFromFile = {}
-try {
-	configFromFile = (await loadConfig({ name: "compiiile" })).config
-} catch {
-	// This means that no config file was provided: getting parameters from script parameters instead
-}
-const argv = yargs(hideBin(process.argv))
-	.parserConfiguration({
-		"deep-merge-config": true
-	})
-	.alias("v", "version")
-	.config(configFromFile)
-	.command("dev", "launch development server")
-	.command("build", "build")
-	.command("preview", "preview")
-	.option("port", {
-		describe: "Port to use",
-		default: 4321
-	})
-	.option("host", {
-		describe: "Host to use",
-		default: "127.0.0.1"
-	})
-	.option("title", {
-		describe: "The title to display on the top-left of the User Interface"
-	})
-	.option("description", {
-		describe: "The description that is rendered by default for the SEO"
-	})
-	.option("logo", {
-		describe: "The relative path of the logo to display in the TopBar and as favicon"
-	})
-	.option("logoUrl", {
-		describe: "The url to go to when clicking on the logo, defaults to the home page if not set"
-	})
-	.option("dest", {
-		describe: "The folder in which to build files, defaults to `./.compiiile/dist`"
-	})
-	.option("siteUrl", {
-		describe: "The url of the website in production (without trailing slash), used for the SEO tag `og:image`"
-	})
-	.option("astroConfig", {
-		describe: "Override default Astro config (https://docs.astro.build/en/reference/configuration-reference/)"
-	})
-	.option("data", {
-		describe: "An object with data to use in MDX files"
-	})
-	.option("theme", {
-		describe:
-			"The website theme, value can be : `auto` (default value: adapts to system preferences) | `light` | `dark`"
-	})
-	.option("useAutoTitles", {
-		describe:
-			"If set to `true`, use the first file heading as title to be displayed in the navbar and for SEO. Defaults to `false`"
-	})
-	.option("noIndex", {
-		describe:
-			"If set to `true`, the `robots.txt` file will disallow all routes, preventing indexation. Defaults to `false`"
-	})
-	.option("publicDir", {
-		describe: "The folder name in which you can serve public files, defaults to `public`"
-	})
-	.option("vite.server.fs.allow", {
-		describe: "Add local paths to vite's server fs allow list"
-	})
-	.option("printReady", {
-		describe: "Add a /print page to display a full ready-to-print content (uses @compiiile/compiiile-print)"
-	})
-	.help()
-	.version(packageJSON.version).argv
-process.env.VITE_COMPIIILE_SITE_URL = argv.siteUrl ?? ""
-process.env.VITE_COMPIIILE_NO_INDEX = /true/i.test(argv.noIndex) // defaults to `false` if not set or not equal to `true`
-process.env.VITE_COMPIIILE_TITLE = argv.title ?? ""
-process.env.VITE_COMPIIILE_DESCRIPTION = argv.description ?? ""
-process.env.VITE_COMPIIILE_LOGO_URL = argv.logoUrl ?? ""
-process.env.VITE_COMPIIILE_THEME = argv.theme ?? "auto"
-process.env.VITE_COMPIIILE_DATA = JSON.stringify(argv.data ?? {})
-process.env.VITE_COMPIIILE_USE_AUTO_TITLES = /true/i.test(argv.useAutoTitles) // defaults to `false` if not set or not equal to `true`
+const { argv, localIntegrations, configFromFile, source, hasPublicFiles, publicDir } = await loadConfig()
 // Get command and set env
 const IS_DEV = argv._.length === 0 || argv._.includes("dev")
@@ -126,35 +29,6 @@ if (IS_DEV) {
 	process.env.NODE_ENV = NODE_ENV_PRODUCTION
 }
-// Handling logo and favicon
-process.env.VITE_COMPIIILE_LOGO = null
-const publicDir = path.resolve(source, "./.compiiile/public")
-const localPublicDirName = argv.publicDir ?? "public"
-const localPublicDir = path.resolve(source, localPublicDirName)
-const localPublicDirExists = existsSync(localPublicDir)
-const hasPublicFiles = localPublicDirExists || argv.logo
-if (hasPublicFiles) {
-	cpSync(fileURLToPath(new URL("../.compiiile/public", import.meta.url)), publicDir, { recursive: true })
-}
-if (localPublicDirExists) {
-	cpSync(localPublicDir, publicDir, { recursive: true })
-}
-if (argv.logo) {
-	try {
-		copyFileSync(path.resolve(source, argv.logo), path.resolve(publicDir, "favicon.png"))
-		// Set the logo to be displayed on the top bar if we were able to copy
-		process.env.VITE_COMPIIILE_LOGO = argv.logo
-	} catch (e) {
-		console.log(e)
-		console.error("Could not load provided logo: set a relative url from the current folder")
-	}
-}
 const require = createRequire(import.meta.url)
 const pathName = require.resolve("@fontsource-variable/archivo")
@@ -164,13 +38,6 @@ if (packageDir) {
 	viteServerFsAllowList.push(packageDir)
 }
-const localIntegrations = []
-if(/true/i.test(argv.printReady)){
-	const compiiilePrintIntegration = (await import("@compiiile/compiiile-print")).default
-	localIntegrations.push(compiiilePrintIntegration())
-}
 const astroConfig = {
 	server: {
 		host: argv.host,
@@ -241,12 +108,8 @@ const astroConfig = {
 	image: {
 		service: passthroughImageService()
 	},
-	...(configFromFile.astroConfig ?? {})
-}
-process.env.VITE_COMPIIILE_BASE = astroConfig.base
-if (process.env.VITE_COMPIIILE_BASE !== "/" && process.env.VITE_COMPIIILE_BASE.endsWith("/")) {
-	process.env.VITE_COMPIIILE_BASE = process.env.VITE_COMPIIILE_BASE.slice(0, -1)
+	...(configFromFile.astroConfig ?? {}),
+	...(argv.astroConfig ?? {})
 }
 const run = async (astroConfig) => {

package/bin/loadConfig.js ADDED Viewed

@@ -0,0 +1,175 @@
+import { readFile } from "node:fs/promises"
+import { fileURLToPath } from "node:url"
+import yargs from "yargs/yargs"
+import { hideBin } from "yargs/helpers"
+import path from "node:path"
+import { copyFileSync, cpSync, existsSync, rmSync } from "node:fs"
+import { loadConfig as loadConfigFile } from "c12"
+export const loadConfig = async () => {
+	const source = process.cwd()
+	process.env.COMPIIILE_SOURCE = source
+	const packageJSON = JSON.parse(await readFile(fileURLToPath(new URL("../package.json", import.meta.url))))
+	/*
+     Order of options by priority:
+     1. command arguments
+     2. user-defined config in dedicated file
+     3. default config as fallback
+     */
+	let configFromFile = {}
+	let compiiileConfig = {}
+	try {
+		compiiileConfig = await loadConfigFile({
+			name: process.env.COMPIIILE_TEMP_CONFIG_NAME || "compiiile",
+			cwd: process.env.COMPIIILE_TEMP_DIR || source
+		})
+		configFromFile = {...compiiileConfig.config}
+		if (!process.env.COMPIIILE_CONFIG_FILE) {
+			process.env.COMPIIILE_CONFIG_FILE = compiiileConfig.configFile
+		}
+	} catch {
+		// This means that no config file was provided: getting parameters from script parameters instead
+	}
+	if (process.env.COMPIIILE_TEMP_DIR) {
+		rmSync(process.env.COMPIIILE_TEMP_DIR, { recursive: true, force: true })
+	}
+	if (!configFromFile.astroConfig?.base) {
+		if (!configFromFile.astroConfig) {
+			configFromFile.astroConfig = {}
+		}
+		configFromFile.astroConfig.base = "/"
+	}
+	const argv = yargs(hideBin(process.argv))
+		.parserConfiguration({
+			"deep-merge-config": true
+		})
+		.alias("v", "version")
+		.config(configFromFile)
+		.command("dev", "launch development server")
+		.command("build", "build")
+		.command("preview", "preview")
+		.option("port", {
+			describe: "Port to use",
+			default: 4321
+		})
+		.option("host", {
+			describe: "Host to use",
+			default: "127.0.0.1"
+		})
+		.option("title", {
+			describe: "The title to display on the top-left of the User Interface"
+		})
+		.option("description", {
+			describe: "The description that is rendered by default for the SEO"
+		})
+		.option("logo", {
+			describe: "The relative path of the logo to display in the TopBar and as favicon"
+		})
+		.option("logoUrl", {
+			describe: "The url to go to when clicking on the logo, defaults to the home page if not set"
+		})
+		.option("dest", {
+			describe: "The folder in which to build files, defaults to `./.compiiile/dist`"
+		})
+		.option("siteUrl", {
+			describe: "The url of the website in production (without trailing slash), used for the SEO tag `og:image`"
+		})
+		.option("astroConfig", {
+			describe: "Override default Astro config (https://docs.astro.build/en/reference/configuration-reference/)"
+		})
+		.option("data", {
+			describe: "An object with data to use in MDX files"
+		})
+		.option("theme", {
+			describe:
+				"The website theme, value can be : `auto` (default value: adapts to system preferences) | `light` | `dark`"
+		})
+		.option("useAutoTitles", {
+			describe:
+				"If set to `true`, use the first file heading as title to be displayed in the navbar and for SEO. Defaults to `false`"
+		})
+		.option("noIndex", {
+			describe:
+				"If set to `true`, the `robots.txt` file will disallow all routes, preventing indexation. Defaults to `false`"
+		})
+		.option("publicDir", {
+			describe: "The folder name in which you can serve public files, defaults to `public`"
+		})
+		.option("vite.server.fs.allow", {
+			describe: "Add local paths to vite's server fs allow list"
+		})
+		.option("printReady", {
+			describe: "Add a /print page to display a full ready-to-print content (uses @compiiile/compiiile-print)"
+		})
+		.help()
+		.version(packageJSON.version).argv
+	process.env.VITE_COMPIIILE_SITE_URL = argv.siteUrl ?? ""
+	process.env.VITE_COMPIIILE_NO_INDEX = /true/i.test(argv.noIndex) // defaults to `false` if not set or not equal to `true`
+	process.env.VITE_COMPIIILE_TITLE = argv.title ?? ""
+	process.env.VITE_COMPIIILE_DESCRIPTION = argv.description ?? ""
+	process.env.VITE_COMPIIILE_LOGO_URL = argv.logoUrl ?? ""
+	process.env.VITE_COMPIIILE_THEME = argv.theme ?? "auto"
+	process.env.VITE_COMPIIILE_DATA = typeof argv.data === "string" ? argv.data : JSON.stringify(argv.data ?? {})
+	process.env.VITE_COMPIIILE_USE_AUTO_TITLES = /true/i.test(argv.useAutoTitles) // defaults to `false` if not set or not equal to `true`
+	// Handling logo and favicon
+	process.env.VITE_COMPIIILE_LOGO = null
+	const publicDir = path.resolve(source, "./.compiiile/public")
+	const localPublicDirName = argv.publicDir ?? "public"
+	const localPublicDir = path.resolve(source, localPublicDirName)
+	const localPublicDirExists = existsSync(localPublicDir)
+	const hasPublicFiles = localPublicDirExists || argv.logo
+	if (hasPublicFiles) {
+		cpSync(fileURLToPath(new URL("../.compiiile/public", import.meta.url)), publicDir, { recursive: true })
+	}
+	if (localPublicDirExists) {
+		cpSync(localPublicDir, publicDir, { recursive: true })
+	}
+	if (argv.logo) {
+		try {
+			copyFileSync(path.resolve(source, argv.logo), path.resolve(publicDir, "favicon.png"))
+			// Set the logo to be displayed on the top bar if we were able to copy
+			process.env.VITE_COMPIIILE_LOGO = argv.logo
+		} catch (e) {
+			console.log(e)
+			console.error("Could not load provided logo: set a relative url from the current folder")
+		}
+	}
+	const localIntegrations = []
+	if (/true/i.test(argv.printReady)) {
+		const compiiilePrintIntegration = (await import("@compiiile/compiiile-print")).default
+		localIntegrations.push(compiiilePrintIntegration())
+	}
+	process.env.VITE_COMPIIILE_BASE = argv.astroConfig.base
+	if (process.env.VITE_COMPIIILE_BASE !== "/" && process.env.VITE_COMPIIILE_BASE.endsWith("/")) {
+		process.env.VITE_COMPIIILE_BASE = process.env.VITE_COMPIIILE_BASE.slice(0, -1)
+	}
+	return {
+		argv,
+		localIntegrations,
+		configFromFile,
+		source,
+		hasPublicFiles,
+		publicDir
+	}
+}

package/bin/vitePluginCompiiile/index.js CHANGED Viewed

@@ -1,7 +1,18 @@
 import Context from "./models/Context.js"
+import { createMarkdownProcessor } from "@astrojs/markdown-remark"
+import markdownConfig from "./markdownConfig.js"
+import path from "node:path"
+import { loadConfig } from "../loadConfig.js"
+import { promises as fs } from "node:fs"
 const source = "."
+let context = null
+const pathFromSource = (filePath) => {
+	return filePath?.replace(process.env.COMPIIILE_SOURCE + "/", "")
+}
 export default function compiiile() {
 	const virtualModuleId = "virtual:compiiile"
 	const resolvedVirtualModuleId = "\0" + virtualModuleId
@@ -18,7 +29,7 @@ export default function compiiile() {
 				return
 			}
-			const context = new Context()
+			context = new Context()
 			context.filesTree = await context.scanDirectoryRecursively(source)
 			process.env.context = JSON.stringify(context)
@@ -27,6 +38,96 @@ export default function compiiile() {
             const routeList = ${JSON.stringify(context.routeList)};\n\n
             const site = ${JSON.stringify(context.site)};\n\n
             export { fileList, filesTree, routeList, site };`
+		},
+		async hotUpdate({ file, read }) {
+			let shouldReloadPlugin = false
+			const absolutePath = pathFromSource(file)
+			if (file.match(/.*\.mdx?/)) {
+				try {
+					const content = await read()
+					const routeListItem = context.routeList.find((route) => route.fullPath === absolutePath)
+					const markdownProcessor = await createMarkdownProcessor(markdownConfig)
+					const renderedMarkdown = await markdownProcessor.render(content)
+					const title = context.getFileTitleFromProcessedMarkdown(renderedMarkdown)
+					const meta = renderedMarkdown.metadata.frontmatter
+					meta.title = title || path.parse(file).name
+					const fileMetaChanged = JSON.stringify(routeListItem?.meta || {}) !== JSON.stringify(meta)
+					shouldReloadPlugin = fileMetaChanged || !routeListItem
+					const prevStateWasAsSlides = !!routeListItem?.meta?.asSlides
+					const currentStateIsAsSlides = !!meta.asSlides
+					if (prevStateWasAsSlides !== currentStateIsAsSlides) {
+						const newRoutePath = context.generateRoutePathFromFilePath(
+							routeListItem.fullPath,
+							"",
+							currentStateIsAsSlides,
+							context.getEntryFileMatcher([routeListItem.fullPath])
+						)
+						this.environment.hot.send({
+							type: "custom",
+							event: "switch-page-render",
+							data: {
+								oldRoutePath: routeListItem.path,
+								newRoutePath: newRoutePath
+							}
+						})
+					}
+				} catch (e) {
+					if (e.code === "ENOENT") {
+						// The file has been deleted
+						shouldReloadPlugin = true
+					}
+				}
+			}
+			const compiiileConfigFilePath = pathFromSource(process.env.COMPIIILE_CONFIG_FILE)
+			const compiiileConfigFileNewlyCreated =
+				absolutePath.match(/^compiiile\.config\.(m|c)?js$/) &&
+				process.env.COMPIIILE_CONFIG_FILE === "compiiile.config"
+			if (absolutePath === compiiileConfigFilePath || compiiileConfigFileNewlyCreated) {
+				shouldReloadPlugin = true
+				// WHY we do all this stuff and don't just import the config:
+				// "the file change callback may fire too fast before the editor finishes updating the file"
+				// https://vite.dev/guide/api-plugin.html#handlehotupdate
+				try {
+					const compiiileConfigFileContent = await read()
+					const tempConfigName = `${Date.now()}-temp-compiiile`
+					const tempDir = path.join(process.env.COMPIIILE_SOURCE, ".compiiile", ".temp")
+					await fs.mkdir(tempDir, { recursive: true }).catch(console.error)
+					const filePath = path.join(tempDir, tempConfigName + ".config.mjs")
+					await fs.writeFile(filePath, compiiileConfigFileContent)
+					process.env.COMPIIILE_TEMP_DIR = tempDir
+					process.env.COMPIIILE_TEMP_CONFIG_NAME = tempConfigName
+				} catch (e) {
+					// Config file has been deleted
+				}
+				// Whether the config file has been created / updated / deleted, we reload the whole config with args + env parameters
+				await loadConfig()
+			}
+			if (shouldReloadPlugin) {
+				// Invalidate the plugin module so it gets re-imported
+				const pluginModule = this.environment.moduleGraph.getModuleById(resolvedVirtualModuleId)
+				if (pluginModule) {
+					this.environment.moduleGraph.invalidateModule(pluginModule)
+				}
+				this.environment.hot.send({ type: "full-reload" })
+				return []
+			}
 		}
 	}
 }

package/bin/vitePluginCompiiile/models/Context.js CHANGED Viewed

@@ -55,6 +55,25 @@ export default class {
 		}/${asSlides ? this.SLIDES_BASE_PATH : this.WORKSPACE_BASE_PATH}/${sluggifiedPath}${hash}`
 	}
+	getFileTitleFromProcessedMarkdown(processedMarkdown) {
+		let firstHeading = null
+		if (JSON.parse(process.env.VITE_COMPIIILE_USE_AUTO_TITLES) && processedMarkdown.metadata.headings.length > 0) {
+			let firstHeadingIndex = 0
+			if (Object.keys(processedMarkdown.metadata.frontmatter).length > 0) {
+				// If a frontmatter is set, it is present as the first index in the `headings` array
+				firstHeadingIndex = 1
+			}
+			// Remove the starting '#' from the title
+			firstHeading = processedMarkdown.metadata.headings[firstHeadingIndex]?.text?.slice(1)
+		}
+		return processedMarkdown.metadata.frontmatter.title || firstHeading
+	}
+	getEntryFileMatcher(files) {
+		return files.find((file) => file.toLowerCase().match(/^readme.mdx?$/)) ? /readme/ : /index/
+	}
 	async scanDirectoryRecursively(directoryPath) {
 		const fileArray = []
@@ -65,7 +84,7 @@ export default class {
 		const files = fs.readdirSync(directoryPath).sort(collator.compare)
-		const entryFileMatcher = files.find((file) => file.toLowerCase().match(/^readme.mdx?$/)) ? /readme/ : /index/
+		const entryFileMatcher = this.getEntryFileMatcher(files)
 		for (let file of files) {
 			if (
@@ -153,23 +172,10 @@ export default class {
 							continue
 						}
-						let firstHeading = null
-						if (
-							JSON.parse(process.env.VITE_COMPIIILE_USE_AUTO_TITLES) &&
-							renderedMarkdown.metadata.headings.length > 0
-						) {
-							let firstHeadingIndex = 0
-							if (Object.keys(renderedMarkdown.metadata.frontmatter).length > 0) {
-								// If a frontmatter is set, it is present as the first index in the `headings` array
-								firstHeadingIndex = 1
-							}
-							// Remove the starting '#' from the title
-							firstHeading = renderedMarkdown.metadata.headings[firstHeadingIndex]?.text?.slice(1)
-						}
-						fileListItem.title = meta.title || firstHeading || fileName
+						const title = this.getFileTitleFromProcessedMarkdown(renderedMarkdown) || fileName
+						fileListItem.title = title
 						fileListItem.meta = meta
-						fileListItem.meta.title = fileListItem.meta.title || fileListItem.title
+						fileListItem.meta.title = title
 						fileListItem.fullPath = filePath
 						const routePath = this.generateRoutePathFromFilePath(

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
 	"name": "@compiiile/compiiile",
 	"private": false,
-	"version": "2.16.1",
+	"version": "2.17.1",
 	"description": "The most convenient way to render a folder containing markdown files. Previewing and searching markdown files has never been that easy.",
 	"author": "AlbanCrepel <alban.crepel@gmail.com>",
 	"license": "GPL-3.0-only",

package/.compiiile/components.d.ts DELETED Viewed

@@ -1,23 +0,0 @@
-/* eslint-disable */
-// @ts-nocheck
-// Generated by unplugin-vue-components
-// Read more: https://github.com/vuejs/core/pull/3399
-export {}
-/* prettier-ignore */
-declare module 'vue' {
-  export interface GlobalComponents {
-    ClientScript: typeof import('./src/components/ClientScript.vue')['default']
-    ContentWrapper: typeof import('./src/components/ContentWrapper.vue')['default']
-    FilesTree: typeof import('./src/components/layout/navBar/FilesTree.vue')['default']
-    HamburgerButton: typeof import('./src/components/layout/HamburgerButton.vue')['default']
-    NavBar: typeof import('./src/components/layout/navBar/NavBar.vue')['default']
-    NavListItem: typeof import('./src/components/layout/navBar/NavListItem.vue')['default']
-    SearchBar: typeof import('./src/components/searchBar/SearchBar.vue')['default']
-    SearchResult: typeof import('./src/components/searchBar/SearchResult.vue')['default']
-    SlidesContent: typeof import('./src/components/SlidesContent.vue')['default']
-    TableOfContent: typeof import('./src/components/TableOfContent.vue')['default']
-    ThemeSwitcher: typeof import('./src/components/layout/ThemeSwitcher.vue')['default']
-    TopBar: typeof import('./src/components/layout/TopBar.vue')['default']
-  }
-}

package/bin/.compiiile/src/env.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- /// <reference types="astro/client" />