How does this skill ensure code accuracy?

The skill is configured to use WebFetch to retrieve the latest official Umbraco documentation before generating code, ensuring compliance with the most recent CMS updates.

What is an Umbraco Element?

An Umbraco Element is a Web Component enhanced with the UmbElementMixin, designed to integrate seamlessly with the Umbraco Backoffice framework for features like context sharing and localization.

Should I use UmbLitElement or UmbElementMixin?

Use UmbLitElement for components based on the Lit library. Use UmbElementMixin when you need to apply Umbraco features to a different base class or an existing UI library component.

Does this skill support state management?

Yes, it provides implementation patterns for the Umbraco observe method, allowing your components to reactively update when state changes occur in consumed contexts.

Umbraco Backoffice Element Creator

Name: Umbraco Backoffice Element Creator
Author: umbraco

byumbraco

•

コンテンツ管理

Streamlines the development of custom Umbraco Backoffice UI components using Web Components and the Umbraco Element API.

概要

This skill assists developers in creating specialized components for the Umbraco CMS Backoffice. It simplifies the implementation of the UmbElementMixin and UmbLitElement, allowing for seamless integration with Umbraco's Context API, localization features, and controller lifecycle. By automatically fetching the most recent documentation, the skill ensures that all generated elements follow official best practices for state management and UI consistency within the Umbraco ecosystem, making it ideal for building custom dashboards, property editors, and management tools.

主な機能

Seamless Context API integration for consuming and providing data
Integrated localization support for multi-language backoffice tools
Automated UmbElementMixin and UmbLitElement implementation
Real-time documentation fetching to ensure modern API compliance
1 GitHub stars
Reactive state observation using the built-in observe method

ユースケース

Extending third-party UI libraries with Umbraco-specific capabilities and controllers
Creating UI components that interact with Umbraco global notification contexts
Developing custom dashboards or property editors for Umbraco CMS

概要

主な機能

Seamless Context API integration for consuming and providing data
Integrated localization support for multi-language backoffice tools
Automated UmbElementMixin and UmbLitElement implementation
Real-time documentation fetching to ensure modern API compliance
1 GitHub stars
Reactive state observation using the built-in observe method

ユースケース

Extending third-party UI libraries with Umbraco-specific capabilities and controllers
Creating UI components that interact with Umbraco global notification contexts
Developing custom dashboards or property editors for Umbraco CMS