Internationalization

Customize the React Calendar component for different languages and regional settings.

Spanish Calendar Example

Translate to Spanish and set Monday as first day. Call setDictionary once during component mount with useEffect:

import React, { useEffect } from 'react';
import { Calendar, setDictionary } from '@calendarjs/react';

export default function App() {
    useEffect(() => {
        setDictionary({
            'January': 'Enero',
            'February': 'Febrero',
            'March': 'Marzo',
            'April': 'Abril',
            'May': 'Mayo',
            'June': 'Junio',
            'July': 'Julio',
            'August': 'Agosto',
            'September': 'Septiembre',
            'October': 'Octubre',
            'November': 'Noviembre',
            'December': 'Diciembre',
            'Sunday': 'Domingo',
            'Monday': 'Lunes',
            'Tuesday': 'Martes',
            'Wednesday': 'Miércoles',
            'Thursday': 'Jueves',
            'Friday': 'Viernes',
            'Saturday': 'Sábado',
            'Done': 'Hecho',
            'Reset': 'Restablecer'
        });
    }, []);

    return <Calendar type="inline" startingDay={1} />;
}

Configuration

Starting Day

Set first day of week with startingDay (0=Sunday, 6=Saturday):

Region	Day	Value
USA, Canada, Japan	Sunday	`0`
Europe, Asia, Latin America	Monday	`1`
Middle East	Saturday	`6`

Calendar Documentation - Main calendar docs
Date Formats - Format options