craft.js icon indicating copy to clipboard operation
craft.js copied to clipboard

Customizing `DefaultEventHandlers` in editor is not working

Open chavda-bhavik opened this issue 1 year ago • 1 comments

Describe the bug Editor allows providing DefaultEventHandlers that is useful for cases like, Want to wrap elements into section when any element is dropped in ROOT.

To Reproduce

  1. In Editor provide DefaultEventHandlers like,
<Editor
      handlers={(store) =>
        new DefaultEventHandlers({
          // @ts-ignore
          store,
          isMultiSelectEnabled: (e: MouseEvent) => !!e.metaKey,
        })
      }
>
...
</Editor>

Here the DefaultEventHandlers is written manually to handle the needs.

Expected behavior Provided DefaultEventHandlers should be used.

Additional context I found out the issue is in useEditorState, where we need to provide handlers like,

export const useEditorStore = (
  options: Partial<Options>,
  patchListener: PatchListener<
    EditorState,
    typeof ActionMethodsWithConfig,
    typeof QueryMethods
  >
): EditorStore => {
  // TODO: fix type
  return useMethods(
    ActionMethodsWithConfig,
    {
      ...editorInitialState,
      ...(options.handlers ? { handlers: options.handlers } : {}),
      options: {
        ...editorInitialState.options,
        ...options,
      },
    },
    QueryMethods,
    patchListener
  ) as EditorStore;
};

Your environment

Software Version(s)
craft.js 0.2.0-beta.8
React 18.2.0
TypeScript ^4.9.5
Browser Chrome
npm/Yarn yarn 1.22.19
Operating System Linux

chavda-bhavik avatar Jul 04 '23 03:07 chavda-bhavik

Isn't the overwritten DefaultEventHandlers that you passed to the Editor component used? I just tried it out on the basic example, and it does seem to work. Unless I am missing something?

prevwong avatar Aug 01 '23 11:08 prevwong