Localization

Pass a localization object to DataTable to override every string and aria-label rendered by the table — filter panel, pagination navigation, and expand/collapse buttons. All keys are optional and fall back to English defaults.

Quick start

Import one of the pre-built locales from the /locales subpath and pass it as localization. That's all you need for a fully translated table.

import DataTable from 'react-data-table-component';
import { fr } from 'react-data-table-component/locales';

<DataTable columns={columns} data={data} localization={fr} />

Built-in locales

Export	Language
`en`	English (default)
`fr`	French
`es`	Spanish
`de`	German
`ptBR`	Brazilian Portuguese
`ar`	Arabic (Modern Standard)
`he`	Hebrew
`arEG`	Arabic (Egyptian)
`arLV`	Arabic (Levantine)
`zhCN`	Chinese (Simplified)
`zhTW`	Chinese (Traditional)
`ja`	Japanese
`ko`	Korean
`uk`	Ukrainian

Each locale is a standalone module. Only the locale you import enters your bundle — the rest are tree-shaken away.

Partial override

Spread an existing locale and replace only the keys you need.

import { fr } from 'react-data-table-component/locales';
import type { Localization } from 'react-data-table-component';

const myLocale: Localization = {
  ...fr,
  filter: {
    ...fr.filter,
    applyLabel: 'Valider',
    clearLabel: 'Effacer',
  },
};

<DataTable columns={columns} data={data} localization={myLocale} />

Custom locale from scratch

Build a locale object from the Localization type. Every key is optional — any omitted key falls back to the English default.

import type { Localization } from 'react-data-table-component';

const custom: Localization = {
  pagination: {
    navigationAriaLabel:   'Paginación de la tabla',
    firstPageAriaLabel:    'Primera página',
    previousPageAriaLabel: 'Página anterior',
    nextPageAriaLabel:     'Página siguiente',
    lastPageAriaLabel:     'Última página',
  },
  filter: {
    applyLabel: 'Aplicar',
    clearLabel: 'Limpiar',
    addConditionLabel: '+ Añadir condición',
    andLabel: 'Y',
    orLabel: 'O',
    operators: {
      contains: 'Contiene',
      equals:   'Igual a',
      blank:    'Vacío',
    },
  },
  expandable: {
    expandRowAriaLabel:   'Expandir fila',
    collapseRowAriaLabel: 'Contraer fila',
  },
};

<DataTable columns={columns} data={data} localization={custom} />

The Localization type

All three sub-objects are optional. Each key within them is also optional.

interface Localization {
  pagination?: {
    navigationAriaLabel?:   string;  // default: 'Table pagination'
    firstPageAriaLabel?:    string;  // default: 'First Page'
    previousPageAriaLabel?: string;  // default: 'Previous Page'
    nextPageAriaLabel?:     string;  // default: 'Next Page'
    lastPageAriaLabel?:     string;  // default: 'Last Page'
  };

  filter?: {
    filterColumnAriaLabel?:    string;  // default: 'Filter column'
    filterActiveAriaLabel?:    string;  // default: 'Filter active'
    filterPanelAriaLabel?:     string;  // default: 'Filter panel'
    operatorAriaLabel?:        string;  // default: 'Filter operator'
    valuePlaceholder?:         string;  // default: 'Value'
    valueAriaLabel?:           string;  // default: 'Filter value'
    value2Placeholder?:        string;  // default: 'Value'
    value2AriaLabel?:          string;  // default: 'Second filter value'
    betweenSeparatorText?:     string;  // default: 'and'
    removeConditionAriaLabel?: string;  // default: 'Remove condition'
    addConditionAriaLabel?:    string;  // default: 'Add second condition'
    addConditionLabel?:        string;  // default: '+ Add condition'
    clearLabel?:               string;  // default: 'Clear'
    applyLabel?:               string;  // default: 'Apply'
    andLabel?:                 string;  // default: 'AND'
    orLabel?:                  string;  // default: 'OR'
    operators?: {
      contains?:    string;  // default: 'Contains'
      notContains?: string;  // default: 'Does not contain'
      equals?:      string;  // default: 'Equals'
      notEquals?:   string;  // default: 'Does not equal'
      startsWith?:  string;  // default: 'Begins with'
      endsWith?:    string;  // default: 'Ends with'
      blank?:       string;  // default: 'Blank'
      notBlank?:    string;  // default: 'Not blank'
      gt?:          string;  // default: 'Greater than'
      gte?:         string;  // default: '≥'
      lt?:          string;  // default: 'Less than'
      lte?:         string;  // default: '≤'
      between?:     string;  // default: 'Between'
      before?:      string;  // default: 'Before'
      after?:       string;  // default: 'After'
    };
  };

  expandable?: {
    expandRowAriaLabel?:   string;  // default: 'Expand Row'
    collapseRowAriaLabel?: string;  // default: 'Collapse Row'
  };
}

Scope

localization covers strings rendered by the table's built-in UI. Visible text in the pagination bar (rowsPerPageText, rangeSeparatorText, selectAllRowsItemText) is still controlled by paginationComponentOptions, since those affect layout as well as text.