@chayns-components/emoji-input
Version:
Input field that supports HTML elements and emojis
71 lines (69 loc) • 3.33 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getElementTextLength = exports.convertTextToHTML = exports.convertHTMLToText = exports.cleanupEmptyIgnoreEmojiSpans = void 0;
var _regex = require("../constants/regex");
var _emoji = require("./emoji");
const convertTextToHTML = text => {
const element = document.createElement('div');
element.style.position = 'absolute';
element.style.opacity = '0';
element.contentEditable = 'true';
element.innerText = text;
document.body.appendChild(element);
let result = element.innerHTML;
document.body.removeChild(element);
result = (0, _emoji.unescapeHTML)(result);
result = result.replace(_regex.HTML_A_TAG_REGEX, '$1').replace(_regex.BB_LC_MENTION_REGEX, '<lc_mention contenteditable="false" id="$1"><span>@</span>$2</lc_mention>\u200B').replace(_regex.BB_NER_IGNORE_REGEX, '<nerIgnore contenteditable="false">$1</nerIgnore>').replace(_regex.BB_NER_REPLACE_REGEX, (_, prefix, type, value, entity) => {
const prefixAttr = prefix ? `prefix="${prefix}" ` : '';
return `<nerReplace contenteditable="false" ${prefixAttr}type="${type}" value="${value}">${entity}</nerReplace>`;
}).replace(_regex.BB_IGNORE_EMOJI_REGEX, '<span class="no-emoji-convert">$1</span>');
return result;
};
exports.convertTextToHTML = convertTextToHTML;
const convertHTMLToText = (text, {
preserveSpaces = false,
shouldSerializeNoEmojiToBBCode = true
} = {}) => {
let result = text;
result = result.replace(_regex.HTML_A_TAG_REGEX, '$1').replace(_regex.HTML_BOLD_REGEX, '[b]$1[/b]').replace(_regex.HTML_LC_MENTION_REGEX, '[lc_mention id="$1"]$2[/lc_mention]').replace(_regex.HTML_NER_IGNORE_REGEX, '[nerIgnore]$1[/nerIgnore]').replace(_regex.HTML_NER_REPLACE_REGEX, (_, prefix, type, value, entity) => {
const prefixAttr = prefix ? `prefix="${prefix}" ` : '';
return `[nerReplace ${prefixAttr}type="${type}" value="${value}"]${entity}[/nerReplace]`;
}).replace(_regex.HTML_NO_EMOJI_REGEX, shouldSerializeNoEmojiToBBCode ? '[ignoreEmoji]$1[/ignoreEmoji]' : '$1');
if (preserveSpaces) {
return result.replace(/ /g, '\u00A0') // non-breaking space
.replace(/\u200B/g, '\u200B'); // zero-width space (sichtbar gemacht)
}
// eslint-disable-next-line no-irregular-whitespace
result = result.replace(/\u200B/g, '');
result = (0, _emoji.escapeHTML)(result);
const element = document.createElement('div');
element.style.position = 'absolute';
element.style.opacity = '0';
element.contentEditable = 'true';
element.innerHTML = result;
document.body.appendChild(element);
result = element.innerText;
document.body.removeChild(element);
return result;
};
exports.convertHTMLToText = convertHTMLToText;
const getElementTextLength = element => {
let textLength = 0;
try {
textLength = convertHTMLToText(element.outerHTML, {
shouldSerializeNoEmojiToBBCode: false
}).length;
} catch (e) {
// Do nothing
}
return textLength;
};
exports.getElementTextLength = getElementTextLength;
const cleanupEmptyIgnoreEmojiSpans = html => {
// Remove empty no-emoji-convert spans that have no text content
return html.replace(/<span class="no-emoji-convert"><\/span>/g, '');
};
exports.cleanupEmptyIgnoreEmojiSpans = cleanupEmptyIgnoreEmojiSpans;
//# sourceMappingURL=text.js.map