@umbraco-cms/backoffice 14.0.0--preview004-e91a3686 → 14.0.0--preview004-d4db8e54

package/dist-cms/assets/lang/da-dk.js

@@ -1064,6 +1064,8 @@ export default {
     },
     contentPicker: {
         allowedItemTypes: 'Du kan kun vælge følgende type(r) dokumenter: %0%',
+        defineDynamicRoot: 'Definer Dynamisk Udgangspunkt',
+        defineRootNode: 'Vælg udgangspunkt',
         pickedTrashedItem: 'Du har valgt et dokument som er slettet eller lagt i papirkurven',
         pickedTrashedItems: 'Du har valgt dokumenter som er slettede eller lagt i papirkurven',
     },

package/dist-cms/assets/lang/da-dk.ts

@@ -1151,6 +1151,8 @@ export default {
 	},
 	contentPicker: {
 		allowedItemTypes: 'Du kan kun vælge følgende type(r) dokumenter: %0%',
+		defineDynamicRoot: 'Definer Dynamisk Udgangspunkt',
+		defineRootNode: 'Vælg udgangspunkt',
 		pickedTrashedItem: 'Du har valgt et dokument som er slettet eller lagt i papirkurven',
 		pickedTrashedItems: 'Du har valgt dokumenter som er slettede eller lagt i papirkurven',
 	},

package/dist-cms/assets/lang/en-us.js

@@ -1059,6 +1059,8 @@ export default {
     },
     contentPicker: {
         allowedItemTypes: 'You can only select items of type(s): %0%',
+        defineDynamicRoot: 'Specify a Dynamic Root',
+        defineRootNode: 'Pick root node',
         pickedTrashedItem: 'You have picked a content item currently deleted or in the recycle bin',
         pickedTrashedItems: 'You have picked content items currently deleted or in the recycle bin',
     },

package/dist-cms/assets/lang/en-us.ts

@@ -1148,6 +1148,8 @@ export default {
 	},
 	contentPicker: {
 		allowedItemTypes: 'You can only select items of type(s): %0%',
+		defineDynamicRoot: 'Specify a Dynamic Root',
+		defineRootNode: 'Pick root node',
 		pickedTrashedItem: 'You have picked a content item currently deleted or in the recycle bin',
 		pickedTrashedItems: 'You have picked content items currently deleted or in the recycle bin',
 	},

package/dist-cms/custom-elements.json

@@ -1808,13 +1808,7 @@
         },
         {
           "name": "node-id",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "dynamic-path",
-          "type": "string",
-          "default": "\"\""
+          "type": "string | null | undefined"
         }
       ],
       "properties": [
@@ -1826,25 +1820,17 @@
         {
           "name": "nodeId",
           "attribute": "node-id",
-          "type": "string",
-          "default": "\"\""
+          "type": "string | null | undefined"
         },
         {
-          "name": "dynamicPath",
-          "attribute": "dynamic-path",
-          "type": "string",
-          "default": "\"\""
+          "name": "dynamicRoot",
+          "type": "DynamicRootType | null | undefined"
         },
         {
           "name": "styles",
           "type": "array",
           "default": "[null]"
         }
-      ],
-      "events": [
-        {
-          "name": "change"
-        }
       ]
     },
     {
@@ -6228,6 +6214,27 @@
         }
       ]
     },
+    {
+      "name": "umb-input-document-picker-root",
+      "path": "./../src/packages/documents/documents/components/input-document-picker-root/input-document-picker-root.element.ts",
+      "attributes": [
+        {
+          "name": "value",
+          "type": "string"
+        }
+      ],
+      "properties": [
+        {
+          "name": "nodeId",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "value",
+          "attribute": "value",
+          "type": "string"
+        }
+      ]
+    },
     {
       "name": "umb-input-document",
       "path": "./../src/packages/documents/documents/components/input-document/input-document.element.ts",

package/dist-cms/packages/core/components/input-start-node/input-start-node.element.d.ts

@@ -1,9 +1,17 @@
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 export type ContentType = 'content' | 'member' | 'media';
+export type DynamicRootQueryStepType = {
+    alias: string;
+    anyOfDocTypeKeys: Array<string>;
+};
+export type DynamicRootType = {
+    originAlias: string;
+    querySteps?: Array<DynamicRootQueryStepType> | null;
+};
 export type StartNode = {
     type?: ContentType;
     id?: string | null;
-    query?: string | null;
+    dynamicRoot?: DynamicRootType | null;
 };
 declare const UmbInputStartNodeElement_base: (new (...args: any[]) => import("../../../../external/uui/index.js").FormControlMixinInterface) & typeof UmbLitElement;
 export declare class UmbInputStartNodeElement extends UmbInputStartNodeElement_base {
@@ -12,8 +20,8 @@ export declare class UmbInputStartNodeElement extends UmbInputStartNodeElement_b
     private _type;
     set type(value: StartNode['type']);
     get type(): StartNode['type'];
-    nodeId: string;
-    dynamicPath: string;
+    nodeId?: string | null;
+    dynamicRoot?: DynamicRootType | null;
     _options: Array<Option>;
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("@lit/reactive-element/css-tag").CSSResult[];

package/dist-cms/packages/core/components/input-start-node/input-start-node.element.js

@@ -7,23 +7,23 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, customElement, property, css, state } from '../../../../external/lit/index.js';
 import { FormControlMixin } from '../../../../external/uui/index.js';
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
-import { UmbChangeEvent } from '../../event/index.js';
 let UmbInputStartNodeElement = class UmbInputStartNodeElement extends FormControlMixin(UmbLitElement) {
     constructor() {
         super(...arguments);
         this._type = 'content';
-        this.nodeId = '';
-        this.dynamicPath = '';
         this._options = [
             { value: 'content', name: 'Content' },
-            { value: 'member', name: 'Members' },
             { value: 'media', name: 'Media' },
+            { value: 'member', name: 'Members' },
         ];
     }
     getFormElement() {
         return undefined;
     }
     set type(value) {
+        if (value === undefined) {
+            value = this._type;
+        }
         const oldValue = this._type;
         this._options = this._options.map((option) => option.value === value ? { ...option, selected: true } : { ...option, selected: false });
         this._type = value;
@@ -33,15 +33,25 @@ let UmbInputStartNodeElement = class UmbInputStartNodeElement extends FormContro
         return this._type;
     }
     #onTypeChange(event) {
+        //console.log('onTypeChange');
         this.type = event.target.value;
-        // Clear others
         this.nodeId = '';
-        this.dynamicPath = '';
-        this.dispatchEvent(new UmbChangeEvent());
+        // TODO: Appears that the event gets bubbled up. Will need to review. [LK]
+        //this.dispatchEvent(new UmbChangeEvent());
     }
     #onIdChange(event) {
-        this.nodeId = event.target.selectedIds.join('');
-        this.dispatchEvent(new CustomEvent('change'));
+        //console.log('onIdChange', event.target);
+        switch (this.type) {
+            case 'content':
+                this.nodeId = event.target.nodeId;
+                break;
+            case 'media':
+                this.nodeId = event.target.selectedIds.join('');
+                break;
+            default:
+                break;
+        }
+        this.dispatchEvent(new CustomEvent(event.type));
     }
     render() {
         return html `<umb-input-dropdown-list
@@ -62,19 +72,19 @@ let UmbInputStartNodeElement = class UmbInputStartNodeElement extends FormContro
         }
     }
     #renderTypeContent() {
-        const nodeId = this.nodeId ? [this.nodeId] : [];
-        //TODO: Dynamic paths
-        return html ` <umb-input-document @change=${this.#onIdChange} .selectedIds=${nodeId} max="1"></umb-input-document> `;
+        return html `<umb-input-document-picker-root
+			@change=${this.#onIdChange}
+			.nodeId=${this.nodeId}></umb-input-document-picker-root>`;
     }
     #renderTypeMedia() {
         const nodeId = this.nodeId ? [this.nodeId] : [];
         //TODO => MediaTypes
-        return html ` <umb-input-media @change=${this.#onIdChange} .selectedIds=${nodeId} max="1"></umb-input-media> `;
+        return html `<umb-input-media @change=${this.#onIdChange} .selectedIds=${nodeId} max="1"></umb-input-media>`;
     }
     #renderTypeMember() {
         const nodeId = this.nodeId ? [this.nodeId] : [];
         //TODO => Members
-        return html ` <umb-input-member @change=${this.#onIdChange} .selectedIds=${nodeId} max="1"></umb-input-member> `;
+        return html `<umb-input-member @change=${this.#onIdChange} .selectedIds=${nodeId} max="1"></umb-input-member>`;
     }
     static { this.styles = [
         css `
@@ -93,8 +103,8 @@ __decorate([
     property({ attribute: 'node-id' })
 ], UmbInputStartNodeElement.prototype, "nodeId", void 0);
 __decorate([
-    property({ attribute: 'dynamic-path' })
-], UmbInputStartNodeElement.prototype, "dynamicPath", void 0);
+    property({ attribute: false })
+], UmbInputStartNodeElement.prototype, "dynamicRoot", void 0);
 __decorate([
     state()
 ], UmbInputStartNodeElement.prototype, "_options", void 0);

package/dist-cms/packages/core/property-editor/uis/tree-picker/config/start-node/property-editor-ui-tree-picker-start-node.element.js

@@ -16,13 +16,15 @@ let UmbPropertyEditorUITreePickerStartNodeElement = class UmbPropertyEditorUITre
         this.value = {
             type: target.type,
             id: target.nodeId,
-            // TODO: Please check this makes sense, Check if we want to support XPath in this version, if not then make sure we handle DynamicRoot correct.
-            query: target.dynamicPath,
+            dynamicRoot: target.dynamicRoot,
         };
         this.dispatchEvent(new CustomEvent('property-value-change'));
     }
     render() {
-        return html `<umb-input-start-node @change="${this.#onChange}" .type=${this.value?.type}></umb-input-start-node>`;
+        return html `<umb-input-start-node
+			@change=${this.#onChange}
+			.type=${this.value?.type}
+			.nodeId=${this.value?.id}></umb-input-start-node>`;
     }
     static { this.styles = [UmbTextStyles]; }
 };

package/dist-cms/packages/documents/documents/components/index.d.ts

@@ -1,2 +1,3 @@
 export * from './input-document/input-document.element.js';
 export * from './input-document-granular-permission/input-document-granular-permission.element.js';
+export * from './input-document-picker-root/input-document-picker-root.element.js';

package/dist-cms/packages/documents/documents/components/index.js

@@ -1,2 +1,3 @@
 export * from './input-document/input-document.element.js';
 export * from './input-document-granular-permission/input-document-granular-permission.element.js';
+export * from './input-document-picker-root/input-document-picker-root.element.js';

package/dist-cms/packages/documents/documents/components/input-document-picker-root/input-document-picker-root.element.d.ts

@@ -0,0 +1,19 @@
+import { UmbLitElement } from '../../../../../shared/lit-element/index.js';
+declare const UmbInputDocumentPickerRootElement_base: (new (...args: any[]) => import("../../../../../external/uui/index.js").FormControlMixinInterface) & typeof UmbLitElement;
+export declare class UmbInputDocumentPickerRootElement extends UmbInputDocumentPickerRootElement_base {
+    #private;
+    get nodeId(): string | null | undefined;
+    set nodeId(id: string | null | undefined);
+    set value(id: string);
+    private _items?;
+    constructor();
+    protected getFormElement(): undefined;
+    render(): import("lit-html").TemplateResult<1>;
+    private _renderItem;
+}
+export default UmbInputDocumentPickerRootElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'umb-input-document-picker-root': UmbInputDocumentPickerRootElement;
+    }
+}

package/dist-cms/packages/documents/documents/components/input-document-picker-root/input-document-picker-root.element.js

@@ -0,0 +1,93 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+};
+import { UmbDocumentPickerContext } from '../input-document/input-document.context.js';
+import { html, customElement, property, state, ifDefined, repeat } from '../../../../../external/lit/index.js';
+import { FormControlMixin } from '../../../../../external/uui/index.js';
+import { UmbLitElement } from '../../../../../shared/lit-element/index.js';
+let UmbInputDocumentPickerRootElement = class UmbInputDocumentPickerRootElement extends FormControlMixin(UmbLitElement) {
+    get nodeId() {
+        return this.#documentPickerContext.getSelection()[0];
+    }
+    set nodeId(id) {
+        const selection = id ? [id] : [];
+        this.#documentPickerContext.setSelection(selection);
+    }
+    set value(id) {
+        this.nodeId = id;
+    }
+    #documentPickerContext = new UmbDocumentPickerContext(this);
+    // TODO: DynamicRoot - once feature implemented, wire up context and picker UI. [LK]
+    #dynamicRootPickerContext = {
+        openPicker: () => {
+            throw new Error('DynamicRoot picker has not been implemented yet.');
+        },
+    };
+    constructor() {
+        super();
+        this.#documentPickerContext.max = 1;
+        this.observe(this.#documentPickerContext.selection, (selection) => (super.value = selection.join(',')));
+        this.observe(this.#documentPickerContext.selectedItems, (selectedItems) => (this._items = selectedItems));
+    }
+    getFormElement() {
+        return undefined;
+    }
+    render() {
+        return html `
+			${this._items
+            ? html ` <uui-ref-list
+						>${repeat(this._items, (item) => item.id, (item) => this._renderItem(item))}
+				  </uui-ref-list>`
+            : ''}
+			${this.#renderButtons()}
+		`;
+    }
+    #renderButtons() {
+        if (this.nodeId)
+            return;
+        //TODO: Dynamic paths
+        return html ` <uui-button-group>
+			<uui-button
+				look="placeholder"
+				@click=${() => this.#documentPickerContext.openPicker()}
+				label=${this.localize.term('contentPicker_defineRootNode')}></uui-button>
+			<uui-button
+				look="placeholder"
+				@click=${() => this.#dynamicRootPickerContext.openPicker()}
+				label=${this.localize.term('contentPicker_defineDynamicRoot')}></uui-button>
+		</uui-button-group>`;
+    }
+    _renderItem(item) {
+        if (!item.id)
+            return;
+        return html `
+			<uui-ref-node name=${ifDefined(item.name)} detail=${ifDefined(item.id)}>
+				<!-- TODO: implement is trashed <uui-tag size="s" slot="tag" color="danger">Trashed</uui-tag> -->
+				<uui-action-bar slot="actions">
+					<uui-button @click=${() => this.#documentPickerContext.openPicker()} label="Edit document ${item.name}"
+						>Edit</uui-button
+					>
+					<uui-button
+						@click=${() => this.#documentPickerContext.requestRemoveItem(item.id)}
+						label="Remove document ${item.name}"
+						>Remove</uui-button
+					>
+				</uui-action-bar>
+			</uui-ref-node>
+		`;
+    }
+};
+__decorate([
+    property()
+], UmbInputDocumentPickerRootElement.prototype, "value", null);
+__decorate([
+    state()
+], UmbInputDocumentPickerRootElement.prototype, "_items", void 0);
+UmbInputDocumentPickerRootElement = __decorate([
+    customElement('umb-input-document-picker-root')
+], UmbInputDocumentPickerRootElement);
+export { UmbInputDocumentPickerRootElement };
+export default UmbInputDocumentPickerRootElement;