@umbraco-cms/backoffice 14.0.0--preview005-bbf54b9a → 14.0.0--preview005-c6c57135

package/dist-cms/libs/element-api/element.mixin.d.ts

@@ -1,4 +1,4 @@
-import { UmbLocalizeController } from '../localization-api/index.js';
+import { UmbLocalizationController } from '../localization-api/index.js';
 import type { Observable } from '../../external/rxjs/index.js';
 import type { HTMLElementConstructor } from '../extension-api/index.js';
 import { type UmbControllerHostElement } from '../controller-api/index.js';
@@ -21,8 +21,8 @@ export declare class UmbElement extends UmbControllerHostElement {
     consumeContext<BaseType = unknown, ResultType extends BaseType = BaseType>(alias: string | UmbContextToken<BaseType, ResultType>, callback: UmbContextCallback<ResultType>): UmbContextConsumerController<BaseType, ResultType>;
     /**
      * Use the UmbLocalizeController to localize your element.
-     * @see UmbLocalizeController
+     * @see UmbLocalizationController
      */
-    localize: UmbLocalizeController;
+    localize: UmbLocalizationController;
 }
 export declare const UmbElementMixin: <T extends HTMLElementConstructor>(superClass: T) => HTMLElementConstructor<UmbElement> & T;

package/dist-cms/libs/element-api/element.mixin.js

@@ -1,4 +1,4 @@
-import { UmbLocalizeController } from '../localization-api/index.js';
+import { UmbLocalizationController } from '../localization-api/index.js';
 import { UmbControllerHostElementMixin } from '../controller-api/index.js';
 import { UmbContextConsumerController, UmbContextProviderController } from '../context-api/index.js';
 import { UmbObserverController } from '../observable-api/index.js';
@@ -6,7 +6,7 @@ export const UmbElementMixin = (superClass) => {
     class UmbElementMixinClass extends UmbControllerHostElementMixin(superClass) {
         constructor() {
             super(...arguments);
-            this.localize = new UmbLocalizeController(this);
+            this.localize = new UmbLocalizationController(this);
         }
         /**
          * @description Observe a RxJS source of choice.

package/dist-cms/libs/extension-api/registry/extension.registry.d.ts

@@ -21,6 +21,25 @@ export declare class UmbExtensionRegistry<IncomingManifestTypes extends Manifest
     getByAlias<T extends ManifestBase = ManifestBase>(alias: string): Observable<T | undefined>;
     getByTypeAndAlias<Key extends keyof ManifestTypeMap<ManifestTypes> | string, T extends ManifestBase = SpecificManifestTypeOrManifestBase<ManifestTypes, Key>>(type: Key, alias: string): Observable<T | undefined>;
     getByTypeAndAliases<Key extends keyof ManifestTypeMap<ManifestTypes> | string, T extends ManifestBase = SpecificManifestTypeOrManifestBase<ManifestTypes, Key>>(type: Key, aliases: Array<string>): Observable<T[]>;
+    /**
+     * Get an observable of an extension by type and a given filter method.
+     * This will return the all extensions that matches the type and which filter method returns true.
+     * The filter method will be called for each extension manifest of the given type, and the first argument to it is the extension manifest.
+     * @param type {string} - The type of the extension to get
+     * @param filter {(ext: T): void} - The filter method to use to filter the extensions
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the type and filter method
+     */
+    byTypeAndFilter<Key extends keyof ManifestTypeMap<ManifestTypes> | string, T extends ManifestBase = SpecificManifestTypeOrManifestBase<ManifestTypes, Key>>(type: Key, filter: (ext: T) => boolean): Observable<T | undefined>;
+    /**
+     * Get an observable that provides extensions matching the given type.
+     * @param type {string} - The type of the extensions to get.
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the type.
+     */
     extensionsOfType<Key extends keyof ManifestTypeMap<ManifestTypes> | string, T extends ManifestBase = SpecificManifestTypeOrManifestBase<ManifestTypes, Key>>(type: Key): Observable<T[]>;
+    /**
+     * Get an observable that provides extensions matching given types.
+     * @param type {Array<string>} - The types of the extensions to get.
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the types.
+     */
     extensionsOfTypes<ExtensionTypes extends ManifestBase = ManifestBase>(types: string[]): Observable<Array<ExtensionTypes>>;
 }

package/dist-cms/libs/extension-api/registry/extension.registry.js

@@ -1,5 +1,5 @@
 import { UmbBasicState } from '../../observable-api/index.js';
-import { map, distinctUntilChanged, combineLatest, of, switchMap, } from '../../../external/rxjs/index.js';
+import { map, distinctUntilChanged, combineLatest, of, switchMap } from '../../../external/rxjs/index.js';
 function extensionArrayMemoization(previousValue, currentValue) {
     // If length is different, data is different:
     if (previousValue.length !== currentValue.length) {
@@ -137,6 +137,7 @@ export class UmbExtensionRegistry {
     _extensionsOfTypes(types) {
         return this.extensions.pipe(map((exts) => exts.filter((ext) => types.indexOf(ext.type) !== -1)), distinctUntilChanged(extensionArrayMemoization));
     }
+    // TODO: get rid of the name get
     getByAlias(alias) {
         return this.extensions.pipe(map((exts) => exts.find((ext) => ext.alias === alias)), distinctUntilChanged(extensionSingleMemoization), switchMap((ext) => {
             if (ext?.kind) {
@@ -160,6 +161,7 @@ export class UmbExtensionRegistry {
             return of(ext);
         }), distinctUntilChanged(extensionAndKindMatchSingleMemoization));
     }
+    // TODO: get rid of the name get
     getByTypeAndAlias(type, alias) {
         return combineLatest([
             this.extensions.pipe(map((exts) => exts.find((ext) => ext.type === type && ext.alias === alias)), distinctUntilChanged(extensionSingleMemoization)),
@@ -180,6 +182,7 @@ export class UmbExtensionRegistry {
             return ext;
         }), distinctUntilChanged(extensionAndKindMatchSingleMemoization));
     }
+    // TODO: get rid of the name get
     getByTypeAndAliases(type, aliases) {
         return combineLatest([
             this.extensions.pipe(map((exts) => exts.filter((ext) => ext.type === type && aliases.indexOf(ext.alias) !== -1)), distinctUntilChanged(extensionArrayMemoization)),
@@ -199,6 +202,39 @@ export class UmbExtensionRegistry {
         })
             .sort(sortExtensions)), distinctUntilChanged(extensionAndKindMatchArrayMemoization));
     }
+    /**
+     * Get an observable of an extension by type and a given filter method.
+     * This will return the all extensions that matches the type and which filter method returns true.
+     * The filter method will be called for each extension manifest of the given type, and the first argument to it is the extension manifest.
+     * @param type {string} - The type of the extension to get
+     * @param filter {(ext: T): void} - The filter method to use to filter the extensions
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the type and filter method
+     */
+    byTypeAndFilter(type, filter) {
+        return combineLatest([
+            this.extensions.pipe(map((exts) => exts.find((ext) => ext.type === type && filter(ext))), distinctUntilChanged(extensionSingleMemoization)),
+            this._kindsOfType(type),
+        ]).pipe(map(([ext, kinds]) => {
+            // TODO: share one merge function between the different methods of this class:
+            // Specific Extension Meta merge (does not merge conditions)
+            if (ext) {
+                const baseManifest = kinds.find((kind) => kind.matchKind === ext.kind)?.manifest;
+                if (baseManifest) {
+                    const merged = { __isMatchedWithKind: true, ...baseManifest, ...ext };
+                    if (baseManifest.meta) {
+                        merged.meta = { ...baseManifest.meta, ...ext.meta };
+                    }
+                    return merged;
+                }
+            }
+            return ext;
+        }), distinctUntilChanged(extensionAndKindMatchSingleMemoization));
+    }
+    /**
+     * Get an observable that provides extensions matching the given type.
+     * @param type {string} - The type of the extensions to get.
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the type.
+     */
     extensionsOfType(type) {
         return combineLatest([this._extensionsOfType(type), this._kindsOfType(type)]).pipe(map(([exts, kinds]) => exts
             .map((ext) => {
@@ -215,6 +251,11 @@ export class UmbExtensionRegistry {
         })
             .sort(sortExtensions)), distinctUntilChanged(extensionAndKindMatchArrayMemoization));
     }
+    /**
+     * Get an observable that provides extensions matching given types.
+     * @param type {Array<string>} - The types of the extensions to get.
+     * @returns {Observable<T | undefined>} - An observable of the extensions that matches the types.
+     */
     extensionsOfTypes(types) {
         return combineLatest([this._extensionsOfTypes(types), this._kindsOfTypes(types)]).pipe(map(([exts, kinds]) => exts
             .map((ext) => {

package/dist-cms/libs/localization-api/index.d.ts

@@ -1,3 +1,3 @@
-export * from './localize.controller.js';
+export * from './localization.controller.js';
 export * from './types/localization.js';
-export * from './manager.js';
+export * from './localization.manager.js';

package/dist-cms/libs/localization-api/index.js

@@ -1,3 +1,3 @@
-export * from './localize.controller.js';
+export * from './localization.controller.js';
 export * from './types/localization.js';
-export * from './manager.js';
+export * from './localization.manager.js';

package/dist-cms/libs/localization-api/{localize.controller.d.ts → localization.controller.d.ts}

@@ -1,4 +1,4 @@
-import type { DefaultLocalizationSet, FunctionParams, LocalizationSet } from './manager.js';
+import type { UmbLocalizationSet, FunctionParams, UmbLocalizationSetBase, UmbLocalizationSetKey } from './localization.manager.js';
 import type { UmbController, UmbControllerHost } from '../controller-api/index.js';
 /**
  * The UmbLocalizeController enables localization for your element.
@@ -18,13 +18,15 @@ import type { UmbController, UmbControllerHost } from '../controller-api/index.j
  * }
  * ```
  */
-export declare class UmbLocalizeController<LocalizationType extends LocalizationSet = DefaultLocalizationSet> implements UmbController {
+export declare class UmbLocalizationController<LocalizationSetType extends UmbLocalizationSetBase = UmbLocalizationSet> implements UmbController {
     #private;
-    controllerAlias: symbol;
+    readonly controllerAlias: symbol;
     constructor(host: UmbControllerHost);
     hostConnected(): void;
     hostDisconnected(): void;
     destroy(): void;
+    documentUpdate(): void;
+    keysChanged(changedKeys: Set<UmbLocalizationSetKey>): void;
     /**
      * Gets the host element's directionality as determined by the `dir` attribute. The return value is transformed to
      * lowercase.
@@ -37,7 +39,7 @@ export declare class UmbLocalizeController<LocalizationType extends Localization
     lang(): string;
     private getLocalizationData;
     /** Outputs a translated term. */
-    term<K extends keyof LocalizationType>(key: K, ...args: FunctionParams<LocalizationType[K]>): string;
+    term<K extends keyof LocalizationSetType>(key: K, ...args: FunctionParams<LocalizationSetType[K]>): string;
     /** Outputs a localized date in the specified format. */
     date(dateToFormat: Date | string, options?: Intl.DateTimeFormatOptions): string;
     /** Outputs a localized number in the specified format. */

package/dist-cms/libs/localization-api/{localize.controller.js → localization.controller.js}

@@ -9,9 +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 _UmbLocalizeController_host, _UmbLocalizeController_hostEl;
-import { connectedElements, documentDirection, documentLanguage, fallback, localizations, } from './manager.js';
-const LocalizeControllerAlias = Symbol();
+var _UmbLocalizationController_host, _UmbLocalizationController_hostEl, _UmbLocalizationController_usedKeys;
+import { umbLocalizationManager } from './localization.manager.js';
+const LocalizationControllerAlias = Symbol();
 /**
  * The UmbLocalizeController enables localization for your element.
  *
@@ -30,52 +30,62 @@ const LocalizeControllerAlias = Symbol();
  * }
  * ```
  */
-export class UmbLocalizeController {
+export class UmbLocalizationController {
     constructor(host) {
-        _UmbLocalizeController_host.set(this, void 0);
-        _UmbLocalizeController_hostEl.set(this, void 0);
-        this.controllerAlias = LocalizeControllerAlias;
-        __classPrivateFieldSet(this, _UmbLocalizeController_host, host, "f");
-        __classPrivateFieldSet(this, _UmbLocalizeController_hostEl, host.getHostElement(), "f");
-        __classPrivateFieldGet(this, _UmbLocalizeController_host, "f").addController(this);
+        _UmbLocalizationController_host.set(this, void 0);
+        _UmbLocalizationController_hostEl.set(this, void 0);
+        this.controllerAlias = LocalizationControllerAlias;
+        _UmbLocalizationController_usedKeys.set(this, new Array());
+        __classPrivateFieldSet(this, _UmbLocalizationController_host, host, "f");
+        __classPrivateFieldSet(this, _UmbLocalizationController_hostEl, host.getHostElement(), "f");
+        __classPrivateFieldGet(this, _UmbLocalizationController_host, "f").addController(this);
     }
     hostConnected() {
-        if (connectedElements.has(__classPrivateFieldGet(this, _UmbLocalizeController_hostEl, "f"))) {
-            return;
-        }
-        connectedElements.add(__classPrivateFieldGet(this, _UmbLocalizeController_hostEl, "f"));
+        umbLocalizationManager.appendConsumer(this);
     }
     hostDisconnected() {
-        connectedElements.delete(__classPrivateFieldGet(this, _UmbLocalizeController_hostEl, "f"));
+        umbLocalizationManager.removeConsumer(this);
     }
     destroy() {
-        __classPrivateFieldGet(this, _UmbLocalizeController_host, "f").removeController(this);
-        __classPrivateFieldSet(this, _UmbLocalizeController_hostEl, undefined, "f");
+        __classPrivateFieldGet(this, _UmbLocalizationController_host, "f").removeController(this);
+        __classPrivateFieldSet(this, _UmbLocalizationController_hostEl, undefined, "f");
+    }
+    documentUpdate() {
+        __classPrivateFieldGet(this, _UmbLocalizationController_hostEl, "f")?.requestUpdate?.();
+    }
+    keysChanged(changedKeys) {
+        const hasOneOfTheseKeys = __classPrivateFieldGet(this, _UmbLocalizationController_usedKeys, "f").find((key) => changedKeys.has(key));
+        if (hasOneOfTheseKeys) {
+            __classPrivateFieldGet(this, _UmbLocalizationController_hostEl, "f")?.requestUpdate?.();
+        }
     }
     /**
      * Gets the host element's directionality as determined by the `dir` attribute. The return value is transformed to
      * lowercase.
      */
     dir() {
-        return `${__classPrivateFieldGet(this, _UmbLocalizeController_hostEl, "f").dir || documentDirection}`.toLowerCase();
+        return `${__classPrivateFieldGet(this, _UmbLocalizationController_hostEl, "f")?.dir || umbLocalizationManager.documentDirection}`.toLowerCase();
     }
     /**
      * Gets the host element's language as determined by the `lang` attribute. The return value is transformed to
      * lowercase.
      */
     lang() {
-        return `${__classPrivateFieldGet(this, _UmbLocalizeController_hostEl, "f").lang || documentLanguage}`.toLowerCase();
+        return `${__classPrivateFieldGet(this, _UmbLocalizationController_hostEl, "f")?.lang || umbLocalizationManager.documentLanguage}`.toLowerCase();
     }
     getLocalizationData(lang) {
         const locale = new Intl.Locale(lang);
         const language = locale?.language.toLowerCase();
         const region = locale?.region?.toLowerCase() ?? '';
-        const primary = localizations.get(`${language}-${region}`);
-        const secondary = localizations.get(language);
+        const primary = umbLocalizationManager.localizations.get(`${language}-${region}`);
+        const secondary = umbLocalizationManager.localizations.get(language);
         return { locale, language, region, primary, secondary };
     }
     /** Outputs a translated term. */
     term(key, ...args) {
+        if (!__classPrivateFieldGet(this, _UmbLocalizationController_usedKeys, "f").includes(key)) {
+            __classPrivateFieldGet(this, _UmbLocalizationController_usedKeys, "f").push(key);
+        }
         const { primary, secondary } = this.getLocalizationData(this.lang());
         let term;
         // Look for a matching term using regionCode, code, then the fallback
@@ -85,8 +95,8 @@ export class UmbLocalizeController {
         else if (secondary && secondary[key]) {
             term = secondary[key];
         }
-        else if (fallback && fallback[key]) {
-            term = fallback[key];
+        else if (umbLocalizationManager.fallback && umbLocalizationManager.fallback[key]) {
+            term = umbLocalizationManager.fallback[key];
         }
         else {
             return String(key);
@@ -120,4 +130,4 @@ export class UmbLocalizeController {
         return new Intl.RelativeTimeFormat(this.lang(), options).format(value, unit);
     }
 }
-_UmbLocalizeController_host = new WeakMap(), _UmbLocalizeController_hostEl = new WeakMap();
+_UmbLocalizationController_host = new WeakMap(), _UmbLocalizationController_hostEl = new WeakMap(), _UmbLocalizationController_usedKeys = new WeakMap();

package/dist-cms/libs/localization-api/localization.manager.d.ts

@@ -0,0 +1,29 @@
+import type { UmbLocalizationController } from './localization.controller.js';
+import type { UmbLocalizationEntry } from './types/localization.js';
+export type FunctionParams<T> = T extends (...args: infer U) => string ? U : [];
+export interface UmbLocalizationSetBase {
+    $code: string;
+    $dir: 'ltr' | 'rtl';
+}
+export type UmbLocalizationSetKey = string | number | symbol;
+export interface UmbLocalizationSet extends UmbLocalizationSetBase {
+    [key: UmbLocalizationSetKey]: UmbLocalizationEntry;
+}
+export declare const UMB_DEFAULT_LOCALIZATION_CULTURE = "en-us";
+export declare class UmbLocalizationManager {
+    #private;
+    connectedControllers: Set<UmbLocalizationController<UmbLocalizationSetBase>>;
+    localizations: Map<string, UmbLocalizationSetBase>;
+    documentDirection: string;
+    documentLanguage: string;
+    get fallback(): UmbLocalizationSet | undefined;
+    constructor();
+    appendConsumer(consumer: UmbLocalizationController<UmbLocalizationSetBase>): void;
+    removeConsumer(consumer: UmbLocalizationController<UmbLocalizationSetBase>): void;
+    /** Registers one or more translations */
+    registerLocalization(t: UmbLocalizationSetBase): void;
+    registerManyLocalizations(translations: Array<UmbLocalizationSetBase>): void;
+    /** Updates all localized elements that are currently connected */
+    updateAll: () => void;
+}
+export declare const umbLocalizationManager: UmbLocalizationManager;

package/dist-cms/libs/localization-api/localization.manager.js

@@ -0,0 +1,94 @@
+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 _UmbLocalizationManager_instances, _UmbLocalizationManager_documentElementObserver, _UmbLocalizationManager_changedKeys, _UmbLocalizationManager_requestUpdateChangedKeysId, _UmbLocalizationManager_registerLocalizationBind, _UmbLocalizationManager_updateChangedKeys, _UmbLocalizationManager_requestChangedKeysUpdate;
+export const UMB_DEFAULT_LOCALIZATION_CULTURE = 'en-us';
+export class UmbLocalizationManager {
+    get fallback() {
+        return this.localizations.get(UMB_DEFAULT_LOCALIZATION_CULTURE);
+    }
+    constructor() {
+        _UmbLocalizationManager_instances.add(this);
+        this.connectedControllers = new Set();
+        _UmbLocalizationManager_documentElementObserver.set(this, void 0);
+        _UmbLocalizationManager_changedKeys.set(this, new Set());
+        _UmbLocalizationManager_requestUpdateChangedKeysId.set(this, undefined);
+        this.localizations = new Map();
+        this.documentDirection = document.documentElement.dir || 'ltr';
+        this.documentLanguage = document.documentElement.lang || navigator.language;
+        _UmbLocalizationManager_registerLocalizationBind.set(this, this.registerLocalization.bind(this));
+        /** Updates all localized elements that are currently connected */
+        this.updateAll = () => {
+            const newDir = document.documentElement.dir || 'ltr';
+            const newLang = document.documentElement.lang || navigator.language;
+            if (this.documentDirection === newDir && this.documentLanguage === newLang)
+                return;
+            // The document direction or language did changed, so lets move on:
+            this.documentDirection = newDir;
+            this.documentLanguage = newLang;
+            // Check if there was any changed.
+            this.connectedControllers.forEach((ctrl) => {
+                ctrl.documentUpdate();
+            });
+            if (__classPrivateFieldGet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, "f")) {
+                cancelAnimationFrame(__classPrivateFieldGet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, "f"));
+                __classPrivateFieldSet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, undefined, "f");
+            }
+            __classPrivateFieldGet(this, _UmbLocalizationManager_changedKeys, "f").clear();
+        };
+        _UmbLocalizationManager_updateChangedKeys.set(this, () => {
+            __classPrivateFieldSet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, undefined, "f");
+            this.connectedControllers.forEach((ctrl) => {
+                ctrl.keysChanged(__classPrivateFieldGet(this, _UmbLocalizationManager_changedKeys, "f"));
+            });
+            __classPrivateFieldGet(this, _UmbLocalizationManager_changedKeys, "f").clear();
+        });
+        __classPrivateFieldSet(this, _UmbLocalizationManager_documentElementObserver, new MutationObserver(this.updateAll), "f");
+        __classPrivateFieldGet(this, _UmbLocalizationManager_documentElementObserver, "f").observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ['dir', 'lang'],
+        });
+    }
+    appendConsumer(consumer) {
+        if (this.connectedControllers.has(consumer))
+            return;
+        this.connectedControllers.add(consumer);
+    }
+    removeConsumer(consumer) {
+        this.connectedControllers.delete(consumer);
+    }
+    /** Registers one or more translations */
+    registerLocalization(t) {
+        const code = t.$code.toLowerCase();
+        if (this.localizations.has(code)) {
+            // Merge translations that share the same language code
+            this.localizations.set(code, { ...this.localizations.get(code), ...t });
+        }
+        else {
+            this.localizations.set(code, t);
+        }
+        // Declare what keys have been changed:
+        const keys = Object.keys(t);
+        for (const key of keys) {
+            __classPrivateFieldGet(this, _UmbLocalizationManager_changedKeys, "f").add(key);
+        }
+        __classPrivateFieldGet(this, _UmbLocalizationManager_instances, "m", _UmbLocalizationManager_requestChangedKeysUpdate).call(this);
+    }
+    registerManyLocalizations(translations) {
+        translations.map(__classPrivateFieldGet(this, _UmbLocalizationManager_registerLocalizationBind, "f"));
+    }
+}
+_UmbLocalizationManager_documentElementObserver = new WeakMap(), _UmbLocalizationManager_changedKeys = new WeakMap(), _UmbLocalizationManager_requestUpdateChangedKeysId = new WeakMap(), _UmbLocalizationManager_registerLocalizationBind = new WeakMap(), _UmbLocalizationManager_updateChangedKeys = new WeakMap(), _UmbLocalizationManager_instances = new WeakSet(), _UmbLocalizationManager_requestChangedKeysUpdate = function _UmbLocalizationManager_requestChangedKeysUpdate() {
+    if (__classPrivateFieldGet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, "f"))
+        return;
+    __classPrivateFieldSet(this, _UmbLocalizationManager_requestUpdateChangedKeysId, requestAnimationFrame(__classPrivateFieldGet(this, _UmbLocalizationManager_updateChangedKeys, "f")), "f");
+};
+export const umbLocalizationManager = new UmbLocalizationManager();

package/dist-cms/packages/core/localization/registry/localization.registry.d.ts

@@ -1,12 +1,12 @@
-import type { LocalizationSet } from '../../../../libs/localization-api/index.js';
+import type { UmbLocalizationSetBase } from '../../../../libs/localization-api/index.js';
 import type { UmbBackofficeExtensionRegistry } from '../../extension-registry/index.js';
 export declare class UmbLocalizationRegistry {
     #private;
+    readonly currentLanguage: import("rxjs/internal/Observable").Observable<string>;
     /**
      * Get the current registered translations.
      */
-    get localizations(): Map<string, LocalizationSet>;
-    get isDefaultLoaded(): import("rxjs/internal/Observable").Observable<boolean>;
+    get localizations(): Map<string, UmbLocalizationSetBase>;
     constructor(extensionRegistry: UmbBackofficeExtensionRegistry);
     /**
      * Load a language from the extension registry.

package/dist-cms/packages/core/localization/registry/localization.registry.js

@@ -3,72 +3,75 @@ 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 _UmbLocalizationRegistry_instances, _UmbLocalizationRegistry_currentLanguage, _UmbLocalizationRegistry_isDefaultLoaded, _UmbLocalizationRegistry_addOrUpdateDictionary;
-import { registerLocalization, localizations, } from '../../../../libs/localization-api/index.js';
-import { hasDefaultExport, loadManifestPlainJs } from '../../../../libs/extension-api/index.js';
+var _UmbLocalizationRegistry_currentLanguage, _UmbLocalizationRegistry_loadedExtAliases, _UmbLocalizationRegistry_loadExtension;
+import { umbLocalizationManager } from '../../../../libs/localization-api/index.js';
 import { umbExtensionsRegistry } from '../../extension-registry/index.js';
-import { BehaviorSubject, Subject, combineLatest, map, distinctUntilChanged, filter, startWith, } from '../../../../external/rxjs/index.js';
+import { UmbStringState } from '../../../../libs/observable-api/index.js';
+import { combineLatest } from '../../../../external/rxjs/index.js';
+import { hasDefaultExport, loadManifestPlainJs } from '../../../../libs/extension-api/index.js';
+function addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary) {
+    for (const [key, value] of Object.entries(dictionary)) {
+        innerDictionary[`${dictionaryName}_${key}`] = value;
+    }
+}
 export class UmbLocalizationRegistry {
     /**
      * Get the current registered translations.
      */
     get localizations() {
-        return localizations;
-    }
-    get isDefaultLoaded() {
-        return __classPrivateFieldGet(this, _UmbLocalizationRegistry_isDefaultLoaded, "f").asObservable();
+        return umbLocalizationManager.localizations;
     }
     constructor(extensionRegistry) {
-        _UmbLocalizationRegistry_instances.add(this);
-        _UmbLocalizationRegistry_currentLanguage.set(this, new Subject());
-        _UmbLocalizationRegistry_isDefaultLoaded.set(this, new BehaviorSubject(false));
-        const currentLanguage$ = __classPrivateFieldGet(this, _UmbLocalizationRegistry_currentLanguage, "f").pipe(startWith(document.documentElement.lang || 'en-us'), map((x) => x.toLowerCase()), distinctUntilChanged());
-        const currentExtensions$ = extensionRegistry.extensionsOfType('localization').pipe(filter((x) => x.length > 0), distinctUntilChanged((prev, curr) => prev.length === curr.length && prev.every((x) => curr.includes(x))));
-        combineLatest([currentLanguage$, currentExtensions$]).subscribe(async ([userCulture, extensions]) => {
-            const locale = new Intl.Locale(userCulture);
-            const translations = await Promise.all(extensions
-                .filter((x) => x.meta.culture.toLowerCase() === locale.baseName.toLowerCase() ||
-                x.meta.culture.toLowerCase() === locale.language.toLowerCase())
-                .map(async (extension) => {
-                const innerDictionary = {};
-                // If extension contains a dictionary, add it to the inner dictionary.
-                if (extension.meta.localizations) {
-                    for (const [dictionaryName, dictionary] of Object.entries(extension.meta.localizations)) {
-                        __classPrivateFieldGet(this, _UmbLocalizationRegistry_instances, "m", _UmbLocalizationRegistry_addOrUpdateDictionary).call(this, innerDictionary, dictionaryName, dictionary);
-                    }
+        _UmbLocalizationRegistry_currentLanguage.set(this, new UmbStringState(document.documentElement.lang ?? 'en-us'));
+        this.currentLanguage = __classPrivateFieldGet(this, _UmbLocalizationRegistry_currentLanguage, "f").asObservable();
+        _UmbLocalizationRegistry_loadedExtAliases.set(this, []);
+        _UmbLocalizationRegistry_loadExtension.set(this, async (extension) => {
+            __classPrivateFieldGet(this, _UmbLocalizationRegistry_loadedExtAliases, "f").push(extension.alias);
+            const innerDictionary = {};
+            // If extension contains a dictionary, add it to the inner dictionary.
+            if (extension.meta.localizations) {
+                for (const [dictionaryName, dictionary] of Object.entries(extension.meta.localizations)) {
+                    addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
                 }
-                // If extension contains a js file, load it and add the default dictionary to the inner dictionary.
-                if (extension.js) {
-                    const loadedExtension = await loadManifestPlainJs(extension.js);
-                    if (loadedExtension && hasDefaultExport(loadedExtension)) {
-                        for (const [dictionaryName, dictionary] of Object.entries(loadedExtension.default)) {
-                            __classPrivateFieldGet(this, _UmbLocalizationRegistry_instances, "m", _UmbLocalizationRegistry_addOrUpdateDictionary).call(this, innerDictionary, dictionaryName, dictionary);
-                        }
+            }
+            // If extension contains a js file, load it and add the default dictionary to the inner dictionary.
+            if (extension.js) {
+                const loadedExtension = await loadManifestPlainJs(extension.js);
+                if (loadedExtension && hasDefaultExport(loadedExtension)) {
+                    for (const [dictionaryName, dictionary] of Object.entries(loadedExtension.default)) {
+                        addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
                     }
                 }
-                // Notify subscribers that the inner dictionary has changed.
-                return {
-                    $code: extension.meta.culture.toLowerCase(),
-                    $dir: extension.meta.direction ?? 'ltr',
-                    ...innerDictionary,
-                };
-            }));
-            if (translations.length) {
-                registerLocalization(...translations);
-                // Set the document language
-                const newLang = locale.baseName.toLowerCase();
-                if (document.documentElement.lang.toLowerCase() !== newLang) {
-                    document.documentElement.lang = newLang;
-                }
-                // Set the document direction to the direction of the primary language
-                const newDir = translations[0].$dir ?? 'ltr';
-                if (document.documentElement.dir !== newDir) {
-                    document.documentElement.dir = newDir;
-                }
             }
-            if (!__classPrivateFieldGet(this, _UmbLocalizationRegistry_isDefaultLoaded, "f").value) {
-                __classPrivateFieldGet(this, _UmbLocalizationRegistry_isDefaultLoaded, "f").next(true);
-                __classPrivateFieldGet(this, _UmbLocalizationRegistry_isDefaultLoaded, "f").complete();
+            // Notify subscribers that the inner dictionary has changed.
+            return {
+                $code: extension.meta.culture.toLowerCase(),
+                $dir: extension.meta.direction ?? 'ltr',
+                ...innerDictionary,
+            };
+        });
+        combineLatest([this.currentLanguage, extensionRegistry.extensionsOfType('localization')]).subscribe(async ([currentLanguage, extensions]) => {
+            const locale = new Intl.Locale(currentLanguage);
+            const filteredExt = extensions.filter((ext) => ext.meta.culture.toLowerCase() === locale.baseName.toLowerCase() ||
+                ext.meta.culture.toLowerCase() === locale.language.toLowerCase());
+            // Only get the extensions that are not already loading/loaded:
+            const diff = filteredExt.filter((ext) => !__classPrivateFieldGet(this, _UmbLocalizationRegistry_loadedExtAliases, "f").includes(ext.alias));
+            if (diff.length !== 0) {
+                // got new localizations to load:
+                const translations = await Promise.all(diff.map(__classPrivateFieldGet(this, _UmbLocalizationRegistry_loadExtension, "f")));
+                if (translations.length) {
+                    umbLocalizationManager.registerManyLocalizations(translations);
+                    // Set the document language
+                    const newLang = locale.baseName.toLowerCase();
+                    if (document.documentElement.lang.toLowerCase() !== newLang) {
+                        document.documentElement.lang = newLang;
+                    }
+                    // Set the document direction to the direction of the primary language
+                    const newDir = translations[0].$dir ?? 'ltr';
+                    if (document.documentElement.dir !== newDir) {
+                        document.documentElement.dir = newDir;
+                    }
+                }
             }
         });
     }
@@ -77,12 +80,8 @@ export class UmbLocalizationRegistry {
      * @param locale The locale to load.
      */
     loadLanguage(locale) {
-        __classPrivateFieldGet(this, _UmbLocalizationRegistry_currentLanguage, "f").next(locale);
+        __classPrivateFieldGet(this, _UmbLocalizationRegistry_currentLanguage, "f").setValue(locale.toLowerCase());
     }
 }
-_UmbLocalizationRegistry_currentLanguage = new WeakMap(), _UmbLocalizationRegistry_isDefaultLoaded = new WeakMap(), _UmbLocalizationRegistry_instances = new WeakSet(), _UmbLocalizationRegistry_addOrUpdateDictionary = function _UmbLocalizationRegistry_addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary) {
-    for (const [key, value] of Object.entries(dictionary)) {
-        innerDictionary[`${dictionaryName}_${key}`] = value;
-    }
-};
+_UmbLocalizationRegistry_currentLanguage = new WeakMap(), _UmbLocalizationRegistry_loadedExtAliases = new WeakMap(), _UmbLocalizationRegistry_loadExtension = new WeakMap();
 export const umbLocalizationRegistry = new UmbLocalizationRegistry(umbExtensionsRegistry);

package/dist-cms/packages/core/tree/tree-menu-item-default/tree-menu-item-default.element.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, nothing, customElement, property } from '../../../../external/lit/index.js';
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
-import { umbExtensionsRegistry, } from '../../extension-registry/index.js';
+import { umbExtensionsRegistry } from '../../extension-registry/index.js';
 // TODO: Move to separate file:
 const manifest = {
     type: 'kind',

package/dist-cms/packages/core/workspace/components/workspace-split-view/workspace-split-view.element.js

@@ -45,7 +45,7 @@ UmbWorkspaceSplitViewElement.styles = [
 				display: block;
 				width: 100%;
 				height: 100%;
-				min-height: 0;
+				min-width: 0;
 			}
 
 			:host(:not(:last-child)) {

package/dist-cms/packages/documents/documents/workspace/document-workspace-split-view.element.js

@@ -54,8 +54,7 @@ UmbDocumentWorkspaceSplitViewElement.styles = [
 			}
 
 			#splitViews {
-				display: grid;
-				grid-template-columns: 50% 50%;
+				display: flex;
 				width: 100%;
 				height: calc(100% - var(--umb-footer-layout-height));
 			}