import { CardElement } from "@easylabs/react";
import { useRef } from "react";

function PaymentForm() {
  const cardRef = useRef(null);

  return (
    <form>
      <label htmlFor="card">Card Information</label>
      <CardElement
        ref={cardRef}
        id="card"
        style={{
          base: {
            fontSize: "16px",
            color: "#424770",
            "::placeholder": {
              color: "#aab7c4",
            },
          },
          invalid: {
            color: "#9e2146",
          },
        }}
      />
    </form>
  );
}