Translations Reference

Translations are strongly typed. Provide overrides either via the provider or directly in your table configuration under translations.keys.

Important: When you use the catalog form (create/edit via getFormConfig), the form uses the same translation function t() as the table — i.e. the same DataTableTranslations object passed to the provider. You must include form and value keys in that object so that field labels, placeholders (including the value-type field), and form buttons resolve correctly. Otherwise you will see raw keys like value.string_placeholder in the UI.

Type shape

type DataTableTranslations = {
  actions: { delete: string; edit: string; copy: string; export: string; save: string; cancel: string; confirm: string; title: string; view: string };
  bulk: { close_menu: string; confirm_copy_description: string; confirm_delete_description: string; confirm_title: string };
  calculations: { none: string; count: string; percent: string; more: string; count_all: string; count_values: string; count_unique: string; count_empty: string; count_not_empty: string; count_true: string; count_false: string; percent_empty: string; percent_not_empty: string; percent_true: string; percent_false: string; sum: string; average: string; median: string; min: string; max: string; range: string; calculate: string };
  columns: { title: string; hide: string; show: string; visible: string; hidden: string; drag: string; resetOrder: string; toggleVisibility: string; hideAll: string; showAll: string; edit_property: string; filter: string; hide_in_view: string; reorder: string; resize?: string; sort_ascending: string; sort_descending: string };
  menu: { /* ... */ density?: string; footer_calculations: string; footer_calculations_on: string; footer_calculations_off: string };
  pagination: { first: string; last: string; next: string; previous: string; of: string; page: string; rowsPerPage: string; showing: string; selectedCount: string };
  selection: { rows: string };
  // ... see full type in types/translations.ts
}

Inline overrides (config)

translations: {
  namespace: 'common',
  keys: {
    'columns.title': 'Columns',
    'actions.title': 'Actions',
  },
}

Provider-based

You can supply a full DataTableTranslations object to the provider for consistent localization across tables.

Where translations apply

• Table density: menu.density labels the density menu and its icon tooltip/accessibility label. Sizes remain XS, S, M, L, XL, and 2XL in every locale. The key is optional; React falls back to “Table density”. Vue includes English and French defaults.

• Icon tooltips: density, saved views, display controls, toolbar actions, row actions, and column controls use the same localized labels on hover and keyboard focus. Supply views.add_view and views.saveChangesTooltip for the add/save view icons. Custom toolbar actions can supply tooltip; icon-only actions otherwise use their label. Avoid a native title alongside the styled tooltip.

• View settings and Data: views.settings labels the settings icon button (default "View settings"); views.viewActions labels the tabs' "View actions" chevron and views.filterViews labels the name filter shown beyond seven views in the named trigger's menu. menu.data labels the Data button and its menu, which holds Export, Connect, Share and, on compact layouts, application toolbar actions; destinations.connect labels the Connect row and screen (default "Connect").

• Schedule: schedule.<key> overrides the built-in English and French labels of the Connect schedule screen, one key at a time — for example schedule.frequency, schedule.manual, schedule.auto, schedule.hourly, schedule.daily, schedule.weekly, schedule.monthly, schedule.lastDay, schedule.timeZone, schedule.next (with {date} and {zone}), schedule.save, schedule.cancel and schedule.runNow. See Schedule a Connect destination.

• Connector screens: connector.<key> overrides the built-in English and French labels of the connector screens, one key at a time. Screen: target, child, chooseTarget, use, loading, loadingFields, noTargets, columns, columnsVisible, columnsAll, mapping, newField, dontSend, sending, keyField, mode, upsert, replace, upsertHint, replaceHint, scope, scopeView, scopeSelection, send, sendAgain, done. Result: created, createdOne, updated, updatedOne, skipped, skippedOne, failed, failedOne, nothingSent, warnings, warningsOne, truncated, failureRow, failureRows (the …One keys are the singular forms; counts use {count}, failureRow uses {id} and {message}, failureRows uses {count} and {message}). Checks: issueMissingTarget, issueMissingChild, issueNoColumns, issueDuplicateField, issueUnknownField, issueMissingKey, issueUnknownKey, issueInvalidMode (with {field} or {child}). Errors: error_aborted, error_api_disabled, error_forbidden, error_invalid_credentials, error_invalid_mapping, error_invalid_request, error_invalid_target, error_not_found, error_not_shared, error_not_shared_unknown, error_provider_unavailable, error_rate_limited, error_unauthorized, error_unknown (error_not_shared uses {email}). newField uses {name}, and columnsVisible, columnsAll and scopeSelection use {count}. Sync (Sync from the connector screen): direction, directionPush, directionPull, directionTwoWay (with {target}), directionPushShort, directionPullShort, directionTwoWayShort (the schedule summary), mappingPull, mappingTwoWay, dontImport, dontSync, sample (with {value}), invalidCount, invalidOne, conflictRule, conflictTableWins, conflictTargetWins, conflictLatestWins, conflictTableWinsHint, conflictTargetWinsHint, conflictLatestWinsHint, deletePolicy, deleteFlag, deleteIgnore, deletePropagate, deleteFlagHint, deleteIgnoreHint, deletePropagateHint, deleteConfirm, confirmDeletesFirst, previewFirst, previewChanges, previewAgain, previewing, syncNow, importNow, syncing, inTarget (with {target}), inTable, thisTable, toCreate, toUpdate, toDelete, nothingToChange, unchanged, flagged, flaggedOne, duplicates, duplicatesOne, conflicts, moreConflicts, wins (with {side}), emptyValue, deleted, deletedOne, nothingChanged, syncStopped (with {message}), issueNoFields, issueInvalidDirection, issueInvalidConflictRule, and importFrom (with {name}) and importFromHint for the Data › Import source. Conflict rules (Conflict rules set by your app): appRules, appRulesLocked, ruleOwnedTable, ruleOwnedTarget, ruleMerge, ruleManual, ruleTableWins, ruleTargetWins, ruleLatestWins (the rule sentences use {column}, and ruleOwnedTarget and ruleTargetWins also {target}), preview outcomes ownedBy (with {side}), resolutionMerged, resolutionManual, resolutionCustom, resolutionSkipped, resultValue, overridden, moreOverridden, pendingNote, pendingNoteOne (with {count}), and conflicts to resolve conflictsToResolve (with {count}), conflictsHint, keepTable, keepTarget (with {target}), keepAllTable, keepAllTarget (with {target}), noConflicts, resolvingConflicts, backToSettings, valueYes, valueNo. Target check (Target check and Prepare): targetCheck, checkingTarget (with {target}), schemaBlocking, schemaFixable, schemaWarning, schemaBlocked (with {reason}), the issue lines schemaIssue_missing_field, schemaIssue_deleted_field, schemaIssue_renamed_field, schemaIssue_incompatible_type, schemaIssue_invalid_values, schemaIssue_coercible_type, schemaIssue_unsupported_type, schemaIssue_read_only_field, schemaIssue_missing_options, schemaIssue_missing_status_options, schemaIssue_missing_key, schemaIssue_key_wrong_type, schemaIssue_duplicate_mapping, schemaIssue_title_unmapped, schemaIssue_field_missing (with {column}, {field}, {target}, {actual}, {expected}, {from}, {to}, {options} or {count}), updateMapping, prepareNotion, prepareSheet, prepareTarget (with {target}), prepareIntro, prepareConfirm, preparing, prepared, preparedOne, preparedNothing (with {count} and {target}), cancel, fixCreateField, fixCreateKey (with {field} and {type}), fixAddOptions (with {count}, {field} and {options}), providerNotion, providerSheets, the disabled choices optionReadOnly, optionUnsupported, optionIncompatible (with {field} and {type}) and optionUsed (with {field} and {column}), pageTitle, pageTitleField (with {field}), refreshTargets, createTarget, createTargetTitle (with {target}), createParent, createName, createSubmit, creatingTarget, createNameRequired, and the type names type_<type> (such as type_rich_text or type_formula).

• Import: import.<key> overrides the built-in English and French labels of the import screen, one key at a time; import.title also labels the Data menu entry. Source: title, source, sourceCsv, sourceCsvHint, chooseFile, dropHint, pasteLabel, usePasted, reading, fileError, emptyFile, sourceError, authError. Mapping: mapping, ignore, delimiter, delimiterAuto (with {delimiter}), delimiterComma, delimiterSemicolon, delimiterTab, delimiterPipe, headers, keyColumn, keyNone, keyHint, sample (with {value}), noSample, invalidCount, invalidOne, preview, previewCaption, rowsFound, rowsFoundOne, yes, no. Review: review, back, cancel, creates, createsOne, updates, updatesOne, errorRows, errorRowsOne, skipErrors, errorsBlock, nothingToImport, rowError (with {row}, {column} and {message}). Run and result: import, importing (with {done} and {total}), stop, done, another, created, createdOne, updated, updatedOne, failed, failedOne, nothingImported, stopped, failureRow (with {row} and {message}). Column types in the badges: type_text, type_number, type_date, type_boolean, type_select, type_multi, type_url, type_email, type_json. Cell errors: error_required, error_invalid_number, error_invalid_date, error_invalid_boolean, error_unknown_option, error_invalid_url, error_invalid_email, error_invalid_json, error_duplicate_key, error_unknown. The …One keys are the singular forms, and counts use {count}.

• Form view: flat form.<key> keys, such as "form.submit": "Send", override the built-in English and French labels of the Form view in React and Vue, one key at a time. They are separate from the catalog form's form keys below. Form: submit, submitting, success, successTitle, another, required, choose, pickDate, clearDate, closed, noQuestions, submitError. Errors: errorRequired, errorNumber, errorDate, errorUrl, errorOption, errorSummary (with {count} in a plural form). Settings: settings, settingsTitle, title, description, questions, ask, moveUp, moveDown, editQuestion, hiddenValue (with {label}), label, help, placeholder, requiredToggle, hidden, hiddenHint, none, excluded (with {columns}), afterSubmit, submitLabel, successMessage, allowAnother, redirectUrl, redirectHint, reset. Sharing: share, publish, publishHint, publicLink, copy, copied, open, acceptResponses, republish, republishHint, saveFirst, shareError, loading, close. Layout and steps: layout, layoutPage, layoutSteps, review, next, back, skip, stepProgress (with {current} and {total}), reviewTitle, reviewChange (with {label}), noAnswer, yes, no. Sections: addSection, section, sectionTitle, sectionDescription, untitledSection, editSection, removeSection (these two with {label}). Rule editor: conditions, addRule, ruleAction, actionShow, actionHide, actionRequire, ruleJoin, joinAnd, joinOr, ruleField, ruleOperator, ruleValue, ruleFrom, ruleTo, ruleDays, chooseQuestion, addCondition, addGroup, ruleGroup, removeCondition, removeGroup, removeRule, editConditions, conditionsTitle (with {label}), conditionsDescription, noConditions, conditionsProblem, done, joinAll, joinAny, ruleDaysUnit. Rule problems: issueMissingField, issueUnknownField, issueOperator, issueMissingValue, issueUnknownOption, issueEmptyGroup, issueCycle, issueLaterQuestion, issueSelfReference, issueTarget. Rule summaries: thenShow, thenHide, thenRequire (with {condition}), thenSet (with {value} and {condition}), ruleAnd, ruleOr, ruleCustom, and the comparison phrases opIs, opIsNot, opContains, opNotContains, opStartsWith, opEq, opNeq, opLt, opLte, opGt, opGte, opBetween, opOn, opBefore, opAfter, opInLast, opInNext, opIsAnyOf, opIsNoneOf, opContainsAny, opContainsAll, opContainsNone, opIsChecked, opIsUnchecked, opIsEmpty, opIsNotEmpty (with {field} and {value}, or {from} and {to} for opBetween). Comparison labels: the short labels of the comparison menu, next to those summary phrases, such as "is", "before" or "in the last": cmpIs, cmpIsNot, cmpContains, cmpNotContains, cmpStartsWith, cmpEq, cmpNeq, cmpLt, cmpLte, cmpGt, cmpGte, cmpBetween, cmpOn, cmpBefore, cmpAfter, cmpInLast, cmpInNext, cmpIsAnyOf, cmpIsNoneOf, cmpContainsAny, cmpContainsAll, cmpContainsNone, cmpIsChecked, cmpIsUnchecked, cmpIsEmpty, cmpIsNotEmpty. The mode's name is views.display.form in React and display.form in Vue.

• Chart view: flat chart.<key> keys, such as "chart.showTable": "Table view", override the built-in English and French labels of the Chart view in React and Vue, one key at a time. Settings: chartType, typeBar, typeHorizontalBar, typeLine, typeDonut, typeNumber, xColumn, bucket, day, week, month, quarter, year, metric, metricCount, metricSum, metricAvg, metricMin, metricMax, metricCountDistinct, metricColumn, seriesColumn, none, stacked, sort, sortAuto, sortKeyAsc, sortKeyDesc, sortValueAsc, sortValueDesc, sortManual, cumulative, hideEmpty, topN, topAll, top, showDataLabels, showLegend, colors, colorsOptions, colorsPalette, weekStartsOn, monday, sunday, saturday, on, off, reset (top with {count}). Chart: showTable, showChart, other, noValue, checked, unchecked, weekOf, quarterLabel, count, sumOf, avgOf, minOf, maxOf, countDistinctOf, total, group, chartOf, showRecords (weekOf with {date}, quarterLabel with {quarter} and {year}, the …Of keys with {column}, chartOf with {metric} and {column}, showRecords with {group}). Messages: noColumn, empty, loading, truncated, filterHint, filterUnavailable. The mode's name is views.display.chart in React and display.chart in Vue.

• Feed view: flat feed.<key> keys, such as "feed.loadMore": "Older posts", override the built-in English and French labels of the Feed view in React and Vue, one key at a time. Feed: showMore, showLess, loadMore, loading, loadingMore, error, retry, end, untitled, noValue, yes, no, moreImages (with {count}), by, media (with {title}). Settings: titleColumn, authorColumn, dateColumn, dateDisplay, relative, absolute, bodyColumn, mediaColumn, properties, showPropertyLabels, bodyLines, lines (with {count}), noLimit, density, comfortable, compact, pageSize, infiniteScroll, on, off, none.

• File tree: flat filetree.<key> keys, such as "filetree.newFolder": "New album", override the built-in English and French labels of the File tree view in React and Vue, one key at a time. View: root, name, size, modified, type, path, newFolder, newFolderName, folderName, expandAll, collapseAll, details, hideDetails, info, open, preview, rename, moveTo, moveHere, delete, cancel, create, back, actions, expand, collapse, close, resizeDetails, noSelection, contents, shortcuts, sortBy (with {name}). Selection: selectRow, selectAll, selected (with {count}), clearSelection. Tree: unfiled, showMore (with {count}), showMoreUnknown, emptyFolder, empty, noMatches, loading, folder, file, oneFolder, oneFile, loaded, folders, files, items (these four with {count}), justNow, truncated, expandedFirst, uploading (these three with {count}). Moves and deletes: moved, moveItems (both with {count} and {path}), movedOne, moveItem (both with {name} and {path}), moveFailed (with {count}), undo, undone, cutReady (with {count}), created, renamed (both with {name}), deleteTitle (with {count}), deleteOneTitle (with {name}), deleteDescription, deleted (with {count}), intoSelf, intoDescendant, noPermission, notAFolder, virtualFolder, alreadyThere, moveDialogTitle (with {count}), moveOneDialogTitle (with {name}), searchFolders. Settings: settingsParent, settingsKind, settingsName, settingsSize, settingsUpdated, settingsColumns, settingsDetails, settingsFoldersFirst, settingsDepth, columnsBoth, columnsSize, columnsUpdated, columnsNone, depth0, depth1, depth2, none, on, off. The mode's name is views.display.filetree in React and display.filetree in Vue.

• Map view: flat map.<key> keys, such as "map.searchArea": "Search here", override the built-in English and French labels of the Map view in React and Vue, one key at a time. Map: loading, map, noLocationColumn, withoutLocation (with {count}), withoutLocationOne, searchArea, searching, fit, zoomIn, zoomOut, open, close, cluster (with {count}), marker (with {title}). List: list, inView (with {count}), showList, hideList, emptyList. Messages: truncated (with {count}), clientFiltered, noStyle, unavailable. Settings: locationColumn, titleColumn, colorColumn, none, popupColumns, showPopupLabels, clusterSetting, style, initialView, initialFit, initialSaved, searchOnMove, on, off. The mode's name is views.display.map in React and display.map in Vue.

• Location columns: flat location.<key> keys, such as "location.search": "Find an address", override the built-in English and French labels of location cells, editors and filters in React and Vue, one key at a time. Editor: location, pin, label, address, latitude, longitude, search, searching, noResults, searchFailed, suggestions, clear, done, cancel, edit, invalidCoordinates, coordinatesHint, noLocation. Filters: withinDistance, withinBounds, distance, west, south, east, north, withinKm (with {km} and {point}), inArea (with {south}, {west}, {north} and {east}). The operator names are filters.operators.within_distance and filters.operators.within_bounds.

• Dashboard: dashboard.<key> keys in the dashboard's translations prop, such as "dashboard.refresh": "Reload", override the built-in English and French labels of the dashboard in React and Vue, one key at a time. Header and states: dashboard, edit, done, saving, saved, saveError, loadError (both with {error}), loading, notFound, refresh, empty, emptyEditable. Add widget: addWidget, addWidgetTitle, widgetType, typeView, typeKpi, typeNote, table, view, defaultView, metric, metricCount, metricSum, metricAvg, metricMin, metricMax, metricColumn, widgetTitle, noteText, add, cancel. Widgets: widgetMenu, dragHandle (both with {title}), moveLeft, moveRight, moveUp, moveDown, wider, narrower, taller, shorter, remove, openFullView, widgetLoading, widgetError (with {error}), retry, missingTable, missingView, emptyNote, kpiCount, moved, resized (both with {title}). Filters: filters, from, to, any, clear, appliesTo (with {targets}), addFilter, addFilterTitle, filterType, filterDateRange, filterSelect, filterName, filterColumn (with {table}), notApplied, removeFilter (with {name}), noFilterColumns, anyDate, fromDate, untilDate (both with {date}), dateRange (with {start} and {end}).

• Filters (advanced): Operator names (Contains, Equals, Starts with, etc.) use the filters.operators.* keys. Both the dropdown options and the selected value shown when the operator select is closed are translated, so the current operator always appears in the active locale (e.g. “Contient” instead of “contains”).

• Pagination: All labels are translated: “Rows per page” (pagination.rowsPerPage), the “Page X of Y” text (pagination.showing, with {page} and {total}), and the first/previous/next/last button labels (pagination.first, pagination.previous, etc.). Both the default pagination and the button-style pagination (SafePagination) use these keys.

• Footer calculations: Footer menu labels and results use calculations.* keys. The options-menu toggle uses menu.footer_calculations, menu.footer_calculations_on, and menu.footer_calculations_off.

Form translations (catalog form)

When using getFormConfig and the built-in create/edit form (catalog form), the form resolves all labels, placeholders, and button text from the same DataTableTranslations object you pass to the provider. Add a form and value section to that object.

• form – Field labels (use labelKey in your form config, e.g. form.name), form buttons (cancel, submit, create, update), and success/error messages. The catalog form also uses createForm.title and createForm.description for the dialog/drawer header. For select fields, use form.valueType_options.boolean etc. if you use optionKeys.

• value – Used by the value-type field: value.string_placeholder, value.json_placeholder, value.number_placeholder, and for the boolean switch value.enabled / value.disabled.

In your form config, set labelKey (and optionally placeholderKey, optionKeys) on each field so that the form builder replaces labels/options with t(labelKey).

Example object (form + value)

Merge this into the DataTableTranslations object you pass to the table (e.g. next to actions, columns, filters, etc.):

const myTableTranslations = {
  // ... actions, columns, filters, etc. ...

  form: {
    cancel: "Cancel",
    create: "Create",
    createError: "Failed to create",
    createForm: {
      description: "Add a new item.",
      title: "Create item",
    },
    created: "Created successfully",
    name: "Name",
    slug: "Slug",
    category: "Category",
    description: "Description",
    enabled: "Enabled",
    valueType: "Value type",
    value: "Value",
    submit: "Save",
    update: "Update",
    updateError: "Failed to update",
    updated: "Updated successfully",
    valueType_options: {
      boolean: "Boolean",
      number: "Number",
      string: "String",
      json: "JSON",
    },
  },
  value: {
    string_placeholder: "Default string value",
    json_placeholder: "{}",
    number_placeholder: "0",
    enabled: "Enabled",
    disabled: "Disabled",
  },
};

Form config example using labelKey and optionKeys so these keys are used:

defineFormConfig({
  id: "my-entity",
  defaultValues: { name: "", slug: "", valueType: "string", value: null, enabled: false },
  fields: [
    { name: "name", type: "text", label: "Name", labelKey: "form.name", required: true },
    { name: "slug", type: "text", label: "Slug", labelKey: "form.slug", required: true },
    {
      name: "valueType",
      type: "select",
      label: "Value type",
      labelKey: "form.valueType",
      optionKeys: [
        "form.valueType_options.boolean",
        "form.valueType_options.number",
        "form.valueType_options.string",
        "form.valueType_options.json",
      ],
      options: [
        { label: "boolean", value: "boolean" },
        { label: "number", value: "number" },
        { label: "string", value: "string" },
        { label: "json", value: "json" },
      ],
    },
    {
      name: "value",
      type: "value-type",
      label: "Value",
      labelKey: "form.value",
      valueTypeField: "valueType",
      supportedTypes: ["boolean", "json", "number", "string"],
    },
  ],
  schema: mySchema,
  translations: {
    namespace: "my.namespace",
    keys: {
      cancel: "form.cancel",
      submit: "form.submit",
      create: "form.create",
      update: "form.update",
      created: "form.created",
      updated: "form.updated",
      createError: "form.createError",
      updateError: "form.updateError",
      "createForm.title": "form.createForm.title",
      "createForm.description": "form.createForm.description",
    },
  },
});

See also:

• DataTable

• Columns

• Provider & Setup (getFormConfig)

All keys (dot-path)

Use the following keys to construct your translations object. All values are strings.

actions

Used by row actions, the Export entry in the Data menu, and by the bulk actions menu (Edit, Copy, Export, Delete tabs and dialog buttons).

bulk

Strings for the bulk actions overlay (shown when one or more rows are selected). Supports {action}, {count} and ICU plural: {count, plural, one {item} other {items}}.

columns

common

filters

filters.operators

filters.types

filters.date_shortcuts

filters.advanced

filters.faceted

filters.add_menu

filters.presets

pagination

Used by both the default pagination and the button-style pagination (e.g. “Lignes par page”, “Page 1 of 2”). pagination.showing is used for the “Page X of Y” text and supports {page} and {total}. Default English value: "Page {page} of {total}" (example French: "Page {page} sur {total}").

search

selection

Used for the selection column header and the bulk actions menu count (e.g. “3 rows selected”). Supports {count} and ICU plural.

sorting

views

state

url_state

demo

table

calculations

menu

form (catalog form)

Include these when using create/edit forms so labels, placeholders, and buttons resolve. Use labelKey / optionKeys in your form config to point to these keys.

value (value-type field)

Used by the value-type form field for placeholders and boolean labels.

root

Both editions use add_an_item for the toolbar create button ("Add item" in English, "Ajouter" in French). Vue previously read its own create key for this button; if you translated create there for the create button, move that translation to add_an_item. The catalog form's own form.create button label key is unrelated and unchanged.

Vue filter, menu, and form controls

Vue includes English and French defaults. Advanced filters accept the same filters.* keys used by React, including filters.add, filters.apply, filters.column, filters.value_to, filters.operators.between, and filters.advanced.disable_filter.

Vue's reusable field and collection controls inherit table translations for loading, retry, option creation, item editing, and dialog actions. Standalone controls retain English fallbacks when there is no table provider. Field/section translation keys still resolve through the form configuration; translating controls does not change business values or server error messages.

Saved views, Options, row menus, confirmation dialogs, and status feedback use the table locale. Custom dictionaries can override defaults without changing keyboard navigation or focus behavior. Keep React render functions and Vue components/VNodes in their respective runtimes.

Empty-state translations

React uses table.no_results for the filtered title, table.no_results_description for its description, state.noData for an empty dataset, and filters.clear for the reset button and its accessible name. Provide all four when overriding the provider; otherwise defaults may remain in English. pagination.autoPageSize labels the Automatic option.

Vue uses noResults, noResultsDescription, noDataAvailable, and clearFilters and includes English and French defaults. The same keys apply to Table, Kanban, and Gallery. Explicit table.emptyState.title and description take precedence over the contextual translations.

Favorite-view translations

React exposes views.favorite, views.setFavorite, views.removeFavorite, and views.favoriteError. Vue exposes favoriteView, setFavoriteView, removeFavoriteView, and favoriteViewError, with English/French defaults. The star's tooltip and accessible label share the same translation, and aria-pressed indicates whether the active view is the favorite.

View tabs translations

React uses views.tabs ("Views") as the accessible name of the tab list, views.more ("More views") for the name and tooltip of the … overflow button, views.newView ("New view") for the "+" tab that opens the save dialog, and views.dialog.save.layout ("Layout") for the layout choice inside that dialog. Vue uses viewTabs, moreViews, newView, and viewLayout for the same four labels, with English ("Views", "More views", "New view", "Layout") and French ("Vues", "Plus de vues", "Nouvelle vue", "Mise en page") defaults. Since v3.9.0 the overflow is an icon button, so a host that translated views.more (Vue moreViews) as "More" translates it as "More views".

The order of views adds React views.moveLeft, views.moveRight, views.moveUp, views.moveDown, views.moved (with {name}, {position} and {count}, announced after a move) and views.orderError; React falls back to English when your translations lack them. Vue has moveViewLeft, moveViewRight, moveViewUp, moveViewDown, viewMoved and viewOrderError, with English and French defaults.

Facet, folder and tag translations

The facet panel, the folders of the other views and tags columns have built-in English and French labels in both editions, chosen from the table's locale. Override them with flat facets.<key>, filetree.<key> (the folder dialog and picker add rootFolder, parentFolder, inFolder, noFolders and createFailed) and tags.<key> keys in the table's translations.

Localized documentation examples

The inline previews inherit the documentation language. Complete recipe entrypoints accept these optional host presentation props. Save this type beside the recipe when copying it. Omit the props to keep the default English interface, or pass locale and the framework’s translation dictionary. Application labels in configuration and form fields remain your responsibility.

import type { DataTableTranslations } from "@/components/ui/yayaw-table/types/translations";

/** Optional host presentation; omit to use the registry defaults. */
export interface ExamplePresentation {
  locale?: string;
  title?: string;
  translations?: DataTableTranslations;
}

import type { DataTableTranslations } from "@/components/ui/yayaw-table-vue/types";

/** Optional host presentation; omit to use the registry defaults. */
export interface ExamplePresentation {
  locale?: string;
  title?: string;
  translations?: DataTableTranslations;
}