Components

The comark/plugins/components plugin enables Comark block and inline component syntax, plus span wrappers:

• Block: ::name … :: (and single-line shorthand :name[content]{props})
• Inline: :name, :name[content], :name[content]{props}
• Spans: [text] (add {attrs} with the attributes plugin)

The plugin is enabled by default via registerDefaultPlugins. No installation or registration required.

Usage

::alert{type="info"}
Hello **world**
::

Inline :badge[New]{color="blue"} component.

import { parseMarkdown } from 'comark'

const result = await parseMarkdown(`
::alert{type="info"}
Hello
::
`)
// → [ ['alert', { type: 'info' }, 'Hello'] ]

Explicit registration

When default plugins are off, opt in with the plugin directly:

import { parseMarkdown } from 'comark'
import components from 'comark/plugins/components'

const result = await parseMarkdown(content, {
  registerDefaultPlugins: false,
  plugins: [components()],
})

With framework packages, use the same plugin path under the framework scope (plain re-export):

<script setup lang="ts">
import { Markdown } from '@comark/vue'
import components from '@comark/vue/plugins/components'
</script>

<template>
  <Markdown :plugins="[components()]">{{ content }}</Markdown>
</template>

import { Markdown } from '@comark/react'
import components from '@comark/react/plugins/components'

<Markdown plugins={[components()]}>{content}</Markdown>

Disable component syntax

Turn off all defaults (including components):

const result = await parseMarkdown(content, { registerDefaultPlugins: false })

When the components plugin is not active, autoClose also skips component-fence completion (:: closers).

markdown-it / markdown-exit adapter

For hosts that use markdown-it or markdown-exit directly (for example VitePress), use the exported adapter:

import { markdownItComponents } from 'comark/plugins/components'
import { markdownItAttributes } from 'comark/plugins/attributes'

md.use(markdownItComponents)
md.use(markdownItAttributes) // optional; props on components need attributes too

How it works

The plugin registers markdown-exit block and inline rules:

Token → AST conversion is handled by the core token processor (mdc_block_*, mdc_inline_span, mdc_inline_component).