Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onPaste event fired on container instead of editor #64

Open
RobertFischer opened this issue Feb 20, 2019 · 0 comments
Open

onPaste event fired on container instead of editor #64

RobertFischer opened this issue Feb 20, 2019 · 0 comments

Comments

@RobertFischer
Copy link

I would like to customize the handling when pasting some comment. To this end, I was following the slate-paste-html example, but the last two arguments expected by onPaste are missing (aka: undefined).

In my code, I do this:

import React, { useState } from 'react';
import Editor from 'canner-slate-editor';
import { getEventTransfer } from 'slate-react';
/* ... */
const BeeWellSlateEditor = ({ onChange:incomingOnChange, value:incomingValue=initialValue }) => {
	const [value, setValue] = useState(_.isEmpty(incomingValue) ? initialValue : incomingValue);

	// On change, update the app's React state with the new editor value.
	const onChange = ({ value:newValue }) => {
		setValue(newValue);
		incomingOnChange(newValue);
	};

	// Code derived from:
	//   * https://github.com/ianstormtaylor/slate/blob/master/examples/paste-html/index.js
	const onPaste = (event, editor, next) => {
		const transfer = getEventTransfer(event);
		console.debug(`Saw a paste event in the rich-text editor`, { editor, next, event, transfer });
		return next();
	};

	return (
		<div className="editor">
			<Editor
				value={value}
				onChange={onChange}
				onPaste={onPaste}
			/>
		</div>
	);
};

This successfully calls into my onPaste function. However, the editor and next values are both undefined, and I really need them to be defined in order to do anything interesting.

I started digging into the code, and it doesn't look like onPaste is passed down into the underlying Slate editor: https://github.com/Canner/canner-slate-editor/blob/master/packages/editors/canner-slate-editor/src/index.js#L254-L272 Moreover, it looks like that argument is actually being passed to the container div: https://github.com/Canner/canner-slate-editor/blob/master/packages/editors/canner-slate-editor/src/index.js#L215 -- so it's the container div whose onPaste event is firing, not the Slate editor.

It seems we can't customize plugins as per #63 so what would be the proper way to go about enabling the onPaste handling (without maintaining a private fork of canner-slate-editor)?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant