feat(richtext-lexical)!: upgrade lexical from 0.15.0 to 0.16.0 and port over relevant playground changes (#6620)

**BREAKING:** - This upgrades the required version of lexical from 0.15.0 to 0.16.0. If you are using lexical directly in your project, possibly due to custom features, there might be breaking changes for you. Please consult the lexical 0.16.0 changelog: https://github.com/facebook/lexical/releases/tag/v0.16.0
2024-06-04 11:49:46 -04:00
parent cafc13a7d5
commit da35afbd8f
11 changed files with 204 additions and 181 deletions
--- a/packages/richtext-lexical/package.json
+++ b/packages/richtext-lexical/package.json
@@ -43,21 +43,21 @@
  "dependencies": {
    "@faceless-ui/modal": "2.0.2",
    "@faceless-ui/scroll-info": "1.3.0",
-    "@lexical/headless": "0.15.0",
-    "@lexical/link": "0.15.0",
-    "@lexical/list": "0.15.0",
-    "@lexical/mark": "0.15.0",
-    "@lexical/markdown": "0.15.0",
-    "@lexical/react": "0.15.0",
-    "@lexical/rich-text": "0.15.0",
-    "@lexical/selection": "0.15.0",
-    "@lexical/utils": "0.15.0",
+    "@lexical/headless": "0.16.0",
+    "@lexical/link": "0.16.0",
+    "@lexical/list": "0.16.0",
+    "@lexical/mark": "0.16.0",
+    "@lexical/markdown": "0.16.0",
+    "@lexical/react": "0.16.0",
+    "@lexical/rich-text": "0.16.0",
+    "@lexical/selection": "0.16.0",
+    "@lexical/utils": "0.16.0",
    "@types/uuid": "^9.0.8",
    "bson-objectid": "2.0.4",
    "classnames": "^2.3.2",
    "deep-equal": "2.2.3",
    "json-schema": "^0.4.0",
-    "lexical": "0.15.0",
+    "lexical": "0.16.0",
    "lodash": "4.17.21",
    "react-error-boundary": "4.0.13",
    "uuid": "^9.0.1"
@@ -77,19 +77,19 @@
  "peerDependencies": {
    "@faceless-ui/modal": "2.0.2",
    "@faceless-ui/scroll-info": "1.3.0",
-    "@lexical/headless": "0.15.0",
-    "@lexical/link": "0.15.0",
-    "@lexical/list": "0.15.0",
-    "@lexical/mark": "0.15.0",
-    "@lexical/markdown": "0.15.0",
-    "@lexical/react": "0.15.0",
-    "@lexical/rich-text": "0.15.0",
-    "@lexical/selection": "0.15.0",
-    "@lexical/utils": "0.15.0",
+    "@lexical/headless": "0.16.0",
+    "@lexical/link": "0.16.0",
+    "@lexical/list": "0.16.0",
+    "@lexical/mark": "0.16.0",
+    "@lexical/markdown": "0.16.0",
+    "@lexical/react": "0.16.0",
+    "@lexical/rich-text": "0.16.0",
+    "@lexical/selection": "0.16.0",
+    "@lexical/utils": "0.16.0",
    "@payloadcms/next": "workspace:*",
    "@payloadcms/translations": "workspace:*",
    "@payloadcms/ui": "workspace:*",
-    "lexical": "0.15.0",
+    "lexical": "0.16.0",
    "payload": "workspace:*",
    "react": "^19.0.0 || ^19.0.0-rc-f994737d14-20240522",
    "react-dom": "^19.0.0 || ^19.0.0-rc-f994737d14-20240522"
--- a/packages/richtext-lexical/src/field/features/debug/testRecorder/plugin/index.tsx
+++ b/packages/richtext-lexical/src/field/features/debug/testRecorder/plugin/index.tsx
@@ -88,7 +88,7 @@ const formatStep = (step: Step) => {
 }

 export function isSelectAll(event: KeyboardEvent): boolean {
-  return event.code === 'KeyA' && (IS_APPLE ? event.metaKey : event.ctrlKey)
+  return event.key.toLowerCase() === 'a' && (IS_APPLE ? event.metaKey : event.ctrlKey)
 }

 // stolen from LexicalSelection-test
--- a/packages/richtext-lexical/src/field/features/horizontalRule/component/index.tsx
+++ b/packages/richtext-lexical/src/field/features/horizontalRule/component/index.tsx
@@ -4,7 +4,7 @@ import type { NodeKey } from 'lexical'

 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'
 import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection.js'
-import { mergeRegister } from '@lexical/utils'
+import { addClassNamesToElement, mergeRegister, removeClassNamesFromElement } from '@lexical/utils'
 import {
  $getNodeByKey,
  $getSelection,
@@ -18,6 +18,8 @@ import { useCallback, useEffect } from 'react'

 import { $isHorizontalRuleNode } from '../nodes/HorizontalRuleNode.js'

+const isSelectedClassName = 'selected'
+
 /**
 * React component rendered in the lexical editor, WITHIN the hr element created by createDOM of the HorizontalRuleNode.
 *
@@ -69,7 +71,11 @@ export function HorizontalRuleComponent({ nodeKey }: { nodeKey: NodeKey }) {
  useEffect(() => {
    const hrElem = editor.getElementByKey(nodeKey)
    if (hrElem !== null) {
-      hrElem.className = isSelected ? 'selected' : ''
+      if (isSelected) {
+        addClassNamesToElement(hrElem, isSelectedClassName)
+      } else {
+        removeClassNamesFromElement(hrElem, isSelectedClassName)
+      }
    }
  }, [editor, isSelected, nodeKey])

--- a/packages/richtext-lexical/src/field/features/horizontalRule/nodes/HorizontalRuleNode.tsx
+++ b/packages/richtext-lexical/src/field/features/horizontalRule/nodes/HorizontalRuleNode.tsx
@@ -2,11 +2,13 @@ import type {
  DOMConversionMap,
  DOMConversionOutput,
  DOMExportOutput,
+  EditorConfig,
  LexicalCommand,
  LexicalNode,
  SerializedLexicalNode,
 } from 'lexical'

+import { addClassNamesToElement } from '@lexical/utils'
 import { $applyNodeReplacement, DecoratorNode, createCommand } from 'lexical'
 import * as React from 'react'

@@ -65,8 +67,10 @@ export class HorizontalRuleNode extends DecoratorNode<React.ReactElement> {
  /**
   * Determines how the hr element is rendered in the lexical editor. This is only the "initial" / "outer" HTML element.
   */
-  createDOM(): HTMLElement {
-    return document.createElement('hr')
+  createDOM(config: EditorConfig): HTMLElement {
+    const element = document.createElement('hr')
+    addClassNamesToElement(element, config.theme.hr)
+    return element
  }

  /**
--- a/packages/richtext-lexical/src/field/features/horizontalRule/plugin/index.scss
+++ b/packages/richtext-lexical/src/field/features/horizontalRule/plugin/index.scss
@@ -1,20 +1,20 @@
@import '../../../../scss/styles.scss';

-hr {
+.LexicalEditorTheme__hr {
  padding: 2px 2px;
  border: none;
  margin: 1rem 0;
  cursor: pointer;
 }

-hr:after {
+.LexicalEditorTheme__hr:after {
  content: '';
  display: block;
  height: 2px;
  background-color: var(--theme-elevation-250);
 }

-hr.selected {
+.LexicalEditorTheme__hr.selected {
  outline: 2px solid var(--theme-success-500);
  user-select: none;
 }
--- a/packages/richtext-lexical/src/field/features/link/plugins/clickableLink/index.tsx
+++ b/packages/richtext-lexical/src/field/features/link/plugins/clickableLink/index.tsx
@@ -1,12 +1,10 @@
 'use client'
-import LexicalClickableLinkPlugin from '@lexical/react/LexicalClickableLinkPlugin.js'
+import { ClickableLinkPlugin as LexicalClickableLinkPlugin } from '@lexical/react/LexicalClickableLinkPlugin.js'
 import React from 'react'

 import type { PluginComponent } from '../../../types.js'
 import type { ClientProps } from '../../feature.client.js'

 export const ClickableLinkPlugin: PluginComponent<ClientProps> = () => {
-  const Component = LexicalClickableLinkPlugin.default || LexicalClickableLinkPlugin
-  //@ts-expect-error ts being dumb
-  return <Component />
+  return <LexicalClickableLinkPlugin />
 }
--- a/packages/richtext-lexical/src/field/features/upload/nodes/UploadNode.tsx
+++ b/packages/richtext-lexical/src/field/features/upload/nodes/UploadNode.tsx
@@ -26,6 +26,15 @@ export type UploadData = {
  value: number | string
 }

+function isGoogleDocCheckboxImg(img: HTMLImageElement): boolean {
+  return (
+    img.parentElement != null &&
+    img.parentElement.tagName === 'LI' &&
+    img.previousSibling === null &&
+    img.getAttribute('aria-roledescription') === 'checkbox'
+  )
+}
+
 function $convertUploadElement(domNode: HTMLImageElement): DOMConversionOutput | null {
  if (
    domNode.hasAttribute('data-lexical-upload-relation-to') &&
@@ -45,6 +54,10 @@ function $convertUploadElement(domNode: HTMLImageElement): DOMConversionOutput |
      return { node }
    }
  }
+  const img = domNode
+  if (img.src.startsWith('file:///') || isGoogleDocCheckboxImg(img)) {
+    return null
+  }
  // TODO: Auto-upload functionality here!
  //}
  return null
--- a/packages/richtext-lexical/src/field/lexical/LexicalEditor.tsx
+++ b/packages/richtext-lexical/src/field/lexical/LexicalEditor.tsx
@@ -1,6 +1,6 @@
 'use client'
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'
-import LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary.js'
+import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary.js'
 import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin.js'
 import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin.js'
 import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin.js'
@@ -98,8 +98,6 @@ export const LexicalEditor: React.FC<
    }
  }, [isSmallWidthViewport])

-  const ErrorBoundaryComponent = LexicalErrorBoundary.default || LexicalErrorBoundary
-
  return (
    <React.Fragment>
      {editorConfig.features.plugins.map((plugin) => {
@@ -116,8 +114,7 @@ export const LexicalEditor: React.FC<
          }
        })}
        <RichTextPlugin
-          //@ts-expect-error ts being dumb
-          ErrorBoundary={ErrorBoundaryComponent}
+          ErrorBoundary={LexicalErrorBoundary}
          contentEditable={
            <div className="editor-scroller">
              <div className="editor" ref={onRef}>
--- a/packages/richtext-lexical/src/field/lexical/theme/EditorTheme.tsx
+++ b/packages/richtext-lexical/src/field/lexical/theme/EditorTheme.tsx
@@ -52,6 +52,7 @@ export const LexicalEditorTheme: EditorThemeClasses = {
    h5: 'LexicalEditorTheme__h5',
    h6: 'LexicalEditorTheme__h6',
  },
+  hr: 'LexicalEditorTheme__hr',
  indent: 'LexicalEditorTheme__indent',
  inlineImage: 'LexicalEditor__inline-image',
  link: 'LexicalEditorTheme__link',
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1145,32 +1145,32 @@ importers:
        specifier: 1.3.0
        version: 1.3.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)
      '@lexical/headless':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/link':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/list':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/mark':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/markdown':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/react':
-        specifier: 0.15.0
-        version: 0.15.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)(yjs@13.6.14)
+        specifier: 0.16.0
+        version: 0.16.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)(yjs@13.6.14)
      '@lexical/rich-text':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/selection':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/utils':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@types/uuid':
        specifier: ^9.0.8
        version: 9.0.8
@@ -1187,8 +1187,8 @@ importers:
        specifier: ^0.4.0
        version: 0.4.0
      lexical:
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      lodash:
        specifier: 4.17.21
        version: 4.17.21
@@ -1552,11 +1552,11 @@ importers:
  test:
    devDependencies:
      '@lexical/headless':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@lexical/markdown':
-        specifier: 0.15.0
-        version: 0.15.0
+        specifier: 0.16.0
+        version: 0.16.0
      '@payloadcms/db-mongodb':
        specifier: workspace:*
        version: link:../packages/db-mongodb
@@ -5463,42 +5463,42 @@ packages:
    resolution: {integrity: sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==}
    dev: false

-  /@lexical/clipboard@0.15.0:
-    resolution: {integrity: sha512-binCltK7KiURQJFogvueYfmDNEKynN/lmZrCLFp2xBjEIajqw4WtOVLJZ33engdqNlvj0JqrxrWxbKG+yvUwrg==}
+  /@lexical/clipboard@0.16.0:
+    resolution: {integrity: sha512-eYMJ6jCXpWBVC05Mu9HLMysrBbfi++xFfsm+Yo7A6kYGrqYUhpXqjJkYnw1xdZYL3bV73Oe4ByVJuq42GU+Mqw==}
    dependencies:
-      '@lexical/html': 0.15.0
-      '@lexical/list': 0.15.0
-      '@lexical/selection': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/html': 0.16.0
+      '@lexical/list': 0.16.0
+      '@lexical/selection': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/code@0.15.0:
-    resolution: {integrity: sha512-n185gjinGhz/M4BW1ayNPYAEgwW4T/NEFl2Wey/O+07W3zvh9k9ai7RjWd0c8Qzqc4DLlqvibvWPebWObQHA4w==}
+  /@lexical/code@0.16.0:
+    resolution: {integrity: sha512-1EKCBSFV745UI2zn5v75sKcvVdmd+y2JtZhw8CItiQkRnBLv4l4d/RZYy+cKOuXJGsoBrKtxXn5sl7HebwQbPw==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
      prismjs: 1.29.0

-  /@lexical/devtools-core@0.15.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522):
-    resolution: {integrity: sha512-kK/IVEiQyqs2DsY4QRYFaFiKQMpaAukAl8PXmNeGTZ7cfFVsP29E4n0/pjY+oxmiRvxbO1s2i14q58nfuhj4VQ==}
+  /@lexical/devtools-core@0.16.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522):
+    resolution: {integrity: sha512-Jt8p0J0UoMHf3UMh3VdyrXbLLwpEZuMqihTmbPRpwo+YQ6NGQU35QgwY2K0DpPAThpxL/Cm7uaFqGOy8Kjrhqw==}
    peerDependencies:
      react: ^19.0.0-rc-f994737d14-20240522
      react-dom: ^19.0.0-rc-f994737d14-20240522
    dependencies:
-      '@lexical/html': 0.15.0
-      '@lexical/link': 0.15.0
-      '@lexical/mark': 0.15.0
-      '@lexical/table': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/html': 0.16.0
+      '@lexical/link': 0.16.0
+      '@lexical/mark': 0.16.0
+      '@lexical/table': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
      react: 19.0.0-rc-f994737d14-20240522
      react-dom: 19.0.0-rc-f994737d14-20240522(react@19.0.0-rc-f994737d14-20240522)
    dev: false

-  /@lexical/dragon@0.15.0:
-    resolution: {integrity: sha512-hg2rGmxVJF7wmN6psuKw3EyhcNF7DtOYwUCBpjFZVshzAjsNEBfEnqhiMkSVSlN4+WOfM7LS+B88PTKPcnFGbQ==}
+  /@lexical/dragon@0.16.0:
+    resolution: {integrity: sha512-Yr29SFZzOPs+S6UrEZaXnnso1fJGVfZOXVJQZbyzlspqJpSHXVH7InOXYHWN6JSWQ8Hs/vU3ksJXwqz+0TCp2g==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0
    dev: false

  /@lexical/eslint-plugin@0.15.0(eslint@8.57.0):
@@ -5509,108 +5509,108 @@ packages:
      eslint: 8.57.0
    dev: true

-  /@lexical/hashtag@0.15.0:
-    resolution: {integrity: sha512-EP6KKvS6BY/8Vh1MLQYeOcYaxnvrLsUkvXXr+Fg8N477Us54Ju69pPO563mbWt7/bpnL9Sh0fbk82JtxqPWpSg==}
+  /@lexical/hashtag@0.16.0:
+    resolution: {integrity: sha512-2EdAvxYVYqb0nv6vgxCRgE8ip7yez5p0y0oeUyxmdbcfZdA+Jl90gYH3VdevmZ5Bk3wE0/fIqiLD+Bb5smqjCQ==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/headless@0.15.0:
-    resolution: {integrity: sha512-soLjCphUEHw+z2ulV9cOtisTWmGj6k7TU+O/6nzgn7E1FlvskrrykGhYFrXDsXqB1wJRaILHKlHxQSoNzf931A==}
+  /@lexical/headless@0.16.0:
+    resolution: {integrity: sha512-B0efH1EYpjPD5kayCsHFRbvneyF64JMB/unC6uYRkUxp6a733pqsWGta8DDn7KQt0W1XPI0jqDoJFDmQKwoi4g==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0

-  /@lexical/history@0.15.0:
-    resolution: {integrity: sha512-r+pzR2k/51AL6l8UfXeVe/GWPIeWY1kEOuKx9nsYB9tmAkTF66tTFz33DJIMWBVtAHWN7Dcdv0/yy6q8R6CAUQ==}
+  /@lexical/history@0.16.0:
+    resolution: {integrity: sha512-xwFxgDZGviyGEqHmgt6A6gPhsyU/yzlKRk9TBUVByba3khuTknlJ1a80H5jb+OYcrpiElml7iVuGYt+oC7atCA==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/html@0.15.0:
-    resolution: {integrity: sha512-x/sfGvibwo8b5Vso4ppqNyS/fVve6Rn+TmvP/0eWOaa0I3aOQ57ulfcK6p/GTe+ZaEi8vW64oZPdi8XDgwSRaA==}
+  /@lexical/html@0.16.0:
+    resolution: {integrity: sha512-okxn3q/1qkUpCZNEFRI39XeJj4YRjb6prm3WqZgP4d39DI1W24feeTZJjYRCW+dc3NInwFaolU3pNA2MGkjRtg==}
    dependencies:
-      '@lexical/selection': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/selection': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/link@0.15.0:
-    resolution: {integrity: sha512-KBV/zWk5FxqZGNcq3IKGBDCcS4t0uteU1osAIG+pefo4waTkOOgibxxEJDop2QR5wtjkYva3Qp0D8ZyJDMMMlw==}
+  /@lexical/link@0.16.0:
+    resolution: {integrity: sha512-ppvJSh/XGqlzbeymOiwcXJcUcrqgQqTK2QXTBAZq7JThtb0WsJxYd2CSLSN+Ycu23prnwqOqILcU0+34+gAVFw==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/list@0.15.0:
-    resolution: {integrity: sha512-JuF4k7uo4rZFOSZGrmkxo1+sUrwTKNBhhJAiCgtM+6TO90jppxzCFNKur81yPzF1+g4GWLC9gbjzKb52QPb6cQ==}
+  /@lexical/list@0.16.0:
+    resolution: {integrity: sha512-nBx/DMM7nCgnOzo1JyNnVaIrk/Xi5wIPNi8jixrEV6w9Om2K6dHutn/79Xzp2dQlNGSLHEDjky6N2RyFgmXh0g==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/mark@0.15.0:
-    resolution: {integrity: sha512-cdePA98sOJRc4/HHqcOcPBFq4UDwzaFJOK1N1E6XUGcXH1GU8zHtV1ElTgmbsGkyjBRwhR+OqKm9eso1PBOUkg==}
+  /@lexical/mark@0.16.0:
+    resolution: {integrity: sha512-WMR4nqygSgIQ6Vdr5WAzohxBGjH+m44dBNTbWTGZGVlRvPzvBT6tieCoxFqpceIq/ko67HGTCNoFj2cMKVwgIA==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/markdown@0.15.0:
-    resolution: {integrity: sha512-wu1EP758l452BovDa7i9ZAeWuFj+YY0bc2mNc08nfZ9GqdGMej1JIguY4CwIROCYVizprL9Ocn0avH1uv9b8fA==}
+  /@lexical/markdown@0.16.0:
+    resolution: {integrity: sha512-7HQLFrBbpY68mcq4A6C1qIGmjgA+fAByditi2WRe7tD2eoIKb/B5baQAnDKis0J+m5kTaCBmdlT6csSzyOPzeQ==}
    dependencies:
-      '@lexical/code': 0.15.0
-      '@lexical/link': 0.15.0
-      '@lexical/list': 0.15.0
-      '@lexical/rich-text': 0.15.0
-      '@lexical/text': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/code': 0.16.0
+      '@lexical/link': 0.16.0
+      '@lexical/list': 0.16.0
+      '@lexical/rich-text': 0.16.0
+      '@lexical/text': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/offset@0.15.0:
-    resolution: {integrity: sha512-VO1f3m8+RRdRjuXMtCBhi1COVKRC2LhP8AFYxnFlvbV+Waz9R5xB9pqFFUe4RtyqyTLmOUj6+LtsUFhq+23voQ==}
+  /@lexical/offset@0.16.0:
+    resolution: {integrity: sha512-4TqPEC2qA7sgO8Tm65nOWnhJ8dkl22oeuGv9sUB+nhaiRZnw3R45mDelg23r56CWE8itZnvueE7TKvV+F3OXtQ==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/overflow@0.15.0:
-    resolution: {integrity: sha512-9qKVCvh9Oka+bzR3th+UWdTEeMZXYy1ZxWbjSxefRMgQxzCvqSuVioK/065gPbvGga9EfvgLLLBDXZm8ISbJQA==}
+  /@lexical/overflow@0.16.0:
+    resolution: {integrity: sha512-a7gtIRxleEuMN9dj2yO4CdezBBfIr9Mq+m7G5z62+xy7VL7cfMfF+xWjy3EmDYDXS4vOQgAXAUgO4oKz2AKGhQ==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/plain-text@0.15.0:
-    resolution: {integrity: sha512-yeK466mXb4xaCCJouGzEHQs59fScHxF8Asq0azNyJmkhQWYrU7WdckHf2xj8ItZFFPyj7lvwKRDYnoy4HQD7Mg==}
+  /@lexical/plain-text@0.16.0:
+    resolution: {integrity: sha512-BK7/GSOZUHRJTbNPkpb9a/xN9z+FBCdunTsZhnOY8pQ7IKws3kuMO2Tk1zXfTd882ZNAxFdDKNdLYDSeufrKpw==}
    dependencies:
-      '@lexical/clipboard': 0.15.0
-      '@lexical/selection': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/clipboard': 0.16.0
+      '@lexical/selection': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0
    dev: false

-  /@lexical/react@0.15.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)(yjs@13.6.14):
-    resolution: {integrity: sha512-TWDp/F9cKwjGreLzIdHKlPUeTn275rR6j1VXrBffNwC5ovxWcKLVRg502eY5xvRQH3lkKQpFgIFbJW4KTvhFsQ==}
+  /@lexical/react@0.16.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)(yjs@13.6.14):
+    resolution: {integrity: sha512-WKFQbI0/m1YkLjL5t90YLJwjGcl5QRe6mkfm3ljQuL7Ioj3F92ZN/J2gHFVJ9iC8/lJs6Zzw6oFjiP8hQxJf9Q==}
    peerDependencies:
      react: ^19.0.0-rc-f994737d14-20240522
      react-dom: ^19.0.0-rc-f994737d14-20240522
    dependencies:
-      '@lexical/clipboard': 0.15.0
-      '@lexical/code': 0.15.0
-      '@lexical/devtools-core': 0.15.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)
-      '@lexical/dragon': 0.15.0
-      '@lexical/hashtag': 0.15.0
-      '@lexical/history': 0.15.0
-      '@lexical/link': 0.15.0
-      '@lexical/list': 0.15.0
-      '@lexical/mark': 0.15.0
-      '@lexical/markdown': 0.15.0
-      '@lexical/overflow': 0.15.0
-      '@lexical/plain-text': 0.15.0
-      '@lexical/rich-text': 0.15.0
-      '@lexical/selection': 0.15.0
-      '@lexical/table': 0.15.0
-      '@lexical/text': 0.15.0
-      '@lexical/utils': 0.15.0
-      '@lexical/yjs': 0.15.0(yjs@13.6.14)
-      lexical: 0.15.0
+      '@lexical/clipboard': 0.16.0
+      '@lexical/code': 0.16.0
+      '@lexical/devtools-core': 0.16.0(react-dom@19.0.0-rc-f994737d14-20240522)(react@19.0.0-rc-f994737d14-20240522)
+      '@lexical/dragon': 0.16.0
+      '@lexical/hashtag': 0.16.0
+      '@lexical/history': 0.16.0
+      '@lexical/link': 0.16.0
+      '@lexical/list': 0.16.0
+      '@lexical/mark': 0.16.0
+      '@lexical/markdown': 0.16.0
+      '@lexical/overflow': 0.16.0
+      '@lexical/plain-text': 0.16.0
+      '@lexical/rich-text': 0.16.0
+      '@lexical/selection': 0.16.0
+      '@lexical/table': 0.16.0
+      '@lexical/text': 0.16.0
+      '@lexical/utils': 0.16.0
+      '@lexical/yjs': 0.16.0(yjs@13.6.14)
+      lexical: 0.16.0
      react: 19.0.0-rc-f994737d14-20240522
      react-dom: 19.0.0-rc-f994737d14-20240522(react@19.0.0-rc-f994737d14-20240522)
      react-error-boundary: 3.1.4(react@19.0.0-rc-f994737d14-20240522)
@@ -5618,45 +5618,45 @@ packages:
      - yjs
    dev: false

-  /@lexical/rich-text@0.15.0:
-    resolution: {integrity: sha512-76tXh/eeEOHl91HpFEXCc/tUiLrsa9RcSyvCzRZahk5zqYvQPXma/AUfRzuSMf2kLwDEoauKAVqNFQcbPhqwpQ==}
+  /@lexical/rich-text@0.16.0:
+    resolution: {integrity: sha512-AGTD6yJZ+kj2TNah1r7/6vyufs6fZANeSvv9x5eG+WjV4uyUJYkd1qR8C5gFZHdkyr+bhAcsAXvS039VzAxRrQ==}
    dependencies:
-      '@lexical/clipboard': 0.15.0
-      '@lexical/selection': 0.15.0
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/clipboard': 0.16.0
+      '@lexical/selection': 0.16.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/selection@0.15.0:
-    resolution: {integrity: sha512-S+AQC6eJiQYSa5zOPuecN85prCT0Bcb8miOdJaE17Zh+vgdUH5gk9I0tEBeG5T7tkSpq6lFiEqs2FZSfaHflbQ==}
+  /@lexical/selection@0.16.0:
+    resolution: {integrity: sha512-trT9gQVJ2j6AwAe7tHJ30SRuxCpV6yR9LFtggxphHsXSvJYnoHC0CXh1TF2jHl8Gd5OsdWseexGLBE4Y0V3gwQ==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0

-  /@lexical/table@0.15.0:
-    resolution: {integrity: sha512-3IRBg8IoIHetqKozRQbJQ2aPyG0ziXZ+lc8TOIAGs6METW/wxntaV+rTNrODanKAgvk2iJTIyfFkYjsqS9+VFg==}
+  /@lexical/table@0.16.0:
+    resolution: {integrity: sha512-A66K779kxdr0yH2RwT2itsMnkzyFLFNPXyiWGLobCH8ON4QPuBouZvjbRHBe8Pe64yJ0c1bRDxSbTqUi9Wt3Gg==}
    dependencies:
-      '@lexical/utils': 0.15.0
-      lexical: 0.15.0
+      '@lexical/utils': 0.16.0
+      lexical: 0.16.0

-  /@lexical/text@0.15.0:
-    resolution: {integrity: sha512-WsAkAt9T1RH1iDrVuWeoRUeMCOAWar5oSFtnQ4m9vhT/zuf5b8efK87GiqCH00ZAn4DGzOuAfyXlMFqBVCQdkQ==}
+  /@lexical/text@0.16.0:
+    resolution: {integrity: sha512-9ilaOhuNIIGHKC8g8j3K/mEvJ09af9B6RKbm3GNoRcf/WNHD4dEFWNTEvgo/3zCzAS8EUBI6UINmfQQWlMjdIQ==}
    dependencies:
-      lexical: 0.15.0
+      lexical: 0.16.0

-  /@lexical/utils@0.15.0:
-    resolution: {integrity: sha512-/6954LDmTcVFgexhy5WOZDa4TxNQOEZNrf8z7TRAFiAQkihcME/GRoq1en5cbXoVNF8jv5AvNyyc7x0MByRJ6A==}
+  /@lexical/utils@0.16.0:
+    resolution: {integrity: sha512-GWmFEmd7o3GHqJBaEwzuZQbfTNI3Gg8ReGuHMHABgrkhZ8j2NggoRBlxsQLG0f7BewfTMVwbye22yBPq78775w==}
    dependencies:
-      '@lexical/list': 0.15.0
-      '@lexical/selection': 0.15.0
-      '@lexical/table': 0.15.0
-      lexical: 0.15.0
+      '@lexical/list': 0.16.0
+      '@lexical/selection': 0.16.0
+      '@lexical/table': 0.16.0
+      lexical: 0.16.0

-  /@lexical/yjs@0.15.0(yjs@13.6.14):
-    resolution: {integrity: sha512-Rf4AIu620Cq90li6GU58gkzlGRdntHP4ZeZrbJ3ToW7vEEnkW6Wl9/HhO647GG4OL5w46M0iWvx1b1b8xjYT1w==}
+  /@lexical/yjs@0.16.0(yjs@13.6.14):
+    resolution: {integrity: sha512-YIJr87DfAXTwoVHDjR7cci//hr4r/a61Nn95eo2JNwbTqQo65Gp8rwJivqVxNfvKZmRdwHTKgvdEDoBmI/tGog==}
    peerDependencies:
      yjs: '>=13.5.22'
    dependencies:
-      '@lexical/offset': 0.15.0
-      lexical: 0.15.0
+      '@lexical/offset': 0.16.0
+      lexical: 0.16.0
      yjs: 13.6.14
    dev: false

@@ -12796,6 +12796,10 @@ packages:

  /lexical@0.15.0:
    resolution: {integrity: sha512-/7HrPAmtgsc1F+qpv5bFwoQZ6CbH/w3mPPL2AW5P75/QYrqKz4bhvJrc2jozIX0GxtuT/YUYT7w+1sZMtUWbOg==}
+    dev: true
+
+  /lexical@0.16.0:
+    resolution: {integrity: sha512-Skn45Qhriazq4fpAtwnAB11U//GKc4vjzx54xsV3TkDLDvWpbL4Z9TNRwRoN3g7w8AkWnqjeOSODKkrjgfRSrg==}

  /lib0@0.2.93:
    resolution: {integrity: sha512-M5IKsiFJYulS+8Eal8f+zAqf5ckm1vffW0fFDxfgxJ+uiVopvDdd3PxJmz0GsVi3YNO7QCFSq0nAsiDmNhLj9Q==}
--- a/test/package.json
+++ b/test/package.json
@@ -12,8 +12,8 @@
    "typecheck": "pnpm turbo build --filter test && tsc --project tsconfig.typecheck.json"
  },
  "devDependencies": {
-    "@lexical/headless": "0.15.0",
-    "@lexical/markdown": "0.15.0",
+    "@lexical/headless": "0.16.0",
+    "@lexical/markdown": "0.16.0",
    "@payloadcms/db-mongodb": "workspace:*",
    "@payloadcms/db-postgres": "workspace:*",
    "@payloadcms/email-nodemailer": "workspace:*",