@zipify/wysiwyg 1.0.0-dev.63 → 1.0.0-dev.66

package/lib/Wysiwyg.vue

@@ -113,6 +113,13 @@ export default {
             default: false
         },
 
+        // Temporary until migrations static accordion to sidebar
+        popupMode: {
+            type: Boolean,
+            required: false,
+            default: false
+        },
+
         // Requires Window type but it different in iframe and outside
         // eslint-disable-next-line vue/require-prop-types
         window: {
@@ -185,6 +192,7 @@ export default {
         provide(InjectionTokens.LOCAL_STORAGE, new Storage(localStorage));
         provide(InjectionTokens.FAVORITE_COLORS, favoriteColors);
         provide(InjectionTokens.PAGE_BLOCKS, pageBlocks);
+        provide(InjectionTokens.POPUP_MODE, props.popupMode);
 
         return {
             editor,

package/lib/__tests__/utils/index.js

@@ -1,4 +1,3 @@
 export { waitAsyncOperation } from './waitAsyncOperation';
-export { NodeFactory } from './NodeFactory';
 export { withComponentContext } from './withComponentContext';
 export { setReadonlyProperty } from './setReadonlyProperty';

package/lib/components/toolbar/ToolbarFull.vue

@@ -14,20 +14,35 @@
                 <FontColorControl />
                 <BackgroundColorControl />
             </ToolbarGroup>
+
+            <template v-if="isPopupMode">
+                <ToolbarDivider vertical />
+
+                <ToolbarGroup>
+                    <ItalicControl />
+                    <UnderlineControl />
+                    <StrikeThroughControl />
+                    <SuperscriptControl />
+                    <CaseStyleControl />
+                </ToolbarGroup>
+            </template>
         </ToolbarRow>
 
         <ToolbarDivider horizontal />
 
         <ToolbarRow>
-            <ToolbarGroup>
-                <ItalicControl />
-                <UnderlineControl />
-                <StrikeThroughControl />
-                <SuperscriptControl />
-                <CaseStyleControl />
-            </ToolbarGroup>
+            <template v-if="!isPopupMode">
+                <ToolbarGroup>
+                    <ItalicControl />
+                    <UnderlineControl />
+                    <StrikeThroughControl />
+                    <SuperscriptControl />
+                    <CaseStyleControl />
+                </ToolbarGroup>
+
+                <ToolbarDivider vertical />
+            </template>
 
-            <ToolbarDivider vertical />
             <AlignmentControl />
             <ToolbarDivider vertical />
 
@@ -52,6 +67,8 @@
 </template>
 
 <script>
+import { inject } from 'vue';
+import { InjectionTokens } from '../../injectionTokens';
 import ToolbarDivider from './ToolbarDivider';
 import ToolbarRow from './ToolbarRow';
 import ToolbarGroup from './ToolbarGroup';
@@ -97,6 +114,12 @@ export default {
         ListControl,
         RemoveFormatControl,
         LinkControl
+    },
+
+    setup() {
+        const isPopupMode = inject(InjectionTokens.POPUP_MODE);
+
+        return { isPopupMode };
     }
 };
 </script>

package/lib/composables/__tests__/useEditor.test.js

@@ -2,7 +2,7 @@ import { h, ref, toRef } from 'vue';
 import { EditorContent } from '@tiptap/vue-2';
 import { shallowMount } from '@vue/test-utils';
 import { useEditor } from '../useEditor';
-import { NodeFactory } from '../../__tests__/utils';
+import { NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../../extensions/core';
 
 const TestComponent = {

package/lib/extensions/__tests__/Alignment.test.js

@@ -1,11 +1,10 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { Alignment } from '../Alignment';
 import { DeviceManager } from '../DeviceManager';
 import { Alignments } from '../../enums';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/BackgroundColor.test.js

@@ -1,9 +1,8 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { BackgroundColor } from '../BackgroundColor';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/CaseStyle.test.js

@@ -1,8 +1,7 @@
 import { Editor } from '@tiptap/vue-2';
-import { NodeFactory } from '../../__tests__/utils';
 import { CaseStyles } from '../../enums';
 import { CaseStyle } from '../CaseStyle';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 function createEditor({ content }) {

package/lib/extensions/__tests__/FontColor.test.js

@@ -1,9 +1,8 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { FontColor } from '../FontColor';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/FontFamily.test.js

@@ -1,12 +1,11 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { Font } from '../../models';
 import { FontFamily } from '../FontFamily';
 import { FontWeight } from '../FontWeight';
 import { FontStyle } from '../FontStyle';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/FontSize.test.js

@@ -1,10 +1,9 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { FontSize } from '../FontSize';
 import { DeviceManager } from '../DeviceManager';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/FontStyle.test.js

@@ -1,12 +1,11 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { FontStyle } from '../FontStyle';
 import { FontFamily } from '../FontFamily';
 import { Font } from '../../models';
 import { FontWeight } from '../FontWeight';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

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

@@ -1,12 +1,11 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { Font } from '../../models';
 import { FontWeight } from '../FontWeight';
 import { FontFamily } from '../FontFamily';
 import { FontStyle } from '../FontStyle';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/LineHeight.test.js

@@ -1,10 +1,9 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { DeviceManager } from '../DeviceManager';
 import { LineHeight } from '../LineHeight';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/__tests__/Link.test.js

@@ -1,8 +1,7 @@
 import { ref } from 'vue';
 import { Editor } from '@tiptap/vue-2';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { Link } from '../Link';
-import { NodeFactory } from '../../__tests__/utils';
 import { buildCoreExtensions } from '../core';
 
 function createEditor({ content }) {

package/lib/extensions/__tests__/StylePreset.test.js

@@ -1,9 +1,8 @@
 import { Editor, Extension, Mark } from '@tiptap/vue-2';
-import { NodeFactory } from '../../__tests__/utils';
 import { StylePreset } from '../StylePreset';
 import { List } from '../list';
 import { ListTypes, NodeTypes, TextSettings } from '../../enums';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockFontSize = Mark.create({

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

@@ -1,9 +1,8 @@
 import { Editor, Extension } from '@tiptap/vue-2';
 import { ref } from 'vue';
-import { NodeFactory } from '../../__tests__/utils';
 import { createCommand } from '../../utils';
 import { TextDecoration } from '../TextDecoration';
-import { ContentNormalizer } from '../../services';
+import { ContentNormalizer, NodeFactory } from '../../services';
 import { buildCoreExtensions } from '../core';
 
 const MockStylePreset = Extension.create({

package/lib/extensions/core/TextProcessor.js

@@ -1,16 +1,5 @@
 import { Extension } from '@tiptap/vue-2';
 import { createCommand } from '../../utils';
-import {
-    emDash,
-    registeredTrademark,
-    trademark,
-    ellipsis,
-    openDoubleQuote,
-    openSingleQuote,
-    closeDoubleQuote,
-    closeSingleQuote,
-    copyright
-} from './inputRules';
 
 export const TextProcessor = Extension.create({
     name: 'text_processor',
@@ -51,17 +40,5 @@ export const TextProcessor = Extension.create({
                 });
             })
         };
-    },
-
-    addInputRules: () => [
-        emDash,
-        registeredTrademark,
-        trademark,
-        ellipsis,
-        openDoubleQuote,
-        openSingleQuote,
-        closeDoubleQuote,
-        closeSingleQuote,
-        copyright
-    ]
+    }
 });

package/lib/extensions/core/__tests__/NodeProcessor.test.js

@@ -1,7 +1,6 @@
 import { Editor, Extension } from '@tiptap/vue-2';
-import { NodeFactory } from '../../../__tests__/utils';
 import { NodeTypes } from '../../../enums';
-import { ContentNormalizer } from '../../../services';
+import { ContentNormalizer, NodeFactory } from '../../../services';
 import { buildCoreExtensions } from '../index';
 
 const LineHeight = Extension.create({

package/lib/extensions/core/__tests__/SelectionProcessor.test.js

@@ -1,6 +1,5 @@
 import { Editor } from '@tiptap/vue-2';
-import { NodeFactory } from '../../../__tests__/utils';
-import { ContentNormalizer } from '../../../services';
+import { ContentNormalizer, NodeFactory } from '../../../services';
 import { buildCoreExtensions } from '../index';
 
 function createEditor() {

package/lib/extensions/core/__tests__/TextProcessor.test.js

@@ -1,6 +1,5 @@
 import { Editor, Mark, Extension } from '@tiptap/vue-2';
-import { NodeFactory } from '../../../__tests__/utils';
-import { ContentNormalizer } from '../../../services';
+import { ContentNormalizer, NodeFactory } from '../../../services';
 import { NodeTypes, TextSettings } from '../../../enums';
 import { buildCoreExtensions } from '../index';
 

package/lib/extensions/list/__tests__/List.test.js

@@ -1,9 +1,8 @@
 import { Editor } from '@tiptap/vue-2';
-import { NodeFactory } from '../../../__tests__/utils';
 import { ListTypes } from '../../../enums';
 import { StylePreset } from '../../StylePreset';
 import { List } from '../List';
-import { ContentNormalizer } from '../../../services';
+import { ContentNormalizer, NodeFactory } from '../../../services';
 import { buildCoreExtensions } from '../../core';
 
 function createEditor({ content }) {

package/lib/index.js

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

package/lib/injectionTokens.js

@@ -4,5 +4,6 @@ export const InjectionTokens = Object.freeze({
     EDITOR: Symbol('editor'),
     LOCAL_STORAGE: Symbol('localStorage'),
     FAVORITE_COLORS: Symbol('favoriteColors'),
-    PAGE_BLOCKS: Symbol('pageBlocks')
+    PAGE_BLOCKS: Symbol('pageBlocks'),
+    POPUP_MODE: Symbol('popupMode')
 });

package/lib/{__tests__/utils → services}/NodeFactory.js

@@ -1,4 +1,4 @@
-import { NodeTypes } from '../../enums';
+import { NodeTypes } from '../enums';
 
 export class NodeFactory {
     static doc(content) {

package/lib/services/__tests__/ContentNormalizer.test.js

@@ -1,5 +1,5 @@
 import { ContentNormalizer } from '../ContentNormalizer';
-import { NodeFactory } from '../../__tests__/utils';
+import { NodeFactory } from '../NodeFactory';
 
 describe('normalize text content', () => {
     test('should ignore json content', () => {

package/lib/services/index.js

@@ -3,3 +3,4 @@ export { Storage } from './Storage';
 export { FavoriteColors } from './FavoriteColors';
 export { ContentNormalizer } from './ContentNormalizer';
 export { ContextWindow } from './ContextWidnow';
+export { NodeFactory } from './NodeFactory';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zipify/wysiwyg",
-  "version": "1.0.0-dev.63",
+  "version": "1.0.0-dev.66",
   "description": "Zipify modification of TipTap text editor",
   "main": "dist/wysiwyg.mjs",
   "repository": {

package/lib/extensions/core/inputRules/closeDoubleQuote.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const closeDoubleQuote = textInputRule({
-    find: /"/,
-    replace: '”'
-});

package/lib/extensions/core/inputRules/closeSingleQuote.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const closeSingleQuote = textInputRule({
-    find: /'/,
-    replace: '’'
-});

package/lib/extensions/core/inputRules/copyright.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const copyright = textInputRule({
-    find: /\(c\)/i,
-    replace: '©'
-});

package/lib/extensions/core/inputRules/ellipsis.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const ellipsis = textInputRule({
-    find: /\.\.\./,
-    replace: '…'
-});

package/lib/extensions/core/inputRules/emDash.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const emDash = textInputRule({
-    find: /--/,
-    replace: '—'
-});

package/lib/extensions/core/inputRules/index.js

@@ -1,9 +0,0 @@
-export { closeDoubleQuote } from './closeDoubleQuote';
-export { closeSingleQuote } from './closeSingleQuote';
-export { copyright } from './copyright';
-export { ellipsis } from './ellipsis';
-export { emDash } from './emDash';
-export { openDoubleQuote } from './openDoubleQuote';
-export { openSingleQuote } from './openSingleQuote';
-export { registeredTrademark } from './registeredTrademark';
-export { trademark } from './trademark';

package/lib/extensions/core/inputRules/openDoubleQuote.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const openDoubleQuote = textInputRule({
-    find: /(?:^|[\s{[(<'"\u2018\u201C])(")/,
-    replace: '“'
-});

package/lib/extensions/core/inputRules/openSingleQuote.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const openSingleQuote = textInputRule({
-    find: /(?:^|[\s{[(<'"\u2018\u201C])(')/,
-    replace: '‘'
-});

package/lib/extensions/core/inputRules/registeredTrademark.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const registeredTrademark = textInputRule({
-    find: /\(r\)/i,
-    replace: '®'
-});

package/lib/extensions/core/inputRules/trademark.js

@@ -1,6 +0,0 @@
-import { textInputRule } from '@tiptap/core';
-
-export const trademark = textInputRule({
-    find: /\(tm\)/i,
-    replace: '™'
-});