JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://amsul.ca/pickadate.js/lib/picker.js"></script>
<script src="http://amsul.ca/pickadate.js/lib/picker.date.js"></script>
<script src="http://amsul.ca/pickadate.js/lib/picker.time.js"></script>
<link rel="stylesheet" href="http://amsul.ca/pickadate.js/lib/themes/classic.css">
<link rel="stylesheet" href="http://amsul.ca/pickadate.js/lib/themes/classic.date.css">
<link rel="stylesheet" href="http://amsul.ca/pickadate.js/lib/themes/classic.time.css">
<div id="dtDiv">
    <form name="dtTestForm">
    Title: <input type="text" name="title"><br>
    Start Date: <input type="text" name="dtStart" id="dtStart"><br>
    Start Time: <input type="text" name="tmStart" id="tmStart"><br>
    </form>
</div>

JavaScript

jQuery(document).ready(function() {
    jQuery("#dtStart").pickadate({
		editable: true,
		format: 'mm/dd/yyyy',
		formatSubmit: 'yyyy-mm-dd',
		//hiddenSuffix: '_FORMATTED',
		selectYears: true,
		selectMonths: true,
		min: -1096,
		max: 365
	});
    jQuery("#tmStart").pickatime({
		editable: true,
		format: 'h:i A',
		formatSubmit: 'HH:i',
		//hiddenSuffix: '_FORMATTED',
		interval: 15,
		min: [7,0],
		max: [21,0]
	});
    
    jQuery("#dtDiv").dialog({
        title: "Date/Time Picker in a Dialog",
    	minWidth: 600,
		minHeight: 300,
		width: 600,
		height: 300,
		autoOpen: false
    });
    jQuery("#dtDiv").dialog("open");
});