or run

npx @tessl/cli init

Version

Tile

Overview

Evals

Files

docs

content-processing.md index.md plugin-configuration.md route-management.md

tile.json

Content Processing

Content loading and processing system that handles JSX, TSX, MD, and MDX files with comprehensive frontmatter parsing, metadata extraction, and localization support.

Capabilities

Content Path Management

Creates and manages content paths for both regular and localized content with priority-based resolution.

/**
 * Creates content path configuration for localized and regular content
 * @param context - Docusaurus load context
 * @param options - Plugin options with path configuration
 * @returns Content paths configuration object
 */
function createPagesContentPaths({
  context,
  options,
}: {
  context: LoadContext;
  options: PluginOptions;
}): PagesContentPaths;

/**
 * Returns array of content paths in priority order (localized first)
 * @param contentPaths - Content paths configuration
 * @returns Array of content paths for scanning
 */
function getContentPathList(contentPaths: PagesContentPaths): string[];

interface PagesContentPaths {
  /** Main content path */
  contentPath: string;
  /** Localized content path */
  contentPathLocalized: string;
}

Usage Example:

import { createPagesContentPaths, getContentPathList } from "@docusaurus/plugin-content-pages";

const contentPaths = createPagesContentPaths({
  context: {
    siteDir: '/path/to/site',
    localizationDir: '/path/to/i18n',
  },
  options: {
    path: 'src/pages',
    id: 'default',
  },
});

const pathList = getContentPathList(contentPaths);
// Returns: ['/path/to/i18n/en/docusaurus-plugin-content-pages', '/path/to/site/src/pages']

Content Loading

Comprehensive content loading system that processes all page files and generates metadata.

/**
 * Loads and processes all page content files
 * @param params - Loading parameters with context, options, and content paths
 * @returns Promise resolving to array of processed page metadata
 */
async function loadPagesContent(
  params: LoadContentParams
): Promise<LoadedContent>;

interface LoadContentParams {
  context: LoadContext;
  options: PluginOptions;
  contentPaths: PagesContentPaths;
}

type LoadedContent = Metadata[];

Usage Example:

const content = await loadPagesContent({
  context,
  options: {
    path: 'src/pages',
    include: ['**/*.{js,jsx,ts,tsx,md,mdx}'],
    exclude: ['**/_*.{js,jsx,ts,tsx,md,mdx}'],
    routeBasePath: '/',
    // ... other options
  },
  contentPaths,
});

// Content contains array of JSXPageMetadata and MDXPageMetadata

Page Metadata Types

Comprehensive metadata structures for both JSX and MDX page types.

interface JSXPageMetadata {
  /** Page type identifier */
  type: 'jsx';
  /** Generated permalink for the page */
  permalink: string;
  /** Aliased source file path */
  source: string;
}

interface MDXPageMetadata extends LastUpdateData {
  /** Page type identifier */
  type: 'mdx';
  /** Generated permalink for the page */
  permalink: string;
  /** Aliased source file path */
  source: string;
  /** Parsed and validated frontmatter */
  frontMatter: PageFrontMatter & {[key: string]: unknown};
  /** Generated edit URL if configured */
  editUrl?: string;
  /** Processed page title */
  title?: string;
  /** Processed page description */
  description?: string;
  /** Whether page is unlisted */
  unlisted: boolean;
}

interface LastUpdateData {
  /** Last update author from git */
  lastUpdatedBy?: string;
  /** Last update timestamp from git */
  lastUpdatedAt?: number;
}

type Metadata = JSXPageMetadata | MDXPageMetadata;

Frontmatter Processing

Frontmatter Validation

Comprehensive frontmatter validation and normalization using Joi schemas.

/**
 * Validates and normalizes page frontmatter
 * @param frontMatter - Raw frontmatter object from markdown
 * @returns Validated and normalized frontmatter
 */
function validatePageFrontMatter(frontMatter: {
  [key: string]: unknown;
}): PageFrontMatter;

Frontmatter Schema

Complete frontmatter configuration options for pages.

interface PageFrontMatter {
  /** Page title override */
  readonly title?: string;
  /** Page description for SEO */
  readonly description?: string;
  /** Page social image URL */
  readonly image?: string;
  /** Custom URL slug */
  readonly slug?: string;
  /** SEO keywords array */
  readonly keywords?: string[];
  /** Custom CSS wrapper class */
  readonly wrapperClassName?: string;
  /** Hide table of contents */
  readonly hide_table_of_contents?: string;
  /** Minimum heading level for TOC */
  readonly toc_min_heading_level?: number;
  /** Maximum heading level for TOC */
  readonly toc_max_heading_level?: number;
  /** Mark page as draft (excluded from production) */
  readonly draft?: boolean;
  /** Mark page as unlisted (accessible but not in navigation) */
  readonly unlisted?: boolean;
  /** Last update metadata override */
  readonly last_update?: FrontMatterLastUpdate;
}

interface FrontMatterLastUpdate {
  /** Override last update date */
  date?: Date | string;
  /** Override last update author */
  author?: string;
}

Frontmatter Usage Example:

---
title: "Custom Page Title"
description: "This is a custom page for demonstrating features"
image: "/img/social-card.png"
slug: "custom-slug"
keywords: ["docusaurus", "pages", "custom"]
wrapperClassName: "custom-page-wrapper"
toc_min_heading_level: 2
toc_max_heading_level: 4
unlisted: false
last_update:
  date: 2023-12-01
  author: "Jane Doe"
---

# Page Content

This is the actual page content...

File Processing

File Type Detection

The plugin automatically detects and processes different file types:

JSX/TSX files: React components that export a default component
MD files: Plain Markdown with frontmatter support
MDX files: Markdown with JSX components and frontmatter support

Permalink Generation

Automatic permalink generation based on file structure and frontmatter:

// File: src/pages/about/team.md
// Generated permalink: /about/team/

// File: src/pages/index.js  
// Generated permalink: /

// File: src/pages/features.mdx with slug: "awesome-features"
// Generated permalink: /awesome-features/

Localization Support

Content processing supports internationalization with localized content paths:

// Main content: src/pages/about.md -> /about/
// French content: i18n/fr/docusaurus-plugin-content-pages/about.md -> /fr/about/

The plugin prioritizes localized content when available and falls back to the main content path.

Version

Tile

Files