@payloadcms/richtext-lexical 3.0.0-beta.115 → 3.0.0-beta.117

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/dist/exports/client/Field-Y47DV2NP.js +2 -0
  2. package/dist/exports/client/Field-Y47DV2NP.js.map +7 -0
  3. package/dist/exports/client/bundled.css +1 -1
  4. package/dist/exports/client/{chunk-6LZZDOEO.js → chunk-NEO76RJK.js} +2 -2
  5. package/dist/exports/client/component-XMR5NN36.js +2 -0
  6. package/dist/exports/client/component-XMR5NN36.js.map +7 -0
  7. package/dist/exports/client/index.js +6 -6
  8. package/dist/exports/client/index.js.map +3 -3
  9. package/dist/features/blocks/client/component/BlockContent.d.ts.map +1 -1
  10. package/dist/features/blocks/client/component/BlockContent.js +8 -9
  11. package/dist/features/blocks/client/component/BlockContent.js.map +1 -1
  12. package/dist/features/toolbars/inline/client/Toolbar/index.d.ts.map +1 -1
  13. package/dist/features/toolbars/inline/client/Toolbar/index.js +8 -10
  14. package/dist/features/toolbars/inline/client/Toolbar/index.js.map +1 -1
  15. package/dist/field/Field.d.ts.map +1 -1
  16. package/dist/field/Field.js +5 -3
  17. package/dist/field/Field.js.map +1 -1
  18. package/dist/field/bundled.css +1 -1
  19. package/dist/lexical/LexicalProvider.d.ts +1 -1
  20. package/dist/lexical/LexicalProvider.d.ts.map +1 -1
  21. package/dist/lexical/LexicalProvider.js +6 -4
  22. package/dist/lexical/LexicalProvider.js.map +1 -1
  23. package/package.json +9 -9
  24. package/dist/exports/client/Field-ETCEVZLL.js +0 -2
  25. package/dist/exports/client/Field-ETCEVZLL.js.map +0 -7
  26. package/dist/exports/client/component-6Y2K2RNP.js +0 -2
  27. package/dist/exports/client/component-6Y2K2RNP.js.map +0 -7
  28. /package/dist/exports/client/{chunk-6LZZDOEO.js.map → chunk-NEO76RJK.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"BlockContent.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAmC,MAAM,SAAS,CAAA;AAkBxF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAKnE,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAA;IACzC,QAAQ,EAAE,WAAW,CAAA;IACrB,UAAU,EAAE,WAAW,EAAE,CAAA;IACzB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwLxC,CAAA"}
1
+ {"version":3,"file":"BlockContent.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAmC,MAAM,SAAS,CAAA;AAkBxF,OAAO,KAAiC,MAAM,OAAO,CAAA;AAErD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAKnE,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAA;IACzC,QAAQ,EAAE,WAAW,CAAA;IACrB,UAAU,EAAE,WAAW,EAAE,CAAA;IACzB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsLxC,CAAA"}
@@ -6,7 +6,7 @@ import { getTranslation } from '@payloadcms/translations';
6
6
  import { Button, Collapsible, ErrorPill, Pill, RenderComponent, RenderFields, SectionTitle, useDocumentInfo, useFormSubmitted, useTranslation } from '@payloadcms/ui';
7
7
  import { dequal } from 'dequal/lite';
8
8
  import { $getNodeByKey } from 'lexical';
9
- import React, { useCallback } from 'react';
9
+ import React, { useCallback, useEffect } from 'react';
10
10
  import { $isBlockNode } from '../nodes/BlocksNode.js';
11
11
  import { FormSavePlugin } from './FormSavePlugin.js';
12
12
  // Recursively remove all undefined values from even being present in formData, as they will
@@ -54,18 +54,14 @@ export const BlockContent = props => {
54
54
  getDocPreferences,
55
55
  setDocFieldPreferences
56
56
  } = useDocumentInfo();
57
- const [isCollapsed, setIsCollapsed] = React.useState(() => {
58
- let initialState = false;
57
+ const [isCollapsed, setIsCollapsed] = React.useState();
58
+ useEffect(() => {
59
59
  void getDocPreferences().then(currentDocPreferences => {
60
60
  const currentFieldPreferences = currentDocPreferences?.fields[field.name];
61
61
  const collapsedArray = currentFieldPreferences?.collapsed;
62
- if (collapsedArray && collapsedArray.includes(formData.id)) {
63
- initialState = true;
64
- setIsCollapsed(true);
65
- }
62
+ setIsCollapsed(collapsedArray ? collapsedArray.includes(formData.id) : false);
66
63
  });
67
- return initialState;
68
- });
64
+ }, [field.name, formData.id, getDocPreferences]);
69
65
  const hasSubmitted = useFormSubmitted();
70
66
  const [errorCount, setErrorCount] = React.useState(0);
71
67
  const fieldHasErrors = hasSubmitted && errorCount > 0;
@@ -131,6 +127,9 @@ export const BlockContent = props => {
131
127
  $getNodeByKey(nodeKey)?.remove();
132
128
  });
133
129
  }, [editor, nodeKey]);
130
+ if (typeof isCollapsed !== 'boolean') {
131
+ return null;
132
+ }
134
133
  return /*#__PURE__*/_jsxs(React.Fragment, {
135
134
  children: [/*#__PURE__*/_jsx(Collapsible, {
136
135
  className: classNames,
@@ -1 +1 @@
1
- {"version":3,"file":"BlockContent.js","names":["useLexicalComposerContext","getTranslation","Button","Collapsible","ErrorPill","Pill","RenderComponent","RenderFields","SectionTitle","useDocumentInfo","useFormSubmitted","useTranslation","dequal","$getNodeByKey","React","useCallback","$isBlockNode","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","_jsxs","Fragment","_jsx","className","collapsibleStyle","header","admin","components","Label","clientProps","blockKind","mappedComponent","pillStyle","labels","singular","slug","path","readOnly","count","withMessage","isEditable","buttonStyle","disabled","icon","onClick","e","preventDefault","round","tooltip","onToggle","incomingCollapsedState","forceRender","margins","onChange"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport 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'\n\nimport { $isBlockNode } from '../nodes/BlocksNode.js'\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 = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(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 || false} />\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"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"BlockContent.js","names":["useLexicalComposerContext","getTranslation","Button","Collapsible","ErrorPill","Pill","RenderComponent","RenderFields","SectionTitle","useDocumentInfo","useFormSubmitted","useTranslation","dequal","$getNodeByKey","React","useCallback","useEffect","$isBlockNode","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","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","_jsxs","Fragment","_jsx","className","collapsibleStyle","header","admin","components","Label","clientProps","blockKind","mappedComponent","pillStyle","labels","singular","slug","path","readOnly","count","withMessage","isEditable","buttonStyle","disabled","icon","onClick","e","preventDefault","round","tooltip","onToggle","incomingCollapsedState","forceRender","margins","onChange"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport 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, useEffect } from 'react'\n\nimport type { LexicalRichTextFieldProps } from '../../../../types.js'\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\n\nimport { $isBlockNode } from '../nodes/BlocksNode.js'\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\n useEffect(() => {\n void getDocPreferences().then((currentDocPreferences) => {\n const currentFieldPreferences = currentDocPreferences?.fields[field.name]\n const collapsedArray = currentFieldPreferences?.collapsed\n setIsCollapsed(collapsedArray ? collapsedArray.includes(formData.id) : false)\n })\n }, [field.name, formData.id, getDocPreferences])\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 = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(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 if (typeof isCollapsed !== 'boolean') {\n return null\n }\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 || false} />\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"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAQ3E,OAAO,cAAc,CAAA;AAyXrB,eAAO,MAAM,mBAAmB,EAAE,yBAAyB,CAAC,SAAS,CAIpE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAQ3E,OAAO,cAAc,CAAA;AAqXrB,eAAO,MAAM,mBAAmB,EAAE,yBAAyB,CAAC,SAAS,CAIpE,CAAA"}
@@ -278,15 +278,13 @@ function InlineToolbar({
278
278
  children: [/*#__PURE__*/_jsx("div", {
279
279
  className: "caret",
280
280
  ref: caretRef
281
- }), editor.isEditable() && /*#__PURE__*/_jsx(React.Fragment, {
282
- children: editorConfig?.features && editorConfig.features?.toolbarInline?.groups.map((group, i) => {
283
- return /*#__PURE__*/_jsx(ToolbarGroupComponent, {
284
- anchorElem: anchorElem,
285
- editor: editor,
286
- group: group,
287
- index: i
288
- }, group.key);
289
- })
281
+ }), editorConfig?.features && editorConfig.features?.toolbarInline?.groups.map((group, i) => {
282
+ return /*#__PURE__*/_jsx(ToolbarGroupComponent, {
283
+ anchorElem: anchorElem,
284
+ editor: editor,
285
+ group: group,
286
+ index: i
287
+ }, group.key);
290
288
  })]
291
289
  });
292
290
  }
@@ -348,7 +346,7 @@ function useInlineToolbar(editor, anchorElem) {
348
346
  }
349
347
  }));
350
348
  }, [editor, updatePopup]);
351
- if (!isText) {
349
+ if (!isText || !editor.isEditable()) {
352
350
  return null;
353
351
  }
354
352
  return /*#__PURE__*/createPortal( /*#__PURE__*/_jsx(InlineToolbar, {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","mergeRegister","$getSelection","$isRangeSelection","$isTextNode","COMMAND_PRIORITY_LOW","SELECTION_CHANGE_COMMAND","useCallback","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","getDOMRangeRect","setFloatingElemPosition","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","group","index","editorConfig","DropdownIcon","setDropdownIcon","t1","t2","type","items","length","undefined","t3","t4","activeItems","onActiveChange","t5","Icon","maxActiveItems","t6","map","item_0","t7","features","toolbarInline","_jsxs","className","children","groups","InlineToolbar","floatingToolbarRef","caretRef","closeFloatingToolbar","current","isOpacityZero","style","opacity","isPointerEventsNone","pointerEvents","mouseMoveListener","e","buttons","x","clientX","y","clientY","elementUnderMouse","document","elementFromPoint","contains","mouseUpListener","addEventListener","removeEventListener","$updateTextFormatFloatingToolbar","selection","nativeSelection","window","getSelection","possibleLinkEditor","querySelector","isLinkEditorVisible","rootElement","getRootElement","isCollapsed","anchorNode","rangeRect","offsetIfFlipped","alwaysDisplayOnTop","floatingElem","horizontalPosition","targetRect","anchorFlippedOffset","horizontalOffset","specialHandlingForCaret","verticalGap","scrollerElem","parentElement","update","getEditorState","read","registerUpdateListener","editorState","registerCommand","ref","isEditable","Fragment","i","useInlineToolbar","isText","setIsText","updatePopup","isComposing","getTextContent","nodes","getNodes","foundNodeWithText","node","rawTextContent","replace","registerRootListener","InlineToolbarPlugin"],"sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { mergeRegister } from '@lexical/utils'\nimport {\n $getSelection,\n $isRangeSelection,\n $isTextNode,\n COMMAND_PRIORITY_LOW,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getDOMRangeRect } from '../../../../../lexical/utils/getDOMRangeRect.js'\nimport { setFloatingElemPosition } from '../../../../../lexical/utils/setFloatingElemPosition.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n item: ToolbarGroupItem\n}): React.ReactNode {\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n )\n }\n if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton editor={editor} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n group,\n index,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { editorConfig } = useEditorConfigContext()\n\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC | undefined>()\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n return\n }\n const item = activeItems[0]\n setDropdownIcon(() => item.ChildComponent)\n },\n [group],\n )\n\n return (\n <div\n className={`inline-toolbar-popup__group inline-toolbar-popup__group-${group.key}`}\n key={group.key}\n >\n {group.type === 'dropdown' &&\n group.items.length &&\n (DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n maxActiveItems={1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n maxActiveItems={1}\n onActiveChange={onActiveChange}\n />\n ))}\n {group.type === 'buttons' &&\n group.items.length &&\n group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n })}\n {index < editorConfig.features.toolbarInline?.groups.length - 1 && (\n <div className=\"divider\" />\n )}\n </div>\n )\n}\n\nfunction InlineToolbar({\n anchorElem,\n editor,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n}): React.ReactNode {\n const floatingToolbarRef = useRef<HTMLDivElement | null>(null)\n const caretRef = useRef<HTMLDivElement | null>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const closeFloatingToolbar = useCallback(() => {\n if (floatingToolbarRef?.current) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n\n if (!isOpacityZero) {\n floatingToolbarRef.current.style.opacity = '0'\n }\n if (!isPointerEventsNone) {\n floatingToolbarRef.current.style.pointerEvents = 'none'\n }\n }\n }, [floatingToolbarRef])\n\n const mouseMoveListener = useCallback(\n (e: MouseEvent) => {\n if (floatingToolbarRef?.current && (e.buttons === 1 || e.buttons === 3)) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n if (!isOpacityZero || !isPointerEventsNone) {\n // Check if the mouse is not over the popup\n const x = e.clientX\n const y = e.clientY\n const elementUnderMouse = document.elementFromPoint(x, y)\n if (!floatingToolbarRef.current.contains(elementUnderMouse)) {\n // Mouse is not over the target element => not a normal click, but probably a drag\n closeFloatingToolbar()\n }\n }\n }\n },\n [closeFloatingToolbar],\n )\n\n const mouseUpListener = useCallback(() => {\n if (floatingToolbarRef?.current) {\n if (floatingToolbarRef.current.style.opacity !== '1') {\n floatingToolbarRef.current.style.opacity = '1'\n }\n if (floatingToolbarRef.current.style.pointerEvents !== 'auto') {\n floatingToolbarRef.current.style.pointerEvents = 'auto'\n }\n }\n }, [])\n\n useEffect(() => {\n document.addEventListener('mousemove', mouseMoveListener)\n document.addEventListener('mouseup', mouseUpListener)\n\n return () => {\n document.removeEventListener('mousemove', mouseMoveListener)\n document.removeEventListener('mouseup', mouseUpListener)\n }\n }, [floatingToolbarRef, mouseMoveListener, mouseUpListener])\n\n const $updateTextFormatFloatingToolbar = useCallback(() => {\n const selection = $getSelection()\n\n const nativeSelection = window.getSelection()\n\n if (floatingToolbarRef.current === null) {\n return\n }\n\n const possibleLinkEditor = anchorElem.querySelector(':scope > .link-editor')\n const isLinkEditorVisible =\n possibleLinkEditor !== null &&\n 'style' in possibleLinkEditor &&\n possibleLinkEditor?.style?.['opacity'] === '1'\n\n const rootElement = editor.getRootElement()\n if (\n selection !== null &&\n nativeSelection !== null &&\n !nativeSelection.isCollapsed &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const rangeRect = getDOMRangeRect(nativeSelection, rootElement)\n\n // Position floating toolbar\n const offsetIfFlipped = setFloatingElemPosition({\n alwaysDisplayOnTop: isLinkEditorVisible,\n anchorElem,\n floatingElem: floatingToolbarRef.current,\n horizontalPosition: 'center',\n targetRect: rangeRect,\n })\n\n // Position caret\n if (caretRef.current) {\n setFloatingElemPosition({\n anchorElem: floatingToolbarRef.current,\n anchorFlippedOffset: offsetIfFlipped,\n floatingElem: caretRef.current,\n horizontalOffset: 5,\n horizontalPosition: 'center',\n specialHandlingForCaret: true,\n targetRect: rangeRect,\n verticalGap: 8,\n })\n }\n } else {\n closeFloatingToolbar()\n }\n }, [editor, closeFloatingToolbar, anchorElem])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = () => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }\n\n window.addEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [editor, $updateTextFormatFloatingToolbar, anchorElem])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n $updateTextFormatFloatingToolbar()\n return false\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateTextFormatFloatingToolbar])\n\n return (\n <div className=\"inline-toolbar-popup\" ref={floatingToolbarRef}>\n <div className=\"caret\" ref={caretRef} />\n {editor.isEditable() && (\n <React.Fragment>\n {editorConfig?.features &&\n editorConfig.features?.toolbarInline?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n index={i}\n key={group.key}\n />\n )\n })}\n </React.Fragment>\n )}\n </div>\n )\n}\n\nfunction useInlineToolbar(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n): null | React.ReactElement {\n const [isText, setIsText] = useState(false)\n\n const updatePopup = useCallback(() => {\n editor.getEditorState().read(() => {\n // Should not to pop up the floating toolbar when using IME input\n if (editor.isComposing()) {\n return\n }\n const selection = $getSelection()\n const nativeSelection = window.getSelection()\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n (!$isRangeSelection(selection) ||\n rootElement === null ||\n !rootElement.contains(nativeSelection.anchorNode))\n ) {\n setIsText(false)\n return\n }\n\n if (!$isRangeSelection(selection)) {\n return\n }\n\n if (selection.getTextContent() !== '') {\n const nodes = selection.getNodes()\n let foundNodeWithText = false\n for (const node of nodes) {\n if ($isTextNode(node)) {\n setIsText(true)\n foundNodeWithText = true\n break\n }\n }\n if (!foundNodeWithText) {\n setIsText(false)\n }\n } else {\n setIsText(false)\n }\n\n const rawTextContent = selection.getTextContent().replace(/\\n/g, '')\n if (!selection.isCollapsed() && rawTextContent === '') {\n setIsText(false)\n return\n }\n })\n }, [editor])\n\n useEffect(() => {\n document.addEventListener('selectionchange', updatePopup)\n document.addEventListener('mouseup', updatePopup)\n return () => {\n document.removeEventListener('selectionchange', updatePopup)\n document.removeEventListener('mouseup', updatePopup)\n }\n }, [updatePopup])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(() => {\n updatePopup()\n }),\n editor.registerRootListener(() => {\n if (editor.getRootElement() === null) {\n setIsText(false)\n }\n }),\n )\n }, [editor, updatePopup])\n\n if (!isText) {\n return null\n }\n\n return createPortal(<InlineToolbar anchorElem={anchorElem} editor={editor} />, anchorElem)\n}\n\nexport const InlineToolbarPlugin: PluginComponentWithAnchor<undefined> = ({ anchorElem }) => {\n const [editor] = useLexicalComposerContext()\n\n return useInlineToolbar(editor, anchorElem)\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","mergeRegister","$getSelection","$isRangeSelection","$isTextNode","COMMAND_PRIORITY_LOW","SELECTION_CHANGE_COMMAND","useCallback","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","getDOMRangeRect","setFloatingElemPosition","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","group","index","editorConfig","DropdownIcon","setDropdownIcon","t1","t2","type","items","length","undefined","t3","t4","activeItems","onActiveChange","t5","Icon","maxActiveItems","t6","map","item_0","t7","features","toolbarInline","_jsxs","className","children","groups","InlineToolbar","floatingToolbarRef","caretRef","closeFloatingToolbar","current","isOpacityZero","style","opacity","isPointerEventsNone","pointerEvents","mouseMoveListener","e","buttons","x","clientX","y","clientY","elementUnderMouse","document","elementFromPoint","contains","mouseUpListener","addEventListener","removeEventListener","$updateTextFormatFloatingToolbar","selection","nativeSelection","window","getSelection","possibleLinkEditor","querySelector","isLinkEditorVisible","rootElement","getRootElement","isCollapsed","anchorNode","rangeRect","offsetIfFlipped","alwaysDisplayOnTop","floatingElem","horizontalPosition","targetRect","anchorFlippedOffset","horizontalOffset","specialHandlingForCaret","verticalGap","scrollerElem","parentElement","update","getEditorState","read","registerUpdateListener","editorState","registerCommand","ref","i","useInlineToolbar","isText","setIsText","updatePopup","isComposing","getTextContent","nodes","getNodes","foundNodeWithText","node","rawTextContent","replace","registerRootListener","isEditable","InlineToolbarPlugin"],"sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { mergeRegister } from '@lexical/utils'\nimport {\n $getSelection,\n $isRangeSelection,\n $isTextNode,\n COMMAND_PRIORITY_LOW,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getDOMRangeRect } from '../../../../../lexical/utils/getDOMRangeRect.js'\nimport { setFloatingElemPosition } from '../../../../../lexical/utils/setFloatingElemPosition.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n item: ToolbarGroupItem\n}): React.ReactNode {\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n )\n }\n if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton editor={editor} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n group,\n index,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { editorConfig } = useEditorConfigContext()\n\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC | undefined>()\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n return\n }\n const item = activeItems[0]\n setDropdownIcon(() => item.ChildComponent)\n },\n [group],\n )\n\n return (\n <div\n className={`inline-toolbar-popup__group inline-toolbar-popup__group-${group.key}`}\n key={group.key}\n >\n {group.type === 'dropdown' &&\n group.items.length &&\n (DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n maxActiveItems={1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n maxActiveItems={1}\n onActiveChange={onActiveChange}\n />\n ))}\n {group.type === 'buttons' &&\n group.items.length &&\n group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n })}\n {index < editorConfig.features.toolbarInline?.groups.length - 1 && (\n <div className=\"divider\" />\n )}\n </div>\n )\n}\n\nfunction InlineToolbar({\n anchorElem,\n editor,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n}): React.ReactNode {\n const floatingToolbarRef = useRef<HTMLDivElement | null>(null)\n const caretRef = useRef<HTMLDivElement | null>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const closeFloatingToolbar = useCallback(() => {\n if (floatingToolbarRef?.current) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n\n if (!isOpacityZero) {\n floatingToolbarRef.current.style.opacity = '0'\n }\n if (!isPointerEventsNone) {\n floatingToolbarRef.current.style.pointerEvents = 'none'\n }\n }\n }, [floatingToolbarRef])\n\n const mouseMoveListener = useCallback(\n (e: MouseEvent) => {\n if (floatingToolbarRef?.current && (e.buttons === 1 || e.buttons === 3)) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n if (!isOpacityZero || !isPointerEventsNone) {\n // Check if the mouse is not over the popup\n const x = e.clientX\n const y = e.clientY\n const elementUnderMouse = document.elementFromPoint(x, y)\n if (!floatingToolbarRef.current.contains(elementUnderMouse)) {\n // Mouse is not over the target element => not a normal click, but probably a drag\n closeFloatingToolbar()\n }\n }\n }\n },\n [closeFloatingToolbar],\n )\n\n const mouseUpListener = useCallback(() => {\n if (floatingToolbarRef?.current) {\n if (floatingToolbarRef.current.style.opacity !== '1') {\n floatingToolbarRef.current.style.opacity = '1'\n }\n if (floatingToolbarRef.current.style.pointerEvents !== 'auto') {\n floatingToolbarRef.current.style.pointerEvents = 'auto'\n }\n }\n }, [])\n\n useEffect(() => {\n document.addEventListener('mousemove', mouseMoveListener)\n document.addEventListener('mouseup', mouseUpListener)\n\n return () => {\n document.removeEventListener('mousemove', mouseMoveListener)\n document.removeEventListener('mouseup', mouseUpListener)\n }\n }, [floatingToolbarRef, mouseMoveListener, mouseUpListener])\n\n const $updateTextFormatFloatingToolbar = useCallback(() => {\n const selection = $getSelection()\n\n const nativeSelection = window.getSelection()\n\n if (floatingToolbarRef.current === null) {\n return\n }\n\n const possibleLinkEditor = anchorElem.querySelector(':scope > .link-editor')\n const isLinkEditorVisible =\n possibleLinkEditor !== null &&\n 'style' in possibleLinkEditor &&\n possibleLinkEditor?.style?.['opacity'] === '1'\n\n const rootElement = editor.getRootElement()\n if (\n selection !== null &&\n nativeSelection !== null &&\n !nativeSelection.isCollapsed &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const rangeRect = getDOMRangeRect(nativeSelection, rootElement)\n\n // Position floating toolbar\n const offsetIfFlipped = setFloatingElemPosition({\n alwaysDisplayOnTop: isLinkEditorVisible,\n anchorElem,\n floatingElem: floatingToolbarRef.current,\n horizontalPosition: 'center',\n targetRect: rangeRect,\n })\n\n // Position caret\n if (caretRef.current) {\n setFloatingElemPosition({\n anchorElem: floatingToolbarRef.current,\n anchorFlippedOffset: offsetIfFlipped,\n floatingElem: caretRef.current,\n horizontalOffset: 5,\n horizontalPosition: 'center',\n specialHandlingForCaret: true,\n targetRect: rangeRect,\n verticalGap: 8,\n })\n }\n } else {\n closeFloatingToolbar()\n }\n }, [editor, closeFloatingToolbar, anchorElem])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = () => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }\n\n window.addEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [editor, $updateTextFormatFloatingToolbar, anchorElem])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n $updateTextFormatFloatingToolbar()\n return false\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateTextFormatFloatingToolbar])\n\n return (\n <div className=\"inline-toolbar-popup\" ref={floatingToolbarRef}>\n <div className=\"caret\" ref={caretRef} />\n {editorConfig?.features &&\n editorConfig.features?.toolbarInline?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n index={i}\n key={group.key}\n />\n )\n })}\n </div>\n )\n}\n\nfunction useInlineToolbar(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n): null | React.ReactElement {\n const [isText, setIsText] = useState(false)\n\n const updatePopup = useCallback(() => {\n editor.getEditorState().read(() => {\n // Should not to pop up the floating toolbar when using IME input\n if (editor.isComposing()) {\n return\n }\n const selection = $getSelection()\n const nativeSelection = window.getSelection()\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n (!$isRangeSelection(selection) ||\n rootElement === null ||\n !rootElement.contains(nativeSelection.anchorNode))\n ) {\n setIsText(false)\n return\n }\n\n if (!$isRangeSelection(selection)) {\n return\n }\n\n if (selection.getTextContent() !== '') {\n const nodes = selection.getNodes()\n let foundNodeWithText = false\n for (const node of nodes) {\n if ($isTextNode(node)) {\n setIsText(true)\n foundNodeWithText = true\n break\n }\n }\n if (!foundNodeWithText) {\n setIsText(false)\n }\n } else {\n setIsText(false)\n }\n\n const rawTextContent = selection.getTextContent().replace(/\\n/g, '')\n if (!selection.isCollapsed() && rawTextContent === '') {\n setIsText(false)\n return\n }\n })\n }, [editor])\n\n useEffect(() => {\n document.addEventListener('selectionchange', updatePopup)\n document.addEventListener('mouseup', updatePopup)\n return () => {\n document.removeEventListener('selectionchange', updatePopup)\n document.removeEventListener('mouseup', updatePopup)\n }\n }, [updatePopup])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(() => {\n updatePopup()\n }),\n editor.registerRootListener(() => {\n if (editor.getRootElement() === null) {\n setIsText(false)\n }\n }),\n )\n }, [editor, updatePopup])\n\n if (!isText || !editor.isEditable()) {\n return null\n }\n\n return createPortal(<InlineToolbar anchorElem={anchorElem} editor={editor} />, anchorElem)\n}\n\nexport const InlineToolbarPlugin: PluginComponentWithAnchor<undefined> = ({ anchorElem }) => {\n const [editor] = useLexicalComposerContext()\n\n return useInlineToolbar(editor, anchorElem)\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/field/Field.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAG1C,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAA;AAC7E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAG5D,OAAO,eAAe,CAAA;AACtB,OAAO,cAAc,CAAA;AACrB,OAAO,mCAAmC,CAAA;AAI1C,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAC/B;IACE,QAAQ,CAAC,YAAY,EAAE,2BAA2B,CAAA;CACnD,GAAG,yBAAyB,CAqG9B,CAAA;AAaD,eAAO,MAAM,QAAQ,EAAE,OAAO,iBAAoD,CAAA"}
1
+ {"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/field/Field.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAG1C,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAA;AAC7E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAG5D,OAAO,eAAe,CAAA;AACtB,OAAO,cAAc,CAAA;AACrB,OAAO,mCAAmC,CAAA;AAI1C,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAC/B;IACE,QAAQ,CAAC,YAAY,EAAE,2BAA2B,CAAA;CACnD,GAAG,yBAAyB,CAyG9B,CAAA;AAaD,eAAO,MAAM,QAAQ,EAAE,OAAO,iBAAoD,CAAA"}
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
 
3
3
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
4
- import { FieldDescription, FieldError, FieldLabel, useField, useFieldProps, withCondition } from '@payloadcms/ui';
4
+ import { FieldDescription, FieldError, FieldLabel, useEditDepth, useField, useFieldProps, withCondition } from '@payloadcms/ui';
5
5
  import React, { useCallback } from 'react';
6
6
  import { ErrorBoundary } from 'react-error-boundary';
7
7
  import { LexicalProvider } from '../lexical/LexicalProvider.js';
@@ -33,6 +33,7 @@ const RichTextComponent = props => {
33
33
  const Error = components?.Error;
34
34
  const Label = components?.Label;
35
35
  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin;
36
+ const editDepth = useEditDepth();
36
37
  const memoizedValidate = useCallback((value, validationOptions) => {
37
38
  if (typeof validate === 'function') {
38
39
  return validate(value, {
@@ -66,6 +67,7 @@ const RichTextComponent = props => {
66
67
  } = fieldType;
67
68
  const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing;
68
69
  const classes = [baseClass, 'field-type', className, showError && 'error', disabled && `${baseClass}--read-only`, editorConfig?.admin?.hideGutter !== true ? `${baseClass}--show-gutter` : null].filter(Boolean).join(' ');
70
+ const pathWithEditDepth = `${path}.${editDepth}`;
69
71
  return /*#__PURE__*/_jsxs("div", {
70
72
  className: classes,
71
73
  style: {
@@ -88,6 +90,7 @@ const RichTextComponent = props => {
88
90
  fallbackRender: fallbackRender,
89
91
  onReset: () => {},
90
92
  children: /*#__PURE__*/_jsx(LexicalProvider, {
93
+ composerKey: pathWithEditDepth,
91
94
  editorConfig: editorConfig,
92
95
  field: field,
93
96
  onChange: editorState => {
@@ -102,7 +105,6 @@ const RichTextComponent = props => {
102
105
  }
103
106
  setValue(serializedEditorState);
104
107
  },
105
- path: path,
106
108
  readOnly: disabled,
107
109
  value: value_0
108
110
  }, JSON.stringify({
@@ -115,7 +117,7 @@ const RichTextComponent = props => {
115
117
  field: field
116
118
  })]
117
119
  })]
118
- }, path);
120
+ }, pathWithEditDepth);
119
121
  };
120
122
  function fallbackRender({
121
123
  error
@@ -1 +1 @@
1
- {"version":3,"file":"Field.js","names":["FieldDescription","FieldError","FieldLabel","useField","useFieldProps","withCondition","React","useCallback","ErrorBoundary","LexicalProvider","baseClass","RichTextComponent","props","descriptionProps","editorConfig","errorProps","field","name","_path","pathFromProps","admin","className","components","readOnly","readOnlyFromAdmin","style","width","required","labelProps","readOnlyFromTopLevelProps","validate","Description","Error","Label","readOnlyFromProps","memoizedValidate","value","validationOptions","path","pathFromContext","readOnlyFromContext","fieldType","formInitializing","formProcessing","initialValue","setValue","showError","disabled","classes","hideGutter","filter","Boolean","join","_jsxs","_jsx","CustomError","alignCaret","fallbackRender","onReset","onChange","editorState","serializedEditorState","toJSON","features","hooks","save","length","forEach","hook","incomingEditorState","JSON","stringify","error","role","color","message","RichText"],"sources":["../../src/field/Field.tsx"],"sourcesContent":["'use client'\nimport type { SerializedEditorState } from 'lexical'\n\nimport {\n FieldDescription,\n FieldError,\n FieldLabel,\n useField,\n useFieldProps,\n withCondition,\n} from '@payloadcms/ui'\nimport React, { useCallback } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\n\nimport type { SanitizedClientEditorConfig } from '../lexical/config/types.js'\nimport type { LexicalRichTextFieldProps } from '../types.js'\n\nimport { LexicalProvider } from '../lexical/LexicalProvider.js'\nimport './bundled.css'\nimport './index.scss'\nimport '../lexical/theme/EditorTheme.scss'\n\nconst baseClass = 'rich-text-lexical'\n\nconst RichTextComponent: React.FC<\n {\n readonly editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n } & LexicalRichTextFieldProps\n> = (props) => {\n const {\n descriptionProps,\n editorConfig,\n errorProps,\n field: {\n name,\n _path: pathFromProps,\n admin: { className, components, readOnly: readOnlyFromAdmin, style, width } = {},\n required,\n },\n field,\n labelProps,\n readOnly: readOnlyFromTopLevelProps,\n validate, // Users can pass in client side validation if they WANT to, but it's not required anymore\n } = props\n const Description = components?.Description\n const Error = components?.Error\n const Label = components?.Label\n const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n const memoizedValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, { ...validationOptions, props, required })\n }\n },\n // Important: do not add props to the dependencies array.\n // This would cause an infinite loop and endless re-rendering.\n // Removing props from the dependencies array fixed this issue: https://github.com/payloadcms/payload/issues/3709\n [validate, required],\n )\n const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n const fieldType = useField<SerializedEditorState>({\n path: pathFromContext ?? pathFromProps ?? name,\n // @ts-expect-error: TODO: Fix this\n validate: memoizedValidate,\n })\n\n const { formInitializing, formProcessing, initialValue, path, setValue, showError, value } =\n fieldType\n\n const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n disabled && `${baseClass}--read-only`,\n editorConfig?.admin?.hideGutter !== true ? `${baseClass}--show-gutter` : null,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <div\n className={classes}\n key={path}\n style={{\n ...style,\n width,\n }}\n >\n <FieldError\n CustomError={Error}\n path={path}\n {...(errorProps || {})}\n alignCaret=\"left\"\n field={field}\n />\n <FieldLabel Label={Label} {...(labelProps || {})} field={field} />\n <div className={`${baseClass}__wrap`}>\n <ErrorBoundary fallbackRender={fallbackRender} onReset={() => {}}>\n <LexicalProvider\n editorConfig={editorConfig}\n field={field}\n key={JSON.stringify({ initialValue, path })} // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)\n onChange={(editorState) => {\n let serializedEditorState = editorState.toJSON()\n\n // Transform state through save hooks\n if (editorConfig?.features?.hooks?.save?.length) {\n editorConfig.features.hooks.save.forEach((hook) => {\n serializedEditorState = hook({ incomingEditorState: serializedEditorState })\n })\n }\n\n setValue(serializedEditorState)\n }}\n path={path}\n readOnly={disabled}\n value={value}\n />\n </ErrorBoundary>\n <FieldDescription Description={Description} {...(descriptionProps || {})} field={field} />\n </div>\n </div>\n )\n}\n\nfunction fallbackRender({ error }): React.ReactElement {\n // Call resetErrorBoundary() to reset the error boundary and retry the render.\n\n return (\n <div className=\"errorBoundary\" role=\"alert\">\n <p>Something went wrong:</p>\n <pre style={{ color: 'red' }}>{error.message}</pre>\n </div>\n )\n}\n\nexport const RichText: typeof RichTextComponent = withCondition(RichTextComponent)\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Field.js","names":["FieldDescription","FieldError","FieldLabel","useEditDepth","useField","useFieldProps","withCondition","React","useCallback","ErrorBoundary","LexicalProvider","baseClass","RichTextComponent","props","descriptionProps","editorConfig","errorProps","field","name","_path","pathFromProps","admin","className","components","readOnly","readOnlyFromAdmin","style","width","required","labelProps","readOnlyFromTopLevelProps","validate","Description","Error","Label","readOnlyFromProps","editDepth","memoizedValidate","value","validationOptions","path","pathFromContext","readOnlyFromContext","fieldType","formInitializing","formProcessing","initialValue","setValue","showError","disabled","classes","hideGutter","filter","Boolean","join","pathWithEditDepth","_jsxs","_jsx","CustomError","alignCaret","fallbackRender","onReset","composerKey","onChange","editorState","serializedEditorState","toJSON","features","hooks","save","length","forEach","hook","incomingEditorState","JSON","stringify","error","role","color","message","RichText"],"sources":["../../src/field/Field.tsx"],"sourcesContent":["'use client'\nimport type { SerializedEditorState } from 'lexical'\n\nimport {\n FieldDescription,\n FieldError,\n FieldLabel,\n useEditDepth,\n useField,\n useFieldProps,\n withCondition,\n} from '@payloadcms/ui'\nimport React, { useCallback } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\n\nimport type { SanitizedClientEditorConfig } from '../lexical/config/types.js'\nimport type { LexicalRichTextFieldProps } from '../types.js'\n\nimport { LexicalProvider } from '../lexical/LexicalProvider.js'\nimport './bundled.css'\nimport './index.scss'\nimport '../lexical/theme/EditorTheme.scss'\n\nconst baseClass = 'rich-text-lexical'\n\nconst RichTextComponent: React.FC<\n {\n readonly editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n } & LexicalRichTextFieldProps\n> = (props) => {\n const {\n descriptionProps,\n editorConfig,\n errorProps,\n field: {\n name,\n _path: pathFromProps,\n admin: { className, components, readOnly: readOnlyFromAdmin, style, width } = {},\n required,\n },\n field,\n labelProps,\n readOnly: readOnlyFromTopLevelProps,\n validate, // Users can pass in client side validation if they WANT to, but it's not required anymore\n } = props\n const Description = components?.Description\n const Error = components?.Error\n const Label = components?.Label\n const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n const editDepth = useEditDepth()\n\n const memoizedValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, { ...validationOptions, props, required })\n }\n },\n // Important: do not add props to the dependencies array.\n // This would cause an infinite loop and endless re-rendering.\n // Removing props from the dependencies array fixed this issue: https://github.com/payloadcms/payload/issues/3709\n [validate, required],\n )\n const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n const fieldType = useField<SerializedEditorState>({\n path: pathFromContext ?? pathFromProps ?? name,\n // @ts-expect-error: TODO: Fix this\n validate: memoizedValidate,\n })\n\n const { formInitializing, formProcessing, initialValue, path, setValue, showError, value } =\n fieldType\n\n const disabled = readOnlyFromProps || readOnlyFromContext || formProcessing || formInitializing\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n disabled && `${baseClass}--read-only`,\n editorConfig?.admin?.hideGutter !== true ? `${baseClass}--show-gutter` : null,\n ]\n .filter(Boolean)\n .join(' ')\n\n const pathWithEditDepth = `${path}.${editDepth}`\n\n return (\n <div\n className={classes}\n key={pathWithEditDepth}\n style={{\n ...style,\n width,\n }}\n >\n <FieldError\n CustomError={Error}\n path={path}\n {...(errorProps || {})}\n alignCaret=\"left\"\n field={field}\n />\n <FieldLabel Label={Label} {...(labelProps || {})} field={field} />\n <div className={`${baseClass}__wrap`}>\n <ErrorBoundary fallbackRender={fallbackRender} onReset={() => {}}>\n <LexicalProvider\n composerKey={pathWithEditDepth}\n editorConfig={editorConfig}\n field={field}\n key={JSON.stringify({ initialValue, path })} // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)\n onChange={(editorState) => {\n let serializedEditorState = editorState.toJSON()\n\n // Transform state through save hooks\n if (editorConfig?.features?.hooks?.save?.length) {\n editorConfig.features.hooks.save.forEach((hook) => {\n serializedEditorState = hook({ incomingEditorState: serializedEditorState })\n })\n }\n\n setValue(serializedEditorState)\n }}\n readOnly={disabled}\n value={value}\n />\n </ErrorBoundary>\n <FieldDescription Description={Description} {...(descriptionProps || {})} field={field} />\n </div>\n </div>\n )\n}\n\nfunction fallbackRender({ error }): React.ReactElement {\n // Call resetErrorBoundary() to reset the error boundary and retry the render.\n\n return (\n <div className=\"errorBoundary\" role=\"alert\">\n <p>Something went wrong:</p>\n <pre style={{ color: 'red' }}>{error.message}</pre>\n </div>\n )\n}\n\nexport const RichText: typeof RichTextComponent = withCondition(RichTextComponent)\n"],"mappings":"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","ignoreList":[]}