@clidey/dory 0.29.0 → 0.30.0

package/src/plugins/llm-txt-generator.ts

@@ -1,186 +0,0 @@
-import type { Plugin } from 'vite';
-import fs from 'fs';
-import path from 'path';
-
-interface LlmTxtGeneratorOptions {
-  docsDir?: string;
-  outputPath?: string;
-}
-
-// Read dory.json to get navigation order (flat list, in order)
-function getNavigationOrder(docsDir: string): string[] {
-  const doryJsonPath = path.join(docsDir, 'dory.json');
-  if (!fs.existsSync(doryJsonPath)) return [];
-  const doryJson = JSON.parse(fs.readFileSync(doryJsonPath, 'utf-8'));
-  const order: string[] = [];
-
-  function walkPages(pages: any[]) {
-    for (const page of pages) {
-      if (typeof page === 'string') {
-        order.push(page);
-      } else if (typeof page === 'object' && page.pages) {
-        walkPages(page.pages);
-      }
-    }
-  }
-
-  if (doryJson.navigation && Array.isArray(doryJson.navigation.tabs)) {
-    for (const tab of doryJson.navigation.tabs) {
-      if (tab.groups && Array.isArray(tab.groups)) {
-        for (const group of tab.groups) {
-          if (group.pages && Array.isArray(group.pages)) {
-            walkPages(group.pages);
-          }
-        }
-      }
-    }
-  }
-  return order;
-}
-
-// Function to parse frontmatter from MDX content
-function parseFrontmatter(content: string) {
-  const frontmatterMatch = content.match(/^---\n([\s\S]*?)\n---\n/);
-  if (!frontmatterMatch) return { data: {}, content };
-
-  const frontmatter = frontmatterMatch[1];
-  const data: Record<string, string> = {};
-
-  frontmatter.split('\n').forEach(line => {
-    const [key, ...valueParts] = line.split(':');
-    if (key && valueParts.length) {
-      const value = valueParts.join(':').trim();
-      data[key.trim()] = value.replace(/^["']|["']$/g, '');
-    }
-  });
-
-  return { data, content: content.slice(frontmatterMatch[0].length) };
-}
-
-// Function to recursively find all MDX files and map by relative path (without .mdx)
-function findMdxFilesMap(dir: string, baseDir: string): Record<string, string> {
-  const files: Record<string, string> = {};
-  const items = fs.readdirSync(dir, { withFileTypes: true });
-
-  for (const item of items) {
-    const fullPath = path.join(dir, item.name);
-    if (item.isDirectory()) {
-      Object.assign(files, findMdxFilesMap(fullPath, baseDir));
-    } else if (item.isFile() && item.name.endsWith('.mdx')) {
-      // Key: relative path without .mdx, with forward slashes
-      let rel = path.relative(baseDir, fullPath).replace(/\\/g, '/');
-      if (rel.endsWith('.mdx')) rel = rel.slice(0, -4);
-      files[rel] = fullPath;
-    }
-  }
-
-  return files;
-}
-
-// Function to clean MDX content for LLM consumption
-function cleanMdxContent(content: string): string {
-  // Remove JSX components but keep their content
-  let cleaned = content
-    // Remove JSX opening/closing tags but keep content
-    .replace(/<(\w+)([^>]*?)>/g, '')
-    .replace(/<\/\w+>/g, '')
-    // Remove code block language specifiers
-    .replace(/```(\w+)/g, '```')
-    // Remove HTML comments
-    .replace(/<!--[\s\S]*?-->/g, '')
-    // Remove excessive whitespace
-    .replace(/\n\s*\n\s*\n/g, '\n\n')
-    // Remove leading/trailing whitespace
-    .trim();
-
-  return cleaned;
-}
-
-// Function to generate LLM text content in dory.json order, then append any extra files
-function generateLlmContent(docsDir: string): string {
-  const navOrder = getNavigationOrder(docsDir);
-  const mdxFilesMap = findMdxFilesMap(docsDir, docsDir);
-  const usedKeys = new Set<string>();
-  let aggregatedContent = '';
-
-  // Output files in navigation order, in order as in dory.json
-  for (const navKey of navOrder) {
-    // Try both with and without "index"
-    let fileKey = navKey;
-    if (mdxFilesMap[fileKey]) {
-      usedKeys.add(fileKey);
-    } else if (mdxFilesMap[`${fileKey}/index`]) {
-      fileKey = `${fileKey}/index`;
-      usedKeys.add(fileKey);
-    } else {
-      continue;
-    }
-    const filePath = mdxFilesMap[fileKey];
-    const rawContent = fs.readFileSync(filePath, 'utf-8');
-    const { data, content } = parseFrontmatter(rawContent);
-    const cleanedContent = cleanMdxContent(content);
-
-    // Add file header
-    aggregatedContent += `\n# ${fileKey}.mdx\n`;
-
-    // Add title if available
-    if (data.title) {
-      aggregatedContent += `## ${data.title}\n\n`;
-    }
-
-    // Add description if available
-    if (data.description) {
-      aggregatedContent += `${data.description}\n\n`;
-    }
-
-    // Add cleaned content
-    aggregatedContent += cleanedContent + '\n\n';
-    aggregatedContent += '---\n\n';
-  }
-
-  // Output any extra files not in navigation order, sorted
-  const extraKeys = Object.keys(mdxFilesMap).filter(k => !usedKeys.has(k)).sort();
-  for (const fileKey of extraKeys) {
-    const filePath = mdxFilesMap[fileKey];
-    const rawContent = fs.readFileSync(filePath, 'utf-8');
-    const { data, content } = parseFrontmatter(rawContent);
-    const cleanedContent = cleanMdxContent(content);
-
-    aggregatedContent += `\n# ${fileKey}.mdx\n`;
-    if (data.title) {
-      aggregatedContent += `## ${data.title}\n\n`;
-    }
-    if (data.description) {
-      aggregatedContent += `${data.description}\n\n`;
-    }
-    aggregatedContent += cleanedContent + '\n\n';
-    aggregatedContent += '---\n\n';
-  }
-
-  // Remove leading newlines for the very first file, so the first file is at the very top
-  return aggregatedContent.replace(/^\n+/, '').trim();
-}
-
-export function llmTxtGenerator(options: LlmTxtGeneratorOptions = {}): Plugin {
-  return {
-    name: 'llm-txt-generator',
-    generateBundle() {
-      const docsDir = options.docsDir || path.join(process.cwd(), 'docs');
-      const aggregatedContent = generateLlmContent(docsDir);
-
-      this.emitFile({
-        type: 'asset',
-        fileName: 'llms.txt',
-        source: aggregatedContent
-      });
-
-      // For logging, count the number of MDX files processed
-      const mdxFilesMap = findMdxFilesMap(docsDir, docsDir);
-      const mdxFilesCount = Object.keys(mdxFilesMap).length;
-
-      console.log(`✅ Generated LLM text file`);
-      console.log(`📄 Processed ${mdxFilesCount} MDX files`);
-      console.log(`📝 Total content size: ${aggregatedContent.length} characters`);
-    }
-  };
-}

package/src/plugins/sanitize.ts

@@ -1,163 +0,0 @@
-import { visit } from 'unist-util-visit';
-
-// This plugin replaces mdxTextExpression nodes with inlineCode for safety.
-export const remarkSafeVars = () => {
-  return (tree: any) => {
-    visit(tree, 'mdxTextExpression', (node: any, index: number | undefined, parent: any) => {
-      if (parent && typeof index === 'number') {
-        parent.children[index] = {
-          type: 'inlineCode',
-          value: node.value
-        };
-      }
-    });
-  };
-};
-
-const KNOWN_COMPONENTS = [
-  // Text components
-  'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'Row', 'Col', 'a', 'img',
-  // Code components  
-  'code', 'CodeGroup', 'pre',
-  // UI components
-  'Accordion', 'AccordionGroup', 'Icon', 'Card', 'CardGroup',
-  'Callout', 'Note', 'Warning', 'Info', 'Tip', 'Check',
-  'Latex', 'API', 'Expandable', 'ResponseField', 'Properties', 'Property',
-  'Steps', 'Step', 'table', 'th', 'td', 'ul', 'ol', 'li',
-  'APIPlayground', 'WebSocketPlayground', 'AsyncAPI', 'Source',
-  // Common HTML elements that should be preserved
-  'div', 'span', 'br', 'hr', 'strong', 'em', 'b', 'i', 'u', 's',
-  'blockquote', 'nav', 'section', 'article', 'header', 'footer', 'main',
-  'aside', 'figure', 'figcaption', 'details', 'summary', 'mark', 'small',
-  'del', 'ins', 'sub', 'sup', 'kbd', 'samp', 'var', 'time', 'abbr',
-  'address', 'cite', 'q', 'dfn'
-];
-
-// Helper: returns true if the given code string is inside a code block (```)
-function isInsideCodeBlock(code: string, idx: number): boolean {
-  // Count the number of ``` before idx
-  const before = code.slice(0, idx);
-  const codeBlockMatches = before.match(/```/g);
-  // Odd number of ``` means inside a code block
-  return codeBlockMatches ? codeBlockMatches.length % 2 === 1 : false;
-}
-
-// Helper: checks if a known component tag has a matching closing tag
-function hasMatchingClosingTag(code: string, tagName: string, openingTagOffset: number): boolean {
-  // Simple approach: look for the next occurrence of either an opening or closing tag of the same type
-  const afterOpening = code.slice(openingTagOffset + `<${tagName}>`.length);
-  
-  // Find the first occurrence of either opening or closing tag
-  const nextOpeningMatch = afterOpening.match(new RegExp(`<${tagName}>`, 'i'));
-  const nextClosingMatch = afterOpening.match(new RegExp(`</${tagName}>`, 'i'));
-  
-  // If no closing tag found at all
-  if (!nextClosingMatch) {
-    return false;
-  }
-  
-  const nextOpeningIndex = nextOpeningMatch ? nextOpeningMatch.index! : Infinity;
-  const nextClosingIndex = nextClosingMatch ? nextClosingMatch.index! : Infinity;
-  
-  // If the closing tag comes before any other opening tag, this tag is properly closed
-  if (nextClosingIndex < nextOpeningIndex) {
-    // Check if the closing tag is inside a code block
-    const closingTagOffset = openingTagOffset + `<${tagName}>`.length + nextClosingIndex;
-    if (isInsideCodeBlock(code, closingTagOffset)) {
-      return false;
-    }
-    return true;
-  }
-  
-  return false; // Another opening tag comes before the closing tag, so this one is not properly closed
-}
-
-// Allow any <[a-z][a-z0-9]*> tag inside code blocks to be left as-is (not parsed as JSX).
-export function preprocessMdxTags() {
-  return {
-    name: 'preprocess-mdx-tags',
-    enforce: 'pre' as const,
-    transform(code: string, id: string) {
-      if (!id.endsWith('.mdx')) return;
-
-      // Remove leading whitespace from code fence blocks
-      let processed = code.replace(/^(\s+)(```\w*)/gm, '$2');
-
-      // Handle self-closing tags first (like <VideoPlayer />)
-      processed = processed.replace(/<([A-Za-z][A-Za-z0-9]*)[^>]*\/>/g, (match, tag, offset) => {
-        // If inside a code block, do not touch
-        if (isInsideCodeBlock(processed, offset)) {
-          return match;
-        }
-        
-        // If unknown component, treat as text
-        if (!KNOWN_COMPONENTS.includes(tag)) {
-          return `\`${match}\``;
-        }
-        return match;
-      });
-
-      // Only replace unrecognized <someTag> with `"<someTag>"` if NOT inside a code block
-      // This regex finds all <tag> occurrences (fixed to handle uppercase)
-      processed = processed.replace(/<([A-Za-z][A-Za-z0-9]*)>/g, (match, tag, offset) => {
-        // If inside a code block, do not touch
-        if (isInsideCodeBlock(processed, offset)) {
-          return match;
-        }
-        
-        // If known component, check if it has a closing tag
-        if (KNOWN_COMPONENTS.includes(tag)) {
-          // If it doesn't have a matching closing tag, treat it as text
-          if (!hasMatchingClosingTag(processed, tag, offset)) {
-            return `\`<${tag}>\``;
-          }
-          // Otherwise, leave as-is for proper JSX parsing
-          return match;
-        }
-        // For unknown components, always treat as text (wrap in backticks)
-        // If already inside backticks, do not wrap again
-        const before = processed.slice(0, offset);
-        const backtickMatches = before.match(/`+/g);
-        const insideBackticks = backtickMatches ? backtickMatches.reduce((acc, s) => acc + s.length, 0) % 2 === 1 : false;
-        if (insideBackticks) {
-          return match;
-        }
-        return `\`<${tag}>\``;
-      });
-
-      // This regex finds all <tag> and </tag> occurrences (fixed to handle uppercase)
-      processed = processed.replace(/<\/?([A-Za-z][A-Za-z0-9]*)>/g, (match, tag, offset) => {
-        // If inside a code block, do not touch
-        if (isInsideCodeBlock(processed, offset)) {
-          return match;
-        }
-        
-        // If known component, check if it has a closing tag (only for opening tags)
-        if (KNOWN_COMPONENTS.includes(tag)) {
-          // Only check for matching closing tag for opening tags
-          if (!match.startsWith('</')) {
-            if (!hasMatchingClosingTag(processed, tag, offset)) {
-              return `\`${match}\``;
-            }
-          }
-          // Otherwise, leave as-is for proper JSX parsing
-          return match;
-        }
-        // For unknown components, always treat as text (wrap in backticks)
-        // If already inside backticks, do not wrap again
-        const before = processed.slice(0, offset);
-        const backtickMatches = before.match(/`+/g);
-        const insideBackticks = backtickMatches ? backtickMatches.reduce((acc, s) => acc + s.length, 0) % 2 === 1 : false;
-        if (insideBackticks) {
-          return match;
-        }
-        return `\`${match}\``;
-      });
-
-      return {
-        code: processed,
-        map: null,
-      };
-    },
-  };
-}

package/src/plugins/unified-mdx-plugin.ts

@@ -1,35 +0,0 @@
-import type { Plugin } from 'vite';
-import { preprocessMdxContent } from '../mdx/processor';
-
-/**
- * Unified MDX preprocessing plugin for Vite.
- * This plugin ensures that ALL MDX preprocessing goes through the same pipeline
- * as the CLI verify:content command.
- * 
- * This is the SINGLE SOURCE OF TRUTH for MDX preprocessing.
- * Any changes to MDX processing should be made in src/mdx/processor.ts
- */
-export function unifiedMdxPreprocessor(): Plugin {
-  return {
-    name: 'unified-mdx-preprocessor',
-    enforce: 'pre', // Must run before the MDX plugin
-    async transform(code: string, id: string) {
-      if (!id.endsWith('.mdx')) return;
-      
-      // Process through the unified preprocessing pipeline
-      const result = await preprocessMdxContent(code, id);
-
-      if (!result.success) {
-        // Throw the error to stop the build
-        throw result.error;
-      }
-
-      // Return the preprocessed content
-      // The actual MDX compilation will be handled by @mdx-js/rollup plugin
-      return {
-        code: result.processedContent || code,
-        map: null
-      };
-    }
-  };
-}

package/src/theme.scss

@@ -1,72 +0,0 @@
-:root {
-    font-synthesis: none;
-    text-rendering: optimizeLegibility;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-
-    // Brand colors (dynamically set from dory.json via loadColors())
-    // These variables are set at runtime:
-    // --brand-primary: primary color
-    // --brand-light: light mode accent
-    // --brand-dark: dark mode accent
-    // --brand-foreground: legacy/fallback (set to primary)
-
-    // Default fallback colors (will be overridden by loadColors())
-    --brand-foreground: #0ea5e9;
-    --brand-primary: #0ea5e9;
-    --brand-light: #38bdf8;
-    --brand-dark: #0284c7;
-
-    // ShadCN/clidey/ux compatible primary color
-    // Using light color for light mode
-    --primary: var(--brand-light);
-    --primary-rgb: var(--brand-light-rgb);
-    
-    --ring: rgba(0, 0, 0, 0.1);
-}
-
-// Dark mode overrides
-:root.dark {
-    // Use dark color for dark mode
-    --primary: var(--brand-dark);
-    --primary-rgb: var(--brand-dark-rgb);
-
-    --ring: rgba(255, 255, 255, 0.1);
-}
-  
-article h2:first-of-type {
-    display: none;
-}
-
-article hr:first-of-type {
-    display: none;
-}
-
-article img {
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-}
-
-[data-testid="header-actions"] button,
-[data-slot="dropdown-menu-content"] {
-    border-color: var(--ring);
-}
-
-[data-slot="search-input-wrapper"] {
-    font-size: 12px;
-    outline: none;
-}
-
-[data-slot="search-input"] {
-    font-size: 12px;
-}
-
-[data-slot="search-input-wrapper"]:focus-within {
-    outline: none !important;
-}
-
-[role="dialog"] [data-slot="search-input-wrapper"]:focus-within {
-    outline: none !important;
-    border: 0px;
-    box-shadow: none !important;
-}

package/src/types/config.ts

@@ -1,47 +0,0 @@
-/**
- * TypeScript interfaces for dory.json configuration
- */
-
-export interface DoryColors {
-  primary: string;
-  light: string;
-  dark: string;
-}
-
-export interface DoryFonts {
-  family: string;
-  source: string;
-  format: string;
-}
-
-export interface DoryLogo {
-  light: string;
-  dark: string;
-}
-
-export interface DoryNavigationPage {
-  [key: string]: string;
-}
-
-export interface DoryNavigationGroup {
-  group: string;
-  pages: string[];
-}
-
-export interface DoryNavigationTab {
-  tab: string;
-  groups: DoryNavigationGroup[];
-}
-
-export interface DoryNavigation {
-  tabs: DoryNavigationTab[];
-}
-
-export interface DoryConfig {
-  name: string;
-  favicon: string;
-  colors?: DoryColors;
-  fonts?: DoryFonts;
-  navigation: DoryNavigation;
-  logo: DoryLogo;
-}

package/src/ui/header.tsx

@@ -1,91 +0,0 @@
-import classNames from 'classnames';
-import { useEffect, useMemo, useState } from 'preact/hooks';
-import { Link } from 'wouter-preact';
-import { usePathname } from 'wouter-preact/use-browser-location';
-import docsConfig from '../../docs/dory.json' with { type: 'json' };
-import type { DoryConfig } from '../types/config';
-import { MobileSearch, Search } from '../components/search';
-import { ALL_NAVIGATION } from '../components/store';
-import { MobileNavigation } from './mobile-navigation';
-import { ModeToggle } from '@clidey/ux';
-
-const config = docsConfig as DoryConfig;
-
-function TopLevelNavItem({ href, children, isActive }: { href: string; children: string; isActive?: boolean }) {
-  return (
-    <li>
-      <Link
-        to={href}
-        className={classNames(
-          "text-xs transition hover:opacity-80",
-          {
-            "text-brand-foreground": isActive,
-          },
-        )}
-      >
-        {children}
-      </Link>
-    </li>
-  );
-}
-
-export function Header({ className }: { className?: string }) {
-  const [isScrolled, setIsScrolled] = useState(false);
-  const pathname = usePathname();
-
-  const { light, dark } = useMemo(() => {
-    return { light: config.logo.light, dark: config.logo.dark };
-  }, []);
-
-  useEffect(() => {
-    function onScroll() {
-      setIsScrolled(window.scrollY > 0);
-    }
-    onScroll();
-    window.addEventListener('scroll', onScroll, { passive: true });
-    return () => {
-      window.removeEventListener('scroll', onScroll);
-    }
-  }, []);
-
-  return (
-    <header
-      className={classNames(
-        'sticky top-0 z-50 flex flex-none flex-wrap items-center justify-between bg-white px-4 py-5 shadow-md shadow-gray-900/5 sm:px-6 lg:px-8 dark:shadow-none',
-        className,
-        {
-          'dark:bg-gray-900/95 dark:backdrop-blur-sm dark:[@supports(backdrop-filter:blur(0))]:bg-neutral-900/75': isScrolled,
-          'dark:bg-transparent': !isScrolled,
-        },
-      )}
-    >
-      <div className="relative flex justify-between gap-6 sm:gap-8 md:grow items-center w-full px-4">
-        <div className="flex items-center grow gap-2">
-          <img src={`/${light}`} alt="logo" className="w-8 hidden dark:block" />
-          <img src={`/${dark}`} alt="logo" className="w-8 block dark:hidden" />
-          <h1 className="text-base lg:text-2xl font-bold">{config.name}</h1>
-        </div>
-        <nav className="hidden md:block">
-          <ul role="list" className="flex items-center gap-8">
-            {ALL_NAVIGATION.map((tab) => (
-              <TopLevelNavItem 
-                key={tab.title} 
-                href={tab.groups[0].pages[0].href}
-                isActive={pathname.startsWith(`/${tab.groups[0].pages[0].href.split('/')[1]}`)}
-              >
-                {tab.title}
-              </TopLevelNavItem>
-            ))}
-          </ul>
-        </nav>
-        <div className="hidden md:block md:h-5 md:w-px md:bg-zinc-900/10 md:dark:bg-white/15" />
-        <div className="flex items-center gap-3" data-testid="header-actions">
-          <MobileSearch />
-          <Search />
-          <ModeToggle data-testid="mode-toggle" />
-          <MobileNavigation />
-        </div>
-      </div>
-    </header>
-  );
-}