Quick start
Installation
npm install hello-week --save
yarn add hello-week
Including Files:
CSS
<link rel="stylesheet" type="text/css" href="https://github.com/hello-week/hello-week/blob/main/hello.week.min.css" />
<link rel="stylesheet" type="text/css" href="https://github.com/hello-week/hello-week/blob/main/hello.week.theme.min.css" />
JS
<script type="module">
import HelloWeek from 'hello.week.esm.js';
new HelloWeek();
</script>
HTML Markup
<div class="hello-week">
<div class="navigation">
<button class="prev">Prev</button>
<div class="period"></div>
<button class="next">Next</button>
</div>
<div class="week"></div>
<div class="month"></div>
</div>
Options
HelloWeek comes with a few (optional) settings that you can change by passing an object as an argument. Default values are presented below.
new HelloWeek({
selector: '.hello-week',
lang: 'en',
langFolder: './dist/langs/',
format: 'DD/MM/YYYY',
weekShort: true,
monthShort: false,
multiplePick: false,
defaultDate: null,
minDate: null,
maxDate: null,
disabledDaysOfWeek: null,
disableDates: null,
weekStart: 0, // week start on Sunday
timezoneOffset: new Date().getTimezoneOffset(),
daysSelected: null,
daysHighlight: null,
disablePastDays: false,
todayHighlight: true,
range: false,
locked: false,
rtl: false,
nav: ['◀', '▶'],
onClear: () => {},
onLoad: () => {},
onNavigation: () => {},
onSelect: () => {},
beforeCreateDay: (node) => {},
});
Useful links
Supported Browsers:
- Chrome 49
- Firefox 31
- Opera 36
- Safari 9.3
- Edge 17
- iOS Safari 6.0
License
Hello Week is open-sourced software licensed under the MIT license