data prop is not available for ckeditor

[MohannedAbuzant]

Code:

import {ClassicEditor, EventInfo} from 'ckeditor5';
import React, {ReactNode} from 'react';
import {CKEditor} from '@ckeditor/ckeditor5-react';
import 'ckeditor5/ckeditor5.css';


function EditorComponent({
	value,
	schema,
	onChange
}: {
	value: string;
	schema: IEditor;
	onChange?: React.Dispatch<React.SetStateAction<{value: string}>>;
}): ReactNode {
	
	const handleOnChange = (_: EventInfo, editor: ClassicEditor) => {
		if (onChange) {
			onChange({value: editor.getData()});
		}
	};

	return (
		<>
			{schema.label && (
				<Text className={classes.label}>
					{schema.label}
					{isRequired && (
						<Text c="var(--mantine-color-error)" span ms="xs">
							*
						</Text>
					)}
				</Text>
			)}

			<CKEditor
				onChange={handleOnChange}
				editor={ClassicEditor}
				config={{
					licenseKey: 'GPL',
					// extraPlugins: [uploadPlugin], //Will import again when need Media
					toolbar: schema?.toolbar
						? schema?.toolbar
						: EditorDefaultSchema,
					plugins: EditorDefaultPluginsSchema,
					...(locale === LANGUAGES?.ar?.abbreviation && {
						translations: coreTranslations,
						language: {
							ui: 'ar'
						}
					})
				}}
				data={value}
			></CKEditor>
			<Text c={LAYOUT_COLORS.DANGER_COLOR}>{error}</Text>
		</>
	);
}

export default JbEditorComponent;

Problem:
data is not assignable to type
IntrinsicAttributes & IntrinsicClassAttributes<CKEditor> & Readonly<Props>
Property data does not exist on type
IntrinsicAttributes & IntrinsicClassAttributes<CKEditor> & Readonly<Props>

Versions:
"@types/react": "19.0.2",
"@types/react-dom": "19.0.2"
"next": "15.1.3",
"@ckeditor/ckeditor5-react": "^9.4.0",
"ckeditor5": "^44.1.0",

[jonaldinger]

I'm getting the same error after upgrading to React v19. Has anybody figured out a solution or workaround?

[Witoso]

@Mati365 I think you tested that in the past. Any ideas?

[Mati365]

@Witoso I'll check that.

[Mati365]

Looks like Next.js struggles with resolving InferProps from prop-types within integration package. The problem is that it's already installed, and it works perfectly fine on Vite.

[jonaldinger]

Just wanted to follow up to confirm that the 9.5.0 release did solve my issue. Also note that I'm not using Next.js (just Vite + React 19), so the fix seems maybe even more broadly applicable than expected/intended 🙌. Thank you @Witoso and @Mati365!