@tiptap/react
Advanced tools
@tiptap/react - npm Package Compare versions
Comparing version 2.6.0 to 2.6.1
| import { BubbleMenuPlugin } from '@tiptap/extension-bubble-menu'; | ||
| import React, { forwardRef, useState, useEffect, useDebugValue, useRef, createContext, useContext } from 'react'; | ||
| import ReactDOM, { flushSync } from 'react-dom'; | ||
| import { Editor as Editor$1, NodeView } from '@tiptap/core'; | ||
| import { Editor, NodeView } from '@tiptap/core'; | ||
| export * from '@tiptap/core'; | ||
| export { Editor } from '@tiptap/core'; | ||
| import { FloatingMenuPlugin } from '@tiptap/extension-floating-menu'; | ||
@@ -349,3 +350,2 @@ | ||
| constructor(props) { | ||
| var _a; | ||
| super(props); | ||
@@ -355,3 +355,3 @@ this.editorContentRef = React.createRef(); | ||
| this.state = { | ||
| hasContentComponentInitialized: Boolean((_a = props.editor) === null || _a === void 0 ? void 0 : _a.contentComponent), | ||
| hasContentComponentInitialized: Boolean(props.editor.contentComponent), | ||
| }; | ||
@@ -366,3 +366,3 @@ } | ||
| init() { | ||
| const { editor } = this.props; | ||
| const editor = this.props.editor; | ||
| if (editor && !editor.isDestroyed && editor.options.element) { | ||
@@ -401,3 +401,3 @@ if (editor.contentComponent) { | ||
| componentWillUnmount() { | ||
| const { editor } = this.props; | ||
| const editor = this.props.editor; | ||
| if (!editor) { | ||
@@ -436,2 +436,3 @@ return; | ||
| return Math.floor(Math.random() * 0xffffffff).toString(); | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, [props.editor]); | ||
@@ -818,3 +819,3 @@ // Can't use JSX here because it conflicts with the type definition of Vue's JSX, so use createElement | ||
| }; | ||
| const editor = new Editor$1(optionsToApply); | ||
| const editor = new Editor(optionsToApply); | ||
| // no need to keep track of the event listeners, they will be removed when the editor is destroyed | ||
@@ -1011,9 +1012,2 @@ return editor; | ||
| class Editor extends Editor$1 { | ||
| constructor() { | ||
| super(...arguments); | ||
| this.contentComponent = null; | ||
| } | ||
| } | ||
| const FloatingMenu = (props) => { | ||
@@ -1061,3 +1055,5 @@ const [element, setElement] = useState(null); | ||
| const { nodeViewContentRef } = useReactNodeView(); | ||
| return (React.createElement(Tag, { ...props, ref: nodeViewContentRef, "data-node-view-content": "", style: { | ||
| return ( | ||
| // @ts-ignore | ||
| React.createElement(Tag, { ...props, ref: nodeViewContentRef, "data-node-view-content": "", style: { | ||
| whiteSpace: 'pre-wrap', | ||
@@ -1139,5 +1135,6 @@ ...props.style, | ||
| render() { | ||
| var _a, _b; | ||
| var _a; | ||
| const Component = this.component; | ||
| const props = this.props; | ||
| const editor = this.editor; | ||
| if (isClassComponent(Component) || isForwardRefComponent(Component)) { | ||
@@ -1149,3 +1146,3 @@ props.ref = (ref) => { | ||
| this.reactElement = React.createElement(Component, props); | ||
| (_b = (_a = this.editor) === null || _a === void 0 ? void 0 : _a.contentComponent) === null || _b === void 0 ? void 0 : _b.setRenderer(this.id, this); | ||
| (_a = editor === null || editor === void 0 ? void 0 : editor.contentComponent) === null || _a === void 0 ? void 0 : _a.setRenderer(this.id, this); | ||
| } | ||
@@ -1160,4 +1157,5 @@ updateProps(props = {}) { | ||
| destroy() { | ||
| var _a, _b; | ||
| (_b = (_a = this.editor) === null || _a === void 0 ? void 0 : _a.contentComponent) === null || _b === void 0 ? void 0 : _b.removeRenderer(this.id); | ||
| var _a; | ||
| const editor = this.editor; | ||
| (_a = editor === null || editor === void 0 ? void 0 : editor.contentComponent) === null || _a === void 0 ? void 0 : _a.removeRenderer(this.id); | ||
| } | ||
@@ -1315,3 +1313,3 @@ } | ||
| export { BubbleMenu, Editor, EditorConsumer, EditorContent, EditorContext, EditorProvider, FloatingMenu, NodeViewContent, NodeViewWrapper, PureEditorContent, ReactNodeViewContext, ReactNodeViewRenderer, ReactRenderer, useCurrentEditor, useEditor, useEditorState, useReactNodeView }; | ||
| export { BubbleMenu, EditorConsumer, EditorContent, EditorContext, EditorProvider, FloatingMenu, NodeViewContent, NodeViewWrapper, PureEditorContent, ReactNodeViewContext, ReactNodeViewRenderer, ReactRenderer, useCurrentEditor, useEditor, useEditorState, useReactNodeView }; | ||
| //# sourceMappingURL=index.js.map |
@@ -348,3 +348,2 @@ (function (global, factory) { | ||
| constructor(props) { | ||
| var _a; | ||
| super(props); | ||
@@ -354,3 +353,3 @@ this.editorContentRef = React.createRef(); | ||
| this.state = { | ||
| hasContentComponentInitialized: Boolean((_a = props.editor) === null || _a === void 0 ? void 0 : _a.contentComponent), | ||
| hasContentComponentInitialized: Boolean(props.editor.contentComponent), | ||
| }; | ||
@@ -365,3 +364,3 @@ } | ||
| init() { | ||
| const { editor } = this.props; | ||
| const editor = this.props.editor; | ||
| if (editor && !editor.isDestroyed && editor.options.element) { | ||
@@ -400,3 +399,3 @@ if (editor.contentComponent) { | ||
| componentWillUnmount() { | ||
| const { editor } = this.props; | ||
| const editor = this.props.editor; | ||
| if (!editor) { | ||
@@ -435,2 +434,3 @@ return; | ||
| return Math.floor(Math.random() * 0xffffffff).toString(); | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, [props.editor]); | ||
@@ -1009,9 +1009,2 @@ // Can't use JSX here because it conflicts with the type definition of Vue's JSX, so use createElement | ||
| class Editor extends core.Editor { | ||
| constructor() { | ||
| super(...arguments); | ||
| this.contentComponent = null; | ||
| } | ||
| } | ||
| const FloatingMenu = (props) => { | ||
@@ -1059,3 +1052,5 @@ const [element, setElement] = React.useState(null); | ||
| const { nodeViewContentRef } = useReactNodeView(); | ||
| return (React.createElement(Tag, { ...props, ref: nodeViewContentRef, "data-node-view-content": "", style: { | ||
| return ( | ||
| // @ts-ignore | ||
| React.createElement(Tag, { ...props, ref: nodeViewContentRef, "data-node-view-content": "", style: { | ||
| whiteSpace: 'pre-wrap', | ||
@@ -1137,5 +1132,6 @@ ...props.style, | ||
| render() { | ||
| var _a, _b; | ||
| var _a; | ||
| const Component = this.component; | ||
| const props = this.props; | ||
| const editor = this.editor; | ||
| if (isClassComponent(Component) || isForwardRefComponent(Component)) { | ||
@@ -1147,3 +1143,3 @@ props.ref = (ref) => { | ||
| this.reactElement = React.createElement(Component, props); | ||
| (_b = (_a = this.editor) === null || _a === void 0 ? void 0 : _a.contentComponent) === null || _b === void 0 ? void 0 : _b.setRenderer(this.id, this); | ||
| (_a = editor === null || editor === void 0 ? void 0 : editor.contentComponent) === null || _a === void 0 ? void 0 : _a.setRenderer(this.id, this); | ||
| } | ||
@@ -1158,4 +1154,5 @@ updateProps(props = {}) { | ||
| destroy() { | ||
| var _a, _b; | ||
| (_b = (_a = this.editor) === null || _a === void 0 ? void 0 : _a.contentComponent) === null || _b === void 0 ? void 0 : _b.removeRenderer(this.id); | ||
| var _a; | ||
| const editor = this.editor; | ||
| (_a = editor === null || editor === void 0 ? void 0 : editor.contentComponent) === null || _a === void 0 ? void 0 : _a.removeRenderer(this.id); | ||
| } | ||
@@ -1313,4 +1310,7 @@ } | ||
| Object.defineProperty(exports, "Editor", { | ||
| enumerable: true, | ||
| get: function () { return core.Editor; } | ||
| }); | ||
| exports.BubbleMenu = BubbleMenu; | ||
| exports.Editor = Editor; | ||
| exports.EditorConsumer = EditorConsumer; | ||
@@ -1317,0 +1317,0 @@ exports.EditorContent = EditorContent; |
@@ -1,14 +0,13 @@ | ||
| import { Editor as CoreEditor } from '@tiptap/core'; | ||
| import React from 'react'; | ||
| import { Editor } from '@tiptap/core'; | ||
| import { ReactPortal } from 'react'; | ||
| import { ReactRenderer } from './ReactRenderer.js'; | ||
| type ContentComponent = { | ||
| export type EditorWithContentComponent = Editor & { | ||
| contentComponent: ContentComponent | null; | ||
| }; | ||
| export type ContentComponent = { | ||
| setRenderer(id: string, renderer: ReactRenderer): void; | ||
| removeRenderer(id: string): void; | ||
| subscribe: (callback: () => void) => () => void; | ||
| getSnapshot: () => Record<string, React.ReactPortal>; | ||
| getServerSnapshot: () => Record<string, React.ReactPortal>; | ||
| getSnapshot: () => Record<string, ReactPortal>; | ||
| getServerSnapshot: () => Record<string, ReactPortal>; | ||
| }; | ||
| export declare class Editor extends CoreEditor { | ||
| contentComponent: ContentComponent | null; | ||
| } | ||
| export {}; |
@@ -0,3 +1,3 @@ | ||
| import { Editor } from '@tiptap/core'; | ||
| import React, { ForwardedRef, HTMLProps } from 'react'; | ||
| import { Editor } from './Editor.js'; | ||
| export interface EditorContentProps extends HTMLProps<HTMLDivElement> { | ||
@@ -4,0 +4,0 @@ editor: Editor | null; |
| export * from './BubbleMenu.js'; | ||
| export * from './Context.js'; | ||
| export { Editor } from './Editor.js'; | ||
| export * from './EditorContent.js'; | ||
@@ -13,2 +12,3 @@ export * from './FloatingMenu.js'; | ||
| export * from './useReactNodeView.js'; | ||
| export { Editor } from '@tiptap/core'; | ||
| export * from '@tiptap/core'; |
| import { Editor } from '@tiptap/core'; | ||
| import React from 'react'; | ||
| import { Editor as ExtendedEditor } from './Editor.js'; | ||
| export interface ReactRendererOptions { | ||
@@ -51,3 +50,3 @@ /** | ||
| id: string; | ||
| editor: ExtendedEditor; | ||
| editor: Editor; | ||
| component: any; | ||
@@ -54,0 +53,0 @@ element: Element; |
| { | ||
| "name": "@tiptap/react", | ||
| "description": "React components for tiptap", | ||
| "version": "2.6.0", | ||
| "version": "2.6.1", | ||
| "homepage": "https://tiptap.dev", | ||
@@ -32,4 +32,4 @@ "keywords": [ | ||
| "dependencies": { | ||
| "@tiptap/extension-bubble-menu": "^2.6.0", | ||
| "@tiptap/extension-floating-menu": "^2.6.0", | ||
| "@tiptap/extension-bubble-menu": "^2.6.1", | ||
| "@tiptap/extension-floating-menu": "^2.6.1", | ||
| "@types/use-sync-external-store": "^0.0.6", | ||
@@ -39,4 +39,4 @@ "use-sync-external-store": "^1.2.2" | ||
| "devDependencies": { | ||
| "@tiptap/core": "^2.6.0", | ||
| "@tiptap/pm": "^2.6.0", | ||
| "@tiptap/core": "^2.6.1", | ||
| "@tiptap/pm": "^2.6.1", | ||
| "@types/react": "^18.2.14", | ||
@@ -48,4 +48,4 @@ "@types/react-dom": "^18.2.6", | ||
| "peerDependencies": { | ||
| "@tiptap/core": "^2.6.0", | ||
| "@tiptap/pm": "^2.6.0", | ||
| "@tiptap/core": "^2.6.1", | ||
| "@tiptap/pm": "^2.6.1", | ||
| "react": "^17.0.0 || ^18.0.0", | ||
@@ -52,0 +52,0 @@ "react-dom": "^17.0.0 || ^18.0.0" |
@@ -1,16 +0,13 @@ | ||
| import { Editor as CoreEditor } from '@tiptap/core' | ||
| import React from 'react' | ||
| import { Editor } from '@tiptap/core' | ||
| import { ReactPortal } from 'react' | ||
| import { ReactRenderer } from './ReactRenderer.js' | ||
| type ContentComponent = { | ||
| export type EditorWithContentComponent = Editor & { contentComponent: ContentComponent | null } | ||
| export type ContentComponent = { | ||
| setRenderer(id: string, renderer: ReactRenderer): void; | ||
| removeRenderer(id: string): void; | ||
| subscribe: (callback: () => void) => () => void; | ||
| getSnapshot: () => Record<string, React.ReactPortal>; | ||
| getServerSnapshot: () => Record<string, React.ReactPortal>; | ||
| getSnapshot: () => Record<string, ReactPortal>; | ||
| getServerSnapshot: () => Record<string, ReactPortal>; | ||
| } | ||
| export class Editor extends CoreEditor { | ||
| public contentComponent: ContentComponent | null = null | ||
| } |
| export * from './BubbleMenu.js' | ||
| export * from './Context.js' | ||
| export { Editor } from './Editor.js' | ||
| export * from './EditorContent.js' | ||
@@ -13,2 +12,3 @@ export * from './FloatingMenu.js' | ||
| export * from './useReactNodeView.js' | ||
| export { Editor } from '@tiptap/core' | ||
| export * from '@tiptap/core' |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by0.01%
8988
Worsened metrics
- Total package byte prevSize
- decreased by-0.12%
633625