ReactorUMG

```jsx
// React Component for Player Stats
import React, { useState, useEffect } from 'react';

const PlayerStats = ({ initialHealth, initialMana, initialStamina }) => {
  const [health, setHealth] = useState(initialHealth);
  const [mana, setMana] = useState(initialMana);
  const [stamina, setStamina] = useState(initialStamina);

  useEffect(() => {
    // Simulate health regeneration
    const healthInterval = setInterval(() => {
      setHealth(prevHealth => Math.min(prevHealth + 1, 100));
    }, 2000);

    // Simulate mana regeneration
    const manaInterval = setInterval(() => {
      setMana(prevMana => Math.min(prevMana + 1, 100));
    }, 3000);

    // Simulate stamina regeneration
    const staminaInterval = setInterval(() => {
      setStamina(prevStamina => Math.min(prevStamina + 1, 100));
    }, 1000);

    return () => {
      clearInterval(healthInterval);
      clearInterval(manaInterval);
      clearInterval(staminaInterval);
    };
  }, []);

  return (
    <div className='player-stats'>
      <h2>Player Stats</h2>
      <div className='stat-bar'>
        <span>Health: {health}</span>
        <progress value={health} max='100' />
      </div>
      <div className='stat-bar'>
        <span>Mana: {mana}</span>
        <progress value={mana} max='100' />
      </div>
      <div className='stat-bar'>
        <span>Stamina: {stamina}</span>
        <progress value={stamina} max='100' />
      </div>
    </div>
  );
};

export default PlayerStats;
```

### Conversion to UMG Widget

To convert the above React component into a UMG widget using ReactorUMG, follow these steps:

1. **Install ReactorUMG Plugin**: Ensure the ReactorUMG plugin is installed and enabled in your Unreal Engine project.
2. **Create a New ReactorUMG Component**: In Unreal Engine, create a new ReactorUMG component and link it to your React component.
3. **Map React Props to UMG Properties**: Map the `initialHealth`, `initialMana`, and `initialStamina` props to UMG properties that can be set in the Unreal Editor.
4. **Handle State Updates**: Use ReactorUMG's state management to handle the dynamic updates of health, mana, and stamina.
5. **Integrate with UMG Widgets**: Create UMG widgets for the health, mana, and stamina bars and bind them to the corresponding state variables.

### Example UMG Widget Code

```cpp
// UMG Widget Blueprint for Player Stats

UMG_PlayerStats
{
  Variables:
    Health (Float)
    Mana (Float)
    Stamina (Float)

  Functions:
    UpdateHealthBar()
    UpdateManaBar()
    UpdateStaminaBar()

  Widgets:
    HealthBar (Progress Bar)
    ManaBar (Progress Bar)
    StaminaBar (Progress Bar)
}
```

By following these steps, you can seamlessly integrate your React component into Unreal Engine's UMG system, leveraging the power of React's component-based architecture for dynamic and maintainable UI development.