Skip to content

Commit

Permalink
feat: Internationalization (add daysOfWeek and monthsOfYear props)
Browse files Browse the repository at this point in the history
  • Loading branch information
6eDesign committed Nov 15, 2019
1 parent 20c6d5a commit a290701
Showing 1 changed file with 29 additions and 1 deletion.
30 changes: 29 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ Provide a function which accepts a date and returns a boolean determining whethe
Date formatting uses [`timeUtils`] formatting (MM/DD/YYYY by default). If you would like to use a different formatting library, supply a function which accepts a date and returns a string.

### `daysOfWeek` and `monthsOfYear`
These two properties are used to internationalize the calendar. The default values are:
These two props are used to internationalize the calendar. The default values are:

```javascript
export let daysOfWeek = [
Expand Down Expand Up @@ -68,13 +68,41 @@ export let monthsOfYear = [

### Kitchen Sink Example:
```html
<script>
const daysOfWeek = [
[ 'Domingo', 'Dom' ],
[ 'Lunes', 'Lun' ],
[ 'Martes', 'Mar' ],
[ 'Miércoles', 'Mié' ],
[ 'Jueves', 'Jue' ],
[ 'Viernes', 'Vie' ],
[ 'Sábado', 'Sáb' ],
];
const monthsOfYear = [
[ 'Enero', 'Ene' ],
[ 'Febrero', 'Feb' ],
[ 'Marzo', 'Mar' ],
[ 'Abril', 'Abr' ],
[ 'Mayo', 'May' ],
[ 'Junio', 'Jun' ],
[ 'Julio', 'Jul' ],
[ 'Agosto', 'Ago' ],
[ 'Septiembre', 'Sep' ],
[ 'Octubre', 'Oct' ],
[ 'Noviembre', 'Nov' ],
[ 'Diciembre', 'Dic' ],
];
</script>

<Datepicker
bind:formattedSelected={selectedDateFormatted}
bind:selected={selectedDate}
bind:dateChosen={userHasChosenDate}
start={threeDaysInPast}
end={inThirtyDays}
selectableCallback={filterWeekends}
daysOfWeek={daysOfWeek}
monthsOfYear={monthsOfYear}
format={date => dayjs(date).format('DD/MM/YYYY')}
/>
```
Expand Down

0 comments on commit a290701

Please sign in to comment.