Here are 30 commonly used React events:

### **1. onClick**
- **Description**: Triggered when the user clicks on an element.
- **Usage Example**:

  <button onClick={handleClick}>Click Me</button>

### **2. onChange**
- **Description**: Triggered when the value of an input element changes.
- **Usage Example**:

  <input type="text" onChange={handleChange} />

### **3. onSubmit**
- **Description**: Triggered when a form is submitted.
- **Usage Example**:

  <form onSubmit={handleSubmit}>
    <input type="text" />
    <button type="submit">Submit</button>
  </form>

### **4. onKeyDown**
- **Description**: Triggered when a key is pressed down.
- **Usage Example**:

  <input type="text" onKeyDown={handleKeyDown} />

### **5. onKeyUp**
- **Description**: Triggered when a key is released.
- **Usage Example**:

  <input type="text" onKeyUp={handleKeyUp} />

### **6. onKeyPress** (Deprecated)
- **Description**: Triggered when a key is pressed down and released.
- **Usage Example**:

  <input type="text" onKeyPress={handleKeyPress} />

### **7. onFocus**
- **Description**: Triggered when an element gains focus.
- **Usage Example**:

  <input type="text" onFocus={handleFocus} />

### **8. onBlur**
- **Description**: Triggered when an element loses focus.
- **Usage Example**:

  <input type="text" onBlur={handleBlur} />

### **9. onMouseEnter**
- **Description**: Triggered when the mouse pointer enters the element.
- **Usage Example**:

  <div onMouseEnter={handleMouseEnter}>
    Hover over me!
  </div>

### **10. onMouseLeave**
- **Description**: Triggered when the mouse pointer leaves the element.
- **Usage Example**:

  <div onMouseLeave={handleMouseLeave}>
    Hover over me!
  </div>

### **11. onMouseDown**
- **Description**: Triggered when the mouse button is pressed down.
- **Usage Example**:

  <button onMouseDown={handleMouseDown}>Press me</button>

### **12. onMouseUp**
- **Description**: Triggered when the mouse button is released.
- **Usage Example**:

  <button onMouseUp={handleMouseUp}>Release me</button>

### **13. onMouseMove**
- **Description**: Triggered when the mouse pointer moves over an element.
- **Usage Example**:

  <div onMouseMove={handleMouseMove}>
    Move the mouse over me!
  </div>

### **14. onDoubleClick**
- **Description**: Triggered when the user double-clicks on an element.
- **Usage Example**:

  <button onDoubleClick={handleDoubleClick}>Double Click Me</button>

### **15. onScroll**
- **Description**: Triggered when an element's scroll position changes.
- **Usage Example**:

  <div onScroll={handleScroll} style={{ overflow: 'auto', height: '200px' }}>
    Scroll inside me!
  </div>

### **16. onWheel**
- **Description**: Triggered when the user scrolls using the mouse wheel.
- **Usage Example**:

  <div onWheel={handleWheel}>
    Scroll with the mouse wheel!
  </div>

### **17. onCopy**
- **Description**: Triggered when content is copied.
- **Usage Example**:

  <textarea onCopy={handleCopy}></textarea>

### **18. onPaste**
- **Description**: Triggered when content is pasted.
- **Usage Example**:

  <textarea onPaste={handlePaste}></textarea>

### **19. onDrag**
- **Description**: Triggered when an element is being dragged.
- **Usage Example**:

  <div draggable onDrag={handleDrag}>
    Drag me!
  </div>

### **20. onDragStart**
- **Description**: Triggered when the user starts dragging an element.
- **Usage Example**:

  <div draggable onDragStart={handleDragStart}>
    Start dragging me!
  </div>

### **21. onDragEnd**
- **Description**: Triggered when the user stops dragging an element.
- **Usage Example**:

  <div draggable onDragEnd={handleDragEnd}>
    Stop dragging me!
  </div>

### **22. onDrop**
- **Description**: Triggered when a dragged element is dropped.
- **Usage Example**:

  <div onDrop={handleDrop}>
    Drop here!
  </div>

### **23. onContextMenu**
- **Description**: Triggered when the right mouse button is clicked to open the context menu.
- **Usage Example**:

  <div onContextMenu={handleContextMenu}>
    Right-click me!
  </div>

### **24. onInput**
- **Description**: Triggered when the value of an input element is received.
- **Usage Example**:

  <input type="text" onInput={handleInput} />

### **25. onLoad**
- **Description**: Triggered when an image or other media is loaded.
- **Usage Example**:

  <img src="image.jpg" onLoad={handleLoad} alt="Example" />

### **26. onError**
- **Description**: Triggered when there is an error during the loading of an image or other media.
- **Usage Example**:

  <img src="invalid.jpg" onError={handleError} alt="Example" />

### **27. onSelect**
- **Description**: Triggered when text is selected inside an element.
- **Usage Example**:

  <input type="text" onSelect={handleSelect} />

### **28. onTouchStart**
- **Description**: Triggered when a touch point is placed on the touch surface.
- **Usage Example**:

  <div onTouchStart={handleTouchStart}>
    Touch me!
  </div>

### **29. onTouchMove**
- **Description**: Triggered when a touch point moves along the touch surface.
- **Usage Example**:

  <div onTouchMove={handleTouchMove}>
    Move your touch!
  </div>

### **30. onTouchEnd**
- **Description**: Triggered when a touch point is removed from the touch surface.
- **Usage Example**:

  <div onTouchEnd={handleTouchEnd}>
    Lift your finger!
  </div>

Written by [Tech Hunter](https://x.com/1techhunter)
You can contact me on [LinkedIn](https://www.linkedin.com/in/nwankwo-stephanie-4ba1311a7/://)