JSFiddle - React, Tailwind, and code Playground

by Giampaolo Bellavite

HTML

<script src="https://unpkg.com/moment@2.14.1/min/moment.min.js"></script>
<script src="https://npmcdn.com/react/dist/react.js"></script>
<script src="https://npmcdn.com/react-dom/dist/react-dom.js"></script>
<script src="https://unpkg.com/react-day-picker/lib/daypicker.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/react-day-picker/lib/style.css">
<span id="container"></span>

CSS

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: white;
}

input {
  font-size: 1em;
  padding: .4em .6em;
}

#container {
  display: inline-block;
}

Babel + JSX

ReactDOM.render(
  <div>
    <h3>DayPicker</h3>
    <DayPicker selectedDays={ new Date() } />
    <h3>DayPickerInput</h3>
    <DayPicker.Input placeholder="DD/MM/YYYY" format="DD/MM/YYYY" />
  </div>,
  document.getElementById('container')
);