Merge branch 'dev'

Author: mauricewijnia

README.md

@@ -342,6 +342,15 @@ Laraberg.init('[id_here]', { maxHeight: '500px' })
 
 Laraberg.init('[id_here]', { minHeight: '500px' })
 ```
+
+## Placeholder
+
+You can change the default Gutenberg placeholder by adding a placeholder attribute to your textarea:
+
+```html
+<textarea placeholder="[placeholder_here]" id="[id_here]" name="[name_here]" hidden></textarea>
+```
+
 ## API Routes
 
 After publishing the vendor files you can find the 'laraberg.php' file in your config folder. This file allows you to configure the API Routes. Here you can change the URL prefix and the middleware for the routes.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "laraberg",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "A Gutenberg implementation for Laravel",
   "main": "src/resources/laraberg.js",
   "directories": {

public/css/laraberg.css

@@ -15,7 +15,7 @@ class EmbedHelper
     public static function renderEmbeds($html)
     {
         // Match URL from raw Gutenberg embed content
-        $regex = '/<!-- wp:core-embed\/.*?-->\s*?<figure class="wp-block-embed.*?".*?<div class="wp-block-embed__wrapper">\s*?(.*?)\s*?<\/div><\/figure>/';
+        $regex = '/<!-- wp:core-embed\/.*?-->\s*?<figure class="wp-block-embed.*?".*?<div class="wp-block-embed__wrapper">\s*?(.*?)\s*?<\/div>.*?<\/figure>/';
         $result = preg_replace_callback($regex, function ($matches) {
             $embed = self::create($matches[1]);
             $url = preg_replace('/\//', '\/', preg_quote($matches[1]));

public/css/laraberg.css.map

@@ -52,8 +52,7 @@ public function render()
      */
     public function setContent($html)
     {
-        $this->raw_content = $html;
-        $this->fixEmptyImages();
+        $this->raw_content = $this->fixEmptyImages($html);
         $this->renderRaw();
     }
 
@@ -68,17 +67,17 @@ public function renderRaw()
 
         return $this->rendered_content;
     }
-    
+
     /**
      * TODO: Remove this temporary fix for Image block crashing when no image is selected
      */
-    private function fixEmptyImages() {
+    private function fixEmptyImages($html) {
         $regex = '/<img(.*)\/>/';
-        $this->raw_content = preg_replace_callback($regex, function ($matches) {
+        return preg_replace_callback($regex, function ($matches) {
             if (isset($matches[1]) && strpos($matches[1], 'src="') === false) {
                 return str_replace('<img ', '<img src="/vendor/laraberg/img/placeholder.jpg" ', $matches[0]);
             }
             return $matches[0];
-        }, $this->raw_content);
+        }, $html);
     }
 }

public/js/laraberg.js

@@ -19,13 +19,13 @@ export default function init (target, options = {}) {
   toggleFeature('fullscreenMode')
 
   // Disable block patterns
-  plugins.unregisterPlugin('edit-post');
+  plugins.unregisterPlugin('edit-post')
 
   window._wpLoadGutenbergEditor = new Promise(function (resolve) {
     domReady(async () => {
       const larabergEditor = createEditorElement(target)
       try {
-        resolve(editPost.initializeEditor(larabergEditor.id, 'page', 1, editorSettings, overridePost))
+        resolve(editPost.initializeEditor(larabergEditor.id, 'page', 1, getEditorSettings(), overridePost))
         fixReusableBlocks()
       } catch (error) {
         console.error(error)
@@ -65,3 +65,13 @@ function fixReusableBlocks () {
   }
   registerBlockType('core/block', coreBlock)
 }
+
+function getEditorSettings() {
+  const targetElement = document.getElementById(editorSettings.target)
+
+  if (targetElement && targetElement.placeholder) {
+    editorSettings.bodyPlaceholder = targetElement.placeholder
+  }
+
+  return editorSettings
+}

public/js/laraberg.js.map

@@ -48,7 +48,7 @@ export const editorSettings = {
   postLock: {
     isLocked: false
   },
-  autosaveInterval: 9999,
+  autosaveInterval: 9999
 }
 
 // Post properties to override

src/Helpers/EmbedHelper.php

@@ -127,8 +127,6 @@ function setupSubmit (target) {
   if (textarea.form) {
     textarea.form.addEventListener('submit', event => {
       textarea.value = data.select('core/editor').getEditedPostContent()
-      // Clear content "dirty" state.
-      data.dispatch('core/editor').savePost()
       return true
     })
   }
@@ -156,6 +154,4 @@ function removeElements () {
   elementRendered('.editor-post-trash', element => { element.remove() })
 
   elementRendered('.editor-post-saved-state', element => { element.style.display = 'none' })
-
-  elementRendered('.components-popover__content div .components-menu-group:last-of-type', element => { element.style.display = 'none' })
 }

src/Models/Content.php

@@ -3,7 +3,6 @@ import * as MockData from '../api/mock-data'
 const { data } = window.wp
 
 export function getContent () {
-  data.dispatch('core/editor').savePost()
   return data.select('core/editor').getEditedPostContent()
 }