oip-common 0.1.6 → 0.1.7

package/fesm2022/oip-common.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, inject, InjectionToken, signal, computed, effect, ChangeDetectorRef, Component, Input, PLATFORM_ID, HostBinding, EventEmitter, Output, ViewChild, Renderer2, SecurityContext, ChangeDetectionStrategy, Pipe } from '@angular/core';
+import { Injectable, inject, InjectionToken, signal, computed, effect, ChangeDetectorRef, Component, Input, PLATFORM_ID, HostBinding, EventEmitter, Output, ViewChild, Renderer2, SecurityContext, ChangeDetectionStrategy, makeEnvironmentProviders, Pipe } from '@angular/core';
 import * as i2$6 from 'primeng/api';
 import { MessageService, ConfirmationService, PrimeIcons, SharedModule } from 'primeng/api';
 import { HttpErrorResponse, HttpClient as HttpClient$1, HttpHeaders } from '@angular/common/http';
@@ -934,11 +934,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }] } });
 
-const presets = {
-    Aura,
-    Lara,
-    Nora
-};
+const APP_THEME_PRESETS = new InjectionToken('APP_THEME_PRESETS', {
+    factory: () => []
+});
+const APP_THEME_PRESETS_MERGE_MODE = new InjectionToken('APP_THEME_PRESETS_MERGE_MODE', {
+    factory: () => 'mergeWithDefaults'
+});
+
+const DEFAULT_THEME_PRESETS = [
+    { id: 'Aura', label: 'Aura', preset: Aura },
+    { id: 'Lara', label: 'Lara', preset: Lara },
+    { id: 'Nora', label: 'Nora', preset: Nora }
+];
+const PRIMARY_COLORS = [
+    'emerald',
+    'green',
+    'lime',
+    'orange',
+    'amber',
+    'yellow',
+    'teal',
+    'cyan',
+    'sky',
+    'blue',
+    'indigo',
+    'violet',
+    'purple',
+    'fuchsia',
+    'pink',
+    'rose'
+];
 class AppConfiguratorComponent {
     constructor() {
         this.router = inject(Router);
@@ -946,7 +971,14 @@ class AppConfiguratorComponent {
         this.layoutService = inject(LayoutService);
         this.platformId = inject(PLATFORM_ID);
         this.primeng = inject(PrimeNG);
-        this.presets = Object.keys(presets);
+        this.injectedThemePresets = inject(APP_THEME_PRESETS);
+        this.themePresetMergeMode = inject(APP_THEME_PRESETS_MERGE_MODE);
+        this.themePresets = this.getThemePresets();
+        this.themePresetsMap = new Map(this.themePresets.map((theme) => [theme.id, theme]));
+        this.defaultThemePreset = this.themePresets[0] ?? DEFAULT_THEME_PRESETS[0];
+        this.fallbackPrimaryColors = (DEFAULT_THEME_PRESETS[0].preset
+            .primitive ?? {});
+        this.presets = this.themePresets.map((theme) => ({ label: theme.label ?? theme.id, value: theme.id }));
         this.showMenuModeButton = signal(!this.router.url.includes('auth'), ...(ngDevMode ? [{ debugName: "showMenuModeButton" }] : []));
         this.menuModeOptions = [
             { label: 'Static', value: 'static' },
@@ -1097,43 +1129,23 @@ class AppConfiguratorComponent {
         this.selectedPreset = computed(() => this.layoutService.layoutConfig().preset, ...(ngDevMode ? [{ debugName: "selectedPreset" }] : []));
         this.menuMode = computed(() => this.layoutService.layoutConfig().menuMode, ...(ngDevMode ? [{ debugName: "menuMode" }] : []));
         this.primaryColors = computed(() => {
-            const presetPalette = presets[this.layoutService.layoutConfig().preset].primitive;
-            const colors = [
-                'emerald',
-                'green',
-                'lime',
-                'orange',
-                'amber',
-                'yellow',
-                'teal',
-                'cyan',
-                'sky',
-                'blue',
-                'indigo',
-                'violet',
-                'purple',
-                'fuchsia',
-                'pink',
-                'rose'
-            ];
-            const palettes = [{ name: 'noir', palette: {} }];
-            colors.forEach((color) => {
-                palettes.push({
-                    name: color,
-                    palette: presetPalette?.[color]
-                });
-            });
-            return palettes;
+            const activeThemePreset = this.getThemeById(this.layoutService.layoutConfig().preset);
+            return this.getPrimaryColorOptions(activeThemePreset);
         }, ...(ngDevMode ? [{ debugName: "primaryColors" }] : []));
+        this.surfaceColors = computed(() => {
+            const activeThemePreset = this.getThemeById(this.layoutService.layoutConfig().preset);
+            return this.getSurfaceColorOptions(activeThemePreset);
+        }, ...(ngDevMode ? [{ debugName: "surfaceColors" }] : []));
     }
     ngOnInit() {
         if (isPlatformBrowser(this.platformId)) {
-            this.onPresetChange(this.layoutService.layoutConfig().preset);
+            const presetId = this.ensureValidThemeId(this.layoutService.layoutConfig().preset);
+            this.onPresetChange(presetId);
         }
     }
     getPresetExt() {
         const color = this.primaryColors().find((c) => c.name === this.selectedPrimaryColor()) || {};
-        const preset = this.layoutService.layoutConfig().preset;
+        const preset = this.getThemeById(this.layoutService.layoutConfig().preset).id;
         if (color.name === 'noir') {
             return {
                 semantic: {
@@ -1258,6 +1270,59 @@ class AppConfiguratorComponent {
             };
         }
     }
+    getThemePresets() {
+        const source = this.themePresetMergeMode === 'replaceDefaults' ? [] : [...DEFAULT_THEME_PRESETS];
+        const result = [...source];
+        for (const theme of this.injectedThemePresets ?? []) {
+            if (!theme?.id || !theme?.preset) {
+                continue;
+            }
+            const index = result.findIndex((item) => item.id === theme.id);
+            if (index >= 0) {
+                result[index] = theme;
+            }
+            else {
+                result.push(theme);
+            }
+        }
+        return result;
+    }
+    getThemeById(themeId) {
+        return this.themePresetsMap.get(themeId ?? '') ?? this.defaultThemePreset;
+    }
+    getPrimaryColorOptions(activeThemePreset) {
+        if (activeThemePreset.primaryColors) {
+            return Object.entries(activeThemePreset.primaryColors)
+                .filter((entry) => Boolean(entry[1]))
+                .map(([name, palette]) => ({ name, palette }));
+        }
+        const presetPalette = (activeThemePreset.preset.primitive ?? {});
+        const palettes = [{ name: 'noir', palette: {} }];
+        PRIMARY_COLORS.forEach((color) => {
+            palettes.push({
+                name: color,
+                palette: presetPalette[color] ?? this.fallbackPrimaryColors[color]
+            });
+        });
+        return palettes;
+    }
+    getSurfaceColorOptions(activeThemePreset) {
+        if (activeThemePreset.surfaceColors) {
+            return Object.entries(activeThemePreset.surfaceColors)
+                .filter((entry) => Boolean(entry[1]))
+                .map(([name, palette]) => ({ name, palette }));
+        }
+        return this.surfaces;
+    }
+    ensureValidThemeId(themeId) {
+        if (themeId && this.themePresetsMap.has(themeId)) {
+            return themeId;
+        }
+        if (themeId && isPlatformBrowser(this.platformId)) {
+            console.warn(`[AppConfigurator] Unknown theme preset "${themeId}", fallback to "${this.defaultThemePreset.id}".`);
+        }
+        return this.defaultThemePreset.id;
+    }
     updateColors(event, type, color) {
         if (type === 'primary') {
             this.layoutService.layoutConfig.update((state) => ({
@@ -1283,12 +1348,20 @@ class AppConfiguratorComponent {
         }
     }
     onPresetChange(event) {
+        const nextThemeId = this.ensureValidThemeId(event);
+        const nextTheme = this.getThemeById(nextThemeId);
+        const primaryColors = this.getPrimaryColorOptions(nextTheme);
+        const surfaceColors = this.getSurfaceColorOptions(nextTheme);
         this.layoutService.layoutConfig.update((state) => ({
             ...state,
-            preset: event
+            preset: nextThemeId,
+            primary: primaryColors.some((color) => color.name === state.primary) ? state.primary : (primaryColors[0]?.name ?? state.primary),
+            surface: nextTheme.surfaceColors && !surfaceColors.some((color) => color.name === state.surface)
+                ? (surfaceColors[0]?.name ?? state.surface)
+                : state.surface
         }));
-        const preset = presets[event];
-        const surfacePalette = this.surfaces.find((s) => s.name === this.selectedSurfaceColor())?.palette;
+        const preset = nextTheme.preset;
+        const surfacePalette = this.surfaceColors().find((s) => s.name === this.selectedSurfaceColor())?.palette;
         $t().preset(preset).preset(this.getPresetExt()).surfacePalette(surfacePalette).use({ useDefaultOptions: true });
     }
     onMenuModeChange(event) {
@@ -1298,73 +1371,75 @@ class AppConfiguratorComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppConfiguratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AppConfiguratorComponent, isStandalone: true, selector: "app-configurator", host: { classAttribute: "hidden absolute top-[3.25rem] right-0 w-72 p-4 bg-surface-0 dark:bg-surface-900 border border-surface rounded-border origin-top shadow-[0px_3px_5px_rgba(0,0,0,0.02),0px_0px_2px_rgba(0,0,0,0.05),0px_1px_4px_rgba(0,0,0,0.08)]" }, ngImport: i0, template: `
-    <div class="flex flex-col gap-4">
-      <div>
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
-        <div class="pt-2 flex gap-2 flex-wrap justify-start">
-          @for (primaryColor of primaryColors(); track primaryColor.name) {
-            <button
-              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
-              id="oip-app-configurator-primary-color-{{ primaryColor.name }}"
-              type="button"
-              [ngClass]="{
-                'outline-primary': primaryColor.name === selectedPrimaryColor()
-              }"
-              [style]="{
-                'background-color': primaryColor?.name === 'noir' ? 'var(--text-color)' : primaryColor?.palette?.['500']
-              }"
-              [title]="primaryColor.name"
-              (click)="updateColors($event, 'primary', primaryColor)"></button>
-          }
-        </div>
-      </div>
-      <div>
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
-        <div class="pt-2 flex gap-2 flex-wrap justify-start">
-          @for (surface of surfaces; track surface.name) {
-            <button
-              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
-              id="oip-app-configurator-surface-color-{{ surface.name }}"
-              type="button"
-              [ngClass]="{
-                'outline-primary': selectedSurfaceColor()
-                  ? selectedSurfaceColor() === surface.name
-                  : layoutService.layoutConfig().darkTheme
-                    ? surface.name === 'zinc'
-                    : surface.name === 'slate'
-              }"
-              [style]="{
-                'background-color': surface?.name === 'noir' ? 'var(--text-color)' : surface?.palette?.['500']
-              }"
-              [title]="surface.name"
-              (click)="updateColors($event, 'surface', surface)"></button>
-          }
-        </div>
-      </div>
-      <div class="flex flex-col gap-2">
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
-        <p-selectButton
-          id="oip-app-configurator-preset-select-button"
-          size="small"
-          [allowEmpty]="false"
-          [ngModel]="selectedPreset()"
-          [options]="presets"
-          (ngModelChange)="onPresetChange($event)" />
-      </div>
-      @if (showMenuModeButton()) {
-        <div class="flex flex-col gap-2">
-          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
-          <p-selectButton
-            id="oip-app-configurator-menu-mode-select-button"
-            size="small"
-            [allowEmpty]="false"
-            [ngModel]="menuMode()"
-            [options]="menuModeOptions"
-            (ngModelChange)="onMenuModeChange($event)" />
-        </div>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AppConfiguratorComponent, isStandalone: true, selector: "app-configurator", host: { classAttribute: "hidden absolute top-[3.25rem] right-0 w-72 p-4 bg-surface-0 dark:bg-surface-900 border border-surface rounded-border origin-top shadow-[0px_3px_5px_rgba(0,0,0,0.02),0px_0px_2px_rgba(0,0,0,0.05),0px_1px_4px_rgba(0,0,0,0.08)]" }, ngImport: i0, template: `
+    <div class="flex flex-col gap-4">
+      <div>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
+        <div class="pt-2 flex gap-2 flex-wrap justify-start">
+          @for (primaryColor of primaryColors(); track primaryColor.name) {
+            <button
+              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
+              id="oip-app-configurator-primary-color-{{ primaryColor.name }}"
+              type="button"
+              [ngClass]="{
+                'outline-primary': primaryColor.name === selectedPrimaryColor()
+              }"
+              [style]="{
+                'background-color': primaryColor?.name === 'noir' ? 'var(--text-color)' : primaryColor?.palette?.['500']
+              }"
+              [title]="primaryColor.name"
+              (click)="updateColors($event, 'primary', primaryColor)"></button>
+          }
+        </div>
+      </div>
+      <div>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
+        <div class="pt-2 flex gap-2 flex-wrap justify-start">
+          @for (surface of surfaceColors(); track surface.name) {
+            <button
+              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
+              id="oip-app-configurator-surface-color-{{ surface.name }}"
+              type="button"
+              [ngClass]="{
+                'outline-primary': selectedSurfaceColor()
+                  ? selectedSurfaceColor() === surface.name
+                  : layoutService.layoutConfig().darkTheme
+                    ? surface.name === 'zinc'
+                    : surface.name === 'slate'
+              }"
+              [style]="{
+                'background-color': surface?.name === 'noir' ? 'var(--text-color)' : surface?.palette?.['500']
+              }"
+              [title]="surface.name"
+              (click)="updateColors($event, 'surface', surface)"></button>
+          }
+        </div>
+      </div>
+      <div class="flex flex-col gap-2">
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
+        <p-selectButton
+          id="oip-app-configurator-preset-select-button"
+          size="small"
+          [allowEmpty]="false"
+          [ngModel]="selectedPreset()"
+          [options]="presets"
+          optionLabel="label"
+          optionValue="value"
+          (ngModelChange)="onPresetChange($event)" />
+      </div>
+      @if (showMenuModeButton()) {
+        <div class="flex flex-col gap-2">
+          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
+          <p-selectButton
+            id="oip-app-configurator-menu-mode-select-button"
+            size="small"
+            [allowEmpty]="false"
+            [ngModel]="menuMode()"
+            [options]="menuModeOptions"
+            (ngModelChange)="onMenuModeChange($event)" />
+        </div>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { 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: SelectButtonModule }, { kind: "component", type: i3.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AppConfiguratorComponent, decorators: [{
@@ -1373,73 +1448,75 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                     selector: 'app-configurator',
                     standalone: true,
                     imports: [CommonModule, FormsModule, SelectButtonModule, TranslatePipe],
-                    template: `
-    <div class="flex flex-col gap-4">
-      <div>
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
-        <div class="pt-2 flex gap-2 flex-wrap justify-start">
-          @for (primaryColor of primaryColors(); track primaryColor.name) {
-            <button
-              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
-              id="oip-app-configurator-primary-color-{{ primaryColor.name }}"
-              type="button"
-              [ngClass]="{
-                'outline-primary': primaryColor.name === selectedPrimaryColor()
-              }"
-              [style]="{
-                'background-color': primaryColor?.name === 'noir' ? 'var(--text-color)' : primaryColor?.palette?.['500']
-              }"
-              [title]="primaryColor.name"
-              (click)="updateColors($event, 'primary', primaryColor)"></button>
-          }
-        </div>
-      </div>
-      <div>
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
-        <div class="pt-2 flex gap-2 flex-wrap justify-start">
-          @for (surface of surfaces; track surface.name) {
-            <button
-              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
-              id="oip-app-configurator-surface-color-{{ surface.name }}"
-              type="button"
-              [ngClass]="{
-                'outline-primary': selectedSurfaceColor()
-                  ? selectedSurfaceColor() === surface.name
-                  : layoutService.layoutConfig().darkTheme
-                    ? surface.name === 'zinc'
-                    : surface.name === 'slate'
-              }"
-              [style]="{
-                'background-color': surface?.name === 'noir' ? 'var(--text-color)' : surface?.palette?.['500']
-              }"
-              [title]="surface.name"
-              (click)="updateColors($event, 'surface', surface)"></button>
-          }
-        </div>
-      </div>
-      <div class="flex flex-col gap-2">
-        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
-        <p-selectButton
-          id="oip-app-configurator-preset-select-button"
-          size="small"
-          [allowEmpty]="false"
-          [ngModel]="selectedPreset()"
-          [options]="presets"
-          (ngModelChange)="onPresetChange($event)" />
-      </div>
-      @if (showMenuModeButton()) {
-        <div class="flex flex-col gap-2">
-          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
-          <p-selectButton
-            id="oip-app-configurator-menu-mode-select-button"
-            size="small"
-            [allowEmpty]="false"
-            [ngModel]="menuMode()"
-            [options]="menuModeOptions"
-            (ngModelChange)="onMenuModeChange($event)" />
-        </div>
-      }
-    </div>
+                    template: `
+    <div class="flex flex-col gap-4">
+      <div>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
+        <div class="pt-2 flex gap-2 flex-wrap justify-start">
+          @for (primaryColor of primaryColors(); track primaryColor.name) {
+            <button
+              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
+              id="oip-app-configurator-primary-color-{{ primaryColor.name }}"
+              type="button"
+              [ngClass]="{
+                'outline-primary': primaryColor.name === selectedPrimaryColor()
+              }"
+              [style]="{
+                'background-color': primaryColor?.name === 'noir' ? 'var(--text-color)' : primaryColor?.palette?.['500']
+              }"
+              [title]="primaryColor.name"
+              (click)="updateColors($event, 'primary', primaryColor)"></button>
+          }
+        </div>
+      </div>
+      <div>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
+        <div class="pt-2 flex gap-2 flex-wrap justify-start">
+          @for (surface of surfaceColors(); track surface.name) {
+            <button
+              class="border-none w-5 h-5 rounded-full p-0 cursor-pointer outline-none outline-offset-1"
+              id="oip-app-configurator-surface-color-{{ surface.name }}"
+              type="button"
+              [ngClass]="{
+                'outline-primary': selectedSurfaceColor()
+                  ? selectedSurfaceColor() === surface.name
+                  : layoutService.layoutConfig().darkTheme
+                    ? surface.name === 'zinc'
+                    : surface.name === 'slate'
+              }"
+              [style]="{
+                'background-color': surface?.name === 'noir' ? 'var(--text-color)' : surface?.palette?.['500']
+              }"
+              [title]="surface.name"
+              (click)="updateColors($event, 'surface', surface)"></button>
+          }
+        </div>
+      </div>
+      <div class="flex flex-col gap-2">
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
+        <p-selectButton
+          id="oip-app-configurator-preset-select-button"
+          size="small"
+          [allowEmpty]="false"
+          [ngModel]="selectedPreset()"
+          [options]="presets"
+          optionLabel="label"
+          optionValue="value"
+          (ngModelChange)="onPresetChange($event)" />
+      </div>
+      @if (showMenuModeButton()) {
+        <div class="flex flex-col gap-2">
+          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
+          <p-selectButton
+            id="oip-app-configurator-menu-mode-select-button"
+            size="small"
+            [allowEmpty]="false"
+            [ngModel]="menuMode()"
+            [options]="menuModeOptions"
+            (ngModelChange)="onMenuModeChange($event)" />
+        </div>
+      }
+    </div>
   `,
                     host: {
                         class: 'hidden absolute top-[3.25rem] right-0 w-72 p-4 bg-surface-0 dark:bg-surface-900 border border-surface rounded-border origin-top shadow-[0px_3px_5px_rgba(0,0,0,0.02),0px_0px_2px_rgba(0,0,0,0.05),0px_1px_4px_rgba(0,0,0,0.08)]'
@@ -6060,6 +6137,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             type: Injectable
         }] });
 
+function provideAppThemes(themes, options) {
+    const mode = options?.mode ?? 'mergeWithDefaults';
+    return makeEnvironmentProviders([
+        { provide: APP_THEME_PRESETS, useValue: themes },
+        { provide: APP_THEME_PRESETS_MERGE_MODE, useValue: mode }
+    ]);
+}
+function mergeWithDefaults(themes) {
+    return provideAppThemes(themes, { mode: 'mergeWithDefaults' });
+}
+function replaceDefaults(themes) {
+    return provideAppThemes(themes, { mode: 'replaceDefaults' });
+}
+
 const langIntercept = (req, next) => {
     const layoutService = inject(LayoutService);
     const lang = layoutService.language() ? layoutService.language() : 'en';
@@ -6132,5 +6223,5 @@ const httpLoaderAuthFactory = (httpClient) => {
  * Generated bundle index. Do not edit.
  */
 
-export { AppConfiguratorComponent, AppFloatingConfiguratorComponent, AppLayoutComponent, AppModulesComponent, AppTopbar, AuthGuardService, BaseDataService, BaseModuleComponent, ConfigComponent, ContentType, DEFAULT_OIP_FRONTEND_CONFIG, DbMigrationComponent, DiscussionComponent, ErrorComponent, FooterComponent, HttpClient, KeycloakSecurityService, L10nService, LOGO_COMPONENT_TOKEN, LayoutService, LogoComponent, LogoService, MenuComponent, MenuService, MsgService, NotfoundComponent, NotificationService, OIP_FRONTEND_CONFIG, ProfileComponent, SecurePipe, SecurityComponent, SecurityDataService, SecurityService, SecurityStorageService, SidebarComponent, TableFilterService, TopBarService, UnauthorizedComponent, UserService, httpLoaderAuthFactory, langIntercept, provideLogoComponent };
+export { APP_THEME_PRESETS, APP_THEME_PRESETS_MERGE_MODE, AppConfiguratorComponent, AppFloatingConfiguratorComponent, AppLayoutComponent, AppModulesComponent, AppTopbar, AuthGuardService, BaseDataService, BaseModuleComponent, ConfigComponent, ContentType, DEFAULT_OIP_FRONTEND_CONFIG, DbMigrationComponent, DiscussionComponent, ErrorComponent, FooterComponent, HttpClient, KeycloakSecurityService, L10nService, LOGO_COMPONENT_TOKEN, LayoutService, LogoComponent, LogoService, MenuComponent, MenuService, MsgService, NotfoundComponent, NotificationService, OIP_FRONTEND_CONFIG, ProfileComponent, SecurePipe, SecurityComponent, SecurityDataService, SecurityService, SecurityStorageService, SidebarComponent, TableFilterService, TopBarService, UnauthorizedComponent, UserService, httpLoaderAuthFactory, langIntercept, mergeWithDefaults, provideAppThemes, provideLogoComponent, replaceDefaults };
 //# sourceMappingURL=oip-common.mjs.map