Localization

Use the locale prop to customize every string in the picker UI. All keys are optional — only override what you need.

Locale Type

type Locale = {
  format?: string;        // date-fns format string (default: 'dd-MM-yyyy HH:mm')
  sundayFirst?: boolean;  // true: Sun-Sat, false: Mon-Sun (default: true)
  days?: [string, string, string, string, string, string, string];
  months?: [string, string, string, string, string, string,
            string, string, string, string, string, string];
  fromDate?: string;      // Label above start calendar
  toDate?: string;        // Label above end calendar
  selectingFrom?: string; // SmartMode notifier text
  selectingTo?: string;   // SmartMode notifier text
  minDate?: string;       // Footer min date label
  maxDate?: string;       // Footer max date label
  apply?: string;         // Apply button text
  cancel?: string;        // Cancel button text
  close?: string;         // Close button text (autoApply mode)
};

Full Example

<ReactDateTimePicker
  locale={{
    format: 'dd/MM/yyyy HH:mm',
    sundayFirst: false,
    days: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],
    months: [
      'January', 'February', 'March', 'April', 'May', 'June',
      'July', 'August', 'September', 'October', 'November', 'December',
    ],
    fromDate: 'From Date',
    toDate: 'To Date',
    selectingFrom: 'Selecting From',
    selectingTo: 'Selecting To',
    minDate: 'Min Date',
    maxDate: 'Max Date',
    apply: 'Apply',
    cancel: 'Cancel',
    close: 'Close',
  }}
  // ...other props
/>

French Locale Example

<ReactDateTimePicker
  locale={{
    format: 'dd/MM/yyyy HH:mm',
    sundayFirst: false,
    days: ['Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa', 'Di'],
    months: [
      'Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin',
      'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre',
    ],
    fromDate: 'Date de début',
    toDate: 'Date de fin',
    apply: 'Appliquer',
    cancel: 'Annuler',
    close: 'Fermer',
  }}
  // ...other props
/>