feat: enable live component rendering in MDX docs

- Register all 24 components in mdx-components.tsx via client boundary
- MDX files can now render real components inline (not just code blocks)
- media.mdx updated with live Figure and PullQuote demos

packages/docs/app/docs/[[...slug]]/page.tsx

@@ -1,6 +1,7 @@
 import { source } from '@/lib/source';
 import { DocsPage, DocsBody } from 'fumadocs-ui/page';
 import { notFound } from 'next/navigation';
+import { useMDXComponents } from '../../../mdx-components';
 
 export default async function Page(props: { params: Promise<{ slug?: string[] }> }) {
   const params = await props.params;
@@ -8,10 +9,11 @@ export default async function Page(props: { params: Promise<{ slug?: string[] }>
   if (!page) notFound();
 
   const MDX = page.data.body;
+  const components = useMDXComponents({});
   return (
     <DocsPage toc={page.data.toc}>
       <DocsBody>
-        <MDX />
+        <MDX components={components} />
       </DocsBody>
     </DocsPage>
   );