@multiplatform.one/rich-text 6.1.0 → 6.4.0

package/types/types.d.ts

@@ -0,0 +1,147 @@
+/**
+ * Shared types for the rich text editor
+ */
+import type { FontSizeTokens } from "tamagui";
+import type { MentionItem } from "@multiplatform.one/forms";
+/**
+ * Mention wiring for the @ suggestion popup (web). Uses the forms
+ * `MentionItem` contract (LC-16: same data shape as MentionInput).
+ */
+export interface RichTextMentionOptions {
+    /** Trigger character (default "@") */
+    trigger?: string;
+    /** Returns suggestion items for a query (sync or async) */
+    items: (query: string) => MentionItem[] | Promise<MentionItem[]>;
+}
+/**
+ * Capability surface of the editor:
+ * - "full": every extension and toolbar control (default).
+ * - "markdown": WYSIWYG constrained to what GFM markdown can express —
+ *   non-markdown extensions (underline, highlight, text color, alignment,
+ *   sub/superscript, details, inline math, mentions) are NOT registered
+ *   (commands absent, not just hidden), the toolbar shows only the
+ *   markdown-expressible controls, `initialContent` is parsed as markdown,
+ *   and `onChange` emits a markdown string.
+ */
+export type EditorCapabilities = "full" | "markdown";
+export type TextAlignment = "left" | "center" | "right" | "justify";
+export type EditorCommand = "bold" | "italic" | "underline" | "strike" | "code" | "subscript" | "superscript" | "heading1" | "heading2" | "heading3" | "heading4" | "heading5" | "heading6" | "paragraph" | "bulletList" | "orderedList" | "taskList" | "blockquote" | "codeBlock" | "link" | "image" | "undo" | "redo" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "textColor" | "highlight" | "horizontalRule" | "clearFormatting" | "insertTable" | "addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "mergeCells" | "splitCell" | "toggleHeaderRow";
+export interface EditorState {
+    isBold: boolean;
+    isItalic: boolean;
+    isUnderline: boolean;
+    isStrike: boolean;
+    isCode: boolean;
+    isSubscript: boolean;
+    isSuperscript: boolean;
+    isHeading1: boolean;
+    isHeading2: boolean;
+    isHeading3: boolean;
+    isHeading4: boolean;
+    isHeading5: boolean;
+    isHeading6: boolean;
+    isParagraph: boolean;
+    isBulletList: boolean;
+    isOrderedList: boolean;
+    isTaskList: boolean;
+    isBlockquote: boolean;
+    isCodeBlock: boolean;
+    isLink: boolean;
+    canUndo: boolean;
+    canRedo: boolean;
+    textAlign: TextAlignment;
+    /** Current text color (null means default) */
+    textColor: string | null;
+    /** Current highlight/background color (null means none) */
+    highlightColor: string | null;
+    /** Total word count */
+    wordCount: number;
+    /** Total character count */
+    characterCount: number;
+}
+export declare const defaultEditorState: EditorState;
+export interface RichEditorRef {
+    /** Execute an editor command */
+    executeCommand: (command: EditorCommand, payload?: any) => void;
+    /** Get the current editor state */
+    getState: () => EditorState;
+    /** Get the content as HTML */
+    getHTML: () => string;
+    /** Get the content as JSON (ProseMirror format) */
+    getJSON: () => any;
+    /** Get the content serialized to GFM markdown (web) */
+    getMarkdown: () => string;
+    /** Set content from HTML */
+    setHTML: (html: string) => void;
+    /** Set content from JSON */
+    setJSON: (json: any) => void;
+    /** Set content from a markdown string without emitting onChange (web) */
+    setMarkdown: (markdown: string) => void;
+    /** Focus the editor */
+    focus: () => void;
+    /** Blur the editor */
+    blur: () => void;
+}
+export interface RichEditorProps {
+    /**
+     * Capability preset (default "full"). With "markdown", only the
+     * markdown-expressible extensions register, the toolbar shows only the
+     * corresponding controls, `initialContent` is parsed as markdown, and
+     * `onChange` receives a markdown string. Fixed at mount.
+     */
+    capabilities?: EditorCapabilities;
+    /** Initial content as HTML ("full") or markdown ("markdown" capabilities) */
+    initialContent?: string;
+    /** Initial content as JSON (takes precedence over initialContent) */
+    initialJSON?: any;
+    /** Placeholder text when editor is empty */
+    placeholder?: string;
+    /** Whether the editor is editable */
+    editable?: boolean;
+    /** Auto focus on mount */
+    autoFocus?: boolean;
+    /** Called when content changes */
+    onChange?: (html: string, json: any) => void;
+    /** Called when editor state changes (bold, italic, etc.) */
+    onStateChange?: (state: EditorState) => void;
+    /** Called when editor is focused */
+    onFocus?: () => void;
+    /** Called when editor is blurred */
+    onBlur?: () => void;
+    /** Minimum height of the editor */
+    minHeight?: number;
+    /** Maximum height of the editor */
+    maxHeight?: number;
+    /** Show error state */
+    hasError?: boolean;
+    /**
+     * Uploads a pasted/dropped image and resolves its URL (web). Without it,
+     * images are inlined as base64 data URIs.
+     */
+    onImageUpload?: (file: File) => Promise<string>;
+    /**
+     * Uploads a pasted/dropped non-image file and resolves its URL (web).
+     * Inserts an attachment chip link; without it, non-image files are ignored.
+     */
+    onFileUpload?: (file: File) => Promise<{
+        url: string;
+        name?: string;
+    }>;
+    /** Enables the @ mention suggestion popup (web) */
+    mentions?: RichTextMentionOptions;
+}
+export type EditorMode = "richtext" | "markdown";
+/** Maps each EditorCommand to whether 10Tap natively supports it */
+export type NativeCapability = Record<EditorCommand, boolean>;
+/** Toolbar section identifiers for visibility config */
+export type ToolbarSection = "history" | "formatting" | "color" | "heading" | "alignment" | "list" | "block" | "link" | "image" | "clear";
+/** Values provided by RichEditorContext via createStyledContext */
+export interface RichEditorContextValue {
+    /** Size token for toolbar buttons and editor sizing */
+    size: FontSizeTokens;
+    /** Whether to use compact sizing */
+    compact: boolean;
+    /** Whether the editor is disabled */
+    disabled: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

package/types/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/cjs/RichEditor.stories.cjs

@@ -1,327 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
-};
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-var RichEditor_stories_exports = {};
-__export(RichEditor_stories_exports, {
-  BubbleToolbarOnly: () => BubbleToolbarOnly,
-  FormIntegrated: () => FormIntegrated,
-  Interactive: () => Interactive,
-  Main: () => Main,
-  MinimalToolbar: () => MinimalToolbar,
-  ReadOnly: () => ReadOnly,
-  Skeleton: () => Skeleton,
-  WithError: () => WithError,
-  WithInitialContent: () => WithInitialContent,
-  WithMaxHeight: () => WithMaxHeight,
-  WithoutToolbar: () => WithoutToolbar,
-  default: () => RichEditor_stories_default
-});
-module.exports = __toCommonJS(RichEditor_stories_exports);
-var import_react_form = require("@tanstack/react-form");
-var import_react = require("react");
-var import_tamagui = require("tamagui");
-var import_RichTextEditor = require("./RichTextEditor/index.cjs");
-var import_RichEditor = require("./RichEditor.cjs");
-var import_jsx_runtime = require("react/jsx-runtime");
-const meta = {
-  title: "Forms/RichTextEditor",
-  component: import_RichTextEditor.RichTextEditor,
-  parameters: {
-    layout: "padded"
-  },
-  argTypes: {
-    label: {
-      control: "text"
-    },
-    placeholder: {
-      control: "text"
-    },
-    helperText: {
-      control: "text"
-    },
-    error: {
-      control: "text"
-    },
-    required: {
-      control: "boolean"
-    },
-    disabled: {
-      control: "boolean"
-    },
-    readOnly: {
-      control: "boolean"
-    },
-    showToolbar: {
-      control: "boolean"
-    },
-    showBubbleToolbar: {
-      control: "boolean"
-    },
-    compact: {
-      control: "boolean"
-    },
-    skeleton: {
-      control: "boolean"
-    },
-    size: {
-      control: "select",
-      options: ["$2", "$3", "$4"]
-    },
-    minHeight: {
-      control: "number"
-    },
-    maxHeight: {
-      control: "number"
-    },
-    sections: {
-      control: false
-    },
-    form: {
-      control: false
-    },
-    validators: {
-      control: false
-    }
-  },
-  decorators: [Story => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
-    padding: "$4",
-    maxWidth: 800,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(Story, {})
-  })]
-};
-var RichEditor_stories_default = meta;
-const Main = {
-  args: {
-    label: "Content",
-    placeholder: "Start typing your content...",
-    helperText: "Rich text editor with full formatting support",
-    minHeight: 200,
-    showToolbar: true,
-    showBubbleToolbar: false,
-    compact: false,
-    skeleton: false
-  }
-};
-const WithInitialContent = {
-  args: {
-    label: "Article Body",
-    defaultValue: `
-      <h1>Welcome to the Rich Editor</h1>
-      <p>This is a <strong>rich text editor</strong> built with <em>Tiptap</em>.</p>
-      <h2>Features</h2>
-      <ul>
-        <li>Bold, italic, underline, strikethrough</li>
-        <li>Headings (H1-H6)</li>
-        <li>Bullet and numbered lists</li>
-        <li>Blockquotes and code blocks</li>
-        <li>Links and images</li>
-        <li>Text color and highlighting</li>
-      </ul>
-      <blockquote>
-        <p>This is a blockquote with some important information.</p>
-      </blockquote>
-      <p>Here is some <code>inline code</code> for you.</p>
-    `,
-    minHeight: 300
-  }
-};
-const WithoutToolbar = {
-  args: {
-    label: "No Toolbar",
-    showToolbar: false,
-    defaultValue: "<p>Editor without toolbar - keyboard shortcuts still work</p>",
-    minHeight: 150
-  }
-};
-const BubbleToolbarOnly = {
-  args: {
-    label: "Bubble Toolbar Only",
-    showToolbar: false,
-    showBubbleToolbar: true,
-    defaultValue: "<p>Select some text to see the bubble toolbar appear with inline formatting options.</p>",
-    minHeight: 150,
-    helperText: "Select text to see the bubble toolbar"
-  }
-};
-const MinimalToolbar = {
-  args: {
-    label: "Minimal Toolbar",
-    sections: ["formatting", "list"],
-    defaultValue: "<p>Minimal toolbar with only formatting and list options</p>",
-    minHeight: 150,
-    helperText: "Only text formatting and list controls are shown"
-  }
-};
-const ReadOnly = {
-  args: {
-    label: "Read-only Content",
-    readOnly: true,
-    defaultValue: `
-      <h2>Read-only Content</h2>
-      <p>This content cannot be edited. The toolbar is hidden.</p>
-      <ul>
-        <li>View-only mode for displaying formatted content</li>
-        <li>No toolbar or editing capabilities</li>
-      </ul>
-    `,
-    minHeight: 150
-  }
-};
-const WithError = {
-  args: {
-    label: "Content",
-    error: "This field is required",
-    placeholder: "This field has an error...",
-    required: true,
-    minHeight: 150
-  }
-};
-const WithMaxHeight = {
-  args: {
-    label: "Scrollable Content",
-    defaultValue: `
-      <h1>Scrollable Content</h1>
-      <p>This editor has a maximum height and will scroll when content exceeds it.</p>
-      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
-      <p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
-      <p>Duis aute irure dolor in reprehenderit in voluptate velit.</p>
-      <p>Excepteur sint occaecat cupidatat non proident.</p>
-      <p>Sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
-      <p>More content to demonstrate scrolling...</p>
-      <p>And even more content...</p>
-      <p>Keep scrolling...</p>
-    `,
-    minHeight: 150,
-    maxHeight: 250
-  }
-};
-const Interactive = {
-  render: () => {
-    const editorRef = (0, import_react.useRef)(null);
-    const [html, setHtml] = (0, import_react.useState)("");
-    const [charCount, setCharCount] = (0, import_react.useState)(0);
-    const handleChange = newHtml => {
-      setHtml(newHtml);
-      const text = newHtml.replace(/<[^>]*>/g, "");
-      setCharCount(text.length);
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-      gap: "$4",
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_RichEditor.RichEditor, {
-        ref: editorRef,
-        placeholder: "Type here to see live updates...",
-        onChange: handleChange,
-        minHeight: 200,
-        showBubbleToolbar: true
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-        gap: "$4",
-        alignItems: "center",
-        children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Text, {
-          color: "$color10",
-          fontSize: "$2",
-          children: ["Characters: ", charCount]
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Button, {
-          size: "$3",
-          onPress: () => {
-            const content = editorRef.current?.getHTML();
-            console.log("HTML Content:", content);
-          },
-          children: "Log HTML"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Button, {
-          size: "$3",
-          onPress: () => {
-            editorRef.current?.setHTML("<p>Content set programmatically!</p>");
-          },
-          children: "Set Content"
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Button, {
-          size: "$3",
-          onPress: () => editorRef.current?.focus(),
-          children: "Focus"
-        })]
-      }), html && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
-        backgroundColor: "$color3",
-        padding: "$3",
-        borderRadius: "$3",
-        maxHeight: 200,
-        overflow: "scroll",
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
-          size: "$1",
-          fontFamily: "$mono",
-          whiteSpace: "pre-wrap",
-          children: html
-        })
-      })]
-    });
-  }
-};
-const FormIntegrated = {
-  render: () => {
-    const FormExample = () => {
-      const form = (0, import_react_form.useForm)({
-        defaultValues: {
-          title: "",
-          content: ""
-        },
-        onSubmit: async ({
-          value
-        }) => {
-          console.log("Form submitted:", value);
-          alert(JSON.stringify(value, null, 2));
-        }
-      });
-      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
-        gap: "$4",
-        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_RichTextEditor.RichTextEditor, {
-          form,
-          name: "content",
-          label: "Article Content",
-          helperText: "Write your article content here",
-          required: true,
-          placeholder: "Start writing...",
-          minHeight: 250,
-          showBubbleToolbar: true
-        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Button, {
-            size: "$3",
-            onPress: () => form.handleSubmit(),
-            children: "Submit"
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Button, {
-            size: "$3",
-            theme: "gray",
-            onPress: () => form.reset(),
-            children: "Reset"
-          })]
-        })]
-      });
-    };
-    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FormExample, {});
-  }
-};
-const Skeleton = {
-  args: {
-    skeleton: true,
-    label: "Loading Content",
-    minHeight: 200
-  }
-};