diff --git a/packages/editor/dist/cjs/extensions/codeblock/component.js b/packages/editor/dist/cjs/extensions/codeblock/component.js index 4666012a2..e7b555b5d 100644 --- a/packages/editor/dist/cjs/extensions/codeblock/component.js +++ b/packages/editor/dist/cjs/extensions/codeblock/component.js @@ -44,7 +44,7 @@ function CodeblockComponent(props) { const preventUpdate = language === languageDefinition.filename; updateAttributes({ language: languageDefinition.filename, - }, preventUpdate); + }, { preventUpdate, addToHistory: false }); }); })(); }, [language]); @@ -103,7 +103,7 @@ function CodeblockComponent(props) { location: "top", yOffset: 5, }, title: "Change code block language" }, { children: (0, jsx_runtime_1.jsx)(LanguageSelector, { selectedLanguage: (languageDefinition === null || languageDefinition === void 0 ? void 0 : languageDefinition.filename) || "Plaintext", onLanguageSelected: (language) => { - updateAttributes({ language }); + updateAttributes({ language }, { addToHistory: true, preventUpdate: false }); setIsOpen(false); }, onClose: () => setIsOpen(false) }) }))] })); } diff --git a/packages/editor/dist/cjs/extensions/embed/component.js b/packages/editor/dist/cjs/extensions/embed/component.js index 89297abf0..3e148e100 100644 --- a/packages/editor/dist/cjs/extensions/embed/component.js +++ b/packages/editor/dist/cjs/extensions/embed/component.js @@ -30,7 +30,7 @@ function EmbedComponent(props) { updateAttributes({ width: ref.clientWidth, height: ref.clientHeight, - }); + }, { addToHistory: true, preventUpdate: false }); }, lockAspectRatio: true }, { children: [(0, jsx_runtime_1.jsx)(rebass_1.Flex, Object.assign({ width: "100%", sx: { position: "relative", justifyContent: "end", diff --git a/packages/editor/dist/cjs/extensions/image/component.js b/packages/editor/dist/cjs/extensions/image/component.js index 172555938..cae7f480a 100644 --- a/packages/editor/dist/cjs/extensions/image/component.js +++ b/packages/editor/dist/cjs/extensions/image/component.js @@ -60,7 +60,7 @@ function ImageComponent(props) { updateAttributes({ width: ref.clientWidth, height: ref.clientHeight, - }); + }, { addToHistory: true, preventUpdate: false }); }, lockAspectRatio: true }, { children: [(0, jsx_runtime_1.jsx)(responsive_1.DesktopOnly, { children: selected && ((0, jsx_runtime_1.jsx)(rebass_1.Flex, Object.assign({ sx: { position: "relative", justifyContent: "end" } }, { children: (0, jsx_runtime_1.jsx)(rebass_1.Flex, Object.assign({ sx: { position: "absolute", top: -40, diff --git a/packages/editor/dist/cjs/extensions/react/reactnodeview.d.ts b/packages/editor/dist/cjs/extensions/react/reactnodeview.d.ts index 329805b57..0fc1c6e89 100644 --- a/packages/editor/dist/cjs/extensions/react/reactnodeview.d.ts +++ b/packages/editor/dist/cjs/extensions/react/reactnodeview.d.ts @@ -32,7 +32,7 @@ export declare class ReactNodeView

implements Node handleRef: (node: HTMLElement | null) => void; private _handleRef; render(props?: P, forwardRef?: ForwardRef): React.ReactElement | null; - updateAttributes(attributes: any, pos: number, preventUpdate?: boolean): void; + updateAttributes(attributes: any, pos: number, addToHistory?: boolean, preventUpdate?: boolean): void; update(node: PMNode, _decorations: readonly Decoration[], _innerDecorations: DecorationSource): boolean; onDragStart(event: DragEvent): void; stopEvent(event: Event): boolean; diff --git a/packages/editor/dist/cjs/extensions/react/reactnodeview.js b/packages/editor/dist/cjs/extensions/react/reactnodeview.js index a8ebd00eb..b58b591d4 100644 --- a/packages/editor/dist/cjs/extensions/react/reactnodeview.js +++ b/packages/editor/dist/cjs/extensions/react/reactnodeview.js @@ -88,13 +88,12 @@ class ReactNodeView { if (!this.options.component) return null; const theme = this.editor.storage.theme; - const pos = this.getPos(); - return ((0, jsx_runtime_1.jsx)(emotion_theming_1.ThemeProvider, Object.assign({ theme: theme }, { children: (0, jsx_runtime_1.jsx)(this.options.component, Object.assign({}, props, { editor: this.editor, getPos: this.getPos, node: this.node, forwardRef: forwardRef, updateAttributes: (attr, preventUpdate) => this.updateAttributes(attr, pos, preventUpdate) })) }))); + return ((0, jsx_runtime_1.jsx)(emotion_theming_1.ThemeProvider, Object.assign({ theme: theme }, { children: (0, jsx_runtime_1.jsx)(this.options.component, Object.assign({}, props, { editor: this.editor, getPos: this.getPos, node: this.node, forwardRef: forwardRef, updateAttributes: (attr, options) => this.updateAttributes(attr, this.getPos(), options === null || options === void 0 ? void 0 : options.addToHistory, options === null || options === void 0 ? void 0 : options.preventUpdate) })) }))); } - updateAttributes(attributes, pos, preventUpdate = false) { + updateAttributes(attributes, pos, addToHistory = false, preventUpdate = false) { this.editor.commands.command(({ tr }) => { tr.setNodeMarkup(pos, undefined, Object.assign(Object.assign({}, this.node.attrs), attributes)); - tr.setMeta("addToHistory", false); + tr.setMeta("addToHistory", addToHistory); tr.setMeta("preventUpdate", preventUpdate); return true; }); diff --git a/packages/editor/dist/cjs/extensions/react/selectionbasedreactnodeview.js b/packages/editor/dist/cjs/extensions/react/selectionbasedreactnodeview.js index 3423db3a5..c0d004a7a 100644 --- a/packages/editor/dist/cjs/extensions/react/selectionbasedreactnodeview.js +++ b/packages/editor/dist/cjs/extensions/react/selectionbasedreactnodeview.js @@ -83,7 +83,7 @@ class SelectionBasedNodeView extends reactnodeview_1.ReactNodeView { const theme = this.editor.storage.theme; const isSelected = this.editor.isEditable && (this.insideSelection() || this.nodeInsideSelection()); - return ((0, jsx_runtime_1.jsx)(emotion_theming_1.ThemeProvider, Object.assign({ theme: theme }, { children: (0, jsx_runtime_1.jsx)(this.options.component, Object.assign({}, props, { editor: this.editor, getPos: this.getPos, node: this.node, forwardRef: forwardRef, selected: isSelected, updateAttributes: (attr) => this.updateAttributes(attr, this.pos) })) }))); + return ((0, jsx_runtime_1.jsx)(emotion_theming_1.ThemeProvider, Object.assign({ theme: theme }, { children: (0, jsx_runtime_1.jsx)(this.options.component, Object.assign({}, props, { editor: this.editor, getPos: this.getPos, node: this.node, forwardRef: forwardRef, selected: isSelected, updateAttributes: (attr, options) => this.updateAttributes(attr, this.pos, options === null || options === void 0 ? void 0 : options.addToHistory, options === null || options === void 0 ? void 0 : options.preventUpdate) })) }))); } /** * Update current node's start and end positions. diff --git a/packages/editor/dist/cjs/extensions/react/types.d.ts b/packages/editor/dist/cjs/extensions/react/types.d.ts index 0cc116f4f..516fcf4af 100644 --- a/packages/editor/dist/cjs/extensions/react/types.d.ts +++ b/packages/editor/dist/cjs/extensions/react/types.d.ts @@ -11,7 +11,10 @@ export declare type GetPos = GetPosNode | boolean; export declare type GetPosNode = () => number; export declare type ForwardRef = (node: HTMLElement | null) => void; export declare type ShouldUpdate = (prevNode: PMNode, nextNode: PMNode) => boolean; -export declare type UpdateAttributes = (attributes: Partial, preventUpdate?: boolean) => void; +export declare type UpdateAttributes = (attributes: Partial, options?: { + addToHistory?: boolean; + preventUpdate?: boolean; +}) => void; export declare type ContentDOM = { dom: HTMLElement; contentDOM?: HTMLElement | null | undefined; diff --git a/packages/editor/dist/cjs/extensions/taskitem/component.js b/packages/editor/dist/cjs/extensions/taskitem/component.js index 9358c0525..158d6b2b9 100644 --- a/packages/editor/dist/cjs/extensions/taskitem/component.js +++ b/packages/editor/dist/cjs/extensions/taskitem/component.js @@ -39,7 +39,7 @@ function TaskItemComponent(props) { ".icon:hover path": { fill: "var(--checked) !important", }, - }, size: isMobile ? 24 : 20, onMouseDown: (e) => e.preventDefault() }), (0, jsx_runtime_1.jsx)(icon_1.Icon, { path: checked ? icons_1.Icons.check : "", stroke: "1px", sx: { + }, size: isMobile ? 24 : 20 }), (0, jsx_runtime_1.jsx)(icon_1.Icon, { path: checked ? icons_1.Icons.check : "", stroke: "1px", sx: { border: "2px solid", borderColor: checked ? "checked" : "icon", borderRadius: "default", @@ -58,7 +58,7 @@ function TaskItemComponent(props) { toggle(); }, color: checked ? "checked" : "icon", size: isMobile ? 16 : 14 }), (0, jsx_runtime_1.jsx)(rebass_1.Text, { as: "div", ref: forwardRef, sx: { textDecorationLine: checked ? "line-through" : "none", - color: checked ? "var(--checked)" : "var(--text)", + opacity: checked ? 0.8 : 1, flex: 1, } })] })) })); } diff --git a/packages/editor/dist/cjs/extensions/tasklist/component.js b/packages/editor/dist/cjs/extensions/tasklist/component.js index 2c5b7ff3f..2f5e7782d 100644 --- a/packages/editor/dist/cjs/extensions/tasklist/component.js +++ b/packages/editor/dist/cjs/extensions/tasklist/component.js @@ -62,7 +62,7 @@ function TaskListComponent(props) { fill: "var(--checked) !important", }, }, size: isMobile ? 24 : 20, onClick: () => { - updateAttributes({ collapsed: !collapsed }); + updateAttributes({ collapsed: !collapsed }, { addToHistory: false, preventUpdate: true }); } })] }))) : ((0, jsx_runtime_1.jsxs)(rebass_1.Flex, Object.assign({ sx: { position: "relative", bg: "bgSecondary", @@ -81,7 +81,7 @@ function TaskListComponent(props) { left: 0, transition: "width 250ms ease-out", } }), (0, jsx_runtime_1.jsx)(forms_1.Input, { readOnly: !editor.isEditable, value: title || "", variant: "clean", sx: { p: 0, px: 2, zIndex: 1, color: "fontTertiary" }, placeholder: "Untitled", onChange: (e) => { - updateAttributes({ title: e.target.value }); + updateAttributes({ title: e.target.value }, { addToHistory: true, preventUpdate: false }); } }), (0, jsx_runtime_1.jsxs)(rebass_1.Flex, Object.assign({ sx: { flexShrink: 0, pr: 2 } }, { children: [(0, jsx_runtime_1.jsx)(icon_1.Icon, { path: icons_1.Icons.checkbox, size: 15, color: "fontTertiary" }), (0, jsx_runtime_1.jsxs)(rebass_1.Text, Object.assign({ variant: "body", sx: { ml: 1, color: "fontTertiary" } }, { children: [stats.checked, "/", stats.total] }))] }))] }))) })), (0, jsx_runtime_1.jsx)(rebass_1.Text, { as: "div", ref: forwardRef, sx: { ul: { display: collapsed ? "none" : "block", diff --git a/packages/editor/dist/es/toolbar/components/toolbutton.d.ts b/packages/editor/dist/es/toolbar/components/toolbutton.d.ts index c0b3fc2f9..d7cb97dd4 100644 --- a/packages/editor/dist/es/toolbar/components/toolbutton.d.ts +++ b/packages/editor/dist/es/toolbar/components/toolbutton.d.ts @@ -14,8 +14,8 @@ export declare type ToolButtonProps = ButtonProps & { }; export declare const ToolButton: React.NamedExoticComponent | undefined; variant?: ToolButtonVariant | undefined;