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 likeCard,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-mdxextension. - 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.