47 |
48 |
59 |
60 | );
61 | }
62 | }
63 |
--------------------------------------------------------------------------------
/demo/index.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { render } from 'react-dom';
3 | import App from './app';
4 |
5 | render(
49 |
50 |
55 |
56 | {this.renderContent()}
57 |
58 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/lib/codeblock.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 | exports.render = render;
7 | exports.default = plugin;
8 |
9 | var _react = require('react');
10 |
11 | var _react2 = _interopRequireDefault(_react);
12 |
13 | var _server = require('react-dom/server');
14 |
15 | var _prismjsPackage = require('prismjs-package');
16 |
17 | var _prismjsPackage2 = _interopRequireDefault(_prismjsPackage);
18 |
19 | var _prism = require('prismjs-package/themes/prism.css');
20 |
21 | var _prism2 = _interopRequireDefault(_prism);
22 |
23 | var _reactDiffview = require('react-diffview');
24 |
25 | var _reactDiffview2 = _interopRequireDefault(_reactDiffview);
26 |
27 | var _utils = require('markdown-it/lib/common/utils');
28 |
29 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
30 |
31 | // eslint-disable-line
32 | var externalLangs = {
33 | seq: 'sequence',
34 | sequence: 'sequence',
35 | // TODO flow could be ambigious with flow.js
36 | flow: 'flowchart',
37 | flowchart: 'flowchart',
38 | railroad: 'railroad',
39 | tex: 'tex'
40 | };
41 | // TODO do that in prismjs-package
42 |
43 |
44 | var externalClass = {
45 | tex: 'tex'
46 | };
47 |
48 | function external(code, lang) {
49 | var className = externalClass[lang] || 'diagram';
50 | return '' + code + '
';
51 | }
52 |
53 | function render(code, language) {
54 | var lang = (language || '').toLowerCase();
55 | var externalLang = externalLangs[lang];
56 | if (externalLang) {
57 | return external(code, externalLang);
58 | }
59 | if (lang.match(/^diff?/i)) {
60 | var view = _react2.default.createElement(_reactDiffview2.default, { source: code });
61 | return (0, _server.renderToString)(view);
62 | }
63 | return (0, _prismjsPackage2.default)(code, language);
64 | }
65 |
66 | /* eslint-disable no-param-reassign */
67 | function plugin(md) {
68 | md.renderer.rules.fence = function (tokens, idx, options) {
69 | var token = tokens[idx];
70 | var info = token.info ? (0, _utils.unescapeAll)(token.info).trim() : '';
71 | var langName = '';
72 |
73 | if (info) {
74 | langName = info.split(/\s+/g)[0];
75 | token.attrJoin('class', options.langPrefix + langName);
76 | }
77 |
78 | return render(token.content, langName);
79 | };
80 | }
81 | /* eslint-enable */
--------------------------------------------------------------------------------
/lib/content.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8 |
9 | var _react = require('react');
10 |
11 | var _react2 = _interopRequireDefault(_react);
12 |
13 | var _reactDom = require('react-dom');
14 |
15 | var _reactDom2 = _interopRequireDefault(_reactDom);
16 |
17 | var _stripIndent = require('strip-indent');
18 |
19 | var _stripIndent2 = _interopRequireDefault(_stripIndent);
20 |
21 | var _githubMarkdown = require('github-markdown-css/github-markdown.css');
22 |
23 | var _githubMarkdown2 = _interopRequireDefault(_githubMarkdown);
24 |
25 | var _render2 = require('./render');
26 |
27 | var _render3 = _interopRequireDefault(_render2);
28 |
29 | var _inject = require('./inject');
30 |
31 | var _inject2 = _interopRequireDefault(_inject);
32 |
33 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
34 |
35 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
36 |
37 | function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
38 |
39 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
40 |
41 | var Content = function (_Component) {
42 | _inherits(Content, _Component);
43 |
44 | function Content() {
45 | _classCallCheck(this, Content);
46 |
47 | return _possibleConstructorReturn(this, (Content.__proto__ || Object.getPrototypeOf(Content)).apply(this, arguments));
48 | }
49 |
50 | _createClass(Content, [{
51 | key: 'componentDidMount',
52 | value: function componentDidMount() {
53 | this.replaceBlocks();
54 | }
55 | }, {
56 | key: 'componentDidUpdate',
57 | value: function componentDidUpdate() {
58 | this.replaceBlocks();
59 | }
60 | }, {
61 | key: 'replaceBlocks',
62 | value: function replaceBlocks() {
63 | var root = $(_reactDom2.default.findDOMNode(this)); // eslint-disable-line
64 | (0, _inject2.default)(root.find('.injection'));
65 | }
66 | }, {
67 | key: 'render',
68 | value: function render() {
69 | var source = this.props.source;
70 |
71 | var html = (0, _render3.default)((0, _stripIndent2.default)(source));
72 | var className = _githubMarkdown2.default['markdown-body'];
73 | return _react2.default.createElement('span', { className: className, dangerouslySetInnerHTML: { __html: html } }); // eslint-disable-line
74 | }
75 | }]);
76 |
77 | return Content;
78 | }(_react.Component);
79 |
80 | exports.default = Content;
--------------------------------------------------------------------------------
/lib/editor/editor.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 | exports.MarkdownEditor = undefined;
7 |
8 | var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
9 |
10 | var _lodash = require('lodash');
11 |
12 | var _lodash2 = _interopRequireDefault(_lodash);
13 |
14 | var _react = require('react');
15 |
16 | var _react2 = _interopRequireDefault(_react);
17 |
18 | var _reactSplitPane = require('react-split-pane');
19 |
20 | var _reactSplitPane2 = _interopRequireDefault(_reactSplitPane);
21 |
22 | var _reactAce = require('react-ace');
23 |
24 | var _reactAce2 = _interopRequireDefault(_reactAce);
25 |
26 | require('brace/mode/markdown');
27 |
28 | require('brace/theme/github');
29 |
30 | var _markdown = require('../markdown');
31 |
32 | var _markdown2 = _interopRequireDefault(_markdown);
33 |
34 | var _toolbar = require('./toolbar');
35 |
36 | var _toolbar2 = _interopRequireDefault(_toolbar);
37 |
38 | var _style = require('./style.scss');
39 |
40 | var _style2 = _interopRequireDefault(_style);
41 |
42 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
43 |
44 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
45 |
46 | function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
47 |
48 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
49 |
50 | // TODO customizable tabs e.g. localization
51 | // TODO textarea mode without rich editor
52 | // TODO fix split mode
53 | // TODO sync scrollbars for editor and viewer
54 |
55 | var MarkdownEditor = exports.MarkdownEditor = function (_Component) {
56 | _inherits(MarkdownEditor, _Component);
57 |
58 | function MarkdownEditor(props) {
59 | _classCallCheck(this, MarkdownEditor);
60 |
61 | var _this = _possibleConstructorReturn(this, (MarkdownEditor.__proto__ || Object.getPrototypeOf(MarkdownEditor)).call(this, props));
62 |
63 | _this.state = {
64 | mode: 'edit',
65 | value: props.value || ''
66 | };
67 | return _this;
68 | }
69 |
70 | _createClass(MarkdownEditor, [{
71 | key: 'componentWillReceiveProps',
72 | value: function componentWillReceiveProps(nextProps) {
73 | this.setState({ value: nextProps.value });
74 | }
75 | }, {
76 | key: 'renderAce',
77 | value: function renderAce() {
78 | var _this2 = this;
79 |
80 | var _ref = this.props.style || {},
81 | width = _ref.width,
82 | height = _ref.height;
83 |
84 | var onChange = function onChange(value) {
85 | (_this2.props.onChange || _lodash2.default.noop)(value);
86 | _this2.setState({ value: value });
87 | };
88 | var aceProps = {
89 | mode: 'markdown',
90 | theme: 'github',
91 | value: this.state.value,
92 | onChange: onChange,
93 | width: width || '100%',
94 | height: height || '100%'
95 | };
96 | return _react2.default.createElement(_reactAce2.default, aceProps);
97 | }
98 | }, {
99 | key: 'renderNormalView',
100 | value: function renderNormalView() {
101 | if (this.state.mode === 'edit') {
102 | return this.renderAce();
103 | }
104 | return _react2.default.createElement(_markdown2.default, { source: this.state.value });
105 | }
106 | }, {
107 | key: 'renderSplitView',
108 | value: function renderSplitView() {
109 | return _react2.default.createElement(
110 | _reactSplitPane2.default,
111 | { split: 'vertical' },
112 | this.renderAce(),
113 | _react2.default.createElement(_markdown2.default, { source: this.state.value })
114 | );
115 | }
116 | }, {
117 | key: 'render',
118 | value: function render() {
119 | var _this3 = this;
120 |
121 | var mode = this.state.mode;
122 | var _props = this.props,
123 | style = _props.style,
124 | splitView = _props.splitView;
125 |
126 | var onAction = function onAction(type) {
127 | // TODO implement formatting actions
128 | switch (type) {
129 | case 'mode':
130 | _this3.setState({ mode: mode === 'edit' ? 'preview' : 'edit' });
131 | break;
132 | case 'save':
133 | (_this3.props.onSave || _lodash2.default.noop)(_this3.state.value);
134 | break;
135 | default:
136 | console.log('unhandled action ' + type);
137 | break;
138 | }
139 | };
140 | return _react2.default.createElement(
141 | 'div',
142 | { className: _style2.default.markdown_editor, style: style },
143 | _react2.default.createElement(_toolbar2.default, { mode: mode, onAction: onAction }),
144 | splitView ? this.renderSplitView() : this.renderNormalView()
145 | );
146 | }
147 | }]);
148 |
149 | return MarkdownEditor;
150 | }(_react.Component);
151 |
152 | MarkdownEditor.propTypes = {
153 | value: _react.PropTypes.string,
154 | onSave: _react.PropTypes.func,
155 | onChange: _react.PropTypes.func
156 | };
157 | MarkdownEditor.defaultProps = {
158 | value: '',
159 | onSave: _lodash2.default.noop,
160 | onChange: _lodash2.default.noop
161 | };
162 | exports.default = MarkdownEditor;
--------------------------------------------------------------------------------
/lib/editor/index.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _editor = require('./editor');
8 |
9 | Object.defineProperty(exports, 'default', {
10 | enumerable: true,
11 | get: function get() {
12 | return _interopRequireDefault(_editor).default;
13 | }
14 | });
15 |
16 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
--------------------------------------------------------------------------------
/lib/editor/split.scss:
--------------------------------------------------------------------------------
1 | .Resizer {
2 | background: #000;
3 | opacity: .2;
4 | z-index: 1;
5 | box-sizing: border-box;
6 | background-clip: padding-box;
7 | }
8 |
9 | .Resizer:hover {
10 | transition: all 2s ease;
11 | }
12 |
13 | .Resizer.horizontal {
14 | height: 11px;
15 | margin: -5px 0;
16 | border-top: 5px solid rgba(255, 255, 255, 0);
17 | border-bottom: 5px solid rgba(255, 255, 255, 0);
18 | cursor: row-resize;
19 | width: 100%;
20 | }
21 |
22 | .Resizer.horizontal:hover {
23 | border-top: 5px solid rgba(0, 0, 0, 0.5);
24 | border-bottom: 5px solid rgba(0, 0, 0, 0.5);
25 | }
26 |
27 | .Resizer.vertical {
28 | width: 11px;
29 | margin: 0 -5px;
30 | border-left: 5px solid rgba(255, 255, 255, 0);
31 | border-right: 5px solid rgba(255, 255, 255, 0);
32 | cursor: col-resize;
33 | height: 100%;
34 | }
35 |
36 | .Resizer.vertical:hover {
37 | border-left: 5px solid rgba(0, 0, 0, 0.5);
38 | border-right: 5px solid rgba(0, 0, 0, 0.5);
39 | }
40 |
--------------------------------------------------------------------------------
/lib/editor/style.scss:
--------------------------------------------------------------------------------
1 | @import "split";
2 |
3 | .markdown_editor {
4 | min-height: 300px;
5 | }
6 |
7 | .markdown_editor .toolbar span {
8 | cursor: pointer;
9 | display: inline-block;
10 | margin: 2px;
11 | padding: 4px;
12 | min-width: 20px;
13 | min-height: 20px;
14 | text-align: center;
15 | vertical-align: middle;
16 | border-radius: 25%;
17 | }
18 |
19 | .markdown_editor .toolbar span:hover {
20 | background-color: lightgray;
21 | }
22 |
--------------------------------------------------------------------------------
/lib/editor/toolbar.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
8 |
9 | exports.default = Toolbar;
10 |
11 | var _lodash = require('lodash');
12 |
13 | var _lodash2 = _interopRequireDefault(_lodash);
14 |
15 | var _react = require('react');
16 |
17 | var _react2 = _interopRequireDefault(_react);
18 |
19 | var _classnames = require('classnames');
20 |
21 | var _classnames2 = _interopRequireDefault(_classnames);
22 |
23 | var _cssEffects = require('css-effects');
24 |
25 | var _style = require('./style.scss');
26 |
27 | var _style2 = _interopRequireDefault(_style);
28 |
29 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
30 |
31 | function Button(props) {
32 | var className = (0, _classnames2.default)(props.icon ? props.icon : null);
33 | var attrs = _lodash2.default.pick(props);
34 | var btnClass = '';
35 | var btnAttrs = _lodash2.default.pick(props, 'onClick');
36 | if (props.title) {
37 | btnClass = (0, _cssEffects.hint)();
38 | btnAttrs['data-hint'] = props.title;
39 | }
40 | return _react2.default.createElement(
41 | 'span',
42 | _extends({ className: btnClass }, btnAttrs),
43 | _react2.default.createElement(
44 | 'i',
45 | _extends({ className: className }, attrs),
46 | props.text
47 | )
48 | );
49 | }
50 |
51 | function Toolbar(props) {
52 | var action = function action(type) {
53 | return function () {
54 | return props.onAction(type);
55 | };
56 | };
57 | var editMode = props.mode === 'edit';
58 | var modeButton = {
59 | icon: editMode ? 'fa fa-eye' : 'fa fa-edit',
60 | title: editMode ? 'Preview' : 'Edit',
61 | onClick: action('mode')
62 | };
63 | // TODO disabled button states
64 | return _react2.default.createElement(
65 | 'div',
66 | { className: _style2.default.toolbar },
67 | _react2.default.createElement(Button, modeButton),
68 | _react2.default.createElement(Button, { icon: 'fa fa-floppy-o', title: 'Save', onClick: action('save') }),
69 | _react2.default.createElement(Button, { icon: 'fa fa-undo', title: 'Undo', onClick: action('undo') }),
70 | _react2.default.createElement(Button, { icon: 'fa fa-repeat', title: 'Redo', onClick: action('redo') }),
71 | _react2.default.createElement(Button, { icon: 'fa fa-bold', title: 'Bold', onClick: action('bold') }),
72 | _react2.default.createElement(Button, { icon: 'fa fa-italic', title: 'Italic', onClick: action('italic') }),
73 | _react2.default.createElement(Button, { icon: 'fa fa-list-ol', title: 'Numbered list', onClick: action('ol') }),
74 | _react2.default.createElement(Button, { icon: 'fa fa-list', title: 'Bulleted list', onClick: action('ul') })
75 | );
76 | }
--------------------------------------------------------------------------------
/lib/embed.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
8 |
9 | exports.default = plugin;
10 |
11 | var _lodash = require('lodash');
12 |
13 | var _lodash2 = _interopRequireDefault(_lodash);
14 |
15 | var _react = require('react');
16 |
17 | var _react2 = _interopRequireDefault(_react);
18 |
19 | var _server = require('react-dom/server');
20 |
21 | var _classnames = require('classnames');
22 |
23 | var _classnames2 = _interopRequireDefault(_classnames);
24 |
25 | var _hashtrie = require('hashtrie');
26 |
27 | var _hashtrie2 = _interopRequireDefault(_hashtrie);
28 |
29 | var _regex = require('./regex');
30 |
31 | var regex = _interopRequireWildcard(_regex);
32 |
33 | var _style = require('./style.scss');
34 |
35 | var _style2 = _interopRequireDefault(_style);
36 |
37 | var _parseuri = require('./parseuri');
38 |
39 | var _parseuri2 = _interopRequireDefault(_parseuri);
40 |
41 | function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
42 |
43 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
44 |
45 | var rulemap = _hashtrie2.default.empty;
46 |
47 | function queryString(params) {
48 | return _lodash2.default.map(params, function (v, k) {
49 | return k + '=' + v;
50 | }).join('&');
51 | }
52 |
53 | // embedding with embed.js
54 | function embed(url) {
55 | return '';
56 | }
57 |
58 | function iframe(props) {
59 | var containerProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
60 |
61 | var iframeProps = _extends({}, props, {
62 | frameBorder: 0,
63 | webkitAllowFullScreen: true,
64 | mozallowfullscreen: true,
65 | allowFullScreen: true
66 | });
67 | delete iframeProps.className;
68 | delete iframeProps.afterFrame;
69 | var className = (0, _classnames2.default)(_style2.default.embed_container, props.className);
70 | var container = _react2.default.createElement(
71 | 'div',
72 | _extends({}, containerProps, { className: className }),
73 | _react2.default.createElement('iframe', iframeProps),
74 | props.afterFrame || null
75 | );
76 | return (0, _server.renderToStaticMarkup)(container);
77 | }
78 |
79 | function canApplyRule(test, url) {
80 | if (typeof test === 'function') {
81 | return test(url);
82 | }
83 | return test.exec(url);
84 | }
85 |
86 | function makeRule(test, render) {
87 | if (test === undefined) {
88 | throw new Error('nre');
89 | }
90 | if (_lodash2.default.isArray(test)) {
91 | var fn = function fn(url) {
92 | return _lodash2.default.some(test, function (t) {
93 | return canApplyRule(t, url);
94 | });
95 | };
96 | return { test: fn, render: render };
97 | }
98 | return { test: test, render: render };
99 | }
100 |
101 | function rule(host, test, render) {
102 | var value = makeRule(test, render);
103 | if (host) {
104 | rulemap = rulemap.set(host, value);
105 | rulemap = rulemap.set('www.' + host, value);
106 | }
107 | return value;
108 | }
109 |
110 | function rules(host, set) {
111 | // eslint-disable-line
112 | rulemap = rulemap.set(host, set);
113 | rulemap = rulemap.set('www.' + host, set);
114 | }
115 |
116 | var image = rule('', regex.imageExt, function (url) {
117 | return '
168 | // How to tell when your cat is fully charged
169 | //
170 | //
171 | // });
172 |
173 | // audio
174 |
175 | var soundcloudParams = queryString({
176 | auto_play: 'false',
177 | hide_related: 'false',
178 | show_comments: 'true',
179 | show_user: 'true',
180 | show_reposts: 'false',
181 | visual: 'false',
182 | download: 'false',
183 | color: 'f50000',
184 | theme_color: 'f50000'
185 | });
186 |
187 | rule('soundcloud.com', regex.soundcloud, function (url, match) {
188 | var player = 'https://w.soundcloud.com/player/?url=soundcloud.com/' + match[1] + '/' + match[2] + '&';
189 | var src = '' + player + soundcloudParams;
190 | return iframe({ className: _style2.default.soundcloud, src: src, scrolling: 'no' });
191 | });
192 |
193 | rule('spotify.com', regex.spotify, embed);
194 | // code
195 | rule('github.com', regex.github, embed);
196 | rule('gist.github.com', regex.gist, embed);
197 |
198 | rule('codepen.io', regex.codepen, function (url, match) {
199 | var slug = match[2];
200 | var src = 'https://codepen.io/' + match[1] + '/embed/preview/' + slug + '?height=300&slug-hash=' + slug + '&default-tab=result&host=http%3A%2F%2Fcodepen.io'; // eslint-disable-line
201 | return iframe({ className: _style2.default.codepen, src: src });
202 | });
203 |
204 | rule('ideone.com', regex.ideone, embed);
205 | rule('jsbin.com', regex.jsbin, embed);
206 | rule('jsfiddle.net', regex.jsfiddle, embed);
207 | rule('plnkr.co', regex.plunker, embed);
208 | // social
209 | rule('twitter.com', regex.twitter, embed);
210 |
211 | function applyRule(self, url) {
212 | if (typeof self.test === 'function') {
213 | if (self.test(url)) {
214 | return self.render(url);
215 | }
216 | return undefined;
217 | }
218 | var match = self.test.exec(url);
219 | if (match) {
220 | return self.render(url, match);
221 | }
222 | return undefined;
223 | }
224 |
225 | function embedURL(url) {
226 | if (!url) return undefined;
227 |
228 | var uri = (0, _parseuri2.default)(url);
229 | if (!uri) return undefined;
230 |
231 | if (url.match(image.test)) {
232 | return image.render(url);
233 | }
234 |
235 | var set = rulemap.get(uri.host);
236 | if (!set) return undefined;
237 |
238 | if (_lodash2.default.isArray(set)) {
239 | for (var i = 0; i < set.length; i += 1) {
240 | var result = applyRule(set[i], url);
241 | if (result) return result;
242 | }
243 | return undefined;
244 | }
245 |
246 | return applyRule(set, url);
247 | }
248 |
249 | /* eslint-disable no-param-reassign */
250 | function plugin(md) {
251 | var skip = false;
252 | md.renderer.rules.link_open = function link(tokens, i, options) {
253 | if (i + 2 < tokens.length && tokens[i + 1].type === 'text' && tokens[i + 2].type === 'link_close') {
254 | var result = embedURL(tokens[i + 1].content);
255 | if (typeof result === 'string') {
256 | skip = true;
257 | return result;
258 | }
259 | }
260 | return md.renderer.renderToken(tokens, i, options);
261 | };
262 |
263 | var renderText = md.renderer.rules.text;
264 | md.renderer.rules.text = function link(tokens, i, options, self) {
265 | if (skip) return '';
266 | return renderText(tokens, i, options, self);
267 | };
268 |
269 | md.renderer.rules.link_close = function link(tokens, i, options) {
270 | if (skip) {
271 | skip = false;
272 | return '';
273 | }
274 | return md.renderer.renderToken(tokens, i, options);
275 | };
276 | }
277 | /* eslint-enable */
--------------------------------------------------------------------------------
/lib/index.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _markdown = require('./markdown');
8 |
9 | Object.defineProperty(exports, 'Markdown', {
10 | enumerable: true,
11 | get: function get() {
12 | return _interopRequireDefault(_markdown).default;
13 | }
14 | });
15 | Object.defineProperty(exports, 'default', {
16 | enumerable: true,
17 | get: function get() {
18 | return _interopRequireDefault(_markdown).default;
19 | }
20 | });
21 |
22 | var _editor = require('./editor');
23 |
24 | Object.defineProperty(exports, 'MarkdownEditor', {
25 | enumerable: true,
26 | get: function get() {
27 | return _interopRequireDefault(_editor).default;
28 | }
29 | });
30 |
31 | var _render = require('./render');
32 |
33 | Object.defineProperty(exports, 'render', {
34 | enumerable: true,
35 | get: function get() {
36 | return _interopRequireDefault(_render).default;
37 | }
38 | });
39 |
40 | var _linkify = require('./linkify');
41 |
42 | Object.defineProperty(exports, 'linkTo', {
43 | enumerable: true,
44 | get: function get() {
45 | return _linkify.linkTo;
46 | }
47 | });
48 |
49 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
--------------------------------------------------------------------------------
/lib/inject.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 | exports.default = render;
7 |
8 | var _jsSequenceDiagrams = require('js-sequence-diagrams');
9 |
10 | var _jsSequenceDiagrams2 = _interopRequireDefault(_jsSequenceDiagrams);
11 |
12 | var _flowchart = require('flowchart.js');
13 |
14 | var _flowchart2 = _interopRequireDefault(_flowchart);
15 |
16 | var _katex = require('katex');
17 |
18 | var _katex2 = _interopRequireDefault(_katex);
19 |
20 | var _railroad = require('./railroad');
21 |
22 | var _railroad2 = _interopRequireDefault(_railroad);
23 |
24 | var _embed = require('embed-js/src/embed.js');
25 |
26 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
27 |
28 | // eslint-disable-line
29 | // import embedStyles from 'embed-js/src/embed.css'; // eslint-disable-line
30 |
31 | function inject(element) {
32 | var $e = $(element);
33 | if ($e.is('.diagram')) {
34 | var lang = $e.data('lang');
35 | switch (lang) {
36 | case 'sequence':
37 | $e.sequenceDiagram({ theme: 'hand' });
38 | break;
39 | case 'flowchart':
40 | $e.flowChart();
41 | break;
42 | case 'railroad':
43 | (0, _railroad2.default)(element);
44 | break;
45 | default:
46 | break;
47 | }
48 | return;
49 | }
50 | if ($e.is('.tex')) {
51 | try {
52 | var text = $e.text();
53 | _katex2.default.render(text, element);
54 | } catch (e) {
55 | console.log('katex failed:', e);
56 | }
57 | return;
58 | }
59 | if ($e.is('.embedjs')) {
60 | var em = new window.EmbedJS({
61 | element: element
62 | });
63 | em.render();
64 | }
65 | }
66 | // import katexStyles from '../bower_components/KaTeX/dist/katex.min.css'; // eslint-disable-line
67 |
68 | /*eslint-enable*/
69 | /*eslint-disable*/
70 | function render(elems) {
71 | $.each(elems, function (i, e) {
72 | return inject(e);
73 | });
74 | }
--------------------------------------------------------------------------------
/lib/linkify.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 | exports.default = configureLinkifier;
7 | var linkTo = {
8 | user: 'https://twitter.com/',
9 | issue: 'https://github.com/reactbits/markdown/issues/',
10 | hashtag: 'https://twitter.com/hashtag/'
11 | };
12 |
13 | exports.linkTo = linkTo;
14 | function configureLinkifier(linkify) {
15 | linkify.set({
16 | fuzzyLink: true,
17 | fuzzyIP: false,
18 | fuzzyEmail: true
19 | });
20 |
21 | var rexprs = {};
22 |
23 | function register(prefix, key, replaceUrl) {
24 | linkify.add(prefix, {
25 | validate: function validate(text, pos, self) {
26 | var tail = text.slice(pos);
27 |
28 | var re = rexprs[key];
29 | if (!re) {
30 | re = new RegExp('^([a-zA-Z0-9_]){1,15}(?!_)(?=$|' + self.re.src_ZPCc + ')');
31 | rexprs[key] = re;
32 | }
33 |
34 | if (re.test(tail)) {
35 | // Linkifier allows punctuation chars before prefix,
36 | // but we additionally disable `@` ("@@mention" is invalid)
37 | if (pos >= 2 && tail[pos - 2] === prefix) {
38 | return false;
39 | }
40 | return tail.match(re)[0].length;
41 | }
42 |
43 | return 0;
44 | },
45 |
46 | /*eslint-disable*/
47 | normalize: function normalize(match) {
48 | match.url = replaceUrl(match.url);
49 | }
50 | });
51 | }
52 |
53 | register('@', 'mention', function (url) {
54 | return linkTo.user + url.replace(/^@/, '');
55 | });
56 | register('issue ', 'issue', function (url) {
57 | return linkTo.issue + url.replace(/^issue /, '');
58 | });
59 | register('#', 'hashtag', function (url) {
60 | return linkTo.hashtag + url.replace(/^#/, '');
61 | });
62 | }
--------------------------------------------------------------------------------
/lib/markdown.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 |
7 | var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
8 |
9 | var _react = require('react');
10 |
11 | var _react2 = _interopRequireDefault(_react);
12 |
13 | var _content = require('./content');
14 |
15 | var _content2 = _interopRequireDefault(_content);
16 |
17 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18 |
19 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
20 |
21 | function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
22 |
23 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
24 |
25 | var Markdown = function (_Component) {
26 | _inherits(Markdown, _Component);
27 |
28 | function Markdown() {
29 | _classCallCheck(this, Markdown);
30 |
31 | return _possibleConstructorReturn(this, (Markdown.__proto__ || Object.getPrototypeOf(Markdown)).apply(this, arguments));
32 | }
33 |
34 | _createClass(Markdown, [{
35 | key: 'render',
36 | value: function render() {
37 | var source = this.props.source;
38 |
39 | var className = this.props.className || 'markdown';
40 | var style = this.props.style || {};
41 | var content = void 0;
42 | if (source) {
43 | content = _react2.default.createElement(_content2.default, { source: source });
44 | } else {
45 | content = _react2.default.Children.map(this.props.children, function (child, i) {
46 | if (typeof child === 'string') {
47 | return _react2.default.createElement(_content2.default, { key: i, source: child });
48 | }
49 | return child;
50 | });
51 | }
52 | return _react2.default.createElement(
53 | 'div',
54 | { className: className, style: style },
55 | content
56 | );
57 | }
58 | }]);
59 |
60 | return Markdown;
61 | }(_react.Component);
62 |
63 | exports.default = Markdown;
--------------------------------------------------------------------------------
/lib/parseuri.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | Object.defineProperty(exports, "__esModule", {
4 | value: true
5 | });
6 | exports.default = parseuri;
7 | /**
8 | * Parses an URI
9 | *
10 | * @author Steven Levithan ${code}
`;
26 | }
27 |
28 | export function render(code, language) {
29 | const lang = (language || '').toLowerCase();
30 | const externalLang = externalLangs[lang];
31 | if (externalLang) {
32 | return external(code, externalLang);
33 | }
34 | if (lang.match(/^diff?/i)) {
35 | const view =
95 |
98 | );
99 | }
100 | }
101 |
102 | export default MarkdownEditor;
103 |
--------------------------------------------------------------------------------
/src/editor/index.js:
--------------------------------------------------------------------------------
1 | export { default } from './editor';
2 |
--------------------------------------------------------------------------------
/src/editor/split.scss:
--------------------------------------------------------------------------------
1 | .Resizer {
2 | background: #000;
3 | opacity: .2;
4 | z-index: 1;
5 | box-sizing: border-box;
6 | background-clip: padding-box;
7 | }
8 |
9 | .Resizer:hover {
10 | transition: all 2s ease;
11 | }
12 |
13 | .Resizer.horizontal {
14 | height: 11px;
15 | margin: -5px 0;
16 | border-top: 5px solid rgba(255, 255, 255, 0);
17 | border-bottom: 5px solid rgba(255, 255, 255, 0);
18 | cursor: row-resize;
19 | width: 100%;
20 | }
21 |
22 | .Resizer.horizontal:hover {
23 | border-top: 5px solid rgba(0, 0, 0, 0.5);
24 | border-bottom: 5px solid rgba(0, 0, 0, 0.5);
25 | }
26 |
27 | .Resizer.vertical {
28 | width: 11px;
29 | margin: 0 -5px;
30 | border-left: 5px solid rgba(255, 255, 255, 0);
31 | border-right: 5px solid rgba(255, 255, 255, 0);
32 | cursor: col-resize;
33 | height: 100%;
34 | }
35 |
36 | .Resizer.vertical:hover {
37 | border-left: 5px solid rgba(0, 0, 0, 0.5);
38 | border-right: 5px solid rgba(0, 0, 0, 0.5);
39 | }
40 |
--------------------------------------------------------------------------------
/src/editor/style.scss:
--------------------------------------------------------------------------------
1 | @import "split";
2 |
3 | .markdown_editor {
4 | min-height: 300px;
5 | }
6 |
7 | .markdown_editor .toolbar span {
8 | cursor: pointer;
9 | display: inline-block;
10 | margin: 2px;
11 | padding: 4px;
12 | min-width: 20px;
13 | min-height: 20px;
14 | text-align: center;
15 | vertical-align: middle;
16 | border-radius: 25%;
17 | }
18 |
19 | .markdown_editor .toolbar span:hover {
20 | background-color: lightgray;
21 | }
22 |
--------------------------------------------------------------------------------
/src/editor/toolbar.jsx:
--------------------------------------------------------------------------------
1 | import _ from 'lodash';
2 | import React from 'react';
3 | import classNames from 'classnames';
4 | import { hint } from 'css-effects';
5 | import style from './style.scss';
6 |
7 | function Button(props) {
8 | const className = classNames(props.icon ? props.icon : null);
9 | const attrs = _.pick(props);
10 | let btnClass = '';
11 | const btnAttrs = _.pick(props, 'onClick');
12 | if (props.title) {
13 | btnClass = hint();
14 | btnAttrs['data-hint'] = props.title;
15 | }
16 | return (
17 |
18 | {props.text}
19 |
20 | );
21 | }
22 |
23 | export default function Toolbar(props) {
24 | const action = type => () => props.onAction(type);
25 | const editMode = props.mode === 'edit';
26 | const modeButton = {
27 | icon: editMode ? 'fa fa-eye' : 'fa fa-edit',
28 | title: editMode ? 'Preview' : 'Edit',
29 | onClick: action('mode'),
30 | };
31 | // TODO disabled button states
32 | return (
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 | );
44 | }
45 |
--------------------------------------------------------------------------------
/src/embed.jsx:
--------------------------------------------------------------------------------
1 | import _ from 'lodash';
2 | import React from 'react';
3 | import { renderToStaticMarkup } from 'react-dom/server';
4 | import classNames from 'classnames';
5 | import hashtrie from 'hashtrie';
6 | import * as regex from './regex';
7 | import styles from './style.scss';
8 | import parseuri from './parseuri';
9 |
10 | let rulemap = hashtrie.empty;
11 |
12 | function queryString(params) {
13 | return _.map(params, (v, k) => `${k}=${v}`).join('&');
14 | }
15 |
16 | // embedding with embed.js
17 | function embed(url) {
18 | return ``;
19 | }
20 |
21 | function iframe(props, containerProps = {}) {
22 | const iframeProps = {
23 | ...props,
24 | frameBorder: 0,
25 | webkitAllowFullScreen: true,
26 | mozallowfullscreen: true,
27 | allowFullScreen: true,
28 | };
29 | delete iframeProps.className;
30 | delete iframeProps.afterFrame;
31 | const className = classNames(styles.embed_container, props.className);
32 | const container = (
33 |
34 |
35 | {props.afterFrame || null}
36 |
37 | );
38 | return renderToStaticMarkup(container);
39 | }
40 |
41 | function canApplyRule(test, url) {
42 | if (typeof test === 'function') {
43 | return test(url);
44 | }
45 | return test.exec(url);
46 | }
47 |
48 | function makeRule(test, render) {
49 | if (test === undefined) {
50 | throw new Error('nre');
51 | }
52 | if (_.isArray(test)) {
53 | const fn = url => _.some(test, t => canApplyRule(t, url));
54 | return { test: fn, render };
55 | }
56 | return { test, render };
57 | }
58 |
59 | function rule(host, test, render) {
60 | const value = makeRule(test, render);
61 | if (host) {
62 | rulemap = rulemap.set(host, value);
63 | rulemap = rulemap.set(`www.${host}`, value);
64 | }
65 | return value;
66 | }
67 |
68 | function rules(host, set) { // eslint-disable-line
69 | rulemap = rulemap.set(host, set);
70 | rulemap = rulemap.set(`www.${host}`, set);
71 | }
72 |
73 | const image = rule('', regex.imageExt, url => `
123 | // How to tell when your cat is fully charged
124 | //
125 | //
126 | // });
127 |
128 | // audio
129 |
130 | const soundcloudParams = queryString({
131 | auto_play: 'false',
132 | hide_related: 'false',
133 | show_comments: 'true',
134 | show_user: 'true',
135 | show_reposts: 'false',
136 | visual: 'false',
137 | download: 'false',
138 | color: 'f50000',
139 | theme_color: 'f50000',
140 | });
141 |
142 | rule('soundcloud.com', regex.soundcloud, (url, match) => {
143 | const player = `https://w.soundcloud.com/player/?url=soundcloud.com/${match[1]}/${match[2]}&`;
144 | const src = `${player}${soundcloudParams}`;
145 | return iframe({ className: styles.soundcloud, src, scrolling: 'no' });
146 | });
147 |
148 | rule('spotify.com', regex.spotify, embed);
149 | // code
150 | rule('github.com', regex.github, embed);
151 | rule('gist.github.com', regex.gist, embed);
152 |
153 | rule('codepen.io', regex.codepen, (url, match) => {
154 | const slug = match[2];
155 | const src = `https://codepen.io/${match[1]}/embed/preview/${slug}?height=300&slug-hash=${slug}&default-tab=result&host=http%3A%2F%2Fcodepen.io`; // eslint-disable-line
156 | return iframe({ className: styles.codepen, src });
157 | });
158 |
159 | rule('ideone.com', regex.ideone, embed);
160 | rule('jsbin.com', regex.jsbin, embed);
161 | rule('jsfiddle.net', regex.jsfiddle, embed);
162 | rule('plnkr.co', regex.plunker, embed);
163 | // social
164 | rule('twitter.com', regex.twitter, embed);
165 |
166 | function applyRule(self, url) {
167 | if (typeof self.test === 'function') {
168 | if (self.test(url)) {
169 | return self.render(url);
170 | }
171 | return undefined;
172 | }
173 | const match = self.test.exec(url);
174 | if (match) {
175 | return self.render(url, match);
176 | }
177 | return undefined;
178 | }
179 |
180 | function embedURL(url) {
181 | if (!url) return undefined;
182 |
183 | const uri = parseuri(url);
184 | if (!uri) return undefined;
185 |
186 | if (url.match(image.test)) {
187 | return image.render(url);
188 | }
189 |
190 | const set = rulemap.get(uri.host);
191 | if (!set) return undefined;
192 |
193 | if (_.isArray(set)) {
194 | for (let i = 0; i < set.length; i += 1) {
195 | const result = applyRule(set[i], url);
196 | if (result) return result;
197 | }
198 | return undefined;
199 | }
200 |
201 | return applyRule(set, url);
202 | }
203 |
204 | /* eslint-disable no-param-reassign */
205 | export default function plugin(md) {
206 | let skip = false;
207 | md.renderer.rules.link_open = function link(tokens, i, options) {
208 | if (i + 2 < tokens.length
209 | && tokens[i + 1].type === 'text'
210 | && tokens[i + 2].type === 'link_close') {
211 | const result = embedURL(tokens[i + 1].content);
212 | if (typeof result === 'string') {
213 | skip = true;
214 | return result;
215 | }
216 | }
217 | return md.renderer.renderToken(tokens, i, options);
218 | };
219 |
220 | const renderText = md.renderer.rules.text;
221 | md.renderer.rules.text = function link(tokens, i, options, self) {
222 | if (skip) return '';
223 | return renderText(tokens, i, options, self);
224 | };
225 |
226 | md.renderer.rules.link_close = function link(tokens, i, options) {
227 | if (skip) {
228 | skip = false;
229 | return '';
230 | }
231 | return md.renderer.renderToken(tokens, i, options);
232 | };
233 | }
234 | /* eslint-enable */
235 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | export { default as Markdown } from './markdown';
2 | export { default } from './markdown';
3 | export { default as MarkdownEditor } from './editor';
4 | export { default as render } from './render';
5 | export { linkTo } from './linkify';
6 |
--------------------------------------------------------------------------------
/src/inject.js:
--------------------------------------------------------------------------------
1 | /*eslint-disable*/
2 | import sequenceDiagram from 'js-sequence-diagrams';
3 | import flowchart from 'flowchart.js';
4 | /*eslint-enable*/
5 | import katex from 'katex';
6 | import railroad from './railroad';
7 | // import katexStyles from '../bower_components/KaTeX/dist/katex.min.css'; // eslint-disable-line
8 | // import EmbedJS from 'embed-js/src/js/main.js'; // eslint-disable-line
9 | // import embedStyles from 'embed-js/src/embed.css'; // eslint-disable-line
10 |
11 | function inject(element) {
12 | const $e = $(element);
13 | if ($e.is('.diagram')) {
14 | const lang = $e.data('lang');
15 | switch (lang) {
16 | case 'sequence':
17 | $e.sequenceDiagram({ theme: 'hand' });
18 | break;
19 | case 'flowchart':
20 | $e.flowChart();
21 | break;
22 | case 'railroad':
23 | railroad(element);
24 | break;
25 | default:
26 | break;
27 | }
28 | return;
29 | }
30 | if ($e.is('.tex')) {
31 | try {
32 | const text = $e.text();
33 | katex.render(text, element);
34 | } catch (e) {
35 | console.log('katex failed:', e);
36 | }
37 | return;
38 | }
39 | if ($e.is('.embedjs')) {
40 | // const em = new window.EmbedJS({
41 | // element,
42 | // });
43 | // em.render();
44 | }
45 | }
46 |
47 | export default function render(elems) {
48 | $.each(elems, (i, e) => inject(e));
49 | }
50 |
--------------------------------------------------------------------------------
/src/linkify.js:
--------------------------------------------------------------------------------
1 | const linkTo = {
2 | user: 'https://twitter.com/',
3 | issue: 'https://github.com/reactbits/markdown/issues/',
4 | hashtag: 'https://twitter.com/hashtag/',
5 | };
6 |
7 | export { linkTo };
8 |
9 | export default function configureLinkifier(linkify) {
10 | linkify.set({
11 | fuzzyLink: true,
12 | fuzzyIP: false,
13 | fuzzyEmail: true,
14 | });
15 |
16 | const rexprs = { };
17 |
18 | function register(prefix, key, replaceUrl) {
19 | linkify.add(prefix, {
20 | validate: function validate(text, pos, self) {
21 | const tail = text.slice(pos);
22 |
23 | let re = rexprs[key];
24 | if (!re) {
25 | re = new RegExp(`^([a-zA-Z0-9_]){1,15}(?!_)(?=$|${self.re.src_ZPCc})`);
26 | rexprs[key] = re;
27 | }
28 |
29 | if (re.test(tail)) {
30 | // Linkifier allows punctuation chars before prefix,
31 | // but we additionally disable `@` ("@@mention" is invalid)
32 | if (pos >= 2 && tail[pos - 2] === prefix) {
33 | return false;
34 | }
35 | return tail.match(re)[0].length;
36 | }
37 |
38 | return 0;
39 | },
40 |
41 | /*eslint-disable*/
42 | normalize: function normalize(match) {
43 | match.url = replaceUrl(match.url);
44 | },
45 | /*eslint-enable*/
46 | });
47 | }
48 |
49 | register('@', 'mention', url => linkTo.user + url.replace(/^@/, ''));
50 | register('issue ', 'issue', url => linkTo.issue + url.replace(/^issue /, ''));
51 | register('#', 'hashtag', url => linkTo.hashtag + url.replace(/^#/, ''));
52 | }
53 |
--------------------------------------------------------------------------------
/src/markdown.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import Content from './content';
3 |
4 | export default class Markdown extends Component {
5 | render() {
6 | const { source } = this.props;
7 | const className = this.props.className || 'markdown';
8 | const style = this.props.style || {};
9 | let content;
10 | if (source) {
11 | content = {content}
22 | );
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/src/parseuri.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Parses an URI
3 | *
4 | * @author Steven Levithan