diff --git a/.gitignore b/.gitignore
index 5ee16525..63fa400a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,4 +4,5 @@
/node_modules
package-lock.json
yarn.lock
-pnpm-lock.yaml
\ No newline at end of file
+pnpm-lock.yaml
+.idea
diff --git a/README.md b/README.md
index 6742ff4f..b65149ed 100644
--- a/README.md
+++ b/README.md
@@ -149,32 +149,33 @@ Returns:
### Properties
-| Property | Type | Description | Default |
-| -------------------- | -------- | ---------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `nodes` | array | **Required**. Specifies the tree nodes and their children. | |
-| `checkModel` | string | Specifies which checked nodes should be stored in the `checked` array. Accepts `'leaf'` or `'all'`. | `'leaf'` |
-| `checked` | array | An array of checked node values. | `[]` |
-| `direction` | string | A string that specify whether the direction of the component is left-to-right (`'ltr'`) or right-to-left (`'rtl'`). | `'ltr'` |
-| `disabled` | bool | If true, the component will be disabled and nodes cannot be checked. | `false` |
-| `expandDisabled` | bool | If true, the ability to expand nodes will be disabled. | `false` |
-| `expandOnClick` | bool | If true, nodes will be expanded by clicking on labels. Requires a non-empty `onClick` function. | `false` |
-| `expanded` | array | An array of expanded node values. | `[]` |
-| `icons` | object | An object containing the mappings for the various icons and their components. See **Changing the Default Icons**. | `{ ... }` |
-| `iconsClass` | string | A string that specifies which icons class to utilize. Currently, `'fa4'` and `'fa5'` are supported. | `'fa5'` |
-| `id` | string | A string to be used for the HTML ID of the rendered tree and its nodes. | `null` |
-| `lang` | object | An object containing the language mappings for the various text elements. | `{ ... }` |
-| `name` | string | Optional name for the hidden `` element. | `undefined` |
-| `nameAsArray` | bool | If true, the hidden `` will encode its values as an array rather than a joined string. | `false` |
-| `nativeCheckboxes` | bool | If true, native browser checkboxes will be used instead of pseudo-checkbox icons. | `false` |
-| `noCascade` | bool | If true, toggling a parent node will **not** cascade its check state to its children. | `false` |
-| `onlyLeafCheckboxes` | bool | If true, checkboxes will only be shown for leaf nodes. | `false` |
-| `optimisticToggle` | bool | If true, toggling a partially-checked node will select all children. If false, it will deselect. | `true` |
-| `showExpandAll` | bool | If true, buttons for expanding and collapsing all parent nodes will appear in the tree. | `false` |
-| `showNodeIcon` | bool | If true, each node will show a parent or leaf icon. | `true` |
-| `showNodeTitle` | bool | If true, the `label` of each node will become the `title` of the resulting DOM node. Overridden by `node.title`. | `false` |
-| `onCheck` | function | onCheck handler: `function(checked, targetNode) {}` | `() => {}` |
-| `onClick` | function | onClick handler: `function(targetNode) {}`. If set, `onClick` will be called when a node's label has been clicked. | `() => {}` |
-| `onExpand` | function | onExpand handler: `function(expanded, targetNode) {}` | `() => {}` |
+| Property | Type | Description | Default |
+|----------------------| -------- |---------------------------------------------------------------------------------------------------------------------|-------------|
+| `nodes` | array | **Required**. Specifies the tree nodes and their children. | |
+| `checkModel` | string | Specifies which checked nodes should be stored in the `checked` array. Accepts `'leaf'` or `'all'`. | `'leaf'` |
+| `checked` | array | An array of checked node values. | `[]` |
+| `direction` | string | A string that specify whether the direction of the component is left-to-right (`'ltr'`) or right-to-left (`'rtl'`). | `'ltr'` |
+| `disabled` | bool | If true, the component will be disabled and nodes cannot be checked. | `false` |
+| `expandDisabled` | bool | If true, the ability to expand nodes will be disabled. | `false` |
+| `expandOnClick` | bool | If true, nodes will be expanded by clicking on labels. Requires a non-empty `onClick` function. | `false` |
+| `expanded` | array | An array of expanded node values. | `[]` |
+| `icons` | object | An object containing the mappings for the various icons and their components. See **Changing the Default Icons**. | `{ ... }` |
+| `iconsClass` | string | A string that specifies which icons class to utilize. Currently, `'fa4'` and `'fa5'` are supported. | `'fa5'` |
+| `id` | string | A string to be used for the HTML ID of the rendered tree and its nodes. | `null` |
+| `lang` | object | An object containing the language mappings for the various text elements. | `{ ... }` |
+| `name` | string | Optional name for the hidden `` element. | `undefined` |
+| `nameAsArray` | bool | If true, the hidden `` will encode its values as an array rather than a joined string. | `false` |
+| `nativeCheckboxes` | bool | If true, native browser checkboxes will be used instead of pseudo-checkbox icons. | `false` |
+| `noCascade` | bool | If true, toggling a parent node will **not** cascade its check state to its children. | `false` |
+| `onlyLeafCheckboxes` | bool | If true, checkboxes will only be shown for leaf nodes. | `false` |
+| `optimisticToggle` | bool | If true, toggling a partially-checked node will select all children. If false, it will deselect. | `true` |
+| `showExpandAll` | bool | If true, buttons for expanding and collapsing all parent nodes will appear in the tree. | `false` |
+| `showNodeIcon` | bool | If true, each node will show a parent or leaf icon. | `true` |
+| `showNodeTitle` | bool | If true, the `label` of each node will become the `title` of the resulting DOM node. Overridden by `node.title`. | `false` |
+| `onCheck` | function | onCheck handler: `function(checked, targetNode) {}` | `() => {}` |
+| `onClick` | function | onClick handler: `function(targetNode) {}`. If set, `onClick` will be called when a node's label has been clicked. | `() => {}` |
+| `onExpand` | function | onExpand handler: `function(expanded, targetNode) {}` | `() => {}` |
+| `i18n` | function | An i18n object to translate label | `null` |
#### `onCheck` and `onExpand`
diff --git a/src/index.d.ts b/src/index.d.ts
index 6b2fd05d..f3a0ddfc 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -65,6 +65,7 @@ declare module "react-checkbox-tree" {
onCheck?: (checked: Array, node: OnCheckNode) => void;
onClick?: (node: OnCheckNode) => void;
onExpand?: (expanded: Array, node: OnExpandNode) => void;
+ i18n?: any;
}
export default class CheckboxTree extends React.Component {}
diff --git a/src/js/CheckboxTree.jsx b/src/js/CheckboxTree.jsx
index f36f8eef..0c304da5 100644
--- a/src/js/CheckboxTree.jsx
+++ b/src/js/CheckboxTree.jsx
@@ -25,6 +25,7 @@ class CheckboxTree extends React.Component {
expandDisabled: PropTypes.bool,
expandOnClick: PropTypes.bool,
expanded: listShape,
+ i18n: PropTypes.func,
icons: iconsShape,
iconsClass: PropTypes.string,
id: PropTypes.string,
@@ -51,6 +52,7 @@ class CheckboxTree extends React.Component {
expandDisabled: false,
expandOnClick: false,
expanded: [],
+ i18n: null,
icons: {
check: ,
uncheck: ,
@@ -223,6 +225,7 @@ class CheckboxTree extends React.Component {
expandDisabled,
expandOnClick,
icons,
+ i18n,
lang,
noCascade,
onClick,
@@ -267,7 +270,7 @@ class CheckboxTree extends React.Component {
icons={this.combineMemorized(defaultIcons, icons)}
isLeaf={flatNode.isLeaf}
isParent={flatNode.isParent}
- label={node.label}
+ label={i18n ? i18n.t(node.label) : node.label}
lang={lang}
optimisticToggle={optimisticToggle}
showCheckbox={showCheckbox}