dn-react-text-editor 0.3.1 → 0.3.3

package/README.md

@@ -7,8 +7,6 @@ A rich text editor component for React built on ProseMirror.
 ```tsx
 import { TextEditor } from "dn-react-text-editor";
 
-const TextEditor = useTextEditor();
-
 function App() {
   return (
     <TextEditor

package/dist/index.d.mts

@@ -1,8 +1,8 @@
-export { TextEditorProps, createTextEditor } from './create_text_editor.mjs';
+export { TextEditor, TextEditorProps } from './text_editor.mjs';
 export { createSchema } from './schema.mjs';
 export { AttachFile, AttachFileOptions, GenerateMetadata, UploadFile, createAttachFile } from './attach_file.mjs';
 export { createInnerHTML, createTextEditorView } from './html.mjs';
-export { TextEditorController, TextEditorControllerProps } from './text_editor_controller.mjs';
+export { ConfigTextEditorOptions, TextEditorController, TextEditorControllerProps, configTextEditorController } from './text_editor_controller.mjs';
 import 'react';
 import 'orderedmap';
 import 'prosemirror-model';

package/dist/index.d.ts

@@ -1,8 +1,8 @@
-export { TextEditorProps, createTextEditor } from './create_text_editor.js';
+export { TextEditor, TextEditorProps } from './text_editor.js';
 export { createSchema } from './schema.js';
 export { AttachFile, AttachFileOptions, GenerateMetadata, UploadFile, createAttachFile } from './attach_file.js';
 export { createInnerHTML, createTextEditorView } from './html.js';
-export { TextEditorController, TextEditorControllerProps } from './text_editor_controller.js';
+export { ConfigTextEditorOptions, TextEditorController, TextEditorControllerProps, configTextEditorController } from './text_editor_controller.js';
 import 'react';
 import 'orderedmap';
 import 'prosemirror-model';

package/dist/index.js

@@ -30,16 +30,17 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  TextEditor: () => TextEditor,
   TextEditorController: () => TextEditorController,
+  configTextEditorController: () => configTextEditorController,
   createAttachFile: () => createAttachFile,
   createInnerHTML: () => createInnerHTML,
   createSchema: () => createSchema,
-  createTextEditor: () => createTextEditor,
   createTextEditorView: () => createTextEditorView
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/create_text_editor.tsx
+// src/text_editor.tsx
 var import_react2 = __toESM(require("react"));
 var import_react3 = require("react");
 
@@ -1010,7 +1011,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -1073,60 +1074,66 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
+var configTextEditorController = (options = {}) => {
+  return (props) => new TextEditorController({
+    ...props,
+    className: props.className || options.className,
+    style: props.style || options.style,
+    attachFile: props.attachFile || options.attachFile
+  });
+};
 
-// src/create_text_editor.tsx
-function createTextEditor(options = {}) {
-  function Component({
-    controller: externalController,
-    name,
-    className,
-    autoFocus,
-    onChange,
-    mode,
-    state,
-    editor,
-    defaultValue,
-    updateDelay,
-    placeholder,
-    ...props
-  } = {}) {
-    const containerRef = (0, import_react3.useRef)(null);
-    const innerController = (0, import_react2.useMemo)(
-      () => new TextEditorController({
-        mode,
-        state,
-        editor,
-        autoFocus,
-        placeholder,
-        updateDelay,
-        defaultValue,
-        className: options.className,
-        style: options.style,
-        attachFile: options.attachFile
-      }),
-      []
-    );
-    const controller = externalController || innerController;
-    (0, import_react3.useEffect)(() => {
-      const container = containerRef.current;
-      if (!container) {
-        return;
-      }
-      controller.bind(container);
-      return () => {
-        controller.dispose();
-      };
-    }, [controller]);
-    return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ import_react2.default.createElement(
-      TextEditorInput,
-      {
-        name,
-        controller,
-        onChange
-      }
-    ));
-  }
-  return Component;
+// src/text_editor.tsx
+function TextEditor({
+  controller: externalController,
+  name,
+  className,
+  autoFocus,
+  onChange,
+  mode,
+  state,
+  editor,
+  defaultValue,
+  updateDelay,
+  placeholder,
+  attachFile,
+  style,
+  ...props
+} = {}) {
+  const containerRef = (0, import_react3.useRef)(null);
+  const innerController = (0, import_react2.useMemo)(
+    () => new TextEditorController({
+      mode,
+      state,
+      editor,
+      autoFocus,
+      placeholder,
+      updateDelay,
+      defaultValue,
+      attachFile,
+      style
+    }),
+    []
+  );
+  const controller = externalController || innerController;
+  (0, import_react3.useEffect)(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    controller.bind(container);
+    return () => {
+      controller.dispose();
+    };
+  }, [controller]);
+  return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ import_react2.default.createElement(
+    TextEditorInput,
+    {
+      name,
+      controller,
+      onChange
+    }
+  ));
 }
 
 // src/html.tsx
@@ -1175,10 +1182,11 @@ function createTextEditorView(options = {}) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  TextEditor,
   TextEditorController,
+  configTextEditorController,
   createAttachFile,
   createInnerHTML,
   createSchema,
-  createTextEditor,
   createTextEditorView
 });

package/dist/index.mjs

@@ -1,4 +1,4 @@
-// src/create_text_editor.tsx
+// src/text_editor.tsx
 import React2, {
   useMemo
 } from "react";
@@ -975,7 +975,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -1038,60 +1038,66 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
+var configTextEditorController = (options = {}) => {
+  return (props) => new TextEditorController({
+    ...props,
+    className: props.className || options.className,
+    style: props.style || options.style,
+    attachFile: props.attachFile || options.attachFile
+  });
+};
 
-// src/create_text_editor.tsx
-function createTextEditor(options = {}) {
-  function Component({
-    controller: externalController,
-    name,
-    className,
-    autoFocus,
-    onChange,
-    mode,
-    state,
-    editor,
-    defaultValue,
-    updateDelay,
-    placeholder,
-    ...props
-  } = {}) {
-    const containerRef = useRef(null);
-    const innerController = useMemo(
-      () => new TextEditorController({
-        mode,
-        state,
-        editor,
-        autoFocus,
-        placeholder,
-        updateDelay,
-        defaultValue,
-        className: options.className,
-        style: options.style,
-        attachFile: options.attachFile
-      }),
-      []
-    );
-    const controller = externalController || innerController;
-    useEffect2(() => {
-      const container = containerRef.current;
-      if (!container) {
-        return;
-      }
-      controller.bind(container);
-      return () => {
-        controller.dispose();
-      };
-    }, [controller]);
-    return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ React2.createElement(
-      TextEditorInput,
-      {
-        name,
-        controller,
-        onChange
-      }
-    ));
-  }
-  return Component;
+// src/text_editor.tsx
+function TextEditor({
+  controller: externalController,
+  name,
+  className,
+  autoFocus,
+  onChange,
+  mode,
+  state,
+  editor,
+  defaultValue,
+  updateDelay,
+  placeholder,
+  attachFile,
+  style,
+  ...props
+} = {}) {
+  const containerRef = useRef(null);
+  const innerController = useMemo(
+    () => new TextEditorController({
+      mode,
+      state,
+      editor,
+      autoFocus,
+      placeholder,
+      updateDelay,
+      defaultValue,
+      attachFile,
+      style
+    }),
+    []
+  );
+  const controller = externalController || innerController;
+  useEffect2(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    controller.bind(container);
+    return () => {
+      controller.dispose();
+    };
+  }, [controller]);
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ React2.createElement(
+    TextEditorInput,
+    {
+      name,
+      controller,
+      onChange
+    }
+  ));
 }
 
 // src/html.tsx
@@ -1139,10 +1145,11 @@ function createTextEditorView(options = {}) {
   };
 }
 export {
+  TextEditor,
   TextEditorController,
+  configTextEditorController,
   createAttachFile,
   createInnerHTML,
   createSchema,
-  createTextEditor,
   createTextEditorView
 };

package/dist/{create_text_editor.d.mts → text_editor.d.mts}

@@ -1,4 +1,4 @@
-import { DetailedHTMLProps, InputHTMLAttributes, FC } from 'react';
+import React, { DetailedHTMLProps, InputHTMLAttributes } from 'react';
 import { TextEditorController, TextEditorControllerProps } from './text_editor_controller.mjs';
 import 'prosemirror-model';
 import 'prosemirror-state';
@@ -13,7 +13,6 @@ type TextEditorProps = Omit<HTMLElementProps, "ref"> & {
     controller?: TextEditorController;
     name?: string;
 } & TextEditorControllerProps;
-type CreateTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
-declare function createTextEditor(options?: CreateTextEditorOptions): FC<TextEditorProps>;
+declare function TextEditor({ controller: externalController, name, className, autoFocus, onChange, mode, state, editor, defaultValue, updateDelay, placeholder, attachFile, style, ...props }?: TextEditorProps): React.JSX.Element;
 
-export { type TextEditorProps, createTextEditor };
+export { TextEditor, type TextEditorProps };

package/dist/{create_text_editor.d.ts → text_editor.d.ts}

@@ -1,4 +1,4 @@
-import { DetailedHTMLProps, InputHTMLAttributes, FC } from 'react';
+import React, { DetailedHTMLProps, InputHTMLAttributes } from 'react';
 import { TextEditorController, TextEditorControllerProps } from './text_editor_controller.js';
 import 'prosemirror-model';
 import 'prosemirror-state';
@@ -13,7 +13,6 @@ type TextEditorProps = Omit<HTMLElementProps, "ref"> & {
     controller?: TextEditorController;
     name?: string;
 } & TextEditorControllerProps;
-type CreateTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
-declare function createTextEditor(options?: CreateTextEditorOptions): FC<TextEditorProps>;
+declare function TextEditor({ controller: externalController, name, className, autoFocus, onChange, mode, state, editor, defaultValue, updateDelay, placeholder, attachFile, style, ...props }?: TextEditorProps): React.JSX.Element;
 
-export { type TextEditorProps, createTextEditor };
+export { TextEditor, type TextEditorProps };

package/dist/{create_text_editor.js → text_editor.js}

@@ -27,12 +27,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/create_text_editor.tsx
-var create_text_editor_exports = {};
-__export(create_text_editor_exports, {
-  createTextEditor: () => createTextEditor
+// src/text_editor.tsx
+var text_editor_exports = {};
+__export(text_editor_exports, {
+  TextEditor: () => TextEditor
 });
-module.exports = __toCommonJS(create_text_editor_exports);
+module.exports = __toCommonJS(text_editor_exports);
 var import_react2 = __toESM(require("react"));
 var import_react3 = require("react");
 
@@ -1003,7 +1003,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -1067,61 +1067,59 @@ var TextEditorController = class {
   }
 };
 
-// src/create_text_editor.tsx
-function createTextEditor(options = {}) {
-  function Component({
-    controller: externalController,
-    name,
-    className,
-    autoFocus,
-    onChange,
-    mode,
-    state,
-    editor,
-    defaultValue,
-    updateDelay,
-    placeholder,
-    ...props
-  } = {}) {
-    const containerRef = (0, import_react3.useRef)(null);
-    const innerController = (0, import_react2.useMemo)(
-      () => new TextEditorController({
-        mode,
-        state,
-        editor,
-        autoFocus,
-        placeholder,
-        updateDelay,
-        defaultValue,
-        className: options.className,
-        style: options.style,
-        attachFile: options.attachFile
-      }),
-      []
-    );
-    const controller = externalController || innerController;
-    (0, import_react3.useEffect)(() => {
-      const container = containerRef.current;
-      if (!container) {
-        return;
-      }
-      controller.bind(container);
-      return () => {
-        controller.dispose();
-      };
-    }, [controller]);
-    return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ import_react2.default.createElement(
-      TextEditorInput,
-      {
-        name,
-        controller,
-        onChange
-      }
-    ));
-  }
-  return Component;
+// src/text_editor.tsx
+function TextEditor({
+  controller: externalController,
+  name,
+  className,
+  autoFocus,
+  onChange,
+  mode,
+  state,
+  editor,
+  defaultValue,
+  updateDelay,
+  placeholder,
+  attachFile,
+  style,
+  ...props
+} = {}) {
+  const containerRef = (0, import_react3.useRef)(null);
+  const innerController = (0, import_react2.useMemo)(
+    () => new TextEditorController({
+      mode,
+      state,
+      editor,
+      autoFocus,
+      placeholder,
+      updateDelay,
+      defaultValue,
+      attachFile,
+      style
+    }),
+    []
+  );
+  const controller = externalController || innerController;
+  (0, import_react3.useEffect)(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    controller.bind(container);
+    return () => {
+      controller.dispose();
+    };
+  }, [controller]);
+  return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ import_react2.default.createElement(
+    TextEditorInput,
+    {
+      name,
+      controller,
+      onChange
+    }
+  ));
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  createTextEditor
+  TextEditor
 });

package/dist/{create_text_editor.mjs → text_editor.mjs}

@@ -1,4 +1,4 @@
-// src/create_text_editor.tsx
+// src/text_editor.tsx
 import React2, {
   useMemo
 } from "react";
@@ -975,7 +975,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -1039,60 +1039,58 @@ var TextEditorController = class {
   }
 };
 
-// src/create_text_editor.tsx
-function createTextEditor(options = {}) {
-  function Component({
-    controller: externalController,
-    name,
-    className,
-    autoFocus,
-    onChange,
-    mode,
-    state,
-    editor,
-    defaultValue,
-    updateDelay,
-    placeholder,
-    ...props
-  } = {}) {
-    const containerRef = useRef(null);
-    const innerController = useMemo(
-      () => new TextEditorController({
-        mode,
-        state,
-        editor,
-        autoFocus,
-        placeholder,
-        updateDelay,
-        defaultValue,
-        className: options.className,
-        style: options.style,
-        attachFile: options.attachFile
-      }),
-      []
-    );
-    const controller = externalController || innerController;
-    useEffect2(() => {
-      const container = containerRef.current;
-      if (!container) {
-        return;
-      }
-      controller.bind(container);
-      return () => {
-        controller.dispose();
-      };
-    }, [controller]);
-    return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ React2.createElement(
-      TextEditorInput,
-      {
-        name,
-        controller,
-        onChange
-      }
-    ));
-  }
-  return Component;
+// src/text_editor.tsx
+function TextEditor({
+  controller: externalController,
+  name,
+  className,
+  autoFocus,
+  onChange,
+  mode,
+  state,
+  editor,
+  defaultValue,
+  updateDelay,
+  placeholder,
+  attachFile,
+  style,
+  ...props
+} = {}) {
+  const containerRef = useRef(null);
+  const innerController = useMemo(
+    () => new TextEditorController({
+      mode,
+      state,
+      editor,
+      autoFocus,
+      placeholder,
+      updateDelay,
+      defaultValue,
+      attachFile,
+      style
+    }),
+    []
+  );
+  const controller = externalController || innerController;
+  useEffect2(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    controller.bind(container);
+    return () => {
+      controller.dispose();
+    };
+  }, [controller]);
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { ...props, ref: containerRef, className }), /* @__PURE__ */ React2.createElement(
+    TextEditorInput,
+    {
+      name,
+      controller,
+      onChange
+    }
+  ));
 }
 export {
-  createTextEditor
+  TextEditor
 };

package/dist/text_editor_controller.d.mts

@@ -52,5 +52,7 @@ declare class TextEditorController {
     };
     dispose(): void;
 }
+type ConfigTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
+declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props: TextEditorControllerProps) => TextEditorController;
 
-export { TextEditorController, type TextEditorControllerProps };
+export { type ConfigTextEditorOptions, TextEditorController, type TextEditorControllerProps, configTextEditorController };

package/dist/text_editor_controller.d.ts

@@ -52,5 +52,7 @@ declare class TextEditorController {
     };
     dispose(): void;
 }
+type ConfigTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
+declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props: TextEditorControllerProps) => TextEditorController;
 
-export { TextEditorController, type TextEditorControllerProps };
+export { type ConfigTextEditorOptions, TextEditorController, type TextEditorControllerProps, configTextEditorController };

package/dist/text_editor_controller.js

@@ -30,7 +30,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/text_editor_controller.tsx
 var text_editor_controller_exports = {};
 __export(text_editor_controller_exports, {
-  TextEditorController: () => TextEditorController
+  TextEditorController: () => TextEditorController,
+  configTextEditorController: () => configTextEditorController
 });
 module.exports = __toCommonJS(text_editor_controller_exports);
 var import_prosemirror_state5 = require("prosemirror-state");
@@ -967,7 +968,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -1030,7 +1031,16 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
+var configTextEditorController = (options = {}) => {
+  return (props) => new TextEditorController({
+    ...props,
+    className: props.className || options.className,
+    style: props.style || options.style,
+    attachFile: props.attachFile || options.attachFile
+  });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  TextEditorController
+  TextEditorController,
+  configTextEditorController
 });

package/dist/text_editor_controller.mjs

@@ -935,7 +935,7 @@ var TextEditorController = class {
         })();
         return {
           ...propsAttributes,
-          class: cn(this.props?.className, propsAttributes?.class),
+          class: cn(this.props.className, propsAttributes?.class),
           spellcheck: propsAttributes?.spellcheck || "false",
           style: this.props.style || "width: 100%; height: inherit; outline: none;"
         };
@@ -998,6 +998,15 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
+var configTextEditorController = (options = {}) => {
+  return (props) => new TextEditorController({
+    ...props,
+    className: props.className || options.className,
+    style: props.style || options.style,
+    attachFile: props.attachFile || options.attachFile
+  });
+};
 export {
-  TextEditorController
+  TextEditorController,
+  configTextEditorController
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dn-react-text-editor",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.mjs",
   "module": "./dist/index.js",