ReddRadar
Agent skill
umbraco-kinds
Implement kinds in Umbraco backoffice using official docs
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/umbraco-kinds
SKILL.md
Umbraco Kinds
What is it?
A Kind is a preset configuration that extensions inherit for consistency. It reduces redundancy by defining default properties that multiple extensions can share. Kinds ensure standardized structures across extensions and simplify definitions by providing predefined properties that extensions automatically inherit.
Documentation
Always fetch the latest docs before implementing:
- Main docs: https://docs.umbraco.com/umbraco-cms/customizing/extending-overview/extension-types/kind
- Foundation: https://docs.umbraco.com/umbraco-cms/customizing/foundation
- Extension Registry: https://docs.umbraco.com/umbraco-cms/customizing/extending-overview/extension-registry
Workflow
- Fetch docs - Use WebFetch on the URLs above
- Ask questions - What extension type? What default properties to share?
- Generate files - Create kind manifest + consuming extensions based on latest docs
- Explain - Show what was created and how to test
Minimal Examples
Registering a Kind
import type { UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-api';
export const customButtonKind: UmbExtensionManifestKind = {
type: 'kind',
alias: 'My.Kind.HeaderAppButton',
matchType: 'headerApp',
matchKind: 'button',
manifest: {
elementName: 'umb-header-app-button',
},
};
Using a Kind in an Extension
const manifest = {
type: 'headerApp',
kind: 'button', // Uses the 'button' kind
name: 'My Header App',
alias: 'My.HeaderApp',
meta: {
label: 'My App',
icon: 'icon-heart',
href: '/my-app',
},
};
Kind with Default Meta Properties
export const cardKind: UmbExtensionManifestKind = {
type: 'kind',
alias: 'My.Kind.DashboardCard',
matchType: 'dashboard',
matchKind: 'card',
manifest: {
elementName: 'my-dashboard-card',
meta: {
// Default meta properties
size: 'medium',
color: 'default',
},
},
};
// Extension inherits defaults, can override
const dashboard = {
type: 'dashboard',
kind: 'card',
alias: 'My.Dashboard',
name: 'My Dashboard',
meta: {
label: 'Stats',
pathname: 'stats',
// size and color inherited from kind
},
};
That's it! Always fetch fresh docs, keep examples minimal, generate complete working code.
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?