JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdn.jsdelivr.net/bootstrap/3.2.0/css/bootstrap.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/1.3.15/daterangepicker-bs3.css">
<script src="//cdn.jsdelivr.net/momentjs/2.8.3/moment.min.js"></script>
<script src="//cdn.jsdelivr.net/bootstrap.daterangepicker/1.3.15/daterangepicker.js"></script>
<input type="text" name="daterange">

JavaScript

$(document).ready(function() {
    $('input[name="daterange"]').daterangepicker({
        startDate: moment(),
        timePicker: true,
        showDropdowns: true,
        format: "HH:mm:ss",
        timePicker12Hour: false,
        timePickerIncrement: 1,
        singleDatePicker: true
    });
    $('input[name="daterange"]').data('daterangepicker').container.find('.calendar-date').hide();
    $('input[name="daterange"]').on('showCalendar.daterangepicker', function (event, data) {
        var $container = data.container;
        $container.find('.calendar-date').remove();
    });
});