@esfaenza/es-diagrams 12.2.13 → 13.1.3

package/fesm2020/esfaenza-es-diagrams.mjs

@@ -0,0 +1,1391 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, Injectable, Optional, Inject, EventEmitter, Component, ViewChild, Input, Output, NgModule } from '@angular/core';
+import * as cy_ from 'cytoscape';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
+
+/**
+ * Definizione di un comando del Context menù
+ */
+class ContextMenuCommand {
+}
+
+/**
+ * Opzioni che gestiscono il context menu. Quando una di queste opzioni non viene assegnata viene mantenuto il default, assicurarsi quindi di modificare solo
+ * le proprietà che si vogliono effettivamente cambiare rispetto ai default
+ */
+class ContextMenuOptions {
+}
+
+/**
+ *  Opzioni native per l'estensione expand-collapse di cytoscape
+ */
+class ExpandCollapseOptions {
+}
+
+/**
+ * Classe che indica per una data query quali template applicare
+ */
+class NodeHTMLTemplate {
+}
+
+/**
+ * Classe che rappresenta un template HTML applicabile ad un nodo
+ */
+class NodeTemplate {
+}
+
+/**
+ * Classe che rappresenta il template HTML di un nodo da utilizzare per un certo livello di zoom
+ */
+class ZoomLevelBasedTemplate {
+}
+
+/**
+ * Opzioni di layout di base che si collegano al **ready** e allo **stop** eventualmente per aggiungere del log addizionale
+ */
+class BaseLayoutOptionsImpl {
+    /**
+     * Per ora ignoro lato documentale dato che sono placholder
+     * @ignore
+     */
+    ready(e) {
+    }
+    /**
+     * Per ora ignoro lato documentale dato che sono placholder
+     * @ignore
+     */
+    stop(e) {
+    }
+}
+
+/**
+ * Classe base con le opzioni di layout valide per tutti i layout animati
+ */
+class AnimateLayoutOptionsImpl extends BaseLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Livello di zoom da impostare (si consiglia fit = **false** se viene impostato)
+         */
+        this.zoom = null;
+        /**
+         * Livello di pan da impostare (si consiglia fit = **false** se viene impostato)
+         */
+        this.pan = null;
+        /**
+         * Indica se animare il cambio di posizione dei nodi
+         */
+        this.animate = false;
+        /**
+         * Con **animate** a true indica la durata dell'animazione
+         */
+        this.animationDuration = 500;
+        /**
+         * Abilita o no l'easing dell'animazione, può essere una stringa come ad esempio "ease-in-out-cubic" o altre funzioni scritte allo stesso modo prese da https://easings.net/
+         */
+        this.animationEasing = undefined;
+        /**
+         * Funzione che indica se un nodo dev'essere animato o no.
+         * Tutti i nodi sono animati di default.
+         * Tutti i nodi che non vengono animati verranno posizionati appena inizia l'animazione
+         *
+         * @param {any} node Nodo per cui decidere se abilitare l'animazione o no
+         * @param {number} i Indice del nodo corrente
+         *
+         * @returns {boolean} **true** se il nodo dev'essere animato, **false** altrimenti
+         */
+        this.animateFilter = (node, i) => true;
+    }
+}
+
+/**
+ * Classe base per gli algoritmi "Shaped"
+ */
+class ShapedLayoutOptionsImpl extends AnimateLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Indica se adattare al contenitore
+         */
+        this.fit = true;
+        /**
+         * Padding rispetto al contenitore
+         */
+        this.padding = 30;
+        /**
+         * Specifica le dimensioni esatte al cui interno effettuare il layouting, specificato come **{ x1, y1, x2, y2 }** o **{ x1, y1, w, h }**
+         */
+        this.boundingBox = null;
+        /**
+         * Fa in modo che i nodi non si accavallino, ma se il contenitore non ha abbastanza spazio potrebbero andare in overflow
+         */
+        this.avoidOverlap = true;
+        /**
+         * Include o esclude le dimensioni delle label dei nodi nel calcolo delle posizioni
+         */
+        this.nodeDimensionsIncludeLabels = false;
+        /**
+         * Moltiplicatore delle dimensioni per espandere/restringere le dimensioni globali del diagramma
+         */
+        this.spacingFactor = 1;
+        /**
+         * Funzione di ordinamento per ordinare i nodi
+         */
+        this.sort = null;
+        /**
+         * Funzione per la trasformazione delle posizioni dei nodi
+         *
+         * @param {any} node Nodo
+         * @param {any} position Posizione iniziale
+         *
+         * @returns {any} Posizione finale
+         */
+        this.transform = (node, position) => position;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Breadth First
+ */
+class BreadthFirstLayoutOptionsImpl extends ShapedLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'breadthfirst';
+        /**
+         * Indica se l'albero è diretto in basso. Se false i collegamenti fra i nodi possono andare in qualsiasi direzione
+         */
+        this.directed = false;
+        /**
+         * Se **true** i livelli vengono ordinati in cerchi concentrici, se **false** vengono oridnati dall'alto al basso
+         */
+        this.circle = false;
+        /**
+         * Indica che i nodi verranno shiftati in base al proprio livello in modo da evitare collegamenti inversi (solo per i DAG)
+         */
+        this.maximal = false;
+        /**
+         * Indica se creare una griglia in cui ordinare i nodi del DAG (Solo quando la proprietà **circle** è a **false**)
+         */
+        this.grid = false;
+        /**
+         * Indica se escludere le label dei nodi quando vengono calcolati i limiti del layout
+         */
+        this.nodeDimensionsIncludeLabels = false;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Circle
+ */
+class CircleLayoutOptionsImpl extends ShapedLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'circle';
+        /**
+         * Angolo da cui i nodi partono, in radianti (Default: **3 / 2 * Math.PI**)
+         */
+        this.startAngle = 3 / 2 * Math.PI;
+        /**
+         * Numero di radianti fra il primo e l'ultimo nodo. Di default viene utilizzata l'intera circonferenza
+         */
+        this.sweep = null;
+        /**
+         * Indica se andare in senso orario (**true**) o antiorario (**false**)
+         */
+        this.clockwise = true; // whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false)
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Concentric
+ */
+class ConcentricLayoutOptionsImpl {
+    constructor() {
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'concentric';
+        /**
+         * Angolo da cui i nodi partono, in radianti (Default: **3 / 2 * Math.PI**)
+         */
+        this.startAngle = 3 / 2 * Math.PI;
+        /**
+         * Include o esclude le dimensioni delle label dei nodi nel calcolo delle posizioni
+         */
+        this.nodeDimensionsIncludeLabels = true;
+        /**
+         * Indica se i livelli devono essere o non essere equidistanti, potrebbe causare overflow dal contenitore
+         */
+        this.equidistant = false;
+        /**
+         * Distanza minima dall'esterno dei nodi, utilizzato per aggiustare il raggio
+         */
+        this.minNodeSpacingnumber = 10;
+        /**
+         * Specifica le dimensioni esatte al cui interno effettuare il layouting, specificato come **{ x1, y1, x2, y2 }** o **{ x1, y1, w, h }**
+         */
+        this.boundingBox = null;
+        /**
+         * Altezza dell'area di layout (sovrascrive quella del contenitore)
+         */
+        this.height = null;
+        /**
+         * Larghezza dell'area di layout (sovrascrive quella del contenitore)
+         */
+        this.width = null;
+        /**
+         * Moltiplicatore delle dimensioni per espandere/restringere le dimensioni globali del diagramma
+         */
+        this.spacingFactor = 1;
+    }
+    /**
+     * Funzione di cui si può fare override per assegnare un valore ad ogni nodo. I nodi con valore più alto saranno piazzati verso il centro
+     *
+     * @param {any} node Nodo
+     *
+     * @returns {number} Valore su cui ordinare i nodi verso il centro
+     */
+    concentric(node) {
+        return node.degree();
+    }
+    /**
+     * Funzione di cui si può fare override per calcolare la variazione dei valori concentrici per ogni livello
+     *
+     * @param {any} nodes Gruppo di nodi del livello
+     *
+     * @returns {number} Variazione dei valori concentrici
+     */
+    levelWidth(nodes) {
+        return nodes.maxDegree() / 4;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Cose
+ */
+class CoseLayoutOptionsImpl extends ShapedLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'cose';
+        /**
+         * Se **animate** è **true**, l'animazione parte solo dopo questo numero di millisecondi (Evita flickering su animazioni veloci)
+         */
+        this.animationThreshold = 250;
+        /**
+         * Numero di iterazioni fra aggiornamenti consecutivi della posizione a schermo
+         */
+        this.refresh = 20;
+        /**
+         * Se **true** la posizione iniziale dei nodi è casuale, se **false** utilizza la posizione originale
+         */
+        this.randomize = false;
+        /**
+         * Spazio extra fra i componenti di un grafo non-compound
+         */
+        this.componentSpacing = 40;
+        /**
+         * Moltiplicatore della repulsione fra nodi in caso di overlap
+         */
+        this.nodeOverlap = 4;
+        /**
+         * Moltiplicatore di nesting per il calcolo della lunghezza ideale dei collegamenti nested
+         */
+        this.nestingFactor = 1.2;
+        /**
+         * Costante di gravità
+         */
+        this.gravity = 1;
+        /**
+         * Numero massimo di iterazioni da eseguire
+         */
+        this.numIter = 1000;
+        /**
+         * Temperatura iniziale (massima distanza fra i nodi)
+         */
+        this.initialTemp = 1000;
+        /**
+         * Fattore di raffreddamento. Ad ogni iterazione verrà sottratto ad **initialTemp**
+         */
+        this.coolingFactor = 0.99;
+        /**
+         * Soglia minima di temperatura. Una volta raggiunta il layout si considera terminato
+         */
+        this.minTemp = 1.0;
+        /**
+         * Moltiplicatore della repulsione fra nodi in caso di assenza di overlap. Funzione overrideabile per ogni node
+         *
+         * @param {any} node Nodo
+         *
+         * @returns {number} Moltiplicazione di repulsione
+         */
+        this.nodeRepulsion = (node) => 2048;
+        /**
+         * Lunghezza ideale dei collegamenti non nested. Funzione overrideabile per ogni collegamento
+         *
+         * @param {any} edge Collegamento
+         *
+         * @returns {number} Lunghezza ideale
+         */
+        this.idealEdgeLength = (edge) => 32;
+        /**
+         * Divisore per calcolare le forze applicate ad un collegamento. Funzione overrideabile per ogni collegamento
+         *
+         * @param {any} edge Collegamento
+         *
+         * @returns {number} Indice di elasticità
+         */
+        this.edgeElasticity = (edge) => 32;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Dagre
+ */
+class DagreLayoutOptionsImpl extends ShapedLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'dagre';
+        /**
+         * Distanza fra nodi adiacenti dello stesso rango
+         */
+        this.nodeSep = null;
+        /**
+         * Distanza fra collegamenti adiacenti nello stesso rango
+         */
+        this.edgeSep = null;
+        /**
+         * Distanza fra ogni rango
+         */
+        this.rankSep = null;
+        // TB for top to bottom flow, 'LR' for left to right
+        /**
+         * Direzione di disegno: LR = Sinistra a Destra, TB = Sopra a Sotto
+         */
+        this.rankDir = 'TB';
+        /**
+         * Algoritmo che si occupa di assegnare un rango ad ogni nodo
+         */
+        this.ranker = null;
+        /**
+         * Numero di ranghi fra la sorgente e la destinazione di un collegamento
+         *
+         * @param {any} edge Collegamento di cui calcolare la differenza di rango
+         *
+         * @returns {number} Differenza di rango
+         */
+        this.minLen = (edge) => 1;
+        /**
+         * Peso del collegamento, più è alto più generalmente risulterà corto
+         *
+         * @param {any} edge Collegamento di cui calcolare il peso
+         *
+         * @returns {number} Peso
+         */
+        this.edgeWeight = (edge) => 1;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Grid
+ */
+class GridLayoutOptionsImpl extends ShapedLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'grid';
+        /**
+         * Spazio extra attorno ai nodi quando **avoidOverlap** è **true**
+         */
+        this.avoidOverlapPadding = 10;
+        /**
+         * Se **true** cerca di utilizzare il minor spazio possibile, se **false** usa tutto lo spazio che ha a disposizione
+         */
+        this.condense = false;
+        /**
+         * Forzatura del numero di righe della griglia
+         */
+        this.rows = null;
+        /**
+         * Forzatura del numero di colonne della griglia
+         */
+        this.cols = null;
+        /**
+         * Dato un nodo restituisce un indice di riga e di colonna della griglia in cui metterlo
+         *
+         * @param {NodeSingular} node Nodo
+         * @returns {{ row: number, col: number }} Oggetto che identifica una posizione della griglia
+         */
+        this.position = null;
+    }
+}
+
+/**
+ * Pseudo implementazione di un algoritmo vuoto che non fa nulla
+ */
+class NullLayoutOptionsImpl extends BaseLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'null';
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Preset (Posiziona i nodi in base alla loro proprietà **position**)
+ */
+class PresetLayoutOptionsImpl extends AnimateLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'preset';
+        /**
+         * Funzione per la trasformazione delle posizioni dei nodi
+         *
+         * @param {any} node Nodo
+         * @param {any} position Posizione iniziale
+         *
+         * @returns {any} Posizione finale
+         */
+        this.transform = (node, position) => position;
+    }
+}
+
+/**
+ * Default per l'implementazione dell'algoritmo Random
+ */
+class RandomLayoutOptionsImpl extends AnimateLayoutOptionsImpl {
+    /** @ignore */
+    constructor() {
+        super();
+        /**
+         * Nome dell'algoritmo di layouting
+         */
+        this.name = 'random';
+        /**
+         * Indica se adattare al contenitore
+         */
+        this.fit = true;
+        /**
+         * Padding rispetto al contenitore
+         */
+        this.padding = 20;
+        /**
+         * Specifica le dimensioni esatte al cui interno effettuare il layouting, specificato come **{ x1, y1, x2, y2 }** o **{ x1, y1, w, h }**
+         */
+        this.boundingBox = null;
+        /**
+         * Funzione per la trasformazione delle posizioni dei nodi
+         *
+         * @param {any} node Nodo
+         * @param {any} position Posizione iniziale
+         *
+         * @returns {any} Posizione finale
+         */
+        this.transform = (node, position) => position;
+    }
+}
+
+/**
+ * Classe di configurazione per il Modulo
+ */
+class EsDiagramModuleConfig {
+}
+
+// Grabbata felicemente da amcharts, rimuovendo helper interni, cose strane e instupidendola un po':
+// https://github.com/amcharts/amcharts4/blob/7fbb61e90363a2373e6130800dee06b8a62f3aab/src/.internal/core/utils/ResizeSensor.ts
+/**
+ * Classe di utilità che tiene d'occhio i cambiamenti di dimensione di un elemento. Un **ResizeSensor** può controllare al massimo un elemento
+ */
+class ResizeSensor {
+    /**
+     * Costruttore
+     *
+     * @param {HTMLElement} element Elemento HTML da controllare
+     * @param {Function} callback Callback da chiamare quando le dimensioni di **element** cambiano
+     */
+    constructor(element, callback) {
+        /**
+         * Riferimento all'observer nativo
+         */
+        this.observer = null;
+        /**
+         * Indica se questo oggetto è stato distrutto o no
+         */
+        this.Disposed = false;
+        /**
+         * Elemento da controllare e callback da chiamare quando le dimensioni dell'elemento cambiano
+         */
+        this.target = null;
+        this.makeSensor();
+        this.addTarget(element, callback);
+    }
+    /**
+     * Distruttore
+     */
+    dispose() {
+        if (!this.Disposed) {
+            this.Disposed = true;
+            this.removeTarget();
+        }
+    }
+    /**
+     * Creazione del sensore che sarà collegato all'elemento da osservare dal metodo **addTarget**
+     */
+    makeSensor() {
+        if (typeof ResizeObserver == "undefined")
+            throw "Resize Observer non è definito. Si prega di utilizzare un browser vero";
+        this.observer = new ResizeObserver((entries) => {
+            for (let i = 0; i < entries.length; ++i) {
+                if (this.target && this.target.targetEl === entries[i].target)
+                    this.target.callback();
+            }
+        });
+    }
+    /**
+     * Dice al sensore di osservare l'elemento **targetEl**, richiamando **callback** qualora le dimensioni cambino
+     *
+     * @param {HTMLElement} targetEl Elemento HTML da controllare
+     * @param {Function} callback Callback da chiamare quando le dimensioni di **element** cambiano
+     */
+    addTarget(targetEl, callback) {
+        this.observer.observe(targetEl, { box: "content-box" });
+        this.target = { targetEl, callback };
+    }
+    /**
+     * Rimuove l'elemento HTML attuale dall'osservazione del **ResizeObserver**
+     */
+    removeTarget() {
+        if (!this.target)
+            return;
+        this.observer.unobserve(this.target.targetEl);
+        this.target = null;
+    }
+}
+
+/**
+ * Token che indica la lingua da utilizzare, sono supportate "it-IT" ed "en-US"
+ */
+const DIA_LOCALE = new InjectionToken('DIA_LOCALE');
+/**
+ * Token che indica se attivare la modalità di debug (messaggi a console)
+ */
+const DIA_DEBUG_MODE = new InjectionToken('DIA_DEBUG_MODE');
+
+/**
+ * Oggetto statico di localizzazione per i messaggi
+ */
+const Loc = {
+    "Module": { "en-US": "Module", "it-IT": "Il Modulo" },
+    "Received an undefined module. Make sure you are correctly loading it": { "en-US": "Received an undefined module. Make sure you are correctly loading it", "it-IT": "Ricevuto modulo non definito. Assicurati di caricarlo correttamente" },
+    "Module not available. Loading it now": { "en-US": "Module not available. Loading it now", "it-IT": "Modulo non disponibile. Lo carico ora" },
+    "Module already loaded": { "en-US": "Module already loaded", "it-IT": "Modulo già caricato" },
+    "Diagram container size has changed, redrawing": { "en-US": "Diagram container size has changed, redrawing", "it-IT": "La dimensione del contenitore del diagramma è cambiata, ridisegno" },
+    "Module cannot be loaded": { "en-US": "Module cannot be loaded", "it-IT": "Impossibile caricare il modulo" },
+    "Redraw based on dynamic Input change is supported only for 'Elements' and 'Layout' inputs, please destroy the component and recreate it with the new settings": { "en-US": "Redraw based on dynamic Input change is supported only for 'Elements' and 'Layout' inputs, please destroy the component and recreate it with the new settings", "it-IT": "Il cambio e aggiornamento dinamico degli Input è supportato solo per gli Input 'Elements' e 'Layout', distruggi il componente e ricrealo con le nuove impostazioni", },
+    "is loaded and managed directly by this library. You don't need to import it or use it directly, just be sure to set the relative options": { "en-US": "is loaded and managed directly by this library. You don't need to import it or use it directly, just be sure to set the relative options", "it-IT": "viene caricato e gestito nativamente dalla libreria. Non c'è bisogno di reimportarlo, né di configurarlo (usare le opzioni specifiche)" },
+    "If you don't specify a source and a target for an edge you have to write its id in the format {source}-{target}": { "en-US": "If you don't specify a source and a target for an edge you have to write its id in the format {source}-{target}", "it-IT": "Se non è specificata una sorgente e una destinazione per il collegamento è opportuno scriverne l'id nel formato {sorgente}-{destinazione}" },
+    "Elements have been changed after diagram initialization": { "en-US": "Elements have been changed after diagram initialization", "it-IT": "Rilevato un cambio di Elementi dopo l'inizializzazione del Diagramma" },
+    "Layout have been changed after diagram initialization": { "en-US": "Layout have been changed after diagram initialization", "it-IT": "Rilevato un cambio di Layout dopo l'inizializzazione del Diagramma" },
+    "Cannot update NodeHTMLTemplates as they don't seem to be used": { "en-US": "Cannot update NodeHTMLTemplates as they don't seem to be used", "it-IT": "Impossibile aggiornare i NodeHTMLTemplates dato che non sembra siano utilizzati" }
+};
+
+/** @ignore */ const cytoscape$1 = cy_;
+/**
+ * Loader dei moduli di Cytoscape. Utilizza una cache per tenerseli in memoria a livello di applicazione
+ * in modo da non dover ricaricare nulla dopo avere usato un modulo almeno una volta
+ */
+class EsDiagramService {
+    /**
+     * Costruttore
+     *
+     * @ignore
+     */
+    constructor(DIA_LOCALE, DIA_DEBUG_MODE) {
+        this.DIA_LOCALE = DIA_LOCALE;
+        this.DIA_DEBUG_MODE = DIA_DEBUG_MODE;
+        /**
+         * Cache dei moduli caricati
+         */
+        this.modulesCache = {};
+    }
+    /**
+     * Permette di importare, se serve un dato tema o localizzazione
+     *
+     * @param {'cytoscape-expand-collapse' | 'cytoscape-cxtmenu' | 'cytoscape-html-node' | 'cytoscape-dagre'} moduleId Nome del modulo di Cytoscape da importare (dev'essere il nome della cartella in node_modules)
+     *
+     * @returns {Promise<void | cytoscape.Ext>} Funzione di estensione per Cytoscape presa dal modulo richiesto
+     */
+    async importIfNeeded(moduleId) {
+        // Ognuno esporta il modulo un po' come cazzo gli pare quindi ocio. 
+        // Notare che tutti i "moudle" dopo lo then sono castati ad <any> e che l'oggetto recuperato ogni tanto è "default", altre volte è il "register", altre è l'"ext", eccetera...
+        if (!this.modulesCache[moduleId]) {
+            this.log("I", this.loc("Module not available. Loading it now") + ": " + moduleId, false);
+            switch (moduleId) {
+                case "cytoscape-cxtmenu": return import('cytoscape-cxtmenu').then((module) => this.modulesCache[moduleId] = module.default).catch(err => this.handleError(moduleId, err));
+                case "cytoscape-expand-collapse": return import('cytoscape-expand-collapse').then((module) => this.modulesCache[moduleId] = module.default).catch(err => this.handleError(moduleId, err));
+                case "cytoscape-html-node": return import('@esfaenza/cytoscape-html-node').then((module) => this.modulesCache[moduleId] = module.register).catch(err => this.handleError(moduleId, err));
+                case "cytoscape-dagre":
+                    await import('dagre').catch(err => this.handleError("dagre", err));
+                    return import('cytoscape-dagre').then((module) => this.modulesCache[moduleId] = module.default).catch(err => this.handleError(moduleId, err));
+            }
+        }
+        else {
+            // I moduli non devono mai essere ricaricati nel globale, quindi invece che restituire la copia della cache restituisco vuoto
+            this.log("I", this.loc("Module already loaded") + ": " + moduleId, false);
+            return new Promise((resolve) => { resolve(null); });
+        }
+    }
+    /**
+     * Gestione degli errori di caricamento dei moduli qualora qualcuno utilizzasse un modulo non installato
+     *
+     * @param {string} moduleId Nome del modulo che si è cercato di caricare
+     * @param {any} err Errore restituito dalla promise di caricamento
+     */
+    handleError(moduleId, err) {
+        this.log("E", this.loc("Module cannot be loaded") + ": " + moduleId + " - " + err, false);
+    }
+    /**
+     * Scrittore di log a console. Attivo solo quando la libreria è in modalità di Debug
+     *
+     * @param {'E' | 'I' | 'W'} severity Tipo di messaggio (Errore, Info, Warning)
+     * @param {string} text Testo da tradurre
+     * @param {boolean} requiresTranslation Indica se **text** è una frase già tradotta o se è da tradurre
+     */
+    log(severity, text, requiresTranslation = true) {
+        if (!this.DIA_DEBUG_MODE)
+            return;
+        var message = "@esfaenza/diagrams: " + (requiresTranslation ? this.loc(text) : text);
+        switch (severity) {
+            case 'E':
+                console.error(message);
+                break;
+            case 'I':
+                console.info(message);
+                break;
+            case 'W':
+                console.warn(message);
+                break;
+        }
+    }
+    /**
+     * Metodo di localizzazione dei messaggi
+     *
+     * @param {string} text Messaggio da tradurre
+     *
+     * @returns {string} Messaggio tradotto
+     */
+    loc(text) {
+        return Loc[text][this.DIA_LOCALE];
+    }
+}
+EsDiagramService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramService, deps: [{ token: DIA_LOCALE, optional: true }, { token: DIA_DEBUG_MODE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+EsDiagramService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [DIA_LOCALE]
+                }] }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [DIA_DEBUG_MODE]
+                }] }]; } });
+
+/**
+ * Classe che si occupa del dispatch delle operazioni di rendering degli oggetti utilizzando una coda
+ */
+class EsDiagramDispatcher {
+    /**
+     * @ignore
+     */
+    constructor(logs) {
+        this.logs = logs;
+        /**
+         * Coda di inizializzazioni ancora da eseguire. Quando questa è vuota significa che nessuno sta creando oggetti
+         */
+        this.Initializations = [];
+        /**
+         * Lista degli oggetti inizializzati e attivi in un dato momento (viene registrata la proprietà **name**). Non è possibile registrare due grafici con lo stesso identificativo
+         */
+        this.Initialized = [];
+    }
+    /**
+     * Registra un oggetto da visualizzare insieme alla propria funzione di creazione. Quest'ultima sarà differita fino a che tutti gli oggetti
+     * precedentemente registati non hanno finito la fase di inizializzazione
+     *
+     * @param {string} name Identificativo dell'oggetto da registrare
+     * @param {Function} creationFunction Funzione che fisicamente dovrà occuparsi della creazione dell'oggetto
+     */
+    register(name, creationFunction) {
+        if (this.Initialized.indexOf(name) != -1)
+            throw "Attempting to register a duplicate object '" + name + "'. Make sure the 'name' properties of your diagram are univoque";
+        this.log("DISPATCHER: Registering diagram creation function execution for " + name);
+        this.Initializations.push({ name: name, function: creationFunction });
+        if (this.Initializations.length == 1) {
+            this.log("DISPATCHER: Initial drain started");
+            this.drainInitQueues();
+        }
+    }
+    /**
+     * Deregistra un oggetto presente. Chiamata generalmente al dispose dell'oggetto in questione quando non dev'essere più mostrato nella pagina corrente
+     *
+     * @param {string} name Identificativo dell'oggetto da deregistrare
+     */
+    deregister(name) {
+        let index = this.Initialized.indexOf(name);
+        if (index == -1) {
+            //Questo succede quando si cerca di distruggere l'oggetto mentre sta venendo graficato
+            this.log("DISPATCHER: Registration missing for object " + name + " it was probably destroyed during load");
+            return;
+        }
+        this.log("DISPATCHER: Object deregistered " + name);
+        this.Initialized.splice(index, 1);
+    }
+    /**
+     * Metodo che esegue in maniera sequenziale le funzioni di inizializzazione degli oggetti finché presenti
+     * in modo che nessun oggetto possa essere inizializzato contemporaneamente ad un altro
+     */
+    drainInitQueues() {
+        let toExecute = this.Initializations[0];
+        this.log("DISPATCHER: Executing initialization function for object " + toExecute.name);
+        toExecute.function().then(() => {
+            this.log("DISPATCHER: initialization for object " + toExecute.name + " is done");
+            this.Initialized.push(toExecute.name);
+            this.Initializations.splice(0, 1);
+            if (this.Initializations.length >= 1) {
+                this.log("DISPATCHER: Found queued initializations. Continuing");
+                this.drainInitQueues();
+            }
+            else
+                this.log("DISPATCHER: queue is over, nothing more to do");
+        });
+    }
+    /**
+     * @ignore
+     */
+    log(text) {
+        if (this.logs)
+            console.log("@esfaenza/es-diagrams: " + text);
+    }
+}
+EsDiagramDispatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramDispatcher, deps: [{ token: DIA_DEBUG_MODE }], target: i0.ɵɵFactoryTarget.Injectable });
+EsDiagramDispatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramDispatcher });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramDispatcher, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [DIA_DEBUG_MODE]
+                }] }]; } });
+
+/**
+ * Classe che fornisce metodi reattivi di estensione. Per ora implementato solo uno pseudo-throttle
+ */
+class ReactiveExtensions {
+    constructor() {
+        /**
+         * Cache di tutti i timer in esecuzione
+         */
+        this.executionTimers = {};
+    }
+    /**
+     * Esecuzione deleyata di una funzione. Se viene richiamata nuovamente prima di venire eseguita dopo il delay, il delay viene resettato
+     *
+     * @param {string} id Id per aiutare il servizio a distinguere funzioni con nome uguale chiamate da componenti diversi
+     * @param {Function} func Funzione da chiamare al termine del throttle
+     * @param {number} throttleTime Tempo di throttling in millisecondi
+     */
+    throttle(id, func, throttleTime = 0) {
+        let key = func.name + "_" + id;
+        //Se ho la funzione che vuole eseguire ripulisco quel timeout
+        if (this.executionTimers[key])
+            clearTimeout(this.executionTimers[key]);
+        //Ricreo il timeout per eseguire quella funzione dopo throttleTime millisecondi
+        var executionTimer = setTimeout(() => { func(); this.executionTimers[key] = null; }, throttleTime);
+        this.executionTimers[key] = executionTimer;
+    }
+}
+ReactiveExtensions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ReactiveExtensions, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ReactiveExtensions.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ReactiveExtensions, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ReactiveExtensions, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+/** @ignore */ const cytoscape = cy_;
+/**
+ * Componente che si occupa di graficare un diagramma e di gestirne il ciclo di vita
+ */
+class EsDiagramComponent {
+    /**
+     * Costruttore
+     *
+     * @ignore
+     */
+    constructor(service, dispatcher, exts) {
+        this.service = service;
+        this.dispatcher = dispatcher;
+        this.exts = exts;
+        /**
+         * Nome del diagramma, fondamentale assegnarlo per permettere alla libreria di schedularne la creazione
+         */
+        this.name = "";
+        /**
+         * Indica se utilizzare il menù contestuale a ruota attorno ad ogni nodo
+         */
+        this.UseContextMenu = false;
+        /**
+         * Dice al componente se il diagramma deve utilizzare il sistema di estensione per l'expand e collapse dei gruppi
+         */
+        this.UseExpandCollapse = false;
+        /**
+         * Blocco completo delle opzioni, alternativo all'assegnazione di **Elements**, **NodeStyles**, **EdgeStyles**, e **Layout**.
+         *
+         * Qualora entrambe venissero specificate verrà effettuata un'unione fra queste opzioni e quelle specificate, dando priorità alle specificate
+         */
+        this.NativeOptions = {};
+        /**
+         * Aggiorna automaticamente le dimensioni del diagramma quando cambiano le dimensioni della finestra
+         */
+        this.AutoupdateSize = true;
+        /**
+         * Indica di mantenere la posizione dei nodi qualora venissero cambiati dall'Input **Elements**.
+         *
+         * Se l'ID di un nodo è uguale all'ID di un nodo presente in precedenza, il nuovo nodo ne erediterà la posizione
+         */
+        this.PreserveElementsPosition = true;
+        /**
+         * Qualora venisse modificato l'Input **Elements**, piuttosto che mettere semplicemente il nuovo Elemento in base al Layout precedente, applica anche un'animazione
+         *
+         * Funziona solamente se il **Layout** corrente del diagramma supporta le animazioni
+         */
+        this.AnimateLayoutChanges = true;
+        /**
+         * Attiva una modalità di selezione "smart"... o perlomeno "smarter" del default di Cytoscape.
+         *
+         * - Il click di un elemento non selezionato lo seleziona
+         * - Il click di un elemento selezionato lo deseleziona
+         * - Lo stato di selezione viene persistito sull'oggetto originale invece di rimanere in un internal
+         * - All'assegnazione di oggetti selezionati, questi vengono marcati correttamente con l'overlay di selezione
+         *
+         * N.B: la chiamata all'evento **onNodeClick** avviene **DOPO** la gestione della selezione
+         */
+        this.SmartSelection = false;
+        /**
+         * CSS per la graficazione della selezione dei nodi. Quando un nodo verrà selezionato avrà sopra di se un overlay che 'sborda' di **overlay-padding** pixel,
+         * di colore **overlay-color** e con un opacità **overlay-opacity**
+         *
+         * Assegnando "{}" a questo input, la Smart selection viene gestita ma la gestione grafica è affidata all'utente,
+         * ad esempio usando dei **NodeHTMLTemplates** che definiscano selettori su nodi ":selected"
+         *
+         * @default {'overlay-color':'blue','overlay-opacity':0.5,'overlay-padding':7}
+         */
+        this.SmartSelectionStyles = null;
+        /**
+         * Periodo di throttle da quando viene effettuato un resize a quando ricalcolare le dimensioni del diagramma.
+         *
+         * Può essere tenuto a 0 (redraw istantaneo) finché non ci sono problemi di prestazioni con eventualmente tanti resize a poca distanza l'uno dall'altro.
+         */
+        this.ResizeThrottleTime = 0;
+        /**
+         * Fornisce il global della libreria (namespace **cytoscape**) e si aspetta che dopo operazioni di importazione
+         * lasciate all'utente vengano aggiunti tutti i moduli desiderati.
+         *
+         * È **fondamentale** che il primo parametro (il nome del modulo) sia uguale a ciò di cui viene fatto il require in modo che la libreria
+         * possa controllare che il modulo importato non sia già stato importato in precedenza
+         *
+         * ## Esempio:
+         *
+         * ```typescript
+         * (global) => {
+         *    return import("cytoscape-extension-library").then(module => global.use("cytoscape-extension-library", module.default));
+         *
+         *    ...
+         * }
+         * ```
+         */
+        this.ExtensionModulesImporter = null;
+        /**
+         * Fornisce l'istanza attuale di Cytoscape da cui è possibile prendere le librerie di estensione caricate in **ExtensionModulesImporter**
+         * e configurarle in base ai comportamenti specifici
+         *
+         * ## Esempio:
+         *
+         * ```typescript
+         * (cytoscapeCore) => {
+         *    // Fare questo lavoro per ogni estensione caricata
+         *    let extensionConfiguration = { ... };
+         *    let extensionInstance = cytoscapeCore.extensionLibrary(extensionConfiguration);
+         *    extensionInstance.doSomethingSpecificToThisExtension();
+         *
+         *    ...
+         * }
+         * ```
+         */
+        this.ExtensionModulesApplyer = null;
+        /**
+         * Evento lanciato al click di un nodo, contiene l'oggetto **data** del nodo in questione
+         */
+        this.onNodeClick = new EventEmitter();
+        /**
+         * Evento lanciato alla selezione o deselezione di un nodo, contiene l'oggetto **data** del nodo in questione e informazioni sul suo stato di selezione
+         */
+        this.onNodeSelection = new EventEmitter();
+        /**
+         * Evento lanciato al termine del Layouting. Se si vuole eseguire codice dopo che il Layout è fatto e completamente graficato, questo è il punto
+         */
+        this.onLayoutDone = new EventEmitter();
+        /**
+         * Evento lanciato al termine del caricamento del diagramma
+         */
+        this.onLoaded = new EventEmitter();
+        /**
+         * Indica se il rendering del diagramma è terminato
+         */
+        this.Rendered = false;
+        /**
+         * Api dell'estensione expand-collapse per permettere di effettuare operazioni dall'esterno del diagramma. Vengono valorizzate se **UseExpandCollapse** è **true**
+         */
+        this.ExpandCollapseApi = null;
+        /**
+         * Api dell'estensione html-node per permettere di effettuare operazioni dall'esterno del diagramma. Vengono valorizzate se sono impostati dei **NodeHTMLTemplates**
+         */
+        this.HtmlNodeApi = null;
+    }
+    /**
+     * @ignore
+     *
+     * Angular Pipeline
+     */
+    ngAfterViewInit() {
+        if (!this.service || !this.dispatcher)
+            throw "Il modulo @esfaenza/diagrams non è stato importato con il forRoot();";
+        this.dispatchLoadChart();
+    }
+    /**
+     * All'onDestroy ripulisco la memoria dal diagramma
+     */
+    ngOnDestroy() {
+        this.resizeObserver.dispose();
+        this.resizeObserver = null;
+        if (this.cy) {
+            this.service.log("I", "Diagram" + " " + this.name + ": Unloading destroyed diagram", false);
+            this.cy.destroy();
+            this.dispatcher.deregister(this.name);
+        }
+        else
+            this.service.log("I", "Chart " + this.name + ": Unloading uncreated chart component. It probably was a duplicated", false);
+    }
+    /**
+     * Registra il diagramma attuale nel Dispatcher in modo che venga caricato appena possibile
+     */
+    dispatchLoadChart() {
+        this.dispatcher.register(this.name, () => { return this.render(); });
+    }
+    /**
+     * @ignore
+     *
+     * Angular Pipeline: Gestione ri-graficazione del diagramma, se possibile
+     */
+    ngOnChanges(changes) {
+        let toCheck = ["Templates", "UseContextMenu", "ContextMenuOptions", "UseExpandCollapse", "ExpandCollapseOptions", "NodeStyles", "EdgeStyles", "NativeOptions"];
+        if (this.Rendered && toCheck.some(t => changes[t]))
+            this.service.log("W", "Redraw based on dynamic Input change is supported only for 'Elements' and 'Layout' inputs, please destroy the component and recreate it with the new settings");
+        let elementChanges = changes["Elements"];
+        let layoutChanges = changes["Layout"];
+        if (elementChanges && !elementChanges.firstChange) {
+            this.service.log("I", "Elements have been changed after diagram initialization");
+            // Cambiamento agli Elementi: ripulisco gli elementi vecchi, prendo i nuovi, li sistemo e li riassegno. 
+            // Se il nuovo Input Elements è roba strana mi limito a ripulire il diagramma
+            // Se cytoscape aveva già degli elementi precedentemente ne prendo le posizioni in modo da ridisegnarli partendo dallo stesso punto (carino per le animazioni)
+            let elements = elementChanges?.currentValue;
+            let previous_elements = this.PreserveElementsPosition ? this.cy.nodes() : null;
+            this.cy.elements().remove();
+            if (elements && elements.length && elements.length > 0) {
+                this.reviewCytoscapeElements(elements, previous_elements);
+                this.cy.add(elements);
+                if (this.SmartSelection)
+                    this.setupElementsSelectionIfNeeded();
+                // Se solo gli elementi cambiano, riapplico il Layout precedente
+                if (!layoutChanges && this.LastLayout) {
+                    // Se devo animare le modifche al layout forzo il parametro relativo
+                    if (this.AnimateLayoutChanges)
+                        this.LastLayout.animate = true;
+                    this.cy.layout(this.LastLayout).run();
+                }
+            }
+        }
+        // Se il layout cambia lo applico e me lo salvo come layout precedente per il futuro
+        if (layoutChanges && !layoutChanges.firstChange) {
+            this.service.log("I", "Layout have been changed after diagram initialization");
+            this.LastLayout = JSON.parse(JSON.stringify(layoutChanges.currentValue));
+            this.cy.layout(this.LastLayout).run();
+        }
+    }
+    /**
+     * Effettua il rendering del diagramma
+     */
+    async render() {
+        // Tiro fuori le opzioni con cui generare il diagramma
+        let cyOptions = this.getCompletedOptions();
+        this.NodesHierarchy = cyOptions.elements && cyOptions.elements.some(t => t.data.parent);
+        // Carico eventuali classi di estensione che servono
+        await this.performModulesLoading();
+        // Genero il diagramma
+        this.cy = cytoscape(cyOptions);
+        // Collego gli eventi al componente
+        this.bindCytoscapeEvents();
+        // Utilizzo le classi di estensione caricate precedentemente per fare il resto delle mie operazioni
+        this.performOperationsWithLoadedModules();
+        // Imposto la variabile Rendered a true in modo che se da adesso vengono fatte modifiche che dovrebbero causare un redraw posso accorgermene
+        // e mandare a cagare lo stronzo di turno
+        this.Rendered = true;
+        // Se devo aggiornare in automatico in base alla dimensione del contenitore collego il ResizeObserver
+        if (this.AutoupdateSize)
+            this.listenOnChanges();
+        if (this.SmartSelection) {
+            this.setupSelectionStyles();
+            this.setupElementsSelectionIfNeeded();
+        }
+        this.onLoaded.emit();
+    }
+    /**
+     * Prende tutti gli elementi appena assegnati, e se qualcuno era selezionato la situazione viene persistita su cytoscape
+     */
+    setupElementsSelectionIfNeeded() {
+        for (let i = 0; i < this.Elements.length; i++) {
+            let eldata = this.Elements[i].data;
+            if (eldata.__selected) {
+                let el = this.cy.$id(eldata.id);
+                el.select();
+            }
+        }
+    }
+    /**
+     * Carica gli stili per mostrare carina la selezione dei nodi
+     */
+    setupSelectionStyles() {
+        let cssItem = this.SmartSelectionStyles || {
+            'overlay-color': 'blue',
+            'overlay-opacity': 0.5,
+            'overlay-padding': 7
+        };
+        // Backdoor per poter assegnare "{}" a SmartSelectionStyles in modo di utilizzare la smart selection ma senza che nessuno stile venga applicato
+        // ad esempio qualora si volesse utilizzare l'htmlnode per gestire la grafica degli elementi selezionati
+        if (cssItem['overlay-color'] && cssItem['overlay-opacity'] && cssItem['overlay-padding'])
+            this.cy.style().selector('node:selected').css(cssItem);
+    }
+    /**
+     * Registra l'ascolto al contenitore del grafico e in caso di modifiche alla dimensione, al massimo una volta ogni 500 millisecondi, lo ridisegna
+     */
+    listenOnChanges() {
+        this.resizeObserver = new ResizeSensor(this.cyGraph.nativeElement, () => {
+            this.exts.throttle(this.name, this.onContainerSizeChanged.bind(this), this.ResizeThrottleTime);
+        });
+    }
+    /**
+     * Funzione che si occupa di gestire il repaint del diagramma
+     */
+    onContainerSizeChanged() {
+        this.service.log("I", "Diagram container size has changed, redrawing");
+        this.cy.resize();
+        this.cy.fit();
+    }
+    /**
+     * Collega tutti gli eventi che mi possono servire e li espone in output
+     */
+    bindCytoscapeEvents() {
+        this.cy.bind('click', 'node', (event) => {
+            let targetData = event.target.data();
+            if (this.SmartSelection) {
+                let id = targetData.id;
+                let el = this.cy.$id(id);
+                let selected = el.selected();
+                el.selectify();
+                if (selected)
+                    el.unselect();
+                else
+                    el.select();
+                el.unselectify();
+                // Questo va anche nella lista degli elementi originali (this.Elements) dato che cytoscape li prende per riferimento (bbbbbravo cyto-chan)
+                el.data("__selected", !selected);
+            }
+            this.onNodeClick.emit({ data: targetData });
+        });
+        this.cy.bind('select', 'node', (event) => {
+            let targetData = event.target.data();
+            this.onNodeSelection.emit({ data: targetData, selected: true });
+        });
+        this.cy.bind('layoutstop', (event) => {
+            this.onLayoutDone.emit();
+        });
+        this.cy.bind('unselect', 'node', (event) => {
+            let targetData = event.target.data();
+            this.onNodeSelection.emit({ data: targetData, selected: false });
+        });
+        // Altri eventi...
+    }
+    /**
+     * Metodo che serve per caricare tutte le estensioni della libreria in base a ciò che viene utilizzato
+     */
+    async performModulesLoading() {
+        if (this.Layout.name == 'dagre')
+            await this.loadInternal("cytoscape-dagre");
+        if (this.NodeHTMLTemplates && this.NodeHTMLTemplates.length > 0)
+            await this.loadInternal("cytoscape-html-node");
+        if (this.UseContextMenu)
+            await this.loadInternal("cytoscape-cxtmenu");
+        if (this.NodesHierarchy && this.UseExpandCollapse)
+            await this.loadInternal("cytoscape-expand-collapse");
+        if (this.ExtensionModulesImporter) {
+            // Wrappo il namespace in modo che possa dire la mia sul fatto che l'utente aggiunga un modulo o meno :D
+            var wrappedCytoscape = {
+                use: (moduleName, module) => {
+                    if (!module)
+                        this.service.log("E", this.service.loc("Received an undefined module. Make sure you are correctly loading it") + ": " + moduleName, false);
+                    if (["cytoscape-dagre", "cytoscape-html-node", "cytoscape-cxtmenu", "cytoscape-expand-collapse"].includes(moduleName))
+                        this.service.log("W", this.service.loc("Module") + " " + moduleName + " " + this.service.loc("is loaded and managed directly by this library. You don't need to import it or use it directly, just be sure to set the relative options"), false);
+                    else
+                        cytoscape.use(module);
+                }
+            };
+            await this.ExtensionModulesImporter(wrappedCytoscape);
+        }
+    }
+    /**
+     * Metodo che serve per caricare tutte le estensioni della libreria in base a ciò che viene utilizzato con le opzioni definite dagli Input
+     */
+    performOperationsWithLoadedModules() {
+        let anyCy = this.cy;
+        // Utilizzo del layout, lo salvo per poterlo riutilizzare in futuro
+        if (this.Layout) {
+            this.LastLayout = JSON.parse(JSON.stringify(this.Layout));
+            this.cy.layout(this.LastLayout).run();
+        }
+        // Utilizzo dell'HTML node
+        if (this.NodeHTMLTemplates && this.NodeHTMLTemplates.length > 0) {
+            this.HtmlNodeApi = anyCy.htmlnode();
+            this.HtmlNodeApi.createHtmlNode(cytoscape, this.cy, this.NodeHTMLTemplates);
+        }
+        // Utilizzo del Context Menu
+        if (this.UseContextMenu)
+            this.ContextMenuOptions.forEach(o => { anyCy.cxtmenu(o); });
+        // Utilizzo dell'expand collapse solo quando c'è una gerarchia di nodi
+        if (this.NodesHierarchy && this.UseExpandCollapse)
+            this.ExpandCollapseApi = anyCy.expandCollapse(this.ExpandCollapseOptions);
+        // Utilizzo di estensioni extra, implementazione affidata al programmatore
+        if (this.ExtensionModulesApplyer)
+            this.ExtensionModulesApplyer(this.cy);
+    }
+    updateCardData() {
+        if (!this.HtmlNodeApi) {
+            this.service.log("E", "Cannot update NodeHTMLTemplates as they don't seem to be used");
+            return;
+        }
+        this.HtmlNodeApi.update();
+    }
+    /**
+     * Metodo interno per il caricamento dei moduli di estensione
+     *
+     * @param {'cytoscape-expand-collapse' | 'cytoscape-cxtmenu' | 'cytoscape-html-node' | 'cytoscape-dagre'} moduleId Modulo da caricare
+     */
+    async loadInternal(moduleId) {
+        let toLoad = await this.service.importIfNeeded(moduleId);
+        if (toLoad)
+            cytoscape.use(toLoad);
+    }
+    /**
+     * Metodo che basandosi sulle opzioni native eventualmente assegnate le completa con gli Input addizionali
+     *
+     * @returns {cy_.CytoscapeOptions} Opzioni finali unite da Input ed opzioni native
+     */
+    getCompletedOptions() {
+        var opts = this.NativeOptions || {};
+        opts.container = this.cyGraph.nativeElement;
+        opts.style = opts.style || [];
+        // Per tutte le cose per cui gli Input hanno priorità sovrascrivo gli originali delle opzioni
+        if (this.NodeStyles || this.EdgeStyles) {
+            opts.style = [];
+            if (this.NodeStyles)
+                opts.style.push({ selector: 'node', css: this.NodeStyles });
+            if (this.EdgeStyles)
+                opts.style.push({ selector: 'edge', css: this.EdgeStyles });
+        }
+        if (this.Elements)
+            opts.elements = this.Elements;
+        this.reviewCytoscapeElements(opts.elements);
+        if (this.Layout)
+            opts.layout = this.Layout;
+        if (this.Readonly) {
+            // Questo coso fa effetti strani....
+            //opts.autolock = true;
+            opts.autoungrabify = true;
+            opts.autounselectify = false;
+            opts.boxSelectionEnabled = true;
+            opts.userZoomingEnabled = false;
+            opts.userPanningEnabled = false;
+        }
+        return opts;
+    }
+    /**
+     * Aggiustamenti degli elementi di Cytoscape.
+     *
+     * I nodi non vengono toccati.
+     *
+     * Per ogni edge viene controllato se è specificata una sorgente ed una destinazione, in caso contrario si cerca di dedurli dall'ID
+     *
+     * @param {cytoscape.ElementDefinition[]} elements Elementi da sistemare
+     */
+    reviewCytoscapeElements(elements, prevPositions) {
+        let hasPreviousPositions = prevPositions && prevPositions.length > 0;
+        let positionCache = {};
+        if (hasPreviousPositions) {
+            for (let i = 0; i < prevPositions.length; i++) {
+                let item = prevPositions[i];
+                if (!positionCache[item.data().id])
+                    positionCache[item.data().id] = item.position();
+            }
+        }
+        for (let i = 0; i < elements.length; i++) {
+            let el = elements[i];
+            if (el.group == "edges" && (!el.data.source && !el.data.target)) {
+                if (!el.data.id.includes("-"))
+                    this.service.log("E", "If you don't specify a source and a target for an edge you have to write its id in the format {source}-{target}");
+                else {
+                    var sourceTarget = el.data.id.split('-');
+                    el.data.source = sourceTarget[0].trim();
+                    el.data.target = sourceTarget[1].trim();
+                }
+            }
+            if (hasPreviousPositions && el.group == "nodes")
+                el.position = positionCache[el.data.id];
+        }
+    }
+}
+EsDiagramComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramComponent, deps: [{ token: EsDiagramService, optional: true }, { token: EsDiagramDispatcher, optional: true }, { token: ReactiveExtensions }], target: i0.ɵɵFactoryTarget.Component });
+EsDiagramComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: EsDiagramComponent, selector: "es-diagram", inputs: { name: "name", UseContextMenu: "UseContextMenu", ContextMenuOptions: "ContextMenuOptions", UseExpandCollapse: "UseExpandCollapse", ExpandCollapseOptions: "ExpandCollapseOptions", NativeOptions: "NativeOptions", Elements: "Elements", NodeStyles: "NodeStyles", EdgeStyles: "EdgeStyles", Readonly: "Readonly", AutoupdateSize: "AutoupdateSize", PreserveElementsPosition: "PreserveElementsPosition", AnimateLayoutChanges: "AnimateLayoutChanges", SmartSelection: "SmartSelection", SmartSelectionStyles: "SmartSelectionStyles", ResizeThrottleTime: "ResizeThrottleTime", Layout: "Layout", NodeHTMLTemplates: "NodeHTMLTemplates", ExtensionModulesImporter: "ExtensionModulesImporter", ExtensionModulesApplyer: "ExtensionModulesApplyer" }, outputs: { onNodeClick: "onNodeClick", onNodeSelection: "onNodeSelection", onLayoutDone: "onLayoutDone", onLoaded: "onLoaded" }, viewQueries: [{ propertyName: "cyGraph", first: true, predicate: ["graph"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #graph class=\"graph-wrapper {{name}}\"></div>", styles: [".graph-wrapper{height:100%;width:100%}.html-node-notransition{transition:none!important;transform:none!important}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'es-diagram', template: "<div #graph class=\"graph-wrapper {{name}}\"></div>", styles: [".graph-wrapper{height:100%;width:100%}.html-node-notransition{transition:none!important;transform:none!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: EsDiagramService, decorators: [{
+                    type: Optional
+                }] }, { type: EsDiagramDispatcher, decorators: [{
+                    type: Optional
+                }] }, { type: ReactiveExtensions }]; }, propDecorators: { cyGraph: [{
+                type: ViewChild,
+                args: ['graph']
+            }], name: [{
+                type: Input
+            }], UseContextMenu: [{
+                type: Input
+            }], ContextMenuOptions: [{
+                type: Input
+            }], UseExpandCollapse: [{
+                type: Input
+            }], ExpandCollapseOptions: [{
+                type: Input
+            }], NativeOptions: [{
+                type: Input
+            }], Elements: [{
+                type: Input
+            }], NodeStyles: [{
+                type: Input
+            }], EdgeStyles: [{
+                type: Input
+            }], Readonly: [{
+                type: Input
+            }], AutoupdateSize: [{
+                type: Input
+            }], PreserveElementsPosition: [{
+                type: Input
+            }], AnimateLayoutChanges: [{
+                type: Input
+            }], SmartSelection: [{
+                type: Input
+            }], SmartSelectionStyles: [{
+                type: Input
+            }], ResizeThrottleTime: [{
+                type: Input
+            }], Layout: [{
+                type: Input
+            }], NodeHTMLTemplates: [{
+                type: Input
+            }], ExtensionModulesImporter: [{
+                type: Input
+            }], ExtensionModulesApplyer: [{
+                type: Input
+            }], onNodeClick: [{
+                type: Output
+            }], onNodeSelection: [{
+                type: Output
+            }], onLayoutDone: [{
+                type: Output
+            }], onLoaded: [{
+                type: Output
+            }] } });
+
+class EsDiagramModule {
+    static forRoot(config) {
+        return {
+            ngModule: EsDiagramModule,
+            providers: [
+                EsDiagramService,
+                EsDiagramDispatcher,
+                { provide: DIA_LOCALE, useValue: config?.locale || 'it-IT' },
+                { provide: DIA_DEBUG_MODE, useValue: config?.debugMode || false },
+            ]
+        };
+    }
+}
+EsDiagramModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+EsDiagramModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramModule, declarations: [EsDiagramComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule, CommonModule], exports: [EsDiagramComponent] });
+EsDiagramModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramModule, imports: [[CommonModule, FormsModule, ReactiveFormsModule, CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsDiagramModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [EsDiagramComponent],
+                    imports: [CommonModule, FormsModule, ReactiveFormsModule, CommonModule],
+                    exports: [EsDiagramComponent]
+                }]
+        }] });
+
+/*
+ * Public API Surface of cytoscape-angular
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BaseLayoutOptionsImpl, BreadthFirstLayoutOptionsImpl, CircleLayoutOptionsImpl, ConcentricLayoutOptionsImpl, ContextMenuCommand, ContextMenuOptions, CoseLayoutOptionsImpl, DagreLayoutOptionsImpl, EsDiagramComponent, EsDiagramModule, EsDiagramModuleConfig, ExpandCollapseOptions, GridLayoutOptionsImpl, NodeHTMLTemplate, NodeTemplate, NullLayoutOptionsImpl, PresetLayoutOptionsImpl, RandomLayoutOptionsImpl, ShapedLayoutOptionsImpl, ZoomLevelBasedTemplate };
+//# sourceMappingURL=esfaenza-es-diagrams.mjs.map