Merge pull request #140 from mostafaznv/dev

feat: force paste as plain text #139

config/nova-ckeditor.php

@@ -112,6 +112,8 @@
 
             'content-lang' => 'en',
 
+            'force-paste-as-plain-text' => false,
+
             'ui-language' => [
                 'name'   => 'en',
 

docs/SUMMARY.md

@@ -27,6 +27,7 @@
   * [Height](advanced-usage/ckeditor-field-options/height.md)
   * [Limit On Index](advanced-usage/ckeditor-field-options/limit-on-index.md)
   * [Content Language](advanced-usage/ckeditor-field-options/content-language.md)
+  * [Force Paste as Plain Text](advanced-usage/ckeditor-field-options/force-page-as-plain-text.md)
   * [Text Part Language](advanced-usage/ckeditor-field-options/text-part-language.md)
   * [General HTML Support](advanced-usage/ckeditor-field-options/general-html-support.md)
   * [Group Items In Overflow Mode](advanced-usage/ckeditor-field-options/group-items-in-overflow-mode.md)
@@ -52,6 +53,7 @@
       * [Items](advanced-usage/configuration/toolbars/toolbar-1/items.md)
       * [Options](advanced-usage/configuration/toolbars/toolbar-1/options.md)
       * [Content Lang](advanced-usage/configuration/toolbars/toolbar-1/content-lang.md)
+      * [Force Past as Plain Text](advanced-usage/configuration/toolbars/toolbar-1/force-page-as-plain-text.md)
       * [UI Language](advanced-usage/configuration/toolbars/toolbar-1/ui-language/README.md)
         * [UI Language Name](advanced-usage/configuration/toolbars/toolbar-1/ui-language/ui-language-name.md)
         * [UI Language Script](advanced-usage/configuration/toolbars/toolbar-1/ui-language/ui-language-script.md)

docs/advanced-usage/ckeditor-field-options/force-page-as-plain-text.md

@@ -0,0 +1,35 @@
+---
+description: forcePasteAsPlainText
+---
+
+# Force Paste as Plain Text
+
+<table><thead><tr><th>Argument</th><th width="141">Type</th><th width="149" data-type="checkbox">Required</th><th>Default</th></tr></thead><tbody><tr><td>status</td><td>bool</td><td>false</td><td>true</td></tr></tbody></table>
+
+In some cases, you might want to paste content from your clipboard as plain text, removing any HTML tags.
+
+By default, CKEditor preserves the structure of the original content and ensures HTML is safely maintained. However, if you’d prefer to paste content without any formatting, as plain text, you can use the `forcePasteAsPlainText` function.
+
+
+
+```php
+use Mostafaznv\NovaCkEditor\CkEditor;
+
+class Article extends Resource
+{
+    public function fields(Request $request): array
+    {
+        return [
+            CkEditor::make(trans('Content'), 'content')
+                ->forcePasteAsPlainText()
+        ];
+    }
+}
+```
+
+{% hint style="info" %}
+This feature has been available since <mark style="color:red;">v7.5.0</mark>
+{% endhint %}
+
+
+

docs/advanced-usage/configuration/toolbars/toolbar-1/force-page-as-plain-text.md

@@ -0,0 +1,20 @@
+---
+description: toolbars.toolbar-1.force-paste-as-plain-text
+---
+
+# Force Past as Plain Text
+
+<table><thead><tr><th width="390">Property Name</th><th width="152.33333333333331">Type</th><th>Default</th></tr></thead><tbody><tr><td>toolbars.toolbar-1.force-paste-as-plain-text</td><td>bool</td><td>false</td></tr></tbody></table>
+
+For certain cases, you may want to paste content from your clipboard as plain text, stripping away any HTML tags.
+
+By default, when pasting content into the editor, CKEditor will try to maintain the original content’s structure and keep the HTML in a safe way. However, if you’d prefer to paste content without any formatting and only as plain text, you can set <mark style="color:red;">`toolbars.toolbar-1.force-paste-as-plain-text`</mark> to <mark style="color:red;">`true`</mark> in the configuration.
+
+
+
+{% hint style="info" %}
+This feature has been available since <mark style="color:red;">v7.5.0</mark>
+{% endhint %}
+
+
+

docs/getting-started/installation.md

@@ -35,7 +35,7 @@ php artisan vendor:publish --provider="Mostafaznv\NovaCkEditor\FieldServiceProvi
 
 #### 3. Prepare the migration, configurations and models
 
-After publishing stubs, essential `Image`, `Video` and `Audio` classes will be created in the `app/Models` and `app/Nova/Resources` directories respectively. These classes are used for the `media-picker` in the CKEditor field.
+After publishing stubs, essential `Image`, `Video`, `Audio` and `File` classes will be created in the `app/Models` and `app/Nova/Resources` directories respectively. These classes are used for the `media-picker` in the CKEditor field.
 
 {% tabs %}
 {% tab title="Image" %}
@@ -109,8 +109,30 @@ If you wish to modify the disk name, remember to update it in the `App\Nova\Reso
 {% endhint %}
 {% endtab %}
 
+{% tab title="File" %}
+You should create a disk in `config/filesystems.php`:
+
+```php
+'disks' => [
+    'file' => [
+        'driver'     => 'local',
+        'root'       => public_path('uploads/file'),
+        'url'        => env('APP_URL') . '/uploads/file',
+    ]
+]
+```
+
+{% hint style="info" %}
+If you wish to modify the disk name, remember to update it in the `App\Nova\Resources\File` class as well. The third argument of the make function in the FileUpload field corresponds to the disk name.
+{% endhint %}
+
+{% hint style="info" %}
+This feature was introduced in version <mark style="color:red;">7.3.0</mark> of the NovaCKEditor
+{% endhint %}
+{% endtab %}
+
 {% tab title="Migration" %}
-**If you have chosen Larupload**, there is no need to make any changes to the migration file. You can refer to the [nova-video](https://github.com/mostafaznv/nova-video) and [larupload](https://github.com/mostafaznv/larupload) documentations for additional configuration options.
+**If you have chosen Larupload**, there is no need to make any changes to the videos migration file. You can refer to the [nova-video](https://github.com/mostafaznv/nova-video) and [larupload](https://github.com/mostafaznv/larupload) documentations for additional configuration options.
 
 **If you have chosen Laravel's file system**, you must make some changes to the migration file. In the migration file, replace the <mark style="color:red;">upload column</mark> with a <mark style="color:red;">string column</mark>.
 
@@ -134,7 +156,7 @@ class CreateVideosTable extends Migration
 {% endtab %}
 
 {% tab title="Model" %}
-**If you have chosen Larupload**, there is no need to make any changes to the model. You can refer to the [nova-video](https://github.com/mostafaznv/nova-video) and [larupload](https://github.com/mostafaznv/larupload) documentations for additional configuration options.
+**If you have chosen Larupload**, there is no need to make any changes to the `Video` model. You can refer to the [nova-video](https://github.com/mostafaznv/nova-video) and [larupload](https://github.com/mostafaznv/larupload) documentations for additional configuration options.
 
 **If you have chosen Laravel's file system**, you must make some changes to the model. Remove the Larupload <mark style="color:red;">trait</mark> and the <mark style="color:red;">attachments function</mark> from the model.
 
@@ -170,6 +192,10 @@ class Video extends Model
 {% endtab %}
 {% endtabs %}
 
+
+
+
+
 #### 4. Migrate
 
 ```shell

resources/js/fields/editor-field.vue

@@ -1,9 +1,9 @@
 <template>
     <default-field :field="currentField" :errors="errors" :full-width-content="true">
         <template #field>
-            <textarea ref="editor" class="hidden" :id="currentField.attribute" :class="errorClasses" :value="value" />
+            <textarea ref="editor" class="hidden" :id="currentField.attribute" :class="errorClasses" :value="value"/>
 
-            <p v-if="currentField.helpText" v-html="currentField.helpText" class="help-text help-text mt-2" />
+            <p v-if="currentField.helpText" v-html="currentField.helpText" class="help-text help-text mt-2"/>
 
             <media-browser
                 @select="$options[editorName].execute('mediaBrowser', $event)"
@@ -94,7 +94,7 @@ export default {
 
                     headers: {
                         ...CkEditor.defaultConfig.simpleUpload.headers,
-                        'X-Toolbar':  this.currentField.toolbarName
+                        'X-Toolbar': this.currentField.toolbarName
                     },
                 },
                 ...toolbarOptions
@@ -128,6 +128,20 @@ export default {
                     if (this.currentField.readonly) {
                         editor.enableReadOnlyMode(this.$options[this.editorUUID]);
                     }
+
+
+                    if (this.currentField.forcePasteAsPlainText) {
+                        editor.editing.view.document.on('clipboardInput', (evt, data) => {
+                            evt.stop()
+
+                            editor.model.change(writer => {
+                                writer.insertText(
+                                    data.dataTransfer.getData('text/plain'),
+                                    editor.model.document.selection.getFirstPosition()
+                                )
+                            })
+                        })
+                    }
                 })
                 .catch((e) => {
                     console.log(e)
@@ -170,7 +184,7 @@ export default {
                     if (Array.isArray(url)) {
                         const urls = url
 
-                        for (let j = 0; j< urls.length; j++) {
+                        for (let j = 0; j < urls.length; j++) {
                             urls[j] = RegexParser(urls[j])
                         }
 
@@ -320,7 +334,7 @@ export default {
 
 <style lang="sass">
 .ck.ck-reset_all, .ck.ck-reset_all *
-    // direction: ltr !important
+// direction: ltr !important
 
 .ck-content.ck-editor__editable
     resize: vertical

src/CkEditor.php

@@ -64,6 +64,13 @@ class CkEditor extends Field
      */
     public string $contentLanguage;
 
+    /**
+     * Force Paste As Plain Text
+     *
+     * @var bool
+     */
+    public bool $forcePasteAsPlainText;
+
     /**
      * Text Part Language
      *
@@ -208,6 +215,19 @@ public function contentLanguage(string $lang): self
         return $this;
     }
 
+    /**
+     * Set Force Paste As Plain Text
+     *
+     * @param bool $status
+     * @return $this
+     */
+    public function forcePasteAsPlainText(bool $status = true): self
+    {
+        $this->forcePasteAsPlainText = $status;
+
+        return $this;
+    }
+
     /**
      * Set Text Part Language
      *
@@ -331,6 +351,7 @@ public function jsonSerialize(): array
             'height'                 => $this->height,
             'indexLimit'             => $this->indexLimit,
             'contentLanguage'        => $this->contentLanguage,
+            'forcePasteAsPlainText'  => $this->forcePasteAsPlainText,
             'textPartLanguage'       => $this->textPartLanguage,
             'htmlSupport'            => $this->htmlSupport,
             'uiLanguage'             => $this->uiLanguage,
@@ -421,6 +442,7 @@ private function prepareToolbar(string $toolbar, array $items = null): void
         $this->fileBrowser = $toolbar['browser']['file'] ?? false;
         $this->snippetBrowser = $this->prepareSnippets($toolbar['snippets']);
         $this->contentLanguage = $toolbar['content-lang'];
+        $this->forcePasteAsPlainText = $toolbar['force-paste-as-plain-text'] ?? false;
         $this->textPartLanguage = $toolbar['text-part-language'] ?? $defaultTextPartLanguage;
         $this->htmlSupport = $toolbar['html-support'] ?? $defaultHtmlSupport;
         $this->uiLanguage = $toolbar['ui-language']['name'] ?? 'en';