refactor: Move to files

public/css/quill.snow.css

@@ -943,3 +943,8 @@
 .ql-container.ql-snow {
   border: 1px solid #ccc;
 }
+
+.ql-container, .ql-toolbar {
+    background-color: white!important;
+    color: black!important;
+}

public/js/quill-init.js

@@ -0,0 +1,24 @@
+document.addEventListener('alpine:init', () => {
+    Alpine.data('quill', () => ({
+        textarea: null,
+        editor: null,
+
+        init() {
+            this.textarea = this.$root.querySelector('.ql-textarea')
+            this.editor = this.$root.querySelector('.ql-editor')
+
+            const t = this
+
+            this.$nextTick(function() {
+                let quill = new Quill(`#${t.editor.id}`, {
+                    theme: 'snow'
+                });
+
+                quill.on('text-change', () => {
+                    t.textarea.value = t.editor.innerHTML || '';
+                    t.textarea.dispatchEvent(new Event('change'));
+                });
+            })
+        },
+    }))
+})

resources/views/fields/quill.blade.php

@@ -9,37 +9,3 @@
         ])->except('x-bind:id')"
     >{!! $value ?? '' !!}</x-moonshine::form.textarea>
 </div>
-
-<script>
-    document.addEventListener('alpine:init', () => {
-        Alpine.data('quill', () => ({
-            textarea: null,
-            editor: null,
-
-            init() {
-                this.textarea = this.$root.querySelector('.ql-textarea')
-                this.editor = this.$root.querySelector('.ql-editor')
-
-                const t = this
-
-                this.$nextTick(function() {
-                    let quill = new Quill(`#${t.editor.id}`, {
-                        theme: 'snow'
-                    });
-
-                    quill.on('text-change', () => {
-                        t.textarea.value = t.editor.innerHTML || '';
-                        t.textarea.dispatchEvent(new Event('change'));
-                    });
-                })
-            },
-        }))
-    })
-</script>
-
-<style>
-    .ql-container, .ql-toolbar {
-        background-color: white!important;
-        color: black!important;
-    }
-</style>

src/Fields/Quill.php

@@ -13,5 +13,6 @@ final class Quill extends Textarea
     protected array $assets = [
         'vendor/moonshine-quill/css/quill.snow.css',
         'vendor/moonshine-quill/js/quill.js',
+        'vendor/moonshine-quill/js/quill-init.js',
     ];
 }