Consolidate React components and add Astro wrappers

- Move PixelBlast.tsx and StarBorder.tsx from src/components/ to src/components/react/
- Add Astro wrappers for all React components that were missing them:
  - APIBody, AnimatedList, Callout, DotPattern, Param, ParamTable,
    Snippet, StatusBadge, StatusCodes
- Update all MDX files to import from Astro wrappers instead of @/components/react
- Update 404.astro and SearchDialog.tsx imports

This ensures consistent component organization:
- All React components live in src/components/react/
- All components used in MDX have Astro wrappers in src/components/

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <[email protected]>

Author: kylemclaren

src/components/APIBody.astro

@@ -0,0 +1,11 @@
+---
+import { APIBody as APIBodyReact } from './react/APIEndpoint';
+
+interface Props {
+  title: string;
+}
+
+const props = Astro.props;
+---
+
+<APIBodyReact {...props} client:load><slot /></APIBodyReact>

src/components/AnimatedList.astro

@@ -0,0 +1,17 @@
+---
+import { AnimatedList as AnimatedListReact } from './react/AnimatedList';
+
+interface Props {
+  items: (string | { id: string; content: unknown })[];
+  showGradients?: boolean;
+  enableArrowNavigation?: boolean;
+  className?: string;
+  itemClassName?: string;
+  displayScrollbar?: boolean;
+  initialSelectedIndex?: number;
+}
+
+const props = Astro.props;
+---
+
+<AnimatedListReact {...props} client:load />

src/components/Callout.astro

@@ -0,0 +1,12 @@
+---
+import { Callout as CalloutReact } from './react/Callout';
+
+interface Props {
+  type?: 'info' | 'warning' | 'danger' | 'tip';
+  title?: string;
+}
+
+const props = Astro.props;
+---
+
+<CalloutReact {...props} client:load><slot /></CalloutReact>

src/components/DotPattern.astro

@@ -0,0 +1,19 @@
+---
+import { DotPattern as DotPatternReact } from './react/DotPattern';
+
+interface Props {
+  width?: number;
+  height?: number;
+  x?: number;
+  y?: number;
+  cx?: number;
+  cy?: number;
+  cr?: number;
+  className?: string;
+  glow?: boolean;
+}
+
+const props = Astro.props;
+---
+
+<DotPatternReact {...props} client:load />

src/components/Param.astro

@@ -0,0 +1,15 @@
+---
+import { Param as ParamReact } from './react/ParamTable';
+
+interface Props {
+  name: string;
+  type: 'string' | 'integer' | 'boolean' | 'object' | 'array' | 'number';
+  required?: boolean;
+  default?: string;
+  description: string;
+}
+
+const props = Astro.props;
+---
+
+<ParamReact {...props} client:load><slot /></ParamReact>

src/components/ParamTable.astro

@@ -0,0 +1,7 @@
+---
+import { ParamTable as ParamTableReact } from './react/ParamTable';
+
+const props = Astro.props;
+---
+
+<ParamTableReact {...props} client:load><slot /></ParamTableReact>

src/components/Snippet.astro

@@ -0,0 +1,11 @@
+---
+import { Snippet as SnippetReact } from './react/CodeTabs';
+
+interface Props {
+  name: string;
+}
+
+const props = Astro.props;
+---
+
+<SnippetReact {...props} client:load><slot /></SnippetReact>

src/components/StatusBadge.astro

@@ -0,0 +1,12 @@
+---
+import { StatusBadge as StatusBadgeReact } from './react/StatusCodes';
+
+interface Props {
+  code: number;
+  label?: string;
+}
+
+const props = Astro.props;
+---
+
+<StatusBadgeReact {...props} client:load />

src/components/StatusCodes.astro

@@ -0,0 +1,18 @@
+---
+import { StatusCodes as StatusCodesReact } from './react/StatusCodes';
+
+interface StatusCode {
+  code: number;
+  label: string;
+  description?: string;
+}
+
+interface Props {
+  codes: StatusCode[];
+  columns?: 2 | 3 | 4;
+}
+
+const props = Astro.props;
+---
+
+<StatusCodesReact {...props} client:load />