docs: change notes across docs based on redesign (#8662)

Change the prerequisites / soon / other notes based on latest redesign

Depends on #8661

www/packages/remark-rehype-plugins/src/cross-project-links.ts

@@ -61,6 +61,27 @@ function componentFixer(
     return
   }
 
+  const fixProperty = (item: ExpressionJsVar) => {
+    if (!isExpressionJsVarObj(item)) {
+      return
+    }
+
+    Object.entries(item).forEach(([key, value]) => {
+      if (
+        (key !== "href" && key !== "link") ||
+        !isExpressionJsVarLiteral(value)
+      ) {
+        return
+      }
+
+      value.original.value = matchAndFixLinks(
+        value.original.value as string,
+        options
+      )
+      value.original.raw = JSON.stringify(value.original.value)
+    })
+  }
+
   switch (node.name) {
     case "CardList":
       const itemsAttribute = getAttribute(node, "items")
@@ -79,24 +100,6 @@ function componentFixer(
         return
       }
 
-      const fixProperty = (item: ExpressionJsVar) => {
-        if (!isExpressionJsVarObj(item)) {
-          return
-        }
-
-        Object.entries(item).forEach(([key, value]) => {
-          if (key !== "href" || !isExpressionJsVarLiteral(value)) {
-            return
-          }
-
-          value.original.value = matchAndFixLinks(
-            value.original.value as string,
-            options
-          )
-          value.original.raw = JSON.stringify(value.original.value)
-        })
-      }
-
       if (Array.isArray(jsVar)) {
         jsVar.forEach(fixProperty)
       } else {
@@ -112,6 +115,31 @@ function componentFixer(
 
       hrefAttribute.value = matchAndFixLinks(hrefAttribute.value, options)
 
+      return
+    case "Prerequisites":
+      const prerequisitesItemsAttribute = getAttribute(node, "items")
+
+      if (
+        !prerequisitesItemsAttribute?.value ||
+        typeof prerequisitesItemsAttribute.value === "string" ||
+        !prerequisitesItemsAttribute.value.data?.estree
+      ) {
+        return
+      }
+
+      const prerequisitesJsVar = estreeToJs(
+        prerequisitesItemsAttribute.value.data.estree
+      )
+
+      if (!prerequisitesJsVar) {
+        return
+      }
+
+      if (Array.isArray(prerequisitesJsVar)) {
+        prerequisitesJsVar.forEach(fixProperty)
+      } else {
+        fixProperty(prerequisitesJsVar)
+      }
       return
   }
 }
@@ -126,7 +154,10 @@ export function crossProjectLinksPlugin(
       tree as UnistTree,
       ["element", "mdxJsxFlowElement"],
       (node: UnistNode) => {
-        const isComponent = node.name === "Card" || node.name === "CardList"
+        const isComponent =
+          node.name === "Card" ||
+          node.name === "CardList" ||
+          node.name === "Prerequisites"
         const isLink = node.tagName === "a" && node.properties?.href
         if (!isComponent && !isLink) {
           return

www/packages/remark-rehype-plugins/src/index.ts

@@ -3,6 +3,7 @@ export * from "./cloudinary-img.js"
 export * from "./cross-project-links.js"
 export * from "./local-links.js"
 export * from "./page-number.js"
+export * from "./prerequisites-link-fixer.js"
 export * from "./resolve-admonitions.js"
 export * from "./type-list-link-fixer.js"
 export * from "./workflow-diagram-link-fixer.js"

www/packages/remark-rehype-plugins/src/prerequisites-link-fixer.ts

@@ -0,0 +1,9 @@
+import { Transformer } from "unified"
+import { ComponentLinkFixerOptions } from "./types/index.js"
+import { componentLinkFixer } from "./utils/component-link-fixer.js"
+
+export function prerequisitesLinkFixerPlugin(
+  options?: ComponentLinkFixerOptions
+): Transformer {
+  return componentLinkFixer("Prerequisites", "items", options)
+}