dn-react-text-editor 0.3.4 → 0.3.6

package/dist/index.js

@@ -969,6 +969,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -1006,12 +1007,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new import_prosemirror_view4.EditorView(container, {
+    this.view = new import_prosemirror_view4.EditorView(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1085,8 +1087,8 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
-var configTextEditorController = (options = {} = {}) => {
-  return (props) => new TextEditorController({
+var configTextEditorController = (options = {}) => {
+  return (props = {}) => new TextEditorController({
     ...props,
     className: props.className || options.className,
     style: props.style || options.style,
@@ -1096,7 +1098,7 @@ var configTextEditorController = (options = {} = {}) => {
 
 // src/text_editor.tsx
 function TextEditor({
-  controller: externalController,
+  ref,
   name,
   className,
   autoFocus,
@@ -1112,7 +1114,7 @@ function TextEditor({
   ...props
 } = {}) {
   const containerRef = (0, import_react3.useRef)(null);
-  const innerController = (0, import_react2.useMemo)(
+  const controller = (0, import_react2.useMemo)(
     () => new TextEditorController({
       mode,
       state,
@@ -1126,7 +1128,7 @@ function TextEditor({
     }),
     []
   );
-  const controller = externalController || innerController;
+  (0, import_react2.useImperativeHandle)(ref, () => controller, [controller]);
   (0, import_react3.useEffect)(() => {
     const container = containerRef.current;
     if (!container) {

package/dist/index.mjs

@@ -1,5 +1,6 @@
 // src/text_editor.tsx
 import React2, {
+  useImperativeHandle,
   useMemo
 } from "react";
 import { useEffect as useEffect2, useRef } from "react";
@@ -933,6 +934,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -970,12 +972,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new EditorView3(container, {
+    this.view = new EditorView3(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1049,8 +1052,8 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
-var configTextEditorController = (options = {} = {}) => {
-  return (props) => new TextEditorController({
+var configTextEditorController = (options = {}) => {
+  return (props = {}) => new TextEditorController({
     ...props,
     className: props.className || options.className,
     style: props.style || options.style,
@@ -1060,7 +1063,7 @@ var configTextEditorController = (options = {} = {}) => {
 
 // src/text_editor.tsx
 function TextEditor({
-  controller: externalController,
+  ref,
   name,
   className,
   autoFocus,
@@ -1076,7 +1079,7 @@ function TextEditor({
   ...props
 } = {}) {
   const containerRef = useRef(null);
-  const innerController = useMemo(
+  const controller = useMemo(
     () => new TextEditorController({
       mode,
       state,
@@ -1090,7 +1093,7 @@ function TextEditor({
     }),
     []
   );
-  const controller = externalController || innerController;
+  useImperativeHandle(ref, () => controller, [controller]);
   useEffect2(() => {
     const container = containerRef.current;
     if (!container) {

package/dist/text_editor.d.mts

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

package/dist/text_editor.d.ts

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

package/dist/text_editor.js

@@ -961,6 +961,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -998,12 +999,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new import_prosemirror_view4.EditorView(container, {
+    this.view = new import_prosemirror_view4.EditorView(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1080,7 +1082,7 @@ var TextEditorController = class {
 
 // src/text_editor.tsx
 function TextEditor({
-  controller: externalController,
+  ref,
   name,
   className,
   autoFocus,
@@ -1096,7 +1098,7 @@ function TextEditor({
   ...props
 } = {}) {
   const containerRef = (0, import_react3.useRef)(null);
-  const innerController = (0, import_react2.useMemo)(
+  const controller = (0, import_react2.useMemo)(
     () => new TextEditorController({
       mode,
       state,
@@ -1110,7 +1112,7 @@ function TextEditor({
     }),
     []
   );
-  const controller = externalController || innerController;
+  (0, import_react2.useImperativeHandle)(ref, () => controller, [controller]);
   (0, import_react3.useEffect)(() => {
     const container = containerRef.current;
     if (!container) {

package/dist/text_editor.mjs

@@ -1,5 +1,6 @@
 // src/text_editor.tsx
 import React2, {
+  useImperativeHandle,
   useMemo
 } from "react";
 import { useEffect as useEffect2, useRef } from "react";
@@ -933,6 +934,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -970,12 +972,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new EditorView3(container, {
+    this.view = new EditorView3(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1052,7 +1055,7 @@ var TextEditorController = class {
 
 // src/text_editor.tsx
 function TextEditor({
-  controller: externalController,
+  ref,
   name,
   className,
   autoFocus,
@@ -1068,7 +1071,7 @@ function TextEditor({
   ...props
 } = {}) {
   const containerRef = useRef(null);
-  const innerController = useMemo(
+  const controller = useMemo(
     () => new TextEditorController({
       mode,
       state,
@@ -1082,7 +1085,7 @@ function TextEditor({
     }),
     []
   );
-  const controller = externalController || innerController;
+  useImperativeHandle(ref, () => controller, [controller]);
   useEffect2(() => {
     const container = containerRef.current;
     if (!container) {

package/dist/text_editor_controller.d.mts

@@ -29,12 +29,13 @@ declare class TextEditorController {
     view?: EditorView;
     prosemirrorParser: DOMParser;
     prosemirrorSerializer: DOMSerializer;
+    element?: HTMLElement;
     get value(): string;
     set value(value: string);
     constructor(props?: TextEditorControllerProps);
     toInnerHTML(value: string): string;
     attachFile(files: File[]): Promise<void>;
-    bind(container: HTMLElement): void;
+    bind(element: HTMLElement): void;
     toHTML(): string;
     toTextContent(): string;
     get commands(): {
@@ -55,6 +56,6 @@ declare class TextEditorController {
     dispose(): void;
 }
 type ConfigTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
-declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props: TextEditorControllerProps) => TextEditorController;
+declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props?: TextEditorControllerProps) => TextEditorController;
 
 export { type ConfigTextEditorOptions, TextEditorController, type TextEditorControllerProps, configTextEditorController };

package/dist/text_editor_controller.d.ts

@@ -29,12 +29,13 @@ declare class TextEditorController {
     view?: EditorView;
     prosemirrorParser: DOMParser;
     prosemirrorSerializer: DOMSerializer;
+    element?: HTMLElement;
     get value(): string;
     set value(value: string);
     constructor(props?: TextEditorControllerProps);
     toInnerHTML(value: string): string;
     attachFile(files: File[]): Promise<void>;
-    bind(container: HTMLElement): void;
+    bind(element: HTMLElement): void;
     toHTML(): string;
     toTextContent(): string;
     get commands(): {
@@ -55,6 +56,6 @@ declare class TextEditorController {
     dispose(): void;
 }
 type ConfigTextEditorOptions = Pick<TextEditorControllerProps, "className" | "style" | "attachFile">;
-declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props: TextEditorControllerProps) => TextEditorController;
+declare const configTextEditorController: (options?: ConfigTextEditorOptions) => (props?: TextEditorControllerProps) => TextEditorController;
 
 export { type ConfigTextEditorOptions, TextEditorController, type TextEditorControllerProps, configTextEditorController };

package/dist/text_editor_controller.js

@@ -926,6 +926,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -963,12 +964,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new import_prosemirror_view4.EditorView(container, {
+    this.view = new import_prosemirror_view4.EditorView(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1042,8 +1044,8 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
-var configTextEditorController = (options = {} = {}) => {
-  return (props) => new TextEditorController({
+var configTextEditorController = (options = {}) => {
+  return (props = {}) => new TextEditorController({
     ...props,
     className: props.className || options.className,
     style: props.style || options.style,

package/dist/text_editor_controller.mjs

@@ -893,6 +893,7 @@ var TextEditorController = class {
   view;
   prosemirrorParser;
   prosemirrorSerializer;
+  element;
   get value() {
     if (this.props.mode === "text") {
       return this.toTextContent();
@@ -930,12 +931,13 @@ var TextEditorController = class {
       uploadFile: this.props.attachFile?.uploadFile
     })(this.view, files);
   }
-  bind(container) {
+  bind(element) {
+    this.element = element;
     const wrapper = document.createElement("div");
     wrapper.innerHTML = this.toInnerHTML(
       this.props.defaultValue ? String(this.props.defaultValue) : ""
     );
-    this.view = new EditorView3(container, {
+    this.view = new EditorView3(element, {
       ...this.props.editor,
       attributes: (state) => {
         const propsAttributes = (() => {
@@ -1009,8 +1011,8 @@ var TextEditorController = class {
     this.view?.destroy();
   }
 };
-var configTextEditorController = (options = {} = {}) => {
-  return (props) => new TextEditorController({
+var configTextEditorController = (options = {}) => {
+  return (props = {}) => new TextEditorController({
     ...props,
     className: props.className || options.className,
     style: props.style || options.style,

package/package.json

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