Skip to content

Commit

Permalink
Merge pull request #40 from devlulcas/main
Browse files Browse the repository at this point in the history
  • Loading branch information
hunghg255 authored Sep 8, 2024
2 parents 05b271b + 2667c15 commit b1532b2
Show file tree
Hide file tree
Showing 4 changed files with 177 additions and 19 deletions.
25 changes: 13 additions & 12 deletions docs/guide/internationalization.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,21 +14,22 @@ The editor provides built-in internationalization support, with English as the d

```javascript
// Import the locale object
import { locale } from 'reactjs-tiptap-editor'
import { locale } from 'reactjs-tiptap-editor';
// Set the language to English
locale.setLang('en')
locale.setLang('en');
// End
```

## Supported Languages

Currently, the editor supports the following languages:

| Language | Config | Version |
|--------------------|--------|----------------------------------------------------------------------------------|
| English | en | [v0.0.5](https://github.com/hunghg255/reactjs-tiptap-editor/releases/tag/v0.0.5) |
| Vietnamese | vi | |
| Simplified Chinese | zh_CN | |
| Language | Config | Version |
| -------------------- | ------ | -------------------------------------------------------------------------------- |
| English | en | [v0.0.5](https://github.com/hunghg255/reactjs-tiptap-editor/releases/tag/v0.0.5) |
| Vietnamese | vi | |
| Simplified Chinese | zh_CN | |
| Brazilian Portuguese | pt_BR | |

## Adding a New Language

Expand All @@ -37,19 +38,19 @@ If the platform doesn't support your desired language, you can add a custom lang
```javascript
// Don't worry about which content to translate; setMessage supports TypeScript
locale.setMessage('fr', {
'editor.remove': 'Supprimer'
'editor.remove': 'Supprimer',
// ...
})
});
```

### Overriding Default Language

To override part of the current language system, first choose a new language name, then import the default language data, and finally override the translations you want.

```javascript
import { en } from 'reactjs-tiptap-editor'
import { en } from 'reactjs-tiptap-editor';
locale.setMessage('en_US', {
...en,
'editor.remove': 'Delete'
})
'editor.remove': 'Delete',
});
```
11 changes: 6 additions & 5 deletions playground/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -167,13 +167,14 @@ function App() {
marginBottom: 10,
}}
>
<button onClick={() => locale.setLang('vi')}>Vietnamese</button>
<button onClick={() => locale.setLang('en')}>English</button>
<button onClick={() => locale.setLang('zh_CN')}>Chinese</button>
<button onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}>
<button type="button" onClick={() => locale.setLang('vi')}>Vietnamese</button>
<button type="button" onClick={() => locale.setLang('en')}>English</button>
<button type="button" onClick={() => locale.setLang('zh_CN')}>Chinese</button>
<button type="button" onClick={() => locale.setLang('pt_BR')}>Português</button>
<button type="button" onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}>
{theme === 'dark' ? 'Light' : 'Dark'}
</button>
<button onClick={() => setDisable(!disable)}>{disable ? 'Editable' : 'Readonly'}</button>
<button type="button" onClick={() => setDisable(!disable)}>{disable ? 'Editable' : 'Readonly'}</button>
</div>

<RichTextEditor
Expand Down
7 changes: 5 additions & 2 deletions src/locales/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,15 @@ import { useEffect, useMemo } from 'react'
import { proxy, useSnapshot } from 'valtio'

import en from './en'
import pt_BR from './pt-br'
import vi from './vi'
import zh_CN from './zh-cn'
import mitt from '@/utils/mitt'
import type { EventType } from '@/utils/mitt'
import { DEFAULT_LANG_VALUE } from '@/constants'

// Define supported language types
type LanguageType = 'en' | 'vi' | 'zh_CN' | string
type LanguageType = 'en' | 'vi' | 'zh_CN' | 'pt_BR' | (string & {})

// Define message key types based on the 'en' locale
type MessageKeysType = keyof typeof en
Expand All @@ -33,6 +34,7 @@ export const DEFAULT_LOCALE: LocaleInterface = {
en,
vi,
zh_CN,
pt_BR,
},
}

Expand Down Expand Up @@ -153,8 +155,9 @@ const localeActions = {
}

export default locale
export { Locale, useLocale, localeActions }
export { Locale, localeActions, useLocale }

export { default as en } from './en'
export { default as pt_BR } from './pt-br'
export { default as vi } from './vi'
export { default as zh_CN } from './zh-cn'
153 changes: 153 additions & 0 deletions src/locales/pt-br.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,153 @@
const locale = {
'editor.remove': 'Remover',
'editor.copy': 'Copiar',
'editor.words': 'PALAVRAS',
'editor.characters': 'CARACTERES',
'editor.default': 'Padrão',
'editor.recent': 'Usado recentemente',
'editor.nofill': 'Sem preenchimento',
'editor.format': 'Format Painter',
'editor.delete': 'Deletar',
'editor.edit': 'Editar',
'editor.settings': 'Configurações',
'editor.table_of_content': 'Tabela de conteúdos',
'editor.draghandle.tooltip': 'Modificar',
'editor.copyToClipboard': 'Copiar para a área de transferência',
'editor.importWord.tooltip': 'Importar Word',
'editor.slash': 'Pressione \'/\' para comandos',
'editor.slash.empty': 'Nenhum resultado',
'editor.slash.format': 'Formato',
'editor.slash.insert': 'Inserir',
'editor.slash.embed': 'Incorporar serviços',
'editor.content': 'Por favor, insira o conteúdo',
'editor.fontFamily.tooltip': 'Fonte',
'editor.fontFamily.default.tooltip': 'Padrão',
'editor.moremark': 'Mais estilos de texto',
'editor.size.small.tooltip': 'Pequeno',
'editor.size.medium.tooltip': 'Médio',
'editor.size.large.tooltip': 'Grande',
'editor.bold.tooltip': 'Negrito',
'editor.italic.tooltip': 'Itálico',
'editor.underline.tooltip': 'Sublinhado',
'editor.strike.tooltip': 'Riscado',
'editor.color.tooltip': 'Cor',
'editor.color.more': 'Mais cores',
'editor.highlight.tooltip': 'Destaque',
'editor.lineheight.tooltip': 'Altura da linha',
'editor.heading.tooltip': 'Cabeçalhos',
'editor.heading.h1.tooltip': 'Cabeçalho 1',
'editor.heading.h2.tooltip': 'Cabeçalho 2',
'editor.heading.h3.tooltip': 'Cabeçalho 3',
'editor.heading.h4.tooltip': 'Cabeçalho 4',
'editor.heading.h5.tooltip': 'Cabeçalho 5',
'editor.heading.h6.tooltip': 'Cabeçalho 6',
'editor.paragraph.tooltip': 'Parágrafo',
'editor.textalign.tooltip': 'Alinhar',
'editor.textalign.left.tooltip': 'Esquerda',
'editor.textalign.center.tooltip': 'Centro',
'editor.textalign.right.tooltip': 'Direita',
'editor.textalign.justify.tooltip': 'Justificar',
'editor.indent': 'Recuo',
'editor.indent.indent': 'Aumentar recuo',
'editor.indent.outdent': 'Diminuir recuo',
'editor.fontSize.tooltip': 'Tamanho da fonte',
'editor.fontSize.default.tooltip': 'Padrão',
'editor.superscript.tooltip': 'Sobrescrito',
'editor.subscript.tooltip': 'Subscrito',
'editor.bulletlist.tooltip': 'Lista de marcadores',
'editor.orderedlist.tooltip': 'Lista numerada',
'editor.tasklist.tooltip': 'Lista de tarefas',
'editor.indent.tooltip': 'Recuo',
'editor.outdent.tooltip': 'Diminuir recuo',
'editor.columns.tooltip': 'Colunas',
'editor.link.tooltip': 'Link',
'editor.link.unlink.tooltip': 'Desvincular',
'editor.link.open.tooltip': 'Abrir link',
'editor.link.edit.tooltip': 'Editar link',
'editor.link.dialog.title': 'Inserir link',
'editor.link.dialog.link': 'Link',
'editor.link.dialog.text': 'Texto',
'editor.link.dialog.openInNewTab': 'Abrir em nova guia',
'editor.link.dialog.link.placeholder': 'Endereço do link',
'editor.link.dialog.text.placeholder': 'Texto do link',
'editor.link.dialog.button.apply': 'Aplicar',
'editor.image.tooltip': 'Imagem',
'editor.image.dragger.tooltip': 'Clique ou arraste a imagem para a área de upload',
'editor.image.float.left.tooltip': 'Flutuar à esquerda',
'editor.image.float.none.tooltip': 'Nenhum flutuante',
'editor.image.float.right.tooltip': 'Flutuar à direita',
'editor.image.dialog.title': 'Adicionar uma imagem',
'editor.image.dialog.tab.url': 'Url',
'editor.image.dialog.tab.upload': 'Enviar',
'editor.image.dialog.uploading': 'Enviando',
'editor.image.dialog.form.link': 'Link',
'editor.image.dialog.placeholder': 'Link',
'editor.image.dialog.form.alt': 'Alt',
'editor.image.dialog.form.aspectRatio': 'Bloquear proporção original',
'editor.image.dialog.form.file': 'Arquivo',
'editor.image.dialog.button.apply': 'aplicar',
'editor.video.tooltip': 'Vídeo',
'editor.video.dialog.tab.upload': 'Enviar',
'editor.video.dialog.uploading': 'Enviando',
'editor.video.dialog.title': 'Incorporar ou enviar um vídeo',
'editor.video.dialog.link': 'link',
'editor.video.dialog.placeholder': 'Link',
'editor.video.dialog.button.apply': 'aplicar',
'editor.table.tooltip': 'Tabela',
'editor.table.menu.insert_table': 'Inserir tabela',
'editor.table.menu.insert_table.with_header_row': 'Com linha de cabeçalho',
'editor.table.menu.add_column_before': 'Adicionar coluna antes',
'editor.table.menu.add_column_after': 'Adicionar coluna depois',
'editor.table.menu.delete_column': 'Excluir coluna',
'editor.table.menu.add_row_before': 'Adicionar linha antes',
'editor.table.menu.add_row_after': 'Adicionar linha depois',
'editor.table.menu.delete_row': 'Deletar linha',
'editor.table.menu.merge_or_split_cells': 'Mesclar ou dividir células',
'editor.table.menu.delete_table': 'Deletar tabela',
'editor.blockquote.tooltip': 'Citação',
'editor.horizontalrule.tooltip': 'Regra horizontal',
'editor.code.tooltip': 'Código',
'editor.codeblock.tooltip': 'Bloco de código',
'editor.clear.tooltip': 'Limpar formato',
'editor.undo.tooltip': 'Desfazer',
'editor.redo.tooltip': 'Refazer',
'editor.fullscreen.tooltip.fullscreen': 'Tela cheia',
'editor.fullscreen.tooltip.exit': 'Sair da tela cheia',
'editor.imageUpload.fileTypeNotSupported': 'Tipo de arquivo não suportado',
'editor.imageUpload.fileSizeTooBig': 'Tamanho do arquivo muito grande, tamanho máximo é',
'editor.table.menu.insertColumnBefore': 'Inserir coluna antes',
'editor.table.menu.insertColumnAfter': 'Inserir coluna depois',
'editor.table.menu.deleteColumn': 'Excluir coluna',
'editor.table.menu.insertRowAbove': 'Inserir linha acima',
'editor.table.menu.insertRowBelow': 'Inserir linha abaixo',
'editor.table.menu.deleteRow': 'Deletar linha',
'editor.table.menu.mergeCells': 'Mesclar células',
'editor.table.menu.splitCells': 'Dividir células',
'editor.table.menu.deleteTable': 'Deletar tabela',
'editor.table.menu.setCellsBgColor': 'Cor de fundo da célula',
'editor.emoji.tooltip': 'Emoji',
'editor.iframe.tooltip': 'Iframe',
'editor.searchAndReplace.tooltip': 'Pesquisar e substituir',
'editor.search.dialog.text': 'Pesquisar',
'editor.replace.dialog.text': 'Substituir',
'editor.replaceAll.dialog.text': 'Substituir tudo',
'editor.previous.dialog.text': 'Anterior',
'editor.next.dialog.text': 'Próximo',
'no_result_found': 'Nenhum resultado encontrado',
'Smileys & People': 'Emoticons & Pessoas',
'Animals & Nature': 'Animais & Natureza',
'Food & Drink': 'Comida & Bebida',
'Activity': 'Atividade',
'Travel & Places': 'Viagem & Lugares',
'Object': 'Objetos',
'Symbol': 'Símbolos',
'Flags': 'Bandeiras',
'Frequently used': 'Frequentemente usado',
'editor.formula.dialog.text': 'Fórmula',
'editor.katex.tooltip': 'Fórmula matemática',
'editor.exportPdf.tooltip': 'Exportar PDF',
'editor.exportWord.tooltip': 'Exportar Word',
'editor.importWrod.tooltip': 'Importar Word',
}

export default locale

0 comments on commit b1532b2

Please sign in to comment.