gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

display images inserted through rte

Browse Source
This commit is contained in:
Shawn Erquhart 2017-07-27 13:11:54 -04:00
parent 336cab2592
commit 1f961d36cf
3 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Widgets/Markdown/MarkdownPreview/index.js
View File

@ -6,7 +6,7 @@ const MarkdownPreview = ({ value, getAsset }) => {
if (value === null) { if (value === null) {
return null; return null;
} }
const html = remarkToHtml(value); const html = remarkToHtml(value, getAsset);
return <div style={previewStyle} dangerouslySetInnerHTML={{__html: html}}></div>; return <div style={previewStyle} dangerouslySetInnerHTML={{__html: html}}></div>;
}; };

8
src/components/Widgets/Markdown/unified.js
View File

@ -215,7 +215,7 @@ const remarkShortcodes = ({ plugins }) => {
} }
}; };
const remarkToRehypeShortcodes = ({ plugins }) => { const remarkToRehypeShortcodes = ({ plugins, getAsset }) => {
return transform; return transform;
function transform(node) { function transform(node) {
@ -225,7 +225,7 @@ const remarkToRehypeShortcodes = ({ plugins }) => {
} }
const { shortcode, shortcodeData } = node.data; const { shortcode, shortcodeData } = node.data;
const plugin = plugins.get(shortcode); const plugin = plugins.get(shortcode);
const value = plugin.toPreview(shortcodeData); const value = plugin.toPreview(shortcodeData, getAsset);
const valueHtml = typeof value === 'string' ? value : renderToString(value); const valueHtml = typeof value === 'string' ? value : renderToString(value);
return { ...node, value: valueHtml }; return { ...node, value: valueHtml };
} }
@ -585,9 +585,9 @@ export const slateToRemark = raw => {
return result; return result;
}; };
export const remarkToHtml = mdast => { export const remarkToHtml = (mdast, getAsset) => {
const result = unified() const result = unified()
.use(remarkToRehypeShortcodes, { plugins: registry.getEditorComponents() }) .use(remarkToRehypeShortcodes, { plugins: registry.getEditorComponents(), getAsset })
.use(remarkToRehype, { allowDangerousHTML: true }) .use(remarkToRehype, { allowDangerousHTML: true })
.runSync(mdast); .runSync(mdast);

2
src/index.js
View File

@ -37,7 +37,7 @@ const buildtInPlugins = [{
alt: match[1], alt: match[1],
}, },
toBlock: data => `![${ data.alt }](${ data.image })`, toBlock: data => `![${ data.alt }](${ data.image })`,
toPreview: data => <img src={data.image} alt={data.alt} />, toPreview: (data, getAsset) => <img src={getAsset(data.image)} alt={data.alt} />,
pattern: /^!\[([^\]]+)]\(([^)]+)\)$/, pattern: /^!\[([^\]]+)]\(([^)]+)\)$/,
fields: [{ fields: [{
label: 'Image', label: 'Image',