@umbraco-cms/backoffice 17.1.0 → 17.2.0-rc

package/dist-cms/packages/core/property/property-value-preset/property-value-preset-variant-builder.controller.js

@@ -1,68 +1,147 @@
 import { UmbVariantId } from '../../variant/variant-id.class.js';
 import { UmbPropertyValuePresetBuilderController } from './property-value-preset-builder.controller.js';
+import { UmbDeprecation } from '../../utils/index.js';
 export class UmbPropertyValuePresetVariantBuilderController extends UmbPropertyValuePresetBuilderController {
     #cultures = [];
     // Always declare the default segment (null)
     #segments = [null];
-    // TODO: We properly need to break this, as Engage needs to control which Segments are available for each culture, maybe investigate the option to go about a new option to just parse options.? Break in v.17.0 [NL]
+    #variantOptions;
+    /**
+     * Sets the cultures to generate values for.
+     * Cannot be used together with setVariantOptions.
+     * @param {Array<string>} cultures - Array of culture codes (e.g., ['en-US', 'da-DK'])
+     * @deprecated Use setVariantOptions instead for more fine-grained control.
+     */
     setCultures(cultures) {
+        new UmbDeprecation({
+            removeInVersion: '20.0.0',
+            deprecated: 'setCultures',
+            solution: 'Use .setVariantOptions method instead',
+        }).warn();
+        if (this.#variantOptions) {
+            throw new Error('setCultures cannot be used together with setVariantOptions.');
+        }
         this.#cultures = cultures;
     }
+    /**
+     * Sets the segments to generate values for.
+     * Cannot be used together with setVariantOptions.
+     * @param {Array<string>} segments - Array of segment aliases
+     * @deprecated Use setVariantOptions instead for more fine-grained control.
+     */
     setSegments(segments) {
+        new UmbDeprecation({
+            removeInVersion: '20.0.0',
+            deprecated: 'setSegments',
+            solution: 'Use .setVariantOptions method instead',
+        }).warn();
+        if (this.#variantOptions) {
+            throw new Error('setSegments cannot be used together with setVariantOptions.');
+        }
         // No matter how many segments are present, always include the default segment (null)
         this.#segments = [null, ...segments];
     }
+    /**
+     * Sets explicit variant options (culture + segment combinations) to generate values for.
+     * This allows fine-grained control over which culture/segment combinations are valid,
+     * supporting scenarios where segments are culture-specific.
+     * Cannot be used together with setCultures or setSegments.
+     * @param {Array<UmbVariantId>} options - Array of UmbVariantId instances representing valid culture/segment combinations
+     */
+    setVariantOptions(options) {
+        if (this.#cultures.length > 0 || this.#segments.length > 1) {
+            throw new Error('setVariantOptions cannot be used together with setCultures or setSegments.');
+        }
+        this.#variantOptions = options;
+    }
     async _generatePropertyValues(apis, propertyType) {
+        // Determine which variant options to use based on the configuration method
+        const variantOptionsToUse = this.#variantOptions
+            ? this.#getFilteredVariantOptions(propertyType)
+            : this.#buildVariantOptionsFromCulturesAndSegments(propertyType);
+        // Generate values for each variant option
         const values = [];
-        if (propertyType.typeArgs.variesBySegment && propertyType.typeArgs.variesByCulture) {
-            if (this.#cultures.length === 0) {
-                throw new Error('Cultures must be set when varying by culture.');
+        for (const variantId of variantOptionsToUse) {
+            const value = await this._generatePropertyValue(apis, propertyType, this.#makeArgsFor(propertyType.alias, variantId.culture, variantId.segment));
+            if (value) {
+                value.culture = variantId.culture;
+                value.segment = variantId.segment;
+                values.push(value);
+            }
+        }
+        return values;
+    }
+    /**
+     * Filters variant options based on property type args (variesByCulture/variesBySegment).
+     * @param {UmbPropertyTypePresetModel | UmbPropertyTypePresetWithSchemaAliasModel} propertyType - Property type model
+     * @returns {Array<UmbVariantId>} Filtered array of UmbVariantId instances
+     */
+    #getFilteredVariantOptions(propertyType) {
+        if (!this.#variantOptions) {
+            return [];
+        }
+        const variesByCulture = propertyType.typeArgs.variesByCulture;
+        const variesBySegment = propertyType.typeArgs.variesBySegment;
+        // Validate that cultures are available when property varies by culture
+        if (variesByCulture && !this.#variantOptions.some((v) => v.culture !== null)) {
+            throw new Error('Cultures must be set when varying by culture.');
+        }
+        // Filter options based on property variation settings
+        return this.#variantOptions.filter((variantId) => {
+            // If property doesn't vary by culture, only use culture-invariant options
+            if (!variesByCulture && variantId.culture !== null) {
+                return false;
             }
+            // If property does vary by culture, exclude culture-invariant options
+            if (variesByCulture && variantId.culture === null) {
+                return false;
+            }
+            // If property doesn't vary by segment, only use segment-invariant options
+            if (!variesBySegment && variantId.segment !== null) {
+                return false;
+            }
+            return true;
+        });
+    }
+    /**
+     * Builds variant options from the legacy setCultures/setSegments approach.
+     * This maintains backward compatibility with existing usage.
+     * @param {UmbPropertyTypePresetModel | UmbPropertyTypePresetWithSchemaAliasModel} propertyType - Property type model
+     * @returns {Array<UmbVariantId>} Array of UmbVariantId instances representing culture/segment combinations
+     */
+    #buildVariantOptionsFromCulturesAndSegments(propertyType) {
+        const variesByCulture = propertyType.typeArgs.variesByCulture;
+        const variesBySegment = propertyType.typeArgs.variesBySegment;
+        // Validate that cultures are set when property varies by culture
+        if (variesByCulture && this.#cultures.length === 0) {
+            throw new Error('Cultures must be set when varying by culture.');
+        }
+        const options = [];
+        if (variesByCulture && variesBySegment) {
+            // Cartesian product of cultures × segments
             for (const culture of this.#cultures) {
                 for (const segment of this.#segments) {
-                    const value = await this._generatePropertyValue(apis, propertyType, this.#makeArgsFor(propertyType.alias, culture, segment));
-                    if (value) {
-                        value.culture = culture;
-                        value.segment = segment;
-                        values.push(value);
-                    }
+                    options.push(new UmbVariantId(culture, segment));
                 }
             }
         }
-        else if (propertyType.typeArgs.variesByCulture) {
-            if (this.#cultures.length === 0) {
-                throw new Error('Cultures must be set when varying by culture.');
-            }
+        else if (variesByCulture) {
+            // Only cultures
             for (const culture of this.#cultures) {
-                const value = await this._generatePropertyValue(apis, propertyType, this.#makeArgsFor(propertyType.alias, culture, null));
-                if (value) {
-                    value.culture = culture;
-                    value.segment = null;
-                    values.push(value);
-                }
+                options.push(new UmbVariantId(culture, null));
             }
         }
-        else if (propertyType.typeArgs.variesBySegment) {
+        else if (variesBySegment) {
+            // Only segments (culture invariant)
             for (const segment of this.#segments) {
-                const value = await this._generatePropertyValue(apis, propertyType, this.#makeArgsFor(propertyType.alias, null, segment));
-                if (value) {
-                    // Be aware this maybe should have been the default culture?
-                    value.culture = null;
-                    value.segment = segment;
-                    values.push(value);
-                }
+                options.push(new UmbVariantId(null, segment));
             }
         }
         else {
-            const value = await this._generatePropertyValue(apis, propertyType, this.#makeArgsFor(propertyType.alias, null, null));
-            if (value) {
-                // Be aware this maybe should have been the default culture?
-                value.culture = null;
-                value.segment = null;
-                values.push(value);
-            }
+            // Invariant
+            options.push(new UmbVariantId(null, null));
         }
-        return values;
+        return options;
     }
     #makeArgsFor(alias, culture, segment) {
         const variantId = new UmbVariantId(culture, segment);

package/dist-cms/packages/core/property-editor-data-source/item/data/manifests.js

@@ -1,4 +1,5 @@
 import { UMB_PROPERTY_EDITOR_DATA_SOURCE_ITEM_REPOSITORY_ALIAS, UMB_PROPERTY_EDITOR_DATA_SOURCE_ITEM_STORE_ALIAS, } from './constants.js';
+import { UmbPropertyEditorDataSourceItemStore } from './item.store.js';
 export const manifests = [
     {
         type: 'repository',
@@ -10,6 +11,6 @@ export const manifests = [
         type: 'itemStore',
         alias: UMB_PROPERTY_EDITOR_DATA_SOURCE_ITEM_STORE_ALIAS,
         name: 'Property Editor Data Source Item Store',
-        api: () => import('./item.store.js'),
+        api: UmbPropertyEditorDataSourceItemStore,
     },
 ];

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/empty-recycle-bin.collection-action.d.ts

@@ -0,0 +1,18 @@
+import { UmbCollectionActionBase } from '../../../collection/action/collection-action-base.js';
+import type { ManifestCollectionActionEmptyRecycleBinKind } from './types.js';
+import type { UmbControllerHost } from '../../../../../libs/controller-api/index.js';
+/**
+ * Collection action for emptying the recycle bin.
+ * @class UmbEmptyRecycleBinCollectionAction
+ * @augments {UmbCollectionActionBase}
+ */
+export declare class UmbEmptyRecycleBinCollectionAction extends UmbCollectionActionBase {
+    #private;
+    constructor(host: UmbControllerHost, manifest: ManifestCollectionActionEmptyRecycleBinKind);
+    /**
+     * Executes the action.
+     * @memberof UmbEmptyRecycleBinCollectionAction
+     */
+    execute(): Promise<void>;
+}
+export { UmbEmptyRecycleBinCollectionAction as api };

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/empty-recycle-bin.collection-action.js

@@ -0,0 +1,63 @@
+import { UmbCollectionActionBase } from '../../../collection/action/collection-action-base.js';
+import { createExtensionApiByAlias } from '../../../extension-registry/index.js';
+import { umbConfirmModal } from '../../../modal/index.js';
+import { UmbRequestReloadChildrenOfEntityEvent } from '../../../entity-action/index.js';
+import { UMB_ACTION_EVENT_CONTEXT } from '../../../action/index.js';
+import { UMB_COLLECTION_CONTEXT } from '../../../collection/index.js';
+import { UMB_ENTITY_CONTEXT } from '../../../entity/index.js';
+/**
+ * Collection action for emptying the recycle bin.
+ * @class UmbEmptyRecycleBinCollectionAction
+ * @augments {UmbCollectionActionBase}
+ */
+export class UmbEmptyRecycleBinCollectionAction extends UmbCollectionActionBase {
+    #manifest;
+    constructor(host, manifest) {
+        super(host);
+        this.#manifest = manifest;
+    }
+    /**
+     * Executes the action.
+     * @memberof UmbEmptyRecycleBinCollectionAction
+     */
+    async execute() {
+        if (!this.#manifest.meta.recycleBinRepositoryAlias) {
+            throw new Error('Recycle Bin Repository Alias is not defined in the manifest meta');
+        }
+        await umbConfirmModal(this._host, {
+            headline: `#actions_emptyrecyclebin`,
+            content: `#defaultdialogs_recycleBinWarning`,
+            color: 'danger',
+            confirmLabel: `#actions_emptyrecyclebin`,
+        });
+        const recycleBinRepository = await createExtensionApiByAlias(this, this.#manifest.meta.recycleBinRepositoryAlias);
+        const { error } = await recycleBinRepository.requestEmpty();
+        if (error) {
+            throw error;
+        }
+        // Refresh the collection
+        const collectionContext = await this.getContext(UMB_COLLECTION_CONTEXT);
+        collectionContext?.loadCollection();
+        // Refresh the tree (if any)
+        await this.#reloadChildrenOfEntity();
+    }
+    /**
+     * Requests a reload of the children of the current entity in the tree.
+     * Silently returns if the required contexts are not available.
+     */
+    async #reloadChildrenOfEntity() {
+        const eventContext = await this.getContext(UMB_ACTION_EVENT_CONTEXT);
+        if (!eventContext)
+            return;
+        const entityContext = await this.getContext(UMB_ENTITY_CONTEXT);
+        if (!entityContext)
+            return;
+        const entityType = entityContext.getEntityType();
+        if (!entityType)
+            return;
+        const unique = entityContext.getUnique();
+        const event = new UmbRequestReloadChildrenOfEntityEvent({ entityType, unique });
+        eventContext.dispatchEvent(event);
+    }
+}
+export { UmbEmptyRecycleBinCollectionAction as api };

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/empty-recycle-bin.collection-action.kind.d.ts

@@ -0,0 +1,2 @@
+import type { UmbExtensionManifestKind } from '../../../extension-registry/index.js';
+export declare const manifest: UmbExtensionManifestKind;

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/empty-recycle-bin.collection-action.kind.js

@@ -0,0 +1,16 @@
+export const manifest = {
+    type: 'kind',
+    alias: 'Umb.Kind.CollectionAction.RecycleBin.Empty',
+    matchKind: 'emptyRecycleBin',
+    matchType: 'collectionAction',
+    manifest: {
+        type: 'collectionAction',
+        kind: 'emptyRecycleBin',
+        api: () => import('./empty-recycle-bin.collection-action.js'),
+        elementName: 'umb-collection-action-button',
+        weight: 100,
+        meta: {
+            label: '#actions_emptyrecyclebin',
+        },
+    },
+};

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/index.d.ts

@@ -0,0 +1 @@
+export type * from './types.js';

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/index.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/manifests.d.ts

@@ -0,0 +1,2 @@
+import type { UmbExtensionManifestKind } from '../../../extension-registry/index.js';
+export declare const manifests: Array<UmbExtensionManifest | UmbExtensionManifestKind>;

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/manifests.js

@@ -0,0 +1,2 @@
+import { manifest as emptyRecycleBinKindManifest } from './empty-recycle-bin.collection-action.kind.js';
+export const manifests = [emptyRecycleBinKindManifest];

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/types.d.ts

@@ -0,0 +1,14 @@
+import type { ManifestCollectionAction, MetaCollectionAction } from '../../../collection/index.js';
+export interface ManifestCollectionActionEmptyRecycleBinKind extends ManifestCollectionAction {
+    type: 'collectionAction';
+    kind: 'emptyRecycleBin';
+    meta: MetaCollectionActionEmptyRecycleBinKind;
+}
+export interface MetaCollectionActionEmptyRecycleBinKind extends MetaCollectionAction {
+    recycleBinRepositoryAlias: string;
+}
+declare global {
+    interface UmbExtensionManifestMap {
+        umbEmptyRecycleBinCollectionActionKind: ManifestCollectionActionEmptyRecycleBinKind;
+    }
+}

package/dist-cms/packages/core/recycle-bin/collection-action/empty-recycle-bin/types.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/recycle-bin/collection-action/index.d.ts

@@ -0,0 +1 @@
+export type * from './empty-recycle-bin/index.js';

package/dist-cms/packages/core/recycle-bin/collection-action/index.js

@@ -0,0 +1 @@
+export {};

package/dist-cms/packages/core/recycle-bin/collection-action/manifests.d.ts

@@ -0,0 +1,2 @@
+import type { UmbExtensionManifestKind } from '../../extension-registry/index.js';
+export declare const manifests: Array<UmbExtensionManifest | UmbExtensionManifestKind>;

package/dist-cms/packages/core/recycle-bin/collection-action/manifests.js

@@ -0,0 +1,2 @@
+import { manifests as emptyRecycleBinManifests } from './empty-recycle-bin/manifests.js';
+export const manifests = [...emptyRecycleBinManifests];

package/dist-cms/packages/core/recycle-bin/conditions/is-not-trashed/entity-is-not-trashed.condition.manifest.js

@@ -1,7 +1,8 @@
 import { UMB_ENTITY_IS_NOT_TRASHED_CONDITION_ALIAS } from './constants.js';
+import { UmbEntityIsNotTrashedCondition } from './entity-is-not-trashed.condition.js';
 export const manifest = {
     type: 'condition',
     name: 'Entity Is not trashed Condition',
     alias: UMB_ENTITY_IS_NOT_TRASHED_CONDITION_ALIAS,
-    api: () => import('./entity-is-not-trashed.condition.js'),
+    api: UmbEntityIsNotTrashedCondition,
 };

package/dist-cms/packages/core/recycle-bin/conditions/is-trashed/entity-is-trashed.condition.d.ts

@@ -1,7 +1,7 @@
 import type { UmbControllerHost } from '../../../../../libs/controller-api/index.js';
 import type { UmbConditionConfigBase, UmbConditionControllerArguments, UmbExtensionCondition } from '../../../../../libs/extension-api/index.js';
 import { UmbConditionBase } from '../../../extension-registry/index.js';
-export declare class UmbIsTrashedCondition extends UmbConditionBase<UmbConditionConfigBase> implements UmbExtensionCondition {
+export declare class UmbEntityIsTrashedCondition extends UmbConditionBase<UmbConditionConfigBase> implements UmbExtensionCondition {
     constructor(host: UmbControllerHost, args: UmbConditionControllerArguments<UmbConditionConfigBase>);
 }
-export { UmbIsTrashedCondition as api };
+export { UmbEntityIsTrashedCondition as api };

package/dist-cms/packages/core/recycle-bin/conditions/is-trashed/entity-is-trashed.condition.js

@@ -1,6 +1,6 @@
 import { UMB_IS_TRASHED_ENTITY_CONTEXT } from '../../constants.js';
 import { UmbConditionBase } from '../../../extension-registry/index.js';
-export class UmbIsTrashedCondition extends UmbConditionBase {
+export class UmbEntityIsTrashedCondition extends UmbConditionBase {
     constructor(host, args) {
         super(host, args);
         this.consumeContext(UMB_IS_TRASHED_ENTITY_CONTEXT, (context) => {
@@ -10,4 +10,4 @@ export class UmbIsTrashedCondition extends UmbConditionBase {
         });
     }
 }
-export { UmbIsTrashedCondition as api };
+export { UmbEntityIsTrashedCondition as api };

package/dist-cms/packages/core/recycle-bin/conditions/is-trashed/entity-is-trashed.condition.manifest.js

@@ -1,7 +1,8 @@
 import { UMB_ENTITY_IS_TRASHED_CONDITION_ALIAS } from './constants.js';
+import { UmbEntityIsTrashedCondition } from './entity-is-trashed.condition.js';
 export const manifest = {
     type: 'condition',
     name: 'Entity Is trashed Condition',
     alias: UMB_ENTITY_IS_TRASHED_CONDITION_ALIAS,
-    api: () => import('./entity-is-trashed.condition.js'),
+    api: UmbEntityIsTrashedCondition,
 };

package/dist-cms/packages/core/recycle-bin/entity-action/empty-recycle-bin/empty-recycle-bin.action.js

@@ -14,10 +14,10 @@ export class UmbEmptyRecycleBinEntityAction extends UmbEntityActionBase {
      */
     async execute() {
         await umbConfirmModal(this._host, {
-            headline: `Empty Recycle Bin`,
-            content: `When items are deleted from the recycle bin, they will be gone forever.`,
+            headline: `#actions_emptyrecyclebin`,
+            content: `#defaultdialogs_recycleBinWarning`,
             color: 'danger',
-            confirmLabel: 'Empty Recycle Bin',
+            confirmLabel: '#actions_emptyrecyclebin',
         });
         const recycleBinRepository = await createExtensionApiByAlias(this, this.args.meta.recycleBinRepositoryAlias);
         const { error } = await recycleBinRepository.requestEmpty();

package/dist-cms/packages/core/recycle-bin/entity-action/empty-recycle-bin/empty-recycle-bin.action.kind.js

@@ -13,7 +13,7 @@ export const manifest = {
         forEntityTypes: [],
         meta: {
             icon: 'icon-trash-empty',
-            label: 'Empty Recycle Bin',
+            label: '#actions_emptyrecyclebin',
             additionalOptions: true,
         },
     },

package/dist-cms/packages/core/recycle-bin/index.d.ts

@@ -1,6 +1,7 @@
 export * from './constants.js';
 export * from './entity-action/index.js';
 export * from './entity-bulk-action/index.js';
-export type * from './types.js';
 export { UmbRecycleBinRepositoryBase } from './recycle-bin-repository-base.js';
 export { UmbIsTrashedEntityContext } from './contexts/is-trashed/index.js';
+export type * from './collection-action/index.js';
+export type * from './types.js';

package/dist-cms/packages/core/recycle-bin/manifests.js

@@ -1,3 +1,4 @@
+import { manifests as collectionActionManifests } from './collection-action/manifests.js';
 import { manifests as conditionManifests } from './conditions/manifests.js';
 import { manifests as emptyRecycleBinEntityActionManifests } from './entity-action/empty-recycle-bin/manifests.js';
 import { manifests as restoreFromRecycleBinEntityActionManifests } from './entity-action/restore-from-recycle-bin/manifests.js';
@@ -5,6 +6,7 @@ import { manifests as trashEntityActionManifests } from './entity-action/trash/m
 import { manifests as trashEntityBulkActionManifests } from './entity-bulk-action/bulk-trash/manifests.js';
 import { manifests as treeManifests } from './tree/manifests.js';
 export const manifests = [
+    ...collectionActionManifests,
     ...conditionManifests,
     ...emptyRecycleBinEntityActionManifests,
     ...restoreFromRecycleBinEntityActionManifests,

package/dist-cms/packages/core/router/path-pattern.class.d.ts

@@ -32,6 +32,12 @@ export declare class UmbPathPattern<LocalParamsType extends UmbPathPatternParams
      * @returns
      */
     generateAbsolute(params: LocalParamsType & BaseParamsType): string;
+    /**
+     * Get the full absolute pattern string including base path.
+     * Use this when chaining patterns to preserve the full path.
+     * @returns The complete pattern string (base + local)
+     */
+    toAbsolutePatternString(): string;
     toString(): string;
 }
 export {};

package/dist-cms/packages/core/router/path-pattern.class.js

@@ -4,8 +4,9 @@ export class UmbPathPattern {
     #base;
     constructor(localPattern, basePath) {
         this.#local = localPattern;
-        basePath = basePath?.toString() ?? '';
-        this.#base = basePath.lastIndexOf('/') !== basePath.length - 1 ? basePath + '/' : basePath;
+        // Use toAbsolutePatternString() for UmbPathPattern to preserve the full path chain
+        const baseString = basePath instanceof UmbPathPattern ? basePath.toAbsolutePatternString() : (basePath?.toString() ?? '');
+        this.#base = baseString.length > 0 && !baseString.endsWith('/') ? baseString + '/' : baseString;
     }
     generateLocal(params) {
         return umbUrlPatternToString(this.#local, params);
@@ -20,6 +21,14 @@ export class UmbPathPattern {
         return ((this.#base.indexOf(':') !== -1 ? umbUrlPatternToString(this.#base, params) : this.#base) +
             umbUrlPatternToString(this.#local, params));
     }
+    /**
+     * Get the full absolute pattern string including base path.
+     * Use this when chaining patterns to preserve the full path.
+     * @returns The complete pattern string (base + local)
+     */
+    toAbsolutePatternString() {
+        return this.#base + this.#local;
+    }
     toString() {
         return this.#local;
     }

package/dist-cms/packages/core/router/route/forbidden/route-forbidden.element.js

@@ -41,7 +41,7 @@ let UmbRouteForbiddenElement = class UmbRouteForbiddenElement extends UmbLitElem
 				align-items: center;
 				height: 100%;
 				opacity: 0;
-				animation: fadeIn 2s 2s forwards;
+				animation: fadeIn 2s 0s forwards;
 			}
 
 			@keyframes fadeIn {

package/dist-cms/packages/core/router/route/index.d.ts

@@ -1,5 +1,6 @@
 export * from './forbidden/route-forbidden.element.js';
 export * from './not-found/route-not-found.element.js';
+export * from './route.context-token.js';
 export * from './route.context.js';
 export * from './router-slot-change.event.js';
 export * from './router-slot-init.event.js';

package/dist-cms/packages/core/router/route/index.js

@@ -1,5 +1,6 @@
 export * from './forbidden/route-forbidden.element.js';
 export * from './not-found/route-not-found.element.js';
+export * from './route.context-token.js';
 export * from './route.context.js';
 export * from './router-slot-change.event.js';
 export * from './router-slot-init.event.js';

package/dist-cms/packages/core/router/route/route.context-token.d.ts

@@ -0,0 +1,3 @@
+import type { UmbRouteContext } from './route.context.js';
+import { UmbContextToken } from '../../../../libs/context-api/index.js';
+export declare const UMB_ROUTE_CONTEXT: UmbContextToken<UmbRouteContext, UmbRouteContext>;

package/dist-cms/packages/core/router/route/route.context-token.js

@@ -0,0 +1,2 @@
+import { UmbContextToken } from '../../../../libs/context-api/index.js';
+export const UMB_ROUTE_CONTEXT = new UmbContextToken('UmbRouterContext');

package/dist-cms/packages/core/router/route/route.context.d.ts

@@ -1,6 +1,5 @@
 import type { IRouterSlot } from '../router-slot/index.js';
 import type { UmbModalRouteRegistration } from '../modal-registration/modal-route-registration.interface.js';
-import { UmbContextToken } from '../../../../libs/context-api/index.js';
 import type { UmbControllerHost } from '../../../../libs/controller-api/index.js';
 import { UmbContextBase } from '../../../../libs/class-api/index.js';
 export declare class UmbRouteContext extends UmbContextBase {
@@ -19,4 +18,4 @@ export declare class UmbRouteContext extends UmbContextBase {
     _internal_modalRouterChanged(activeModalPath: string | undefined): void;
     hostDisconnected(): void;
 }
-export declare const UMB_ROUTE_CONTEXT: UmbContextToken<UmbRouteContext, UmbRouteContext>;
+export { UMB_ROUTE_CONTEXT } from './route.context-token.js';

package/dist-cms/packages/core/router/route/route.context.js

@@ -1,7 +1,8 @@
 import { umbGenerateRoutePathBuilder } from '../generate-route-path-builder.function.js';
-import { UmbContextToken } from '../../../../libs/context-api/index.js';
+// Import UMB_MODAL_MANAGER_CONTEXT directly from token file to avoid circular dependency with router package
+import { UMB_MODAL_MANAGER_CONTEXT } from '../../modal/context/modal-manager.context-token.js';
+import { UMB_ROUTE_CONTEXT } from './route.context-token.js';
 import { UmbContextBase } from '../../../../libs/class-api/index.js';
-import { UMB_MODAL_MANAGER_CONTEXT } from '../../modal/index.js';
 import { UmbStringState, mergeObservables } from '../../../../libs/observable-api/index.js';
 const EmptyDiv = document.createElement('div');
 export class UmbRouteContext extends UmbContextBase {
@@ -150,4 +151,5 @@ export class UmbRouteContext extends UmbContextBase {
         this._internal_modalRouterChanged(undefined);
     }
 }
-export const UMB_ROUTE_CONTEXT = new UmbContextToken('UmbRouterContext');
+// Re-export for backwards compatibility
+export { UMB_ROUTE_CONTEXT } from './route.context-token.js';

package/dist-cms/packages/core/router/route/router-slot.element.d.ts

@@ -21,13 +21,13 @@ export declare class UmbRouterSlotElement extends UmbLitElement {
     private _activeLocalPath?;
     get localActiveViewPath(): string | undefined;
     get absoluteActiveViewPath(): string;
+    protected _updateRouterPath: () => void;
     constructor();
     protected _constructAbsoluteRouterPath(): string;
     protected _constructLocalRouterPath(): string;
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
-    protected _updateRouterPath(): void;
     private _onNavigationChanged;
     render(): import("lit-html").TemplateResult<1>;
     static styles: import("lit").CSSResult[];

package/dist-cms/packages/core/router/route/router-slot.element.js

@@ -54,6 +54,21 @@ let UmbRouterSlotElement = class UmbRouterSlotElement extends UmbLitElement {
         this.#modalRouter = document.createElement('router-slot');
         this.#listening = false;
         this.#routeContext = new UmbRouteContext(this, this.#router, this.#modalRouter);
+        // Event handler as arrow function to maintain consistent reference
+        this._updateRouterPath = () => {
+            const newAbsolutePath = this._constructAbsoluteRouterPath();
+            if (this._routerPath !== newAbsolutePath) {
+                this._routerPath = newAbsolutePath;
+                this.#routeContext._internal_routerGotBasePath(this._routerPath);
+                this.dispatchEvent(new UmbRouterSlotInitEvent());
+                const newActiveLocalPath = this._constructLocalRouterPath();
+                if (this._activeLocalPath !== newActiveLocalPath) {
+                    this._activeLocalPath = newActiveLocalPath;
+                    this.#routeContext._internal_routerGotActiveLocalPath(this._activeLocalPath);
+                    this.dispatchEvent(new UmbRouterSlotChangeEvent());
+                }
+            }
+        };
         this._onNavigationChanged = (event) => {
             if (event.detail.slot === this.#router) {
                 const newActiveLocalPath = this._constructLocalRouterPath();
@@ -70,7 +85,7 @@ let UmbRouterSlotElement = class UmbRouterSlotElement extends UmbLitElement {
         };
         this.#modalRouter.parent = this.#router;
         this.#modalRouter.style.display = 'none';
-        this.#router.addEventListener('changestate', this._updateRouterPath.bind(this));
+        this.#router.addEventListener('changestate', this._updateRouterPath);
         this.#router.appendChild(document.createElement('slot'));
     }
     _constructAbsoluteRouterPath() {
@@ -93,6 +108,7 @@ let UmbRouterSlotElement = class UmbRouterSlotElement extends UmbLitElement {
         }
     }
     disconnectedCallback() {
+        this.#router.removeEventListener('changestate', this._updateRouterPath);
         window.removeEventListener('navigationsuccess', this._onNavigationChanged);
         this.#listening = false;
         // Close modals opened by this router slot.
@@ -103,20 +119,6 @@ let UmbRouterSlotElement = class UmbRouterSlotElement extends UmbLitElement {
         super.firstUpdated(_changedProperties);
         this._updateRouterPath();
     }
-    _updateRouterPath() {
-        const newAbsolutePath = this._constructAbsoluteRouterPath();
-        if (this._routerPath !== newAbsolutePath) {
-            this._routerPath = newAbsolutePath;
-            this.#routeContext._internal_routerGotBasePath(this._routerPath);
-            this.dispatchEvent(new UmbRouterSlotInitEvent());
-            const newActiveLocalPath = this._constructLocalRouterPath();
-            if (this._activeLocalPath !== newActiveLocalPath) {
-                this._activeLocalPath = newActiveLocalPath;
-                this.#routeContext._internal_routerGotActiveLocalPath(this._activeLocalPath);
-                this.dispatchEvent(new UmbRouterSlotChangeEvent());
-            }
-        }
-    }
     render() {
         return html `${this.#router}${this.#modalRouter}`;
     }