@happeouikit/content-renderer 3.0.1 → 3.0.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## 3.0.4
+
+- [Fixed] ContentRenderer should now render content without applying links to domain-like text.
+- [Updated] Updated ContentRenderer unit test with Testing Linkify hyper-link Features.
+
+## 3.0.3
+
+- [Added] Added prop `forceDefaultLinkTarget` that will force external links with `target="_blank"` and removes `target` from internal links.
+
+## 3.0.2
+
+- [Fixed] ContentRenderer now applies styling options from Pages
+
 ## 3.0.1
 
 - [Fixed] ContentRenderer should now deal with all kinds of xss

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@happeouikit/content-renderer",
-  "version": "3.0.1",
+  "version": "3.0.4",
   "description": "Rendering html and markdown content",
   "main": "dist/index.js",
   "module": "src/index.js",
@@ -34,5 +34,6 @@
   },
   "publishConfig": {
     "access": "public"
-  }
+  },
+  "gitHead": "592299ab27c858a3540e4614ce4c09dec84a6fcc"
 }

package/dist/ContentRenderer.js

@@ -1,273 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteral(["\n            margin-top: 8px;\n           "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteral(["\n             margin: 30px -150px;\n             width: calc(100% + 300px) !important;\n             max-width: none;\n           "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteral(["\n           margin: 30px -150px 10px 30px;\n           float: right;\n           max-width: 75%;\n         "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n           margin: 30px 30px 10px -150px;\n           float: left;\n           max-width: 75%;\n         "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["      \n         max-width: 100%;\n       "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-/* eslint-disable no-param-reassign */
-
-/**
- *
- * ContentRenderer
- *
- */
-import React, { useRef, useEffect, useState, useCallback, useMemo } from "react";
-import ReactDOM from "react-dom";
-import PropTypes from "prop-types";
-import styled, { css } from "styled-components";
-import loadjs from "loadjs";
-import { CopyToClipboardButton } from "@happeouikit/copy-to-clipboard-button";
-import { BodyUI, sansFamily } from "@happeouikit/typography";
-import { margin200, media, padding200 } from "@happeouikit/layout";
-import { active, gray04, gray07, gray09, lighten, warn } from "@happeouikit/colors";
-import { toHtml, loadCodeFont, decodeHtmlEntities, removeSpecialCharacters, toSafeText } from "./utils";
-import { ELEMENT_TYPE_PRE, ELEMENT_TYPE_CODE, HIGHLIGHJS_CSS, HIGHLIGHJS_JS, CODE_BLOCK_AVAILABLE_LANGUAGES } from "./constants";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-
-var ContentRenderer = function ContentRenderer(_ref) {
-  var content = _ref.content,
-      type = _ref.type,
-      _ref$widgetType = _ref.widgetType,
-      widgetType = _ref$widgetType === void 0 ? "post" : _ref$widgetType,
-      _ref$headerFont = _ref.headerFont,
-      headerFont = _ref$headerFont === void 0 ? sansFamily : _ref$headerFont,
-      _ref$bodyFont = _ref.bodyFont,
-      bodyFont = _ref$bodyFont === void 0 ? sansFamily : _ref$bodyFont,
-      createAnchors = _ref.createAnchors,
-      useHashAutoscroll = _ref.useHashAutoscroll,
-      _ref$hashAutoscrollTo = _ref.hashAutoscrollTopMargin,
-      hashAutoscrollTopMargin = _ref$hashAutoscrollTo === void 0 ? 0 : _ref$hashAutoscrollTo,
-      decodeHtmlEntitiesOnRender = _ref.decodeHtmlEntitiesOnRender;
-  var element = useRef({});
-
-  var _useState = useState([]),
-      _useState2 = _slicedToArray(_useState, 2),
-      copyBtns = _useState2[0],
-      setCopyBtns = _useState2[1]; // Autoscroll to hashes
-
-
-  var scrollAndHighlightHash = useCallback(function () {
-    try {
-      var hash = window.location.hash;
-
-      if (hash) {
-        var hashEl = element.current.querySelector(hash);
-
-        if (hashEl) {
-          setTimeout(function () {
-            window.scrollTo({
-              top: hashEl.getBoundingClientRect().top - hashAutoscrollTopMargin,
-              behavior: "smooth"
-            });
-            hashEl.classList.add("highlight");
-            setTimeout(function () {
-              hashEl.classList.remove("highlight");
-            }, 5000);
-          }, 500);
-        }
-      }
-    } catch (error) {
-      /* In some cases the hash may be cause this function to fail. In this case, handle and do nothing */
-    }
-  }, [hashAutoscrollTopMargin]);
-  useEffect(function () {
-    if (!element.current) return;
-    var headerElems = createAnchors ? element.current.querySelectorAll("h1, h2, h3, h4, h5, h6") : [];
-
-    if (headerElems.length > 0) {
-      headerElems.forEach(function (header) {
-        var _header$textContent = header.textContent,
-            textContent = _header$textContent === void 0 ? "" : _header$textContent;
-
-        if (textContent.length > 0) {
-          header.id = header.id || removeSpecialCharacters(textContent.toLowerCase().replace(/\s/g, "-"));
-        }
-      });
-    }
-
-    var blockElems = element.current.querySelectorAll(ELEMENT_TYPE_PRE);
-
-    if (blockElems.length > 0) {
-      if (!loadjs.isDefined("highlightjs")) {
-        loadCodeFont();
-        loadjs([].concat(_toConsumableArray(HIGHLIGHJS_JS), _toConsumableArray(HIGHLIGHJS_CSS)), "highlightjs");
-      }
-
-      loadjs.ready("highlightjs", function () {
-        // highlight.js register only languages we want to support?
-        window.hljs.configure({
-          languages: CODE_BLOCK_AVAILABLE_LANGUAGES,
-          useBr: true
-        });
-        blockElems.forEach(function (elem) {
-          var plainCode = elem.innerText; // Take the inner content and put inside single code block
-          // This will ensure nice readability.
-          // Needs to be done since editor will generate multiple lines for code for ease of editing
-
-          var codeBlock = document.createElement(ELEMENT_TYPE_CODE);
-          var decodedText = decodeHtmlEntities(plainCode);
-          codeBlock.textContent = decodedText; // Done like this to prevent xss
-
-          elem.innerHTML = ""; // Clear content so we can set just the single code block there
-
-          elem.appendChild(codeBlock);
-          window.hljs.highlightBlock(elem);
-        });
-        setCopyBtns(function (prevState) {
-          return [].concat(_toConsumableArray(prevState), _toConsumableArray(blockElems));
-        });
-      });
-    }
-
-    setCopyBtns(_toConsumableArray(headerElems));
-
-    if (useHashAutoscroll) {
-      scrollAndHighlightHash();
-    }
-  }, [element, createAnchors, useHashAutoscroll, scrollAndHighlightHash]);
-  var safeText = useMemo(function () {
-    var lowercaseType = type && typeof type === "string" ? type.toLowerCase() : "html";
-    var transformedContent = lowercaseType === "text" ? toSafeText("<p>".concat(content, "</p>")) : toHtml(content, lowercaseType);
-
-    if (decodeHtmlEntitiesOnRender) {
-      transformedContent = decodeHtmlEntities(transformedContent);
-    }
-
-    return transformedContent;
-  }, [content, type, decodeHtmlEntitiesOnRender]); // Use dangerouslySetInnerHTML as there might be nested <p>'s header etc
-  // This requires that all content is run through the toSafeText filter
-  // before displaying. This will run it through xss filter.
-
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Wrapper, {
-      className: "content-renderer",
-      ref: element,
-      widgetType: widgetType,
-      headerFont: headerFont,
-      bodyFont: bodyFont,
-      createAnchors: createAnchors,
-      dangerouslySetInnerHTML: {
-        __html: safeText
-      }
-    }), copyBtns.map(function (el) {
-      var clipboardContent = el.textContent || "";
-
-      if (el.tagName !== ELEMENT_TYPE_PRE) {
-        clipboardContent = "".concat(window.location.href.split("#")[0], "#").concat(el.id);
-      } // eslint-disable-next-line no-control-regex
-
-
-      clipboardContent = removeSpecialCharacters(clipboardContent);
-      return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/_jsx(BtnContainer, {
-        className: "content-copy-btn",
-        children: /*#__PURE__*/_jsx(CopyToClipboardButton, {
-          clipboardContent: clipboardContent
-        })
-      }), el);
-    })]
-  });
-};
-
-var BtnContainer = styled.div.withConfig({
-  displayName: "ContentRenderer__BtnContainer",
-  componentId: "sc-1mleu9k-0"
-})(["display:inline-flex;margin-left:", ";button{opacity:0;transition-property:opacity;transition-duration:150ms;transition-timing-function:ease-in;}button:hover,button:active,button:focus{opacity:1 !important;}div p{font-size:12px;line-height:16px;}"], margin200);
-var Wrapper = styled(BodyUI).attrs({
-  as: "div"
-}).withConfig({
-  displayName: "ContentRenderer__Wrapper",
-  componentId: "sc-1mleu9k-1"
-})(["", " h1.highlight,h2.highlight,h3.highlight,h4.highlight,h5.highlight,h6.highlight{border-radius:6px;position:relative;:after{content:\" \";position:absolute;top:-8px;bottom:-8px;left:-8px;right:-8px;border-radius:6px;border:5px solid ", ";}}pre{border-radius:4px;background:", ";padding:8px;margin-bottom:10px;overflow:auto;white-space:pre;position:relative;overflow:visible;*:not(p){font-weight:inherit;font-family:\"IBM Plex Mono\",monospace !important;}.content-copy-btn{position:absolute;top:0;right:0;padding:", " 0;}:hover button{opacity:1;}}.mention{border-radius:0.2em;background-color:#fff5cc;border:1px solid #fff5cc;color:#0f1621;font-weight:400;&:hover{text-decoration:none;border:1px solid #fabd24;}}.extraMention{cursor:inherit;}", " ", ""], function (_ref2) {
-  var createAnchors = _ref2.createAnchors;
-  return createAnchors ? "\n    h1, h2, h3, h4, h5, h6 {\n      display: flex;\n      align-items: center;\n      :hover button {\n        opacity: 0.4;\n      }\n    }\n  " : "";
-}, lighten(warn, 0.8), gray09, padding200, function (_ref3) {
-  var widgetType = _ref3.widgetType;
-  return widgetType === "page" ? "" : "\n    * {\n      font-family: ".concat(sansFamily, " !important;\n    }\n\n    \n\n    h1 {\n      font-weight: 500;\n      font-size: 24px;\n      letter-spacing: -0.5px;\n      line-height: 32px;\n      + h1,\n      + h2,\n      + h3,\n      + h4,\n      + p {\n        margin-top: 16px;\n      }\n    }\n    h2 {\n      font-weight: 500;\n      font-size: 20px;\n      line-height: 28px;\n      + h1,\n      + h2,\n      + h3,\n      + h4,\n      + p {\n        margin-top: 14px;\n      }\n    }\n    h3 {\n      font-weight: 500;\n      font-size: 16px;\n      line-height: 24px;\n      + h1,\n      + h2,\n      + h3,\n      + h4,\n      + p {\n        margin-top: 12px;\n      }\n    }\n    h4 {\n      font-size: 16px;\n      line-height: 24px;\n      + h1,\n      + h2,\n      + h3,\n      + h4,\n      + p {\n        margin-top: 12px;\n      }\n    }\n    p {\n      font-size: 16px;\n      line-height: 24px;\n      letter-spacing: 0px;\n      + h1,\n      + h2,\n      + h3,\n      + h4,\n      + p {\n        margin-top: 12px;\n      }\n    }\n    a {\n      color: ").concat(active, ";\n      text-decoration: none;\n      :hover {\n        text-decoration: underline;\n      }\n    }\n    ul {\n      list-style-type: disc;\n    }\n    ol {\n      list-style-type: decimal;\n      counter-reset: item;\n      li {\n        padding-left: 12px;\n        text-indent: -33px;\n        list-style-type: none;\n        counter-increment: item;\n        &:before {\n          display: inline-block;\n          width: 13px;\n          padding-right: 15px;\n          padding-left: 5px;\n          font-weight: bold;\n          text-align: right;\n          content: counter(item) \".\";\n        }\n      }\n    }\n    ol,\n    ul {\n      font-size: 16px;\n      line-height: 24px;\n      margin: 18px 16px;\n      display: block;\n      -webkit-margin-before: 0.5em;\n      -webkit-margin-after: 0.5em;\n      -webkit-padding-start: 0.5em;\n      li,\n      li {\n        margin-bottom: 5px;\n        padding-left: 10px;\n        > ul,\n        > ol {\n          -webkit-margin-before: 8px !important;\n          -webkit-margin-after: 8px !important;\n        }\n      }\n\n      &:first-child,\n      &:first-child {\n        -webkit-margin-before: 0;\n      }\n      &:last-child,\n      &:last-child {\n        -webkit-margin-after: 0;\n      }\n    }\n    hr {\n      -webkit-margin-before: 16px;\n      -webkit-margin-after: 13px;\n      border-color: @border-color;\n      border-style: solid;\n      height: 0px;\n      border-width: 1px 0 0 0;\n    }\n    table {\n      width: 100%;\n      margin: 15px 0;\n      text-align: left;\n      thead th {\n        background: @white;\n      }\n      th,\n      td {\n        border-width: 1px;\n        border-style: solid;\n        border-color: @border-color;\n        padding: 0.5em;\n      }\n      tr:nth-child(even) {\n        background: @almost-white;\n      }\n      tr:nth-child(odd) {\n        background: @white;\n      }\n    }\n    table.no-borders {\n      th,\n      td {\n        border: none;\n      }\n    }\n    table.padded-2 {\n      th,\n      td {\n        padding: 2em;\n      }\n    }\n    table.padded-1 {\n      th,\n      td {\n        padding: 1em;\n      }\n    }\n    img {\n      max-width: 100%;\n      margin: 15px 0;\n      & + img {\n        margin-top: 0;\n      }\n    }\n    .xl-emoji * {\n      font-size: 40px;\n      line-height: 1.2;\n    }\n    \n    blockquote {\n      border-top: 2px solid ").concat(gray07, ";\n      border-bottom: 2px solid ").concat(gray07, ";\n      font-size: 18px;\n      padding: 24px 48px;\n      position: relative;\n      text-align: center;\n      margin: 48px 0;\n    }\n  ");
-}, function (_ref4) {
-  var widgetType = _ref4.widgetType,
-      bodyFont = _ref4.bodyFont,
-      headerFont = _ref4.headerFont;
-  return widgetType === "article" && css(["h1,h2,h3{font-family:", " !important;& *{font-family:", " !important;}}h4,h5,h6,p,ul,ol,li,table{font-family:", " !important;& *{font-family:", " !important;}}h1{font-size:32px;line-height:1.13;margin:0 0 20px;letter-spacing:-0.75px;}h2{font-size:24px;line-height:1.17;margin:0 0 16px;letter-spacing:-0.5px;}h3{font-size:20px;line-height:1.2;margin:0 0 14px;}h4,h5,h6,p,ul,ol,li{font-size:18px;line-height:1.56;margin-bottom:13px;margin-top:0;}hr{border-color:", ";}table{width:100% !important;margin:15px 0;font-size:18px !important;text-align:left;border-collapse:collapse;border-spacing:0;thead th{background:@white;}th,td{border-width:1px;border-style:solid;border-color:", ";padding:0.5em;word-wrap:break-word;}tr:nth-child(odd){background:", ";}tr:nth-child(even){background:@white;}}table.no-borders{th,td{border:none;}tr:nth-child(odd){background:", ";}tr:nth-child(even){background:@white;}}pre{position:relative;background-color:", ";padding:1em;margin:1em 0;border-radius:4px;white-space:pre;}img,span.fr-img-caption,span.fr-video{display:block;margin:30px 0;", ";&.article-align-left{margin:30px auto;display:block;max-width:100%;", "}&.article-align-center{margin:30px auto;display:block;}&.article-align-right{margin:30px auto;display:block;max-width:100%;", "}&.article-align-overflow{margin:30px auto;display:block;max-width:100%;", " img{width:100%;}}}img{&.image-border-radius{border-radius:6px;}&.image-box-shadow{box-shadow:0 4px 16px 0 #bacad5;}}span.fr-img-caption{&.image-border-radius img{border-radius:6px;}&.image-box-shadow img{box-shadow:0 4px 16px 0 #bacad5;}}p{img:first-child,span.fr-img-caption:first-child{&.article-align-left,&.article-align-right{", "}}}span.fr-img-caption{text-align:center;img{margin:0;}.fr-inner{font-weight:400;font-size:16px;margin:8px auto 0 auto;padding:0 8px;color:", ";display:block;max-width:671px;}}span.fr-video{position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;border-radius:6px;&.article-align-overflow{padding-top:170px;}iframe{position:absolute;top:0;left:0;width:100% !important;height:100% !important;}}blockquote{border-left:0 !important;padding-left:0 !important;margin:0 !important;color:inherit !important;p{line-height:30px;font-size:26px;text-align:center;margin:0 auto;}}.content-attachments{width:100%;}"], headerFont, headerFont, bodyFont, bodyFont, gray07, gray07, gray09, gray09, gray09, media.only.xs(_templateObject()), media.min.md(_templateObject2()), media.min.md(_templateObject3()), media.min.md(_templateObject4()), media.min.md(_templateObject5()), gray04);
-});
-ContentRenderer.propTypes = {
-  content: PropTypes.string,
-  type: function type(props, propName) {
-    if (propName === "type" && props[propName] !== props[propName].toUpperCase()) {
-      // eslint-disable-next-line no-console
-      console.warn("Please use uppercase type 'HTML', 'MARKDOWN' or 'TEXT'");
-    }
-
-    if (propName === "type" && !["HTML", "MARKDOWN", "TEXT"].includes(props[propName].toUpperCase())) {
-      throw new Error("Invalid type, use 'HTML', 'MARKDOWN' or 'TEXT'");
-    }
-  },
-  widgetType: PropTypes.oneOf(["post", "article", "page"]),
-  bodyFont: PropTypes.string,
-  headerFont: PropTypes.string,
-  decodeHtmlEntitiesOnRender: PropTypes.bool,
-  createAnchors: PropTypes.bool,
-  useHashAutoscroll: PropTypes.bool,
-  hashAutoscrollTopMargin: PropTypes.number
-};
-ContentRenderer.defaultProps = {
-  content: "",
-  type: "html",
-  widgetType: "post",
-  bodyFont: "IBM Plex Sans, sans-serif",
-  headerFont: "IBM Plex Sans, sans-serif",
-  decodeHtmlEntitiesOnRender: false,
-  createAnchors: false,
-  useHashAutoscroll: true,
-  hashAutoscrollTopMargin: 0
-};
-export default ContentRenderer;

package/dist/constants.js

@@ -1,73 +0,0 @@
-export var safeTagsAndAttributes = {
-  a: ["class", "target", "href", "title", "data-collection-id", "data-page-id", "rel", "data-user-id", "data-user-id-old"],
-  abbr: ["title"],
-  address: [],
-  area: ["shape", "coords", "href", "alt"],
-  article: [],
-  aside: [],
-  audio: ["autoplay", "controls", "loop", "preload", "src"],
-  b: [],
-  bdi: ["dir"],
-  bdo: ["dir"],
-  big: [],
-  blockquote: ["cite"],
-  br: [],
-  caption: [],
-  center: [],
-  cite: [],
-  code: [],
-  col: ["align", "valign", "span", "width"],
-  colgroup: ["align", "valign", "span", "width"],
-  dd: [],
-  del: ["datetime"],
-  details: ["open"],
-  div: ["style"],
-  dl: [],
-  dt: [],
-  em: [],
-  font: ["color", "size", "face", "style"],
-  footer: [],
-  h1: ["style"],
-  h2: ["style"],
-  h3: ["style"],
-  h4: ["style"],
-  h5: ["style"],
-  h6: ["style"],
-  header: ["style"],
-  hr: ["style", "class"],
-  i: [],
-  img: ["src", "alt", "title", "width", "height", "style", "class"],
-  ins: ["datetime"],
-  li: ["style"],
-  mark: [],
-  nav: [],
-  ol: ["style"],
-  p: ["style"],
-  pre: ["style"],
-  s: [],
-  section: [],
-  small: [],
-  span: ["style", "class"],
-  sub: [],
-  sup: [],
-  strong: [],
-  table: ["width", "border", "align", "valign", "style", "class"],
-  tbody: ["align", "valign", "style", "class"],
-  td: ["width", "rowspan", "colspan", "align", "valign", "style", "class"],
-  tfoot: ["align", "valign", "style", "class"],
-  th: ["width", "rowspan", "colspan", "align", "valign", "style", "class"],
-  thead: ["align", "valign", "style", "class"],
-  tr: ["rowspan", "align", "valign", "style", "class"],
-  tt: [],
-  u: [],
-  ul: ["style", "class"],
-  video: ["style", "autoplay", "controls", "loop", "preload", "src", "height", "width"],
-  iframe: ["src", "frameborder", "allow", "sandbox", "referrerpolicy", "allowfullscreen", "style", "class"]
-};
-var HIGHLIGHT_JS_THEME = "a11y-light";
-export var MONOSPACE_FONT_URL = "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap";
-export var HIGHLIGHJS_JS = ["https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/highlight.min.js"];
-export var HIGHLIGHJS_CSS = ["https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/styles/default.min.css", "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/styles/".concat(HIGHLIGHT_JS_THEME, ".min.css")];
-export var ELEMENT_TYPE_PRE = "PRE";
-export var ELEMENT_TYPE_CODE = "CODE";
-export var CODE_BLOCK_AVAILABLE_LANGUAGES = ["javascript", "html", "css", "xml", "json", "java", "php", "typescript"];

package/dist/htmlConverter.js

@@ -1,61 +0,0 @@
-import showdown from "showdown";
-import { extraMentioning, mentioningRegex } from "@universe/frontend-utils";
-var mentioningRegexCaseInsensitive = new RegExp(mentioningRegex, "i");
-var mentioningRegexGroupCaseInsensitive = new RegExp(mentioningRegex, "gi");
-var converter;
-var customRules = {
-  color: {
-    type: "lang",
-    regex: /\((.*?)\)\[(rgb\((?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]))\))\]/gi,
-    replace: function replace(s, val) {
-      var color = s.match(/\[(rgb\((?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]))\))\]/gi)[0].replace("[", "").replace("]", "");
-      return "<span style=\"color:".concat(color, "\">").concat(val, "</span>");
-    }
-  },
-  mention: {
-    type: "lang",
-    regex: mentioningRegexGroupCaseInsensitive,
-    replace: function replace(s) {
-      var r = s.match(mentioningRegexCaseInsensitive);
-      var id = r && r.length > 1 && r[1];
-      var name = r && r.length > 2 && r[2];
-
-      if (extraMentioning.find(function (mentioning) {
-        return mentioning.toLowerCase() === String(id).toLowerCase();
-      })) {
-        return "<a class=\"mention extraMention\" data-user-id=\"".concat(id, "\">@").concat(name, "</a>");
-      }
-
-      return "<a class=\"mention\" data-user-id=\"".concat(id, "\">@").concat(name, "</a>");
-    }
-  },
-  userMentioTag: {
-    type: "lang",
-    regex: /<user-mentio[^>]*>(.+?)<\/user-mentio>/gi,
-    replace: function replace(s) {
-      var r = s.match(/<user-mentio[^>]*>(.+?)<\/user-mentio>/);
-      var attr = s.match(/data-user-id=["']([^"]+)["']/);
-      var name = r && r.length > 1 && r[1];
-      var id = attr && attr.length > 1 && attr[1];
-      return "<a class=\"mention\" data-user-id=\"".concat(id, "\">").concat(name, "</a>");
-    }
-  }
-};
-
-function getConverter() {
-  if (converter) return converter;
-  showdown.extension("color", customRules.color);
-  showdown.extension("mention", customRules.mention);
-  showdown.extension("usermentiotag", customRules.userMentioTag);
-  converter = new showdown.Converter({
-    extensions: ["color", "mention", "usermentiotag"]
-  });
-  converter.setOption("strikethrough", true); // <del>
-
-  converter.setOption("tables", true); // <table>
-
-  converter.setOption("openLinksInNewWindow", true);
-  return converter;
-}
-
-export default getConverter();

package/dist/index.js

@@ -1 +0,0 @@
-export { default as ContentRenderer } from "./ContentRenderer";

package/dist/utils.js

@@ -1,111 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-import linkifyHtml from "linkifyjs/html";
-import xss from "xss";
-import { decode as decodeHtmlEntities } from "html-entities";
-import { extraMentioning, mentioningRegex } from "@universe/frontend-utils";
-import { fixEmojioneBug, shortToUnicode } from "@happeouikit/emojis";
-import { MONOSPACE_FONT_URL, safeTagsAndAttributes } from "./constants";
-import htmlConverter from "./htmlConverter";
-var mentioningRegexGroupCaseInsensitive = new RegExp(mentioningRegex, "gi");
-var mentioningHtmlRegexGroupCaseInsensitive = new RegExp(/<user-mentio[^>]*data-user-id=["']([^"]+)["'][^>]*>(?:@|(?:&#64;))(.+?)<\/user-mentio>/, "gi");
-
-var processMatch = function processMatch(match, id, name) {
-  if (extraMentioning.find(function (mentioning) {
-    return mentioning.toLowerCase() === String(id).toLowerCase();
-  })) {
-    return "<a class=\"mention extraMention\" data-user-id=\"".concat(id, "\">@").concat(name, "</a>");
-  }
-
-  return "<a class=\"mention\" data-user-id=\"".concat(id, "\">@").concat(name, "</a>");
-};
-
-var processMentions = function processMentions() {
-  var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  return str.replace(mentioningRegexGroupCaseInsensitive, processMatch).replace(mentioningHtmlRegexGroupCaseInsensitive, processMatch);
-};
-/**
- * @name toSafeText
- * @description Returns filtered text with filterXSS library
- * @author Antero Hanhirova
- * @param {String} - Text to whitelist
- * @returns {String}
- */
-
-
-var toSafeText = function toSafeText(text) {
-  return xss(text, {
-    whiteList: safeTagsAndAttributes,
-    css: {
-      whiteList: _objectSpread({}, xss.getDefaultCSSWhiteList(), {
-        "vertical-align": true
-      })
-    },
-    stripIgnoreTag: true
-  }).replace(/&nbsp;/g, " ").replace(/\u2060/g, ""); // Replaces a hidden character that resulted in a "?"-character in backend
-};
-/**
- * @name toHtml
- * @description Converts markdown to html, adds space to end of String
- *               The non-breaking space helps users to add text if last word is mention item
- * @author Antero Hanhirova
- * @param {String} - Markdown
- * @returns {String} - Html
- */
-
-
-var toHtml = function toHtml() {
-  var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "html";
-  var newString = shortToUnicode(str);
-  newString = fixEmojioneBug(newString);
-
-  if (type === "markdown") {
-    newString = htmlConverter.makeHtml(newString);
-  } else {
-    newString = processMentions(newString);
-  }
-
-  newString = toSafeText(newString);
-  return linkifyHtml(newString, {
-    target: "_blank",
-    ignoreTags: ["pre", "code", "script", "style"]
-  });
-};
-
-var loadCodeFont = function loadCodeFont() {
-  var id = "ibmMonoOnDemand";
-
-  if (!document.getElementById(id)) {
-    var style = document.createElement("style");
-    style.id = id;
-    style.appendChild(document.createTextNode("@import url(".concat(MONOSPACE_FONT_URL, ");")));
-    document.head.appendChild(style);
-  }
-};
-
-var getNearestRelativeParent = function getNearestRelativeParent(el) {
-  if (!el) return null;
-  var elStyle = el.currentStyle || window.getComputedStyle(el, "");
-  var positionStyle = elStyle.position;
-
-  if (["relative", "absolute"].includes(positionStyle)) {
-    return el;
-  }
-
-  return getNearestRelativeParent(el.parentNode);
-}; // Remove special and hidden characters from string
-
-
-var removeSpecialCharacters = function removeSpecialCharacters() {
-  var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  return (// eslint-disable-next-line no-control-regex
-    str.replace(/[^\u0000-\u007E]/g, "")
-  );
-};
-
-export { toHtml, toSafeText, loadCodeFont, decodeHtmlEntities, getNearestRelativeParent, removeSpecialCharacters };