export declare const componentsMdxTemplate = "---\ntitle: \"Components\"\ndescription: \"Explore the full library of built-in components available in your documentation pages.\"\ndate: \"2026-02-19\"\ncategory: \"Components\"\ncategoryOrder: 1\ncategoryIcon: \"blocks\"\norder: 0\n---\n# Components\n\nDoccupine includes a rich set of built-in components you can use directly in your MDX files - no imports needed. Browse the full library below.\n\n<Columns cols={2}>\n  <Card title=\"Headers and Text\" icon=\"heading\" href=\"/headers-and-text\">\n    Headings, paragraphs, bold, italic, links, and other text formatting.\n  </Card>\n  <Card title=\"Lists and Tables\" icon=\"list\" href=\"/lists-and-tables\">\n    Ordered lists, unordered lists, and data tables.\n  </Card>\n  <Card title=\"Code\" icon=\"code\" href=\"/code\">\n    Inline code, fenced code blocks, and syntax highlighting.\n  </Card>\n  <Card title=\"Prompt\" icon=\"sparkles\" href=\"/prompt\">\n    Pre-built AI prompts readers can copy or open in Cursor.\n  </Card>\n  <Card title=\"Callouts\" icon=\"megaphone\" href=\"/callouts\">\n    Highlighted blocks for tips, warnings, and important notes.\n  </Card>\n  <Card title=\"Accordion\" icon=\"chevrons-down\" href=\"/accordion\">\n    Collapsible sections for organizing lengthy content.\n  </Card>\n  <Card title=\"Tabs\" icon=\"panel-top\" href=\"/tabs\">\n    Tabbed interfaces for grouping related content.\n  </Card>\n  <Card title=\"Steps\" icon=\"footprints\" href=\"/steps\">\n    Numbered step-by-step guides and walkthroughs.\n  </Card>\n  <Card title=\"Tree\" icon=\"folder-tree\" href=\"/tree\">\n    File and folder structures with collapsible nodes and keyboard navigation.\n  </Card>\n  <Card title=\"Cards\" icon=\"square\" href=\"/cards\">\n    Visual containers for content, icons, and links.\n  </Card>\n  <Card title=\"Buttons\" icon=\"mouse-pointer-click\" href=\"/buttons\">\n    Action components with variants, sizes, and icons.\n  </Card>\n  <Card title=\"Badges\" icon=\"tag\" href=\"/badges\">\n    Colored labels for statuses, versions, and metadata.\n  </Card>\n  <Card title=\"Tooltips\" icon=\"message-square\" href=\"/tooltips\">\n    Contextual definitions and explanations shown on hover.\n  </Card>\n  <Card title=\"Images and Embeds\" icon=\"image\" href=\"/images-and-embeds\">\n    Images, videos, and embedded content.\n  </Card>\n  <Card title=\"Frames\" icon=\"frame\" href=\"/frames\">\n    Bordered containers with captions for images, videos, and diagrams.\n  </Card>\n  <Card title=\"Icons\" icon=\"smile\" href=\"/icons\">\n    Lucide icons you can use anywhere in your docs.\n  </Card>\n  <Card title=\"Columns\" icon=\"columns-3\" href=\"/columns\">\n    Grid layouts for arranging cards and content side by side.\n  </Card>\n  <Card title=\"Side Panel\" icon=\"panel-right\" href=\"/side-panel\">\n    Pinned right-rail content that replaces a page's table of contents.\n  </Card>\n  <Card title=\"Fields\" icon=\"text-cursor-input\" href=\"/fields\">\n    Property and parameter documentation blocks.\n  </Card>\n  <Card title=\"API Playground\" icon=\"square-terminal\" href=\"/api-playground\">\n    Interactive API reference where readers send real requests and see live responses.\n  </Card>\n  <Card title=\"Update\" icon=\"bell\" href=\"/update\">\n    Changelog blocks with a subscribable RSS feed.\n  </Card>\n  <Card title=\"Color Swatches\" icon=\"palette\" href=\"/color-swatches\">\n    Visual color palette swatches to document your theme colors.\n  </Card>\n  <Card title=\"Mermaid\" icon=\"workflow\" href=\"/mermaid\">\n    Flowcharts, sequence diagrams, and other visualizations from Mermaid syntax.\n  </Card>\n  <Card title=\"Space\" icon=\"move-vertical\" href=\"/space\">\n    Precise vertical or horizontal gaps, with per-breakpoint control.\n  </Card>\n</Columns>";