docs: add copy subscriber button (#12405)

* docs: add copy subscriber button

* re-generate

* fixes + update copy button

www/packages/docs-utils/src/estree-to-js.ts

@@ -5,6 +5,8 @@ import {
   Expression,
   ExpressionJsVar,
   ExpressionJsVarLiteral,
+  JSXElementExpression,
+  JSXTextExpression,
   LiteralExpression,
   ObjectExpression,
 } from "types"
@@ -64,7 +66,23 @@ function expressionToJs(
         data: (expression as LiteralExpression).value,
       } as ExpressionJsVarLiteral
     case "JSXElement":
-      // ignore JSXElements
-      return
+    case "JSXFragment":
+      // Only take text children
+      let text = ""
+      ;(expression as JSXElementExpression).children.forEach((child) => {
+        if (child.type !== "JSXText") {
+          return
+        }
+
+        text += (child as JSXTextExpression).value
+      })
+      return {
+        original: {
+          type: "Literal",
+          value: text,
+          raw: `"${text}"`,
+        },
+        data: text,
+      }
   }
 }

www/packages/docs-utils/src/get-clean-md.ts

@@ -14,6 +14,7 @@ import {
   parseComponentExample,
   parseComponentReference,
   parseDetails,
+  parseEventHeader,
   parseHookValues,
   parseIconSearch,
   parseNote,
@@ -48,6 +49,7 @@ const parsers: Record<string, ComponentParser> = {
   HookValues: parseHookValues,
   Colors: parseColors,
   SplitList: parseSplitList,
+  EventHeader: parseEventHeader,
 }
 
 const isComponentAllowed = (nodeName: string): boolean => {

www/packages/docs-utils/src/utils/parsers.ts

@@ -951,6 +951,54 @@ export const parseSplitList: ComponentParser = (
   return [SKIP, index]
 }
 
+export const parseEventHeader: ComponentParser = (
+  node: UnistNodeWithData,
+  index: number,
+  parent: UnistTree
+): VisitorResult => {
+  const headerContent = node.attributes?.find(
+    (attr) => attr.name === "headerProps"
+  )
+  const headerLvl = node.attributes?.find((attr) => attr.name === "headerLvl")
+
+  if (
+    !headerContent ||
+    typeof headerContent.value === "string" ||
+    !headerContent.value.data?.estree ||
+    !headerLvl ||
+    typeof headerLvl.value !== "string" ||
+    !headerLvl.value
+  ) {
+    return
+  }
+
+  const headerPropsJsVar = estreeToJs(headerContent.value.data.estree)
+
+  if (
+    !isExpressionJsVarObj(headerPropsJsVar) ||
+    !("children" in headerPropsJsVar) ||
+    !isExpressionJsVarLiteral(headerPropsJsVar.children)
+  ) {
+    return
+  }
+
+  const headerLevel = parseInt(headerLvl.value, 10)
+  const headerChildren = headerPropsJsVar.children.data as string
+
+  const headerChildrenNode = {
+    type: "text",
+    value: headerChildren,
+  }
+  const headerNode = {
+    type: "heading",
+    depth: headerLevel,
+    children: [headerChildrenNode],
+  }
+
+  parent?.children.splice(index, 1, headerNode)
+  return [SKIP, index]
+}
+
 /**
  * Helpers
  */
@@ -964,11 +1012,13 @@ const getTextNode = (node: UnistNode): UnistNode | undefined => {
       textNode = child
     } else if (child.type === "paragraph") {
       textNode = getTextNode(child)
+    } else if (child.type === "link") {
+      textNode = getTextNode(child)
     } else if (child.value) {
       textNode = child
     }
 
-    return false
+    return textNode !== undefined
   })
 
   return textNode