@zeedhi/zd-richtext-vue 1.1.0 → 1.1.3

package/dist/rich-text-vue.esm.js

@@ -1,7 +1,7 @@
-import { Prop, Component } from 'vue-property-decorator';
-import { RichText } from '@zeedhi/zd-richtext-common';
-import { ZdComponentRender, Vuetify } from '@zeedhi/vuetify';
 import Vue from 'vue';
+import { PropWatch, ZdComponentRender, Vuetify } from '@zeedhi/vuetify';
+import { Component } from 'vue-property-decorator';
+import { RichText } from '@zeedhi/zd-richtext-common';
 import 'tiptap-vuetify/dist/main.css';
 
 /*! *****************************************************************************
@@ -30,7 +30,7 @@ function __metadata(metadataKey, metadataValue) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
 }
 
-const { Bold, Italic, Strike, Underline, Code, ListItem, BulletList, OrderedList, HorizontalRule, Heading } = require('tiptap-vuetify');
+const { Bold, Italic, Strike, Underline, Code, ListItem, BulletList, OrderedList, HorizontalRule, Heading, } = require('tiptap-vuetify');
 let ZdRichText = class ZdRichText extends ZdComponentRender {
     constructor() {
         super(...arguments);
@@ -42,15 +42,15 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
             [Heading,
                 {
                     options: {
-                        levels: [1, 2, 3]
-                    }
-                }
+                        levels: [1, 2, 3],
+                    },
+                },
             ],
             Code,
             HorizontalRule,
             ListItem,
             BulletList,
-            OrderedList
+            OrderedList,
         ];
         this.instanceType = RichText;
     }
@@ -59,35 +59,35 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
     }
 };
 __decorate([
-    Prop({ type: String, default: 'json' }),
+    PropWatch({ type: String, default: 'json' }),
     __metadata("design:type", String)
 ], ZdRichText.prototype, "outputFormat", void 0);
 __decorate([
-    Prop({ type: String, default: '' }),
+    PropWatch({ type: String, default: '' }),
     __metadata("design:type", String)
 ], ZdRichText.prototype, "placeholder", void 0);
 __decorate([
-    Prop({ type: [Boolean, String], default: false }),
+    PropWatch({ type: [Boolean, String], default: false }),
     __metadata("design:type", Object)
 ], ZdRichText.prototype, "disabled", void 0);
 __decorate([
-    Prop({ type: String, default: 'var(--v-primary-base)' }),
+    PropWatch({ type: String, default: 'var(--v-primary-base)' }),
     __metadata("design:type", String)
 ], ZdRichText.prototype, "toolbarColor", void 0);
 __decorate([
-    Prop({ type: String, default: '' }),
+    PropWatch({ type: String, default: '' }),
     __metadata("design:type", String)
 ], ZdRichText.prototype, "cardColor", void 0);
 __decorate([
-    Prop({ type: [Boolean, String], default: false }),
+    PropWatch({ type: [Boolean, String], default: false }),
     __metadata("design:type", Object)
 ], ZdRichText.prototype, "outlined", void 0);
 __decorate([
-    Prop({ type: [Number, String], default: '' }),
+    PropWatch({ type: [Number, String], default: '' }),
     __metadata("design:type", Object)
 ], ZdRichText.prototype, "width", void 0);
 __decorate([
-    Prop({ type: [Number, String], default: '' }),
+    PropWatch({ type: [Number, String], default: '' }),
     __metadata("design:type", Object)
 ], ZdRichText.prototype, "height", void 0);
 ZdRichText = __decorate([
@@ -227,37 +227,39 @@ function addStyle(id, css) {
 const __vue_script__ = script;
 
 /* template */
-var __vue_render__ = function() {
+var __vue_render__ = function () {
   var _vm = this;
   var _h = _vm.$createElement;
   var _c = _vm._self._c || _h;
   return _c("tiptap-vuetify", {
+    staticClass: "zd-rich-text",
     attrs: {
+      id: _vm.instance.name,
       "output-format": _vm.instance.outputFormat,
       extensions: _vm.extensions,
       "toolbar-attributes": {
         color: _vm.instance.toolbarColor,
         class: "rounded-t",
-        width: _vm.instance.width
+        width: _vm.instance.width,
       },
       "card-props": {
         color: _vm.instance.cardColor,
         class: "rounded-b-md",
         outlined: _vm.instance.outlined,
         width: _vm.instance.width,
-        height: _vm.instance.height
+        height: _vm.instance.height,
       },
       placeholder: _vm.instance.placeholder,
-      disabled: _vm.instance.disabled
+      disabled: _vm.instance.disabled,
     },
     on: { keydown: _vm.onKeyDown },
     model: {
       value: _vm.instance.content,
-      callback: function($$v) {
+      callback: function ($$v) {
         _vm.$set(_vm.instance, "content", $$v);
       },
-      expression: "instance.content"
-    }
+      expression: "instance.content",
+    },
   })
 };
 var __vue_staticRenderFns__ = [];
@@ -266,7 +268,7 @@ __vue_render__._withStripped = true;
   /* style */
   const __vue_inject_styles__ = function (inject) {
     if (!inject) return
-    inject("data-v-646cc640_0", { source: "button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n\n/*# sourceMappingURL=RichText.vue.map */", map: {"version":3,"sources":["/Users/zedmartins/workfolder/zeedhi/richtext/packages/vue/src/RichText.vue","RichText.vue"],"names":[],"mappings":"AA2BA;EACA,cAAA;AC1BA;;AAEA,uCAAuC","file":"RichText.vue","sourcesContent":["<template>\n  <tiptap-vuetify\n    v-model=\"instance.content\"\n    :output-format=\"instance.outputFormat\"\n    :extensions=\"extensions\"\n    :toolbar-attributes=\"{\n      color: instance.toolbarColor,\n      class: 'rounded-t',\n      width: instance.width,\n    }\"\n    :card-props=\"{\n      color: instance.cardColor,\n      class: 'rounded-b-md',\n      outlined: instance.outlined,\n      width: instance.width,\n      height: instance.height,\n    }\"\n    :placeholder=\"instance.placeholder\"\n    :disabled=\"instance.disabled\"\n    @keydown=\"onKeyDown\"\n  >\n  </tiptap-vuetify>\n</template>\n\n<script lang=\"ts\" src=\"./RichText.ts\"></script>\n\n<style lang=\"scss\">\nbutton.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n</style>","button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n\n/*# sourceMappingURL=RichText.vue.map */"]}, media: undefined });
+    inject("data-v-42bd6876_0", { source: ".zd-rich-text button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n.zd-rich-text div.v-card {\n  display: flex;\n  flex-direction: column;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__toolbar {\n  display: flex;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content {\n  flex-grow: 1;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content .ProseMirror {\n  margin: var(--spacing-2) !important;\n  height: 100%;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content .ProseMirror p {\n  margin-top: var(--spacing-2) !important;\n  margin-bottom: var(--spacing-2) !important;\n}", map: undefined, media: undefined });
 
   };
   /* scoped */
@@ -298,8 +300,8 @@ const TiptapVuetify = require('tiptap-vuetify');
 // tiptap-vuetify
 Vue.use(TiptapVuetify.TiptapVuetifyPlugin, {
     vuetify: new Vuetify(),
-    iconsGroup: 'mdi'
+    iconsGroup: 'mdi',
 });
 Vue.component('tiptap-vuetify', TiptapVuetify.TiptapVuetify);
 
-export { __vue_component__ as RichText };
+export { __vue_component__ as ZdRichText };

package/dist/rich-text-vue.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue-property-decorator'), require('@zeedhi/zd-richtext-common'), require('@zeedhi/vuetify'), require('vue'), require('tiptap-vuetify/dist/main.css')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'vue-property-decorator', '@zeedhi/zd-richtext-common', '@zeedhi/vuetify', 'vue', 'tiptap-vuetify/dist/main.css'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@zeedhi/zd-richtext-vue"] = {}, global["vue-property-decorator"], global["@zeedhi/zd-richtext-common"], global["@zeedhi/vuetify"], global.vue));
-})(this, (function (exports, vuePropertyDecorator, zdRichtextCommon, vuetify, Vue) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('@zeedhi/vuetify'), require('vue-property-decorator'), require('@zeedhi/zd-richtext-common'), require('tiptap-vuetify/dist/main.css')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'vue', '@zeedhi/vuetify', 'vue-property-decorator', '@zeedhi/zd-richtext-common', 'tiptap-vuetify/dist/main.css'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@zeedhi/zd-richtext-vue"] = {}, global.vue, global["@zeedhi/vuetify"], global["vue-property-decorator"], global["@zeedhi/zd-richtext-common"]));
+})(this, (function (exports, Vue, vuetify, vuePropertyDecorator, zdRichtextCommon) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -34,7 +34,7 @@
         if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
     }
 
-    const { Bold, Italic, Strike, Underline, Code, ListItem, BulletList, OrderedList, HorizontalRule, Heading } = require('tiptap-vuetify');
+    const { Bold, Italic, Strike, Underline, Code, ListItem, BulletList, OrderedList, HorizontalRule, Heading, } = require('tiptap-vuetify');
     let ZdRichText = class ZdRichText extends vuetify.ZdComponentRender {
         constructor() {
             super(...arguments);
@@ -46,15 +46,15 @@
                 [Heading,
                     {
                         options: {
-                            levels: [1, 2, 3]
-                        }
-                    }
+                            levels: [1, 2, 3],
+                        },
+                    },
                 ],
                 Code,
                 HorizontalRule,
                 ListItem,
                 BulletList,
-                OrderedList
+                OrderedList,
             ];
             this.instanceType = zdRichtextCommon.RichText;
         }
@@ -63,35 +63,35 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'json' }),
+        vuetify.PropWatch({ type: String, default: 'json' }),
         __metadata("design:type", String)
     ], ZdRichText.prototype, "outputFormat", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], ZdRichText.prototype, "placeholder", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], ZdRichText.prototype, "disabled", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'var(--v-primary-base)' }),
+        vuetify.PropWatch({ type: String, default: 'var(--v-primary-base)' }),
         __metadata("design:type", String)
     ], ZdRichText.prototype, "toolbarColor", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], ZdRichText.prototype, "cardColor", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], ZdRichText.prototype, "outlined", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: '' }),
+        vuetify.PropWatch({ type: [Number, String], default: '' }),
         __metadata("design:type", Object)
     ], ZdRichText.prototype, "width", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: '' }),
+        vuetify.PropWatch({ type: [Number, String], default: '' }),
         __metadata("design:type", Object)
     ], ZdRichText.prototype, "height", void 0);
     ZdRichText = __decorate([
@@ -231,37 +231,39 @@
     const __vue_script__ = script;
 
     /* template */
-    var __vue_render__ = function() {
+    var __vue_render__ = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
       return _c("tiptap-vuetify", {
+        staticClass: "zd-rich-text",
         attrs: {
+          id: _vm.instance.name,
           "output-format": _vm.instance.outputFormat,
           extensions: _vm.extensions,
           "toolbar-attributes": {
             color: _vm.instance.toolbarColor,
             class: "rounded-t",
-            width: _vm.instance.width
+            width: _vm.instance.width,
           },
           "card-props": {
             color: _vm.instance.cardColor,
             class: "rounded-b-md",
             outlined: _vm.instance.outlined,
             width: _vm.instance.width,
-            height: _vm.instance.height
+            height: _vm.instance.height,
           },
           placeholder: _vm.instance.placeholder,
-          disabled: _vm.instance.disabled
+          disabled: _vm.instance.disabled,
         },
         on: { keydown: _vm.onKeyDown },
         model: {
           value: _vm.instance.content,
-          callback: function($$v) {
+          callback: function ($$v) {
             _vm.$set(_vm.instance, "content", $$v);
           },
-          expression: "instance.content"
-        }
+          expression: "instance.content",
+        },
       })
     };
     var __vue_staticRenderFns__ = [];
@@ -270,7 +272,7 @@
       /* style */
       const __vue_inject_styles__ = function (inject) {
         if (!inject) return
-        inject("data-v-646cc640_0", { source: "button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n\n/*# sourceMappingURL=RichText.vue.map */", map: {"version":3,"sources":["/Users/zedmartins/workfolder/zeedhi/richtext/packages/vue/src/RichText.vue","RichText.vue"],"names":[],"mappings":"AA2BA;EACA,cAAA;AC1BA;;AAEA,uCAAuC","file":"RichText.vue","sourcesContent":["<template>\n  <tiptap-vuetify\n    v-model=\"instance.content\"\n    :output-format=\"instance.outputFormat\"\n    :extensions=\"extensions\"\n    :toolbar-attributes=\"{\n      color: instance.toolbarColor,\n      class: 'rounded-t',\n      width: instance.width,\n    }\"\n    :card-props=\"{\n      color: instance.cardColor,\n      class: 'rounded-b-md',\n      outlined: instance.outlined,\n      width: instance.width,\n      height: instance.height,\n    }\"\n    :placeholder=\"instance.placeholder\"\n    :disabled=\"instance.disabled\"\n    @keydown=\"onKeyDown\"\n  >\n  </tiptap-vuetify>\n</template>\n\n<script lang=\"ts\" src=\"./RichText.ts\"></script>\n\n<style lang=\"scss\">\nbutton.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n</style>","button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n\n/*# sourceMappingURL=RichText.vue.map */"]}, media: undefined });
+        inject("data-v-42bd6876_0", { source: ".zd-rich-text button.v-btn.v-btn--icon.v-btn--round.theme--light.v-size--small.tiptap-vuetify-editor__action-render-btn {\n  color: #ffffff;\n}\n.zd-rich-text div.v-card {\n  display: flex;\n  flex-direction: column;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__toolbar {\n  display: flex;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content {\n  flex-grow: 1;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content .ProseMirror {\n  margin: var(--spacing-2) !important;\n  height: 100%;\n}\n.zd-rich-text div.v-card div.tiptap-vuetify-editor__content .ProseMirror p {\n  margin-top: var(--spacing-2) !important;\n  margin-bottom: var(--spacing-2) !important;\n}", map: undefined, media: undefined });
 
       };
       /* scoped */
@@ -302,11 +304,11 @@
     // tiptap-vuetify
     Vue__default["default"].use(TiptapVuetify.TiptapVuetifyPlugin, {
         vuetify: new vuetify.Vuetify(),
-        iconsGroup: 'mdi'
+        iconsGroup: 'mdi',
     });
     Vue__default["default"].component('tiptap-vuetify', TiptapVuetify.TiptapVuetify);
 
-    exports.RichText = __vue_component__;
+    exports.ZdRichText = __vue_component__;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@zeedhi/zd-richtext-vue",
-  "version": "1.1.0",
+  "version": "1.1.3",
   "description": "RichTextVue by BVR",
-  "publishConfig": {
-    "access": "public"
-  },
   "main": "dist/rich-text-vue.umd.js",
   "module": "dist/rich-text-vue.esm.js",
   "typings": "types/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
   "scripts": {
     "build": "rollup -c",
     "lint": "eslint . --ext .ts --fix",
@@ -23,5 +23,5 @@
     "vue-class-component": "^7.2.6",
     "vue-property-decorator": "^9.1.2"
   },
-  "gitHead": "7f88f3d7f9bc750789f2ecea3b363472c61ee6c4"
+  "gitHead": "c98c8914c914ea773b0881c890ae0601361fabcf"
 }

package/types/index.d.ts

@@ -1,3 +1,3 @@
-import RichText from './RichText.vue';
+import ZdRichText from './RichText.vue';
 import 'tiptap-vuetify/dist/main.css';
-export { RichText };
+export { ZdRichText };

package/types/public.d.ts

@@ -1,2 +1,2 @@
-import RichText from './RichText';
-export { RichText };
+import ZdRichText from './RichText';
+export { ZdRichText };