@moldable-ai/editor 0.1.1

package/LICENSE

@@ -0,0 +1,101 @@
+Copyright (c) 2026-present Desiderata LLC
+
+Portions of this software are licensed as follows:
+
+- All third party components incorporated into the Moldable Software are licensed
+  under the original license provided by the owner of the applicable component.
+- All other content is available under the "Elastic License 2.0" license as defined below.
+
+Elastic License 2.0
+
+URL: https://www.elastic.co/licensing/elastic-license
+
+## Acceptance
+
+By using the software, you agree to all of the terms and conditions below.
+
+## Copyright License
+
+The licensor grants you a non-exclusive, royalty-free, worldwide,
+non-sublicensable, non-transferable license to use, copy, distribute, make
+available, and prepare derivative works of the software, in each case subject to
+the limitations and conditions below.
+
+## Limitations
+
+You may not provide the software to third parties as a hosted or managed
+service, where the service provides users with access to any substantial set of
+the features or functionality of the software.
+
+You may not move, change, disable, or circumvent the license key functionality
+in the software, and you may not remove or obscure any functionality in the
+software that is protected by the license key.
+
+You may not alter, remove, or obscure any licensing, copyright, or other notices
+of the licensor in the software. Any use of the licensor's trademarks is subject
+to applicable law.
+
+## Patents
+
+The licensor grants you a license, under any patent claims the licensor can
+license, or becomes able to license, to make, have made, use, sell, offer for
+sale, import and have imported the software, in each case subject to the
+limitations and conditions in this license. This license does not cover any
+patent claims that you cause to be infringed by modifications or additions to
+the software. If you or your company make any written claim that the software
+infringes or contributes to infringement of any patent, your patent license for
+the software granted under these terms ends immediately. If your company makes
+such a claim, your patent license ends immediately for work on behalf of your
+company.
+
+## Notices
+
+You must ensure that anyone who gets a copy of any part of the software from you
+also gets a copy of these terms.
+
+If you modify the software, you must include in any modified copies of the
+software prominent notices stating that you have modified the software.
+
+## No Other Rights
+
+These terms do not imply any licenses other than those expressly granted in
+these terms.
+
+## Termination
+
+If you use the software in violation of these terms, such use is not licensed,
+and your licenses will automatically terminate. If the licensor provides you
+with a notice of your violation, and you cease all violation of this license no
+later than 30 days after you receive that notice, your licenses will be
+reinstated retroactively. However, if you violate these terms after such
+reinstatement, any additional violation of these terms will cause your licenses
+to terminate automatically and permanently.
+
+## No Liability
+
+_As far as the law allows, the software comes as is, without any warranty or
+condition, and the licensor will not be liable to you for any damages arising
+out of these terms or the use or nature of the software, under any kind of
+legal claim._
+
+## Definitions
+
+The **licensor** is the entity offering these terms, and the **software** is the
+software the licensor makes available under these terms, including any portion
+of it.
+
+**you** refers to the individual or entity agreeing to these terms.
+
+**your company** is any legal entity, sole proprietorship, or other kind of
+organization that you work for, plus all organizations that have control over,
+are under the control of, or are under common control with that
+organization. **control** means ownership of substantially all the assets of an
+entity, or the power to direct its management and policies by vote, contract, or
+otherwise. Control can be direct or indirect.
+
+**your licenses** are all the licenses granted to you for the software under
+these terms.
+
+**use** means anything you do with the software requiring one of your licenses.
+
+**trademark** means trademarks, service marks, and similar rights.

package/dist/components/floating-toolbar.d.ts

@@ -0,0 +1,2 @@
+export declare function FloatingToolbar(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=floating-toolbar.d.ts.map

package/dist/components/floating-toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-toolbar.d.ts","sourceRoot":"","sources":["../../src/components/floating-toolbar.tsx"],"names":[],"mappings":"AAsCA,wBAAgB,eAAe,mDAQ9B"}

package/dist/components/floating-toolbar.js

@@ -0,0 +1,109 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bold, ChevronDown, Code, Eraser, Heading1, Heading2, Heading3, Italic, List, ListChecks, ListOrdered, Quote, Strikethrough, Type, Underline, } from 'lucide-react';
+import React, { useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, Tooltip, TooltipContent, TooltipTrigger, cn, } from '@moldable-ai/ui';
+import { useFloatingToolbar, } from '../lib/lexical/floating-toolbar-plugin';
+export function FloatingToolbar() {
+    const [anchorElem] = useState(() => typeof document !== 'undefined' ? document.body : null);
+    if (!anchorElem)
+        return null;
+    return _jsx(FloatingToolbarPortal, { anchorElem: anchorElem });
+}
+function FloatingToolbarPortal({ anchorElem }) {
+    const state = useFloatingToolbar();
+    const toolbarRef = useRef(null);
+    useEffect(() => {
+        const toolbar = toolbarRef.current;
+        if (!toolbar || !state.position) {
+            return;
+        }
+        toolbar.style.opacity = '1';
+        toolbar.style.transform = `translate(${state.position.left}px, ${state.position.top}px)`;
+    }, [state.position]);
+    // Handle keyboard shortcuts (undo/redo) when toolbar or its children have focus
+    useEffect(() => {
+        if (!state.isVisible)
+            return;
+        const toolbar = toolbarRef.current;
+        if (!toolbar)
+            return;
+        const handleKeyDown = (event) => {
+            // Check if the active element is within the toolbar
+            const activeElement = document.activeElement;
+            if (!activeElement || !toolbar.contains(activeElement)) {
+                return;
+            }
+            const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+            const isUndo = (isMac ? event.metaKey : event.ctrlKey) &&
+                event.key === 'z' &&
+                !event.shiftKey;
+            const isRedo = (isMac ? event.metaKey : event.ctrlKey) &&
+                ((event.key === 'z' && event.shiftKey) || event.key === 'y');
+            if (isUndo || isRedo) {
+                event.preventDefault();
+                event.stopPropagation();
+                // Focus the editor root element so keyboard shortcuts work
+                const rootElement = state.editor.getRootElement();
+                if (rootElement) {
+                    rootElement.focus();
+                    // Dispatch the keyboard event to the editor
+                    // The HistoryPlugin will handle it automatically
+                    // We preserve all modifier keys and key properties
+                    const keyboardEvent = new KeyboardEvent('keydown', {
+                        key: event.key,
+                        code: event.code,
+                        metaKey: event.metaKey,
+                        ctrlKey: event.ctrlKey,
+                        shiftKey: event.shiftKey,
+                        altKey: event.altKey,
+                        bubbles: true,
+                        cancelable: true,
+                    });
+                    // Use setTimeout to ensure focus has settled before dispatching
+                    setTimeout(() => {
+                        rootElement.dispatchEvent(keyboardEvent);
+                    }, 0);
+                }
+            }
+        };
+        // Use capture phase to catch the event before it bubbles
+        window.addEventListener('keydown', handleKeyDown, true);
+        return () => {
+            window.removeEventListener('keydown', handleKeyDown, true);
+        };
+    }, [state.isVisible, state.editor]);
+    if (!state.isVisible) {
+        return null;
+    }
+    return createPortal(_jsx(FloatingToolbarUI, { state: state, ref: toolbarRef }), anchorElem);
+}
+const FloatingToolbarUI = React.forwardRef(({ state }, ref) => {
+    const { isBold, isItalic, isUnderline, isStrikethrough, isCode, blockType, onBold, onItalic, onUnderline, onStrikethrough, onCode, onParagraph, onHeading, onBulletList, onNumberedList, onCheckList, onQuote, onCodeBlock, onClearFormatting, } = state;
+    const getBlockTypeIcon = () => {
+        switch (blockType) {
+            case 'h1':
+                return _jsx(Heading1, { className: "size-4" });
+            case 'h2':
+                return _jsx(Heading2, { className: "size-4" });
+            case 'h3':
+                return _jsx(Heading3, { className: "size-4" });
+            case 'bullet':
+                return _jsx(List, { className: "size-4" });
+            case 'number':
+                return _jsx(ListOrdered, { className: "size-4" });
+            case 'check':
+                return _jsx(ListChecks, { className: "size-4" });
+            case 'quote':
+                return _jsx(Quote, { className: "size-4" });
+            case 'code':
+                return _jsx(Code, { className: "size-4" });
+            default:
+                return _jsx(Type, { className: "size-4" });
+        }
+    };
+    return (_jsxs("div", { ref: ref, className: "bg-popover fixed left-0 top-0 z-50 flex items-center gap-0.5 rounded-lg border p-1 opacity-0 shadow-md transition-opacity", style: { transform: 'translate(0, 12px)' }, children: [_jsx(Tooltip, { children: _jsxs(DropdownMenu, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "h-7 gap-1 px-2", children: [getBlockTypeIcon(), _jsx(ChevronDown, { className: "size-3" })] }) }) }), _jsx(TooltipContent, { children: _jsx("p", { children: "Text styles" }) }), _jsxs(DropdownMenuContent, { align: "start", children: [_jsxs(DropdownMenuItem, { onClick: onParagraph, className: cn(blockType === 'paragraph' && 'relative'), children: [blockType === 'paragraph' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Type, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Text" })] }), _jsxs(DropdownMenuItem, { onClick: () => onHeading('h1'), className: cn(blockType === 'h1' && 'relative'), children: [blockType === 'h1' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Heading1, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Heading 1" })] }), _jsxs(DropdownMenuItem, { onClick: () => onHeading('h2'), className: cn(blockType === 'h2' && 'relative'), children: [blockType === 'h2' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Heading2, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Heading 2" })] }), _jsxs(DropdownMenuItem, { onClick: () => onHeading('h3'), className: cn(blockType === 'h3' && 'relative'), children: [blockType === 'h3' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Heading3, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Heading 3" })] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: onBulletList, className: cn(blockType === 'bullet' && 'relative'), children: [blockType === 'bullet' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(List, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Bullet list" })] }), _jsxs(DropdownMenuItem, { onClick: onNumberedList, className: cn(blockType === 'number' && 'relative'), children: [blockType === 'number' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(ListOrdered, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Numbered list" })] }), _jsxs(DropdownMenuItem, { onClick: onCheckList, className: cn(blockType === 'check' && 'relative'), children: [blockType === 'check' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(ListChecks, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Checklist" })] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: onQuote, className: cn(blockType === 'quote' && 'relative'), children: [blockType === 'quote' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Quote, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Block quote" })] }), _jsxs(DropdownMenuItem, { onClick: onCodeBlock, className: cn(blockType === 'code' && 'relative'), children: [blockType === 'code' && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Code, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Code block" })] })] })] }) }), _jsx("div", { className: "bg-border mx-0.5 h-5 w-px" }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "sm", className: cn('size-7 p-0', isBold && 'bg-accent text-accent-foreground'), onClick: onBold, children: _jsx(Bold, { className: "size-4" }) }) }), _jsx(TooltipContent, { children: _jsx("p", { children: "Bold" }) })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "sm", className: cn('size-7 p-0', isItalic && 'bg-accent text-accent-foreground'), onClick: onItalic, children: _jsx(Italic, { className: "size-4" }) }) }), _jsx(TooltipContent, { children: _jsx("p", { children: "Italic" }) })] }), _jsx(Tooltip, { children: _jsxs(DropdownMenu, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: cn('h-7 gap-1 px-2', (isUnderline || isStrikethrough || isCode) &&
+                                        'bg-accent text-accent-foreground'), children: [_jsx(Underline, { className: "size-4" }), _jsx(ChevronDown, { className: "size-3" })] }) }) }), _jsx(TooltipContent, { children: _jsx("p", { children: "More formatting" }) }), _jsxs(DropdownMenuContent, { align: "start", children: [_jsxs(DropdownMenuItem, { onClick: onUnderline, className: cn(isUnderline && 'relative'), children: [isUnderline && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Underline, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Underline" })] }), _jsxs(DropdownMenuItem, { onClick: onStrikethrough, className: cn(isStrikethrough && 'relative'), children: [isStrikethrough && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Strikethrough, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Strikethrough" })] }), _jsxs(DropdownMenuItem, { onClick: onCode, className: cn(isCode && 'relative'), children: [isCode && (_jsx("div", { className: "bg-primary absolute -left-1 top-1/2 h-2 w-[3px] -translate-y-1/2 rounded-r-sm" })), _jsx(Code, { className: "size-4" }), _jsx("span", { className: "text-muted-foreground ml-2", children: "Inline code" })] })] })] }) }), _jsx("div", { className: "bg-border mx-0.5 h-5 w-px" }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "sm", className: "h-7 gap-1 px-2", onClick: onClearFormatting, children: _jsx(Eraser, { className: "size-4" }) }) }), _jsx(TooltipContent, { children: _jsx("p", { children: "Clear formatting" }) })] })] }));
+});
+FloatingToolbarUI.displayName = 'FloatingToolbarUI';

package/dist/components/markdown-editor.d.ts

@@ -0,0 +1,15 @@
+interface MarkdownEditorProps {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    className?: string;
+    contentClassName?: string;
+    minHeight?: string;
+    maxHeight?: string;
+    hideMarkdownHint?: boolean;
+}
+export declare function MarkdownEditor({ value, onChange, placeholder, disabled, autoFocus, className, contentClassName, minHeight, maxHeight, hideMarkdownHint, }: MarkdownEditorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=markdown-editor.d.ts.map

package/dist/components/markdown-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-editor.d.ts","sourceRoot":"","sources":["../../src/components/markdown-editor.tsx"],"names":[],"mappings":"AAsCA,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,WAAkC,EAClC,QAAgB,EAChB,SAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,SAAmB,EACnB,SAAkB,EAClB,gBAAwB,GACzB,EAAE,mBAAmB,2CAsGrB"}

package/dist/components/markdown-editor.js

@@ -0,0 +1,80 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin';
+import { AutoLinkPlugin } from '@lexical/react/LexicalAutoLinkPlugin';
+import { CheckListPlugin } from '@lexical/react/LexicalCheckListPlugin';
+import { LexicalComposer } from '@lexical/react/LexicalComposer';
+import { ContentEditable } from '@lexical/react/LexicalContentEditable';
+import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';
+import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
+import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
+import { ListPlugin } from '@lexical/react/LexicalListPlugin';
+import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
+import { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';
+import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { TabIndentationPlugin } from '@lexical/react/LexicalTabIndentationPlugin';
+import { useCallback, useRef } from 'react';
+import { cn } from '@moldable-ai/ui';
+import { LINK_MATCHERS } from '../lib/lexical/auto-link-config';
+import { ClickableLinkPlugin } from '../lib/lexical/clickable-link-plugin';
+import { editorTheme } from '../lib/lexical/editor-theme';
+import { $convertFromMarkdownString, $convertToMarkdownString, markdownTransformers, } from '../lib/lexical/markdown-transformers';
+import { SyncPlugin } from '../lib/lexical/sync-plugin';
+import { FloatingToolbar } from './floating-toolbar';
+import { CodeHighlightNode, CodeNode } from '@lexical/code';
+import { HorizontalRuleNode } from '@lexical/extension';
+import { AutoLinkNode, LinkNode } from '@lexical/link';
+import { ListItemNode, ListNode } from '@lexical/list';
+import { HeadingNode, QuoteNode } from '@lexical/rich-text';
+import { $createParagraphNode, $getRoot } from 'lexical';
+export function MarkdownEditor({ value, onChange, placeholder = 'Write something...', disabled = false, autoFocus = false, className, contentClassName, minHeight = '150px', maxHeight = '50vh', hideMarkdownHint = false, }) {
+    const initialValueRef = useRef(value);
+    const initialConfig = {
+        namespace: 'MarkdownEditor',
+        editorState: () => {
+            const root = $getRoot();
+            if (value) {
+                $convertFromMarkdownString({
+                    markdown: value,
+                    transformers: markdownTransformers,
+                    node: root,
+                    shouldPreserveNewLines: true,
+                });
+            }
+            else {
+                root.append($createParagraphNode());
+            }
+        },
+        nodes: [
+            HeadingNode,
+            QuoteNode,
+            ListNode,
+            ListItemNode,
+            CodeNode,
+            CodeHighlightNode,
+            AutoLinkNode,
+            LinkNode,
+            HorizontalRuleNode,
+        ],
+        onError: (error) => {
+            console.error('MarkdownEditor error:', error);
+        },
+        theme: editorTheme,
+        editable: !disabled,
+    };
+    const handleChange = useCallback((editorState) => {
+        editorState.read(() => {
+            // Use shouldPreserveNewLines: true to preserve empty paragraphs as extra newlines
+            const markdown = $convertToMarkdownString({
+                transformers: markdownTransformers,
+                shouldPreserveNewLines: true,
+            });
+            // Only call onChange if the value actually changed
+            if (markdown !== initialValueRef.current) {
+                initialValueRef.current = markdown;
+                onChange(markdown);
+            }
+        });
+    }, [onChange]);
+    return (_jsx(LexicalComposer, { initialConfig: initialConfig, children: _jsxs("div", { className: cn('relative h-full', className), "data-lexical-editor-container": true, children: [_jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: cn('prose prose-sm caret-primary dark:prose-invert max-w-none resize-none overflow-auto bg-transparent outline-none', disabled && 'cursor-not-allowed opacity-50', contentClassName), style: { minHeight, maxHeight }, "aria-placeholder": placeholder, "data-lexical-editor": "true", placeholder: _jsx("div", { className: "text-muted-foreground pointer-events-none absolute left-0 top-1 text-sm opacity-75", children: placeholder }) }), ErrorBoundary: LexicalErrorBoundary }), _jsx(HistoryPlugin, {}), autoFocus && _jsx(AutoFocusPlugin, {}), _jsx(ListPlugin, {}), _jsx(CheckListPlugin, {}), _jsx(TabIndentationPlugin, {}), _jsx(LinkPlugin, {}), _jsx(AutoLinkPlugin, { matchers: LINK_MATCHERS }), _jsx(ClickableLinkPlugin, {}), _jsx(FloatingToolbar, {}), _jsx(MarkdownShortcutPlugin, { transformers: markdownTransformers }), _jsx(OnChangePlugin, { onChange: handleChange, ignoreSelectionChange: true }), _jsx(SyncPlugin, { value: value, initialValueRef: initialValueRef }), !hideMarkdownHint && (_jsx("div", { className: "mt-1 flex justify-end", children: _jsx("span", { className: "text-muted-foreground/60 text-xs", children: "Markdown supported" }) }))] }) }));
+}

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export { MarkdownEditor } from './components/markdown-editor';
+export { FloatingToolbar } from './components/floating-toolbar';
+export { $convertFromMarkdownString, $convertToMarkdownString, markdownTransformers, HR, } from './lib/lexical/markdown-transformers';
+export { editorTheme } from './lib/lexical/editor-theme';
+export { LINK_MATCHERS, URL_REGEX, EMAIL_REGEX, } from './lib/lexical/auto-link-config';
+export { useFloatingToolbar, type FloatingToolbarState, } from './lib/lexical/floating-toolbar-plugin';
+export { SyncPlugin } from './lib/lexical/sync-plugin';
+export { ClickableLinkPlugin, isUrlSafe, } from './lib/lexical/clickable-link-plugin';
+export { createMoldableHeadlessEditor } from './lib/lexical/headless-editor';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAG/D,OAAO,EACL,0BAA0B,EAC1B,wBAAwB,EACxB,oBAAoB,EACpB,EAAE,GACH,MAAM,qCAAqC,CAAA;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAA;AACxD,OAAO,EACL,aAAa,EACb,SAAS,EACT,WAAW,GACZ,MAAM,gCAAgC,CAAA;AACvC,OAAO,EACL,kBAAkB,EAClB,KAAK,oBAAoB,GAC1B,MAAM,uCAAuC,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AACtD,OAAO,EACL,mBAAmB,EACnB,SAAS,GACV,MAAM,qCAAqC,CAAA;AAG5C,OAAO,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA"}

package/dist/index.js

@@ -0,0 +1,12 @@
+// Components
+export { MarkdownEditor } from './components/markdown-editor';
+export { FloatingToolbar } from './components/floating-toolbar';
+// Lexical utilities (for advanced use cases)
+export { $convertFromMarkdownString, $convertToMarkdownString, markdownTransformers, HR, } from './lib/lexical/markdown-transformers';
+export { editorTheme } from './lib/lexical/editor-theme';
+export { LINK_MATCHERS, URL_REGEX, EMAIL_REGEX, } from './lib/lexical/auto-link-config';
+export { useFloatingToolbar, } from './lib/lexical/floating-toolbar-plugin';
+export { SyncPlugin } from './lib/lexical/sync-plugin';
+export { ClickableLinkPlugin, isUrlSafe, } from './lib/lexical/clickable-link-plugin';
+// Headless editor for server-side operations
+export { createMoldableHeadlessEditor } from './lib/lexical/headless-editor';

package/dist/lib/lexical/auto-link-config.d.ts

@@ -0,0 +1,21 @@
+/**
+ * URL regex pattern for auto-linking
+ * Matches URLs with http/https protocol or www prefix
+ */
+export declare const URL_REGEX: RegExp;
+/**
+ * Email regex pattern for auto-linking
+ * Matches standard email address formats
+ */
+export declare const EMAIL_REGEX: RegExp;
+/**
+ * Link matchers for AutoLinkPlugin
+ * Automatically converts URLs and emails to clickable links
+ */
+export declare const LINK_MATCHERS: ((text: string) => {
+    index: number;
+    length: number;
+    text: string;
+    url: string;
+} | null)[];
+//# sourceMappingURL=auto-link-config.d.ts.map

package/dist/lib/lexical/auto-link-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"auto-link-config.d.ts","sourceRoot":"","sources":["../../../src/lib/lexical/auto-link-config.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,SAAS,QAC2G,CAAA;AAEjI;;;GAGG;AACH,eAAO,MAAM,WAAW,QAC+H,CAAA;AAEvJ;;;GAGG;AACH,eAAO,MAAM,aAAa;;;;;WAOzB,CAAA"}

package/dist/lib/lexical/auto-link-config.js

@@ -0,0 +1,23 @@
+import { createLinkMatcherWithRegExp } from '@lexical/react/LexicalAutoLinkPlugin';
+/**
+ * URL regex pattern for auto-linking
+ * Matches URLs with http/https protocol or www prefix
+ */
+export const URL_REGEX = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)(?<![-.+():%])/;
+/**
+ * Email regex pattern for auto-linking
+ * Matches standard email address formats
+ */
+export const EMAIL_REGEX = /(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/;
+/**
+ * Link matchers for AutoLinkPlugin
+ * Automatically converts URLs and emails to clickable links
+ */
+export const LINK_MATCHERS = [
+    createLinkMatcherWithRegExp(URL_REGEX, (text) => {
+        return text.startsWith('http') ? text : `https://${text}`;
+    }),
+    createLinkMatcherWithRegExp(EMAIL_REGEX, (text) => {
+        return `mailto:${text}`;
+    }),
+];

package/dist/lib/lexical/clickable-link-plugin.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Validates if a URL is safe to open externally.
+ * Only allows http, https, and mailto protocols.
+ */
+export declare function isUrlSafe(url: string): boolean;
+/**
+ * Plugin that makes links clickable in the editor.
+ * Opens links in a new tab with security checks.
+ */
+export declare function ClickableLinkPlugin(): null;
+//# sourceMappingURL=clickable-link-plugin.d.ts.map

package/dist/lib/lexical/clickable-link-plugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clickable-link-plugin.d.ts","sourceRoot":"","sources":["../../../src/lib/lexical/clickable-link-plugin.tsx"],"names":[],"mappings":"AAeA;;;GAGG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAQ9C;AAgBD;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,IAAI,CA4E1C"}

package/dist/lib/lexical/clickable-link-plugin.js

@@ -0,0 +1,97 @@
+'use client';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { useEffect } from 'react';
+import { $isLinkNode } from '@lexical/link';
+import { $findMatchingParent, isHTMLAnchorElement } from '@lexical/utils';
+import { $getNearestNodeFromDOMNode, $getSelection, $isElementNode, $isRangeSelection, getNearestEditorFromDOMNode, isDOMNode, } from 'lexical';
+/**
+ * Validates if a URL is safe to open externally.
+ * Only allows http, https, and mailto protocols.
+ */
+export function isUrlSafe(url) {
+    try {
+        const parsedUrl = new URL(url);
+        const allowedProtocols = ['http:', 'https:', 'mailto:'];
+        return allowedProtocols.includes(parsedUrl.protocol);
+    }
+    catch {
+        return false;
+    }
+}
+function findMatchingDOM(startNode, predicate) {
+    let node = startNode;
+    while (node != null) {
+        if (predicate(node)) {
+            return node;
+        }
+        node = node.parentNode;
+    }
+    return null;
+}
+/**
+ * Plugin that makes links clickable in the editor.
+ * Opens links in a new tab with security checks.
+ */
+export function ClickableLinkPlugin() {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        const onClick = (event) => {
+            const target = event.target;
+            if (!isDOMNode(target)) {
+                return;
+            }
+            const nearestEditor = getNearestEditorFromDOMNode(target);
+            if (nearestEditor === null) {
+                return;
+            }
+            let url = null;
+            nearestEditor.update(() => {
+                const clickedNode = $getNearestNodeFromDOMNode(target);
+                if (clickedNode !== null) {
+                    const maybeLinkNode = $findMatchingParent(clickedNode, $isElementNode);
+                    if ($isLinkNode(maybeLinkNode)) {
+                        url = maybeLinkNode.sanitizeUrl(maybeLinkNode.getURL());
+                    }
+                    else {
+                        const a = findMatchingDOM(target, isHTMLAnchorElement);
+                        if (a !== null) {
+                            url = a.href;
+                        }
+                    }
+                }
+            });
+            if (url === null || url === '') {
+                return;
+            }
+            // Allow user to select link text without following url
+            const selection = editor.getEditorState().read($getSelection);
+            if ($isRangeSelection(selection) && !selection.isCollapsed()) {
+                event.preventDefault();
+                return;
+            }
+            event.preventDefault();
+            if (!isUrlSafe(url)) {
+                console.warn(`Blocked potentially unsafe URL: ${url}`);
+                return;
+            }
+            const isMiddle = event.type === 'auxclick' && event.button === 1;
+            window.open(url, isMiddle || event.metaKey || event.ctrlKey ? '_blank' : '_blank', 'noopener,noreferrer');
+        };
+        const onMouseUp = (event) => {
+            if (event.button === 1) {
+                onClick(event);
+            }
+        };
+        return editor.registerRootListener((rootElement, prevRootElement) => {
+            if (prevRootElement !== null) {
+                prevRootElement.removeEventListener('click', onClick);
+                prevRootElement.removeEventListener('mouseup', onMouseUp);
+            }
+            if (rootElement !== null) {
+                rootElement.addEventListener('click', onClick);
+                rootElement.addEventListener('mouseup', onMouseUp);
+            }
+        });
+    }, [editor]);
+    return null;
+}

package/dist/lib/lexical/editor-theme.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Lexical Editor Theme
+ * Tailwind CSS classes for styling the editor content
+ */
+export declare const editorTheme: {
+    paragraph: string;
+    placeholder: string;
+    text: {
+        bold: string;
+        italic: string;
+        underline: string;
+        strikethrough: string;
+        underlineStrikethrough: string;
+        code: string;
+    };
+    heading: {
+        h1: string;
+        h2: string;
+        h3: string;
+        h4: string;
+        h5: string;
+        h6: string;
+    };
+    list: {
+        nested: {
+            listitem: string;
+        };
+        ol: string;
+        ul: string;
+        listitem: string;
+        listitemChecked: string;
+        listitemUnchecked: string;
+    };
+    link: string;
+    quote: string;
+    code: string;
+};
+//# sourceMappingURL=editor-theme.d.ts.map

package/dist/lib/lexical/editor-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-theme.d.ts","sourceRoot":"","sources":["../../../src/lib/lexical/editor-theme.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCvB,CAAA"}

package/dist/lib/lexical/editor-theme.js

@@ -0,0 +1,37 @@
+/**
+ * Lexical Editor Theme
+ * Tailwind CSS classes for styling the editor content
+ */
+export const editorTheme = {
+    paragraph: 'my-1',
+    placeholder: 'text-sm text-muted-foreground! opacity-50',
+    text: {
+        bold: 'font-bold',
+        italic: 'italic',
+        underline: 'underline',
+        strikethrough: 'line-through',
+        underlineStrikethrough: 'underline line-through',
+        code: 'bg-muted px-1.5 py-0.5 rounded font-mono text-sm',
+    },
+    heading: {
+        h1: 'text-2xl font-bold my-3',
+        h2: 'text-xl font-bold my-2',
+        h3: 'text-lg font-bold my-2',
+        h4: 'text-base font-bold my-1',
+        h5: 'text-sm font-bold my-1',
+        h6: 'text-xs font-bold my-1',
+    },
+    list: {
+        nested: {
+            listitem: 'lexical-nested-listitem',
+        },
+        ol: 'ml-4 list-outside list-decimal',
+        ul: 'ml-4 list-outside list-disc',
+        listitem: '',
+        listitemChecked: 'lexical-listitem-checked',
+        listitemUnchecked: 'lexical-listitem-unchecked',
+    },
+    link: 'text-primary underline hover:text-primary/80 cursor-pointer',
+    quote: 'border-l-4 border-muted px-4 py-2 my-2 text-muted-foreground',
+    code: 'bg-muted p-3 my-4 rounded font-mono text-sm',
+};

package/dist/lib/lexical/floating-toolbar-plugin.d.ts

@@ -0,0 +1,30 @@
+import { LexicalEditor } from 'lexical';
+export type FloatingToolbarState = {
+    isVisible: boolean;
+    isBold: boolean;
+    isItalic: boolean;
+    isUnderline: boolean;
+    isStrikethrough: boolean;
+    isCode: boolean;
+    blockType: string;
+    editor: LexicalEditor;
+    position: {
+        top: number;
+        left: number;
+    } | null;
+    onBold: () => void;
+    onItalic: () => void;
+    onUnderline: () => void;
+    onStrikethrough: () => void;
+    onCode: () => void;
+    onParagraph: () => void;
+    onHeading: (size: 'h1' | 'h2' | 'h3') => void;
+    onBulletList: () => void;
+    onNumberedList: () => void;
+    onCheckList: () => void;
+    onQuote: () => void;
+    onCodeBlock: () => void;
+    onClearFormatting: () => void;
+};
+export declare function useFloatingToolbar(): FloatingToolbarState;
+//# sourceMappingURL=floating-toolbar-plugin.d.ts.map

package/dist/lib/lexical/floating-toolbar-plugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-toolbar-plugin.d.ts","sourceRoot":"","sources":["../../../src/lib/lexical/floating-toolbar-plugin.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAKL,aAAa,EAGd,MAAM,SAAS,CAAA;AAEhB,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,OAAO,CAAA;IAClB,MAAM,EAAE,OAAO,CAAA;IACf,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,eAAe,EAAE,OAAO,CAAA;IACxB,MAAM,EAAE,OAAO,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,aAAa,CAAA;IACrB,QAAQ,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;IAC9C,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,SAAS,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7C,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,iBAAiB,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAED,wBAAgB,kBAAkB,IAAI,oBAAoB,CAkQzD"}