public/component-diagram.svg

<svg xmlns='http://www.w3.org/2000/svg' width='800' height='500' viewBox='0 0 800 500'>
  <rect width='800' height='500' fill='#f5f5f5'/>
  <text x='400' y='50' font-family='Arial' font-size='24' text-anchor='middle' fill='#333'>NeuralFlux Component Architecture</text>
  
  <!-- 顶层组件 -->
  <rect x='300' y='100' width='200' height='60' rx='10' fill='#4285f4' opacity='0.8'/>
  <text x='400' y='135' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Application Entry (_app.tsx)</text>
  
  <!-- 页面组件 -->
  <rect x='100' y='200' width='140' height='60' rx='10' fill='#34a853' opacity='0.8'/>
  <text x='170' y='235' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Home (index.tsx)</text>
  
  <rect x='260' y='200' width='140' height='60' rx='10' fill='#34a853' opacity='0.8'/>
  <text x='330' y='235' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Create (create.tsx)</text>
  
  <rect x='420' y='200' width='140' height='60' rx='10' fill='#34a853' opacity='0.8'/>
  <text x='490' y='235' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Mint (mint.tsx)</text>
  
  <rect x='580' y='200' width='140' height='60' rx='10' fill='#34a853' opacity='0.8'/>
  <text x='650' y='235' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Market (market.tsx)</text>
  
  <!-- 核心组件 -->
  <rect x='180' y='300' width='140' height='60' rx='10' fill='#fbbc05' opacity='0.8'/>
  <text x='250' y='335' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Wallet Context</text>
  
  <rect x='340' y='300' width='140' height='60' rx='10' fill='#fbbc05' opacity='0.8'/>
  <text x='410' y='335' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>AI Generation</text>
  
  <rect x='500' y='300' width='140' height='60' rx='10' fill='#fbbc05' opacity='0.8'/>
  <text x='570' y='335' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>NFT Components</text>
  
  <!-- 工具库 -->
  <rect x='100' y='400' width='140' height='60' rx='10' fill='#ea4335' opacity='0.8'/>
  <text x='170' y='435' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Wallet Connector</text>
  
  <rect x='260' y='400' width='140' height='60' rx='10' fill='#ea4335' opacity='0.8'/>
  <text x='330' y='435' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>API Client</text>
  
  <rect x='420' y='400' width='140' height='60' rx='10' fill='#ea4335' opacity='0.8'/>
  <text x='490' y='435' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Blockchain Utils</text>
  
  <rect x='580' y='400' width='140' height='60' rx='10' fill='#ea4335' opacity='0.8'/>
  <text x='650' y='435' font-family='Arial' font-size='16' text-anchor='middle' fill='white'>Storage Utils</text>
  
  <!-- 连接线 -->
  <line x1='400' y1='160' x2='170' y2='200' stroke='#333' stroke-width='2'/>
  <line x1='400' y1='160' x2='330' y2='200' stroke='#333' stroke-width='2'/>
  <line x1='400' y1='160' x2='490' y2='200' stroke='#333' stroke-width='2'/>
  <line x1='400' y1='160' x2='650' y2='200' stroke='#333' stroke-width='2'/>
  
  <line x1='170' y1='260' x2='250' y2='300' stroke='#333' stroke-width='2'/>
  <line x1='330' y1='260' x2='250' y2='300' stroke='#333' stroke-width='2'/>
  <line x1='330' y1='260' x2='410' y2='300' stroke='#333' stroke-width='2'/>
  <line x1='490' y1='260' x2='410' y2='300' stroke='#333' stroke-width='2'/>
  <line x1='490' y1='260' x2='570' y2='300' stroke='#333' stroke-width='2'/>
  <line x1='650' y1='260' x2='570' y2='300' stroke='#333' stroke-width='2'/>
  
  <line x1='250' y1='360' x2='170' y2='400' stroke='#333' stroke-width='2'/>
  <line x1='250' y1='360' x2='330' y2='400' stroke='#333' stroke-width='2'/>
  <line x1='410' y1='360' x2='330' y2='400' stroke='#333' stroke-width='2'/>
  <line x1='410' y1='360' x2='490' y2='400' stroke='#333' stroke-width='2'/>
  <line x1='570' y1='360' x2='490' y2='400' stroke='#333' stroke-width='2'/>
  <line x1='570' y1='360' x2='650' y2='400' stroke='#333' stroke-width='2'/>
</svg> 