[Dialog] Typing error when trying to pass component to PaperProps of Dialog

[jussirantala]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

You can't set component prop in PaperProps without TS errors even though the prop exists in Paper component.

Expected behavior 🤔

You should be able to set all Paper component props in PaperProps prop of Dialog.

Steps to reproduce 🕹

Steps:

Write the following code and see the TS errors on the latter.

<Paper component={"form"} onSubmit={handleSubmit} />
<Dialog
  PaperProps={{
    component: "form",
    onSubmit: handleSubmit,
  }}
/>

Context 🔦

I am trying to use the Dialog as a form by changing Paper component into form. I cannot just wrap the whole Dialog with form because I have portal enabled for the Dialog.

Your environment 🌎

`tsconfig.json`

``` { "extends": "../tsconfig.base.json", "compilerOptions": { "rootDir": "..", "baseUrl": ".", "composite": false, "declaration": false, "declarationMap": false, "sourceMap": false, } } ```

[jussirantala]

Maybe related? #27703

[hbjORbj]

@jussirantala

You are correct. This and #27703 have the same root problem, which is that the interface PaperProps doesn't have component as a key.

I opened a pull request for the fix here: #32404