@coze-editor/react 0.1.0-alpha.dd871b → 0.1.0-alpha.f1005d

package/dist/esm/index.js

@@ -108,22 +108,57 @@ function Renderer(props) {
 // src/create-renderer.tsx
 import React3, { useMemo } from "react";
 var OriginRenderer = Renderer;
-function createRenderer(plugins, builtinExtensions) {
+function createRenderer(plugins, options) {
+  let builtinExtensions = [];
+  let defaultOptions = {};
+  if (Array.isArray(options)) {
+    builtinExtensions = options;
+  } else if (options && typeof options === "object") {
+    defaultOptions = options.defaultOptions ?? {};
+  }
   return function CustomRenderer(props) {
     const userExtensions = props.extensions;
     const extensions = useMemo(
       () => [...builtinExtensions ?? [], ...userExtensions ?? []],
       [userExtensions]
     );
-    return /* @__PURE__ */ React3.createElement(OriginRenderer, { ...props, extensions, plugins });
+    return /* @__PURE__ */ React3.createElement(
+      OriginRenderer,
+      {
+        ...props,
+        options: {
+          ...defaultOptions,
+          ...props.options ?? {}
+        },
+        extensions,
+        plugins
+      }
+    );
+  };
+}
+
+// src/editor.tsx
+import React4 from "react";
+function Editor(props) {
+  return /* @__PURE__ */ React4.createElement(EditorProvider, null, /* @__PURE__ */ React4.createElement(Renderer, { ...props }));
+}
+
+// src/create-editor.tsx
+import React5 from "react";
+function createEditor(plugins, options) {
+  const CustomRenderer = createRenderer(plugins, options);
+  return function CustomEditor(props) {
+    return /* @__PURE__ */ React5.createElement(EditorProvider, null, /* @__PURE__ */ React5.createElement(CustomRenderer, { ...props }));
   };
 }
 
 // src/index.ts
 export * from "@coze-editor/core";
 export {
+  Editor,
   EditorProvider,
   Renderer,
+  createEditor,
   createRenderer,
   useEditor,
   useInjector

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/renderer.tsx","../../src/provider.tsx","../../src/create-renderer.tsx","../../src/index.ts"],"sourcesContent":["//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport {\n  type EditorPluginSpec,\n  type InferEditorAPIFromPlugins,\n  type InferEvents,\n  type InferValues,\n  create,\n} from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { useInjector, useSetEditor } from './provider';\n\ntype UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (\n  k: infer I,\n) => void\n  ? I\n  : never;\n\ntype InferReactEvents<T extends Record<string, any>> = UnionToIntersection<{\n  [K in keyof T as `on${Capitalize<string & K>}`]?: (e: T[K]) => void;\n}>;\n\nfunction firstLetterToUppercase(str: string) {\n  return str.charAt(0).toUpperCase() + str.substring(1);\n}\n\ntype InferRendererProps<T extends EditorPluginSpec<string, any, any>[]> = {\n  domProps?: {\n    style?: CSSProperties;\n    className?: string;\n  };\n  defaultValue?: string;\n  root?: Document | ShadowRoot;\n  options?: Partial<InferValues<T[number]>>;\n  extensions?: Extension[];\n  didMount?: (api: InferEditorAPIFromPlugins<T>) => void;\n  children?: ReactNode;\n} & (InferEvents<T[number]> extends Record<string, any>\n  ? InferReactEvents<InferEvents<T[number]>>\n  : unknown);\n\nfunction Renderer<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  const {\n    plugins,\n    defaultValue,\n    root,\n    options,\n    domProps = {},\n    extensions,\n    didMount,\n    children,\n  } = props;\n\n  const [api, setAPI] = useState<any>();\n  const ref = useRef(null);\n  const apiRef = useRef<any>(null);\n  const propsRef = useRef<typeof props | null>(null);\n  const setEditor = useSetEditor();\n  const injector = useInjector();\n\n  propsRef.current = props;\n\n  useEffect(() => {\n    const { render, eventKeys } = create({\n      plugins,\n      injector,\n    });\n\n    const exported = render({\n      parent: ref.current!,\n      root,\n      defaultValue,\n      options: options ?? {},\n      extensions,\n    });\n\n    apiRef.current = exported;\n\n    eventKeys.forEach((eventName: any) => {\n      exported.$on(eventName, e => {\n        const handler = (propsRef.current as any)?.[\n          `on${firstLetterToUppercase(eventName)}`\n        ];\n        if (typeof handler === 'function') {\n          handler(e);\n        }\n      });\n    });\n\n    if (typeof didMount === 'function') {\n      didMount(exported);\n    }\n\n    setAPI(exported);\n\n    return () => {\n      exported.$destroy();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!api || !setEditor) {\n      return;\n    }\n\n    setEditor(api);\n  }, [api, setEditor]);\n\n  useEffect(() => {\n    apiRef.current.$set(props.options ?? {});\n  }, [props.options]);\n\n  return (\n    <>\n      <div {...domProps} ref={ref} />\n      {children}\n    </>\n  );\n}\n\nexport { Renderer };\n\nexport type { InferRendererProps };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, {\n  type Dispatch,\n  type ReactNode,\n  createContext,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type Injector, createInjector } from '@coze-editor/core';\n\nconst InternalEditorContext = createContext<unknown>(null);\nconst InternalSetEditorContext = createContext<Dispatch<any> | null>(null);\nconst InjectorContext = createContext<Injector | undefined>(undefined);\n\nfunction useEditor<T>(): T {\n  return useContext(InternalEditorContext) as T;\n}\n\nfunction useSetEditor(): Dispatch<any> | null {\n  return useContext(InternalSetEditorContext);\n}\n\nfunction useInjector(): Injector {\n  const injector = useContext(InjectorContext);\n\n  if (!injector) {\n    throw new Error('useInjector should be used in EditorProvider');\n  }\n\n  return injector;\n}\n\nfunction EditorProvider({ children }: { children?: ReactNode }) {\n  const [editor, setEditor] = useState(null);\n  const injectorRef = useRef<Injector | null>(null);\n\n  if (!injectorRef.current) {\n    injectorRef.current = createInjector();\n  }\n\n  return (\n    <InternalEditorContext.Provider value={editor}>\n      <InternalSetEditorContext.Provider value={setEditor}>\n        <InjectorContext.Provider value={injectorRef.current}>\n          {children}\n        </InjectorContext.Provider>\n      </InternalSetEditorContext.Provider>\n    </InternalEditorContext.Provider>\n  );\n}\n\nexport { EditorProvider, useEditor, useSetEditor, useInjector };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, { useMemo } from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { Renderer, type InferRendererProps } from './renderer';\n\nconst OriginRenderer: (props: any) => JSX.Element = Renderer;\n\nfunction createRenderer<T extends EditorPluginSpec<string, any, any>[]>(\n  plugins: T,\n  builtinExtensions?: Extension[],\n) {\n  return function CustomRenderer(props: InferRendererProps<T>) {\n    const userExtensions = props.extensions;\n\n    const extensions: Extension[] = useMemo(\n      () => [...(builtinExtensions ?? []), ...(userExtensions ?? [])],\n      [userExtensions],\n    );\n\n    return (\n      <OriginRenderer {...props} extensions={extensions} plugins={plugins} />\n    );\n  };\n}\n\nexport { createRenderer };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nexport { Renderer, type InferRendererProps } from './renderer';\n\nexport { createRenderer } from './create-renderer';\n\nexport { EditorProvider, useEditor, useInjector } from './provider';\n\nexport * from '@coze-editor/core';\n"],"mappings":"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","names":["React","useRef","useState","useState","useRef","React","React","React"]}
+{"version":3,"sources":["../../src/renderer.tsx","../../src/provider.tsx","../../src/create-renderer.tsx","../../src/editor.tsx","../../src/create-editor.tsx","../../src/index.ts"],"sourcesContent":["//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport {\n  type EditorPluginSpec,\n  type InferEditorAPIFromPlugins,\n  type InferEvents,\n  type InferValues,\n  create,\n} from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { useInjector, useSetEditor } from './provider';\n\ntype UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (\n  k: infer I,\n) => void\n  ? I\n  : never;\n\ntype InferReactEvents<T extends Record<string, any>> = UnionToIntersection<{\n  [K in keyof T as `on${Capitalize<string & K>}`]?: (e: T[K]) => void;\n}>;\n\nfunction firstLetterToUppercase(str: string) {\n  return str.charAt(0).toUpperCase() + str.substring(1);\n}\n\ntype InferRendererProps<T extends EditorPluginSpec<string, any, any>[]> = {\n  domProps?: {\n    style?: CSSProperties;\n    className?: string;\n  };\n  defaultValue?: string;\n  root?: Document | ShadowRoot;\n  options?: Partial<InferValues<T[number]>>;\n  extensions?: Extension[];\n  didMount?: (api: InferEditorAPIFromPlugins<T>) => void;\n  children?: ReactNode;\n} & (InferEvents<T[number]> extends Record<string, any>\n  ? InferReactEvents<InferEvents<T[number]>>\n  : unknown);\n\nfunction Renderer<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  const {\n    plugins,\n    defaultValue,\n    root,\n    options,\n    domProps = {},\n    extensions,\n    didMount,\n    children,\n  } = props;\n\n  const [api, setAPI] = useState<any>();\n  const ref = useRef(null);\n  const apiRef = useRef<any>(null);\n  const propsRef = useRef<typeof props | null>(null);\n  const setEditor = useSetEditor();\n  const injector = useInjector();\n\n  propsRef.current = props;\n\n  useEffect(() => {\n    const { render, eventKeys } = create({\n      plugins,\n      injector,\n    });\n\n    const exported = render({\n      parent: ref.current!,\n      root,\n      defaultValue,\n      options: options ?? {},\n      extensions,\n    });\n\n    apiRef.current = exported;\n\n    eventKeys.forEach((eventName: any) => {\n      exported.$on(eventName, e => {\n        const handler = (propsRef.current as any)?.[\n          `on${firstLetterToUppercase(eventName)}`\n        ];\n        if (typeof handler === 'function') {\n          handler(e);\n        }\n      });\n    });\n\n    if (typeof didMount === 'function') {\n      didMount(exported);\n    }\n\n    setAPI(exported);\n\n    return () => {\n      exported.$destroy();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!api || !setEditor) {\n      return;\n    }\n\n    setEditor(api);\n  }, [api, setEditor]);\n\n  useEffect(() => {\n    apiRef.current.$set(props.options ?? {});\n  }, [props.options]);\n\n  return (\n    <>\n      <div {...domProps} ref={ref} />\n      {children}\n    </>\n  );\n}\n\nexport { Renderer };\n\nexport type { InferRendererProps };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, {\n  type Dispatch,\n  type ReactNode,\n  createContext,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type Injector, createInjector } from '@coze-editor/core';\n\nconst InternalEditorContext = createContext<unknown>(null);\nconst InternalSetEditorContext = createContext<Dispatch<any> | null>(null);\nconst InjectorContext = createContext<Injector | undefined>(undefined);\n\nfunction useEditor<T>(): T {\n  return useContext(InternalEditorContext) as T;\n}\n\nfunction useSetEditor(): Dispatch<any> | null {\n  return useContext(InternalSetEditorContext);\n}\n\nfunction useInjector(): Injector {\n  const injector = useContext(InjectorContext);\n\n  if (!injector) {\n    throw new Error('useInjector should be used in EditorProvider');\n  }\n\n  return injector;\n}\n\nfunction EditorProvider({ children }: { children?: ReactNode }) {\n  const [editor, setEditor] = useState(null);\n  const injectorRef = useRef<Injector | null>(null);\n\n  if (!injectorRef.current) {\n    injectorRef.current = createInjector();\n  }\n\n  return (\n    <InternalEditorContext.Provider value={editor}>\n      <InternalSetEditorContext.Provider value={setEditor}>\n        <InjectorContext.Provider value={injectorRef.current}>\n          {children}\n        </InjectorContext.Provider>\n      </InternalSetEditorContext.Provider>\n    </InternalEditorContext.Provider>\n  );\n}\n\nexport { EditorProvider, useEditor, useSetEditor, useInjector };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, { useMemo } from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { Renderer, type InferRendererProps } from './renderer';\n\nconst OriginRenderer: (props: any) => JSX.Element = Renderer;\n\ninterface CreateRendererOptions<T> {\n  defaultOptions?: T;\n}\n\nfunction createRenderer<\n  T extends EditorPluginSpec<string, any, any>[],\n  U extends InferRendererProps<T> = InferRendererProps<T>,\n>(plugins: T, options?: Extension[] | CreateRendererOptions<U['options']>) {\n  let builtinExtensions: Extension[] = [];\n  let defaultOptions = {};\n\n  // 兼容历史类型\n  if (Array.isArray(options)) {\n    builtinExtensions = options;\n  } else if (options && typeof options === 'object') {\n    defaultOptions = options.defaultOptions ?? {};\n  }\n\n  return function CustomRenderer(props: InferRendererProps<T>) {\n    const userExtensions = props.extensions;\n\n    const extensions: Extension[] = useMemo(\n      () => [...(builtinExtensions ?? []), ...(userExtensions ?? [])],\n      [userExtensions],\n    );\n\n    return (\n      <OriginRenderer\n        {...props}\n        options={{\n          ...defaultOptions,\n          ...(props.options ?? {}),\n        }}\n        extensions={extensions}\n        plugins={plugins}\n      />\n    );\n  };\n}\n\nexport { createRenderer };\nexport type { CreateRendererOptions };\n","import React from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\n\nimport { type InferRendererProps, Renderer } from './renderer';\nimport { EditorProvider } from './provider';\n\nfunction Editor<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  return (\n    <EditorProvider>\n      <Renderer {...props} />\n    </EditorProvider>\n  );\n}\n\nexport { Editor };\n","import React from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\n\nimport { type InferRendererProps } from './renderer';\nimport { EditorProvider } from './provider';\nimport { createRenderer, type CreateRendererOptions } from './create-renderer';\n\nfunction createEditor<\n  T extends EditorPluginSpec<string, any, any>[],\n  U extends InferRendererProps<T> = InferRendererProps<T>,\n>(plugins: T, options?: CreateRendererOptions<U['options']>) {\n  const CustomRenderer = createRenderer(plugins, options);\n\n  return function CustomEditor(props: InferRendererProps<T>) {\n    return (\n      <EditorProvider>\n        <CustomRenderer {...props} />\n      </EditorProvider>\n    );\n  };\n}\n\nexport { createEditor };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nexport { Renderer, type InferRendererProps } from './renderer';\n\nexport { createRenderer, type CreateRendererOptions } from './create-renderer';\n\nexport { EditorProvider, useEditor, useInjector } from './provider';\n\nexport { Editor } from './editor';\n\nexport { createEditor } from './create-editor';\n\nexport * from '@coze-editor/core';\n"],"mappings":"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","names":["React","useRef","useState","useState","useRef","React","React","React","React","React","React","React"]}

package/dist/index.d.mts

@@ -24,7 +24,10 @@ declare function Renderer<T extends EditorPluginSpec<string, any, any>[]>(props:
     plugins: T;
 } & InferRendererProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function createRenderer<T extends EditorPluginSpec<string, any, any>[]>(plugins: T, builtinExtensions?: Extension[]): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
+interface CreateRendererOptions<T> {
+    defaultOptions?: T;
+}
+declare function createRenderer<T extends EditorPluginSpec<string, any, any>[], U extends InferRendererProps<T> = InferRendererProps<T>>(plugins: T, options?: Extension[] | CreateRendererOptions<U['options']>): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare function useEditor<T>(): T;
 declare function useInjector(): Injector;
@@ -32,4 +35,10 @@ declare function EditorProvider({ children }: {
     children?: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
-export { EditorProvider, type InferRendererProps, Renderer, createRenderer, useEditor, useInjector };
+declare function Editor<T extends EditorPluginSpec<string, any, any>[]>(props: {
+    plugins: T;
+} & InferRendererProps<T>): react_jsx_runtime.JSX.Element;
+
+declare function createEditor<T extends EditorPluginSpec<string, any, any>[], U extends InferRendererProps<T> = InferRendererProps<T>>(plugins: T, options?: CreateRendererOptions<U['options']>): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
+
+export { type CreateRendererOptions, Editor, EditorProvider, type InferRendererProps, Renderer, createEditor, createRenderer, useEditor, useInjector };

package/dist/index.d.ts

@@ -24,7 +24,10 @@ declare function Renderer<T extends EditorPluginSpec<string, any, any>[]>(props:
     plugins: T;
 } & InferRendererProps<T>): react_jsx_runtime.JSX.Element;
 
-declare function createRenderer<T extends EditorPluginSpec<string, any, any>[]>(plugins: T, builtinExtensions?: Extension[]): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
+interface CreateRendererOptions<T> {
+    defaultOptions?: T;
+}
+declare function createRenderer<T extends EditorPluginSpec<string, any, any>[], U extends InferRendererProps<T> = InferRendererProps<T>>(plugins: T, options?: Extension[] | CreateRendererOptions<U['options']>): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare function useEditor<T>(): T;
 declare function useInjector(): Injector;
@@ -32,4 +35,10 @@ declare function EditorProvider({ children }: {
     children?: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
-export { EditorProvider, type InferRendererProps, Renderer, createRenderer, useEditor, useInjector };
+declare function Editor<T extends EditorPluginSpec<string, any, any>[]>(props: {
+    plugins: T;
+} & InferRendererProps<T>): react_jsx_runtime.JSX.Element;
+
+declare function createEditor<T extends EditorPluginSpec<string, any, any>[], U extends InferRendererProps<T> = InferRendererProps<T>>(plugins: T, options?: CreateRendererOptions<U['options']>): (props: InferRendererProps<T>) => react_jsx_runtime.JSX.Element;
+
+export { type CreateRendererOptions, Editor, EditorProvider, type InferRendererProps, Renderer, createEditor, createRenderer, useEditor, useInjector };

package/dist/index.js

@@ -30,8 +30,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  Editor: () => Editor,
   EditorProvider: () => EditorProvider,
   Renderer: () => Renderer,
+  createEditor: () => createEditor,
   createRenderer: () => createRenderer,
   useEditor: () => useEditor,
   useInjector: () => useInjector
@@ -137,14 +139,47 @@ function Renderer(props) {
 // src/create-renderer.tsx
 var import_react3 = __toESM(require("react"));
 var OriginRenderer = Renderer;
-function createRenderer(plugins, builtinExtensions) {
+function createRenderer(plugins, options) {
+  let builtinExtensions = [];
+  let defaultOptions = {};
+  if (Array.isArray(options)) {
+    builtinExtensions = options;
+  } else if (options && typeof options === "object") {
+    defaultOptions = options.defaultOptions ?? {};
+  }
   return function CustomRenderer(props) {
     const userExtensions = props.extensions;
     const extensions = (0, import_react3.useMemo)(
       () => [...builtinExtensions ?? [], ...userExtensions ?? []],
       [userExtensions]
     );
-    return /* @__PURE__ */ import_react3.default.createElement(OriginRenderer, { ...props, extensions, plugins });
+    return /* @__PURE__ */ import_react3.default.createElement(
+      OriginRenderer,
+      {
+        ...props,
+        options: {
+          ...defaultOptions,
+          ...props.options ?? {}
+        },
+        extensions,
+        plugins
+      }
+    );
+  };
+}
+
+// src/editor.tsx
+var import_react4 = __toESM(require("react"));
+function Editor(props) {
+  return /* @__PURE__ */ import_react4.default.createElement(EditorProvider, null, /* @__PURE__ */ import_react4.default.createElement(Renderer, { ...props }));
+}
+
+// src/create-editor.tsx
+var import_react5 = __toESM(require("react"));
+function createEditor(plugins, options) {
+  const CustomRenderer = createRenderer(plugins, options);
+  return function CustomEditor(props) {
+    return /* @__PURE__ */ import_react5.default.createElement(EditorProvider, null, /* @__PURE__ */ import_react5.default.createElement(CustomRenderer, { ...props }));
   };
 }
 
@@ -152,8 +187,10 @@ function createRenderer(plugins, builtinExtensions) {
 __reExport(index_exports, require("@coze-editor/core"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Editor,
   EditorProvider,
   Renderer,
+  createEditor,
   createRenderer,
   useEditor,
   useInjector,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/renderer.tsx","../src/provider.tsx","../src/create-renderer.tsx"],"sourcesContent":["//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nexport { Renderer, type InferRendererProps } from './renderer';\n\nexport { createRenderer } from './create-renderer';\n\nexport { EditorProvider, useEditor, useInjector } from './provider';\n\nexport * from '@coze-editor/core';\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport {\n  type EditorPluginSpec,\n  type InferEditorAPIFromPlugins,\n  type InferEvents,\n  type InferValues,\n  create,\n} from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { useInjector, useSetEditor } from './provider';\n\ntype UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (\n  k: infer I,\n) => void\n  ? I\n  : never;\n\ntype InferReactEvents<T extends Record<string, any>> = UnionToIntersection<{\n  [K in keyof T as `on${Capitalize<string & K>}`]?: (e: T[K]) => void;\n}>;\n\nfunction firstLetterToUppercase(str: string) {\n  return str.charAt(0).toUpperCase() + str.substring(1);\n}\n\ntype InferRendererProps<T extends EditorPluginSpec<string, any, any>[]> = {\n  domProps?: {\n    style?: CSSProperties;\n    className?: string;\n  };\n  defaultValue?: string;\n  root?: Document | ShadowRoot;\n  options?: Partial<InferValues<T[number]>>;\n  extensions?: Extension[];\n  didMount?: (api: InferEditorAPIFromPlugins<T>) => void;\n  children?: ReactNode;\n} & (InferEvents<T[number]> extends Record<string, any>\n  ? InferReactEvents<InferEvents<T[number]>>\n  : unknown);\n\nfunction Renderer<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  const {\n    plugins,\n    defaultValue,\n    root,\n    options,\n    domProps = {},\n    extensions,\n    didMount,\n    children,\n  } = props;\n\n  const [api, setAPI] = useState<any>();\n  const ref = useRef(null);\n  const apiRef = useRef<any>(null);\n  const propsRef = useRef<typeof props | null>(null);\n  const setEditor = useSetEditor();\n  const injector = useInjector();\n\n  propsRef.current = props;\n\n  useEffect(() => {\n    const { render, eventKeys } = create({\n      plugins,\n      injector,\n    });\n\n    const exported = render({\n      parent: ref.current!,\n      root,\n      defaultValue,\n      options: options ?? {},\n      extensions,\n    });\n\n    apiRef.current = exported;\n\n    eventKeys.forEach((eventName: any) => {\n      exported.$on(eventName, e => {\n        const handler = (propsRef.current as any)?.[\n          `on${firstLetterToUppercase(eventName)}`\n        ];\n        if (typeof handler === 'function') {\n          handler(e);\n        }\n      });\n    });\n\n    if (typeof didMount === 'function') {\n      didMount(exported);\n    }\n\n    setAPI(exported);\n\n    return () => {\n      exported.$destroy();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!api || !setEditor) {\n      return;\n    }\n\n    setEditor(api);\n  }, [api, setEditor]);\n\n  useEffect(() => {\n    apiRef.current.$set(props.options ?? {});\n  }, [props.options]);\n\n  return (\n    <>\n      <div {...domProps} ref={ref} />\n      {children}\n    </>\n  );\n}\n\nexport { Renderer };\n\nexport type { InferRendererProps };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, {\n  type Dispatch,\n  type ReactNode,\n  createContext,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type Injector, createInjector } from '@coze-editor/core';\n\nconst InternalEditorContext = createContext<unknown>(null);\nconst InternalSetEditorContext = createContext<Dispatch<any> | null>(null);\nconst InjectorContext = createContext<Injector | undefined>(undefined);\n\nfunction useEditor<T>(): T {\n  return useContext(InternalEditorContext) as T;\n}\n\nfunction useSetEditor(): Dispatch<any> | null {\n  return useContext(InternalSetEditorContext);\n}\n\nfunction useInjector(): Injector {\n  const injector = useContext(InjectorContext);\n\n  if (!injector) {\n    throw new Error('useInjector should be used in EditorProvider');\n  }\n\n  return injector;\n}\n\nfunction EditorProvider({ children }: { children?: ReactNode }) {\n  const [editor, setEditor] = useState(null);\n  const injectorRef = useRef<Injector | null>(null);\n\n  if (!injectorRef.current) {\n    injectorRef.current = createInjector();\n  }\n\n  return (\n    <InternalEditorContext.Provider value={editor}>\n      <InternalSetEditorContext.Provider value={setEditor}>\n        <InjectorContext.Provider value={injectorRef.current}>\n          {children}\n        </InjectorContext.Provider>\n      </InternalSetEditorContext.Provider>\n    </InternalEditorContext.Provider>\n  );\n}\n\nexport { EditorProvider, useEditor, useSetEditor, useInjector };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, { useMemo } from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { Renderer, type InferRendererProps } from './renderer';\n\nconst OriginRenderer: (props: any) => JSX.Element = Renderer;\n\nfunction createRenderer<T extends EditorPluginSpec<string, any, any>[]>(\n  plugins: T,\n  builtinExtensions?: Extension[],\n) {\n  return function CustomRenderer(props: InferRendererProps<T>) {\n    const userExtensions = props.extensions;\n\n    const extensions: Extension[] = useMemo(\n      () => [...(builtinExtensions ?? []), ...(userExtensions ?? [])],\n      [userExtensions],\n    );\n\n    return (\n      <OriginRenderer {...props} extensions={extensions} plugins={plugins} />\n    );\n  };\n}\n\nexport { createRenderer };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACIA,IAAAA,gBAMO;AAEP,IAAAC,eAMO;;;ACfP,mBAOO;AAEP,kBAA8C;AAE9C,IAAM,4BAAwB,4BAAuB,IAAI;AACzD,IAAM,+BAA2B,4BAAoC,IAAI;AACzE,IAAM,sBAAkB,4BAAoC,MAAS;AAErE,SAAS,YAAkB;AACzB,aAAO,yBAAW,qBAAqB;AACzC;AAEA,SAAS,eAAqC;AAC5C,aAAO,yBAAW,wBAAwB;AAC5C;AAEA,SAAS,cAAwB;AAC/B,QAAM,eAAW,yBAAW,eAAe;AAE3C,MAAI,CAAC,UAAU;AACb,UAAM,IAAI,MAAM,8CAA8C;AAAA,EAChE;AAEA,SAAO;AACT;AAEA,SAAS,eAAe,EAAE,SAAS,GAA6B;AAC9D,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,IAAI;AACzC,QAAM,kBAAc,qBAAwB,IAAI;AAEhD,MAAI,CAAC,YAAY,SAAS;AACxB,gBAAY,cAAU,4BAAe;AAAA,EACvC;AAEA,SACE,6BAAAC,QAAA,cAAC,sBAAsB,UAAtB,EAA+B,OAAO,UACrC,6BAAAA,QAAA,cAAC,yBAAyB,UAAzB,EAAkC,OAAO,aACxC,6BAAAA,QAAA,cAAC,gBAAgB,UAAhB,EAAyB,OAAO,YAAY,WAC1C,QACH,CACF,CACF;AAEJ;;;ADpBA,SAAS,uBAAuB,KAAa;AAC3C,SAAO,IAAI,OAAO,CAAC,EAAE,YAAY,IAAI,IAAI,UAAU,CAAC;AACtD;AAiBA,SAAS,SACP,OACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,CAAC;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,CAAC,KAAK,MAAM,QAAI,wBAAc;AACpC,QAAM,UAAM,sBAAO,IAAI;AACvB,QAAM,aAAS,sBAAY,IAAI;AAC/B,QAAM,eAAW,sBAA4B,IAAI;AACjD,QAAM,YAAY,aAAa;AAC/B,QAAM,WAAW,YAAY;AAE7B,WAAS,UAAU;AAEnB,+BAAU,MAAM;AACd,UAAM,EAAE,QAAQ,UAAU,QAAI,qBAAO;AAAA,MACnC;AAAA,MACA;AAAA,IACF,CAAC;AAED,UAAM,WAAW,OAAO;AAAA,MACtB,QAAQ,IAAI;AAAA,MACZ;AAAA,MACA;AAAA,MACA,SAAS,WAAW,CAAC;AAAA,MACrB;AAAA,IACF,CAAC;AAED,WAAO,UAAU;AAEjB,cAAU,QAAQ,CAAC,cAAmB;AACpC,eAAS,IAAI,WAAW,OAAK;AA5FnC;AA6FQ,cAAM,WAAW,cAAS,YAAT,mBACf,KAAK,uBAAuB,SAAS,CAAC;AAExC,YAAI,OAAO,YAAY,YAAY;AACjC,kBAAQ,CAAC;AAAA,QACX;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAED,QAAI,OAAO,aAAa,YAAY;AAClC,eAAS,QAAQ;AAAA,IACnB;AAEA,WAAO,QAAQ;AAEf,WAAO,MAAM;AACX,eAAS,SAAS;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,+BAAU,MAAM;AACd,QAAI,CAAC,OAAO,CAAC,WAAW;AACtB;AAAA,IACF;AAEA,cAAU,GAAG;AAAA,EACf,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,+BAAU,MAAM;AACd,WAAO,QAAQ,KAAK,MAAM,WAAW,CAAC,CAAC;AAAA,EACzC,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,SACE,8BAAAC,QAAA,4BAAAA,QAAA,gBACE,8BAAAA,QAAA,cAAC,SAAK,GAAG,UAAU,KAAU,GAC5B,QACH;AAEJ;;;AEhIA,IAAAC,gBAA+B;AAO/B,IAAM,iBAA8C;AAEpD,SAAS,eACP,SACA,mBACA;AACA,SAAO,SAAS,eAAe,OAA8B;AAC3D,UAAM,iBAAiB,MAAM;AAE7B,UAAM,iBAA0B;AAAA,MAC9B,MAAM,CAAC,GAAI,qBAAqB,CAAC,GAAI,GAAI,kBAAkB,CAAC,CAAE;AAAA,MAC9D,CAAC,cAAc;AAAA,IACjB;AAEA,WACE,8BAAAC,QAAA,cAAC,kBAAgB,GAAG,OAAO,YAAwB,SAAkB;AAAA,EAEzE;AACF;;;AHnBA,0BAAc,8BATd;","names":["import_react","import_core","React","React","import_react","React"]}
+{"version":3,"sources":["../src/index.ts","../src/renderer.tsx","../src/provider.tsx","../src/create-renderer.tsx","../src/editor.tsx","../src/create-editor.tsx"],"sourcesContent":["//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nexport { Renderer, type InferRendererProps } from './renderer';\n\nexport { createRenderer, type CreateRendererOptions } from './create-renderer';\n\nexport { EditorProvider, useEditor, useInjector } from './provider';\n\nexport { Editor } from './editor';\n\nexport { createEditor } from './create-editor';\n\nexport * from '@coze-editor/core';\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport {\n  type EditorPluginSpec,\n  type InferEditorAPIFromPlugins,\n  type InferEvents,\n  type InferValues,\n  create,\n} from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { useInjector, useSetEditor } from './provider';\n\ntype UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (\n  k: infer I,\n) => void\n  ? I\n  : never;\n\ntype InferReactEvents<T extends Record<string, any>> = UnionToIntersection<{\n  [K in keyof T as `on${Capitalize<string & K>}`]?: (e: T[K]) => void;\n}>;\n\nfunction firstLetterToUppercase(str: string) {\n  return str.charAt(0).toUpperCase() + str.substring(1);\n}\n\ntype InferRendererProps<T extends EditorPluginSpec<string, any, any>[]> = {\n  domProps?: {\n    style?: CSSProperties;\n    className?: string;\n  };\n  defaultValue?: string;\n  root?: Document | ShadowRoot;\n  options?: Partial<InferValues<T[number]>>;\n  extensions?: Extension[];\n  didMount?: (api: InferEditorAPIFromPlugins<T>) => void;\n  children?: ReactNode;\n} & (InferEvents<T[number]> extends Record<string, any>\n  ? InferReactEvents<InferEvents<T[number]>>\n  : unknown);\n\nfunction Renderer<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  const {\n    plugins,\n    defaultValue,\n    root,\n    options,\n    domProps = {},\n    extensions,\n    didMount,\n    children,\n  } = props;\n\n  const [api, setAPI] = useState<any>();\n  const ref = useRef(null);\n  const apiRef = useRef<any>(null);\n  const propsRef = useRef<typeof props | null>(null);\n  const setEditor = useSetEditor();\n  const injector = useInjector();\n\n  propsRef.current = props;\n\n  useEffect(() => {\n    const { render, eventKeys } = create({\n      plugins,\n      injector,\n    });\n\n    const exported = render({\n      parent: ref.current!,\n      root,\n      defaultValue,\n      options: options ?? {},\n      extensions,\n    });\n\n    apiRef.current = exported;\n\n    eventKeys.forEach((eventName: any) => {\n      exported.$on(eventName, e => {\n        const handler = (propsRef.current as any)?.[\n          `on${firstLetterToUppercase(eventName)}`\n        ];\n        if (typeof handler === 'function') {\n          handler(e);\n        }\n      });\n    });\n\n    if (typeof didMount === 'function') {\n      didMount(exported);\n    }\n\n    setAPI(exported);\n\n    return () => {\n      exported.$destroy();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!api || !setEditor) {\n      return;\n    }\n\n    setEditor(api);\n  }, [api, setEditor]);\n\n  useEffect(() => {\n    apiRef.current.$set(props.options ?? {});\n  }, [props.options]);\n\n  return (\n    <>\n      <div {...domProps} ref={ref} />\n      {children}\n    </>\n  );\n}\n\nexport { Renderer };\n\nexport type { InferRendererProps };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, {\n  type Dispatch,\n  type ReactNode,\n  createContext,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type Injector, createInjector } from '@coze-editor/core';\n\nconst InternalEditorContext = createContext<unknown>(null);\nconst InternalSetEditorContext = createContext<Dispatch<any> | null>(null);\nconst InjectorContext = createContext<Injector | undefined>(undefined);\n\nfunction useEditor<T>(): T {\n  return useContext(InternalEditorContext) as T;\n}\n\nfunction useSetEditor(): Dispatch<any> | null {\n  return useContext(InternalSetEditorContext);\n}\n\nfunction useInjector(): Injector {\n  const injector = useContext(InjectorContext);\n\n  if (!injector) {\n    throw new Error('useInjector should be used in EditorProvider');\n  }\n\n  return injector;\n}\n\nfunction EditorProvider({ children }: { children?: ReactNode }) {\n  const [editor, setEditor] = useState(null);\n  const injectorRef = useRef<Injector | null>(null);\n\n  if (!injectorRef.current) {\n    injectorRef.current = createInjector();\n  }\n\n  return (\n    <InternalEditorContext.Provider value={editor}>\n      <InternalSetEditorContext.Provider value={setEditor}>\n        <InjectorContext.Provider value={injectorRef.current}>\n          {children}\n        </InjectorContext.Provider>\n      </InternalSetEditorContext.Provider>\n    </InternalEditorContext.Provider>\n  );\n}\n\nexport { EditorProvider, useEditor, useSetEditor, useInjector };\n","//  Copyright (c) 2025 coze-dev\n//  SPDX-License-Identifier: MIT\n\nimport React, { useMemo } from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\nimport { type Extension } from '@codemirror/state';\n\nimport { Renderer, type InferRendererProps } from './renderer';\n\nconst OriginRenderer: (props: any) => JSX.Element = Renderer;\n\ninterface CreateRendererOptions<T> {\n  defaultOptions?: T;\n}\n\nfunction createRenderer<\n  T extends EditorPluginSpec<string, any, any>[],\n  U extends InferRendererProps<T> = InferRendererProps<T>,\n>(plugins: T, options?: Extension[] | CreateRendererOptions<U['options']>) {\n  let builtinExtensions: Extension[] = [];\n  let defaultOptions = {};\n\n  // 兼容历史类型\n  if (Array.isArray(options)) {\n    builtinExtensions = options;\n  } else if (options && typeof options === 'object') {\n    defaultOptions = options.defaultOptions ?? {};\n  }\n\n  return function CustomRenderer(props: InferRendererProps<T>) {\n    const userExtensions = props.extensions;\n\n    const extensions: Extension[] = useMemo(\n      () => [...(builtinExtensions ?? []), ...(userExtensions ?? [])],\n      [userExtensions],\n    );\n\n    return (\n      <OriginRenderer\n        {...props}\n        options={{\n          ...defaultOptions,\n          ...(props.options ?? {}),\n        }}\n        extensions={extensions}\n        plugins={plugins}\n      />\n    );\n  };\n}\n\nexport { createRenderer };\nexport type { CreateRendererOptions };\n","import React from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\n\nimport { type InferRendererProps, Renderer } from './renderer';\nimport { EditorProvider } from './provider';\n\nfunction Editor<T extends EditorPluginSpec<string, any, any>[]>(\n  props: { plugins: T } & InferRendererProps<T>,\n) {\n  return (\n    <EditorProvider>\n      <Renderer {...props} />\n    </EditorProvider>\n  );\n}\n\nexport { Editor };\n","import React from 'react';\n\nimport { type EditorPluginSpec } from '@coze-editor/core';\n\nimport { type InferRendererProps } from './renderer';\nimport { EditorProvider } from './provider';\nimport { createRenderer, type CreateRendererOptions } from './create-renderer';\n\nfunction createEditor<\n  T extends EditorPluginSpec<string, any, any>[],\n  U extends InferRendererProps<T> = InferRendererProps<T>,\n>(plugins: T, options?: CreateRendererOptions<U['options']>) {\n  const CustomRenderer = createRenderer(plugins, options);\n\n  return function CustomEditor(props: InferRendererProps<T>) {\n    return (\n      <EditorProvider>\n        <CustomRenderer {...props} />\n      </EditorProvider>\n    );\n  };\n}\n\nexport { createEditor };\n"],"mappings":"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","names":["import_react","import_core","React","React","import_react","React","import_react","React","import_react","React"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coze-editor/react",
-  "version": "0.1.0-alpha.dd871b",
+  "version": "0.1.0-alpha.f1005d",
   "description": "react",
   "license": "MIT",
   "author": "fengzilong",
@@ -23,7 +23,7 @@
     "lint": "eslint && tsc --noEmit"
   },
   "dependencies": {
-    "@coze-editor/core": "0.1.0-alpha.dd871b"
+    "@coze-editor/core": "0.1.0-alpha.f1005d"
   },
   "devDependencies": {
     "@codemirror/state": "^6.4.1",
@@ -42,8 +42,8 @@
   "peerDependencies": {
     "@codemirror/state": "^6.4.1",
     "@codemirror/view": "^6.26.1",
-    "react": "~18.2.0",
-    "react-dom": "~18.2.0"
+    "react": ">=16.8",
+    "react-dom": ">=16.8"
   },
   "packageManager": "pnpm@9.15.0",
   "publishConfig": {