feat: publish Angular Elements for all components

[Suresh918]

Please describe the feature you would like to request.

Implement custom components using angular elements for angular material components

What is the use-case or motivation for this proposal?

If custom components implemented, we can use them in any application irrespective of the frame work (i.e. outside angular as well)

Is there anything else we should know?

[andrewseguin]

We've looked into using Angular Elements for our Material components and found that if we want to do this, we'll need to reconsider the API since we heavily rely on content projection for our components.

Here's an example of what it would look like if we went this route:
https://stackblitz.com/edit/angular-ronyna?file=src%2Findex.html

The concept of packaging the components as elements is very exciting since it opens the library up to all users, but it will likely mean supporting an alternative and more restrictive set of APIs for each component.

[manuelreina]

Hi @andrewseguin, I have a question but I am not sure if it makes much sense.
Has it ever been considered to use slots for content projection with Shadow DOM v1?

[klemenoslaj]

Has it ever been considered to use slots for content projection with Shadow DOM v1?

Slots cannot be lazy rendered as far as I know. So, the component is rendered and connected right away. Sometimes material supports lazy rendering of templates due to performance reasons.

[manuelreina]

Has it ever been considered to use slots for content projection with Shadow DOM v1?

Slots cannot be lazy rendered as far as I know. So, the component is rendered and connected right away. Sometimes material supports lazy rendering of templates due to performance reasons.

Understood thanks.
Regarding a microfrontend approach, it would be nice to load material custom elements on demand.

[angular-robot]

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

[greghopkins]

pretty please! 👍

[fjcasternao]

👍

[julio393]

👍

[FMaccarelli]

👍