Analyze codebase for violations and issues

packages/docs-engine-cli/package.json

@@ -20,17 +20,17 @@
     "commander": "^12.0.0",
     "chalk": "^5.3.0",
     "ora": "^8.0.1",
-    "glob": "^10.3.10",
+    "glob": "^11.0.0",
     "unified": "^11.0.5",
     "remark-parse": "^11.0.0",
     "remark-mdx": "^3.0.0",
     "unist-util-visit": "^5.0.0",
-    "p-limit": "^5.0.0"
+    "p-limit": "^7.2.0"
   },
   "devDependencies": {
-    "@types/node": "^20.11.16",
-    "tsup": "^8.0.1",
-    "typescript": "^5.3.3"
+    "@types/node": "^24.10.0",
+    "tsup": "^8.5.0",
+    "typescript": "^5.9.3"
   },
   "keywords": [
     "documentation",

pnpm-workspace.yaml

@@ -0,0 +1,4 @@
+packages:
+  - '.'
+  - 'site'
+  - 'packages/*'

site/package.json

@@ -20,8 +20,8 @@
     "vite": "^7.1.7"
   },
   "dependencies": {
+    "@goobits/docs-engine": "workspace:*",
     "@lucide/svelte": "^0.553.0",
-    "dist": "file:../dist",
     "gray-matter": "^4.0.3",
     "katex": "^0.16.25",
     "mdsvex": "^0.12.6",

site/src/routes/docs/+layout.server.ts

@@ -1,8 +1,8 @@
 import path from 'path';
 import { error } from '@sveltejs/kit';
 import { dev } from '$app/environment';
-import { scanDocumentation } from 'dist/server/index.js';
-import { buildNavigation, createSearchIndex } from 'dist/utils/index.js';
+import { scanDocumentation } from '@goobits/docs-engine/server';
+import { buildNavigation, createSearchIndex } from '@goobits/docs-engine/utils';
 import { logError, createDevError } from '$lib/utils/error-logger';
 import type { LayoutServerLoad } from './$types';
 

site/src/routes/docs/+page.server.ts

@@ -7,7 +7,7 @@ import remarkParse from 'remark-parse';
 import remarkGfm from 'remark-gfm';
 import remarkRehype from 'remark-rehype';
 import rehypeStringify from 'rehype-stringify';
-import { remarkTableOfContents, linksPlugin } from 'dist/plugins/index.js';
+import { remarkTableOfContents, linksPlugin } from '@goobits/docs-engine/plugins';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async () => {

site/src/routes/docs/+page.svelte

@@ -8,7 +8,7 @@
 
   import { page } from '$app/stores';
   import { Home } from '@lucide/svelte';
-  import { DocsLayout } from 'dist/components/index.js';
+  import { DocsLayout } from '@goobits/docs-engine/components';
   import type { PageData } from './$types';
 
   interface Props {

site/src/routes/docs/[...slug]/+page.server.ts

@@ -21,7 +21,7 @@ import {
   collapsePlugin,
   referencePlugin,
   katexPlugin,
-} from 'dist/plugins/index.js';
+} from '@goobits/docs-engine/plugins';
 import { logError, createDevError } from '$lib/utils/error-logger';
 import type { PageServerLoad } from './$types';
 

site/src/routes/docs/[...slug]/+page.svelte

@@ -8,7 +8,7 @@
 
   import { page } from '$app/stores';
   import { Home } from '@lucide/svelte';
-  import { DocsLayout } from 'dist/components/index.js';
+  import { DocsLayout } from '@goobits/docs-engine/components';
   import type { PageData } from './$types';
 
   interface Props {

src/lib/components/CodeCopyHydrator.svelte

@@ -5,11 +5,9 @@
    * Finds all code blocks with data-copy-code attribute and mounts copy buttons
    * Use this in your layout or page to hydrate static HTML
    */
-  import { onMount } from 'svelte';
-  import { browser } from '$app/environment';
   import { mount } from 'svelte';
-  import { afterNavigate } from '$app/navigation';
   import CodeCopyButton from './CodeCopyButton.svelte';
+  import { useHydrator } from '@goobits/docs-engine/utils';
 
   interface Props {
     /** Theme for styling */
@@ -71,17 +69,5 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>

src/lib/components/CodeTabsHydrator.svelte

@@ -5,12 +5,9 @@
    * Finds all .md-code-tabs divs and hydrates them into interactive tabs
    * Use this in your layout or page to hydrate static HTML
    */
-  import { onMount } from 'svelte';
-  import { browser } from '$app/environment';
   import { mount } from 'svelte';
-  import { afterNavigate } from '$app/navigation';
   import CodeTabs from './CodeTabs.svelte';
-  import { createBrowserLogger } from '@goobits/docs-engine/utils';
+  import { createBrowserLogger, escapeHtml, useHydrator } from '@goobits/docs-engine/utils';
 
   const logger = createBrowserLogger('CodeTabsHydrator');
 
@@ -21,16 +18,6 @@
 
   let { theme = 'dracula' }: Props = $props();
 
-  // Simple HTML escape for error messages
-  function escapeHtml(str: string): string {
-    return str
-      .replace(/&/g, '&')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#039;');
-  }
-
   function hydrate() {
     // Use requestAnimationFrame to ensure DOM is fully rendered
     requestAnimationFrame(() => {
@@ -70,17 +57,5 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>

src/lib/components/CollapseHydrator.svelte

@@ -3,10 +3,7 @@
    * Client-side hydrator for collapsible sections
    * Adds animations and accessibility to native <details> elements
    */
-  import { onMount } from 'svelte';
-  import { browser } from '$app/environment';
-  import { afterNavigate } from '$app/navigation';
-  import { createBrowserLogger } from '@goobits/docs-engine/utils';
+  import { createBrowserLogger, useHydrator } from '@goobits/docs-engine/utils';
 
   const logger = createBrowserLogger('CollapseHydrator');
 
@@ -39,19 +36,7 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>
 
 <style>

src/lib/components/FileTreeHydrator.svelte

@@ -5,11 +5,10 @@
    * Finds all .md-filetree divs and renders them with FileTree component
    * Use this in your layout or page to hydrate static HTML
    */
-  import { onMount, mount } from 'svelte';
-  import { browser } from '$app/environment';
-  import { afterNavigate } from '$app/navigation';
+  import { mount } from 'svelte';
   import FileTree from './FileTree.svelte';
   import type { TreeNode } from '@goobits/docs-engine/utils';
+  import { escapeHtml, useHydrator } from '@goobits/docs-engine/utils';
 
   interface Props {
     githubUrl?: string;
@@ -18,16 +17,6 @@
 
   let { githubUrl, allowCopy = true }: Props = $props();
 
-  // Simple HTML escape for error messages
-  function escapeHtml(str: string): string {
-    return str
-      .replace(/&/g, '&')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#039;');
-  }
-
   function hydrate() {
     requestAnimationFrame(() => {
       try {
@@ -75,17 +64,5 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>

src/lib/components/MermaidHydrator.svelte

@@ -5,26 +5,14 @@
    * Finds all .md-mermaid divs and renders them
    * Use this in your layout or page to hydrate static HTML
    */
-  import { onMount } from 'svelte';
-  import { browser } from '$app/environment';
-  import { afterNavigate } from '$app/navigation';
+  import { escapeHtml, useHydrator } from '@goobits/docs-engine/utils';
 
   interface Props {
     theme?: 'default' | 'dark' | 'forest' | 'neutral';
   }
 
   let { theme = 'dark' }: Props = $props();
 
-  // Simple HTML escape for error messages
-  function escapeHtml(str: string): string {
-    return str
-      .replace(/&/g, '&')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#039;');
-  }
-
   let mermaidApi: typeof import('mermaid').default | undefined;
   let initialized = false;
   let modalOpen = $state(false);
@@ -234,19 +222,7 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>
 
 <!-- Fullscreen Modal -->

src/lib/components/OpenAPIHydrator.svelte

@@ -5,12 +5,9 @@
    * Finds all OpenAPI doc elements and mounts OpenAPIDoc components
    * Use this in your layout or page to hydrate static HTML
    */
-  import { onMount } from 'svelte';
-  import { browser } from '$app/environment';
   import { mount } from 'svelte';
-  import { afterNavigate } from '$app/navigation';
   import OpenAPIDoc from './OpenAPIDoc.svelte';
-  import { parseOpenAPISpec, filterEndpointsByPath } from '../utils';
+  import { parseOpenAPISpec, filterEndpointsByPath, useHydrator } from '../utils';
   import { sanitizeHtml } from '../utils/index.js';
 
   interface Props {
@@ -91,19 +88,7 @@
     });
   }
 
-  onMount(() => {
-    if (!browser) return;
-
-    const unsubscribe = afterNavigate(() => hydrate());
-    // Defer hydration to avoid conflicts with Svelte's hydration phase
-    queueMicrotask(() => {
-      requestAnimationFrame(hydrate);
-    });
-
-    return () => {
-      unsubscribe?.();
-    };
-  });
+  useHydrator(hydrate);
 </script>
 
 <style>