diff --git a/packages/core/src/client/components/Plate.tsx b/packages/core/src/client/components/Plate.tsx index 9145c61206..a2044e02a6 100644 --- a/packages/core/src/client/components/Plate.tsx +++ b/packages/core/src/client/components/Plate.tsx @@ -42,6 +42,7 @@ export interface PlateProps< insertData?: boolean; length?: boolean; nodeFactory?: boolean; + queryCachToState?: boolean; react?: boolean; selection?: boolean; } diff --git a/packages/core/src/client/components/PlateEffects.tsx b/packages/core/src/client/components/PlateEffects.tsx index 6836b0aff8..5de03e7eff 100644 --- a/packages/core/src/client/components/PlateEffects.tsx +++ b/packages/core/src/client/components/PlateEffects.tsx @@ -19,5 +19,9 @@ export function PlateEffects< >({ children, ...props }: PlateEffectsProps) { usePlateEffects(props); - return <>{children}; + return ( +
+ {children} +
+ ); } diff --git a/packages/core/src/client/utils/createPlateEditor.ts b/packages/core/src/client/utils/createPlateEditor.ts index 63e2005c7b..1394e801e2 100644 --- a/packages/core/src/client/utils/createPlateEditor.ts +++ b/packages/core/src/client/utils/createPlateEditor.ts @@ -57,7 +57,6 @@ export const createPlateEditor = < components, overrideByKey, }); - const e = withPlate(editor, { plugins, ...withPlateOptions, diff --git a/packages/core/src/client/utils/setPlatePlugins.ts b/packages/core/src/client/utils/setPlatePlugins.ts index 562e3c0439..3d6fed1277 100644 --- a/packages/core/src/client/utils/setPlatePlugins.ts +++ b/packages/core/src/client/utils/setPlatePlugins.ts @@ -16,6 +16,7 @@ import { KEY_LENGTH, KEY_NODE_FACTORY, KEY_PREV_SELECTION, + KEY_QUERY_CACHE_TO_STATE, createDeserializeAstPlugin, createDeserializeHtmlPlugin, createEditorProtocolPlugin, @@ -26,6 +27,7 @@ import { createLengthPlugin, createNodeFactoryPlugin, createPrevSelectionPlugin, + createQueryCachToStatePlugin, } from '../../shared/plugins'; import { flattenDeepPlugins } from '../../shared/utils/flattenDeepPlugins'; import { overridePluginsByKey } from '../../shared/utils/overridePluginsByKey'; @@ -114,6 +116,12 @@ export const setPlatePlugins = < createEditorProtocolPlugin() ); } + if (typeof dcp !== 'object' || !dcp?.queryCachToState) { + plugins.push( + (editor?.pluginsByKey?.[KEY_QUERY_CACHE_TO_STATE] as any) ?? + createQueryCachToStatePlugin() + ); + } } plugins = [...plugins, ..._plugins] as any; diff --git a/packages/core/src/server/setPlatePlugins.ts b/packages/core/src/server/setPlatePlugins.ts index ac0d068c43..e213feae27 100644 --- a/packages/core/src/server/setPlatePlugins.ts +++ b/packages/core/src/server/setPlatePlugins.ts @@ -15,6 +15,7 @@ import { KEY_LENGTH, KEY_NODE_FACTORY, KEY_PREV_SELECTION, + KEY_QUERY_CACHE_TO_STATE, createDeserializeAstPlugin, createDeserializeHtmlPlugin, createEditorProtocolPlugin, @@ -25,6 +26,7 @@ import { createLengthPlugin, createNodeFactoryPlugin, createPrevSelectionPlugin, + createQueryCachToStatePlugin, } from '../shared/plugins'; import { flattenDeepPlugins } from '../shared/utils/flattenDeepPlugins'; import { overridePluginsByKey } from '../shared/utils/overridePluginsByKey'; @@ -112,6 +114,12 @@ export const setPlatePlugins = < createEditorProtocolPlugin() ); } + if (typeof dcp !== 'object' || !dcp?.queryCachToState) { + plugins.push( + (editor?.pluginsByKey?.[KEY_QUERY_CACHE_TO_STATE] as any) ?? + createQueryCachToStatePlugin() + ); + } } plugins = [...plugins, ..._plugins] as any; diff --git a/packages/core/src/shared/plugins/createQueryCacheToState.ts b/packages/core/src/shared/plugins/createQueryCacheToState.ts new file mode 100644 index 0000000000..7e59dbaaad --- /dev/null +++ b/packages/core/src/shared/plugins/createQueryCacheToState.ts @@ -0,0 +1,64 @@ +import { + type AncestorOf, + type ENode, + type TEditor, + type TNodeEntry, + type Value, + getAboveNode, + getNodeEntries, + getNodeEntry, +} from '@udecode/slate'; +import { getBlockAbove } from '@udecode/slate-utils'; + +import type { PlateEditor } from '../types/PlateEditor'; + +import { createPluginFactory } from '../utils/createPluginFactory'; + +export type QueryCachToSateEditor = { + state: { + aboveEntries?: Generator>, void, undefined>; + aboveNode?: TNodeEntry>>; + ancestorNode?: TNodeEntry>; + blockAbove?: TNodeEntry>>; + }; +}; + +export const withQueryCachToState = < + V extends Value = Value, + E extends PlateEditor = PlateEditor, +>( + editor: E +) => { + if (typeof editor.state !== 'object') editor.state = {}; + + const { apply } = editor; + + editor.apply = (operation) => { + apply(operation); + + const aboveNode = getAboveNode(editor); + const aboveEntries = getNodeEntries(editor); + const blockAbove = getBlockAbove(editor); + + editor.state.aboveNode = aboveNode; + editor.state.blockAbove = blockAbove; + editor.state.aboveEntries = aboveEntries; + + const { selection } = editor; + + if (selection?.focus?.path) { + editor.state.ancestorNode = getNodeEntry(editor, [ + selection.focus.path[0], + ]); + } + }; + + return editor; +}; + +export const KEY_QUERY_CACHE_TO_STATE = 'queryCacheToSate'; + +export const createQueryCachToStatePlugin = createPluginFactory({ + key: KEY_QUERY_CACHE_TO_STATE, + withOverrides: withQueryCachToState, +}); diff --git a/packages/core/src/shared/plugins/index.ts b/packages/core/src/shared/plugins/index.ts index 28e21dadd2..113eca8653 100644 --- a/packages/core/src/shared/plugins/index.ts +++ b/packages/core/src/shared/plugins/index.ts @@ -10,5 +10,6 @@ export * from './createInsertDataPlugin'; export * from './createLengthPlugin'; export * from './createNodeFactoryPlugin'; export * from './createPrevSelectionPlugin'; +export * from './createQueryCacheToState'; export * from './event-editor/index'; export * from './html-deserializer/index'; diff --git a/packages/core/src/shared/transforms/toggleNodeType.ts b/packages/core/src/shared/transforms/toggleNodeType.ts index a1b4039a00..2e50aa1d9b 100644 --- a/packages/core/src/shared/transforms/toggleNodeType.ts +++ b/packages/core/src/shared/transforms/toggleNodeType.ts @@ -36,7 +36,9 @@ export const toggleNodeType = ( const { activeType, inactiveType = getPluginType(editor, ELEMENT_DEFAULT) } = options; - if (!activeType || !editor.selection) return; + const at = editorNodesOptions?.at ?? editor.selection; + + if (!activeType || !at) return; const isActive = someNode(editor, { ...editorNodesOptions, @@ -47,7 +49,11 @@ export const toggleNodeType = ( if (isActive && activeType === inactiveType) return; - setElements(editor, { - type: isActive ? inactiveType : activeType, - }); + setElements( + editor, + { + type: isActive ? inactiveType : activeType, + }, + { at: at as any } + ); }; diff --git a/packages/core/src/shared/types/PlateEditor.ts b/packages/core/src/shared/types/PlateEditor.ts index cceb3497f4..761c968d67 100644 --- a/packages/core/src/shared/types/PlateEditor.ts +++ b/packages/core/src/shared/types/PlateEditor.ts @@ -11,6 +11,7 @@ import type { import type { TReactEditor } from '@udecode/slate-react'; import type { Path } from 'slate'; +import type { QueryCachToSateEditor } from '../plugins'; import type { PlateEditorMethods } from './PlateEditorMethods'; import type { WithPlatePlugin } from './plugin/PlatePlugin'; import type { PluginKey } from './plugin/PlatePluginKey'; @@ -45,6 +46,7 @@ export type PlateEditor = { prevSelection: TRange | null; } & PlateEditorMethods & + QueryCachToSateEditor & TEditor & THistoryEditor & TReactEditor; diff --git a/packages/core/src/shared/types/plugin/KeyboardHandler.ts b/packages/core/src/shared/types/plugin/KeyboardHandler.ts index 057563471a..8e3b424033 100644 --- a/packages/core/src/shared/types/plugin/KeyboardHandler.ts +++ b/packages/core/src/shared/types/plugin/KeyboardHandler.ts @@ -14,3 +14,5 @@ export type KeyboardHandler< export type KeyboardHandlerReturnType = DOMHandlerReturnType; + +export type MouseHandlerReturnType = DOMHandlerReturnType;