@umbraco-cms/backoffice 14.0.0--preview007-06765466 → 14.0.0--preview007-63654dfd

package/dist-cms/custom-elements.json

@@ -9290,11 +9290,6 @@
           "name": "value",
           "type": "string",
           "default": "\"\""
-        },
-        {
-          "name": "hidePartialView",
-          "type": "boolean",
-          "default": "false"
         }
       ],
       "properties": [
@@ -9304,12 +9299,6 @@
           "type": "string",
           "default": "\"\""
         },
-        {
-          "name": "hidePartialView",
-          "attribute": "hidePartialView",
-          "type": "boolean",
-          "default": "false"
-        },
         {
           "name": "styles",
           "type": "array",
@@ -9334,122 +9323,13 @@
       ]
     },
     {
-      "name": "umb-insert-section-checkbox",
-      "path": "./../src/packages/templating/modals/templating-section-picker/templating-section-picker-input.element.ts",
-      "attributes": [
-        {
-          "name": "show-mandatory",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "show-input",
-          "type": "boolean",
-          "default": "false"
-        }
-      ],
+      "name": "umb-templating-page-field-builder-modal",
+      "path": "./../src/packages/templating/modals/templating-page-field-builder/templating-page-field-builder-modal.element.ts",
       "properties": [
-        {
-          "name": "showMandatory",
-          "attribute": "show-mandatory",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "showInput",
-          "attribute": "show-input",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "input"
-        },
-        {
-          "name": "form",
-          "type": "HTMLFormElement | undefined"
-        },
-        {
-          "name": "checkbox",
-          "type": "HTMLFormElement | undefined"
-        },
-        {
-          "name": "snippet",
-          "type": "string"
-        },
-        {
-          "name": "snippetMethod",
-          "type": "((value: string, isMandatory: boolean) => string) | undefined"
-        },
-        {
-          "name": "inputValue"
-        },
-        {
-          "name": "isMandatory"
-        },
         {
           "name": "styles",
           "type": "array",
-          "default": "[null,\"UmbTextStyles\",null]"
-        }
-      ]
-    },
-    {
-      "name": "umb-insert-section-input",
-      "path": "./../src/packages/templating/modals/templating-section-picker/templating-section-picker-input.element.ts",
-      "attributes": [
-        {
-          "name": "show-mandatory",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "show-input",
-          "type": "boolean",
-          "default": "false"
-        }
-      ],
-      "properties": [
-        {
-          "name": "showMandatory",
-          "attribute": "show-mandatory",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "showInput",
-          "attribute": "show-input",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "input"
-        },
-        {
-          "name": "form",
-          "type": "HTMLFormElement | undefined"
-        },
-        {
-          "name": "checkbox",
-          "type": "HTMLFormElement | undefined"
-        },
-        {
-          "name": "snippet",
-          "type": "string"
-        },
-        {
-          "name": "snippetMethod",
-          "type": "((value: string, isMandatory: boolean) => string) | undefined"
-        },
-        {
-          "name": "inputValue"
-        },
-        {
-          "name": "isMandatory"
-        },
-        {
-          "name": "styles",
-          "type": "array",
-          "default": "[null,\"UmbTextStyles\",null]"
+          "default": "[\"UmbTextStyles\",null]"
         }
       ]
     },
@@ -9457,24 +9337,6 @@
       "name": "umb-templating-section-picker-modal",
       "path": "./../src/packages/templating/modals/templating-section-picker/templating-section-picker-modal.element.ts",
       "properties": [
-        {
-          "name": "checkboxes",
-          "type": "NodeListOf<UmbInsertSectionCheckboxElement>"
-        },
-        {
-          "name": "selectedCheckbox",
-          "type": "UmbInsertSectionCheckboxElement | null | undefined"
-        },
-        {
-          "name": "snippet",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "snippetMethods",
-          "type": "((sectionName: string, isMandatory: boolean) => string)[]",
-          "default": "[\"getRenderBodySnippet\",\"getRenderSectionSnippet\",\"getAddSectionSnippet\"]"
-        },
         {
           "name": "styles",
           "type": "array",

package/dist-cms/packages/core/modal/token/dictionary-item-picker-modal.token.js

@@ -5,6 +5,7 @@ export const UMB_DICTIONARY_ITEM_PICKER_MODAL = new UmbModalToken('Umb.Modal.Tre
         size: 'small',
     },
     data: {
+        hideTreeRoot: true,
         treeAlias: 'Umb.Tree.Dictionary',
     },
 });

package/dist-cms/packages/templating/components/templating-item-menu/templating-item-menu.element.d.ts

@@ -6,7 +6,6 @@ export declare class UmbTemplatingInsertMenuElement extends UmbLitElement {
     private _modalContext?;
     constructor();
     determineInsertValue(modalValue: UmbTemplatingItemPickerModalValue): Promise<void>;
-    hidePartialView: boolean;
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
 }

package/dist-cms/packages/templating/components/templating-item-menu/templating-item-menu.element.js

@@ -9,14 +9,9 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
-var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-    if (kind === "m") throw new TypeError("Private method is not writable");
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-};
-var _UmbTemplatingInsertMenuElement_instances, _UmbTemplatingInsertMenuElement_openModal, _UmbTemplatingInsertMenuElement_dictionaryDetailRepository, _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet, _UmbTemplatingInsertMenuElement_getPartialViewSnippet, _UmbTemplatingInsertMenuElement_openChooseTypeModal, _UmbTemplatingInsertMenuElement_openInsertPageFieldSidebar, _UmbTemplatingInsertMenuElement_openInsertPartialViewSidebar, _UmbTemplatingInsertMenuElement_openInsertDictionaryItemModal, _UmbTemplatingInsertMenuElement_dispatchInsertEvent;
-import { UMB_PARTIAL_VIEW_PICKER_MODAL, } from '../../modals/partial-view-picker/partial-view-picker-modal.token.js';
+var _UmbTemplatingInsertMenuElement_instances, _UmbTemplatingInsertMenuElement_dictionaryDetailRepository, _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet, _UmbTemplatingInsertMenuElement_openTemplatingItemPickerModal, _UmbTemplatingInsertMenuElement_openPartialViewPickerModal, _UmbTemplatingInsertMenuElement_openDictionaryItemPickerModal, _UmbTemplatingInsertMenuElement_openPageFieldBuilderModal, _UmbTemplatingInsertMenuElement_dispatchInsertEvent;
+import { UMB_PARTIAL_VIEW_PICKER_MODAL } from '../../modals/partial-view-picker/partial-view-picker-modal.token.js';
+import { UMB_TEMPLATING_PAGE_FIELD_BUILDER_MODAL } from '../../modals/templating-page-field-builder/templating-page-field-builder-modal.token.js';
 import { CodeSnippetType } from '../../types.js';
 import { UMB_TEMPLATING_ITEM_PICKER_MODAL, } from '../../modals/templating-item-picker/templating-item-picker-modal.token.js';
 import { getInsertDictionarySnippet, getInsertPartialSnippet } from '../../utils/index.js';
@@ -30,29 +25,7 @@ let UmbTemplatingInsertMenuElement = class UmbTemplatingInsertMenuElement extend
         super();
         _UmbTemplatingInsertMenuElement_instances.add(this);
         this.value = '';
-        _UmbTemplatingInsertMenuElement_openModal.set(this, void 0);
         _UmbTemplatingInsertMenuElement_dictionaryDetailRepository.set(this, new UmbDictionaryDetailRepository(this));
-        _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet.set(this, async (modalValue) => {
-            const unique = modalValue.selection[0];
-            if (unique === null)
-                return;
-            const { data } = await __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_dictionaryDetailRepository, "f").requestByUnique(unique);
-            this.value = getInsertDictionarySnippet(data?.name ?? '');
-        });
-        _UmbTemplatingInsertMenuElement_getPartialViewSnippet.set(this, async (modalValue) => {
-            this.value = getInsertPartialSnippet(modalValue.selection?.[0] ?? '');
-        });
-        _UmbTemplatingInsertMenuElement_openChooseTypeModal.set(this, () => {
-            __classPrivateFieldSet(this, _UmbTemplatingInsertMenuElement_openModal, this._modalContext?.open(UMB_TEMPLATING_ITEM_PICKER_MODAL, {
-                data: {
-                    hidePartialViews: this.hidePartialView,
-                },
-            }), "f");
-            __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_openModal, "f")?.onSubmit().then((closedModal) => {
-                this.determineInsertValue(closedModal);
-            });
-        });
-        this.hidePartialView = false;
         this.consumeContext(UMB_MODAL_MANAGER_CONTEXT, (instance) => {
             this._modalContext = instance;
         });
@@ -61,11 +34,17 @@ let UmbTemplatingInsertMenuElement = class UmbTemplatingInsertMenuElement extend
         const { type, value } = modalValue;
         switch (type) {
             case CodeSnippetType.partialView: {
-                __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_getPartialViewSnippet, "f").call(this, value);
+                this.value = getInsertPartialSnippet(value);
+                __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
                 break;
             }
             case CodeSnippetType.dictionaryItem: {
-                await __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet, "f").call(this, value);
+                await __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet).call(this, value);
+                __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
+                break;
+            }
+            case CodeSnippetType.pageField: {
+                this.value = value;
                 __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
                 break;
             }
@@ -74,7 +53,10 @@ let UmbTemplatingInsertMenuElement = class UmbTemplatingInsertMenuElement extend
     render() {
         return html `
 			<uui-button-group>
-				<uui-button look="secondary" @click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_openChooseTypeModal, "f")} label=${this.localize.term('template_insert')}>
+				<uui-button
+					look="secondary"
+					@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openTemplatingItemPickerModal)}
+					label=${this.localize.term('template_insert')}>
 					<uui-icon name="icon-add"></uui-icon>${this.localize.term('template_insert')}
 				</uui-button>
 				<umb-dropdown
@@ -87,53 +69,65 @@ let UmbTemplatingInsertMenuElement = class UmbTemplatingInsertMenuElement extend
 						class="insert-menu-item"
 						label=${this.localize.term('template_insertPageField')}
 						title=${this.localize.term('template_insertPageField')}
-						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openInsertPageFieldSidebar)}></uui-menu-item>
+						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openPageFieldBuilderModal)}></uui-menu-item>
 					<uui-menu-item
 						class="insert-menu-item"
 						label=${this.localize.term('template_insertPartialView')}
 						title=${this.localize.term('template_insertPartialView')}
-						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openInsertPartialViewSidebar)}>
+						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openPartialViewPickerModal)}>
 					</uui-menu-item>
 					<uui-menu-item
 						class="insert-menu-item"
 						label=${this.localize.term('template_insertDictionaryItem')}
 						title=${this.localize.term('template_insertDictionaryItem')}
-						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openInsertDictionaryItemModal)}>
+						@click=${__classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_openDictionaryItemPickerModal)}>
 					</uui-menu-item>
 				</umb-dropdown>
 			</uui-button-group>
 		`;
     }
 };
-_UmbTemplatingInsertMenuElement_openModal = new WeakMap();
 _UmbTemplatingInsertMenuElement_dictionaryDetailRepository = new WeakMap();
-_UmbTemplatingInsertMenuElement_getDictionaryItemSnippet = new WeakMap();
-_UmbTemplatingInsertMenuElement_getPartialViewSnippet = new WeakMap();
-_UmbTemplatingInsertMenuElement_openChooseTypeModal = new WeakMap();
 _UmbTemplatingInsertMenuElement_instances = new WeakSet();
-_UmbTemplatingInsertMenuElement_openInsertPageFieldSidebar = function _UmbTemplatingInsertMenuElement_openInsertPageFieldSidebar() {
-    //this.#openModel = this._modalContext?.open();
+_UmbTemplatingInsertMenuElement_getDictionaryItemSnippet = async function _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet(unique) {
+    if (unique === null)
+        return;
+    const { data } = await __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_dictionaryDetailRepository, "f").requestByUnique(unique);
+    this.value = getInsertDictionarySnippet(data?.name ?? '');
 };
-_UmbTemplatingInsertMenuElement_openInsertPartialViewSidebar = function _UmbTemplatingInsertMenuElement_openInsertPartialViewSidebar() {
-    __classPrivateFieldSet(this, _UmbTemplatingInsertMenuElement_openModal, this._modalContext?.open(UMB_PARTIAL_VIEW_PICKER_MODAL), "f");
-    __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_openModal, "f")?.onSubmit().then((value) => {
-        __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_getPartialViewSnippet, "f").call(this, value).then(() => {
-            __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
-        });
-    });
+_UmbTemplatingInsertMenuElement_openTemplatingItemPickerModal = async function _UmbTemplatingInsertMenuElement_openTemplatingItemPickerModal() {
+    const itemPickerContext = this._modalContext?.open(UMB_TEMPLATING_ITEM_PICKER_MODAL);
+    await itemPickerContext?.onSubmit();
+    const value = itemPickerContext?.getValue();
+    if (!value)
+        return;
+    this.determineInsertValue(value);
 };
-_UmbTemplatingInsertMenuElement_openInsertDictionaryItemModal = function _UmbTemplatingInsertMenuElement_openInsertDictionaryItemModal() {
-    __classPrivateFieldSet(this, _UmbTemplatingInsertMenuElement_openModal, this._modalContext?.open(UMB_DICTIONARY_ITEM_PICKER_MODAL, {
-        data: {
-            pickableFilter: (item) => item.unique !== null,
-            hideTreeRoot: true,
-        },
-    }), "f");
-    __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_openModal, "f")?.onSubmit().then((value) => {
-        __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_getDictionaryItemSnippet, "f").call(this, value).then(() => {
-            __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
-        });
-    });
+_UmbTemplatingInsertMenuElement_openPartialViewPickerModal = async function _UmbTemplatingInsertMenuElement_openPartialViewPickerModal() {
+    const partialViewPickerContext = this._modalContext?.open(UMB_PARTIAL_VIEW_PICKER_MODAL);
+    await partialViewPickerContext?.onSubmit();
+    const path = partialViewPickerContext?.getValue().selection[0];
+    if (!path)
+        return;
+    this.determineInsertValue({ type: CodeSnippetType.partialView, value: path });
+};
+_UmbTemplatingInsertMenuElement_openDictionaryItemPickerModal = async function _UmbTemplatingInsertMenuElement_openDictionaryItemPickerModal() {
+    const dictionaryItemPickerContext = this._modalContext?.open(UMB_DICTIONARY_ITEM_PICKER_MODAL);
+    await dictionaryItemPickerContext?.onSubmit();
+    const item = dictionaryItemPickerContext?.getValue().selection[0];
+    if (!item)
+        return;
+    this.determineInsertValue({ type: CodeSnippetType.dictionaryItem, value: item });
+};
+_UmbTemplatingInsertMenuElement_openPageFieldBuilderModal = async function _UmbTemplatingInsertMenuElement_openPageFieldBuilderModal() {
+    const pageFieldBuilderContext = this._modalContext?.open(UMB_TEMPLATING_PAGE_FIELD_BUILDER_MODAL);
+    await pageFieldBuilderContext?.onSubmit();
+    const output = pageFieldBuilderContext?.getValue().output;
+    if (!output)
+        return;
+    // The output is already built due to the preview in the modal. Can insert it directly now.
+    this.value = output;
+    __classPrivateFieldGet(this, _UmbTemplatingInsertMenuElement_instances, "m", _UmbTemplatingInsertMenuElement_dispatchInsertEvent).call(this);
 };
 _UmbTemplatingInsertMenuElement_dispatchInsertEvent = function _UmbTemplatingInsertMenuElement_dispatchInsertEvent() {
     this.dispatchEvent(new CustomEvent('insert', { bubbles: false, cancelable: true, composed: false }));
@@ -157,9 +151,6 @@ UmbTemplatingInsertMenuElement.styles = [
 __decorate([
     property()
 ], UmbTemplatingInsertMenuElement.prototype, "value", void 0);
-__decorate([
-    property({ type: Boolean })
-], UmbTemplatingInsertMenuElement.prototype, "hidePartialView", void 0);
 UmbTemplatingInsertMenuElement = __decorate([
     customElement('umb-templating-insert-menu')
 ], UmbTemplatingInsertMenuElement);

package/dist-cms/packages/templating/modals/index.d.ts

@@ -1,3 +1,4 @@
 export * from './templating-section-picker/index.js';
 export * from './templating-item-picker/index.js';
 export * from './partial-view-picker/index.js';
+export * from './templating-page-field-builder/index.js';

package/dist-cms/packages/templating/modals/index.js

@@ -1,3 +1,4 @@
 export * from './templating-section-picker/index.js';
 export * from './templating-item-picker/index.js';
 export * from './partial-view-picker/index.js';
+export * from './templating-page-field-builder/index.js';

package/dist-cms/packages/templating/modals/manifests.js

@@ -11,5 +11,11 @@ const modals = [
         name: 'Templating Section Picker Modal',
         js: () => import('./templating-section-picker/templating-section-picker-modal.element.js'),
     },
+    {
+        type: 'modal',
+        alias: 'Umb.Modal.TemplatingPageFieldBuilder',
+        name: 'Templating Page Field Builder Modal',
+        js: () => import('./templating-page-field-builder/templating-page-field-builder-modal.element.js'),
+    },
 ];
 export const manifests = [...modals];

package/dist-cms/packages/templating/modals/templating-item-picker/templating-item-picker-modal.element.d.ts

@@ -3,7 +3,7 @@ import { UmbModalBaseElement } from '../../../core/modal/index.js';
 export declare class UmbTemplatingItemPickerModalElement extends UmbModalBaseElement<UmbTemplatingItemPickerModalData, UmbTemplatingItemPickerModalValue> {
     #private;
     private _close;
-    private _modalContext?;
+    private _itemModalContext?;
     constructor();
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];

package/dist-cms/packages/templating/modals/templating-item-picker/templating-item-picker-modal.element.js

@@ -4,20 +4,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-    if (kind === "m") throw new TypeError("Private method is not writable");
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-};
 var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
     if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
-var _UmbTemplatingItemPickerModalElement_instances, _UmbTemplatingItemPickerModalElement_openModal, _UmbTemplatingItemPickerModalElement_openInsertPartialViewSidebar, _UmbTemplatingItemPickerModalElement_openInsertDictionaryItemModal, _UmbTemplatingItemPickerModalElement_renderItems;
+var _UmbTemplatingItemPickerModalElement_instances, _UmbTemplatingItemPickerModalElement_openTemplatingPageFieldModal, _UmbTemplatingItemPickerModalElement_openPartialViewPickerModal, _UmbTemplatingItemPickerModalElement_openDictionaryItemPickerModal, _UmbTemplatingItemPickerModalElement_renderItems;
 import { CodeSnippetType } from '../../types.js';
 import { UMB_PARTIAL_VIEW_PICKER_MODAL } from '../partial-view-picker/partial-view-picker-modal.token.js';
+import { UMB_TEMPLATING_PAGE_FIELD_BUILDER_MODAL } from '../templating-page-field-builder/templating-page-field-builder-modal.token.js';
 import { UmbTextStyles } from '../../../../shared/style/index.js';
 import { css, html, customElement } from '../../../../external/lit/index.js';
 import { UMB_MODAL_MANAGER_CONTEXT, UMB_DICTIONARY_ITEM_PICKER_MODAL, UmbModalBaseElement, } from '../../../core/modal/index.js';
@@ -28,9 +23,8 @@ let UmbTemplatingItemPickerModalElement = class UmbTemplatingItemPickerModalElem
     constructor() {
         super();
         _UmbTemplatingItemPickerModalElement_instances.add(this);
-        _UmbTemplatingItemPickerModalElement_openModal.set(this, void 0);
         this.consumeContext(UMB_MODAL_MANAGER_CONTEXT, (instance) => {
-            this._modalContext = instance;
+            this._itemModalContext = instance;
         });
     }
     render() {
@@ -46,41 +40,50 @@ let UmbTemplatingItemPickerModalElement = class UmbTemplatingItemPickerModalElem
 		`;
     }
 };
-_UmbTemplatingItemPickerModalElement_openModal = new WeakMap();
 _UmbTemplatingItemPickerModalElement_instances = new WeakSet();
-_UmbTemplatingItemPickerModalElement_openInsertPartialViewSidebar = function _UmbTemplatingItemPickerModalElement_openInsertPartialViewSidebar() {
-    __classPrivateFieldSet(this, _UmbTemplatingItemPickerModalElement_openModal, this._modalContext?.open(UMB_PARTIAL_VIEW_PICKER_MODAL), "f");
-    __classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_openModal, "f")?.onSubmit().then((partialViewPickerModalValue) => {
-        if (partialViewPickerModalValue) {
-            this.value = {
-                type: CodeSnippetType.partialView,
-                value: partialViewPickerModalValue.selection[0],
-            };
-            this.modalContext?.submit();
-        }
-    });
+_UmbTemplatingItemPickerModalElement_openTemplatingPageFieldModal = async function _UmbTemplatingItemPickerModalElement_openTemplatingPageFieldModal() {
+    const pageFieldBuilderContext = this._itemModalContext?.open(UMB_TEMPLATING_PAGE_FIELD_BUILDER_MODAL);
+    await pageFieldBuilderContext?.onSubmit();
+    const output = pageFieldBuilderContext?.getValue().output;
+    if (output) {
+        this.value = { value: output, type: CodeSnippetType.pageField };
+        this.modalContext?.submit();
+    }
 };
-_UmbTemplatingItemPickerModalElement_openInsertDictionaryItemModal = function _UmbTemplatingItemPickerModalElement_openInsertDictionaryItemModal() {
-    __classPrivateFieldSet(this, _UmbTemplatingItemPickerModalElement_openModal, this._modalContext?.open(UMB_DICTIONARY_ITEM_PICKER_MODAL, {
+_UmbTemplatingItemPickerModalElement_openPartialViewPickerModal = async function _UmbTemplatingItemPickerModalElement_openPartialViewPickerModal() {
+    const partialViewPickerContext = this._itemModalContext?.open(UMB_PARTIAL_VIEW_PICKER_MODAL);
+    await partialViewPickerContext?.onSubmit();
+    const path = partialViewPickerContext?.getValue().selection[0];
+    if (path) {
+        const regex = /^%2F|%25dot%25cshtml$/g;
+        const prettyPath = path.replace(regex, '').replace(/%2F/g, '/');
+        this.value = {
+            value: prettyPath,
+            type: CodeSnippetType.partialView,
+        };
+        this.modalContext?.submit();
+    }
+};
+_UmbTemplatingItemPickerModalElement_openDictionaryItemPickerModal = async function _UmbTemplatingItemPickerModalElement_openDictionaryItemPickerModal() {
+    const dictionaryItemPickerModal = this._itemModalContext?.open(UMB_DICTIONARY_ITEM_PICKER_MODAL, {
         data: {
-            hideTreeRoot: true,
             pickableFilter: (item) => item.unique !== null,
         },
-    }), "f");
-    __classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_openModal, "f")?.onSubmit().then((dictionaryItemPickerModalValue) => {
-        if (dictionaryItemPickerModalValue) {
-            this.value = { value: dictionaryItemPickerModalValue, type: CodeSnippetType.dictionaryItem };
-            this.modalContext?.submit();
-        }
     });
+    await dictionaryItemPickerModal?.onSubmit();
+    const dictionaryItem = dictionaryItemPickerModal?.getValue().selection[0];
+    if (dictionaryItem) {
+        this.value = { value: dictionaryItem, type: CodeSnippetType.dictionaryItem };
+        this.modalContext?.submit();
+    }
 };
 _UmbTemplatingItemPickerModalElement_renderItems = function _UmbTemplatingItemPickerModalElement_renderItems() {
     return html `<div id="main">
 			<uui-button
-				@click=${() => console.log('to be continued')}
+				@click=${__classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_instances, "m", _UmbTemplatingItemPickerModalElement_openTemplatingPageFieldModal)}
 				look="placeholder"
 				label=${this.localize.term('template_insert')}>
-				<h3><umb-localize key="template_insertPageField">Value</umb-localize> (Not implemented)</h3>
+				<h3><umb-localize key="template_insertPageField">Value</umb-localize></h3>
 				<p>
 					<umb-localize key="template_insertPageFieldDesc">
 						Displays the value of a named field from the current page, with options to modify the value or fallback to
@@ -89,7 +92,7 @@ _UmbTemplatingItemPickerModalElement_renderItems = function _UmbTemplatingItemPi
 				</p>
 			</uui-button>
 			<uui-button
-				@click=${__classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_instances, "m", _UmbTemplatingItemPickerModalElement_openInsertPartialViewSidebar)}
+				@click=${__classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_instances, "m", _UmbTemplatingItemPickerModalElement_openPartialViewPickerModal)}
 				look="placeholder"
 				label=${this.localize.term('template_insert')}>
 				<h3><umb-localize key="template_insertPartialView">Partial view</umb-localize></h3>
@@ -101,7 +104,7 @@ _UmbTemplatingItemPickerModalElement_renderItems = function _UmbTemplatingItemPi
 				</p>
 			</uui-button>
 			<uui-button
-				@click=${__classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_instances, "m", _UmbTemplatingItemPickerModalElement_openInsertDictionaryItemModal)}
+				@click=${__classPrivateFieldGet(this, _UmbTemplatingItemPickerModalElement_instances, "m", _UmbTemplatingItemPickerModalElement_openDictionaryItemPickerModal)}
 				look="placeholder"
 				label=${this.localize.term('template_insertDictionaryItem')}>
 				<h3><umb-localize key="template_insertDictionaryItem">Dictionary Item</umb-localize></h3>

package/dist-cms/packages/templating/modals/templating-item-picker/templating-item-picker-modal.token.d.ts

@@ -1,10 +1,10 @@
 import type { CodeSnippetType } from '../../types.js';
-import { type UmbDictionaryItemPickerModalValue, UmbModalToken } from '../../../core/modal/index.js';
+import { UmbModalToken } from '../../../core/modal/index.js';
 export interface UmbTemplatingItemPickerModalData {
     hidePartialViews?: boolean;
 }
 export type UmbTemplatingItemPickerModalValue = {
-    value: string | UmbDictionaryItemPickerModalValue;
+    value: string;
     type: CodeSnippetType;
 };
 export declare const UMB_TEMPLATING_ITEM_PICKER_MODAL: UmbModalToken<UmbTemplatingItemPickerModalData, UmbTemplatingItemPickerModalValue>;

package/dist-cms/packages/templating/modals/templating-page-field-builder/index.d.ts

@@ -0,0 +1,2 @@
+export * from './templating-page-field-builder-modal.element.js';
+export * from './templating-page-field-builder-modal.token.js';

package/dist-cms/packages/templating/modals/templating-page-field-builder/index.js

@@ -0,0 +1,2 @@
+export * from './templating-page-field-builder-modal.element.js';
+export * from './templating-page-field-builder-modal.token.js';

package/dist-cms/packages/templating/modals/templating-page-field-builder/templating-page-field-builder-modal.element.d.ts

@@ -0,0 +1,19 @@
+import type { UmbTemplatingPageFieldBuilderModalData, UmbTemplatingPageFieldBuilderModalValue } from './templating-page-field-builder-modal.token.js';
+import { UmbModalBaseElement } from '../../../core/modal/index.js';
+export declare class UmbTemplatingPageFieldBuilderModalElement extends UmbModalBaseElement<UmbTemplatingPageFieldBuilderModalData, UmbTemplatingPageFieldBuilderModalValue> {
+    private _close;
+    private _submit;
+    private _field?;
+    private _haveDefault;
+    private _default?;
+    private _recursive;
+    /** TODO: Implement "Choose field" */
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("@lit/reactive-element/css-tag.js").CSSResult[];
+}
+export default UmbTemplatingPageFieldBuilderModalElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-templating-page-field-builder-modal': UmbTemplatingPageFieldBuilderModalElement;
+    }
+}