I am learning to use react and styled components. While using the styled components package to create a button element, the React import at the top of my code editor gives a warning that react is defined/declared but never used.

Isn't creating a html button and assigning it to a javascript variable JSX? Do styled components already have the JSX logic built in?

import React from 'react';
import styled from 'styled-components';

const Button = styled.button`
  font: inherit;
  padding: 0.5rem 1.5rem;
  border: 1px solid #8b005d;
  color: white;
  background: #8b005d;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.26);
  cursor: pointer;

&:focus {
  outline: none;
}

&:hover,
&:active {
  background: #ac0e77;
  border-color: #ac0e77;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.26);
}
`

export default Button;