@zeedhi/zd-richtext-vue 1.2.3 → 1.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/rich-text-vue.esm.js +34 -4
- package/dist/rich-text-vue.umd.js +32 -2
- package/package.json +2 -2
- package/types/RichText.d.ts +5 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import Vue from 'vue';
|
|
2
|
-
import { VersionService } from '@zeedhi/core';
|
|
3
|
-
import { PropWatch, ZdComponentRender, Vuetify } from '@zeedhi/vuetify';
|
|
2
|
+
import { I18n, VersionService } from '@zeedhi/core';
|
|
3
|
+
import { PropWatch, ZdComponentRender, setFillHeight, Vuetify } from '@zeedhi/vuetify';
|
|
4
4
|
import { Component } from 'vue-property-decorator';
|
|
5
5
|
import { RichText } from '@zeedhi/zd-richtext-common';
|
|
6
6
|
import 'tiptap-vuetify/dist/main.css';
|
|
@@ -55,10 +55,29 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
|
|
|
55
55
|
OrderedList,
|
|
56
56
|
];
|
|
57
57
|
this.instanceType = RichText;
|
|
58
|
+
this.componentKey = 1;
|
|
58
59
|
}
|
|
59
60
|
onKeyDown(event) {
|
|
60
61
|
this.instance.onKeyDown(this.$el, event.key);
|
|
61
62
|
}
|
|
63
|
+
changeLanguage() {
|
|
64
|
+
let newLanguage = I18n.instance.language.split('-')[0];
|
|
65
|
+
if (newLanguage === 'pt') {
|
|
66
|
+
newLanguage = 'ptbr';
|
|
67
|
+
}
|
|
68
|
+
this.tiptapVuetifyPlugin.vuetify.framework.lang.current = newLanguage;
|
|
69
|
+
this.componentKey += 1; // force update component render
|
|
70
|
+
}
|
|
71
|
+
mounted() {
|
|
72
|
+
this.changeLanguage();
|
|
73
|
+
if (this.instance.fillHeight) {
|
|
74
|
+
setFillHeight(this.$el);
|
|
75
|
+
}
|
|
76
|
+
I18n.registerChangeListener(this.changeLanguage);
|
|
77
|
+
}
|
|
78
|
+
destroyed() {
|
|
79
|
+
I18n.unregisterChangeListener(this.changeLanguage);
|
|
80
|
+
}
|
|
62
81
|
};
|
|
63
82
|
__decorate([
|
|
64
83
|
PropWatch({ type: String, default: 'json' }),
|
|
@@ -104,6 +123,13 @@ __decorate([
|
|
|
104
123
|
}),
|
|
105
124
|
__metadata("design:type", Object)
|
|
106
125
|
], ZdRichText.prototype, "height", void 0);
|
|
126
|
+
__decorate([
|
|
127
|
+
PropWatch({
|
|
128
|
+
type: [Boolean, String],
|
|
129
|
+
default: false,
|
|
130
|
+
}),
|
|
131
|
+
__metadata("design:type", Boolean)
|
|
132
|
+
], ZdRichText.prototype, "fillHeight", void 0);
|
|
107
133
|
ZdRichText = __decorate([
|
|
108
134
|
Component
|
|
109
135
|
], ZdRichText);
|
|
@@ -257,10 +283,14 @@ var __vue_render__ = function () {
|
|
|
257
283
|
},
|
|
258
284
|
],
|
|
259
285
|
class: ["zd-rich-text", _vm.instance.cssClass],
|
|
286
|
+
style: {
|
|
287
|
+
height: _vm.$formatSize(_vm.instance.height),
|
|
288
|
+
},
|
|
260
289
|
attrs: { id: _vm.instance.name, name: _vm.instance.name },
|
|
261
290
|
},
|
|
262
291
|
[
|
|
263
292
|
_c("tiptap-vuetify", {
|
|
293
|
+
key: _vm.componentKey,
|
|
264
294
|
attrs: {
|
|
265
295
|
"output-format": _vm.instance.outputFormat,
|
|
266
296
|
extensions: _vm.extensions,
|
|
@@ -274,7 +304,7 @@ var __vue_render__ = function () {
|
|
|
274
304
|
class: "zd-rich-text-content rounded-b-md",
|
|
275
305
|
outlined: _vm.instance.outlined,
|
|
276
306
|
width: _vm.instance.width,
|
|
277
|
-
height:
|
|
307
|
+
height: "100%",
|
|
278
308
|
style: _vm.instance.cssStyle,
|
|
279
309
|
dark: _vm.instance.dark,
|
|
280
310
|
light: _vm.instance.light,
|
|
@@ -305,7 +335,7 @@ __vue_render__._withStripped = true;
|
|
|
305
335
|
/* style */
|
|
306
336
|
const __vue_inject_styles__ = function (inject) {
|
|
307
337
|
if (!inject) return
|
|
308
|
-
inject("data-v-
|
|
338
|
+
inject("data-v-1be7bc9e_0", { source: ".zd-rich-text button.v-btn {\n color: #ffffff !important;\n}\n.zd-rich-text-content.theme--dark {\n background-color: #383838;\n}\n.zd-rich-text .tiptap-vuetify-editor {\n height: 100%;\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__toolbar header {\n background-color: var(--v-primary-base);\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 });
|
|
309
339
|
|
|
310
340
|
};
|
|
311
341
|
/* scoped */
|
|
@@ -58,10 +58,29 @@
|
|
|
58
58
|
OrderedList,
|
|
59
59
|
];
|
|
60
60
|
this.instanceType = zdRichtextCommon.RichText;
|
|
61
|
+
this.componentKey = 1;
|
|
61
62
|
}
|
|
62
63
|
onKeyDown(event) {
|
|
63
64
|
this.instance.onKeyDown(this.$el, event.key);
|
|
64
65
|
}
|
|
66
|
+
changeLanguage() {
|
|
67
|
+
let newLanguage = core.I18n.instance.language.split('-')[0];
|
|
68
|
+
if (newLanguage === 'pt') {
|
|
69
|
+
newLanguage = 'ptbr';
|
|
70
|
+
}
|
|
71
|
+
this.tiptapVuetifyPlugin.vuetify.framework.lang.current = newLanguage;
|
|
72
|
+
this.componentKey += 1; // force update component render
|
|
73
|
+
}
|
|
74
|
+
mounted() {
|
|
75
|
+
this.changeLanguage();
|
|
76
|
+
if (this.instance.fillHeight) {
|
|
77
|
+
vuetify.setFillHeight(this.$el);
|
|
78
|
+
}
|
|
79
|
+
core.I18n.registerChangeListener(this.changeLanguage);
|
|
80
|
+
}
|
|
81
|
+
destroyed() {
|
|
82
|
+
core.I18n.unregisterChangeListener(this.changeLanguage);
|
|
83
|
+
}
|
|
65
84
|
};
|
|
66
85
|
__decorate([
|
|
67
86
|
vuetify.PropWatch({ type: String, default: 'json' }),
|
|
@@ -107,6 +126,13 @@
|
|
|
107
126
|
}),
|
|
108
127
|
__metadata("design:type", Object)
|
|
109
128
|
], ZdRichText.prototype, "height", void 0);
|
|
129
|
+
__decorate([
|
|
130
|
+
vuetify.PropWatch({
|
|
131
|
+
type: [Boolean, String],
|
|
132
|
+
default: false,
|
|
133
|
+
}),
|
|
134
|
+
__metadata("design:type", Boolean)
|
|
135
|
+
], ZdRichText.prototype, "fillHeight", void 0);
|
|
110
136
|
ZdRichText = __decorate([
|
|
111
137
|
vuePropertyDecorator.Component
|
|
112
138
|
], ZdRichText);
|
|
@@ -260,10 +286,14 @@
|
|
|
260
286
|
},
|
|
261
287
|
],
|
|
262
288
|
class: ["zd-rich-text", _vm.instance.cssClass],
|
|
289
|
+
style: {
|
|
290
|
+
height: _vm.$formatSize(_vm.instance.height),
|
|
291
|
+
},
|
|
263
292
|
attrs: { id: _vm.instance.name, name: _vm.instance.name },
|
|
264
293
|
},
|
|
265
294
|
[
|
|
266
295
|
_c("tiptap-vuetify", {
|
|
296
|
+
key: _vm.componentKey,
|
|
267
297
|
attrs: {
|
|
268
298
|
"output-format": _vm.instance.outputFormat,
|
|
269
299
|
extensions: _vm.extensions,
|
|
@@ -277,7 +307,7 @@
|
|
|
277
307
|
class: "zd-rich-text-content rounded-b-md",
|
|
278
308
|
outlined: _vm.instance.outlined,
|
|
279
309
|
width: _vm.instance.width,
|
|
280
|
-
height:
|
|
310
|
+
height: "100%",
|
|
281
311
|
style: _vm.instance.cssStyle,
|
|
282
312
|
dark: _vm.instance.dark,
|
|
283
313
|
light: _vm.instance.light,
|
|
@@ -308,7 +338,7 @@
|
|
|
308
338
|
/* style */
|
|
309
339
|
const __vue_inject_styles__ = function (inject) {
|
|
310
340
|
if (!inject) return
|
|
311
|
-
inject("data-v-
|
|
341
|
+
inject("data-v-1be7bc9e_0", { source: ".zd-rich-text button.v-btn {\n color: #ffffff !important;\n}\n.zd-rich-text-content.theme--dark {\n background-color: #383838;\n}\n.zd-rich-text .tiptap-vuetify-editor {\n height: 100%;\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__toolbar header {\n background-color: var(--v-primary-base);\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 });
|
|
312
342
|
|
|
313
343
|
};
|
|
314
344
|
/* scoped */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zeedhi/zd-richtext-vue",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.1",
|
|
4
4
|
"description": "RichTextVue by BVR",
|
|
5
5
|
"main": "dist/rich-text-vue.umd.js",
|
|
6
6
|
"module": "dist/rich-text-vue.esm.js",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
"vue-class-component": "7.2.*",
|
|
25
25
|
"vue-property-decorator": "9.1.*"
|
|
26
26
|
},
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "7f117f141fe0b7f61cc45217c9827d791a408705"
|
|
28
28
|
}
|
package/types/RichText.d.ts
CHANGED
|
@@ -9,8 +9,13 @@ export default class ZdRichText extends ZdComponentRender {
|
|
|
9
9
|
outlined: boolean | string;
|
|
10
10
|
width: number | string;
|
|
11
11
|
height: number | string;
|
|
12
|
+
fillHeight: boolean;
|
|
12
13
|
extensions: Array<any>;
|
|
13
14
|
instance: RichText;
|
|
14
15
|
instanceType: typeof RichText;
|
|
15
16
|
onKeyDown(event: KeyboardEvent): void;
|
|
17
|
+
componentKey: number;
|
|
18
|
+
changeLanguage(): void;
|
|
19
|
+
mounted(): void;
|
|
20
|
+
destroyed(): void;
|
|
16
21
|
}
|