Sample Component

Overview

This is a sample component file demonstrating the complete frontmatter specification for EcoOS component documentation.

Purpose

This file serves as:

1. A template for creating new component documentation
2. A test case for the frontmatter parsing system
3. A reference for required and optional fields

Frontmatter Fields Used

This component includes all recommended frontmatter fields:

• componentName: "Sample Component" (displayed on card)
• description: Brief description shown on component card
• category: "Sample Components" (for grouping)
• version: "1.0.0" (semantic versioning)
• lastModified: "2025-01-15" (YYYY-MM-DD format)
• CID: Unique component identifier
• documentType: "Specification"
• registryUrl: Link to component marketplace
• tags: Keywords for search engines

Usage

To use this as a template:

1. Copy this file
2. Rename to your component name
3. Update all frontmatter fields
4. Replace content with your component documentation
5. Run npm run docs:generate-components

Testing

This component can be used to test:

• Frontmatter parsing
• Category grouping
• Description display
• Metadata extraction
• Link generation

Expected Behavior

When processed by the generate-components script:

• Should appear in "Sample Components" category
• Should display description on component card
• Should show version "1.0.0"
• Should show last modified date "2025-01-15"
• Should be clickable and navigate to this page

Verification

After running npm run docs:generate-components, check:

1. .vitepress/components.json includes this component
2. All frontmatter fields are correctly extracted
3. Component appears on /components/ page
4. Component is grouped under "Sample Components"
5. Description is visible on the card