or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

configuration.mdindex.mdlanguage-extensions.mdline-features.mdshell-features.mdsyntax-highlighting.md
tile.json

configuration.mddocs/

Plugin Configuration

Core plugin configuration options for controlling syntax highlighting behavior, CSS classes, and feature toggles.

Capabilities

Plugin Options

Main configuration interface for the gatsby-remark-prismjs plugin.

/**
 * Main plugin configuration options
 */
interface PluginOptions {
  /** CSS class prefix for code blocks (default: "language-") */
  classPrefix?: string;
  /** Separator for inline code language specification */
  inlineCodeMarker?: string | null;
  /** Language alias mappings */
  aliases?: Record<string, string>;
  /** Disable inline code highlighting */
  noInlineHighlight?: boolean;
  /** Global line numbering toggle */
  showLineNumbers?: boolean;
  /** Show invisible characters */
  showInvisibles?: boolean;
  /** Custom language definitions */
  languageExtensions?: LanguageExtension[];
  /** Shell prompt configuration */
  prompt?: PromptConfig;
  /** Additional HTML entity escaping rules */
  escapeEntities?: Record<string, string>;
}

Usage Examples:

// Basic configuration
{
  resolve: `gatsby-remark-prismjs`,
  options: {
    classPrefix: "language-",
    showLineNumbers: false,
    noInlineHighlight: false,
  }
}

// Advanced configuration with custom aliases and prompts
{
  resolve: `gatsby-remark-prismjs`,
  options: {
    classPrefix: "code-",
    inlineCodeMarker: "›",
    aliases: { 
      sh: "bash",
      js: "javascript" 
    },
    showLineNumbers: true,
    prompt: {
      user: "developer",
      host: "workstation",
      global: true
    },
    escapeEntities: {
      '}': '&#125;'
    }
  }
}

Class Prefix Configuration

Controls the CSS class prefix applied to code blocks.

/**
 * CSS class prefix for code blocks
 * @default "language-"
 */
classPrefix?: string;

The classPrefix determines the CSS classes applied to <pre> and <code> elements. For a language like javascript with default prefix, the resulting classes will be language-javascript.

Inline Code Marker

Enables language specification for inline code blocks using a separator character.

/**
 * Separator for inline code language specification
 * @default null
 */
inlineCodeMarker?: string | null;

Usage Example:

// Configuration
inlineCodeMarker: "›"

// In markdown - this inline code will be highlighted as CSS:
// `css›.some-class { background-color: red }`

Language Aliases

Maps alternative language names to standard PrismJS language identifiers.

/**
 * Language alias mappings
 * @default {}
 */
aliases?: Record<string, string>;

Usage Example:

aliases: {
  sh: "bash",
  js: "javascript",
  ts: "typescript"
}

Inline Highlighting Control

Disables syntax highlighting for inline code when set to true.

/**
 * Disable inline code highlighting
 * @default false
 */
noInlineHighlight?: boolean;

Global Line Numbers

Enables line numbering for all code blocks globally.

/**
 * Global line numbering toggle
 * @default false
 */
showLineNumbers?: boolean;

When enabled, all code blocks will show line numbers. Individual blocks can still override this with {numberLines: true} or {numberLines: false} in their metadata.

Show Invisibles

Makes invisible characters (spaces, tabs, line breaks) visible in code blocks.

/**
 * Show invisible characters
 * @default false
 */
showInvisibles?: boolean;

Prompt Configuration

Configures shell command prompt display for bash and shell code blocks.

/**
 * Shell prompt configuration
 */
interface PromptConfig {
  /** Default username for shell prompts */
  user?: string;
  /** Default hostname for shell prompts */
  host?: string;
  /** Apply prompts globally to shell code */
  global?: boolean;
}

Usage Example:

prompt: {
  user: "developer",
  host: "workstation", 
  global: false  // Only show prompts when explicitly requested
}

HTML Entity Escaping

Additional HTML entities to escape beyond the default set.

/**
 * Additional HTML entity escaping rules
 * @default {}
 */
escapeEntities?: Record<string, string>;

Default escaped entities:

  • &&amp;
  • >&gt;
  • <&lt;
  • "&quot;
  • '&#39;

Usage Example:

escapeEntities: {
  '{': '&#123;',
  '}': '&#125;'
}