feat(richtext-lexical)!: add FixedToolbarFeature (#6192)

BREAKING:

- The default inline toolbar has now been extracted into an `InlineToolbarFeature`. While it's part of the defaultFeatures, you might have to add it to your editor features if you are not including the defaultFeatures and still want to keep the inline toolbar (floating toolbar)
- Some types have been renamed, e.g. `InlineToolbarGroup` is now `ToolbarGroup`, and `InlineToolbarGroupItem` is now `ToolbarGroupItem`
- The `displayName` property of SlashMenuGroup and SlashMenuItem has been renamed to `label` to match the `label` prop of the toolbars
- The `inlineToolbarFeatureButtonsGroupWithItem`, `inlineToolbarFormatGroupWithItems` and `inlineToolbarTextDropdownGroupWithItems` exports have been renamed to `toolbarTextDropdownGroupWithItems`,  `toolbarFormatGroupWithItems`, `toolbarFeatureButtonsGroupWithItems`

test/fields/collections/Lexical/e2e.spec.ts

@@ -213,11 +213,9 @@ describe('lexical', () => {
 
     await expect(floatingToolbar_formatSection).toBeVisible()
 
-    await expect(page.locator('.inline-toolbar-popup__button').first()).toBeVisible()
+    await expect(page.locator('.toolbar-popup__button').first()).toBeVisible()
 
-    const boldButton = floatingToolbar_formatSection
-      .locator('.inline-toolbar-popup__button')
-      .first()
+    const boldButton = floatingToolbar_formatSection.locator('.toolbar-popup__button').first()
 
     await expect(boldButton).toBeVisible()
     await boldButton.click()
@@ -443,11 +441,9 @@ describe('lexical', () => {
 
       await expect(floatingToolbar_formatSection).toBeVisible()
 
-      await expect(page.locator('.inline-toolbar-popup__button').first()).toBeVisible()
+      await expect(page.locator('.toolbar-popup__button').first()).toBeVisible()
 
-      const boldButton = floatingToolbar_formatSection
-        .locator('.inline-toolbar-popup__button')
-        .first()
+      const boldButton = floatingToolbar_formatSection.locator('.toolbar-popup__button').first()
 
       await expect(boldButton).toBeVisible()
       await boldButton.click()
@@ -521,7 +517,7 @@ describe('lexical', () => {
 
       await expect(floatingToolbar).toBeVisible()
 
-      const linkButton = floatingToolbar.locator('.inline-toolbar-popup__button-link').first()
+      const linkButton = floatingToolbar.locator('.toolbar-popup__button-link').first()
 
       await expect(linkButton).toBeVisible()
       await linkButton.click()

test/fields/collections/Lexical/index.ts

@@ -2,6 +2,7 @@ import type { CollectionConfig } from 'payload/types'
 
 import {
   BlocksFeature,
+  FixedToolbarFeature,
   HeadingFeature,
   LinkFeature,
   TreeViewFeature,
@@ -71,6 +72,7 @@ export const LexicalFields: CollectionConfig = {
           //TestRecorderFeature(),
           TreeViewFeature(),
           //HTMLConverterFeature(),
+          FixedToolbarFeature(),
           LinkFeature({
             fields: ({ defaultFields }) => [
               ...defaultFields,