@infonomic/payload-alternative-lexical-editor 1.0.0

package/dist/field/lexical-before-change-populate-links.d.ts

@@ -0,0 +1,52 @@
+/**
+ * NOTE: The Payload Link Modal via /plugins/link-plugin-payload
+ * will only add the collection name (relationTo) and document id (value)
+ * to any 'internal' links placed in the editor. If we can add and
+ * save the title and slug, then there's no need populate the entire
+ * document relationship at any point in advance (like afterRead)
+ * since the frontend serializer will have everything it
+ * needs to create a link (router link or other). These are 'links'
+ * after all, and not requests for full document relationships.
+ *
+ * And so this hook will 'augment' the internal link - adding the
+ * title and slug to the link attributes retrieved during the
+ * beforeChange hook AND store this information in the document.
+ *
+ * NOTE: The above means that the slug and title for an internally
+ * related link will not update automatically if the source document's
+ * slug or title changes.
+ *
+ * TODO: We've hardcoded any node / plugins that have nested editors
+ * like the Admonition plugin and the captions in the InlineImage
+ * plugin. We should move these to configuration.
+ */
+import type { SerializedEditorState, SerializedLexicalNode } from 'lexical';
+import type { Payload, PayloadRequest, RequestContext, SanitizedCollectionConfig } from 'payload';
+import type { CollectionAlias } from '../types';
+type TypeWithID = {
+    id: string;
+};
+type BeforeChangeRichTextHookArgs<TData extends TypeWithID = any, TValue = any, TSiblingData = any> = {
+    data?: TData;
+    value?: TValue;
+    siblingData: TSiblingData;
+    context: RequestContext;
+    req: PayloadRequest;
+};
+type BaseRichTextHookArgs<TData extends TypeWithID = any, TValue = any, TSiblingData = any> = {
+    collection: null | SanitizedCollectionConfig;
+    data?: TData;
+    value?: TValue;
+    siblingData: TSiblingData;
+    context: RequestContext;
+    req: PayloadRequest;
+};
+type BeforeChangeRichTextHook<TData extends TypeWithID = any, TValue = any, TSiblingData = any> = (args: BeforeChangeRichTextHookArgs<TData, TValue, TSiblingData> & BaseRichTextHookArgs<TData, TValue, TSiblingData>) => Promise<TValue> | TValue;
+export declare const populateLexicalLinks: (args?: {
+    collectionAliases?: CollectionAlias[];
+}) => BeforeChangeRichTextHook<any, SerializedEditorState | null, any>;
+export declare function traverseLexicalField(payload: Payload, node: SerializedLexicalNode & {
+    children?: SerializedLexicalNode[];
+}, locale: string, collectionAliases?: CollectionAlias[]): Promise<SerializedLexicalNode>;
+export {};
+//# sourceMappingURL=lexical-before-change-populate-links.d.ts.map

package/dist/field/lexical-before-change-populate-links.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lexical-before-change-populate-links.d.ts","sourceRoot":"","sources":["../../src/field/lexical-before-change-populate-links.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAC3E,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAGjG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAW/C,KAAK,UAAU,GAAG;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,CAAA;AAEhC,KAAK,4BAA4B,CAC/B,KAAK,SAAS,UAAU,GAAG,GAAG,EAC9B,MAAM,GAAG,GAAG,EACZ,YAAY,GAAG,GAAG,IAChB;IACF,IAAI,CAAC,EAAE,KAAK,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,YAAY,CAAA;IACzB,OAAO,EAAE,cAAc,CAAA;IACvB,GAAG,EAAE,cAAc,CAAA;CACpB,CAAA;AAED,KAAK,oBAAoB,CAAC,KAAK,SAAS,UAAU,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,YAAY,GAAG,GAAG,IAAI;IAC5F,UAAU,EAAE,IAAI,GAAG,yBAAyB,CAAA;IAC5C,IAAI,CAAC,EAAE,KAAK,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd,WAAW,EAAE,YAAY,CAAA;IACzB,OAAO,EAAE,cAAc,CAAA;IACvB,GAAG,EAAE,cAAc,CAAA;CACpB,CAAA;AAED,KAAK,wBAAwB,CAAC,KAAK,SAAS,UAAU,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,YAAY,GAAG,GAAG,IAAI,CAChG,IAAI,EAAE,4BAA4B,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,GAC7D,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,KAChD,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAA;AAE7B,eAAO,MAAM,oBAAoB,GAC/B,OAAM;IAAE,iBAAiB,CAAC,EAAE,eAAe,EAAE,CAAA;CAAO,KACnD,wBAAwB,CAAC,GAAG,EAAE,qBAAqB,GAAG,IAAI,EAAE,GAAG,CAmBjE,CAAA;AAED,wBAAsB,oBAAoB,CACxC,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,qBAAqB,GAAG;IAAE,QAAQ,CAAC,EAAE,qBAAqB,EAAE,CAAA;CAAE,EACpE,MAAM,EAAE,MAAM,EACd,iBAAiB,CAAC,EAAE,eAAe,EAAE,GACpC,OAAO,CAAC,qBAAqB,CAAC,CAsFhC"}

package/dist/field/lexical-before-change-populate-links.js

@@ -0,0 +1,116 @@
+/**
+ * NOTE: The Payload Link Modal via /plugins/link-plugin-payload
+ * will only add the collection name (relationTo) and document id (value)
+ * to any 'internal' links placed in the editor. If we can add and
+ * save the title and slug, then there's no need populate the entire
+ * document relationship at any point in advance (like afterRead)
+ * since the frontend serializer will have everything it
+ * needs to create a link (router link or other). These are 'links'
+ * after all, and not requests for full document relationships.
+ *
+ * And so this hook will 'augment' the internal link - adding the
+ * title and slug to the link attributes retrieved during the
+ * beforeChange hook AND store this information in the document.
+ *
+ * NOTE: The above means that the slug and title for an internally
+ * related link will not update automatically if the source document's
+ * slug or title changes.
+ *
+ * TODO: We've hardcoded any node / plugins that have nested editors
+ * like the Admonition plugin and the captions in the InlineImage
+ * plugin. We should move these to configuration.
+ */
+import { loadRelated } from './utils/load-related';
+export const populateLexicalLinks = (args = {}) => {
+    const { collectionAliases } = args;
+    return async ({ collection, value, req }) => {
+        const { payload, locale } = req;
+        if (value == null) {
+            return null;
+        }
+        // console.log('populateLexicalLinks beforeChange collection', collection?.slug)
+        if (value?.root?.children != null) {
+            for (const childNode of value.root.children) {
+                await traverseLexicalField(payload, childNode, locale ?? '', collectionAliases);
+            }
+        }
+        return value;
+    };
+};
+export async function traverseLexicalField(payload, node, locale, collectionAliases) {
+    // We include inline-images here because they might contain captions
+    // that have links in them - and as with admonition below
+    // we want to save the slug and title to the relationship data attribute
+    // in our corresponding lexical node.
+    if (node.type === 'inline-image') {
+        const { caption } = node;
+        if (caption?.editorState?.root?.children != null) {
+            for (const childNode of caption.editorState.root.children) {
+                await traverseLexicalField(payload, childNode, locale, collectionAliases);
+            }
+        }
+    }
+    else if (node.type === 'admonition') {
+        const { content } = node;
+        if (content?.editorState?.root?.children != null) {
+            for (const childNode of content.editorState.root.children) {
+                await traverseLexicalField(payload, childNode, locale, collectionAliases);
+            }
+        }
+    }
+    else if (
+    // We've found an internal link, and so go ahead and lookup the
+    // relationship, and then add id, title and slug to the node data.
+    // We do this because this is all the front-end client needs to
+    // to create a link. We don't need to attach, or use an afterRead
+    // hook, or any other form of 'populate' to retrieve and attach
+    // an entire document to a link in the editor.
+    node.type === 'link' &&
+        node.attributes.linkType != null &&
+        node.attributes.linkType === 'internal') {
+        const { attributes } = node;
+        if (attributes?.doc?.value != null && attributes?.doc?.relationTo != null) {
+            const relation = await loadRelated(payload, attributes.doc.value, attributes.doc.relationTo, 1, locale);
+            if (relation != null) {
+                // I think these are the only properties we need to build a
+                // link on the client - id, title, and slug. The collection slug is
+                // already part of attributes?.doc?.relationTo
+                // and so this should be everything that's needed whether building
+                // a complete URL, or a framework router link.
+                // NOTE: This is unique to our requirements, as we sometimes have
+                // titles that contain rich text - for scientific names and italics
+                // etc. So we'll check here to see if there was an unformatted
+                // title - which in most cases there will not be - but still....
+                // TODO: collection-based strategy for any special extra data required
+                const { id, title, slug, area, titleUnformatted } = relation;
+                // NOTE: We sometimes create collections that have a 'real name' and slug,
+                // like 'publications', but want to expose the links we create to collection
+                // items via a front-end route (or alias) - for example 'library', instead
+                // of the collection slug 'publications'. And so we check here if there is a
+                // custom collection alias and if so, add it to our data object.
+                const collectionAlias = collectionAliases?.find((item) => item.slug === attributes?.doc?.relationTo);
+                // console.log(collectionAlias)
+                if (collectionAlias != null) {
+                    attributes.doc.data = {
+                        id,
+                        title: titleUnformatted ?? title,
+                        slug,
+                        area,
+                        collectionAlias: collectionAlias?.alias,
+                    };
+                }
+                else {
+                    attributes.doc.data = { id, title: titleUnformatted ?? title, slug, area };
+                }
+            }
+        }
+    }
+    // Run for its children
+    if (node.children != null && node.children.length > 0) {
+        for (const childNode of node.children) {
+            await traverseLexicalField(payload, childNode, locale, collectionAliases);
+        }
+    }
+    return node;
+}
+//# sourceMappingURL=lexical-before-change-populate-links.js.map

package/dist/field/lexical-before-change-populate-links.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lexical-before-change-populate-links.js","sourceRoot":"","sources":["../../src/field/lexical-before-change-populate-links.ts"],"names":[],"mappings":"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"}

package/dist/field/nodes/admonition-node/admonition-node-component.css

@@ -0,0 +1,115 @@
+.LexicalEditor__admonition .Admonition__container {
+  position: relative;
+  margin-top: 0.5rem;
+  margin-bottom: 1.5rem;
+  padding: 8px;
+  border: solid 1px #666666;
+  border-radius: 2px;
+}
+
+.LexicalEditor__admonition .Admonition__container.focused {
+  outline: 2px solid rgb(60, 132, 244);
+  /* user-select: none; */
+}
+
+.LexicalEditor__admonition .Admonition__container .admonition-edit-button {
+  display: block;
+  position: absolute;
+  z-index: 1;
+  font-size: 0.9rem;
+  top: 8px;
+  right: 12px;
+  padding: 3px 4px;
+  margin: 0 auto;
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  border-radius: 5px;
+  background-color: rgba(0, 0, 0, 0.5);
+  min-width: 60px;
+  color: #fff;
+  cursor: pointer;
+  user-select: none;
+}
+
+.LexicalEditor__admonition .Admonition__container .admonition-edit-button:hover {
+  background-color: rgba(60, 132, 244, 0.5);
+}
+
+.LexicalEditor__admonition .AdmonitionNode__header {
+  display: flex;
+  align-items: center;
+  font-weight: bold;
+  font-size: 1.5rem;
+  margin-bottom: 0.75rem;
+}
+
+.LexicalEditor__admonition .AdmonitionNode__content {
+  position: relative;
+}
+
+.LexicalEditor__admonition .AdmonitionNode__contentEditable {
+  display: block;
+  position: relative;
+  background-color: #f4f4f4;
+  min-width: 100%;
+  color: #000;
+  overflow: hidden;
+}
+
+.LexicalEditor__admonition .AdmonitionNode__contentEditable .tree-view-output {
+  margin: 0;
+  border-radius: 0;
+}
+
+.LexicalEditor__admonition .admonition-content-button:hover {
+  background-color: rgba(60, 132, 244, 0.5);
+}
+
+.LexicalEditor__admonition .AdmonitionNode__contentEditable {
+  min-height: 20px;
+  border: 0px;
+  resize: none;
+  cursor: text;
+  caret-color: rgb(5, 5, 5);
+  display: block;
+  position: relative;
+  tab-size: 1;
+  outline: 0px;
+  padding: 10px;
+  user-select: text;
+  font-size: 16px;
+  line-height: 1.4em;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.AdmonitionNode__contentEditable p {
+  margin-bottom: 0.25em;
+}
+
+.Admonition__placeholder {
+  font-size: 12px;
+  color: #888;
+  overflow: hidden;
+  position: absolute;
+  text-overflow: ellipsis;
+  top: 10px;
+  left: 10px;
+  right: unset;
+  user-select: none;
+  white-space: nowrap;
+  display: inline-block;
+  pointer-events: none;
+}
+
+html[data-theme="dark"] .AdmonitionNode__contentEditable {
+  color: #eeeeee;
+  caret-color: auto;
+}
+
+html[data-theme="dark"] .LexicalEditor__admonition .AdmonitionNode__contentEditable {
+  background-color: #222222;
+}
+
+html[data-theme="dark"] .AdmonitionNode__placeholder {
+  color: #888;
+}

package/dist/field/nodes/admonition-node/admonition-node-component.d.ts

@@ -0,0 +1,11 @@
+import type * as React from 'react';
+import type { LexicalEditor, NodeKey } from 'lexical';
+import type { AdmonitionType } from './types';
+import './admonition-node-component.css';
+export default function AdmonitionNodeComponent({ admonitionType, title, content, nodeKey, }: {
+    admonitionType: AdmonitionType;
+    title: string;
+    content: LexicalEditor;
+    nodeKey: NodeKey;
+}): React.JSX.Element;
+//# sourceMappingURL=admonition-node-component.d.ts.map

package/dist/field/nodes/admonition-node/admonition-node-component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"admonition-node-component.d.ts","sourceRoot":"","sources":["../../../../src/field/nodes/admonition-node/admonition-node-component.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAanC,OAAO,KAAK,EAAiB,aAAa,EAAE,OAAO,EAAiC,MAAM,SAAS,CAAA;AA4BnG,OAAO,KAAK,EAAwB,cAAc,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,iCAAiC,CAAA;AASxC,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,cAAc,EACd,KAAK,EACL,OAAO,EACP,OAAO,GACR,EAAE;IACD,cAAc,EAAE,cAAc,CAAA;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,aAAa,CAAA;IACtB,OAAO,EAAE,OAAO,CAAA;CACjB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAkNpB"}

package/dist/field/nodes/admonition-node/admonition-node-component.js

@@ -0,0 +1,157 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Suspense, useCallback, useEffect, useRef, useState } from 'react';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';
+import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
+import { LexicalNestedComposer } from '@lexical/react/LexicalNestedComposer';
+import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';
+import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection';
+import { mergeRegister } from '@lexical/utils';
+import { formatDrawerSlug, useEditDepth, useModal } from '@payloadcms/ui';
+import cx from 'classnames';
+import { $getNodeByKey, $getSelection, $isNodeSelection, $setSelection, COMMAND_PRIORITY_LOW, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, KEY_ENTER_COMMAND, KEY_ESCAPE_COMMAND, SELECTION_CHANGE_COMMAND, } from 'lexical';
+import { useEditorConfig } from '../../config/editor-config-context';
+import { APPLY_VALUE_TAG } from '../../constants';
+import { useSharedHistoryContext } from '../../context/shared-history-context';
+import { useSharedOnChange } from '../../context/shared-on-change-context';
+import { AdmonitionDrawer } from '../../plugins/admonition-plugin/admonition-drawer';
+import { FloatingTextFormatToolbarPlugin } from '../../plugins/floating-text-format-toolbar-plugin/index';
+import { LinkPlugin } from '../../plugins/link-plugin/link';
+import { FloatingLinkEditorPlugin } from '../../plugins/link-plugin/link/floating-link-editor';
+import { ContentEditable } from '../../ui/content-editable';
+import { Placeholder } from '../../ui/placeholder';
+import { $isAdmonitionNode } from './admonition-node';
+import { DangerIcon, NoteIcon, TipIcon, WarningIcon } from './icons';
+import './admonition-node-component.css';
+const icons = {
+    note: NoteIcon,
+    tip: TipIcon,
+    warning: WarningIcon,
+    danger: DangerIcon,
+};
+export default function AdmonitionNodeComponent({ admonitionType, title, content, nodeKey, }) {
+    const [editor] = useLexicalComposerContext();
+    const editDepth = useEditDepth();
+    const buttonRef = useRef(null);
+    const { historyState } = useSharedHistoryContext();
+    const [isSelected, setSelected, _clearSelection] = useLexicalNodeSelection(nodeKey);
+    const [selection, setSelection] = useState(null);
+    const { uuid } = useEditorConfig();
+    const { onChange } = useSharedOnChange();
+    const editorState = editor.getEditorState();
+    const activeEditorRef = useRef(null);
+    const node = editorState.read(() => $getNodeByKey(nodeKey));
+    const _debugTagLogCountRef = useRef(0);
+    const { toggleModal = () => {
+        console.error('Error: useModal() from FacelessUI did not work correctly');
+    }, closeModal, isModalOpen, } = useModal();
+    // NOTE: set the slug suffix to the document ID so that
+    // each image in the editor gets its own slug and modal
+    const admonitionDrawerSlug = formatDrawerSlug({
+        slug: `admonition-update-${nodeKey}`,
+        depth: editDepth,
+    });
+    const onDelete = useCallback((payload) => {
+        if (isSelected && $isNodeSelection($getSelection())) {
+            const event = payload;
+            event.preventDefault();
+            const node = $getNodeByKey(nodeKey);
+            if ($isAdmonitionNode(node)) {
+                node?.remove();
+            }
+            setSelected(false);
+        }
+        return false;
+    }, [isSelected, nodeKey, setSelected]);
+    const onEnter = useCallback((event) => {
+        const latestSelection = $getSelection();
+        if (isSelected &&
+            $isNodeSelection(latestSelection) &&
+            latestSelection.getNodes().length === 1) {
+            $setSelection(null);
+            event.preventDefault();
+            content.focus();
+            return true;
+        }
+        return false;
+    }, [content, isSelected]);
+    const onEscape = useCallback((event) => {
+        if (activeEditorRef.current === content || buttonRef.current === event.target) {
+            $setSelection(null);
+            editor.update(() => {
+                setSelected(true);
+                const parentRootElement = editor.getRootElement();
+                if (parentRootElement !== null) {
+                    parentRootElement.focus();
+                }
+            });
+            return true;
+        }
+        return false;
+    }, [content, editor, setSelected]);
+    useEffect(() => {
+        let isMounted = true;
+        const unregister = mergeRegister(editor.registerUpdateListener(({ editorState }) => {
+            if (isMounted) {
+                setSelection(editorState.read(() => $getSelection()));
+            }
+        }), editor.registerCommand(SELECTION_CHANGE_COMMAND, (_, activeEditor) => {
+            activeEditorRef.current = activeEditor;
+            return false;
+        }, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_DELETE_COMMAND, onDelete, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_BACKSPACE_COMMAND, onDelete, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_ENTER_COMMAND, onEnter, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_ESCAPE_COMMAND, onEscape, COMMAND_PRIORITY_LOW));
+        return () => {
+            isMounted = false;
+            unregister();
+        };
+    }, [editor, onDelete, onEnter, onEscape]);
+    const draggable = isSelected && $isNodeSelection(selection);
+    const isFocused = isSelected;
+    const handleToggleModal = () => {
+        if (uuid != null) {
+            toggleModal(admonitionDrawerSlug);
+        }
+    };
+    const handleUpdateAdmonition = ({ admonitionType, title }) => {
+        closeModal(admonitionDrawerSlug);
+        if (title != null && admonitionType != null) {
+            const admonitionPayload = {
+                admonitionType,
+                title,
+            };
+            editor.update(() => {
+                node.update(admonitionPayload);
+            });
+        }
+        else {
+            console.error('Error: unable to find image source from document.');
+        }
+    };
+    const classNames = cx('Admonition__container', { focused: isFocused }, { draggable: $isNodeSelection(selection) });
+    const Icon = icons[admonitionType];
+    return (_jsxs(Suspense, { fallback: null, children: [_jsxs("div", { draggable: draggable, className: classNames, children: [_jsx("button", { type: "button", className: "admonition-edit-button", ref: buttonRef, onClick: handleToggleModal, children: "Edit" }), _jsxs("div", { className: "AdmonitionNode__header", children: [_jsx(Icon, {}), _jsx("div", { children: title })] }), _jsx("div", { className: "AdmonitionNode__content", children: _jsxs(LexicalNestedComposer, { initialEditor: content, children: [_jsx(OnChangePlugin, { ignoreSelectionChange: true, onChange: (_nestedEditorState, _nestedEditor, nestedTags) => {
+                                        if (process.env.NODE_ENV === 'production' && _debugTagLogCountRef.current < 10) {
+                                            _debugTagLogCountRef.current++;
+                                            // eslint-disable-next-line no-console
+                                            console.log('[lexical][nested][admonition] tags', Array.from(nestedTags));
+                                        }
+                                        if (nestedTags.has(APPLY_VALUE_TAG))
+                                            return;
+                                        if (nestedTags.has('focus') && nestedTags.size === 1)
+                                            return;
+                                        // Note: Shared 'onChange' context provider so that
+                                        // caption change events can be registered with the parent
+                                        // editor - in turn triggering the parent editor onChange
+                                        // event, and therefore updating editorState and the field
+                                        // value in Payload (Save Draft and Publish Changes will then
+                                        // become 'enabled' from the caption as well as the parent
+                                        // editor content.)
+                                        // Parent editor state - not the LexicalNestedComposer in this case
+                                        // although there are other ways that this could be used.
+                                        const editorState = editor.getEditorState();
+                                        if (onChange != null)
+                                            onChange(editorState, editor, nestedTags);
+                                    } }), _jsx(LinkPlugin, {}), _jsx(FloatingLinkEditorPlugin, {}), _jsx(FloatingTextFormatToolbarPlugin, {}), _jsx(HistoryPlugin, { externalHistoryState: historyState }), _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "AdmonitionNode__contentEditable" }), placeholder: _jsx(Placeholder, { className: "Admonition__placeholder", children: "Enter some text..." }), ErrorBoundary: LexicalErrorBoundary })] }) })] }), uuid != null && uuid.length > 0 && (_jsx(AdmonitionDrawer, { isOpen: isModalOpen(admonitionDrawerSlug), drawerSlug: admonitionDrawerSlug, onSubmit: handleUpdateAdmonition, data: { title, admonitionType } }))] }));
+}
+//# sourceMappingURL=admonition-node-component.js.map

package/dist/field/nodes/admonition-node/admonition-node-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admonition-node-component.js","sourceRoot":"","sources":["../../../../src/field/nodes/admonition-node/admonition-node-component.tsx"],"names":[],"mappings":"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"}

package/dist/field/nodes/admonition-node/admonition-node.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import type { DOMConversionMap, DOMExportOutput, EditorConfig, LexicalEditor, LexicalNode, NodeKey } from 'lexical';
+import { DecoratorNode } from 'lexical';
+import type { AdmonitionAttributes, AdmonitionType, SerializedAdmonitionNode } from './types';
+export declare class AdmonitionNode extends DecoratorNode<React.JSX.Element> {
+    __admonitionType: AdmonitionType;
+    __title: string;
+    __content: LexicalEditor;
+    static getType(): string;
+    static clone(node: AdmonitionNode): AdmonitionNode;
+    static importJSON(serializedNode: SerializedAdmonitionNode): AdmonitionNode;
+    static importDOM(): DOMConversionMap | null;
+    constructor(admonitionType: AdmonitionType, title: string, content?: LexicalEditor, key?: NodeKey);
+    exportDOM(): DOMExportOutput;
+    exportJSON(): SerializedAdmonitionNode;
+    isInline(): false;
+    getTitle(): string;
+    setTitle(title: string): void;
+    getAdmonitionType(): AdmonitionType;
+    setAdmonitionType(admonitionType: AdmonitionType): void;
+    update(payload: AdmonitionAttributes): void;
+    createDOM(config: EditorConfig): HTMLElement;
+    updateDOM(prevNode: AdmonitionNode, dom: HTMLElement, config: EditorConfig): boolean;
+    decorate(): React.JSX.Element;
+}
+export declare function $createAdmonitionNode({ admonitionType, title, content, key, }: AdmonitionAttributes): AdmonitionNode;
+export declare function $isAdmonitionNode(node: LexicalNode | null | undefined): node is AdmonitionNode;
+//# sourceMappingURL=admonition-node.d.ts.map

package/dist/field/nodes/admonition-node/admonition-node.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"admonition-node.d.ts","sourceRoot":"","sources":["../../../../src/field/nodes/admonition-node/admonition-node.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EACV,gBAAgB,EAEhB,eAAe,EACf,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACR,MAAM,SAAS,CAAA;AAChB,OAAO,EAAuC,aAAa,EAAE,MAAM,SAAS,CAAA;AAG5E,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAc7F,qBAAa,cAAe,SAAQ,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IAClE,gBAAgB,EAAE,cAAc,CAAA;IAChC,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,aAAa,CAAA;IAExB,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,cAAc,GAAG,cAAc;IAIlD,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,wBAAwB,GAAG,cAAc;IAoB3E,MAAM,CAAC,SAAS,IAAI,gBAAgB,GAAG,IAAI;gBAUzC,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,MAAM,EACb,OAAO,CAAC,EAAE,aAAa,EACvB,GAAG,CAAC,EAAE,OAAO;IAQf,SAAS,IAAI,eAAe;IAO5B,UAAU,IAAI,wBAAwB;IAUtC,QAAQ,IAAI,KAAK;IAIjB,QAAQ,IAAI,MAAM;IAIlB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK7B,iBAAiB,IAAI,cAAc;IAInC,iBAAiB,CAAC,cAAc,EAAE,cAAc,GAAG,IAAI;IAKvD,MAAM,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI;IAa3C,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,WAAW;IAW5C,SAAS,CAAC,QAAQ,EAAE,cAAc,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,OAAO;IAiBpF,QAAQ,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO;CAU9B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,cAAc,EACd,KAAK,EACL,OAAO,EACP,GAAG,GACJ,EAAE,oBAAoB,GAAG,cAAc,CAEvC;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,cAAc,CAE9F"}

package/dist/field/nodes/admonition-node/admonition-node.js

@@ -0,0 +1,134 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { $applyNodeReplacement, createEditor, DecoratorNode } from 'lexical';
+import { APPLY_VALUE_TAG } from '../../constants';
+const AdmonitionNodeComponent = React.lazy(async () => await import('./admonition-node-component'));
+function convertAdmonitionElement(domNode) {
+    if (domNode instanceof HTMLDivElement) {
+        const type = domNode.dataset.type;
+        const title = domNode.dataset.title;
+        const node = $createAdmonitionNode({ admonitionType: type, title });
+        return { node };
+    }
+    return null;
+}
+export class AdmonitionNode extends DecoratorNode {
+    __admonitionType;
+    __title;
+    __content;
+    static getType() {
+        return 'admonition';
+    }
+    static clone(node) {
+        return new AdmonitionNode(node.__admonitionType, node.__title, node.__content, node.__key);
+    }
+    static importJSON(serializedNode) {
+        const { admonitionType, title, content } = serializedNode;
+        const node = $createAdmonitionNode({
+            admonitionType,
+            title,
+        });
+        const nestedEditor = node.__content;
+        nestedEditor.update(() => {
+            const editorState = nestedEditor.parseEditorState(content.editorState);
+            if (!editorState.isEmpty()) {
+                nestedEditor.setEditorState(editorState);
+            }
+        }, { tag: APPLY_VALUE_TAG });
+        return node;
+    }
+    static importDOM() {
+        return {
+            div: (_node) => ({
+                conversion: convertAdmonitionElement,
+                priority: 0,
+            }),
+        };
+    }
+    constructor(admonitionType, title, content, key) {
+        super(key);
+        this.__admonitionType = admonitionType;
+        this.__title = title;
+        this.__content = content ?? createEditor();
+    }
+    exportDOM() {
+        const element = document.createElement('div');
+        element.setAttribute('data-type', this.__admonitionType);
+        element.setAttribute('data-title', this.__title);
+        return { element };
+    }
+    exportJSON() {
+        return {
+            admonitionType: this.__admonitionType,
+            title: this.__title,
+            content: this.__content.toJSON(),
+            type: 'admonition',
+            version: 1,
+        };
+    }
+    isInline() {
+        return false;
+    }
+    getTitle() {
+        return this.__title;
+    }
+    setTitle(title) {
+        const writable = this.getWritable();
+        writable.__title = title;
+    }
+    getAdmonitionType() {
+        return this.__admonitionType;
+    }
+    setAdmonitionType(admonitionType) {
+        const writable = this.getWritable();
+        writable.__admonitionType = admonitionType;
+    }
+    update(payload) {
+        const writable = this.getWritable();
+        const { admonitionType, title } = payload;
+        if (admonitionType != null) {
+            writable.__admonitionType = admonitionType;
+        }
+        if (title != null) {
+            writable.__title = title;
+        }
+    }
+    // View
+    createDOM(config) {
+        const div = document.createElement('div');
+        div.setAttribute('data-type', this.__admonitionType);
+        div.setAttribute('data-title', this.__title);
+        const className = `${config.theme.admonition} admonition-${this.__admonitionType}`;
+        if (className !== undefined) {
+            div.className = className;
+        }
+        return div;
+    }
+    updateDOM(prevNode, dom, config) {
+        const admonitionType = this.__admonitionType;
+        if (admonitionType !== prevNode.__admonitionType) {
+            const className = `${config.theme.admonition} admonition-${admonitionType}`;
+            if (className !== undefined) {
+                dom.className = className;
+            }
+            dom.setAttribute('data-type', admonitionType);
+            return true;
+        }
+        if (this.__title !== prevNode.__title) {
+            dom.setAttribute('data-title', this.__title);
+            return true;
+        }
+        return false;
+    }
+    decorate() {
+        return (_jsx(AdmonitionNodeComponent, { admonitionType: this.__admonitionType, title: this.__title, content: this.__content, nodeKey: this.getKey() }));
+    }
+}
+export function $createAdmonitionNode({ admonitionType, title, content, key, }) {
+    return $applyNodeReplacement(new AdmonitionNode(admonitionType, title, content, key));
+}
+export function $isAdmonitionNode(node) {
+    return node instanceof AdmonitionNode;
+}
+//# sourceMappingURL=admonition-node.js.map