@wizishop/wizi-block 4.2.31-beta → 4.2.34-beta

package/fesm2015/wizishop-wizi-block.js

@@ -23,10 +23,13 @@ import { NgScrollbarModule } from 'ngx-scrollbar';
 import { __awaiter } from 'tslib';
 import EditorJS from '@editorjs/editorjs';
 import iro from '@jaames/iro';
+import { basicSetup, EditorView } from 'codemirror';
+import { EditorState } from '@codemirror/state';
+import { html } from '@codemirror/lang-html';
 import { MonacoEditorModule } from 'ngx-monaco-editor';
 import { tileLayer, latLng, marker, icon } from 'leaflet';
-import places from 'places.js';
 import { LeafletModule } from '@asymmetrik/ngx-leaflet';
+import { GooglePlaceModule } from 'ngx-google-places-autocomplete';
 import { ColorPickerModule } from 'ngx-color-picker';
 
 class MediaConnectorService {
@@ -3123,7 +3126,7 @@ class ImagesSimpleService {
             'wb.blocks.FormContentDto.117',
         ], ['0', '0.25', '0.5', '1']);
         imgSimpleFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
-        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
+        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
         imgSimpleFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
         return imgSimpleFormDto;
     }
@@ -4113,7 +4116,7 @@ class TextBackgroundsSimpleService {
             'wb.blocks.FormContentDto.117',
         ], ['0', '0.25', '0.5', '1']);
         TextBackgroundsSimpleFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
-        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
+        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
         TextBackgroundsSimpleFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
         return TextBackgroundsSimpleFormDto;
     }
@@ -4188,7 +4191,7 @@ class TextBackgroundsWithTxtService {
             'wb.blocks.FormContentDto.117',
         ], ['0', '0.25', '0.5', '1']);
         formsDto.forms.push(parallaxSpeedImgSimpleContentDto);
-        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
+        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
         formsDto.forms.push(parallaxInvertedImgSimpleContentDto);
         return formsDto;
     }
@@ -4263,7 +4266,7 @@ class TextBackgroundsWithBannerService {
             'wb.blocks.FormContentDto.117',
         ], ['0', '0.25', '0.5', '1']);
         formsDto.forms.push(parallaxSpeedImgSimpleContentDto);
-        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
+        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
         formsDto.forms.push(parallaxInvertedImgSimpleContentDto);
         const colorContentDto = new FormsContentDto(FORM_NAME_COLOR, 'wb.blocks.FormContentDto.112', FORM_TYPE_COLOR, content[FORM_NAME_COLOR], '#122231', '');
         formsDto.forms.push(colorContentDto);
@@ -5683,7 +5686,7 @@ class ImagesBannerService {
             'wb.blocks.FormContentDto.117',
         ], ['0', '0.25', '0.5', '1']);
         imgBannerFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
-        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
+        const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
         imgBannerFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
         return imgBannerFormDto;
     }
@@ -9611,6 +9614,7 @@ class QuillComponent {
             },
             clipboard: {
                 matchers: [['BR', this.lineBreakMatcher]],
+                matchVisual: false,
             },
             keyboard: {
                 bindings: {
@@ -18648,6 +18652,13 @@ class EditorJSTool {
         const selection = this.currentSelection ? this.currentSelection : this.getSelection();
         return selection.anchorNode.parentElement.closest('.editorJs');
     }
+    findParentModifier() {
+        if (!this.parentEditor) {
+            this.parentEditor = this.findParentEditor();
+        }
+        return (this.parentEditor.querySelectorAll('.ce-block')[this.api.blocks.getCurrentBlockIndex()].querySelector('.ce-paragraph')
+            .children[0]);
+    }
     clear() {
         resetBlockFocus(this.parentEditor);
     }
@@ -18728,29 +18739,28 @@ class InlineStyleTool extends EditorJSTool {
                 : anchorNode.parentElement;
             const sameSelection = container && container.innerText === selection.toString();
             yield this.saveInlineSelection(container, true);
-            try {
-                // Link delete exception
-                if (this.linkDeletion) {
-                    yield this.replaceLink(selection, this.hasStyle(container));
+            console.log('=== inline tool execCommandStyle method ===');
+            console.log(this.hasStyle(container));
+            // Link delete exception
+            if (this.linkDeletion) {
+                yield this.replaceLink(selection, this.hasStyle(container));
+            }
+            else {
+                if (sameSelection &&
+                    !this.isContainer(this.textContainers, container) &&
+                    this.hasStyle(container) &&
+                    selection.toString() === this.hasStyle(container).innerText) {
+                    console.log('-> update selection');
+                    yield this.updateSelection(selection, this.hasStyle(container), action, this.textContainers);
                 }
                 else {
-                    if (sameSelection &&
-                        !this.isContainer(this.textContainers, container) &&
-                        this.hasStyle(container) &&
-                        selection.toString() === this.hasStyle(container).innerText) {
-                        yield this.updateSelection(selection, this.hasStyle(container), action, this.textContainers);
-                    }
-                    else {
-                        yield this.replaceSelection(this.getMostDescendantChild(container), action, selection, this.textContainers);
-                    }
-                }
-                yield this.cleanupContainer(selection, container, true);
-                if (this.modifiedContent) {
-                    yield this.resetInlineSelection(container, true);
+                    console.log('-> replace selection');
+                    yield this.replaceSelection(this.getMostDescendantChild(container), action, selection, this.textContainers);
                 }
             }
-            catch (error) {
-                console.warn('Inline Tool Error : ' + error);
+            yield this.cleanupContainer(selection, container, true);
+            if (this.modifiedContent) {
+                yield this.resetInlineSelection(container, true);
             }
         });
     }
@@ -18794,16 +18804,17 @@ class InlineStyleTool extends EditorJSTool {
     replaceSelection(container, action, selection, containers) {
         var _a;
         return __awaiter(this, void 0, void 0, function* () {
-            let parentContainer = this.hasStyle(container);
             const focusNode = selection.focusNode;
             let offsetContainer = focusNode.nodeType !== Node.TEXT_NODE && focusNode.nodeType !== Node.COMMENT_NODE
                 ? focusNode
                 : focusNode.parentElement;
+            let parentContainer = this.hasStyle(container);
             let offsetParentContainer = this.hasStyle(offsetContainer);
             if (parentContainer &&
                 parentContainer === offsetParentContainer &&
                 ((parentContainer.children.length > 0 && parentContainer.innerText !== parentContainer.children[0].textContent) ||
                     parentContainer.innerText !== selection.toString())) {
+                console.log('if');
                 const range = this.getRangeObject(selection);
                 const currentFragment = range.extractContents();
                 const currentElement = document.createElement('span');
@@ -18845,14 +18856,19 @@ class InlineStyleTool extends EditorJSTool {
                 newElement.appendChild(preFragment);
                 parentContainer.parentElement.insertBefore(currentElementToAppend, parentContainer);
                 parentContainer.parentElement.insertBefore(newElement, currentElementToAppend);
+                if (!parentContainer.textContent || parentContainer.textContent.length === 0) {
+                    parentContainer.parentElement.removeChild(parentContainer);
+                }
                 selection.selectAllChildren(currentElementToAppend);
             }
             else {
+                console.log('else');
                 const range = this.getRangeObject(selection);
                 const fragment = range.extractContents();
                 let fragmentElement = document.createElement('div');
                 let newElement = yield this.createElement(container, action, containers);
                 let elementToAppend = newElement;
+                console.log(newElement);
                 fragmentElement.append(fragment);
                 if (((_a = fragmentElement.children) === null || _a === void 0 ? void 0 : _a.length) === 1 &&
                     this.textContainers.split(',').indexOf(fragmentElement.children[0].tagName.toLowerCase()) > -1) {
@@ -19024,8 +19040,28 @@ class InlineStyleTool extends EditorJSTool {
             }
         });
     }
+    parentHasStyle(currentElement, referenceElement) {
+        // Link exception
+        if (!currentElement || referenceElement.tagName.toLowerCase() === 'a' || referenceElement.tagName.toLowerCase() === 'div') {
+            return false;
+        }
+        if (referenceElement.tagName.toLowerCase() !== 'span' &&
+            referenceElement.tagName.toLowerCase() === currentElement.tagName.toLowerCase()) {
+            return true;
+        }
+        if (Object.keys(this.getInlineStyle(currentElement)).length > 0 && this.identicalInlineStyle(currentElement, referenceElement)) {
+            return true;
+        }
+        if (currentElement.classList.length > 0 && this.identicalClassList(currentElement, referenceElement)) {
+            return true;
+        }
+        if (currentElement.parentElement && currentElement.parentElement.tagName.toLowerCase() !== 'div') {
+            return this.parentHasStyle(currentElement.parentElement, referenceElement);
+        }
+        return false;
+    }
     cleanupContainer(selection, container, firstTimeCall) {
-        var _a, _b;
+        var _a;
         return __awaiter(this, void 0, void 0, function* () {
             let parentContainer;
             let parentFound = false;
@@ -19050,51 +19086,59 @@ class InlineStyleTool extends EditorJSTool {
             const children = Array.from(parentContainer.childNodes);
             if ((children === null || children === void 0 ? void 0 : children.length) > 0) {
                 for (var currentNode = children[0]; currentNode; currentNode = currentNode.nextSibling) {
-                    console.log('currentNode');
-                    console.log(currentNode);
-                    console.log(currentNode.textContent);
-                    console.log((_b = currentNode.textContent) === null || _b === void 0 ? void 0 : _b.length);
-                    if (!currentNode.textContent || currentNode.textContent.length === 0) {
+                    if (!currentNode.textContent ||
+                        currentNode.textContent.length === 0 ||
+                        (currentNode.nodeType === Node.ELEMENT_NODE && currentNode.innerText.length === 0)) {
+                        let previousSibling = currentNode.previousSibling;
                         parentContainer.removeChild(currentNode);
+                        currentNode = previousSibling;
                     }
-                    else {
-                        if (currentNode.childNodes.length > 0) {
-                            yield this.cleanupContainer(selection, currentNode, false);
+                    if (currentNode.nodeType === Node.ELEMENT_NODE &&
+                        this.parentHasStyle(currentNode.parentElement, currentNode)) {
+                        let currentNodeFirstChild = currentNode;
+                        let nextCurrentElement = currentNode.firstChild;
+                        while (currentNode.firstChild) {
+                            parentContainer.insertBefore(currentNode.firstChild, currentNodeFirstChild.nextSibling);
+                            currentNodeFirstChild = currentNodeFirstChild.nextSibling;
                         }
-                        let identicalElements = true;
-                        while (identicalElements &&
-                            currentNode.nextSibling &&
-                            currentNode.nodeType === Node.ELEMENT_NODE &&
-                            currentNode.nextSibling.nodeType === Node.ELEMENT_NODE) {
-                            let currentElement = currentNode;
-                            let nextElement = currentNode.nextSibling;
-                            if (this.identicalInlineStyle(currentElement, nextElement) &&
-                                currentElement.tagName.toLowerCase() === nextElement.tagName.toLowerCase() &&
-                                this.identicalClassList(currentElement, nextElement) &&
-                                !currentElement.hasAttributes() &&
-                                !nextElement.hasAttributes()) {
-                                currentElement.innerHTML += nextElement.innerHTML;
-                                nextElement.remove();
-                                this.modifiedContent = true;
-                            }
-                            else {
-                                identicalElements = false;
-                            }
-                        }
-                        if (currentNode.nodeType === Node.ELEMENT_NODE &&
-                            currentNode.tagName.toLowerCase() === 'span' &&
-                            Object.keys(this.getInlineStyle(currentNode)).length === 0 &&
-                            (!currentNode.classList || currentNode.classList.length === 0) &&
-                            this.hasNoAttributes(currentNode)) {
-                            let currentNodeFirstChild = currentNode;
-                            while (currentNode.firstChild) {
-                                currentNodeFirstChild.parentElement.insertBefore(currentNode.firstChild, currentNodeFirstChild.nextSibling);
-                                currentNodeFirstChild = currentNodeFirstChild.nextSibling;
-                            }
-                            currentNode.remove();
+                        parentContainer.removeChild(currentNode);
+                        currentNode = nextCurrentElement;
+                    }
+                    let identicalElements = true;
+                    while (identicalElements &&
+                        currentNode.nextSibling &&
+                        currentNode.nodeType === Node.ELEMENT_NODE &&
+                        currentNode.nextSibling.nodeType === Node.ELEMENT_NODE) {
+                        let currentElement = currentNode;
+                        let nextElement = currentNode.nextSibling;
+                        if (this.identicalInlineStyle(currentElement, nextElement) &&
+                            currentElement.tagName.toLowerCase() === nextElement.tagName.toLowerCase() &&
+                            this.identicalClassList(currentElement, nextElement) &&
+                            this.identicalAttributes(currentElement, nextElement)) {
+                            currentElement.innerHTML += nextElement.innerHTML;
+                            nextElement.remove();
                             this.modifiedContent = true;
                         }
-                        currentNode.normalize();
+                        else {
+                            identicalElements = false;
+                        }
+                    }
+                    if (currentNode.nodeType === Node.ELEMENT_NODE &&
+                        currentNode.tagName.toLowerCase() === 'span' &&
+                        Object.keys(this.getInlineStyle(currentNode)).length === 0 &&
+                        (!currentNode.classList || currentNode.classList.length === 0) &&
+                        this.hasNoAttributes(currentNode)) {
+                        let currentNodeFirstChild = currentNode;
+                        while (currentNode.firstChild) {
+                            currentNodeFirstChild.parentElement.insertBefore(currentNode.firstChild, currentNodeFirstChild.nextSibling);
+                            currentNodeFirstChild = currentNodeFirstChild.nextSibling;
+                        }
+                        currentNode.remove();
+                        this.modifiedContent = true;
+                    }
+                    currentNode.normalize();
+                    if (currentNode.childNodes.length > 0) {
+                        yield this.cleanupContainer(selection, currentNode, false);
                     }
                 }
             }
@@ -19114,6 +19158,18 @@ class InlineStyleTool extends EditorJSTool {
         return ([...currentElement.classList].every((classList) => nextElement.classList.contains(classList)) &&
             [...nextElement.classList].every((classList) => currentElement.classList.contains(classList)));
     }
+    identicalAttributes(currentElement, nextElement) {
+        let currentElementAttributes = currentElement.getAttributeNames();
+        currentElementAttributes.forEach((attribute) => {
+            if (attribute !== 'style') {
+                if (!nextElement.getAttribute(attribute) ||
+                    nextElement.getAttribute(attribute) !== currentElement.getAttribute(attribute)) {
+                    return false;
+                }
+            }
+        });
+        return true;
+    }
     identicalInlineStyle(currentElement, nextElement) {
         const currentElementInlineStyle = this.getInlineStyle(currentElement);
         const nextElementInlineStyle = this.getInlineStyle(nextElement);
@@ -19167,9 +19223,10 @@ class InlineStyleTool extends EditorJSTool {
             let nextNode = container.firstChild;
             while (nextNode && (!this.foundAnchorNode || !this.foundFocusNode)) {
                 if (nextNode === this.selectedAnchorNode) {
-                    this.foundAnchorNode = true;
-                    this.foundAnchorOffset += this.anchorOffset;
                     let selection = this.getSelection();
+                    const isLTR = this.isAnchorBeforeFocus(selection.anchorNode, selection.anchorOffset, selection.focusNode, selection.focusOffset);
+                    this.foundAnchorNode = true;
+                    this.foundAnchorOffset += isLTR ? this.anchorOffset : this.focusOffset;
                     let range = this.getRangeObject(selection);
                     const currentFragment = range.cloneContents();
                     const currentElement = document.createElement('span');
@@ -20549,7 +20606,7 @@ class ParagraphStyleTool extends EditorJSTool {
             if (!anchorNode) {
                 return;
             }
-            let parentModifier = this.findParentModifier(anchorNode.parentElement);
+            let parentModifier = this.findParentModifier();
             try {
                 if (this.tag.toLowerCase() !== 'span') {
                     this.changeContainerTag(parentModifier, selection);
@@ -20684,22 +20741,6 @@ class ParagraphStyleTool extends EditorJSTool {
             container.className += (container.className.length > 0 ? ' ' : '') + this.classToApply;
         }
     }
-    findParentModifier(element) {
-        let currentElement = element;
-        if (currentElement.tagName.toLowerCase() === 'div') {
-            if (currentElement.classList.contains('ce-paragraph')) {
-                return currentElement.children[0];
-            }
-            return currentElement.closest('.codex-editor__redactor').querySelector('.ce-paragraph').children[0];
-        }
-        while (this.modifiers.split(',').indexOf(currentElement.tagName.toLowerCase()) === -1) {
-            if (currentElement.tagName.toLowerCase() === 'div') {
-                return null;
-            }
-            currentElement = currentElement.parentElement;
-        }
-        return currentElement;
-    }
 }
 var listApi = null;
 var listEditor = null;
@@ -20996,7 +21037,7 @@ class TextTypeTool extends ParagraphTextTool {
         if (!isBlockFocused) {
             setBlockFocus(this.parentEditor);
         }
-        const parentModifier = this.findParentModifier(selection.anchorNode.parentElement);
+        const parentModifier = this.findParentModifier();
         if (!parentModifier) {
             return false;
         }
@@ -21271,7 +21312,7 @@ class TextAlignTool extends ParagraphTextTool {
         if (!isBlockFocused) {
             setBlockFocus(this.parentEditor);
         }
-        const parentModifier = this.findParentModifier(selection.anchorNode.parentElement);
+        const parentModifier = this.findParentModifier();
         if (!parentModifier) {
             return false;
         }
@@ -21375,7 +21416,7 @@ class UnorderedListTool extends ParagraphStyleTool {
         if (!isBlockFocused) {
             setBlockFocus(this.parentEditor);
         }
-        const parentModifier = this.findParentModifier(selection.anchorNode.parentElement);
+        const parentModifier = this.findParentModifier();
         if (!parentModifier) {
             return false;
         }
@@ -21440,7 +21481,7 @@ class OrderedListTool extends ParagraphStyleTool {
         if (!isBlockFocused) {
             setBlockFocus(this.parentEditor);
         }
-        const parentModifier = this.findParentModifier(selection.anchorNode.parentElement);
+        const parentModifier = this.findParentModifier();
         if (!parentModifier) {
             return false;
         }
@@ -21505,7 +21546,7 @@ class QuoteTool extends ParagraphStyleTool {
         if (!isBlockFocused) {
             setBlockFocus(this.parentEditor);
         }
-        const parentModifier = this.findParentModifier(selection.anchorNode.parentElement);
+        const parentModifier = this.findParentModifier();
         if (!parentModifier) {
             return false;
         }
@@ -22040,23 +22081,6 @@ class InlineTextTool extends InlineStyleTool {
             return true;
         }
     }
-    findParentModifier(element) {
-        const modifiers = 'h1,h2,h3,h4,h5,h6,p,ul,ol,blockquote';
-        let currentElement = element;
-        if (currentElement.tagName.toLowerCase() === 'div') {
-            if (currentElement.classList.contains('ce-paragraph')) {
-                return currentElement.firstElementChild;
-            }
-            return currentElement.querySelector('.ce-paragraph').children[0];
-        }
-        while (modifiers.split(',').indexOf(currentElement.tagName.toLowerCase()) === -1) {
-            if (currentElement.tagName.toLowerCase() === 'div') {
-                return null;
-            }
-            currentElement = currentElement.parentElement;
-        }
-        return currentElement;
-    }
 }
 
 // @dynamic
@@ -22256,21 +22280,17 @@ class TextEditionTool extends ParagraphStyleTool {
         modal.appendChild(editorContainer);
         modal.appendChild(buttonContainer);
         container.appendChild(modal);
-        document.querySelector('body').appendChild(container);
-        setTimeout(() => {
-            console.log('monacoeditor init');
-            console.log(modal);
-            var monacoEditor = editor.create(editorContainer, {
-                value: content,
-                language: 'html',
-                ariaContainerElement: modal
-            });
-            saveButton.addEventListener('click', () => {
-                let content = monacoEditor.getValue();
-                saveCodeEditModal(content);
-            }, true);
-            buttonContainer.appendChild(saveButton);
-        }, 200);
+        document.body.appendChild(container);
+        let state = EditorState.create({
+            doc: content,
+            extensions: [basicSetup, html()],
+        });
+        let view = new EditorView({
+            state: state,
+            parent: editorContainer,
+        });
+        saveButton.addEventListener('click', () => saveCodeEditModal(view.state.doc.toString()), true);
+        buttonContainer.appendChild(saveButton);
     }
     getSavedEditorContent(name) {
         return localStorage.getItem(name);
@@ -22759,6 +22779,7 @@ class EditorJsComponent {
         this.timeoutHandle = null;
         this.timeoutTextEditionHandle = null;
         this.onChangeTimeoutHandle = null;
+        this.editorInitialized = false;
         this.wrapperTags = 'h1,h2,h3,h4,h5,h6,p,ul,ol,blockquote';
     }
     ngOnInit() {
@@ -22820,7 +22841,7 @@ class EditorJsComponent {
                     clearTimeout(this.onChangeTimeoutHandle);
                     this.onChangeTimeoutHandle = setTimeout(() => {
                         this.contentChanged(api, event);
-                    }, 300);
+                    }, 200);
                 },
                 i18n: this.getI18nDictionnary(),
             });
@@ -22831,12 +22852,10 @@ class EditorJsComponent {
                     this.content = content;
                     this.applyContent();
                     this.checkSingleChild();
-                    setTimeout(() => {
-                        const editorElement = document.getElementById('editorJs-' + this.uuid);
-                        editorElement.addEventListener('focusin', () => {
-                            setlistApiEditor(this.editor, editorElement);
-                        });
-                    }, 0);
+                    const editorElement = document.getElementById('editorJs-' + this.uuid);
+                    editorElement.addEventListener('focusin', () => {
+                        setlistApiEditor(this.editor, editorElement);
+                    });
                 });
             }
             catch (reason) {
@@ -22847,7 +22866,6 @@ class EditorJsComponent {
     ngOnDestroy() {
         const editorName = 'editorJs-' + this.uuid;
         this.deleteSavedEditorContent(editorName);
-        this.deleteSavedEditorContent(editorName);
         this.editor.destroy();
     }
     handleDefaultContentTranslation() {
@@ -22864,7 +22882,13 @@ class EditorJsComponent {
                     .save()
                     .then(() => {
                     this.content = this.getEditorContent();
-                    this.saveEditorContent(this.content, this.uuid);
+                    if (!this.editorInitialized) {
+                        this.handleSaveEditor(this.content, this.uuid);
+                        this.editorInitialized = true;
+                    }
+                    else {
+                        this.saveEditorContent(this.content);
+                    }
                     this.contentChange.emit(this.content);
                 })
                     .catch((error) => {
@@ -23006,11 +23030,11 @@ class EditorJsComponent {
         }
         return null;
     }
-    saveEditorContent(data, uuid) {
+    saveEditorContent(data) {
         if (!isTextEditionTool) {
             clearTimeout(this.timeoutHandle);
             this.timeoutHandle = setTimeout(() => {
-                this.handleSaveEditor(data, uuid);
+                this.handleSaveEditor(data, this.uuid);
             }, 2000);
         }
         else {
@@ -23026,6 +23050,10 @@ class EditorJsComponent {
         let savedDataIndex = this.getSavedEditorContent(editorName + '-index')
             ? parseInt(this.getSavedEditorContent(editorName + '-index'))
             : -1;
+        if (!this.editorInitialized) {
+            savedData = null;
+            savedDataIndex = -1;
+        }
         let parsedSavedData = [];
         if (savedData) {
             parsedSavedData = JSON.parse(savedData);
@@ -23047,6 +23075,7 @@ class EditorJsComponent {
     }
     deleteSavedEditorContent(name) {
         localStorage.removeItem(name);
+        localStorage.removeItem(name + '-index');
     }
 }
 EditorJsComponent.decorators = [
@@ -26432,15 +26461,14 @@ QuotesSimpleBackgroundComponent.decorators = [
 ];
 QuotesSimpleBackgroundComponent.ctorParameters = () => [];
 
-class OpenMapDto {
-}
-
 class MapFullpageComponent extends StructuresComponent {
     constructor(externalConfigService) {
         super();
         this.externalConfigService = externalConfigService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26449,40 +26477,29 @@ class MapFullpageComponent extends StructuresComponent {
     ngOnInit() {
         super.ngOnInit();
         if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
-            const algolia = new OpenMapDto();
-            algolia.suggestion = {
-                latlng: {
-                    lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
-                    lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+            this.googleMapReturnElement = {
+                suggestion: {
+                    latlng: {
+                        lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
+                        lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+                    },
+                    value: '',
                 },
-                value: '',
             };
-            this.setCoordinateOnPlaces(algolia);
+            this.setCoordinateOnPlaces(this.googleMapReturnElement);
         }
     }
-    ngAfterViewInit() {
-        if (!this.showMap) {
-            const placesAutocomplete = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: this.input.nativeElement,
-            });
-            placesAutocomplete.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
-    }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
             layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -26491,23 +26508,23 @@ class MapFullpageComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
     }
     /**
      * Avoid partial map loaded at the initialization
@@ -26522,7 +26539,7 @@ class MapFullpageComponent extends StructuresComponent {
 MapFullpageComponent.decorators = [
     { type: Component, args: [{
                 selector: MapFullpageService.selector(),
-                template: "<div class=\"wb-map-fullpage\">\n    <div class=\"wb-map-fullpage__container\">\n        <div *ngIf=\"showMap\">\n            <div class=\"wb-map-fullpage__container__config\">\n                <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" (click)=\"createEditAlgoliaInput()\">\n                    <p>{{ 'wb.structures.template.19' | translate }}</p>\n                    <input\n                        id=\"address-input-edit{{ uuid }}\"\n                        type=\"text\"\n                        [(ngModel)]=\"address\"\n                        #myInputEdit\n                        (click)=\"myInputEdit.select()\"\n                    />\n                </wb-structure-config>\n            </div>\n            <div class=\"wb-map-fullpage__cover\"></div>\n            <div\n                class=\"wb-map-fullpage__container__map\"\n                leaflet\n                [leafletOptions]=\"options\"\n                [leafletLayers]=\"layers\"\n                [(leafletCenter)]=\"center\"\n                (leafletMapReady)=\"onMapReady($event)\"\n            ></div>\n        </div>\n    </div>\n    <div class=\"wb-map-fullpage__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-fullpage\">\n    <div class=\"wb-map-fullpage__container\">\n        <div *ngIf=\"showMap\">\n            <div class=\"wb-map-fullpage__container__config\">\n                <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\">\n                    <p>{{ 'wb.structures.template.19' | translate }}</p>\n                    <input\n                        id=\"address-input-edit{{ uuid }}\"\n                        type=\"text\"\n                        [(ngModel)]=\"address\"\n                        #myInputEdit\n                        (click)=\"myInputEdit.select()\"\n                        ngx-google-places-autocomplete\n                        (onAddressChange)=\"handleAddressChange($event)\"\n                    />\n                </wb-structure-config>\n            </div>\n            <div class=\"wb-map-fullpage__cover\"></div>\n            <div\n                class=\"wb-map-fullpage__container__map\"\n                leaflet\n                [leafletOptions]=\"options\"\n                [leafletLayers]=\"layers\"\n                [(leafletCenter)]=\"center\"\n                (leafletMapReady)=\"onMapReady($event)\"\n            ></div>\n        </div>\n    </div>\n    <div class=\"wb-map-fullpage__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input\n            id=\"address-input{{ uuid }}\"\n            type=\"text\"\n            [(ngModel)]=\"address\"\n            #myInput\n            (click)=\"myInput.select()\"\n            ngx-google-places-autocomplete\n            (onAddressChange)=\"handleAddressChange($event)\"\n        />\n    </div>\n</div>\n"
             },] }
 ];
 MapFullpageComponent.ctorParameters = () => [
@@ -26537,7 +26554,9 @@ class MapLeftTextComponent extends StructuresComponent {
         super();
         this.externalConfigService = externalConfigService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26546,40 +26565,29 @@ class MapLeftTextComponent extends StructuresComponent {
     ngOnInit() {
         super.ngOnInit();
         if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
-            const algolia = new OpenMapDto();
-            algolia.suggestion = {
-                latlng: {
-                    lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
-                    lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+            this.googleMapReturnElement = {
+                suggestion: {
+                    latlng: {
+                        lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
+                        lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+                    },
+                    value: '',
                 },
-                value: '',
             };
-            this.setCoordinateOnPlaces(algolia);
-        }
-    }
-    ngAfterViewInit() {
-        if (!this.showMap) {
-            const placesAutocomplete = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: this.input.nativeElement,
-            });
-            placesAutocomplete.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
+            this.setCoordinateOnPlaces(this.googleMapReturnElement);
         }
     }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
             layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -26588,23 +26596,23 @@ class MapLeftTextComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
     }
     /**
      * Avoid partial map loaded at the initialization
@@ -26619,7 +26627,7 @@ class MapLeftTextComponent extends StructuresComponent {
 MapLeftTextComponent.decorators = [
     { type: Component, args: [{
                 selector: MapLeftTextService.selector(),
-                template: "<div class=\"wb-map-left-text\">\n    <div class=\"columns is-gapless\">\n        <div class=\"column\">\n            <div class=\"wb-map-left-text__addresses\">\n                <div class=\"wb-map-left-text__address\">\n                    <wb-editorjs\n                        [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                        (contentChange)=\"persist()\"\n                        [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                    >\n                    </wb-editorjs>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-left-text__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-left-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div class=\"wb-map-left-text__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-left-text__container__config\">\n                        <wb-structure-config\n                            [blockUUID]=\"uuid\"\n                            [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n                            (click)=\"createEditAlgoliaInput()\"\n                            [isFullwidth]=\"true\"\n                        >\n                            <p>{{ 'wb.structures.template.19' | translate }}</p>\n                            <input\n                                id=\"address-input-edit{{ uuid }}\"\n                                type=\"text\"\n                                [(ngModel)]=\"address\"\n                                #myInputEdit\n                                (click)=\"myInputEdit.select()\"\n                            />\n                        </wb-structure-config>\n                    </div>\n                    <div class=\"wb-map-left-text__cover\"></div>\n                    <div\n                        class=\"wb-map-left-text__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n            <div class=\"wb-map-left-text__selector\" *ngIf=\"!showMap\">\n                <p>{{ 'wb.structures.template.19' | translate }}</p>\n                <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n            </div>\n        </div>\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-left-text\">\n    <div class=\"columns is-gapless\">\n        <div class=\"column\">\n            <div class=\"wb-map-left-text__addresses\">\n                <div class=\"wb-map-left-text__address\">\n                    <wb-editorjs\n                        [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                        (contentChange)=\"persist()\"\n                        [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                    >\n                    </wb-editorjs>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-left-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-left-text__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-left-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-left-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div class=\"wb-map-left-text__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-left-text__container__config\">\n                        <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n                            <p>{{ 'wb.structures.template.19' | translate }}</p>\n                            <input\n                                id=\"address-input-edit{{ uuid }}\"\n                                type=\"text\"\n                                [(ngModel)]=\"address\"\n                                #myInputEdit\n                                (click)=\"myInputEdit.select()\"\n                                ngx-google-places-autocomplete\n                                (onAddressChange)=\"handleAddressChange($event)\"\n                            />\n                        </wb-structure-config>\n                    </div>\n                    <div class=\"wb-map-left-text__cover\"></div>\n                    <div\n                        class=\"wb-map-left-text__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n            <div class=\"wb-map-left-text__selector\" *ngIf=\"!showMap\">\n                <p>{{ 'wb.structures.template.19' | translate }}</p>\n                <input\n                    id=\"address-input{{ uuid }}\"\n                    type=\"text\"\n                    [(ngModel)]=\"address\"\n                    #myInput\n                    (click)=\"myInput.select()\"\n                    ngx-google-places-autocomplete\n                    (onAddressChange)=\"handleAddressChange($event)\"\n                />\n            </div>\n        </div>\n    </div>\n</div>\n"
             },] }
 ];
 MapLeftTextComponent.ctorParameters = () => [
@@ -26634,7 +26642,9 @@ class MapRightTextComponent extends StructuresComponent {
         super();
         this.externalConfigService = externalConfigService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26643,40 +26653,29 @@ class MapRightTextComponent extends StructuresComponent {
     ngOnInit() {
         super.ngOnInit();
         if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
-            const algolia = new OpenMapDto();
-            algolia.suggestion = {
-                latlng: {
-                    lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
-                    lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+            this.googleMapReturnElement = {
+                suggestion: {
+                    latlng: {
+                        lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
+                        lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
+                    },
+                    value: '',
                 },
-                value: '',
             };
-            this.setCoordinateOnPlaces(algolia);
+            this.setCoordinateOnPlaces(this.googleMapReturnElement);
         }
     }
-    ngAfterViewInit() {
-        if (!this.showMap) {
-            const placesAutocomplete = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: this.input.nativeElement,
-            });
-            placesAutocomplete.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
-    }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
             layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -26685,23 +26684,23 @@ class MapRightTextComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
     }
     /**
      * Avoid partial map loaded at the initialization
@@ -26716,7 +26715,7 @@ class MapRightTextComponent extends StructuresComponent {
 MapRightTextComponent.decorators = [
     { type: Component, args: [{
                 selector: MapRightTextService.selector(),
-                template: "<div class=\"wb-map-right-text\">\n    <div class=\"columns is-gapless\">\n        <div class=\"column\">\n            <div class=\"wb-map-right-text__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-right-text__container__config\">\n                        <wb-structure-config\n                            [blockUUID]=\"uuid\"\n                            [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n                            (click)=\"createEditAlgoliaInput()\"\n                            [isFullwidth]=\"true\"\n                        >\n                            <p>{{ 'wb.structures.template.19' | translate }}</p>\n                            <input\n                                id=\"address-input-edit{{ uuid }}\"\n                                type=\"text\"\n                                [(ngModel)]=\"address\"\n                                #myInputEdit\n                                (click)=\"myInputEdit.select()\"\n                            />\n                        </wb-structure-config>\n                    </div>\n                    <div class=\"wb-map-right-text__cover\"></div>\n                    <div\n                        class=\"wb-map-right-text__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n            <div class=\"wb-map-right-text__selector\" *ngIf=\"!showMap\">\n                <p>{{ 'wb.structures.template.19' | translate }}</p>\n                <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n            </div>\n        </div>\n        <div class=\"column\">\n            <div class=\"wb-map-right-text__addresses\">\n                <div class=\"wb-map-right-text__address\">\n                    <wb-editorjs\n                        [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                        (contentChange)=\"persist()\"\n                        [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                    >\n                    </wb-editorjs>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-right-text__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-right-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-right-text\">\n    <div class=\"columns is-gapless\">\n        <div class=\"column\">\n            <div class=\"wb-map-right-text__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-right-text__container__config\">\n                        <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n                            <p>{{ 'wb.structures.template.19' | translate }}</p>\n                            <input\n                                id=\"address-input-edit{{ uuid }}\"\n                                type=\"text\"\n                                [(ngModel)]=\"address\"\n                                #myInputEdit\n                                (click)=\"myInputEdit.select()\"\n                                ngx-google-places-autocomplete\n                                (onAddressChange)=\"handleAddressChange($event)\"\n                            />\n                        </wb-structure-config>\n                    </div>\n                    <div class=\"wb-map-right-text__cover\"></div>\n                    <div\n                        class=\"wb-map-right-text__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n            <div class=\"wb-map-right-text__selector\" *ngIf=\"!showMap\">\n                <p>{{ 'wb.structures.template.19' | translate }}</p>\n                <input\n                    id=\"address-input{{ uuid }}\"\n                    type=\"text\"\n                    [(ngModel)]=\"address\"\n                    #myInput\n                    (click)=\"myInput.select()\"\n                    ngx-google-places-autocomplete\n                    (onAddressChange)=\"handleAddressChange($event)\"\n                />\n            </div>\n        </div>\n        <div class=\"column\">\n            <div class=\"wb-map-right-text__addresses\">\n                <div class=\"wb-map-right-text__address\">\n                    <wb-editorjs\n                        [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                        (contentChange)=\"persist()\"\n                        [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                    >\n                    </wb-editorjs>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-right-text__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-right-text__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-right-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-right-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
             },] }
 ];
 MapRightTextComponent.ctorParameters = () => [
@@ -26726,13 +26725,18 @@ MapRightTextComponent.propDecorators = {
     input: [{ type: ViewChild, args: ['myInput',] }]
 };
 
+class OpenMapDto {
+}
+
 class MapTextFormComponent extends StructuresComponent {
     constructor(apiService, externalConfigService) {
         super();
         this.apiService = apiService;
         this.externalConfigService = externalConfigService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26766,29 +26770,17 @@ class MapTextFormComponent extends StructuresComponent {
             }
         });
     }
-    ngAfterViewInit() {
-        if (!this.showMap) {
-            const placesAutocomplete = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: this.input.nativeElement,
-            });
-            placesAutocomplete.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
-    }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
-            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
+            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -26797,23 +26789,32 @@ class MapTextFormComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: this.externalConfigService.getAlgoliaAppId(),
-                apiKey: this.externalConfigService.getAlgoliaApiKey(),
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
+    }
+    /**
+     * Avoid partial map loaded at the initialization
+     * @param map
+     */
+    onMapReady(map) {
+        setTimeout(() => {
+            map.invalidateSize();
+        }, 0);
     }
     selectThisForm() {
         if (this.selectedValue === null) {
@@ -26825,20 +26826,11 @@ class MapTextFormComponent extends StructuresComponent {
         this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
         this.persist();
     }
-    /**
-     * Avoid partial map loaded at the initialization
-     * @param map
-     */
-    onMapReady(map) {
-        setTimeout(() => {
-            map.invalidateSize();
-        }, 0);
-    }
 }
 MapTextFormComponent.decorators = [
     { type: Component, args: [{
                 selector: MapTextFormService.selector(),
-                template: "<div class=\"wb-map-text-form\">\n    <div class=\"wb-map-text-form__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config\n            [blockUUID]=\"uuid\"\n            [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\"\n            (click)=\"createEditAlgoliaInput()\"\n            [isFullwidth]=\"true\"\n        >\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-text-form__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div class=\"wb-map-text-form__addresses\">\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-text-form__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-text-form__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n            <div class=\"wb-map-text-form__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-text-form__cover\"></div>\n                    <div\n                        class=\"wb-map-text-form__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-text-form__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-text-form__selector\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-text-form__container-form\">\n                <div class=\"wb-map-text-form__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-text-form__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-text-form\">\n    <div class=\"wb-map-text-form__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" [isFullwidth]=\"true\">\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input\n                id=\"address-input-edit{{ uuid }}\"\n                type=\"text\"\n                [(ngModel)]=\"address\"\n                #myInputEdit\n                (click)=\"myInputEdit.select()\"\n                ngx-google-places-autocomplete\n                (onAddressChange)=\"handleAddressChange($event)\"\n            />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-text-form__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input\n            id=\"address-input{{ uuid }}\"\n            type=\"text\"\n            [(ngModel)]=\"address\"\n            #myInput\n            (click)=\"myInput.select()\"\n            ngx-google-places-autocomplete\n            (onAddressChange)=\"handleAddressChange($event)\"\n        />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div class=\"wb-map-text-form__addresses\">\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"columns is-gapless\">\n                    <div class=\"column is-1\">\n                        <wb-structure-config-font\n                            [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n                            [white]=\"false\"\n                            [isSmall]=\"true\"\n                            [withImage]=\"false\"\n                            (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n                        ></wb-structure-config-font>\n                    </div>\n                    <div class=\"column\">\n                        <div class=\"wb-map-text-form__address\">\n                            <wb-editorjs\n                                [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n                                (contentChange)=\"persist()\"\n                                [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                            >\n                            </wb-editorjs>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div\n                class=\"wb-map-text-form__social\"\n                *ngIf=\"\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n                    contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n                \"\n            >\n                <div class=\"wb-map-text-form__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n                    <i class=\"fab fa-facebook-f\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n                    <i class=\"fab fa-twitter\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n                    <i class=\"fab fa-pinterest-p\"></i>\n                </div>\n                <div class=\"wb-map-text-form__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n                    <i class=\"fab fa-instagram\"></i>\n                </div>\n            </div>\n            <div class=\"wb-map-text-form__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-text-form__cover\"></div>\n                    <div\n                        class=\"wb-map-text-form__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-text-form__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-text-form__selector\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-text-form__container-form\">\n                <div class=\"wb-map-text-form__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-text-form__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
             },] }
 ];
 MapTextFormComponent.ctorParameters = () => [
@@ -26854,7 +26846,9 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
         super();
         this.apiService = apiService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26877,27 +26871,17 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
             }
         });
     }
-    ngAfterViewInit() {
-        const placesAutocomplete = places({
-            appId: 'pl9OI1NPY62Y',
-            apiKey: '290e5a0e33e751c85c36690d502991fc',
-            container: this.input.nativeElement,
-        });
-        placesAutocomplete.on('change', (algoliaReturnElement) => {
-            this.setCoordinateOnPlaces(algoliaReturnElement);
-        });
-    }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
-            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
+            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -26906,23 +26890,32 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: 'pl9OI1NPY62Y',
-                apiKey: '290e5a0e33e751c85c36690d502991fc',
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
+    }
+    /**
+     * Avoid partial map loaded at the initialization
+     * @param map
+     */
+    onMapReady(map) {
+        setTimeout(() => {
+            map.invalidateSize();
+        }, 0);
     }
     selectThisForm() {
         if (this.selectedValue === null) {
@@ -26934,20 +26927,11 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
         this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
         this.persist();
     }
-    /**
-     * Avoid partial map loaded at the initialization
-     * @param map
-     */
-    onMapReady(map) {
-        setTimeout(() => {
-            map.invalidateSize();
-        }, 0);
-    }
 }
 MapBackgroundFormLeftComponent.decorators = [
     { type: Component, args: [{
                 selector: MapBackgroundFormLeftService.selector(),
-                template: "<div class=\"wb-map-background-form-left\">\n    <div class=\"wb-map-background-form-left__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config\n            [blockUUID]=\"uuid\"\n            [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n            (click)=\"createEditAlgoliaInput()\"\n            [isFullwidth]=\"true\"\n        >\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-background-form-left__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-left__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-background-form-left__selector-form\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-left__container-form\">\n                <div class=\"wb-map-background-form-left__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-background-form-left__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"wb-map-background-form-left__container\">\n                <div>\n                    <div class=\"wb-map-background-form-left__cover\"></div>\n                    <div\n                        class=\"wb-map-background-form-left__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-background-form-left\">\n    <div class=\"wb-map-background-form-left__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input\n                id=\"address-input-edit{{ uuid }}\"\n                type=\"text\"\n                [(ngModel)]=\"address\"\n                #myInputEdit\n                (click)=\"myInputEdit.select()\"\n                ngx-google-places-autocomplete\n                (onAddressChange)=\"handleAddressChange($event)\"\n            />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-background-form-left__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input\n            id=\"address-input{{ uuid }}\"\n            type=\"text\"\n            [(ngModel)]=\"address\"\n            #myInput\n            (click)=\"myInput.select()\"\n            ngx-google-places-autocomplete\n            (onAddressChange)=\"handleAddressChange($event)\"\n        />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-left__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-background-form-left__selector-form\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-left__container-form\">\n                <div class=\"wb-map-background-form-left__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-background-form-left__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"wb-map-background-form-left__container\">\n                <div>\n                    <div class=\"wb-map-background-form-left__cover\"></div>\n                    <div\n                        class=\"wb-map-background-form-left__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
             },] }
 ];
 MapBackgroundFormLeftComponent.ctorParameters = () => [
@@ -26962,7 +26946,9 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
         super();
         this.apiService = apiService;
         this.address = '';
+        this.triggerAddress = '';
         this.editPlaceMap = null;
+        this.firstTimeTrigger = false;
         this.options = {};
         this.layers = [];
         this.showMap = false;
@@ -26985,27 +26971,17 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
             }
         });
     }
-    ngAfterViewInit() {
-        const placesAutocomplete = places({
-            appId: 'pl9OI1NPY62Y',
-            apiKey: '290e5a0e33e751c85c36690d502991fc',
-            container: this.input.nativeElement,
-        });
-        placesAutocomplete.on('change', (algoliaReturnElement) => {
-            this.setCoordinateOnPlaces(algoliaReturnElement);
-        });
-    }
-    setCoordinateOnPlaces(algoliaReturnElement) {
+    setCoordinateOnPlaces(googleResults) {
         this.showMap = false;
         this.options = {
-            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
+            layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
             zoom: 18,
             zoomControl: false,
-            center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
+            center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
         };
-        this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
+        this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
         this.layers = [
-            marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
+            marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
                 icon: icon({
                     iconSize: [25, 41],
                     iconAnchor: [13, 41],
@@ -27014,23 +26990,32 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
                 }),
             }),
         ];
-        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
-        this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
-        this.address = algoliaReturnElement.suggestion.value;
+        this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
+        this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
+        this.address = googleResults.suggestion.value;
         this.showMap = true;
         this.persist();
     }
-    createEditAlgoliaInput() {
-        if (this.editPlaceMap === null) {
-            this.editPlaceMap = places({
-                appId: 'pl9OI1NPY62Y',
-                apiKey: '290e5a0e33e751c85c36690d502991fc',
-                container: document.querySelector('#address-input-edit' + this.uuid),
-            });
-            this.editPlaceMap.on('change', (algoliaReturnElement) => {
-                this.setCoordinateOnPlaces(algoliaReturnElement);
-            });
-        }
+    handleAddressChange(event) {
+        this.googleMapReturnElement = {
+            suggestion: {
+                latlng: {
+                    lat: event.geometry.location.lat(),
+                    lng: event.geometry.location.lng(),
+                },
+                value: event.name,
+            },
+        };
+        this.setCoordinateOnPlaces(this.googleMapReturnElement);
+    }
+    /**
+     * Avoid partial map loaded at the initialization
+     * @param map
+     */
+    onMapReady(map) {
+        setTimeout(() => {
+            map.invalidateSize();
+        }, 0);
     }
     selectThisForm() {
         if (this.selectedValue === null) {
@@ -27042,20 +27027,11 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
         this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
         this.persist();
     }
-    /**
-     * Avoid partial map loaded at the initialization
-     * @param map
-     */
-    onMapReady(map) {
-        setTimeout(() => {
-            map.invalidateSize();
-        }, 0);
-    }
 }
 MapBackgroundFormRightComponent.decorators = [
     { type: Component, args: [{
                 selector: MapBackgroundFormRightService.selector(),
-                template: "<div class=\"wb-map-background-form-right\">\n    <div class=\"wb-map-background-form-right__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config\n            [blockUUID]=\"uuid\"\n            [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\"\n            (click)=\"createEditAlgoliaInput()\"\n            [isFullwidth]=\"true\"\n        >\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-background-form-right__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div class=\"wb-map-background-form-right__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-background-form-right__cover\"></div>\n                    <div\n                        class=\"wb-map-background-form-right__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-right__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-background-form-right__selector\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-right__container-form\">\n                <div class=\"wb-map-background-form-right__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-background-form-right__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
+                template: "<div class=\"wb-map-background-form-right\">\n    <div class=\"wb-map-background-form-right__container__config\" *ngIf=\"showMap\">\n        <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" [isFullwidth]=\"true\">\n            <p>{{ 'wb.structures.template.19' | translate }}</p>\n            <input\n                id=\"address-input-edit{{ uuid }}\"\n                type=\"text\"\n                [(ngModel)]=\"address\"\n                #myInputEdit\n                (click)=\"myInputEdit.select()\"\n                ngx-google-places-autocomplete\n                (onAddressChange)=\"handleAddressChange($event)\"\n            />\n        </wb-structure-config>\n    </div>\n    <div class=\"wb-map-background-form-right__selector\" *ngIf=\"!showMap\">\n        <p>{{ 'wb.structures.template.19' | translate }}</p>\n        <input\n            id=\"address-input{{ uuid }}\"\n            type=\"text\"\n            [(ngModel)]=\"address\"\n            #myInput\n            (click)=\"myInput.select()\"\n            ngx-google-places-autocomplete\n            (onAddressChange)=\"handleAddressChange($event)\"\n        />\n    </div>\n    <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n        <div class=\"column\">\n            <div class=\"wb-map-background-form-right__container\">\n                <div *ngIf=\"showMap\">\n                    <div class=\"wb-map-background-form-right__cover\"></div>\n                    <div\n                        class=\"wb-map-background-form-right__container__map\"\n                        leaflet\n                        [leafletOptions]=\"options\"\n                        [leafletLayers]=\"layers\"\n                        [(leafletCenter)]=\"center\"\n                        (leafletMapReady)=\"onMapReady($event)\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n        <div class=\"column\">\n            <div *ngIf=\"selectedDetailForm.length === 0\">\n                <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-right__loader\">\n                    <wb-loader></wb-loader>\n                </div>\n                <div class=\"wb-map-background-form-right__selector\" *ngIf=\"forms.length > 0\">\n                    <wb-structure-select\n                        [selectedValue]=\"selectedValue\"\n                        [forms]=\"forms\"\n                        (changed)=\"selectedValue = $event; selectThisForm()\"\n                    ></wb-structure-select>\n                </div>\n            </div>\n            <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-right__container-form\">\n                <div class=\"wb-map-background-form-right__container-form__editor\">\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                    <div>\n                        <wb-editorjs\n                            [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n                            (contentChange)=\"persist()\"\n                            [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n                        >\n                        </wb-editorjs>\n                    </div>\n                </div>\n                <div class=\"wb-map-background-form-right__container-form__content\">\n                    <div *ngFor=\"let select of selectedDetailForm\">\n                        <p [innerHTML]=\"select.title\"></p>\n                        <p>{{ select.type | answerPipe | translate }}</p>\n                    </div>\n                    <div>\n                        <wb-structure-select\n                            [selectedValue]=\"selectedValue\"\n                            [forms]=\"forms\"\n                            (changed)=\"selectedValue = $event; selectThisForm()\"\n                        ></wb-structure-select>\n                        &nbsp;&nbsp;&nbsp;\n                        <button>{{ selectedValue.submit_label }}</button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n"
             },] }
 ];
 MapBackgroundFormRightComponent.ctorParameters = () => [
@@ -29957,6 +29933,7 @@ StructuresModule.decorators = [
                 imports: [
                     SharedModule,
                     MonacoEditorModule,
+                    GooglePlaceModule,
                     QuillModule,
                     LeafletModule,
                     NwbCommonModule,