DatoCMS
\nThe most complete, user-friendly and performant Headless CMS.
\n tag.\nasync function p(createDastNode, hastNode, context) {\n return createDastNode('paragraph', {\n children: await visitChildren(createDastNode, hastNode, context),\n });\n}\n```\n\nHandlers can return either a promise that resolves to a `dast` node, an array of `dast` nodes or `undefined` to skip the current node.\n\nTo ensure that a valid `dast` is generated, the default handlers also check that the current `hastNode` is a valid `dast` node for its parent and, if not, they ignore the current node and continue visiting its children.\n\nInformation about the parent `dast` node name is available in `context.parentNodeType`.\n\nPlease take a look at the [default handlers implementation](./src/handlers.ts) for examples.\n\nThe default handlers are available on `context.defaultHandlers`.\n\n### Context\n\nEvery handler receives a `context` object with the following shape:\n\n```ts\nimport type { Nodes as HastNodes } from 'hast';\n\nexport interface GlobalContext {\n // Whether the library has found a convert this to an h1 to \n visit(tree, 'element', (node) => {\n if (node.tagName === 'p') {\n node.tagName = 'h1';\n }\n });\n },\n}).then((structuredText) => {\n console.log(structuredText);\n});\n```\n\n### Examples\n\n
\n \n\nSplit a node that contains an image.
\n\nIn `dast` images can be represented as `Block` nodes, but these are not allowed inside `ListItem` nodes (ul/ol lists). In this example we split the list in three pieces and lift up the image.\n\nThe same approach can be used to split other types of branches and lift up nodes to become root nodes.\n\n```js\nimport { visitParents } from 'unist-util-visit-parents';\n\nconst html = `\n \n
\n`;\n\nconst dast = await htmlToStructuredText(html, {\n preprocess: (tree) => {\n const liftedImages = new WeakSet();\n\n visitParents(tree, 'element', (node, ancestors) => {\n if (\n node.tagName !== 'img' ||\n liftedImages.has(node) ||\n ancestors.length <= 1 // already a top-level img\n ) {\n return;\n }\n\n const parents = ancestors;\n const imgParent = parents[parents.length - 1];\n const index = imgParent.children.indexOf(node);\n imgParent.children.splice(index, 1);\n\n let i = parents.length;\n let splitChildrenIndex = index;\n let childrenAfterSplitPoint = [];\n\n while (--i > 0) {\n const parent = parents[i];\n const parentsParent = parents[i - 1];\n\n // Delete the siblings after the image and save them.\n childrenAfterSplitPoint = parent.children.splice(splitChildrenIndex);\n\n splitChildrenIndex = parentsParent.children.indexOf(parent);\n\n let nodeInserted = false;\n\n // Once we reach the topmost parent, insert the image node.\n if (i === 1) {\n splitChildrenIndex += 1;\n parentsParent.children.splice(splitChildrenIndex, 0, node);\n liftedImages.add(node);\n nodeInserted = true;\n }\n\n splitChildrenIndex += 1;\n if (childrenAfterSplitPoint.length > 0) {\n parentsParent.children.splice(splitChildrenIndex, 0, {\n ...parent,\n children: childrenAfterSplitPoint,\n });\n }\n\n if (parent.children.length === 0) {\n splitChildrenIndex -= 1;\n parentsParent.children.splice(\n nodeInserted ? splitChildrenIndex - 1 : splitChildrenIndex,\n 1,\n );\n }\n }\n });\n },\n handlers: {\n img: async (createNode, node, context) => {\n // In a real scenario you would upload the image to Dato and get back an id.\n const item = '123';\n return createNode('block', { item });\n },\n },\n});\n```\n\n![](\"./img.png\")
\n \n\n### Utilities\n\nTo work with `hast` and `dast` trees we recommend the [unified ecosystem](https://unifiedjs.com/) — in particular:\n\n- [`unist-util-visit`](https://www.npmjs.com/package/unist-util-visit) and [`unist-util-visit-parents`](https://www.npmjs.com/package/unist-util-visit-parents) for tree traversal\n- [`@types/hast`](https://www.npmjs.com/package/@types/hast) for hast node types (`Root`, `Element`, `Text`, `Nodes`)\n\nFor `dast` trees specifically, the [`datocms-structured-text-utils`](https://www.npmjs.com/package/datocms-structured-text-utils) package provides tailored traversal helpers (`collectNodes`, `findFirstNode`, `mapNodes`, `filterNodes`, …).\n\n## License\n\nMIT\n","readmeFilename":"README.md"}Lift up an image node
\n\n```js\nimport { visitParents, CONTINUE } from 'unist-util-visit-parents';\n\nconst html = `\n \n
\n`;\n\nconst dast = await htmlToStructuredText(html, {\n preprocess: (tree) => {\n visitParents(tree, 'element', (node, ancestors) => {\n if (node.tagName === 'img' && ancestors.length > 1) {\n const parent = ancestors[ancestors.length - 1];\n const index = parent.children.indexOf(node);\n tree.children.push(node);\n parent.children.splice(index, 1);\n return [CONTINUE, index];\n }\n });\n },\n handlers: {\n img: async (createNode, node, context) => {\n // In a real scenario you would upload the image to Dato and get back an id.\n const item = '123';\n return createNode('block', { item });\n },\n },\n});\n```\n\nitem 2