2022-04-11: I’ve updated the post below as the adf-schema package was changed just after I posted.
I hope somebody finds this helpful.
The @atlaskit documentation can be found here.
Below is the code to do the Wiki Markup <-> HTML conversions. I’m pretty sure that you can just stap out the WikiMarkupTransformer for the JSON transformer.
// (Markdown / Jira Markdown) <-> HTML
import { defaultSchema } from '@atlaskit/adf-schema/schema-default';
import { WikiMarkupTransformer } from '@atlaskit/editor-wikimarkup-transformer';
import { DOMParser, DOMSerializer } from 'prosemirror-model';
/**
* Convert Jira "Wiki Markup" -> ProseMirror -> HTML
* @param {string} md The Jira "Markdown" string
* @returns {string} The generated HTML
*/
const toHTML = md => {
// Convert the Wiki Markup from Jira to a ProseMirror node
const transformer = new WikiMarkupTransformer(defaultSchema);
const pmNode = transformer.parse(md);
// Serialize Prose Mirror Node to a DocumentFragment
const dom = DOMSerializer.fromSchema(defaultSchema).serializeFragment(pmNode);
// Get the HTML
const div = document.createElement('div');
div.appendChild(dom);
const html = div.innerHTML;
return html;
};
/**
* Convert HTML -> DOM -> ParseMirror -> Jira "Wiki Markup"
* @param {string} html The HTML
* @returns {string} The generated Jira ADF
*/
const toMD = html => {
// Create a new document and set the body
const dom = document.implementation.createHTMLDocument();
dom.body.innerHTML = html;
console.debug('toMD', { dom });
// Parse the DOM into ProseMirror and export to Wiki Markup
const pmNode = DOMParser.fromSchema(defaultSchema).parse(dom);
const transformer = new WikiMarkupTransformer(defaultSchema);
const md = transformer.encode(pmNode);
return md;
};
export { toHTML, toMD };