Set 12 hour time instead of 24 hour?

[rimzzlabs]

how can I set 12 Hour style instead of 24 hour?
heres my component, it only shows time, so no week, month or year

import dayjs from 'dayjs'
import DatePicker from 'react-datepicker'
import { useState } from 'react'

export default funciton MyComponent(){
const [time, setTime] = useState("")

// this could be 24 or 12, let's say this is  dynamic property
const timeFormat = '12'

 return ( 
    <DatePicker
      showTimeSelectOnly
      showTimeSelect
      timeIntervals={5}
      value={ time ? dayjs(time).format( value.timeFormat === "24" ? "HH:mm" : "HH:mm A") : time }
      onChange={handleChangeTime}
      timeCaption="Select"
      timeFormat={ timeFormat === "24" ? "HH:mm" : "hh:mm" }
      dateFormat="DD-MM-YYYY hh:mm a"
      placeholderText="HH:MM"
      className="border-none w-full focus:border-nonde px-0 focus:ring-0 focus:ring-offset-0"
      />
 )
}

and the result is something like this, I also want to show AM/PM on the selection menu / popover when it's use 24 hour, how?

[rimzzlabs]

I've come with this props and it solve my problem

<ReactDatePicker
//... other props
dateFormat={props.properties.timeFormat === "12" ? "h:mm aa" : "HH:mm"}
timeFormat={props.properties.timeFormat === "12" ? "h:mm aa" : "HH:mm"}
 />