Parallel Routes Generator

Parallel Routes Generator 是一项专为使用 App Router 的 Next.js 应用程序所设计的工程技能。它为处理模态窗口 (modals) 与对话框 (dialogs) 提供了一套标准化架构模式，确保视图之间的导航不会触发不必要的页面布局偏移 (layout shifts)，从而显著提升用户体验与技术稳定性。通过运用 Next.js 的平行路由 (Parallel Routes) 与拦截路由 (Intercepted Routes) 功能，此工具能够创造流畅的切换效果，让内容以浮动窗口呈现，同时维持底层页面作为背景插槽，确保透过直接 URL 访问时仍能正确渲染完整页面。

• 自动配置目录结构中的 @modal 插槽模式。

• 标准化 default.tsx 的实现，确保模态窗口在未激活时能被安全地处理为 null。

• 实现 (..) 拦截路由，以维持客户端导航与直接链接行为的一致性。

• 提供可重复使用的 Modal 组件，利用 @radix-ui/react-dialog 确保无障碍访问性与键盘焦点管理。

• 整合 useRouter 钩子，在关闭模态窗口时自动处理后退导航行为。

• 强制执行此模式于所有模态相关 UI 任务，以防止状态管理不一致。

• 当用户提及 'modal'、'dialog'、'popup'、'parallel route' 或 'intercepted route' 时，应触发此技能。

• 输入：目标路由路径与拟显示于模态窗口的组件内容。

• 输出：功能完整且具无障碍性的 React Modal 组件、对应的路由插槽文件夹结构，以及必要的 layout 注入代码。

• 限制：需具备现有的 App Router 设置；必须严格遵循项目中定义的 parent/slot 布局架构。

• 最佳实践：务必确保 layout.tsx 文件同时接受 {children} 与 {modal} 属性，以防止运行时的插槽错误。