@zeedhi/zd-richtext-vue 1.5.1 → 1.5.3

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.
@@ -1,5 +1,5 @@
1
1
  import { I18n, VersionService } from '@zeedhi/core';
2
- import { PropWatch, ZdComponentRender, setFillHeight, Vuetify } from '@zeedhi/vuetify';
2
+ import { PropWatch, ZdComponentRender, FillHeightMixin, Vuetify } from '@zeedhi/vuetify';
3
3
  import { locale, createVuetifyProTipTap, VuetifyTiptap } from '@zeedhi/zd-vuetify-pro-tiptap';
4
4
  import '@zeedhi/zd-vuetify-pro-tiptap/lib/style.css';
5
5
  import Vue, { ref } from 'vue';
@@ -74,6 +74,7 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
74
74
  super(...arguments);
75
75
  this.instanceType = RichText;
76
76
  this.isMounted = false;
77
+ this.isFocused = false;
77
78
  this.extensions = [FontFamily$1];
78
79
  this.toolbar = ref([
79
80
  'bold',
@@ -121,6 +122,49 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
121
122
  this.toolbarReadonly = ref([
122
123
  // 'bold',
123
124
  ]);
125
+ this.toolbarFullscreen = ref([
126
+ 'bold',
127
+ 'italic',
128
+ 'underline',
129
+ 'strike',
130
+ 'color',
131
+ // "highlight",
132
+ '|',
133
+ 'h1',
134
+ 'h2',
135
+ 'h3',
136
+ 'h4',
137
+ 'h5',
138
+ // "h6",
139
+ // "p",
140
+ '|',
141
+ 'left',
142
+ 'center',
143
+ 'right',
144
+ 'justify',
145
+ '|',
146
+ 'bulletList',
147
+ 'orderedList',
148
+ // "taskList",
149
+ // "indent",
150
+ // "outdent",
151
+ '|',
152
+ // "link",
153
+ 'image',
154
+ // "video",
155
+ // "table",
156
+ // "blockquote",
157
+ 'rule',
158
+ 'code',
159
+ '|',
160
+ // "codeBlock",
161
+ // "|",
162
+ // "clear",
163
+ 'fullscreen',
164
+ // "undo",
165
+ // "redo",
166
+ '#fontFamily',
167
+ ]);
124
168
  }
125
169
  onKeyDown(event) {
126
170
  this.instance.onKeyDown(this.$el, event.key);
@@ -140,12 +184,14 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
140
184
  onFocus(event) {
141
185
  this.instance.onFocus(event);
142
186
  this.initialFocusValue = this.instance.content;
187
+ this.isFocused = true;
143
188
  }
144
189
  onBlur(event) {
145
190
  this.instance.onBlur(event);
146
191
  if (this.initialFocusValue !== this.instance.content) {
147
192
  this.instance.onChange(this.instance.content);
148
193
  }
194
+ this.isFocused = false;
149
195
  }
150
196
  created() {
151
197
  if (!getInstalled()) {
@@ -170,9 +216,6 @@ let ZdRichText = class ZdRichText extends ZdComponentRender {
170
216
  }
171
217
  }
172
218
  this.changeLanguage();
173
- if (this.instance.fillHeight) {
174
- setFillHeight(this.$el);
175
- }
176
219
  I18n.registerChangeListener(this.changeLanguage);
177
220
  this.setEditorDisabled();
178
221
  this.isMounted = true;
@@ -225,6 +268,10 @@ __decorate([
225
268
  PropWatch({ type: Array, default: () => (fonts) }),
226
269
  __metadata("design:type", Array)
227
270
  ], ZdRichText.prototype, "fonts", void 0);
271
+ __decorate([
272
+ PropWatch({ type: Boolean, default: false }),
273
+ __metadata("design:type", Boolean)
274
+ ], ZdRichText.prototype, "enableFullscreen", void 0);
228
275
  __decorate([
229
276
  PropWatch({
230
277
  type: [Boolean, String],
@@ -267,6 +314,13 @@ __decorate([
267
314
  }),
268
315
  __metadata("design:type", Boolean)
269
316
  ], ZdRichText.prototype, "fillHeight", void 0);
317
+ __decorate([
318
+ PropWatch({
319
+ type: String,
320
+ default: '',
321
+ }),
322
+ __metadata("design:type", String)
323
+ ], ZdRichText.prototype, "label", void 0);
270
324
  __decorate([
271
325
  Watch('instance.content'),
272
326
  __metadata("design:type", Function),
@@ -275,6 +329,7 @@ __decorate([
275
329
  ], ZdRichText.prototype, "input", null);
276
330
  ZdRichText = __decorate([
277
331
  Component$1({
332
+ mixins: [FillHeightMixin],
278
333
  components: { EditorContent },
279
334
  })
280
335
  ], ZdRichText);
@@ -427,87 +482,121 @@ var __vue_render__$1 = function () {
427
482
  expression: "instance.isVisible",
428
483
  },
429
484
  ],
430
- class: ["zd-rich-text", "zd-elevation-2", _vm.instance.cssClass],
431
- style: {
432
- height: _vm.$formatSize(_vm.instance.height),
433
- },
485
+ class: ["zd-rich-text"],
434
486
  attrs: { id: _vm.instance.name, name: _vm.instance.name },
435
- on: {
436
- keydown: function ($event) {
437
- return _vm.onKeyDown($event)
438
- },
439
- },
440
487
  },
441
488
  [
442
- _c("vuetify-tiptap", {
443
- ref: "tiptap",
444
- class: [
445
- { "zd-rich-text--disabled": _vm.instance.disabled },
446
- _vm.readonly && !_vm.hasClass() && "zd-rich-text--readonly",
447
- ],
448
- attrs: {
449
- markdownTheme: false,
450
- dark: _vm.instance.dark,
451
- disabled: _vm.instance.disabled,
452
- readonly: _vm.instance.readonly,
453
- outlined: _vm.instance.outlined,
454
- placeholder: _vm.instance.placeholder,
455
- toolbar: _vm.readonly ? _vm.toolbarReadonly : _vm.toolbar,
456
- rounded: "",
457
- "max-width": _vm.instance.width,
458
- extensions: _vm.extensions,
459
- },
460
- scopedSlots: _vm._u([
461
- {
462
- key: "editor",
463
- fn: function (ref) {
464
- var editor = ref.editor;
465
- var attrs = ref.attrs;
466
- return [
467
- _c("editor-content", {
468
- staticClass:
469
- "vuetify-pro-tiptap-editor__content zd-rich-text-content markdown-theme-github",
470
- class: [{ __dark: attrs.isDark }, attrs.editorClass],
471
- style: attrs.contentDynamicStyles,
472
- attrs: { editor: editor, "data-testid": "value" },
473
- }),
489
+ _vm.instance.label
490
+ ? _c("span", [
491
+ _c(
492
+ "label",
493
+ {
494
+ staticClass: "v-label v-label--active theme--light",
495
+ class: { "label--focused": _vm.isFocused },
496
+ },
497
+ [
498
+ _vm._v(
499
+ "\n " + _vm._s(_vm.$t(_vm.instance.label)) + "\n "
500
+ ),
474
501
  ]
475
- },
476
- },
477
- {
478
- key: "bottom",
479
- fn: function (ref) {
480
- return [_c("span")]
481
- },
502
+ ),
503
+ ])
504
+ : _vm._e(),
505
+ _vm._v(" "),
506
+ _c(
507
+ "div",
508
+ {
509
+ class: ["zd-rich-text", "zd-elevation-2", _vm.instance.cssClass],
510
+ style: {
511
+ height: _vm.$formatSize(_vm.instance.height),
482
512
  },
483
- {
484
- key: "fontFamily",
485
- fn: function (ref) {
486
- var editor = ref.editor;
487
- var attrs = ref.attrs;
488
- return [
489
- _c("FontFamily", {
490
- attrs: {
491
- name: _vm.instance.name + "-fontFamily",
492
- editor: editor,
493
- attrs: attrs,
494
- fonts: _vm.instance.fonts,
495
- },
496
- }),
497
- ]
513
+ on: {
514
+ keydown: function ($event) {
515
+ return _vm.onKeyDown($event)
498
516
  },
499
517
  },
500
- ]),
501
- model: {
502
- value: _vm.instance.content,
503
- callback: function ($$v) {
504
- _vm.$set(_vm.instance, "content", $$v);
505
- },
506
- expression: "instance.content",
507
518
  },
508
- }),
509
- ],
510
- 1
519
+ [
520
+ _c("vuetify-tiptap", {
521
+ ref: "tiptap",
522
+ class: [
523
+ { "zd-rich-text--disabled": _vm.instance.disabled },
524
+ _vm.readonly && !_vm.hasClass() && "zd-rich-text--readonly",
525
+ ],
526
+ attrs: {
527
+ markdownTheme: false,
528
+ dark: _vm.instance.dark,
529
+ disabled: _vm.instance.disabled,
530
+ readonly: _vm.instance.readonly,
531
+ outlined: _vm.instance.outlined,
532
+ placeholder: _vm.instance.placeholder,
533
+ toolbar: _vm.readonly
534
+ ? _vm.toolbarReadonly
535
+ : _vm.enableFullscreen
536
+ ? _vm.toolbarFullscreen
537
+ : _vm.toolbar,
538
+ rounded: "",
539
+ "max-width": _vm.instance.width,
540
+ extensions: _vm.extensions,
541
+ },
542
+ on: {
543
+ onFocus: function ($event) {
544
+ return _vm.onFocus($event)
545
+ },
546
+ },
547
+ scopedSlots: _vm._u([
548
+ {
549
+ key: "editor",
550
+ fn: function (ref) {
551
+ var editor = ref.editor;
552
+ var attrs = ref.attrs;
553
+ return [
554
+ _c("editor-content", {
555
+ staticClass:
556
+ "vuetify-pro-tiptap-editor__content zd-rich-text-content markdown-theme-github",
557
+ class: [{ __dark: attrs.isDark }, attrs.editorClass],
558
+ style: attrs.contentDynamicStyles,
559
+ attrs: { editor: editor, "data-testid": "value" },
560
+ }),
561
+ ]
562
+ },
563
+ },
564
+ {
565
+ key: "bottom",
566
+ fn: function (ref) {
567
+ return [_c("span")]
568
+ },
569
+ },
570
+ {
571
+ key: "fontFamily",
572
+ fn: function (ref) {
573
+ var editor = ref.editor;
574
+ var attrs = ref.attrs;
575
+ return [
576
+ _c("FontFamily", {
577
+ attrs: {
578
+ name: _vm.instance.name + "-fontFamily",
579
+ editor: editor,
580
+ attrs: attrs,
581
+ fonts: _vm.instance.fonts,
582
+ },
583
+ }),
584
+ ]
585
+ },
586
+ },
587
+ ]),
588
+ model: {
589
+ value: _vm.instance.content,
590
+ callback: function ($$v) {
591
+ _vm.$set(_vm.instance, "content", $$v);
592
+ },
593
+ expression: "instance.content",
594
+ },
595
+ }),
596
+ ],
597
+ 1
598
+ ),
599
+ ]
511
600
  )
512
601
  };
513
602
  var __vue_staticRenderFns__$1 = [];
@@ -516,7 +605,7 @@ __vue_render__$1._withStripped = true;
516
605
  /* style */
517
606
  const __vue_inject_styles__$1 = function (inject) {
518
607
  if (!inject) return
519
- inject("data-v-45ed460e_0", { source: ".zd-rich-text #tippy-1 {\n display: none;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--light.rounded {\n background-color: #ffffff !important;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--dark.rounded {\n background-color: #383838 !important;\n}\n.zd-rich-text .zd-rich-text--disabled .vuetify-pro-tiptap-editor__toolbar {\n pointer-events: none;\n opacity: 0.5;\n}\n.zd-rich-text .zd-rich-text--readonly {\n width: 741px;\n}\n.zd-rich-text .v-toolbar__content button.v-btn {\n color: #ffffff !important;\n}", map: undefined, media: undefined });
608
+ inject("data-v-58cf5ffa_0", { source: ".zd-rich-text #tippy-1 {\n display: none;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor--fullscreen .vuetify-pro-tiptap-editor__content {\n height: -webkit-fill-available;\n}\n.zd-rich-text .v-label {\n top: calc(-10px - var(--spacing-2));\n max-width: 100%;\n transform: none;\n font-size: var(--zd-font-body1-size);\n left: 0 !important;\n line-height: 15px;\n height: auto;\n font-weight: var(--zd-font-body1-weight);\n}\n.zd-rich-text .label--focused {\n transition: 0ms;\n color: var(--v-primary-base);\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--light.rounded {\n background-color: #ffffff !important;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--dark.rounded {\n background-color: #383838 !important;\n}\n.zd-rich-text .zd-rich-text--disabled .vuetify-pro-tiptap-editor__toolbar {\n pointer-events: none;\n opacity: 0.5;\n}\n.zd-rich-text .zd-rich-text--readonly {\n width: 741px;\n}\n.zd-rich-text .v-toolbar__content button.v-btn {\n color: #ffffff !important;\n}", map: undefined, media: undefined });
520
609
 
521
610
  };
522
611
  /* scoped */
@@ -74,6 +74,7 @@
74
74
  super(...arguments);
75
75
  this.instanceType = zdRichtextCommon.RichText;
76
76
  this.isMounted = false;
77
+ this.isFocused = false;
77
78
  this.extensions = [extensionFontFamily.FontFamily];
78
79
  this.toolbar = Vue.ref([
79
80
  'bold',
@@ -121,6 +122,49 @@
121
122
  this.toolbarReadonly = Vue.ref([
122
123
  // 'bold',
123
124
  ]);
125
+ this.toolbarFullscreen = Vue.ref([
126
+ 'bold',
127
+ 'italic',
128
+ 'underline',
129
+ 'strike',
130
+ 'color',
131
+ // "highlight",
132
+ '|',
133
+ 'h1',
134
+ 'h2',
135
+ 'h3',
136
+ 'h4',
137
+ 'h5',
138
+ // "h6",
139
+ // "p",
140
+ '|',
141
+ 'left',
142
+ 'center',
143
+ 'right',
144
+ 'justify',
145
+ '|',
146
+ 'bulletList',
147
+ 'orderedList',
148
+ // "taskList",
149
+ // "indent",
150
+ // "outdent",
151
+ '|',
152
+ // "link",
153
+ 'image',
154
+ // "video",
155
+ // "table",
156
+ // "blockquote",
157
+ 'rule',
158
+ 'code',
159
+ '|',
160
+ // "codeBlock",
161
+ // "|",
162
+ // "clear",
163
+ 'fullscreen',
164
+ // "undo",
165
+ // "redo",
166
+ '#fontFamily',
167
+ ]);
124
168
  }
125
169
  onKeyDown(event) {
126
170
  this.instance.onKeyDown(this.$el, event.key);
@@ -140,12 +184,14 @@
140
184
  onFocus(event) {
141
185
  this.instance.onFocus(event);
142
186
  this.initialFocusValue = this.instance.content;
187
+ this.isFocused = true;
143
188
  }
144
189
  onBlur(event) {
145
190
  this.instance.onBlur(event);
146
191
  if (this.initialFocusValue !== this.instance.content) {
147
192
  this.instance.onChange(this.instance.content);
148
193
  }
194
+ this.isFocused = false;
149
195
  }
150
196
  created() {
151
197
  if (!getInstalled()) {
@@ -170,9 +216,6 @@
170
216
  }
171
217
  }
172
218
  this.changeLanguage();
173
- if (this.instance.fillHeight) {
174
- vuetify$1.setFillHeight(this.$el);
175
- }
176
219
  core.I18n.registerChangeListener(this.changeLanguage);
177
220
  this.setEditorDisabled();
178
221
  this.isMounted = true;
@@ -225,6 +268,10 @@
225
268
  vuetify$1.PropWatch({ type: Array, default: () => (fonts) }),
226
269
  __metadata("design:type", Array)
227
270
  ], ZdRichText.prototype, "fonts", void 0);
271
+ __decorate([
272
+ vuetify$1.PropWatch({ type: Boolean, default: false }),
273
+ __metadata("design:type", Boolean)
274
+ ], ZdRichText.prototype, "enableFullscreen", void 0);
228
275
  __decorate([
229
276
  vuetify$1.PropWatch({
230
277
  type: [Boolean, String],
@@ -267,6 +314,13 @@
267
314
  }),
268
315
  __metadata("design:type", Boolean)
269
316
  ], ZdRichText.prototype, "fillHeight", void 0);
317
+ __decorate([
318
+ vuetify$1.PropWatch({
319
+ type: String,
320
+ default: '',
321
+ }),
322
+ __metadata("design:type", String)
323
+ ], ZdRichText.prototype, "label", void 0);
270
324
  __decorate([
271
325
  vuePropertyDecorator.Watch('instance.content'),
272
326
  __metadata("design:type", Function),
@@ -275,6 +329,7 @@
275
329
  ], ZdRichText.prototype, "input", null);
276
330
  ZdRichText = __decorate([
277
331
  vuePropertyDecorator.Component({
332
+ mixins: [vuetify$1.FillHeightMixin],
278
333
  components: { EditorContent: vue2.EditorContent },
279
334
  })
280
335
  ], ZdRichText);
@@ -427,87 +482,121 @@
427
482
  expression: "instance.isVisible",
428
483
  },
429
484
  ],
430
- class: ["zd-rich-text", "zd-elevation-2", _vm.instance.cssClass],
431
- style: {
432
- height: _vm.$formatSize(_vm.instance.height),
433
- },
485
+ class: ["zd-rich-text"],
434
486
  attrs: { id: _vm.instance.name, name: _vm.instance.name },
435
- on: {
436
- keydown: function ($event) {
437
- return _vm.onKeyDown($event)
438
- },
439
- },
440
487
  },
441
488
  [
442
- _c("vuetify-tiptap", {
443
- ref: "tiptap",
444
- class: [
445
- { "zd-rich-text--disabled": _vm.instance.disabled },
446
- _vm.readonly && !_vm.hasClass() && "zd-rich-text--readonly",
447
- ],
448
- attrs: {
449
- markdownTheme: false,
450
- dark: _vm.instance.dark,
451
- disabled: _vm.instance.disabled,
452
- readonly: _vm.instance.readonly,
453
- outlined: _vm.instance.outlined,
454
- placeholder: _vm.instance.placeholder,
455
- toolbar: _vm.readonly ? _vm.toolbarReadonly : _vm.toolbar,
456
- rounded: "",
457
- "max-width": _vm.instance.width,
458
- extensions: _vm.extensions,
459
- },
460
- scopedSlots: _vm._u([
461
- {
462
- key: "editor",
463
- fn: function (ref) {
464
- var editor = ref.editor;
465
- var attrs = ref.attrs;
466
- return [
467
- _c("editor-content", {
468
- staticClass:
469
- "vuetify-pro-tiptap-editor__content zd-rich-text-content markdown-theme-github",
470
- class: [{ __dark: attrs.isDark }, attrs.editorClass],
471
- style: attrs.contentDynamicStyles,
472
- attrs: { editor: editor, "data-testid": "value" },
473
- }),
489
+ _vm.instance.label
490
+ ? _c("span", [
491
+ _c(
492
+ "label",
493
+ {
494
+ staticClass: "v-label v-label--active theme--light",
495
+ class: { "label--focused": _vm.isFocused },
496
+ },
497
+ [
498
+ _vm._v(
499
+ "\n " + _vm._s(_vm.$t(_vm.instance.label)) + "\n "
500
+ ),
474
501
  ]
475
- },
476
- },
477
- {
478
- key: "bottom",
479
- fn: function (ref) {
480
- return [_c("span")]
481
- },
502
+ ),
503
+ ])
504
+ : _vm._e(),
505
+ _vm._v(" "),
506
+ _c(
507
+ "div",
508
+ {
509
+ class: ["zd-rich-text", "zd-elevation-2", _vm.instance.cssClass],
510
+ style: {
511
+ height: _vm.$formatSize(_vm.instance.height),
482
512
  },
483
- {
484
- key: "fontFamily",
485
- fn: function (ref) {
486
- var editor = ref.editor;
487
- var attrs = ref.attrs;
488
- return [
489
- _c("FontFamily", {
490
- attrs: {
491
- name: _vm.instance.name + "-fontFamily",
492
- editor: editor,
493
- attrs: attrs,
494
- fonts: _vm.instance.fonts,
495
- },
496
- }),
497
- ]
513
+ on: {
514
+ keydown: function ($event) {
515
+ return _vm.onKeyDown($event)
498
516
  },
499
517
  },
500
- ]),
501
- model: {
502
- value: _vm.instance.content,
503
- callback: function ($$v) {
504
- _vm.$set(_vm.instance, "content", $$v);
505
- },
506
- expression: "instance.content",
507
518
  },
508
- }),
509
- ],
510
- 1
519
+ [
520
+ _c("vuetify-tiptap", {
521
+ ref: "tiptap",
522
+ class: [
523
+ { "zd-rich-text--disabled": _vm.instance.disabled },
524
+ _vm.readonly && !_vm.hasClass() && "zd-rich-text--readonly",
525
+ ],
526
+ attrs: {
527
+ markdownTheme: false,
528
+ dark: _vm.instance.dark,
529
+ disabled: _vm.instance.disabled,
530
+ readonly: _vm.instance.readonly,
531
+ outlined: _vm.instance.outlined,
532
+ placeholder: _vm.instance.placeholder,
533
+ toolbar: _vm.readonly
534
+ ? _vm.toolbarReadonly
535
+ : _vm.enableFullscreen
536
+ ? _vm.toolbarFullscreen
537
+ : _vm.toolbar,
538
+ rounded: "",
539
+ "max-width": _vm.instance.width,
540
+ extensions: _vm.extensions,
541
+ },
542
+ on: {
543
+ onFocus: function ($event) {
544
+ return _vm.onFocus($event)
545
+ },
546
+ },
547
+ scopedSlots: _vm._u([
548
+ {
549
+ key: "editor",
550
+ fn: function (ref) {
551
+ var editor = ref.editor;
552
+ var attrs = ref.attrs;
553
+ return [
554
+ _c("editor-content", {
555
+ staticClass:
556
+ "vuetify-pro-tiptap-editor__content zd-rich-text-content markdown-theme-github",
557
+ class: [{ __dark: attrs.isDark }, attrs.editorClass],
558
+ style: attrs.contentDynamicStyles,
559
+ attrs: { editor: editor, "data-testid": "value" },
560
+ }),
561
+ ]
562
+ },
563
+ },
564
+ {
565
+ key: "bottom",
566
+ fn: function (ref) {
567
+ return [_c("span")]
568
+ },
569
+ },
570
+ {
571
+ key: "fontFamily",
572
+ fn: function (ref) {
573
+ var editor = ref.editor;
574
+ var attrs = ref.attrs;
575
+ return [
576
+ _c("FontFamily", {
577
+ attrs: {
578
+ name: _vm.instance.name + "-fontFamily",
579
+ editor: editor,
580
+ attrs: attrs,
581
+ fonts: _vm.instance.fonts,
582
+ },
583
+ }),
584
+ ]
585
+ },
586
+ },
587
+ ]),
588
+ model: {
589
+ value: _vm.instance.content,
590
+ callback: function ($$v) {
591
+ _vm.$set(_vm.instance, "content", $$v);
592
+ },
593
+ expression: "instance.content",
594
+ },
595
+ }),
596
+ ],
597
+ 1
598
+ ),
599
+ ]
511
600
  )
512
601
  };
513
602
  var __vue_staticRenderFns__$1 = [];
@@ -516,7 +605,7 @@
516
605
  /* style */
517
606
  const __vue_inject_styles__$1 = function (inject) {
518
607
  if (!inject) return
519
- inject("data-v-45ed460e_0", { source: ".zd-rich-text #tippy-1 {\n display: none;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--light.rounded {\n background-color: #ffffff !important;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--dark.rounded {\n background-color: #383838 !important;\n}\n.zd-rich-text .zd-rich-text--disabled .vuetify-pro-tiptap-editor__toolbar {\n pointer-events: none;\n opacity: 0.5;\n}\n.zd-rich-text .zd-rich-text--readonly {\n width: 741px;\n}\n.zd-rich-text .v-toolbar__content button.v-btn {\n color: #ffffff !important;\n}", map: undefined, media: undefined });
608
+ inject("data-v-58cf5ffa_0", { source: ".zd-rich-text #tippy-1 {\n display: none;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor--fullscreen .vuetify-pro-tiptap-editor__content {\n height: -webkit-fill-available;\n}\n.zd-rich-text .v-label {\n top: calc(-10px - var(--spacing-2));\n max-width: 100%;\n transform: none;\n font-size: var(--zd-font-body1-size);\n left: 0 !important;\n line-height: 15px;\n height: auto;\n font-weight: var(--zd-font-body1-weight);\n}\n.zd-rich-text .label--focused {\n transition: 0ms;\n color: var(--v-primary-base);\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--light.rounded {\n background-color: #ffffff !important;\n}\n.zd-rich-text .vuetify-pro-tiptap-editor.v-card.v-card--flat.v-sheet.theme--dark.rounded {\n background-color: #383838 !important;\n}\n.zd-rich-text .zd-rich-text--disabled .vuetify-pro-tiptap-editor__toolbar {\n pointer-events: none;\n opacity: 0.5;\n}\n.zd-rich-text .zd-rich-text--readonly {\n width: 741px;\n}\n.zd-rich-text .v-toolbar__content button.v-btn {\n color: #ffffff !important;\n}", map: undefined, media: undefined });
520
609
 
521
610
  };
522
611
  /* scoped */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zeedhi/zd-richtext-vue",
3
- "version": "1.5.1",
3
+ "version": "1.5.3",
4
4
  "description": "RichTextVue by BVR",
5
5
  "main": "dist/rich-text-vue.umd.js",
6
6
  "module": "dist/rich-text-vue.esm.js",
@@ -31,5 +31,5 @@
31
31
  "vue-class-component": "7.2.*",
32
32
  "vue-property-decorator": "9.1.*"
33
33
  },
34
- "gitHead": "1b3715e1a7255b053f46736ebab3b87c1ee644f5"
34
+ "gitHead": "8836006ea62574c8f60d2efc40a411b02bafa569"
35
35
  }
@@ -9,18 +9,21 @@ export default class ZdRichText extends ZdComponentRender {
9
9
  content: string;
10
10
  cardColor: string;
11
11
  fonts: IFonts[];
12
+ enableFullscreen: boolean;
12
13
  outlined: boolean | string;
13
14
  width: number | string;
14
15
  height: number | string;
15
16
  formatGetter: Object | string;
16
17
  value: string;
17
18
  fillHeight: boolean;
19
+ label: string;
18
20
  instance: RichText;
19
21
  instanceType: typeof RichText;
20
22
  onKeyDown(event: KeyboardEvent): void;
21
23
  changeLanguage(): void;
22
24
  isMounted: boolean;
23
25
  hasClass(): boolean;
26
+ isFocused: boolean;
24
27
  extensions: import("@tiptap/vue-2").Extension<import("@tiptap/extension-font-family").FontFamilyOptions, any>[];
25
28
  input(instanceInput: String): void;
26
29
  private initialFocusValue?;
@@ -28,6 +31,7 @@ export default class ZdRichText extends ZdComponentRender {
28
31
  onBlur(event: Event): void;
29
32
  toolbar: import("vue").Ref<any[]>;
30
33
  toolbarReadonly: import("vue").Ref<any[]>;
34
+ toolbarFullscreen: import("vue").Ref<any[]>;
31
35
  created(): void;
32
36
  mounted(): void;
33
37
  setEditorDisabled(): void;