Move to grapesjs-cli and refactor to TS

.gitignore

@@ -4,3 +4,4 @@ node_modules/
 .eslintrc
 *.log
 _index.html
+dist/

README.md

@@ -24,10 +24,8 @@ This plugin adds the possibility to embed custom code
 
 |Option|Description|Default|
 |-|-|-
-| `blockLabel` | Label of the custom code block | `Custom Code` |
 | `blockCustomCode` | Object to extend the default custom code block, eg. `{ label: 'Custom Code', category: 'Extra', ... }`. Pass a falsy value to avoid adding the block | `{}` |
-| `propsCustomCode` | Object to extend the default custom code properties, eg. `{ name: 'Custom Code', droppable: false, ... }` | `{}` |
-| `placeholderContent` | Initial content of the custom code component | `<span>Insert here your custom code</span>` |
+| `propsCustomCode` | Object to extend the default custom code properties, eg. `{ name: 'Custom Code', components: '<span>Initial content</span>' ... }` | `{}` |
 | `toolbarBtnCustomCode` | Object to extend the default component's toolbar button for the code, eg. `{ label: '</>', attributes: { title: 'Open custom code' } }`. Pass a falsy value to avoid adding the button | `{}` |
 | `placeholderScript` | Content to show when the custom code contains `<script>` | [Check the source](https://github.com/artf/grapesjs-custom-code/tree/master/src/index.js) |
 | `modalTitle` | Title for the modal | `Insert your code` |

index.html

@@ -5,7 +5,6 @@
     <title>GrapesJS Plugin Custom Code</title>
     <link href="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet">
     <script src="https://unpkg.com/grapesjs"></script>
-    <script src="dist/grapesjs-plugin-boilerplate.min.js"></script>
     <style>
       body,
       html {
@@ -25,20 +24,19 @@
 
 
     <script type="text/javascript">
-      var editor = grapesjs.init({
-        height: '100%',
-        showOffsets: 1,
-        noticeOnUnload: 0,
-        storageManager: { autoload: 0 },
-        container: '#gjs',
-        fromElement: true,
+      setTimeout(() => {
+        window.editor = grapesjs.init({
+          height: '100%',
+          showOffsets: true,
+          allowScripts: true,
+          noticeOnUnload: false,
+          storageManager: false,
+          container: '#gjs',
+          fromElement: true,
 
-        plugins: ['grapesjs-custom-code'],
-        pluginsOpts: {
-          'grapesjs-custom-code': {}
-        }
-      });
-      window.editor = editor;
+          plugins: ['grapesjs-custom-code'],
+        });
+      })
     </script>
   </body>
 </html>