Merge branch 'main' into joan/mobile-support

Author: Nemikolh

docs/tutorialkit.dev/astro.config.ts

@@ -19,11 +19,7 @@ export default defineConfig({
         light: './src/assets/brand/tutorialkit-logo-light.svg',
         replacesTitle: true,
       },
-      plugins: [
-        starlightLinksValidator({
-          exclude: ['../../guides/**/*'],
-        }),
-      ],
+      plugins: [starlightLinksValidator()],
       sidebar: [
         {
           label: 'Guides',
@@ -41,10 +37,6 @@ export default defineConfig({
               label: 'Content creation',
               link: '/guides/creating-content/',
             },
-            {
-              label: 'Configuration',
-              link: '/guides/configuration/',
-            },
             {
               label: 'Deployment',
               link: '/guides/deployment/',
@@ -58,6 +50,10 @@ export default defineConfig({
         {
           label: 'Reference',
           items: [
+            {
+              label: 'Configuration',
+              link: '/reference/configuration/',
+            },
             {
               label: 'Theming',
               link: '/reference/theming/',

docs/tutorialkit.dev/src/content/docs/guides/about.mdx

@@ -21,4 +21,4 @@ This documentation will guide you through the steps to build your first interact
 
 As the first step, see the [Installation](/guides/installation/) page to learn how to generate the project, and once you do, learn the basics of creating the content and corresponding code in [Creating a Lesson](/guides/creating-content/).
 
-This will give you the basics needed to start compiling your training materials into an interactive onboarding experience. However, you'll likely want to customize that experience to fit your specific needs. For that, TutorialKit offers a range of configuration and theming options, which we have covered in the [Configuration](/guides/configuration) page.
+This will give you the basics needed to start compiling your training materials into an interactive onboarding experience. However, you'll likely want to customize that experience to fit your specific needs. For that, TutorialKit offers a range of configuration and theming options, which we have covered in the [Configuration](/reference/configuration) page.

docs/tutorialkit.dev/src/content/docs/guides/ui.mdx

@@ -40,7 +40,7 @@ The preview displays the application which is a result of applying lesson files
 
 <Image src={uiPreviewImage} alt="TutorialKit's Preview" />
 
-Before your application template's dev server opens a port with something to be displayed, the preview shows the preparation steps such as "Installing dependencies", "Starting HTTP server" to indicate progress to the user. Note that you can customize these steps for each lesson, chapter or part of the tutorial (see: [prepareCommands](/guides/configuration/#preparecommands) reference).
+Before your application template's dev server opens a port with something to be displayed, the preview shows the preparation steps such as "Installing dependencies", "Starting HTTP server" to indicate progress to the user. Note that you can customize these steps for each lesson, chapter or part of the tutorial (see: [prepareCommands](/reference/configuration/#preparecommands) reference).
 
 The preview updates in real-time as the user makes changes to the code, chooses to see the solution or navigates between lessons.
 

docs/tutorialkit.dev/src/content/docs/guides/configuration.mdx renamed to docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx

@@ -127,7 +127,7 @@ For instanceof, here's an example of an info callout.
 
 ### Statuses
 
-The statuses refer to the preview window that shows the status of the [`mainCommand`](../../guides/configuration#maincommand) and [`prepareCommands`](../../guides/configuration#preparecommands) commands.
+The statuses refer to the preview window that shows the status of the [`mainCommand`](/reference/configuration#maincommand) and [`prepareCommands`](/reference/configuration#preparecommands) commands.
 
 ![Statuses](./images/theming-statuses.png)
 
@@ -464,7 +464,7 @@ The tooltip is the small popup that shows up when you hover over an item or when
 
 ### Terminal
 
-The terminal refers to both a [read-only and an interactive terminal](../../guides/configuration#terminal).
+The terminal refers to both a [read-only and an interactive terminal](/reference/configuration#terminal).
 
 ![Terminal](./images/theming-terminal.png)
 

docs/tutorialkit.dev/src/content/docs/reference/theming.mdx

@@ -15,9 +15,12 @@ export interface Options {
    *
    * Set this to false to customize the pages.
    *
+   * Use 'tutorial-only' to only inject the tutorial routes. This is useful
+   * if you want to have a different landing page.
+   *
    * @default true
    */
-  defaultRoutes?: boolean;
+  defaultRoutes?: boolean | 'tutorial-only';
 
   /**
    * The value of the Cross-Origin-Embedder-Policy header for the dev server.
@@ -96,11 +99,13 @@ export default function createPlugin({ defaultRoutes = true, isolation, enterpri
         updateMarkdownConfig(options);
 
         if (defaultRoutes) {
-          injectRoute({
-            pattern: '/',
-            entrypoint: '@tutorialkit/astro/default/pages/index.astro',
-            prerender: true,
-          });
+          if (defaultRoutes !== 'tutorial-only') {
+            injectRoute({
+              pattern: '/',
+              entrypoint: '@tutorialkit/astro/default/pages/index.astro',
+              prerender: true,
+            });
+          }
 
           injectRoute({
             pattern: '[...slug]',

packages/astro/src/index.ts

@@ -173,7 +173,7 @@ export function CodeMirrorEditor({
     view.setState(state);
 
     setEditorDocument(view, theme, language, readOnly, autoFocusOnDocumentChange, doc as TextEditorDocument);
-  }, [doc]);
+  }, [doc?.value, doc?.filePath, doc?.loading]);
 
   return (
     <div className="h-full relative">