@umbraco-cms/backoffice 14.0.0-rc2 → 14.0.0-rc4

package/dist-cms/packages/multi-url-picker/multi-url-picker/multi-url-picker.element.js

@@ -0,0 +1,259 @@
+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 { UMB_LINK_PICKER_MODAL } from '../link-picker-modal/link-picker-modal.token.js';
+import { css, customElement, html, property, repeat, state } from '../../../external/lit/index.js';
+import { simpleHashCode } from '../../../libs/observable-api/index.js';
+import { UmbChangeEvent } from '../../core/event/index.js';
+import { UmbLitElement } from '../../core/lit-element/index.js';
+import { umbConfirmModal, UmbModalRouteRegistrationController } from '../../core/modal/index.js';
+import { UmbSorterController } from '../../core/sorter/index.js';
+import { UUIFormControlMixin } from '../../../external/uui/index.js';
+/**
+ * @element umb-input-multi-url
+ * @fires change - when the value of the input changes
+ * @fires blur - when the input loses focus
+ * @fires focus - when the input gains focus
+ */
+const elementName = 'umb-multi-url-picker';
+let UmbMultiUrlPickerElement = class UmbMultiUrlPickerElement extends UUIFormControlMixin(UmbLitElement, '') {
+    #sorter;
+    getFormElement() {
+        return undefined;
+    }
+    set alias(value) {
+        this.#linkPickerModal.setUniquePathValue('propertyAlias', value);
+    }
+    get alias() {
+        return this.#linkPickerModal.getUniquePathValue('propertyAlias');
+    }
+    set variantId(value) {
+        this.#linkPickerModal.setUniquePathValue('variantId', value?.toString());
+    }
+    get variantId() {
+        return this.#linkPickerModal.getUniquePathValue('variantId');
+    }
+    /**
+     * @type {Array<UmbLinkPickerLink>}
+     * @default []
+     */
+    set urls(data) {
+        data ??= [];
+        this.#urls = [...data]; // Unfreeze data coming from State, so we can manipulate it.
+        super.value = this.#urls.map((x) => x.url).join(',');
+        this.#sorter.setModel(this.#urls);
+    }
+    get urls() {
+        return this.#urls;
+    }
+    #urls;
+    #linkPickerModal;
+    constructor() {
+        super();
+        this.#sorter = new UmbSorterController(this, {
+            getUniqueOfElement: (element) => {
+                return element.id;
+            },
+            getUniqueOfModel: (modelEntry) => {
+                return this.#getUnique(modelEntry);
+            },
+            identifier: 'Umb.SorterIdentifier.InputMultiUrl',
+            itemSelector: 'uui-ref-node',
+            containerSelector: 'uui-ref-list',
+            onChange: ({ model }) => {
+                this.urls = model;
+                this.#dispatchChangeEvent();
+            },
+        });
+        /**
+         * Min validation message.
+         * @type {boolean}
+         * @attr
+         * @default
+         */
+        this.minMessage = 'This field needs more items';
+        /**
+         * Max validation message.
+         * @type {boolean}
+         * @attr
+         * @default
+         */
+        this.maxMessage = 'This field exceeds the allowed amount of items';
+        this.#urls = [];
+        this.addValidator('rangeUnderflow', () => this.minMessage, () => !!this.min && this.urls.length < this.min);
+        this.addValidator('rangeOverflow', () => this.maxMessage, () => !!this.max && this.urls.length > this.max);
+        this.#linkPickerModal = new UmbModalRouteRegistrationController(this, UMB_LINK_PICKER_MODAL)
+            .addAdditionalPath(`:index`)
+            .addUniquePaths(['propertyAlias', 'variantId'])
+            .onSetup((params) => {
+            // Get index:
+            const indexParam = params.index;
+            if (!indexParam)
+                return false;
+            let index = parseInt(params.index);
+            if (Number.isNaN(index))
+                return false;
+            // Use the index to find data:
+            let data = null;
+            if (index >= 0 && index < this.urls.length) {
+                data = this.#getItemByIndex(index);
+            }
+            else {
+                // If not then make a new pick:
+                index = null;
+            }
+            return {
+                modal: {
+                    size: this.overlaySize || 'small',
+                },
+                data: {
+                    index: index,
+                    config: {
+                        hideAnchor: this.hideAnchor,
+                    },
+                },
+                value: {
+                    link: {
+                        name: data?.name,
+                        published: data?.published,
+                        queryString: data?.queryString,
+                        target: data?.target,
+                        trashed: data?.trashed,
+                        type: data?.type,
+                        unique: data?.unique,
+                        url: data?.url,
+                    },
+                },
+            };
+        })
+            .onSubmit((value) => {
+            if (!value)
+                return;
+            this.#setSelection(value.link, this.#linkPickerModal.modalContext?.data.index ?? null);
+        })
+            .observeRouteBuilder((routeBuilder) => {
+            this._modalRoute = routeBuilder;
+        });
+    }
+    async #requestRemoveItem(index) {
+        const item = this.#urls[index];
+        if (!item)
+            throw new Error('Could not find item at index: ' + index);
+        await umbConfirmModal(this, {
+            color: 'danger',
+            headline: `Remove ${item.name}?`,
+            content: 'Are you sure you want to remove this item',
+            confirmLabel: 'Remove',
+        });
+        this.#removeItem(index);
+    }
+    #removeItem(index) {
+        this.urls.splice(index, 1);
+        this.#dispatchChangeEvent();
+    }
+    #getItemByIndex(index) {
+        return this.urls[index];
+    }
+    #getUnique(link) {
+        return 'x' + simpleHashCode(JSON.stringify(link)).toString(16);
+    }
+    #setSelection(selection, index) {
+        if (index !== null && index >= 0) {
+            this.urls[index] = selection;
+        }
+        else {
+            this.urls.push(selection);
+        }
+        this.#dispatchChangeEvent();
+    }
+    #dispatchChangeEvent() {
+        this.requestUpdate();
+        this.dispatchEvent(new UmbChangeEvent());
+    }
+    render() {
+        return html `${this.#renderItems()} ${this.#renderAddButton()}`;
+    }
+    #renderAddButton() {
+        if (this.max === 1 && this.urls && this.urls.length >= this.max)
+            return;
+        return html `
+			<uui-button
+				id="btn-add"
+				look="placeholder"
+				label=${this.localize.term('general_add')}
+				.href=${this._modalRoute?.({ index: -1 })}></uui-button>
+		`;
+    }
+    #renderItems() {
+        if (!this.urls)
+            return;
+        return html `
+			<uui-ref-list>
+				${repeat(this.urls, (link) => link.unique, (link, index) => this.#renderItem(link, index))}
+			</uui-ref-list>
+		`;
+    }
+    #renderItem(link, index) {
+        const unique = this.#getUnique(link);
+        const href = this._modalRoute?.({ index }) ?? '#';
+        return html `
+			<uui-ref-node
+				id=${unique}
+				href=${href}
+				name=${link.name || ''}
+				detail=${(link.url || '') + (link.queryString || '')}>
+				<umb-icon slot="icon" name=${link.icon || 'icon-link'}></umb-icon>
+				<uui-action-bar slot="actions">
+					<uui-button href=${href} label=${this.localize.term('general_edit')}></uui-button>
+					<uui-button
+						@click=${() => this.#requestRemoveItem(index)}
+						label=${this.localize.term('general_remove')}></uui-button>
+				</uui-action-bar>
+			</uui-ref-node>
+		`;
+    }
+    static { this.styles = [
+        css `
+			#btn-add {
+				width: 100%;
+			}
+		`,
+    ]; }
+};
+__decorate([
+    property()
+], UmbMultiUrlPickerElement.prototype, "alias", null);
+__decorate([
+    property()
+], UmbMultiUrlPickerElement.prototype, "variantId", null);
+__decorate([
+    property({ type: Number })
+], UmbMultiUrlPickerElement.prototype, "min", void 0);
+__decorate([
+    property({ type: String, attribute: 'min-message' })
+], UmbMultiUrlPickerElement.prototype, "minMessage", void 0);
+__decorate([
+    property({ type: Number })
+], UmbMultiUrlPickerElement.prototype, "max", void 0);
+__decorate([
+    property({ type: String, attribute: 'min-message' })
+], UmbMultiUrlPickerElement.prototype, "maxMessage", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'hide-anchor' })
+], UmbMultiUrlPickerElement.prototype, "hideAnchor", void 0);
+__decorate([
+    property()
+], UmbMultiUrlPickerElement.prototype, "overlaySize", void 0);
+__decorate([
+    property({ attribute: false })
+], UmbMultiUrlPickerElement.prototype, "urls", null);
+__decorate([
+    state()
+], UmbMultiUrlPickerElement.prototype, "_modalRoute", void 0);
+UmbMultiUrlPickerElement = __decorate([
+    customElement(elementName)
+], UmbMultiUrlPickerElement);
+export { UmbMultiUrlPickerElement };

package/dist-cms/packages/{property-editors/multi-url-picker → multi-url-picker/property-editor}/Umbraco.MultiUrlPicker.js

@@ -10,13 +10,15 @@ export const manifest = {
                     alias: 'minNumber',
                     label: 'Minimum number of items',
                     description: '',
-                    propertyEditorUiAlias: 'Umb.PropertyEditorUi.Number',
+                    propertyEditorUiAlias: 'Umb.PropertyEditorUi.Integer',
+                    config: [{ alias: 'min', value: 0 }],
                 },
                 {
                     alias: 'maxNumber',
                     label: 'Maximum number of items',
                     description: '',
-                    propertyEditorUiAlias: 'Umb.PropertyEditorUi.Number',
+                    propertyEditorUiAlias: 'Umb.PropertyEditorUi.Integer',
+                    config: [{ alias: 'min', value: 0 }],
                 },
                 {
                     alias: 'ignoreUserStartNodes',
@@ -26,14 +28,8 @@ export const manifest = {
                 },
             ],
             defaultData: [
-                {
-                    alias: 'minNumber',
-                    value: 0,
-                },
-                {
-                    alias: 'maxNumber',
-                    value: 0,
-                },
+                { alias: 'minNumber', value: 0 },
+                { alias: 'maxNumber', value: 0 },
             ],
         },
     },

package/dist-cms/packages/multi-url-picker/property-editor/manifests.d.ts

@@ -0,0 +1,20 @@
+export declare const manifests: (import("../../core/extension-registry/index.js").ManifestPropertyEditorSchema | {
+    type: string;
+    alias: string;
+    name: string;
+    element: () => Promise<typeof import("./property-editor-ui-multi-url-picker.element.js")>;
+    meta: {
+        label: string;
+        propertyEditorSchemaAlias: string;
+        icon: string;
+        group: string;
+        settings: {
+            properties: {
+                alias: string;
+                label: string;
+                description: string;
+                propertyEditorUiAlias: string;
+            }[];
+        };
+    };
+})[];

package/dist-cms/packages/multi-url-picker/property-editor/manifests.js

@@ -0,0 +1,32 @@
+import { manifest as schemaManifest } from './Umbraco.MultiUrlPicker.js';
+export const manifests = [
+    {
+        type: 'propertyEditorUi',
+        alias: 'Umb.PropertyEditorUi.MultiUrlPicker',
+        name: 'Multi URL Picker Property Editor UI',
+        element: () => import('./property-editor-ui-multi-url-picker.element.js'),
+        meta: {
+            label: 'Multi URL Picker',
+            propertyEditorSchemaAlias: 'Umbraco.MultiUrlPicker',
+            icon: 'icon-link',
+            group: 'pickers',
+            settings: {
+                properties: [
+                    {
+                        alias: 'overlaySize',
+                        label: 'Overlay Size',
+                        description: 'Select the width of the overlay.',
+                        propertyEditorUiAlias: 'Umb.PropertyEditorUi.OverlaySize',
+                    },
+                    {
+                        alias: 'hideAnchor',
+                        label: 'Hide anchor/query string input',
+                        description: 'Selecting this hides the anchor/query string input field in the link picker overlay.',
+                        propertyEditorUiAlias: 'Umb.PropertyEditorUi.Toggle',
+                    },
+                ],
+            },
+        },
+    },
+    schemaManifest,
+];

package/dist-cms/packages/{property-editors/multi-url-picker → multi-url-picker/property-editor}/property-editor-ui-multi-url-picker.element.d.ts

@@ -1,7 +1,8 @@
+import type { UmbLinkPickerLink } from '../link-picker-modal/types.js';
 import { UmbLitElement } from '../../core/lit-element/index.js';
-import type { UmbLinkPickerLink } from '../../core/modal/index.js';
 import type { UmbPropertyEditorConfigCollection } from '../../core/property-editor/index.js';
 import type { UmbPropertyEditorUiElement } from '../../core/extension-registry/index.js';
+import '../multi-url-picker/multi-url-picker.element.js';
 /**
  * @element umb-property-editor-ui-multi-url-picker
  */
@@ -11,7 +12,6 @@ export declare class UmbPropertyEditorUIMultiUrlPickerElement extends UmbLitElem
     set config(config: UmbPropertyEditorConfigCollection | undefined);
     private _overlaySize?;
     private _hideAnchor?;
-    private _ignoreUserStartNodes?;
     private _minNumber?;
     private _maxNumber?;
     private _alias?;

package/dist-cms/packages/{property-editors/multi-url-picker → multi-url-picker/property-editor}/property-editor-ui-multi-url-picker.element.js

@@ -4,16 +4,12 @@ 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 __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 _UmbPropertyEditorUIMultiUrlPickerElement_instances, _UmbPropertyEditorUIMultiUrlPickerElement_onChange;
 import { customElement, html, property, state } from '../../../external/lit/index.js';
 import { UmbLitElement } from '../../core/lit-element/index.js';
 import { UmbPropertyValueChangeEvent } from '../../core/property-editor/index.js';
 import { UMB_PROPERTY_CONTEXT } from '../../core/property/index.js';
+// import of local component
+import '../multi-url-picker/multi-url-picker.element.js';
 /**
  * @element umb-property-editor-ui-multi-url-picker
  */
@@ -22,14 +18,12 @@ let UmbPropertyEditorUIMultiUrlPickerElement = class UmbPropertyEditorUIMultiUrl
         if (!config)
             return;
         this._hideAnchor = config.getValueByAlias('hideAnchor') ?? false;
-        this._ignoreUserStartNodes = config.getValueByAlias('ignoreUserStartNodes') ?? false;
         this._minNumber = Number(config.getValueByAlias('minNumber')) ?? 0;
         this._maxNumber = Number(config.getValueByAlias('maxNumber')) ?? Infinity;
         this._overlaySize = config.getValueByAlias('overlaySize') ?? 'small';
     }
     constructor() {
         super();
-        _UmbPropertyEditorUIMultiUrlPickerElement_instances.add(this);
         this.value = [];
         this._minNumber = 0;
         this._maxNumber = Infinity;
@@ -38,27 +32,25 @@ let UmbPropertyEditorUIMultiUrlPickerElement = class UmbPropertyEditorUIMultiUrl
             this.observe(context.variantId, (variantId) => (this._variantId = variantId?.toString() || 'invariant'));
         });
     }
+    #onChange(event) {
+        this.value = event.target.urls;
+        this.dispatchEvent(new UmbPropertyValueChangeEvent());
+    }
     render() {
         return html `
-			<umb-input-multi-url
+			<umb-multi-url-picker
 				.alias=${this._alias}
-				.ignoreUserStartNodes=${this._ignoreUserStartNodes}
 				.max=${this._maxNumber}
 				.min=${this._minNumber}
 				.overlaySize=${this._overlaySize}
 				.urls=${this.value ?? []}
 				.variantId=${this._variantId}
 				?hide-anchor=${this._hideAnchor}
-				@change=${__classPrivateFieldGet(this, _UmbPropertyEditorUIMultiUrlPickerElement_instances, "m", _UmbPropertyEditorUIMultiUrlPickerElement_onChange)}>
-			</umb-input-multi-url>
+				@change=${this.#onChange}>
+			</umb-multi-url-picker>
 		`;
     }
 };
-_UmbPropertyEditorUIMultiUrlPickerElement_instances = new WeakSet();
-_UmbPropertyEditorUIMultiUrlPickerElement_onChange = function _UmbPropertyEditorUIMultiUrlPickerElement_onChange(event) {
-    this.value = event.target.urls;
-    this.dispatchEvent(new UmbPropertyValueChangeEvent());
-};
 __decorate([
     property({ type: Array })
 ], UmbPropertyEditorUIMultiUrlPickerElement.prototype, "value", void 0);
@@ -68,9 +60,6 @@ __decorate([
 __decorate([
     state()
 ], UmbPropertyEditorUIMultiUrlPickerElement.prototype, "_hideAnchor", void 0);
-__decorate([
-    state()
-], UmbPropertyEditorUIMultiUrlPickerElement.prototype, "_ignoreUserStartNodes", void 0);
 __decorate([
     state()
 ], UmbPropertyEditorUIMultiUrlPickerElement.prototype, "_minNumber", void 0);

package/dist-cms/packages/multi-url-picker/tiny-mce-plugin/manifests.d.ts

@@ -0,0 +1,13 @@
+export declare const manifests: {
+    type: string;
+    alias: string;
+    name: string;
+    js: () => Promise<typeof import("./tiny-mce-multi-url-picker.plugin.js")>;
+    meta: {
+        toolbar: {
+            alias: string;
+            label: string;
+            icon: string;
+        }[];
+    };
+}[];

package/dist-cms/packages/multi-url-picker/tiny-mce-plugin/manifests.js

@@ -0,0 +1,22 @@
+export const manifests = [
+    {
+        type: 'tinyMcePlugin',
+        alias: 'Umb.TinyMcePlugin.MultiUrlPicker',
+        name: 'Multi Url Picker TinyMCE Plugin',
+        js: () => import('./tiny-mce-multi-url-picker.plugin.js'),
+        meta: {
+            toolbar: [
+                {
+                    alias: 'link',
+                    label: 'Insert/Edit link',
+                    icon: 'link',
+                },
+                {
+                    alias: 'unlink',
+                    label: 'Remove link',
+                    icon: 'unlink',
+                },
+            ],
+        },
+    },
+];

package/dist-cms/packages/{tiny-mce/plugins/tiny-mce-linkpicker.plugin.d.ts → multi-url-picker/tiny-mce-plugin/tiny-mce-multi-url-picker.plugin.d.ts}

@@ -1,5 +1,5 @@
-import { type TinyMcePluginArguments, UmbTinyMcePluginBase } from '../components/input-tiny-mce/tiny-mce-plugin.js';
-export default class UmbTinyMceLinkPickerPlugin extends UmbTinyMcePluginBase {
+import { type TinyMcePluginArguments, UmbTinyMcePluginBase } from '../../tiny-mce/index.js';
+export default class UmbTinyMceMultiUrlPickerPlugin extends UmbTinyMcePluginBase {
     #private;
     constructor(args: TinyMcePluginArguments);
     showDialog(): Promise<void>;

package/dist-cms/packages/multi-url-picker/tiny-mce-plugin/tiny-mce-multi-url-picker.plugin.js

@@ -0,0 +1,174 @@
+import { UMB_LINK_PICKER_MODAL } from '../link-picker-modal/link-picker-modal.token.js';
+import { UmbTinyMcePluginBase } from '../../tiny-mce/index.js';
+import { UMB_MODAL_MANAGER_CONTEXT } from '../../core/modal/index.js';
+export default class UmbTinyMceMultiUrlPickerPlugin extends UmbTinyMcePluginBase {
+    #linkPickerData;
+    #anchorElement;
+    constructor(args) {
+        super(args);
+        // const editorEventSetupCallback = (buttonApi: { setEnabled: (state: boolean) => void }) => {
+        // 	const editorEventCallback = (eventApi: { element: Element}) => {
+        // 		buttonApi.setEnabled(eventApi.element.nodeName.toLowerCase() === 'a' && eventApi.element.hasAttribute('href'));
+        // 	};
+        // 	editor.on('NodeChange', editorEventCallback);
+        // 	return () => editor.off('NodeChange', editorEventCallback);
+        // };
+        args.editor.ui.registry.addButton('link', {
+            icon: 'link',
+            tooltip: 'Insert/edit link',
+            onAction: () => this.showDialog(),
+        });
+        args.editor.ui.registry.addButton('unlink', {
+            icon: 'unlink',
+            tooltip: 'Remove link',
+            onAction: () => args.editor.execCommand('unlink'),
+        });
+    }
+    async showDialog() {
+        const selectedElm = this.editor.selection.getNode();
+        this.#anchorElement = this.editor.dom.getParent(selectedElm, 'a[href]');
+        const data = {
+            text: this.#anchorElement
+                ? this.#anchorElement.innerText || (this.#anchorElement.textContent ?? '')
+                : this.editor.selection.getContent({ format: 'text' }),
+            href: this.#anchorElement?.getAttribute('href') ?? '',
+            target: this.#anchorElement?.target ?? '',
+            rel: this.#anchorElement?.rel ?? '',
+        };
+        if (selectedElm.nodeName === 'IMG') {
+            data.text = ' ';
+        }
+        if (!this.#anchorElement) {
+            this.#openLinkPicker({ name: this.editor.selection.getContent() });
+            return;
+        }
+        //if we already have a link selected, we want to pass that data over to the dialog
+        const currentTarget = {
+            name: this.#anchorElement.title || this.#anchorElement.textContent,
+            target: this.#anchorElement.target,
+            queryString: `${this.#anchorElement.search}${this.#anchorElement.hash}`,
+        };
+        if (this.#anchorElement.href.includes('localLink:')) {
+            const href = this.#anchorElement.getAttribute('href');
+            currentTarget.unique = href.substring(href.indexOf(':') + 1, href.indexOf('}'));
+        }
+        else if (this.#anchorElement.host.length) {
+            currentTarget.url = this.#anchorElement.protocol ? this.#anchorElement.protocol + '//' : undefined;
+            currentTarget.url += this.#anchorElement.host + this.#anchorElement.pathname;
+        }
+        this.#openLinkPicker(currentTarget);
+    }
+    async #openLinkPicker(currentTarget) {
+        const modalManager = await this.getContext(UMB_MODAL_MANAGER_CONTEXT);
+        const modalHandler = modalManager.open(this, UMB_LINK_PICKER_MODAL, {
+            data: {
+                config: {},
+                index: null,
+            },
+            value: {
+                link: currentTarget ?? {},
+            },
+        });
+        if (!modalHandler)
+            return;
+        const linkPickerData = await modalHandler.onSubmit().catch(() => undefined);
+        if (!linkPickerData)
+            return;
+        // TODO: This is a workaround for the issue where the link picker modal is returning a frozen object, and we need to extract the link into smaller parts to avoid the frozen object issue.
+        this.#linkPickerData = { link: { ...linkPickerData.link } };
+        this.#updateLink();
+    }
+    //Create a json obj used to create the attributes for the tag
+    // TODO => where has rel gone?
+    #createElemAttributes() {
+        // Attribute 'name' because of linkPickerData. It should be 'title' .
+        const { name, ...linkPickerData } = this.#linkPickerData.link;
+        const a = Object.assign({}, linkPickerData);
+        // always need to map back to href for tinymce to render correctly
+        // do this first as checking querystring below may modify the href property
+        if (this.#linkPickerData?.link.url) {
+            a.href = this.#linkPickerData.link.url;
+        }
+        if (this.#linkPickerData?.link.name) {
+            a.title = name;
+        }
+        if (this.#linkPickerData?.link.queryString?.startsWith('#') ||
+            this.#linkPickerData?.link.queryString?.startsWith('?')) {
+            a['data-anchor'] = this.#linkPickerData?.link.queryString;
+            a.href += this.#linkPickerData?.link.queryString;
+        }
+        return a;
+    }
+    #insertLink() {
+        if (this.#anchorElement) {
+            this.editor.dom.setAttribs(this.#anchorElement, this.#createElemAttributes());
+            this.editor.selection.select(this.#anchorElement);
+            this.editor.execCommand('mceEndTyping');
+            return;
+        }
+        // If there is no selected content, we can't insert a link
+        // as TinyMCE needs selected content for this, so instead we
+        // create a new dom element and insert it, using the chosen
+        // link name as the content.
+        if (this.editor.selection.getContent() !== '') {
+            this.editor.execCommand('CreateLink', false, this.#createElemAttributes());
+            return;
+        }
+        // Using the target url as a fallback, as href might be confusing with a local link
+        const linkContent = typeof this.#linkPickerData?.link.name !== 'undefined' && this.#linkPickerData?.link.name !== ''
+            ? this.#linkPickerData?.link.name
+            : this.#linkPickerData?.link.url;
+        // only insert if link has content
+        if (linkContent) {
+            const domElement = this.editor.dom.createHTML('a', this.#createElemAttributes(), linkContent);
+            this.editor.execCommand('mceInsertContent', false, domElement);
+        }
+    }
+    #updateLink() {
+        // if an anchor exists, check that it is appropriately prefixed
+        if (this.#linkPickerData?.link.queryString &&
+            !this.#linkPickerData.link.queryString.startsWith('?') &&
+            !this.#linkPickerData.link.queryString.startsWith('#')) {
+            this.#linkPickerData.link.queryString =
+                (this.#linkPickerData.link.queryString.startsWith('=') ? '#' : '?') + this.#linkPickerData.link.queryString;
+        }
+        // the href might be an external url, so check the value for an anchor/qs
+        // href has the anchor re-appended later, hence the reset here to avoid duplicating the anchor
+        if (this.#linkPickerData && !this.#linkPickerData?.link.queryString) {
+            const urlParts = this.#linkPickerData?.link.url?.split(/(#|\?)/);
+            if (urlParts?.length === 3) {
+                this.#linkPickerData.link.url = urlParts[0];
+                this.#linkPickerData.link.queryString = urlParts[1] + urlParts[2];
+            }
+        }
+        if (!this.#linkPickerData?.link.url &&
+            !this.#linkPickerData?.link.queryString &&
+            !this.#linkPickerData?.link.unique) {
+            this.editor.execCommand('unlink');
+            return;
+        }
+        //if we have an id, it must be a locallink:id
+        if (this.#linkPickerData?.link.unique) {
+            this.#linkPickerData.link.url = '/{localLink:' + this.#linkPickerData.link.unique + '}';
+            this.#insertLink();
+            return;
+        }
+        if (!this.#linkPickerData?.link.url) {
+            this.#linkPickerData.link.url = '';
+        }
+        // Is email and not //user@domain.com and protocol (e.g. mailto:, sip:) is not specified
+        if (this.#linkPickerData?.link.url.includes('@') &&
+            !this.#linkPickerData.link.url.includes('//') &&
+            !this.#linkPickerData.link.url.includes(':')) {
+            // assume it's a mailto link
+            this.#linkPickerData.link.url = 'mailto:' + this.#linkPickerData?.link.url;
+            this.#insertLink();
+            return;
+        }
+        // Is www. prefixed
+        if (/^\s*www\./i.test(this.#linkPickerData?.link.url)) {
+            this.#linkPickerData.link.url = 'http://' + this.#linkPickerData.link.url;
+        }
+        this.#insertLink();
+    }
+}

package/dist-cms/packages/{audit-log → multi-url-picker}/umbraco-package.d.ts

@@ -1,4 +1,4 @@
-export declare const name = "Umbraco.Core.AuditLog";
+export declare const name = "Umbraco.Core.MultiUrlPicker";
 export declare const extensions: {
     name: string;
     alias: string;