add find children href url in paragraph

components/mdx/components.ts

@@ -7,11 +7,13 @@ import RUASandpack from 'components/rua/rua-sandpack';
 import Tab from 'components/rua/tab';
 import TabItem from 'components/rua/tab/tab-item';
 import GistCode from 'components/common/gist-code';
+import Paragraph from 'components/mdx/paragraph';
 
 const components = {
   RUASandpack,
   a: Anchor,
   pre: Pre,
+  p: Paragraph,
   Image,
   Tab,
   TabItem,

components/mdx/paragraph.tsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import { HTMLAttributes } from 'react';
+
+const Paragraph = (props: HTMLAttributes<HTMLParagraphElement>) => {
+  const { children, ...rest } = props;
+
+  // Find anchor href url in children
+  const links = React.Children.map(children, (child) => {
+    if (!React.isValidElement(child)) return null;
+    if (typeof child.type !== 'object') return null;
+    const childType = child.type as any;
+    if (!childType?.type) return null;
+    if (childType.type.render.displayName !== 'Anchor') return null;
+    const props = child.props as { href: string };
+    return props.href;
+  });
+
+  return (
+    <>
+      <p {...rest}>{children}</p>
+      {links?.map((url, i) => <div key={i}>{url}</div>)}
+    </>
+  );
+};
+
+export default Paragraph;

content/posts/musl-cross-compilation.mdx

@@ -4,6 +4,8 @@ date: '2023-12-26'
 tags: [Rust, Linux]
 ---
 
+test [rua](https://rua.plus) test [rua](https://rua.plus) test [rua](https://rua.plus)
+
 大多数 Linux 软件都是动态链接的，动态链接可以使我们的程序不需要将所有所需要的库都打包到自身当中去。不过这样也有弊处，当目标系统比较旧，或者压根就没有我们需要的库的时候，我们的二进制文件就无法在目标系统中运行。
 
 ## 安装交叉编译工具