@payloadcms/richtext-lexical 3.0.0-beta.78 → 3.0.0-beta.79

package/dist/features/blocks/client/component/BlockContent.js

@@ -0,0 +1,198 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
+import { getTranslation } from '@payloadcms/translations';
+import { Button, Collapsible, ErrorPill, Pill, RenderComponent, RenderFields, SectionTitle, useDocumentInfo, useFormSubmitted, useTranslation } from '@payloadcms/ui';
+import { dequal } from 'dequal/lite';
+import { $getNodeByKey } from 'lexical';
+import React, { useCallback } from 'react';
+import { FormSavePlugin } from './FormSavePlugin.js';
+// Recursively remove all undefined values from even being present in formData, as they will
+// cause isDeepEqual to return false if, for example, formData has a key that fields.data
+// does not have, even if it's undefined.
+// Currently, this happens if a block has another sub-blocks field. Inside formData, that sub-blocks field has an undefined blockName property.
+// Inside of fields.data however, that sub-blocks blockName property does not exist at all.
+function removeUndefinedAndNullAndEmptyArraysRecursively(obj) {
+    for(const key in obj){
+        const value = obj[key];
+        if (Array.isArray(value) && !value?.length) {
+            delete obj[key];
+        } else if (value && typeof value === 'object') {
+            removeUndefinedAndNullAndEmptyArraysRecursively(value);
+        } else if (value === undefined || value === null) {
+            delete obj[key];
+        }
+    }
+}
+/**
+ * The actual content of the Block. This should be INSIDE a Form component,
+ * scoped to the block. All format operations in here are thus scoped to the block's form, and
+ * not the whole document.
+ */ export const BlockContent = (props)=>{
+    const { baseClass, clientBlock, field, formSchema, nodeKey, schemaPath } = props;
+    let { formData } = props;
+    const { i18n } = useTranslation();
+    const [editor] = useLexicalComposerContext();
+    // Used for saving collapsed to preferences (and gettin' it from there again)
+    // Remember, these preferences are scoped to the whole document, not just this form. This
+    // is important to consider for the data path used in setDocFieldPreferences
+    const { getDocPreferences, setDocFieldPreferences } = useDocumentInfo();
+    const [isCollapsed, setIsCollapsed] = React.useState(()=>{
+        let initialState = false;
+        void getDocPreferences().then((currentDocPreferences)=>{
+            const currentFieldPreferences = currentDocPreferences?.fields[field.name];
+            const collapsedArray = currentFieldPreferences?.collapsed;
+            if (collapsedArray && collapsedArray.includes(formData.id)) {
+                initialState = true;
+                setIsCollapsed(true);
+            }
+        });
+        return initialState;
+    });
+    const hasSubmitted = useFormSubmitted();
+    const [errorCount, setErrorCount] = React.useState(0);
+    const fieldHasErrors = hasSubmitted && errorCount > 0;
+    const classNames = [
+        `${baseClass}__row`,
+        fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`
+    ].filter(Boolean).join(' ');
+    const onFormChange = useCallback(({ fullFieldsWithValues, newFormData })=>{
+        newFormData.id = formData.id;
+        newFormData.blockType = formData.blockType;
+        removeUndefinedAndNullAndEmptyArraysRecursively(newFormData);
+        removeUndefinedAndNullAndEmptyArraysRecursively(formData);
+        // Only update if the data has actually changed. Otherwise, we may be triggering an unnecessary value change,
+        // which would trigger the "Leave without saving" dialog unnecessarily
+        if (!dequal(formData, newFormData)) {
+            // Running this in the next tick in the meantime fixes this issue: https://github.com/payloadcms/payload/issues/4108
+            // I don't know why. When this is called immediately, it might focus out of a nested lexical editor field if an update is made there.
+            // My hypothesis is that the nested editor might not have fully finished its update cycle yet. By updating in the next tick, we
+            // ensure that the nested editor has finished its update cycle before we update the block node.
+            setTimeout(()=>{
+                editor.update(()=>{
+                    const node = $getNodeByKey(nodeKey);
+                    if (node) {
+                        formData = newFormData;
+                        node.setFields(newFormData);
+                    }
+                });
+            }, 0);
+        }
+        // update error count
+        if (hasSubmitted) {
+            let rowErrorCount = 0;
+            for (const formField of Object.values(fullFieldsWithValues)){
+                if (formField?.valid === false) {
+                    rowErrorCount++;
+                }
+            }
+            setErrorCount(rowErrorCount);
+        }
+    }, [
+        editor,
+        nodeKey,
+        hasSubmitted,
+        formData
+    ]);
+    const onCollapsedChange = useCallback((changedCollapsed)=>{
+        void getDocPreferences().then((currentDocPreferences)=>{
+            const currentFieldPreferences = currentDocPreferences?.fields[field.name];
+            const collapsedArray = currentFieldPreferences?.collapsed;
+            const newCollapsed = collapsedArray && collapsedArray?.length ? collapsedArray : [];
+            if (changedCollapsed) {
+                if (!newCollapsed.includes(formData.id)) {
+                    newCollapsed.push(formData.id);
+                }
+            } else {
+                if (newCollapsed.includes(formData.id)) {
+                    newCollapsed.splice(newCollapsed.indexOf(formData.id), 1);
+                }
+            }
+            setDocFieldPreferences(field.name, {
+                collapsed: newCollapsed,
+                hello: 'hi'
+            });
+        });
+    }, [
+        getDocPreferences,
+        field.name,
+        setDocFieldPreferences,
+        formData.id
+    ]);
+    const removeBlock = useCallback(()=>{
+        editor.update(()=>{
+            $getNodeByKey(nodeKey).remove();
+        });
+    }, [
+        editor,
+        nodeKey
+    ]);
+    return /*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(Collapsible, {
+                className: classNames,
+                collapsibleStyle: fieldHasErrors ? 'error' : 'default',
+                header: clientBlock?.admin?.components?.Label ? /*#__PURE__*/ _jsx(RenderComponent, {
+                    clientProps: {
+                        blockKind: 'lexicalBlock',
+                        formData
+                    },
+                    mappedComponent: clientBlock.admin.components.Label
+                }) : /*#__PURE__*/ _jsxs("div", {
+                    className: `${baseClass}__block-header`,
+                    children: [
+                        /*#__PURE__*/ _jsxs("div", {
+                            children: [
+                                /*#__PURE__*/ _jsx(Pill, {
+                                    className: `${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`,
+                                    pillStyle: "white",
+                                    children: typeof clientBlock?.labels.singular === 'string' ? getTranslation(clientBlock?.labels.singular, i18n) : clientBlock.slug
+                                }),
+                                /*#__PURE__*/ _jsx(SectionTitle, {
+                                    path: "blockName",
+                                    readOnly: field?.admin?.readOnly
+                                }),
+                                fieldHasErrors && /*#__PURE__*/ _jsx(ErrorPill, {
+                                    count: errorCount,
+                                    i18n: i18n,
+                                    withMessage: true
+                                })
+                            ]
+                        }),
+                        editor.isEditable() && /*#__PURE__*/ _jsx(Button, {
+                            buttonStyle: "icon-label",
+                            className: `${baseClass}__removeButton`,
+                            disabled: field?.admin?.readOnly,
+                            icon: "x",
+                            onClick: (e)=>{
+                                e.preventDefault();
+                                removeBlock();
+                            },
+                            round: true,
+                            tooltip: "Remove Block"
+                        })
+                    ]
+                }),
+                isCollapsed: isCollapsed,
+                onToggle: (incomingCollapsedState)=>{
+                    onCollapsedChange(incomingCollapsedState);
+                    setIsCollapsed(incomingCollapsedState);
+                },
+                children: /*#__PURE__*/ _jsx(RenderFields, {
+                    className: `${baseClass}__fields`,
+                    fields: formSchema,
+                    forceRender: true,
+                    margins: "small",
+                    path: "" // Leaving path empty makes it so field values are not prefixed / scoped by the entire schemaPath. e.g. we can access "myField" instead of "someLexicalField.feature.blocks.someArrayB" // TODO: Could there be any implications leaving path different than schemaPath?
+                    ,
+                    readOnly: false,
+                    schemaPath: schemaPath
+                })
+            }, 0),
+            /*#__PURE__*/ _jsx(FormSavePlugin, {
+                onChange: onFormChange
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=BlockContent.js.map

package/dist/features/blocks/client/component/BlockContent.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["import type { ClientBlock, ClientField, CollapsedPreferences, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  Button,\n  Collapsible,\n  ErrorPill,\n  Pill,\n  RenderComponent,\n  RenderFields,\n  SectionTitle,\n  useDocumentInfo,\n  useFormSubmitted,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { dequal } from 'dequal/lite'\nimport { $getNodeByKey } from 'lexical'\nimport React, { useCallback } from 'react'\n\nimport type { LexicalRichTextFieldProps } from '../../../../types.js'\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\nimport type { BlockNode } from '../nodes/BlocksNode.js'\n\nimport { FormSavePlugin } from './FormSavePlugin.js'\n\ntype Props = {\n  baseClass: string\n  clientBlock: ClientBlock\n  field: LexicalRichTextFieldProps['field']\n  formData: BlockFields\n  formSchema: ClientField[]\n  nodeKey: string\n  path: string\n  schemaPath: string\n}\n\n// Recursively remove all undefined values from even being present in formData, as they will\n// cause isDeepEqual to return false if, for example, formData has a key that fields.data\n// does not have, even if it's undefined.\n// Currently, this happens if a block has another sub-blocks field. Inside formData, that sub-blocks field has an undefined blockName property.\n// Inside of fields.data however, that sub-blocks blockName property does not exist at all.\nfunction removeUndefinedAndNullAndEmptyArraysRecursively(obj: object) {\n  for (const key in obj) {\n    const value = obj[key]\n    if (Array.isArray(value) && !value?.length) {\n      delete obj[key]\n    } else if (value && typeof value === 'object') {\n      removeUndefinedAndNullAndEmptyArraysRecursively(value)\n    } else if (value === undefined || value === null) {\n      delete obj[key]\n    }\n  }\n}\n\n/**\n * The actual content of the Block. This should be INSIDE a Form component,\n * scoped to the block. All format operations in here are thus scoped to the block's form, and\n * not the whole document.\n */\nexport const BlockContent: React.FC<Props> = (props) => {\n  const { baseClass, clientBlock, field, formSchema, nodeKey, schemaPath } = props\n  let { formData } = props\n\n  const { i18n } = useTranslation()\n  const [editor] = useLexicalComposerContext()\n  // Used for saving collapsed to preferences (and gettin' it from there again)\n  // Remember, these preferences are scoped to the whole document, not just this form. This\n  // is important to consider for the data path used in setDocFieldPreferences\n  const { getDocPreferences, setDocFieldPreferences } = useDocumentInfo()\n\n  const [isCollapsed, setIsCollapsed] = React.useState<boolean>(() => {\n    let initialState = false\n\n    void getDocPreferences().then((currentDocPreferences) => {\n      const currentFieldPreferences = currentDocPreferences?.fields[field.name]\n\n      const collapsedArray = currentFieldPreferences?.collapsed\n\n      if (collapsedArray && collapsedArray.includes(formData.id)) {\n        initialState = true\n        setIsCollapsed(true)\n      }\n    })\n    return initialState\n  })\n\n  const hasSubmitted = useFormSubmitted()\n\n  const [errorCount, setErrorCount] = React.useState(0)\n\n  const fieldHasErrors = hasSubmitted && errorCount > 0\n\n  const classNames = [\n    `${baseClass}__row`,\n    fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const onFormChange = useCallback(\n    ({\n      fullFieldsWithValues,\n      newFormData,\n    }: {\n      fullFieldsWithValues: FormState\n      newFormData: BlockFields\n    }) => {\n      newFormData.id = formData.id\n      newFormData.blockType = formData.blockType\n\n      removeUndefinedAndNullAndEmptyArraysRecursively(newFormData)\n      removeUndefinedAndNullAndEmptyArraysRecursively(formData)\n\n      // Only update if the data has actually changed. Otherwise, we may be triggering an unnecessary value change,\n      // which would trigger the \"Leave without saving\" dialog unnecessarily\n      if (!dequal(formData, newFormData)) {\n        // Running this in the next tick in the meantime fixes this issue: https://github.com/payloadcms/payload/issues/4108\n        // I don't know why. When this is called immediately, it might focus out of a nested lexical editor field if an update is made there.\n        // My hypothesis is that the nested editor might not have fully finished its update cycle yet. By updating in the next tick, we\n        // ensure that the nested editor has finished its update cycle before we update the block node.\n        setTimeout(() => {\n          editor.update(() => {\n            const node: BlockNode = $getNodeByKey(nodeKey)\n            if (node) {\n              formData = newFormData\n              node.setFields(newFormData)\n            }\n          })\n        }, 0)\n      }\n\n      // update error count\n      if (hasSubmitted) {\n        let rowErrorCount = 0\n        for (const formField of Object.values(fullFieldsWithValues)) {\n          if (formField?.valid === false) {\n            rowErrorCount++\n          }\n        }\n        setErrorCount(rowErrorCount)\n      }\n    },\n    [editor, nodeKey, hasSubmitted, formData],\n  )\n\n  const onCollapsedChange = useCallback(\n    (changedCollapsed: boolean) => {\n      void getDocPreferences().then((currentDocPreferences) => {\n        const currentFieldPreferences = currentDocPreferences?.fields[field.name]\n\n        const collapsedArray = currentFieldPreferences?.collapsed\n\n        const newCollapsed: CollapsedPreferences =\n          collapsedArray && collapsedArray?.length ? collapsedArray : []\n\n        if (changedCollapsed) {\n          if (!newCollapsed.includes(formData.id)) {\n            newCollapsed.push(formData.id)\n          }\n        } else {\n          if (newCollapsed.includes(formData.id)) {\n            newCollapsed.splice(newCollapsed.indexOf(formData.id), 1)\n          }\n        }\n\n        setDocFieldPreferences(field.name, {\n          collapsed: newCollapsed,\n          hello: 'hi',\n        })\n      })\n    },\n    [getDocPreferences, field.name, setDocFieldPreferences, formData.id],\n  )\n\n  const removeBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey).remove()\n    })\n  }, [editor, nodeKey])\n\n  return (\n    <React.Fragment>\n      <Collapsible\n        className={classNames}\n        collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n        header={\n          clientBlock?.admin?.components?.Label ? (\n            <RenderComponent\n              clientProps={{ blockKind: 'lexicalBlock', formData }}\n              mappedComponent={clientBlock.admin.components.Label}\n            />\n          ) : (\n            <div className={`${baseClass}__block-header`}>\n              <div>\n                <Pill\n                  className={`${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`}\n                  pillStyle=\"white\"\n                >\n                  {typeof clientBlock?.labels.singular === 'string'\n                    ? getTranslation(clientBlock?.labels.singular, i18n)\n                    : clientBlock.slug}\n                </Pill>\n                <SectionTitle path=\"blockName\" readOnly={field?.admin?.readOnly} />\n                {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n              </div>\n              {editor.isEditable() && (\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__removeButton`}\n                  disabled={field?.admin?.readOnly}\n                  icon=\"x\"\n                  onClick={(e) => {\n                    e.preventDefault()\n                    removeBlock()\n                  }}\n                  round\n                  tooltip=\"Remove Block\"\n                />\n              )}\n            </div>\n          )\n        }\n        isCollapsed={isCollapsed}\n        key={0}\n        onToggle={(incomingCollapsedState) => {\n          onCollapsedChange(incomingCollapsedState)\n          setIsCollapsed(incomingCollapsedState)\n        }}\n      >\n        <RenderFields\n          className={`${baseClass}__fields`}\n          fields={formSchema}\n          forceRender\n          margins=\"small\"\n          path=\"\" // Leaving path empty makes it so field values are not prefixed / scoped by the entire schemaPath. e.g. we can access \"myField\" instead of \"someLexicalField.feature.blocks.someArrayB\" // TODO: Could there be any implications leaving path different than schemaPath?\n          readOnly={false}\n          schemaPath={schemaPath} // Having the correct schemaPath here allows sub-fields (like array > addRow) to run correct form-state calls and retrieve their needed form state from the server\n        />\n      </Collapsible>\n\n      <FormSavePlugin onChange={onFormChange} />\n    </React.Fragment>\n  )\n}\n"],"names":["useLexicalComposerContext","getTranslation","Button","Collapsible","ErrorPill","Pill","RenderComponent","RenderFields","SectionTitle","useDocumentInfo","useFormSubmitted","useTranslation","dequal","$getNodeByKey","React","useCallback","FormSavePlugin","removeUndefinedAndNullAndEmptyArraysRecursively","obj","key","value","Array","isArray","length","undefined","BlockContent","props","baseClass","clientBlock","field","formSchema","nodeKey","schemaPath","formData","i18n","editor","getDocPreferences","setDocFieldPreferences","isCollapsed","setIsCollapsed","useState","initialState","then","currentDocPreferences","currentFieldPreferences","fields","name","collapsedArray","collapsed","includes","id","hasSubmitted","errorCount","setErrorCount","fieldHasErrors","classNames","filter","Boolean","join","onFormChange","fullFieldsWithValues","newFormData","blockType","setTimeout","update","node","setFields","rowErrorCount","formField","Object","values","valid","onCollapsedChange","changedCollapsed","newCollapsed","push","splice","indexOf","hello","removeBlock","remove","Fragment","className","collapsibleStyle","header","admin","components","Label","clientProps","blockKind","mappedComponent","div","pillStyle","labels","singular","slug","path","readOnly","count","withMessage","isEditable","buttonStyle","disabled","icon","onClick","e","preventDefault","round","tooltip","onToggle","incomingCollapsedState","forceRender","margins","onChange"],"mappings":"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"}

package/dist/features/blocks/client/component/FormSavePlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSavePlugin.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/FormSavePlugin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,CAAC,EACV,oBAAoB,EACpB,WAAW,GACZ,EAAE;QACD,oBAAoB,EAAE,SAAS,CAAA;QAC/B,WAAW,EAAE,IAAI,CAAA;KAClB,KAAK,IAAI,CAAA;CACX,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkB1C,CAAA"}

package/dist/features/blocks/client/component/FormSavePlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/features/blocks/client/component/FormSavePlugin.tsx"],"sourcesContent":["import type { Data, FormState } from 'payload'\nimport type React from 'react'\n\nimport { useAllFormFields } from '@payloadcms/ui'\nimport { reduceFieldsToValues } from 'payload/shared'\nimport { useEffect } from 'react'\n\nimport { removeEmptyArrayValues } from './removeEmptyArrayValues.js'\n\ntype Props = {\n  onChange?: ({\n    fullFieldsWithValues,\n    newFormData,\n  }: {\n    fullFieldsWithValues: FormState\n    newFormData: Data\n  }) => void\n}\n\nexport const FormSavePlugin: React.FC<Props> = (props) => {\n  const { onChange } = props\n\n  const [_fields] = useAllFormFields()\n\n  const fields = removeEmptyArrayValues({ fields: _fields })\n\n  // Pass in fields, and indicate if you'd like to \"unflatten\" field data.\n  // The result below will reflect the data stored in the form at the given time\n  const newFormData = reduceFieldsToValues(fields, true)\n\n  useEffect(() => {\n    if (onChange) {\n      onChange({ fullFieldsWithValues: fields, newFormData })\n    }\n  }, [newFormData, onChange, fields])\n\n  return null\n}\n"],"names":["useAllFormFields","reduceFieldsToValues","useEffect","removeEmptyArrayValues","FormSavePlugin","props","onChange","_fields","fields","newFormData","fullFieldsWithValues"],"mappings":"AAGA,SAASA,gBAAgB,QAAQ,iBAAgB;AACjD,SAASC,oBAAoB,QAAQ,iBAAgB;AACrD,SAASC,SAAS,QAAQ,QAAO;AAEjC,SAASC,sBAAsB,QAAQ,8BAA6B;AAYpE,OAAO,MAAMC,iBAAkC,CAACC;IAC9C,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAM,CAACE,QAAQ,GAAGP;IAElB,MAAMQ,SAASL,uBAAuB;QAAEK,QAAQD;IAAQ;IAExD,wEAAwE;IACxE,8EAA8E;IAC9E,MAAME,cAAcR,qBAAqBO,QAAQ;IAEjDN,UAAU;QACR,IAAII,UAAU;YACZA,SAAS;gBAAEI,sBAAsBF;gBAAQC;YAAY;QACvD;IACF,GAAG;QAACA;QAAaH;QAAUE;KAAO;IAElC,OAAO;AACT,EAAC"}

package/dist/features/blocks/client/component/index.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { BlockFields } from '../../server/nodes/BlocksNode.js';
+import './index.scss';
+type Props = {
+    readonly children?: React.ReactNode;
+    readonly formData: BlockFields;
+    readonly nodeKey?: string;
+};
+export declare const BlockComponent: React.FC<Props>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/features/blocks/client/component/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAoD,MAAM,OAAO,CAAA;AASxE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAInE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAA;IAC9B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsJ1C,CAAA"}

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

@@ -0,0 +1,157 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Collapsible, Form, Pill, RenderComponent, SectionTitle, ShimmerEffect, useConfig, useDocumentInfo, useFieldProps, useFormSubmitted, useTranslation } from '@payloadcms/ui';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+const baseClass = 'lexical-block';
+import { getTranslation } from '@payloadcms/translations';
+import { getFormState } from '@payloadcms/ui/shared';
+import { v4 as uuid } from 'uuid';
+import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
+import { BlockContent } from './BlockContent.js';
+export const BlockComponent = (props)=>{
+    const { formData, nodeKey } = props;
+    const { config } = useConfig();
+    const submitted = useFormSubmitted();
+    const { id } = useDocumentInfo();
+    const { path, schemaPath } = useFieldProps();
+    const { field: parentLexicalRichTextField } = useEditorConfigContext();
+    const [initialState, setInitialState] = useState(false);
+    const { field: { richTextComponentMap } } = useEditorConfigContext();
+    const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.lexical_blocks.${formData.blockType}`;
+    const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_blocks`;
+    const blocksField = richTextComponentMap.get(componentMapRenderedBlockPath)[0];
+    const clientBlock = blocksField.blocks.find((block)=>block.slug === formData.blockType);
+    // Field Schema
+    useEffect(()=>{
+        const awaitInitialState = async ()=>{
+            const state = await getFormState({
+                apiRoute: config.routes.api,
+                body: {
+                    id,
+                    data: formData,
+                    operation: 'update',
+                    schemaPath: schemaFieldsPath
+                },
+                serverURL: config.serverURL
+            });
+            if (state) {
+                state.blockName = {
+                    initialValue: '',
+                    passesCondition: true,
+                    valid: true,
+                    value: formData.blockName
+                };
+                setInitialState(state);
+            }
+        };
+        if (formData) {
+            void awaitInitialState();
+        }
+    }, [
+        config.routes.api,
+        config.serverURL,
+        schemaFieldsPath,
+        id
+    ]) // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.
+    ;
+    const onChange = useCallback(async ({ formState: prevFormState })=>{
+        const formState = await getFormState({
+            apiRoute: config.routes.api,
+            body: {
+                id,
+                formState: prevFormState,
+                operation: 'update',
+                schemaPath: schemaFieldsPath
+            },
+            serverURL: config.serverURL
+        });
+        formState.blockName = {
+            initialValue: '',
+            passesCondition: true,
+            valid: true,
+            value: formData.blockName
+        };
+        return formState;
+    }, [
+        config.routes.api,
+        config.serverURL,
+        id,
+        schemaFieldsPath,
+        formData.blockName
+    ]);
+    const { i18n } = useTranslation();
+    const classNames = [
+        `${baseClass}__row`,
+        `${baseClass}__row--no-errors`
+    ].filter(Boolean).join(' ');
+    // Memoized Form JSX
+    const formContent = useMemo(()=>{
+        return clientBlock && initialState !== false ? /*#__PURE__*/ _jsx(Form, {
+            beforeSubmit: [
+                onChange
+            ],
+            fields: clientBlock.fields,
+            initialState: initialState,
+            onChange: [
+                onChange
+            ],
+            submitted: submitted,
+            uuid: uuid(),
+            children: /*#__PURE__*/ _jsx(BlockContent, {
+                baseClass: baseClass,
+                clientBlock: clientBlock,
+                field: parentLexicalRichTextField,
+                formData: formData,
+                formSchema: clientBlock.fields,
+                nodeKey: nodeKey,
+                path: `${path}.lexical_internal_feature.blocks.${formData.blockType}`,
+                schemaPath: schemaFieldsPath
+            })
+        }) : /*#__PURE__*/ _jsx(Collapsible, {
+            className: classNames,
+            collapsibleStyle: "default",
+            header: clientBlock?.admin?.components?.Label ? /*#__PURE__*/ _jsx(RenderComponent, {
+                clientProps: {
+                    blockKind: 'lexicalBlock',
+                    formData
+                },
+                mappedComponent: clientBlock.admin.components.Label
+            }) : /*#__PURE__*/ _jsx("div", {
+                className: `${baseClass}__block-header`,
+                children: /*#__PURE__*/ _jsxs("div", {
+                    children: [
+                        /*#__PURE__*/ _jsx(Pill, {
+                            className: `${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`,
+                            pillStyle: "white",
+                            children: clientBlock && typeof clientBlock.labels.singular === 'string' ? getTranslation(clientBlock.labels.singular, i18n) : clientBlock.slug
+                        }),
+                        /*#__PURE__*/ _jsx(SectionTitle, {
+                            path: "blockName",
+                            readOnly: parentLexicalRichTextField?.admin?.readOnly
+                        })
+                    ]
+                })
+            }),
+            children: /*#__PURE__*/ _jsx(ShimmerEffect, {
+                height: "35vh"
+            })
+        }, 0);
+    }, [
+        clientBlock,
+        initialState,
+        onChange,
+        submitted,
+        parentLexicalRichTextField,
+        nodeKey,
+        path,
+        schemaFieldsPath,
+        classNames,
+        i18n
+    ]);
+    return /*#__PURE__*/ _jsx("div", {
+        className: baseClass + ' ' + baseClass + '-' + formData.blockType,
+        children: formContent
+    });
+};
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/features/blocks/client/component/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormProps } from '@payloadcms/ui'\n\nimport {\n  Collapsible,\n  Form,\n  Pill,\n  RenderComponent,\n  SectionTitle,\n  ShimmerEffect,\n  useConfig,\n  useDocumentInfo,\n  useFieldProps,\n  useFormSubmitted,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\n\nconst baseClass = 'lexical-block'\nimport type { BlockFieldClient, FormState } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { getFormState } from '@payloadcms/ui/shared'\nimport { v4 as uuid } from 'uuid'\n\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { BlockContent } from './BlockContent.js'\nimport './index.scss'\n\ntype Props = {\n  readonly children?: React.ReactNode\n  readonly formData: BlockFields\n  readonly nodeKey?: string\n}\n\nexport const BlockComponent: React.FC<Props> = (props) => {\n  const { formData, nodeKey } = props\n  const { config } = useConfig()\n  const submitted = useFormSubmitted()\n  const { id } = useDocumentInfo()\n  const { path, schemaPath } = useFieldProps()\n  const { field: parentLexicalRichTextField } = useEditorConfigContext()\n\n  const [initialState, setInitialState] = useState<FormState | false>(false)\n  const {\n    field: { richTextComponentMap },\n  } = useEditorConfigContext()\n\n  const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.lexical_blocks.${formData.blockType}`\n\n  const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_blocks`\n  const blocksField: BlockFieldClient = richTextComponentMap.get(componentMapRenderedBlockPath)[0]\n\n  const clientBlock = blocksField.blocks.find((block) => block.slug === formData.blockType)\n\n  // Field Schema\n  useEffect(() => {\n    const awaitInitialState = async () => {\n      const state = await getFormState({\n        apiRoute: config.routes.api,\n        body: {\n          id,\n          data: formData,\n          operation: 'update',\n          schemaPath: schemaFieldsPath,\n        },\n        serverURL: config.serverURL,\n      })\n\n      if (state) {\n        state.blockName = {\n          initialValue: '',\n          passesCondition: true,\n          valid: true,\n          value: formData.blockName,\n        }\n\n        setInitialState(state)\n      }\n    }\n\n    if (formData) {\n      void awaitInitialState()\n    }\n  }, [config.routes.api, config.serverURL, schemaFieldsPath, id]) // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.\n\n  const onChange: FormProps['onChange'][0] = useCallback(\n    async ({ formState: prevFormState }) => {\n      const formState = await getFormState({\n        apiRoute: config.routes.api,\n        body: {\n          id,\n          formState: prevFormState,\n          operation: 'update',\n          schemaPath: schemaFieldsPath,\n        },\n        serverURL: config.serverURL,\n      })\n\n      formState.blockName = {\n        initialValue: '',\n        passesCondition: true,\n        valid: true,\n        value: formData.blockName,\n      }\n\n      return formState\n    },\n\n    [config.routes.api, config.serverURL, id, schemaFieldsPath, formData.blockName],\n  )\n  const { i18n } = useTranslation()\n\n  const classNames = [`${baseClass}__row`, `${baseClass}__row--no-errors`].filter(Boolean).join(' ')\n\n  // Memoized Form JSX\n  const formContent = useMemo(() => {\n    return clientBlock && initialState !== false ? (\n      <Form\n        beforeSubmit={[onChange]}\n        fields={clientBlock.fields}\n        initialState={initialState}\n        onChange={[onChange]}\n        submitted={submitted}\n        uuid={uuid()}\n      >\n        <BlockContent\n          baseClass={baseClass}\n          clientBlock={clientBlock}\n          field={parentLexicalRichTextField}\n          formData={formData}\n          formSchema={clientBlock.fields}\n          nodeKey={nodeKey}\n          path={`${path}.lexical_internal_feature.blocks.${formData.blockType}`}\n          schemaPath={schemaFieldsPath}\n        />\n      </Form>\n    ) : (\n      <Collapsible\n        className={classNames}\n        collapsibleStyle=\"default\"\n        header={\n          clientBlock?.admin?.components?.Label ? (\n            <RenderComponent\n              clientProps={{ blockKind: 'lexicalBlock', formData }}\n              mappedComponent={clientBlock.admin.components.Label}\n            />\n          ) : (\n            <div className={`${baseClass}__block-header`}>\n              <div>\n                <Pill\n                  className={`${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`}\n                  pillStyle=\"white\"\n                >\n                  {clientBlock && typeof clientBlock.labels.singular === 'string'\n                    ? getTranslation(clientBlock.labels.singular, i18n)\n                    : clientBlock.slug}\n                </Pill>\n                <SectionTitle\n                  path=\"blockName\"\n                  readOnly={parentLexicalRichTextField?.admin?.readOnly}\n                />\n              </div>\n            </div>\n          )\n        }\n        key={0}\n      >\n        <ShimmerEffect height=\"35vh\" />\n      </Collapsible>\n    )\n  }, [\n    clientBlock,\n    initialState,\n    onChange,\n    submitted,\n    parentLexicalRichTextField,\n    nodeKey,\n    path,\n    schemaFieldsPath,\n    classNames,\n    i18n,\n  ])\n\n  return <div className={baseClass + ' ' + baseClass + '-' + formData.blockType}>{formContent}</div>\n}\n"],"names":["Collapsible","Form","Pill","RenderComponent","SectionTitle","ShimmerEffect","useConfig","useDocumentInfo","useFieldProps","useFormSubmitted","useTranslation","React","useCallback","useEffect","useMemo","useState","baseClass","getTranslation","getFormState","v4","uuid","useEditorConfigContext","BlockContent","BlockComponent","props","formData","nodeKey","config","submitted","id","path","schemaPath","field","parentLexicalRichTextField","initialState","setInitialState","richTextComponentMap","schemaFieldsPath","blockType","componentMapRenderedBlockPath","blocksField","get","clientBlock","blocks","find","block","slug","awaitInitialState","state","apiRoute","routes","api","body","data","operation","serverURL","blockName","initialValue","passesCondition","valid","value","onChange","formState","prevFormState","i18n","classNames","filter","Boolean","join","formContent","beforeSubmit","fields","formSchema","className","collapsibleStyle","header","admin","components","Label","clientProps","blockKind","mappedComponent","div","pillStyle","labels","singular","readOnly","height"],"mappings":"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"}

package/dist/features/blocks/client/component/removeEmptyArrayValues.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"removeEmptyArrayValues.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/removeEmptyArrayValues.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,SAAS,CAAA;CAAE,GAAG,SAAS,CAQnF"}

package/dist/features/blocks/client/component/removeEmptyArrayValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/features/blocks/client/component/removeEmptyArrayValues.ts"],"sourcesContent":["import type { FormState } from 'payload'\n\n/**\n * By default, if an array field is empty, it will be included in the form state with a value of 0.\n * We do not need this behavior here, By setting `disableFormData` to true, we can prevent the field from being included in the form state\n * like that.\n * @param fields form state\n */\nexport function removeEmptyArrayValues({ fields }: { fields: FormState }): FormState {\n  for (const key in fields) {\n    const field = fields[key]\n    if (Array.isArray(field.rows) && 'value' in field) {\n      field.disableFormData = true\n    }\n  }\n  return fields\n}\n"],"names":["removeEmptyArrayValues","fields","key","field","Array","isArray","rows","disableFormData"],"mappings":"AAEA;;;;;CAKC,GACD,OAAO,SAASA,uBAAuB,EAAEC,MAAM,EAAyB;IACtE,IAAK,MAAMC,OAAOD,OAAQ;QACxB,MAAME,QAAQF,MAAM,CAACC,IAAI;QACzB,IAAIE,MAAMC,OAAO,CAACF,MAAMG,IAAI,KAAK,WAAWH,OAAO;YACjDA,MAAMI,eAAe,GAAG;QAC1B;IACF;IACA,OAAON;AACT"}

package/dist/features/blocks/client/componentInline/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAoB7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAKrE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+HhD,CAAA"}

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

@@ -0,0 +1,138 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useCallback, useEffect, useRef } from 'react';
+const baseClass = 'inline-block';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection';
+import { mergeRegister } from '@lexical/utils';
+import { getTranslation } from '@payloadcms/translations';
+import { Button, RenderComponent, useTranslation } from '@payloadcms/ui';
+import { $getNodeByKey, $getSelection, $isNodeSelection, CLICK_COMMAND, COMMAND_PRIORITY_LOW, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND } from 'lexical';
+import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
+import { $isInlineBlockNode } from '../nodes/InlineBlocksNode.js';
+import { OPEN_INLINE_BLOCK_DRAWER_COMMAND } from '../plugin/commands.js';
+export const InlineBlockComponent = (props)=>{
+    const { formData, nodeKey } = props;
+    const [editor] = useLexicalComposerContext();
+    const { i18n, t } = useTranslation();
+    const { field } = useEditorConfigContext();
+    const inlineBlockElemElemRef = useRef(null);
+    const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey);
+    const { field: { richTextComponentMap } } = useEditorConfigContext();
+    const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_inline_blocks`;
+    const blocksField = richTextComponentMap.get(componentMapRenderedBlockPath)[0];
+    const clientBlock = blocksField.blocks.find((block)=>block.slug === formData.blockType);
+    const removeInlineBlock = useCallback(()=>{
+        editor.update(()=>{
+            $getNodeByKey(nodeKey).remove();
+        });
+    }, [
+        editor,
+        nodeKey
+    ]);
+    const $onDelete = useCallback((event)=>{
+        if (isSelected && $isNodeSelection($getSelection())) {
+            event.preventDefault();
+            const node = $getNodeByKey(nodeKey);
+            if ($isInlineBlockNode(node)) {
+                node.remove();
+                return true;
+            }
+        }
+        return false;
+    }, [
+        isSelected,
+        nodeKey
+    ]);
+    const onClick = useCallback((payload)=>{
+        const event = payload;
+        // Check if inlineBlockElemElemRef.target or anything WITHIN inlineBlockElemElemRef.target was clicked
+        if (event.target === inlineBlockElemElemRef.current || inlineBlockElemElemRef.current?.contains(event.target)) {
+            if (event.shiftKey) {
+                setSelected(!isSelected);
+            } else {
+                if (!isSelected) {
+                    clearSelection();
+                    setSelected(true);
+                }
+            }
+            return true;
+        }
+        return false;
+    }, [
+        isSelected,
+        setSelected,
+        clearSelection
+    ]);
+    useEffect(()=>{
+        return mergeRegister(editor.registerCommand(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW));
+    }, [
+        clearSelection,
+        editor,
+        isSelected,
+        nodeKey,
+        $onDelete,
+        setSelected,
+        onClick
+    ]);
+    const blockDisplayName = clientBlock?.labels?.singular ? getTranslation(clientBlock.labels.singular, i18n) : clientBlock.slug;
+    return /*#__PURE__*/ _jsxs("div", {
+        className: [
+            baseClass,
+            baseClass + '-' + formData.blockType,
+            isSelected && `${baseClass}--selected`
+        ].filter(Boolean).join(' '),
+        ref: inlineBlockElemElemRef,
+        children: [
+            clientBlock?.admin?.components?.Label ? /*#__PURE__*/ _jsx(RenderComponent, {
+                clientProps: {
+                    blockKind: 'lexicalInlineBlock',
+                    formData
+                },
+                mappedComponent: clientBlock.admin.components.Label
+            }) : /*#__PURE__*/ _jsx("div", {
+                children: getTranslation(clientBlock.labels?.singular, i18n)
+            }),
+            editor.isEditable() && /*#__PURE__*/ _jsxs("div", {
+                className: `${baseClass}__actions`,
+                children: [
+                    /*#__PURE__*/ _jsx(Button, {
+                        buttonStyle: "icon-label",
+                        className: `${baseClass}__editButton`,
+                        disabled: field?.admin?.readOnly,
+                        el: "div",
+                        icon: "edit",
+                        onClick: ()=>{
+                            editor.dispatchCommand(OPEN_INLINE_BLOCK_DRAWER_COMMAND, {
+                                fields: formData,
+                                nodeKey
+                            });
+                        },
+                        round: true,
+                        size: "small",
+                        tooltip: t('lexical:blocks:inlineBlocks:edit', {
+                            label: blockDisplayName
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        buttonStyle: "icon-label",
+                        className: `${baseClass}__removeButton`,
+                        disabled: field?.admin?.readOnly,
+                        icon: "x",
+                        onClick: (e)=>{
+                            e.preventDefault();
+                            removeInlineBlock();
+                        },
+                        round: true,
+                        size: "small",
+                        tooltip: t('lexical:blocks:inlineBlocks:remove', {
+                            label: blockDisplayName
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef } from 'react'\nconst baseClass = 'inline-block'\n\nimport type { BlockFieldClient } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, RenderComponent, useTranslation } from '@payloadcms/ui'\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n} from 'lexical'\n\nimport type { InlineBlockFields } from '../nodes/InlineBlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\nimport { OPEN_INLINE_BLOCK_DRAWER_COMMAND } from '../plugin/commands.js'\nimport './index.scss'\n\ntype Props = {\n  readonly formData: InlineBlockFields\n  readonly nodeKey?: string\n}\n\nexport const InlineBlockComponent: React.FC<Props> = (props) => {\n  const { formData, nodeKey } = props\n  const [editor] = useLexicalComposerContext()\n  const { i18n, t } = useTranslation<object, string>()\n  const { field } = useEditorConfigContext()\n  const inlineBlockElemElemRef = useRef<HTMLDivElement | null>(null)\n  const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey)\n\n  const {\n    field: { richTextComponentMap },\n  } = useEditorConfigContext()\n\n  const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_inline_blocks`\n  const blocksField: BlockFieldClient = richTextComponentMap.get(componentMapRenderedBlockPath)[0]\n  const clientBlock = blocksField.blocks.find((block) => block.slug === formData.blockType)\n\n  const removeInlineBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey).remove()\n    })\n  }, [editor, nodeKey])\n\n  const $onDelete = useCallback(\n    (event: KeyboardEvent) => {\n      if (isSelected && $isNodeSelection($getSelection())) {\n        event.preventDefault()\n        const node = $getNodeByKey(nodeKey)\n        if ($isInlineBlockNode(node)) {\n          node.remove()\n          return true\n        }\n      }\n      return false\n    },\n    [isSelected, nodeKey],\n  )\n  const onClick = useCallback(\n    (payload: MouseEvent) => {\n      const event = payload\n      // Check if inlineBlockElemElemRef.target or anything WITHIN inlineBlockElemElemRef.target was clicked\n      if (\n        event.target === inlineBlockElemElemRef.current ||\n        inlineBlockElemElemRef.current?.contains(event.target as Node)\n      ) {\n        if (event.shiftKey) {\n          setSelected(!isSelected)\n        } else {\n          if (!isSelected) {\n            clearSelection()\n            setSelected(true)\n          }\n        }\n        return true\n      }\n\n      return false\n    },\n    [isSelected, setSelected, clearSelection],\n  )\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n      editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n    )\n  }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n  const blockDisplayName = clientBlock?.labels?.singular\n    ? getTranslation(clientBlock.labels.singular, i18n)\n    : clientBlock.slug\n\n  return (\n    <div\n      className={[\n        baseClass,\n        baseClass + '-' + formData.blockType,\n        isSelected && `${baseClass}--selected`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      ref={inlineBlockElemElemRef}\n    >\n      {clientBlock?.admin?.components?.Label ? (\n        <RenderComponent\n          clientProps={{ blockKind: 'lexicalInlineBlock', formData }}\n          mappedComponent={clientBlock.admin.components.Label}\n        />\n      ) : (\n        <div>{getTranslation(clientBlock.labels?.singular, i18n)}</div>\n      )}\n      {editor.isEditable() && (\n        <div className={`${baseClass}__actions`}>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__editButton`}\n            disabled={field?.admin?.readOnly}\n            el=\"div\"\n            icon=\"edit\"\n            onClick={() => {\n              editor.dispatchCommand(OPEN_INLINE_BLOCK_DRAWER_COMMAND, {\n                fields: formData,\n                nodeKey,\n              })\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n          />\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__removeButton`}\n            disabled={field?.admin?.readOnly}\n            icon=\"x\"\n            onClick={(e) => {\n              e.preventDefault()\n              removeInlineBlock()\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:remove', { label: blockDisplayName })}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["React","useCallback","useEffect","useRef","baseClass","useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","RenderComponent","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","useEditorConfigContext","$isInlineBlockNode","OPEN_INLINE_BLOCK_DRAWER_COMMAND","InlineBlockComponent","props","formData","nodeKey","editor","i18n","t","field","inlineBlockElemElemRef","isSelected","setSelected","clearSelection","richTextComponentMap","componentMapRenderedBlockPath","blocksField","get","clientBlock","blocks","find","block","slug","blockType","removeInlineBlock","update","remove","$onDelete","event","preventDefault","node","onClick","payload","target","current","contains","shiftKey","registerCommand","blockDisplayName","labels","singular","div","className","filter","Boolean","join","ref","admin","components","Label","clientProps","blockKind","mappedComponent","isEditable","buttonStyle","disabled","readOnly","el","icon","dispatchCommand","fields","round","size","tooltip","label","e"],"mappings":"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"}

package/dist/features/blocks/client/index.d.ts

@@ -0,0 +1,9 @@
+export type BlocksFeatureClientProps = {
+    clientBlockSlugs: string[];
+    clientInlineBlockSlugs: string[];
+};
+export declare const BlocksFeatureClient: import("react").FC<{
+    featureKey: string;
+    order: number;
+} & BlocksFeatureClientProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/features/blocks/client/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/blocks/client/index.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,wBAAwB,GAAG;IACrC,gBAAgB,EAAE,MAAM,EAAE,CAAA;IAC1B,sBAAsB,EAAE,MAAM,EAAE,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,mBAAmB;;;6BA0K7B,CAAA"}