Fix TypeScript errors and add v0.16.0 release documentation

- Fix mermaid config: change themes to theme
- Add proper TypeScript types to components (CodeGroup, Search, Layout)
- Fix DOM element type casting and null checks
- Remove unused React imports and variables
- Add v0.16.0 release notes to latest-releases.mdx and whats-new.mdx
- All TypeScript checks now pass with 0 errors, 0 warnings, 0 hints

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: phernandez

astro.config.mjs

@@ -9,10 +9,7 @@ import mermaid from 'astro-mermaid';
 // https://astro.build/config
 export default defineConfig({
   integrations: [mdx(), react(), pagefind(), mermaid({
-    themes: {
-      light: 'default',
-      dark: 'base'
-    },
+    theme: 'default',
     mermaidConfig: {
       themeVariables: {
         darkMode: true,

src/components/Breadcrumb.astro

@@ -5,13 +5,11 @@ const currentPath = Astro.url.pathname
 
 // Find the current page in the navigation
 let sectionTitle = ''
-let pageTitle = ''
 
 for (const section of navConfig.sidebar) {
   const item = section.items.find(item => item.href === currentPath)
   if (item) {
     sectionTitle = section.title
-    pageTitle = item.title
     break
   }
 }

src/components/CodeBlock.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import { useState } from 'react'
 
 interface CodeBlockProps {
   code: string

src/components/CodeGroup.tsx

@@ -25,7 +25,7 @@ export default function CodeGroup({ children, className }: CodeGroupProps) {
   const tabs: { label: string; content: React.ReactNode }[] = []
 
   childArray.forEach(child => {
-    if (React.isValidElement(child) && child.props.label) {
+    if (React.isValidElement<CodeTabProps>(child) && child.props.label) {
       tabs.push({
         label: child.props.label,
         content: child.props.children

src/components/InstallationTabs.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import Tabs, { type Tab } from './Tabs'
 import CodeBlock from './CodeBlock'
 

src/components/Search.astro

@@ -261,8 +261,9 @@
 </style>
 
 <script>
-  let searchModal = null;
-  let pagefindUI = null;
+  declare const PagefindUI: any;
+
+  let searchModal: HTMLElement | null = null;
   let searchInitialized = false;
 
   function initSearch() {
@@ -271,7 +272,7 @@
 
     // Initialize Pagefind UI only once
     if (!searchInitialized && typeof PagefindUI !== 'undefined') {
-      pagefindUI = new PagefindUI({
+      new PagefindUI({
         element: "#pagefind-container",
         showImages: false,
         showSubResults: true,
@@ -284,21 +285,21 @@
       searchInitialized = true;
 
       // Focus on search input when modal opens
-      const observer = new MutationObserver((mutations) => {
-        mutations.forEach((mutation) => {
-          if (!searchModal.classList.contains('hidden')) {
-            const searchInput = document.querySelector('.pagefind-ui__search-input');
-            if (searchInput) {
-              searchInput.focus();
-            }
+      const observer = new MutationObserver(() => {
+        if (searchModal && !searchModal.classList.contains('hidden')) {
+          const searchInput = document.querySelector<HTMLInputElement>('.pagefind-ui__search-input');
+          if (searchInput) {
+            searchInput.focus();
           }
-        });
+        }
       });
 
-      observer.observe(searchModal, {
-        attributes: true,
-        attributeFilter: ['class']
-      });
+      if (searchModal) {
+        observer.observe(searchModal, {
+          attributes: true,
+          attributeFilter: ['class']
+        });
+      }
     }
 
     // Open search with Cmd/Ctrl+K
@@ -309,7 +310,7 @@
       }
 
       // Close with Escape
-      if (e.key === 'Escape' && !searchModal.classList.contains('hidden')) {
+      if (e.key === 'Escape' && searchModal && !searchModal.classList.contains('hidden')) {
         closeSearch();
       }
     });
@@ -324,7 +325,8 @@
 
     // Handle click on search results to close modal
     document.addEventListener('click', (e) => {
-      const result = e.target.closest('.pagefind-ui__result');
+      const target = e.target as HTMLElement;
+      const result = target?.closest('.pagefind-ui__result');
       if (result) {
         // Small delay to allow navigation to happen
         setTimeout(() => closeSearch(), 100);
@@ -336,7 +338,7 @@
     searchModal?.classList.remove('hidden');
     // Focus search input after a short delay
     setTimeout(() => {
-      const searchInput = document.querySelector('.pagefind-ui__search-input');
+      const searchInput = document.querySelector<HTMLInputElement>('.pagefind-ui__search-input');
       if (searchInput) {
         searchInput.focus();
         searchInput.value = '';
@@ -346,7 +348,7 @@
 
   function closeSearch() {
     searchModal?.classList.add('hidden');
-    const searchInput = document.querySelector('.pagefind-ui__search-input');
+    const searchInput = document.querySelector<HTMLInputElement>('.pagefind-ui__search-input');
     if (searchInput) {
       searchInput.value = '';
       searchInput.blur();

src/components/SystemArchitectureTabs.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import Tabs, { type Tab } from './Tabs'
 
 export default function SystemArchitectureTabs() {

src/components/TableOfContents.astro

@@ -34,7 +34,7 @@
 
     // If no headings found, hide the TOC
     if (headings.length === 0) {
-      const aside = document.querySelector('aside:has(#toc-list)');
+      const aside = document.querySelector<HTMLElement>('aside:has(#toc-list)');
       if (aside) aside.style.display = 'none';
       return;
     }

src/layouts/DocsLayout.astro

@@ -10,6 +10,10 @@ import { BetaAnnouncementBanner } from '@/components/beta-announcement-banner'
 export interface Props {
   title: string
   description?: string
+  frontmatter?: {
+    title: string
+    description?: string
+  }
 }
 
 const { title, description } = Astro.props.frontmatter || Astro.props

src/layouts/Layout.astro

@@ -23,7 +23,7 @@ const { title = 'Basic Memory', description = 'Basic Memory - Persistent memory
     <title>{!title || title === 'Basic Memory' ? 'Basic Memory' : `${title} - Basic Memory`}</title>
 
     <!-- Umami Analytics -->
-    <script defer src="https://cloud.umami.is/script.js" data-website-id="8d51086e-5c67-401e-97b0-b24706a6d4f3"></script>
+    <script is:inline defer src="https://cloud.umami.is/script.js" data-website-id="8d51086e-5c67-401e-97b0-b24706a6d4f3"></script>
 
     <!-- Theme initialization script - prevents flash of light mode -->
     <script is:inline>
@@ -45,8 +45,9 @@ const { title = 'Basic Memory', description = 'Basic Memory - Persistent memory
       // Preserve sidebar scroll position
       document.addEventListener('click', (e) => {
         const sidebar = document.getElementById('sidebar-nav');
-        if (sidebar && e.target.closest('a')) {
-          sessionStorage.setItem('sidebarScrollPos', sidebar.scrollTop);
+        const target = e.target as HTMLElement;
+        if (sidebar && target?.closest('a')) {
+          sessionStorage.setItem('sidebarScrollPos', String(sidebar.scrollTop));
         }
       });
 
@@ -180,12 +181,13 @@ const { title = 'Basic Memory', description = 'Basic Memory - Persistent memory
         `
         document.body.appendChild(viewer)
 
-        const viewerImg = viewer.querySelector('img')
+        const viewerImg = viewer.querySelector<HTMLImageElement>('img')
         const closeBtn = viewer.querySelector('.image-viewer-close')
 
         // Close on click outside image or close button
         viewer.addEventListener('click', (e) => {
-          if (e.target === viewer || e.target === closeBtn || closeBtn.contains(e.target)) {
+          const target = e.target as Node | null;
+          if (e.target === viewer || e.target === closeBtn || (closeBtn && target && closeBtn.contains(target))) {
             viewer.classList.remove('active')
           }
         })
@@ -204,11 +206,13 @@ const { title = 'Basic Memory', description = 'Basic Memory - Persistent memory
       const { viewer, viewerImg } = createImageViewer()
 
       // Add click handlers to all images
-      const images = document.querySelectorAll('article img')
+      const images = document.querySelectorAll<HTMLImageElement>('article img')
       images.forEach(img => {
         img.addEventListener('click', () => {
-          viewerImg.src = img.src
-          viewerImg.alt = img.alt || ''
+          if (viewerImg) {
+            viewerImg.src = img.src
+            viewerImg.alt = img.alt || ''
+          }
           viewer.classList.add('active')
         })
       })