@igo2/context 21.0.0-next.3 → 21.0.0-next.5

package/fesm2022/igo2-context.mjs

@@ -256,13 +256,13 @@ function stringifyType(value) {
 function parseLayerType(params, key) {
     const param = extractParam(params, key);
     if (!param) {
-        return;
+        return undefined;
     }
     const type = Number(param);
     return ServiceTypeEnum[type];
 }
-function stringifyCenter(values) {
-    return values.map(formatNumber).join(',');
+function stringifyCenter(value) {
+    return value.map(formatNumber).join(',');
 }
 function parseCenter(params) {
     if (!params?.startsWith('@')) {
@@ -278,7 +278,7 @@ function parseCenter(params) {
 function parseRotation(params, key) {
     const param = extractParam(params, key);
     if (!param) {
-        return;
+        return undefined;
     }
     const degree = parseInteger(param);
     return (degree * Math.PI) / 180;
@@ -286,21 +286,21 @@ function parseRotation(params, key) {
 function parseIntergerParam(params, key) {
     const param = extractParam(params, key);
     if (!param) {
-        return;
+        return undefined;
     }
     return parseInteger(param);
 }
 function parseBooleanParam(params, key) {
     const param = extractParam(params, key);
     if (!param) {
-        return;
+        return undefined;
     }
     return parseBoolean(param);
 }
 function parseFloatParam(params, key) {
     const param = extractParam(params, key);
     if (!param) {
-        return;
+        return undefined;
     }
     return parseFloat(param);
 }
@@ -343,7 +343,9 @@ function buildDataSourceOptions(type, url, layers, version) {
     const arcgisClause = type === 'arcgisrest' ||
         type === 'imagearcgisrest' ||
         type === 'tilearcgisrest';
-    const params = type === 'wms' ? { LAYERS: layers.join(','), VERSION: version } : undefined;
+    const params = type === 'wms'
+        ? { LAYERS: layers.join(','), ...(version ? { VERSION: version } : {}) }
+        : undefined;
     const layer = isLayerType ? layers.join(',') : undefined;
     const baseParams = {
         type: type,
@@ -418,7 +420,7 @@ class ShareMapEncoder {
         const layers = [
             map.layerController.baseLayer,
             ...map.layerController.layersFlattened
-        ].filter(Boolean);
+        ].filter((l) => !!l);
         const urlParams = this.getBaseUrlConfig(map.viewController);
         this.buildQueryUrl(layers, urlParams);
         const [baseUrl] = this.document.location.href.split('?');
@@ -431,7 +433,7 @@ class ShareMapEncoder {
      */
     replaceGroupLocalIds(layers) {
         const idMap = new Map();
-        const existingIds = new Set(layers.map((layer) => layer.id).filter(Boolean));
+        const existingIds = new Set(layers.map((layer) => layer.id).filter((id) => id != null));
         // eslint-disable-next-line prefer-const
         let counter = 1;
         layers.forEach((layer) => {
@@ -451,11 +453,11 @@ class ShareMapEncoder {
     }
     getCurrentContext() {
         return ObjectUtils.removeUndefined({
-            layers: this.context?.layers,
-            center: this.context?.map.view.center,
-            projection: this.context?.map.view.projection,
-            zoom: this.context?.map.view.zoom,
-            rotation: this.context?.map.view.rotation
+            layers: this.context?.layers ?? [],
+            center: this.context?.map?.view.center,
+            projection: this.context?.map?.view.projection,
+            zoom: this.context?.map?.view.zoom,
+            rotation: this.context?.map?.view.rotation
         });
     }
     /**
@@ -502,10 +504,12 @@ class ShareMapEncoder {
     getContextLayersMap() {
         const ctxLayers = this.getCurrentContext()?.layers || [];
         const ctxFlattened = getFlattenOptions(ctxLayers);
-        return new Map(ctxFlattened.map((lctx) => {
+        return new Map(ctxFlattened
+            .map((lctx) => {
             const identifier = getLayerOptionIdentifier(lctx);
-            return [identifier, lctx];
-        }));
+            return [identifier ?? '', lctx];
+        })
+            .filter(([key]) => key !== ''));
     }
     /**
      * Filters layers and context layers based on visibility, opacity, and expanded state.
@@ -522,7 +526,7 @@ class ShareMapEncoder {
             const visibilityChange = layer.visible !== (ctxLayer.visible ?? true);
             const opacityChange = layer.opacity !== (ctxLayer.opacity ?? 1);
             const layerParentId = this.getIdsNestedParent(layer)?.join('.');
-            const ctxParentId = ctxLayer.parentId ?? findParentId(this.context.layers, ctxLayer);
+            const ctxParentId = ctxLayer.parentId ?? findParentId(this.context?.layers ?? [], ctxLayer);
             const parentIdChange = ctxParentId !== layerParentId;
             let expandedChange = false;
             let titleChange = false;
@@ -595,7 +599,9 @@ class ShareMapEncoder {
                 .params;
             return params.LAYERS;
         }
-        return 'layer' in dataSourceOptions ? dataSourceOptions.layer : '';
+        return 'layer' in dataSourceOptions
+            ? (dataSourceOptions.layer ?? '')
+            : '';
     }
     getWmsVersion(dataSourceOptions) {
         const params = dataSourceOptions?.params;
@@ -604,7 +610,7 @@ class ShareMapEncoder {
             : undefined;
     }
     concatUrlWithVersion(dataSourceOptions) {
-        const url = dataSourceOptions.url;
+        const url = dataSourceOptions.url ?? '';
         if (dataSourceOptions.type.toLowerCase() === 'wms') {
             const version = this.getWmsVersion(dataSourceOptions);
             if (version) {
@@ -613,7 +619,7 @@ class ShareMapEncoder {
                 return `${url}${operator}${versionDef.key}=${version}`;
             }
         }
-        return dataSourceOptions.url;
+        return url;
     }
     getLayerParams(layer) {
         const dataSourceOptions = layer.dataSource.options;
@@ -621,7 +627,7 @@ class ShareMapEncoder {
             ? this.hasLayerId(this.context.layers, layer.id)
             : false;
         return {
-            index: undefined,
+            index: 0,
             ...(isExisting
                 ? { id: layer.id }
                 : {
@@ -750,8 +756,11 @@ class ShareMapEncoder {
         const definitions = this.SHARE_MAP_DEFS.pos.params;
         const { center, ...restPosition } = position;
         const stringifiedParams = this.stringifyDefinitions(restPosition, definitions);
+        const centerDef = definitions.center;
         const result = [
-            `${definitions.center.key}${definitions.center.stringify(center)}`,
+            centerDef && center
+                ? `${centerDef.key}${centerDef.stringify(center)}`
+                : undefined,
             stringifiedParams
         ].filter(Boolean);
         return result.join(',');
@@ -759,10 +768,14 @@ class ShareMapEncoder {
     stringifyDefinitions(values, definitions) {
         const result = Object.keys(ObjectUtils.removeUndefined(values))
             .map((key) => {
-            const { key: defKey, stringify } = definitions[key];
+            const def = definitions[key];
+            if (!def)
+                return undefined;
+            const { key: defKey, stringify } = def;
             const value = stringify ? stringify(values[key]) : values[key];
             return `${value}${defKey}`;
         })
+            .filter(Boolean)
             .join(',');
         return result === '' ? undefined : result;
     }
@@ -798,7 +811,7 @@ class ShareMapLegacyParser {
         this.options = options;
     }
     parseUrl(params) {
-        const layerOptions = ServiceType.flatMap((type) => this.readLayersQueryParamsByType(params, type)).filter(Boolean);
+        const layerOptions = ServiceType.flatMap((type) => this.readLayersQueryParamsByType(params, type)).filter((l) => !!l);
         return layerOptions;
     }
     parsePosition(params) {
@@ -836,7 +849,8 @@ class ShareMapLegacyParser {
         const { layersKey, wmsUrlKey, wmsLayersKey, wmtsUrlKey, wmtsLayersKey, arcgisUrlKey, arcgisLayersKey, iarcgisUrlKey, iarcgisLayersKey, tarcgisUrlKey, tarcgisLayersKey } = this.options;
         switch (type) {
             case 'wms':
-                if ((params[layersKey] || params[wmsLayersKey]) && params[wmsUrlKey]) {
+                if ((params[layersKey] || params[wmsLayersKey]) &&
+                    params[wmsUrlKey]) {
                     urlsKey = wmsUrlKey;
                     nameParamLayersKey = params[wmsLayersKey] ? wmsLayersKey : layersKey;
                 }
@@ -872,7 +886,7 @@ class ShareMapLegacyParser {
         return [nameParamLayersKey, urlsKey];
     }
     sanitizeUrl(url) {
-        const version = this.getQueryParam('version', url.toLocaleLowerCase()) || undefined;
+        const version = this.getQueryParam('version', url.toLocaleLowerCase()) ?? undefined;
         if (version) {
             const versionRegex = new RegExp(`[?&]version=${version}`, 'i');
             url = url.replace(versionRegex, '').replace(/[?&]$/, '');
@@ -888,14 +902,14 @@ class ShareMapLegacyParser {
             const httpParams = new HttpParams({ fromString: url.split('?')[1] });
             paramValue = httpParams.get(name);
         }
-        return paramValue;
+        return paramValue ?? undefined;
     }
     extractLayersByService(layersByService) {
         if (!layersByService.includes(':igoz')) {
             return [
                 {
                     layers: layersByService.split(','),
-                    zIndex: null
+                    zIndex: undefined
                 }
             ];
         }
@@ -988,7 +1002,7 @@ class ShareMapParser {
         const groupsOptions = groupsArray.map((layer) => this.parseGroup(layer));
         const layersOptions = layersArray
             .map((layer) => this.parseLayer(layer, urlsArray))
-            .filter(Boolean);
+            .filter((l) => !!l);
         return [...groupsOptions, ...layersOptions];
     }
     splitParam(value, delimiter) {
@@ -1001,10 +1015,16 @@ class ShareMapParser {
         }
         const { center, zoom, rotation, projection } = this.keysDefinitions.pos.params;
         return ObjectUtils.removeUndefined({
-            center: center.parse(position),
-            zoom: zoom.parse(position),
-            rotation: rotation.parse(position),
-            projection: projection.parse(position)
+            center: center?.parse
+                ? center.parse(position)
+                : undefined,
+            zoom: zoom?.parse ? zoom.parse(position) : undefined,
+            rotation: rotation?.parse
+                ? rotation.parse(position)
+                : undefined,
+            projection: projection?.parse
+                ? projection.parse(position)
+                : undefined
         });
     }
     parseLayer(layer, urls) {
@@ -1053,10 +1073,12 @@ class ShareMapParser {
     }
     extractVersionFromUrl(url) {
         const versionDef = this.keysDefinitions.layers.params.version;
-        return versionDef.parse(url);
+        return versionDef?.parse ? versionDef.parse(url) : undefined;
     }
     extractLayerId(layer) {
-        const { id } = this.keysDefinitions.layers.params;
+        const id = this.keysDefinitions.layers.params.id;
+        if (!id)
+            return undefined;
         const regex = new RegExp(`([a-zA-Z0-9_]+)${id.key}\\b`);
         const match = layer.match(regex);
         return match ? match[1] : undefined;
@@ -1068,7 +1090,9 @@ class ShareMapParser {
         return match ? parseInt(match[1], 10) : undefined;
     }
     extractLayerNames(layer) {
-        const { names } = this.keysDefinitions.layers.params;
+        const names = this.keysDefinitions.layers.params.names;
+        if (!names)
+            return undefined;
         const pattern = new RegExp(`\\[.*?\\]${names.key}`, 'g');
         const matches = layer.match(pattern);
         if (!matches)
@@ -1140,10 +1164,12 @@ class ShareMapService {
         return queryString !== '' ? `${base}?${queryString}&` : `${base}?`;
     }
     getContext(params) {
-        return (params[this.options.context] ?? params[this.optionsLegacy.contextKey]);
+        const legacyKey = this.optionsLegacy.contextKey;
+        return (params[this.options.context] ??
+            (legacyKey ? params[legacyKey] : undefined));
     }
     getZoom(params) {
-        return this.parsePosition(params).zoom;
+        return this.parsePosition(params)?.zoom;
     }
     getUrlWithApi(formValues) {
         const loc = this.document.location;
@@ -1161,10 +1187,10 @@ class ShareMapService {
         const { projectionKey, rotationKey, zoomKey, centerKey } = this.optionsLegacy;
         const { pos } = this.keysDefinitions;
         return Boolean(params[pos.key] ||
-            params[projectionKey] ||
-            params[rotationKey] ||
-            params[zoomKey] ||
-            params[centerKey]);
+            (projectionKey && params[projectionKey]) ||
+            (rotationKey && params[rotationKey]) ||
+            (zoomKey && params[zoomKey]) ||
+            (centerKey && params[centerKey]));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapService, providedIn: 'root' });
@@ -1307,7 +1333,8 @@ class ContextService {
     }
     delete(id, imported = false) {
         const contexts = { ours: [] };
-        Object.keys(this.contexts$.value).forEach((key) => (contexts[key] = this.contexts$.value[key].filter((c) => c.id !== id)));
+        Object.keys(this.contexts$.value).forEach((key) => (contexts[key] =
+            this.contexts$.value[key]?.filter((c) => c.id !== id) ?? []));
         if (imported) {
             this.importedContext = this.importedContext.filter((c) => c.id !== id);
             return of(this.contexts$.next(contexts));
@@ -1616,9 +1643,7 @@ class ContextService {
         if (this.baseUrl) {
             let contextToLoad;
             for (const key of Object.keys(this.contexts$.value)) {
-                contextToLoad = this.contexts$.value[key].find((c) => {
-                    return c.uri === uri;
-                });
+                contextToLoad = this.contexts$.value[key]?.find((c) => c.uri === uri);
                 if (contextToLoad) {
                     break;
                 }
@@ -1679,7 +1704,9 @@ class ContextService {
                 this.getDefault().subscribe();
             }
         }
-        const editedFound = this.findContext(editedContext);
+        const editedFound = editedContext
+            ? this.findContext(editedContext)
+            : undefined;
         if (!editedFound || editedFound.permission !== 'write') {
             this.setEditedContext(undefined);
         }
@@ -1707,8 +1734,7 @@ class ContextService {
         const contexts = this.contexts$.value;
         let found;
         for (const key of Object.keys(contexts)) {
-            const value = contexts[key];
-            found = value.find((c) => (context.id && c.id === context.id) ||
+            found = contexts[key]?.find((c) => (context.id && c.id === context.id) ||
                 (context.uri && c.uri === context.uri));
             if (found) {
                 break;
@@ -1776,7 +1802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
 
 function handleFileExportError(error, messageService) {
     if (error instanceof ExportNothingToExportError) {
-        this.handleNothingToExportError(messageService);
+        handleNothingToExportError(messageService);
         return;
     }
     messageService.error('igo.context.contextImportExport.export.failed.text', 'igo.context.contextImportExport.export.failed.title');
@@ -1839,7 +1865,10 @@ function handleFileImportError(file, error, messageService, sizeMb) {
         'File is too large': handleSizeFileImportError,
         'Failed to read file': handleUnreadbleFileImportError
     };
-    errMapping[error.message](file, error, messageService, sizeMb);
+    const handler = errMapping[error.message];
+    if (handler) {
+        handler(file, error, messageService, sizeMb);
+    }
 }
 function handleInvalidFileImportError(file, error, messageService) {
     messageService.error('igo.context.contextImportExport.import.invalid.text', 'igo.context.contextImportExport.import.invalid.title', undefined, {
@@ -1870,7 +1899,7 @@ function addContextToContextList(context, contextTitle, contextService) {
     contextService.loadContext(context.uri);
 }
 function getFileExtension(file) {
-    return file.name.split('.').pop().toLowerCase();
+    return file.name.split('.').pop()?.toLowerCase() ?? '';
 }
 function computeLayerTitleFromFile(file) {
     return file.name.substr(0, file.name.lastIndexOf('.'));
@@ -1898,6 +1927,7 @@ function addImportedFeaturesToMap(extraFeatures, map) {
         isIgoInternalLayer: true,
         source,
         igoStyle: { editable },
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         style: randomStyle,
         visible: extraFeatures.visible,
         opacity: extraFeatures.opacity
@@ -1907,26 +1937,36 @@ function addImportedFeaturesToMap(extraFeatures, map) {
 }
 function addImportedFeaturesStyledToMap(extraFeatures, map, styleListService, styleService) {
     let style;
-    let distance;
+    let distance = 0;
     if (styleListService.getStyleList(extraFeatures.name + '.styleByAttribute')) {
         const styleByAttribute = styleListService.getStyleList(extraFeatures.name + '.styleByAttribute');
         style = (feature, resolution) => {
-            return styleService.createStyleByAttribute(feature, styleByAttribute, resolution);
+            return styleService.createStyleByAttribute(
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            feature, styleByAttribute, resolution);
         };
     }
     else if (styleListService.getStyleList(extraFeatures.name + '.clusterStyle')) {
         const clusterParam = styleListService.getStyleList(extraFeatures.name + '.clusterParam');
         distance = styleListService.getStyleList(extraFeatures.name + '.distance');
         style = (feature, resolution) => {
-            const baseStyle = styleService.createStyle(styleListService.getStyleList(extraFeatures.name + '.clusterStyle'), feature, resolution);
-            return styleService.createClusterStyle(feature, resolution, clusterParam, baseStyle);
+            const baseStyle = styleService.createStyle(styleListService.getStyleList(extraFeatures.name + '.clusterStyle'), 
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            feature, resolution);
+            return styleService.createClusterStyle(
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            feature, resolution, clusterParam, baseStyle);
         };
     }
     else if (styleListService.getStyleList(extraFeatures.name + '.style')) {
-        style = (feature, resolution) => styleService.createStyle(styleListService.getStyleList(extraFeatures.name + '.style'), feature, resolution);
+        style = (feature, resolution) => styleService.createStyle(styleListService.getStyleList(extraFeatures.name + '.style'), 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        feature, resolution);
     }
     else {
-        style = (feature, resolution) => styleService.createStyle(styleListService.getStyleList('default.style'), feature, resolution);
+        style = (feature, resolution) => styleService.createStyle(styleListService.getStyleList('default.style'), 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        feature, resolution);
     }
     let source;
     const olFeatures = collectFeaturesFromExtraFeatures(extraFeatures);
@@ -1937,7 +1977,7 @@ function addImportedFeaturesStyledToMap(extraFeatures, map, styleListService, st
             queryable: true
         };
         source = new ClusterDataSource(sourceOptions);
-        source.ol.source.addFeatures(olFeatures);
+        source.ol?.addFeatures(olFeatures);
     }
     else {
         const sourceOptions = {
@@ -1951,7 +1991,8 @@ function addImportedFeaturesStyledToMap(extraFeatures, map, styleListService, st
         title: extraFeatures.name,
         isIgoInternalLayer: true,
         source,
-        style,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        style: style,
         opacity: extraFeatures.opacity,
         visible: extraFeatures.visible
     });
@@ -2059,7 +2100,7 @@ class ContextImportExportComponent {
     clientSideFileSizeMax;
     fileSizeMb;
     activeImportExport = 'import';
-    map = input(undefined, ...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
     constructor() {
         this.buildForm();
     }
@@ -2118,11 +2159,10 @@ class ContextImportExportComponent {
         handleFileExportSuccess(this.messageService);
     }
     selectAll(e) {
-        if (e._selected) {
+        if (e.selected) {
             this.form.controls.layers.setValue(this.userControlledLayerList);
-            e._selected = true;
         }
-        if (e._selected === false) {
+        else {
             this.form.controls.layers.setValue([]);
         }
     }
@@ -2130,7 +2170,7 @@ class ContextImportExportComponent {
         this.activeImportExport = event.value;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextImportExportComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextImportExportComponent, isStandalone: true, selector: "igo-context-import-export", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"activeImportExport\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (activeImportExport === 'import') {\n  <div>\n    <form class=\"igo-form\">\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          (click)=\"fileInput.click()\"\n          [disabled]=\"loading$ | async\"\n        >\n          {{ 'igo.geo.importExportForm.importButton' | translate }}\n        </button>\n        <igo-spinner [shown]=\"loading$ | async\" />\n        <input\n          #fileInput\n          type=\"file\"\n          [style.display]=\"'none'\"\n          (click)=\"fileInput.value = null\"\n          (change)=\"importFiles($any($event.target).files)\"\n        />\n      </div>\n    </form>\n    <section>\n      <h4>{{ 'igo.geo.importExportForm.importClarifications' | translate }}</h4>\n      <ul>\n        <li>\n          {{\n            'igo.geo.importExportForm.importSizeMax'\n              | translate: { size: fileSizeMb }\n          }}\n        </li>\n      </ul>\n    </section>\n  </div>\n}\n\n@if (activeImportExport === 'export') {\n  <form class=\"igo-form\" [formGroup]=\"form\">\n    <div class=\"igo-input-container\">\n      <mat-form-field class=\"example-full-width\">\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportContextName' | translate\n        }}</mat-label>\n        <input formControlName=\"name\" matInput [value]=\"\" />\n      </mat-form-field>\n    </div>\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportPlaceHolder' | translate\n        }}</mat-label>\n        <mat-select formControlName=\"layers\" multiple>\n          <mat-option [value]=\"1\" (click)=\"selectAll(e)\" #e>\n            {{\n              'igo.context.contextImportExport.export.exportSelectAll'\n                | translate\n            }}\n          </mat-option>\n          <mat-divider />\n          @for (layer of userControlledLayerList; track layer) {\n            <mat-option [value]=\"layer\">{{ layer.title }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"button\"\n        [disabled]=\"!form.valid || (loading$ | async)\"\n        (click)=\"handleExportFormSubmit(form.value)\"\n      >\n        {{ 'igo.geo.importExportForm.exportButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"loading$ | async\" />\n    </div>\n  </form>\n}\n", styles: [".import-export-toggle{padding:10px;text-align:center}.import-export-toggle mat-button-toggle-group{width:100%}.import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}.igo-input-container{padding:10px}.igo-input-container mat-form-field{width:100%}h4{padding:0 5px}.igo-form{padding:15px 5px}.igo-form-button-group{text-align:center;padding-top:10px}igo-spinner{position:absolute;padding-left:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: SpinnerComponent, selector: "igo-spinner", inputs: ["shown"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextImportExportComponent, isStandalone: true, selector: "igo-context-import-export", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"activeImportExport\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (activeImportExport === 'import') {\n  <div>\n    <form class=\"igo-form\">\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          (click)=\"fileInput.click()\"\n          [disabled]=\"loading$ | async\"\n        >\n          {{ 'igo.geo.importExportForm.importButton' | translate }}\n        </button>\n        <igo-spinner [shown]=\"(loading$ | async) ?? false\" />\n        <input\n          #fileInput\n          type=\"file\"\n          [style.display]=\"'none'\"\n          (click)=\"fileInput.value = ''\"\n          (change)=\"importFiles($any($event.target).files)\"\n        />\n      </div>\n    </form>\n    <section>\n      <h4>{{ 'igo.geo.importExportForm.importClarifications' | translate }}</h4>\n      <ul>\n        <li>\n          {{\n            'igo.geo.importExportForm.importSizeMax'\n              | translate: { size: fileSizeMb }\n          }}\n        </li>\n      </ul>\n    </section>\n  </div>\n}\n\n@if (activeImportExport === 'export') {\n  <form class=\"igo-form\" [formGroup]=\"form\">\n    <div class=\"igo-input-container\">\n      <mat-form-field class=\"example-full-width\">\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportContextName' | translate\n        }}</mat-label>\n        <input formControlName=\"name\" matInput [value]=\"\" />\n      </mat-form-field>\n    </div>\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportPlaceHolder' | translate\n        }}</mat-label>\n        <mat-select formControlName=\"layers\" multiple>\n          <mat-option [value]=\"1\" (click)=\"selectAll(e)\" #e>\n            {{\n              'igo.context.contextImportExport.export.exportSelectAll'\n                | translate\n            }}\n          </mat-option>\n          <mat-divider />\n          @for (layer of userControlledLayerList; track layer) {\n            <mat-option [value]=\"layer\">{{ layer.title }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"button\"\n        [disabled]=\"!form.valid || (loading$ | async)\"\n        (click)=\"handleExportFormSubmit(form.value)\"\n      >\n        {{ 'igo.geo.importExportForm.exportButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"(loading$ | async) ?? false\" />\n    </div>\n  </form>\n}\n", styles: [".import-export-toggle{padding:10px;text-align:center}.import-export-toggle mat-button-toggle-group{width:100%}.import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}.igo-input-container{padding:10px}.igo-input-container mat-form-field{width:100%}h4{padding:0 5px}.igo-form{padding:15px 5px}.igo-form-button-group{text-align:center;padding-top:10px}igo-spinner{position:absolute;padding-left:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: SpinnerComponent, selector: "igo-spinner", inputs: ["shown"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextImportExportComponent, decorators: [{
             type: Component,
@@ -2147,8 +2187,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatDividerModule,
                         AsyncPipe,
                         IgoLanguageModule
-                    ], template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"activeImportExport\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (activeImportExport === 'import') {\n  <div>\n    <form class=\"igo-form\">\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          (click)=\"fileInput.click()\"\n          [disabled]=\"loading$ | async\"\n        >\n          {{ 'igo.geo.importExportForm.importButton' | translate }}\n        </button>\n        <igo-spinner [shown]=\"loading$ | async\" />\n        <input\n          #fileInput\n          type=\"file\"\n          [style.display]=\"'none'\"\n          (click)=\"fileInput.value = null\"\n          (change)=\"importFiles($any($event.target).files)\"\n        />\n      </div>\n    </form>\n    <section>\n      <h4>{{ 'igo.geo.importExportForm.importClarifications' | translate }}</h4>\n      <ul>\n        <li>\n          {{\n            'igo.geo.importExportForm.importSizeMax'\n              | translate: { size: fileSizeMb }\n          }}\n        </li>\n      </ul>\n    </section>\n  </div>\n}\n\n@if (activeImportExport === 'export') {\n  <form class=\"igo-form\" [formGroup]=\"form\">\n    <div class=\"igo-input-container\">\n      <mat-form-field class=\"example-full-width\">\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportContextName' | translate\n        }}</mat-label>\n        <input formControlName=\"name\" matInput [value]=\"\" />\n      </mat-form-field>\n    </div>\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportPlaceHolder' | translate\n        }}</mat-label>\n        <mat-select formControlName=\"layers\" multiple>\n          <mat-option [value]=\"1\" (click)=\"selectAll(e)\" #e>\n            {{\n              'igo.context.contextImportExport.export.exportSelectAll'\n                | translate\n            }}\n          </mat-option>\n          <mat-divider />\n          @for (layer of userControlledLayerList; track layer) {\n            <mat-option [value]=\"layer\">{{ layer.title }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"button\"\n        [disabled]=\"!form.valid || (loading$ | async)\"\n        (click)=\"handleExportFormSubmit(form.value)\"\n      >\n        {{ 'igo.geo.importExportForm.exportButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"loading$ | async\" />\n    </div>\n  </form>\n}\n", styles: [".import-export-toggle{padding:10px;text-align:center}.import-export-toggle mat-button-toggle-group{width:100%}.import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}.igo-input-container{padding:10px}.igo-input-container mat-form-field{width:100%}h4{padding:0 5px}.igo-form{padding:15px 5px}.igo-form-button-group{text-align:center;padding-top:10px}igo-spinner{position:absolute;padding-left:10px}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: false }] }] } });
+                    ], template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"activeImportExport\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (activeImportExport === 'import') {\n  <div>\n    <form class=\"igo-form\">\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          (click)=\"fileInput.click()\"\n          [disabled]=\"loading$ | async\"\n        >\n          {{ 'igo.geo.importExportForm.importButton' | translate }}\n        </button>\n        <igo-spinner [shown]=\"(loading$ | async) ?? false\" />\n        <input\n          #fileInput\n          type=\"file\"\n          [style.display]=\"'none'\"\n          (click)=\"fileInput.value = ''\"\n          (change)=\"importFiles($any($event.target).files)\"\n        />\n      </div>\n    </form>\n    <section>\n      <h4>{{ 'igo.geo.importExportForm.importClarifications' | translate }}</h4>\n      <ul>\n        <li>\n          {{\n            'igo.geo.importExportForm.importSizeMax'\n              | translate: { size: fileSizeMb }\n          }}\n        </li>\n      </ul>\n    </section>\n  </div>\n}\n\n@if (activeImportExport === 'export') {\n  <form class=\"igo-form\" [formGroup]=\"form\">\n    <div class=\"igo-input-container\">\n      <mat-form-field class=\"example-full-width\">\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportContextName' | translate\n        }}</mat-label>\n        <input formControlName=\"name\" matInput [value]=\"\" />\n      </mat-form-field>\n    </div>\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextImportExport.export.exportPlaceHolder' | translate\n        }}</mat-label>\n        <mat-select formControlName=\"layers\" multiple>\n          <mat-option [value]=\"1\" (click)=\"selectAll(e)\" #e>\n            {{\n              'igo.context.contextImportExport.export.exportSelectAll'\n                | translate\n            }}\n          </mat-option>\n          <mat-divider />\n          @for (layer of userControlledLayerList; track layer) {\n            <mat-option [value]=\"layer\">{{ layer.title }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"button\"\n        [disabled]=\"!form.valid || (loading$ | async)\"\n        (click)=\"handleExportFormSubmit(form.value)\"\n      >\n        {{ 'igo.geo.importExportForm.exportButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"(loading$ | async) ?? false\" />\n    </div>\n  </form>\n}\n", styles: [".import-export-toggle{padding:10px;text-align:center}.import-export-toggle mat-button-toggle-group{width:100%}.import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}.igo-input-container{padding:10px}.igo-input-container mat-form-field{width:100%}h4{padding:0 5px}.igo-form{padding:15px 5px}.igo-form-button-group{text-align:center;padding-top:10px}igo-spinner{position:absolute;padding-left:10px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }] } });
 
 /**
  * @deprecated import the ContextImportExportComponent directly
@@ -2175,9 +2215,9 @@ class ContextFormComponent {
     clipboard = inject(Clipboard);
     formBuilder = inject(UntypedFormBuilder);
     messageService = inject(MessageService);
-    prefix;
+    prefix = '';
     btnSubmitText = input(...(ngDevMode ? [undefined, { debugName: "btnSubmitText" }] : /* istanbul ignore next */ []));
-    context = input(...(ngDevMode ? [undefined, { debugName: "context" }] : /* istanbul ignore next */ []));
+    context = input.required(...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     submitForm = output();
     clone = output();
@@ -2210,7 +2250,7 @@ class ContextFormComponent {
     }
     buildForm(context) {
         const uriSplit = context.uri.split('-');
-        this.prefix = uriSplit.shift();
+        this.prefix = uriSplit.shift() ?? '';
         const uri = uriSplit.join('-');
         return this.formBuilder.group({
             title: [context.title],
@@ -2218,7 +2258,7 @@ class ContextFormComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextFormComponent, isStandalone: true, selector: "igo-context-form", inputs: { btnSubmitText: { classPropertyName: "btnSubmitText", publicName: "btnSubmitText", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { submitForm: "submitForm", clone: "clone", delete: "delete" }, ngImport: i0, template: "@let form = this.form();\n<form\n  class=\"igo-form\"\n  [formGroup]=\"form\"\n  (ngSubmit)=\"handleFormSubmit(form.value)\"\n>\n  <mat-form-field class=\"full-width\">\n    <input\n      matInput\n      required\n      maxlength=\"128\"\n      [placeholder]=\"'igo.context.contextManager.form.title' | translate\"\n      formControlName=\"title\"\n    />\n    <mat-error>\n      {{ 'igo.context.contextManager.form.titleRequired' | translate }}\n    </mat-error>\n  </mat-form-field>\n\n  <mat-form-field id=\"uriInput\" class=\"full-width\">\n    @if (prefix) {\n      <span class=\"prefix\">{{ prefix }}-</span>\n    }\n    <span class=\"fieldWrapper\">\n      <input\n        matInput\n        maxlength=\"64\"\n        floatLabel=\"always\"\n        [placeholder]=\"'igo.context.contextManager.form.uri' | translate\"\n        formControlName=\"uri\"\n      />\n    </span>\n  </mat-form-field>\n\n  <button\n    id=\"copyButton\"\n    type=\"button\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.context.contextManager.form.copy' | translate\"\n    color=\"primary\"\n    (click)=\"copyTextToClipboard()\"\n  >\n    <mat-icon>content_copy</mat-icon>\n  </button>\n\n  <div class=\"igo-form-button-group\">\n    <button\n      matButton=\"elevated\"\n      type=\"submit\"\n      [disabled]=\"form.invalid || disabled()\"\n    >\n      {{ 'igo.context.contextManager.form.edit' | translate }}\n    </button>\n  </div>\n</form>\n", styles: ["form{margin:10px}.full-width{width:100%}#uriInput .fieldWrapper{display:block;overflow:hidden}#uriInput .prefix{float:left}#copyButton{width:24px;float:right;position:relative;top:-58px;left:5px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextFormComponent, isStandalone: true, selector: "igo-context-form", inputs: { btnSubmitText: { classPropertyName: "btnSubmitText", publicName: "btnSubmitText", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { submitForm: "submitForm", clone: "clone", delete: "delete" }, ngImport: i0, template: "@let form = this.form();\n@if (form) {\n  <form\n    class=\"igo-form\"\n    [formGroup]=\"form\"\n    (ngSubmit)=\"handleFormSubmit(form.value)\"\n  >\n    <mat-form-field class=\"full-width\">\n      <input\n        matInput\n        required\n        maxlength=\"128\"\n        [placeholder]=\"'igo.context.contextManager.form.title' | translate\"\n        formControlName=\"title\"\n      />\n      <mat-error>\n        {{ 'igo.context.contextManager.form.titleRequired' | translate }}\n      </mat-error>\n    </mat-form-field>\n\n    <mat-form-field id=\"uriInput\" class=\"full-width\">\n      @if (prefix) {\n        <span class=\"prefix\">{{ prefix }}-</span>\n      }\n      <span class=\"fieldWrapper\">\n        <input\n          matInput\n          maxlength=\"64\"\n          floatLabel=\"always\"\n          [placeholder]=\"'igo.context.contextManager.form.uri' | translate\"\n          formControlName=\"uri\"\n        />\n      </span>\n    </mat-form-field>\n\n    <button\n      id=\"copyButton\"\n      type=\"button\"\n      mat-icon-button\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.context.contextManager.form.copy' | translate\"\n      color=\"primary\"\n      (click)=\"copyTextToClipboard()\"\n    >\n      <mat-icon>content_copy</mat-icon>\n    </button>\n\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"submit\"\n        [disabled]=\"form.invalid || disabled()\"\n      >\n        {{ 'igo.context.contextManager.form.edit' | translate }}\n      </button>\n    </div>\n  </form>\n}\n", styles: ["form{margin:10px}.full-width{width:100%}#uriInput .fieldWrapper{display:block;overflow:hidden}#uriInput .prefix{float:left}#copyButton{width:24px;float:right;position:relative;top:-58px;left:5px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextFormComponent, decorators: [{
             type: Component,
@@ -2231,8 +2271,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatTooltipModule,
                         MatIconModule,
                         IgoLanguageModule
-                    ], template: "@let form = this.form();\n<form\n  class=\"igo-form\"\n  [formGroup]=\"form\"\n  (ngSubmit)=\"handleFormSubmit(form.value)\"\n>\n  <mat-form-field class=\"full-width\">\n    <input\n      matInput\n      required\n      maxlength=\"128\"\n      [placeholder]=\"'igo.context.contextManager.form.title' | translate\"\n      formControlName=\"title\"\n    />\n    <mat-error>\n      {{ 'igo.context.contextManager.form.titleRequired' | translate }}\n    </mat-error>\n  </mat-form-field>\n\n  <mat-form-field id=\"uriInput\" class=\"full-width\">\n    @if (prefix) {\n      <span class=\"prefix\">{{ prefix }}-</span>\n    }\n    <span class=\"fieldWrapper\">\n      <input\n        matInput\n        maxlength=\"64\"\n        floatLabel=\"always\"\n        [placeholder]=\"'igo.context.contextManager.form.uri' | translate\"\n        formControlName=\"uri\"\n      />\n    </span>\n  </mat-form-field>\n\n  <button\n    id=\"copyButton\"\n    type=\"button\"\n    mat-icon-button\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.context.contextManager.form.copy' | translate\"\n    color=\"primary\"\n    (click)=\"copyTextToClipboard()\"\n  >\n    <mat-icon>content_copy</mat-icon>\n  </button>\n\n  <div class=\"igo-form-button-group\">\n    <button\n      matButton=\"elevated\"\n      type=\"submit\"\n      [disabled]=\"form.invalid || disabled()\"\n    >\n      {{ 'igo.context.contextManager.form.edit' | translate }}\n    </button>\n  </div>\n</form>\n", styles: ["form{margin:10px}.full-width{width:100%}#uriInput .fieldWrapper{display:block;overflow:hidden}#uriInput .prefix{float:left}#copyButton{width:24px;float:right;position:relative;top:-58px;left:5px}\n"] }]
-        }], propDecorators: { btnSubmitText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSubmitText", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], submitForm: [{ type: i0.Output, args: ["submitForm"] }], clone: [{ type: i0.Output, args: ["clone"] }], delete: [{ type: i0.Output, args: ["delete"] }] } });
+                    ], template: "@let form = this.form();\n@if (form) {\n  <form\n    class=\"igo-form\"\n    [formGroup]=\"form\"\n    (ngSubmit)=\"handleFormSubmit(form.value)\"\n  >\n    <mat-form-field class=\"full-width\">\n      <input\n        matInput\n        required\n        maxlength=\"128\"\n        [placeholder]=\"'igo.context.contextManager.form.title' | translate\"\n        formControlName=\"title\"\n      />\n      <mat-error>\n        {{ 'igo.context.contextManager.form.titleRequired' | translate }}\n      </mat-error>\n    </mat-form-field>\n\n    <mat-form-field id=\"uriInput\" class=\"full-width\">\n      @if (prefix) {\n        <span class=\"prefix\">{{ prefix }}-</span>\n      }\n      <span class=\"fieldWrapper\">\n        <input\n          matInput\n          maxlength=\"64\"\n          floatLabel=\"always\"\n          [placeholder]=\"'igo.context.contextManager.form.uri' | translate\"\n          formControlName=\"uri\"\n        />\n      </span>\n    </mat-form-field>\n\n    <button\n      id=\"copyButton\"\n      type=\"button\"\n      mat-icon-button\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.context.contextManager.form.copy' | translate\"\n      color=\"primary\"\n      (click)=\"copyTextToClipboard()\"\n    >\n      <mat-icon>content_copy</mat-icon>\n    </button>\n\n    <div class=\"igo-form-button-group\">\n      <button\n        matButton=\"elevated\"\n        type=\"submit\"\n        [disabled]=\"form.invalid || disabled()\"\n      >\n        {{ 'igo.context.contextManager.form.edit' | translate }}\n      </button>\n    </div>\n  </form>\n}\n", styles: ["form{margin:10px}.full-width{width:100%}#uriInput .fieldWrapper{display:block;overflow:hidden}#uriInput .prefix{float:left}#copyButton{width:24px;float:right;position:relative;top:-58px;left:5px}\n"] }]
+        }], propDecorators: { btnSubmitText: [{ type: i0.Input, args: [{ isSignal: true, alias: "btnSubmitText", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], submitForm: [{ type: i0.Output, args: ["submitForm"] }], clone: [{ type: i0.Output, args: ["clone"] }], delete: [{ type: i0.Output, args: ["delete"] }] } });
 
 const TypePermission = ['read', 'write'];
 var Scope;
@@ -2315,7 +2355,7 @@ class LayerContextDirective {
     }
     handleAddLayers(layers) {
         const layersFiltrered = layers
-            .filter((layer) => layer)
+            .filter((layer) => !!layer)
             .map((layer) => {
             layer.visible = this.computeLayerVisibilityFromUrl(layer);
             return layer;
@@ -2326,7 +2366,7 @@ class LayerContextDirective {
     }
     computeLayerVisibilityFromUrl(layer) {
         const params = this.queryParams;
-        const currentContext = this.contextService.context$.value.uri;
+        const currentContext = this.contextService.context$.value?.uri;
         const currentLayerid = layer.id;
         let visible = layer.visible;
         if (!params || !currentLayerid) {
@@ -2368,17 +2408,17 @@ class LayerContextDirective {
     }
     handleContextWithSharedUrl(context) {
         if (!this.queryParams) {
-            return context.layers;
+            return context.layers ?? [];
         }
         const { layers, uri } = context;
         const contextValue = this.shareMapService.getContext(this.queryParams);
         if (!contextValue || contextValue === uri) {
             const layersOptions = this.shareMapService.parseLayers(this.queryParams);
-            if (layersOptions.length) {
-                return mergeLayersOptions([...layers], layersOptions);
+            if (layersOptions && layersOptions.length) {
+                return mergeLayersOptions([...(layers ?? [])], layersOptions);
             }
         }
-        return layers;
+        return layers ?? [];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: LayerContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.10", type: LayerContextDirective, isStandalone: true, selector: "[igoLayerContext]", inputs: { removeLayersOnContextChange: { classPropertyName: "removeLayersOnContextChange", publicName: "removeLayersOnContextChange", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contextLayersLoaded: "contextLayersLoaded" }, ngImport: i0 });
@@ -2451,7 +2491,7 @@ class MapContextDirective {
             if (this.mediaService.isMobile()) {
                 if (typeof controlsContext.scaleLine !== 'boolean') {
                     const scaleLineOption = controlsContext.scaleLine;
-                    if (!scaleLineOption.minWidth) {
+                    if (scaleLineOption && scaleLineOption.minWidth != null) {
                         scaleLineOption.minWidth = Math.min(64, scaleLineOption.minWidth);
                         controlsContext.scaleLine = scaleLineOption;
                     }
@@ -2476,10 +2516,13 @@ class ContextEditComponent {
     context = toSignal(this.contextService.editedContext$);
     submitSuccessed = output();
     onEdit(context) {
-        const id = this.context().id;
+        const id = this.context()?.id;
+        if (!id) {
+            throw new Error('Context id is required to update context');
+        }
         this.contextService.update(id, context).subscribe(() => {
             this.messageService.success('igo.context.contextManager.dialog.saveMsg', 'igo.context.contextManager.dialog.saveTitle', undefined, {
-                value: context.title || this.context().title
+                value: context.title || this.context()?.title
             });
             const currentContext = this.contextService.context$.value;
             if (currentContext && currentContext.id === id) {
@@ -2491,11 +2534,11 @@ class ContextEditComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextEditComponent, isStandalone: true, selector: "igo-context-edit", outputs: { submitSuccessed: "submitSuccessed" }, ngImport: i0, template: "@if (context()) {\n  <igo-context-form\n    [btnSubmitText]=\"'igo.context.contextManager.save' | translate\"\n    [context]=\"context()\"\n    (submitForm)=\"onEdit($event)\"\n  />\n}\n", dependencies: [{ kind: "component", type: ContextFormComponent, selector: "igo-context-form", inputs: ["btnSubmitText", "context", "disabled"], outputs: ["submitForm", "clone", "delete"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextEditComponent, isStandalone: true, selector: "igo-context-edit", outputs: { submitSuccessed: "submitSuccessed" }, ngImport: i0, template: "@if (context()) {\n  <igo-context-form\n    [btnSubmitText]=\"'igo.context.contextManager.save' | translate\"\n    [context]=\"context()\"\n    (submitForm)=\"onEdit($any($event))\"\n  />\n}\n", dependencies: [{ kind: "component", type: ContextFormComponent, selector: "igo-context-form", inputs: ["btnSubmitText", "context", "disabled"], outputs: ["submitForm", "clone", "delete"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextEditComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-context-edit', imports: [ContextFormComponent, IgoLanguageModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (context()) {\n  <igo-context-form\n    [btnSubmitText]=\"'igo.context.contextManager.save' | translate\"\n    [context]=\"context()\"\n    (submitForm)=\"onEdit($event)\"\n  />\n}\n" }]
+            args: [{ selector: 'igo-context-edit', imports: [ContextFormComponent, IgoLanguageModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (context()) {\n  <igo-context-form\n    [btnSubmitText]=\"'igo.context.contextManager.save' | translate\"\n    [context]=\"context()\"\n    (submitForm)=\"onEdit($any($event))\"\n  />\n}\n" }]
         }], propDecorators: { submitSuccessed: [{ type: i0.Output, args: ["submitSuccessed"] }] } });
 
 class ContextItemComponent {
@@ -2505,10 +2548,10 @@ class ContextItemComponent {
     color = 'primary';
     collapsed = true;
     showFavorite = input(true, ...(ngDevMode ? [{ debugName: "showFavorite" }] : /* istanbul ignore next */ []));
-    context = input(undefined, ...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
-    default = input(undefined, ...(ngDevMode ? [{ debugName: "default" }] : /* istanbul ignore next */ []));
-    selected = input(undefined, ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
-    isDesktop = input(undefined, ...(ngDevMode ? [{ debugName: "isDesktop" }] : /* istanbul ignore next */ []));
+    context = input.required(...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
+    default = input(...(ngDevMode ? [undefined, { debugName: "default" }] : /* istanbul ignore next */ []));
+    selected = input(...(ngDevMode ? [undefined, { debugName: "selected" }] : /* istanbul ignore next */ []));
+    isDesktop = input(...(ngDevMode ? [undefined, { debugName: "isDesktop" }] : /* istanbul ignore next */ []));
     edit = output();
     delete = output();
     save = output();
@@ -2520,7 +2563,7 @@ class ContextItemComponent {
     manageTools = output();
     share = output();
     get hidden() {
-        return this.context().hidden;
+        return this.context()?.hidden ?? false;
     }
     get canShare() {
         return this.storageService.get('canShare') === true;
@@ -2533,7 +2576,7 @@ class ContextItemComponent {
         this.favorite.emit(context);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextItemComponent, isStandalone: true, selector: "igo-context-item", inputs: { showFavorite: { classPropertyName: "showFavorite", publicName: "showFavorite", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, default: { classPropertyName: "default", publicName: "default", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, isDesktop: { classPropertyName: "isDesktop", publicName: "isDesktop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", delete: "delete", save: "save", clone: "clone", hide: "hide", show: "show", favorite: "favorite", managePermissions: "managePermissions", manageTools: "manageTools", share: "share" }, host: { properties: { "class.igo-list-item-focused": "this.isMenuOpen" } }, viewQueries: [{ propertyName: "itemActionsMenuTrigger", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-list-item class=\"mat-list-item\" [class.mat-list-item-light]=\"hidden\">\n  @if (auth.authenticated) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"\n        auth.authenticated\n          ? ('igo.context.contextManager.favorite' | translate)\n          : ''\n      \"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(context())\"\n    >\n      @if (!context().iconImage) {\n        <mat-icon>{{\n          context().icon\n            ? context().icon\n            : context().scope === 'public'\n              ? 'public'\n              : 'star'\n        }}</mat-icon>\n      } @else {\n        <img\n          [src]=\"context().iconImage\"\n          alt=\"Ic\u00F4ne pour le favori de contexte\"\n        />\n      }\n    </button>\n  } @else if (showFavorite()) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"'igo.context.contextManager.favorite' | translate\"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(context())\"\n    >\n      <mat-icon>star</mat-icon>\n    </button>\n  }\n\n  <span matListItemTitle>{{ context().title }}</span>\n\n  @if (auth.authenticated) {\n    <div\n      matListItemMeta\n      igoStopPropagation\n      class=\"igo-actions-container\"\n      [class.--not-desktop]=\"!isDesktop()\"\n      [class.--selected]=\"selected()\"\n    >\n      @if (\n        collapsed &&\n        selected() &&\n        (context().permission === 'write' || context().imported)\n      ) {\n        <button\n          class=\"save-button\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.save' | translate\"\n          matTooltipShowDelay=\"500\"\n          [color]=\"color\"\n          (click)=\"save.emit(context())\"\n        >\n          <mat-icon>save</mat-icon>\n        </button>\n      }\n\n      <button\n        class=\"actions-button\"\n        mat-icon-button\n        [color]=\"color\"\n        [matMenuTriggerFor]=\"itemActionsMenu\"\n        #itemActionsMenuTrigger=\"matMenuTrigger\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n      <mat-menu #itemActionsMenu=\"matMenu\">\n        @if (!context().imported) {\n          @if (canShare) {\n            <button\n              mat-menu-item\n              [matTooltip]=\"\n                'igo.context.contextManager.managePermissions' | translate\n              \"\n              matTooltipShowDelay=\"500\"\n              (click)=\"managePermissions.emit(context())\"\n            >\n              <mat-icon>manage_accounts</mat-icon\n              ><span>{{\n                'igo.context.contextManager.managePermissions' | translate\n              }}</span>\n            </button>\n          }\n\n          <button\n            class=\"clone-button\"\n            mat-menu-item\n            [matTooltip]=\"'igo.context.contextManager.clone' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"clone.emit(context())\"\n          >\n            <mat-icon>content_copy</mat-icon>\n            <span>{{ 'igo.context.contextManager.clone' | translate }}</span>\n          </button>\n\n          @if (context().permission === 'write') {\n            <button\n              class=\"edit-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.edit' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"edit.emit(context())\"\n            >\n              <mat-icon>edit</mat-icon>\n              <span>{{ 'igo.context.contextManager.edit' | translate }}</span>\n            </button>\n          }\n\n          @if (!context().hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.hide' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"hide.emit(context())\"\n            >\n              <mat-icon>visibility</mat-icon>\n              <span>{{ 'igo.context.contextManager.hide' | translate }}</span>\n            </button>\n          }\n\n          @if (context().hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.show' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"show.emit(context())\"\n            >\n              <mat-icon>visibility_off</mat-icon>\n              <span>{{ 'igo.context.contextManager.show' | translate }}</span>\n            </button>\n          }\n\n          <button\n            mat-menu-item\n            class=\"share-button\"\n            [matTooltip]=\"'igo.context.contextManager.share' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"share.emit(context())\"\n          >\n            <mat-icon>share</mat-icon>\n            <span>{{ 'igo.context.contextManager.share' | translate }}</span>\n          </button>\n        }\n\n        @if (context().permission === 'write' || context().imported) {\n          <button\n            class=\"delete-button\"\n            mat-menu-item\n            color=\"warn\"\n            [matTooltip]=\"'igo.context.contextManager.delete' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"delete.emit(context())\"\n          >\n            <mat-icon>delete</mat-icon>\n            <span>{{ 'igo.context.contextManager.delete' | translate }}</span>\n          </button>\n        }\n      </mat-menu>\n    </div>\n  }\n</mat-list-item>\n", styles: [":host{overflow:hidden}:host:hover .igo-actions-container button,:host.igo-list-item-focused .igo-actions-container button,:host .--not-desktop button,:host .--selected button{visibility:visible!important}.igo-actions-container{flex-shrink:0}.igo-actions-container button{visibility:hidden}.igo-actions-container button.disabled{visibility:visible}.igo-actions-expand-container{display:inline-flex}mat-icon.disabled{color:#00000061}button[matlistitemavatar]{margin-right:8px}.mdc-list-item--with-leading-avatar .mat-mdc-list-item-avatar{background-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i3.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i3.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i3.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextItemComponent, isStandalone: true, selector: "igo-context-item", inputs: { showFavorite: { classPropertyName: "showFavorite", publicName: "showFavorite", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: true, transformFunction: null }, default: { classPropertyName: "default", publicName: "default", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, isDesktop: { classPropertyName: "isDesktop", publicName: "isDesktop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", delete: "delete", save: "save", clone: "clone", hide: "hide", show: "show", favorite: "favorite", managePermissions: "managePermissions", manageTools: "manageTools", share: "share" }, host: { properties: { "class.igo-list-item-focused": "this.isMenuOpen" } }, viewQueries: [{ propertyName: "itemActionsMenuTrigger", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "@let ctx = context()!;\n<mat-list-item class=\"mat-list-item\" [class.mat-list-item-light]=\"hidden\">\n  @if (auth.authenticated) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"\n        auth.authenticated\n          ? ('igo.context.contextManager.favorite' | translate)\n          : ''\n      \"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(ctx)\"\n    >\n      @if (!ctx.iconImage) {\n        <mat-icon>{{\n          ctx.icon ? ctx.icon : ctx.scope === 'public' ? 'public' : 'star'\n        }}</mat-icon>\n      } @else {\n        <img [src]=\"ctx.iconImage\" alt=\"Ic\u00F4ne pour le favori de contexte\" />\n      }\n    </button>\n  } @else if (showFavorite()) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"'igo.context.contextManager.favorite' | translate\"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(ctx)\"\n    >\n      <mat-icon>star</mat-icon>\n    </button>\n  }\n\n  <span matListItemTitle>{{ ctx.title }}</span>\n\n  @if (auth.authenticated) {\n    <div\n      matListItemMeta\n      igoStopPropagation\n      class=\"igo-actions-container\"\n      [class.--not-desktop]=\"!isDesktop()\"\n      [class.--selected]=\"selected()\"\n    >\n      @if (\n        collapsed && selected() && (ctx.permission === 'write' || ctx.imported)\n      ) {\n        <button\n          class=\"save-button\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.save' | translate\"\n          matTooltipShowDelay=\"500\"\n          [color]=\"color\"\n          (click)=\"save.emit(ctx)\"\n        >\n          <mat-icon>save</mat-icon>\n        </button>\n      }\n\n      <button\n        class=\"actions-button\"\n        mat-icon-button\n        [color]=\"color\"\n        [matMenuTriggerFor]=\"itemActionsMenu\"\n        #itemActionsMenuTrigger=\"matMenuTrigger\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n      <mat-menu #itemActionsMenu=\"matMenu\">\n        @if (!ctx.imported) {\n          @if (canShare) {\n            <button\n              mat-menu-item\n              [matTooltip]=\"\n                'igo.context.contextManager.managePermissions' | translate\n              \"\n              matTooltipShowDelay=\"500\"\n              (click)=\"managePermissions.emit(ctx)\"\n            >\n              <mat-icon>manage_accounts</mat-icon\n              ><span>{{\n                'igo.context.contextManager.managePermissions' | translate\n              }}</span>\n            </button>\n          }\n\n          <button\n            class=\"clone-button\"\n            mat-menu-item\n            [matTooltip]=\"'igo.context.contextManager.clone' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"clone.emit(ctx)\"\n          >\n            <mat-icon>content_copy</mat-icon>\n            <span>{{ 'igo.context.contextManager.clone' | translate }}</span>\n          </button>\n\n          @if (ctx.permission === 'write') {\n            <button\n              class=\"edit-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.edit' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"edit.emit(ctx)\"\n            >\n              <mat-icon>edit</mat-icon>\n              <span>{{ 'igo.context.contextManager.edit' | translate }}</span>\n            </button>\n          }\n\n          @if (!ctx.hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.hide' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"hide.emit(ctx)\"\n            >\n              <mat-icon>visibility</mat-icon>\n              <span>{{ 'igo.context.contextManager.hide' | translate }}</span>\n            </button>\n          }\n\n          @if (ctx.hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.show' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"show.emit(ctx)\"\n            >\n              <mat-icon>visibility_off</mat-icon>\n              <span>{{ 'igo.context.contextManager.show' | translate }}</span>\n            </button>\n          }\n\n          <button\n            mat-menu-item\n            class=\"share-button\"\n            [matTooltip]=\"'igo.context.contextManager.share' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"share.emit(ctx)\"\n          >\n            <mat-icon>share</mat-icon>\n            <span>{{ 'igo.context.contextManager.share' | translate }}</span>\n          </button>\n        }\n\n        @if (ctx.permission === 'write' || ctx.imported) {\n          <button\n            class=\"delete-button\"\n            mat-menu-item\n            color=\"warn\"\n            [matTooltip]=\"'igo.context.contextManager.delete' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"delete.emit(ctx)\"\n          >\n            <mat-icon>delete</mat-icon>\n            <span>{{ 'igo.context.contextManager.delete' | translate }}</span>\n          </button>\n        }\n      </mat-menu>\n    </div>\n  }\n</mat-list-item>\n", styles: [":host{overflow:hidden}:host:hover .igo-actions-container button,:host.igo-list-item-focused .igo-actions-container button,:host .--not-desktop button,:host .--selected button{visibility:visible!important}.igo-actions-container{flex-shrink:0}.igo-actions-container button{visibility:hidden}.igo-actions-container button.disabled{visibility:visible}.igo-actions-expand-container{display:inline-flex}mat-icon.disabled{color:#00000061}button[matlistitemavatar]{margin-right:8px}.mdc-list-item--with-leading-avatar .mat-mdc-list-item-avatar{background-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i3.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i3.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i3.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextItemComponent, decorators: [{
             type: Component,
@@ -2547,12 +2590,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         IgoLanguageModule
                     ], host: {
                         '[class.igo-list-item-focused]': 'this.isMenuOpen'
-                    }, template: "<mat-list-item class=\"mat-list-item\" [class.mat-list-item-light]=\"hidden\">\n  @if (auth.authenticated) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"\n        auth.authenticated\n          ? ('igo.context.contextManager.favorite' | translate)\n          : ''\n      \"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(context())\"\n    >\n      @if (!context().iconImage) {\n        <mat-icon>{{\n          context().icon\n            ? context().icon\n            : context().scope === 'public'\n              ? 'public'\n              : 'star'\n        }}</mat-icon>\n      } @else {\n        <img\n          [src]=\"context().iconImage\"\n          alt=\"Ic\u00F4ne pour le favori de contexte\"\n        />\n      }\n    </button>\n  } @else if (showFavorite()) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"'igo.context.contextManager.favorite' | translate\"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(context())\"\n    >\n      <mat-icon>star</mat-icon>\n    </button>\n  }\n\n  <span matListItemTitle>{{ context().title }}</span>\n\n  @if (auth.authenticated) {\n    <div\n      matListItemMeta\n      igoStopPropagation\n      class=\"igo-actions-container\"\n      [class.--not-desktop]=\"!isDesktop()\"\n      [class.--selected]=\"selected()\"\n    >\n      @if (\n        collapsed &&\n        selected() &&\n        (context().permission === 'write' || context().imported)\n      ) {\n        <button\n          class=\"save-button\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.save' | translate\"\n          matTooltipShowDelay=\"500\"\n          [color]=\"color\"\n          (click)=\"save.emit(context())\"\n        >\n          <mat-icon>save</mat-icon>\n        </button>\n      }\n\n      <button\n        class=\"actions-button\"\n        mat-icon-button\n        [color]=\"color\"\n        [matMenuTriggerFor]=\"itemActionsMenu\"\n        #itemActionsMenuTrigger=\"matMenuTrigger\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n      <mat-menu #itemActionsMenu=\"matMenu\">\n        @if (!context().imported) {\n          @if (canShare) {\n            <button\n              mat-menu-item\n              [matTooltip]=\"\n                'igo.context.contextManager.managePermissions' | translate\n              \"\n              matTooltipShowDelay=\"500\"\n              (click)=\"managePermissions.emit(context())\"\n            >\n              <mat-icon>manage_accounts</mat-icon\n              ><span>{{\n                'igo.context.contextManager.managePermissions' | translate\n              }}</span>\n            </button>\n          }\n\n          <button\n            class=\"clone-button\"\n            mat-menu-item\n            [matTooltip]=\"'igo.context.contextManager.clone' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"clone.emit(context())\"\n          >\n            <mat-icon>content_copy</mat-icon>\n            <span>{{ 'igo.context.contextManager.clone' | translate }}</span>\n          </button>\n\n          @if (context().permission === 'write') {\n            <button\n              class=\"edit-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.edit' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"edit.emit(context())\"\n            >\n              <mat-icon>edit</mat-icon>\n              <span>{{ 'igo.context.contextManager.edit' | translate }}</span>\n            </button>\n          }\n\n          @if (!context().hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.hide' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"hide.emit(context())\"\n            >\n              <mat-icon>visibility</mat-icon>\n              <span>{{ 'igo.context.contextManager.hide' | translate }}</span>\n            </button>\n          }\n\n          @if (context().hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.show' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"show.emit(context())\"\n            >\n              <mat-icon>visibility_off</mat-icon>\n              <span>{{ 'igo.context.contextManager.show' | translate }}</span>\n            </button>\n          }\n\n          <button\n            mat-menu-item\n            class=\"share-button\"\n            [matTooltip]=\"'igo.context.contextManager.share' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"share.emit(context())\"\n          >\n            <mat-icon>share</mat-icon>\n            <span>{{ 'igo.context.contextManager.share' | translate }}</span>\n          </button>\n        }\n\n        @if (context().permission === 'write' || context().imported) {\n          <button\n            class=\"delete-button\"\n            mat-menu-item\n            color=\"warn\"\n            [matTooltip]=\"'igo.context.contextManager.delete' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"delete.emit(context())\"\n          >\n            <mat-icon>delete</mat-icon>\n            <span>{{ 'igo.context.contextManager.delete' | translate }}</span>\n          </button>\n        }\n      </mat-menu>\n    </div>\n  }\n</mat-list-item>\n", styles: [":host{overflow:hidden}:host:hover .igo-actions-container button,:host.igo-list-item-focused .igo-actions-container button,:host .--not-desktop button,:host .--selected button{visibility:visible!important}.igo-actions-container{flex-shrink:0}.igo-actions-container button{visibility:hidden}.igo-actions-container button.disabled{visibility:visible}.igo-actions-expand-container{display:inline-flex}mat-icon.disabled{color:#00000061}button[matlistitemavatar]{margin-right:8px}.mdc-list-item--with-leading-avatar .mat-mdc-list-item-avatar{background-color:transparent}\n"] }]
-        }], propDecorators: { showFavorite: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFavorite", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], default: [{ type: i0.Input, args: [{ isSignal: true, alias: "default", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], isDesktop: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDesktop", required: false }] }], edit: [{ type: i0.Output, args: ["edit"] }], delete: [{ type: i0.Output, args: ["delete"] }], save: [{ type: i0.Output, args: ["save"] }], clone: [{ type: i0.Output, args: ["clone"] }], hide: [{ type: i0.Output, args: ["hide"] }], show: [{ type: i0.Output, args: ["show"] }], favorite: [{ type: i0.Output, args: ["favorite"] }], managePermissions: [{ type: i0.Output, args: ["managePermissions"] }], manageTools: [{ type: i0.Output, args: ["manageTools"] }], share: [{ type: i0.Output, args: ["share"] }], itemActionsMenuTrigger: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatMenuTrigger), { isSignal: true }] }] } });
+                    }, template: "@let ctx = context()!;\n<mat-list-item class=\"mat-list-item\" [class.mat-list-item-light]=\"hidden\">\n  @if (auth.authenticated) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"\n        auth.authenticated\n          ? ('igo.context.contextManager.favorite' | translate)\n          : ''\n      \"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(ctx)\"\n    >\n      @if (!ctx.iconImage) {\n        <mat-icon>{{\n          ctx.icon ? ctx.icon : ctx.scope === 'public' ? 'public' : 'star'\n        }}</mat-icon>\n      } @else {\n        <img [src]=\"ctx.iconImage\" alt=\"Ic\u00F4ne pour le favori de contexte\" />\n      }\n    </button>\n  } @else if (showFavorite()) {\n    <button\n      matListItemAvatar\n      mat-icon-button\n      igoStopPropagation\n      [matTooltip]=\"'igo.context.contextManager.favorite' | translate\"\n      matTooltipShowDelay=\"500\"\n      [color]=\"default() ? 'primary' : 'default'\"\n      (click)=\"favoriteClick(ctx)\"\n    >\n      <mat-icon>star</mat-icon>\n    </button>\n  }\n\n  <span matListItemTitle>{{ ctx.title }}</span>\n\n  @if (auth.authenticated) {\n    <div\n      matListItemMeta\n      igoStopPropagation\n      class=\"igo-actions-container\"\n      [class.--not-desktop]=\"!isDesktop()\"\n      [class.--selected]=\"selected()\"\n    >\n      @if (\n        collapsed && selected() && (ctx.permission === 'write' || ctx.imported)\n      ) {\n        <button\n          class=\"save-button\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.save' | translate\"\n          matTooltipShowDelay=\"500\"\n          [color]=\"color\"\n          (click)=\"save.emit(ctx)\"\n        >\n          <mat-icon>save</mat-icon>\n        </button>\n      }\n\n      <button\n        class=\"actions-button\"\n        mat-icon-button\n        [color]=\"color\"\n        [matMenuTriggerFor]=\"itemActionsMenu\"\n        #itemActionsMenuTrigger=\"matMenuTrigger\"\n      >\n        <mat-icon>more_vert</mat-icon>\n      </button>\n      <mat-menu #itemActionsMenu=\"matMenu\">\n        @if (!ctx.imported) {\n          @if (canShare) {\n            <button\n              mat-menu-item\n              [matTooltip]=\"\n                'igo.context.contextManager.managePermissions' | translate\n              \"\n              matTooltipShowDelay=\"500\"\n              (click)=\"managePermissions.emit(ctx)\"\n            >\n              <mat-icon>manage_accounts</mat-icon\n              ><span>{{\n                'igo.context.contextManager.managePermissions' | translate\n              }}</span>\n            </button>\n          }\n\n          <button\n            class=\"clone-button\"\n            mat-menu-item\n            [matTooltip]=\"'igo.context.contextManager.clone' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"clone.emit(ctx)\"\n          >\n            <mat-icon>content_copy</mat-icon>\n            <span>{{ 'igo.context.contextManager.clone' | translate }}</span>\n          </button>\n\n          @if (ctx.permission === 'write') {\n            <button\n              class=\"edit-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.edit' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"edit.emit(ctx)\"\n            >\n              <mat-icon>edit</mat-icon>\n              <span>{{ 'igo.context.contextManager.edit' | translate }}</span>\n            </button>\n          }\n\n          @if (!ctx.hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.hide' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"hide.emit(ctx)\"\n            >\n              <mat-icon>visibility</mat-icon>\n              <span>{{ 'igo.context.contextManager.hide' | translate }}</span>\n            </button>\n          }\n\n          @if (ctx.hidden) {\n            <button\n              class=\"hide-button\"\n              mat-menu-item\n              [matTooltip]=\"'igo.context.contextManager.show' | translate\"\n              matTooltipShowDelay=\"500\"\n              (click)=\"show.emit(ctx)\"\n            >\n              <mat-icon>visibility_off</mat-icon>\n              <span>{{ 'igo.context.contextManager.show' | translate }}</span>\n            </button>\n          }\n\n          <button\n            mat-menu-item\n            class=\"share-button\"\n            [matTooltip]=\"'igo.context.contextManager.share' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"share.emit(ctx)\"\n          >\n            <mat-icon>share</mat-icon>\n            <span>{{ 'igo.context.contextManager.share' | translate }}</span>\n          </button>\n        }\n\n        @if (ctx.permission === 'write' || ctx.imported) {\n          <button\n            class=\"delete-button\"\n            mat-menu-item\n            color=\"warn\"\n            [matTooltip]=\"'igo.context.contextManager.delete' | translate\"\n            matTooltipShowDelay=\"500\"\n            (click)=\"delete.emit(ctx)\"\n          >\n            <mat-icon>delete</mat-icon>\n            <span>{{ 'igo.context.contextManager.delete' | translate }}</span>\n          </button>\n        }\n      </mat-menu>\n    </div>\n  }\n</mat-list-item>\n", styles: [":host{overflow:hidden}:host:hover .igo-actions-container button,:host.igo-list-item-focused .igo-actions-container button,:host .--not-desktop button,:host .--selected button{visibility:visible!important}.igo-actions-container{flex-shrink:0}.igo-actions-container button{visibility:hidden}.igo-actions-container button.disabled{visibility:visible}.igo-actions-expand-container{display:inline-flex}mat-icon.disabled{color:#00000061}button[matlistitemavatar]{margin-right:8px}.mdc-list-item--with-leading-avatar .mat-mdc-list-item-avatar{background-color:transparent}\n"] }]
+        }], propDecorators: { showFavorite: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFavorite", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: true }] }], default: [{ type: i0.Input, args: [{ isSignal: true, alias: "default", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], isDesktop: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDesktop", required: false }] }], edit: [{ type: i0.Output, args: ["edit"] }], delete: [{ type: i0.Output, args: ["delete"] }], save: [{ type: i0.Output, args: ["save"] }], clone: [{ type: i0.Output, args: ["clone"] }], hide: [{ type: i0.Output, args: ["hide"] }], show: [{ type: i0.Output, args: ["show"] }], favorite: [{ type: i0.Output, args: ["favorite"] }], managePermissions: [{ type: i0.Output, args: ["managePermissions"] }], manageTools: [{ type: i0.Output, args: ["manageTools"] }], share: [{ type: i0.Output, args: ["share"] }], itemActionsMenuTrigger: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatMenuTrigger), { isSignal: true }] }] } });
 
 class BookmarkDialogComponent {
     dialogRef = inject(MatDialogRef);
-    title;
+    title = '';
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: BookmarkDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: BookmarkDialogComponent, isStandalone: true, selector: "igo-bookmark-dialog", ngImport: i0, template: "<h1 mat-dialog-title>\n  {{ 'igo.context.bookmarkButton.dialog.title' | translate }}\n</h1>\n<div mat-dialog-content>\n  <mat-form-field>\n    <input\n      matInput\n      required\n      autocomplete=\"off\"\n      maxlength=\"128\"\n      [placeholder]=\"\n        'igo.context.bookmarkButton.dialog.placeholder' | translate\n      \"\n      [(ngModel)]=\"title\"\n    />\n  </mat-form-field>\n</div>\n<div mat-dialog-actions>\n  <button\n    mat-button\n    color=\"primary\"\n    [disabled]=\"!title\"\n    (click)=\"dialogRef.close(title)\"\n  >\n    {{ 'igo.common.confirmDialog.confirmBtn' | translate }}\n  </button>\n  <button mat-button (click)=\"dialogRef.close(false)\">\n    {{ 'igo.common.confirmDialog.cancelBtn' | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
@@ -2597,7 +2640,7 @@ class ContextListComponent {
     previousMessageId;
     sortAlphaOnIcon = SORT_ALPHA_ON_ICON;
     sortAlphaOffIcon = SORT_ALPHA_OFF_ICON;
-    isDesktop = input(undefined, ...(ngDevMode ? [{ debugName: "isDesktop" }] : /* istanbul ignore next */ []));
+    isDesktop = input(...(ngDevMode ? [undefined, { debugName: "isDesktop" }] : /* istanbul ignore next */ []));
     get contexts() {
         return this._contexts;
     }
@@ -2606,8 +2649,8 @@ class ContextListComponent {
         this.next();
     }
     _contexts = { ours: [] };
-    selectedContext = model(undefined, ...(ngDevMode ? [{ debugName: "selectedContext" }] : /* istanbul ignore next */ []));
-    map = input(undefined, ...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    selectedContext = model(...(ngDevMode ? [undefined, { debugName: "selectedContext" }] : /* istanbul ignore next */ []));
+    map = input(...(ngDevMode ? [undefined, { debugName: "map" }] : /* istanbul ignore next */ []));
     get defaultContextId() {
         return this.contextConfigs
             ? this._defaultContextId
@@ -2638,7 +2681,7 @@ class ContextListComponent {
         shared: 'igo.context.contextManager.sharedContexts',
         public: 'igo.context.contextManager.publicContexts'
     };
-    users;
+    users = [];
     permissions = [];
     actionStore = new ActionStore([]);
     actionbarMode = ActionbarMode.Overlay;
@@ -2656,13 +2699,13 @@ class ContextListComponent {
     }
     _term = '';
     get sortedAlpha() {
-        return this._sortedAlpha;
+        return this._sortedAlpha ?? false;
     }
     set sortedAlpha(value) {
         this._sortedAlpha = value;
         this.next();
     }
-    _sortedAlpha = undefined;
+    _sortedAlpha;
     showContextFilter = ContextListControlsEnum.always;
     thresholdToFilter = 5;
     get isEmpty() {
@@ -2707,7 +2750,8 @@ class ContextListComponent {
         this.showHidden = this.storageService.get('contexts.showHidden');
         this.contexts$$ = this.contextService.contexts$.subscribe((contexts) => (this.contexts = contexts));
         this.defaultContextId$$ = this.contextService.defaultContextId$.subscribe((id) => {
-            this.defaultContextId = id;
+            if (id != null)
+                this.defaultContextId = id;
         });
         const storedContextUri = this.storageService.get('favorite.context.uri');
         if (storedContextUri && !this.auth.authenticated) {
@@ -2717,7 +2761,8 @@ class ContextListComponent {
         this.selectedContext$$ = this.contextService.context$
             .pipe(debounceTime(100))
             .subscribe((context) => {
-            this.setSelected(context);
+            if (context)
+                this.setSelected(context);
         });
         this.auth.authenticate$.subscribe((authenticate) => {
             if (authenticate) {
@@ -2781,9 +2826,11 @@ class ContextListComponent {
                     .normalize('NFD')
                     .replace(/[\u0300-\u036f]/g, '');
                 const contextTitleNormalized = context.title
-                    .toLowerCase()
-                    .normalize('NFD')
-                    .replace(/[\u0300-\u036f]/g, '');
+                    ? context.title
+                        .toLowerCase()
+                        .normalize('NFD')
+                        .replace(/[\u0300-\u036f]/g, '')
+                    : '';
                 return contextTitleNormalized.includes(filterNormalized);
             });
             let updateContexts = {
@@ -2796,9 +2843,11 @@ class ContextListComponent {
                         .normalize('NFD')
                         .replace(/[\u0300-\u036f]/g, '');
                     const contextTitleNormalized = context.title
-                        .toLowerCase()
-                        .normalize('NFD')
-                        .replace(/[\u0300-\u036f]/g, '');
+                        ? context.title
+                            .toLowerCase()
+                            .normalize('NFD')
+                            .replace(/[\u0300-\u036f]/g, '')
+                        : '';
                     return contextTitleNormalized.includes(filterNormalized);
                 });
                 updateContexts.public = publics;
@@ -2810,9 +2859,11 @@ class ContextListComponent {
                         .normalize('NFD')
                         .replace(/[\u0300-\u036f]/g, '');
                     const contextTitleNormalized = context.title
-                        .toLowerCase()
-                        .normalize('NFD')
-                        .replace(/[\u0300-\u036f]/g, '');
+                        ? context.title
+                            .toLowerCase()
+                            .normalize('NFD')
+                            .replace(/[\u0300-\u036f]/g, '')
+                        : '';
                     return contextTitleNormalized.includes(filterNormalized);
                 });
                 updateContexts.shared = shared;
@@ -2845,41 +2896,39 @@ class ContextListComponent {
         }
     }
     sortContextsList(contexts) {
-        if (contexts) {
-            const contextsList = JSON.parse(JSON.stringify(contexts));
-            contextsList.ours.sort((a, b) => {
-                if (this.normalize(a.title) < this.normalize(b.title)) {
+        const contextsList = JSON.parse(JSON.stringify(contexts));
+        contextsList.ours.sort((a, b) => {
+            if (this.normalize(a.title ?? '') < this.normalize(b.title ?? '')) {
+                return -1;
+            }
+            if (this.normalize(a.title ?? '') > this.normalize(b.title ?? '')) {
+                return 1;
+            }
+            return 0;
+        });
+        if (contextsList.shared) {
+            contextsList.shared.sort((a, b) => {
+                if (this.normalize(a.title ?? '') < this.normalize(b.title ?? '')) {
                     return -1;
                 }
-                if (this.normalize(a.title) > this.normalize(b.title)) {
+                if (this.normalize(a.title ?? '') > this.normalize(b.title ?? '')) {
+                    return 1;
+                }
+                return 0;
+            });
+        }
+        else if (contextsList.public) {
+            contextsList.public.sort((a, b) => {
+                if (this.normalize(a.title ?? '') < this.normalize(b.title ?? '')) {
+                    return -1;
+                }
+                if (this.normalize(a.title ?? '') > this.normalize(b.title ?? '')) {
                     return 1;
                 }
                 return 0;
             });
-            if (contextsList.shared) {
-                contextsList.shared.sort((a, b) => {
-                    if (this.normalize(a.title) < this.normalize(b.title)) {
-                        return -1;
-                    }
-                    if (this.normalize(a.title) > this.normalize(b.title)) {
-                        return 1;
-                    }
-                    return 0;
-                });
-            }
-            else if (contextsList.public) {
-                contextsList.public.sort((a, b) => {
-                    if (this.normalize(a.title) < this.normalize(b.title)) {
-                        return -1;
-                    }
-                    if (this.normalize(a.title) > this.normalize(b.title)) {
-                        return 1;
-                    }
-                    return 0;
-                });
-            }
-            return contextsList;
         }
+        return contextsList;
     }
     normalize(str) {
         return str
@@ -2900,14 +2949,13 @@ class ContextListComponent {
             .pipe(take(1))
             .subscribe((title) => {
             if (title) {
-                this.onCreate({ title, empty });
+                this.onCreate({ title, empty: empty ?? false });
             }
         });
     }
     getPermission(user) {
         if (user) {
-            const permission = this.permissions.find((p) => p.name === user.name);
-            return permission;
+            return this.permissions.find((p) => p.name === user.name);
         }
     }
     handleToggleCategory(user, parent) {
@@ -2919,17 +2967,17 @@ class ContextListComponent {
         }
         if (parent) {
             let indeterminate = false;
-            for (const c of parent.childs) {
+            for (const c of parent.childs ?? []) {
                 const cPermission = this.getPermission(c);
-                if (cPermission.checked !== permission.checked) {
+                if (cPermission && cPermission.checked !== permission?.checked) {
                     indeterminate = true;
                     break;
                 }
             }
             const parentPermission = this.getPermission(parent);
             if (parentPermission) {
-                parentPermission.checked = permission.checked;
-                this.storageService.set('contexts.permissions.' + parentPermission.name, permission.checked);
+                parentPermission.checked = permission?.checked ?? false;
+                this.storageService.set('contexts.permissions.' + parentPermission.name, permission?.checked ?? false);
                 parentPermission.indeterminate = indeterminate;
             }
         }
@@ -2937,9 +2985,9 @@ class ContextListComponent {
             for (const c of user.childs) {
                 const childrenPermission = this.getPermission(c);
                 if (childrenPermission &&
-                    childrenPermission.checked !== permission.checked) {
-                    childrenPermission.checked = permission.checked;
-                    this.storageService.set('contexts.permissions.' + childrenPermission.name, permission.checked);
+                    childrenPermission.checked !== permission?.checked) {
+                    childrenPermission.checked = permission?.checked ?? false;
+                    this.storageService.set('contexts.permissions.' + childrenPermission.name, permission?.checked ?? false);
                 }
             }
         }
@@ -2967,7 +3015,7 @@ class ContextListComponent {
         const { toolKey, sidenavKey, languageKey } = this.shareMapService.routeService.options;
         const { context: contextKey } = this.shareMapService.options;
         const baseOrigin = this.shareMapService.sanitizeBaseUrl(this.shareMapService.document.location.href);
-        const url = context.uri === currentContext.uri
+        const url = context.uri === currentContext?.uri
             ? this.shareMapService.generateUrl(this.map(), this.contextService.context$.value)
             : `${baseOrigin}${contextKey}=${context.uri}`;
         const params = [];
@@ -3017,7 +3065,9 @@ class ContextListComponent {
             this.handleContextChanges(changes);
             msgSuccess();
         }), switchMap(() => this.contextService.getDetails(context.id)), tap((fullContext) => {
-            this.contextService.context$.value.layers = fullContext.layers;
+            const currentCtx = this.contextService.context$.value;
+            if (currentCtx)
+                currentCtx.layers = fullContext.layers;
         }), take(1))
             .subscribe();
         this.save.emit(context);
@@ -3026,8 +3076,8 @@ class ContextListComponent {
         const map = this.mapService.getMap();
         changes.layers.created.forEach((layerCreated) => {
             const layer = isLayerItemOptions(layerCreated)
-                ? map.layerController.getBySourceId(layerCreated.sourceOptions.id)
-                : map.layerController.getByTitle(layerCreated.title);
+                ? map?.layerController.getBySourceId(layerCreated.sourceOptions.id)
+                : map?.layerController.getByTitle(layerCreated.title);
             if (layer) {
                 layer.id = layerCreated.id;
             }
@@ -3124,7 +3174,7 @@ class ContextListComponent {
         this.hide.emit(context);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextListComponent, isStandalone: true, selector: "igo-context-list", inputs: { isDesktop: { classPropertyName: "isDesktop", publicName: "isDesktop", isSignal: true, isRequired: false, transformFunction: null }, contexts: { classPropertyName: "contexts", publicName: "contexts", isSignal: false, isRequired: false, transformFunction: null }, selectedContext: { classPropertyName: "selectedContext", publicName: "selectedContext", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, defaultContextId: { classPropertyName: "defaultContextId", publicName: "defaultContextId", isSignal: false, isRequired: false, transformFunction: null }, term: { classPropertyName: "term", publicName: "term", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectedContext: "selectedContextChange", select: "select", unselect: "unselect", edit: "edit", delete: "delete", save: "save", clone: "clone", create: "create", hide: "hide", show: "show", showHiddenContexts: "showHiddenContexts", favorite: "favorite", managePermissions: "managePermissions", manageTools: "manageTools", filterPermissionsChanged: "filterPermissionsChanged" }, ngImport: i0, template: "<igo-list [navigation]=\"true\">\n  <div class=\"context-filter-container\">\n    @if (showFilter()) {\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextManager.filterPlaceHolder' | translate\n        }}</mat-label>\n        <input\n          matInput\n          type=\"text\"\n          [placeholder]=\"\n            'igo.context.contextManager.filterPlaceHolder' | translate\n          \"\n          [(ngModel)]=\"term\"\n        />\n        @if (term.length) {\n          <button\n            mat-icon-button\n            matSuffix\n            class=\"clear-button\"\n            aria-label=\"Clear\"\n            color=\"warn\"\n            (click)=\"clearFilter()\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n    }\n\n    <div class=\"actions-container\">\n      <button\n        mat-icon-button\n        [matTooltip]=\"\n          sortedAlpha\n            ? ('igo.context.contextManager.sortDefault' | translate)\n            : ('igo.context.contextManager.sortAlphabetically' | translate)\n        \"\n        matTooltipShowDelay=\"500\"\n        (click)=\"toggleSort()\"\n      >\n        <igo-icon\n          color=\"primary\"\n          [icon]=\"sortedAlpha ? sortAlphaOnIcon : sortAlphaOffIcon\"\n        />\n      </button>\n\n      @if (auth.authenticated && contextConfigs) {\n        <igo-actionbar\n          class=\"add-context-button\"\n          [iconColor]=\"color\"\n          [store]=\"actionStore\"\n          [withIcon]=\"true\"\n          icon=\"add\"\n          [withTitle]=\"actionbarMode === 'overlay'\"\n          [horizontal]=\"false\"\n          [mode]=\"actionbarMode\"\n        />\n\n        <button\n          class=\"users-filter\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.filterUser' | translate\"\n          matTooltipShowDelay=\"500\"\n          [matMenuTriggerFor]=\"accountMenu\"\n        >\n          <mat-icon color=\"primary\">filter_alt</mat-icon>\n        </button>\n      }\n      <mat-menu #accountMenu=\"matMenu\">\n        @for (user of users; track user.name) {\n          @if (!user.childs) {\n            <button mat-menu-item class=\"profil-menu\">\n              <mat-checkbox\n                [checked]=\"getPermission(user).checked\"\n                [indeterminate]=\"getPermission(user).indeterminate\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n          } @else {\n            <button\n              mat-menu-item\n              [matMenuTriggerFor]=\"subAccountMenu\"\n              class=\"profil-menu\"\n            >\n              <mat-checkbox\n                [checked]=\"getPermission(user).checked\"\n                [indeterminate]=\"getPermission(user).indeterminate\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n            <mat-menu #subAccountMenu=\"matMenu\">\n              @for (child of user.childs; track child.name) {\n                <button mat-menu-item class=\"profil-menu\">\n                  <mat-checkbox\n                    [checked]=\"getPermission(child).checked\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"handleToggleCategory(child, user)\"\n                  >\n                    {{ child.title }}\n                  </mat-checkbox>\n                </button>\n              }\n            </mat-menu>\n          }\n        }\n\n        <button mat-menu-item class=\"profil-menu\">\n          <mat-checkbox\n            [checked]=\"showHidden\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"onShowHiddenContexts()\"\n          />\n          <span>\n            {{ 'igo.context.contextManager.showHidden' | translate }}\n          </span>\n        </button>\n      </mat-menu>\n    </div>\n  </div>\n\n  @for (\n    groupContexts of $any(contexts$ | async) | keyvalue: sortByKeyPriority;\n    track groupContexts\n  ) {\n    @if ($any(groupContexts).value.length) {\n      @if (auth.authenticated) {\n        <igo-collapsible\n          [title]=\"titleMapping[$any(groupContexts).key] | translate\"\n          [collapsed]=\"$any(collapsed[titleMapping[$any(groupContexts).key]])\"\n          (toggle)=\"\n            collapsed[titleMapping[$any(groupContexts).key]] = $any($event)\n          \"\n        >\n          @for (\n            context of $any(groupContexts).value;\n            track context.id ?? context.uri\n          ) {\n            <igo-context-item\n              igoListItem\n              color=\"accent\"\n              [selected]=\"\n                selectedContext() && selectedContext().uri === context.uri\n              \"\n              [context]=\"context\"\n              [default]=\"\n                context.id &&\n                this.defaultContextId &&\n                this.defaultContextId === context.id\n              \"\n              [isDesktop]=\"isDesktop()\"\n              (edit)=\"onEdit(context)\"\n              (delete)=\"onDelete(context)\"\n              (clone)=\"onClone(context)\"\n              (save)=\"onSave(context)\"\n              (hide)=\"onHideContext(context)\"\n              (show)=\"showContext(context)\"\n              (favorite)=\"onFavorite(context)\"\n              (manageTools)=\"onManageTools(context)\"\n              (managePermissions)=\"onManagePermissions(context)\"\n              (select)=\"onSelect(context)\"\n              (unselect)=\"unselect.emit(context)\"\n              (share)=\"onShareContext(context)\"\n            />\n          }\n        </igo-collapsible>\n      } @else {\n        @for (\n          context of $any(groupContexts).value;\n          track context.id ?? context.uri\n        ) {\n          <igo-context-item\n            igoListItem\n            color=\"accent\"\n            [showFavorite]=\"\n              configService.getConfig('favoriteContext4NonAuthenticated')\n            \"\n            [selected]=\"isContextSelected(context)\"\n            [context]=\"context\"\n            [default]=\"\n              contextConfigs\n                ? defaultContextId === context.id\n                : defaultContextId === context.uri\n            \"\n            [isDesktop]=\"isDesktop()\"\n            (edit)=\"onEdit(context)\"\n            (delete)=\"onDelete(context)\"\n            (clone)=\"onClone(context)\"\n            (save)=\"onSave(context)\"\n            (hide)=\"onHideContext(context)\"\n            (show)=\"showContext(context)\"\n            (favorite)=\"onFavorite(context)\"\n            (select)=\"onSelect(context)\"\n            (unselect)=\"unselect.emit(context)\"\n          />\n        }\n      }\n    }\n  }\n\n  @if (isEmpty) {\n    <div class=\"no-result\">\n      {{ 'igo.context.contextManager.noResult' | translate }}\n    </div>\n  }\n</igo-list>\n", styles: [":host{--mat-list-list-item-one-line-container-height: 40px;--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px;--mat-icon-button-state-layer-size: 40px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.context-filter-container{display:flex;align-items:center;padding:8px 4px}.context-filter-container mat-form-field{flex:1}.context-filter-min-width{width:calc(100% - 135px);margin:5px;padding-left:6px}.profil-menu{padding-left:8px}.profil-menu mat-checkbox{margin-right:8px}.add-context-button{margin:0;width:40px;display:inline-flex;overflow:hidden}.actions-container{margin-left:4px}.no-result{padding:16px}\n"], dependencies: [{ kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ActionbarComponent, selector: "igo-actionbar", inputs: ["store", "mode", "withToggleButton", "horizontal", "color", "iconColor", "withTitle", "withTooltip", "scrollActive", "withIcon", "icon", "xPosition", "yPosition", "overlayClass"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "component", type: ContextItemComponent, selector: "igo-context-item", inputs: ["showFavorite", "context", "default", "selected", "isDesktop"], outputs: ["edit", "delete", "save", "clone", "hide", "show", "favorite", "managePermissions", "manageTools", "share"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: IgoIconComponent, selector: "igo-icon", inputs: ["color", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextListComponent, isStandalone: true, selector: "igo-context-list", inputs: { isDesktop: { classPropertyName: "isDesktop", publicName: "isDesktop", isSignal: true, isRequired: false, transformFunction: null }, contexts: { classPropertyName: "contexts", publicName: "contexts", isSignal: false, isRequired: false, transformFunction: null }, selectedContext: { classPropertyName: "selectedContext", publicName: "selectedContext", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, defaultContextId: { classPropertyName: "defaultContextId", publicName: "defaultContextId", isSignal: false, isRequired: false, transformFunction: null }, term: { classPropertyName: "term", publicName: "term", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectedContext: "selectedContextChange", select: "select", unselect: "unselect", edit: "edit", delete: "delete", save: "save", clone: "clone", create: "create", hide: "hide", show: "show", showHiddenContexts: "showHiddenContexts", favorite: "favorite", managePermissions: "managePermissions", manageTools: "manageTools", filterPermissionsChanged: "filterPermissionsChanged" }, ngImport: i0, template: "<igo-list [navigation]=\"true\">\n  <div class=\"context-filter-container\">\n    @if (showFilter()) {\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextManager.filterPlaceHolder' | translate\n        }}</mat-label>\n        <input\n          matInput\n          type=\"text\"\n          [placeholder]=\"\n            'igo.context.contextManager.filterPlaceHolder' | translate\n          \"\n          [(ngModel)]=\"term\"\n        />\n        @if (term.length) {\n          <button\n            mat-icon-button\n            matSuffix\n            class=\"clear-button\"\n            aria-label=\"Clear\"\n            color=\"warn\"\n            (click)=\"clearFilter()\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n    }\n\n    <div class=\"actions-container\">\n      <button\n        mat-icon-button\n        [matTooltip]=\"\n          sortedAlpha\n            ? ('igo.context.contextManager.sortDefault' | translate)\n            : ('igo.context.contextManager.sortAlphabetically' | translate)\n        \"\n        matTooltipShowDelay=\"500\"\n        (click)=\"toggleSort()\"\n      >\n        <igo-icon\n          color=\"primary\"\n          [icon]=\"sortedAlpha ? sortAlphaOnIcon : sortAlphaOffIcon\"\n        />\n      </button>\n\n      @if (auth.authenticated && contextConfigs) {\n        <igo-actionbar\n          class=\"add-context-button\"\n          [iconColor]=\"color\"\n          [store]=\"actionStore\"\n          [withIcon]=\"true\"\n          icon=\"add\"\n          [withTitle]=\"actionbarMode === 'overlay'\"\n          [horizontal]=\"false\"\n          [mode]=\"actionbarMode\"\n        />\n\n        <button\n          class=\"users-filter\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.filterUser' | translate\"\n          matTooltipShowDelay=\"500\"\n          [matMenuTriggerFor]=\"accountMenu\"\n        >\n          <mat-icon color=\"primary\">filter_alt</mat-icon>\n        </button>\n      }\n      <mat-menu #accountMenu=\"matMenu\">\n        @for (user of users; track user.name) {\n          @if (!user.childs) {\n            <button mat-menu-item class=\"profil-menu\">\n              <mat-checkbox\n                [checked]=\"getPermission(user)?.checked ?? false\"\n                [indeterminate]=\"getPermission(user)?.indeterminate ?? false\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n          } @else {\n            <button\n              mat-menu-item\n              [matMenuTriggerFor]=\"subAccountMenu\"\n              class=\"profil-menu\"\n            >\n              <mat-checkbox\n                [checked]=\"getPermission(user)?.checked ?? false\"\n                [indeterminate]=\"getPermission(user)?.indeterminate ?? false\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n            <mat-menu #subAccountMenu=\"matMenu\">\n              @for (child of user.childs; track child.name) {\n                <button mat-menu-item class=\"profil-menu\">\n                  <mat-checkbox\n                    [checked]=\"getPermission(child)?.checked ?? false\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"handleToggleCategory(child, user)\"\n                  >\n                    {{ child.title }}\n                  </mat-checkbox>\n                </button>\n              }\n            </mat-menu>\n          }\n        }\n\n        <button mat-menu-item class=\"profil-menu\">\n          <mat-checkbox\n            [checked]=\"showHidden\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"onShowHiddenContexts()\"\n          />\n          <span>\n            {{ 'igo.context.contextManager.showHidden' | translate }}\n          </span>\n        </button>\n      </mat-menu>\n    </div>\n  </div>\n\n  @for (\n    groupContexts of $any(contexts$ | async) | keyvalue: sortByKeyPriority;\n    track groupContexts\n  ) {\n    @if ($any(groupContexts).value.length) {\n      @if (auth.authenticated) {\n        <igo-collapsible\n          [title]=\"$any(titleMapping)[$any(groupContexts).key] | translate\"\n          [collapsed]=\"\n            $any(collapsed[$any(titleMapping)[$any(groupContexts).key]])\n          \"\n          (toggle)=\"\n            collapsed[$any(titleMapping)[$any(groupContexts).key]] =\n              $any($event)\n          \"\n        >\n          @for (\n            context of $any(groupContexts).value;\n            track context.id ?? context.uri\n          ) {\n            <igo-context-item\n              igoListItem\n              color=\"accent\"\n              [selected]=\"selectedContext()?.uri === context.uri\"\n              [context]=\"context\"\n              [default]=\"\n                context.id &&\n                this.defaultContextId &&\n                this.defaultContextId === context.id\n              \"\n              [isDesktop]=\"isDesktop()\"\n              (edit)=\"onEdit(context)\"\n              (delete)=\"onDelete(context)\"\n              (clone)=\"onClone(context)\"\n              (save)=\"onSave(context)\"\n              (hide)=\"onHideContext(context)\"\n              (show)=\"showContext(context)\"\n              (favorite)=\"onFavorite(context)\"\n              (manageTools)=\"onManageTools(context)\"\n              (managePermissions)=\"onManagePermissions(context)\"\n              (select)=\"onSelect(context)\"\n              (unselect)=\"unselect.emit(context)\"\n              (share)=\"onShareContext(context)\"\n            />\n          }\n        </igo-collapsible>\n      } @else {\n        @for (\n          context of $any(groupContexts).value;\n          track context.id ?? context.uri\n        ) {\n          <igo-context-item\n            igoListItem\n            color=\"accent\"\n            [showFavorite]=\"\n              configService.getConfig('favoriteContext4NonAuthenticated')\n            \"\n            [selected]=\"isContextSelected(context)\"\n            [context]=\"context\"\n            [default]=\"\n              contextConfigs\n                ? defaultContextId === context.id\n                : defaultContextId === context.uri\n            \"\n            [isDesktop]=\"isDesktop()\"\n            (edit)=\"onEdit(context)\"\n            (delete)=\"onDelete(context)\"\n            (clone)=\"onClone(context)\"\n            (save)=\"onSave(context)\"\n            (hide)=\"onHideContext(context)\"\n            (show)=\"showContext(context)\"\n            (favorite)=\"onFavorite(context)\"\n            (select)=\"onSelect(context)\"\n            (unselect)=\"unselect.emit(context)\"\n          />\n        }\n      }\n    }\n  }\n\n  @if (isEmpty) {\n    <div class=\"no-result\">\n      {{ 'igo.context.contextManager.noResult' | translate }}\n    </div>\n  }\n</igo-list>\n", styles: [":host{--mat-list-list-item-one-line-container-height: 40px;--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px;--mat-icon-button-state-layer-size: 40px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.context-filter-container{display:flex;align-items:center;padding:8px 4px}.context-filter-container mat-form-field{flex:1}.context-filter-min-width{width:calc(100% - 135px);margin:5px;padding-left:6px}.profil-menu{padding-left:8px}.profil-menu mat-checkbox{margin-right:8px}.add-context-button{margin:0;width:40px;display:inline-flex;overflow:hidden}.actions-container{margin-left:4px}.no-result{padding:16px}\n"], dependencies: [{ kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ActionbarComponent, selector: "igo-actionbar", inputs: ["store", "mode", "withToggleButton", "horizontal", "color", "iconColor", "withTitle", "withTooltip", "scrollActive", "withIcon", "icon", "xPosition", "yPosition", "overlayClass"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "component", type: ContextItemComponent, selector: "igo-context-item", inputs: ["showFavorite", "context", "default", "selected", "isDesktop"], outputs: ["edit", "delete", "save", "clone", "hide", "show", "favorite", "managePermissions", "manageTools", "share"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: IgoIconComponent, selector: "igo-icon", inputs: ["color", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextListComponent, decorators: [{
             type: Component,
@@ -3146,7 +3196,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         KeyValuePipe,
                         IgoLanguageModule,
                         IgoIconComponent
-                    ], template: "<igo-list [navigation]=\"true\">\n  <div class=\"context-filter-container\">\n    @if (showFilter()) {\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextManager.filterPlaceHolder' | translate\n        }}</mat-label>\n        <input\n          matInput\n          type=\"text\"\n          [placeholder]=\"\n            'igo.context.contextManager.filterPlaceHolder' | translate\n          \"\n          [(ngModel)]=\"term\"\n        />\n        @if (term.length) {\n          <button\n            mat-icon-button\n            matSuffix\n            class=\"clear-button\"\n            aria-label=\"Clear\"\n            color=\"warn\"\n            (click)=\"clearFilter()\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n    }\n\n    <div class=\"actions-container\">\n      <button\n        mat-icon-button\n        [matTooltip]=\"\n          sortedAlpha\n            ? ('igo.context.contextManager.sortDefault' | translate)\n            : ('igo.context.contextManager.sortAlphabetically' | translate)\n        \"\n        matTooltipShowDelay=\"500\"\n        (click)=\"toggleSort()\"\n      >\n        <igo-icon\n          color=\"primary\"\n          [icon]=\"sortedAlpha ? sortAlphaOnIcon : sortAlphaOffIcon\"\n        />\n      </button>\n\n      @if (auth.authenticated && contextConfigs) {\n        <igo-actionbar\n          class=\"add-context-button\"\n          [iconColor]=\"color\"\n          [store]=\"actionStore\"\n          [withIcon]=\"true\"\n          icon=\"add\"\n          [withTitle]=\"actionbarMode === 'overlay'\"\n          [horizontal]=\"false\"\n          [mode]=\"actionbarMode\"\n        />\n\n        <button\n          class=\"users-filter\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.filterUser' | translate\"\n          matTooltipShowDelay=\"500\"\n          [matMenuTriggerFor]=\"accountMenu\"\n        >\n          <mat-icon color=\"primary\">filter_alt</mat-icon>\n        </button>\n      }\n      <mat-menu #accountMenu=\"matMenu\">\n        @for (user of users; track user.name) {\n          @if (!user.childs) {\n            <button mat-menu-item class=\"profil-menu\">\n              <mat-checkbox\n                [checked]=\"getPermission(user).checked\"\n                [indeterminate]=\"getPermission(user).indeterminate\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n          } @else {\n            <button\n              mat-menu-item\n              [matMenuTriggerFor]=\"subAccountMenu\"\n              class=\"profil-menu\"\n            >\n              <mat-checkbox\n                [checked]=\"getPermission(user).checked\"\n                [indeterminate]=\"getPermission(user).indeterminate\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n            <mat-menu #subAccountMenu=\"matMenu\">\n              @for (child of user.childs; track child.name) {\n                <button mat-menu-item class=\"profil-menu\">\n                  <mat-checkbox\n                    [checked]=\"getPermission(child).checked\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"handleToggleCategory(child, user)\"\n                  >\n                    {{ child.title }}\n                  </mat-checkbox>\n                </button>\n              }\n            </mat-menu>\n          }\n        }\n\n        <button mat-menu-item class=\"profil-menu\">\n          <mat-checkbox\n            [checked]=\"showHidden\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"onShowHiddenContexts()\"\n          />\n          <span>\n            {{ 'igo.context.contextManager.showHidden' | translate }}\n          </span>\n        </button>\n      </mat-menu>\n    </div>\n  </div>\n\n  @for (\n    groupContexts of $any(contexts$ | async) | keyvalue: sortByKeyPriority;\n    track groupContexts\n  ) {\n    @if ($any(groupContexts).value.length) {\n      @if (auth.authenticated) {\n        <igo-collapsible\n          [title]=\"titleMapping[$any(groupContexts).key] | translate\"\n          [collapsed]=\"$any(collapsed[titleMapping[$any(groupContexts).key]])\"\n          (toggle)=\"\n            collapsed[titleMapping[$any(groupContexts).key]] = $any($event)\n          \"\n        >\n          @for (\n            context of $any(groupContexts).value;\n            track context.id ?? context.uri\n          ) {\n            <igo-context-item\n              igoListItem\n              color=\"accent\"\n              [selected]=\"\n                selectedContext() && selectedContext().uri === context.uri\n              \"\n              [context]=\"context\"\n              [default]=\"\n                context.id &&\n                this.defaultContextId &&\n                this.defaultContextId === context.id\n              \"\n              [isDesktop]=\"isDesktop()\"\n              (edit)=\"onEdit(context)\"\n              (delete)=\"onDelete(context)\"\n              (clone)=\"onClone(context)\"\n              (save)=\"onSave(context)\"\n              (hide)=\"onHideContext(context)\"\n              (show)=\"showContext(context)\"\n              (favorite)=\"onFavorite(context)\"\n              (manageTools)=\"onManageTools(context)\"\n              (managePermissions)=\"onManagePermissions(context)\"\n              (select)=\"onSelect(context)\"\n              (unselect)=\"unselect.emit(context)\"\n              (share)=\"onShareContext(context)\"\n            />\n          }\n        </igo-collapsible>\n      } @else {\n        @for (\n          context of $any(groupContexts).value;\n          track context.id ?? context.uri\n        ) {\n          <igo-context-item\n            igoListItem\n            color=\"accent\"\n            [showFavorite]=\"\n              configService.getConfig('favoriteContext4NonAuthenticated')\n            \"\n            [selected]=\"isContextSelected(context)\"\n            [context]=\"context\"\n            [default]=\"\n              contextConfigs\n                ? defaultContextId === context.id\n                : defaultContextId === context.uri\n            \"\n            [isDesktop]=\"isDesktop()\"\n            (edit)=\"onEdit(context)\"\n            (delete)=\"onDelete(context)\"\n            (clone)=\"onClone(context)\"\n            (save)=\"onSave(context)\"\n            (hide)=\"onHideContext(context)\"\n            (show)=\"showContext(context)\"\n            (favorite)=\"onFavorite(context)\"\n            (select)=\"onSelect(context)\"\n            (unselect)=\"unselect.emit(context)\"\n          />\n        }\n      }\n    }\n  }\n\n  @if (isEmpty) {\n    <div class=\"no-result\">\n      {{ 'igo.context.contextManager.noResult' | translate }}\n    </div>\n  }\n</igo-list>\n", styles: [":host{--mat-list-list-item-one-line-container-height: 40px;--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px;--mat-icon-button-state-layer-size: 40px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.context-filter-container{display:flex;align-items:center;padding:8px 4px}.context-filter-container mat-form-field{flex:1}.context-filter-min-width{width:calc(100% - 135px);margin:5px;padding-left:6px}.profil-menu{padding-left:8px}.profil-menu mat-checkbox{margin-right:8px}.add-context-button{margin:0;width:40px;display:inline-flex;overflow:hidden}.actions-container{margin-left:4px}.no-result{padding:16px}\n"] }]
+                    ], template: "<igo-list [navigation]=\"true\">\n  <div class=\"context-filter-container\">\n    @if (showFilter()) {\n      <mat-form-field>\n        <mat-label>{{\n          'igo.context.contextManager.filterPlaceHolder' | translate\n        }}</mat-label>\n        <input\n          matInput\n          type=\"text\"\n          [placeholder]=\"\n            'igo.context.contextManager.filterPlaceHolder' | translate\n          \"\n          [(ngModel)]=\"term\"\n        />\n        @if (term.length) {\n          <button\n            mat-icon-button\n            matSuffix\n            class=\"clear-button\"\n            aria-label=\"Clear\"\n            color=\"warn\"\n            (click)=\"clearFilter()\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        }\n      </mat-form-field>\n    }\n\n    <div class=\"actions-container\">\n      <button\n        mat-icon-button\n        [matTooltip]=\"\n          sortedAlpha\n            ? ('igo.context.contextManager.sortDefault' | translate)\n            : ('igo.context.contextManager.sortAlphabetically' | translate)\n        \"\n        matTooltipShowDelay=\"500\"\n        (click)=\"toggleSort()\"\n      >\n        <igo-icon\n          color=\"primary\"\n          [icon]=\"sortedAlpha ? sortAlphaOnIcon : sortAlphaOffIcon\"\n        />\n      </button>\n\n      @if (auth.authenticated && contextConfigs) {\n        <igo-actionbar\n          class=\"add-context-button\"\n          [iconColor]=\"color\"\n          [store]=\"actionStore\"\n          [withIcon]=\"true\"\n          icon=\"add\"\n          [withTitle]=\"actionbarMode === 'overlay'\"\n          [horizontal]=\"false\"\n          [mode]=\"actionbarMode\"\n        />\n\n        <button\n          class=\"users-filter\"\n          mat-icon-button\n          [matTooltip]=\"'igo.context.contextManager.filterUser' | translate\"\n          matTooltipShowDelay=\"500\"\n          [matMenuTriggerFor]=\"accountMenu\"\n        >\n          <mat-icon color=\"primary\">filter_alt</mat-icon>\n        </button>\n      }\n      <mat-menu #accountMenu=\"matMenu\">\n        @for (user of users; track user.name) {\n          @if (!user.childs) {\n            <button mat-menu-item class=\"profil-menu\">\n              <mat-checkbox\n                [checked]=\"getPermission(user)?.checked ?? false\"\n                [indeterminate]=\"getPermission(user)?.indeterminate ?? false\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n          } @else {\n            <button\n              mat-menu-item\n              [matMenuTriggerFor]=\"subAccountMenu\"\n              class=\"profil-menu\"\n            >\n              <mat-checkbox\n                [checked]=\"getPermission(user)?.checked ?? false\"\n                [indeterminate]=\"getPermission(user)?.indeterminate ?? false\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"handleToggleCategory(user)\"\n              />\n              <span>{{ user.title }}</span>\n            </button>\n            <mat-menu #subAccountMenu=\"matMenu\">\n              @for (child of user.childs; track child.name) {\n                <button mat-menu-item class=\"profil-menu\">\n                  <mat-checkbox\n                    [checked]=\"getPermission(child)?.checked ?? false\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"handleToggleCategory(child, user)\"\n                  >\n                    {{ child.title }}\n                  </mat-checkbox>\n                </button>\n              }\n            </mat-menu>\n          }\n        }\n\n        <button mat-menu-item class=\"profil-menu\">\n          <mat-checkbox\n            [checked]=\"showHidden\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"onShowHiddenContexts()\"\n          />\n          <span>\n            {{ 'igo.context.contextManager.showHidden' | translate }}\n          </span>\n        </button>\n      </mat-menu>\n    </div>\n  </div>\n\n  @for (\n    groupContexts of $any(contexts$ | async) | keyvalue: sortByKeyPriority;\n    track groupContexts\n  ) {\n    @if ($any(groupContexts).value.length) {\n      @if (auth.authenticated) {\n        <igo-collapsible\n          [title]=\"$any(titleMapping)[$any(groupContexts).key] | translate\"\n          [collapsed]=\"\n            $any(collapsed[$any(titleMapping)[$any(groupContexts).key]])\n          \"\n          (toggle)=\"\n            collapsed[$any(titleMapping)[$any(groupContexts).key]] =\n              $any($event)\n          \"\n        >\n          @for (\n            context of $any(groupContexts).value;\n            track context.id ?? context.uri\n          ) {\n            <igo-context-item\n              igoListItem\n              color=\"accent\"\n              [selected]=\"selectedContext()?.uri === context.uri\"\n              [context]=\"context\"\n              [default]=\"\n                context.id &&\n                this.defaultContextId &&\n                this.defaultContextId === context.id\n              \"\n              [isDesktop]=\"isDesktop()\"\n              (edit)=\"onEdit(context)\"\n              (delete)=\"onDelete(context)\"\n              (clone)=\"onClone(context)\"\n              (save)=\"onSave(context)\"\n              (hide)=\"onHideContext(context)\"\n              (show)=\"showContext(context)\"\n              (favorite)=\"onFavorite(context)\"\n              (manageTools)=\"onManageTools(context)\"\n              (managePermissions)=\"onManagePermissions(context)\"\n              (select)=\"onSelect(context)\"\n              (unselect)=\"unselect.emit(context)\"\n              (share)=\"onShareContext(context)\"\n            />\n          }\n        </igo-collapsible>\n      } @else {\n        @for (\n          context of $any(groupContexts).value;\n          track context.id ?? context.uri\n        ) {\n          <igo-context-item\n            igoListItem\n            color=\"accent\"\n            [showFavorite]=\"\n              configService.getConfig('favoriteContext4NonAuthenticated')\n            \"\n            [selected]=\"isContextSelected(context)\"\n            [context]=\"context\"\n            [default]=\"\n              contextConfigs\n                ? defaultContextId === context.id\n                : defaultContextId === context.uri\n            \"\n            [isDesktop]=\"isDesktop()\"\n            (edit)=\"onEdit(context)\"\n            (delete)=\"onDelete(context)\"\n            (clone)=\"onClone(context)\"\n            (save)=\"onSave(context)\"\n            (hide)=\"onHideContext(context)\"\n            (show)=\"showContext(context)\"\n            (favorite)=\"onFavorite(context)\"\n            (select)=\"onSelect(context)\"\n            (unselect)=\"unselect.emit(context)\"\n          />\n        }\n      }\n    }\n  }\n\n  @if (isEmpty) {\n    <div class=\"no-result\">\n      {{ 'igo.context.contextManager.noResult' | translate }}\n    </div>\n  }\n</igo-list>\n", styles: [":host{--mat-list-list-item-one-line-container-height: 40px;--mat-form-field-container-height: 48px;--mat-form-field-container-vertical-padding: 12px;--mat-icon-button-state-layer-size: 40px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.context-filter-container{display:flex;align-items:center;padding:8px 4px}.context-filter-container mat-form-field{flex:1}.context-filter-min-width{width:calc(100% - 135px);margin:5px;padding-left:6px}.profil-menu{padding-left:8px}.profil-menu mat-checkbox{margin-right:8px}.add-context-button{margin:0;width:40px;display:inline-flex;overflow:hidden}.actions-container{margin-left:4px}.no-result{padding:16px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { isDesktop: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDesktop", required: false }] }], contexts: [{
                 type: Input
             }], selectedContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedContext", required: false }] }, { type: i0.Output, args: ["selectedContextChange"] }], map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: false }] }], defaultContextId: [{
@@ -3179,7 +3229,7 @@ class ContextPermissionItemComponent {
         const permission = this.permission();
         return (this.canWrite() ||
             (isContextPermissionUser(permission) &&
-                permission.user.externalId === this.user().id));
+                permission.user.externalId === this.user()?.id));
     }, ...(ngDevMode ? [{ debugName: "canDelete" }] : /* istanbul ignore next */ []));
     delete = output();
     isContextPermissionUser = isContextPermissionUser;
@@ -3262,10 +3312,10 @@ class ContextPermissionsComponent {
     form;
     context = model(...(ngDevMode ? [undefined, { debugName: "context" }] : /* istanbul ignore next */ []));
     permissions = model(...(ngDevMode ? [undefined, { debugName: "permissions" }] : /* istanbul ignore next */ []));
-    permissionsRead = computed(() => this.permissions().filter((permission) => permission.typePermission === 'read'), ...(ngDevMode ? [{ debugName: "permissionsRead" }] : /* istanbul ignore next */ []));
-    permissionsWrite = computed(() => this.permissions().filter((permission) => permission.typePermission === 'write'), ...(ngDevMode ? [{ debugName: "permissionsWrite" }] : /* istanbul ignore next */ []));
+    permissionsRead = computed(() => this.permissions()?.filter((permission) => permission.typePermission === 'read'), ...(ngDevMode ? [{ debugName: "permissionsRead" }] : /* istanbul ignore next */ []));
+    permissionsWrite = computed(() => this.permissions()?.filter((permission) => permission.typePermission === 'write'), ...(ngDevMode ? [{ debugName: "permissionsWrite" }] : /* istanbul ignore next */ []));
     profils = signal([], ...(ngDevMode ? [{ debugName: "profils" }] : /* istanbul ignore next */ []));
-    canWrite = computed(() => this.context().permission === 'write', ...(ngDevMode ? [{ debugName: "canWrite" }] : /* istanbul ignore next */ []));
+    canWrite = computed(() => this.context()?.permission === 'write', ...(ngDevMode ? [{ debugName: "canWrite" }] : /* istanbul ignore next */ []));
     baseUrlProfils;
     formControl = new UntypedFormControl();
     formValueChanges$$;
@@ -3284,10 +3334,10 @@ class ContextPermissionsComponent {
         this.handleEditedContextChange();
     }
     displayFn(profil) {
-        return profil ? profil.title : undefined;
+        return profil ? profil.title : '';
     }
     handleFormSubmit(value) {
-        const contextId = this.context().id;
+        const contextId = this.context()?.id;
         this.contextPermissionService
             .add(contextId, value)
             .subscribe((permission) => {
@@ -3315,7 +3365,7 @@ class ContextPermissionsComponent {
         });
     }
     onRemovePermission(permission) {
-        const contextId = this.context().id;
+        const contextId = this.context()?.id;
         this.contextPermissionService
             .delete(contextId, permission.id)
             .subscribe(() => {
@@ -3361,7 +3411,7 @@ class ContextPermissionsComponent {
         }));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextPermissionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextPermissionsComponent, isStandalone: true, selector: "igo-context-permissions", inputs: { context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, permissions: { classPropertyName: "permissions", publicName: "permissions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { context: "contextChange", permissions: "permissionsChange" }, ngImport: i0, template: "@let user = authService.user;\n\n@if (context()) {\n  <div>\n    @if (!canWrite()) {\n      <div class=\"scopeForm\">\n        <h4>{{ 'igo.context.permission.readOnlyTitle' | translate }}</h4>\n        <p>{{ 'igo.context.permission.readOnlyMsg' | translate }}</p>\n      </div>\n    } @else {\n      <div class=\"scopeForm\">\n        <mat-radio-group\n          [(ngModel)]=\"context().scope\"\n          (change)=\"onScopeChanged(context())\"\n        >\n          <mat-radio-button value=\"private\">\n            {{ 'igo.context.permission.scope.private' | translate }}\n          </mat-radio-button>\n          <mat-radio-button value=\"protected\">\n            {{ 'igo.context.permission.scope.shared' | translate }}\n          </mat-radio-button>\n          @if (authService.isAdmin) {\n            <mat-radio-button value=\"public\">\n              {{ 'igo.context.permission.scope.public' | translate }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      </div>\n    }\n    @if (context().scope !== 'private') {\n      @if (canWrite()) {\n        <form [formGroup]=\"form\" (ngSubmit)=\"handleFormSubmit(form.value)\">\n          <mat-form-field class=\"full-width\">\n            <input\n              matInput\n              required\n              [placeholder]=\"'igo.context.permission.user' | translate\"\n              [formControl]=\"formControl\"\n              [matAutocomplete]=\"auto\"\n            />\n            <mat-autocomplete\n              #auto=\"matAutocomplete\"\n              (optionSelected)=\"onProfilSelected($event.option.value)\"\n              [displayWith]=\"displayFn\"\n            >\n              @for (profil of this.profils(); track profil) {\n                <mat-option [value]=\"profil\">\n                  {{ profil.title }}<br />\n                  <small>{{ profil.name }}</small>\n                </mat-option>\n              }\n            </mat-autocomplete>\n            <mat-error>\n              {{ 'igo.context.permission.profilRequired' | translate }}\n            </mat-error>\n          </mat-form-field>\n          <mat-radio-group formControlName=\"typePermission\">\n            <mat-radio-button value=\"read\">\n              {{ 'igo.context.permission.read' | translate }}\n            </mat-radio-button>\n            <mat-radio-button value=\"write\">\n              {{ 'igo.context.permission.write' | translate }}\n            </mat-radio-button>\n          </mat-radio-group>\n          <div class=\"igo-form-button-group\">\n            <button matButton=\"elevated\" type=\"submit\" [disabled]=\"!form.valid\">\n              {{ 'igo.context.permission.addBtn' | translate }}\n            </button>\n          </div>\n        </form>\n      }\n      @if (permissions()) {\n        <igo-list>\n          @if (permissionsRead().length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'read' | translate\"\n            >\n              @for (permission of permissionsRead(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n          @if (permissionsWrite().length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'write' | translate\"\n            >\n              @for (permission of permissionsWrite(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n        </igo-list>\n      }\n    }\n  </div>\n}\n", styles: [".full-width{width:100%}mat-radio-button{padding:14px 14px 14px 0}.scopeForm,form{padding:5px}\n"], dependencies: [{ kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i6$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i6$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ContextPermissionItemComponent, selector: "igo-context-permission-item", inputs: ["permission", "canWrite", "user"], outputs: ["delete"] }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ContextPermissionsComponent, isStandalone: true, selector: "igo-context-permissions", inputs: { context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, permissions: { classPropertyName: "permissions", publicName: "permissions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { context: "contextChange", permissions: "permissionsChange" }, ngImport: i0, template: "@let user = authService.user;\n@let context = this.context();\n@let permissions = this.permissions();\n@if (context) {\n  <div>\n    @if (!canWrite()) {\n      <div class=\"scopeForm\">\n        <h4>{{ 'igo.context.permission.readOnlyTitle' | translate }}</h4>\n        <p>{{ 'igo.context.permission.readOnlyMsg' | translate }}</p>\n      </div>\n    } @else {\n      <div class=\"scopeForm\">\n        <mat-radio-group\n          [(ngModel)]=\"context.scope!\"\n          (change)=\"onScopeChanged(context)\"\n        >\n          <mat-radio-button value=\"private\">\n            {{ 'igo.context.permission.scope.private' | translate }}\n          </mat-radio-button>\n          <mat-radio-button value=\"protected\">\n            {{ 'igo.context.permission.scope.shared' | translate }}\n          </mat-radio-button>\n          @if (authService.isAdmin) {\n            <mat-radio-button value=\"public\">\n              {{ 'igo.context.permission.scope.public' | translate }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      </div>\n    }\n    @if (context.scope !== 'private') {\n      @if (canWrite()) {\n        <form [formGroup]=\"form\" (ngSubmit)=\"handleFormSubmit(form.value)\">\n          <mat-form-field class=\"full-width\">\n            <input\n              matInput\n              required\n              [placeholder]=\"'igo.context.permission.user' | translate\"\n              [formControl]=\"formControl\"\n              [matAutocomplete]=\"auto\"\n            />\n            <mat-autocomplete\n              #auto=\"matAutocomplete\"\n              (optionSelected)=\"onProfilSelected($event.option.value)\"\n              [displayWith]=\"displayFn\"\n            >\n              @for (profil of this.profils(); track profil) {\n                <mat-option [value]=\"profil\">\n                  {{ profil.title }}<br />\n                  <small>{{ profil.name }}</small>\n                </mat-option>\n              }\n            </mat-autocomplete>\n            <mat-error>\n              {{ 'igo.context.permission.profilRequired' | translate }}\n            </mat-error>\n          </mat-form-field>\n          <mat-radio-group formControlName=\"typePermission\">\n            <mat-radio-button value=\"read\">\n              {{ 'igo.context.permission.read' | translate }}\n            </mat-radio-button>\n            <mat-radio-button value=\"write\">\n              {{ 'igo.context.permission.write' | translate }}\n            </mat-radio-button>\n          </mat-radio-group>\n          <div class=\"igo-form-button-group\">\n            <button matButton=\"elevated\" type=\"submit\" [disabled]=\"!form.valid\">\n              {{ 'igo.context.permission.addBtn' | translate }}\n            </button>\n          </div>\n        </form>\n      }\n      @if (permissions) {\n        <igo-list>\n          @if (permissionsRead()?.length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'read' | translate\"\n            >\n              @for (permission of permissionsRead(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user ?? undefined\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n          @if (permissionsWrite()?.length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'write' | translate\"\n            >\n              @for (permission of permissionsWrite(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user ?? undefined\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n        </igo-list>\n      }\n    }\n  </div>\n}\n", styles: [".full-width{width:100%}mat-radio-button{padding:14px 14px 14px 0}.scopeForm,form{padding:5px}\n"], dependencies: [{ kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i6$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i6$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ContextPermissionItemComponent, selector: "igo-context-permission-item", inputs: ["permission", "canWrite", "user"], outputs: ["delete"] }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ContextPermissionsComponent, decorators: [{
             type: Component,
@@ -3381,7 +3431,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatTooltipModule,
                         ReactiveFormsModule,
                         ContextPermissionItemComponent
-                    ], template: "@let user = authService.user;\n\n@if (context()) {\n  <div>\n    @if (!canWrite()) {\n      <div class=\"scopeForm\">\n        <h4>{{ 'igo.context.permission.readOnlyTitle' | translate }}</h4>\n        <p>{{ 'igo.context.permission.readOnlyMsg' | translate }}</p>\n      </div>\n    } @else {\n      <div class=\"scopeForm\">\n        <mat-radio-group\n          [(ngModel)]=\"context().scope\"\n          (change)=\"onScopeChanged(context())\"\n        >\n          <mat-radio-button value=\"private\">\n            {{ 'igo.context.permission.scope.private' | translate }}\n          </mat-radio-button>\n          <mat-radio-button value=\"protected\">\n            {{ 'igo.context.permission.scope.shared' | translate }}\n          </mat-radio-button>\n          @if (authService.isAdmin) {\n            <mat-radio-button value=\"public\">\n              {{ 'igo.context.permission.scope.public' | translate }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      </div>\n    }\n    @if (context().scope !== 'private') {\n      @if (canWrite()) {\n        <form [formGroup]=\"form\" (ngSubmit)=\"handleFormSubmit(form.value)\">\n          <mat-form-field class=\"full-width\">\n            <input\n              matInput\n              required\n              [placeholder]=\"'igo.context.permission.user' | translate\"\n              [formControl]=\"formControl\"\n              [matAutocomplete]=\"auto\"\n            />\n            <mat-autocomplete\n              #auto=\"matAutocomplete\"\n              (optionSelected)=\"onProfilSelected($event.option.value)\"\n              [displayWith]=\"displayFn\"\n            >\n              @for (profil of this.profils(); track profil) {\n                <mat-option [value]=\"profil\">\n                  {{ profil.title }}<br />\n                  <small>{{ profil.name }}</small>\n                </mat-option>\n              }\n            </mat-autocomplete>\n            <mat-error>\n              {{ 'igo.context.permission.profilRequired' | translate }}\n            </mat-error>\n          </mat-form-field>\n          <mat-radio-group formControlName=\"typePermission\">\n            <mat-radio-button value=\"read\">\n              {{ 'igo.context.permission.read' | translate }}\n            </mat-radio-button>\n            <mat-radio-button value=\"write\">\n              {{ 'igo.context.permission.write' | translate }}\n            </mat-radio-button>\n          </mat-radio-group>\n          <div class=\"igo-form-button-group\">\n            <button matButton=\"elevated\" type=\"submit\" [disabled]=\"!form.valid\">\n              {{ 'igo.context.permission.addBtn' | translate }}\n            </button>\n          </div>\n        </form>\n      }\n      @if (permissions()) {\n        <igo-list>\n          @if (permissionsRead().length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'read' | translate\"\n            >\n              @for (permission of permissionsRead(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n          @if (permissionsWrite().length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'write' | translate\"\n            >\n              @for (permission of permissionsWrite(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n        </igo-list>\n      }\n    }\n  </div>\n}\n", styles: [".full-width{width:100%}mat-radio-button{padding:14px 14px 14px 0}.scopeForm,form{padding:5px}\n"] }]
+                    ], template: "@let user = authService.user;\n@let context = this.context();\n@let permissions = this.permissions();\n@if (context) {\n  <div>\n    @if (!canWrite()) {\n      <div class=\"scopeForm\">\n        <h4>{{ 'igo.context.permission.readOnlyTitle' | translate }}</h4>\n        <p>{{ 'igo.context.permission.readOnlyMsg' | translate }}</p>\n      </div>\n    } @else {\n      <div class=\"scopeForm\">\n        <mat-radio-group\n          [(ngModel)]=\"context.scope!\"\n          (change)=\"onScopeChanged(context)\"\n        >\n          <mat-radio-button value=\"private\">\n            {{ 'igo.context.permission.scope.private' | translate }}\n          </mat-radio-button>\n          <mat-radio-button value=\"protected\">\n            {{ 'igo.context.permission.scope.shared' | translate }}\n          </mat-radio-button>\n          @if (authService.isAdmin) {\n            <mat-radio-button value=\"public\">\n              {{ 'igo.context.permission.scope.public' | translate }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      </div>\n    }\n    @if (context.scope !== 'private') {\n      @if (canWrite()) {\n        <form [formGroup]=\"form\" (ngSubmit)=\"handleFormSubmit(form.value)\">\n          <mat-form-field class=\"full-width\">\n            <input\n              matInput\n              required\n              [placeholder]=\"'igo.context.permission.user' | translate\"\n              [formControl]=\"formControl\"\n              [matAutocomplete]=\"auto\"\n            />\n            <mat-autocomplete\n              #auto=\"matAutocomplete\"\n              (optionSelected)=\"onProfilSelected($event.option.value)\"\n              [displayWith]=\"displayFn\"\n            >\n              @for (profil of this.profils(); track profil) {\n                <mat-option [value]=\"profil\">\n                  {{ profil.title }}<br />\n                  <small>{{ profil.name }}</small>\n                </mat-option>\n              }\n            </mat-autocomplete>\n            <mat-error>\n              {{ 'igo.context.permission.profilRequired' | translate }}\n            </mat-error>\n          </mat-form-field>\n          <mat-radio-group formControlName=\"typePermission\">\n            <mat-radio-button value=\"read\">\n              {{ 'igo.context.permission.read' | translate }}\n            </mat-radio-button>\n            <mat-radio-button value=\"write\">\n              {{ 'igo.context.permission.write' | translate }}\n            </mat-radio-button>\n          </mat-radio-group>\n          <div class=\"igo-form-button-group\">\n            <button matButton=\"elevated\" type=\"submit\" [disabled]=\"!form.valid\">\n              {{ 'igo.context.permission.addBtn' | translate }}\n            </button>\n          </div>\n        </form>\n      }\n      @if (permissions) {\n        <igo-list>\n          @if (permissionsRead()?.length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'read' | translate\"\n            >\n              @for (permission of permissionsRead(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user ?? undefined\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n          @if (permissionsWrite()?.length) {\n            <igo-collapsible\n              [title]=\"'igo.context.permission.' + 'write' | translate\"\n            >\n              @for (permission of permissionsWrite(); track permission) {\n                <igo-context-permission-item\n                  [permission]=\"permission\"\n                  [canWrite]=\"canWrite()\"\n                  [user]=\"user ?? undefined\"\n                  (delete)=\"onRemovePermission($event)\"\n                />\n              }\n            </igo-collapsible>\n          }\n        </igo-list>\n      }\n    }\n  </div>\n}\n", styles: [".full-width{width:100%}mat-radio-button{padding:14px 14px 14px 0}.scopeForm,form{padding:5px}\n"] }]
         }], propDecorators: { context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }, { type: i0.Output, args: ["contextChange"] }], permissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "permissions", required: false }] }, { type: i0.Output, args: ["permissionsChange"] }] } });
 const normalizeStr = (str) => str
     .toLowerCase()
@@ -3445,20 +3495,8 @@ class BookmarkButtonComponent {
     dialog = inject(MatDialog);
     contextService = inject(ContextService);
     messageService = inject(MessageService);
-    get map() {
-        return this._map;
-    }
-    set map(value) {
-        this._map = value;
-    }
-    _map;
-    get color() {
-        return this._color;
-    }
-    set color(value) {
-        this._color = value;
-    }
-    _color;
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
     createContext() {
         this.dialog
             .open(BookmarkDialogComponent, { disableClose: false })
@@ -3466,7 +3504,7 @@ class BookmarkButtonComponent {
             .pipe(take(1))
             .subscribe((title) => {
             if (title) {
-                const context = this.contextService.getContextFromMap(this.map);
+                const context = this.contextService.getContextFromMap(this.map());
                 context.title = title;
                 this.contextService.create(context).subscribe(() => {
                     this.messageService.success('igo.context.bookmarkButton.dialog.createMsg', 'igo.context.bookmarkButton.dialog.createTitle', undefined, { value: context.title });
@@ -3476,20 +3514,16 @@ class BookmarkButtonComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: BookmarkButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: BookmarkButtonComponent, isStandalone: true, selector: "igo-bookmark-button", inputs: { map: "map", color: "color" }, ngImport: i0, template: "<div class=\"igo-bookmark-button-container\">\n  <button\n    mat-icon-button\n    [matTooltip]=\"'igo.context.bookmarkButton.create' | translate\"\n    matTooltipPosition=\"above\"\n    [color]=\"color\"\n    (click)=\"createContext()\"\n  >\n    <mat-icon>star</mat-icon>\n  </button>\n</div>\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: BookmarkButtonComponent, isStandalone: true, selector: "igo-bookmark-button", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"igo-bookmark-button-container\">\n  <button\n    mat-icon-button\n    [matTooltip]=\"'igo.context.bookmarkButton.create' | translate\"\n    matTooltipPosition=\"above\"\n    [color]=\"color()\"\n    (click)=\"createContext()\"\n  >\n    <mat-icon>star</mat-icon>\n  </button>\n</div>\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: BookmarkButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-bookmark-button', imports: [MatButtonModule, MatTooltipModule, MatIconModule, IgoLanguageModule], template: "<div class=\"igo-bookmark-button-container\">\n  <button\n    mat-icon-button\n    [matTooltip]=\"'igo.context.bookmarkButton.create' | translate\"\n    matTooltipPosition=\"above\"\n    [color]=\"color\"\n    (click)=\"createContext()\"\n  >\n    <mat-icon>star</mat-icon>\n  </button>\n</div>\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}\n"] }]
-        }], propDecorators: { map: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }] } });
+            args: [{ selector: 'igo-bookmark-button', imports: [MatButtonModule, MatTooltipModule, MatIconModule, IgoLanguageModule], template: "<div class=\"igo-bookmark-button-container\">\n  <button\n    mat-icon-button\n    [matTooltip]=\"'igo.context.bookmarkButton.create' | translate\"\n    matTooltipPosition=\"above\"\n    [color]=\"color()\"\n    (click)=\"createContext()\"\n  >\n    <mat-icon>star</mat-icon>\n  </button>\n</div>\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}\n"] }]
+        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
 
 class PoiDialogComponent {
     dialogRef = inject(MatDialogRef);
-    title;
+    title = '';
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: PoiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: PoiDialogComponent, isStandalone: true, selector: "igo-poi-dialog", ngImport: i0, template: "<h1 mat-dialog-title>\n  {{ 'igo.context.poiButton.dialog.title' | translate }}\n</h1>\n<div mat-dialog-content>\n  <mat-form-field>\n    <input\n      matInput\n      required\n      autocomplete=\"off\"\n      [placeholder]=\"'igo.context.poiButton.dialog.placeholder' | translate\"\n      [(ngModel)]=\"title\"\n    />\n  </mat-form-field>\n</div>\n<div mat-dialog-actions>\n  <button\n    mat-button\n    color=\"primary\"\n    [disabled]=\"!title\"\n    (click)=\"dialogRef.close(title)\"\n  >\n    {{ 'igo.common.confirmDialog.confirmBtn' | translate }}\n  </button>\n  <button matButton (click)=\"dialogRef.close(false)\">\n    {{ 'igo.common.confirmDialog.cancelBtn' | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
@@ -3544,20 +3578,8 @@ class PoiButtonComponent {
     languageService = inject(LanguageService);
     confirmDialogService = inject(ConfirmDialogService);
     selected;
-    get map() {
-        return this._map;
-    }
-    set map(value) {
-        this._map = value;
-    }
-    _map;
-    get color() {
-        return this._color;
-    }
-    set color(value) {
-        this._color = value;
-    }
-    _color;
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
     pois;
     authenticate$$;
     ngOnInit() {
@@ -3599,7 +3621,7 @@ class PoiButtonComponent {
         });
     }
     createPoi() {
-        const view = this.map.ol.getView();
+        const view = this.map().ol.getView();
         const proj = view.getProjection().getCode();
         const center = new olPoint(view.getCenter()).transform(proj, 'EPSG:4326');
         const poi = {
@@ -3627,8 +3649,10 @@ class PoiButtonComponent {
     }
     zoomOnPoi(id) {
         const poi = this.pois.find((p) => p.id === id);
-        const center = olproj.fromLonLat([Number(poi.x), Number(poi.y)], this.map.projection);
-        this.map.ol.getView().animate({
+        if (!poi)
+            return;
+        const center = olproj.fromLonLat([Number(poi.x), Number(poi.y)], this.map().projectionCode);
+        this.map().ol.getView().animate({
             center,
             zoom: poi.zoom,
             duration: 500,
@@ -3636,7 +3660,7 @@ class PoiButtonComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: PoiButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: PoiButtonComponent, isStandalone: true, selector: "igo-poi-button", inputs: { map: "map", color: "color" }, providers: [PoiService], ngImport: i0, template: "<mat-select\n  panelClass=\"poi-select-panel\"\n  class=\"poi-select\"\n  [placeholder]=\"'igo.context.poiButton.placeholder' | translate\"\n  floatPlaceholder=\"never\"\n  [(value)]=\"selected\"\n>\n  <mat-select-trigger>\n    {{ selected?.title || '' }}\n  </mat-select-trigger>\n  <mat-option (click)=\"createPoi()\" class=\"poi-option\">\n    <div\n      class=\"poi-option-row\"\n      [matTooltip]=\"'igo.context.poiButton.create' | translate\"\n      matTooltipPosition=\"above\"\n    >\n      <div class=\"poi-option-text\">\n        {{ 'igo.context.poiButton.create' | translate }}\n      </div>\n      <div class=\"poi-option-button\">\n        <button\n          igoStopPropagation\n          mat-icon-button\n          color=\"primary\"\n          (click)=\"createPoi()\"\n        >\n          <mat-icon>add_circle</mat-icon>\n        </button>\n      </div>\n    </div>\n  </mat-option>\n  <mat-divider />\n  @for (poi of pois; track poi) {\n    <mat-option class=\"poi-option\" [value]=\"poi\" (click)=\"zoomOnPoi(poi.id)\">\n      <div class=\"poi-option-row\">\n        <div\n          class=\"poi-option-text\"\n          [matTooltip]=\"poi.title\"\n          matTooltipPosition=\"above\"\n        >\n          {{ poi.title }}\n        </div>\n        <div class=\"poi-option-button\">\n          <button\n            mat-icon-button\n            igoStopPropagation\n            color=\"warn\"\n            (click)=\"deletePoi(poi)\"\n          >\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      </div>\n    </mat-option>\n  }\n</mat-select>\n", styles: [":host{padding:0 8px;height:100%;display:flex;align-items:center;background-color:var(--mat-sys-surface-bright)}.poi-select{width:175px;height:100%}.poi-option{padding-right:6px;padding-left:6px}.poi-option .poi-option-row{display:flex;align-items:center;width:100%}.poi-option .poi-option-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poi-option .poi-option-button{width:35px;display:flex;align-items:center;justify-content:flex-start}.poi-option ::ng-deep .mat-pseudo-checkbox{display:none}::ng-deep .poi-select .mat-mdc-select-trigger{height:100%;display:flex;align-items:center}::ng-deep .poi-select-panel .mdc-list-item__primary-text{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i5.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: PoiButtonComponent, isStandalone: true, selector: "igo-poi-button", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, providers: [PoiService], ngImport: i0, template: "<mat-select\n  panelClass=\"poi-select-panel\"\n  class=\"poi-select\"\n  [placeholder]=\"'igo.context.poiButton.placeholder' | translate\"\n  floatPlaceholder=\"never\"\n  [(value)]=\"selected\"\n>\n  <mat-select-trigger>\n    {{ selected?.title || '' }}\n  </mat-select-trigger>\n  <mat-option (click)=\"createPoi()\" class=\"poi-option\">\n    <div\n      class=\"poi-option-row\"\n      [matTooltip]=\"'igo.context.poiButton.create' | translate\"\n      matTooltipPosition=\"above\"\n    >\n      <div class=\"poi-option-text\">\n        {{ 'igo.context.poiButton.create' | translate }}\n      </div>\n      <div class=\"poi-option-button\">\n        <button\n          igoStopPropagation\n          mat-icon-button\n          color=\"primary\"\n          (click)=\"createPoi()\"\n        >\n          <mat-icon>add_circle</mat-icon>\n        </button>\n      </div>\n    </div>\n  </mat-option>\n  <mat-divider />\n  @for (poi of pois; track poi) {\n    <mat-option class=\"poi-option\" [value]=\"poi\" (click)=\"zoomOnPoi(poi.id!)\">\n      <div class=\"poi-option-row\">\n        <div\n          class=\"poi-option-text\"\n          [matTooltip]=\"poi.title\"\n          matTooltipPosition=\"above\"\n        >\n          {{ poi.title }}\n        </div>\n        <div class=\"poi-option-button\">\n          <button\n            mat-icon-button\n            igoStopPropagation\n            color=\"warn\"\n            (click)=\"deletePoi(poi)\"\n          >\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      </div>\n    </mat-option>\n  }\n</mat-select>\n", styles: [":host{padding:0 8px;height:100%;display:flex;align-items:center;background-color:var(--mat-sys-surface-bright)}.poi-select{width:175px;height:100%}.poi-option{padding-right:6px;padding-left:6px}.poi-option .poi-option-row{display:flex;align-items:center;width:100%}.poi-option .poi-option-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poi-option .poi-option-button{width:35px;display:flex;align-items:center;justify-content:flex-start}.poi-option ::ng-deep .mat-pseudo-checkbox{display:none}::ng-deep .poi-select .mat-mdc-select-trigger{height:100%;display:flex;align-items:center}::ng-deep .poi-select-panel .mdc-list-item__primary-text{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i5.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: PoiButtonComponent, decorators: [{
             type: Component,
@@ -3649,12 +3673,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatSelectModule,
                         MatTooltipModule,
                         StopPropagationDirective
-                    ], providers: [PoiService], template: "<mat-select\n  panelClass=\"poi-select-panel\"\n  class=\"poi-select\"\n  [placeholder]=\"'igo.context.poiButton.placeholder' | translate\"\n  floatPlaceholder=\"never\"\n  [(value)]=\"selected\"\n>\n  <mat-select-trigger>\n    {{ selected?.title || '' }}\n  </mat-select-trigger>\n  <mat-option (click)=\"createPoi()\" class=\"poi-option\">\n    <div\n      class=\"poi-option-row\"\n      [matTooltip]=\"'igo.context.poiButton.create' | translate\"\n      matTooltipPosition=\"above\"\n    >\n      <div class=\"poi-option-text\">\n        {{ 'igo.context.poiButton.create' | translate }}\n      </div>\n      <div class=\"poi-option-button\">\n        <button\n          igoStopPropagation\n          mat-icon-button\n          color=\"primary\"\n          (click)=\"createPoi()\"\n        >\n          <mat-icon>add_circle</mat-icon>\n        </button>\n      </div>\n    </div>\n  </mat-option>\n  <mat-divider />\n  @for (poi of pois; track poi) {\n    <mat-option class=\"poi-option\" [value]=\"poi\" (click)=\"zoomOnPoi(poi.id)\">\n      <div class=\"poi-option-row\">\n        <div\n          class=\"poi-option-text\"\n          [matTooltip]=\"poi.title\"\n          matTooltipPosition=\"above\"\n        >\n          {{ poi.title }}\n        </div>\n        <div class=\"poi-option-button\">\n          <button\n            mat-icon-button\n            igoStopPropagation\n            color=\"warn\"\n            (click)=\"deletePoi(poi)\"\n          >\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      </div>\n    </mat-option>\n  }\n</mat-select>\n", styles: [":host{padding:0 8px;height:100%;display:flex;align-items:center;background-color:var(--mat-sys-surface-bright)}.poi-select{width:175px;height:100%}.poi-option{padding-right:6px;padding-left:6px}.poi-option .poi-option-row{display:flex;align-items:center;width:100%}.poi-option .poi-option-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poi-option .poi-option-button{width:35px;display:flex;align-items:center;justify-content:flex-start}.poi-option ::ng-deep .mat-pseudo-checkbox{display:none}::ng-deep .poi-select .mat-mdc-select-trigger{height:100%;display:flex;align-items:center}::ng-deep .poi-select-panel .mdc-list-item__primary-text{width:100%}\n"] }]
-        }], propDecorators: { map: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }] } });
+                    ], providers: [PoiService], template: "<mat-select\n  panelClass=\"poi-select-panel\"\n  class=\"poi-select\"\n  [placeholder]=\"'igo.context.poiButton.placeholder' | translate\"\n  floatPlaceholder=\"never\"\n  [(value)]=\"selected\"\n>\n  <mat-select-trigger>\n    {{ selected?.title || '' }}\n  </mat-select-trigger>\n  <mat-option (click)=\"createPoi()\" class=\"poi-option\">\n    <div\n      class=\"poi-option-row\"\n      [matTooltip]=\"'igo.context.poiButton.create' | translate\"\n      matTooltipPosition=\"above\"\n    >\n      <div class=\"poi-option-text\">\n        {{ 'igo.context.poiButton.create' | translate }}\n      </div>\n      <div class=\"poi-option-button\">\n        <button\n          igoStopPropagation\n          mat-icon-button\n          color=\"primary\"\n          (click)=\"createPoi()\"\n        >\n          <mat-icon>add_circle</mat-icon>\n        </button>\n      </div>\n    </div>\n  </mat-option>\n  <mat-divider />\n  @for (poi of pois; track poi) {\n    <mat-option class=\"poi-option\" [value]=\"poi\" (click)=\"zoomOnPoi(poi.id!)\">\n      <div class=\"poi-option-row\">\n        <div\n          class=\"poi-option-text\"\n          [matTooltip]=\"poi.title\"\n          matTooltipPosition=\"above\"\n        >\n          {{ poi.title }}\n        </div>\n        <div class=\"poi-option-button\">\n          <button\n            mat-icon-button\n            igoStopPropagation\n            color=\"warn\"\n            (click)=\"deletePoi(poi)\"\n          >\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      </div>\n    </mat-option>\n  }\n</mat-select>\n", styles: [":host{padding:0 8px;height:100%;display:flex;align-items:center;background-color:var(--mat-sys-surface-bright)}.poi-select{width:175px;height:100%}.poi-option{padding-right:6px;padding-left:6px}.poi-option .poi-option-row{display:flex;align-items:center;width:100%}.poi-option .poi-option-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poi-option .poi-option-button{width:35px;display:flex;align-items:center;justify-content:flex-start}.poi-option ::ng-deep .mat-pseudo-checkbox{display:none}::ng-deep .poi-select .mat-mdc-select-trigger{height:100%;display:flex;align-items:center}::ng-deep .poi-select-panel .mdc-list-item__primary-text{width:100%}\n"] }]
+        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
 
 function userButtonSlideInOut() {
     return trigger('userButtonState', [
@@ -3679,13 +3699,15 @@ class UserDialogComponent {
     constructor() {
         const decodeToken = this.auth.decodeToken();
         this.user = decodeToken?.user;
-        this.exp = new Date(decodeToken.exp * 1000).toLocaleString();
+        this.exp = decodeToken?.exp
+            ? new Date(decodeToken.exp * 1000).toLocaleString()
+            : undefined;
     }
     clearPreferences() {
         this.storageService.clear();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UserDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: UserDialogComponent, isStandalone: true, selector: "igo-user-dialog", ngImport: i0, template: "<h1 mat-dialog-title>\n  {{ 'igo.context.userButton.infoTitle' | translate }}\n</h1>\n<div mat-dialog-content>\n  <p>\n    {{ 'igo.context.userButton.dialog.user' | translate }}: {{ user.sourceId }}\n  </p>\n  <p>\n    {{ 'igo.context.userButton.dialog.email' | translate }}: {{ user.email }}\n  </p>\n  <p>{{ 'igo.context.userButton.dialog.expiration' | translate }}: {{ exp }}</p>\n  <button mat-stroked-button color=\"primary\" (click)=\"clearPreferences()\">\n    {{ 'igo.context.userButton.dialog.clearPreferences' | translate }}\n  </button>\n  <br />\n</div>\n<div mat-dialog-actions style=\"justify-content: center\">\n  <button matButton=\"elevated\" color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: UserDialogComponent, isStandalone: true, selector: "igo-user-dialog", ngImport: i0, template: "<h1 mat-dialog-title>\n  {{ 'igo.context.userButton.infoTitle' | translate }}\n</h1>\n<div mat-dialog-content>\n  <p>\n    {{ 'igo.context.userButton.dialog.user' | translate }}: {{ user?.sourceId }}\n  </p>\n  <p>\n    {{ 'igo.context.userButton.dialog.email' | translate }}: {{ user?.email }}\n  </p>\n  <p>{{ 'igo.context.userButton.dialog.expiration' | translate }}: {{ exp }}</p>\n  <button mat-stroked-button color=\"primary\" (click)=\"clearPreferences()\">\n    {{ 'igo.context.userButton.dialog.clearPreferences' | translate }}\n  </button>\n  <br />\n</div>\n<div mat-dialog-actions style=\"justify-content: center\">\n  <button matButton=\"elevated\" color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UserDialogComponent, decorators: [{
             type: Component,
@@ -3695,27 +3717,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatButtonModule,
                         MatDialogActions,
                         IgoLanguageModule
-                    ], template: "<h1 mat-dialog-title>\n  {{ 'igo.context.userButton.infoTitle' | translate }}\n</h1>\n<div mat-dialog-content>\n  <p>\n    {{ 'igo.context.userButton.dialog.user' | translate }}: {{ user.sourceId }}\n  </p>\n  <p>\n    {{ 'igo.context.userButton.dialog.email' | translate }}: {{ user.email }}\n  </p>\n  <p>{{ 'igo.context.userButton.dialog.expiration' | translate }}: {{ exp }}</p>\n  <button mat-stroked-button color=\"primary\" (click)=\"clearPreferences()\">\n    {{ 'igo.context.userButton.dialog.clearPreferences' | translate }}\n  </button>\n  <br />\n</div>\n<div mat-dialog-actions style=\"justify-content: center\">\n  <button matButton=\"elevated\" color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n" }]
+                    ], template: "<h1 mat-dialog-title>\n  {{ 'igo.context.userButton.infoTitle' | translate }}\n</h1>\n<div mat-dialog-content>\n  <p>\n    {{ 'igo.context.userButton.dialog.user' | translate }}: {{ user?.sourceId }}\n  </p>\n  <p>\n    {{ 'igo.context.userButton.dialog.email' | translate }}: {{ user?.email }}\n  </p>\n  <p>{{ 'igo.context.userButton.dialog.expiration' | translate }}: {{ exp }}</p>\n  <button mat-stroked-button color=\"primary\" (click)=\"clearPreferences()\">\n    {{ 'igo.context.userButton.dialog.clearPreferences' | translate }}\n  </button>\n  <br />\n</div>\n<div mat-dialog-actions style=\"justify-content: center\">\n  <button matButton=\"elevated\" color=\"primary\" (click)=\"dialogRef.close(false)\">\n    OK\n  </button>\n</div>\n" }]
         }], ctorParameters: () => [] });
 
 class UserButtonComponent {
     dialog = inject(MatDialog);
     config = inject(ConfigService);
     auth = inject(AuthService);
-    get map() {
-        return this._map;
-    }
-    set map(value) {
-        this._map = value;
-    }
-    _map;
-    get color() {
-        return this._color;
-    }
-    set color(value) {
-        this._color = value;
-    }
-    _color;
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
     expand = false;
     visible = false;
     hasApi = false;
@@ -3739,7 +3749,7 @@ class UserButtonComponent {
         this.dialog.open(UserDialogComponent, { disableClose: false });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UserButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: UserButtonComponent, isStandalone: true, selector: "igo-user-button", inputs: { map: "map", color: "color" }, ngImport: i0, template: "@if (visible) {\n  <div class=\"igo-user-button-container\">\n    <div\n      class=\"igo-user-button-more-container\"\n      [@userButtonState]=\"expand ? 'expand' : 'collapse'\"\n    >\n      @if (hasApi) {\n        <igo-poi-button [color]=\"color\" [map]=\"map\" />\n      }\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.infoTitle' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color\"\n        (click)=\"infoUser()\"\n      >\n        <mat-icon>info</mat-icon>\n      </button>\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.logout' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color\"\n        (click)=\"logout()\"\n      >\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n    <button\n      mat-icon-button\n      [color]=\"auth.authenticated ? color : 'warn'\"\n      (click)=\"accountClick()\"\n    >\n      <mat-icon>account_box</mat-icon>\n    </button>\n  </div>\n}\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}.igo-user-button-container,.igo-user-button-more-container{display:flex;gap:4px}\n"], dependencies: [{ kind: "component", type: PoiButtonComponent, selector: "igo-poi-button", inputs: ["map", "color"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], animations: [userButtonSlideInOut()] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: UserButtonComponent, isStandalone: true, selector: "igo-user-button", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (visible) {\n  <div class=\"igo-user-button-container\">\n    <div\n      class=\"igo-user-button-more-container\"\n      [@userButtonState]=\"expand ? 'expand' : 'collapse'\"\n    >\n      @if (hasApi) {\n        <igo-poi-button [color]=\"color()\" [map]=\"map()\" />\n      }\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.infoTitle' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color()\"\n        (click)=\"infoUser()\"\n      >\n        <mat-icon>info</mat-icon>\n      </button>\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.logout' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color()\"\n        (click)=\"logout()\"\n      >\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n    <button\n      mat-icon-button\n      [color]=\"auth.authenticated ? color() : 'warn'\"\n      (click)=\"accountClick()\"\n    >\n      <mat-icon>account_box</mat-icon>\n    </button>\n  </div>\n}\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}.igo-user-button-container,.igo-user-button-more-container{display:flex;gap:4px}\n"], dependencies: [{ kind: "component", type: PoiButtonComponent, selector: "igo-poi-button", inputs: ["map", "color"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }], animations: [userButtonSlideInOut()] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UserButtonComponent, decorators: [{
             type: Component,
@@ -3749,12 +3759,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatTooltipModule,
                         MatIconModule,
                         IgoLanguageModule
-                    ], template: "@if (visible) {\n  <div class=\"igo-user-button-container\">\n    <div\n      class=\"igo-user-button-more-container\"\n      [@userButtonState]=\"expand ? 'expand' : 'collapse'\"\n    >\n      @if (hasApi) {\n        <igo-poi-button [color]=\"color\" [map]=\"map\" />\n      }\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.infoTitle' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color\"\n        (click)=\"infoUser()\"\n      >\n        <mat-icon>info</mat-icon>\n      </button>\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.logout' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color\"\n        (click)=\"logout()\"\n      >\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n    <button\n      mat-icon-button\n      [color]=\"auth.authenticated ? color : 'warn'\"\n      (click)=\"accountClick()\"\n    >\n      <mat-icon>account_box</mat-icon>\n    </button>\n  </div>\n}\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}.igo-user-button-container,.igo-user-button-more-container{display:flex;gap:4px}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { map: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }] } });
+                    ], template: "@if (visible) {\n  <div class=\"igo-user-button-container\">\n    <div\n      class=\"igo-user-button-more-container\"\n      [@userButtonState]=\"expand ? 'expand' : 'collapse'\"\n    >\n      @if (hasApi) {\n        <igo-poi-button [color]=\"color()\" [map]=\"map()\" />\n      }\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.infoTitle' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color()\"\n        (click)=\"infoUser()\"\n      >\n        <mat-icon>info</mat-icon>\n      </button>\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.context.userButton.logout' | translate\"\n        matTooltipPosition=\"above\"\n        [color]=\"color()\"\n        (click)=\"logout()\"\n      >\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n    <button\n      mat-icon-button\n      [color]=\"auth.authenticated ? color() : 'warn'\"\n      (click)=\"accountClick()\"\n    >\n      <mat-icon>account_box</mat-icon>\n    </button>\n  </div>\n}\n", styles: [":host button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}:host button .mat-ripple,:host button .mdc-icon-button__ripple{border-radius:0!important}.igo-user-button-container,.igo-user-button-more-container{display:flex;gap:4px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
 
 /**
  * @deprecated import the components/directives directly or CONTEXT_MAP_BUTTON_DIRECTIVES for the set
@@ -3804,7 +3810,7 @@ class ShareMapUrlComponent {
     contextService = inject(ContextService);
     cdRef = inject(ChangeDetectorRef);
     mapState$$;
-    map = input(undefined, ...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
     url;
     ngOnInit() {
         this.generateUrl();
@@ -3829,7 +3835,7 @@ class ShareMapUrlComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapUrlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ShareMapUrlComponent, isStandalone: true, selector: "igo-share-map-url", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"igo-input-container\">\n  <mat-form-field>\n    <textarea\n      #textArea\n      matInput\n      readonly\n      rows=\"3\"\n      [placeholder]=\"'igo.context.shareMap.placeholderLink' | translate\"\n      [value]=\"url\"\n    ></textarea>\n  </mat-form-field>\n\n  <div class=\"igo-share-map-url-content\">\n    <div class=\"igo-form-button-group\">\n      <button matButton=\"elevated\" (click)=\"copyTextToClipboard(textArea)\">\n        <mat-icon>content_copy</mat-icon>\n        {{ 'igo.context.shareMap.copy' | translate }}\n      </button>\n    </div>\n\n    <div>\n      <br />\n      <section>\n        @if (('igo.context.shareMap.htmlClarifications' | translate) === '') {\n          <div>\n            @if (('igo.context.shareMap.included' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.included' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.context' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.context' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.center' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.center' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.zoom' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.zoom' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.addedLayers' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.addedLayers' | translate }}\n                </li>\n              }\n              @if (\n                ('igo.context.shareMap.visibleInvisible' | translate) !== ''\n              ) {\n                <li>\n                  {{ 'igo.context.shareMap.visibleInvisible' | translate }}\n                </li>\n              }\n            </ul>\n            @if (('igo.context.shareMap.excluded' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.excluded' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.order' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.order' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.opacity' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.opacity' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterOgc' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterOgc' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterTime' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterTime' | translate }}\n                </li>\n              }\n            </ul>\n          </div>\n        }\n        @if (('igo.context.shareMap.htmlClarifications' | translate) !== '') {\n          <igo-custom-html\n            class=\"shareCustomPadding\"\n            [html]=\"'igo.context.shareMap.htmlClarifications' | translate\"\n          />\n        }\n      </section>\n    </div>\n  </div>\n</div>\n", styles: ["mat-form-field{width:100%}.igo-share-map-url-content{padding:16px}.igo-form-button-group{text-align:center}igo-custom-html.shareCustomPadding{padding:0}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ShareMapUrlComponent, isStandalone: true, selector: "igo-share-map-url", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"igo-input-container\">\n  <mat-form-field>\n    <textarea\n      #textArea\n      matInput\n      readonly\n      rows=\"3\"\n      [placeholder]=\"'igo.context.shareMap.placeholderLink' | translate\"\n      [value]=\"url\"\n    ></textarea>\n  </mat-form-field>\n\n  <div class=\"igo-share-map-url-content\">\n    <div class=\"igo-form-button-group\">\n      <button matButton=\"elevated\" (click)=\"copyTextToClipboard(textArea)\">\n        <mat-icon>content_copy</mat-icon>\n        {{ 'igo.context.shareMap.copy' | translate }}\n      </button>\n    </div>\n\n    <div>\n      <br />\n      <section>\n        @if (('igo.context.shareMap.htmlClarifications' | translate) === '') {\n          <div>\n            @if (('igo.context.shareMap.included' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.included' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.context' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.context' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.center' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.center' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.zoom' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.zoom' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.addedLayers' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.addedLayers' | translate }}\n                </li>\n              }\n              @if (\n                ('igo.context.shareMap.visibleInvisible' | translate) !== ''\n              ) {\n                <li>\n                  {{ 'igo.context.shareMap.visibleInvisible' | translate }}\n                </li>\n              }\n            </ul>\n            @if (('igo.context.shareMap.excluded' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.excluded' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.order' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.order' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.opacity' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.opacity' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterOgc' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterOgc' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterTime' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterTime' | translate }}\n                </li>\n              }\n            </ul>\n          </div>\n        }\n        @if (('igo.context.shareMap.htmlClarifications' | translate) !== '') {\n          <igo-custom-html\n            class=\"shareCustomPadding\"\n            [html]=\"'igo.context.shareMap.htmlClarifications' | translate\"\n          />\n        }\n      </section>\n    </div>\n  </div>\n</div>\n", styles: ["mat-form-field{width:100%}.igo-share-map-url-content{padding:16px}.igo-form-button-group{text-align:center}igo-custom-html.shareCustomPadding{padding:0}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapUrlComponent, decorators: [{
             type: Component,
@@ -3841,17 +3847,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         IgoLanguageModule,
                         CustomHtmlComponent
                     ], template: "<div class=\"igo-input-container\">\n  <mat-form-field>\n    <textarea\n      #textArea\n      matInput\n      readonly\n      rows=\"3\"\n      [placeholder]=\"'igo.context.shareMap.placeholderLink' | translate\"\n      [value]=\"url\"\n    ></textarea>\n  </mat-form-field>\n\n  <div class=\"igo-share-map-url-content\">\n    <div class=\"igo-form-button-group\">\n      <button matButton=\"elevated\" (click)=\"copyTextToClipboard(textArea)\">\n        <mat-icon>content_copy</mat-icon>\n        {{ 'igo.context.shareMap.copy' | translate }}\n      </button>\n    </div>\n\n    <div>\n      <br />\n      <section>\n        @if (('igo.context.shareMap.htmlClarifications' | translate) === '') {\n          <div>\n            @if (('igo.context.shareMap.included' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.included' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.context' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.context' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.center' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.center' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.zoom' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.zoom' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.addedLayers' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.addedLayers' | translate }}\n                </li>\n              }\n              @if (\n                ('igo.context.shareMap.visibleInvisible' | translate) !== ''\n              ) {\n                <li>\n                  {{ 'igo.context.shareMap.visibleInvisible' | translate }}\n                </li>\n              }\n            </ul>\n            @if (('igo.context.shareMap.excluded' | translate) !== '') {\n              <h4>\n                {{ 'igo.context.shareMap.excluded' | translate }}\n              </h4>\n            }\n            <ul>\n              @if (('igo.context.shareMap.order' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.order' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.opacity' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.opacity' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterOgc' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterOgc' | translate }}\n                </li>\n              }\n              @if (('igo.context.shareMap.filterTime' | translate) !== '') {\n                <li>\n                  {{ 'igo.context.shareMap.filterTime' | translate }}\n                </li>\n              }\n            </ul>\n          </div>\n        }\n        @if (('igo.context.shareMap.htmlClarifications' | translate) !== '') {\n          <igo-custom-html\n            class=\"shareCustomPadding\"\n            [html]=\"'igo.context.shareMap.htmlClarifications' | translate\"\n          />\n        }\n      </section>\n    </div>\n  </div>\n</div>\n", styles: ["mat-form-field{width:100%}.igo-share-map-url-content{padding:16px}.igo-form-button-group{text-align:center}igo-custom-html.shareCustomPadding{padding:0}\n"] }]
-        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: false }] }] } });
+        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }] } });
 
 class ShareMapComponent {
-    map = input(undefined, ...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: ShareMapComponent, isStandalone: true, selector: "igo-share-map", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<igo-share-map-url [map]=\"map()\" />\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: ShareMapUrlComponent, selector: "igo-share-map-url", inputs: ["map"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: ShareMapComponent, isStandalone: true, selector: "igo-share-map", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<igo-share-map-url [map]=\"map()\" />\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: ShareMapUrlComponent, selector: "igo-share-map-url", inputs: ["map"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ShareMapComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igo-share-map', imports: [MatTabsModule, ShareMapUrlComponent], template: "<igo-share-map-url [map]=\"map()\" />\n" }]
-        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: false }] }] } });
+        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }] } });
 
 const SHARE_MAP_DIRECTIVES = [
     ShareMapComponent,
@@ -3881,64 +3887,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
 class SidenavComponent {
     titleService = inject(Title);
     format = new GeoJSON();
-    get map() {
-        return this._map;
-    }
-    set map(value) {
-        this._map = value;
-    }
-    _map;
-    get opened() {
-        return this._opened;
-    }
-    set opened(value) {
-        this._opened = value;
-    }
-    _opened;
-    get feature() {
-        return this._feature;
-    }
-    set feature(value) {
-        this._feature = value;
-    }
-    _feature;
-    get tool() {
-        return this._tool;
-    }
-    set tool(value) {
-        this._tool = value;
-    }
-    _tool;
-    get media() {
-        return this._media;
-    }
-    set media(value) {
-        this._media = value;
-    }
-    _media;
-    get title() {
-        return this._title;
-    }
-    set title(value) {
-        if (value) {
-            this._title = value;
-        }
-    }
-    _title;
+    map = input.required(...(ngDevMode ? [{ debugName: "map" }] : /* istanbul ignore next */ []));
+    opened = input(false, ...(ngDevMode ? [{ debugName: "opened" }] : /* istanbul ignore next */ []));
+    feature = input.required(...(ngDevMode ? [{ debugName: "feature" }] : /* istanbul ignore next */ []));
+    tool = input(...(ngDevMode ? [undefined, { debugName: "tool" }] : /* istanbul ignore next */ []));
+    media = input(...(ngDevMode ? [undefined, { debugName: "media" }] : /* istanbul ignore next */ []));
+    title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
     topPanelState = 'initial';
+    _defaultTitle = this.titleService.getTitle();
+    displayTitle = computed(() => this.title() || this._defaultTitle, ...(ngDevMode ? [{ debugName: "displayTitle" }] : /* istanbul ignore next */ []));
     get featureTitle() {
-        return this.feature ? getEntityTitle(this.feature) : undefined;
-    }
-    constructor() {
-        this._title = this.titleService.getTitle();
+        const feature = this.feature();
+        return feature ? getEntityTitle(feature) : undefined;
     }
     zoomToFeatureExtent() {
-        if (this.feature.geometry) {
-            const olFeature = this.format.readFeature(this.feature, {
-                dataProjection: this.feature.projection,
-                featureProjection: this.map.viewProjection
+        const feature = this.feature();
+        if (feature?.geometry) {
+            const olFeature = this.format.readFeature(feature, {
+                dataProjection: feature.projection,
+                featureProjection: this.map().viewProjection
             });
-            moveToOlFeatures(this.map.viewController, olFeature, FeatureMotion.Zoom);
+            moveToOlFeatures(this.map().viewController, olFeature, FeatureMotion.Zoom);
         }
     }
     toggleTopPanel() {
@@ -3950,7 +3919,7 @@ class SidenavComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: SidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: SidenavComponent, isStandalone: true, selector: "igo-sidenav", inputs: { map: "map", opened: "opened", feature: "feature", tool: "tool", media: "media", title: "title" }, ngImport: i0, template: "<mat-sidenav #sidenav igoSidenavShim mode=\"side\" [opened]=\"opened\">\n  <div class=\"igo-sidenav-content\">\n    <igo-flexible\n      #topPanel\n      initial=\"50%\"\n      initialMobile=\"100%\"\n      expanded=\"calc(100% - 58px)\"\n      [state]=\"topPanelState\"\n    >\n      <div class=\"igo-content\">\n        <igo-panel [title]=\"tool ? (tool.title | translate) : title\">\n          @if (tool) {\n            <button\n              mat-icon-button\n              panelLeftButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.goBack' | translate\"\n            >\n              <mat-icon>arrow_back</mat-icon>\n            </button>\n          }\n\n          @if (tool) {\n            <button\n              mat-icon-button\n              panelRightButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n            >\n              <mat-icon>menu</mat-icon>\n            </button>\n          }\n        </igo-panel>\n      </div>\n\n      <div igoFlexibleFill class=\"igo-content\">\n        @if (feature && media !== 'mobile') {\n          <igo-panel [title]=\"featureTitle\">\n            <button\n              mat-icon-button\n              panelLeftButton\n              class=\"igo-icon-button\"\n              (click)=\"toggleTopPanel()\"\n            >\n              <mat-icon>{{\n                ['collapsed', 'initial'].indexOf(topPanel.state) >= 0\n                  ? 'arrow_downward'\n                  : 'arrow_upward'\n              }}</mat-icon>\n            </button>\n            @if (feature.geometry) {\n              <button\n                mat-icon-button\n                panelRightButton\n                class=\"igo-icon-button\"\n                (click)=\"zoomToFeatureExtent()\"\n              >\n                <mat-icon>zoom_in</mat-icon>\n              </button>\n            }\n            @if (['collapsed', 'initial'].indexOf(topPanel.state) >= 0) {\n              <igo-feature-details [feature]=\"feature\" />\n            }\n          </igo-panel>\n        }\n      </div>\n    </igo-flexible>\n  </div>\n</mat-sidenav>\n", styles: [":host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}:host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{border-top-width:1px;border-top-style:solid;border-top-color:#0003}mat-sidenav{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}:host{background-color:#fff}:host ::ng-deep mat-sidenav{z-index:3!important}mat-sidenav{width:400px}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-sidenav{width:calc(100% - 45px)}}.igo-sidenav-content{margin-top:50px;height:calc(100% - 50px)}igo-feature-details ::ng-deep table{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: FlexibleComponent, selector: "igo-flexible", inputs: ["initial", "collapsed", "expanded", "initialMobile", "collapsedMobile", "expandedMobile", "direction", "state"] }, { kind: "component", type: PanelComponent, selector: "igo-panel", inputs: ["title", "withHeader", "cursorPointer"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: FeatureDetailsComponent, selector: "igo-feature-details", inputs: ["source", "map", "toolbox", "feature"], outputs: ["routeEvent", "selectFeature", "htmlDisplayEvent"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: SidenavComponent, isStandalone: true, selector: "igo-sidenav", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null }, feature: { classPropertyName: "feature", publicName: "feature", isSignal: true, isRequired: true, transformFunction: null }, tool: { classPropertyName: "tool", publicName: "tool", isSignal: true, isRequired: false, transformFunction: null }, media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-sidenav #sidenav igoSidenavShim mode=\"side\" [opened]=\"opened()\">\n  <div class=\"igo-sidenav-content\">\n    <igo-flexible\n      #topPanel\n      initial=\"50%\"\n      initialMobile=\"100%\"\n      expanded=\"calc(100% - 58px)\"\n      [state]=\"topPanelState\"\n    >\n      <div class=\"igo-content\">\n        <igo-panel\n          [title]=\"tool() ? (tool()!.title | translate) : displayTitle()\"\n        >\n          @if (tool()) {\n            <button\n              mat-icon-button\n              panelLeftButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.goBack' | translate\"\n            >\n              <mat-icon>arrow_back</mat-icon>\n            </button>\n          }\n\n          @if (tool()) {\n            <button\n              mat-icon-button\n              panelRightButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n            >\n              <mat-icon>menu</mat-icon>\n            </button>\n          }\n        </igo-panel>\n      </div>\n\n      <div igoFlexibleFill class=\"igo-content\">\n        @if (feature() && media() !== 'mobile') {\n          <igo-panel [title]=\"featureTitle\">\n            <button\n              mat-icon-button\n              panelLeftButton\n              class=\"igo-icon-button\"\n              (click)=\"toggleTopPanel()\"\n            >\n              <mat-icon>{{\n                ['collapsed', 'initial'].indexOf(topPanel.state) >= 0\n                  ? 'arrow_downward'\n                  : 'arrow_upward'\n              }}</mat-icon>\n            </button>\n            @if (feature()?.geometry) {\n              <button\n                mat-icon-button\n                panelRightButton\n                class=\"igo-icon-button\"\n                (click)=\"zoomToFeatureExtent()\"\n              >\n                <mat-icon>zoom_in</mat-icon>\n              </button>\n            }\n            @if (['collapsed', 'initial'].indexOf(topPanel.state) >= 0) {\n              <igo-feature-details [feature]=\"feature()!\" />\n            }\n          </igo-panel>\n        }\n      </div>\n    </igo-flexible>\n  </div>\n</mat-sidenav>\n", styles: [":host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}:host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{border-top-width:1px;border-top-style:solid;border-top-color:#0003}mat-sidenav{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}:host{background-color:#fff}:host ::ng-deep mat-sidenav{z-index:3!important}mat-sidenav{width:400px}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-sidenav{width:calc(100% - 45px)}}.igo-sidenav-content{margin-top:50px;height:calc(100% - 50px)}igo-feature-details ::ng-deep table{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i1$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: FlexibleComponent, selector: "igo-flexible", inputs: ["initial", "collapsed", "expanded", "initialMobile", "collapsedMobile", "expandedMobile", "direction", "state"] }, { kind: "component", type: PanelComponent, selector: "igo-panel", inputs: ["title", "withHeader", "cursorPointer"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: FeatureDetailsComponent, selector: "igo-feature-details", inputs: ["source", "map", "toolbox", "feature"], outputs: ["routeEvent", "selectFeature", "htmlDisplayEvent"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i5$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: SidenavComponent, decorators: [{
             type: Component,
@@ -3963,20 +3932,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MatIconModule,
                         FeatureDetailsComponent,
                         IgoLanguageModule
-                    ], template: "<mat-sidenav #sidenav igoSidenavShim mode=\"side\" [opened]=\"opened\">\n  <div class=\"igo-sidenav-content\">\n    <igo-flexible\n      #topPanel\n      initial=\"50%\"\n      initialMobile=\"100%\"\n      expanded=\"calc(100% - 58px)\"\n      [state]=\"topPanelState\"\n    >\n      <div class=\"igo-content\">\n        <igo-panel [title]=\"tool ? (tool.title | translate) : title\">\n          @if (tool) {\n            <button\n              mat-icon-button\n              panelLeftButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.goBack' | translate\"\n            >\n              <mat-icon>arrow_back</mat-icon>\n            </button>\n          }\n\n          @if (tool) {\n            <button\n              mat-icon-button\n              panelRightButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n            >\n              <mat-icon>menu</mat-icon>\n            </button>\n          }\n        </igo-panel>\n      </div>\n\n      <div igoFlexibleFill class=\"igo-content\">\n        @if (feature && media !== 'mobile') {\n          <igo-panel [title]=\"featureTitle\">\n            <button\n              mat-icon-button\n              panelLeftButton\n              class=\"igo-icon-button\"\n              (click)=\"toggleTopPanel()\"\n            >\n              <mat-icon>{{\n                ['collapsed', 'initial'].indexOf(topPanel.state) >= 0\n                  ? 'arrow_downward'\n                  : 'arrow_upward'\n              }}</mat-icon>\n            </button>\n            @if (feature.geometry) {\n              <button\n                mat-icon-button\n                panelRightButton\n                class=\"igo-icon-button\"\n                (click)=\"zoomToFeatureExtent()\"\n              >\n                <mat-icon>zoom_in</mat-icon>\n              </button>\n            }\n            @if (['collapsed', 'initial'].indexOf(topPanel.state) >= 0) {\n              <igo-feature-details [feature]=\"feature\" />\n            }\n          </igo-panel>\n        }\n      </div>\n    </igo-flexible>\n  </div>\n</mat-sidenav>\n", styles: [":host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}:host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{border-top-width:1px;border-top-style:solid;border-top-color:#0003}mat-sidenav{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}:host{background-color:#fff}:host ::ng-deep mat-sidenav{z-index:3!important}mat-sidenav{width:400px}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-sidenav{width:calc(100% - 45px)}}.igo-sidenav-content{margin-top:50px;height:calc(100% - 50px)}igo-feature-details ::ng-deep table{width:100%}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { map: [{
-                type: Input
-            }], opened: [{
-                type: Input
-            }], feature: [{
-                type: Input
-            }], tool: [{
-                type: Input
-            }], media: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }] } });
+                    ], template: "<mat-sidenav #sidenav igoSidenavShim mode=\"side\" [opened]=\"opened()\">\n  <div class=\"igo-sidenav-content\">\n    <igo-flexible\n      #topPanel\n      initial=\"50%\"\n      initialMobile=\"100%\"\n      expanded=\"calc(100% - 58px)\"\n      [state]=\"topPanelState\"\n    >\n      <div class=\"igo-content\">\n        <igo-panel\n          [title]=\"tool() ? (tool()!.title | translate) : displayTitle()\"\n        >\n          @if (tool()) {\n            <button\n              mat-icon-button\n              panelLeftButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.goBack' | translate\"\n            >\n              <mat-icon>arrow_back</mat-icon>\n            </button>\n          }\n\n          @if (tool()) {\n            <button\n              mat-icon-button\n              panelRightButton\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.context.sidenav.mainMenu' | translate\"\n            >\n              <mat-icon>menu</mat-icon>\n            </button>\n          }\n        </igo-panel>\n      </div>\n\n      <div igoFlexibleFill class=\"igo-content\">\n        @if (feature() && media() !== 'mobile') {\n          <igo-panel [title]=\"featureTitle\">\n            <button\n              mat-icon-button\n              panelLeftButton\n              class=\"igo-icon-button\"\n              (click)=\"toggleTopPanel()\"\n            >\n              <mat-icon>{{\n                ['collapsed', 'initial'].indexOf(topPanel.state) >= 0\n                  ? 'arrow_downward'\n                  : 'arrow_upward'\n              }}</mat-icon>\n            </button>\n            @if (feature()?.geometry) {\n              <button\n                mat-icon-button\n                panelRightButton\n                class=\"igo-icon-button\"\n                (click)=\"zoomToFeatureExtent()\"\n              >\n                <mat-icon>zoom_in</mat-icon>\n              </button>\n            }\n            @if (['collapsed', 'initial'].indexOf(topPanel.state) >= 0) {\n              <igo-feature-details [feature]=\"feature()!\" />\n            }\n          </igo-panel>\n        }\n      </div>\n    </igo-flexible>\n  </div>\n</mat-sidenav>\n", styles: [":host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}:host ::ng-deep .igo-flexible-fill .igo-container,.igo-sidenav-content .igo-flexible-fill .igo-container{border-top-width:1px;border-top-style:solid;border-top-color:#0003}mat-sidenav{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd}:host{background-color:#fff}:host ::ng-deep mat-sidenav{z-index:3!important}mat-sidenav{width:400px}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-sidenav{width:calc(100% - 45px)}}.igo-sidenav-content{margin-top:50px;height:calc(100% - 50px)}igo-feature-details ::ng-deep table{width:100%}\n"] }]
+        }], propDecorators: { map: [{ type: i0.Input, args: [{ isSignal: true, alias: "map", required: true }] }], opened: [{ type: i0.Input, args: [{ isSignal: true, alias: "opened", required: false }] }], feature: [{ type: i0.Input, args: [{ isSignal: true, alias: "feature", required: true }] }], tool: [{ type: i0.Input, args: [{ isSignal: true, alias: "tool", required: false }] }], media: [{ type: i0.Input, args: [{ isSignal: true, alias: "media", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] } });
 
 /**
  * @deprecated import the SidenavComponent directly