JSFiddle - React, Tailwind, and code Playground

by isaporto

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.9/flatpickr.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<script src="//cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<button>
 Click here
</button>

JavaScript

document.querySelector('button').addEventListener('click', () => {
	Swal.fire({
  	title: 'Select a date',
    html: `<div id="modal-content">
  <form>
    <input type="text" class="flatpickr">
  </form>
</div>`,
    showConfirmButton: false,
  })
  flatpickr(".flatpickr", {
    dateFormat: "d/m/Y",
    minDate: new Date(),
    static: true
	})
})