@zipify/wysiwyg 1.3.0-0 → 2.0.0-0

package/lib/extensions/__tests__/__snapshots__/FontWeight.test.js.snap

@@ -6,18 +6,18 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "700",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "700",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -31,18 +31,18 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "700",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "700",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -63,17 +63,19 @@ Object {
               },
               "type": "font_family",
             },
-            Object {
-              "attrs": Object {
-                "value": "800",
-              },
-              "type": "font_weight",
-            },
           ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "800",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -94,17 +96,19 @@ Object {
               },
               "type": "font_family",
             },
-            Object {
-              "attrs": Object {
-                "value": "300",
-              },
-              "type": "font_weight",
-            },
           ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "300",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -118,18 +122,18 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "400",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "400",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -172,18 +176,18 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "700",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": "test",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "700",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -313,18 +317,18 @@ Object {
           "type": "text",
         },
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "500",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": " ipsum",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "500",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -338,18 +342,18 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "value": "700",
-              },
-              "type": "font_weight",
-            },
-          ],
           "text": "test",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "value": "700",
+          },
+          "type": "font_weight",
+        },
+      ],
       "type": "paragraph",
     },
   ],

package/lib/extensions/__tests__/__snapshots__/TextDecoration.test.js.snap

@@ -1,6 +1,32 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`apply decoration should apply decoration 1`] = `
+Object {
+  "content": Array [
+    Object {
+      "content": Array [
+        Object {
+          "text": "hello world",
+          "type": "text",
+        },
+      ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
+      "type": "paragraph",
+    },
+  ],
+  "type": "doc",
+}
+`;
+
+exports[`apply decoration should apply decoration with decorated parent false value 1`] = `
 Object {
   "content": Array [
     Object {
@@ -15,10 +41,49 @@ Object {
               "type": "text_decoration",
             },
           ],
+          "text": "hello",
+          "type": "text",
+        },
+        Object {
+          "text": " world",
+          "type": "text",
+        },
+      ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": false,
+          },
+          "type": "text_decoration",
+        },
+      ],
+      "type": "paragraph",
+    },
+  ],
+  "type": "doc",
+}
+`;
+
+exports[`apply decoration should not apply decoration with decorated parent 1`] = `
+Object {
+  "content": Array [
+    Object {
+      "content": Array [
+        Object {
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -32,19 +97,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": true,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": true,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -58,19 +123,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": false,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
-          "text": "hello world",
+          "text": "lorem ipsum",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": false,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -84,19 +149,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": true,
-                "underline": false,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": true,
+            "underline": false,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -110,19 +175,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": true,
-                "underline": false,
-              },
-              "type": "text_decoration",
-            },
-          ],
-          "text": "hello world",
+          "text": "lorem ipsum",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": false,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -136,19 +201,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": false,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "hello world",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -162,19 +227,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": true,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "test",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": true,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -278,19 +343,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": true,
-                "underline": false,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "test",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": true,
+            "underline": false,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -364,19 +429,19 @@ Object {
     Object {
       "content": Array [
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": false,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": "test",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],
@@ -463,19 +528,19 @@ Object {
           "type": "text",
         },
         Object {
-          "marks": Array [
-            Object {
-              "attrs": Object {
-                "strike_through": false,
-                "underline": true,
-              },
-              "type": "text_decoration",
-            },
-          ],
           "text": " ipsum",
           "type": "text",
         },
       ],
+      "marks": Array [
+        Object {
+          "attrs": Object {
+            "strike_through": false,
+            "underline": true,
+          },
+          "type": "text_decoration",
+        },
+      ],
       "type": "paragraph",
     },
   ],

package/lib/extensions/core/Document.js

@@ -0,0 +1,5 @@
+import { Document as Base } from '@tiptap/extension-document';
+
+export const Document = Base.extend({
+    marks: 'settings'
+});

package/lib/extensions/core/Heading.js

@@ -0,0 +1,10 @@
+import { Heading as Base } from '@tiptap/extension-heading';
+
+export const Heading = Base.extend({
+    marks: '_',
+
+    addOptions: () => ({
+        levels: [1, 2, 3, 4],
+        HTMLAttributes: { class: 'zw-style' }
+    })
+});

package/lib/extensions/core/NodeProcessor.js

@@ -1,7 +1,14 @@
-import { Extension } from '@tiptap/vue-2';
-import { computed, unref } from 'vue';
-import { createCommand } from '../../utils';
+import { Extension, getMarkType } from '@tiptap/vue-2';
+import { computed, toRef, unref } from 'vue';
+import {
+    createCommand,
+    findMarkByType,
+    isMarkAppliedToParent,
+    isNodeFullySelected,
+    resolveTextPosition
+} from '../../utils';
 import { NodeTypes } from '../../enums';
+import { AddNodeMarkStep } from './steps';
 
 export const NodeProcessor = Extension.create({
     name: 'node_processor',
@@ -26,7 +33,80 @@ export const NodeProcessor = Extension.create({
                 }
 
                 return Object.keys(attrs).length ? attrs : null;
-            }))
+            })),
+
+            applyMark: createCommand(({ state }, name, value, customizer = {}) => {
+                const { tr, doc, schema } = state;
+                const { $from, $to } = tr.selection;
+                const markType = getMarkType(name, schema);
+
+                const onAppliedToParent = customizer.onAppliedToParent || ((context) => {
+                    const { tr, textPosition, applyingMark } = context;
+
+                    tr.removeMark(textPosition.from, textPosition.to, applyingMark.type);
+                });
+
+                if ($from.pos === $to.pos) return;
+
+                doc.nodesBetween($from.pos, $to.pos, (node, position) => {
+                    if (node.type.name === NodeTypes.LIST) return;
+
+                    const initialMark = findMarkByType(node.marks, name);
+                    const applyingMark = markType.create({ ...(initialMark?.attrs || {}), ...value });
+                    const textPosition = resolveTextPosition($from, $to, node, position);
+
+                    if (isMarkAppliedToParent(tr, position, applyingMark, customizer.compareParentMark)) {
+                        onAppliedToParent({ tr, textPosition, applyingMark, initialMark, node });
+                        return;
+                    }
+
+                    if (node.isText) {
+                        tr.addMark(textPosition.from, textPosition.to, applyingMark);
+                        return;
+                    }
+
+                    if (isNodeFullySelected($from, $to, node, position)) {
+                        tr.step(new AddNodeMarkStep(position, applyingMark));
+                    }
+                });
+            }),
+
+            getMarks: createCommand(({ editor }, name) => {
+                const stateRef = toRef(editor, 'state');
+
+                return computed(() => {
+                    const { selection, doc } = unref(stateRef);
+                    const { from, to } = unref(selection);
+                    const marks = [];
+
+                    doc.nodesBetween(from, to, (node) => {
+                        for (const mark of node.marks) {
+                            if (mark.type.name === name) marks.unshift(mark.attrs);
+                        }
+                    });
+
+                    return marks;
+                });
+            }),
+
+            getMark: createCommand(({ commands }, name) => {
+                const marksRef = commands.getMarks(name);
+
+                return computed(() => unref(marksRef)[0] ?? null);
+            }),
+
+            getCommonSettingMark: createCommand(({ commands }, name, defaultRef) => {
+                const selectionRef = commands.getMark(name);
+
+                return computed(() => unref(selectionRef)?.value ?? unref(defaultRef));
+            }),
+
+            getDeviceSettingMark: createCommand(({ commands }, name, defaultRef) => {
+                const selectionRef = commands.getMark(name);
+                const deviceRef = commands.getDevice();
+
+                return computed(() => unref(selectionRef)?.[unref(deviceRef)] ?? unref(defaultRef));
+            })
         };
     }
 });

package/lib/extensions/core/Paragraph.js

@@ -0,0 +1,9 @@
+import { Paragraph as Base } from '@tiptap/extension-paragraph';
+
+export const Paragraph = Base.extend({
+    marks: '_',
+
+    addOptions: () => ({
+        HTMLAttributes: { class: 'zw-style' }
+    })
+});