Getting Error while trying in new react ts project on standard layout #236
Unanswered
mayankfancraze
asked this question in
Q&A
Replies: 1 comment
-
Need suggestion on what i am doing wrong here ? |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Getting this Error while trying to run easy email on new react ts project Standard layout is not accepting EmailEditor as child element
TS2322: Type '{ children: Element; compact: boolean; categories: ({ label: string; active?: boolean | undefined; blocks: { type: string; payload?: any; title?: string | undefined; }[]; displayType?: "grid" | undefined; } | { ...; } | { ...; } | { ...; })[]; showSourceCode: true; }' is not assignable to type 'IntrinsicAttributes & ExtensionProps'.
Property 'children' does not exist on type 'IntrinsicAttributes & ExtensionProps'.
91 | {({ values }) => {
92 | return (
below is the code
`import React from "react";
import { BlockManager, BasicType, AdvancedType } from "easy-email-core";
import { EmailEditor, EmailEditorProvider } from "easy-email-editor";
import { ExtensionProps, StandardLayout } from "easy-email-extensions";
import { useWindowSize } from "react-use";
import "easy-email-editor/lib/style.css";
import "easy-email-extensions/lib/style.css";
const categories: ExtensionProps["categories"] = [
{
label: "Content",
active: true,
blocks: [
{
type: AdvancedType.TEXT,
},
{
type: AdvancedType.IMAGE,
payload: { attributes: { padding: "0px 0px 0px 0px" } },
},
{
type: AdvancedType.BUTTON,
},
{
type: AdvancedType.SOCIAL,
},
{
type: AdvancedType.DIVIDER,
},
{
type: AdvancedType.SPACER,
},
{
type: AdvancedType.HERO,
},
{
type: AdvancedType.WRAPPER,
},
],
},
{
label: "Layout",
active: true,
displayType: "column",
blocks: [
{
title: "2 columns",
payload: [
["50%", "50%"],
["33%", "67%"],
["67%", "33%"],
["25%", "75%"],
["75%", "25%"],
],
},
{
title: "3 columns",
payload: [
["33.33%", "33.33%", "33.33%"],
["25%", "25%", "50%"],
["50%", "25%", "25%"],
],
},
{
title: "4 columns",
payload: [[["25%", "25%", "25%", "25%"]]],
},
],
},
];
const initialValues = {
subject: "Welcome to Easy-email",
subTitle: "Nice to meet you!",
content: BlockManager.getBlockByType(BasicType.PAGE)!.create({}),
};
export default function App() {
const { width } = useWindowSize();
const smallScene = width < 1400;
return (
<EmailEditorProvider
data={initialValues}
height={"calc(100vh - 72px)"}
autoComplete
dashed={false}
>
{({ values }) => {
return (
);
}}
);
}
`
Beta Was this translation helpful? Give feedback.
All reactions