Emoji

The comark/plugins/emoji plugin converts emoji shortcodes (e.g. :smile:) into their corresponding emoji characters. It ships with a curated set of common emojis, and you can add the full GitHub set or your own shortcodes with the extend option.

Usage

import { parse } from 'comark'
import emoji from 'comark/plugins/emoji'

const result = await parse(content, {
  plugins: [emoji()]
})

I love using Comark :heart: :rocket:

Great job! :thumbsup: :tada:

I love using Comark ❤️ 🚀

Great job! 👍 🎉

With framework components:

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

<template>
  <Comark :plugins="[emoji()]">{{ content }}</Comark>
</template>

import { Comark } from '@comark/react'
import emoji from '@comark/react/plugins/emoji'

<Comark plugins={[emoji()]}>{content}</Comark>

Features

Shortcodes

The plugin ships with 200+ popular emojis across all common categories:

• Smileys & Emotions: :smile: :heart_eyes: :thinking: :cry: :joy:
• People & Gestures: :thumbsup: :clap: :wave: :muscle: :pray:
• Hearts: :heart: :yellow_heart: :blue_heart: :purple_heart: :broken_heart:
• Animals: :dog: :cat: :lion: :bear: :penguin: :fish:
• Food: :pizza: :hamburger: :coffee: :beer: :cake:
• Activities: :soccer: :basketball: :trophy: :guitar: :art:
• Travel: :airplane: :rocket: :car: :train: :ship:
• Objects: :fire: :sparkles: :bulb: :book: :computer:
• Symbols: :white_check_mark: :x: :warning: :star: :100:
• Nature: :tree: :sunflower: :rainbow: :sunny:

Aliases

Some emojis have multiple valid shortcodes:

:thumbsup: or :+1:          → 👍
:thumbsdown: or :-1:        → 👎
:satisfied: or :laughing:   → 😆
:punch: or :facepunch:      → 👊

Custom shortcodes

Use the extend option to add your own shortcodes or override built-in ones. This is handy for team-specific emojis or GitHub custom shortcodes that aren't part of the Unicode set (e.g. :shipit:):

import emoji from 'comark/plugins/emoji'

parse(content, {
  plugins: [
    emoji({
      extend: {
        shipit: '🚀',
        myteam: '🦄',
      },
    }),
  ],
})

Values in extend take precedence over the built-in set, so you can also remap an existing shortcode.

Full emoji set

The built-in set is intentionally small to keep the bundle light. To support the complete GitHub set, install a dataset such as gemoji and pass its map through extend:

import emoji from 'comark/plugins/emoji'
import { nameToEmoji } from 'gemoji'

parse(content, {
  plugins: [emoji({ extend: nameToEmoji })],
})

API

emoji(options?)

Returns a ComarkPlugin that converts emoji shortcodes to characters.

extend

• Type: Record<string, string>
• Optional

A map of shortcode names (without colons) to emoji characters. Added on top of the built-in set; values override built-in shortcodes of the same name.

Returns: ComarkPlugin

Examples

Documentation Markers

:white_check_mark: Completed
:construction: In Progress
:x: Blocked

Status Indicators

Build status: :white_check_mark:
Test coverage: 95% :fire:
Deployment: :rocket:

Task Lists

- :white_check_mark: Setup project
- :construction: Write docs
- :bulb: Add examples