umbraco-modals

Implement Umbraco backoffice modals with type-safe tokens and manifests.

4|Updated Mar 6, 2026
One-click install
npx skills add https://github.com/albanistrefi/umbraco_CLI --skill umbraco-modals-albanistrefi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: umbraco-modals
Source: https://github.com/albanistrefi/umbraco_CLI/tree/main/skills/extensions/umbraco-modals
Command: npx skills add https://github.com/albanistrefi/umbraco_CLI --skill umbraco-modals-albanistrefi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you implement Umbraco backoffice modal extensions correctly by following the official Modals extension-type documentation, so your dialogs and sidebars behave reliably and can exchange data safely.

Core Features & Use Cases

  • Type-safe modal tokens with data/value flow: Define a token that carries input data and returns a typed value when the user confirms or submits.
  • Modal extension elements: Create a Lit-based modal element that consumes modal manager context, renders UI, and submits results back to the opener.
  • Manifest registration: Register modal aliases to enable runtime discovery and opening by token, supporting both dialogs and sidebars.
  • Deep-link capable (routed) modals: Implement modals that can be opened via routes for shareable/backoffice navigation.

Quick Start

Fetch the latest Umbraco modal docs, then implement a modal token, modal element, and manifest that register your modal alias and demonstrate opening it via the Modal Manager Context.

Frequently Asked Questions about umbraco-modals

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create type-safe modals in the Umbraco backoffice?

Umbraco backoffice modals use token-based communication to safely exchange data. You define a modal token carrying input data, implement a Lit element consuming the modal manager context, and register a manifest alias for runtime discovery and typed value submission.

Can I open Umbraco modals dynamically using the Modal Manager Context?

Yes, Umbraco modals support runtime opening via the Modal Manager Context. By defining a modal token and registering the alias in a manifest, you can dynamically trigger dialogs or sidebars and receive typed values back upon submission.

What is the best way to implement deep-link capable modals in Umbraco?

Deep-link capable Umbraco modals are implemented using the official Modals extension type with routed configurations. You register a modal alias in the manifest, allowing the dialog to be opened via specific routes for shareable backoffice navigation.

Do I need Lit to build Umbraco backoffice modal extensions?

Lit is used to create the modal extension element that consumes the modal manager context, renders the UI, and submits results back. You implement the element using Lit to ensure correct integration with the Umbraco backoffice extension type.

Why define modal tokens for Umbraco backoffice dialogs?

Modal tokens provide type-safe communication for Umbraco backoffice dialogs by carrying input data and returning a typed value upon confirmation. This ensures reliable data exchange between the opener and the modal element.