@zipify/wysiwyg 1.0.0-dev.74 → 1.0.0-dev.77

package/dist/wysiwyg.mjs

@@ -14391,6 +14391,12 @@ function importIcon(name) {
   }
   return icon;
 }
+function isWysiwygContent(content) {
+  return typeof content === "object" && content.__wswg__;
+}
+function markWysiwygContent(content) {
+  return { ...content, __wswg__: true };
+}
 var render$E = function __render__6() {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -18963,6 +18969,7 @@ function useModalToggler({ onBeforeOpened, onClosed, wrapperRef, modalRef } = {}
     const modalEl = useElementRef(modalRef);
     popper2 = createPopper(wrapperEl.value, modalEl.value, {
       placement: "bottom",
+      strategy: "fixed",
       modifiers: [
         {
           name: "offset",
@@ -20484,6 +20491,7 @@ var render$q = function __render__20() {
     ref: "pickerRef",
     attrs: {
       "placement": "bottom-end",
+      "placement-strategy": "fixed",
       "favorite-colors": _vm.favoriteColors,
       "window": _vm.window
     },
@@ -22797,6 +22805,7 @@ function useToolbar({ wrapperRef, offsets, isActiveRef }) {
   function mount(element) {
     popper2 = createPopper(wrapperEl.value, element, {
       placement: "top-start",
+      strategy: "fixed",
       modifiers: [
         {
           name: "offset",
@@ -25952,7 +25961,7 @@ const __vue2_script = {
     });
     const updateToolbar = () => toolbar.update();
     function onChange(content) {
-      emit("input", content);
+      emit("input", markWysiwygContent(content));
       updateToolbar();
     }
     const pageBlocks = toRef(props, "pageBlocks");
@@ -26020,5 +26029,6 @@ export {
   NodeFactory,
   NodeTypes,
   TextSettings,
-  Wysiwyg
+  Wysiwyg,
+  isWysiwygContent
 };

package/lib/Wysiwyg.vue

@@ -21,6 +21,7 @@ import { ContextWindow, FavoriteColors, Storage } from './services';
 import { Devices } from './enums';
 import { outClick } from './directives';
 import { Font } from './models';
+import { markWysiwygContent } from './utils';
 
 const MIN_FONT_SIZE = 5;
 const MAX_FONT_SIZE = 112;
@@ -150,7 +151,7 @@ export default {
         const updateToolbar = () => toolbar.update();
 
         function onChange(content) {
-            emit('input', content);
+            emit('input', markWysiwygContent(content));
             updateToolbar();
         }
 

package/lib/components/base/colorPicker/ColorPicker.vue

@@ -2,6 +2,7 @@
     <ZipifyColorPicker
         ref="pickerRef"
         placement="bottom-end"
+        placement-strategy="fixed"
         :favorite-colors="favoriteColors"
         :window="window"
         @changeFavoriteColors="updateFavoriteColors"

package/lib/components/base/composables/useModalToggler.js

@@ -14,6 +14,7 @@ export function useModalToggler({ onBeforeOpened, onClosed, wrapperRef, modalRef
 
         popper = createPopper(wrapperEl.value, modalEl.value, {
             placement: 'bottom',
+            strategy: 'fixed',
             modifiers: [
                 {
                     name: 'offset',

package/lib/composables/useToolbar.js

@@ -8,6 +8,7 @@ export function useToolbar({ wrapperRef, offsets, isActiveRef }) {
     function mount(element) {
         popper = createPopper(wrapperEl.value, element, {
             placement: 'top-start',
+            strategy: 'fixed',
             modifiers: [
                 {
                     name: 'offset',

package/lib/index.js

@@ -1,3 +1,4 @@
 export { default as Wysiwyg } from './Wysiwyg';
 export { NodeFactory } from './services';
 export { NodeTypes, TextSettings, Alignments } from './enums';
+export { isWysiwygContent } from './utils';

package/lib/utils/index.js

@@ -7,3 +7,4 @@ export { convertLineHeight } from './convertLineHeight';
 export { convertFontSize } from './convertFontSize';
 export { convertAlignment } from './convertAlignment';
 export { importIcon } from './importIcon';
+export { isWysiwygContent, markWysiwygContent } from './isWysiwygContent';

package/lib/utils/isWysiwygContent.js

@@ -0,0 +1,7 @@
+export function isWysiwygContent(content) {
+    return typeof content === 'object' && content.__wswg__;
+}
+
+export function markWysiwygContent(content) {
+    return { ...content, __wswg__: true };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zipify/wysiwyg",
-  "version": "1.0.0-dev.74",
+  "version": "1.0.0-dev.77",
   "description": "Zipify modification of TipTap text editor",
   "main": "dist/wysiwyg.mjs",
   "repository": {
@@ -43,7 +43,7 @@
     "simplebar": "^5.3.8"
   },
   "peerDependencies": {
-    "@zipify/colorpicker": "^2.1",
+    "@zipify/colorpicker": "^2.2",
     "vue": "^2.7"
   },
   "devDependencies": {