docsify/src/core/render/emojify.js
John Hildenbiddle 35002c92b7
feat: Native emoji w/ image-based fallbacks and improved parsing (#1746)
* Render native emoji with image fallback

Fix #779

* Deprecate emoji plugin

* Add emoji tests

* Remove console.log statement

* Fix emoji image alt attribute

* Set nativeEmoji to false by default (non-breaking)

* Fix parsing emoji in HTML comments and script tags

* Add nativeEmoji and update noEmoji details

* Add Emoji plugin deprecation notice

* Fix ESLint issues

* Create build:emoji task

- Auto-generate emoji data from GitHub API
- Auto-generate emoji markdown for website
- Add emoji page to navigation

* Fix rendering of GitHub emoji without unicode

* Adjust and match size of native and image emoji

* Update emoji test snapshot

* Update docs test snapshot

* Fix ci/codesandbox error

* Update native emoji font-stack

* Fix rendering of native multi-character emoji

* Kick GitHub Workflow

* Replace rollup’s uglify plugin with terser

* Switch “npm ci” instead of “npm i” for stability

* Change emoji data from default to named export

* Revert "Replace rollup’s uglify plugin with terser"

This reverts commit 7ba85136361c72839516900d91cca806fac94fee.

* Revert "Switch “npm ci” instead of “npm i” for stability"

This reverts commit d52b476a387250740d934e8fd7df7ba274dd17a0.

* Revert "Change emoji data from default to named export"

This reverts commit 3f2dd467cf9c7a74d8c53c2ee52cc63837b00a3c.

* Specify codesandbox template and node version

* Update codesandbox config

* Revert "Revert "Replace rollup’s uglify plugin with terser""

This reverts commit e06fed49f0383c485e01f1758228849ad0085bc8.

* Revert "Revert "Revert "Replace rollup’s uglify plugin with terser"""

This reverts commit 27d49521f61976dedcbbf210e1811839853e0e47.

* Update codesandbox config

* Revert "Update codesandbox config"

This reverts commit 5120dd23d45fbd4b2c893db33acbf7014e57c023.

* Fix codesandbox uglify error

* Emoji docs tweaks

* Restore and update emoji plugin code

* Restore and update emoji plugin docs

* Prettier updates

* Match lowercase shortcodes only

Co-authored-by: Koy Zhuang <369491420@qq.com>
2022-03-05 22:25:09 -06:00

46 lines
1.4 KiB
JavaScript

import emojiData from './emoji-data.js';
function replaceEmojiShorthand(m, $1, useNativeEmoji) {
const emojiMatch = emojiData.data[$1];
let result = m;
if (emojiMatch) {
if (useNativeEmoji && /unicode/.test(emojiMatch)) {
const emojiUnicode = emojiMatch
.replace('unicode/', '')
.replace(/\.png.*/, '')
.split('-')
.map(u => `&#x${u};`)
// Separate multi-character emoji with zero width joiner sequence (ZWJ)
// Hat tip: https://about.gitlab.com/blog/2018/05/30/journey-in-native-unicode-emoji/#emoji-made-up-of-multiple-characters
.join('&zwj;')
.concat('&#xFE0E;');
result = `<span class="emoji">${emojiUnicode}</span>`;
} else {
result = `<img src="${emojiData.baseURL}${emojiMatch}.png" alt="${$1}" class="emoji" loading="lazy">`;
}
}
return result;
}
export function emojify(text, useNativeEmoji) {
return (
text
// Mark colons in tags
.replace(
/<(code|pre|script|template)[^>]*?>[\s\S]+?<\/(code|pre|script|template)>/g,
m => m.replace(/:/g, '__colon__')
)
// Mark colons in comments
.replace(/<!--[\s\S]+?-->/g, m => m.replace(/:/g, '__colon__'))
// Replace emoji shorthand codes
.replace(/:([a-z0-9_\-+]+?):/g, (m, $1) =>
replaceEmojiShorthand(m, $1, useNativeEmoji)
)
// Restore colons in tags and comments
.replace(/__colon__/g, ':')
);
}