viablkit-mdx

Write documentation faster with autocomplete for viabl components, props, and frontmatter — right inside VS Code. No more flipping back to the docs to remember component syntax.

Features

This extension provides rich autocompletion and hover information for viablkit components when editing MDX files.

• Component Autocomplete: Type < to get instant suggestions for viabl components like Card, Callout, Steps, and more.
• Prop Suggestions: Inside a component tag, get intelligent suggestions for available props, their types, and whether they are required.
• Inline Documentation: Read component and prop descriptions without leaving your editor.
• Smart Snippets: Autocompletes component tags with boilerplate structure and default prop choices.

Supported Components

• Layout & Structure: Card, CardGroup, Steps, Step, Accordion, AccordionGroup, Tabs, Tab, Expandable
• Callouts & Badges: Callout, Note, Warning, Danger, Tip, Badge
• Media & UI Elements: DocImage, Tooltip, Update, ResponseField

Requirements

No special requirements or dependencies. Simply install the extension and open an .mdx file.

Extension Settings

This extension works out of the box and does not contribute any custom VS Code settings.

Known Issues

• Complex, deeply nested HTML tags might temporarily suppress intelligent autocomplete triggers until the tag structure is corrected.

Release Notes

0.0.1

• Initial release of the viablkit-mdx extension.
• Added intelligent autocompletion for 19 core viablkit components.
• Added prop suggestions and inline markdown documentation for components.

Documentation

For a complete guide on using viablkit components and building your documentation, please visit our official documentation at viabl.dev/docs.

Feedback & Support

We'd love to hear your thoughts or help you with any issues! Please share your feedback or report bugs on our Feedback Page.