Loading...
Loading...
Implement property value presets in Umbraco backoffice using official docs
npx skill4agent add umbraco/umbraco-cms-backoffice-skills umbraco-property-value-presetweightimport type { ManifestPropertyValuePreset } from '@umbraco-cms/backoffice/extension-registry';
const manifest: ManifestPropertyValuePreset = {
type: 'propertyValuePreset',
alias: 'My.PropertyValuePreset.DefaultText',
name: 'Default Text Preset',
api: () => import('./default-text-preset.js'),
forPropertyEditorUiAlias: 'Umb.PropertyEditorUi.TextBox',
};
export const manifests = [manifest];import type { UmbPropertyValuePresetApi } from '@umbraco-cms/backoffice/property';
export class DefaultTextPreset implements UmbPropertyValuePresetApi {
async processValue(value: unknown, config: unknown): Promise<unknown> {
// Return default if no value exists
return value ? value : 'Default text value';
}
destroy() {
// Cleanup if needed
}
}
export default DefaultTextPreset;import type { UmbPropertyValuePresetApi, UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property';
export class DynamicPreset implements UmbPropertyValuePresetApi {
async processValue(value: unknown, config: UmbPropertyEditorConfigCollection): Promise<unknown> {
if (value) return value;
// Use configuration to determine default
const defaultFromConfig = config?.getValueByAlias('defaultValue');
return defaultFromConfig || 'Fallback default';
}
destroy() {}
}
export default DynamicPreset;import type { UmbPropertyValuePresetApi } from '@umbraco-cms/backoffice/property';
export class ApiPreset implements UmbPropertyValuePresetApi {
async processValue(value: unknown, config: unknown): Promise<unknown> {
if (value) return value;
// Fetch default from server
const response = await fetch('/api/defaults/text');
const data = await response.json();
return data.defaultValue;
}
destroy() {}
}
export default ApiPreset;const manifest: ManifestPropertyValuePreset = {
type: 'propertyValuePreset',
alias: 'My.PropertyValuePreset.JsonDefault',
name: 'JSON Default Preset',
api: () => import('./json-preset.js'),
forPropertyEditorSchemaAlias: 'Umbraco.Plain.Json', // Target schema instead of UI
};// First preset (runs first due to lower weight)
const basePreset: ManifestPropertyValuePreset = {
type: 'propertyValuePreset',
alias: 'My.PropertyValuePreset.Base',
name: 'Base Preset',
weight: 100,
api: () => import('./base-preset.js'),
forPropertyEditorUiAlias: 'Umb.PropertyEditorUi.TextBox',
};
// Second preset (runs after, can modify base value)
const enhancedPreset: ManifestPropertyValuePreset = {
type: 'propertyValuePreset',
alias: 'My.PropertyValuePreset.Enhanced',
name: 'Enhanced Preset',
weight: 200,
api: () => import('./enhanced-preset.js'),
forPropertyEditorUiAlias: 'Umb.PropertyEditorUi.TextBox',
};export class TodayDatePreset implements UmbPropertyValuePresetApi {
async processValue(value: unknown, config: unknown): Promise<unknown> {
if (value) return value;
return new Date().toISOString().split('T')[0]; // Today's date
}
destroy() {}
}
export default TodayDatePreset;