mn-angular-lib 0.0.51 → 0.0.53

package/types/mn-angular-lib.d.ts

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Provider, TemplateRef, OnInit, Type, ComponentRef, AfterViewInit, OnDestroy, ElementRef, QueryList, ChangeDetectorRef, ViewContainerRef, EventEmitter, PipeTransform } from '@angular/core';
+import { InjectionToken, Provider, TemplateRef, OnInit, Type, ComponentRef, AfterViewInit, OnDestroy, ElementRef, EventEmitter, QueryList, ChangeDetectorRef, ViewContainerRef, OnChanges, SimpleChanges, PipeTransform } from '@angular/core';
 export { TemplateRef, Type } from '@angular/core';
 import * as tailwind_variants from 'tailwind-variants';
 import { VariantProps } from 'tailwind-variants';
 import * as rxjs from 'rxjs';
-import { Observable, BehaviorSubject } from 'rxjs';
+import { Observable, BehaviorSubject, Subject } from 'rxjs';
 import * as mn_angular_lib from 'mn-angular-lib';
 import * as _angular_forms from '@angular/forms';
 import { ValidationErrors, NgControl, AbstractControl, FormGroup, FormBuilder } from '@angular/forms';
@@ -368,6 +368,12 @@ interface MnInputBaseProps {
     label?: string;
     /** Placeholder text (overrides uiConfig.placeholder when provided) */
     placeholder?: string;
+    /** Input mask (e.g., '(000) 000-0000') */
+    mask?: string;
+    /** Autocomplete attribute */
+    autocomplete?: string;
+    /** Whether to focus this field when the component initializes */
+    autoFocus?: boolean;
     /** Size variant of the input field (default: 'md') */
     size?: MnInputVariants['size'];
     /** Border radius variant (default: 'md') */
@@ -484,6 +490,7 @@ declare class MnInputField implements OnInit {
     ngControl: NgControl;
     /** Resolved UI configuration for the input field */
     protected uiConfig: MnInputFieldUIConfig;
+    private readonly el;
     /** Configuration properties for the input field */
     props: MnInputProps;
     private readonly configService;
@@ -513,6 +520,10 @@ declare class MnInputField implements OnInit {
      */
     constructor(ngControl: NgControl);
     ngOnInit(): void;
+    /**
+     * Focuses the input element.
+     */
+    focus(): void;
     private resolveConfig;
     /**
      * Gets the appropriate adapter based on the input type.
@@ -740,6 +751,10 @@ interface MnInputAdapter<TOut = string | null> {
      * // if startDate is '2024-07-01'
      */
     validate(props: MnInputProps, control: AbstractControl, currentRaw: string | null): ValidationErrors | null;
+    /**
+     * Applies a mask to the raw input value.
+     */
+    applyMask?(value: string, mask: string): string;
 }
 /**
  * Default adapter for text-based input types.
@@ -750,6 +765,7 @@ interface MnInputAdapter<TOut = string | null> {
  * - Values are stored as strings in the FormControl
  * - No special DOM attributes
  * - No additional validation (relies on Angular's built-in validators)
+ * - Supports simple masking (0 for digit, A for alpha, * for any)
  */
 declare const defaultTextAdapter: MnInputAdapter<string | null>;
 /**
@@ -1047,8 +1063,12 @@ interface MnTextareaProps {
     shadow?: MnTextareaVariants['shadow'];
     /** Whether the textarea should take full width of its container */
     fullWidth?: MnTextareaVariants['fullWidth'];
-    /** Resize behavior of the textarea (default: 'vertical') */
+    /** resize behavior of the textarea (default: 'vertical') */
     resize?: MnTextareaVariants['resize'];
+    /** Whether to focus this field when the component initializes */
+    autoFocus?: boolean;
+    /** Autocomplete attribute */
+    autocomplete?: string;
     /**
      * Custom error messages mapped by validator error key.
      * Example: { required: 'This field is mandatory' }
@@ -1133,6 +1153,7 @@ declare class MnTextarea implements OnInit {
     ngControl: NgControl;
     /** Resolved UI configuration for the textarea */
     protected uiConfig: MnTextareaUIConfig;
+    private readonly el;
     /** Configuration properties for the textarea */
     props: MnTextareaProps;
     private readonly configService;
@@ -1162,6 +1183,10 @@ declare class MnTextarea implements OnInit {
      */
     constructor(ngControl: NgControl);
     ngOnInit(): void;
+    /**
+     * Focuses the textarea element.
+     */
+    focus(): void;
     private resolveConfig;
     /**
      * Writes a new value to the textarea element (called by Angular Forms).
@@ -1983,6 +2008,12 @@ interface WizardStepConfig<TModel = any> {
     initialValue?: Partial<TModel>;
     guard?: StepGuard;
     validators?: StepValidator[];
+    /** Custom label for the 'Next' button on this step */
+    nextLabel?: string;
+    /** Custom label for the 'Back' button on this step */
+    backLabel?: string;
+    /** Whether to hide the 'Back' button on this step */
+    hideBack?: boolean;
     /** Condition to show/hide this entire step based on aggregated wizard data */
     visible?: (aggregatedData: Record<ModalStepId, Record<string, any>>) => boolean;
 }
@@ -2010,6 +2041,14 @@ interface TextFieldConfig<TModel = unknown> {
     disabled?: boolean;
     /** Condition to show/hide this field based on other field values */
     visible?: FieldVisibilityCondition<TModel>;
+    /** Input mask (e.g., '(000) 000-0000') */
+    mask?: string;
+    /** Autocomplete attribute */
+    autocomplete?: string;
+    /** Whether to focus this field when the modal opens */
+    autoFocus?: boolean;
+    /** When to update the form control value and run validation */
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface NumberFieldConfig<TModel = unknown> {
     kind: FieldKind.NUMBER;
@@ -2024,6 +2063,8 @@ interface NumberFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface SelectFieldConfig<TModel = unknown, TValue = unknown> {
     kind: FieldKind.SELECT;
@@ -2036,6 +2077,8 @@ interface SelectFieldConfig<TModel = unknown, TValue = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
     /** Async data source for loading options dynamically */
     dataSource?: FieldDataSource<TValue, TModel>;
 }
@@ -2044,9 +2087,13 @@ interface CheckboxFieldConfig<TModel = unknown> {
     key: keyof TModel;
     label: string;
     defaultValue?: boolean;
+    validators?: any[];
+    asyncValidators?: any[];
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface DateFieldConfig<TModel = unknown> {
     kind: FieldKind.DATE;
@@ -2060,6 +2107,8 @@ interface DateFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface TextareaFieldConfig<TModel = unknown> {
     kind: FieldKind.TEXTAREA;
@@ -2072,6 +2121,8 @@ interface TextareaFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface DatetimeFieldConfig<TModel = unknown> {
     kind: FieldKind.DATETIME;
@@ -2087,6 +2138,8 @@ interface DatetimeFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface MultiSelectFieldConfig<TModel = unknown, TValue = unknown> {
     kind: FieldKind.MULTI_SELECT;
@@ -2101,6 +2154,8 @@ interface MultiSelectFieldConfig<TModel = unknown, TValue = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
     /** Async data source for loading options dynamically */
     dataSource?: FieldDataSource<TValue, TModel>;
 }
@@ -2114,6 +2169,8 @@ interface PasswordFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface MultiSelectTableFieldConfig<TModel = unknown, TRow = any> {
     kind: FieldKind.MULTI_SELECT_TABLE;
@@ -2128,6 +2185,8 @@ interface MultiSelectTableFieldConfig<TModel = unknown, TRow = any> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface SingleSelectTableFieldConfig<TModel = unknown, TRow = any> {
     kind: FieldKind.SINGLE_SELECT_TABLE;
@@ -2142,6 +2201,8 @@ interface SingleSelectTableFieldConfig<TModel = unknown, TRow = any> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface ColorFieldConfig<TModel = unknown> {
     kind: FieldKind.COLOR;
@@ -2156,6 +2217,8 @@ interface ColorFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface RatingFieldConfig<TModel = unknown> {
     kind: FieldKind.RATING;
@@ -2172,6 +2235,8 @@ interface RatingFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface SliderFieldConfig<TModel = unknown> {
     kind: FieldKind.SLIDER;
@@ -2192,6 +2257,8 @@ interface SliderFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface FileFieldConfig<TModel = unknown> {
     kind: FieldKind.FILE;
@@ -2210,6 +2277,8 @@ interface FileFieldConfig<TModel = unknown> {
     readOnly?: boolean;
     disabled?: boolean;
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 interface CustomFieldConfig<TModel = unknown> {
     kind: FieldKind.CUSTOM;
@@ -2217,9 +2286,17 @@ interface CustomFieldConfig<TModel = unknown> {
     component: Type<unknown>;
     inputs?: ModalInputMap;
     label?: string;
+    validators?: any[];
+    asyncValidators?: any[];
     visible?: FieldVisibilityCondition<TModel>;
+    autoFocus?: boolean;
+    updateOn?: 'change' | 'blur' | 'submit';
 }
 type FormFieldConfig<TModel = unknown> = TextFieldConfig<TModel> | NumberFieldConfig<TModel> | SelectFieldConfig<TModel> | CheckboxFieldConfig<TModel> | DateFieldConfig<TModel> | TextareaFieldConfig<TModel> | DatetimeFieldConfig<TModel> | MultiSelectFieldConfig<TModel> | MultiSelectTableFieldConfig<TModel> | SingleSelectTableFieldConfig<TModel> | PasswordFieldConfig<TModel> | FileFieldConfig<TModel> | ColorFieldConfig<TModel> | RatingFieldConfig<TModel> | SliderFieldConfig<TModel> | CustomFieldConfig<TModel>;
+interface AnimationOptions {
+    type: 'slide' | 'fade' | 'zoom';
+    duration?: number;
+}
 interface FormRowField<TModel = unknown> {
     field: FormFieldConfig<TModel>;
     span?: number;
@@ -2318,12 +2395,21 @@ interface BaseModalConfig<TResult = unknown> {
     /** Polling configuration for periodic async operations */
     polling?: ModalPollingConfig<TResult>;
     /** Handler called when the modal is cancelled or dismissed */
+    readOnly?: boolean;
+    disabled?: boolean;
     onCancel?: ModalCancelHandler<TResult>;
     /** i18n labels for buttons and UI text */
     i18n?: ModalI18nLabels;
+    /** Animation configuration */
+    animation?: AnimationOptions | AnimationOptions['type'];
+    /** Custom component to render in the modal body */
+    component?: Type<unknown>;
+    /** Custom template to render in the modal body */
+    template?: TemplateRef<unknown>;
+    /** Inputs for the custom component */
+    inputs?: ModalInputMap;
 }
-/** Validator that receives aggregated data from all wizard steps before completion */
-type WizardBeforeCompleteValidator = (payload: Record<ModalStepId, Record<string, any>>) => Promise<Record<string, string> | null> | Record<string, string> | null;
+type WizardBeforeCompleteValidator<TResult = any> = (payload: Record<ModalStepId, Record<string, any>>) => Promise<Partial<Record<keyof TResult, string>> | null> | Partial<Record<keyof TResult, string>> | null;
 interface WizardModalConfig<TResult = WizardResult> extends BaseModalConfig<TResult> {
     kind: ModalKind.WIZARD;
     steps: WizardStepConfig[];
@@ -2332,10 +2418,13 @@ interface WizardModalConfig<TResult = WizardResult> extends BaseModalConfig<TRes
     onStepChange?: WizardStepChangeHandler;
     onComplete?: ModalResultHandler<TResult>;
     /** Cross-step validators run before wizard completion */
-    onBeforeComplete?: WizardBeforeCompleteValidator[];
+    onBeforeComplete?: WizardBeforeCompleteValidator<TResult>[];
+    /** Global initial values for all steps */
+    initialValue?: Partial<TResult>;
 }
 interface FormModalConfig<TModel = unknown, TResult = TModel> extends BaseModalConfig<TResult> {
     kind: ModalKind.FORM;
+    body?: any;
     fields: FormFieldConfig<TModel>[];
     rows?: FormRow<TModel>[];
     layout?: FormLayoutMode;
@@ -2355,20 +2444,137 @@ interface ConfirmationModalConfig<TResult = boolean> extends BaseModalConfig<TRe
     tone?: ConfirmationTone;
     confirm?: ConfirmationActionConfig<TResult>;
     cancel?: CancellationActionConfig;
+    body?: any;
+    fields?: FormFieldConfig<any>[];
+    rows?: FormRow<any>[];
+    fieldGroups?: FormFieldGroup<any>[];
+    formValidators?: FormValidator<any>[];
+    groupValidators?: any[];
+    initialValue?: Partial<any>;
 }
 interface CustomModalConfig<TResult = unknown> extends BaseModalConfig<TResult> {
     kind: ModalKind.CUSTOM;
-    component?: Type<unknown>;
-    template?: TemplateRef<unknown>;
-    inputs?: ModalInputMap;
     onComplete?: ModalResultHandler<TResult>;
 }
 type ModalConfig<TResult = any> = WizardModalConfig<TResult> | FormModalConfig<any, TResult> | ConfirmationModalConfig<TResult> | CustomModalConfig<TResult>;
 
-declare class StepBuilder<TModel = any> {
-    private config;
+/**
+ * Shared interface for configurations that support form layouts.
+ */
+interface FormContainerConfig<TModel = any> {
+    fields?: FormFieldConfig<TModel>[];
+    rows?: FormRow<TModel>[];
+    fieldGroups?: FormFieldGroup<TModel>[];
+    formValidators?: FormValidator<TModel>[];
+    groupValidators?: any[];
+    initialValue?: Partial<TModel>;
+    body?: any;
+}
+/**
+ * A builder class that provides form layout capabilities (fields, rows, groups).
+ * This can be used as a delegate to avoid code duplication between FormModalBuilder and StepBuilder.
+ */
+declare class FormLayoutBuilder<TModel = any, TParent = any> {
+    private readonly config;
+    private readonly parent;
     private currentRow;
     private currentRowColumns;
+    constructor(config: FormContainerConfig<TModel>, parent: TParent);
+    /**
+     * Add a custom body/content to the form/step.
+     */
+    body(body: any): TParent;
+    /**
+     * Add a field as a full-width row (single column).
+     */
+    field(field: FormFieldConfig<TModel>): TParent;
+    /**
+     * Start a new row with the specified number of columns.
+     * All subsequent `addToRow()` calls will add fields to this row.
+     */
+    row(columns?: number): TParent;
+    /**
+     * Add a field to the current row started by `row()`.
+     * @param field - The field configuration
+     * @param span - How many columns this field should span (default: 1)
+     */
+    addToRow(field: FormFieldConfig<TModel>, span?: number): TParent;
+    /**
+     * Declarative way to add a row.
+     * @example
+     * .addRow(2, row => {
+     *   row.add({ kind: FieldKind.TEXT, key: 'first', ... });
+     *   row.add({ kind: FieldKind.TEXT, key: 'last', ... });
+     * })
+     */
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<TModel>, span?: number) => void;
+    }) => void): TParent;
+    /**
+     * Add a field group with a section header.
+     */
+    fieldGroup(group: FormFieldGroup<TModel>): TParent;
+    /**
+     * Add a field group using a functional builder.
+     */
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): TParent;
+    /**
+     * Add a field group with title, description, and a functional builder.
+     */
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): TParent;
+    private processFieldGroup;
+    /**
+     * Add form-level validators for cross-field validation.
+     */
+    formValidators(validators: FormValidator<TModel>[]): TParent;
+    /**
+     * Add Angular FormGroup-level validators.
+     */
+    groupValidators(validators: any[]): TParent;
+    /**
+     * Set initial value for fields.
+     */
+    initialValue(value: Partial<TModel>): TParent;
+    /**
+     * Set the field to be focused when the form initializes.
+     */
+    focus(key: keyof TModel): TParent;
+    /**
+     * Wraps a field with a fluent API for validation.
+     */
+    fieldWithValidators(field: FormFieldConfig<TModel>): FieldValidatorBuilder<TModel, TParent>;
+    /**
+     * Flushes any pending fields in the current row to the configuration.
+     */
+    flushCurrentRow(): void;
+}
+/**
+ * A builder for adding validation rules to a field fluently.
+ */
+declare class FieldValidatorBuilder<TModel = any, TParent = any> {
+    private field;
+    private parent;
+    constructor(field: FormFieldConfig<TModel>, parent: TParent);
+    required(message?: string): this;
+    minLength(length: number): this;
+    maxLength(length: number): this;
+    pattern(pattern: string | RegExp): this;
+    email(): this;
+    min(value: number): this;
+    max(value: number): this;
+    /**
+     * Add a custom validator.
+     */
+    custom(validator: any): this;
+    /**
+     * Return to the parent builder.
+     */
+    done(): TParent;
+}
+
+declare class StepBuilder<TModel = any> {
+    private config;
+    private layoutBuilder;
     constructor(id: string, title: string);
     body(body: any): this;
     state(state: StepState): this;
@@ -2391,11 +2597,24 @@ declare class StepBuilder<TModel = any> {
      * Add a field to the current row started by `row()`.
      */
     addToRow(field: FormFieldConfig<TModel>, span?: number): this;
-    private flushCurrentRow;
+    /**
+     * Declarative way to add a row.
+     */
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<TModel>, span?: number) => void;
+    }) => void): this;
     /**
      * Add a field group with a section header.
      */
     fieldGroup(group: FormFieldGroup<TModel>): this;
+    /**
+     * Add a field group using a functional builder.
+     */
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): this;
+    /**
+     * Add a field group with title, description, and a functional builder.
+     */
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): this;
     /**
      * Add form-level validators for cross-field validation within this step.
      */
@@ -2412,11 +2631,24 @@ declare class StepBuilder<TModel = any> {
      * Set a visibility condition for this step based on aggregated wizard data.
      */
     visible(condition: (aggregatedData: Record<ModalStepId, Record<string, any>>) => boolean): this;
+    /**
+     * Set a custom label for the 'Next' button on this step.
+     */
+    nextLabel(label: string): this;
+    /**
+     * Set a custom label for the 'Back' button on this step.
+     */
+    backLabel(label: string): this;
+    /**
+     * Hide the 'Back' button on this step.
+     */
+    hideBack(hide?: boolean): this;
     build(): WizardStepConfig<TModel>;
 }
 
 declare abstract class BaseModalBuilder<TConfig extends BaseModalConfig<TResult>, TResult = unknown> {
     protected config: TConfig;
+    protected layoutBuilder: FormLayoutBuilder<any, this>;
     protected constructor(initialConfig: TConfig);
     title(title: string): this;
     subtitle(subtitle: string): this;
@@ -2427,73 +2659,105 @@ declare abstract class BaseModalBuilder<TConfig extends BaseModalConfig<TResult>
     backdrop(mode: BackdropMode): this;
     keyboard(mode: KeyboardMode): this;
     intent(intent: ModalIntent): this;
+    readOnly(readOnly?: boolean): this;
+    disabled(disabled?: boolean): this;
     footerActions(actions: ModalFooterAction<TResult>[]): this;
     polling(config: ModalPollingConfig<TResult>): this;
     onCancel(handler: ModalCancelHandler<TResult>): this;
     i18n(labels: ModalI18nLabels): this;
+    component(component: Type<unknown>): this;
+    template(template: TemplateRef<unknown>): this;
+    inputs(inputs: ModalInputMap): this;
+    animation(animation: AnimationOptions | AnimationOptions['type']): this;
+    /**
+     * Add a custom body/content to the modal.
+     */
+    body(body: any): this;
+    /**
+     * Add a field.
+     */
+    field(field: FormFieldConfig<any>): this;
+    /**
+     * Add a field with a fluent validation builder.
+     */
+    fieldWithValidators(field: FormFieldConfig<any>): FieldValidatorBuilder<any, this>;
+    /**
+     * Start a new row.
+     */
+    row(columns?: number): this;
+    /**
+     * Add a field to the current row.
+     */
+    addToRow(field: FormFieldConfig<any>, span?: number): this;
+    /**
+     * Declarative way to add a row.
+     */
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<any>, span?: number) => void;
+    }) => void): this;
+    /**
+     * Add a field group.
+     */
+    fieldGroup(group: FormFieldGroup<any>): this;
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
     build(): Readonly<TConfig>;
 }
 
-declare class WizardModalBuilder extends BaseModalBuilder<WizardModalConfig, WizardResult> {
+declare class WizardModalBuilder<TResult = WizardResult> extends BaseModalBuilder<WizardModalConfig<TResult>, TResult> {
     constructor();
-    step(step: WizardStepConfig | ((builder: StepBuilder) => void)): this;
-    addStep(title: string, buildFn: (builder: StepBuilder) => void, id?: ModalStepId): this;
+    /**
+     * Set initial values for the entire wizard.
+     * Note: This will be merged with individual step initial values.
+     */
+    initialValue(value: Partial<TResult>): this;
+    body(body: any): this;
+    field(field: FormFieldConfig<any>): this;
+    row(columns?: number): this;
+    addToRow(field: FormFieldConfig<any>, span?: number): this;
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<any>, span?: number) => void;
+    }) => void): this;
+    fieldGroup(group: FormFieldGroup<any>): this;
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
+    step<TStepModel = any>(step: WizardStepConfig<TStepModel> | ((builder: StepBuilder<TStepModel>) => void)): this;
+    addStep<TStepModel = any>(title: string, buildFn: (builder: StepBuilder<TStepModel>) => void, id?: ModalStepId): this;
     startAt(stepId: ModalStepId): this;
     flow(mode: WizardFlowMode): this;
     onStepChange(handler: WizardStepChangeHandler): this;
-    onComplete(handler: ModalResultHandler<WizardResult>): this;
-    onBeforeComplete(validators: WizardBeforeCompleteValidator[]): this;
+    onComplete(handler: ModalResultHandler<TResult>): this;
+    onBeforeComplete(validators: WizardBeforeCompleteValidator<TResult>[]): this;
 }
 
 declare class FormModalBuilder<TModel = unknown, TResult = TModel> extends BaseModalBuilder<FormModalConfig<TModel, TResult>, TResult> {
-    private currentRow;
-    private currentRowColumns;
     constructor();
-    /**
-     * Add a field as a full-width row (single column).
-     * This is the simple API — each field gets its own row.
-     */
+    body(body: any): this;
     field(field: FormFieldConfig<TModel>): this;
-    /**
-     * Start a new row with the specified number of columns.
-     * All subsequent `addToRow()` calls will add fields to this row
-     * until the next `row()` or `field()` call.
-     *
-     * @example
-     * .row(2)
-     *   .addToRow({ kind: FieldKind.TEXT, key: 'firstName', label: 'First Name' })
-     *   .addToRow({ kind: FieldKind.TEXT, key: 'lastName', label: 'Last Name' })
-     * .row(3)
-     *   .addToRow({ kind: FieldKind.TEXT, key: 'city', label: 'City' }, 2)
-     *   .addToRow({ kind: FieldKind.TEXT, key: 'zip', label: 'ZIP' })
-     */
     row(columns?: number): this;
-    /**
-     * Add a field to the current row started by `row()`.
-     * @param field - The field configuration
-     * @param span - How many columns this field should span (default: 1)
-     */
     addToRow(field: FormFieldConfig<TModel>, span?: number): this;
-    private flushCurrentRow;
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<TModel>, span?: number) => void;
+    }) => void): this;
     layout(mode: FormLayoutMode): this;
     initialValue(value: Partial<TModel>): this;
     submitMode(mode: SubmitMode): this;
     onComplete(handler: ModalResultHandler<TResult>): this;
-    /**
-     * Add form-level validators for cross-field validation.
-     * These receive the entire form value and return an error map or null.
-     */
     formValidators(validators: FormValidator<TModel>[]): this;
-    /**
-     * Add Angular FormGroup-level validators.
-     * These are standard Angular ValidatorFn applied to the FormGroup itself.
-     */
     groupValidators(validators: any[]): this;
     /**
      * Add a field group with a section header.
      * Groups visually separate fields with a title and optional description.
      */
     fieldGroup(group: FormFieldGroup<TModel>): this;
+    /**
+     * Add a field group using a functional builder.
+     */
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): this;
+    /**
+     * Add a field group with title, description, and a functional builder.
+     */
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<TModel, any>) => void): this;
     build(): Readonly<FormModalConfig<TModel, TResult>>;
 }
 
@@ -2503,18 +2767,29 @@ declare class ConfirmationModalBuilder<TResult = boolean> extends BaseModalBuild
     tone(tone: ConfirmationTone): this;
     confirmAction(action: ConfirmationActionConfig<TResult>): this;
     cancelAction(action: CancellationActionConfig): this;
+    body(body: any): this;
+    field(field: FormFieldConfig<any>): this;
+    row(columns?: number): this;
+    addToRow(field: FormFieldConfig<any>, span?: number): this;
+    addRow(columns: number, buildFn: (row: {
+        add: (field: FormFieldConfig<any>, span?: number) => void;
+    }) => void): this;
+    fieldGroup(group: FormFieldGroup<any>): this;
+    fieldGroup(title: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
+    fieldGroup(title: string, description: string, buildFn: (group: FormLayoutBuilder<any, any>) => void): this;
+    initialValue(value: Partial<any>): this;
+    formValidators(validators: FormValidator<any>[]): this;
+    groupValidators(validators: any[]): this;
+    build(): Readonly<ConfirmationModalConfig<TResult>>;
 }
 
 declare class CustomModalBuilder<TResult = unknown> extends BaseModalBuilder<CustomModalConfig<TResult>, TResult> {
     constructor();
-    component(component: Type<unknown>): this;
-    template(template: TemplateRef<unknown>): this;
-    inputs(inputs: ModalInputMap): this;
     onComplete(handler: ModalResultHandler<TResult>): this;
 }
 
 declare class ModalBuilder {
-    static wizard(): WizardModalBuilder;
+    static wizard<TResult = any>(): WizardModalBuilder<TResult>;
     static form<TModel = unknown, TResult = TModel>(): FormModalBuilder<TModel, TResult>;
     static confirmation<TResult = boolean>(): ConfirmationModalBuilder<TResult>;
     static custom<TResult = unknown>(): CustomModalBuilder<TResult>;
@@ -2530,12 +2805,14 @@ declare class MnModalRef<TResult = any> implements ModalRef<TResult> {
     dismiss(reason: ModalCloseReason): void;
     private animateAndDestroy;
     update(config: Partial<BaseModalConfig<TResult>>): void;
+    get component(): any;
     private destroy;
 }
 
 declare class MnModalService {
     private readonly appRef;
     private readonly injector;
+    private readonly modalStack;
     open<TResult = any>(config: ModalConfig<TResult>): MnModalRef<TResult>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MnModalService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<MnModalService>;
@@ -2546,6 +2823,7 @@ declare class MnModalShellComponent<TResult = any> implements OnInit, AfterViewI
     config: ModalConfig<TResult>;
     modalRef: MnModalRef<TResult>;
     isClosing: boolean;
+    isStacked: boolean;
     readonly ModalKind: typeof ModalKind;
     private previouslyFocusedElement;
     private focusTrapListener;
@@ -2571,6 +2849,7 @@ declare class MnModalShellComponent<TResult = any> implements OnInit, AfterViewI
     get showBackdrop(): boolean;
     get containerSizeClass(): string;
     get showCloseButton(): boolean;
+    get animationClass(): string;
     get hasCustomFooterActions(): boolean;
     get leftFooterActions(): ModalFooterAction<TResult>[];
     get rightFooterActions(): ModalFooterAction<TResult>[];
@@ -2584,11 +2863,15 @@ declare class MnModalShellComponent<TResult = any> implements OnInit, AfterViewI
     static ɵcmp: i0.ɵɵComponentDeclaration<MnModalShellComponent<any>, "mn-modal-shell", never, { "config": { "alias": "config"; "required": false; }; "modalRef": { "alias": "modalRef"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-declare class MnFormBodyComponent<TModel = any, TResult = TModel> implements OnInit, OnDestroy {
+declare class MnFormBodyComponent<TModel = any, TResult = TModel> implements OnInit, OnDestroy, AfterViewInit {
     private fb;
     config: FormModalConfig<TModel, TResult>;
     modalRef: MnModalRef<TResult>;
     hideFooter: boolean;
+    hideCustomBody: boolean;
+    formStatusChange: EventEmitter<string>;
+    inputFields?: QueryList<MnInputField>;
+    textareas?: QueryList<MnTextarea>;
     form: FormGroup;
     rows: FormRow<TModel>[];
     fieldGroups: FormFieldGroup<TModel>[];
@@ -2621,6 +2904,8 @@ declare class MnFormBodyComponent<TModel = any, TResult = TModel> implements OnI
         fileUploadPrompt: any;
     };
     ngOnInit(): void;
+    ngAfterViewInit(): void;
+    applyAutoFocus(): void;
     ngOnDestroy(): void;
     private initializeForm;
     isFieldReadOnly(field: FormFieldConfig<TModel>): boolean;
@@ -2666,7 +2951,7 @@ declare class MnFormBodyComponent<TModel = any, TResult = TModel> implements OnI
     getFileError(field: FormFieldConfig<TModel>): string;
     submit(): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MnFormBodyComponent<any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MnFormBodyComponent<any, any>, "mn-form-body", never, { "config": { "alias": "config"; "required": false; }; "modalRef": { "alias": "modalRef"; "required": false; }; "hideFooter": { "alias": "hideFooter"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MnFormBodyComponent<any, any>, "mn-form-body", never, { "config": { "alias": "config"; "required": false; }; "modalRef": { "alias": "modalRef"; "required": false; }; "hideFooter": { "alias": "hideFooter"; "required": false; }; "hideCustomBody": { "alias": "hideCustomBody"; "required": false; }; }, { "formStatusChange": "formStatusChange"; }, never, never, true, never>;
 }
 
 declare class MnWizardBodyComponent implements OnInit, AfterViewInit, OnDestroy {
@@ -2722,9 +3007,16 @@ declare class MnWizardBodyComponent implements OnInit, AfterViewInit, OnDestroy
     static ɵcmp: i0.ɵɵComponentDeclaration<MnWizardBodyComponent, "mn-wizard-body", never, { "config": { "alias": "config"; "required": false; }; "modalRef": { "alias": "modalRef"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-declare class MnConfirmationBodyComponent<TResult = boolean> {
+declare class MnConfirmationBodyComponent<TResult = boolean> implements OnInit {
+    private cdr;
     config: ConfirmationModalConfig<TResult>;
     modalRef: MnModalRef<TResult>;
+    formBody?: MnFormBodyComponent;
+    confirmButtonStatus: string;
+    hasFormFields: boolean;
+    constructor(cdr: ChangeDetectorRef);
+    ngOnInit(): void;
+    onFormStatusChange(status: string): void;
     confirm(): Promise<void>;
     cancel(): void;
     get confirmLabel(): string;
@@ -2734,6 +3026,9 @@ declare class MnConfirmationBodyComponent<TResult = boolean> {
     get toneClass(): string;
     getButtonColor(style: ActionStyle): 'primary' | 'secondary' | 'danger' | 'warning' | 'success';
     getButtonVariant(style: ActionStyle): 'fill' | 'outline' | 'text';
+    asAny(val: any): any;
+    get isConfirmDisabled(): boolean;
+    asField(field: any): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<MnConfirmationBodyComponent<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MnConfirmationBodyComponent<any>, "mn-confirmation-body", never, { "config": { "alias": "config"; "required": false; }; "modalRef": { "alias": "modalRef"; "required": false; }; }, {}, never, never, true, never>;
 }
@@ -2796,10 +3091,710 @@ declare class MnTable<T = any> implements OnInit, OnDestroy {
     static ɵcmp: i0.ɵɵComponentDeclaration<MnTable<any>, "mn-table", never, { "dataSource": { "alias": "dataSource"; "required": false; }; }, { "sortChange": "sortChange"; "selectionChange": "selectionChange"; "rowClick": "rowClick"; }, never, never, true, never>;
 }
 
+/**
+ * Colour scheme applied to calendar events.
+ *
+ * `primaryColor` is used for the left border accent; `secondaryColor` for the
+ * background fill. Both should be valid CSS colour values.
+ */
+interface ColorPreset {
+    /** Unique identifier. */
+    id: string;
+    /** Human-readable colour name (e.g. "Blue"). */
+    colorName: string;
+    /** Accent / border colour (e.g. "#3b82f6"). */
+    primaryColor: string;
+    /** Background fill colour (e.g. "#dbeafe"). */
+    secondaryColor: string;
+}
+
+/**
+ * Represents a single calendar event.
+ *
+ * Consumer-facing properties (`id` through `data`) are set by the application.
+ * Layout properties (`column`, `width`, `continued`, `continuedEnd`) are
+ * computed by {@link CalendarEventLayoutService} and should not be set manually.
+ */
+interface CalendarEvent {
+    /** Unique identifier for the event. */
+    id: string;
+    /** Display title. */
+    title: string;
+    /** Optional description shown below the title. */
+    description: string;
+    /** Event start date/time. */
+    startTime: Date;
+    /** Event end date/time. */
+    endTime: Date;
+    /** Colour scheme used for rendering. */
+    color: ColorPreset;
+    /** Optional custom component type to render this event (overrides the default renderer). */
+    component?: Type<any>;
+    /** Arbitrary payload attached to the event (passed through to custom renderers). */
+    data?: any;
+    /** Zero-based column index within overlapping event groups. */
+    column?: number;
+    /** Number of sub-columns this event spans. */
+    width?: number;
+    /** `true` when this segment is a continuation from a previous day (multi-day events). */
+    continued?: boolean;
+    /** `true` when this segment continues into the next day (multi-day events). */
+    continuedEnd?: boolean;
+}
+/**
+ * Represents the "current time" indicator rendered as a line in week/day views.
+ */
+interface CurrentTimeCalendarEvent {
+    id: 'current-time';
+    title: string;
+    startTime: Date;
+    endTime: Date;
+    column: number;
+    width: number;
+}
+
+/**
+ * Contract for pluggable event renderer components.
+ *
+ * Any component that implements this interface can be used as a custom
+ * event template inside the calendar. Pass the component type via
+ * `[CalendarEventComponent]` on `<app-calendar-view>`.
+ *
+ * The calendar will set the `event` property after creating the component
+ * dynamically via `ViewContainerRef.createComponent()`.
+ */
+interface CalendarEventData {
+    /** The calendar event to render. Set by the calendar after component creation. */
+    event: CalendarEvent;
+}
+
+/**
+ * Available calendar view modes.
+ */
+declare enum CalendarView {
+    MONTH = "MONTH",
+    WEEK = "WEEK",
+    DAY = "DAY"
+}
+/**
+ * Configuration for the calendar component.
+ * All properties are optional — sensible defaults are provided.
+ * Can be supplied via the `CALENDAR_CONFIG` injection token or through
+ * the `provideMnComponentConfig` helper using component name `'mn-calendar'`.
+ */
+interface CalendarConfig {
+    /** First visible hour in week/day views (0–23). Default: `7`. */
+    startHour: number;
+    /** Last visible hour in week/day views (1–24, exclusive). Default: `22`. */
+    endHour: number;
+    /** BCP 47 locale tag used for date/time formatting (e.g. `'en-US'`, `'nl-NL'`). Default: `'en-US'`. */
+    locale: string;
+    /** Label for the "Today" navigation button. Default: `'Today'`. */
+    todayLabel: string;
+    /** Title shown above the upcoming-events sidebar. Default: `'Upcoming events'`. */
+    upcomingEventsTitle: string;
+    /** Display labels for each calendar view mode. */
+    viewLabels: Record<string, string>;
+    /** Abbreviated day names starting from Monday (length 7). Derived from `locale` when not set. */
+    shortDayNames: string[];
+    /** Full day names starting from Monday (length 7). Derived from `locale` when not set. */
+    longDayNames: string[];
+    /** Screen-width breakpoint (px) below which only day view is shown. Default: `768`. */
+    mobileBreakpoint: number;
+}
+/** Default calendar configuration values. */
+declare const DEFAULT_CALENDAR_CONFIG: CalendarConfig;
+/**
+ * Injection token for the resolved calendar configuration.
+ *
+ * Prefer using {@link MN_CALENDAR_CONFIG} with `provideMnComponentConfig`
+ * so that settings can be managed via `mn-config.json5`. This token is
+ * kept for backward compatibility and manual `providers` usage.
+ *
+ * @example
+ * ```ts
+ * providers: [
+ *   { provide: CALENDAR_CONFIG, useValue: { startHour: 8, endHour: 20, locale: 'nl-NL' } }
+ * ]
+ * ```
+ */
+declare const CALENDAR_CONFIG: InjectionToken<CalendarConfig>;
+/**
+ * Injection token resolved via `MnConfigService` (the `mn-config.json5` system).
+ *
+ * Use the helper {@link provideMnCalendarConfig} in the component's `providers`
+ * array so that calendar settings are read from the config file and support
+ * `$translate` markers, section scoping, and instance-id overrides.
+ *
+ * Component name in the config file: `'mn-calendar'`.
+ *
+ * @example
+ * ```json5
+ * // mn-config.json5
+ * {
+ *   defaults: {
+ *     "mn-calendar": {
+ *       startHour: 8,
+ *       endHour: 20,
+ *       locale: "nl-NL",
+ *       todayLabel: { $translate: "calendar.today" }
+ *     }
+ *   }
+ * }
+ * ```
+ */
+declare const MN_CALENDAR_CONFIG: InjectionToken<CalendarConfig>;
+/** Component name used to look up calendar settings in `mn-config.json5`. */
+declare const MN_CALENDAR_COMPONENT_NAME = "mn-calendar";
+/**
+ * Provider helper that wires the calendar into the `mn-config` system.
+ *
+ * Add this to the `providers` array of the component (or module) that hosts
+ * `<app-calendar-view>`. It reads defaults and overrides from `mn-config.json5`
+ * under the key `"mn-calendar"` and provides them via {@link MN_CALENDAR_CONFIG}.
+ *
+ * @param initial — optional partial defaults merged before config-file values.
+ */
+declare function provideMnCalendarConfig(initial?: Partial<CalendarConfig>): i0.Provider;
+/**
+ * Merges a partial config with defaults, re-deriving day names from locale when needed.
+ */
+declare function resolveCalendarConfig(partial?: Partial<CalendarConfig>): CalendarConfig;
+/**
+ * Represents a half-hour row in the week/day time grid.
+ */
+interface HourRow {
+    /** The hour value (e.g. 7, 8, …). */
+    hour: number;
+    /** CSS grid row start (1-based). */
+    topRow: number;
+    /** CSS grid row end (1-based, exclusive). */
+    bottomRow: number;
+}
+/**
+ * Represents a single day column in the week view header.
+ */
+interface ColumnDay {
+    /** The date this column represents. */
+    date: Date;
+    /** Abbreviated day name (e.g. "Mon"). */
+    dayName: string;
+    /** Day-of-month number (1–31). */
+    dayNumber: number;
+    /** Whether this column is today. */
+    isToday: boolean;
+}
+/**
+ * Represents a single cell in the month grid.
+ */
+interface MonthItem {
+    /** The date this cell represents. */
+    date: Date;
+    /** Day-of-month number (1–31). */
+    dayNumber: number;
+    /** Whether this date belongs to the currently focused month. */
+    isCurrentMonth: boolean;
+    /** Whether this date is today. */
+    isToday: boolean;
+    /** Events occurring on this date. */
+    events: CalendarEvent[];
+}
+
+/**
+ * Abstraction for date/time formatting used by calendar components.
+ *
+ * The library ships a default implementation ({@link DefaultCalendarDateFormatter})
+ * that uses `Intl.DateTimeFormat`. Consumers can provide their own implementation
+ * (e.g. wrapping `@ngx-translate`) via the {@link CALENDAR_DATE_FORMATTER} token.
+ *
+ * Locale-independent settings (day names, view labels, "Today" label) have been
+ * moved to {@link CalendarConfig} so they can be configured declaratively.
+ */
+interface CalendarDateFormatter {
+    /** Formats an hour + minute pair (e.g. `9, 0` → `"09:00 AM"`). */
+    formatTimeI(hour: number, minute: number): Promise<string>;
+    /** Formats the time portion of a Date. Returns `''` for `undefined`. */
+    formatTime(date: Date | undefined): Promise<string>;
+    /** Formats a full date-time string as an Observable. */
+    formatDateTime(date: Date): Observable<string>;
+    /** Formats a date-only string as an Observable. */
+    formatDate(date: Date): Observable<string>;
+    /** Formats a Date as `YYYY-MM-DD` for `<input type="date">`. */
+    formatDateForFormControl(date: Date): string;
+    /** Returns `true` when both dates fall on the same calendar day. */
+    isSameDay(date1: Date, date2: Date): boolean;
+    /** Formats a Date as "Month Year" (e.g. "January 2026"). */
+    formatMonthName(date: Date): Promise<string>;
+}
+/**
+ * Injection token for the calendar date formatter.
+ *
+ * @example
+ * ```ts
+ * providers: [
+ *   { provide: CALENDAR_DATE_FORMATTER, useClass: MyCustomFormatter }
+ * ]
+ * ```
+ */
+declare const CALENDAR_DATE_FORMATTER: InjectionToken<CalendarDateFormatter>;
+
+/**
+ * Main calendar orchestrator component.
+ *
+ * Provides a toolbar with view switching (month / week / day), date navigation,
+ * and an optional action button. The active view and an upcoming-events sidebar
+ * are rendered inside a responsive grid layout.
+ *
+ * All configuration (visible hours, locale, labels, mobile breakpoint) is read
+ * from the `mn-config.json5` system via {@link MN_CALENDAR_CONFIG}, falling back
+ * to the legacy {@link CALENDAR_CONFIG} injection token, then to built-in defaults.
+ * Date formatting is delegated to the {@link CALENDAR_DATE_FORMATTER} token.
+ *
+ * @example
+ * ```html
+ * <app-calendar-view
+ *   [showButton]="true"
+ *   [buttonTitle]="'New Event'"
+ *   [NewCalendarItemsEvent]="eventsEmitter"
+ *   (RequestNewCalendarItemsEvent)="loadEvents($event)"
+ *   (CalendarItemClickedEvent)="onEventClick($event)"
+ *   (ButtonClickedEvent)="openModal()">
+ * </app-calendar-view>
+ * ```
+ */
+declare class CalendarViewComponent implements OnInit, OnDestroy {
+    /** Whether to show the action button in the toolbar. */
+    showButton: boolean;
+    /** Label text for the action button. */
+    buttonTitle: string;
+    /** Custom event renderer component type. */
+    CalendarEventComponent?: Type<CalendarEventData>;
+    /** Observable or EventEmitter that pushes new event arrays into the calendar. */
+    NewCalendarItemsEvent?: EventEmitter<CalendarEvent[]>;
+    /** Emits when the calendar needs fresh event data (e.g. after navigation). */
+    RequestNewCalendarItemsEvent: EventEmitter<Date>;
+    /** Emits when a calendar event is clicked. */
+    CalendarItemClickedEvent: EventEmitter<CalendarEvent>;
+    /** Emits when the action button is clicked. */
+    ButtonClickedEvent: EventEmitter<void>;
+    readonly CalendarView: typeof CalendarView;
+    currentView: CalendarView;
+    focusDay: Date;
+    dateInputValue: string;
+    viewOptions: {
+        value: CalendarView;
+        label: string;
+    }[];
+    isMobileView: boolean;
+    /** BehaviorSubject so late-subscribing child views receive the last emitted events. */
+    internalEventsChanged: BehaviorSubject<CalendarEvent[]>;
+    /** Subject for broadcasting focus-day changes to child views. */
+    internalFocusDayChanged: Subject<Date>;
+    private destroy$;
+    private formatter;
+    protected config: CalendarConfig;
+    private readonly destroyRef;
+    private readonly lang;
+    constructor(formatter: CalendarDateFormatter | null, mnConfig: CalendarConfig | null, legacyConfig: CalendarConfig | null);
+    onResize(): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** Switches the active view. On mobile, forces day view. */
+    switchView(view: CalendarView): void;
+    /** Navigates to the previous period (month / week / day). */
+    navigatePrevious(): void;
+    /** Navigates to the next period (month / week / day). */
+    navigateNext(): void;
+    /** Navigates to today. */
+    goToToday(): void;
+    /** Handles the date-picker input change. */
+    onDateInputChange(event: Event): void;
+    /** Handles a day click from the month view — switches to day view. */
+    onMonthDayClick(date: Date): void;
+    /** Forwards a child event click to the parent output. */
+    onEventClick(event: CalendarEvent): void;
+    /** trackBy for view option buttons. */
+    trackByView(_index: number, item: {
+        value: CalendarView;
+    }): string;
+    /** Rebuilds view options and labels from the current config. */
+    private rebuildFromConfig;
+    private checkMobileView;
+    private setFocusDay;
+    private updateDateInput;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarViewComponent, [{ optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarViewComponent, "app-calendar-view", never, { "showButton": { "alias": "showButton"; "required": false; }; "buttonTitle": { "alias": "buttonTitle"; "required": false; }; "CalendarEventComponent": { "alias": "CalendarEventComponent"; "required": false; }; "NewCalendarItemsEvent": { "alias": "NewCalendarItemsEvent"; "required": false; }; }, { "RequestNewCalendarItemsEvent": "RequestNewCalendarItemsEvent"; "CalendarItemClickedEvent": "CalendarItemClickedEvent"; "ButtonClickedEvent": "ButtonClickedEvent"; }, never, never, true, never>;
+}
+
+/**
+ * Service that computes the visual layout of calendar events within a
+ * time-grid (week or day view).
+ *
+ * Responsibilities:
+ * - Splitting multi-day events into per-day segments.
+ * - Assigning non-overlapping column indices to concurrent events.
+ * - Computing the width (column span) each event should occupy.
+ *
+ * This service is stateless — all state is passed via method parameters.
+ * Provide it per-component (not root) so each view gets its own instance.
+ */
+declare class CalendarEventLayoutService {
+    /**
+     * Returns `true` when two time ranges overlap (exclusive boundaries).
+     */
+    eventsOverlap(startA: Date, endA: Date, startB: Date, endB: Date): boolean;
+    /**
+     * Returns all events whose time range overlaps the given `[start, end)` window.
+     */
+    getAllEventsOnSpecificTime(events: CalendarEvent[], start: Date, end: Date): CalendarEvent[];
+    /**
+     * Splits multi-day events into per-day segments that fit within the
+     * visible hour range (`startHour`–`endHour`) and date range.
+     *
+     * Single-day events are shallow-copied as-is. Multi-day events produce
+     * one segment per day with `continued` / `continuedEnd` flags set.
+     */
+    calculateMultiDayEvents(events: CalendarEvent[], startHour: number, endHour: number, rangeStart: Date, rangeEnd: Date): CalendarEvent[];
+    /**
+     * Assigns a zero-based `column` index to each event so that overlapping
+     * events occupy different columns.
+     *
+     * Events are processed in start-time order (longest duration first for ties).
+     * Each event gets the earliest column not already occupied by an overlapping event.
+     */
+    assignColumnsToEvents(events: CalendarEvent[]): void;
+    /**
+     * Assigns a `width` (column span) to each event, expanding it to fill
+     * unused columns to its right within the overlapping group.
+     */
+    assignWidthsToEvents(events: CalendarEvent[], scanStart: Date, scanEnd: Date): void;
+    /** Finds the lowest column index not occupied by any overlapping event. */
+    private findEarliestPossibleColumn;
+    /** Computes the maximum width an event can span without overlapping a neighbour to its right. */
+    private findBiggestPossibleWidth;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarEventLayoutService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CalendarEventLayoutService>;
+}
+
+/** Extended hour row with a pre-resolved display label. */
+interface DisplayHourRow$1 extends HourRow {
+    hourLabel: string;
+}
+/**
+ * Week grid view showing 7 day columns with half-hour time slots.
+ *
+ * Overlapping events within the same day are laid out in sub-columns
+ * so they appear side-by-side rather than stacked.
+ */
+declare class CalendarWeekComponent implements OnInit, OnDestroy {
+    private layoutService;
+    /** The date around which the week is centred. */
+    focusDay: Date;
+    /** Observable that emits the full event list whenever it changes. */
+    eventsChanged: Observable<CalendarEvent[]>;
+    /** Observable that emits when the focus day changes. */
+    focusDayChanged: Observable<Date>;
+    /** Resolved calendar configuration passed from the parent view. */
+    config?: CalendarConfig;
+    /** Optional custom event renderer component. */
+    calendarEventComponent?: Type<CalendarEventData>;
+    /** Emits when a calendar event is clicked. */
+    eventClicked: EventEmitter<CalendarEvent>;
+    columns: ColumnDay[];
+    hourRows: DisplayHourRow$1[];
+    displayEvents: CalendarEvent[];
+    totalRows: number;
+    currentTimeRow: number;
+    currentTimeCol: string;
+    gridTemplateColumns: string;
+    private dayColumnMap;
+    private events;
+    private destroy$;
+    private formatter;
+    private resolvedConfig;
+    private currentTimeInterval?;
+    constructor(layoutService: CalendarEventLayoutService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** Returns the CSS `grid-row` value for an event based on its start/end times. */
+    getEventRow(event: CalendarEvent): string;
+    /** Returns the CSS `grid-column` span for a day header, accounting for sub-columns. */
+    getHeaderColumn(dayIndex: number): string;
+    /** Returns the CSS `grid-column` value for an event within its day's sub-columns. */
+    getEventColumn(event: CalendarEvent): string;
+    /** Forwards event click to parent. */
+    onEventClick(event: CalendarEvent): void;
+    /** trackBy for hour rows. */
+    trackByHour(_index: number, row: DisplayHourRow$1): number;
+    /** trackBy for day columns. */
+    trackByColumn(_index: number, col: ColumnDay): number;
+    /** trackBy for events. */
+    trackByEvent(_index: number, event: CalendarEvent): string;
+    private buildHourRows;
+    /** Builds the 7 day columns for the current week (Monday–Sunday). */
+    private buildColumns;
+    /** Filters, splits, and lays out events for the current week. */
+    private refreshEvents;
+    /** Computes the CSS grid-template-columns string based on per-day sub-column counts. */
+    private buildGridColumns;
+    /** Updates the current-time red line position. */
+    private updateCurrentTime;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarWeekComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarWeekComponent, "app-calendar-week", never, { "focusDay": { "alias": "focusDay"; "required": false; }; "eventsChanged": { "alias": "eventsChanged"; "required": false; }; "focusDayChanged": { "alias": "focusDayChanged"; "required": false; }; "config": { "alias": "config"; "required": false; }; "calendarEventComponent": { "alias": "calendarEventComponent"; "required": false; }; }, { "eventClicked": "eventClicked"; }, never, never, true, never>;
+}
+
+/** Extended hour row with a pre-resolved display label. */
+interface DisplayHourRow extends HourRow {
+    hourLabel: string;
+}
+/**
+ * Day grid view showing a single day with half-hour time slots.
+ *
+ * Shares the same layout algorithm as the week view via
+ * {@link CalendarEventLayoutService}.
+ */
+declare class CalendarDayComponent implements OnInit, OnDestroy {
+    private layoutService;
+    /** The date to display. */
+    focusDay: Date;
+    /** Observable that emits the full event list whenever it changes. */
+    eventsChanged: Observable<CalendarEvent[]>;
+    /** Observable that emits when the focus day changes. */
+    focusDayChanged: Observable<Date>;
+    /** Resolved calendar configuration passed from the parent view. */
+    config?: CalendarConfig;
+    /** Optional custom event renderer component. */
+    calendarEventComponent?: Type<CalendarEventData>;
+    /** Emits when a calendar event is clicked. */
+    eventClicked: EventEmitter<CalendarEvent>;
+    hourRows: DisplayHourRow[];
+    displayEvents: CalendarEvent[];
+    totalRows: number;
+    totalColumns: number;
+    currentTimeRow: number;
+    isToday: boolean;
+    dayName: string;
+    private events;
+    private destroy$;
+    private formatter;
+    private resolvedConfig;
+    private currentTimeInterval?;
+    constructor(layoutService: CalendarEventLayoutService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** Returns the CSS `grid-row` value for an event. */
+    getEventRow(event: CalendarEvent): string;
+    /** Returns the CSS `grid-column` value for an event within its sub-columns. */
+    getEventColumn(event: CalendarEvent): string;
+    /** Forwards event click to parent. */
+    onEventClick(event: CalendarEvent): void;
+    /** trackBy for hour rows. */
+    trackByHour(_index: number, row: DisplayHourRow): number;
+    /** trackBy for events. */
+    trackByEvent(_index: number, event: CalendarEvent): string;
+    private buildHourRows;
+    /** Updates the day name and isToday flag. */
+    private updateDayInfo;
+    /** Filters, splits, and lays out events for the focus day. */
+    private refreshEvents;
+    /** Updates the current-time red line position. */
+    private updateCurrentTime;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarDayComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarDayComponent, "app-calendar-day", never, { "focusDay": { "alias": "focusDay"; "required": false; }; "eventsChanged": { "alias": "eventsChanged"; "required": false; }; "focusDayChanged": { "alias": "focusDayChanged"; "required": false; }; "config": { "alias": "config"; "required": false; }; "calendarEventComponent": { "alias": "calendarEventComponent"; "required": false; }; }, { "eventClicked": "eventClicked"; }, never, never, true, never>;
+}
+
+/**
+ * Month grid view showing a 7×6 grid of day cells.
+ *
+ * Each cell displays the day number and up to 3 coloured dots representing
+ * events on that day. Clicking a cell emits `dayClicked`.
+ */
+declare class CalendarMonthComponent implements OnInit, OnDestroy {
+    /** The date whose month is displayed. */
+    focusDay: Date;
+    /** Observable that emits the full event list whenever it changes. */
+    eventsChanged: Observable<CalendarEvent[]>;
+    /** Observable that emits when the focus day changes. */
+    focusDayChanged: Observable<Date>;
+    /** Resolved calendar configuration passed from the parent view. */
+    config?: CalendarConfig;
+    /** Emits the date of a clicked day cell. */
+    dayClicked: EventEmitter<Date>;
+    monthItems: MonthItem[];
+    longDayNames: string[];
+    private events;
+    private destroy$;
+    private formatter;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** Emits the clicked day's date. */
+    onDayClick(date: Date): void;
+    /** trackBy for day name headers. */
+    trackByDayName(index: number): number;
+    /** trackBy for month grid cells. */
+    trackByMonthItem(_index: number, item: MonthItem): number;
+    /** trackBy for event dots. */
+    trackByEventDot(_index: number, event: CalendarEvent): string;
+    /** Builds the 42-cell month grid (6 rows × 7 columns). */
+    private buildMonth;
+    private createMonthItem;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarMonthComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarMonthComponent, "app-calendar-month", never, { "focusDay": { "alias": "focusDay"; "required": false; }; "eventsChanged": { "alias": "eventsChanged"; "required": false; }; "focusDayChanged": { "alias": "focusDayChanged"; "required": false; }; "config": { "alias": "config"; "required": false; }; }, { "dayClicked": "dayClicked"; }, never, never, true, never>;
+}
+
+/**
+ * Dynamic event renderer that injects a custom or default event component
+ * into its view container.
+ *
+ * The component to render is resolved in this order:
+ * 1. `customComponent` input (set on the parent week/day view)
+ * 2. `event.component` (per-event override)
+ * 3. {@link CalendarEventDefaultComponent} (library default)
+ */
+declare class CalendarEventComponent implements AfterViewInit, OnChanges {
+    /** The event data to render. */
+    event: CalendarEvent;
+    /** Optional custom component type that overrides the default renderer. */
+    customComponent?: Type<CalendarEventData>;
+    /** Emits when the rendered event is clicked. */
+    eventClicked: EventEmitter<CalendarEvent>;
+    eventContainer: ViewContainerRef;
+    private rendered;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    /** Emits the event click. */
+    onEventClick(): void;
+    /** Creates the event component dynamically and sets its `event` property. */
+    private renderComponent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarEventComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarEventComponent, "app-calendar-event", never, { "event": { "alias": "event"; "required": false; }; "customComponent": { "alias": "customComponent"; "required": false; }; }, { "eventClicked": "eventClicked"; }, never, never, true, never>;
+}
+
+/**
+ * Default event renderer used when no custom component is provided.
+ *
+ * Displays the event title, formatted time range, and optional description
+ * with the event's colour scheme applied as background and left-border accent.
+ */
+declare class CalendarEventDefaultComponent implements CalendarEventData, OnInit {
+    /** The event to render. Set by {@link CalendarEventComponent} after creation. */
+    event: CalendarEvent;
+    formattedTime: string;
+    private formatter;
+    constructor(formatter: CalendarDateFormatter | null);
+    ngOnInit(): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarEventDefaultComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CalendarEventDefaultComponent, "app-calendar-event-default", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Sidebar component that lists the next 10 upcoming events
+ * (events whose end time is in the future), sorted by start time.
+ */
+declare class UpcomingEventsComponent implements OnInit, OnDestroy {
+    /** Observable that emits the full event list whenever it changes. */
+    eventsChanged: Observable<CalendarEvent[]>;
+    /** Resolved calendar configuration passed from the parent view. */
+    config?: CalendarConfig;
+    /** Emits when an upcoming event row is clicked. */
+    eventClicked: EventEmitter<CalendarEvent>;
+    upcomingEvents: CalendarEvent[];
+    title: string;
+    private destroy$;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** trackBy for upcoming event rows. */
+    trackByEvent(_index: number, event: CalendarEvent): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UpcomingEventsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UpcomingEventsComponent, "app-upcoming-events", never, { "eventsChanged": { "alias": "eventsChanged"; "required": false; }; "config": { "alias": "config"; "required": false; }; }, { "eventClicked": "eventClicked"; }, never, never, true, never>;
+}
+
+/**
+ * Renders a single row in the upcoming-events sidebar.
+ * Shows the event title, formatted date/time, and optional description.
+ */
+declare class UpcomingEventRowComponent implements OnInit {
+    /** The event to display. */
+    event: CalendarEvent;
+    /** Emits the event when this row is clicked. */
+    eventClicked: EventEmitter<CalendarEvent>;
+    formattedDate: string;
+    private formatter;
+    constructor(formatter: CalendarDateFormatter | null);
+    ngOnInit(): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UpcomingEventRowComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UpcomingEventRowComponent, "app-upcoming-event-row", never, { "event": { "alias": "event"; "required": false; }; }, { "eventClicked": "eventClicked"; }, never, never, true, never>;
+}
+
+/**
+ * Default implementation of {@link CalendarDateFormatter} that uses the
+ * browser's `Intl.DateTimeFormat` API for locale-aware formatting.
+ *
+ * The locale is read from the injected {@link CALENDAR_CONFIG}. If no config
+ * is provided, `'en-US'` is used as the fallback.
+ *
+ * This service has no dependency on `@ngx-translate` or any other i18n library,
+ * so the calendar library works out of the box. Consumers can replace it with
+ * their own implementation via the `CALENDAR_DATE_FORMATTER` injection token.
+ */
+declare class DefaultCalendarDateFormatter implements CalendarDateFormatter {
+    private readonly locale;
+    constructor(config?: CalendarConfig | null);
+    /** Formats an hour and minute pair into a locale time string (e.g. "09:00 AM"). */
+    formatTimeI(hour: number, minute: number): Promise<string>;
+    /** Formats the time portion of a Date (e.g. "2:30 PM"). Returns empty string for undefined. */
+    formatTime(date: Date | undefined): Promise<string>;
+    /** Formats a Date as a full date-time string (e.g. "May 15, 2026, 02:30 PM"). */
+    formatDateTime(date: Date): Observable<string>;
+    /** Formats a Date as a date-only string (e.g. "May 15, 2026"). */
+    formatDate(date: Date): Observable<string>;
+    /** Formats a Date as `YYYY-MM-DD` for use in `<input type="date">` controls. */
+    formatDateForFormControl(date: Date): string;
+    /** Returns `true` if both dates fall on the same calendar day. */
+    isSameDay(date1: Date, date2: Date): boolean;
+    /** Formats a Date as "Month Year" (e.g. "January 2026"). */
+    formatMonthName(date: Date): Promise<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DefaultCalendarDateFormatter, [{ optional: true; }]>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<DefaultCalendarDateFormatter>;
+}
+
+/**
+ * Static utility methods for calendar grid positioning.
+ */
+declare class CalendarUtility {
+    /**
+     * Converts a weekday (from `Date.getDay()`) to a 1-based Monday-first column index.
+     * Monday = 1, Tuesday = 2, …, Sunday = 7.
+     */
+    static getCorrectColumn(date: Date): number;
+    /**
+     * Converts an hour + minute pair to a 1-based CSS grid row index
+     * within a half-hour grid starting at `startHour`.
+     *
+     * Each hour occupies two rows (one per 30-minute slot).
+     * Formula: `(hour - startHour) * 2 + (minute >= 30 ? 1 : 0) + 1`
+     *
+     * @returns Grid row number (minimum 1).
+     */
+    static getCorrectRow(hour: number, minute: number, startHour: number): number;
+}
+
 /**
  * Types for mn-lib configuration.
  */
+interface MnConfigSettings {
+    /** Application or library version. */
+    version?: string;
+    /** Application or library name. */
+    name?: string;
+}
 interface MnConfigFile {
+    /**
+     * General settings such as version and name.
+     */
+    settings?: MnConfigSettings;
     /**
      * Base defaults by component name. Each value is a plain object with inputs/options for that component.
      */
@@ -2815,14 +3810,26 @@ interface MnConfigFile {
 declare class MnConfigService {
     private readonly http;
     private _config;
+    private _settings;
     private _debugMode;
+    /** Reactive version counter — incremented on every config load. */
+    private _configVersion;
+    readonly configVersion: i0.Signal<number>;
     private readonly lang;
     constructor(http: HttpClient);
+    /** General settings from the config file (version, name, etc.). */
+    get settings(): Readonly<MnConfigSettings>;
     /**
      * Load the configuration JSON from the provided URL and cache it in memory.
      * Consumers should typically call this via the APP_INITIALIZER helper.
      */
     load(url: string, debugMode?: boolean): Promise<void>;
+    /**
+     * Load configuration from a pre-parsed object (no HTTP fetch).
+     * Used for live preview scenarios where config is pushed via postMessage.
+     * Optionally re-bootstraps the language service if a `language` section is present.
+     */
+    loadFromObject(config: Record<string, any>, bootstrapLanguage?: boolean): Promise<void>;
     /**
      * Resolve a configuration object for a component, optionally scoped to a section path
      * and optionally overridden by an instance id.
@@ -3308,5 +4315,22 @@ declare class MnTranslatePipe implements PipeTransform {
     static ɵpipe: i0.ɵɵPipeDeclaration<MnTranslatePipe, "mnTranslate", true>;
 }
 
-export { API_BASE_URL, ActionStyle, BackdropMode, BaseModalBuilder, CloseMode, ColumnSortType, ConfirmationModalBuilder, ConfirmationTone, CrudService, CustomModalBuilder, DEFAULT_MN_ALERT_CONFIG, FieldAppearance, FieldKind, FormLayoutMode, FormModalBuilder, KeyboardMode, MN_ALERT_CONFIG, MN_CHECKBOX_CONFIG, MN_DATETIME_CONFIG, MN_INPUT_FIELD_CONFIG, MN_INSTANCE_ID, MN_LIB_DUAL_HORIZONTAL_IMAGE, MN_MULTI_SELECT_CONFIG, MN_SECTION_PATH, MN_TEST_COMPONENT_CONFIG, MN_TEXTAREA_CONFIG, MnAlertOutletComponent, MnAlertService, MnAlertStore, MnButton, MnCheckbox, MnConfigService, MnConfirmationBodyComponent, MnCustomBodyHostComponent, MnDatetime, MnDualHorizontalImage, MnFormBodyComponent, MnInformationCard, MnInputField, MnInstanceDirective, MnLanguageService, MnModalRef, MnModalService, MnModalShellComponent, MnMultiSelect, MnSectionDirective, MnTable, MnTestComponent, MnTextarea, MnTranslatePipe, MnWizardBodyComponent, ModalBuilder, ModalCloseReason, ModalIntent, ModalKind, ModalSize, NavigationDirection, OptionState, SelectionMode, StepBuilder, StepState, SubmitMode, Test, ValidationCode, ValidationStatus, WizardFlowMode, WizardModalBuilder, dateTimeAdapter, defaultTextAdapter, isTranslatable, mnAlertVariants, mnButtonVariants, mnCheckboxVariants, mnDatetimeVariants, mnInformationCardVariants, mnInputFieldVariants, mnMultiSelectVariants, mnTextareaVariants, numberAdapter, pickAdapter, provideMnAlerts, provideMnComponentConfig, provideMnConfig, provideMnLanguage };
-export type { ApiError, BaseModalConfig, CancellationActionConfig, CheckboxFieldConfig, ColorFieldConfig, ColumnDefinition, ConfirmationActionConfig, ConfirmationModalConfig, CrudConfig, CursorPaginationStrategy, CustomFieldConfig, CustomModalConfig, DateFieldConfig, DatetimeFieldConfig, FailureResult, FieldDataSource, FieldValidator, FieldVisibilityCondition, FileFieldConfig, FormFieldConfig, FormFieldGroup, FormModalConfig, FormRow, FormRowField, FormValidator, MnAlert, MnAlertConfig, MnAlertId, MnAlertKind, MnAlertTemplateContext, MnAlertVariants, MnButtonTypes, MnButtonVariants, MnCheckboxErrorMessageData, MnCheckboxErrorMessagesData, MnCheckboxProps, MnCheckboxUIConfig, MnCheckboxVariants, MnConfigFile, MnConfigValue, MnDatetimeErrorMessageData, MnDatetimeErrorMessagesData, MnDatetimeMode, MnDatetimeProps, MnDatetimeUIConfig, MnDatetimeVariants, MnDomAttrs, MnDualHorizontalImageConfig, MnDualHorizontalImageTypes, MnErrorMessageData, MnErrorMessagesData, MnImageType, MnInformationCardBaseData, MnInformationCardData, MnInformationCardVariants, MnInputAdapter, MnInputBaseProps, MnInputDateTimeProps, MnInputFieldProps, MnInputFieldUIConfig, MnInputProps, MnInputType, MnInputVariants, MnLanguageConfig, MnMultiSelectErrorMessageData, MnMultiSelectErrorMessagesData, MnMultiSelectOption, MnMultiSelectProps, MnMultiSelectUIConfig, MnMultiSelectVariants, MnShowInput, MnTextareaErrorMessageData, MnTextareaErrorMessagesData, MnTextareaProps, MnTextareaUIConfig, MnTextareaVariants, MnTranslatable, MnTranslationMap, MnTranslations, ModalCancelHandler, ModalCloseEvent, ModalConfig, ModalFooterAction, ModalI18nLabels, ModalInputMap, ModalPollingConfig, ModalRef, ModalResultHandler, ModalStepId, MultiSelectFieldConfig, MultiSelectTableFieldConfig, NumberFieldConfig, OffsetPaginationStrategy, PaginationStrategy, PasswordFieldConfig, Primitive, QueryParams, QueryValue, RatingFieldConfig, Result, ResultMeta, SelectFieldConfig, SelectOption, SingleSelectTableFieldConfig, SliderFieldConfig, SortState, StepBodyConfig, StepGuard, StepValidator, SuccessResult, TableAppearance, TableDataSource, TableRowAction, TextFieldConfig, TextareaFieldConfig, ValidationResult, WizardBeforeCompleteValidator, WizardModalConfig, WizardResult, WizardStepChangeEvent, WizardStepChangeHandler, WizardStepConfig };
+interface MnPreviewMessage {
+    type: 'mn-config-update' | 'mn-translations-update';
+    config?: Record<string, any>;
+    translations?: Record<string, Record<string, string>>;
+}
+/**
+ * Enable live preview mode. Listens for postMessage events from
+ * Mn Web Manager and hot-swaps config/translations at runtime.
+ *
+ * Call this once in your app's bootstrap (e.g., APP_INITIALIZER or root component).
+ *
+ * @param configService - The MnConfigService instance
+ * @param langService - The MnLanguageService instance
+ * @param allowedOrigins - Optional whitelist of allowed origins (security)
+ */
+declare function enableMnPreviewMode(configService: MnConfigService, langService: MnLanguageService, allowedOrigins?: string[]): void;
+
+export { API_BASE_URL, ActionStyle, BackdropMode, BaseModalBuilder, CALENDAR_CONFIG, CALENDAR_DATE_FORMATTER, CalendarDayComponent, CalendarEventComponent, CalendarEventDefaultComponent, CalendarEventLayoutService, CalendarMonthComponent, CalendarUtility, CalendarView, CalendarViewComponent, CalendarWeekComponent, CloseMode, ColumnSortType, ConfirmationModalBuilder, ConfirmationTone, CrudService, CustomModalBuilder, DEFAULT_CALENDAR_CONFIG, DEFAULT_MN_ALERT_CONFIG, DefaultCalendarDateFormatter, FieldAppearance, FieldKind, FormLayoutMode, FormModalBuilder, KeyboardMode, MN_ALERT_CONFIG, MN_CALENDAR_COMPONENT_NAME, MN_CALENDAR_CONFIG, MN_CHECKBOX_CONFIG, MN_DATETIME_CONFIG, MN_INPUT_FIELD_CONFIG, MN_INSTANCE_ID, MN_LIB_DUAL_HORIZONTAL_IMAGE, MN_MULTI_SELECT_CONFIG, MN_SECTION_PATH, MN_TEST_COMPONENT_CONFIG, MN_TEXTAREA_CONFIG, MnAlertOutletComponent, MnAlertService, MnAlertStore, MnButton, MnCheckbox, MnConfigService, MnConfirmationBodyComponent, MnCustomBodyHostComponent, MnDatetime, MnDualHorizontalImage, MnFormBodyComponent, MnInformationCard, MnInputField, MnInstanceDirective, MnLanguageService, MnModalRef, MnModalService, MnModalShellComponent, MnMultiSelect, MnSectionDirective, MnTable, MnTestComponent, MnTextarea, MnTranslatePipe, MnWizardBodyComponent, ModalBuilder, ModalCloseReason, ModalIntent, ModalKind, ModalSize, NavigationDirection, OptionState, SelectionMode, StepBuilder, StepState, SubmitMode, Test, UpcomingEventRowComponent, UpcomingEventsComponent, ValidationCode, ValidationStatus, WizardFlowMode, WizardModalBuilder, dateTimeAdapter, defaultTextAdapter, enableMnPreviewMode, isTranslatable, mnAlertVariants, mnButtonVariants, mnCheckboxVariants, mnDatetimeVariants, mnInformationCardVariants, mnInputFieldVariants, mnMultiSelectVariants, mnTextareaVariants, numberAdapter, pickAdapter, provideMnAlerts, provideMnCalendarConfig, provideMnComponentConfig, provideMnConfig, provideMnLanguage, resolveCalendarConfig };
+export type { AnimationOptions, ApiError, BaseModalConfig, CalendarConfig, CalendarDateFormatter, CalendarEvent, CalendarEventData, CancellationActionConfig, CheckboxFieldConfig, ColorFieldConfig, ColorPreset, ColumnDay, ColumnDefinition, ConfirmationActionConfig, ConfirmationModalConfig, CrudConfig, CurrentTimeCalendarEvent, CursorPaginationStrategy, CustomFieldConfig, CustomModalConfig, DateFieldConfig, DatetimeFieldConfig, FailureResult, FieldDataSource, FieldValidator, FieldVisibilityCondition, FileFieldConfig, FormFieldConfig, FormFieldGroup, FormModalConfig, FormRow, FormRowField, FormValidator, HourRow, MnAlert, MnAlertConfig, MnAlertId, MnAlertKind, MnAlertTemplateContext, MnAlertVariants, MnButtonTypes, MnButtonVariants, MnCheckboxErrorMessageData, MnCheckboxErrorMessagesData, MnCheckboxProps, MnCheckboxUIConfig, MnCheckboxVariants, MnConfigFile, MnConfigSettings, MnConfigValue, MnDatetimeErrorMessageData, MnDatetimeErrorMessagesData, MnDatetimeMode, MnDatetimeProps, MnDatetimeUIConfig, MnDatetimeVariants, MnDomAttrs, MnDualHorizontalImageConfig, MnDualHorizontalImageTypes, MnErrorMessageData, MnErrorMessagesData, MnImageType, MnInformationCardBaseData, MnInformationCardData, MnInformationCardVariants, MnInputAdapter, MnInputBaseProps, MnInputDateTimeProps, MnInputFieldProps, MnInputFieldUIConfig, MnInputProps, MnInputType, MnInputVariants, MnLanguageConfig, MnMultiSelectErrorMessageData, MnMultiSelectErrorMessagesData, MnMultiSelectOption, MnMultiSelectProps, MnMultiSelectUIConfig, MnMultiSelectVariants, MnPreviewMessage, MnShowInput, MnTextareaErrorMessageData, MnTextareaErrorMessagesData, MnTextareaProps, MnTextareaUIConfig, MnTextareaVariants, MnTranslatable, MnTranslationMap, MnTranslations, ModalCancelHandler, ModalCloseEvent, ModalConfig, ModalFooterAction, ModalI18nLabels, ModalInputMap, ModalPollingConfig, ModalRef, ModalResultHandler, ModalStepId, MonthItem, MultiSelectFieldConfig, MultiSelectTableFieldConfig, NumberFieldConfig, OffsetPaginationStrategy, PaginationStrategy, PasswordFieldConfig, Primitive, QueryParams, QueryValue, RatingFieldConfig, Result, ResultMeta, SelectFieldConfig, SelectOption, SingleSelectTableFieldConfig, SliderFieldConfig, SortState, StepBodyConfig, StepGuard, StepValidator, SuccessResult, TableAppearance, TableDataSource, TableRowAction, TextFieldConfig, TextareaFieldConfig, ValidationResult, WizardBeforeCompleteValidator, WizardModalConfig, WizardResult, WizardStepChangeEvent, WizardStepChangeHandler, WizardStepConfig };