@optimuscms/editor - npm Package Compare versions

Comparing version 2.0.4 to 2.1.0

package.json

 {
   "name": "@optimuscms/editor",
-  "version": "2.0.4",
+  "version": "2.1.0",
   "author": "Rich Moore",
@@ -5,0 +5,0 @@ "license": "MIT",

README.md

@@ -1,1 +0,52 @@
-# TODO
+# Optimus Editor
+
+The Optimus CMS WYSIWYG editor powered by TinyMCE.
+
+## Installation
+
+```bash
+npm install @optimuscms/editor --save
+yarn add @optimuscms/editor
+```
+
+```javascript
+import Editor from '@optimuscms/editor';
+
+Vue.use(Editor, {
+    apiKey: 'your-api-key'
+});
+```
+
+## Usage
+
+### Configuration
+
+The default configuration [options](src/config.js) can be modified using any of the TinyMCE options.
+
+```javascript
+import Editor, { config } from '@optimuscms/editor';
+
+config.branding = true;
+
+Vue.use(Editor, {
+    apiKey: 'your-api-key'
+});
+```
+
+### Component
+
+The plugin registers an `<editor>` component.
+
+```vue
+<editor v-model="content"></editor>
+```
+
+It's also possible to modifiy a specific component's configuration options via the `config` prop.
+
+```vue
+<editor v-model="content" :config="{ branding: true }"></editor>
+```
+
+## License
+
+The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

src/index.js

@@ -1,21 +0,11 @@
-import * as values from './values';
-import BaseEditor from '@tinymce/tinymce-vue';
+import defaultConfig from './config';
+import Editor from './Editor';
 
-export default function install(Vue, { store, options = {} }) {
-    Vue.component('editor', {
-        template: `<base-editor :api-key="apiKey" v-model="content" :init="init"></base-editor>`,
+export default function install(Vue, { apiKey }) {
+    Vue.component('editor', Vue.extend({
+        extends: Editor,
 
-        components: { BaseEditor },
-        
-        props: {
-            value: String,
-            height: Number,
-            toolbar: String,
-            plugins: String
-        },
-
         data() {
             return {
-                apiKey: options.apiKey,
-                content: this.value
+                apiKey: apiKey,
             }
@@ -26,76 +16,8 @@ },
             init() {
-                return {
-                    branding: false,
-                    menubar: options.menubar || false,
-                    height: this.height || options.height || 500,
-                    body_class: options.body_class || 'content p-3',
-                    content_css : options.content_css || '/css/front/app.css',
-                    style_formats: options.style_formats || values.styleFormats,
-                    plugins: this.plugins || options.plugins || 'hr image link lists paste table',
-
-                    toolbar: this.toolbar || options.toolbar || `
-                        undo redo | 
-                        styleselect | 
-                        bold italic underline | 
-                        alignleft aligncenter alignright | 
-                        bullist numlist hr blockquote | 
-                        table link image | 
-                        removeformat | 
-                    `,
-
-                    formats: {
-                        alignleft: {
-                            classes: '',
-                            selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,table,img'
-                        },
-                        aligncenter: {
-                            classes: 'has-text-centered',
-                            selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,table,img'
-                        },
-                        alignright: {
-                            classes: 'has-text-right',
-                            selector: 'p,h1,h2,h3,h4,h5,h6,td,th,div,table,img'
-                        }
-                    },
-
-                    table_responsive_width: true,
-                    table_appearance_options: false,
-                    table_default_styles: {
-                        width: '100%'
-                    },
-                    table_default_attributes: {
-                        border: 0,
-                        class: 'table is-bordered'
-                    },
-
-                    file_picker_types: 'image',
-                    file_picker_callback: (callback, value, meta) => {
-                        eventBus.$emit('media-manager-open', {
-                            limit: 1,
-                            accept: store.getters['media/imageExtensions']
-                        });
-
-                        eventBus.$on('media-selected', mediaIds => {
-                            callback(store.getters['media/getActiveMedia'](mediaIds)[0].url, {
-                                alt: store.getters['media/getActiveMedia'](mediaIds)[0].name
-                            });
-                        });
-                    }
-                }
+                return Object.assign({}, defaultConfig, this.config);
             }
-        },
-
-        watch: {
-            value(value) {
-                this.content = value;
-            },
-
-            content(value) {
-                this.$emit('input', value);
-            }
         }
-    });
-
+    }));
 }
 
-export * from './values';
+export { defaultConfig as config };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7553

increased by16.96%

Number of lines in readme file

53

increased by2550%

Worsened metrics

Lines of code

118

decreased by-19.18%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes