@ekz/lexical-react 0.40.0

package/@ekz/lexicalTreeViewExtension.dev.mjs

@@ -0,0 +1,54 @@
+/**
+ * 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 '@ekz/lexical-react/LexicalComposerContext';
+import { TreeView } from '@ekz/lexical-react/LexicalTreeView';
+import { ReactExtension } from '@ekz/lexical-react/ReactExtension';
+import { useExtensionDependency } from '@ekz/lexical-react/useExtensionComponent';
+import { defineExtension } from '@ekz/lexical';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * 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 TreeViewExtensionComponent(props) {
+  const [editor] = useLexicalComposerContext();
+  return /*#__PURE__*/jsx(TreeView, {
+    editor: editor,
+    ...useExtensionDependency(TreeViewExtension).config,
+    ...props
+  });
+}
+const config = {
+  timeTravelButtonClassName: 'debug-timetravel-button',
+  timeTravelPanelButtonClassName: 'debug-timetravel-panel-button',
+  timeTravelPanelClassName: 'debug-timetravel-panel',
+  timeTravelPanelSliderClassName: 'debug-timetravel-panel-slider',
+  treeTypeButtonClassName: 'debug-treetype-button',
+  viewClassName: 'tree-view-output'
+};
+
+/**
+ * Provides a configured TreeView debugging tool (React dependent)
+ * as an output component with configurable class names.
+ */
+const TreeViewExtension = defineExtension({
+  build: () => ({
+    Component: TreeViewExtensionComponent
+  }),
+  config,
+  dependencies: [ReactExtension],
+  name: '@ekz/lexical-react/TreeView'
+});
+
+export { TreeViewExtension, TreeViewExtensionComponent };

package/@ekz/lexicalTreeViewExtension.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 @ekz/lexicalTreeViewExtension = process.env.NODE_ENV !== 'production' ? require('./@ekz/lexicalTreeViewExtension.dev.js') : require('./@ekz/lexicalTreeViewExtension.prod.js');
+module.exports = @ekz/lexicalTreeViewExtension;

package/@ekz/lexicalTreeViewExtension.mjs

@@ -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 * as modDev from './@ekz/lexicalTreeViewExtension.dev.mjs';
+import * as modProd from './@ekz/lexicalTreeViewExtension.prod.mjs';
+const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
+export const TreeViewExtension = mod.TreeViewExtension;
+export const TreeViewExtensionComponent = mod.TreeViewExtensionComponent;

package/@ekz/lexicalTreeViewExtension.node.mjs

@@ -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.
+ *
+ */
+
+const mod = await (process.env.NODE_ENV !== 'production' ? import('./@ekz/lexicalTreeViewExtension.dev.mjs') : import('./@ekz/lexicalTreeViewExtension.prod.mjs'));
+export const TreeViewExtension = mod.TreeViewExtension;
+export const TreeViewExtensionComponent = mod.TreeViewExtensionComponent;

package/@ekz/lexicalTreeViewExtension.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("@ekz/lexical-react/LexicalComposerContext"),t=require("@ekz/lexical-react/LexicalTreeView"),i=require("@ekz/lexical-react/ReactExtension"),n=require("@ekz/lexical-react/useExtensionComponent"),r=require("@ekz/lexical"),a=require("react/jsx-runtime");function l(i){const[r]=e.useLexicalComposerContext();return a.jsx(t.TreeView,{editor:r,...n.useExtensionDependency(o).config,...i})}const o=r.defineExtension({build:()=>({Component:l}),config:{timeTravelButtonClassName:"debug-timetravel-button",timeTravelPanelButtonClassName:"debug-timetravel-panel-button",timeTravelPanelClassName:"debug-timetravel-panel",timeTravelPanelSliderClassName:"debug-timetravel-panel-slider",treeTypeButtonClassName:"debug-treetype-button",viewClassName:"tree-view-output"},dependencies:[i.ReactExtension],name:"@ekz/lexical-react/TreeView"});exports.TreeViewExtension=o,exports.TreeViewExtensionComponent=l;

package/@ekz/lexicalTreeViewExtension.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"@ekz/lexical-react/LexicalComposerContext";import{TreeView as t}from"@ekz/lexical-react/LexicalTreeView";import{ReactExtension as a}from"@ekz/lexical-react/ReactExtension";import{useExtensionDependency as r}from"@ekz/lexical-react/useExtensionComponent";import{defineExtension as i}from"@ekz/lexical";import{jsx as l}from"react/jsx-runtime";function o(a){const[i]=e();return l(t,{editor:i,...r(n).config,...a})}const n=i({build:()=>({Component:o}),config:{timeTravelButtonClassName:"debug-timetravel-button",timeTravelPanelButtonClassName:"debug-timetravel-panel-button",timeTravelPanelClassName:"debug-timetravel-panel",timeTravelPanelSliderClassName:"debug-timetravel-panel-slider",treeTypeButtonClassName:"debug-treetype-button",viewClassName:"tree-view-output"},dependencies:[a],name:"@ekz/lexical-react/TreeView"});export{n as TreeViewExtension,o as TreeViewExtensionComponent};

package/ExtensionComponent.d.ts

@@ -0,0 +1,42 @@
+/**
+ * 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 { ComponentProps } from 'react';
+import { type AnyLexicalExtension, type LexicalExtensionOutput } from '@ekz/lexical';
+/**
+ * The lexical:extension prop combined with the props of the given Extension's
+ * output Component.
+ */
+export type ExtensionComponentProps<Extension extends AnyLexicalExtension> = {
+    /** The Extension */ 'lexical:extension': Extension;
+} & ([LexicalExtensionOutput<Extension>] extends [
+    {
+        Component: infer OutputComponentType extends React.ComponentType;
+    }
+] ? Omit<ComponentProps<OutputComponentType>, 'lexical:extension'> : never);
+/**
+ * A convenient way to get an Extension's output Component with {@link useExtensionComponent}
+ * and construct it in one step.
+ *
+ * @example
+ * Usage
+ * ```tsx
+ * return (
+ *   <ExtensionComponent
+ *     lexical:extension={TreeViewExtension}
+ *     viewClassName="tree-view-output" />
+ * );
+ * ```
+ *
+ * @example
+ * Alternative without ExtensionComponent
+ * ```tsx
+ * const TreeViewComponent = useExtensionComponent(TreeViewExtension);
+ * return (<TreeViewComponent viewClassName="tree-view-output" />);
+ * ```
+ */
+export declare function ExtensionComponent<Extension extends AnyLexicalExtension>({ 'lexical:extension': extension, ...props }: ExtensionComponentProps<Extension>): import("react/jsx-runtime").JSX.Element;

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Meta Platforms, Inc. and affiliates.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LexicalAutoEmbedPlugin.d.ts

@@ -0,0 +1,39 @@
+/**
+ * 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 { CommandListenerPriority, LexicalNode } from '@ekz/lexical';
+import type { JSX } from 'react';
+import { MenuOption, MenuRenderFn } from '@ekz/lexical-react/LexicalNodeMenuPlugin';
+import { LexicalCommand, LexicalEditor } from '@ekz/lexical';
+export type EmbedMatchResult<TEmbedMatchResult = unknown> = {
+    url: string;
+    id: string;
+    data?: TEmbedMatchResult;
+};
+export interface EmbedConfig<TEmbedMatchResultData = unknown, TEmbedMatchResult = EmbedMatchResult<TEmbedMatchResultData>> {
+    type: string;
+    parseUrl: (text: string) => Promise<TEmbedMatchResult | null> | TEmbedMatchResult | null;
+    insertNode: (editor: LexicalEditor, result: TEmbedMatchResult) => void;
+}
+export declare const URL_MATCHER: RegExp;
+export declare const INSERT_EMBED_COMMAND: LexicalCommand<EmbedConfig['type']>;
+export declare class AutoEmbedOption extends MenuOption {
+    title: string;
+    onSelect: (targetNode: LexicalNode | null) => void;
+    constructor(title: string, options: {
+        onSelect: (targetNode: LexicalNode | null) => void;
+    });
+}
+type LexicalAutoEmbedPluginProps<TEmbedConfig extends EmbedConfig> = {
+    embedConfigs: Array<TEmbedConfig>;
+    onOpenEmbedModalForConfig: (embedConfig: TEmbedConfig) => void;
+    getMenuOptions: (activeEmbedConfig: TEmbedConfig, embedFn: () => void, dismissFn: () => void) => Array<AutoEmbedOption>;
+    menuRenderFn: MenuRenderFn<AutoEmbedOption>;
+    menuCommandPriority?: CommandListenerPriority;
+};
+export declare function LexicalAutoEmbedPlugin<TEmbedConfig extends EmbedConfig>({ embedConfigs, onOpenEmbedModalForConfig, getMenuOptions, menuRenderFn, menuCommandPriority, }: LexicalAutoEmbedPluginProps<TEmbedConfig>): JSX.Element | null;
+export {};

package/LexicalAutoEmbedPlugin.dev.js

@@ -0,0 +1,146 @@
+/**
+ * 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 lexicalLink = require('@ekz/lexical-link');
+var LexicalComposerContext = require('@ekz/lexical-react/LexicalComposerContext');
+var LexicalNodeMenuPlugin = require('@ekz/lexical-react/LexicalNodeMenuPlugin');
+var lexicalUtils = require('@ekz/lexical-utils');
+var lexical = require('@ekz/lexical');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+/**
+ * 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 URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+const INSERT_EMBED_COMMAND = lexical.createCommand('INSERT_EMBED_COMMAND');
+class AutoEmbedOption extends LexicalNodeMenuPlugin.MenuOption {
+  title;
+  onSelect;
+  constructor(title, options) {
+    super(title);
+    this.title = title;
+    this.onSelect = options.onSelect.bind(this);
+  }
+}
+function LexicalAutoEmbedPlugin({
+  embedConfigs,
+  onOpenEmbedModalForConfig,
+  getMenuOptions,
+  menuRenderFn,
+  menuCommandPriority = lexical.COMMAND_PRIORITY_LOW
+}) {
+  const [editor] = LexicalComposerContext.useLexicalComposerContext();
+  const [nodeKey, setNodeKey] = react.useState(null);
+  const [activeEmbedConfig, setActiveEmbedConfig] = react.useState(null);
+  const reset = react.useCallback(() => {
+    setNodeKey(null);
+    setActiveEmbedConfig(null);
+  }, []);
+  const checkIfLinkNodeIsEmbeddable = react.useCallback(async key => {
+    const url = editor.getEditorState().read(function () {
+      const linkNode = lexical.$getNodeByKey(key);
+      if (lexicalLink.$isLinkNode(linkNode)) {
+        return linkNode.getURL();
+      }
+    });
+    if (url === undefined) {
+      return;
+    }
+    for (const embedConfig of embedConfigs) {
+      const urlMatch = await Promise.resolve(embedConfig.parseUrl(url));
+      if (urlMatch != null) {
+        setActiveEmbedConfig(embedConfig);
+        setNodeKey(key);
+      }
+    }
+  }, [editor, embedConfigs]);
+  react.useEffect(() => {
+    const listener = (nodeMutations, {
+      updateTags,
+      dirtyLeaves
+    }) => {
+      for (const [key, mutation] of nodeMutations) {
+        if (mutation === 'created' && updateTags.has(lexical.PASTE_TAG) && dirtyLeaves.size <= 3) {
+          checkIfLinkNodeIsEmbeddable(key);
+        } else if (key === nodeKey) {
+          reset();
+        }
+      }
+    };
+    return lexicalUtils.mergeRegister(...[lexicalLink.LinkNode, lexicalLink.AutoLinkNode].map(Klass => editor.registerMutationListener(Klass, (...args) => listener(...args), {
+      skipInitialization: true
+    })));
+  }, [checkIfLinkNodeIsEmbeddable, editor, embedConfigs, nodeKey, reset]);
+  react.useEffect(() => {
+    return editor.registerCommand(INSERT_EMBED_COMMAND, embedConfigType => {
+      const embedConfig = embedConfigs.find(({
+        type
+      }) => type === embedConfigType);
+      if (embedConfig) {
+        onOpenEmbedModalForConfig(embedConfig);
+        return true;
+      }
+      return false;
+    }, lexical.COMMAND_PRIORITY_EDITOR);
+  }, [editor, embedConfigs, onOpenEmbedModalForConfig]);
+  const embedLinkViaActiveEmbedConfig = react.useCallback(async function () {
+    if (activeEmbedConfig != null && nodeKey != null) {
+      const linkNode = editor.getEditorState().read(() => {
+        const node = lexical.$getNodeByKey(nodeKey);
+        if (lexicalLink.$isLinkNode(node)) {
+          return node;
+        }
+        return null;
+      });
+      if (lexicalLink.$isLinkNode(linkNode)) {
+        const result = await Promise.resolve(activeEmbedConfig.parseUrl(linkNode.__url));
+        if (result != null) {
+          editor.update(() => {
+            if (!lexical.$getSelection()) {
+              linkNode.selectEnd();
+            }
+            activeEmbedConfig.insertNode(editor, result);
+            if (linkNode.isAttached()) {
+              linkNode.remove();
+            }
+          });
+        }
+      }
+    }
+  }, [activeEmbedConfig, editor, nodeKey]);
+  const options = react.useMemo(() => {
+    return activeEmbedConfig != null && nodeKey != null ? getMenuOptions(activeEmbedConfig, embedLinkViaActiveEmbedConfig, reset) : [];
+  }, [activeEmbedConfig, embedLinkViaActiveEmbedConfig, getMenuOptions, nodeKey, reset]);
+  const onSelectOption = react.useCallback((selectedOption, targetNode, closeMenu) => {
+    editor.update(() => {
+      selectedOption.onSelect(targetNode);
+      closeMenu();
+    });
+  }, [editor]);
+  return nodeKey != null ? /*#__PURE__*/jsxRuntime.jsx(LexicalNodeMenuPlugin.LexicalNodeMenuPlugin, {
+    nodeKey: nodeKey,
+    onClose: reset,
+    onSelectOption: onSelectOption,
+    options: options,
+    menuRenderFn: menuRenderFn,
+    commandPriority: menuCommandPriority
+  }) : null;
+}
+
+exports.AutoEmbedOption = AutoEmbedOption;
+exports.INSERT_EMBED_COMMAND = INSERT_EMBED_COMMAND;
+exports.LexicalAutoEmbedPlugin = LexicalAutoEmbedPlugin;
+exports.URL_MATCHER = URL_MATCHER;

package/LexicalAutoEmbedPlugin.dev.mjs

@@ -0,0 +1,141 @@
+/**
+ * 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 { $isLinkNode, LinkNode, AutoLinkNode } from '@ekz/lexical-link';
+import { useLexicalComposerContext } from '@ekz/lexical-react/LexicalComposerContext';
+import { MenuOption, LexicalNodeMenuPlugin } from '@ekz/lexical-react/LexicalNodeMenuPlugin';
+import { mergeRegister } from '@ekz/lexical-utils';
+import { createCommand, $getNodeByKey, COMMAND_PRIORITY_EDITOR, $getSelection, COMMAND_PRIORITY_LOW, PASTE_TAG } from '@ekz/lexical';
+import { useState, useCallback, useEffect, useMemo } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * 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 URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+const INSERT_EMBED_COMMAND = createCommand('INSERT_EMBED_COMMAND');
+class AutoEmbedOption extends MenuOption {
+  title;
+  onSelect;
+  constructor(title, options) {
+    super(title);
+    this.title = title;
+    this.onSelect = options.onSelect.bind(this);
+  }
+}
+function LexicalAutoEmbedPlugin({
+  embedConfigs,
+  onOpenEmbedModalForConfig,
+  getMenuOptions,
+  menuRenderFn,
+  menuCommandPriority = COMMAND_PRIORITY_LOW
+}) {
+  const [editor] = useLexicalComposerContext();
+  const [nodeKey, setNodeKey] = useState(null);
+  const [activeEmbedConfig, setActiveEmbedConfig] = useState(null);
+  const reset = useCallback(() => {
+    setNodeKey(null);
+    setActiveEmbedConfig(null);
+  }, []);
+  const checkIfLinkNodeIsEmbeddable = useCallback(async key => {
+    const url = editor.getEditorState().read(function () {
+      const linkNode = $getNodeByKey(key);
+      if ($isLinkNode(linkNode)) {
+        return linkNode.getURL();
+      }
+    });
+    if (url === undefined) {
+      return;
+    }
+    for (const embedConfig of embedConfigs) {
+      const urlMatch = await Promise.resolve(embedConfig.parseUrl(url));
+      if (urlMatch != null) {
+        setActiveEmbedConfig(embedConfig);
+        setNodeKey(key);
+      }
+    }
+  }, [editor, embedConfigs]);
+  useEffect(() => {
+    const listener = (nodeMutations, {
+      updateTags,
+      dirtyLeaves
+    }) => {
+      for (const [key, mutation] of nodeMutations) {
+        if (mutation === 'created' && updateTags.has(PASTE_TAG) && dirtyLeaves.size <= 3) {
+          checkIfLinkNodeIsEmbeddable(key);
+        } else if (key === nodeKey) {
+          reset();
+        }
+      }
+    };
+    return mergeRegister(...[LinkNode, AutoLinkNode].map(Klass => editor.registerMutationListener(Klass, (...args) => listener(...args), {
+      skipInitialization: true
+    })));
+  }, [checkIfLinkNodeIsEmbeddable, editor, embedConfigs, nodeKey, reset]);
+  useEffect(() => {
+    return editor.registerCommand(INSERT_EMBED_COMMAND, embedConfigType => {
+      const embedConfig = embedConfigs.find(({
+        type
+      }) => type === embedConfigType);
+      if (embedConfig) {
+        onOpenEmbedModalForConfig(embedConfig);
+        return true;
+      }
+      return false;
+    }, COMMAND_PRIORITY_EDITOR);
+  }, [editor, embedConfigs, onOpenEmbedModalForConfig]);
+  const embedLinkViaActiveEmbedConfig = useCallback(async function () {
+    if (activeEmbedConfig != null && nodeKey != null) {
+      const linkNode = editor.getEditorState().read(() => {
+        const node = $getNodeByKey(nodeKey);
+        if ($isLinkNode(node)) {
+          return node;
+        }
+        return null;
+      });
+      if ($isLinkNode(linkNode)) {
+        const result = await Promise.resolve(activeEmbedConfig.parseUrl(linkNode.__url));
+        if (result != null) {
+          editor.update(() => {
+            if (!$getSelection()) {
+              linkNode.selectEnd();
+            }
+            activeEmbedConfig.insertNode(editor, result);
+            if (linkNode.isAttached()) {
+              linkNode.remove();
+            }
+          });
+        }
+      }
+    }
+  }, [activeEmbedConfig, editor, nodeKey]);
+  const options = useMemo(() => {
+    return activeEmbedConfig != null && nodeKey != null ? getMenuOptions(activeEmbedConfig, embedLinkViaActiveEmbedConfig, reset) : [];
+  }, [activeEmbedConfig, embedLinkViaActiveEmbedConfig, getMenuOptions, nodeKey, reset]);
+  const onSelectOption = useCallback((selectedOption, targetNode, closeMenu) => {
+    editor.update(() => {
+      selectedOption.onSelect(targetNode);
+      closeMenu();
+    });
+  }, [editor]);
+  return nodeKey != null ? /*#__PURE__*/jsx(LexicalNodeMenuPlugin, {
+    nodeKey: nodeKey,
+    onClose: reset,
+    onSelectOption: onSelectOption,
+    options: options,
+    menuRenderFn: menuRenderFn,
+    commandPriority: menuCommandPriority
+  }) : null;
+}
+
+export { AutoEmbedOption, INSERT_EMBED_COMMAND, LexicalAutoEmbedPlugin, URL_MATCHER };

package/LexicalAutoEmbedPlugin.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 LexicalAutoEmbedPlugin = process.env.NODE_ENV !== 'production' ? require('./LexicalAutoEmbedPlugin.dev.js') : require('./LexicalAutoEmbedPlugin.prod.js');
+module.exports = LexicalAutoEmbedPlugin;

package/LexicalAutoEmbedPlugin.js.flow

@@ -0,0 +1,64 @@
+/**
+ * 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 {LexicalNode, MutationListener} from '@ekz/lexical';
+
+import {MenuOption} from '@ekz/lexical-react/LexicalTypeaheadMenuPlugin';
+import type {LexicalCommand, LexicalEditor, NodeKey, TextNode} from '@ekz/lexical';
+import * as React from 'react';
+import {createCommand} from '@ekz/lexical';
+import type {MenuRenderFn} from './LexicalTypeaheadMenuPlugin';
+
+export type EmbedMatchResult = {
+  url: string,
+  id: string,
+};
+
+export interface EmbedConfig {
+  // Used to identify this config e.g. youtube, tweet, google-maps.
+  type: string;
+  // Determine if a given URL is a match and return url data.
+  parseUrl: (text: string) => EmbedMatchResult | null;
+  // Create the Lexical embed node from the url data.
+  insertNode: (editor: LexicalEditor, result: EmbedMatchResult) => void;
+}
+
+export const URL_MATCHER: RegExp =
+  /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+
+export const INSERT_EMBED_COMMAND: LexicalCommand<EmbedConfig['type']> =
+  createCommand('INSERT_EMBED_COMMAND');
+
+type LexicalAutoEmbedPluginProps<TEmbedConfig> = {
+  embedConfigs: Array<TEmbedConfig>,
+  onOpenEmbedModalForConfig: (embedConfig: TEmbedConfig) => void,
+  getMenuOptions: (
+    activeEmbedConfig: TEmbedConfig,
+    embedFn: () => void,
+    dismissFn: () => void,
+  ) => Array<AutoEmbedOption>,
+  menuRenderFn: MenuRenderFn<AutoEmbedOption>,
+};
+
+declare export class AutoEmbedOption extends MenuOption {
+  title: string;
+  icon: React.MixedElement;
+  onSelect: (targetNode: LexicalNode | null) => void;
+  constructor(
+    title: string,
+    options: {
+      icon: React.MixedElement,
+      onSelect: (targetNode: LexicalNode | null) => void,
+    },
+  ): void;
+}
+
+declare export function LexicalAutoEmbedPlugin<TEmbedConfig>(
+  LexicalAutoEmbedPluginProps<TEmbedConfig>,
+): React.MixedElement | null;

package/LexicalAutoEmbedPlugin.mjs

@@ -0,0 +1,15 @@
+/**
+ * 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 './LexicalAutoEmbedPlugin.dev.mjs';
+import * as modProd from './LexicalAutoEmbedPlugin.prod.mjs';
+const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
+export const AutoEmbedOption = mod.AutoEmbedOption;
+export const INSERT_EMBED_COMMAND = mod.INSERT_EMBED_COMMAND;
+export const LexicalAutoEmbedPlugin = mod.LexicalAutoEmbedPlugin;
+export const URL_MATCHER = mod.URL_MATCHER;

package/LexicalAutoEmbedPlugin.node.mjs

@@ -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.
+ *
+ */
+
+const mod = await (process.env.NODE_ENV !== 'production' ? import('./LexicalAutoEmbedPlugin.dev.mjs') : import('./LexicalAutoEmbedPlugin.prod.mjs'));
+export const AutoEmbedOption = mod.AutoEmbedOption;
+export const INSERT_EMBED_COMMAND = mod.INSERT_EMBED_COMMAND;
+export const LexicalAutoEmbedPlugin = mod.LexicalAutoEmbedPlugin;
+export const URL_MATCHER = mod.URL_MATCHER;

package/LexicalAutoEmbedPlugin.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("@ekz/lexical-link"),t=require("@ekz/lexical-react/LexicalComposerContext"),n=require("@ekz/lexical-react/LexicalNodeMenuPlugin"),o=require("@ekz/lexical-utils"),i=require("@ekz/lexical"),l=require("react"),r=require("react/jsx-runtime");const s=i.createCommand("INSERT_EMBED_COMMAND");class u extends n.MenuOption{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}exports.AutoEmbedOption=u,exports.INSERT_EMBED_COMMAND=s,exports.LexicalAutoEmbedPlugin=function({embedConfigs:u,onOpenEmbedModalForConfig:a,getMenuOptions:c,menuRenderFn:d,menuCommandPriority:m=i.COMMAND_PRIORITY_LOW}){const[p]=t.useLexicalComposerContext(),[x,C]=l.useState(null),[f,M]=l.useState(null),g=l.useCallback(()=>{C(null),M(null)},[]),E=l.useCallback(async t=>{const n=p.getEditorState().read(function(){const n=i.$getNodeByKey(t);if(e.$isLinkNode(n))return n.getURL()});if(void 0!==n)for(const e of u){null!=await Promise.resolve(e.parseUrl(n))&&(M(e),C(t))}},[p,u]);l.useEffect(()=>o.mergeRegister(...[e.LinkNode,e.AutoLinkNode].map(e=>p.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[o,l]of e)"created"===l&&t.has(i.PASTE_TAG)&&n.size<=3?E(o):o===x&&g()})(...e),{skipInitialization:!0}))),[E,p,u,x,g]),l.useEffect(()=>p.registerCommand(s,e=>{const t=u.find(({type:t})=>t===e);return!!t&&(a(t),!0)},i.COMMAND_PRIORITY_EDITOR),[p,u,a]);const k=l.useCallback(async function(){if(null!=f&&null!=x){const t=p.getEditorState().read(()=>{const t=i.$getNodeByKey(x);return e.$isLinkNode(t)?t:null});if(e.$isLinkNode(t)){const e=await Promise.resolve(f.parseUrl(t.__url));null!=e&&p.update(()=>{i.$getSelection()||t.selectEnd(),f.insertNode(p,e),t.isAttached()&&t.remove()})}}},[f,p,x]),N=l.useMemo(()=>null!=f&&null!=x?c(f,k,g):[],[f,k,c,x,g]),L=l.useCallback((e,t,n)=>{p.update(()=>{e.onSelect(t),n()})},[p]);return null!=x?r.jsx(n.LexicalNodeMenuPlugin,{nodeKey:x,onClose:g,onSelectOption:L,options:N,menuRenderFn:d,commandPriority:m}):null},exports.URL_MATCHER=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;

package/LexicalAutoEmbedPlugin.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{$isLinkNode as e,LinkNode as t,AutoLinkNode as n}from"@ekz/lexical-link";import{useLexicalComposerContext as o}from"@ekz/lexical-react/LexicalComposerContext";import{MenuOption as r,LexicalNodeMenuPlugin as i}from"@ekz/lexical-react/LexicalNodeMenuPlugin";import{mergeRegister as l}from"@ekz/lexical-utils";import{createCommand as s,$getNodeByKey as a,COMMAND_PRIORITY_EDITOR as c,$getSelection as u,COMMAND_PRIORITY_LOW as m,PASTE_TAG as d}from"@ekz/lexical";import{useState as p,useCallback as f,useEffect as x,useMemo as g}from"react";import{jsx as z}from"react/jsx-runtime";const w=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/,C=s("INSERT_EMBED_COMMAND");class S extends r{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}function k({embedConfigs:r,onOpenEmbedModalForConfig:s,getMenuOptions:w,menuRenderFn:S,menuCommandPriority:k=m}){const[y]=o(),[E,M]=p(null),[h,_]=p(null),v=f(()=>{M(null),_(null)},[]),A=f(async t=>{const n=y.getEditorState().read(function(){const n=a(t);if(e(n))return n.getURL()});if(void 0!==n)for(const e of r){null!=await Promise.resolve(e.parseUrl(n))&&(_(e),M(t))}},[y,r]);x(()=>l(...[t,n].map(e=>y.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[o,r]of e)"created"===r&&t.has(d)&&n.size<=3?A(o):o===E&&v()})(...e),{skipInitialization:!0}))),[A,y,r,E,v]),x(()=>y.registerCommand(C,e=>{const t=r.find(({type:t})=>t===e);return!!t&&(s(t),!0)},c),[y,r,s]);const L=f(async function(){if(null!=h&&null!=E){const t=y.getEditorState().read(()=>{const t=a(E);return e(t)?t:null});if(e(t)){const e=await Promise.resolve(h.parseUrl(t.__url));null!=e&&y.update(()=>{u()||t.selectEnd(),h.insertNode(y,e),t.isAttached()&&t.remove()})}}},[h,y,E]),P=g(()=>null!=h&&null!=E?w(h,L,v):[],[h,L,w,E,v]),b=f((e,t,n)=>{y.update(()=>{e.onSelect(t),n()})},[y]);return null!=E?z(i,{nodeKey:E,onClose:v,onSelectOption:b,options:P,menuRenderFn:S,commandPriority:k}):null}export{S as AutoEmbedOption,C as INSERT_EMBED_COMMAND,k as LexicalAutoEmbedPlugin,w as URL_MATCHER};

package/LexicalAutoFocusPlugin.d.ts

@@ -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.
+ *
+ */
+type Props = {
+    defaultSelection?: 'rootStart' | 'rootEnd';
+};
+export declare function AutoFocusPlugin({ defaultSelection }: Props): null;
+export {};