docs: improve lexical code block documentation (#11416)

The existing code example had type errors when `strict: true` was enabled

Author: AlessioGr

docs/rich-text/custom-features.mdx

@@ -29,9 +29,9 @@ Using the BlocksFeature, you can add both inline blocks (= can be inserted into
 
 ### Example: Code Field Block with language picker
 
-This example demonstrates how to create a custom code field block with a language picker using the `BlocksFeature`. Make sure to manually install `@payloadcms/ui`first.
+This example demonstrates how to create a custom code field block with a language picker using the `BlocksFeature`. First, make sure to explicitly install `@payloadcms/ui` in your project.
 
-Field config:
+Field Config:
 
 ```ts
 import {
@@ -91,7 +91,6 @@ CodeComponent.tsx:
 
 ```tsx
 'use client'
-
 import type { CodeFieldClient, CodeFieldClientProps } from 'payload'
 
 import { CodeField, useFormFields } from '@payloadcms/ui'
@@ -105,6 +104,8 @@ const languageKeyToMonacoLanguageMap = {
   tsx: 'typescript',
 }
 
+type Language = keyof typeof languageKeyToMonacoLanguageMap
+
 export const Code: React.FC<CodeFieldClientProps> = ({
   autoComplete,
   field,
@@ -118,20 +119,21 @@ export const Code: React.FC<CodeFieldClientProps> = ({
 }) => {
   const languageField = useFormFields(([fields]) => fields['language'])
 
-  const language: string =
-    (languageField?.value as string) || (languageField.initialValue as string) || 'typescript'
+  const language: Language =
+    (languageField?.value as Language) || (languageField?.initialValue as Language) || 'ts'
 
-  const label = languages[language as keyof typeof languages]
+  const label = languages[language]
 
   const props: CodeFieldClient = useMemo<CodeFieldClient>(
     () => ({
       ...field,
       type: 'code',
       admin: {
         ...field.admin,
-        label,
+        editorOptions: undefined,
         language: languageKeyToMonacoLanguageMap[language] || language,
       },
+      label,
     }),
     [field, language, label],
   )