@payloadcms/richtext-lexical 3.84.0 → 4.0.0-internal.38b7f1d

package/dist/features/blocks/client/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getTranslation","BlockIcon","InlineBlocksIcon","createClientFeature","getBlockImageComponent","getBlockMarkdownTransformers","BlockNode","InlineBlockNode","INSERT_BLOCK_COMMAND","INSERT_INLINE_BLOCK_COMMAND","BlocksPlugin","BlocksFeatureClient","config","featureClientSchemaMap","props","schemaPath","schemaMapRenderedBlockPathPrefix","schemaMapRenderedInlineBlockPathPrefix","clientSchema","blocksFields","Object","entries","filter","key","startsWith","replace","includes","map","value","inlineBlocksFields","clientBlocks","field","blockReferences","blocksMap","blocks","block","undefined","clientInlineBlocks","markdownTransformers","inlineBlocks","nodes","plugins","Component","position","sanitizedClientFeatureProps","slashMenu","groups","length","items","Icon","slug","keywords","label","i18n","blockDisplayName","labels","singular","onSelect","editor","dispatchCommand","blockName","blockType","t","inlineBlock","Boolean","toolbarFixed","type","ChildComponent","index","isActive","order"],"sources":["../../../../src/features/blocks/client/index.tsx"],"sourcesContent":["'use client'\n\nimport type { I18nClient } from '@payloadcms/translations'\nimport type { BlocksFieldClient, ClientBlock } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type {\n  SlashMenuGroup,\n  SlashMenuItem,\n} from '../../../lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/types.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../toolbars/types.js'\n\nimport { BlockIcon } from '../../../lexical/ui/icons/Block/index.js'\nimport { InlineBlocksIcon } from '../../../lexical/ui/icons/InlineBlocks/index.js'\nimport { createClientFeature } from '../../../utilities/createClientFeature.js'\nimport { getBlockImageComponent } from './getBlockImageComponent.js'\nimport { getBlockMarkdownTransformers } from './markdown/markdownTransformer.js'\nimport { BlockNode } from './nodes/BlocksNode.js'\nimport { InlineBlockNode } from './nodes/InlineBlocksNode.js'\nimport { INSERT_BLOCK_COMMAND, INSERT_INLINE_BLOCK_COMMAND } from './plugin/commands.js'\nimport { BlocksPlugin } from './plugin/index.js'\nexport const BlocksFeatureClient = createClientFeature(\n  ({ config, featureClientSchemaMap, props, schemaPath }) => {\n    const schemaMapRenderedBlockPathPrefix = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks`\n    const schemaMapRenderedInlineBlockPathPrefix = `${schemaPath}.lexical_internal_feature.blocks.lexical_inline_blocks`\n    const clientSchema = featureClientSchemaMap['blocks']\n\n    if (!clientSchema) {\n      return {}\n    }\n\n    const blocksFields: BlocksFieldClient[] = Object.entries(clientSchema)\n      .filter(\n        ([key]) =>\n          key.startsWith(schemaMapRenderedBlockPathPrefix + '.') &&\n          !key.replace(schemaMapRenderedBlockPathPrefix + '.', '').includes('.'),\n      )\n      .map(([, value]) => value[0] as BlocksFieldClient)\n\n    const inlineBlocksFields: BlocksFieldClient[] = Object.entries(clientSchema)\n      .filter(\n        ([key]) =>\n          key.startsWith(schemaMapRenderedInlineBlockPathPrefix + '.') &&\n          !key.replace(schemaMapRenderedInlineBlockPathPrefix + '.', '').includes('.'),\n      )\n      .map(([, value]) => value[0] as BlocksFieldClient)\n\n    const clientBlocks: ClientBlock[] = blocksFields\n      .map((field) => {\n        return field.blockReferences\n          ? typeof field.blockReferences[0] === 'string'\n            ? config.blocksMap[field.blockReferences[0]]\n            : field.blockReferences[0]\n          : field.blocks[0]\n      })\n      .filter((block) => block !== undefined)\n\n    const clientInlineBlocks: ClientBlock[] = inlineBlocksFields\n      .map((field) => {\n        return field.blockReferences\n          ? typeof field.blockReferences[0] === 'string'\n            ? config.blocksMap[field.blockReferences[0]]\n            : field.blockReferences[0]\n          : field.blocks[0]\n      })\n      .filter((block) => block !== undefined)\n\n    return {\n      markdownTransformers: getBlockMarkdownTransformers({\n        blocks: clientBlocks,\n        inlineBlocks: clientInlineBlocks,\n      }),\n      nodes: [BlockNode, InlineBlockNode],\n      plugins: [\n        {\n          Component: BlocksPlugin,\n          position: 'normal',\n        },\n      ],\n      sanitizedClientFeatureProps: props,\n      slashMenu: {\n        groups: [\n          clientBlocks?.length\n            ? {\n                items: clientBlocks.map((block) => {\n                  return {\n                    Icon: getBlockImageComponent(block, BlockIcon),\n                    key: 'block-' + block.slug,\n                    keywords: ['block', 'blocks', block.slug],\n                    label: ({ i18n }) => {\n                      const blockDisplayName = block?.labels?.singular\n                        ? getTranslation(block.labels.singular, i18n)\n                        : block?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: block.slug,\n                      })\n                    },\n                  } as SlashMenuItem\n                }),\n                key: 'blocks',\n                label: ({ i18n }: { i18n: I18nClient<object, 'lexical:blocks:label'> }) => {\n                  return i18n.t('lexical:blocks:label')\n                },\n              }\n            : null,\n          clientInlineBlocks?.length\n            ? {\n                items: clientInlineBlocks.map((inlineBlock) => {\n                  return {\n                    Icon: InlineBlocksIcon,\n                    key: 'inlineBlocks-' + inlineBlock.slug,\n                    keywords: ['inlineBlock', 'inline block', inlineBlock.slug],\n                    label: ({ i18n }) => {\n                      const blockDisplayName = inlineBlock?.labels?.singular\n                        ? getTranslation(inlineBlock.labels.singular, i18n)\n                        : inlineBlock?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_INLINE_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: inlineBlock.slug,\n                      })\n                    },\n                  } as SlashMenuItem\n                }),\n                key: 'inlineBlocks',\n                label: ({\n                  i18n,\n                }: {\n                  i18n: I18nClient<object, 'lexical:blocks:inlineBlocks:label'>\n                }) => {\n                  return i18n.t('lexical:blocks:inlineBlocks:label')\n                },\n              }\n            : null,\n        ].filter(Boolean) as SlashMenuGroup[],\n      },\n      toolbarFixed: {\n        groups: [\n          clientBlocks.length\n            ? {\n                type: 'dropdown',\n                ChildComponent: BlockIcon,\n                items: clientBlocks.map((block, index) => {\n                  return {\n                    ChildComponent: getBlockImageComponent(block, BlockIcon),\n                    isActive: undefined, // At this point, we would be inside a sub-richtext-editor. And at this point this will be run against the focused sub-editor, not the parent editor which has the actual block. Thus, no point in running this\n                    key: 'block-' + block.slug,\n                    label: ({ i18n }) => {\n                      const blockDisplayName = block?.labels?.singular\n                        ? getTranslation(block.labels.singular, i18n)\n                        : block?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: block.slug,\n                      })\n                    },\n                    order: index,\n                  } as ToolbarGroupItem\n                }),\n                key: 'blocks',\n                order: 20,\n              }\n            : null,\n          clientInlineBlocks?.length\n            ? {\n                type: 'dropdown',\n                ChildComponent: InlineBlocksIcon,\n                items: clientInlineBlocks.map((inlineBlock, index) => {\n                  return {\n                    ChildComponent: getBlockImageComponent(inlineBlock, InlineBlocksIcon),\n                    isActive: undefined,\n                    key: 'inlineBlock-' + inlineBlock.slug,\n                    label: ({ i18n }) => {\n                      const blockDisplayName = inlineBlock?.labels?.singular\n                        ? getTranslation(inlineBlock.labels.singular, i18n)\n                        : inlineBlock?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_INLINE_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: inlineBlock.slug,\n                      })\n                    },\n                    order: index,\n                  } as ToolbarGroupItem\n                }),\n                key: 'inlineBlocks',\n                order: 25,\n              }\n            : null,\n        ].filter(Boolean) as ToolbarGroup[],\n      },\n    }\n  },\n)\n"],"mappings":"AAAA;;AAKA,SAASA,cAAc,QAAQ;AAQ/B,SAASC,SAAS,QAAQ;AAC1B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,mBAAmB,QAAQ;AACpC,SAASC,sBAAsB,QAAQ;AACvC,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,SAAS,QAAQ;AAC1B,SAASC,eAAe,QAAQ;AAChC,SAASC,oBAAoB,EAAEC,2BAA2B,QAAQ;AAClE,SAASC,YAAY,QAAQ;AAC7B,OAAO,MAAMC,mBAAA,GAAsBR,mBAAA,CACjC,CAAC;EAAES,MAAM;EAAEC,sBAAsB;EAAEC,KAAK;EAAEC;AAAU,CAAE;EACpD,MAAMC,gCAAA,GAAmC,GAAGD,UAAA,iDAA2D;EACvG,MAAME,sCAAA,GAAyC,GAAGF,UAAA,wDAAkE;EACpH,MAAMG,YAAA,GAAeL,sBAAsB,CAAC,SAAS;EAErD,IAAI,CAACK,YAAA,EAAc;IACjB,OAAO,CAAC;EACV;EAEA,MAAMC,YAAA,GAAoCC,MAAA,CAAOC,OAAO,CAACH,YAAA,EACtDI,MAAM,CACL,CAAC,CAACC,GAAA,CAAI,KACJA,GAAA,CAAIC,UAAU,CAACR,gCAAA,GAAmC,QAClD,CAACO,GAAA,CAAIE,OAAO,CAACT,gCAAA,GAAmC,KAAK,IAAIU,QAAQ,CAAC,MAErEC,GAAG,CAAC,CAAC,GAAGC,KAAA,CAAM,KAAKA,KAAK,CAAC,EAAE;EAE9B,MAAMC,kBAAA,GAA0CT,MAAA,CAAOC,OAAO,CAACH,YAAA,EAC5DI,MAAM,CACL,CAAC,CAACC,GAAA,CAAI,KACJA,GAAA,CAAIC,UAAU,CAACP,sCAAA,GAAyC,QACxD,CAACM,GAAA,CAAIE,OAAO,CAACR,sCAAA,GAAyC,KAAK,IAAIS,QAAQ,CAAC,MAE3EC,GAAG,CAAC,CAAC,GAAGC,KAAA,CAAM,KAAKA,KAAK,CAAC,EAAE;EAE9B,MAAME,YAAA,GAA8BX,YAAA,CACjCQ,GAAG,CAAEI,KAAA;IACJ,OAAOA,KAAA,CAAMC,eAAe,GACxB,OAAOD,KAAA,CAAMC,eAAe,CAAC,EAAE,KAAK,WAClCpB,MAAA,CAAOqB,SAAS,CAACF,KAAA,CAAMC,eAAe,CAAC,EAAE,CAAC,GAC1CD,KAAA,CAAMC,eAAe,CAAC,EAAE,GAC1BD,KAAA,CAAMG,MAAM,CAAC,EAAE;EACrB,GACCZ,MAAM,CAAEa,KAAA,IAAUA,KAAA,KAAUC,SAAA;EAE/B,MAAMC,kBAAA,GAAoCR,kBAAA,CACvCF,GAAG,CAAEI,KAAA;IACJ,OAAOA,KAAA,CAAMC,eAAe,GACxB,OAAOD,KAAA,CAAMC,eAAe,CAAC,EAAE,KAAK,WAClCpB,MAAA,CAAOqB,SAAS,CAACF,KAAA,CAAMC,eAAe,CAAC,EAAE,CAAC,GAC1CD,KAAA,CAAMC,eAAe,CAAC,EAAE,GAC1BD,KAAA,CAAMG,MAAM,CAAC,EAAE;EACrB,GACCZ,MAAM,CAAEa,KAAA,IAAUA,KAAA,KAAUC,SAAA;EAE/B,OAAO;IACLE,oBAAA,EAAsBjC,4BAAA,CAA6B;MACjD6B,MAAA,EAAQJ,YAAA;MACRS,YAAA,EAAcF;IAChB;IACAG,KAAA,EAAO,CAAClC,SAAA,EAAWC,eAAA,CAAgB;IACnCkC,OAAA,EAAS,CACP;MACEC,SAAA,EAAWhC,YAAA;MACXiC,QAAA,EAAU;IACZ,EACD;IACDC,2BAAA,EAA6B9B,KAAA;IAC7B+B,SAAA,EAAW;MACTC,MAAA,EAAQ,CACNhB,YAAA,EAAciB,MAAA,GACV;QACEC,KAAA,EAAOlB,YAAA,CAAaH,GAAG,CAAEQ,KAAA;UACvB,OAAO;YACLc,IAAA,EAAM7C,sBAAA,CAAuB+B,KAAA,EAAOlC,SAAA;YACpCsB,GAAA,EAAK,WAAWY,KAAA,CAAMe,IAAI;YAC1BC,QAAA,EAAU,CAAC,SAAS,UAAUhB,KAAA,CAAMe,IAAI,CAAC;YACzCE,KAAA,EAAOA,CAAC;cAAEC;YAAI,CAAE;cACd,MAAMC,gBAAA,GAAmBnB,KAAA,EAAOoB,MAAA,EAAQC,QAAA,GACpCxD,cAAA,CAAemC,KAAA,CAAMoB,MAAM,CAACC,QAAQ,EAAEH,IAAA,IACtClB,KAAA,EAAOe,IAAA;cAEX,OAAOI,gBAAA;YACT;YACAG,QAAA,EAAUA,CAAC;cAAEC;YAAM,CAAE;cACnBA,MAAA,CAAOC,eAAe,CAACnD,oBAAA,EAAsB;gBAC3CoD,SAAA,EAAW;gBACXC,SAAA,EAAW1B,KAAA,CAAMe;cACnB;YACF;UACF;QACF;QACA3B,GAAA,EAAK;QACL6B,KAAA,EAAOA,CAAC;UAAEC;QAAI,CAAwD;UACpE,OAAOA,IAAA,CAAKS,CAAC,CAAC;QAChB;MACF,IACA,MACJzB,kBAAA,EAAoBU,MAAA,GAChB;QACEC,KAAA,EAAOX,kBAAA,CAAmBV,GAAG,CAAEoC,WAAA;UAC7B,OAAO;YACLd,IAAA,EAAM/C,gBAAA;YACNqB,GAAA,EAAK,kBAAkBwC,WAAA,CAAYb,IAAI;YACvCC,QAAA,EAAU,CAAC,eAAe,gBAAgBY,WAAA,CAAYb,IAAI,CAAC;YAC3DE,KAAA,EAAOA,CAAC;cAAEC;YAAI,CAAE;cACd,MAAMC,gBAAA,GAAmBS,WAAA,EAAaR,MAAA,EAAQC,QAAA,GAC1CxD,cAAA,CAAe+D,WAAA,CAAYR,MAAM,CAACC,QAAQ,EAAEH,IAAA,IAC5CU,WAAA,EAAab,IAAA;cAEjB,OAAOI,gBAAA;YACT;YACAG,QAAA,EAAUA,CAAC;cAAEC;YAAM,CAAE;cACnBA,MAAA,CAAOC,eAAe,CAAClD,2BAAA,EAA6B;gBAClDmD,SAAA,EAAW;gBACXC,SAAA,EAAWE,WAAA,CAAYb;cACzB;YACF;UACF;QACF;QACA3B,GAAA,EAAK;QACL6B,KAAA,EAAOA,CAAC;UACNC;QAAI,CAGL;UACC,OAAOA,IAAA,CAAKS,CAAC,CAAC;QAChB;MACF,IACA,KACL,CAACxC,MAAM,CAAC0C,OAAA;IACX;IACAC,YAAA,EAAc;MACZnB,MAAA,EAAQ,CACNhB,YAAA,CAAaiB,MAAM,GACf;QACEmB,IAAA,EAAM;QACNC,cAAA,EAAgBlE,SAAA;QAChB+C,KAAA,EAAOlB,YAAA,CAAaH,GAAG,CAAC,CAACQ,KAAA,EAAOiC,KAAA;UAC9B,OAAO;YACLD,cAAA,EAAgB/D,sBAAA,CAAuB+B,KAAA,EAAOlC,SAAA;YAC9CoE,QAAA,EAAUjC,SAAA;YACVb,GAAA,EAAK,WAAWY,KAAA,CAAMe,IAAI;YAC1BE,KAAA,EAAOA,CAAC;cAAEC;YAAI,CAAE;cACd,MAAMC,gBAAA,GAAmBnB,KAAA,EAAOoB,MAAA,EAAQC,QAAA,GACpCxD,cAAA,CAAemC,KAAA,CAAMoB,MAAM,CAACC,QAAQ,EAAEH,IAAA,IACtClB,KAAA,EAAOe,IAAA;cAEX,OAAOI,gBAAA;YACT;YACAG,QAAA,EAAUA,CAAC;cAAEC;YAAM,CAAE;cACnBA,MAAA,CAAOC,eAAe,CAACnD,oBAAA,EAAsB;gBAC3CoD,SAAA,EAAW;gBACXC,SAAA,EAAW1B,KAAA,CAAMe;cACnB;YACF;YACAoB,KAAA,EAAOF;UACT;QACF;QACA7C,GAAA,EAAK;QACL+C,KAAA,EAAO;MACT,IACA,MACJjC,kBAAA,EAAoBU,MAAA,GAChB;QACEmB,IAAA,EAAM;QACNC,cAAA,EAAgBjE,gBAAA;QAChB8C,KAAA,EAAOX,kBAAA,CAAmBV,GAAG,CAAC,CAACoC,WAAA,EAAaK,KAAA;UAC1C,OAAO;YACLD,cAAA,EAAgB/D,sBAAA,CAAuB2D,WAAA,EAAa7D,gBAAA;YACpDmE,QAAA,EAAUjC,SAAA;YACVb,GAAA,EAAK,iBAAiBwC,WAAA,CAAYb,IAAI;YACtCE,KAAA,EAAOA,CAAC;cAAEC;YAAI,CAAE;cACd,MAAMC,gBAAA,GAAmBS,WAAA,EAAaR,MAAA,EAAQC,QAAA,GAC1CxD,cAAA,CAAe+D,WAAA,CAAYR,MAAM,CAACC,QAAQ,EAAEH,IAAA,IAC5CU,WAAA,EAAab,IAAA;cAEjB,OAAOI,gBAAA;YACT;YACAG,QAAA,EAAUA,CAAC;cAAEC;YAAM,CAAE;cACnBA,MAAA,CAAOC,eAAe,CAAClD,2BAAA,EAA6B;gBAClDmD,SAAA,EAAW;gBACXC,SAAA,EAAWE,WAAA,CAAYb;cACzB;YACF;YACAoB,KAAA,EAAOF;UACT;QACF;QACA7C,GAAA,EAAK;QACL+C,KAAA,EAAO;MACT,IACA,KACL,CAAChD,MAAM,CAAC0C,OAAA;IACX;EACF;AACF","ignoreList":[]}
+{"version":3,"file":"index.js","names":["getTranslation","BlockIcon","InlineBlocksIcon","createClientFeature","getBlockImageComponent","getBlockMarkdownTransformers","BlockNode","InlineBlockNode","INSERT_BLOCK_COMMAND","INSERT_INLINE_BLOCK_COMMAND","BlocksPlugin","BlocksFeatureClient","config","featureClientSchemaMap","props","schemaPath","schemaMapRenderedBlockPathPrefix","schemaMapRenderedInlineBlockPathPrefix","clientSchema","blocksFields","Object","entries","filter","key","startsWith","replace","includes","map","value","inlineBlocksFields","clientBlocks","field","blockReferences","blocksMap","blocks","block","undefined","clientInlineBlocks","markdownTransformers","inlineBlocks","nodes","plugins","Component","position","sanitizedClientFeatureProps","slashMenu","groups","length","items","Icon","slug","keywords","label","i18n","blockDisplayName","labels","singular","onSelect","editor","dispatchCommand","blockName","blockType","t","inlineBlock","Boolean","toolbarFixed","type","ChildComponent","index","isActive","order"],"sources":["../../../../src/features/blocks/client/index.tsx"],"sourcesContent":["'use client'\n\nimport type { I18nClient } from '@payloadcms/translations'\nimport type { BlocksFieldClient, ClientBlock } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type {\n  SlashMenuGroup,\n  SlashMenuItem,\n} from '../../../lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/types.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../toolbars/types.js'\n\nimport { BlockIcon } from '../../../lexical/ui/icons/Block/index.js'\nimport { InlineBlocksIcon } from '../../../lexical/ui/icons/InlineBlocks/index.js'\nimport { createClientFeature } from '../../../utilities/createClientFeature.js'\nimport { getBlockImageComponent } from './getBlockImageComponent.js'\nimport { getBlockMarkdownTransformers } from './markdown/markdownTransformer.js'\nimport { BlockNode } from './nodes/BlocksNode.js'\nimport { InlineBlockNode } from './nodes/InlineBlocksNode.js'\nimport { INSERT_BLOCK_COMMAND, INSERT_INLINE_BLOCK_COMMAND } from './plugin/commands.js'\nimport { BlocksPlugin } from './plugin/index.js'\nexport const BlocksFeatureClient = createClientFeature(\n  ({ config, featureClientSchemaMap, props, schemaPath }) => {\n    const schemaMapRenderedBlockPathPrefix = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks`\n    const schemaMapRenderedInlineBlockPathPrefix = `${schemaPath}.lexical_internal_feature.blocks.lexical_inline_blocks`\n    const clientSchema = featureClientSchemaMap['blocks']\n\n    if (!clientSchema) {\n      return {}\n    }\n\n    const blocksFields: BlocksFieldClient[] = Object.entries(clientSchema)\n      .filter(\n        ([key]) =>\n          key.startsWith(schemaMapRenderedBlockPathPrefix + '.') &&\n          !key.replace(schemaMapRenderedBlockPathPrefix + '.', '').includes('.'),\n      )\n      .map(([, value]) => value[0] as BlocksFieldClient)\n\n    const inlineBlocksFields: BlocksFieldClient[] = Object.entries(clientSchema)\n      .filter(\n        ([key]) =>\n          key.startsWith(schemaMapRenderedInlineBlockPathPrefix + '.') &&\n          !key.replace(schemaMapRenderedInlineBlockPathPrefix + '.', '').includes('.'),\n      )\n      .map(([, value]) => value[0] as BlocksFieldClient)\n\n    const clientBlocks: ClientBlock[] = blocksFields\n      .map((field) => {\n        return field.blockReferences\n          ? typeof field.blockReferences[0] === 'string'\n            ? config.blocksMap[field.blockReferences[0]]\n            : field.blockReferences[0]\n          : field.blocks[0]\n      })\n      .filter((block) => block !== undefined)\n\n    const clientInlineBlocks: ClientBlock[] = inlineBlocksFields\n      .map((field) => {\n        return field.blockReferences\n          ? typeof field.blockReferences[0] === 'string'\n            ? config.blocksMap[field.blockReferences[0]]\n            : field.blockReferences[0]\n          : field.blocks[0]\n      })\n      .filter((block) => block !== undefined)\n\n    return {\n      markdownTransformers: getBlockMarkdownTransformers({\n        blocks: clientBlocks,\n        inlineBlocks: clientInlineBlocks,\n      }),\n      nodes: [BlockNode, InlineBlockNode],\n      plugins: [\n        {\n          Component: BlocksPlugin,\n          position: 'normal',\n        },\n      ],\n      sanitizedClientFeatureProps: props,\n      slashMenu: {\n        groups: [\n          clientBlocks?.length\n            ? {\n                items: clientBlocks.map((block) => {\n                  return {\n                    Icon: getBlockImageComponent(block, BlockIcon),\n                    key: 'block-' + block.slug,\n                    keywords: ['block', 'blocks', block.slug],\n                    label: ({ i18n }) => {\n                      const blockDisplayName = block?.labels?.singular\n                        ? getTranslation(block.labels.singular, i18n)\n                        : block?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: block.slug,\n                      })\n                    },\n                  } as SlashMenuItem\n                }),\n                key: 'blocks',\n                label: ({ i18n }: { i18n: I18nClient<object, 'lexical:blocks:label'> }) => {\n                  return i18n.t('lexical:blocks:label')\n                },\n              }\n            : null,\n          clientInlineBlocks?.length\n            ? {\n                items: clientInlineBlocks.map((inlineBlock) => {\n                  return {\n                    Icon: InlineBlocksIcon,\n                    key: 'inlineBlocks-' + inlineBlock.slug,\n                    keywords: ['inlineBlock', 'inline block', inlineBlock.slug],\n                    label: ({ i18n }) => {\n                      const blockDisplayName = inlineBlock?.labels?.singular\n                        ? getTranslation(inlineBlock.labels.singular, i18n)\n                        : inlineBlock?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_INLINE_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: inlineBlock.slug,\n                      })\n                    },\n                  } as SlashMenuItem\n                }),\n                key: 'inlineBlocks',\n                label: ({\n                  i18n,\n                }: {\n                  i18n: I18nClient<object, 'lexical:blocks:inlineBlocks:label'>\n                }) => {\n                  return i18n.t('lexical:blocks:inlineBlocks:label')\n                },\n              }\n            : null,\n        ].filter(Boolean) as SlashMenuGroup[],\n      },\n      toolbarFixed: {\n        groups: [\n          clientBlocks.length\n            ? {\n                type: 'dropdown',\n                ChildComponent: BlockIcon,\n                items: clientBlocks.map((block, index) => {\n                  return {\n                    isActive: undefined, // At this point, we would be inside a sub-richtext-editor. And at this point this will be run against the focused sub-editor, not the parent editor which has the actual block. Thus, no point in running this\n                    key: 'block-' + block.slug,\n                    label: ({ i18n }) => {\n                      const blockDisplayName = block?.labels?.singular\n                        ? getTranslation(block.labels.singular, i18n)\n                        : block?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: block.slug,\n                      })\n                    },\n                    order: index,\n                  } as ToolbarGroupItem\n                }),\n                key: 'blocks',\n                order: 20,\n              }\n            : null,\n          clientInlineBlocks?.length\n            ? {\n                type: 'dropdown',\n                ChildComponent: InlineBlocksIcon,\n                items: clientInlineBlocks.map((inlineBlock, index) => {\n                  return {\n                    isActive: undefined,\n                    key: 'inlineBlock-' + inlineBlock.slug,\n                    label: ({ i18n }) => {\n                      const blockDisplayName = inlineBlock?.labels?.singular\n                        ? getTranslation(inlineBlock.labels.singular, i18n)\n                        : inlineBlock?.slug\n\n                      return blockDisplayName\n                    },\n                    onSelect: ({ editor }) => {\n                      editor.dispatchCommand(INSERT_INLINE_BLOCK_COMMAND, {\n                        blockName: '',\n                        blockType: inlineBlock.slug,\n                      })\n                    },\n                    order: index,\n                  } as ToolbarGroupItem\n                }),\n                key: 'inlineBlocks',\n                order: 25,\n              }\n            : null,\n        ].filter(Boolean) as ToolbarGroup[],\n      },\n    }\n  },\n)\n"],"mappings":"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","ignoreList":[]}

package/dist/features/blocks/premade/CodeBlock/Component/Block.d.ts

@@ -1,4 +1,4 @@
-import './index.scss';
+import './index.css';
 import React from 'react';
 import type { AdditionalCodeComponentProps } from './Code.js';
 export declare const CodeBlockBlockComponent: React.FC<Pick<AdditionalCodeComponentProps, 'languages'>>;

package/dist/features/blocks/premade/CodeBlock/Component/Block.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"names":[],"mappings":"AAIA,OAAO,cAAc,CAAA;AAarB,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,WAAW,CAAA;AAS7D,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAuG7F,CAAA"}
+{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAA;AAapB,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,WAAW,CAAA;AAS7D,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,WAAW,CAAC,CAyG7F,CAAA"}

package/dist/features/blocks/premade/CodeBlock/Component/Block.js

@@ -1,6 +1,7 @@
 'use client';
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './index.css';
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { ChevronIcon, Combobox, CopyToClipboard, PopupList, RenderFields, useForm, useFormFields, useTranslation } from '@payloadcms/ui';
 import React from 'react';
@@ -100,6 +101,8 @@ export const CodeBlockBlockComponent = args => {
       className: `${baseClass}__pill`,
       children: /*#__PURE__*/_jsx(CodeBlockIcon, {})
     }),
+    showDragHandle: false,
+    showRowNumber: false,
     children: /*#__PURE__*/_jsx(RenderFields, {
       fields: formSchema,
       forceRender: true,

package/dist/features/blocks/premade/CodeBlock/Component/Block.js.map

@@ -1 +1 @@
-{"version":3,"file":"Block.js","names":["useLexicalEditable","ChevronIcon","Combobox","CopyToClipboard","PopupList","RenderFields","useForm","useFormFields","useTranslation","React","CodeBlockIcon","useBlockComponentContext","Collapse","defaultLanguages","FloatingCollapse","baseClass","CodeBlockBlockComponent","args","languages","languagesFromProps","BlockCollapsible","formSchema","RemoveButton","setModified","t","codeField","fields","code","selectedLanguageField","setSelectedLanguage","dispatch","language","type","path","value","selectedLanguageLabel","isEditable","languageEntries","useMemo","Object","entries","map","languageCode","languageLabel","name","Component","_jsx","Button","active","disabled","onClick","className","Actions","_jsxs","button","buttonType","horizontalAlign","minEntriesForSearch","searchPlaceholder","showScrollbar","size","collapsibleProps","AfterCollapsible","disableHeaderToggle","disableToggleIndicator","Pill","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","readOnly"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"sourcesContent":["'use client'\nimport type { ComboboxEntry } from '@payloadcms/ui'\nimport type {} from 'payload'\n\nimport './index.scss'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  ChevronIcon,\n  Combobox,\n  CopyToClipboard,\n  PopupList,\n  RenderFields,\n  useForm,\n  useFormFields,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport type { AdditionalCodeComponentProps } from './Code.js'\n\nimport { CodeBlockIcon } from '../../../../../lexical/ui/icons/CodeBlock/index.js'\nimport { useBlockComponentContext } from '../../../client/component/BlockContent.js'\nimport { Collapse } from './Collapse/index.js'\nimport { defaultLanguages } from './defaultLanguages.js'\nimport { FloatingCollapse } from './FloatingCollapse/index.js'\n\nconst baseClass = 'payload-richtext-code-block'\nexport const CodeBlockBlockComponent: React.FC<Pick<AdditionalCodeComponentProps, 'languages'>> = (\n  args,\n) => {\n  const { languages: languagesFromProps } = args\n  const languages = languagesFromProps || defaultLanguages\n\n  const { BlockCollapsible, formSchema, RemoveButton } = useBlockComponentContext()\n  const { setModified } = useForm()\n  const { t } = useTranslation()\n\n  const { codeField } = useFormFields(([fields]) => ({\n    codeField: fields?.code,\n  }))\n\n  const { selectedLanguageField, setSelectedLanguage } = useFormFields(([fields, dispatch]) => ({\n    selectedLanguageField: fields?.language,\n    setSelectedLanguage: (language: string) => {\n      dispatch({\n        type: 'UPDATE',\n        path: 'language',\n        value: language,\n      })\n      setModified(true)\n    },\n  }))\n\n  const selectedLanguageLabel = languages[selectedLanguageField?.value as keyof typeof languages]\n\n  const isEditable = useLexicalEditable()\n\n  const languageEntries = React.useMemo<ComboboxEntry[]>(() => {\n    return Object.entries(languages).map(([languageCode, languageLabel]) => ({\n      name: `${languageCode} ${languageLabel}`,\n      Component: (\n        <PopupList.Button\n          active={false}\n          disabled={false}\n          onClick={() => {\n            setSelectedLanguage(languageCode)\n          }}\n        >\n          <span className={`${baseClass}__language-code`} data-language={languageCode}>\n            {languageLabel}\n          </span>\n        </PopupList.Button>\n      ),\n    }))\n  }, [languages, setSelectedLanguage])\n\n  return (\n    <BlockCollapsible\n      Actions={\n        <div className={`${baseClass}__actions`}>\n          <Combobox\n            button={\n              <div\n                className={`${baseClass}__language-selector-button`}\n                data-selected-language={selectedLanguageField?.value}\n              >\n                <span>{selectedLanguageLabel}</span>\n                <ChevronIcon className={`${baseClass}__chevron`} />\n              </div>\n            }\n            buttonType=\"custom\"\n            className={`${baseClass}__language-selector`}\n            disabled={!isEditable}\n            entries={languageEntries}\n            horizontalAlign=\"right\"\n            minEntriesForSearch={8}\n            searchPlaceholder={t('fields:searchForLanguage')}\n            showScrollbar\n            size=\"large\"\n          />\n          <CopyToClipboard value={(codeField?.value as string) ?? ''} />\n\n          <Collapse />\n\n          {isEditable && <RemoveButton />}\n        </div>\n      }\n      className={baseClass}\n      collapsibleProps={{\n        AfterCollapsible: <FloatingCollapse />,\n        disableHeaderToggle: true,\n        disableToggleIndicator: true,\n      }}\n      Pill={\n        <div className={`${baseClass}__pill`}>\n          <CodeBlockIcon />\n        </div>\n      }\n    >\n      <RenderFields\n        fields={formSchema}\n        forceRender={true}\n        parentIndexPath=\"\"\n        parentPath={''}\n        parentSchemaPath=\"\"\n        permissions={true}\n        readOnly={!isEditable}\n      />\n    </BlockCollapsible>\n  )\n}\n"],"mappings":"AAAA;;;AAMA,SAASA,kBAAkB,QAAQ;AACnC,SACEC,WAAW,EACXC,QAAQ,EACRC,eAAe,EACfC,SAAS,EACTC,YAAY,EACZC,OAAO,EACPC,aAAa,EACbC,cAAc,QACT;AACP,OAAOC,KAAA,MAAW;AAIlB,SAASC,aAAa,QAAQ;AAC9B,SAASC,wBAAwB,QAAQ;AACzC,SAASC,QAAQ,QAAQ;AACzB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,gBAAgB,QAAQ;AAEjC,MAAMC,SAAA,GAAY;AAClB,OAAO,MAAMC,uBAAA,GACXC,IAAA;EAEA,MAAM;IAAEC,SAAA,EAAWC;EAAkB,CAAE,GAAGF,IAAA;EAC1C,MAAMC,SAAA,GAAYC,kBAAA,IAAsBN,gBAAA;EAExC,MAAM;IAAEO,gBAAgB;IAAEC,UAAU;IAAEC;EAAY,CAAE,GAAGX,wBAAA;EACvD,MAAM;IAAEY;EAAW,CAAE,GAAGjB,OAAA;EACxB,MAAM;IAAEkB;EAAC,CAAE,GAAGhB,cAAA;EAEd,MAAM;IAAEiB;EAAS,CAAE,GAAGlB,aAAA,CAAc,CAAC,CAACmB,MAAA,CAAO,MAAM;IACjDD,SAAA,EAAWC,MAAA,EAAQC;EACrB;EAEA,MAAM;IAAEC,qBAAqB;IAAEC;EAAmB,CAAE,GAAGtB,aAAA,CAAc,CAAC,CAACmB,QAAA,EAAQI,QAAA,CAAS,MAAM;IAC5FF,qBAAA,EAAuBF,QAAA,EAAQK,QAAA;IAC/BF,mBAAA,EAAsBE,QAAA;MACpBD,QAAA,CAAS;QACPE,IAAA,EAAM;QACNC,IAAA,EAAM;QACNC,KAAA,EAAOH;MACT;MACAR,WAAA,CAAY;IACd;EACF;EAEA,MAAMY,qBAAA,GAAwBjB,SAAS,CAACU,qBAAA,EAAuBM,KAAA,CAAgC;EAE/F,MAAME,UAAA,GAAapC,kBAAA;EAEnB,MAAMqC,eAAA,GAAkB5B,KAAA,CAAM6B,OAAO,CAAkB;IACrD,OAAOC,MAAA,CAAOC,OAAO,CAACtB,SAAA,EAAWuB,GAAG,CAAC,CAAC,CAACC,YAAA,EAAcC,aAAA,CAAc,MAAM;MACvEC,IAAA,EAAM,GAAGF,YAAA,IAAgBC,aAAA,EAAe;MACxCE,SAAA,eACEC,IAAA,CAAC1C,SAAA,CAAU2C,MAAM;QACfC,MAAA,EAAQ;QACRC,QAAA,EAAU;QACVC,OAAA,EAASA,CAAA;UACPrB,mBAAA,CAAoBa,YAAA;QACtB;kBAEA,aAAAI,IAAA,CAAC;UAAKK,SAAA,EAAW,GAAGpC,SAAA,iBAA0B;UAAE,iBAAe2B,YAAA;oBAC5DC;;;IAIT;EACF,GAAG,CAACzB,SAAA,EAAWW,mBAAA,CAAoB;EAEnC,oBACEiB,IAAA,CAAC1B,gBAAA;IACCgC,OAAA,eACEC,KAAA,CAAC;MAAIF,SAAA,EAAW,GAAGpC,SAAA,WAAoB;8BACrC+B,IAAA,CAAC5C,QAAA;QACCoD,MAAA,eACED,KAAA,CAAC;UACCF,SAAA,EAAW,GAAGpC,SAAA,4BAAqC;UACnD,0BAAwBa,qBAAA,EAAuBM,KAAA;kCAE/CY,IAAA,CAAC;sBAAMX;2BACPW,IAAA,CAAC7C,WAAA;YAAYkD,SAAA,EAAW,GAAGpC,SAAA;;;QAG/BwC,UAAA,EAAW;QACXJ,SAAA,EAAW,GAAGpC,SAAA,qBAA8B;QAC5CkC,QAAA,EAAU,CAACb,UAAA;QACXI,OAAA,EAASH,eAAA;QACTmB,eAAA,EAAgB;QAChBC,mBAAA,EAAqB;QACrBC,iBAAA,EAAmBlC,CAAA,CAAE;QACrBmC,aAAa;QACbC,IAAA,EAAK;uBAEPd,IAAA,CAAC3C,eAAA;QAAgB+B,KAAA,EAAOT,SAAC,EAAWS,KAAA,IAAoB;uBAExDY,IAAA,CAAClC,QAAA,OAEAwB,UAAA,iBAAcU,IAAA,CAACxB,YAAA;;IAGpB6B,SAAA,EAAWpC,SAAA;IACX8C,gBAAA,EAAkB;MAChBC,gBAAA,eAAkBhB,IAAA,CAAChC,gBAAA;MACnBiD,mBAAA,EAAqB;MACrBC,sBAAA,EAAwB;IAC1B;IACAC,IAAA,eACEnB,IAAA,CAAC;MAAIK,SAAA,EAAW,GAAGpC,SAAA,QAAiB;gBAClC,aAAA+B,IAAA,CAACpC,aAAA;;cAIL,aAAAoC,IAAA,CAACzC,YAAA;MACCqB,MAAA,EAAQL,UAAA;MACR6C,WAAA,EAAa;MACbC,eAAA,EAAgB;MAChBC,UAAA,EAAY;MACZC,gBAAA,EAAiB;MACjBC,WAAA,EAAa;MACbC,QAAA,EAAU,CAACnC;;;AAInB","ignoreList":[]}
+{"version":3,"file":"Block.js","names":["useLexicalEditable","ChevronIcon","Combobox","CopyToClipboard","PopupList","RenderFields","useForm","useFormFields","useTranslation","React","CodeBlockIcon","useBlockComponentContext","Collapse","defaultLanguages","FloatingCollapse","baseClass","CodeBlockBlockComponent","args","languages","languagesFromProps","BlockCollapsible","formSchema","RemoveButton","setModified","t","codeField","fields","code","selectedLanguageField","setSelectedLanguage","dispatch","language","type","path","value","selectedLanguageLabel","isEditable","languageEntries","useMemo","Object","entries","map","languageCode","languageLabel","name","Component","_jsx","Button","active","disabled","onClick","className","Actions","_jsxs","button","buttonType","horizontalAlign","minEntriesForSearch","searchPlaceholder","showScrollbar","size","collapsibleProps","AfterCollapsible","disableHeaderToggle","disableToggleIndicator","Pill","showDragHandle","showRowNumber","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","readOnly"],"sources":["../../../../../../src/features/blocks/premade/CodeBlock/Component/Block.tsx"],"sourcesContent":["'use client'\nimport type { ComboboxEntry } from '@payloadcms/ui'\nimport type {} from 'payload'\n\nimport './index.css'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  ChevronIcon,\n  Combobox,\n  CopyToClipboard,\n  PopupList,\n  RenderFields,\n  useForm,\n  useFormFields,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport type { AdditionalCodeComponentProps } from './Code.js'\n\nimport { CodeBlockIcon } from '../../../../../lexical/ui/icons/CodeBlock/index.js'\nimport { useBlockComponentContext } from '../../../client/component/BlockContent.js'\nimport { Collapse } from './Collapse/index.js'\nimport { defaultLanguages } from './defaultLanguages.js'\nimport { FloatingCollapse } from './FloatingCollapse/index.js'\n\nconst baseClass = 'payload-richtext-code-block'\nexport const CodeBlockBlockComponent: React.FC<Pick<AdditionalCodeComponentProps, 'languages'>> = (\n  args,\n) => {\n  const { languages: languagesFromProps } = args\n  const languages = languagesFromProps || defaultLanguages\n\n  const { BlockCollapsible, formSchema, RemoveButton } = useBlockComponentContext()\n  const { setModified } = useForm()\n  const { t } = useTranslation()\n\n  const { codeField } = useFormFields(([fields]) => ({\n    codeField: fields?.code,\n  }))\n\n  const { selectedLanguageField, setSelectedLanguage } = useFormFields(([fields, dispatch]) => ({\n    selectedLanguageField: fields?.language,\n    setSelectedLanguage: (language: string) => {\n      dispatch({\n        type: 'UPDATE',\n        path: 'language',\n        value: language,\n      })\n      setModified(true)\n    },\n  }))\n\n  const selectedLanguageLabel = languages[selectedLanguageField?.value as keyof typeof languages]\n\n  const isEditable = useLexicalEditable()\n\n  const languageEntries = React.useMemo<ComboboxEntry[]>(() => {\n    return Object.entries(languages).map(([languageCode, languageLabel]) => ({\n      name: `${languageCode} ${languageLabel}`,\n      Component: (\n        <PopupList.Button\n          active={false}\n          disabled={false}\n          onClick={() => {\n            setSelectedLanguage(languageCode)\n          }}\n        >\n          <span className={`${baseClass}__language-code`} data-language={languageCode}>\n            {languageLabel}\n          </span>\n        </PopupList.Button>\n      ),\n    }))\n  }, [languages, setSelectedLanguage])\n\n  return (\n    <BlockCollapsible\n      Actions={\n        <div className={`${baseClass}__actions`}>\n          <Combobox\n            button={\n              <div\n                className={`${baseClass}__language-selector-button`}\n                data-selected-language={selectedLanguageField?.value}\n              >\n                <span>{selectedLanguageLabel}</span>\n                <ChevronIcon className={`${baseClass}__chevron`} />\n              </div>\n            }\n            buttonType=\"custom\"\n            className={`${baseClass}__language-selector`}\n            disabled={!isEditable}\n            entries={languageEntries}\n            horizontalAlign=\"right\"\n            minEntriesForSearch={8}\n            searchPlaceholder={t('fields:searchForLanguage')}\n            showScrollbar\n            size=\"large\"\n          />\n          <CopyToClipboard value={(codeField?.value as string) ?? ''} />\n\n          <Collapse />\n\n          {isEditable && <RemoveButton />}\n        </div>\n      }\n      className={baseClass}\n      collapsibleProps={{\n        AfterCollapsible: <FloatingCollapse />,\n        disableHeaderToggle: true,\n        disableToggleIndicator: true,\n      }}\n      Pill={\n        <div className={`${baseClass}__pill`}>\n          <CodeBlockIcon />\n        </div>\n      }\n      showDragHandle={false}\n      showRowNumber={false}\n    >\n      <RenderFields\n        fields={formSchema}\n        forceRender={true}\n        parentIndexPath=\"\"\n        parentPath={''}\n        parentSchemaPath=\"\"\n        permissions={true}\n        readOnly={!isEditable}\n      />\n    </BlockCollapsible>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/blocks/premade/CodeBlock/Component/Collapse/index.css

@@ -0,0 +1,26 @@
+.code-block-collapse-button {
+  all: unset;
+  cursor: pointer;
+  min-width: var(--spacer-4);
+  min-height: var(--spacer-4);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--radius-medium);
+  color: var(--color-icon-secondary);
+  box-sizing: border-box;
+
+  &:hover {
+    color: var(--color-icon);
+    background-color: var(--color-bg-transparent-hover);
+  }
+
+  &:active {
+    background-color: var(--color-bg-transparent-pressed);
+  }
+
+  &:focus-visible {
+    outline: 1px solid var(--color-border-brand-strong);
+    outline-offset: calc(var(--stroke-width-small) / -1);
+  }
+}

package/dist/features/blocks/premade/CodeBlock/Component/Collapse/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import './index.scss';
+import './index.css';
 export declare const Collapse: React.FC;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/blocks/premade/CodeBlock/Component/Collapse/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/Collapse/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAOrB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAO5B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/Collapse/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,aAAa,CAAA;AAQpB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAO5B,CAAA"}

package/dist/features/blocks/premade/CodeBlock/Component/Collapse/index.js

@@ -1,17 +1,20 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
+import './index.css';
 const baseClass = 'code-block-collapse-button';
 import { useCollapsible } from '@payloadcms/ui';
 import { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js';
+import { ExpandIcon } from '../../../../../../lexical/ui/icons/Expand/index.js';
 export const Collapse = () => {
   const {
+    isCollapsed,
     toggle
   } = useCollapsible();
   return /*#__PURE__*/_jsx("button", {
     className: baseClass,
     onClick: toggle,
     type: "button",
-    children: /*#__PURE__*/_jsx(CollapseIcon, {})
+    children: isCollapsed ? /*#__PURE__*/_jsx(ExpandIcon, {}) : /*#__PURE__*/_jsx(CollapseIcon, {})
   });
 };
 //# sourceMappingURL=index.js.map

package/dist/features/blocks/premade/CodeBlock/Component/Collapse/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","baseClass","useCollapsible","CollapseIcon","Collapse","toggle","_jsx","className","onClick","type"],"sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/Collapse/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'code-block-collapse-button'\nimport { useCollapsible } from '@payloadcms/ui'\n\nimport { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js'\n\nexport const Collapse: React.FC = () => {\n  const { toggle } = useCollapsible()\n  return (\n    <button className={baseClass} onClick={toggle} type=\"button\">\n      <CollapseIcon />\n    </button>\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAIlB,MAAMC,SAAA,GAAY;AAClB,SAASC,cAAc,QAAQ;AAE/B,SAASC,YAAY,QAAQ;AAE7B,OAAO,MAAMC,QAAA,GAAqBA,CAAA;EAChC,MAAM;IAAEC;EAAM,CAAE,GAAGH,cAAA;EACnB,oBACEI,IAAA,CAAC;IAAOC,SAAA,EAAWN,SAAA;IAAWO,OAAA,EAASH,MAAA;IAAQI,IAAA,EAAK;cAClD,aAAAH,IAAA,CAACH,YAAA;;AAGP","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","baseClass","useCollapsible","CollapseIcon","ExpandIcon","Collapse","isCollapsed","toggle","_jsx","className","onClick","type"],"sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/Collapse/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport './index.css'\n\nconst baseClass = 'code-block-collapse-button'\nimport { useCollapsible } from '@payloadcms/ui'\n\nimport { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js'\nimport { ExpandIcon } from '../../../../../../lexical/ui/icons/Expand/index.js'\n\nexport const Collapse: React.FC = () => {\n  const { isCollapsed, toggle } = useCollapsible()\n  return (\n    <button className={baseClass} onClick={toggle} type=\"button\">\n      {isCollapsed ? <ExpandIcon /> : <CollapseIcon />}\n    </button>\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAClB,SAASC,cAAc,QAAQ;AAE/B,SAASC,YAAY,QAAQ;AAC7B,SAASC,UAAU,QAAQ;AAE3B,OAAO,MAAMC,QAAA,GAAqBA,CAAA;EAChC,MAAM;IAAEC,WAAW;IAAEC;EAAM,CAAE,GAAGL,cAAA;EAChC,oBACEM,IAAA,CAAC;IAAOC,SAAA,EAAWR,SAAA;IAAWS,OAAA,EAASH,MAAA;IAAQI,IAAA,EAAK;cACjDL,WAAA,gBAAcE,IAAA,CAACJ,UAAA,qBAAgBI,IAAA,CAACL,YAAA;;AAGvC","ignoreList":[]}

package/dist/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.css

@@ -0,0 +1,40 @@
+.code-block-floating-collapse-button {
+  all: unset;
+  cursor: pointer;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  height: var(--spacer-4);
+  bottom: calc(var(--spacer-2-5) * -1);
+  padding: var(--spacer-1) var(--spacer-2) var(--spacer-1) var(--spacer-1);
+  border-radius: var(--radius-medium);
+
+  background: var(--color-bg);
+  color: var(--color-text);
+  font-size: var(--text-body-medium-font-size);
+  line-height: var(--text-body-medium-line-height);
+  white-space: nowrap;
+
+  box-shadow:
+    0px 0px 0.5px 0px rgba(0, 0, 0, 0.18),
+    0px 1px 3px 0px rgba(0, 0, 0, 0.1);
+
+  &:hover {
+    background: var(--color-bg-secondary-hover);
+    color: var(--color-text);
+  }
+
+  &:active {
+    background: var(--color-bg-secondary-pressed);
+  }
+
+  &:focus-visible {
+    outline: var(--stroke-width-small) solid var(--color-border-brand-strong);
+    outline-offset: calc(var(--stroke-width-small) / -1);
+  }
+}

package/dist/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import './index.scss';
+import './index.css';
 export declare const FloatingCollapse: React.FC;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAOrB,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAcpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAUpC,CAAA"}

package/dist/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-const baseClass = 'code-block-floating-collapse-button';
 import { useCollapsible, useTranslation } from '@payloadcms/ui';
+import React from 'react';
 import { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js';
+import { ExpandIcon } from '../../../../../../lexical/ui/icons/Expand/index.js';
+import './index.css';
+const baseClass = 'code-block-floating-collapse-button';
 export const FloatingCollapse = () => {
   const {
     isCollapsed,
@@ -11,16 +13,13 @@ export const FloatingCollapse = () => {
   const {
     t
   } = useTranslation();
-  if (!isCollapsed) {
-    return null;
-  }
   return /*#__PURE__*/_jsxs("button", {
     className: baseClass,
     onClick: toggle,
     type: "button",
-    children: [/*#__PURE__*/_jsx("span", {
-      children: t('general:collapse')
-    }), /*#__PURE__*/_jsx(CollapseIcon, {})]
+    children: [isCollapsed ? /*#__PURE__*/_jsx(ExpandIcon, {}) : /*#__PURE__*/_jsx(CollapseIcon, {}), /*#__PURE__*/_jsx("span", {
+      children: isCollapsed ? t('general:expand') : t('general:collapse')
+    })]
   });
 };
 //# sourceMappingURL=index.js.map

package/dist/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","baseClass","useCollapsible","useTranslation","CollapseIcon","FloatingCollapse","isCollapsed","toggle","t","_jsxs","className","onClick","type","_jsx"],"sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'code-block-floating-collapse-button'\nimport { useCollapsible, useTranslation } from '@payloadcms/ui'\n\nimport { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js'\n\nexport const FloatingCollapse: React.FC = () => {\n  const { isCollapsed, toggle } = useCollapsible()\n  const { t } = useTranslation()\n\n  if (!isCollapsed) {\n    return null\n  }\n\n  return (\n    <button className={baseClass} onClick={toggle} type=\"button\">\n      <span>{t('general:collapse')}</span>\n      <CollapseIcon />\n    </button>\n  )\n}\n"],"mappings":";AAAA,OAAOA,KAAA,MAAW;AAIlB,MAAMC,SAAA,GAAY;AAClB,SAASC,cAAc,EAAEC,cAAc,QAAQ;AAE/C,SAASC,YAAY,QAAQ;AAE7B,OAAO,MAAMC,gBAAA,GAA6BA,CAAA;EACxC,MAAM;IAAEC,WAAW;IAAEC;EAAM,CAAE,GAAGL,cAAA;EAChC,MAAM;IAAEM;EAAC,CAAE,GAAGL,cAAA;EAEd,IAAI,CAACG,WAAA,EAAa;IAChB,OAAO;EACT;EAEA,oBACEG,KAAA,CAAC;IAAOC,SAAA,EAAWT,SAAA;IAAWU,OAAA,EAASJ,MAAA;IAAQK,IAAA,EAAK;4BAClDC,IAAA,CAAC;gBAAML,CAAA,CAAE;qBACTK,IAAA,CAACT,YAAA;;AAGP","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useCollapsible","useTranslation","React","CollapseIcon","ExpandIcon","baseClass","FloatingCollapse","isCollapsed","toggle","t","_jsxs","className","onClick","type","_jsx"],"sources":["../../../../../../../src/features/blocks/premade/CodeBlock/Component/FloatingCollapse/index.tsx"],"sourcesContent":["import { useCollapsible, useTranslation } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { CollapseIcon } from '../../../../../../lexical/ui/icons/Collapse/index.js'\nimport { ExpandIcon } from '../../../../../../lexical/ui/icons/Expand/index.js'\nimport './index.css'\n\nconst baseClass = 'code-block-floating-collapse-button'\n\nexport const FloatingCollapse: React.FC = () => {\n  const { isCollapsed, toggle } = useCollapsible()\n  const { t } = useTranslation()\n\n  return (\n    <button className={baseClass} onClick={toggle} type=\"button\">\n      {isCollapsed ? <ExpandIcon /> : <CollapseIcon />}\n      <span>{isCollapsed ? t('general:expand') : t('general:collapse')}</span>\n    </button>\n  )\n}\n"],"mappings":";AAAA,SAASA,cAAc,EAAEC,cAAc,QAAQ;AAC/C,OAAOC,KAAA,MAAW;AAElB,SAASC,YAAY,QAAQ;AAC7B,SAASC,UAAU,QAAQ;AAC3B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,gBAAA,GAA6BA,CAAA;EACxC,MAAM;IAAEC,WAAW;IAAEC;EAAM,CAAE,GAAGR,cAAA;EAChC,MAAM;IAAES;EAAC,CAAE,GAAGR,cAAA;EAEd,oBACES,KAAA,CAAC;IAAOC,SAAA,EAAWN,SAAA;IAAWO,OAAA,EAASJ,MAAA;IAAQK,IAAA,EAAK;eACjDN,WAAA,gBAAcO,IAAA,CAACV,UAAA,qBAAgBU,IAAA,CAACX,YAAA,O,aACjCW,IAAA,CAAC;gBAAMP,WAAA,GAAcE,CAAA,CAAE,oBAAoBA,CAAA,CAAE;;;AAGnD","ignoreList":[]}

package/dist/features/blocks/premade/CodeBlock/Component/index.css

@@ -0,0 +1,171 @@
+@layer payload-default {
+  .payload-richtext-code-block.collapsible--collapsed {
+    .rah-static {
+      height: unset !important;
+      max-height: 150px !important;
+      position: relative;
+      border-radius: var(--radius-medium);
+
+      &::after {
+        content: '';
+        pointer-events: none;
+        background: linear-gradient(
+          to bottom,
+          rgb(0 0 0 / 0%) 0%,
+          var(--color-bg) 90%,
+          var(--color-bg) 100%
+        );
+        position: absolute;
+        height: 100px;
+        top: 50px;
+        left: 0;
+        right: 0;
+      }
+
+      > div {
+        display: unset !important;
+      }
+    }
+  }
+
+  .payload-richtext-code-block {
+    .collapsible__toggle-wrap {
+      background: var(--color-bg);
+      border: none;
+      border-radius: var(--radius-medium);
+      height: auto;
+      padding: var(--spacer-1) var(--spacer-2-5);
+      overflow: visible;
+
+      &:not(.toggle-disabled):hover {
+        background: var(--color-bg);
+      }
+    }
+
+    .collapsible__header-wrap {
+      overflow: visible;
+      padding: 0;
+    }
+
+    .popup__caret {
+      display: none;
+    }
+
+    .collapsible__content {
+      padding: 0;
+      border: none;
+    }
+
+    .LexicalEditorTheme__block__block-header {
+      overflow: visible;
+    }
+
+    .code-editor,
+    .monaco-editor,
+    .overflow-guard {
+      border-width: 0;
+      border-radius: 0 0 var(--radius-medium) var(--radius-medium);
+      background: var(--color-bg);
+    }
+
+    .popup-button {
+      padding: 0 0 0 var(--spacer-1);
+    }
+
+    .copy-to-clipboard,
+    .code-block-collapse-button,
+    .popup-button,
+    .LexicalEditorTheme__block__removeButton.btn {
+      border-radius: var(--radius-medium);
+      color: var(--color-icon-secondary);
+      min-width: var(--spacer-4);
+      min-height: var(--spacer-4);
+      padding: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      &:hover {
+        color: var(--color-icon);
+        background-color: var(--color-bg-transparent-hover);
+      }
+
+      &:active {
+        background-color: var(--color-bg-transparent-pressed);
+      }
+
+      &:focus-visible {
+        outline: var(--stroke-width-small) solid var(--color-border-brand-strong);
+        outline-offset: calc(var(--stroke-width-small) / -1);
+      }
+    }
+  }
+
+  .payload-richtext-code-block__pill {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: var(--spacer-4);
+    color: var(--color-icon-tertiary);
+  }
+
+  .payload-richtext-code-block__actions {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--spacer-2);
+  }
+
+  .payload-richtext-code-block__language-selector {
+    pointer-events: all;
+  }
+
+  .payload-richtext-code-block__language-selector-button {
+    display: flex;
+    flex-direction: row;
+    width: max-content;
+    align-items: center;
+    color: var(--color-text-secondary);
+    font-size: var(--text-body-medium-font-size);
+    line-height: var(--text-body-medium-line-height);
+    padding-left: var(--spacer-1);
+
+    & path {
+      fill-opacity: 1;
+    }
+
+    &:hover {
+      color: var(--color-text);
+
+      & path {
+        fill: var(--color-text);
+      }
+    }
+  }
+
+  .payload-richtext-code-block__chevron {
+    color: var(--color-icon-secondary);
+    width: var(--spacer-3);
+    height: var(--spacer-4);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+  }
+}
+
+/* Override the collapsible container to use a simple border wrapper */
+.payload-richtext-code-block {
+  border: var(--stroke-width-small) solid var(--color-border);
+  border-radius: var(--radius-medium);
+
+  &:focus-within {
+    outline: var(--stroke-width-small) solid var(--color-border-brand-strong);
+    outline-offset: calc(var(--stroke-width-small) / -1);
+  }
+}
+
+/* Add left padding to Monaco line numbers area */
+.payload-richtext-code-block .monaco-editor .margin {
+  padding-left: var(--spacer-2);
+}

package/dist/features/debug/jsxConverter/client/plugin/index.d.ts

@@ -1,3 +1,3 @@
-import './style.scss';
+import './style.css';
 export declare function RichTextPlugin(): import("react").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/debug/jsxConverter/client/plugin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/debug/jsxConverter/client/plugin/index.tsx"],"names":[],"mappings":"AAOA,OAAO,cAAc,CAAA;AAErB,wBAAgB,cAAc,gCAe7B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/debug/jsxConverter/client/plugin/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAA;AAEpB,wBAAgB,cAAc,gCAe7B"}

package/dist/features/debug/jsxConverter/client/plugin/index.js

@@ -6,6 +6,7 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import { useEffect, useState } from 'react';
 // eslint-disable-next-line payload/no-imports-from-exports-dir
 import { defaultJSXConverters, RichText } from '../../../../../exports/react/index.js';
+import './style.css';
 export function RichTextPlugin() {
   const $ = _c(7);
   const [editor] = useLexicalComposerContext();

package/dist/features/debug/jsxConverter/client/plugin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useEffect","useState","defaultJSXConverters","RichText","RichTextPlugin","$","editor","t0","getEditorState","toJSON","editorState","setEditorState","t1","t2","registerUpdateListener","t3","editorState_0","_jsx","className","children","converters","data"],"sources":["../../../../../../src/features/debug/jsxConverter/client/plugin/index.tsx"],"sourcesContent":["'use client'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useEffect, useState } from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir\nimport { defaultJSXConverters, RichText } from '../../../../../exports/react/index.js'\nimport './style.scss'\n\nexport function RichTextPlugin() {\n  const [editor] = useLexicalComposerContext()\n  const [editorState, setEditorState] = useState(() => editor.getEditorState().toJSON())\n\n  useEffect(() => {\n    return editor.registerUpdateListener(({ editorState }) => {\n      setEditorState(editorState.toJSON())\n    })\n  }, [editor])\n\n  return (\n    <div className=\"debug-jsx-converter\">\n      <RichText converters={defaultJSXConverters} data={editorState} />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,SAAS,EAAEC,QAAQ,QAAQ;AAEpC;AACA,SAASC,oBAAoB,EAAEC,QAAQ,QAAQ;AAG/C,OAAO,SAAAC,eAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EACL,OAAAQ,MAAA,IAAiBP,yBAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAF,CAAA,QAAAC,MAAA;IAC8BC,EAAA,GAAAA,CAAA,KAAMD,MAAA,CAAAE,cAAA,CAAqB,EAAAC,MAAA,CAAS;IAAAJ,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAnF,OAAAK,WAAA,EAAAC,cAAA,IAAsCV,QAAA,CAASM,EAAoC;EAAA,IAAAK,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAR,CAAA,QAAAC,MAAA;IAEzEM,EAAA,GAAAA,CAAA,KACDN,MAAA,CAAAQ,sBAAA,CAAAC,EAAA;MAA+B;QAAAL,WAAA,EAAAM;MAAA,IAAAD,EAAe;MACnDJ,cAAA,CAAeD,aAAA,CAAAD,MAAA,CAAkB;IAAA,CACnC;IACCI,EAAA,IAACP,MAAA;IAAOD,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAQ,EAAA;EAAA;IAAAD,EAAA,GAAAP,CAAA;IAAAQ,EAAA,GAAAR,CAAA;EAAA;EAJXL,SAAA,CAAUY,EAIV,EAAGC,EAAQ;EAAA,IAAAE,EAAA;EAAA,IAAAV,CAAA,QAAAK,WAAA;IAGTK,EAAA,GAAAE,IAAA,CAAC;MAAAC,SAAA,EAAc;MAAAC,QAAA,EACbF,IAAA,CAAAd,QAAA;QAAAiB,UAAA,EAAAlB,oBAAA;QAAAmB,IAAA,EAAkDX;MAAA,C;;;;;;;SADpDK,E","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useEffect","useState","defaultJSXConverters","RichText","RichTextPlugin","$","editor","t0","getEditorState","toJSON","editorState","setEditorState","t1","t2","registerUpdateListener","t3","editorState_0","_jsx","className","children","converters","data"],"sources":["../../../../../../src/features/debug/jsxConverter/client/plugin/index.tsx"],"sourcesContent":["'use client'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useEffect, useState } from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir\nimport { defaultJSXConverters, RichText } from '../../../../../exports/react/index.js'\nimport './style.css'\n\nexport function RichTextPlugin() {\n  const [editor] = useLexicalComposerContext()\n  const [editorState, setEditorState] = useState(() => editor.getEditorState().toJSON())\n\n  useEffect(() => {\n    return editor.registerUpdateListener(({ editorState }) => {\n      setEditorState(editorState.toJSON())\n    })\n  }, [editor])\n\n  return (\n    <div className=\"debug-jsx-converter\">\n      <RichText converters={defaultJSXConverters} data={editorState} />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,SAAS,EAAEC,QAAQ,QAAQ;AAEpC;AACA,SAASC,oBAAoB,EAAEC,QAAQ,QAAQ;AAC/C,OAAO;AAEP,OAAO,SAAAC,eAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EACL,OAAAQ,MAAA,IAAiBP,yBAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAF,CAAA,QAAAC,MAAA;IAC8BC,EAAA,GAAAA,CAAA,KAAMD,MAAA,CAAAE,cAAA,CAAqB,EAAAC,MAAA,CAAS;IAAAJ,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAnF,OAAAK,WAAA,EAAAC,cAAA,IAAsCV,QAAA,CAASM,EAAoC;EAAA,IAAAK,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAR,CAAA,QAAAC,MAAA;IAEzEM,EAAA,GAAAA,CAAA,KACDN,MAAA,CAAAQ,sBAAA,CAAAC,EAAA;MAA+B;QAAAL,WAAA,EAAAM;MAAA,IAAAD,EAAe;MACnDJ,cAAA,CAAeD,aAAA,CAAAD,MAAA,CAAkB;IAAA,CACnC;IACCI,EAAA,IAACP,MAAA;IAAOD,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAQ,EAAA;EAAA;IAAAD,EAAA,GAAAP,CAAA;IAAAQ,EAAA,GAAAR,CAAA;EAAA;EAJXL,SAAA,CAAUY,EAIV,EAAGC,EAAQ;EAAA,IAAAE,EAAA;EAAA,IAAAV,CAAA,QAAAK,WAAA;IAGTK,EAAA,GAAAE,IAAA,CAAC;MAAAC,SAAA,EAAc;MAAAC,QAAA,EACbF,IAAA,CAAAd,QAAA;QAAAiB,UAAA,EAAAlB,oBAAA;QAAAmB,IAAA,EAAkDX;MAAA,C;;;;;;;SADpDK,E","ignoreList":[]}

package/dist/features/debug/jsxConverter/client/plugin/style.css

@@ -0,0 +1,9 @@
+.debug-jsx-converter {
+  padding-left: var(--spacer-5);
+
+  ul,
+  ol {
+    padding-left: revert;
+    margin: revert;
+  }
+}

package/dist/features/debug/testRecorder/client/plugin/index.css

@@ -0,0 +1,51 @@
+@layer payload-default {
+  .test-recorder-output {
+    margin: var(--spacer-4) auto var(--spacer-4) auto;
+    width: 100%;
+  }
+  .test-recorder-toolbar {
+    display: flex;
+  }
+
+  .test-recorder-button {
+    position: relative;
+    display: block;
+    font-size: var(--text-body-small-font-size);
+    padding: var(--spacer-1);
+    border-radius: var(--radius-medium);
+    border: none;
+    cursor: pointer;
+    outline: none;
+    box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.4);
+    background-color: #222;
+    color: white;
+    transition: box-shadow 50ms ease-out;
+  }
+
+  .test-recorder-button:active {
+    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.4);
+  }
+
+  .test-recorder-button + .test-recorder-button {
+    margin-left: var(--spacer-1);
+  }
+
+  .test-recorder-button::after {
+    content: '';
+    position: absolute;
+    top: var(--spacer-2);
+    right: var(--spacer-2);
+    bottom: var(--spacer-2);
+    left: var(--spacer-2);
+    display: block;
+    background-size: contain;
+    filter: invert(1);
+  }
+  #test-recorder-button {
+    position: relative;
+  }
+
+  #test-recorder-button-snapshot {
+    margin-right: auto;
+  }
+}

package/dist/features/debug/testRecorder/client/plugin/index.d.ts

@@ -1,5 +1,5 @@
 import type { PluginComponent } from '../../../../typesClient.js';
-import './index.scss';
+import './index.css';
 export declare function isSelectAll(event: KeyboardEvent): boolean;
 export declare const TestRecorderPlugin: PluginComponent<undefined>;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/debug/testRecorder/client/plugin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/debug/testRecorder/client/plugin/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAGjE,OAAO,cAAc,CAAA;AA8ErB,wBAAgB,WAAW,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAEzD;AAmWD,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,SAAS,CAYzD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/debug/testRecorder/client/plugin/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAGjE,OAAO,aAAa,CAAA;AA8EpB,wBAAgB,WAAW,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAEzD;AAmWD,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,SAAS,CAYzD,CAAA"}

package/dist/features/debug/testRecorder/client/plugin/index.js

@@ -7,6 +7,7 @@ import { $createParagraphNode, $createTextNode, $getRoot, getDOMSelection } from
 import * as React from 'react';
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
 import { IS_APPLE } from '../../../../../lexical/utils/environment.js';
+import './index.css';
 const copy = text => {
   const textArea = document.createElement('textarea');
   textArea.value = text || '';