From 124a9c708da91c457a358bdbfd44cb86f5c0d263 Mon Sep 17 00:00:00 2001
From: Stefano Novelli <murdercode@gmail.com>
Date: Wed, 20 Apr 2022 18:33:24 +0200
Subject: [PATCH 1/4] Initial commit

---
 .gitignore                              | 10 ++++++
 composer.json                           | 29 +++++++++++++++++
 config/nova-tinymce-editor.php          | 22 +++++++++++++
 dist/mix-manifest.json                  |  1 +
 mix.js                                  | 40 +++++++++++++++++++++++
 package.json                            | 23 +++++++++++++
 resources/css/field.css                 |  1 +
 resources/js/components/DetailField.vue | 19 +++++++++++
 resources/js/components/FormField.vue   | 43 +++++++++++++++++++++++++
 resources/js/components/IndexField.vue  |  9 ++++++
 resources/js/field.js                   |  9 ++++++
 src/FieldServiceProvider.php            | 37 +++++++++++++++++++++
 src/TinymceEditor.php                   | 41 +++++++++++++++++++++++
 webpack.mix.js                          | 11 +++++++
 14 files changed, 295 insertions(+)
 create mode 100644 .gitignore
 create mode 100644 composer.json
 create mode 100644 config/nova-tinymce-editor.php
 create mode 100644 dist/mix-manifest.json
 create mode 100644 mix.js
 create mode 100644 package.json
 create mode 100644 resources/css/field.css
 create mode 100644 resources/js/components/DetailField.vue
 create mode 100644 resources/js/components/FormField.vue
 create mode 100644 resources/js/components/IndexField.vue
 create mode 100644 resources/js/field.js
 create mode 100644 src/FieldServiceProvider.php
 create mode 100644 src/TinymceEditor.php
 create mode 100644 webpack.mix.js

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..b817577
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,10 @@
+/.idea
+/vendor
+/node_modules
+package-lock.json
+composer.phar
+composer.lock
+phpunit.xml
+.phpunit.result.cache
+.DS_Store
+Thumbs.db
diff --git a/composer.json b/composer.json
new file mode 100644
index 0000000..6879569
--- /dev/null
+++ b/composer.json
@@ -0,0 +1,29 @@
+{
+    "name": "murdercode/nova4-tinymce-editor",
+    "description": "A Laravel Nova field.",
+    "keywords": [
+        "laravel",
+        "nova"
+    ],
+    "license": "MIT",
+    "require": {
+        "php": "^7.3|^8.0"
+    },
+    "autoload": {
+        "psr-4": {
+            "Murdercode\\TinymceEditor\\": "src/"
+        }
+    },
+    "extra": {
+        "laravel": {
+            "providers": [
+                "Murdercode\\TinymceEditor\\FieldServiceProvider"
+            ]
+        }
+    },
+    "config": {
+        "sort-packages": true
+    },
+    "minimum-stability": "dev",
+    "prefer-stable": true
+}
diff --git a/config/nova-tinymce-editor.php b/config/nova-tinymce-editor.php
new file mode 100644
index 0000000..61f45d7
--- /dev/null
+++ b/config/nova-tinymce-editor.php
@@ -0,0 +1,22 @@
+<?php
+
+return [
+        'init' => [
+            'menubar' => false,
+            'autoresize_bottom_margin' => 40,
+            'branding' => false,
+            'image_caption' => true,
+            'paste_as_text' => true,
+            'paste_word_valid_elements' => 'b,strong,i,em,h1,h2',
+        ],
+        'plugins' => [
+            'advlist autolink lists link image imagetools media',
+            'paste code wordcount autoresize table',
+        ],
+        'toolbar' => [
+            'undo redo | formatselect forecolor backcolor |
+                 bold italic underline strikethrough blockquote removeformat |
+                 align bullist numlist outdent indent | link table media insertmedialibrary | code',
+        ],
+        'apiKey' => env('TINYMCE_API_KEY', ''),
+];
\ No newline at end of file
diff --git a/dist/mix-manifest.json b/dist/mix-manifest.json
new file mode 100644
index 0000000..0967ef4
--- /dev/null
+++ b/dist/mix-manifest.json
@@ -0,0 +1 @@
+{}
diff --git a/mix.js b/mix.js
new file mode 100644
index 0000000..c43ca88
--- /dev/null
+++ b/mix.js
@@ -0,0 +1,40 @@
+const mix = require('laravel-mix')
+const webpack = require('webpack')
+const path = require('path')
+
+class NovaExtension {
+  name() {
+    return 'nova-extension'
+  }
+
+  register(name) {
+    this.name = name
+  }
+
+  webpackPlugins() {
+    return new webpack.ProvidePlugin({
+      _: 'lodash',
+      Errors: 'form-backend-validation',
+    })
+  }
+
+  webpackConfig(webpackConfig) {
+    webpackConfig.externals = {
+      vue: 'Vue',
+    }
+
+    webpackConfig.resolve.alias = {
+      ...(webpackConfig.resolve.alias || {}),
+      'laravel-nova': path.join(
+        __dirname,
+        '../../vendor/laravel/nova/resources/js/mixins/packages.js'
+      ),
+    }
+
+    webpackConfig.output = {
+      uniqueName: this.name,
+    }
+  }
+}
+
+mix.extend('nova', new NovaExtension())
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..0ee5aa7
--- /dev/null
+++ b/package.json
@@ -0,0 +1,23 @@
+{
+  "private": true,
+  "scripts": {
+    "dev": "npm run development",
+    "development": "mix",
+    "watch": "mix watch",
+    "watch-poll": "mix watch -- --watch-options-poll=1000",
+    "hot": "mix watch --hot",
+    "prod": "npm run production",
+    "production": "mix --production"
+  },
+  "devDependencies": {
+    "@vue/compiler-sfc": "^3.2.22",
+    "form-backend-validation": "^2.3.3",
+    "laravel-mix": "^6.0.41",
+    "lodash": "^4.17.21",
+    "postcss": "^8.3.11",
+    "vue-loader": "^16.8.3"
+  },
+  "dependencies": {
+    "@tinymce/tinymce-vue": "^4.0.7"
+  }
+}
diff --git a/resources/css/field.css b/resources/css/field.css
new file mode 100644
index 0000000..2a9d2e2
--- /dev/null
+++ b/resources/css/field.css
@@ -0,0 +1 @@
+/* Nova Field CSS */
diff --git a/resources/js/components/DetailField.vue b/resources/js/components/DetailField.vue
new file mode 100644
index 0000000..29bcc26
--- /dev/null
+++ b/resources/js/components/DetailField.vue
@@ -0,0 +1,19 @@
+<template>
+  <PanelItem :index="index" :field="field">
+    <template #value>
+      <excerpt :content="field.value" :should-show="field.shouldShow" />
+    </template>
+    </PanelItem>
+</template>
+
+<script>
+export default {
+  props: ['index', 'resource', 'resourceName', 'resourceId', 'field'],
+
+  data() {
+    return {
+      content: 'Hidden content',
+    }
+  }
+}
+</script>
diff --git a/resources/js/components/FormField.vue b/resources/js/components/FormField.vue
new file mode 100644
index 0000000..bca64f9
--- /dev/null
+++ b/resources/js/components/FormField.vue
@@ -0,0 +1,43 @@
+<template>
+  <DefaultField :field="field" :errors="errors" :show-help-text="showHelpText">
+    <template #field>
+      <!--<input :id="field.attribute" type="text" class="w-full form-control form-input form-input-bordered"
+        :class="errorClasses" :placeholder="field.name" v-model="value" />-->
+      {{ apiKey }}
+      <editor v-model="value" :api-key="field.options.apiKey" :init="field.options.init"
+        :plugins="field.options.plugins" :toolbar="field.options.toolbar" :placeholder="field.name" />
+    </template>
+    </DefaultField>
+</template>
+
+<script>
+import { FormField, HandlesValidationErrors } from 'laravel-nova'
+import Editor from '@tinymce/tinymce-vue'
+
+export default {
+  mixins: [FormField, HandlesValidationErrors],
+
+  props: ['resourceName', 'resourceId', 'field', 'options'],
+
+  components: {
+    'editor': Editor
+  },
+
+  methods: {
+
+    /*
+     * Set the initial, internal value for the field.
+     */
+    setInitialValue() {
+      this.value = this.field.value || ''
+    },
+
+    /**
+     * Fill the given FormData object with the field's internal value.
+     */
+    fill(formData) {
+      formData.append(this.field.attribute, this.value || '')
+    },
+  },
+}
+</script>
diff --git a/resources/js/components/IndexField.vue b/resources/js/components/IndexField.vue
new file mode 100644
index 0000000..5a07928
--- /dev/null
+++ b/resources/js/components/IndexField.vue
@@ -0,0 +1,9 @@
+<template>
+    <span>{{ field.value }}</span>
+</template>
+
+<script>
+export default {
+    props: ['resourceName', 'field'],
+}
+</script>
diff --git a/resources/js/field.js b/resources/js/field.js
new file mode 100644
index 0000000..a6d8f6b
--- /dev/null
+++ b/resources/js/field.js
@@ -0,0 +1,9 @@
+import IndexField from './components/IndexField'
+import DetailField from './components/DetailField'
+import FormField from './components/FormField'
+
+Nova.booting((app, store) => {
+  app.component('index-tinymce-editor', IndexField)
+  app.component('detail-tinymce-editor', DetailField)
+  app.component('form-tinymce-editor', FormField)
+})
diff --git a/src/FieldServiceProvider.php b/src/FieldServiceProvider.php
new file mode 100644
index 0000000..1962498
--- /dev/null
+++ b/src/FieldServiceProvider.php
@@ -0,0 +1,37 @@
+<?php
+
+namespace Murdercode\TinymceEditor;
+
+use Illuminate\Support\ServiceProvider;
+use Laravel\Nova\Events\ServingNova;
+use Laravel\Nova\Nova;
+
+class FieldServiceProvider extends ServiceProvider
+{
+    /**
+     * Bootstrap any application services.
+     *
+     * @return void
+     */
+    public function boot()
+    {
+        Nova::serving(function (ServingNova $event) {
+            Nova::script('tinymce-editor', __DIR__ . '/../dist/js/field.js');
+            Nova::style('tinymce-editor', __DIR__ . '/../dist/css/field.css');
+        });
+
+        $this->publishes([
+            __DIR__ . '/../config/nova-tinymce-editor.php' => config_path('nova-tinymce-editor.php'),
+        ], 'config');
+    }
+
+    /**
+     * Register any application services.
+     *
+     * @return void
+     */
+    public function register()
+    {
+        //
+    }
+}
diff --git a/src/TinymceEditor.php b/src/TinymceEditor.php
new file mode 100644
index 0000000..80cddc4
--- /dev/null
+++ b/src/TinymceEditor.php
@@ -0,0 +1,41 @@
+<?php
+
+namespace Murdercode\TinymceEditor;
+
+use Laravel\Nova\Fields\Field;
+
+class TinymceEditor extends Field
+{
+    /**
+     * The field's component.
+     *
+     * @var string
+     */
+    public $component = 'tinymce-editor';
+
+    /**
+     * Indicates if the element should be shown on the index view.
+     *
+     * @var bool
+     */
+    public $showOnIndex = false;
+
+    public function __construct(string $name, $attribute = null, callable $resolveCallback = null)
+    {
+        parent::__construct($name, $attribute);
+        $this->resolveCallback = $resolveCallback;
+
+        $this->withMeta([
+            'options' => config('nova-tinymce-editor', []),
+        ]);
+    }
+
+    public function options($options)
+    {
+        $inlineOptions = $this->meta['options'] ?? [];
+
+        return $this->withMeta([
+            'options' => array_merge($inlineOptions, $options),
+        ]);
+    }
+}
diff --git a/webpack.mix.js b/webpack.mix.js
new file mode 100644
index 0000000..26597f4
--- /dev/null
+++ b/webpack.mix.js
@@ -0,0 +1,11 @@
+let mix = require('laravel-mix')
+let path = require('path')
+
+require('./mix')
+
+mix
+  .setPublicPath('dist')
+  .js('resources/js/field.js', 'js')
+  .vue({ version: 3 })
+  .css('resources/css/field.css', 'css')
+  .nova('murdercode/tinymce-editor')

From b28e8768ba0f3eb07f2288a0ad924d5252e84a27 Mon Sep 17 00:00:00 2001
From: Stefano Novelli <murdercode@gmail.com>
Date: Wed, 20 Apr 2022 19:03:18 +0200
Subject: [PATCH 2/4] Remove laravel-nova needs

---
 resources/js/components/FormField.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/FormField.vue b/resources/js/components/FormField.vue
index bca64f9..0bc5a8c 100644
--- a/resources/js/components/FormField.vue
+++ b/resources/js/components/FormField.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import { FormField, HandlesValidationErrors } from 'laravel-nova'
+//import { FormField, HandlesValidationErrors } from 'laravel-nova'
 import Editor from '@tinymce/tinymce-vue'
 
 export default {
-  mixins: [FormField, HandlesValidationErrors],
+  //mixins: [FormField, HandlesValidationErrors],
 
   props: ['resourceName', 'resourceId', 'field', 'options'],
 

From c9db99237bca7f73a7f16b934ec8c1d1d8b8f81e Mon Sep 17 00:00:00 2001
From: Stefano Novelli <murdercode@gmail.com>
Date: Wed, 20 Apr 2022 19:06:12 +0200
Subject: [PATCH 3/4] Fix missing building

---
 dist/css/field.css     | 1 +
 dist/js/field.js       | 1 +
 dist/mix-manifest.json | 5 ++++-
 3 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 dist/css/field.css
 create mode 100644 dist/js/field.js

diff --git a/dist/css/field.css b/dist/css/field.css
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/dist/css/field.css
@@ -0,0 +1 @@
+
diff --git a/dist/js/field.js b/dist/js/field.js
new file mode 100644
index 0000000..fb421ec
--- /dev/null
+++ b/dist/js/field.js
@@ -0,0 +1 @@
+(()=>{"use strict";var e,n={838:(e,n,t)=>{const o=Vue;const r={props:["resourceName","field"]};var i=t(744);const a=(0,i.Z)(r,[["render",function(e,n,t,r,i,a){return(0,o.openBlock)(),(0,o.createElementBlock)("span",null,(0,o.toDisplayString)(t.field.value),1)}]]);const l={props:["index","resource","resourceName","resourceId","field"],data:function(){return{content:"Hidden content"}}},u=(0,i.Z)(l,[["render",function(e,n,t,r,i,a){var l=(0,o.resolveComponent)("excerpt"),u=(0,o.resolveComponent)("PanelItem");return(0,o.openBlock)(),(0,o.createBlock)(u,{index:t.index,field:t.field},{value:(0,o.withCtx)((function(){return[(0,o.createVNode)(l,{content:t.field.value,"should-show":t.field.shouldShow},null,8,["content","should-show"])]})),_:1},8,["index","field"])}]]);var c,d=["onActivate","onAddUndo","onBeforeAddUndo","onBeforeExecCommand","onBeforeGetContent","onBeforeRenderUI","onBeforeSetContent","onBeforePaste","onBlur","onChange","onClearUndos","onClick","onContextMenu","onCopy","onCut","onDblclick","onDeactivate","onDirty","onDrag","onDragDrop","onDragEnd","onDragGesture","onDragOver","onDrop","onExecCommand","onFocus","onFocusIn","onFocusOut","onGetContent","onHide","onInit","onKeyDown","onKeyPress","onKeyUp","onLoadContent","onMouseDown","onMouseEnter","onMouseLeave","onMouseMove","onMouseOut","onMouseOver","onMouseUp","onNodeChange","onObjectResizeStart","onObjectResized","onObjectSelected","onPaste","onPostProcess","onPostRender","onPreProcess","onProgressState","onRedo","onRemove","onReset","onSaveContent","onSelectionChange","onSetAttrib","onSetContent","onShow","onSubmit","onUndo","onVisualAid"],s=function(e){return-1!==d.map((function(e){return e.toLowerCase()})).indexOf(e.toLowerCase())},f=function(e,n,t,r,i,a){r.setContent(a()),t.attrs["onUpdate:modelValue"]&&function(e,n,t,r){var i=e.modelEvents?e.modelEvents:null,a=Array.isArray(i)?i.join(" "):i;(0,o.watch)(r,(function(n,o){t&&"string"==typeof n&&n!==o&&n!==t.getContent({format:e.outputFormat})&&t.setContent(n)})),t.on(a||"change input undo redo",(function(){n.emit("update:modelValue",t.getContent({format:e.outputFormat}))}))}(n,t,r,i),function(e,n,t){Object.keys(n).filter(s).forEach((function(o){var r=n[o];"function"==typeof r&&("onInit"===o?r(e,t):t.on(o.substring(2),(function(e){return r(e,t)})))}))}(e,t.attrs,r)},p=0,v=function(e){var n=Date.now();return e+"_"+Math.floor(1e9*Math.random())+ ++p+String(n)},m=function(e){return void 0===e||""===e?[]:Array.isArray(e)?e:e.split(" ")},y=function(){return{listeners:[],scriptId:v("tiny-script"),scriptLoaded:!1}},h=(c=y(),{load:function(e,n,t){c.scriptLoaded?t():(c.listeners.push(t),e.getElementById(c.scriptId)||function(e,n,t,o){var r=n.createElement("script");r.referrerPolicy="origin",r.type="application/javascript",r.id=e,r.src=t;var i=function(){r.removeEventListener("load",i),o()};r.addEventListener("load",i),n.head&&n.head.appendChild(r)}(c.scriptId,e,n,(function(){c.listeners.forEach((function(e){return e()})),c.scriptLoaded=!0})))},reinitialize:function(){c=y()}}),g=function(){var e="undefined"!=typeof window?window:t.g;return e&&e.tinymce?e.tinymce:null},C={apiKey:String,cloudChannel:String,id:String,init:Object,initialValue:String,inline:Boolean,modelEvents:[String,Array],plugins:[String,Array],tagName:String,toolbar:[String,Array],modelValue:String,disabled:Boolean,tinymceScriptSrc:String,outputFormat:{type:String,validator:function(e){return"html"===e||"text"===e}}},b=function(){return b=Object.assign||function(e){for(var n,t=1,o=arguments.length;t<o;t++)for(var r in n=arguments[t])Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r]);return e},b.apply(this,arguments)};const w={props:["resourceName","resourceId","field","options"],components:{editor:(0,o.defineComponent)({props:C,setup:function(e,n){var t=e.init?b({},e.init):{},r=(0,o.toRefs)(e),i=r.disabled,a=r.modelValue,l=r.tagName,u=(0,o.ref)(null),c=null,d=e.id||v("tiny-vue"),s=e.init&&e.init.inline||e.inline,p=!!n.attrs["onUpdate:modelValue"],y=!0,C=e.initialValue?e.initialValue:"",w="",S=function(){var o,r,i,l=(o=y,p?function(){return(null==a?void 0:a.value)?a.value:""}:function(){return o?C:w}),v=b(b({},t),{readonly:e.disabled,selector:"#"+d,plugins:(r=t.plugins,i=e.plugins,m(r).concat(m(i))),toolbar:e.toolbar||t.toolbar,inline:s,setup:function(o){c=o,o.on("init",(function(t){return f(t,e,n,o,a,l)})),"function"==typeof t.setup&&t.setup(o)}});(function(e){return null!==e&&"textarea"===e.tagName.toLowerCase()})(u.value)&&(u.value.style.visibility=""),g().init(v),y=!1};(0,o.watch)(i,(function(e){var n;null!==c&&("function"==typeof(null===(n=c.mode)||void 0===n?void 0:n.set)?c.mode.set(e?"readonly":"design"):c.setMode(e?"readonly":"design"))})),(0,o.watch)(l,(function(e){var n;p||(w=c.getContent()),null===(n=g())||void 0===n||n.remove(c),(0,o.nextTick)((function(){return S()}))})),(0,o.onMounted)((function(){if(null!==g())S();else if(u.value&&u.value.ownerDocument){var n=e.cloudChannel?e.cloudChannel:"5",t=e.apiKey?e.apiKey:"no-api-key",o=null==e.tinymceScriptSrc?"https://cdn.tiny.cloud/1/"+t+"/tinymce/"+n+"/tinymce.min.js":e.tinymceScriptSrc;h.load(u.value.ownerDocument,o,S)}})),(0,o.onBeforeUnmount)((function(){null!==g()&&g().remove(c)})),s||((0,o.onActivated)((function(){y||S()})),(0,o.onDeactivated)((function(){var e;p||(w=c.getContent()),null===(e=g())||void 0===e||e.remove(c)})));return n.expose({rerender:function(e){var n;w=c.getContent(),null===(n=g())||void 0===n||n.remove(c),t=b(b({},t),e),(0,o.nextTick)((function(){return S()}))}}),function(){return s?function(e,n,t,o){return e(o||"div",{id:n,ref:t})}(o.h,d,u,e.tagName):(0,o.h)("textarea",{id:d,visibility:"hidden",ref:u})}}})},methods:{setInitialValue:function(){this.value=this.field.value||""},fill:function(e){e.append(this.field.attribute,this.value||"")}}},S=(0,i.Z)(w,[["render",function(e,n,t,r,i,a){var l=(0,o.resolveComponent)("editor"),u=(0,o.resolveComponent)("DefaultField");return(0,o.openBlock)(),(0,o.createBlock)(u,{field:t.field,errors:e.errors,"show-help-text":e.showHelpText},{field:(0,o.withCtx)((function(){return[(0,o.createTextVNode)((0,o.toDisplayString)(e.apiKey)+" ",1),(0,o.createVNode)(l,{modelValue:e.value,"onUpdate:modelValue":n[0]||(n[0]=function(n){return e.value=n}),"api-key":t.field.options.apiKey,init:t.field.options.init,plugins:t.field.options.plugins,toolbar:t.field.options.toolbar,placeholder:t.field.name},null,8,["modelValue","api-key","init","plugins","toolbar","placeholder"])]})),_:1},8,["field","errors","show-help-text"])}]]);Nova.booting((function(e,n){e.component("index-tinymce-editor",a),e.component("detail-tinymce-editor",u),e.component("form-tinymce-editor",S)}))},381:()=>{},744:(e,n)=>{n.Z=(e,n)=>{const t=e.__vccOpts||e;for(const[e,o]of n)t[e]=o;return t}}},t={};function o(e){var r=t[e];if(void 0!==r)return r.exports;var i=t[e]={exports:{}};return n[e](i,i.exports,o),i.exports}o.m=n,e=[],o.O=(n,t,r,i)=>{if(!t){var a=1/0;for(d=0;d<e.length;d++){for(var[t,r,i]=e[d],l=!0,u=0;u<t.length;u++)(!1&i||a>=i)&&Object.keys(o.O).every((e=>o.O[e](t[u])))?t.splice(u--,1):(l=!1,i<a&&(a=i));if(l){e.splice(d--,1);var c=r();void 0!==c&&(n=c)}}return n}i=i||0;for(var d=e.length;d>0&&e[d-1][2]>i;d--)e[d]=e[d-1];e[d]=[t,r,i]},o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={175:0,546:0};o.O.j=n=>0===e[n];var n=(n,t)=>{var r,i,[a,l,u]=t,c=0;if(a.some((n=>0!==e[n]))){for(r in l)o.o(l,r)&&(o.m[r]=l[r]);if(u)var d=u(o)}for(n&&n(t);c<a.length;c++)i=a[c],o.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return o.O(d)},t=self.webpackChunkmurdercode_tinymce_editor=self.webpackChunkmurdercode_tinymce_editor||[];t.forEach(n.bind(null,0)),t.push=n.bind(null,t.push.bind(t))})(),o.O(void 0,[546],(()=>o(838)));var r=o.O(void 0,[546],(()=>o(381)));r=o.O(r)})();
\ No newline at end of file
diff --git a/dist/mix-manifest.json b/dist/mix-manifest.json
index 0967ef4..507a525 100644
--- a/dist/mix-manifest.json
+++ b/dist/mix-manifest.json
@@ -1 +1,4 @@
-{}
+{
+    "/js/field.js": "/js/field.js",
+    "/css/field.css": "/css/field.css"
+}

From d3bc2ae118009ff373dbb0b2df2d98b8c18a50f4 Mon Sep 17 00:00:00 2001
From: Stefano Novelli <murdercode@gmail.com>
Date: Thu, 21 Apr 2022 12:58:34 +0200
Subject: [PATCH 4/4] Create README.md

---
 README.md | 85 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 README.md

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..08e6501
--- /dev/null
+++ b/README.md
@@ -0,0 +1,85 @@
+# Nova4 TinyMCE Editor
+
+I'm proud to present a simple wrapper that allows you to use the excellent **TinyMCE Editor(v6)** within Larvale Nova 4.
+
+![](https://s10.gifyu.com/images/2022-04-21-12.44.26.gif)
+
+# Prerequisites
+- Laravel 9
+- Laravel Nova 4
+- TinyMCE API Key ([get one here](https://www.tiny.cloud/))
+
+## How to install
+
+In the root of your Laravel installation launch:
+```bash
+composer require murdercode/nova4-tinymce-editor
+```
+
+Then publish the config:
+```bash
+php artisan vendor:publish --provider="Murdercode\TinymceEditor\FieldServiceProvider"
+```
+
+A file in _config/nova_tinymce_editor.php_ will appear:
+
+```php
+<?php
+
+return [
+        'init' => [
+            'menubar' => false,
+            'autoresize_bottom_margin' => 40,
+            'branding' => false,
+            'image_caption' => true,
+            'paste_as_text' => true,
+            'paste_word_valid_elements' => 'b,strong,i,em,h2',
+        ],
+        'plugins' => [
+            'anchor advlist autolink autoresize autosave code fullscreen link lists image imagetools media
+            paste wordcount',
+        ],
+        'toolbar' => [
+            'undo redo | formatselect |
+                 bold italic underline strikethrough blockquote removeformat |
+                 align bullist numlist outdent indent | link anchor table media insertmedialibrary | code restoredraft fullscreen',
+        ],
+        
+        'apiKey' => env('TINYMCE_API_KEY', ''),
+];
+```
+
+In your **.env** file please add the key:
+```
+TINYMCE_API_KEY=[YOUR_PRECIOUS_PRIVATE_KEY]
+```
+
+**Please make sure** that you have added domain in your tiny.cloud account list.
+
+## Register the Field
+
+In your Nova/Resource.php add the field as following:
+
+```php
+<?php
+
+use Murdercode\TinymceEditor\TinymceEditor;
+
+class Article extends Resource
+{
+    //...
+    public function fields(NovaRequest $request)
+    {
+        return [
+            TinymceEditor::make(__('Content'), 'content')
+                ->rules(['required', 'min:20'])
+                ->help(__('The content of the article.')),
+        ];
+    }
+}
+                //...
+```
+
+## Feedback and Support
+Test, PR (also of this doc) are welcome.
+