Skip to main content
Glama
pinzonjulian

Stimulus Docs MCP Server

by pinzonjulian

reference-css-classes

Access documentation for managing CSS classes in Stimulus controllers to control styling and visual states dynamically.

Instructions

CSS classes API reference - learn how to dynamically manage CSS classes in Stimulus controllers for styling and visual state management

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault

No arguments

Implementation Reference

  • The core handler function for the 'reference-css-classes' tool (shared across all documentation tools). It reads the content of the specific markdown file (reference/css_classes.md) using readMarkdownFile and returns it formatted as an MCP content block, with fallback error handling.
    async () => {
      try {
        const content = await readMarkdownFile(path.join(folder, file));
        return {
          content: [
            {
              type: "text",
              text: content
            }
          ]
        };
      } catch (error) {
        const errorMessage = error instanceof Error ? error.message : String(error);
        return {
          content: [
            {
              type: "text",
              text: `Error reading ${file}: ${errorMessage}`
            }
          ]
        };
      }
    }
  • src/index.ts:17-45 (registration)
    Registration code that dynamically creates and registers the MCP tool 'reference-css-classes' (and all other doc tools) using server.tool(), based on entries from docFiles config.
    docFiles.forEach(({ folder, file, name, description }) => {
      server.tool(
        name,
        description,
        async () => {
          try {
            const content = await readMarkdownFile(path.join(folder, file));
            return {
              content: [
                {
                  type: "text",
                  text: content
                }
              ]
            };
          } catch (error) {
            const errorMessage = error instanceof Error ? error.message : String(error);
            return {
              content: [
                {
                  type: "text",
                  text: `Error reading ${file}: ${errorMessage}`
                }
              ]
            };
          }
        }
      );
    });
  • src/config.ts:75-79 (registration)
    Configuration object in docFiles array that defines the 'reference-css-classes' tool: its name, description, and source markdown file path.
    {
      folder: 'reference', file: 'css_classes.md',
      name: 'reference-css-classes',
      description: 'CSS classes API reference - learn how to dynamically manage CSS classes in Stimulus controllers for styling and visual state management'
    },
  • TypeScript interface defining the structure of documentation tool configurations used for all doc tools including 'reference-css-classes'.
    export interface DocFile {
      folder: string;
      file: string;
      name: string;
      description: string;
  • Helper function readMarkdownFile used by the tool handler to load the content of reference/css_classes.md, supporting cache, GitHub fetch, and local fallback.
    export async function readMarkdownFile(filename: string): Promise<string> {
      const filePath = path.join(docsFolder, filename);
      if (!filePath.startsWith(docsFolder)) {
        throw new Error("Invalid file path");
      }
      
      // Get current commit info if we don't have it yet
      if (!mainBranchInfo) {
        try {
          const commitInfo = await fetchMainBranchInformation();
          const cacheKey = `${commitInfo.sha.substring(0, 7)}-${commitInfo.timestamp}`;
          mainBranchInfo = {
            ...commitInfo,
            cacheKey
          };
        } catch (shaError) {
          console.error('Failed to get GitHub commit info, falling back to direct fetch');
        }
      }
      
      // Try to read from cache first if we have commit info
      if (mainBranchInfo) {
        const cachedFilePath = path.join(cacheFolder, mainBranchInfo.cacheKey, filename);
        try {
          const content = await fs.promises.readFile(cachedFilePath, "utf-8");
          console.error(`Using cached content for ${mainBranchInfo.cacheKey}: ${filename}`);
          return content;
        } catch (cacheError) {
          // Cache miss, continue to fetch from GitHub
        }
      }
      
      // Fetch from GitHub
      try {
        return await fetchFromGitHub(filename, mainBranchInfo?.cacheKey);
      } catch (githubError) {
        console.error(`GitHub fetch failed: ${githubError}, attempting to read from local files...`);
        
        // Fallback: read from local files
        try {
          return await fs.promises.readFile(filePath, "utf-8");
        } catch (localError) {
          const githubErrorMessage = githubError instanceof Error ? githubError.message : String(githubError);
          const localErrorMessage = localError instanceof Error ? localError.message : String(localError);
          throw new Error(`Failed to read file from GitHub (${githubErrorMessage}) and locally (${localErrorMessage})`);
        }
      }
    }
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description carries the full burden of behavioral disclosure. It mentions 'dynamically manage CSS classes' but does not specify whether this is a read-only reference, an interactive tool, or what operations it supports. It lacks details on permissions, side effects, rate limits, or output format, leaving significant gaps for a tool with no annotation coverage.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a single, clear sentence that efficiently states the tool's domain (CSS classes API reference) and context (Stimulus controllers for styling and visual state management). It is front-loaded with the main purpose, though it could be slightly more concise by removing 'learn how to' for directness.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given no annotations, no output schema, and 0 parameters, the description is incomplete. It fails to explain what the tool returns or how it behaves operationally (e.g., is it a documentation lookup, a simulation tool?). For a tool in a reference-heavy sibling set, more clarity on functionality and output is needed.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The input schema has 0 parameters with 100% coverage, so no parameter documentation is needed. The description does not add parameter semantics, but this is acceptable given the schema completeness. A baseline of 4 is appropriate as the tool has no parameters to document.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose3/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description states the tool provides an 'API reference' for 'dynamically manage CSS classes in Stimulus controllers', which gives a general purpose but lacks specificity about what the tool actually does (e.g., list classes, add/remove classes, query classes). It distinguishes from siblings by focusing on CSS classes rather than other Stimulus concepts, but the verb 'learn how to' is vague about the tool's function.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies usage is for 'styling and visual state management' in Stimulus controllers, but provides no explicit guidance on when to use this tool versus alternatives like 'reference-actions' or 'reference-targets'. There is no mention of prerequisites, exclusions, or specific scenarios for this tool.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/pinzonjulian/stimulus-docs-mcp-server'

If you have feedback or need assistance with the MCP directory API, please join our Discord server