use hastscript to fix nesting issue

package.json

@@ -81,6 +81,7 @@
     "hast-util-from-html": "^2.0.1",
     "hast-util-sanitize": "^5.0.2",
     "hast-util-to-html": "^9.0.3",
+    "hastscript": "^9.0.0",
     "husky": "^9.1.6",
     "image-minimizer-webpack-plugin": "^4.0.2",
     "imagemin": "^9.0.0",

src/transformers/api-structure-previews.ts

@@ -2,6 +2,7 @@ import fs from 'node:fs';
 import path from 'node:path';
 
 import logger from '@docusaurus/logger';
+import { h } from 'hastscript';
 import { visitParents } from 'unist-util-visit-parents';
 import { filter } from 'unist-util-filter';
 import { Node, Parent } from 'unist';
@@ -174,7 +175,22 @@ async function transformer(tree: Parent, file: VFile) {
               siblings.push(filtered);
             } else {
               // This schema option allows `className` on all elements for API labeling
-              const HAST = sanitize(toHast(structureContent as Root), {
+              const HAST = toHast(structureContent as Root, {
+                unknownHandler: (_, node) => {
+                  if (
+                    node.name === 'APIStructurePreview' &&
+                    node?.data?._originalLink
+                  ) {
+                    const { _originalLink } = node.data;
+                    return h('a', { href: _originalLink.url }, [
+                      _originalLink.text,
+                    ]);
+                  }
+                  return undefined;
+                },
+              });
+
+              const sanitized = sanitize(HAST, {
                 ...defaultSchema,
                 attributes: {
                   ...defaultSchema.attributes,
@@ -184,6 +200,7 @@ async function transformer(tree: Parent, file: VFile) {
                   ],
                 },
               });
+
               // replace the Link node with an MDX element in-place
               const title = (node.children[0] as Text | InlineCode).value;
               const previewNode = node as unknown as MdxJsxFlowElement;
@@ -192,6 +209,10 @@ async function transformer(tree: Parent, file: VFile) {
               previewNode.children = [];
               previewNode.data = {
                 _mdxExplicitJsx: true,
+                _originalLink: {
+                  url: relativeStructureUrl,
+                  text: title,
+                },
               };
               previewNode.attributes = [
                 {
@@ -207,7 +228,7 @@ async function transformer(tree: Parent, file: VFile) {
                 {
                   type: 'mdxJsxAttribute',
                   name: 'content',
-                  value: JSON.stringify(HAST),
+                  value: JSON.stringify(sanitized),
                 },
               ];
             }

yarn.lock

@@ -8700,6 +8700,17 @@ hastscript@^8.0.0:
     property-information "^6.0.0"
     space-separated-tokens "^2.0.0"
 
+hastscript@^9.0.0:
+  version "9.0.0"
+  resolved "https://registry.yarnpkg.com/hastscript/-/hastscript-9.0.0.tgz#2b76b9aa3cba8bf6d5280869f6f6f7165c230763"
+  integrity sha512-jzaLBGavEDKHrc5EfFImKN7nZKKBdSLIdGvCwDZ9TfzbF2ffXiov8CKE445L2Z1Ek2t/m4SKQ2j6Ipv7NyUolw==
+  dependencies:
+    "@types/hast" "^3.0.0"
+    comma-separated-tokens "^2.0.0"
+    hast-util-parse-selector "^4.0.0"
+    property-information "^6.0.0"
+    space-separated-tokens "^2.0.0"
+
 he@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"