@payloadcms/richtext-lexical 3.78.0-internal-debug.f663370 → 3.78.0-internal.ab11ffa

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/features/blocks/client/plugin/index.tsx"],"sourcesContent":["'use client'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $insertNodeToNearestRoot, $wrapNodeInElement, mergeRegister } from '@lexical/utils'\nimport { formatDrawerSlug, useEditDepth } from '@payloadcms/ui'\nimport {\n  $createParagraphNode,\n  $getNodeByKey,\n  $getPreviousSelection,\n  $getSelection,\n  $insertNodes,\n  $isParagraphNode,\n  $isRangeSelection,\n  $isRootOrShadowRoot,\n  COMMAND_PRIORITY_EDITOR,\n} from 'lexical'\nimport { useEffect, useState } from 'react'\n\nimport type { PluginComponent } from '../../../typesClient.js'\nimport type { BlockFields, BlockFieldsOptionalID } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { $createBlockNode, BlockNode } from '../nodes/BlocksNode.js'\nimport { $createInlineBlockNode, $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\nimport { INSERT_BLOCK_COMMAND, INSERT_INLINE_BLOCK_COMMAND } from './commands.js'\n\nexport type InsertBlockPayload = BlockFieldsOptionalID\n\nexport const BlocksPlugin: PluginComponent = () => {\n  const [editor] = useLexicalComposerContext()\n\n  const [targetNodeKey, setTargetNodeKey] = useState<null | string>(null)\n\n  const { setCreatedInlineBlock, uuid } = useEditorConfigContext()\n  const editDepth = useEditDepth()\n\n  const drawerSlug = formatDrawerSlug({\n    slug: `lexical-inlineBlocks-create-` + uuid,\n    depth: editDepth,\n  })\n\n  const { toggleDrawer } = useLexicalDrawer(drawerSlug, true)\n\n  useEffect(() => {\n    if (!editor.hasNodes([BlockNode])) {\n      throw new Error('BlocksPlugin: BlocksNode not registered on editor')\n    }\n\n    return mergeRegister(\n      editor.registerCommand<InsertBlockPayload>(\n        INSERT_BLOCK_COMMAND,\n        (payload: InsertBlockPayload) => {\n          editor.update(() => {\n            const selection = $getSelection() || $getPreviousSelection()\n\n            if ($isRangeSelection(selection)) {\n              const blockNode = $createBlockNode(payload)\n\n              // we need to get the focus node before inserting the block node, as $insertNodeToNearestRoot can change the focus node\n              const { focus } = selection\n              const focusNode = focus.getNode()\n              // Insert blocks node BEFORE potentially removing focusNode, as $insertNodeToNearestRoot errors if the focusNode doesn't exist\n              $insertNodeToNearestRoot(blockNode)\n\n              // Delete the node it it's an empty paragraph\n              if ($isParagraphNode(focusNode) && !focusNode.__first) {\n                focusNode.remove()\n              }\n            }\n          })\n\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n      editor.registerCommand(\n        INSERT_INLINE_BLOCK_COMMAND,\n        (fields) => {\n          if (targetNodeKey) {\n            const node = $getNodeByKey(targetNodeKey)\n\n            if (!node || !$isInlineBlockNode(node)) {\n              return false\n            }\n\n            node.setFields(fields as BlockFields)\n\n            setTargetNodeKey(null)\n            return true\n          }\n\n          const inlineBlockNode = $createInlineBlockNode(fields as BlockFields)\n          setCreatedInlineBlock?.(inlineBlockNode)\n          $insertNodes([inlineBlockNode])\n          if ($isRootOrShadowRoot(inlineBlockNode.getParentOrThrow())) {\n            $wrapNodeInElement(inlineBlockNode, $createParagraphNode).selectEnd()\n          }\n\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n    )\n  }, [editor, setCreatedInlineBlock, targetNodeKey, toggleDrawer])\n\n  return null\n}\n"],"names":["useLexicalComposerContext","$insertNodeToNearestRoot","$wrapNodeInElement","mergeRegister","formatDrawerSlug","useEditDepth","$createParagraphNode","$getNodeByKey","$getPreviousSelection","$getSelection","$insertNodes","$isParagraphNode","$isRangeSelection","$isRootOrShadowRoot","COMMAND_PRIORITY_EDITOR","useEffect","useState","useEditorConfigContext","useLexicalDrawer","$createBlockNode","BlockNode","$createInlineBlockNode","$isInlineBlockNode","INSERT_BLOCK_COMMAND","INSERT_INLINE_BLOCK_COMMAND","BlocksPlugin","editor","targetNodeKey","setTargetNodeKey","setCreatedInlineBlock","uuid","editDepth","drawerSlug","slug","depth","toggleDrawer","hasNodes","Error","registerCommand","payload","update","selection","blockNode","focus","focusNode","getNode","__first","remove","fields","node","setFields","inlineBlockNode","getParentOrThrow","selectEnd"],"mappings":"AAAA;AAEA,SAASA,yBAAyB,QAAQ,2CAA0C;AACpF,SAASC,wBAAwB,EAAEC,kBAAkB,EAAEC,aAAa,QAAQ,iBAAgB;AAC5F,SAASC,gBAAgB,EAAEC,YAAY,QAAQ,iBAAgB;AAC/D,SACEC,oBAAoB,EACpBC,aAAa,EACbC,qBAAqB,EACrBC,aAAa,EACbC,YAAY,EACZC,gBAAgB,EAChBC,iBAAiB,EACjBC,mBAAmB,EACnBC,uBAAuB,QAClB,UAAS;AAChB,SAASC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAK3C,SAASC,sBAAsB,QAAQ,4DAA2D;AAClG,SAASC,gBAAgB,QAAQ,yDAAwD;AACzF,SAASC,gBAAgB,EAAEC,SAAS,QAAQ,yBAAwB;AACpE,SAASC,sBAAsB,EAAEC,kBAAkB,QAAQ,+BAA8B;AACzF,SAASC,oBAAoB,EAAEC,2BAA2B,QAAQ,gBAAe;AAIjF,OAAO,MAAMC,eAAgC;IAC3C,MAAM,CAACC,OAAO,GAAG1B;IAEjB,MAAM,CAAC2B,eAAeC,iBAAiB,GAAGZ,SAAwB;IAElE,MAAM,EAAEa,qBAAqB,EAAEC,IAAI,EAAE,GAAGb;IACxC,MAAMc,YAAY1B;IAElB,MAAM2B,aAAa5B,iBAAiB;QAClC6B,MAAM,CAAC,4BAA4B,CAAC,GAAGH;QACvCI,OAAOH;IACT;IAEA,MAAM,EAAEI,YAAY,EAAE,GAAGjB,iBAAiBc,YAAY;IAEtDjB,UAAU;QACR,IAAI,CAACW,OAAOU,QAAQ,CAAC;YAAChB;SAAU,GAAG;YACjC,MAAM,IAAIiB,MAAM;QAClB;QAEA,OAAOlC,cACLuB,OAAOY,eAAe,CACpBf,sBACA,CAACgB;YACCb,OAAOc,MAAM,CAAC;gBACZ,MAAMC,YAAYhC,mBAAmBD;gBAErC,IAAII,kBAAkB6B,YAAY;oBAChC,MAAMC,YAAYvB,iBAAiBoB;oBAEnC,uHAAuH;oBACvH,MAAM,EAAEI,KAAK,EAAE,GAAGF;oBAClB,MAAMG,YAAYD,MAAME,OAAO;oBAC/B,8HAA8H;oBAC9H5C,yBAAyByC;oBAEzB,6CAA6C;oBAC7C,IAAI/B,iBAAiBiC,cAAc,CAACA,UAAUE,OAAO,EAAE;wBACrDF,UAAUG,MAAM;oBAClB;gBACF;YACF;YAEA,OAAO;QACT,GACAjC,0BAEFY,OAAOY,eAAe,CACpBd,6BACA,CAACwB;YACC,IAAIrB,eAAe;gBACjB,MAAMsB,OAAO1C,cAAcoB;gBAE3B,IAAI,CAACsB,QAAQ,CAAC3B,mBAAmB2B,OAAO;oBACtC,OAAO;gBACT;gBAEAA,KAAKC,SAAS,CAACF;gBAEfpB,iBAAiB;gBACjB,OAAO;YACT;YAEA,MAAMuB,kBAAkB9B,uBAAuB2B;YAC/CnB,wBAAwBsB;YACxBzC,aAAa;gBAACyC;aAAgB;YAC9B,IAAItC,oBAAoBsC,gBAAgBC,gBAAgB,KAAK;gBAC3DlD,mBAAmBiD,iBAAiB7C,sBAAsB+C,SAAS;YACrE;YAEA,OAAO;QACT,GACAvC;IAGN,GAAG;QAACY;QAAQG;QAAuBF;QAAeQ;KAAa;IAE/D,OAAO;AACT,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$insertNodeToNearestRoot","$wrapNodeInElement","mergeRegister","formatDrawerSlug","useEditDepth","$createParagraphNode","$getNodeByKey","$getPreviousSelection","$getSelection","$insertNodes","$isParagraphNode","$isRangeSelection","$isRootOrShadowRoot","COMMAND_PRIORITY_EDITOR","useEffect","useState","useEditorConfigContext","useLexicalDrawer","$createBlockNode","BlockNode","$createInlineBlockNode","$isInlineBlockNode","INSERT_BLOCK_COMMAND","INSERT_INLINE_BLOCK_COMMAND","BlocksPlugin","$","editor","targetNodeKey","setTargetNodeKey","setCreatedInlineBlock","uuid","editDepth","t0","t1","slug","depth","drawerSlug","toggleDrawer","t2","hasNodes","Error","registerCommand","payload","update","selection","blockNode","focus","focusNode","getNode","__first","remove","fields","node","setFields","inlineBlockNode","getParentOrThrow","selectEnd","t3"],"sources":["../../../../../src/features/blocks/client/plugin/index.tsx"],"sourcesContent":["'use client'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $insertNodeToNearestRoot, $wrapNodeInElement, mergeRegister } from '@lexical/utils'\nimport { formatDrawerSlug, useEditDepth } from '@payloadcms/ui'\nimport {\n  $createParagraphNode,\n  $getNodeByKey,\n  $getPreviousSelection,\n  $getSelection,\n  $insertNodes,\n  $isParagraphNode,\n  $isRangeSelection,\n  $isRootOrShadowRoot,\n  COMMAND_PRIORITY_EDITOR,\n} from 'lexical'\nimport { useEffect, useState } from 'react'\n\nimport type { PluginComponent } from '../../../typesClient.js'\nimport type { BlockFields, BlockFieldsOptionalID } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { $createBlockNode, BlockNode } from '../nodes/BlocksNode.js'\nimport { $createInlineBlockNode, $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\nimport { INSERT_BLOCK_COMMAND, INSERT_INLINE_BLOCK_COMMAND } from './commands.js'\n\nexport type InsertBlockPayload = BlockFieldsOptionalID\n\nexport const BlocksPlugin: PluginComponent = () => {\n  const [editor] = useLexicalComposerContext()\n\n  const [targetNodeKey, setTargetNodeKey] = useState<null | string>(null)\n\n  const { setCreatedInlineBlock, uuid } = useEditorConfigContext()\n  const editDepth = useEditDepth()\n\n  const drawerSlug = formatDrawerSlug({\n    slug: `lexical-inlineBlocks-create-` + uuid,\n    depth: editDepth,\n  })\n\n  const { toggleDrawer } = useLexicalDrawer(drawerSlug, true)\n\n  useEffect(() => {\n    if (!editor.hasNodes([BlockNode])) {\n      throw new Error('BlocksPlugin: BlocksNode not registered on editor')\n    }\n\n    return mergeRegister(\n      editor.registerCommand<InsertBlockPayload>(\n        INSERT_BLOCK_COMMAND,\n        (payload: InsertBlockPayload) => {\n          editor.update(() => {\n            const selection = $getSelection() || $getPreviousSelection()\n\n            if ($isRangeSelection(selection)) {\n              const blockNode = $createBlockNode(payload)\n\n              // we need to get the focus node before inserting the block node, as $insertNodeToNearestRoot can change the focus node\n              const { focus } = selection\n              const focusNode = focus.getNode()\n              // Insert blocks node BEFORE potentially removing focusNode, as $insertNodeToNearestRoot errors if the focusNode doesn't exist\n              $insertNodeToNearestRoot(blockNode)\n\n              // Delete the node it it's an empty paragraph\n              if ($isParagraphNode(focusNode) && !focusNode.__first) {\n                focusNode.remove()\n              }\n            }\n          })\n\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n      editor.registerCommand(\n        INSERT_INLINE_BLOCK_COMMAND,\n        (fields) => {\n          if (targetNodeKey) {\n            const node = $getNodeByKey(targetNodeKey)\n\n            if (!node || !$isInlineBlockNode(node)) {\n              return false\n            }\n\n            node.setFields(fields as BlockFields)\n\n            setTargetNodeKey(null)\n            return true\n          }\n\n          const inlineBlockNode = $createInlineBlockNode(fields as BlockFields)\n          setCreatedInlineBlock?.(inlineBlockNode)\n          $insertNodes([inlineBlockNode])\n          if ($isRootOrShadowRoot(inlineBlockNode.getParentOrThrow())) {\n            $wrapNodeInElement(inlineBlockNode, $createParagraphNode).selectEnd()\n          }\n\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n    )\n  }, [editor, setCreatedInlineBlock, targetNodeKey, toggleDrawer])\n\n  return null\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,6 +1,6 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
-import './index.scss';
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { ChevronIcon, Combobox, CopyToClipboard, PopupList, RenderFields, useForm, useFormFields, useTranslation } from '@payloadcms/ui';
 import React from 'react';
@@ -10,162 +10,105 @@ import { Collapse } from './Collapse/index.js';
 import { defaultLanguages } from './defaultLanguages.js';
 import { FloatingCollapse } from './FloatingCollapse/index.js';
 const baseClass = 'payload-richtext-code-block';
-export const CodeBlockBlockComponent = (args)=>{
-    const { languages: languagesFromProps } = args;
-    const languages = languagesFromProps || defaultLanguages;
-    const { BlockCollapsible, formSchema, RemoveButton } = useBlockComponentContext();
-    const { setModified } = useForm();
-    const { t } = useTranslation();
-    const { codeField } = useFormFields(([fields])=>({
-            codeField: fields?.code
-        }));
-    const { selectedLanguageField, setSelectedLanguage } = useFormFields(([fields, dispatch])=>({
-            selectedLanguageField: fields?.language,
-            setSelectedLanguage: (language)=>{
-                dispatch({
-                    type: 'UPDATE',
-                    path: 'language',
-                    value: language
-                });
-                setModified(true);
-            }
-        }));
-    const selectedLanguageLabel = languages[selectedLanguageField?.value];
-    const isEditable = useLexicalEditable();
-    const languageEntries = React.useMemo(()=>{
-        return Object.entries(languages).map(([languageCode, languageLabel])=>({
-                name: `${languageCode} ${languageLabel}`,
-                Component: /*#__PURE__*/ _jsxDEV(PopupList.Button, {
-                    active: false,
-                    disabled: false,
-                    onClick: ()=>{
-                        setSelectedLanguage(languageCode);
-                    },
-                    children: /*#__PURE__*/ _jsxDEV("span", {
-                        className: `${baseClass}__language-code`,
-                        "data-language": languageCode,
-                        children: languageLabel
-                    }, void 0, false, {
-                        fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                        lineNumber: 70,
-                        columnNumber: 11
-                    }, this)
-                }, void 0, false, {
-                    fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                    lineNumber: 63,
-                    columnNumber: 9
-                }, this)
-            }));
-    }, [
-        languages,
-        setSelectedLanguage
-    ]);
-    return /*#__PURE__*/ _jsxDEV(BlockCollapsible, {
-        Actions: /*#__PURE__*/ _jsxDEV("div", {
-            className: `${baseClass}__actions`,
-            children: [
-                /*#__PURE__*/ _jsxDEV(Combobox, {
-                    button: /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__language-selector-button`,
-                        "data-selected-language": selectedLanguageField?.value,
-                        children: [
-                            /*#__PURE__*/ _jsxDEV("span", {
-                                children: selectedLanguageLabel
-                            }, void 0, false, {
-                                fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                                lineNumber: 88,
-                                columnNumber: 17
-                            }, void 0),
-                            /*#__PURE__*/ _jsxDEV(ChevronIcon, {
-                                className: `${baseClass}__chevron`
-                            }, void 0, false, {
-                                fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                                lineNumber: 89,
-                                columnNumber: 17
-                            }, void 0)
-                        ]
-                    }, void 0, true, {
-                        fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                        lineNumber: 84,
-                        columnNumber: 15
-                    }, void 0),
-                    buttonType: "custom",
-                    className: `${baseClass}__language-selector`,
-                    disabled: !isEditable,
-                    entries: languageEntries,
-                    horizontalAlign: "right",
-                    minEntriesForSearch: 8,
-                    searchPlaceholder: t('fields:searchForLanguage'),
-                    showScrollbar: true,
-                    size: "large"
-                }, void 0, false, {
-                    fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                    lineNumber: 82,
-                    columnNumber: 11
-                }, void 0),
-                /*#__PURE__*/ _jsxDEV(CopyToClipboard, {
-                    value: codeField?.value ?? ''
-                }, void 0, false, {
-                    fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                    lineNumber: 102,
-                    columnNumber: 11
-                }, void 0),
-                /*#__PURE__*/ _jsxDEV(Collapse, {}, void 0, false, {
-                    fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                    lineNumber: 104,
-                    columnNumber: 11
-                }, void 0),
-                isEditable && /*#__PURE__*/ _jsxDEV(RemoveButton, {}, void 0, false, {
-                    fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                    lineNumber: 106,
-                    columnNumber: 26
-                }, void 0)
-            ]
-        }, void 0, true, {
-            fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-            lineNumber: 81,
-            columnNumber: 9
-        }, void 0),
-        className: baseClass,
-        collapsibleProps: {
-            AfterCollapsible: /*#__PURE__*/ _jsxDEV(FloatingCollapse, {}, void 0, false, {
-                fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                lineNumber: 111,
-                columnNumber: 27
-            }, void 0),
-            disableHeaderToggle: true,
-            disableToggleIndicator: true
+export const CodeBlockBlockComponent = args => {
+  const {
+    languages: languagesFromProps
+  } = args;
+  const languages = languagesFromProps || defaultLanguages;
+  const {
+    BlockCollapsible,
+    formSchema,
+    RemoveButton
+  } = useBlockComponentContext();
+  const {
+    setModified
+  } = useForm();
+  const {
+    t
+  } = useTranslation();
+  const {
+    codeField
+  } = useFormFields(([fields]) => ({
+    codeField: fields?.code
+  }));
+  const {
+    selectedLanguageField,
+    setSelectedLanguage
+  } = useFormFields(([fields_0, dispatch]) => ({
+    selectedLanguageField: fields_0?.language,
+    setSelectedLanguage: language => {
+      dispatch({
+        type: 'UPDATE',
+        path: 'language',
+        value: language
+      });
+      setModified(true);
+    }
+  }));
+  const selectedLanguageLabel = languages[selectedLanguageField?.value];
+  const isEditable = useLexicalEditable();
+  const languageEntries = React.useMemo(() => {
+    return Object.entries(languages).map(([languageCode, languageLabel]) => ({
+      name: `${languageCode} ${languageLabel}`,
+      Component: /*#__PURE__*/_jsx(PopupList.Button, {
+        active: false,
+        disabled: false,
+        onClick: () => {
+          setSelectedLanguage(languageCode);
         },
-        Pill: /*#__PURE__*/ _jsxDEV("div", {
-            className: `${baseClass}__pill`,
-            children: /*#__PURE__*/ _jsxDEV(CodeBlockIcon, {}, void 0, false, {
-                fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-                lineNumber: 117,
-                columnNumber: 11
-            }, void 0)
-        }, void 0, false, {
-            fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-            lineNumber: 116,
-            columnNumber: 9
-        }, void 0),
-        children: /*#__PURE__*/ _jsxDEV(RenderFields, {
-            fields: formSchema,
-            forceRender: true,
-            parentIndexPath: "",
-            parentPath: '',
-            parentSchemaPath: "",
-            permissions: true,
-            readOnly: !isEditable
-        }, void 0, false, {
-            fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-            lineNumber: 121,
-            columnNumber: 7
-        }, this)
-    }, void 0, false, {
-        fileName: "src/features/blocks/premade/CodeBlock/Component/Block.tsx",
-        lineNumber: 79,
-        columnNumber: 5
-    }, this);
+        children: /*#__PURE__*/_jsx("span", {
+          className: `${baseClass}__language-code`,
+          "data-language": languageCode,
+          children: languageLabel
+        })
+      })
+    }));
+  }, [languages, setSelectedLanguage]);
+  return /*#__PURE__*/_jsx(BlockCollapsible, {
+    Actions: /*#__PURE__*/_jsxs("div", {
+      className: `${baseClass}__actions`,
+      children: [/*#__PURE__*/_jsx(Combobox, {
+        button: /*#__PURE__*/_jsxs("div", {
+          className: `${baseClass}__language-selector-button`,
+          "data-selected-language": selectedLanguageField?.value,
+          children: [/*#__PURE__*/_jsx("span", {
+            children: selectedLanguageLabel
+          }), /*#__PURE__*/_jsx(ChevronIcon, {
+            className: `${baseClass}__chevron`
+          })]
+        }),
+        buttonType: "custom",
+        className: `${baseClass}__language-selector`,
+        disabled: !isEditable,
+        entries: languageEntries,
+        horizontalAlign: "right",
+        minEntriesForSearch: 8,
+        searchPlaceholder: t('fields:searchForLanguage'),
+        showScrollbar: true,
+        size: "large"
+      }), /*#__PURE__*/_jsx(CopyToClipboard, {
+        value: codeField?.value ?? ''
+      }), /*#__PURE__*/_jsx(Collapse, {}), isEditable && /*#__PURE__*/_jsx(RemoveButton, {})]
+    }),
+    className: baseClass,
+    collapsibleProps: {
+      AfterCollapsible: /*#__PURE__*/_jsx(FloatingCollapse, {}),
+      disableHeaderToggle: true,
+      disableToggleIndicator: true
+    },
+    Pill: /*#__PURE__*/_jsx("div", {
+      className: `${baseClass}__pill`,
+      children: /*#__PURE__*/_jsx(CodeBlockIcon, {})
+    }),
+    children: /*#__PURE__*/_jsx(RenderFields, {
+      fields: formSchema,
+      forceRender: true,
+      parentIndexPath: "",
+      parentPath: '',
+      parentSchemaPath: "",
+      permissions: true,
+      readOnly: !isEditable
+    })
+  });
 };
-
 //# sourceMappingURL=Block.js.map

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

@@ -1 +1 @@
-{"version":3,"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"],"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","Button","active","disabled","onClick","span","className","data-language","Actions","div","button","data-selected-language","buttonType","horizontalAlign","minEntriesForSearch","searchPlaceholder","showScrollbar","size","collapsibleProps","AfterCollapsible","disableHeaderToggle","disableToggleIndicator","Pill","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","readOnly"],"mappings":"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"}
+{"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":"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","ignoreList":[]}

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

@@ -1,126 +1,100 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+
+import { jsx as _jsx } from "react/jsx-runtime";
 import { CodeField, useFormFields } from '@payloadcms/ui';
 import React, { useId, useMemo } from 'react';
 import { defaultLanguages } from './defaultLanguages.js';
-/**
-   * @default first key of the `languages` prop
-   */ /**
-   * @default all languages supported by Monaco Editor
-   */ /**
-   * Override the name of the block.
-   *
-   * @default 'Code'
-   */ /**
-   * Configure typescript settings for the editor
-   */ /**
-     * By default, the editor will not perform semantic validation. This means that
-     * while syntax errors will be highlighted, other issues like missing imports or incorrect
-     * types will not be.
-     *
-     * @default false
-     */ /**
-     * Additional types to fetch and include in the editor for autocompletion.
-     *
-     * For example, to include types for payload, you would set this to
-     *
-     * [{ url: 'https://unpkg.com/payload@latest/dist/index.d.ts', filePath: 'file:///node_modules/payload/index.d.ts' }]
-     */ /**
-     * @default undefined
-     */ /**
-     * @default "ESNext"
-     */ /**
-     * @default ['node_modules/@types']
-     */ export const CodeComponent = ({ autoComplete, field, forceRender, languages = defaultLanguages, path, permissions, readOnly, renderedBlocks, schemaPath, typescript, validate })=>{
-    const languageField = useFormFields(([fields])=>fields['language']);
-    const language = languageField?.value || languageField?.initialValue || 'typescript';
-    // unique id per component instance to ensure Monaco creates a distinct model
-    // for each TypeScript code block. Using React's useId is SSR-safe and builtin.
-    const instanceId = useId();
-    const label = languages[language];
-    const props = useMemo(()=>({
-            ...field,
-            type: 'code',
-            admin: {
-                ...field.admin,
-                editorOptions: {},
-                editorProps: {
-                    // If typescript is set, @monaco-editor/react needs to set the URI to a .ts or .tsx file when it calls createModel().
-                    // Provide a unique defaultPath per instance so Monaco doesn't reuse the same model
-                    // across multiple code block instances. We use field.name + instanceId for debugability.
-                    defaultPath: language === 'ts' ? `file-${field.name}-${instanceId}.tsx` : undefined
-                },
-                language
-            }
-        }), [
-        field,
-        language,
-        instanceId
-    ]);
-    const key = `${field.name}-${language}-${label}`;
-    return props && /*#__PURE__*/ _jsxDEV(CodeField, {
-        autoComplete: autoComplete,
-        field: props,
-        forceRender: forceRender,
-        onMount: (_editor, monaco)=>{
-            monaco.editor.defineTheme('vs-dark', {
-                base: 'vs-dark',
-                colors: {
-                    'editor.background': '#222222'
-                },
-                inherit: true,
-                rules: []
-            });
-            monaco.editor.defineTheme('vs', {
-                base: 'vs',
-                colors: {
-                    'editor.background': '#f5f5f5'
-                },
-                inherit: true,
-                rules: []
-            });
-            monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
-                allowNonTsExtensions: true,
-                // Set module resolution to NodeJs to enable autocompletion
-                allowJs: true,
-                allowSyntheticDefaultImports: true,
-                esModuleInterop: true,
-                jsx: monaco.languages.typescript.JsxEmit.React,
-                moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
-                noEmit: true,
-                paths: typescript?.paths,
-                reactNamespace: 'React',
-                target: monaco.languages.typescript.ScriptTarget[typescript?.target ?? 'ESNext'],
-                typeRoots: typescript?.typeRoots ?? [
-                    'node_modules/@types'
-                ]
-            });
-            monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
-                noSemanticValidation: typescript?.enableSemanticValidation ? false : true,
-                noSyntaxValidation: false
-            });
-            const run = async ()=>{
-                if (typescript?.fetchTypes && Array.isArray(typescript.fetchTypes) && typescript.fetchTypes.length > 0) {
-                    await Promise.all(typescript.fetchTypes.map(async (type)=>{
-                        const types = await fetch(type.url);
-                        const typesText = await types.text();
-                        monaco.languages.typescript.typescriptDefaults.addExtraLib(typesText, type.filePath);
-                    }));
-                }
-            };
-            void run();
+export const CodeComponent = ({
+  autoComplete,
+  field,
+  forceRender,
+  languages = defaultLanguages,
+  path,
+  permissions,
+  readOnly,
+  renderedBlocks,
+  schemaPath,
+  typescript,
+  validate
+}) => {
+  const languageField = useFormFields(([fields]) => fields['language']);
+  const language = languageField?.value || languageField?.initialValue || 'typescript';
+  // unique id per component instance to ensure Monaco creates a distinct model
+  // for each TypeScript code block. Using React's useId is SSR-safe and builtin.
+  const instanceId = useId();
+  const label = languages[language];
+  const props = useMemo(() => ({
+    ...field,
+    type: 'code',
+    admin: {
+      ...field.admin,
+      editorOptions: {},
+      editorProps: {
+        // If typescript is set, @monaco-editor/react needs to set the URI to a .ts or .tsx file when it calls createModel().
+        // Provide a unique defaultPath per instance so Monaco doesn't reuse the same model
+        // across multiple code block instances. We use field.name + instanceId for debugability.
+        defaultPath: language === 'ts' ? `file-${field.name}-${instanceId}.tsx` : undefined
+      },
+      language
+    }
+  }), [field, language, instanceId]);
+  const key = `${field.name}-${language}-${label}`;
+  return props && /*#__PURE__*/_jsx(CodeField, {
+    autoComplete: autoComplete,
+    field: props,
+    forceRender: forceRender,
+    onMount: (_editor, monaco) => {
+      monaco.editor.defineTheme('vs-dark', {
+        base: 'vs-dark',
+        colors: {
+          'editor.background': '#222222'
+        },
+        inherit: true,
+        rules: []
+      });
+      monaco.editor.defineTheme('vs', {
+        base: 'vs',
+        colors: {
+          'editor.background': '#f5f5f5'
         },
-        path: path,
-        permissions: permissions,
-        readOnly: readOnly,
-        renderedBlocks: renderedBlocks,
-        schemaPath: schemaPath,
-        validate: validate
-    }, key, false, {
-        fileName: "src/features/blocks/premade/CodeBlock/Component/Code.tsx",
-        lineNumber: 110,
-        columnNumber: 7
-    }, this);
+        inherit: true,
+        rules: []
+      });
+      monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
+        allowNonTsExtensions: true,
+        // Set module resolution to NodeJs to enable autocompletion
+        allowJs: true,
+        allowSyntheticDefaultImports: true,
+        esModuleInterop: true,
+        jsx: monaco.languages.typescript.JsxEmit.React,
+        moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
+        noEmit: true,
+        paths: typescript?.paths,
+        reactNamespace: 'React',
+        target: monaco.languages.typescript.ScriptTarget[typescript?.target ?? 'ESNext'],
+        typeRoots: typescript?.typeRoots ?? ['node_modules/@types']
+      });
+      monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
+        noSemanticValidation: typescript?.enableSemanticValidation ? false : true,
+        noSyntaxValidation: false
+      });
+      const run = async () => {
+        if (typescript?.fetchTypes && Array.isArray(typescript.fetchTypes) && typescript.fetchTypes.length > 0) {
+          await Promise.all(typescript.fetchTypes.map(async type => {
+            const types = await fetch(type.url);
+            const typesText = await types.text();
+            monaco.languages.typescript.typescriptDefaults.addExtraLib(typesText, type.filePath);
+          }));
+        }
+      };
+      void run();
+    },
+    path: path,
+    permissions: permissions,
+    readOnly: readOnly,
+    renderedBlocks: renderedBlocks,
+    schemaPath: schemaPath,
+    validate: validate
+  }, key);
 };
-
 //# sourceMappingURL=Code.js.map