import visit from 'unist-util-visit' import h from 'hastscript' import { removeClass, addClass, hasClass } from './rehype-util-class' const RE_SPACE = /[\w\r\n]*/ export default function attacher () { return tree => { visit(tree, 'element', (node, index, { children }) => { let { tagName, properties, properties: { src, alt, title, className } } = node if (tagName !== 'img' || src.match(/^\w+:\/\//)) { return } src = src.replace(/(\.\.)?\/assets\//g, '/images/content/') if (hasClass(node, 'preview')) { removeClass(node, 'preview') let fig = h(`figure${hasClass(node, 'hero') ? '.hero' : ''}`, [ h('div.preview', [ h('img', { src, alt, title, className, srcset: `${src} 2x` }) ]), ...(title || alt) ? [ h('figcaption', [ ...title ? [ h('p.caption', title) ] : [], ...alt ? [ h('p.desc', alt) ] : [] ]) ] : [] ]) children.splice(index, 1, fig) if (hasClass(node, 'bad')) { removeClass(node, 'bad') addClass(fig, 'bad') let prev let prevIndex = index - 1 while (true) { prev = children[prevIndex] if (!prev) { break } // skip whitespace-only text nodes if (prev.type === 'text' && RE_SPACE.test(prev.value)) { prevIndex-- continue } break } if (prev) { let prevPreview = (prev.children || [])[0] if (prevPreview && hasClass(prevPreview, 'preview')) { let prevImg = (prevPreview.children || [])[0] if (hasClass(prevImg, 'good')) { removeClass(prevImg, 'good') addClass(prev, 'good') children.splice(index - 1, 2, h('div.comparison', [prev, fig])) } } } } } else { properties.src = src properties.srcset = `${src} 2x` if (className && !className.length) { delete properties.className } } }) } }