dash-core-components
Version:
Core component suite for Dash
155 lines (154 loc) • 7.91 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _ramda = require("ramda");
var _reactJsxParser = _interopRequireDefault(require("react-jsx-parser"));
var _reactMarkdown = _interopRequireDefault(require("react-markdown"));
var _remarkMath = _interopRequireDefault(require("remark-math"));
var _Math = _interopRequireDefault(require("./Math.react"));
var _MarkdownHighlighter = _interopRequireDefault(require("../utils/MarkdownHighlighter"));
var _Markdown = require("../components/Markdown.react");
var _Link = _interopRequireDefault(require("./../components/Link.react"));
var _LoadingElement = _interopRequireDefault(require("../utils/LoadingElement"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
class DashMarkdown extends _react.Component {
constructor(props) {
super(props);
if (_MarkdownHighlighter.default.isReady !== true) {
_MarkdownHighlighter.default.isReady.then(() => {
this.setState({});
});
}
this.highlightCode = this.highlightCode.bind(this);
this.dedent = this.dedent.bind(this);
}
componentDidMount() {
this.highlightCode();
}
componentDidUpdate() {
this.highlightCode();
}
highlightCode() {
var isHighlighted = node => {
// a highlighted node will have <span> children which are what color the text
return node.children.length > 0;
};
if (this.mdContainer) {
var nodes = this.mdContainer.querySelectorAll('pre code');
if (_MarkdownHighlighter.default.hljs) {
for (var i = 0; i < nodes.length; i++) {
if (!isHighlighted(nodes[i])) {
nodes[i].removeAttribute('data-highlighted');
_MarkdownHighlighter.default.hljs.highlightElement(nodes[i]);
}
}
} else {
_MarkdownHighlighter.default.loadhljs();
}
}
}
dedent(text) {
var lines = text.split(/\r\n|\r|\n/);
var commonPrefix = null;
var _iterator = _createForOfIteratorHelper(lines),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var line = _step.value;
var preMatch = line && line.match(/^\s*(?=\S)/);
if (preMatch) {
var prefix = preMatch[0];
if (commonPrefix !== null) {
for (var i = 0; i < commonPrefix.length; i++) {
// Like Python's textwrap.dedent, we'll remove both
// space and tab characters, but only if they match
if (prefix[i] !== commonPrefix[i]) {
commonPrefix = commonPrefix.substr(0, i);
break;
}
}
} else {
commonPrefix = prefix;
}
if (!commonPrefix) {
break;
}
}
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
var commonLen = commonPrefix ? commonPrefix.length : 0;
return lines.map(line => {
return line.match(/\S/) ? line.substr(commonLen) : '';
}).join('\n');
}
render() {
var _this$props = this.props,
id = _this$props.id,
style = _this$props.style,
className = _this$props.className,
highlight_config = _this$props.highlight_config,
dangerously_allow_html = _this$props.dangerously_allow_html,
link_target = _this$props.link_target,
mathjax = _this$props.mathjax,
children = _this$props.children,
dedent = _this$props.dedent;
var textProp = (0, _ramda.type)(children) === 'Array' ? children.join('\n') : children;
var displayText = dedent && textProp ? this.dedent(textProp) : textProp;
var componentTransforms = {
dccLink: props => /*#__PURE__*/_react.default.createElement(_Link.default, props),
dccMarkdown: props => /*#__PURE__*/_react.default.createElement(_reactMarkdown.default, (0, _ramda.mergeDeepRight)((0, _ramda.pick)(['dangerously_allow_html', 'dedent'], this.props), (0, _ramda.pick)(['children'], props))),
dashMathjax: props => /*#__PURE__*/_react.default.createElement(_Math.default, {
tex: props.value,
inline: props.inline
})
};
var regexMath = value => {
var newValue = value.replace(/(\${1,2})((?:\\.|[^$])+)\1/g, function (m, tag, src) {
var inline = tag.length === 1 || src.indexOf('\n') === -1;
return "<dashMathjax value='".concat(src, "' inline='").concat(inline, "'/>");
});
return newValue;
};
return /*#__PURE__*/_react.default.createElement(_LoadingElement.default, {
id: id,
ref: node => {
this.mdContainer = node;
},
style: style,
className: (highlight_config && highlight_config.theme || className) && "".concat(className ? className : '', " ").concat(highlight_config && highlight_config.theme && highlight_config.theme === 'dark' ? 'hljs-dark' : '')
}, /*#__PURE__*/_react.default.createElement(_reactMarkdown.default, {
source: displayText,
escapeHtml: !dangerously_allow_html,
linkTarget: link_target,
plugins: mathjax ? [_remarkMath.default] : [],
renderers: {
math: props => /*#__PURE__*/_react.default.createElement(_Math.default, {
tex: props.value,
inline: false
}),
inlineMath: props => /*#__PURE__*/_react.default.createElement(_Math.default, {
tex: props.value,
inline: true
}),
html: props => props.escapeHtml ? props.value : /*#__PURE__*/_react.default.createElement(_reactJsxParser.default, {
jsx: mathjax ? regexMath(props.value) : props.value,
components: componentTransforms,
renderInWrapper: false
})
}
}));
}
}
exports.default = DashMarkdown;
DashMarkdown.propTypes = _Markdown.propTypes;