@yourself.create/ngx-form-designer 0.0.3 → 0.0.5

package/lib/ai/provide-form-designer-angai-feature.d.ts

@@ -0,0 +1,16 @@
+import { Provider } from '@angular/core';
+import { type AiToolRuntimeContext } from '@uch-web/angai';
+import type { DesignerEventApiDefinition } from '../form-core/models';
+import { DesignerStateService } from '../form-designer/designer-state.service';
+import { type FormDesignerToolContext } from './plugins/form-designer-tool-plugin';
+import * as i0 from "@angular/core";
+export declare class FormDesignerAiFeatureStateService {
+    private readonly widgetDefinitions;
+    private readonly eventApisSignal;
+    setEventApis(apis: DesignerEventApiDefinition[]): void;
+    createToolContext(state: DesignerStateService): FormDesignerToolContext;
+    createDiscoveryContext(state: DesignerStateService): AiToolRuntimeContext;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormDesignerAiFeatureStateService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<FormDesignerAiFeatureStateService>;
+}
+export declare function provideFormDesignerAngaiFeature(): Provider[];

package/lib/form-core/form-engine.d.ts

@@ -1,4 +1,4 @@
-import { FormSchema, WidgetEventType } from './models';
+import { FieldDisplayLabel, FormSchema, WidgetEventType } from './models';
 /**
  * A framework-agnostic engine to handle form state, validation, and visibility logic.
  */
@@ -17,6 +17,7 @@ export interface DataSourceUpdateEvent {
 export declare class FormEngine {
     private schema;
     private values;
+    private fieldLabels;
     private errors;
     private ruleEvaluator;
     private valueSubject;
@@ -31,12 +32,15 @@ export declare class FormEngine {
         value: Record<string, unknown>;
         valueChanges: Observable<Record<string, unknown>>;
     };
-    constructor(schema: FormSchema, initialValues?: Record<string, unknown>);
+    constructor(schema: FormSchema, initialValues?: Record<string, unknown>, initialFieldLabels?: Record<string, FieldDisplayLabel>);
     getSchema(): FormSchema;
     updateSchema(schema: FormSchema): void;
     getValue(fieldName: string): unknown;
     setValue(fieldName: string, value: unknown): void;
     getValues(): Record<string, unknown>;
+    getFieldLabel(fieldName: string): FieldDisplayLabel | undefined;
+    getFieldLabels(): Record<string, FieldDisplayLabel>;
+    setFieldLabel(fieldName: string, label: FieldDisplayLabel | undefined): void;
     getErrors(): Record<string, string[]>;
     getError(fieldName: string): string | null;
     emitUiEvent(event: Omit<UiEvent, 'ts'>): void;
@@ -53,4 +57,4 @@ export declare class FormEngine {
     private evaluateEnterpriseRules;
     private applyRuleAction;
 }
-export declare function createFormEngine(schema: FormSchema, initialValues?: Record<string, unknown>): FormEngine;
+export declare function createFormEngine(schema: FormSchema, initialValues?: Record<string, unknown>, initialFieldLabels?: Record<string, FieldDisplayLabel>): FormEngine;

package/lib/form-core/form-event-runner.d.ts

@@ -8,6 +8,10 @@ export interface FormEventRunnerOptions {
     logger?: FormEventLogger;
     apiExecutor?: WidgetEventApiExecutor;
     dataSourceWriter?: WidgetEventDatasourceWriter;
+    navigateToPage?: (pageId: string) => Promise<{
+        ok: boolean;
+        reason?: string;
+    }>;
 }
 export declare class FormEventRunner {
     private engine;
@@ -16,12 +20,22 @@ export declare class FormEventRunner {
     private readonly logger;
     private readonly apiExecutor?;
     private readonly dataSourceWriter?;
+    private readonly navigateToPage?;
     constructor(engine: FormEngine, loggerOrOptions?: FormEventLogger | FormEventRunnerOptions);
     dispose(): void;
     private handleEvent;
     private executeAction;
     private handleSetValue;
     private handleApiAction;
+    private handleNavigateAction;
+    private evaluateNavigateCondition;
+    private evaluateLogicGroup;
+    private isLogicCondition;
+    private evaluateLogicCondition;
+    private compareValues;
+    private containsValue;
+    private isEmptyValue;
+    private getFieldValue;
     private collectSourceValues;
     private resolveDatasourceId;
     private normalizeRowsForDatasource;

package/lib/form-core/form-journey.models.d.ts

@@ -0,0 +1,30 @@
+import type { FormSchema } from './models';
+export interface FormJourneyPage {
+    id: string;
+    name: string;
+    route: string;
+    schema: FormSchema;
+}
+export interface FormJourneyProject {
+    id: string;
+    title?: string;
+    pages: FormJourneyPage[];
+    startPageId: string;
+    metadata?: Record<string, unknown>;
+}
+export declare function createFormJourneyPage(opts?: {
+    id?: string;
+    name?: string;
+    route?: string;
+    schema?: FormSchema;
+}): FormJourneyPage;
+export declare function createFormJourneyProject(opts?: {
+    id?: string;
+    title?: string;
+    pages?: FormJourneyPage[];
+    startPageId?: string;
+    metadata?: Record<string, unknown>;
+}): FormJourneyProject;
+export declare function isFormJourneyProject(value: unknown): value is FormJourneyProject;
+export declare function normalizeToJourney(value: FormSchema | FormJourneyProject): FormJourneyProject;
+export declare function unwrapSinglePageJourney(value: FormJourneyProject): FormSchema | FormJourneyProject;

package/lib/form-core/models.d.ts

@@ -114,12 +114,9 @@ export interface FieldSchema {
     appearance?: 'outline' | 'fill' | 'standard';
     readonly?: boolean;
     disabled?: boolean;
-    prefixIcon?: string;
-    suffixIcon?: string;
     html5?: Html5ValidationProps;
     validation?: ValidationRule[];
     dependencies?: DependencyRule[];
-    conditionalVisibility?: ConditionalVisibility;
     rules?: FormRule[];
     dataConfig?: DataSourceConfig;
     events?: WidgetEventBinding[];
@@ -195,7 +192,12 @@ export interface WidgetEventActionApi {
     inputTransformScript?: string;
     outputTransformScript?: string;
 }
-export type WidgetEventAction = WidgetEventActionSetValue | WidgetEventActionLog | WidgetEventActionApi;
+export interface WidgetEventActionNavigate {
+    type: 'navigate';
+    targetPageId: string;
+    when?: LogicGroup;
+}
+export type WidgetEventAction = WidgetEventActionSetValue | WidgetEventActionLog | WidgetEventActionApi | WidgetEventActionNavigate;
 export interface WidgetEventApiExecutionRequest {
     eventId: string;
     action: WidgetEventActionApi;
@@ -280,15 +282,11 @@ export interface DataDependencyBinding {
     fieldId: string;
     paramKey: string;
 }
-export interface ConditionalVisibility {
-    fieldName: string;
-    operator: 'equals' | 'notEquals' | 'contains' | 'isEmpty' | 'isNotEmpty' | 'greaterThan' | 'lessThan';
-    value?: unknown;
-}
 export interface OptionSchema {
     label: string;
     value: string | number;
 }
+export type FieldDisplayLabel = string | string[];
 export interface DependencyRule {
     effect: 'show' | 'hide' | 'enable' | 'disable' | 'require' | 'optional';
     when: string;
@@ -359,7 +357,4 @@ export interface FormSchema {
     fields: FieldSchema[];
     layout: LayoutNode;
     ui?: FormUIConfig;
-    submitButtonText?: string;
-    resetButtonText?: string;
-    showResetButton?: boolean;
 }

package/lib/form-designer/designer-state.service.d.ts

@@ -30,6 +30,7 @@ export interface DesignerFieldMoveOptions {
     position?: 'before' | 'after';
     index?: number;
 }
+type RelativeInsertPosition = 'before' | 'after';
 interface DragDropEventLike {
     previousContainer: unknown;
     container: unknown;
@@ -69,6 +70,10 @@ export declare class DesignerStateService {
         fields: FieldSchema[];
         scopePath: string[];
     } | null>;
+    readonly pendingFieldInsert: import("@angular/core").WritableSignal<{
+        referenceFieldId: string;
+        position: RelativeInsertPosition;
+    } | null>;
     private readonly history;
     private readonly historyIndex;
     private readonly historyLength;
@@ -78,6 +83,16 @@ export declare class DesignerStateService {
     constructor();
     readonly layoutIndex: import("@angular/core").Signal<LayoutIndex>;
     readonly selectedNode: import("@angular/core").Signal<LayoutNode | null>;
+    readonly selectedEntry: import("@angular/core").Signal<LayoutIndexEntry | null>;
+    readonly selectedColumnId: import("@angular/core").Signal<string | null>;
+    readonly selectedRowId: import("@angular/core").Signal<string | null>;
+    readonly canInsertColumnBeforeSelection: import("@angular/core").Signal<boolean>;
+    readonly canInsertColumnAfterSelection: import("@angular/core").Signal<boolean>;
+    readonly canInsertRowInSelectedColumn: import("@angular/core").Signal<boolean>;
+    readonly canInsertRowBeforeSelection: import("@angular/core").Signal<boolean>;
+    readonly canInsertRowAfterSelection: import("@angular/core").Signal<boolean>;
+    readonly canArmFieldInsertBeforeSelection: import("@angular/core").Signal<boolean>;
+    readonly canArmFieldInsertAfterSelection: import("@angular/core").Signal<boolean>;
     readonly selectedField: import("@angular/core").Signal<FieldSchema | null>;
     updateSchema(schema: FormSchema): void;
     setFlavor(flavor: DesignerFlavor): void;
@@ -88,6 +103,8 @@ export declare class DesignerStateService {
     selectNode(id: string | null): void;
     toggleNodeSelection(id: string): void;
     isNodeSelected(nodeId: string): boolean;
+    isSelectionRowAncestor(nodeId: string): boolean;
+    isSelectionColumnAncestor(nodeId: string): boolean;
     composeScopedNodeId(scopePath: string[], nodeId: string): string;
     getSelectedScopeFields(): FieldSchema[];
     isSelectionInScope(scopePath: string[]): boolean;
@@ -117,6 +134,13 @@ export declare class DesignerStateService {
     private insertNodeIntoLayout;
     handleDrop(event: DragDropEventLike, targetColId: string): void;
     pushField(widgetDef: WidgetDefinition): void;
+    insertColumnBeforeSelection(): void;
+    insertColumnAfterSelection(): void;
+    insertRowBeforeSelection(): void;
+    insertRowAfterSelection(): void;
+    insertRowInSelectedColumn(): void;
+    armFieldInsertBeforeSelection(): void;
+    armFieldInsertAfterSelection(): void;
     insertField(options: DesignerFieldInsertOptions): DesignerFieldInsertResult | null;
     deleteFields(fieldIds: string[]): void;
     moveField(fieldId: string, options: DesignerFieldMoveOptions): boolean;
@@ -170,10 +194,19 @@ export declare class DesignerStateService {
      */
     private updateNodeInTree;
     private resolveEntry;
+    private findSelectionColumnEntry;
+    private findSelectionRowEntry;
+    private findAncestorEntryByType;
     private resolveSchemaAtScope;
     private findFieldByIdInScope;
     private resolveInsertionScopePath;
     private resolveTargetColumnForFieldInsert;
+    private resolveColumnInsertTarget;
+    private insertColumnRelativeToSelection;
+    private resolveRelativeRowInsertTarget;
+    private insertRowRelativeToSelection;
+    private armFieldInsertForSelection;
+    private getSelectedFieldReference;
     private resolveFieldWidgetDefinition;
     private normalizeFieldTypeAlias;
     private normalizeLookupValue;
@@ -188,6 +221,7 @@ export declare class DesignerStateService {
     private clampIndex;
     private isLayoutNode;
     private detachNode;
+    private pruneEmptyRows;
     private findWidgetByRefId;
     private findParentCol;
     private removeWidgetByRefId;

package/lib/form-designer/dynamic-properties/dynamic-properties.component.d.ts

@@ -11,7 +11,7 @@ export declare class DynamicPropertiesComponent implements OnChanges {
     onPropertyChange?: () => void;
     private readonly designerCtx;
     protected readonly validatorTypeOptions: NativeSelectOption<string>[];
-    protected readonly conditionalTypeOptions: NativeSelectOption<string>[];
+    protected readonly builtinValidatorOptions: NativeSelectOption<string>[];
     get properties(): PropertySection[];
     getFieldReferenceCandidates(field: PropertyField): FieldSchema[];
     fieldReferenceOptions(field: PropertyField): NativeSelectOption<string>[];
@@ -91,10 +91,8 @@ export declare class DynamicPropertiesComponent implements OnChanges {
     addValidator(path: string): void;
     removeValidator(path: string, index: number): void;
     updateValidator(path: string, index: number, field: string, value: any): void;
-    getValidatorLabel(name: string): string;
-    enableConditional(path: string): void;
-    disableConditional(path: string): void;
-    updateConditional(path: string, field: string, value: any): void;
+    private createDefaultValidationRule;
+    private defaultValidationMessage;
     static ɵfac: i0.ɵɵFactoryDeclaration<DynamicPropertiesComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DynamicPropertiesComponent, "app-dynamic-properties", never, { "onPropertyChange": { "alias": "onPropertyChange"; "required": false; }; "config": { "alias": "config"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "includeSections": { "alias": "includeSections"; "required": false; }; "excludeSections": { "alias": "excludeSections"; "required": false; }; "allFields": { "alias": "allFields"; "required": false; }; }, { "configChange": "configChange"; }, never, never, true, never>;
 }

package/lib/form-designer/events-workspace.component.d.ts

@@ -1,4 +1,4 @@
-import { DesignerEventApiBrowser, DesignerEventApiDefinition, EventsWorkspaceSavePayload, FieldSchema, FormSchema, WidgetEventAction, WidgetEventActionApi, WidgetEventActionLog, WidgetEventActionSetValue, WidgetEventBinding, WidgetEventType } from '../form-core/models';
+import { ConditionOperator, DesignerEventApiBrowser, DesignerEventApiDefinition, EventsWorkspaceSavePayload, FieldSchema, FormSchema, LogicGroup, WidgetEventAction, WidgetEventActionApi, WidgetEventActionLog, WidgetEventActionNavigate, WidgetEventActionSetValue, WidgetEventBinding, WidgetEventType } from '../form-core/models';
 import * as i0 from "@angular/core";
 type WorkspaceTab = 'fields' | 'input' | 'output';
 interface WorkspaceFieldItem {
@@ -25,11 +25,16 @@ interface ApiSchemaState {
     loading: boolean;
     error: string | null;
 }
+interface WorkspacePageOption {
+    id: string;
+    name: string;
+}
 export declare class EventsWorkspaceComponent {
     readonly schema: import("@angular/core").InputSignal<FormSchema>;
     readonly readOnly: import("@angular/core").InputSignal<boolean>;
     readonly eventApis: import("@angular/core").InputSignal<DesignerEventApiDefinition[]>;
     readonly eventApiBrowser: import("@angular/core").InputSignal<DesignerEventApiBrowser | undefined>;
+    readonly pages: import("@angular/core").InputSignal<WorkspacePageOption[]>;
     readonly schemaChange: import("@angular/core").OutputEmitterRef<FormSchema>;
     readonly eventsSave: import("@angular/core").OutputEmitterRef<EventsWorkspaceSavePayload>;
     readonly draftSchema: import("@angular/core").WritableSignal<FormSchema | null>;
@@ -45,6 +50,10 @@ export declare class EventsWorkspaceComponent {
         label: string;
         value: string;
     }[];
+    readonly conditionOperatorOptions: Array<{
+        label: string;
+        value: ConditionOperator;
+    }>;
     readonly currentSchema: import("@angular/core").Signal<FormSchema>;
     readonly fields: import("@angular/core").Signal<WorkspaceFieldItem[]>;
     readonly filteredFields: import("@angular/core").Signal<WorkspaceFieldItem[]>;
@@ -80,7 +89,7 @@ export declare class EventsWorkspaceComponent {
     removeAction(bindingIndex: number, actionIndex: number): void;
     setActionType(action: WidgetEventAction, type: WidgetEventAction['type']): void;
     updateActionType(bindingIndex: number, actionIndex: number, type: WidgetEventAction['type']): void;
-    patchAction(bindingIndex: number, actionIndex: number, patch: Partial<WidgetEventActionSetValue> | Partial<WidgetEventActionLog> | Partial<WidgetEventActionApi>): void;
+    patchAction(bindingIndex: number, actionIndex: number, patch: Partial<WidgetEventActionSetValue> | Partial<WidgetEventActionLog> | Partial<WidgetEventActionApi> | Partial<WidgetEventActionNavigate>): void;
     patchApiAction(action: WidgetEventAction, patch: Partial<WidgetEventActionApi>): void;
     getSelectableActionFields(action: WidgetEventAction): WorkspaceFieldItem[];
     actionFieldSearch(action: WidgetEventAction): string;
@@ -107,6 +116,19 @@ export declare class EventsWorkspaceComponent {
     asSetValue(action: WidgetEventAction): WidgetEventActionSetValue;
     asLog(action: WidgetEventAction): WidgetEventActionLog;
     asApi(action: WidgetEventAction): WidgetEventActionApi;
+    asNavigate(action: WidgetEventAction): WidgetEventActionNavigate;
+    updateNavigateTarget(bindingIndex: number, actionIndex: number, targetPageId: string): void;
+    hasNavigateCondition(action: WidgetEventActionNavigate): boolean;
+    toggleNavigateCondition(bindingIndex: number, actionIndex: number, enabled: boolean): void;
+    updateNavigateConditionGroup(bindingIndex: number, actionIndex: number, group?: LogicGroup): void;
+    navigateConditionFieldId(action: WidgetEventActionNavigate): string;
+    navigateConditionOperator(action: WidgetEventActionNavigate): ConditionOperator;
+    navigateConditionValue(action: WidgetEventActionNavigate): string;
+    updateNavigateConditionField(bindingIndex: number, actionIndex: number, fieldId: string): void;
+    updateNavigateConditionOperator(bindingIndex: number, actionIndex: number, operator: ConditionOperator): void;
+    updateNavigateConditionValue(bindingIndex: number, actionIndex: number, value: string): void;
+    navigateOperatorNeedsValue(operator: ConditionOperator): boolean;
+    navigateConditionFields(): FieldSchema[];
     trackFieldById(_: number, field: WorkspaceFieldItem): string;
     trackBindingById(_: number, binding: WidgetEventBinding): string;
     trackActionByIndex(index: number): number;
@@ -116,6 +138,9 @@ export declare class EventsWorkspaceComponent {
     isEventExpanded(bindingId: string): boolean;
     toggleEventExpansion(bindingId: string): void;
     private getFieldsExcludingSelected;
+    private firstNavigateCondition;
+    private isLogicCondition;
+    private toNavigateLogicGroup;
     private updateSelectedEvents;
     private buildActionByType;
     private flattenFields;
@@ -141,6 +166,6 @@ export declare class EventsWorkspaceComponent {
     private clone;
     private createEventDatasourceId;
     static ɵfac: i0.ɵɵFactoryDeclaration<EventsWorkspaceComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EventsWorkspaceComponent, "app-events-workspace", never, { "schema": { "alias": "schema"; "required": true; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "eventApis": { "alias": "eventApis"; "required": false; "isSignal": true; }; "eventApiBrowser": { "alias": "eventApiBrowser"; "required": false; "isSignal": true; }; }, { "schemaChange": "schemaChange"; "eventsSave": "eventsSave"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EventsWorkspaceComponent, "app-events-workspace", never, { "schema": { "alias": "schema"; "required": true; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "eventApis": { "alias": "eventApis"; "required": false; "isSignal": true; }; "eventApiBrowser": { "alias": "eventApiBrowser"; "required": false; "isSignal": true; }; "pages": { "alias": "pages"; "required": false; "isSignal": true; }; }, { "schemaChange": "schemaChange"; "eventsSave": "eventsSave"; }, never, never, true, never>;
 }
 export {};

package/lib/form-designer/form-designer-shell.component.d.ts

@@ -1,9 +1,11 @@
 import { EventEmitter, SimpleChanges, OnChanges } from '@angular/core';
 import { FormEngine } from '../form-core/form-engine';
 import { FormSchema, DesignerEventApiBrowser, DesignerEventApiDefinition, DesignerFlavor, EventsWorkspaceSavePayload, WidgetEventApiExecutor } from '../form-core/models';
+import type { FormJourneyProject } from '../form-core/form-journey.models';
 import { DesignerStateService } from './designer-state.service';
 import { DesignerTemplateDefinition } from './template-library';
 import { ExternalDataSource } from '../data/external-data-source';
+import { FormJourneyStateService } from './form-journey-state.service';
 import * as i0 from "@angular/core";
 export interface FormDesignerShellSchemaMetadata {
     id?: string;
@@ -13,9 +15,11 @@ export interface FormDesignerShellSchemaMetadata {
 }
 export declare class FormDesignerShellComponent implements OnChanges {
     protected readonly state: DesignerStateService;
+    protected readonly journeyState: FormJourneyStateService;
     protected readonly aiAvailable: boolean;
-    private readonly aiToolRegistry;
+    private readonly aiFeatureState;
     schema?: FormSchema;
+    journey?: FormJourneyProject;
     schemaMetadata?: FormDesignerShellSchemaMetadata;
     flavor: DesignerFlavor;
     flavors: DesignerFlavor[];
@@ -34,10 +38,13 @@ export declare class FormDesignerShellComponent implements OnChanges {
     eventApiBrowser?: DesignerEventApiBrowser;
     eventApiExecutor?: WidgetEventApiExecutor;
     flavorChange: EventEmitter<DesignerFlavor>;
-    edit: EventEmitter<FormSchema>;
-    save: EventEmitter<FormSchema>;
-    push: EventEmitter<FormSchema>;
+    edit: EventEmitter<FormSchema | FormJourneyProject>;
+    save: EventEmitter<FormSchema | FormJourneyProject>;
+    push: EventEmitter<FormSchema | FormJourneyProject>;
     eventsSave: EventEmitter<EventsWorkspaceSavePayload>;
+    saveDocument: EventEmitter<FormSchema | FormJourneyProject>;
+    pushDocument: EventEmitter<FormSchema | FormJourneyProject>;
+    editDocument: EventEmitter<FormSchema | FormJourneyProject>;
     private catalog;
     private managedSourceIds;
     private managedEventSourceIds;
@@ -48,9 +55,17 @@ export declare class FormDesignerShellComponent implements OnChanges {
     selectedTemplateId: string | null;
     pendingTemplate: DesignerTemplateDefinition | null;
     private lastSavedSchemaSnapshot;
+    readonly designerPages: import("@angular/core").Signal<{
+        id: string;
+        name: string;
+        route: string;
+    }[]>;
+    private readonly journeySyncEnabled;
+    private readonly schemaSync;
     get engine(): FormEngine;
     get filteredTemplates(): DesignerTemplateDefinition[];
     get selectedTemplate(): DesignerTemplateDefinition | null;
+    constructor();
     get resolvedHeaderLabel(): string;
     ngOnChanges(changes: SimpleChanges): void;
     private syncDataSources;
@@ -63,6 +78,11 @@ export declare class FormDesignerShellComponent implements OnChanges {
     openEventsWorkspace(): void;
     openAiWorkspace(): void;
     closeAiWorkspace(): void;
+    addPage(): void;
+    selectPage(id: string): void;
+    removePage(id: string): void;
+    renamePage(id: string, name: string): void;
+    updatePageRoute(id: string, route: string): void;
     onEventsSchemaChange(schema: FormSchema): void;
     onEventsSave(payload: EventsWorkspaceSavePayload): void;
     selectTemplate(template: DesignerTemplateDefinition): void;
@@ -78,10 +98,15 @@ export declare class FormDesignerShellComponent implements OnChanges {
     private hasUnsavedChanges;
     private serializeSchema;
     private applyTemplate;
+    private parseTemplateJourney;
     private syncTemplateSelection;
     private createSchemaId;
+    private loadExternalDocument;
+    private loadActivePage;
+    private persistActivePage;
+    private getResolvedExternalDocument;
     private getResolvedExternalSchema;
     private applySchemaMetadata;
     static ɵfac: i0.ɵɵFactoryDeclaration<FormDesignerShellComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FormDesignerShellComponent, "app-form-designer-shell", never, { "schema": { "alias": "schema"; "required": false; }; "schemaMetadata": { "alias": "schemaMetadata"; "required": false; }; "flavor": { "alias": "flavor"; "required": false; }; "flavors": { "alias": "flavors"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "headerLabel": { "alias": "headerLabel"; "required": false; }; "enableTemplateLibrary": { "alias": "enableTemplateLibrary"; "required": false; }; "enableGlobalDataManager": { "alias": "enableGlobalDataManager"; "required": false; }; "enableAiAssistant": { "alias": "enableAiAssistant"; "required": false; }; "showEditButton": { "alias": "showEditButton"; "required": false; }; "showSaveButton": { "alias": "showSaveButton"; "required": false; }; "showPushButton": { "alias": "showPushButton"; "required": false; }; "showEmailPreview": { "alias": "showEmailPreview"; "required": false; }; "isReadOnly": { "alias": "isReadOnly"; "required": false; }; "dataSources": { "alias": "dataSources"; "required": false; }; "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiBrowser": { "alias": "eventApiBrowser"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; }, { "flavorChange": "flavorChange"; "edit": "edit"; "save": "save"; "push": "push"; "eventsSave": "eventsSave"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormDesignerShellComponent, "app-form-designer-shell", never, { "schema": { "alias": "schema"; "required": false; }; "journey": { "alias": "journey"; "required": false; }; "schemaMetadata": { "alias": "schemaMetadata"; "required": false; }; "flavor": { "alias": "flavor"; "required": false; }; "flavors": { "alias": "flavors"; "required": false; }; "templates": { "alias": "templates"; "required": false; }; "headerLabel": { "alias": "headerLabel"; "required": false; }; "enableTemplateLibrary": { "alias": "enableTemplateLibrary"; "required": false; }; "enableGlobalDataManager": { "alias": "enableGlobalDataManager"; "required": false; }; "enableAiAssistant": { "alias": "enableAiAssistant"; "required": false; }; "showEditButton": { "alias": "showEditButton"; "required": false; }; "showSaveButton": { "alias": "showSaveButton"; "required": false; }; "showPushButton": { "alias": "showPushButton"; "required": false; }; "showEmailPreview": { "alias": "showEmailPreview"; "required": false; }; "isReadOnly": { "alias": "isReadOnly"; "required": false; }; "dataSources": { "alias": "dataSources"; "required": false; }; "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiBrowser": { "alias": "eventApiBrowser"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; }, { "flavorChange": "flavorChange"; "edit": "edit"; "save": "save"; "push": "push"; "eventsSave": "eventsSave"; "saveDocument": "saveDocument"; "pushDocument": "pushDocument"; "editDocument": "editDocument"; }, never, never, true, never>;
 }

package/lib/form-designer/form-journey-state.service.d.ts

@@ -0,0 +1,28 @@
+import type { FormSchema } from '../form-core/models';
+import type { FormJourneyPage, FormJourneyProject } from '../form-core/form-journey.models';
+import * as i0 from "@angular/core";
+export declare class FormJourneyStateService {
+    private readonly documentSignal;
+    private readonly sourceWasPlainSchema;
+    readonly document: import("@angular/core").Signal<FormJourneyProject>;
+    readonly pages: import("@angular/core").Signal<FormJourneyPage[]>;
+    readonly activePageId: import("@angular/core").WritableSignal<string>;
+    readonly activePage: import("@angular/core").Signal<FormJourneyPage | null>;
+    readonly canRemovePage: import("@angular/core").Signal<boolean>;
+    readonly isJourneyMode: import("@angular/core").Signal<boolean>;
+    setDocument(input: FormSchema | FormJourneyProject): void;
+    setActivePage(id: string): void;
+    addPage(): FormJourneyPage;
+    removePage(id: string): void;
+    renamePage(id: string, name: string): void;
+    updateRoute(id: string, route: string): void;
+    updateActivePageSchema(schema: FormSchema): void;
+    updatePageSchema(id: string, schema: FormSchema): void;
+    compatibleOutput(): FormSchema | FormJourneyProject;
+    private isJourneyInput;
+    private nextPageName;
+    private ensureUniqueRoute;
+    private normalizeRoute;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormJourneyStateService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<FormJourneyStateService>;
+}

package/lib/form-designer/form-preview.component.d.ts

@@ -1,7 +1,13 @@
+import { EventEmitter } from '@angular/core';
 import { DesignerStateService } from './designer-state.service';
 import { type FieldDataAccessMap, type RuntimeFieldDataAccessApi } from '../data/runtime-field-data-access-registry.service';
 import { DesignerEventApiDefinition, WidgetEventApiExecutor } from '../form-core/models';
 import * as i0 from "@angular/core";
+type PreviewPage = {
+    id: string;
+    name: string;
+    route: string;
+};
 export declare class FormPreviewComponent {
     state: DesignerStateService;
     eventApis: DesignerEventApiDefinition[];
@@ -10,6 +16,9 @@ export declare class FormPreviewComponent {
     fieldDataAccessApi?: RuntimeFieldDataAccessApi;
     formContentId?: string;
     formContentVersion?: string;
+    pages: PreviewPage[];
+    activePageId: string | null;
+    pageSelect: EventEmitter<string>;
     breakpoints: readonly ["xs", "sm", "md", "lg", "xl", "2xl"];
     breakpoint: import("@angular/core").WritableSignal<"xs" | "sm" | "md" | "lg" | "xl" | "2xl">;
     activeDevice: import("@angular/core").Signal<"mobile" | "desktop">;
@@ -17,6 +26,13 @@ export declare class FormPreviewComponent {
     combinedFormData: any;
     constructor(state: DesignerStateService);
     setBreakpoint(bp: any): void;
+    hasJourneyPages(): boolean;
+    isPageActive(pageId: string): boolean;
+    requestPageSelect(pageId: string): void;
+    readonly navigateToPage: (pageId: string) => Promise<{
+        ok: boolean;
+        reason?: string;
+    }>;
     getContainerWidth(): "100%" | "375px" | "576px" | "768px" | "992px" | "1200px" | "1400px";
     getPageStyle(): Record<string, any>;
     close(): void;
@@ -31,6 +47,9 @@ export declare class FormPreviewComponent {
     private isBytePayload;
     private isBase64Payload;
     private isLikelyBase64;
+    trackPageById(_: number, page: PreviewPage): string;
+    private resolveActivePageId;
     static ɵfac: i0.ɵɵFactoryDeclaration<FormPreviewComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FormPreviewComponent, "app-form-preview", never, { "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; "fieldDataAccessMap": { "alias": "fieldDataAccessMap"; "required": false; }; "fieldDataAccessApi": { "alias": "fieldDataAccessApi"; "required": false; }; "formContentId": { "alias": "formContentId"; "required": false; }; "formContentVersion": { "alias": "formContentVersion"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormPreviewComponent, "app-form-preview", never, { "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; "fieldDataAccessMap": { "alias": "fieldDataAccessMap"; "required": false; }; "fieldDataAccessApi": { "alias": "fieldDataAccessApi"; "required": false; }; "formContentId": { "alias": "formContentId"; "required": false; }; "formContentVersion": { "alias": "formContentVersion"; "required": false; }; "pages": { "alias": "pages"; "required": false; }; "activePageId": { "alias": "activePageId"; "required": false; }; }, { "pageSelect": "pageSelect"; }, never, never, true, never>;
 }
+export {};

package/lib/form-designer/inspector-sections/inspector-backgrounds-section.component.d.ts

@@ -15,8 +15,13 @@ export declare class InspectorBackgroundsSectionComponent {
         value: string;
     }[];
     showImageUrl: boolean;
+    protected backgroundColorValue(): string;
     getBackgroundPreview(): string;
+    protected onBackgroundPickerChange(value: string): void;
+    protected onBackgroundColorInputChange(value: string): void;
     updateStyle(key: string, value: any): void;
+    private normalizeBackgroundColor;
+    private isTransparentColor;
     static ɵfac: i0.ɵɵFactoryDeclaration<InspectorBackgroundsSectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<InspectorBackgroundsSectionComponent, "inspector-backgrounds-section", never, { "style": { "alias": "style"; "required": false; "isSignal": true; }; }, { "styleChange": "styleChange"; }, never, never, true, never>;
 }

package/lib/form-designer/inspector-sections/inspector-transform-section.component.d.ts

@@ -0,0 +1,12 @@
+import { StyleTokenSet } from '../../form-core/models';
+import * as i0 from "@angular/core";
+type TransformKey = 'transformX' | 'transformY' | 'transformZ' | 'rotate' | 'scale';
+export declare class InspectorTransformSectionComponent {
+    readonly style: import("@angular/core").InputSignal<Partial<StyleTokenSet>>;
+    readonly styleChange: import("@angular/core").OutputEmitterRef<Partial<StyleTokenSet>>;
+    protected numberValue(key: TransformKey, fallback: number): number;
+    protected updateTransform(key: TransformKey, value: unknown): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InspectorTransformSectionComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InspectorTransformSectionComponent, "inspector-transform-section", never, { "style": { "alias": "style"; "required": false; "isSignal": true; }; }, { "styleChange": "styleChange"; }, never, never, true, never>;
+}
+export {};

package/lib/form-designer/inspector-sections/inspector-typography-section.component.d.ts

@@ -25,6 +25,7 @@ export declare class InspectorTypographySectionComponent {
     isBoldActive(): boolean;
     isItalicActive(): boolean;
     isUnderlineActive(): boolean;
+    colorValue(): string;
     updateStyle(key: string, value: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InspectorTypographySectionComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<InspectorTypographySectionComponent, "inspector-typography-section", never, { "style": { "alias": "style"; "required": false; "isSignal": true; }; }, { "styleChange": "styleChange"; }, never, never, true, never>;

package/lib/form-designer/json-form-designer.component.d.ts

@@ -1,17 +1,36 @@
-import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core';
 import { DesignerStateService } from './designer-state.service';
 import { DesignerEventApiDefinition, DesignerFlavor, WidgetEventApiExecutor } from '../form-core/models';
 import * as i0 from "@angular/core";
 type DesignerMode = 'edit' | 'view';
+type DesignerPage = {
+    id: string;
+    name: string;
+    route: string;
+};
 export declare class JsonFormDesignerComponent implements OnInit, OnChanges {
     flavor: DesignerFlavor;
     mode: DesignerMode;
     eventApis: DesignerEventApiDefinition[];
     eventApiExecutor?: WidgetEventApiExecutor;
+    pages: DesignerPage[] | null;
+    activePageId: string | null;
+    canRemovePage: boolean;
+    readonly pageAdd: EventEmitter<void>;
+    readonly pageSelect: EventEmitter<string>;
+    readonly pageRemove: EventEmitter<string>;
+    readonly pageRename: EventEmitter<{
+        id: string;
+        name: string;
+    }>;
+    readonly pageRouteChange: EventEmitter<{
+        id: string;
+        route: string;
+    }>;
     state: DesignerStateService;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<JsonFormDesignerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<JsonFormDesignerComponent, "app-json-form-designer", never, { "flavor": { "alias": "flavor"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<JsonFormDesignerComponent, "app-json-form-designer", never, { "flavor": { "alias": "flavor"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "eventApis": { "alias": "eventApis"; "required": false; }; "eventApiExecutor": { "alias": "eventApiExecutor"; "required": false; }; "pages": { "alias": "pages"; "required": false; }; "activePageId": { "alias": "activePageId"; "required": false; }; "canRemovePage": { "alias": "canRemovePage"; "required": false; }; }, { "pageAdd": "pageAdd"; "pageSelect": "pageSelect"; "pageRemove": "pageRemove"; "pageRename": "pageRename"; "pageRouteChange": "pageRouteChange"; }, never, never, true, never>;
 }
 export {};