@esfaenza/flow-builder 20.3.15 → 20.3.16

package/index.d.ts

@@ -2,7 +2,7 @@ import * as _angular_core from '@angular/core';
 import { InjectionToken, Signal, AfterViewChecked } from '@angular/core';
 import * as _esfaenza_flow_builder from '@esfaenza/flow-builder';
 import { EFMarkerType, EFConnectableSide } from '@foblex/flow';
-import { CdkDragDrop } from '@angular/cdk/drag-drop';
+import { CdkDragMove, CdkDragEnd } from '@angular/cdk/drag-drop';
 
 /**
  * Modello del documento Flow — FRONTEND.md §3, §4, §5.
@@ -132,7 +132,11 @@ interface FlowFormula {
     description?: string;
     dataType?: FlowDataType;
     scale?: number;
-    /** Passata verbatim al motore di regole: il backend non la valida (§4.6). */
+    /**
+     * Passata verbatim al motore di regole: il backend non la interpreta, ma la fa **verificare**
+     * al motore — `POST /flows/validate-formula` mentre si digita, e la stessa cosa durante la
+     * validazione del documento (§4.6, §6.3).
+     */
     expression?: string;
 }
 interface FlowTextTemplate {
@@ -954,6 +958,50 @@ interface FlowValidationResult {
     warningCount: number;
     isValid: boolean;
 }
+/**
+ * Dove comparira' l'espressione. Non e' cosmesi: e' cio' che permette al motore di dire
+ * «qui serve un booleano» invece di accettare un'espressione che poi fallira' a runtime (§6.3).
+ */
+type FlowFormulaUsage = 'Resource' | 'Condition' | 'ValidationRule' | 'Value' | string;
+/**
+ * L'unica primitiva della §6.3 che **avvolge** il documento invece di prenderlo nudo: oltre al
+ * flow deve portare l'espressione e cosa ci si aspetta che produca (§6.4, ultimo capoverso).
+ * Il documento va mandato **in lavorazione**: una formula cita le variabili appena aggiunte, e
+ * verificarla contro la versione salvata la direbbe sbagliata.
+ */
+interface FlowFormulaValidationRequest {
+    flow: FlowDefinition;
+    expression: string;
+    /** `Boolean` per una condizione o una validation rule, il tipo dichiarato per una risorsa. */
+    expectedDataType?: FlowDataType;
+    usage?: FlowFormulaUsage;
+    /** Solo dove il tipo atteso e' `Number` o `Integer` (§4.6). */
+    scale?: number;
+}
+/**
+ * Come {@link FlowValidationIssue}, piu' la **posizione del tratto sbagliato** dentro
+ * l'espressione: e' il motivo per cui questa primitiva esiste accanto a `POST /flows/validate`.
+ * `code` resta del motore: l'elenco della §7 non lo comprende, quindi si mostra e non si
+ * interpreta.
+ */
+interface FlowFormulaIssue extends FlowValidationIssue {
+    /** Indice del primo carattere, 0-based. Puo' mancare: non ogni rilievo ha una posizione. */
+    position?: number | null;
+    length?: number | null;
+}
+interface FlowFormulaValidationResult {
+    issues: FlowFormulaIssue[];
+    /** Il tipo che l'espressione produce, quando il motore sa dirlo. Puo' mancare. */
+    resultDataType?: FlowDataType | null;
+    isCollection?: boolean;
+    /**
+     * `false` significa «nessun motore di validazione configurato»: nessun rilievo, ma nemmeno
+     * una conferma. **Non e' una promozione** — una spunta verde su un'espressione mai
+     * controllata e' peggio di nessuna spunta (§6.3).
+     */
+    isVerified: boolean;
+    isValid: boolean;
+}
 interface FlowCreateRequest {
     definition: FlowDefinition;
     flowName?: string;
@@ -1305,6 +1353,21 @@ declare abstract class FlowBuilderApi {
     abstract validateDefinition(definition: FlowDefinition): Promise<FlowValidationResult>;
     /** `GET /flows/{name}/versions/{v}/validate` — valida una versione già salvata. */
     validateVersion(flowName: string, version: number): Promise<FlowValidationResult>;
+    /**
+     * `POST /flows/validate-formula` — verifica **una sola** espressione mentre l'utente la
+     * scrive (§6.3). È l'editor di formule, non il pannello dei problemi: i rilievi portano la
+     * `position` del tratto sbagliato, che la validazione dell'intero documento non ha.
+     *
+     * Unica primitiva di analisi con un involucro: il documento sta sotto `flow` perche' il body
+     * deve portare anche l'espressione e il tipo atteso (§6.4).
+     *
+     * Opzionale come tutte le primitive che dipendono da un servizio dell'host: senza motore di
+     * validazione delle formule l'editor deve restare usabile. Ci sono **due** modi in cui manca,
+     * e sono diversi — il rifiuto `MissingService` (la primitiva non c'e') e la risposta con
+     * `isVerified: false` (la primitiva c'e', il motore no): in entrambi i casi l'espressione non
+     * si accompagna a una conferma, mai a una spunta verde.
+     */
+    validateFormula(request: FlowFormulaValidationRequest): Promise<FlowFormulaValidationResult>;
     /**
      * `GET /flows/dictionaries?processType=` — le tendine in una risposta.
      *
@@ -1500,6 +1563,11 @@ declare class HttpFlowBuilderApi extends FlowBuilderApi {
      * validazione di un flow vuoto, cioe' «manca lo Start».
      */
     validateDefinition(definition: FlowDefinition): Promise<FlowValidationResult>;
+    /**
+     * L'eccezione alla regola del documento nudo: qui l'involucro c'e' e il flow sta sotto
+     * `flow`, perche' il body porta anche l'espressione e cosa deve produrre (§6.3, §6.4).
+     */
+    validateFormula(request: FlowFormulaValidationRequest): Promise<FlowFormulaValidationResult>;
     validateVersion(flowName: string, version: number): Promise<FlowValidationResult>;
     getDictionaries(processType?: string): Promise<FlowDictionaries>;
     /**
@@ -2595,6 +2663,29 @@ declare class FlowValidationStore {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<FlowValidationStore>;
 }
 
+declare class FormulaValidationService {
+    private readonly api;
+    private readonly _isSupported;
+    private readonly _lastError;
+    /**
+     * `false` quando la primitiva non e' esposta da questo ambiente. Diverso da
+     * `isVerified: false` nella risposta, che dice «primitiva sì, motore no»: per l'utente
+     * l'effetto e' lo stesso — nessuna conferma — ma il secondo caso lo dice il backend e lo si
+     * riferisce, il primo e' silenzio (§6.3).
+     */
+    readonly isSupported: _angular_core.Signal<boolean>;
+    readonly lastError: _angular_core.Signal<string | null>;
+    /** Ci si puo' provare: la primitiva c'e' e l'ultima chiamata non e' esplosa. */
+    readonly canValidate: _angular_core.Signal<boolean>;
+    /**
+     * Verifica l'espressione. `null` significa «non lo so»: primitiva assente o richiesta
+     * fallita. Non e' «formula valida» — chi chiama non deve mostrare una conferma su un `null`.
+     */
+    validate(request: FlowFormulaValidationRequest): Promise<FlowFormulaValidationResult | null>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormulaValidationService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<FormulaValidationService>;
+}
+
 interface FlowLayoutNodeInput {
     name: string;
     width: number;
@@ -3156,7 +3247,7 @@ declare class ReferencePickerComponent {
      *    percorso inesistente di uno scope che i percorsi li dichiara, perche' lì il backend
      *    risponderebbe `GLOBAL_UNKNOWN`.
      */
-    readonly valueState: _angular_core.Signal<"empty" | "known" | "navigated" | "host" | "member" | "containerRoot" | "memberUnknown" | "memberNotWritable" | "pathUnverified" | "globalPathUntyped" | "globalPathInvalid" | "unknown">;
+    readonly valueState: _angular_core.Signal<"empty" | "unknown" | "member" | "known" | "navigated" | "host" | "containerRoot" | "memberUnknown" | "memberNotWritable" | "pathUnverified" | "globalPathUntyped" | "globalPathInvalid">;
     /** Le parole cambiano con la tappa: un campo di un'entita' non e' un membro di una classe. */
     private readonly tailIsObject;
     private readonly tailContainer;
@@ -3458,6 +3549,114 @@ declare class EnumValuePickerComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<EnumValuePickerComponent, "fb-enum-value-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "enumType": { "alias": "enumType"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
+declare class FormulaEditorComponent {
+    private readonly store;
+    private readonly api;
+    private readonly service;
+    private readonly destroyRef;
+    readonly expression: _angular_core.InputSignal<string>;
+    /** Dove comparira': e' cio' che dice al motore cosa pretendere (§6.3). */
+    readonly usage: _angular_core.InputSignal<string>;
+    /** `Boolean` per condizioni e validation rule, il tipo dichiarato per una risorsa. */
+    readonly expectedDataType: _angular_core.InputSignal<string | undefined>;
+    readonly scale: _angular_core.InputSignal<number | undefined>;
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly rows: _angular_core.InputSignal<number>;
+    /**
+     * Quando propagare al documento. `input` a ogni tasto, `change` all'uscita dal campo: la
+     * seconda serve dove mutare il documento ridisegna mezza schermata — l'anteprima dello screen
+     * dinamico — e riscriverla a ogni tasto costa. La **verifica** parte comunque durante la
+     * digitazione: usa la bozza locale, non cio' che e' arrivato al documento.
+     */
+    readonly commitOn: _angular_core.InputSignal<"input" | "change">;
+    readonly expressionChange: _angular_core.OutputEmitterRef<string>;
+    private readonly area;
+    /**
+     * Il testo che si sta scrivendo. Non e' legato al DOM — la casella tiene il suo valore e la
+     * `[value]` resta quella del documento — perche' riscrivere l'attributo a ogni tasto sposta il
+     * cursore quando si corregge in mezzo all'espressione.
+     */
+    private readonly draft;
+    private readonly _result;
+    private readonly _isChecking;
+    private timer?;
+    /** Cresce a ogni richiesta: scarta le risposte di verifiche già superate. */
+    private sequence;
+    readonly result: _angular_core.Signal<FlowFormulaValidationResult | null>;
+    readonly isChecking: _angular_core.Signal<boolean>;
+    readonly isSupported: _angular_core.Signal<boolean>;
+    /**
+     * I nomi citabili, per l'autocompletamento (§6.3): li da' `POST /flows/references`, cioe' la
+     * stessa fonte del reference picker — compresi gli **output automatici**, che sono riferimenti
+     * validi pur non essendo dichiarati in nessuna collection (§4.5, §13.3). Qui non si filtra per
+     * tipo: dentro un'espressione il tipo lo decide il motore, non il campo.
+     */
+    private readonly references;
+    /** Il documento per cui l'elenco e' stato chiesto: evita una richiesta a ogni focus. */
+    private loadedFor;
+    /** La parola sotto il cursore, che e' cio' che si sta completando. */
+    private readonly token;
+    protected readonly highlighted: _angular_core.WritableSignal<number>;
+    readonly suggestions: _angular_core.Signal<FlowReference[]>;
+    readonly issues: _angular_core.Signal<FlowFormulaIssue[]>;
+    readonly hasErrors: _angular_core.Signal<boolean>;
+    /**
+     * L'esito e' una conferma **solo** se un motore ha davvero guardato l'espressione: senza
+     * `isVerified` non si mostra la spunta, perche' una spunta verde su un'espressione mai
+     * controllata e' peggio di nessuna spunta (§6.3).
+     */
+    readonly isConfirmed: _angular_core.Signal<boolean>;
+    /** Il motore c'e' come primitiva ma non come motore: si dice, non si tace (§6.3). */
+    readonly isUnverified: _angular_core.Signal<boolean>;
+    /**
+     * Il tipo prodotto quando il motore sa dirlo. Serve a segnalare una formula dichiarata
+     * `String` che restituisce una data — ma il rilievo lo fa il motore: se l'ha già emesso,
+     * qui non si ripete lo stesso avviso con parole diverse.
+     */
+    readonly resultDataType: _angular_core.Signal<string | null>;
+    readonly typeMismatch: _angular_core.Signal<{
+        expected: string;
+        produced: string;
+    } | null>;
+    constructor();
+    onInput(value: string): void;
+    onCommit(value: string): void;
+    onFocus(): void;
+    /** Il cursore si sposta anche senza digitare: la parola sotto il cursore va riletta. */
+    onCaretMove(): void;
+    onBlur(): void;
+    /**
+     * Le frecce scorrono l'elenco e Invio inserisce. Senza, l'elenco sarebbe una decorazione: chi
+     * scrive una formula ha le mani sulla tastiera e non va a cercare il mouse.
+     */
+    onKeyDown(event: KeyboardEvent): void;
+    /**
+     * Sostituisce la parola sotto il cursore col nome scelto. Si scrive nel DOM e poi si propaga:
+     * la casella e' la sorgente del testo mentre si digita, e riscrivere solo il documento
+     * lascerebbe indietro il cursore.
+     */
+    insert(name: string): void;
+    private loadReferences;
+    /** La parola sotto il cursore: identificatore o percorso puntato, com'e' in un riferimento. */
+    private refreshToken;
+    severityOf(issue: FlowFormulaIssue): string;
+    hasPosition(issue: FlowFormulaIssue): boolean;
+    /** Il tratto citato dal rilievo, così il messaggio dice *dove* anche senza il salto. */
+    excerptOf(issue: FlowFormulaIssue): string;
+    /**
+     * Porta il cursore sul tratto segnalato. È il payoff di `position`: un indice di carattere
+     * che l'utente dovrebbe contare a mano non aiuta nessuno.
+     */
+    goToIssue(issue: FlowFormulaIssue): void;
+    private schedule;
+    private run;
+    private cancel;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormulaEditorComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormulaEditorComponent, "fb-formula-editor", never, { "expression": { "alias": "expression"; "required": false; "isSignal": true; }; "usage": { "alias": "usage"; "required": false; "isSignal": true; }; "expectedDataType": { "alias": "expectedDataType"; "required": false; "isSignal": true; }; "scale": { "alias": "scale"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "commitOn": { "alias": "commitOn"; "required": false; "isSignal": true; }; }, { "expressionChange": "expressionChange"; }, never, ["*"], true, never>;
+}
+
 /** Le modalita' offerte: una per campo del modello. */
 type ValueMode = 'reference' | 'literal' | 'formula' | 'globalConstant' | 'empty';
 declare class ValueEditorComponent {
@@ -4049,21 +4248,38 @@ declare class OrchestratedStageInspectorComponent extends NodeInspectorBase {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<OrchestratedStageInspectorComponent, "fb-orchestrated-stage-inspector", never, {}, {}, never, never, true, never>;
 }
 
-/** Il payload della lista di rilascio: l'albero appiattito, cioe' le righe che si vedono. */
-type DropData = FlowScreenFieldNode[];
+/** Il punto di inserimento calcolato dal trascinamento: dove, e in che posizione. */
+interface DropTarget {
+    parent: FlowScreenFieldPath;
+    index: number;
+}
 declare class DynamicScreenInspectorComponent extends NodeInspectorBase {
     private readonly catalog;
+    private readonly document;
     protected readonly dictionary: FlowDictionaryStore;
     readonly elementType: FlowElementType;
     readonly screen: _angular_core.Signal<FlowDynamicScreen>;
-    /** Il percorso del campo selezionato: `null` = nessuno, e il pannello destro lo dice. */
+    /** Il percorso del campo selezionato: `null` = nessuno, e a destra ci sono le proprieta'
+     * della **schermata** — lo stesso gesto del cliccare fuori da un campo. */
     private readonly selection;
-    /** L'albero appiattito: e' anche cio' che serve per capire quali percorsi esistono ancora. */
-    readonly tree: _angular_core.Signal<FlowScreenFieldNode[]>;
     readonly selectedPath: _angular_core.Signal<FlowScreenFieldPath | null>;
     readonly selectedField: _angular_core.Signal<FlowScreenField | undefined>;
     /** La voce di dizionario del campo selezionato: e' lei a decidere il form di destra. */
     readonly selectedType: _angular_core.Signal<FlowScreenFieldTypeEntry | undefined>;
+    /**
+     * Due elenchi e non uno: un **componente** si sceglie per tipo (che cosa fa), un **campo di
+     * un'entita'** si sceglie per nome (quale dato), e da lì tipo, etichetta, obbligatorieta' e
+     * opzioni arrivano dallo schema (§5.2). Metterli insieme costringerebbe a scegliere prima
+     * `ObjectProvided` e poi il campo, che e' il contrario dell'ordine in cui si pensa.
+     */
+    readonly paletteTab: _angular_core.WritableSignal<"fields" | "components">;
+    /** L'entita' di cui elencare i campi nella seconda scheda. */
+    readonly fieldsObject: _angular_core.WritableSignal<string | undefined>;
+    private readonly objectFields;
+    readonly fieldsOfObject: _angular_core.Signal<FlowFieldDescription[]>;
+    iconOf(type: string | undefined): string;
+    setPaletteTab(tab: 'components' | 'fields'): void;
+    setFieldsObject(object: string | undefined): void;
     /** Componenti e form sono la stessa domanda al frontend, e lo stesso catalogo (§5.2). */
     private readonly components;
     private readonly componentParameters;
@@ -4081,16 +4297,105 @@ declare class DynamicScreenInspectorComponent extends NodeInspectorBase {
     readonly choiceOptions: _angular_core.Signal<NamePickerOption[]>;
     /** Gli stage dichiarati: `stageReference` alimenta l'indicatore di avanzamento (§5.2). */
     readonly stageOptions: _angular_core.Signal<NamePickerOption[]>;
-    readonly icon: string;
     isSelected(path: FlowScreenFieldPath): boolean;
     isContainer(field: FlowScreenField | undefined): boolean;
-    /** L'etichetta mostrata nell'albero: `fieldText`, poi il nome, poi un segnaposto. */
+    /** `true` sulla sezione, che dispone i figli **in riga**: le colonne stanno una accanto all'altra. */
+    isSection(field: FlowScreenField | undefined): boolean;
+    childPath(parent: FlowScreenFieldPath, index: number): FlowScreenFieldPath;
+    /** L'etichetta da disegnare: `fieldText`, poi il nome, poi un segnaposto esplicito. */
     captionOf(field: FlowScreenField): string;
     typeLabelOf(field: FlowScreenField): string;
-    /** La larghezza in dodicesimi: assente = tutta la riga, che e' il comportamento di default. */
+    /**
+     * La larghezza in dodicesimi: assente = tutta la riga, che e' il default del runtime. È anche
+     * il numero di colonne che il campo occupa nella griglia dell'anteprima, limitato a 1..12
+     * perche' un valore fuori scala romperebbe la griglia invece di segnalarsi.
+     */
     widthOf(field: FlowScreenField): number;
-    /** `true` dove il tipo non e' nel dizionario: il form di destra lo dice invece di indovinare. */
+    /** `true` dove il tipo non e' nel dizionario: si dice, invece di indovinare un disegno. */
     isUnknownType(field: FlowScreenField | undefined): boolean;
+    /**
+     * Le etichette delle opzioni, per disegnarle nell'anteprima: il `choiceText` di una
+     * `FlowChoice`, il nome del choice set (le sue opzioni sono una query, e non esistono finche'
+     * la schermata non viene presentata — §5.2).
+     */
+    choiceLabelsOf(field: FlowScreenField): string[];
+    /** Il testo mostrato dentro il controllo inerte: il default, se ce n'e' uno leggibile. */
+    placeholderOf(field: FlowScreenField): string;
+    /** Il campo che si sta trascinando: la sua anteprima si sbiadisce e non intercetta il mouse. */
+    readonly dragging: _angular_core.WritableSignal<FlowScreenFieldPath | null>;
+    /** Il punto di inserimento corrente, disegnato come una barra fra i campi. */
+    readonly dropTarget: _angular_core.WritableSignal<DropTarget | null>;
+    isDragging(path: FlowScreenFieldPath): boolean;
+    /** `true` se la barra di inserimento va disegnata qui. */
+    isDropAt(parent: FlowScreenFieldPath, index: number): boolean;
+    onFieldDragStarted(path: FlowScreenFieldPath): void;
+    onFieldDragMoved(event: CdkDragMove): void;
+    onFieldDragEnded(event: CdkDragEnd, path: FlowScreenFieldPath): void;
+    /** Trascinamento **dalla palette**: non sposta niente, crea. */
+    onPaletteDragMoved(event: CdkDragMove): void;
+    onComponentDragEnded(event: CdkDragEnd, type: string): void;
+    onObjectFieldDragEnded(event: CdkDragEnd, field: FlowFieldDescription): void;
+    /**
+     * Il documento si muta **dopo** che il gesto e' finito, non dentro `cdkDragEnded`: lì
+     * l'anteprima si ridisegnerebbe mentre il CDK sta ancora chiudendo il trascinamento
+     * sull'elemento che Angular in quel momento riusa per un altro campo. Un rinvio al task
+     * successivo basta, e per chi guarda lo spostamento resta istantaneo.
+     */
+    private afterDrag;
+    /**
+     * Il bersaglio del rilascio, calcolato dal **DOM** e non dalle drop list del CDK.
+     *
+     * Le drop list annidate qui sono ambigue per costruzione: il rettangolo di una sezione
+     * contiene quello delle sue colonne, e a ricevere il rilascio finisce sempre la lista
+     * registrata per prima, cioe' la radice. Interrogando `elementFromPoint` si prende invece il
+     * contenitore **piu' interno** sotto il puntatore, che e' esattamente quello che si vede.
+     *
+     * L'indice viene dal confronto con la mezzeria dei fratelli, sull'asse del contenitore: le
+     * colonne di una sezione stanno in riga, tutto il resto in colonna.
+     */
+    private hitTest;
+    /** `"0.2"` → `[0, 2]`; la radice e' la stringa vuota. */
+    private static parsePath;
+    /** Il valore dell'attributo che marca un contenitore di rilascio. */
+    dropId(path: FlowScreenFieldPath): string;
+    /**
+     * Dove finisce un campo aggiunto **con un clic**: dentro il contenitore selezionato, oppure
+     * accanto al campo selezionato, oppure in fondo alla schermata. È l'ordine in cui uno se lo
+     * aspetta dopo aver cliccato una colonna.
+     */
+    private clickTarget;
+    addComponentAtSelection(type: string): void;
+    addObjectFieldAtSelection(field: FlowFieldDescription): void;
+    /**
+     * Un componente nuovo. Una sezione nasce **con una colonna dentro**: una sezione vuota e'
+     * `SCREEN_CONTAINER_EMPTY` e non ha nemmeno un posto in cui rilasciare i campi, quindi il
+     * primo gesto sarebbe sempre lo stesso.
+     */
+    private addComponent;
+    /**
+     * §5.2 — un campo dell'entita': `objectFieldReference` fa arrivare tipo, label,
+     * obbligatorieta', scala e le opzioni **dallo schema**, invece di ridichiararli qui.
+     */
+    private addObjectField;
+    select(path: FlowScreenFieldPath): void;
+    /** Cliccare la schermata fuori da un campo: a destra tornano le proprieta' della schermata. */
+    selectScreen(): void;
+    removeSelected(): void;
+    duplicateSelected(): void;
+    /**
+     * Spostamento con i tasti: la stessa operazione del trascinamento, per chi non trascina e
+     * perche' spostare di una posizione con il mouse e' piu' difficile che con una freccia.
+     */
+    moveSelected(direction: -1 | 1): void;
+    /** Estrae il campo dal proprio contenitore e lo mette subito dopo di esso. */
+    outdentSelected(): void;
+    readonly canOutdent: _angular_core.Signal<boolean>;
+    /**
+     * `preRemoval` distingue le due convenzioni sull'indice di arrivo: i comandi (su, giu', porta
+     * fuori) ragionano sulla lista **dopo** l'estrazione, il rilascio su cio' che si vedeva
+     * **prima**. Confonderle sposta di uno ogni trascinamento verso il basso.
+     */
+    private applyMove;
     /** Il campo raccoglie un valore, quindi e' referenziabile per nome nel resto del flow (§5.2). */
     readonly selectedIsResource: _angular_core.Signal<boolean>;
     /**
@@ -4122,46 +4427,6 @@ declare class DynamicScreenInspectorComponent extends NodeInspectorBase {
     /** L'oggetto di un `ObjectProvided`, cioe' la parte prima del punto (§5.2). */
     readonly providedObject: _angular_core.Signal<string>;
     readonly providedField: _angular_core.Signal<string>;
-    select(path: FlowScreenFieldPath): void;
-    /** Aggiunge un campo dentro il contenitore selezionato, o in fondo alla schermata. */
-    addField(type: string): void;
-    /**
-     * Dove finisce un campo nuovo: dentro il contenitore selezionato (o dentro il contenitore
-     * che contiene il campo selezionato), altrimenti in fondo alla schermata. È il gesto che
-     * l'utente si aspetta dopo aver cliccato una colonna.
-     */
-    private parentForNewField;
-    removeSelected(): void;
-    duplicateSelected(): void;
-    /**
-     * Spostamento con i tasti: la stessa operazione del trascinamento, per chi non trascina e per
-     * i casi in cui la lista e' piu' alta del pannello.
-     */
-    moveSelected(direction: -1 | 1): void;
-    /**
-     * Sposta il campo dentro il contenitore che lo precede. È la controparte esplicita del
-     * trascinamento: dove l'albero e' lungo, mirare la riga giusta costa piu' di un clic.
-     */
-    indentSelected(): void;
-    /** Il contenitore in cui «porta dentro» metterebbe il campo, o `null` se non ce n'e' uno. */
-    readonly indentTarget: _angular_core.Signal<FlowScreenFieldPath | null>;
-    /** Estrae il campo dal proprio contenitore e lo mette subito dopo di esso. */
-    outdentSelected(): void;
-    /**
-     * Rilascio del trascinamento sulla lista **piatta**.
-     *
-     * Il contenitore di arrivo non lo dice il CDK — c'e' una sola lista — ma si deduce dalla riga
-     * che **precede** il punto di rilascio, che e' anche cio' che l'utente vede: rilasciare subito
-     * sotto una sezione o una colonna significa «mettilo dentro»; rilasciare sotto un campo
-     * normale significa «mettilo accanto». Sono le due sole intenzioni possibili.
-     */
-    onDrop(event: CdkDragDrop<DropData>): void;
-    /**
-     * `preRemoval` distingue le due convenzioni sull'indice di arrivo: i comandi (su, giu',
-     * porta fuori) ragionano sulla lista **dopo** l'estrazione, il rilascio ragiona su cio' che
-     * si vedeva **prima**. Confonderle sposta di uno ogni trascinamento verso il basso.
-     */
-    private applyMove;
     /** Scrive una proprieta' del campo selezionato; valore vuoto → chiave omessa (§2). */
     private patchField;
     setFieldProperty(property: keyof FlowScreenField, value: unknown): void;
@@ -4600,5 +4865,5 @@ declare class SelectValueDirective implements AfterViewChecked {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SelectValueDirective, "select[fbValue]", never, { "fbValue": { "alias": "fbValue"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-export { ConditionEditorComponent, ConnectorEditorComponent, DebugPanelComponent, DynamicScreenInspectorComponent, ElementDialogComponent, ElementInspectorComponent, ElementPaletteComponent, EnumValuePickerComponent, FALLBACK_COLLECTION_BY_TYPE, FALLBACK_TYPE_LABEL, FLOW_BUILDER_HTTP_CONFIG, FLOW_ELEMENT_ICONS, FLOW_ELEMENT_VARIANT_FIELDS, FLOW_ELEMENT_VARIANT_ICONS, FLOW_ERROR_FALLBACK_MESSAGE, FLOW_ERROR_HTTP_STATUS, FLOW_NAME_PATTERN, FLOW_NODE_COLLECTIONS, FLOW_NODE_HEIGHT, FLOW_NODE_WIDTH, FLOW_RESOURCE_COLLECTIONS, FLOW_VALUE_FIELDS, FLOW_VALUE_LITERAL_FIELDS, FieldAssignmentEditorComponent, FieldPickerComponent, FlowApiError, FlowBuilderApi, FlowBuilderComponent, FlowCanvasComponent, FlowCatalogStore, FlowDictionaryStore, FlowDocumentStore, FlowEditorSession, FlowLayoutService, FlowValidationStore, HttpFlowBuilderApi, NamePickerComponent, NodeInspectorBase, ORCHESTRATION_CONDITION_OUTPUT, ObjectPickerComponent, OrchestratedStageInspectorComponent, ParameterEditorComponent, ProblemsPanelComponent, RecordFilterEditorComponent, ReferencePickerComponent, ResourcePanelComponent, SEVERITY_BUCKETS, SEVERITY_ICON, SEVERITY_LABEL, START_NODE_NAME, SelectValueDirective, StartInspectorComponent, StructureMemberPickerComponent, StructurePickerComponent, TYPES_WITH_AUTOMATIC_OUTPUT, TYPE_BY_COLLECTION, UNSUPPORTED_TYPES, ValueEditorComponent, VersionPanelComponent, allFieldsOf, areTypesComparable, canvasNodeId, checkConditionLogic, checkFlowName, describePathEntry, duplicateField, elementIcon, emptyFlowDefinition, fieldAt, filterReferences, flattenFields, flowNodeWidth, flowNodeWidthClass, insertField, isCustomConditionLogic, isEmptyReferenceFilter, isFieldResource, isGlobalReference, isNumericType, isPathInside, isTypeCheckedOperator, isValidFlowName, isValued, loadPathLevel, matchesReferenceFilter, moveCondition, moveField, navigatePath, outletByKey, outletsOf, parseCanvasNodeId, parseInvariantNumber, parseSourceConnectorId, parseTargetConnectorId, pathAvailableNames, pathContainerLabel, pathKey, pathNotVerifiableMessage, referenceRoot, remapConditionLogic, removeCondition, removeField, resolvePath, samePath, screenFieldNames, severityBucket, slugifyFlowName, sourceConnectorId, stageStepNames, stageStepOutputReferenced, stepsOf, targetConnectorId, uniqueFlowName, valuedFieldOf, valuedFieldsOf, variantFieldOf, variantOf, variantPresetOf };
-export type { FieldAssignmentHolder, FilterHolder, FlowActionCall, FlowAnyNode, FlowAssignment, FlowAssignmentItem, FlowAssignmentOperator, FlowAssignmentOperatorEntry, FlowBuilderHttpConfig, FlowCanvasEdge, FlowCanvasNode, FlowCatalogEntry, FlowCatalogParameter, FlowChoice, FlowCloneRequest, FlowCollectionProcessor, FlowCollectionProcessorType, FlowComparisonOperator, FlowComparisonOperatorEntry, FlowCondition, FlowConditionHolder, FlowConditionLogic, FlowConflictState, FlowConnectionKind, FlowConnector, FlowConnectorTarget, FlowConstant, FlowCreateRequest, FlowCustomError, FlowCustomErrorMessage, FlowCustomProperty, FlowDataType, FlowDataTypeEntry, FlowDecision, FlowDecisionRule, FlowDefinition, FlowDictionaries, FlowDictionaryEntry, FlowDynamicChoiceSet, FlowDynamicScreen, FlowEdge, FlowElementType, FlowElementTypeEntry, FlowEnumValue, FlowErrorCategory, FlowExportQuery, FlowFieldDescription, FlowFieldUsage, FlowFieldValue, FlowFormula, FlowGlobalVariableEntry, FlowInputFieldAssignment, FlowInputParameter, FlowInterviewResult, FlowInterviewStatus, FlowIssueSeverity, FlowLayoutDirection, FlowLayoutNodeInput, FlowLayoutOptions, FlowLayoutResult, FlowListQuery, FlowLoop, FlowNameCheck, FlowNameProblem, FlowNewVersionRequest, FlowNodeBase, FlowNodeCollection, FlowNodeRef, FlowObjectDescription, FlowObjectSummary, FlowOffsetUnit, FlowOrchestratedStage, FlowOutlet, FlowOutline, FlowOutlineConnection, FlowOutlineNode, FlowOutputFieldAssignment, FlowOutputParameter, FlowPalettePick, FlowPendingScreen, FlowProcessType, FlowRecordCreate, FlowRecordDelete, FlowRecordFilter, FlowRecordFilterOperator, FlowRecordLookup, FlowRecordRollback, FlowRecordTriggerType, FlowRecordUpdate, FlowRecordValue, FlowReference, FlowReferenceFilter, FlowReferenceKind, FlowRegionContainerType, FlowResourceCollection, FlowResourceKindEntry, FlowResourceRef, FlowResumeRequest, FlowSaveRequest, FlowSaveResult, FlowSchedule, FlowScheduledPath, FlowScreen, FlowScreenField, FlowScreenFieldInputsRevisited, FlowScreenFieldNode, FlowScreenFieldPath, FlowScreenFieldType, FlowScreenFieldTypeEntry, FlowScreenNavigation, FlowScreenResponseRequest, FlowScreenValidationRule, FlowScriptPluginCall, FlowSeverityBucket, FlowSortOption, FlowSortOrder, FlowStage, FlowStageStep, FlowStageStepActionType, FlowStageStepAssignee, FlowStageStepConditionActionType, FlowStageStepRequest, FlowStageStepState, FlowStageStepStatus, FlowStageStepTypeEntry, FlowStart, FlowStartInterviewRequest, FlowStructureDescribed, FlowStructureDescription, FlowStructureInstance, FlowStructureMember, FlowSubflow, FlowSubflowInputAssignment, FlowSubflowOutputAssignment, FlowSummary, FlowTextTemplate, FlowTraceEntry, FlowTransactionModel, FlowTransform, FlowTransformType, FlowTransformValue, FlowTransformValueAction, FlowTriggerType, FlowTypedEntry, FlowTypedValue, FlowUnsupportedNode, FlowValidationIssue, FlowValidationResult, FlowValue, FlowVariable, FlowVersionStatus, FlowVersionSummary, FlowWait, FlowWaitEvent, NamePickerOption, PaletteGroup, PaletteItem, ParameterHolder, PathCatalog, PathContainer, PathContainerKind, PathEntry, PathLevel, PathLevelStatus, PathNavigation, PathNavigationRequest, PathResolution, PathStopReason, StructureMemberUsage, ValueMode };
+export { ConditionEditorComponent, ConnectorEditorComponent, DebugPanelComponent, DynamicScreenInspectorComponent, ElementDialogComponent, ElementInspectorComponent, ElementPaletteComponent, EnumValuePickerComponent, FALLBACK_COLLECTION_BY_TYPE, FALLBACK_TYPE_LABEL, FLOW_BUILDER_HTTP_CONFIG, FLOW_ELEMENT_ICONS, FLOW_ELEMENT_VARIANT_FIELDS, FLOW_ELEMENT_VARIANT_ICONS, FLOW_ERROR_FALLBACK_MESSAGE, FLOW_ERROR_HTTP_STATUS, FLOW_NAME_PATTERN, FLOW_NODE_COLLECTIONS, FLOW_NODE_HEIGHT, FLOW_NODE_WIDTH, FLOW_RESOURCE_COLLECTIONS, FLOW_VALUE_FIELDS, FLOW_VALUE_LITERAL_FIELDS, FieldAssignmentEditorComponent, FieldPickerComponent, FlowApiError, FlowBuilderApi, FlowBuilderComponent, FlowCanvasComponent, FlowCatalogStore, FlowDictionaryStore, FlowDocumentStore, FlowEditorSession, FlowLayoutService, FlowValidationStore, FormulaEditorComponent, FormulaValidationService, HttpFlowBuilderApi, NamePickerComponent, NodeInspectorBase, ORCHESTRATION_CONDITION_OUTPUT, ObjectPickerComponent, OrchestratedStageInspectorComponent, ParameterEditorComponent, ProblemsPanelComponent, RecordFilterEditorComponent, ReferencePickerComponent, ResourcePanelComponent, SEVERITY_BUCKETS, SEVERITY_ICON, SEVERITY_LABEL, START_NODE_NAME, SelectValueDirective, StartInspectorComponent, StructureMemberPickerComponent, StructurePickerComponent, TYPES_WITH_AUTOMATIC_OUTPUT, TYPE_BY_COLLECTION, UNSUPPORTED_TYPES, ValueEditorComponent, VersionPanelComponent, allFieldsOf, areTypesComparable, canvasNodeId, checkConditionLogic, checkFlowName, describePathEntry, duplicateField, elementIcon, emptyFlowDefinition, fieldAt, filterReferences, flattenFields, flowNodeWidth, flowNodeWidthClass, insertField, isCustomConditionLogic, isEmptyReferenceFilter, isFieldResource, isGlobalReference, isNumericType, isPathInside, isTypeCheckedOperator, isValidFlowName, isValued, loadPathLevel, matchesReferenceFilter, moveCondition, moveField, navigatePath, outletByKey, outletsOf, parseCanvasNodeId, parseInvariantNumber, parseSourceConnectorId, parseTargetConnectorId, pathAvailableNames, pathContainerLabel, pathKey, pathNotVerifiableMessage, referenceRoot, remapConditionLogic, removeCondition, removeField, resolvePath, samePath, screenFieldNames, severityBucket, slugifyFlowName, sourceConnectorId, stageStepNames, stageStepOutputReferenced, stepsOf, targetConnectorId, uniqueFlowName, valuedFieldOf, valuedFieldsOf, variantFieldOf, variantOf, variantPresetOf };
+export type { FieldAssignmentHolder, FilterHolder, FlowActionCall, FlowAnyNode, FlowAssignment, FlowAssignmentItem, FlowAssignmentOperator, FlowAssignmentOperatorEntry, FlowBuilderHttpConfig, FlowCanvasEdge, FlowCanvasNode, FlowCatalogEntry, FlowCatalogParameter, FlowChoice, FlowCloneRequest, FlowCollectionProcessor, FlowCollectionProcessorType, FlowComparisonOperator, FlowComparisonOperatorEntry, FlowCondition, FlowConditionHolder, FlowConditionLogic, FlowConflictState, FlowConnectionKind, FlowConnector, FlowConnectorTarget, FlowConstant, FlowCreateRequest, FlowCustomError, FlowCustomErrorMessage, FlowCustomProperty, FlowDataType, FlowDataTypeEntry, FlowDecision, FlowDecisionRule, FlowDefinition, FlowDictionaries, FlowDictionaryEntry, FlowDynamicChoiceSet, FlowDynamicScreen, FlowEdge, FlowElementType, FlowElementTypeEntry, FlowEnumValue, FlowErrorCategory, FlowExportQuery, FlowFieldDescription, FlowFieldUsage, FlowFieldValue, FlowFormula, FlowFormulaIssue, FlowFormulaUsage, FlowFormulaValidationRequest, FlowFormulaValidationResult, FlowGlobalVariableEntry, FlowInputFieldAssignment, FlowInputParameter, FlowInterviewResult, FlowInterviewStatus, FlowIssueSeverity, FlowLayoutDirection, FlowLayoutNodeInput, FlowLayoutOptions, FlowLayoutResult, FlowListQuery, FlowLoop, FlowNameCheck, FlowNameProblem, FlowNewVersionRequest, FlowNodeBase, FlowNodeCollection, FlowNodeRef, FlowObjectDescription, FlowObjectSummary, FlowOffsetUnit, FlowOrchestratedStage, FlowOutlet, FlowOutline, FlowOutlineConnection, FlowOutlineNode, FlowOutputFieldAssignment, FlowOutputParameter, FlowPalettePick, FlowPendingScreen, FlowProcessType, FlowRecordCreate, FlowRecordDelete, FlowRecordFilter, FlowRecordFilterOperator, FlowRecordLookup, FlowRecordRollback, FlowRecordTriggerType, FlowRecordUpdate, FlowRecordValue, FlowReference, FlowReferenceFilter, FlowReferenceKind, FlowRegionContainerType, FlowResourceCollection, FlowResourceKindEntry, FlowResourceRef, FlowResumeRequest, FlowSaveRequest, FlowSaveResult, FlowSchedule, FlowScheduledPath, FlowScreen, FlowScreenField, FlowScreenFieldInputsRevisited, FlowScreenFieldNode, FlowScreenFieldPath, FlowScreenFieldType, FlowScreenFieldTypeEntry, FlowScreenNavigation, FlowScreenResponseRequest, FlowScreenValidationRule, FlowScriptPluginCall, FlowSeverityBucket, FlowSortOption, FlowSortOrder, FlowStage, FlowStageStep, FlowStageStepActionType, FlowStageStepAssignee, FlowStageStepConditionActionType, FlowStageStepRequest, FlowStageStepState, FlowStageStepStatus, FlowStageStepTypeEntry, FlowStart, FlowStartInterviewRequest, FlowStructureDescribed, FlowStructureDescription, FlowStructureInstance, FlowStructureMember, FlowSubflow, FlowSubflowInputAssignment, FlowSubflowOutputAssignment, FlowSummary, FlowTextTemplate, FlowTraceEntry, FlowTransactionModel, FlowTransform, FlowTransformType, FlowTransformValue, FlowTransformValueAction, FlowTriggerType, FlowTypedEntry, FlowTypedValue, FlowUnsupportedNode, FlowValidationIssue, FlowValidationResult, FlowValue, FlowVariable, FlowVersionStatus, FlowVersionSummary, FlowWait, FlowWaitEvent, NamePickerOption, PaletteGroup, PaletteItem, ParameterHolder, PathCatalog, PathContainer, PathContainerKind, PathEntry, PathLevel, PathLevelStatus, PathNavigation, PathNavigationRequest, PathResolution, PathStopReason, StructureMemberUsage, ValueMode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esfaenza/flow-builder",
-  "version": "20.3.15",
+  "version": "20.3.16",
   "peerDependencies": {
     "@angular/cdk": "^20.2.14",
     "@angular/common": "^20.3.25",

package/styles/flow-builder.css

@@ -250,6 +250,41 @@ f-flow .fb-edge--goto .f-connection-path {
   min-width: 0;
 }
 
+/**
+ * I tre campi di un'assegnazione — destinazione, operazione, valore — su una riga sola.
+ * Incolonnati, una singola operazione era alta mezza dialog e per vederne due si scorreva.
+ *
+ * Il rientro a capo lo decide il flex dalla larghezza disponibile, non una media query: lo
+ * stesso inspector vive nel pannello laterale (420px, dove si incolonna) e nella dialog
+ * (1400px, dove sta in riga), e sul viewport non c'e' modo di distinguerli.
+ */
+.fb-fields-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  column-gap: 8px;
+}
+
+/* Il `margin-bottom` della `.fb-field` fa da distanza fra le righe quando vanno a capo. */
+.fb-fields-row > .fb-field {
+  flex: 1 1 200px;
+  min-width: 0;
+}
+
+/* L'operatore e' un `select` di due parole: puo' stringersi, non deve allargarsi. */
+.fb-fields-row > .fb-field--compact {
+  flex: 0 1 220px;
+}
+
+/*
+ * Il bottone in coda alla riga (rimozione): il margine lo allinea al controllo, non
+ * all'etichetta che gli sta sopra.
+ */
+.fb-fields-row > .fb-fields-row__action {
+  flex: 0 0 auto;
+  margin-top: 17px;
+}
+
 .fb-input,
 .fb-select,
 .fb-textarea {
@@ -506,36 +541,3 @@ f-flow .fb-edge--goto .f-connection-path {
   background: color-mix(in srgb, var(--fb-warning, #b7791f) 8%, transparent);
   font-size: 11px;
 }
-
-/* ------------------------------------------------ trascinamento (CDK) */
-/*
- * L'anteprima del trascinamento e' l'unico pezzo di UI che il CDK sposta **fuori** dal
- * componente: la aggancia a `body` (o al piu' vicino contenitore con overlay), dove il CSS
- * incapsulato dell'inspector non arriva. Senza queste regole il campo trascinato si vede
- * come testo nudo senza sfondo — lo stesso motivo per cui gli archi stanno qui.
- */
-.cdk-drag-preview {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  box-sizing: border-box;
-  padding: 4px 6px;
-  border: 1px solid var(--fb-accent, #4f6ef7);
-  border-radius: var(--fb-radius-xs, 6px);
-  background: var(--fb-surface, #fff);
-  box-shadow: var(--fb-shadow-md, 0 6px 18px rgb(16 24 40 / 10%));
-  font-size: 12px;
-  color: var(--fb-text, #1a1c23);
-}
-
-/* L'anteprima resta essenziale: il tipo e la barra della larghezza sono contorno, e in un
-   riquadro che segue il puntatore rubano l'attenzione al punto di rilascio. */
-.cdk-drag-preview .fb-dyn__type,
-.cdk-drag-preview .fb-dyn__width {
-  display: none;
-}
-
-.cdk-drag-animating,
-.cdk-drop-list-dragging .cdk-drag {
-  transition: transform 180ms cubic-bezier(0, 0, 0.2, 1);
-}