トランプ再選でどうなる？2025年からの経済政策と日本への影響

import React from 'react';
import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, PieChart, Pie, Cell, LineChart, Line } from 'recharts';

const App = () => {
  // 減税と規制緩和に関するデータ
  const taxData = [
    { name: '法人税率', before: '21%', after: '15%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
    { name: '個人所得税最高税率', before: '37%', after: '37% (維持)', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
  ];

  // 関税と貿易に関するデータ
  const tariffData = [
    { name: '全輸入品', tariff: '10%または20%', link: '[43](https://eastasiaforum.org/2024/12/10/trumps-2025-agenda-trades-us-global-leadership-for-tariffs/)' },
    { name: '中国からの輸入品', tariff: '60%', link: '[43](https://eastasiaforum.org/2024/12/10/trumps-2025-agenda-trades-us-global-leadership-for-tariffs/)' },
    { name: 'メキシコ・カナダからの輸入品', tariff: '25% (条件付き)', link: '[43](https://eastasiaforum.org/2024/12/10/trumps-2025-agenda-trades-us-global-leadership-for-tariffs/)' },
  ];

  // 財政赤字とGDPへの影響 (推測値)
  const fiscalData = [
    { year: 2025, deficit: '1.8兆ドル', gdpChange: '+%', link: '[43](https://eastasiaforum.org/2024/12/10/trumps-2025-agenda-trades-us-global-leadership-for-tariffs/)' },
    { year: 2034, deficit: '2.6兆ドル (推定)', gdpChange: '-0.4%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
    { year: 2054, deficit: '4.9兆ドル (推定)', gdpChange: '-2.1%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
  ];

  // 分配効果データ
  const distributionData = [
    { group: '低所得層', change: '+%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
    { group: '中所得層', change: '+%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
    { group: '高所得層', change: '+%', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
    { group: '上位1%', change: '大幅増', link: '[17](https://budgetmodel.wharton.upenn.edu/issues/2024/8/26/trump-campaign-policy-proposals-2024)' },
  ];

    
  const COLORS = ['#0088FE', '#00C49F', '#FFBB28', '#FF8042'];

  return (
    <div className="container mx-auto p-4">
      <h1 className="text-3xl font-bold text-center mb-6">トランプ大統領の今後の経済政策 (2025年以降)</h1>

      <section className="mb-8">
        <h2 className="text-2xl font-semibold mb-4">減税と規制緩和</h2>
        <p className="text-center mb-4">法人税率と個人所得税の変化</p>
        <BarChart width={730} height={250} data={taxData}>
          <CartesianGrid strokeDasharray="3 3" />
          <XAxis dataKey="name" />
          <YAxis />
          <Tooltip />
          <Legend />
          <Bar dataKey="before" fill="#8884d8" name="変更前" />
          <Bar dataKey="after" fill="#82ca9d" name="変更後" />
        </BarChart>
        <ul className='list-disc list-inside'>
          {taxData.map((item, index) => (
            <li key={index}>
              {item.name}: <a href={item.link} target="_blank" rel="noopener noreferrer" className="text-blue-500 underline hover:text-blue-700">{item.before} → {item.after}</a>
            </li>
          ))}
        </ul>
      </section>

      <section className="mb-8">
        <h2 className="text-2xl font-semibold mb-4">関税と貿易</h2>
        <p className="text-center mb-4">輸入品に対する関税</p>
        <BarChart width={730} height={250} data={tariffData}>
          <CartesianGrid strokeDasharray="3 3" />
          <XAxis dataKey="name" />
          <YAxis />
          <Tooltip />
          <Legend />
          <Bar dataKey="tariff" fill="#8884d8" name="関税率" />
        </BarChart>
        <ul className='list-disc list-inside'>
          {tariffData.map((item, index) => (
            <li key={index}>
              {item.name}: <a href={item.link} target="_blank" rel="noopener noreferrer" className="text-blue-500 underline hover:text-blue-700">{item.tariff}</a>
            </li>
          ))}
        </ul>
      </section>

      <section className="mb-8">
        <h2 className="text-2xl font-semibold mb-4">財政赤字とGDPへの影響 (推定値)</h2>
        <p className="text-center mb-4">年度ごとの財政赤字とGDP変化率</p>
        <LineChart width={730} height={250} data={fiscalData} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
          <CartesianGrid strokeDasharray="3 3" />
          <XAxis dataKey="year" />
          <YAxis />
          <Tooltip />
          <Legend />
          <Line type="monotone" dataKey="deficit" stroke="#8884d8" activeDot={{ r: 8 }} name="財政赤字 (兆ドル)" />
          <Line type="monotone" dataKey="gdpChange" stroke="#82ca9d" name="GDP変化率" />
        </LineChart>
        <ul className='list-disc list-inside'>
          {fiscalData.map((item, index) => (
            <li key={index}>
              {item.year}年: <a href={item.link} target="_blank" rel="noopener noreferrer" className="text-blue-500 underline hover:text-blue-700">財政赤字 {item.deficit}, GDP変化率 {item.gdpChange}</a>
            </li>
          ))}
        </ul>
      </section>

      <section className="mb-8">
        <h2 className="text-2xl font-semibold mb-4">所得分配への影響</h2>
        <p className="text-center mb-4">各所得層への影響</p>
        <PieChart width={730} height={250}>
          <Pie data={distributionData} cx="50%" cy="50%" outerRadius={80} fill="#8884d8" dataKey="change" label>
            {distributionData.map((entry, index) => (
              <Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
            ))}
          </Pie>
          <Tooltip />
          <Legend />
        </PieChart>
        <ul className='list-disc list-inside'>
          {distributionData.map((item, index) => (
            <li key={index}>
              {item.group}: <a href={item.link} target="_blank" rel="noopener noreferrer" className="text-blue-500 underline hover:text-blue-700">{item.change}</a>
            </li>
          ))}
        </ul>
      </section>
    </div>
  );
};

export default App;