Type 'X' is not assignable to type 'X'

Question

I have an app with refine.dev and craft.js, I'm converting files from jsx to tsx and I have this error that I don't understand.

Here is the component :

import { Button, Image, Text } from "@shared/components/atoms/components";
import { ColumnRules, Container, FourCol, OneCol, ThreeCol, TwoCol } from "@shared/components/layout/components";

interface BuilderProps {
  onBuilderStatePersist: (value: string) => void;
  initialBuilderState: { buildState: string };
}

export const Builder = ({ onBuilderStatePersist, initialBuilderState }: BuilderProps) => {
  [...]

  return (
    <div style={{ margin: "0 auto", width: "100%", position: "relative" }}>
      <Editor
        resolver={{
          // my components
        }}
      >
          <Grid item xs>
            <Frame data={builderStateRef.current}>
              <Element is={Container} padding={5} background="#eee" canvas />
            </Frame>
          </Grid>
        </Grid>
      </Editor>
    </div>
  );
};

in "is={Container}", "is" is underlined in red and says :

Type '({ background, padding, children, ...props }: ContainerProps) => JSX.Element' is not assignable to type '(({ background, padding, children, ...props }: ContainerProps) => Element) & string'. Type '({ background, padding, children, ...props }: ContainerProps) => JSX.Element' is not assignable to type 'string'.ts(2322) Element.d.ts(15, 5): The expected type comes from property 'is' which is declared here on type 'IntrinsicAttributes & { id?: string | undefined; is?: (({ background, padding, children, ...props }: ContainerProps) => Element) | undefined; custom?: Record<string, any> | undefined; children?: ReactNode; canvas?: boolean | undefined; } & ContainerProps' (property) is?: ((({ background, padding, children, ...props }: ContainerProps) => JSX.Element) & string) | undefined

Here is the Container.tsx :

import { HTMLAttributes, ReactNode } from "react";
import { useNode } from "@craftjs/core";
import { Paper } from "@mui/material";

interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
  id: string;
  background?: string;
  backgroundColor?: string;
  borderRadius?: string;
  padding?: number;
  children?: ReactNode;
}

export const Container = ({ background, padding = 0, children, ...props }: ContainerProps) => {
  const {
    connectors: { connect, drag },
  } = useNode();
  return (
    <Paper
      {...props}
      ref={(ref) => ref && connect(drag(ref!))}
      style={{ margin: "5px 0", background, padding: `${padding}px` }}
    >
      {children}
    </Paper>
  );
};

Can someone explain to me why is this error popping up ?

Thank you for your time