ol-wfst 4.0.5 → 4.1.0

package/lib/ol-wfst.js

@@ -1,26 +1,38 @@
-import { Style, Stroke, Fill, Circle } from 'ol/style';
-import { Control } from 'ol/control';
-import { Modify, Snap, Select, Draw } from 'ol/interaction';
-import { Observable, Feature, Overlay, Collection } from 'ol';
-import BaseEvent from 'ol/events/Event';
-import { primaryAction, never } from 'ol/events/condition';
-import { unByKey } from 'ol/Observable';
+import CircleStyle from 'ol/style/Circle.js';
+import Fill$1 from 'ol/style/Fill.js';
+import Stroke$1 from 'ol/style/Stroke.js';
+import Style$1 from 'ol/style/Style.js';
+import Control from 'ol/control/Control.js';
+import Draw from 'ol/interaction/Draw.js';
+import Modify from 'ol/interaction/Modify.js';
+import Select from 'ol/interaction/Select.js';
+import Snap from 'ol/interaction/Snap.js';
+import Collection from 'ol/Collection.js';
+import BaseEvent from 'ol/events/Event.js';
+import { primaryAction, never } from 'ol/events/condition.js';
+import Observable, { unByKey } from 'ol/Observable.js';
 import Modal from 'modal-vanilla';
-import VectorLayer from 'ol/layer/Vector';
+import VectorLayer from 'ol/layer/Vector.js';
 import { Mixin } from 'ts-mixer';
-import Layer from 'ol/layer/Base';
-import GeoJSON from 'ol/format/GeoJSON';
-import VectorSource, { VectorSourceEvent } from 'ol/source/Vector';
-import { transformExtent } from 'ol/proj';
-import { bbox } from 'ol/loadingstrategy';
-import TileLayer from 'ol/layer/Tile';
-import { GeoJSON as GeoJSON$1, WFS, KML } from 'ol/format';
-import TileWMS from 'ol/source/TileWMS';
-import TileState from 'ol/TileState';
-import { MultiPolygon, MultiLineString, MultiPoint, GeometryCollection, Polygon, Circle as Circle$1 } from 'ol/geom';
-import BaseObject from 'ol/Object';
-import { fromCircle } from 'ol/geom/Polygon';
-import { getCenter } from 'ol/extent';
+import Layer from 'ol/layer/Base.js';
+import GeoJSON from 'ol/format/GeoJSON.js';
+import VectorSource, { VectorSourceEvent } from 'ol/source/Vector.js';
+import { transformExtent } from 'ol/proj.js';
+import { bbox } from 'ol/loadingstrategy.js';
+import TileLayer from 'ol/layer/Tile.js';
+import TileWMS from 'ol/source/TileWMS.js';
+import TileState from 'ol/TileState.js';
+import { MultiPolygon, MultiLineString, MultiPoint, GeometryCollection, Polygon } from 'ol/geom.js';
+import KML from 'ol/format/KML.js';
+import WFS from 'ol/format/WFS.js';
+import { Style, Stroke, Fill, Circle } from 'ol/style.js';
+import BaseObject from 'ol/Object.js';
+import Circle$1 from 'ol/geom/Circle.js';
+import GeometryCollection$1 from 'ol/geom/GeometryCollection.js';
+import Feature from 'ol/Feature.js';
+import { fromCircle } from 'ol/geom/Polygon.js';
+import { getCenter } from 'ol/extent.js';
+import Overlay from 'ol/Overlay.js';
 
 // External
 let options = {};
@@ -29,9 +41,11 @@ const isError = new Set();
 const initModal = (opts) => {
     options = opts;
 };
-const parseError = (geoserverError) => {
-    if ('exceptions' in geoserverError) {
-        return geoserverError.exceptions.map((e) => e.text).join(',');
+const parseError = (geoserverResponse) => {
+    if ('exceptions' in geoserverResponse) {
+        return geoserverResponse.exceptions
+            .map((e) => e.text)
+            .join(',');
     }
     else {
         return '';
@@ -50,7 +64,7 @@ const showError = (msg, originalError = null, layerName = '') => {
     }
     isError.add(layerName);
     let err_msg = `<b>Error: ${msg}</b>`;
-    if (originalError) {
+    if (originalError && originalError.message !== msg) {
         err_msg += `. ${originalError.message}`;
     }
     const al = Modal.alert(err_msg, options);
@@ -94,9 +108,9 @@ const es = {
         geoserver: 'No se pudieron obtener datos desde el GeoServer',
         badFormat: 'Formato no soportado',
         badFile: 'Error al leer elementos del archivo',
-        lockFeature: 'No se pudieron bloquear elementos en el GeoServer.',
-        transaction: 'Error al hacer transacción con el GeoServer.',
-        getFeatures: 'Error al obtener elemento desde el GeoServer.'
+        lockFeature: 'No se pudieron bloquear elementos en el GeoServer',
+        transaction: 'Error al hacer transacción con el GeoServer',
+        getFeatures: 'Error al obtener elemento desde el GeoServer'
     }
 };
 
@@ -134,9 +148,9 @@ const en = {
         geoserver: 'Failed to get data from GeoServer',
         badFormat: 'Unsupported format',
         badFile: 'Error reading items from file',
-        lockFeature: 'Could not lock items on the GeoServer.',
-        transaction: 'Error when doing Transaction with GeoServer.',
-        getFeatures: 'Error getting elements from GeoServer.'
+        lockFeature: 'Could not lock items on the GeoServer',
+        transaction: 'Error when doing Transaction with GeoServer',
+        getFeatures: 'Error getting elements from GeoServer'
     }
 };
 
@@ -194,7 +208,7 @@ const setLang = (lang = 'en', customI18n = null) => {
     }
     // Check if customs translations are provided
     if (customI18n) {
-        I18N = { ...I18N, ...customI18n };
+        I18N = Object.assign(Object.assign({}, I18N), customI18n);
     }
 };
 
@@ -293,7 +307,7 @@ class BaseLayer extends Layer {
             this.getAndUpdateDescribeFeatureType();
         }
         else {
-            geoserver.on('change:capabilities', () => {
+            geoserver.on('change:capabilities', async () => {
                 this.getAndUpdateDescribeFeatureType();
             });
         }
@@ -328,6 +342,9 @@ class BaseLayer extends Layer {
             if (!data) {
                 throw new Error('');
             }
+            if (data.exceptions) {
+                throw new Error(parseError(data));
+            }
             const targetNamespace = data.targetNamespace;
             const properties = data.featureTypes[0].properties;
             // Find the geometry field
@@ -342,7 +359,7 @@ class BaseLayer extends Layer {
         }
         catch (err) {
             console.error(err);
-            throw new Error(`${I18N.errors.layer} "${layerLabel}"`);
+            showError(`${I18N.errors.layer} "${layerLabel}"`, err, layerName);
         }
     }
     /**
@@ -411,17 +428,8 @@ var BaseLayerProperty;
  * @param options
  */
 class WfsSource extends VectorSource {
-    urlParams = new URLSearchParams({
-        SERVICE: 'wfs',
-        REQUEST: 'GetFeature',
-        OUTPUTFORMAT: 'application/json',
-        EXCEPTIONS: 'application/json'
-    });
     constructor(options) {
-        super({
-            ...options,
-            format: new GeoJSON(),
-            loader: async (extent, resolution, projection, success, failure) => {
+        super(Object.assign(Object.assign({}, options), { format: new GeoJSON(), loader: async (extent, resolution, projection, success, failure) => {
                 try {
                     // If bbox, add extent to the request
                     if (options.strategy == bbox) {
@@ -459,7 +467,12 @@ class WfsSource extends VectorSource {
                     showError(I18N.errors.geoserver, err, options.name);
                     failure();
                 }
-            }
+            } }));
+        this.urlParams = new URLSearchParams({
+            SERVICE: 'wfs',
+            REQUEST: 'GetFeature',
+            OUTPUTFORMAT: 'application/json',
+            EXCEPTIONS: 'application/json'
         });
         this.urlParams.set('version', options.geoServerAdvanced.getFeatureVersion);
         this.urlParams.set('typename', options.name);
@@ -476,27 +489,15 @@ class WfsSource extends VectorSource {
  * @param options
  */
 class WfsLayer extends Mixin(BaseLayer, (VectorLayer)) {
-    _loadingCount = 0;
-    _loadedCount = 0;
-    beforeTransactFeature;
     constructor(options) {
-        super({
-            name: options.name,
-            label: options.label || options.name,
-            minZoom: options.minZoom,
-            ...options
-        });
+        super(Object.assign({ name: options.name, label: options.label || options.name, minZoom: options.minZoom }, options));
+        this._loadingCount = 0;
+        this._loadedCount = 0;
         if (options.beforeTransactFeature) {
             this.beforeTransactFeature = options.beforeTransactFeature;
         }
         const geoserver = options.geoserver;
-        const source = new WfsSource({
-            name: options.name,
-            geoserverUrl: geoserver.getUrl(),
-            geoServerAdvanced: geoserver.getAdvanced(),
-            ...(options.strategy && { strategy: options.strategy }),
-            geoserverVendor: options.geoserverVendor
-        });
+        const source = new WfsSource(Object.assign(Object.assign({ name: options.name, geoserverUrl: geoserver.getUrl(), geoServerAdvanced: geoserver.getAdvanced() }, (options.strategy && { strategy: options.strategy })), { geoserverVendor: options.geoserverVendor }));
         this._loadingCount = 0;
         this._loadedCount = 0;
         source.on('featuresloadstart', () => {
@@ -565,17 +566,7 @@ class WfsLayer extends Mixin(BaseLayer, (VectorLayer)) {
  */
 class WmsSource extends TileWMS {
     constructor(options) {
-        super({
-            url: options.geoserverUrl,
-            serverType: 'geoserver',
-            params: {
-                SERVICE: 'wms',
-                TILED: true,
-                LAYERS: options.name,
-                EXCEPTIONS: 'application/json',
-                ...(options.geoserverVendor && options.geoserverVendor)
-            },
-            tileLoadFunction: async (tile, src) => {
+        super(Object.assign({ url: options.geoserverUrl, serverType: 'geoserver', params: Object.assign({ SERVICE: 'wms', TILED: true, LAYERS: options.name, EXCEPTIONS: 'application/json' }, (options.geoserverVendor && options.geoserverVendor)), tileLoadFunction: async (tile, src) => {
                 const blobToJson = (blob) => {
                     return new Promise((resolve) => {
                         const reader = new FileReader();
@@ -605,9 +596,7 @@ class WmsSource extends TileWMS {
                     showError(I18N.errors.geoserver, err, options.name);
                     tile.setState(TileState.ERROR);
                 }
-            },
-            ...options
-        });
+            } }, options));
     }
 }
 
@@ -620,22 +609,14 @@ class WmsSource extends TileWMS {
  * @param options
  */
 class WmsLayer extends Mixin(BaseLayer, (TileLayer)) {
-    _loadingCount = 0;
-    _loadedCount = 0;
-    beforeTransactFeature;
-    // Formats
-    _formatGeoJSON;
     constructor(options) {
-        super({
-            name: options.name,
-            label: options.label || options.name,
-            minZoom: options.minZoom,
-            ...options
-        });
+        super(Object.assign({ name: options.name, label: options.label || options.name, minZoom: options.minZoom }, options));
+        this._loadingCount = 0;
+        this._loadedCount = 0;
         if (options.beforeTransactFeature) {
             this.beforeTransactFeature = options.beforeTransactFeature;
         }
-        this._formatGeoJSON = new GeoJSON$1();
+        this._formatGeoJSON = new GeoJSON();
         const geoserver = options.geoserver;
         const source = new WmsSource({
             name: options.name,
@@ -741,6 +722,14 @@ class WmsLayer extends Mixin(BaseLayer, (TileLayer)) {
     }
 }
 
+var img$5 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath d='M240 352h-240v128h480v-128h-240zM448 416h-64v-32h64v32zM112 160l128-128 128 128h-80v160h-96v-160z'%3e%3c/path%3e%3c/svg%3e";
+
+var img$4 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e %3cpath d='M663 225l-58.5 58.5-120-120 58.5-58.5q9-9 22.5-9t22.5 9l75 75q9 9 9 22.5t-9 22.5zM96 552l354-354 120 120-354 354h-120v-120z'%3e%3c/path%3e%3c/svg%3e";
+
+var img$3 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e%3cpath d='M384 288q39 0 67.5 28.5t28.5 67.5-28.5 67.5-67.5 28.5-67.5-28.5-28.5-67.5 28.5-67.5 67.5-28.5zM384 544.5q66 0 113.25-47.25t47.25-113.25-47.25-113.25-113.25-47.25-113.25 47.25-47.25 113.25 47.25 113.25 113.25 47.25zM384 144q118.5 0 214.5 66t138 174q-42 108-138 174t-214.5 66-214.5-66-138-174q42-108 138-174t214.5-66z'%3e%3c/path%3e%3c/svg%3e";
+
+var img$2 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e%3cpath d='M379.5 288h4.5q39 0 67.5 28.5t28.5 67.5v6zM241.5 313.5q-18 36-18 70.5 0 66 47.25 113.25t113.25 47.25q34.5 0 70.5-18l-49.5-49.5q-12 3-21 3-39 0-67.5-28.5t-28.5-67.5q0-9 3-21zM64.5 136.5l40.5-40.5 567 567-40.5 40.5q-7.5-7.5-47.25-46.5t-60.75-60q-64.5 27-139.5 27-118.5 0-214.5-66t-138-174q16.5-39 51.75-86.25t68.25-72.75q-18-18-50.25-51t-36.75-37.5zM384 223.5q-30 0-58.5 12l-69-69q58.5-22.5 127.5-22.5 118.5 0 213.75 66t137.25 174q-36 88.5-109.5 151.5l-93-93q12-28.5 12-58.5 0-66-47.25-113.25t-113.25-47.25z'%3e%3c/path%3e%3c/svg%3e";
+
 function createElement(tagName, attrs = {}, ...children) {
     if (typeof tagName === 'function')
         return tagName(attrs, children);
@@ -778,14 +767,6 @@ function createElement(tagName, attrs = {}, ...children) {
     return elem;
 }
 
-var img$5 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath d='M240 352h-240v128h480v-128h-240zM448 416h-64v-32h64v32zM112 160l128-128 128 128h-80v160h-96v-160z'%3e%3c/path%3e%3c/svg%3e";
-
-var img$4 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e %3cpath d='M663 225l-58.5 58.5-120-120 58.5-58.5q9-9 22.5-9t22.5 9l75 75q9 9 9 22.5t-9 22.5zM96 552l354-354 120 120-354 354h-120v-120z'%3e%3c/path%3e%3c/svg%3e";
-
-var img$3 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e%3cpath d='M384 288q39 0 67.5 28.5t28.5 67.5-28.5 67.5-67.5 28.5-67.5-28.5-28.5-67.5 28.5-67.5 67.5-28.5zM384 544.5q66 0 113.25-47.25t47.25-113.25-47.25-113.25-113.25-47.25-113.25 47.25-47.25 113.25 47.25 113.25 113.25 47.25zM384 144q118.5 0 214.5 66t138 174q-42 108-138 174t-214.5 66-214.5-66-138-174q42-108 138-174t214.5-66z'%3e%3c/path%3e%3c/svg%3e";
-
-var img$2 = "data:image/svg+xml,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' width='768' height='768' viewBox='0 0 768 768'%3e%3cpath d='M379.5 288h4.5q39 0 67.5 28.5t28.5 67.5v6zM241.5 313.5q-18 36-18 70.5 0 66 47.25 113.25t113.25 47.25q34.5 0 70.5-18l-49.5-49.5q-12 3-21 3-39 0-67.5-28.5t-28.5-67.5q0-9 3-21zM64.5 136.5l40.5-40.5 567 567-40.5 40.5q-7.5-7.5-47.25-46.5t-60.75-60q-64.5 27-139.5 27-118.5 0-214.5-66t-138-174q16.5-39 51.75-86.25t68.25-72.75q-18-18-50.25-51t-36.75-37.5zM384 223.5q-30 0-58.5 12l-69-69q58.5-22.5 127.5-22.5 118.5 0 213.75 66t137.25 174q-36 88.5-109.5 151.5l-93-93q12-28.5 12-58.5 0-66-47.25-113.25t-113.25-47.25z'%3e%3c/path%3e%3c/svg%3e";
-
 /**
  * Removes in the DOM the class of the tools
  * @private
@@ -809,8 +790,6 @@ const activateDrawButton = () => {
     }
 };
 class LayersControl extends Observable {
-    _uploads;
-    _uploadFormats;
     constructor(uploads, uploadFormats) {
         super();
         this._uploads = uploads;
@@ -824,17 +803,17 @@ class LayersControl extends Observable {
     addLayerEl(layer) {
         const container = document.querySelector('.wfst--tools-control--select-layers');
         const layerName = layer.get(BaseLayerProperty.NAME);
-        const checked = layer === getActiveLayerToInsertEls() ? { checked: 'checked' } : {};
-        const input = (createElement("input", { value: layerName, id: `wfst--${layerName}`, type: "radio", className: "ol-wfst--tools-control-input", name: "wfst--select-layer", ...checked, onchange: (evt) => this._layerChangeHandler(evt, layer) }));
-        const layerDom = (createElement("div", { className: `wfst--layer-control 
-                            ${layer.getVisible() ? 'ol-wfst--visible-on' : ''}
+        const checked = layer === getActiveLayerToInsertEls() ? { checked: true } : {};
+        const input = (createElement("input", Object.assign({ value: layerName, id: `wfst--${layerName}`, type: "radio", className: "ol-wfst--tools-control-input", name: "wfst--select-layer" }, checked, { onChange: (evt) => this._layerChangeHandler(evt, layer) })));
+        const layerDom = (createElement("div", { className: `wfst--layer-control 
+                            ${layer.getVisible() ? 'ol-wfst--visible-on' : ''}
                             ${layer === getActiveLayerToInsertEls()
                 ? 'ol-wfst--selected-on'
                 : ''}`, "data-layer": layerName },
             createElement("div", { className: "ol-wfst--tools-control-visible" },
-                createElement("span", { className: "ol-wfst--tools-control-visible-btn ol-wfst--visible-btn-on", title: I18N.labels.toggleVisibility, onclick: (evt) => this._visibilityClickHandler(evt) },
+                createElement("span", { className: "ol-wfst--tools-control-visible-btn ol-wfst--visible-btn-on", title: I18N.labels.toggleVisibility, onClick: (evt) => this._visibilityClickHandler(evt) },
                     createElement("img", { src: img$3 })),
-                createElement("span", { className: "ol-wfst--tools-control-visible-btn ol-wfst--visible-btn-off", title: I18N.labels.toggleVisibility, onclick: (evt) => this._visibilityClickHandler(evt) },
+                createElement("span", { className: "ol-wfst--tools-control-visible-btn ol-wfst--visible-btn-off", title: I18N.labels.toggleVisibility, onClick: (evt) => this._visibilityClickHandler(evt) },
                     createElement("img", { src: img$2 }))),
             createElement("label", { htmlFor: `wfst--${layerName}` },
                 input,
@@ -933,17 +912,16 @@ class LayersControl extends Observable {
         return (createElement(null, null,
             createElement("div", { className: "wfst--tools-control--head" },
                 this._uploads && (createElement("div", null,
-                    createElement("input", { id: "ol-wfst--upload", type: "file", accept: this._uploadFormats, onchange: (evt) => this._uploads.process(evt) }),
+                    createElement("input", { id: "ol-wfst--upload", type: "file", accept: this._uploadFormats, onChange: (evt) => this._uploads.process(evt) }),
                     createElement("label", { className: "ol-wfst--tools-control-btn ol-wfst--tools-control-btn-upload", htmlFor: "ol-wfst--upload", title: I18N.labels.uploadToLayer },
                         createElement("img", { src: img$5 })))),
                 createElement("div", { className: "ol-wfst--tools-control-draw-cnt" },
-                    createElement("button", { className: "ol-wfst--tools-control-btn ol-wfst--tools-control-btn-draw", type: "button", title: I18N.labels.addElement, onclick: () => {
+                    createElement("button", { className: "ol-wfst--tools-control-btn ol-wfst--tools-control-btn-draw", type: "button", title: I18N.labels.addElement, onClick: () => {
                             this.dispatchEvent('drawMode');
                         } },
                         createElement("img", { src: img$4 })),
-                    createElement("select", { title: I18N.labels.selectDrawType, className: "wfst--tools-control--select-draw", onchange: (evt) => {
-                            const selectedValue = evt.target
-                                .value;
+                    createElement("select", { title: I18N.labels.selectDrawType, className: "wfst--tools-control--select-draw", onChange: (evt) => {
+                            const selectedValue = evt.target.value;
                             this._changeStateSelect(getActiveLayerToInsertEls(), selectedValue);
                             this.dispatchEvent('changeGeom');
                         } }, [
@@ -972,20 +950,13 @@ const getEditLayer = () => {
 
 // Ol
 class Uploads extends Observable {
-    _options;
-    // Formats
-    _formatWFS;
-    _formatGeoJSON;
-    _formatKml;
-    _xs;
-    _processUpload;
     constructor(options) {
         super();
         this._options = options;
         this._processUpload = options.processUpload;
         // Formats
         this._formatWFS = new WFS();
-        this._formatGeoJSON = new GeoJSON$1();
+        this._formatGeoJSON = new GeoJSON();
         this._formatKml = new KML({
             extractStyles: false,
             showPointNames: false
@@ -1053,8 +1024,8 @@ class Uploads extends Observable {
             else {
                 resetStateButtons();
                 this.dispatchEvent(new VectorSourceEvent('loadedFeatures', null, featuresToInsert));
-                const content = `
-            ${I18N.labels.validFeatures}: ${validFeaturesCount}<br>
+                const content = `
+            ${I18N.labels.validFeatures}: ${validFeaturesCount}<br>
             ${invalidFeaturesCount
                     ? `${I18N.labels.invalidFeatures}: ${invalidFeaturesCount}`
                     : ''}`;
@@ -1150,25 +1121,17 @@ class Uploads extends Observable {
      * @private
      */
     _initModal(content, featuresToInsert) {
-        const footer = `
-        <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">
-            ${I18N.labels.cancel}
-        </button>
-        <button type="button" class="btn btn-sm btn-primary" data-action="save" data-dismiss="modal">
-            ${I18N.labels.upload}
-        </button>
+        const footer = `
+        <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">
+            ${I18N.labels.cancel}
+        </button>
+        <button type="button" class="btn btn-sm btn-primary" data-action="save" data-dismiss="modal">
+            ${I18N.labels.upload}
+        </button>
     `;
-        const modal = new Modal({
-            ...this._options.modal,
-            header: true,
-            headerClose: false,
-            title: I18N.labels.uploadFeatures +
+        const modal = new Modal(Object.assign(Object.assign({}, this._options.modal), { header: true, headerClose: false, title: I18N.labels.uploadFeatures +
                 ' ' +
-                getActiveLayerToInsertEls().get(BaseLayerProperty.NAME),
-            content: content,
-            backdrop: 'static',
-            footer: footer
-        }).show();
+                getActiveLayerToInsertEls().get(BaseLayerProperty.NAME), content: content, backdrop: 'static', footer: footer })).show();
         modal.on('dismiss', (modal, event) => {
             // On saving changes
             if (event.target.dataset.action === 'save') {
@@ -1238,13 +1201,13 @@ class EditControlChangesEl extends Control {
                         " -",
                         ' ',
                         createElement("i", null, String(feature.getId()))),
-                    createElement("button", { type: "button", className: "btn btn-sm btn-secondary", onclick: () => {
+                    createElement("button", { type: "button", className: "btn btn-sm btn-secondary", onClick: () => {
                             this.dispatchEvent(new VectorSourceEvent('cancel', feature));
                         } }, I18N.labels.cancel),
-                    createElement("button", { type: "button", className: "btn btn-sm btn-primary", onclick: () => {
+                    createElement("button", { type: "button", className: "btn btn-sm btn-primary", onClick: () => {
                             this.dispatchEvent(new VectorSourceEvent('apply', feature));
                         } }, I18N.labels.apply),
-                    createElement("button", { type: "button", className: "btn btn-sm btn-danger-outline", onclick: () => {
+                    createElement("button", { type: "button", className: "btn btn-sm btn-danger-outline", onClick: () => {
                             this.dispatchEvent(new VectorSourceEvent('delete', feature));
                         } }, I18N.labels.delete))))
         });
@@ -1399,31 +1362,21 @@ function styleFunction(feature) {
  * @private
  */
 class EditFieldsModal extends Observable {
-    _options;
-    _modal;
-    _feature;
     constructor(options) {
         super();
         this._options = options;
-        const footer = `
-            <button type="button" class="btn btn-sm btn-link btn-third" data-action="delete" data-dismiss="modal">
-                ${I18N.labels.delete}
-            </button>
-            <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">
-                ${I18N.labels.cancel}
-            </button>
-            <button type="button" class="btn btn-sm btn-primary" data-action="save" data-dismiss="modal">
-                ${I18N.labels.save}
-            </button>
+        const footer = `
+            <button type="button" class="btn btn-sm btn-link btn-third" data-action="delete" data-dismiss="modal">
+                ${I18N.labels.delete}
+            </button>
+            <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">
+                ${I18N.labels.cancel}
+            </button>
+            <button type="button" class="btn btn-sm btn-primary" data-action="save" data-dismiss="modal">
+                ${I18N.labels.save}
+            </button>
         `;
-        this._modal = new Modal({
-            ...this._options,
-            header: true,
-            headerClose: true,
-            title: '',
-            content: '<div></div>',
-            footer: footer
-        });
+        this._modal = new Modal(Object.assign(Object.assign({}, this._options), { header: true, headerClose: true, title: '', content: '<div></div>', footer: footer }));
         this._modal.on('dismiss', (modal, event) => {
             // On saving changes
             if (event.target.dataset.action === 'save') {
@@ -1472,10 +1425,10 @@ class EditFieldsModal extends Observable {
                         type = 'text';
                 }
                 if (type) {
-                    content += `
-                <div class="ol-wfst--input-field-container">
-                    <label class="ol-wfst--input-field-label" for="${key}">${key}</label>
-                    <input placeholder="NULL" class="ol-wfst--input-field-input" type="${type}" name="${key}" value="${properties[key] || ''}">
+                    content += `
+                <div class="ol-wfst--input-field-container">
+                    <label class="ol-wfst--input-field-label" for="${key}">${key}</label>
+                    <input placeholder="NULL" class="ol-wfst--input-field-input" type="${type}" name="${key}" value="${properties[key] || ''}">
                 </div>`;
                 }
             }
@@ -1497,17 +1450,6 @@ const DEFAULT_GEOSERVER_SRS = 'EPSG:3857';
  * @param options
  */
 class Geoserver extends BaseObject {
-    _options;
-    _countRequests;
-    _insertFeatures;
-    _updateFeatures;
-    _deleteFeatures;
-    // Formats
-    _formatWFS;
-    _formatGeoJSON;
-    _formatKml;
-    _xs;
-    state_;
     constructor(options) {
         super();
         const defaults = {
@@ -1541,7 +1483,7 @@ class Geoserver extends BaseObject {
         this._deleteFeatures = [];
         // Formats
         this._formatWFS = new WFS();
-        this._formatGeoJSON = new GeoJSON$1();
+        this._formatGeoJSON = new GeoJSON();
         this._formatKml = new KML({
             extractStyles: false,
             showPointNames: false
@@ -1740,7 +1682,7 @@ class Geoserver extends BaseObject {
      * @private
      */
     async transact(transactionType, features, layerName) {
-        features = Array.isArray(features) ? features : [features];
+        features = (Array.isArray(features) ? features : [features]);
         const clonedFeatures = [];
         const geoLayer = getStoredLayer(layerName);
         for (const feature of features) {
@@ -1748,7 +1690,7 @@ class Geoserver extends BaseObject {
             const cloneGeom = clone.getGeometry();
             // Ugly fix to support GeometryCollection on GML
             // See https://github.com/openlayers/openlayers/issues/4220
-            if (cloneGeom instanceof GeometryCollection) {
+            if (cloneGeom instanceof GeometryCollection$1) {
                 this._transformGeoemtryCollectionToGeometries(clone, cloneGeom);
             }
             else if (cloneGeom instanceof Circle$1) {
@@ -1804,10 +1746,10 @@ class Geoserver extends BaseObject {
                         srs === 'EPSG:4326'
                             ? 'urn:x-ogc:def:crs:EPSG:4326'
                             : srs;
-                    const describeFeatureType = geoLayer.getDescribeFeatureType()._parsed;
-                    if (!geoLayer) {
-                        throw new Error(I18N.errors.layerNotFound);
+                    if (!geoLayer || !geoLayer.getDescribeFeatureType()) {
+                        throw new Error(`${I18N.errors.layerNotFound}: "${layerName}"`);
                     }
+                    const describeFeatureType = geoLayer.getDescribeFeatureType()._parsed;
                     const options = {
                         featureNS: describeFeatureType.namespace,
                         featureType: layerName,
@@ -1847,10 +1789,7 @@ class Geoserver extends BaseObject {
                         transactionType !== TransactionType.Insert) {
                         payload = payload.replace(`</Transaction>`, `<LockId>${this._options.advanced.lockFeatureParams.lockId}</LockId></Transaction>`);
                     }
-                    const headers = {
-                        'Content-Type': 'text/xml',
-                        ...this.getHeaders()
-                    };
+                    const headers = Object.assign({ 'Content-Type': 'text/xml' }, this.getHeaders());
                     const response = await fetch(this.getUrl(), {
                         method: 'POST',
                         body: payload,
@@ -1860,20 +1799,22 @@ class Geoserver extends BaseObject {
                     if (!response.ok) {
                         throw new Error(I18N.errors.transaction + ' ' + response.status);
                     }
-                    const parseResponse = this._formatWFS.readTransactionResponse(await response.text());
+                    const responseStr = await response.text();
+                    const parseResponse = this._formatWFS.readTransactionResponse(responseStr);
+                    const wlayer = getStoredLayer(layerName);
                     if (!Object.keys(parseResponse).length) {
-                        const responseStr = await response.text();
                         const findError = String(responseStr).match(/<ows:ExceptionText>([\s\S]*?)<\/ows:ExceptionText>/);
                         if (findError) {
+                            if (wlayer instanceof WmsLayer) {
+                                this._removeFeatures(features);
+                            }
+                            // maybe remove tmp wms features here
                             throw new Error(findError[1]);
                         }
                     }
                     if (transactionType !== TransactionType.Delete) {
-                        for (const feature of features) {
-                            getEditLayer().getSource().removeFeature(feature);
-                        }
+                        this._removeFeatures(features);
                     }
-                    const wlayer = getStoredLayer(layerName);
                     wlayer.refresh();
                     showLoading(false);
                     this._insertFeatures = [];
@@ -1891,6 +1832,14 @@ class Geoserver extends BaseObject {
             }, 0);
         });
     }
+    /**
+     * @privatwe
+     */
+    _removeFeatures(features) {
+        for (const feature of features) {
+            getEditLayer().getSource().removeFeature(feature);
+        }
+    }
     /**
      *
      * @param feature
@@ -1964,6 +1913,7 @@ class Geoserver extends BaseObject {
                 // First, check if is a JSON (with errors)
                 const dataParsed = JSON.parse(data);
                 if ('exceptions' in dataParsed) {
+                    const error = new Error(parseError(dataParsed));
                     const exceptions = dataParsed.exceptions;
                     if (exceptions[0].code === 'CannotLockAllFeatures') {
                         // Maybe the Feature is already blocked, ant thats trigger error, so, we try one locking more time again
@@ -1971,11 +1921,11 @@ class Geoserver extends BaseObject {
                             this.lockFeature(featureId, layerName, 1);
                         }
                         else {
-                            showError(I18N.errors.lockFeature, exceptions);
+                            throw error;
                         }
                     }
                     else {
-                        showError(exceptions[0].text, exceptions);
+                        throw error;
                     }
                 }
             }
@@ -2030,12 +1980,12 @@ class EditOverlay extends Overlay {
             offset: [0, -40],
             stopEvent: true,
             element: (createElement("div", null,
-                createElement("div", { className: "ol-wfst--edit-button-cnt", onclick: () => {
+                createElement("div", { className: "ol-wfst--edit-button-cnt", onClick: () => {
                         this.dispatchEvent('editFields');
                     } },
                     createElement("button", { className: "ol-wfst--edit-button", type: "button", title: I18N.labels.editFields },
                         createElement("img", { src: img$1, alt: I18N.labels.editFields }))),
-                createElement("div", { className: "ol-wfst--edit-button-cnt", onclick: () => {
+                createElement("div", { className: "ol-wfst--edit-button-cnt", onClick: () => {
                         this.dispatchEvent('editGeom');
                     } },
                     createElement("button", { class: "ol-wfst--edit-button", type: "button", title: I18N.labels.editGeom },
@@ -2063,38 +2013,6 @@ const controlElement = document.createElement('div');
  * @param options Wfst options, see [Wfst Options](#options) for more details.
  */
 class Wfst extends Control {
-    _options;
-    _i18n;
-    // Ol
-    _map;
-    _view;
-    _viewport;
-    _initialized = false;
-    _layersControl;
-    _overlay;
-    // Interactions
-    _interactionWfsSelect;
-    _interactionSelectModify;
-    _collectionModify;
-    _interactionModify;
-    _interactionSnap;
-    _interactionDraw;
-    // Obserbable keys
-    _keyClickWms;
-    _keyRemove;
-    _keySelect;
-    // Controls
-    _controlApplyDiscardChanges;
-    _controlWidgetToolsDiv;
-    _selectDraw;
-    // State
-    _currentZoom;
-    _lastZoom;
-    // Editing
-    _editFeature;
-    _editFeatureOriginal;
-    _uploads;
-    _editFields;
     constructor(options) {
         super({
             target: null,
@@ -2104,6 +2022,7 @@ class Wfst extends Control {
                     this._init();
             }
         });
+        this._initialized = false;
         setLang(options.language, options.i18n);
         const defaultOptions = getDefaultOptions();
         this._options = deepObjectAssign(defaultOptions, options);
@@ -2338,13 +2257,13 @@ class Wfst extends Control {
         this._interactionModify = new Modify({
             style: () => {
                 if (getMode() === Modes.Edit) {
-                    return new Style({
-                        image: new Circle({
+                    return new Style$1({
+                        image: new CircleStyle({
                             radius: 6,
-                            fill: new Fill({
+                            fill: new Fill$1({
                                 color: '#ff0000'
                             }),
-                            stroke: new Stroke({
+                            stroke: new Stroke$1({
                                 width: 2,
                                 color: 'rgba(5, 5, 5, 0.9)'
                             })
@@ -2612,9 +2531,7 @@ class Wfst extends Control {
             }
         };
         if (confirm) {
-            const confirmModal = Modal.confirm(I18N.labels.confirmDelete, {
-                ...this._options.modal
-            });
+            const confirmModal = Modal.confirm(I18N.labels.confirmDelete, Object.assign({}, this._options.modal));
             confirmModal.show().once('dismiss', function (modal, ev, button) {
                 if (button && button.value) {
                     deleteEl();
@@ -2757,8 +2674,6 @@ class Wfst extends Control {
     }
 }
 class WfstEvent extends BaseEvent {
-    data;
-    layer;
     constructor(options) {
         super(options.type);
         this.layer = options.layer;
@@ -2766,5 +2681,5 @@ class WfstEvent extends BaseEvent {
     }
 }
 
-export { Geoserver, WfsLayer, WmsLayer, Wfst as default };
+export { Geoserver, WfsLayer, WfstEvent, WmsLayer, Wfst as default };
 //# sourceMappingURL=ol-wfst.js.map