Umbraco Element

What is it?

An Umbraco Element is a Web Component enhancement that simplifies integration with the Umbraco Backoffice through the UmbElementMixin. It provides methods to consume/provide contexts, observe states, handle localization, and host controllers. UmbElementMixin can be applied to any Web Component-compatible base class, while UmbLitElement is a convenience wrapper combining the mixin with Lit.

Documentation

Always fetch the latest docs before implementing:

• Main docs: https://docs.umbraco.com/umbraco-cms/customizing/foundation/umbraco-element
• Context API: https://docs.umbraco.com/umbraco-cms/customizing/foundation/context-api
• Controllers: https://docs.umbraco.com/umbraco-cms/customizing/foundation/umbraco-controller
• Localization: https://docs.umbraco.com/umbraco-cms/customizing/foundation/localization
• Foundation: https://docs.umbraco.com/umbraco-cms/customizing/foundation

Workflow

1. Fetch docs - Use WebFetch on the URLs above
2. Ask questions - Using Lit? Need contexts? Need localization? Which base class?
3. Generate files - Create element using UmbElementMixin or UmbLitElement based on latest docs