react-currency-format is not displaying some of the html elements

Question

I am developing a amazon clone by watching a tutorial. I have created a subtotal component where is used imported and used react-currency-format. inside the currency format tag I have created a arrow function and added some html tags. this html tags are not displaying on the browser. The code snippet written in the Subtotal.js component

import React from 'react'
import './Subtotal.css'
import CurrencyFormat from "react-currency-format";

function Subtotal() {
  return (
    <div className='subtotal' >
     <CurrencyFormat
        renderText={(value) => (
            <>
                <p>
                Subtotal (0 items): <strong>0</strong>
                </p>
                <small className="subtotal_gift" >
                    <input type="checkbox" /> 
                    This order contains gifts
                </small>
            </>
        )}
        decimalScale={2}
        value={0}
        displayType={"Text"}
        thousandSeparator = {true}
        prefix={"$"}
    /> 
         
        <button>Proceed to checkout</button>
    </div>
  )
}

the text inside the paragraph tag is not displaying on the browser. but 0 written inside the paragraph tag is displayed inside the input tag.

Answer 1

Try changing "Text" to "text" (lowercase) at the CurrencyFormat displayType prop.