zurfyx-lexical-react 0.39.1-nightly.20251225.0

package/npm/LexicalOnChangePlugin.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { EditorState, LexicalEditor } from 'lexical';
+export declare function OnChangePlugin({ ignoreHistoryMergeTagChange, ignoreSelectionChange, onChange, }: {
+    ignoreHistoryMergeTagChange?: boolean;
+    ignoreSelectionChange?: boolean;
+    onChange: (editorState: EditorState, editor: LexicalEditor, tags: Set<string>) => void;
+}): null;

package/npm/LexicalOnChangePlugin.dev.js

@@ -0,0 +1,72 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict';
+
+var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
+var lexical = require('lexical');
+var react = require('react');
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+
+// This workaround is no longer necessary in React 19,
+// but we currently support React >=17.x
+// https://github.com/facebook/react/pull/26395
+const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function OnChangePlugin({
+  ignoreHistoryMergeTagChange = true,
+  ignoreSelectionChange = false,
+  onChange
+}) {
+  const [editor] = LexicalComposerContext.useLexicalComposerContext();
+  useLayoutEffectImpl(() => {
+    if (onChange) {
+      return editor.registerUpdateListener(({
+        editorState,
+        dirtyElements,
+        dirtyLeaves,
+        prevEditorState,
+        tags
+      }) => {
+        if (ignoreSelectionChange && dirtyElements.size === 0 && dirtyLeaves.size === 0 || ignoreHistoryMergeTagChange && tags.has(lexical.HISTORY_MERGE_TAG) || prevEditorState.isEmpty()) {
+          return;
+        }
+        onChange(editorState, editor, tags);
+      });
+    }
+  }, [editor, ignoreHistoryMergeTagChange, ignoreSelectionChange, onChange]);
+  return null;
+}
+
+exports.OnChangePlugin = OnChangePlugin;

package/npm/LexicalOnChangePlugin.dev.mjs

@@ -0,0 +1,70 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { HISTORY_MERGE_TAG } from 'lexical';
+import { useLayoutEffect, useEffect } from 'react';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+
+// This workaround is no longer necessary in React 19,
+// but we currently support React >=17.x
+// https://github.com/facebook/react/pull/26395
+const useLayoutEffectImpl = CAN_USE_DOM ? useLayoutEffect : useEffect;
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function OnChangePlugin({
+  ignoreHistoryMergeTagChange = true,
+  ignoreSelectionChange = false,
+  onChange
+}) {
+  const [editor] = useLexicalComposerContext();
+  useLayoutEffectImpl(() => {
+    if (onChange) {
+      return editor.registerUpdateListener(({
+        editorState,
+        dirtyElements,
+        dirtyLeaves,
+        prevEditorState,
+        tags
+      }) => {
+        if (ignoreSelectionChange && dirtyElements.size === 0 && dirtyLeaves.size === 0 || ignoreHistoryMergeTagChange && tags.has(HISTORY_MERGE_TAG) || prevEditorState.isEmpty()) {
+          return;
+        }
+        onChange(editorState, editor, tags);
+      });
+    }
+  }, [editor, ignoreHistoryMergeTagChange, ignoreSelectionChange, onChange]);
+  return null;
+}
+
+export { OnChangePlugin };

package/npm/LexicalOnChangePlugin.js

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict'
+const LexicalOnChangePlugin = process.env.NODE_ENV !== 'production' ? require('./LexicalOnChangePlugin.dev.js') : require('./LexicalOnChangePlugin.prod.js');
+module.exports = LexicalOnChangePlugin;

package/npm/LexicalOnChangePlugin.js.flow

@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict
+ */
+
+import type {EditorState, LexicalEditor} from 'lexical';
+
+declare export function OnChangePlugin({
+  ignoreHistoryMergeTagChange?: boolean,
+  ignoreSelectionChange?: boolean,
+  onChange: (editorState: EditorState, editor: LexicalEditor, tags: Set<string>) => void,
+}): null;

package/npm/LexicalOnChangePlugin.mjs

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import * as modDev from './LexicalOnChangePlugin.dev.mjs';
+import * as modProd from './LexicalOnChangePlugin.prod.mjs';
+const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
+export const OnChangePlugin = mod.OnChangePlugin;

package/npm/LexicalOnChangePlugin.node.mjs

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const mod = await (process.env.NODE_ENV !== 'production' ? import('./LexicalOnChangePlugin.dev.mjs') : import('./LexicalOnChangePlugin.prod.mjs'));
+export const OnChangePlugin = mod.OnChangePlugin;

package/npm/LexicalOnChangePlugin.prod.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("lexical"),i=require("react");const r="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?i.useLayoutEffect:i.useEffect;exports.OnChangePlugin=function({ignoreHistoryMergeTagChange:i=!0,ignoreSelectionChange:n=!1,onChange:o}){const[a]=e.useLexicalComposerContext();return r(()=>{if(o)return a.registerUpdateListener(({editorState:e,dirtyElements:r,dirtyLeaves:s,prevEditorState:c,tags:u})=>{n&&0===r.size&&0===s.size||i&&u.has(t.HISTORY_MERGE_TAG)||c.isEmpty()||o(e,a,u)})},[a,i,n,o]),null};

package/npm/LexicalOnChangePlugin.prod.mjs

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{HISTORY_MERGE_TAG as t}from"lexical";import{useLayoutEffect as o,useEffect as i}from"react";const r="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?o:i;function n({ignoreHistoryMergeTagChange:o=!0,ignoreSelectionChange:i=!1,onChange:n}){const[a]=e();return r(()=>{if(n)return a.registerUpdateListener(({editorState:e,dirtyElements:r,dirtyLeaves:d,prevEditorState:s,tags:c})=>{i&&0===r.size&&0===d.size||o&&c.has(t)||s.isEmpty()||n(e,a,c)})},[a,o,i,n]),null}export{n as OnChangePlugin};

package/npm/LexicalPlainTextPlugin.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { JSX } from 'react';
+import { type ErrorBoundaryType } from './shared/LegacyDecorators';
+export declare function PlainTextPlugin({ contentEditable, placeholder, ErrorBoundary, }: {
+    contentEditable: JSX.Element;
+    placeholder?: ((isEditable: boolean) => null | JSX.Element) | null | JSX.Element;
+    ErrorBoundary: ErrorBoundaryType;
+}): JSX.Element;

package/npm/LexicalPlainTextPlugin.dev.js

@@ -0,0 +1,235 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict';
+
+var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
+var useLexicalEditable = require('@lexical/react/useLexicalEditable');
+var extension = require('@lexical/extension');
+var ReactProviderExtension = require('@lexical/react/ReactProviderExtension');
+var react = require('react');
+var reactDom = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
+var text = require('@lexical/text');
+var utils = require('@lexical/utils');
+var dragon = require('@lexical/dragon');
+var plainText = require('@lexical/plain-text');
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+// Do not require this module directly! Use normal `invariant` calls.
+
+function formatDevErrorMessage(message) {
+  throw new Error(message);
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+
+// This workaround is no longer necessary in React 19,
+// but we currently support React >=17.x
+// https://github.com/facebook/react/pull/26395
+const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function useDecorators(editor, ErrorBoundary) {
+  const [decorators, setDecorators] = react.useState(() => editor.getDecorators());
+
+  // Subscribe to changes
+  useLayoutEffectImpl(() => {
+    return editor.registerDecoratorListener(nextDecorators => {
+      reactDom.flushSync(() => {
+        setDecorators(nextDecorators);
+      });
+    });
+  }, [editor]);
+  react.useEffect(() => {
+    // If the content editable mounts before the subscription is added, then
+    // nothing will be rendered on initial pass. We can get around that by
+    // ensuring that we set the value.
+    setDecorators(editor.getDecorators());
+  }, [editor]);
+
+  // Return decorators defined as React Portals
+  return react.useMemo(() => {
+    const decoratedPortals = [];
+    const decoratorKeys = Object.keys(decorators);
+    for (let i = 0; i < decoratorKeys.length; i++) {
+      const nodeKey = decoratorKeys[i];
+      const reactDecorator = /*#__PURE__*/jsxRuntime.jsx(ErrorBoundary, {
+        onError: e => editor._onError(e),
+        children: /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
+          fallback: null,
+          children: decorators[nodeKey]
+        })
+      });
+      const element = editor.getElementByKey(nodeKey);
+      if (element !== null) {
+        decoratedPortals.push(/*#__PURE__*/reactDom.createPortal(reactDecorator, element, nodeKey));
+      }
+    }
+    return decoratedPortals;
+  }, [ErrorBoundary, decorators, editor]);
+}
+
+function isUsingReactExtension(editor) {
+  const builder = extension.LexicalBuilder.maybeFromEditor(editor);
+  if (builder && builder.hasExtensionByName(ReactProviderExtension.ReactProviderExtension.name)) {
+    for (const name of ['@lexical/plain-text', '@lexical/rich-text']) {
+      if (!!builder.hasExtensionByName(name)) {
+        formatDevErrorMessage(`LexicalBuilder: @lexical/react legacy text plugins conflict with the ${name} extension. Remove the legacy <RichTextPlugin/> or <PlainTextPlugin/> component.`);
+      }
+    }
+    return true;
+  }
+  return false;
+}
+function Decorators({
+  editor,
+  ErrorBoundary
+}) {
+  return useDecorators(editor, ErrorBoundary);
+}
+
+/**
+ * @internal
+ *
+ * When using @lexical/extension, the ReactProvider is expected to handle
+ * rendering decorators. This component allows RichTextPlugin and
+ * PlainTextPlugin to be used in extension projects that have not yet
+ * migrated to use RichTextExtension or PlainTextExtension.
+ **/
+function LegacyDecorators({
+  editor,
+  ErrorBoundary
+}) {
+  return isUsingReactExtension(editor) ? null : /*#__PURE__*/jsxRuntime.jsx(Decorators, {
+    editor: editor,
+    ErrorBoundary: ErrorBoundary
+  });
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function canShowPlaceholderFromCurrentEditorState(editor) {
+  const currentCanShowPlaceholder = editor.getEditorState().read(text.$canShowPlaceholderCurry(editor.isComposing()));
+  return currentCanShowPlaceholder;
+}
+function useCanShowPlaceholder(editor) {
+  const [canShowPlaceholder, setCanShowPlaceholder] = react.useState(() => canShowPlaceholderFromCurrentEditorState(editor));
+  useLayoutEffectImpl(() => {
+    function resetCanShowPlaceholder() {
+      const currentCanShowPlaceholder = canShowPlaceholderFromCurrentEditorState(editor);
+      setCanShowPlaceholder(currentCanShowPlaceholder);
+    }
+    resetCanShowPlaceholder();
+    return utils.mergeRegister(editor.registerUpdateListener(() => {
+      resetCanShowPlaceholder();
+    }), editor.registerEditableListener(() => {
+      resetCanShowPlaceholder();
+    }));
+  }, [editor]);
+  return canShowPlaceholder;
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function usePlainTextSetup(editor) {
+  useLayoutEffectImpl(() => {
+    return utils.mergeRegister(plainText.registerPlainText(editor), dragon.registerDragonSupport(editor));
+
+    // We only do this for init
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor]);
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+function PlainTextPlugin({
+  contentEditable,
+  // TODO Remove. This property is now part of ContentEditable
+  placeholder = null,
+  ErrorBoundary
+}) {
+  const [editor] = LexicalComposerContext.useLexicalComposerContext();
+  usePlainTextSetup(editor);
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [contentEditable, /*#__PURE__*/jsxRuntime.jsx(Placeholder, {
+      content: placeholder
+    }), /*#__PURE__*/jsxRuntime.jsx(LegacyDecorators, {
+      editor: editor,
+      ErrorBoundary: ErrorBoundary
+    })]
+  });
+}
+
+// TODO Remove
+function Placeholder({
+  content
+}) {
+  const [editor] = LexicalComposerContext.useLexicalComposerContext();
+  const showPlaceholder = useCanShowPlaceholder(editor);
+  const editable = useLexicalEditable.useLexicalEditable();
+  if (!showPlaceholder) {
+    return null;
+  }
+  if (typeof content === 'function') {
+    return content(editable);
+  } else {
+    return content;
+  }
+}
+
+exports.PlainTextPlugin = PlainTextPlugin;