diff --git a/src/extensions/base/BaseSchema/index.ts b/src/extensions/base/BaseSchema/index.ts index 9848bfe4..8571e0cb 100644 --- a/src/extensions/base/BaseSchema/index.ts +++ b/src/extensions/base/BaseSchema/index.ts @@ -1,4 +1,4 @@ -import {setBlockType} from 'prosemirror-commands'; +import {chainCommands, setBlockType} from 'prosemirror-commands'; import type {Command} from 'prosemirror-state'; import {hasParentNodeOfType} from 'prosemirror-utils'; @@ -31,9 +31,11 @@ export const BaseSchema: ExtensionAuto = (builder, opts) => { builder.addAction(pAction, ({schema}) => { const p = pType(schema); const cmd = setBlockType(p); + const isParagraph: Command = (state) => hasParentNodeOfType(p)(state.selection); + return { - isActive: (state) => hasParentNodeOfType(p)(state.selection), - isEnable: cmd, + isActive: isParagraph, + isEnable: chainCommands(isParagraph, cmd), run: cmd, }; }); diff --git a/src/toolbar/ToolbarListButton.tsx b/src/toolbar/ToolbarListButton.tsx index d193e2f9..5caec292 100644 --- a/src/toolbar/ToolbarListButton.tsx +++ b/src/toolbar/ToolbarListButton.tsx @@ -41,7 +41,9 @@ export function ToolbarListButton({ const buttonRef = React.useRef(null); const [open, , hide, toggleOpen] = useBooleanState(false); - const someActive = alwaysActive ? false : data.some((item) => item.isActive(editor)); + const someActive = alwaysActive + ? false + : data.some((item) => item.isActive(editor) && !item.doNotHighlightButtonWhenActive); const everyDisabled = alwaysActive ? false : data.every((item) => !item.isEnable(editor)); const popupOpen = everyDisabled ? false : open; diff --git a/src/toolbar/types.ts b/src/toolbar/types.ts index 57a94e9d..cbf3e74b 100644 --- a/src/toolbar/types.ts +++ b/src/toolbar/types.ts @@ -35,6 +35,7 @@ export type ToolbarItemData = { exec(editor: E): void; isActive(editor: E): boolean; isEnable(editor: E): boolean; + doNotHighlightButtonWhenActive?: boolean; }; export enum ToolbarDataType {