Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Doesn't convert unicode emoji chars #43

Open
seahindeniz opened this issue Oct 13, 2020 · 5 comments
Open

Doesn't convert unicode emoji chars #43

seahindeniz opened this issue Oct 13, 2020 · 5 comments

Comments

@seahindeniz
Copy link

Hi

Does the library supports for converting Unicode emojis into custom emojis?

In here, we can see literal wink emoji has transformed but not the Unicode one. It would be very nice if both emojis would look like the same.
image

## 馃槈
## :wink:
@puzrin
Copy link
Member

puzrin commented Oct 13, 2020

Could you add more details, what api do you expect?

@seahindeniz
Copy link
Author

Sure @puzrin
Here, let's say we have this

import emojiToolkit from "emoji-toolkit";
import MarkdownIt from "markdown-it";
import MDEmoji from "markdown-it-emoji/light";

emojiToolkit.emojiSize = "64";

const md = new MarkdownIt({
  html: true,
  linkify: true,
  typographer: true,
});

md.use(MDEmoji);

md.renderer.rules.emoji = function (token, idx) {
  return emojiToolkit.toImage(token[idx].content);
};

const str = `## 馃槈
## :wink:`;

const result = md.render(str);

console.log(result);

Output will be:

<h2 id="%F0%9F%98%89">馃槈</h2>
<h2 id=""><img class="joypixels" alt="馃槈" title=":wink:" src="https://cdn.jsdelivr.net/joypixels/assets/6.0/png/unicode/64/1f609.png"/></h2>

Expected output would be like:

<h2 id=""><img class="joypixels" alt="馃槈" title=":wink:" src="https://cdn.jsdelivr.net/joypixels/assets/6.0/png/unicode/64/1f609.png"/></h2>
<h2 id="-1"><img class="joypixels" alt="馃槈" title=":wink:" src="https://cdn.jsdelivr.net/joypixels/assets/6.0/png/unicode/64/1f609.png"/></h2>

In short term, md.renderer.rules.emoji should also get triggered when a non-literal(Unicode) emoji was placed in the input string

@puzrin
Copy link
Member

puzrin commented Oct 28, 2020

First, you can also override .text rule and apply emojiToolkit.toImage() there, after escape.

Second, it's not clear, how do you plan to define list of suppored unicode chars. Because it may be more wide than :named:

I see some reasonable logic in your suggestion, but still not sure if it can have good solution after more deep investigation.

@necolas
Copy link

necolas commented Dec 21, 2020

I was expecting the same thing and the twemoji package has a parser for this.

This fork introduced the functionality but wasn't published to npm https://github.com/makepanic/markdown-it-unicode-emoji

@carter-thaxton
Copy link

I ran into this same issue, and implemented a very straightforward way to get this behavior. Works great!
See my PR above.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants