@inshapardaz/likhari-react 0.1.4-dev.29 → 0.1.4-dev.33

package/dist/EditorRoot.d.ts

@@ -37,12 +37,6 @@ export interface EditorRootProps {
      * the unsaved-changes state) or to hide it while keeping `onSave`.
      */
     showSave?: boolean;
-    /**
-     * Stores an uploaded image and returns the URL to reference it by. Without
-     * it, uploaded images are embedded in the document as base64 data URIs —
-     * simple, but they bloat the document (see `images.maxSizeMB`).
-     */
-    onImageUpload?: (file: File) => Promise<string>;
 }
 export interface EditorRef {
     getContent(format: FormatId): string;

package/dist/EditorRoot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorRoot.d.ts","sourceRoot":"","sources":["../src/EditorRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAS1D,OAAO,KAAK,EAAe,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAClE,OAAO,EAAyB,KAAK,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAwB,KAAK,mBAAmB,EAAE,KAAK,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAMzH,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,OAAO,CAAC,QAAQ,EAAE,cAAc,GAAG,YAAY,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,cAAc,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;CACjD;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC;IACrC,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;IAClD,iBAAiB,IAAI,OAAO,CAAC;IAC7B,cAAc,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;IACnC,KAAK,IAAI,IAAI,CAAC;CACf;AAQD,eAAO,MAAM,UAAU,uGAsHrB,CAAC"}
+{"version":3,"file":"EditorRoot.d.ts","sourceRoot":"","sources":["../src/EditorRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAS1D,OAAO,KAAK,EAAe,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAClE,OAAO,EAAyB,KAAK,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAwB,KAAK,mBAAmB,EAAE,KAAK,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAMzH,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,OAAO,CAAC,QAAQ,EAAE,cAAc,GAAG,YAAY,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,cAAc,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC;IACrC,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;IAClD,iBAAiB,IAAI,OAAO,CAAC;IAC7B,cAAc,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;IACnC,KAAK,IAAI,IAAI,CAAC;CACf;AAQD,eAAO,MAAM,UAAU,uGAqHrB,CAAC"}

package/dist/EditorRoot.js

@@ -20,7 +20,7 @@ function initialEditorStateJson(initialContent) {
     const state = defaultFormatRegistry.parse(initialContent.format, initialContent.value);
     return JSON.stringify(state);
 }
-export const EditorRoot = forwardRef(function EditorRoot({ documentId, initialContent, featureConfig, featurePreset, theme, colorScheme, locale = 'en', placeholder = 'Start writing…', height = '480px', onChange, onSave, showSave = Boolean(onSave), onImageUpload, }, ref) {
+export const EditorRoot = forwardRef(function EditorRoot({ documentId, initialContent, featureConfig, featurePreset, theme, colorScheme, locale = 'en', placeholder = 'Start writing…', height = '480px', onChange, onSave, showSave = Boolean(onSave), }, ref) {
     const config = useMemo(() => resolveFeatureConfig(featureConfig, featurePreset), [featureConfig, featurePreset]);
     const editorStateRef = useRef(null);
     const lastSavedJsonRef = useRef(null);
@@ -84,5 +84,5 @@ export const EditorRoot = forwardRef(function EditorRoot({ documentId, initialCo
         onSave?.(content, format);
     };
     const dir = locale === 'en' ? 'ltr' : 'rtl';
-    return (_jsx(EditorThemeProvider, { theme: theme, colorScheme: colorScheme, children: _jsx("div", { className: "likhari-root", dir: dir, ref: rootElementRef, "data-document-id": documentId, style: { height: typeof height === 'number' ? `${height}px` : height }, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsx(Toolbar, { config: config, onSave: handleSave, isDirty: isDirty, showSave: showSave, onImageUpload: onImageUpload }), _jsx("div", { className: "likhari-canvas", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "likhari-content-editable", dir: dir, "aria-label": "Editor content" }), placeholder: _jsx("div", { className: "likhari-placeholder", children: placeholder }), ErrorBoundary: LexicalErrorBoundary }) }), config.history && _jsx(HistoryPlugin, {}), (config.lists.bullet || config.lists.numbered || config.lists.check) && _jsx(ListPlugin, {}), config.links && _jsx(LinkPlugin, {}), _jsx(OnChangePlugin, { onChange: handleChange })] }) }) }));
+    return (_jsx(EditorThemeProvider, { theme: theme, colorScheme: colorScheme, children: _jsx("div", { className: "likhari-root", dir: dir, ref: rootElementRef, "data-document-id": documentId, style: { height: typeof height === 'number' ? `${height}px` : height }, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsx(Toolbar, { config: config, onSave: handleSave, isDirty: isDirty, showSave: showSave }), _jsx("div", { className: "likhari-canvas", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "likhari-content-editable", dir: dir, "aria-label": "Editor content" }), placeholder: _jsx("div", { className: "likhari-placeholder", children: placeholder }), ErrorBoundary: LexicalErrorBoundary }) }), config.history && _jsx(HistoryPlugin, {}), (config.lists.bullet || config.lists.numbered || config.lists.check) && _jsx(ListPlugin, {}), config.links && _jsx(LinkPlugin, {}), _jsx(OnChangePlugin, { onChange: handleChange })] }) }) }));
 });

package/dist/components/LinkDialog.d.ts

@@ -0,0 +1,18 @@
+export interface LinkDialogProps {
+    opened: boolean;
+    /** Existing link's URL when editing; empty when inserting. */
+    initialUrl: string;
+    /** Show a "Text" field — used when nothing is selected, so there is no text to link. */
+    showTextField: boolean;
+    onSubmit: (link: {
+        url: string;
+        text: string;
+    }) => void;
+    /** Present only when editing an existing link. */
+    onRemove?: () => void;
+    onClose: () => void;
+}
+/** Insert/edit-link dialog (UI spec §6). Mantine Modal supplies focus
+ * trapping, Escape-to-close and the overlay. */
+export declare function LinkDialog({ opened, initialUrl, showTextField, onSubmit, onRemove, onClose }: LinkDialogProps): import("react").JSX.Element;
+//# sourceMappingURL=LinkDialog.d.ts.map

package/dist/components/LinkDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkDialog.d.ts","sourceRoot":"","sources":["../../src/components/LinkDialog.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,CAAC;IAChB,8DAA8D;IAC9D,UAAU,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,CAAC,IAAI,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACxD,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;gDACgD;AAChD,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,eAAe,+BAgE7G"}

package/dist/components/LinkDialog.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Button, Group, Modal, TextInput } from '@mantine/core';
+import { normalizeLinkUrl } from '../utils/linkUrl.js';
+/** Insert/edit-link dialog (UI spec §6). Mantine Modal supplies focus
+ * trapping, Escape-to-close and the overlay. */
+export function LinkDialog({ opened, initialUrl, showTextField, onSubmit, onRemove, onClose }) {
+    const [url, setUrl] = useState(initialUrl);
+    const [text, setText] = useState('');
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        if (opened) {
+            setUrl(initialUrl);
+            setText('');
+            setError(null);
+        }
+    }, [opened, initialUrl]);
+    const handleSubmit = (e) => {
+        e.preventDefault();
+        const normalized = normalizeLinkUrl(url);
+        if (!normalized) {
+            setError('Enter a valid http(s), mailto, tel or relative URL');
+            return;
+        }
+        onSubmit({ url: normalized, text: text.trim() || normalized });
+    };
+    return (_jsx(Modal, { opened: opened, onClose: onClose, title: onRemove ? 'Edit link' : 'Insert link', centered: true, size: "sm", children: _jsxs("form", { onSubmit: handleSubmit, children: [_jsx(TextInput, { label: "URL", placeholder: "https://example.com", value: url, onChange: (e) => {
+                        setUrl(e.currentTarget.value);
+                        setError(null);
+                    }, error: error, "data-autofocus": true }), showTextField && (_jsx(TextInput, { mt: "sm", label: "Text", placeholder: "Link text (defaults to the URL)", value: text, onChange: (e) => setText(e.currentTarget.value) })), _jsxs(Group, { justify: "space-between", mt: "md", children: [onRemove ? (_jsx(Button, { variant: "subtle", color: "red", onClick: onRemove, children: "Remove link" })) : (_jsx("span", {})), _jsxs(Group, { gap: "xs", children: [_jsx(Button, { variant: "default", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "submit", children: "Apply" })] })] })] }) }));
+}

package/dist/components/Toolbar.d.ts

@@ -4,7 +4,6 @@ export interface ToolbarProps {
     onSave?: () => void;
     isDirty?: boolean;
     showSave?: boolean;
-    onImageUpload?: (file: File) => Promise<string>;
 }
-export declare function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }: ToolbarProps): import("react").JSX.Element;
+export declare function Toolbar({ config, onSave, isDirty, showSave }: ToolbarProps): import("react").JSX.Element;
 //# sourceMappingURL=Toolbar.d.ts.map

package/dist/components/Toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/components/Toolbar.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AA4K7E,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,2BAA2B,CAAC;IACpC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;CACjD;AAED,wBAAgB,OAAO,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,YAAY,+BAgZzF"}
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/components/Toolbar.tsx"],"names":[],"mappings":"AAwCA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AAoL7E,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,2BAA2B,CAAC;IACpC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,OAAO,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,YAAY,+BAqgB1E"}

package/dist/components/Toolbar.js

@@ -2,20 +2,23 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Menu, Select } from '@mantine/core';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { $getSelection, $isRangeSelection, $isElementNode, $setSelection, FORMAT_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, INDENT_CONTENT_COMMAND, OUTDENT_CONTENT_COMMAND, UNDO_COMMAND, REDO_COMMAND, SELECTION_CHANGE_COMMAND, CAN_UNDO_COMMAND, CAN_REDO_COMMAND, COMMAND_PRIORITY_LOW, } from 'lexical';
+import { $getSelection, $isRangeSelection, $isElementNode, $setSelection, $createTextNode, KEY_MODIFIER_COMMAND, COMMAND_PRIORITY_NORMAL, FORMAT_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, INDENT_CONTENT_COMMAND, OUTDENT_CONTENT_COMMAND, UNDO_COMMAND, REDO_COMMAND, SELECTION_CHANGE_COMMAND, CAN_UNDO_COMMAND, CAN_REDO_COMMAND, COMMAND_PRIORITY_LOW, } from 'lexical';
 import { $setBlocksType } from '@lexical/selection';
 import { $createParagraphNode } from 'lexical';
 import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode } from '@lexical/rich-text';
 import { $isListNode, INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, REMOVE_LIST_COMMAND, } from '@lexical/list';
-import { $findMatchingParent, $insertNodeToNearestRoot } from '@lexical/utils';
-import { ImageDialog } from '../image/ImageDialog.js';
-import { $createImageNode } from '../image/ImageNode.js';
-import { IconAbc, IconAlignCenter, IconAlignJustified, IconAlignLeft, IconAlignRight, IconArrowBackUp, IconArrowForwardUp, IconBold, IconClearFormatting, IconDeviceFloppy, IconDots, IconFeather, IconIndentDecrease, IconIndentIncrease, IconItalic, IconLetterCase, IconLetterCaseLower, IconLetterCaseUpper, IconLink, IconPhoto, IconPilcrow, IconSparkles, IconStrikethrough, IconSubscript, IconSuperscript, IconTextSize, IconTypography, IconUnderline, IconWand, } from '@tabler/icons-react';
+import { $findMatchingParent } from '@lexical/utils';
+import { $createLinkNode, $isLinkNode, TOGGLE_LINK_COMMAND } from '@lexical/link';
+import { LinkDialog } from './LinkDialog.js';
+import { normalizeLinkUrl } from '../utils/linkUrl.js';
+import { IconAbc, IconAlignCenter, IconAlignJustified, IconAlignLeft, IconAlignRight, IconArrowBackUp, IconArrowForwardUp, IconBold, IconClearFormatting, IconDeviceFloppy, IconDots, IconExternalLink, IconFeather, IconIndentDecrease, IconIndentIncrease, IconItalic, IconLetterCase, IconLetterCaseLower, IconLetterCaseUpper, IconLink, IconLinkOff, IconPencil, IconPhoto, IconPilcrow, IconSparkles, IconStrikethrough, IconSubscript, IconSuperscript, IconTextSize, IconTypography, IconUnderline, IconWand, } from '@tabler/icons-react';
 const INITIAL_STATE = {
     blockType: 'paragraph',
     activeFormats: new Set(),
     elementFormat: 'start',
     listType: null,
+    isLink: false,
+    linkUrl: '',
     canUndo: false,
     canRedo: false,
 };
@@ -51,7 +54,7 @@ function OverflowItem({ icon: Icon, label, active, onClick, }) {
         // Keep the editor's selection: a mousedown here would blur the canvas.
         onMouseDown: (e) => e.preventDefault(), onClick: onClick, children: label }));
 }
-export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
+export function Toolbar({ config, onSave, isDirty, showSave }) {
     const [editor] = useLexicalComposerContext();
     const [state, setState] = useState(INITIAL_STATE);
     const updateToolbar = useCallback(() => {
@@ -70,6 +73,9 @@ export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
             else if ($isQuoteNode(element)) {
                 blockType = 'quote';
             }
+            const linkNode = $findMatchingParent(anchorNode, $isLinkNode);
+            const isLink = Boolean(linkNode);
+            const linkUrl = linkNode && $isLinkNode(linkNode) ? linkNode.getURL() : '';
             const activeFormats = new Set();
             ['bold', 'italic', 'underline', 'strikethrough', 'subscript', 'superscript'].forEach((format) => {
                 if (selection.hasFormat(format))
@@ -86,9 +92,16 @@ export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
                 activeFormats,
                 elementFormat,
                 listType,
+                isLink,
+                linkUrl,
             }));
         });
     }, [editor]);
+    // Selection changes alone miss edits that change the toolbar's state without
+    // moving the caret (e.g. removing the link the caret is in).
+    useEffect(() => {
+        return editor.registerUpdateListener(() => updateToolbar());
+    }, [editor, updateToolbar]);
     useEffect(() => {
         return editor.registerCommand(SELECTION_CHANGE_COMMAND, () => {
             updateToolbar();
@@ -159,25 +172,63 @@ export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
         action();
         editor.focus();
     };
-    const [imageDialogOpen, setImageDialogOpen] = useState(false);
-    const openImageDialog = () => {
+    const [linkDialogOpen, setLinkDialogOpen] = useState(false);
+    const [linkNeedsText, setLinkNeedsText] = useState(false);
+    const openLinkDialog = useCallback(() => {
         // Snapshot first: the dialog's focus trap makes Lexical drop the selection.
-        snapshotSelection();
-        setImageDialogOpen(true);
-    };
-    const closeImageDialog = () => {
-        setImageDialogOpen(false);
+        let collapsed = false;
+        editor.getEditorState().read(() => {
+            const selection = $getSelection();
+            menuSelectionRef.current = selection ? selection.clone() : null;
+            collapsed = $isRangeSelection(selection) && selection.isCollapsed();
+        });
+        setLinkNeedsText(collapsed && !state.isLink);
+        setLinkDialogOpen(true);
+    }, [editor, state.isLink]);
+    const closeLinkDialog = () => {
+        setLinkDialogOpen(false);
         editor.focus();
     };
-    const insertImage = (image) => {
+    const restoreSelection = () => {
         const saved = menuSelectionRef.current;
         if (saved)
             editor.update(() => $setSelection(saved.clone()), { discrete: true });
-        editor.update(() => {
-            $insertNodeToNearestRoot($createImageNode(image));
-        });
-        closeImageDialog();
     };
+    const applyLink = ({ url, text }) => {
+        restoreSelection();
+        if (linkNeedsText) {
+            // Nothing selected: insert a new link with its own text.
+            editor.update(() => {
+                const selection = $getSelection();
+                if (!$isRangeSelection(selection))
+                    return;
+                const link = $createLinkNode(url);
+                link.append($createTextNode(text));
+                selection.insertNodes([link]);
+            });
+        }
+        else {
+            editor.dispatchCommand(TOGGLE_LINK_COMMAND, url);
+        }
+        closeLinkDialog();
+    };
+    const removeLink = () => {
+        restoreSelection();
+        editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
+        closeLinkDialog();
+    };
+    // Ctrl/Cmd+K opens the link dialog.
+    useEffect(() => {
+        if (!config.links)
+            return;
+        return editor.registerCommand(KEY_MODIFIER_COMMAND, (event) => {
+            if (event.key.toLowerCase() !== 'k' || !(event.ctrlKey || event.metaKey))
+                return false;
+            event.preventDefault();
+            openLinkDialog();
+            return true;
+        }, COMMAND_PRIORITY_NORMAL);
+    }, [editor, config.links, openLinkDialog]);
     const withRefocus = (fn) => (value) => {
         fn(value);
         editor.focus();
@@ -226,9 +277,11 @@ export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
     const showFormattingGroup = headingLevels.length > 0 || config.lists.bullet || config.lists.numbered || config.lists.check || config.blocks.quote;
     const showInlineGroup = fmt.bold || fmt.italic || fmt.underline;
     const showAlignGroup = config.alignment.start || config.alignment.center || config.alignment.justify || config.alignment.left || config.alignment.right;
-    const showInsertPoetryGroup = config.links || config.images.linked || config.images.embedded || config.poetry.enabled;
+    const showStubInsertGroup = config.images.linked || config.images.embedded || config.poetry.enabled;
     const showLanguageGroup = config.language.autocorrect || config.language.textCleanup || config.language.spellCheck;
     const showOverflowMenu = fmt.strikethrough || fmt.superscript || fmt.subscript || fmt.caseTransforms || fmt.clearFormatting || config.indent;
+    // Only offer the link as clickable if it's a URL the editor would have accepted.
+    const safeLinkUrl = normalizeLinkUrl(state.linkUrl);
     const formattingOptions = [
         { value: 'paragraph', label: 'Paragraph' },
         ...headingLevels.map((level) => ({ value: `h${level}`, label: `Heading ${level}` })),
@@ -247,5 +300,12 @@ export function Toolbar({ config, onSave, isDirty, showSave, onImageUpload }) {
     ];
     const formattingValue = state.listType ?? state.blockType;
     const AlignIcon = ALIGN_ICONS[state.elementFormat] ?? IconAlignLeft;
-    return (_jsxs("div", { className: "likhari-toolbar", role: "toolbar", "aria-label": "Formatting", children: [showSave && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarButton, { icon: IconDeviceFloppy, title: "Save", dirty: Boolean(isDirty), onClick: onSave }) })), config.history && (_jsxs("div", { className: "likhari-toolbar-group", children: [_jsx(ToolbarButton, { icon: IconArrowBackUp, title: "Undo", disabled: !state.canUndo, onClick: () => editor.dispatchCommand(UNDO_COMMAND, undefined) }), _jsx(ToolbarButton, { icon: IconArrowForwardUp, title: "Redo", disabled: !state.canRedo, onClick: () => editor.dispatchCommand(REDO_COMMAND, undefined) })] })), showFormattingGroup && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarSelect, { icon: IconPilcrow, label: "Formatting", width: 148, value: formattingValue, data: formattingOptions, onChange: withRefocus((v) => applyFormatting(v)) }) })), showInlineGroup && (_jsxs("div", { className: "likhari-toolbar-group", children: [fmt.bold && (_jsx(ToolbarButton, { icon: IconBold, title: "Bold", active: state.activeFormats.has('bold'), onClick: () => formatText('bold') })), fmt.italic && (_jsx(ToolbarButton, { icon: IconItalic, title: "Italic", active: state.activeFormats.has('italic'), onClick: () => formatText('italic') })), fmt.underline && (_jsx(ToolbarButton, { icon: IconUnderline, title: "Underline", active: state.activeFormats.has('underline'), onClick: () => formatText('underline') }))] })), (config.font.family || config.font.size) && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [config.font.family && (_jsx(ToolbarSelect, { icon: IconTypography, label: "Font family", width: 110, value: null, placeholder: "Font", data: [], disabled: true })), config.font.size && (_jsx(ToolbarSelect, { icon: IconTextSize, label: "Font size", width: 90, value: null, placeholder: "Size", data: [], disabled: true }))] })), showAlignGroup && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarSelect, { icon: AlignIcon, label: "Alignment", width: 138, value: state.elementFormat || 'start', data: alignOptions, onChange: withRefocus((v) => formatElement(v)) }) })), showInsertPoetryGroup && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [config.links && _jsx(StubButton, { icon: IconLink, title: "Insert link" }), (config.images.linked || config.images.embedded) && (_jsx(ToolbarButton, { icon: IconPhoto, title: "Insert image", onClick: openImageDialog })), config.poetry.enabled && _jsx(StubButton, { icon: IconFeather, title: "Poetry blocks" })] })), showLanguageGroup && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [config.language.autocorrect && _jsx(StubButton, { icon: IconWand, title: "Auto-correct" }), config.language.textCleanup && _jsx(StubButton, { icon: IconSparkles, title: "Text cleanup" }), config.language.spellCheck && _jsx(StubButton, { icon: IconAbc, title: "Spell-checker" })] })), showOverflowMenu && (_jsxs(Menu, { position: "bottom-end", withinPortal: true, shadow: "sm", width: 210, closeOnItemClick: true, onOpen: snapshotSelection, children: [_jsx(Menu.Target, { children: _jsx("button", { type: "button", className: "likhari-toolbar-button", "aria-label": "More formatting", title: "More formatting", onMouseDown: (e) => e.preventDefault(), children: _jsx(IconDots, { size: ICON_SIZE, stroke: ICON_STROKE }) }) }), _jsxs(Menu.Dropdown, { children: [fmt.strikethrough && (_jsx(OverflowItem, { icon: IconStrikethrough, label: "Strikethrough", active: state.activeFormats.has('strikethrough'), onClick: runOverflowAction(() => formatText('strikethrough')) })), fmt.superscript && (_jsx(OverflowItem, { icon: IconSuperscript, label: "Superscript", active: state.activeFormats.has('superscript'), onClick: runOverflowAction(() => formatText('superscript')) })), fmt.subscript && (_jsx(OverflowItem, { icon: IconSubscript, label: "Subscript", active: state.activeFormats.has('subscript'), onClick: runOverflowAction(() => formatText('subscript')) })), fmt.caseTransforms && (_jsxs(_Fragment, { children: [_jsx(OverflowItem, { icon: IconLetterCaseUpper, label: "UPPERCASE", onClick: runOverflowAction(() => applyCaseTransform('upper')) }), _jsx(OverflowItem, { icon: IconLetterCaseLower, label: "lowercase", onClick: runOverflowAction(() => applyCaseTransform('lower')) }), _jsx(OverflowItem, { icon: IconLetterCase, label: "Capitalize", onClick: runOverflowAction(() => applyCaseTransform('capitalize')) })] })), fmt.clearFormatting && _jsx(OverflowItem, { icon: IconClearFormatting, label: "Clear formatting", onClick: runOverflowAction(clearFormatting) }), config.indent && (_jsxs(_Fragment, { children: [_jsx(OverflowItem, { icon: IconIndentDecrease, label: "Outdent", onClick: runOverflowAction(() => editor.dispatchCommand(OUTDENT_CONTENT_COMMAND, undefined)) }), _jsx(OverflowItem, { icon: IconIndentIncrease, label: "Indent", onClick: runOverflowAction(() => editor.dispatchCommand(INDENT_CONTENT_COMMAND, undefined)) })] }))] })] })), (config.images.linked || config.images.embedded) && (_jsx(ImageDialog, { opened: imageDialogOpen, allowLinked: config.images.linked, allowEmbedded: config.images.embedded, allowCaption: config.images.caption, maxSizeMB: config.images.maxSizeMB, onImageUpload: onImageUpload, onSubmit: insertImage, onClose: closeImageDialog }))] }));
+    return (_jsxs("div", { className: "likhari-toolbar", role: "toolbar", "aria-label": "Formatting", children: [showSave && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarButton, { icon: IconDeviceFloppy, title: "Save", dirty: Boolean(isDirty), onClick: onSave }) })), config.history && (_jsxs("div", { className: "likhari-toolbar-group", children: [_jsx(ToolbarButton, { icon: IconArrowBackUp, title: "Undo", disabled: !state.canUndo, onClick: () => editor.dispatchCommand(UNDO_COMMAND, undefined) }), _jsx(ToolbarButton, { icon: IconArrowForwardUp, title: "Redo", disabled: !state.canRedo, onClick: () => editor.dispatchCommand(REDO_COMMAND, undefined) })] })), showFormattingGroup && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarSelect, { icon: IconPilcrow, label: "Formatting", width: 148, value: formattingValue, data: formattingOptions, onChange: withRefocus((v) => applyFormatting(v)) }) })), showInlineGroup && (_jsxs("div", { className: "likhari-toolbar-group", children: [fmt.bold && (_jsx(ToolbarButton, { icon: IconBold, title: "Bold", active: state.activeFormats.has('bold'), onClick: () => formatText('bold') })), fmt.italic && (_jsx(ToolbarButton, { icon: IconItalic, title: "Italic", active: state.activeFormats.has('italic'), onClick: () => formatText('italic') })), fmt.underline && (_jsx(ToolbarButton, { icon: IconUnderline, title: "Underline", active: state.activeFormats.has('underline'), onClick: () => formatText('underline') }))] })), (config.font.family || config.font.size) && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [config.font.family && (_jsx(ToolbarSelect, { icon: IconTypography, label: "Font family", width: 110, value: null, placeholder: "Font", data: [], disabled: true })), config.font.size && (_jsx(ToolbarSelect, { icon: IconTextSize, label: "Font size", width: 90, value: null, placeholder: "Size", data: [], disabled: true }))] })), showAlignGroup && (_jsx("div", { className: "likhari-toolbar-group", children: _jsx(ToolbarSelect, { icon: AlignIcon, label: "Alignment", width: 138, value: state.elementFormat || 'start', data: alignOptions, onChange: withRefocus((v) => formatElement(v)) }) })), config.links && (_jsx("div", { className: "likhari-toolbar-group", children: state.isLink ? (
+                // Caret is in a link: the button opens a menu to see, edit or remove it.
+                _jsxs(Menu, { position: "bottom-start", withinPortal: true, shadow: "sm", width: 240, onOpen: snapshotSelection, children: [_jsx(Menu.Target, { children: _jsx("button", { type: "button", className: "likhari-toolbar-button", "data-active": "true", "aria-pressed": "true", "aria-haspopup": "menu", "aria-label": "Link options", title: "Link options", onMouseDown: (e) => e.preventDefault(), children: _jsx(IconLink, { size: ICON_SIZE, stroke: ICON_STROKE }) }) }), _jsxs(Menu.Dropdown, { children: [_jsx(Menu.Label, { children: "Link" }), safeLinkUrl ? (_jsx(Menu.Item, { component: "a", href: safeLinkUrl, target: "_blank", rel: "noopener noreferrer", leftSection: _jsx(IconExternalLink, { size: ICON_SIZE, stroke: ICON_STROKE }), title: state.linkUrl, className: "likhari-link-menu-url", children: state.linkUrl })) : (
+                                // Not a URL the editor would accept (e.g. loaded from a document): show it, don't make it clickable.
+                                _jsx(Menu.Item, { disabled: true, title: state.linkUrl, className: "likhari-link-menu-url", children: state.linkUrl || '(no URL)' })), _jsx(Menu.Item, { leftSection: _jsx(IconPencil, { size: ICON_SIZE, stroke: ICON_STROKE }), onMouseDown: (e) => e.preventDefault(), onClick: () => {
+                                        restoreSelection();
+                                        openLinkDialog();
+                                    }, children: "Edit link" }), _jsx(Menu.Item, { color: "red", leftSection: _jsx(IconLinkOff, { size: ICON_SIZE, stroke: ICON_STROKE }), onMouseDown: (e) => e.preventDefault(), onClick: removeLink, children: "Remove link" })] })] })) : (_jsx(ToolbarButton, { icon: IconLink, title: "Insert link (Ctrl+K)", onClick: openLinkDialog })) })), showStubInsertGroup && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [(config.images.linked || config.images.embedded) && _jsx(StubButton, { icon: IconPhoto, title: "Insert image" }), config.poetry.enabled && _jsx(StubButton, { icon: IconFeather, title: "Poetry blocks" })] })), showLanguageGroup && (_jsxs("div", { className: "likhari-toolbar-group likhari-toolbar-group--collapse-tablet", children: [config.language.autocorrect && _jsx(StubButton, { icon: IconWand, title: "Auto-correct" }), config.language.textCleanup && _jsx(StubButton, { icon: IconSparkles, title: "Text cleanup" }), config.language.spellCheck && _jsx(StubButton, { icon: IconAbc, title: "Spell-checker" })] })), showOverflowMenu && (_jsxs(Menu, { position: "bottom-end", withinPortal: true, shadow: "sm", width: 210, closeOnItemClick: true, onOpen: snapshotSelection, children: [_jsx(Menu.Target, { children: _jsx("button", { type: "button", className: "likhari-toolbar-button", "aria-label": "More formatting", title: "More formatting", onMouseDown: (e) => e.preventDefault(), children: _jsx(IconDots, { size: ICON_SIZE, stroke: ICON_STROKE }) }) }), _jsxs(Menu.Dropdown, { children: [fmt.strikethrough && (_jsx(OverflowItem, { icon: IconStrikethrough, label: "Strikethrough", active: state.activeFormats.has('strikethrough'), onClick: runOverflowAction(() => formatText('strikethrough')) })), fmt.superscript && (_jsx(OverflowItem, { icon: IconSuperscript, label: "Superscript", active: state.activeFormats.has('superscript'), onClick: runOverflowAction(() => formatText('superscript')) })), fmt.subscript && (_jsx(OverflowItem, { icon: IconSubscript, label: "Subscript", active: state.activeFormats.has('subscript'), onClick: runOverflowAction(() => formatText('subscript')) })), fmt.caseTransforms && (_jsxs(_Fragment, { children: [_jsx(OverflowItem, { icon: IconLetterCaseUpper, label: "UPPERCASE", onClick: runOverflowAction(() => applyCaseTransform('upper')) }), _jsx(OverflowItem, { icon: IconLetterCaseLower, label: "lowercase", onClick: runOverflowAction(() => applyCaseTransform('lower')) }), _jsx(OverflowItem, { icon: IconLetterCase, label: "Capitalize", onClick: runOverflowAction(() => applyCaseTransform('capitalize')) })] })), fmt.clearFormatting && _jsx(OverflowItem, { icon: IconClearFormatting, label: "Clear formatting", onClick: runOverflowAction(clearFormatting) }), config.indent && (_jsxs(_Fragment, { children: [_jsx(OverflowItem, { icon: IconIndentDecrease, label: "Outdent", onClick: runOverflowAction(() => editor.dispatchCommand(OUTDENT_CONTENT_COMMAND, undefined)) }), _jsx(OverflowItem, { icon: IconIndentIncrease, label: "Indent", onClick: runOverflowAction(() => editor.dispatchCommand(INDENT_CONTENT_COMMAND, undefined)) })] }))] })] })), config.links && (_jsx(LinkDialog, { opened: linkDialogOpen, initialUrl: state.linkUrl, showTextField: linkNeedsText, onSubmit: applyLink, onRemove: state.isLink ? removeLink : undefined, onClose: closeLinkDialog }))] }));
 }

package/dist/index.d.ts

@@ -1,6 +1,4 @@
 export { EditorRoot } from './EditorRoot.js';
 export type { EditorRootProps, EditorRef, EditorInitialContent } from './EditorRoot.js';
 export { defaultMantineTheme } from './theme/mantineTheme.js';
-export { ImageNode, $createImageNode, $isImageNode } from './image/ImageNode.js';
-export type { ImagePayload, ImageLinkType, SerializedImageNode } from './image/ImageNode.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AACrF,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAC9E,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AACrF,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/index.js

@@ -1,3 +1,2 @@
 export { EditorRoot } from './EditorRoot.js';
 export { defaultMantineTheme } from './theme/mantineTheme.js';
-export { ImageNode, $createImageNode, $isImageNode } from './image/ImageNode.js';

package/dist/nodes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"nodes.d.ts","sourceRoot":"","sources":["../src/nodes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAOlD;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,WAAW,CAAC,EAQ5C,CAAC"}
+{"version":3,"file":"nodes.d.ts","sourceRoot":"","sources":["../src/nodes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAMlD;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,WAAW,CAAC,EAO5C,CAAC"}

package/dist/nodes.js

@@ -2,7 +2,6 @@ import { HeadingNode, QuoteNode } from '@lexical/rich-text';
 import { ListItemNode, ListNode } from '@lexical/list';
 import { LinkNode } from '@lexical/link';
 import { HorizontalRuleNode } from '@lexical/react/LexicalHorizontalRuleNode';
-import { ImageNode } from './image/ImageNode.js';
 /**
  * Node types registered on the editor at construction time. Per
  * editor-architecture-design.md §2, node registration cannot be conditional
@@ -19,5 +18,4 @@ export const EDITOR_NODES = [
     ListItemNode,
     LinkNode,
     HorizontalRuleNode,
-    ImageNode,
 ];

package/dist/theme/editor.css

@@ -235,46 +235,13 @@
   margin: 1.5em 0;
 }
 
-/* Images — block-level figure with an optional caption input. */
-.likhari-image-block {
-  margin: 0 0 1em 0;
-}
-
-.likhari-image-figure {
-  display: block;
-  margin: 0;
-  text-align: center;
-}
-
-.likhari-image {
-  display: inline-block;
+/* Link menu: the URL item shows one truncated line. */
+.likhari-link-menu-url {
   max-width: 100%;
-  height: auto;
-  border-radius: 4px;
-  cursor: default;
-}
-
-.likhari-image-figure[data-selected='true'] .likhari-image {
-  outline: 2px solid var(--editor-accent);
-  outline-offset: 2px;
 }
 
-.likhari-image-caption {
-  display: block;
-  width: 100%;
-  margin-top: 6px;
-  padding: 2px 4px;
-  border: none;
-  border-bottom: 1px dashed transparent;
-  background: transparent;
-  color: var(--editor-ink-soft);
-  font: inherit;
-  font-size: 0.85em;
-  text-align: center;
-}
-
-.likhari-image-caption:hover,
-.likhari-image-caption:focus {
-  border-bottom-color: var(--editor-line-strong);
-  outline: none;
+.likhari-link-menu-url .mantine-Menu-itemLabel {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }

package/dist/theme/editorTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editorTheme.d.ts","sourceRoot":"","sources":["../../src/theme/editorTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,kBA8BzB,CAAC"}
+{"version":3,"file":"editorTheme.d.ts","sourceRoot":"","sources":["../../src/theme/editorTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,kBA6BzB,CAAC"}

package/dist/theme/editorTheme.js

@@ -32,5 +32,4 @@ export const editorTheme = {
         superscript: 'likhari-text-superscript',
     },
     hr: 'likhari-hr',
-    image: 'likhari-image-block',
 };

package/dist/utils/linkUrl.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Normalizes a URL typed into the link dialog, or returns null if it should
+ * be rejected. Only http(s), mailto, tel, in-page (#), and relative URLs are
+ * accepted — any other scheme (javascript:, data:, vbscript:, ...) is
+ * refused so a pasted link can't carry script into exported HTML. A bare
+ * domain like "example.com/page" gets https:// prefixed.
+ */
+export declare function normalizeLinkUrl(input: string): string | null;
+//# sourceMappingURL=linkUrl.d.ts.map

package/dist/utils/linkUrl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"linkUrl.d.ts","sourceRoot":"","sources":["../../src/utils/linkUrl.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAc7D"}

package/dist/utils/linkUrl.js

@@ -0,0 +1,23 @@
+/**
+ * Normalizes a URL typed into the link dialog, or returns null if it should
+ * be rejected. Only http(s), mailto, tel, in-page (#), and relative URLs are
+ * accepted — any other scheme (javascript:, data:, vbscript:, ...) is
+ * refused so a pasted link can't carry script into exported HTML. A bare
+ * domain like "example.com/page" gets https:// prefixed.
+ */
+export function normalizeLinkUrl(input) {
+    const url = input.trim();
+    if (!url)
+        return null;
+    if (/^(https?:\/\/|mailto:|tel:)\S+$/i.test(url))
+        return url;
+    if (/^(#|\/|\.\.?\/)\S*$/.test(url))
+        return url;
+    // Any other explicit scheme is rejected.
+    if (/^[a-z][a-z0-9+.-]*:/i.test(url))
+        return null;
+    // Looks like a bare domain (no spaces, has a dot in its host part).
+    if (/^[^\s/?#]+\.[^\s/?#]+(?:[/?#]\S*)?$/.test(url))
+        return `https://${url}`;
+    return null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inshapardaz/likhari-react",
-  "version": "0.1.4-dev.29",
+  "version": "0.1.4-dev.33",
   "description": "React implementation of the Likhari editor, built on @lexical/react.",
   "license": "MIT",
   "repository": {

package/dist/image/ImageDialog.d.ts

@@ -1,25 +0,0 @@
-import type { ImageLinkType } from './ImageNode.js';
-export interface ImageDialogResult {
-    src: string;
-    altText: string;
-    caption: string | null;
-    linkType: ImageLinkType;
-}
-export interface ImageDialogProps {
-    opened: boolean;
-    /** `images.linked` — allow an external URL. */
-    allowLinked: boolean;
-    /** `images.embedded` — allow uploading a file. */
-    allowEmbedded: boolean;
-    /** `images.caption` — image gets an (initially empty) caption. */
-    allowCaption: boolean;
-    /** `images.maxSizeMB` */
-    maxSizeMB: number;
-    /** Host upload handler; when absent, uploads are embedded as base64 data URIs. */
-    onImageUpload?: (file: File) => Promise<string>;
-    onSubmit: (image: ImageDialogResult) => void;
-    onClose: () => void;
-}
-/** Insert-image dialog (UI spec §6): an external URL and/or an uploaded file. */
-export declare function ImageDialog({ opened, allowLinked, allowEmbedded, allowCaption, maxSizeMB, onImageUpload, onSubmit, onClose, }: ImageDialogProps): import("react").JSX.Element;
-//# sourceMappingURL=ImageDialog.d.ts.map

package/dist/image/ImageDialog.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImageDialog.d.ts","sourceRoot":"","sources":["../../src/image/ImageDialog.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,WAAW,iBAAiB;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,EAAE,aAAa,CAAC;CACzB;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,+CAA+C;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,aAAa,EAAE,OAAO,CAAC;IACvB,kEAAkE;IAClE,YAAY,EAAE,OAAO,CAAC;IACtB,yBAAyB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,kFAAkF;IAClF,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;IAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC7C,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAWD,iFAAiF;AACjF,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,WAAW,EACX,aAAa,EACb,YAAY,EACZ,SAAS,EACT,aAAa,EACb,QAAQ,EACR,OAAO,GACR,EAAE,gBAAgB,+BAmHlB"}

package/dist/image/ImageDialog.js

@@ -1,76 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { Alert, Button, FileInput, Group, Modal, SegmentedControl, Stack, TextInput } from '@mantine/core';
-import { ACCEPTED_IMAGE_TYPES, normalizeImageUrl, validateImageFile } from './imageUrl.js';
-function readAsDataUrl(file) {
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onload = () => resolve(String(reader.result));
-        reader.onerror = () => reject(reader.error ?? new Error('Could not read the file'));
-        reader.readAsDataURL(file);
-    });
-}
-/** Insert-image dialog (UI spec §6): an external URL and/or an uploaded file. */
-export function ImageDialog({ opened, allowLinked, allowEmbedded, allowCaption, maxSizeMB, onImageUpload, onSubmit, onClose, }) {
-    const defaultSource = allowLinked ? 'linked' : 'embedded';
-    const [source, setSource] = useState(defaultSource);
-    const [url, setUrl] = useState('');
-    const [file, setFile] = useState(null);
-    const [altText, setAltText] = useState('');
-    const [error, setError] = useState(null);
-    const [busy, setBusy] = useState(false);
-    useEffect(() => {
-        if (opened) {
-            setSource(defaultSource);
-            setUrl('');
-            setFile(null);
-            setAltText('');
-            setError(null);
-            setBusy(false);
-        }
-    }, [opened, defaultSource]);
-    const handleSubmit = async (e) => {
-        e.preventDefault();
-        setError(null);
-        try {
-            let src;
-            if (source === 'linked') {
-                src = normalizeImageUrl(url);
-                if (!src) {
-                    setError('Enter an http(s) or relative image URL');
-                    return;
-                }
-            }
-            else {
-                if (!file) {
-                    setError('Choose an image file');
-                    return;
-                }
-                const problem = validateImageFile(file, maxSizeMB);
-                if (problem) {
-                    setError(problem);
-                    return;
-                }
-                setBusy(true);
-                src = onImageUpload ? await onImageUpload(file) : await readAsDataUrl(file);
-                if (!normalizeImageUrl(src)) {
-                    setError('The upload handler returned an unusable image URL');
-                    setBusy(false);
-                    return;
-                }
-            }
-            onSubmit({ src, altText: altText.trim(), caption: allowCaption ? '' : null, linkType: source });
-        }
-        catch (err) {
-            setError(err instanceof Error ? err.message : 'Could not add the image');
-            setBusy(false);
-        }
-    };
-    return (_jsx(Modal, { opened: opened, onClose: onClose, title: "Insert image", centered: true, size: "sm", children: _jsx("form", { onSubmit: handleSubmit, children: _jsxs(Stack, { gap: "sm", children: [allowLinked && allowEmbedded && (_jsx(SegmentedControl, { fullWidth: true, value: source, onChange: (v) => {
-                            setSource(v);
-                            setError(null);
-                        }, data: [
-                            { value: 'linked', label: 'From URL' },
-                            { value: 'embedded', label: 'Upload' },
-                        ] })), source === 'linked' ? (_jsx(TextInput, { label: "Image URL", placeholder: "https://example.com/photo.jpg", value: url, onChange: (e) => setUrl(e.currentTarget.value), "data-autofocus": true })) : (_jsx(FileInput, { label: "Image file", placeholder: "Choose an image", accept: ACCEPTED_IMAGE_TYPES.join(','), value: file, onChange: setFile, description: `Up to ${maxSizeMB} MB${onImageUpload ? '' : '; stored inside the document'}` })), _jsx(TextInput, { label: "Alt text", description: "Describes the image for screen readers", value: altText, onChange: (e) => setAltText(e.currentTarget.value) }), error && (_jsx(Alert, { color: "red", variant: "light", p: "xs", children: error })), _jsxs(Group, { justify: "flex-end", gap: "xs", children: [_jsx(Button, { variant: "default", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "submit", loading: busy, children: "Insert" })] })] }) }) }));
-}

package/dist/image/ImageNode.d.ts

@@ -1,56 +0,0 @@
-import { type ReactElement } from 'react';
-import { DecoratorNode, type DOMExportOutput, type EditorConfig, type LexicalNode, type NodeKey, type SerializedLexicalNode, type Spread } from 'lexical';
-/** How the image's bytes are held: an external URL, or embedded in the
- * document (a base64 data URI, or a URL returned by the host's upload handler). */
-export type ImageLinkType = 'linked' | 'embedded';
-export interface ImagePayload {
-    src: string;
-    altText?: string;
-    /** null = no caption; '' = caption enabled but empty */
-    caption?: string | null;
-    linkType: ImageLinkType;
-    width?: number | null;
-    height?: number | null;
-    key?: NodeKey;
-}
-export type SerializedImageNode = Spread<{
-    src: string;
-    altText: string;
-    caption: string | null;
-    linkType: ImageLinkType;
-    width: number | null;
-    height: number | null;
-}, SerializedLexicalNode>;
-/**
- * Block-level image (editor-architecture-design.md §3.5). The caption is a
- * plain string edited through an input under the image — not the nested
- * sub-editor the architecture doc leaves open — which keeps caption edits in
- * the parent editor's undo history.
- */
-export declare class ImageNode extends DecoratorNode<ReactElement> {
-    __src: string;
-    __altText: string;
-    __caption: string | null;
-    __linkType: ImageLinkType;
-    __width: number | null;
-    __height: number | null;
-    static getType(): string;
-    static clone(node: ImageNode): ImageNode;
-    static importJSON(json: SerializedImageNode): ImageNode;
-    constructor(src: string, altText?: string, caption?: string | null, linkType?: ImageLinkType, width?: number | null, height?: number | null, key?: NodeKey);
-    exportJSON(): SerializedImageNode;
-    /** `<figure><img><figcaption>` — the figure/figcaption semantics from spec §4.7. */
-    exportDOM(): DOMExportOutput;
-    createDOM(config: EditorConfig): HTMLElement;
-    updateDOM(): false;
-    isInline(): false;
-    getSrc(): string;
-    getAltText(): string;
-    getCaption(): string | null;
-    setCaption(caption: string | null): this;
-    getTextContent(): string;
-    decorate(): ReactElement;
-}
-export declare function $createImageNode({ src, altText, caption, linkType, width, height, key }: ImagePayload): ImageNode;
-export declare function $isImageNode(node: LexicalNode | null | undefined): node is ImageNode;
-//# sourceMappingURL=ImageNode.d.ts.map

package/dist/image/ImageNode.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImageNode.d.ts","sourceRoot":"","sources":["../../src/image/ImageNode.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1E,OAAO,EAML,aAAa,EAGb,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,OAAO,EACZ,KAAK,qBAAqB,EAC1B,KAAK,MAAM,EACZ,MAAM,SAAS,CAAC;AAEjB;mFACmF;AACnF,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,UAAU,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,EAAE,aAAa,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,GAAG,CAAC,EAAE,OAAO,CAAC;CACf;AAED,MAAM,MAAM,mBAAmB,GAAG,MAAM,CACtC;IACE,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,EAAE,aAAa,CAAC;IACxB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB,EACD,qBAAqB,CACtB,CAAC;AAEF;;;;;GAKG;AACH,qBAAa,SAAU,SAAQ,aAAa,CAAC,YAAY,CAAC;IACxD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,EAAE,aAAa,CAAC;IAC1B,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IAExB,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS;IAIxC,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,mBAAmB,GAAG,SAAS;gBAYrD,GAAG,EAAE,MAAM,EACX,OAAO,SAAK,EACZ,OAAO,GAAE,MAAM,GAAG,IAAW,EAC7B,QAAQ,GAAE,aAAwB,EAClC,KAAK,GAAE,MAAM,GAAG,IAAW,EAC3B,MAAM,GAAE,MAAM,GAAG,IAAW,EAC5B,GAAG,CAAC,EAAE,OAAO;IAWf,UAAU,IAAI,mBAAmB;IAajC,oFAAoF;IACpF,SAAS,IAAI,eAAe;IAgB5B,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,WAAW;IAO5C,SAAS,IAAI,KAAK;IAIlB,QAAQ,IAAI,KAAK;IAIjB,MAAM,IAAI,MAAM;IAIhB,UAAU,IAAI,MAAM;IAIpB,UAAU,IAAI,MAAM,GAAG,IAAI;IAI3B,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAMxC,cAAc,IAAI,MAAM;IAIxB,QAAQ,IAAI,YAAY;CAYzB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,YAAY,GAAG,SAAS,CAEjH;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,SAAS,CAEpF"}

package/dist/image/ImageNode.js

@@ -1,151 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef } from 'react';
-import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection';
-import { $getNodeByKey, $getSelection, $isNodeSelection, CLICK_COMMAND, COMMAND_PRIORITY_LOW, DecoratorNode, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, } from 'lexical';
-/**
- * Block-level image (editor-architecture-design.md §3.5). The caption is a
- * plain string edited through an input under the image — not the nested
- * sub-editor the architecture doc leaves open — which keeps caption edits in
- * the parent editor's undo history.
- */
-export class ImageNode extends DecoratorNode {
-    static getType() {
-        return 'image';
-    }
-    static clone(node) {
-        return new ImageNode(node.__src, node.__altText, node.__caption, node.__linkType, node.__width, node.__height, node.__key);
-    }
-    static importJSON(json) {
-        return $createImageNode({
-            src: json.src,
-            altText: json.altText,
-            caption: json.caption,
-            linkType: json.linkType,
-            width: json.width,
-            height: json.height,
-        });
-    }
-    constructor(src, altText = '', caption = null, linkType = 'linked', width = null, height = null, key) {
-        super(key);
-        this.__src = src;
-        this.__altText = altText;
-        this.__caption = caption;
-        this.__linkType = linkType;
-        this.__width = width;
-        this.__height = height;
-    }
-    exportJSON() {
-        return {
-            type: 'image',
-            version: 1,
-            src: this.__src,
-            altText: this.__altText,
-            caption: this.__caption,
-            linkType: this.__linkType,
-            width: this.__width,
-            height: this.__height,
-        };
-    }
-    /** `<figure><img><figcaption>` — the figure/figcaption semantics from spec §4.7. */
-    exportDOM() {
-        const figure = document.createElement('figure');
-        const img = document.createElement('img');
-        img.setAttribute('src', this.__src);
-        img.setAttribute('alt', this.__altText);
-        if (this.__width)
-            img.setAttribute('width', String(this.__width));
-        if (this.__height)
-            img.setAttribute('height', String(this.__height));
-        figure.appendChild(img);
-        if (this.__caption) {
-            const caption = document.createElement('figcaption');
-            caption.textContent = this.__caption;
-            figure.appendChild(caption);
-        }
-        return { element: figure };
-    }
-    createDOM(config) {
-        const div = document.createElement('div');
-        const className = config.theme.image;
-        if (typeof className === 'string')
-            div.className = className;
-        return div;
-    }
-    updateDOM() {
-        return false;
-    }
-    isInline() {
-        return false;
-    }
-    getSrc() {
-        return this.__src;
-    }
-    getAltText() {
-        return this.__altText;
-    }
-    getCaption() {
-        return this.__caption;
-    }
-    setCaption(caption) {
-        const writable = this.getWritable();
-        writable.__caption = caption;
-        return writable;
-    }
-    getTextContent() {
-        return this.__altText || this.__caption || '';
-    }
-    decorate() {
-        return (_jsx(ImageComponent, { nodeKey: this.getKey(), src: this.__src, altText: this.__altText, caption: this.__caption, width: this.__width, height: this.__height }));
-    }
-}
-export function $createImageNode({ src, altText, caption, linkType, width, height, key }) {
-    return new ImageNode(src, altText, caption ?? null, linkType, width ?? null, height ?? null, key);
-}
-export function $isImageNode(node) {
-    return node instanceof ImageNode;
-}
-function ImageComponent({ nodeKey, src, altText, caption, width, height }) {
-    const [editor] = useLexicalComposerContext();
-    const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey);
-    const imageRef = useRef(null);
-    // Selecting must go through CLICK_COMMAND (returning true) rather than a
-    // React onClick: otherwise Lexical's own click handling turns the DOM
-    // selection into a range selection right after, undoing the node selection.
-    useEffect(() => {
-        return editor.registerCommand(CLICK_COMMAND, (event) => {
-            if (event.target !== imageRef.current)
-                return false;
-            clearSelection();
-            setSelected(true);
-            return true;
-        }, COMMAND_PRIORITY_LOW);
-    }, [editor, clearSelection, setSelected]);
-    // Delete/Backspace removes the selected image — but not while typing in the
-    // caption input, whose keystrokes also reach the editor's root listener.
-    const onDelete = useCallback((event) => {
-        if (!isSelected || event.target instanceof HTMLInputElement)
-            return false;
-        if (!$isNodeSelection($getSelection()))
-            return false;
-        event.preventDefault();
-        $getNodeByKey(nodeKey)?.remove();
-        return true;
-    }, [isSelected, nodeKey]);
-    useEffect(() => {
-        const unregisterDelete = editor.registerCommand(KEY_DELETE_COMMAND, onDelete, COMMAND_PRIORITY_LOW);
-        const unregisterBackspace = editor.registerCommand(KEY_BACKSPACE_COMMAND, onDelete, COMMAND_PRIORITY_LOW);
-        return () => {
-            unregisterDelete();
-            unregisterBackspace();
-        };
-    }, [editor, onDelete]);
-    const setCaption = (value) => {
-        editor.update(() => {
-            const node = $getNodeByKey(nodeKey);
-            if ($isImageNode(node))
-                node.setCaption(value);
-        });
-    };
-    return (_jsxs("figure", { className: "likhari-image-figure", "data-selected": isSelected ? 'true' : 'false', contentEditable: false, children: [_jsx("img", { ref: imageRef, className: "likhari-image", src: src, alt: altText, width: width ?? undefined, height: height ?? undefined, draggable: false }), caption !== null && (_jsx("input", { className: "likhari-image-caption", type: "text", "aria-label": "Image caption", placeholder: "Add a caption\u2026", value: caption, onChange: (e) => setCaption(e.currentTarget.value) }))] }));
-}

package/dist/image/imageUrl.d.ts

@@ -1,14 +0,0 @@
-/**
- * Validates the source of a linked image. Accepts http(s) URLs, relative
- * paths, and base64 raster/SVG data URIs (what an embedded image stores);
- * anything else (javascript:, other data: types, file:, ...) is rejected.
- * Returns the trimmed URL, or null when it should be refused.
- */
-export declare function normalizeImageUrl(input: string): string | null;
-export declare const ACCEPTED_IMAGE_TYPES: string[];
-/** Returns an error message if the file can't be inserted, otherwise null. */
-export declare function validateImageFile(file: {
-    type: string;
-    size: number;
-}, maxSizeMB: number): string | null;
-//# sourceMappingURL=imageUrl.d.ts.map

package/dist/image/imageUrl.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"imageUrl.d.ts","sourceRoot":"","sources":["../../src/image/imageUrl.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAO9D;AAED,eAAO,MAAM,oBAAoB,UAA0E,CAAC;AAE5G,8EAA8E;AAC9E,wBAAgB,iBAAiB,CAAC,IAAI,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAIxG"}

package/dist/image/imageUrl.js

@@ -1,27 +0,0 @@
-/**
- * Validates the source of a linked image. Accepts http(s) URLs, relative
- * paths, and base64 raster/SVG data URIs (what an embedded image stores);
- * anything else (javascript:, other data: types, file:, ...) is rejected.
- * Returns the trimmed URL, or null when it should be refused.
- */
-export function normalizeImageUrl(input) {
-    const url = input.trim();
-    if (!url)
-        return null;
-    if (/^https?:\/\/\S+$/i.test(url))
-        return url;
-    if (/^(\/|\.\.?\/)\S*$/.test(url))
-        return url;
-    if (/^data:image\/(png|jpe?g|gif|webp|svg\+xml);base64,[a-z0-9+/=]+$/i.test(url))
-        return url;
-    return null;
-}
-export const ACCEPTED_IMAGE_TYPES = ['image/png', 'image/jpeg', 'image/gif', 'image/webp', 'image/svg+xml'];
-/** Returns an error message if the file can't be inserted, otherwise null. */
-export function validateImageFile(file, maxSizeMB) {
-    if (!ACCEPTED_IMAGE_TYPES.includes(file.type))
-        return 'Choose a PNG, JPEG, GIF, WebP or SVG image';
-    if (file.size > maxSizeMB * 1024 * 1024)
-        return `Image is larger than ${maxSizeMB} MB`;
-    return null;
-}