feat(richtext-lexical): i18n (#6542)

Continuation of #6524

packages/richtext-lexical/src/field/features/align/feature.client.tsx

@@ -39,7 +39,9 @@ const toolbarGroups: ToolbarGroup[] = [
         return true
       },
       key: 'alignLeft',
-      label: `Align Left`,
+      label: ({ i18n }) => {
+        return i18n.t('lexical:align:alignLeftLabel')
+      },
       onSelect: ({ editor }) => {
         editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'left')
       },
@@ -70,7 +72,9 @@ const toolbarGroups: ToolbarGroup[] = [
         return true
       },
       key: 'alignCenter',
-      label: `Align Center`,
+      label: ({ i18n }) => {
+        return i18n.t('lexical:align:alignCenterLabel')
+      },
       onSelect: ({ editor }) => {
         editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'center')
       },
@@ -101,7 +105,9 @@ const toolbarGroups: ToolbarGroup[] = [
         return true
       },
       key: 'alignRight',
-      label: `Align Right`,
+      label: ({ i18n }) => {
+        return i18n.t('lexical:align:alignRightLabel')
+      },
       onSelect: ({ editor }) => {
         editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'right')
       },
@@ -132,7 +138,9 @@ const toolbarGroups: ToolbarGroup[] = [
         return true
       },
       key: 'alignJustify',
-      label: `Align Justify`,
+      label: ({ i18n }) => {
+        return i18n.t('lexical:align:alignJustifyLabel')
+      },
       onSelect: ({ editor }) => {
         editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'justify')
       },

packages/richtext-lexical/src/field/features/align/feature.server.ts

@@ -1,13 +1,15 @@
 import type { FeatureProviderProviderServer } from '../types.js'
 
 import { AlignFeatureClientComponent } from './feature.client.js'
+import { i18n } from './i18n.js'
 
 export const AlignFeature: FeatureProviderProviderServer<undefined, undefined> = (props) => {
   return {
     feature: () => {
       return {
         ClientComponent: AlignFeatureClientComponent,
         clientFeatureProps: null,
+        i18n,
         serverFeatureProps: props,
       }
     },

packages/richtext-lexical/src/field/features/align/i18n.ts

@@ -0,0 +1,196 @@
+import type { GenericLanguages } from '@payloadcms/translations'
+
+export const i18n: Partial<GenericLanguages> = {
+  ar: {
+    alignCenterLabel: 'محاذاة في الوسط',
+    alignJustifyLabel: 'محاذاة التبرير',
+    alignLeftLabel: 'محاذاة إلى اليسار',
+    alignRightLabel: 'محاذاة إلى اليمين',
+  },
+  az: {
+    alignCenterLabel: 'Mərkəzə Düzəlt',
+    alignJustifyLabel: 'Düzəldin Səsləndirin',
+    alignLeftLabel: 'Sola Doğru Hizalama',
+    alignRightLabel: 'Sağa Doğru Hizalama',
+  },
+  bg: {
+    alignCenterLabel: 'Центрирай',
+    alignJustifyLabel: 'Подравняване по двата края',
+    alignLeftLabel: 'Подравняване отляво',
+    alignRightLabel: 'Подравняване вдясно',
+  },
+  cs: {
+    alignCenterLabel: 'Zarovnat na střed',
+    alignJustifyLabel: 'Zarovnat do bloku',
+    alignLeftLabel: 'Zarovnat vlevo',
+    alignRightLabel: 'Zarovnat vpravo',
+  },
+  de: {
+    alignCenterLabel: 'Zentrieren',
+    alignJustifyLabel: 'Blocksatz',
+    alignLeftLabel: 'Linksbündig',
+    alignRightLabel: 'Rechtsbündig',
+  },
+  en: {
+    alignCenterLabel: 'Align Center',
+    alignJustifyLabel: 'Align Justify',
+    alignLeftLabel: 'Align Left',
+    alignRightLabel: 'Align Right',
+  },
+  es: {
+    alignCenterLabel: 'Alinear al centro',
+    alignJustifyLabel: 'Alinear Justificar',
+    alignLeftLabel: 'Alinear a la izquierda',
+    alignRightLabel: 'Alinear a la derecha',
+  },
+  fa: {
+    alignCenterLabel: 'تراز در مرکز',
+    alignJustifyLabel: 'تراز کردن از دو طرف',
+    alignLeftLabel: 'چپ تراز',
+    alignRightLabel: 'راست چین',
+  },
+  fr: {
+    alignCenterLabel: 'Aligner au centre',
+    alignJustifyLabel: 'Aligner Justifier',
+    alignLeftLabel: 'Aligner à gauche',
+    alignRightLabel: 'Aligner à droite',
+  },
+  he: {
+    alignCenterLabel: 'ממורכז',
+    alignJustifyLabel: 'יישור דו-צדדי',
+    alignLeftLabel: 'הסב לשמאל',
+    alignRightLabel: 'יישור לימין',
+  },
+  hr: {
+    alignCenterLabel: 'Poravnaj središnje',
+    alignJustifyLabel: 'Poravnaj opravdaj',
+    alignLeftLabel: 'Poravnaj lijevo',
+    alignRightLabel: 'Poravnaj desno',
+  },
+  hu: {
+    alignCenterLabel: 'Középre igazítás',
+    alignJustifyLabel: 'Igazítás Sorkizárás',
+    alignLeftLabel: 'Igazítás balra',
+    alignRightLabel: 'Igazítás jobbra',
+  },
+  it: {
+    alignCenterLabel: 'Allinea al centro',
+    alignJustifyLabel: 'Allinea Giustifica',
+    alignLeftLabel: 'Allinea a sinistra',
+    alignRightLabel: 'Allinea a destra',
+  },
+  ja: {
+    alignCenterLabel: '中央揃え',
+    alignJustifyLabel: '両端揃え',
+    alignLeftLabel: '左揃え',
+    alignRightLabel: '右揃え',
+  },
+  ko: {
+    alignCenterLabel: '중앙 정렬',
+    alignJustifyLabel: '정렬 맞춤',
+    alignLeftLabel: '왼쪽 정렬',
+    alignRightLabel: '오른쪽 정렬',
+  },
+  my: {
+    alignCenterLabel: 'Pusat Selaras',
+    alignJustifyLabel: 'Penjajaran Justify',
+    alignLeftLabel: 'ဘယ်ဘက်ဦးတည်ခြင်း',
+    alignRightLabel: 'Penjajaran Kanan',
+  },
+  nb: {
+    alignCenterLabel: 'Sentrer tekst',
+    alignJustifyLabel: 'Juster linje',
+    alignLeftLabel: 'Juster til venstre',
+    alignRightLabel: 'Juster til høyre',
+  },
+  nl: {
+    alignCenterLabel: 'Centreer uitlijnen',
+    alignJustifyLabel: 'Uitlijnen Rechtvaardigen',
+    alignLeftLabel: 'Links uitlijnen',
+    alignRightLabel: 'Rechts uitlijnen',
+  },
+  pl: {
+    alignCenterLabel: 'Wyśrodkuj',
+    alignJustifyLabel: 'Wyjustuj wyrównanie',
+    alignLeftLabel: 'Wyrównaj do lewej',
+    alignRightLabel: 'Wyrównaj do prawej',
+  },
+  pt: {
+    alignCenterLabel: 'Alinhar ao Centro',
+    alignJustifyLabel: 'Alinhar Justificar',
+    alignLeftLabel: 'Alinhar à Esquerda',
+    alignRightLabel: 'Alinhar à Direita',
+  },
+  ro: {
+    alignCenterLabel: 'Aliniați Centrul',
+    alignJustifyLabel: 'Aliniaza Justifica',
+    alignLeftLabel: 'Aliniați la stânga',
+    alignRightLabel: 'Aliniați la dreapta',
+  },
+  rs: {
+    alignCenterLabel: 'Centriraj',
+    alignJustifyLabel: 'Poravnaj opravdaj',
+    alignLeftLabel: 'Poravnaj levo',
+    alignRightLabel: 'Poravnaj desno',
+  },
+  'rs-latin': {
+    alignCenterLabel: 'Poravnaj centar',
+    alignJustifyLabel: 'Poravnaj opravdanje',
+    alignLeftLabel: 'Poravnaj levo',
+    alignRightLabel: 'Poravnaj desno',
+  },
+  ru: {
+    alignCenterLabel: 'Выровнять по центру',
+    alignJustifyLabel: 'Выровнять по ширине',
+    alignLeftLabel: 'Выровнять по левому краю',
+    alignRightLabel: 'Выровнять по правому краю',
+  },
+  sk: {
+    alignCenterLabel: 'Vycentrovať',
+    alignJustifyLabel: 'Zarovnať do bloku',
+    alignLeftLabel: 'Zarovnať doľava',
+    alignRightLabel: 'Zarovnať doprava',
+  },
+  sv: {
+    alignCenterLabel: 'Centrera',
+    alignJustifyLabel: 'Justera Justify',
+    alignLeftLabel: 'Justera till vänster',
+    alignRightLabel: 'Justera till höger',
+  },
+  th: {
+    alignCenterLabel: 'จัดแนวกึ่งกลาง',
+    alignJustifyLabel: 'จัดแนวตรง',
+    alignLeftLabel: 'จัดชิดซ้าย',
+    alignRightLabel: 'จัดชิดขวา',
+  },
+  tr: {
+    alignCenterLabel: 'Ortaya Hizala',
+    alignJustifyLabel: 'Hizala Yasla',
+    alignLeftLabel: 'Sola Hizala',
+    alignRightLabel: 'Sağa Hizala',
+  },
+  uk: {
+    alignCenterLabel: 'Вирівняти по центру',
+    alignJustifyLabel: 'Вирівняти за шириною',
+    alignLeftLabel: 'Вирівняти по лівому краю',
+    alignRightLabel: 'Вирівняти по правому краю',
+  },
+  vi: {
+    alignCenterLabel: 'Căn giữa',
+    alignJustifyLabel: 'Căn đều',
+    alignLeftLabel: 'Căn lề trái',
+    alignRightLabel: 'Căn phải',
+  },
+  zh: {
+    alignCenterLabel: '居中对齐',
+    alignJustifyLabel: '对齐调整',
+    alignLeftLabel: '向左对齐',
+    alignRightLabel: '向右对齐',
+  },
+  'zh-TW': {
+    alignCenterLabel: '對齊中心',
+    alignJustifyLabel: '對齊並排列',
+    alignLeftLabel: '向左對齊',
+    alignRightLabel: '向右對齊',
+  },
+}

packages/richtext-lexical/src/field/features/blockquote/feature.client.tsx

@@ -9,6 +9,7 @@ import type { FeatureProviderProviderClient } from '../types.js'
 
 import { BlockquoteIcon } from '../../lexical/ui/icons/Blockquote/index.js'
 import { createClientComponent } from '../createClientComponent.js'
+import { slashMenuBasicGroupWithItems } from '../shared/slashMenu/basicGroup.js'
 import { toolbarTextDropdownGroupWithItems } from '../shared/toolbar/textDropdownGroup.js'
 import { MarkdownTransformer } from './markdownTransformer.js'
 
@@ -28,7 +29,9 @@ const toolbarGroups: ToolbarGroup[] = [
         return true
       },
       key: 'blockquote',
-      label: `Blockquote`,
+      label: ({ i18n }) => {
+        return i18n.t('lexical:blockquote:label')
+      },
       onSelect: ({ editor }) => {
         editor.update(() => {
           const selection = $getSelection()
@@ -50,24 +53,22 @@ const BlockquoteFeatureClient: FeatureProviderProviderClient<undefined> = (props
 
       slashMenu: {
         groups: [
-          {
-            items: [
-              {
-                Icon: BlockquoteIcon,
-                key: 'blockquote',
-                keywords: ['quote', 'blockquote'],
-                label: 'Blockquote',
-                onSelect: ({ editor }) => {
-                  editor.update(() => {
-                    const selection = $getSelection()
-                    $setBlocksType(selection, () => $createQuoteNode())
-                  })
-                },
+          slashMenuBasicGroupWithItems([
+            {
+              Icon: BlockquoteIcon,
+              key: 'blockquote',
+              keywords: ['quote', 'blockquote'],
+              label: ({ i18n }) => {
+                return i18n.t('lexical:blockquote:label')
+              },
+              onSelect: ({ editor }) => {
+                editor.update(() => {
+                  const selection = $getSelection()
+                  $setBlocksType(selection, () => $createQuoteNode())
+                })
               },
-            ],
-            key: 'basic',
-            label: 'Basic',
-          },
+            },
+          ]),
         ],
       },
       toolbarFixed: {

packages/richtext-lexical/src/field/features/blockquote/feature.server.ts

@@ -5,6 +5,7 @@ import type { FeatureProviderProviderServer } from '../types.js'
 import { convertLexicalNodesToHTML } from '../converters/html/converter/index.js'
 import { createNode } from '../typeUtilities.js'
 import { BlockquoteFeatureClientComponent } from './feature.client.js'
+import { i18n } from './i18n.js'
 import { MarkdownTransformer } from './markdownTransformer.js'
 
 export const BlockquoteFeature: FeatureProviderProviderServer<undefined, undefined> = (props) => {
@@ -13,6 +14,7 @@ export const BlockquoteFeature: FeatureProviderProviderServer<undefined, undefin
       return {
         ClientComponent: BlockquoteFeatureClientComponent,
         clientFeatureProps: null,
+        i18n,
         markdownTransformers: [MarkdownTransformer],
         nodes: [
           createNode({