@haklex/rich-editor 0.0.32 → 0.0.34

package/dist/styles-entry.mjs

@@ -1,26 +1,14 @@
-import { a, c, d, b, e, g, n } from "./utils-C9cpKf8S.js";
-var richContent = "r8uj4t0";
-var articleTheme = "_17pm0gw0";
-var commentTheme = "_17pm0gw1";
-var darkArticleTheme = "_17pm0gw2";
-var darkCommentTheme = "_17pm0gw3";
-var noteTheme = "_17pm0gw4";
-var darkNoteTheme = "_17pm0gw5";
-var vars = { color: { text: "var(--rc-text)", textSecondary: "var(--rc-text-secondary)", bg: "var(--rc-bg)", bgSecondary: "var(--rc-bg-secondary)", bgTertiary: "var(--rc-bg-tertiary)", border: "var(--rc-border)", accent: "var(--rc-accent)", accentLight: "var(--rc-accent-light)", link: "var(--rc-link)", codeText: "var(--rc-code-text)", codeBg: "var(--rc-code-bg)", hrBorder: "var(--rc-hr-border)", quoteBorder: "var(--rc-quote-border)", quoteBg: "var(--rc-quote-bg)", alertInfo: "var(--rc-alert-info)", alertWarning: "var(--rc-alert-warning)", alertTip: "var(--rc-alert-tip)", alertCaution: "var(--rc-alert-caution)", alertImportant: "var(--rc-alert-important)" }, spacing: { xs: "var(--rc-space-xs)", sm: "var(--rc-space-sm)", md: "var(--rc-space-md)", lg: "var(--rc-space-lg)", xl: "var(--rc-space-xl)" }, typography: { fontFamily: "var(--rc-font-family)", fontFamilySans: "var(--rc-font-family-sans)", fontFamilySerif: "var(--rc-font-family-serif)", fontMono: "var(--rc-font-mono)", fontSize2xs: "var(--rc-font-size-2xs)", fontSizeXs: "var(--rc-font-size-xs)", fontSizeSm: "var(--rc-font-size-sm)", fontSizeMd: "var(--rc-font-size-md)", fontSizeLg: "var(--rc-font-size-lg)", fontSizeBase: "var(--rc-font-size-base)", fontSizeSmall: "var(--rc-font-size-small)", lineHeight: "var(--rc-line-height)", lineHeightTight: "var(--rc-line-height-tight)" }, borderRadius: { sm: "var(--rc-radius-sm)", md: "var(--rc-radius-md)", lg: "var(--rc-radius-lg)" }, layout: { maxWidth: "var(--rc-max-width)" } };
+import { a, c, g, n } from "./utils-fpeaZV1R.js";
+import { r } from "./shared.css-BqX4HjVE.js";
+import { articleTheme, commentTheme, noteTheme, vars } from "@haklex/rich-style-token";
 export {
   articleTheme,
   a as articleVariant,
   commentTheme,
   c as commentVariant,
-  darkArticleTheme,
-  d as darkArticleVariant,
-  darkCommentTheme,
-  b as darkCommentVariant,
-  darkNoteTheme,
-  e as darkNoteVariant,
   g as getVariantClass,
   noteTheme,
   n as noteVariant,
-  richContent,
+  r as richContent,
   vars
 };

package/dist/{theme-C_ic3l9g.js → theme-DOLFsBRg.js}

@@ -7,7 +7,7 @@ import { LinkNode, AutoLinkNode } from "@lexical/link";
 import { ListNode, ListItemNode } from "@lexical/list";
 import { HeadingNode, QuoteNode } from "@lexical/rich-text";
 import { TableNode, TableCellNode, TableRowNode } from "@lexical/table";
-import { DecoratorNode, $insertNodes, ElementNode, $getNodeByKey } from "lexical";
+import { DecoratorNode, $insertNodes, ElementNode, createCommand, $getNodeByKey } from "lexical";
 import { createContext, use, useMemo, createElement, useState, useRef, useEffect, useCallback } from "react";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { OctagonAlert, TriangleAlert, MessageSquareWarning, Lightbulb, Info, Code, ChevronRight, ImageIcon, Sigma, Link, Workflow, Video } from "lucide-react";
@@ -1286,6 +1286,9 @@ function ImageRenderer({
     )
   ] });
 }
+const OPEN_IMAGE_UPLOAD_DIALOG_COMMAND = createCommand(
+  "OPEN_IMAGE_UPLOAD_DIALOG_COMMAND"
+);
 function sanitizeImageSrc(src) {
   const trimmed = src.trim();
   if (/^(javascript\s*:|vbscript\s*:|data\s*:(?!image\/))/i.test(trimmed)) {
@@ -1372,6 +1375,52 @@ const _ImageNode = class _ImageNode extends DecoratorNode {
       version: 1
     };
   }
+  setSrc(src) {
+    const writable = this.getWritable();
+    writable.__src = sanitizeImageSrc(src);
+  }
+  setAltText(altText) {
+    const writable = this.getWritable();
+    writable.__altText = altText;
+  }
+  setCaption(caption) {
+    const writable = this.getWritable();
+    writable.__caption = caption;
+  }
+  setDimensions(width, height) {
+    const writable = this.getWritable();
+    writable.__width = width;
+    writable.__height = height;
+  }
+  setThumbhash(thumbhash) {
+    const writable = this.getWritable();
+    writable.__thumbhash = thumbhash;
+  }
+  setAccent(accent) {
+    const writable = this.getWritable();
+    writable.__accent = sanitizeColor(accent);
+  }
+  getSrc() {
+    return this.__src;
+  }
+  getAltText() {
+    return this.__altText;
+  }
+  getCaption() {
+    return this.__caption;
+  }
+  getWidth() {
+    return this.__width;
+  }
+  getHeight() {
+    return this.__height;
+  }
+  getThumbhash() {
+    return this.__thumbhash;
+  }
+  getAccent() {
+    return this.__accent;
+  }
   decorate(_editor, _config) {
     return createRendererDecoration("Image", ImageRenderer, {
       src: this.__src,
@@ -1392,6 +1441,10 @@ __publicField(_ImageNode, "slashMenuItems", [
     keywords: ["image", "picture", "photo"],
     section: "MEDIA",
     onSelect: (editor) => {
+      const opened = editor.dispatchCommand(
+        OPEN_IMAGE_UPLOAD_DIALOG_COMMAND
+      );
+      if (opened) return;
       editor.update(() => {
         $insertNodes([$createImageNode({ src: "", altText: "" })]);
       });
@@ -1402,6 +1455,9 @@ let ImageNode = _ImageNode;
 function $createImageNode(payload) {
   return new ImageNode(payload);
 }
+function $isImageNode(node) {
+  return node instanceof ImageNode;
+}
 let katexModule = null;
 let katexLoadPromise = null;
 function loadKaTeX() {
@@ -2144,46 +2200,48 @@ const editorTheme = {
 export {
   $createFootnoteSectionNode as $,
   ALERT_LABELS as A,
-  BANNER_LABELS as B,
+  ALERT_TYPES as B,
   ColorSchemeProvider as C,
-  FootnoteSectionNode as D,
-  FootnoteStaticRenderer as E,
+  BANNER_LABELS as D,
+  BANNER_TYPES as E,
   FootnoteDefinitionsProvider as F,
-  GridContainerNode as G,
-  KaTeXInlineNode as H,
-  KaTeXRenderer as I,
-  LinkCardRenderer as J,
+  FootnoteSectionNode as G,
+  FootnoteStaticRenderer as H,
+  GridContainerNode as I,
+  ImageNode as J,
   KaTeXBlockNode as K,
-  LinkCardNode as L,
-  MermaidNode as M,
+  KaTeXInlineNode as L,
+  KaTeXRenderer as M,
   NestedContentRendererProvider as N,
-  computeImageMeta as O,
-  decodeThumbHash as P,
-  $isAlertQuoteNode as Q,
+  LinkCardNode as O,
+  LinkCardRenderer as P,
+  MermaidNode as Q,
   RendererConfigProvider as R,
-  AlertRenderer as S,
-  SpoilerNode as T,
-  MentionNode as U,
-  FootnoteNode as V,
-  AlertQuoteNode as W,
-  $isBannerNode as X,
-  BannerRenderer as Y,
-  BannerNode as Z,
-  normalizeBannerType as _,
+  OPEN_IMAGE_UPLOAD_DIALOG_COMMAND as S,
+  computeImageMeta as T,
+  decodeThumbHash as U,
+  $isAlertQuoteNode as V,
+  AlertRenderer as W,
+  SpoilerNode as X,
+  MentionNode as Y,
+  FootnoteNode as Z,
+  AlertQuoteNode as _,
   allNodes as a,
-  $isCodeBlockNode as a0,
-  CodeBlockRenderer as a1,
-  CodeBlockNode as a2,
-  ImageNode as a3,
-  VideoNode as a4,
-  DetailsNode as a5,
-  $createImageNode as a6,
-  $createKaTeXInlineNode as a7,
-  $createKaTeXBlockNode as a8,
-  $createDetailsNode as a9,
-  $createFootnoteNode as aa,
-  $createMentionNode as ab,
-  $createSpoilerNode as ac,
+  $isBannerNode as a0,
+  BannerRenderer as a1,
+  BannerNode as a2,
+  normalizeBannerType as a3,
+  $isCodeBlockNode as a4,
+  CodeBlockRenderer as a5,
+  CodeBlockNode as a6,
+  VideoNode as a7,
+  DetailsNode as a8,
+  $createKaTeXInlineNode as a9,
+  $createKaTeXBlockNode as aa,
+  $createDetailsNode as ab,
+  $createFootnoteNode as ac,
+  $createMentionNode as ad,
+  $createSpoilerNode as ae,
   builtinNodes as b,
   customNodes as c,
   RendererWrapper as d,
@@ -2198,15 +2256,15 @@ export {
   useRendererMode as m,
   useVariant as n,
   $createGridContainerNode as o,
-  $createLinkCardNode as p,
-  $createMermaidNode as q,
-  $isFootnoteSectionNode as r,
-  $isGridContainerNode as s,
-  $isKaTeXBlockNode as t,
+  $createImageNode as p,
+  $createLinkCardNode as q,
+  $createMermaidNode as r,
+  $isFootnoteSectionNode as s,
+  $isGridContainerNode as t,
   useColorScheme as u,
-  $isKaTeXInlineNode as v,
-  $isLinkCardNode as w,
-  $isMermaidNode as x,
-  ALERT_TYPES as y,
-  BANNER_TYPES as z
+  $isImageNode as v,
+  $isKaTeXBlockNode as w,
+  $isKaTeXInlineNode as x,
+  $isLinkCardNode as y,
+  $isMermaidNode as z
 };

package/dist/types.d.ts

@@ -1,6 +1,7 @@
 import { Klass, LexicalEditor, LexicalNode, SerializedEditorState } from 'lexical';
 import { ReactNode } from 'react';
 import { ColorScheme } from './context/ColorSchemeContext';
+import { ImageUploadFn } from './plugins/ImageUploadPlugin';
 import { RendererConfig } from './types/renderer-config';
 export type RichEditorVariant = 'article' | 'comment' | 'note';
 export interface RichEditorProps {
@@ -18,6 +19,7 @@ export interface RichEditorProps {
     onEditorReady?: (editor: LexicalEditor | null) => void;
     extraNodes?: Array<Klass<LexicalNode>>;
     rendererConfig?: RendererConfig;
+    imageUpload?: ImageUploadFn;
     debounceMs?: number;
     children?: ReactNode;
 }

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,aAAa,EACb,WAAW,EACX,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAE7D,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;AAE9D,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACjD,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAA;IACtD,UAAU,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAA;IACtC,cAAc,CAAC,EAAE,cAAc,CAAA;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,aAAa,EACb,WAAW,EACX,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAA;AAC/D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAChE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAE7D,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;AAE9D,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACjD,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAA;IACtD,UAAU,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAA;IACtC,cAAc,CAAC,EAAE,cAAc,CAAA;IAC/B,WAAW,CAAC,EAAE,aAAa,CAAA;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB"}

package/dist/utils-fpeaZV1R.js

@@ -0,0 +1,18 @@
+var articleVariant = "v10dui1 r8uj4t0 _13h71jk0 v10dui0";
+var commentVariant = "_14ko36c1 r8uj4t0 _13h71jk2 _14ko36c0";
+var noteVariant = "ys4fw91 r8uj4t0 _13h71jk1 ys4fw90";
+function clsx(...args) {
+  return args.filter(Boolean).join(" ");
+}
+function getVariantClass(variant) {
+  if (variant === "comment") return commentVariant;
+  if (variant === "note") return noteVariant;
+  return articleVariant;
+}
+export {
+  articleVariant as a,
+  clsx as b,
+  commentVariant as c,
+  getVariantClass as g,
+  noteVariant as n
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haklex/rich-editor",
-  "version": "0.0.32",
+  "version": "0.0.34",
   "description": "Core rich text editor based on Lexical",
   "license": "MIT",
   "type": "module",
@@ -29,9 +29,9 @@
   ],
   "dependencies": {
     "thumbhash": "^0.1.1",
-    "@haklex/rich-editor-ui": "0.0.32",
-    "@haklex/rich-headless": "0.0.32",
-    "@haklex/rich-style-token": "0.0.32"
+    "@haklex/rich-style-token": "0.0.34",
+    "@haklex/rich-editor-ui": "0.0.34",
+    "@haklex/rich-headless": "0.0.34"
   },
   "devDependencies": {
     "@base-ui/react": "^1.2.0",

package/dist/styles/vars.css.d.ts

@@ -1,8 +0,0 @@
-export declare const articleTheme: string;
-export declare const commentTheme: string;
-export declare const darkArticleTheme: string;
-export declare const darkCommentTheme: string;
-export declare const noteTheme: string;
-export declare const darkNoteTheme: string;
-export { vars } from '@haklex/rich-style-token';
-//# sourceMappingURL=vars.css.d.ts.map

package/dist/styles/vars.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"vars.css.d.ts","sourceRoot":"","sources":["../../src/styles/vars.css.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,YAAY,QAGvB,CAAA;AAEF,eAAO,MAAM,YAAY,QAGvB,CAAA;AAEF,eAAO,MAAM,gBAAgB,QAG3B,CAAA;AAEF,eAAO,MAAM,gBAAgB,QAG3B,CAAA;AAEF,eAAO,MAAM,SAAS,QAGpB,CAAA;AAEF,eAAO,MAAM,aAAa,QAGxB,CAAA;AAGF,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA"}

package/dist/utils-C9cpKf8S.js

@@ -1,28 +0,0 @@
-var articleVariant = "v10dui1 r8uj4t0 _17pm0gw0 v10dui0";
-var darkArticleVariant = "v10dui2 r8uj4t0 _17pm0gw2 v10dui0";
-var commentVariant = "_14ko36c1 r8uj4t0 _17pm0gw1 _14ko36c0";
-var darkCommentVariant = "_14ko36c2 r8uj4t0 _17pm0gw3 _14ko36c0";
-var noteVariant = "ys4fw91 r8uj4t0 _17pm0gw4 ys4fw90";
-var darkNoteVariant = "ys4fw92 r8uj4t0 _17pm0gw5 ys4fw90";
-function clsx(...args) {
-  return args.filter(Boolean).join(" ");
-}
-function getVariantClass(variant, colorScheme) {
-  if (variant === "comment") {
-    return colorScheme === "dark" ? darkCommentVariant : commentVariant;
-  }
-  if (variant === "note") {
-    return colorScheme === "dark" ? darkNoteVariant : noteVariant;
-  }
-  return colorScheme === "dark" ? darkArticleVariant : articleVariant;
-}
-export {
-  articleVariant as a,
-  darkCommentVariant as b,
-  commentVariant as c,
-  darkArticleVariant as d,
-  darkNoteVariant as e,
-  clsx as f,
-  getVariantClass as g,
-  noteVariant as n
-};