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

[docs][TypeScript] Add examples of how to extend types from MUI components #44493

Open
CzarOfScripts opened this issue Nov 21, 2024 · 0 comments
Assignees
Labels
support: docs-feedback Feedback from documentation page typescript

Comments

@CzarOfScripts
Copy link

CzarOfScripts commented Nov 21, 2024

Related page

https://mui.com/material-ui/

Kind of issue

Other

Issue description

Let me start by saying that I am using a translator and I hope my message will be understood.
I have always had problems with creating custom components based on MUI components. The problem is the typing of such components.
List of examples I would like to see:

  1. Typing of components that have component props.
    • I don't understand how to take all the props of let's say Box component, add some of my own (mandatory and non-mandatory) props to them. And to add props from component when specifying component.
  2. Typing of components that have variant in their generics (for example, if we take TextFieldProps).
  3. Typing of more complex components such as Button.
  4. How to type it all if we need to wrap everything in forwardRef.
    • How to define the element type for ref (HTMLDivElement, HTMLButtonElement, etc.).
    • It's also worth considering this type if a component is passed in component.
  5. Also for all this I would like to see an example where we remove some props from the component and/or replace them with our own. For example in a Chip component I would like to be able to pass children and they would be placed in the props label, with the props label itself removed from the typing props (I don't know how to explain it).

(Important: The point is not to change the theme of some component, but to add your logic to it.)

If you could add a new page and/or to the component page examples of how to create a component based on that component - that would be awesome.

I realize it would take a lot of time to add this to the documentation, so I would like to see these examples under my Issue.

Thank you for your work and efforts!

Context

No response

Search keywords: no

@CzarOfScripts CzarOfScripts added status: waiting for maintainer These issues haven't been looked at yet by a maintainer support: docs-feedback Feedback from documentation page labels Nov 21, 2024
@siriwatknp siriwatknp changed the title [docs] Creating your own components based on MUI components [TypeScript] How to extend types from MUI components Nov 21, 2024
@siriwatknp siriwatknp added typescript and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Nov 21, 2024
@DiegoAndai DiegoAndai changed the title [TypeScript] How to extend types from MUI components [docs][TypeScript] Add examples of how to extend types from MUI components Nov 21, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
support: docs-feedback Feedback from documentation page typescript
Projects
None yet
Development

No branches or pull requests

3 participants