@zipify/wysiwyg 4.11.0 → 4.11.1

package/lib/Wysiwyg.vue

@@ -23,7 +23,7 @@ import { useEditor } from './composables';
 import { buildExtensions } from './extensions';
 import { InjectionTokens } from './injectionTokens';
 import { ContextWindow, FavoriteColors, Storage } from './services';
-import { Devices } from './enums';
+import { Device } from './enums';
 import { Font, type IFontJson } from './models';
 
 const props = defineProps({
@@ -63,9 +63,9 @@ const props = defineProps({
     },
 
     device: {
-        type: String,
+        type: String as PropType<Device>,
         required: false,
-        default: Devices.DESKTOP
+        default: Device.DESKTOP
     },
 
     favoriteColors: {

package/lib/__tests__/utils/buildTestExtensions.js

@@ -1,18 +1,18 @@
 import { Mark } from '@tiptap/vue-3';
-import { buildCoreExtensions } from '../../extensions/core';
-import { MarkGroups, TextSettings } from '../../enums';
+import { buildCoreExtensions } from '@/extensions/core';
+import { MarkGroup, TextSetting } from '@/enums';
 
 // each node allows using 'settings' group of marks,
 // and it fails when there are no nodes with this group
 const SettingMark = Mark.create({
     name: 'placeholder_setting',
-    group: MarkGroups.SETTINGS,
+    group: MarkGroup.SETTINGS,
     renderHTML: () => []
 });
 
 // NodeProcessor requires link mark
 const LinkMark = Mark.create({
-    name: TextSettings.LINK,
+    name: TextSetting.LINK,
     renderHTML: () => []
 });
 
@@ -22,13 +22,13 @@ export function buildTestExtensions({ include } = {}) {
     const extensions = buildCoreExtensions().concat(include || []);
 
     const isSettingPreset = extensions.some((extension) => {
-        return isMark(extension) && extension.config.group === MarkGroups.SETTINGS;
+        return isMark(extension) && extension.config.group === MarkGroup.SETTINGS;
     });
 
     if (!isSettingPreset) extensions.push(SettingMark);
 
     const isLinkPreset = extensions.some((extension) => {
-        return isMark(extension) && extension.name === TextSettings.LINK;
+        return isMark(extension) && extension.name === TextSetting.LINK;
     });
 
     if (!isLinkPreset) extensions.push(LinkMark);

package/lib/components/toolbar/Toolbar.vue

@@ -15,7 +15,7 @@
 
 <script setup>
 import { computed } from 'vue';
-import { Devices } from '../../enums';
+import { Device } from '@/enums';
 import { ToolbarDesktop, ToolbarMobile, ToolbarPopup } from './layouts';
 import ToolbarFloating from './ToolbarFloating';
 
@@ -56,7 +56,7 @@ const props = defineProps({
 const layoutComponent = computed(() => {
     if (props.popupMode) return ToolbarPopup;
 
-    return props.device === Devices.MOBILE ? ToolbarMobile : ToolbarDesktop;
+    return props.device === Device.MOBILE ? ToolbarMobile : ToolbarDesktop;
 });
 </script>
 

package/lib/components/toolbar/__tests__/Toolbar.test.js

@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import { Devices } from '../../../enums';
+import { Device } from '@/enums';
 import Toolbar from '../Toolbar';
 import { ToolbarMobile, ToolbarDesktop, ToolbarPopup } from '../layouts';
 
@@ -9,7 +9,7 @@ function createComponent({ device, popupMode }) {
             visible: true,
             offsets: [0, 8],
             referenceRef: document.createElement('div'),
-            device: device ?? Devices.DESKTOP,
+            device: device ?? Device.DESKTOP,
             placement: 'bottom',
             popupMode: popupMode ?? false
         }
@@ -18,19 +18,19 @@ function createComponent({ device, popupMode }) {
 
 describe('rendering', () => {
     test('should render desktop toolbar', () => {
-        const wrapper = createComponent({ device: Devices.DESKTOP });
+        const wrapper = createComponent({ device: Device.DESKTOP });
 
         expect(wrapper).toVueContainComponent(ToolbarDesktop);
     });
 
     test('should render tablet toolbar', () => {
-        const wrapper = createComponent({ device: Devices.TABLET });
+        const wrapper = createComponent({ device: Device.TABLET });
 
         expect(wrapper).toVueContainComponent(ToolbarDesktop);
     });
 
     test('should render mobile toolbar', () => {
-        const wrapper = createComponent({ device: Devices.MOBILE });
+        const wrapper = createComponent({ device: Device.MOBILE });
 
         expect(wrapper).toVueContainComponent(ToolbarMobile);
     });

package/lib/components/toolbar/controls/AlignmentControl.vue

@@ -25,8 +25,8 @@
 
 <script setup>
 import { inject } from 'vue';
-import { InjectionTokens } from '../../../injectionTokens';
-import { Alignments, TextSettings } from '../../../enums';
+import { InjectionTokens } from '@/injectionTokens';
+import { Alignment, TextSetting } from '@/enums';
 import { ButtonToggle, Button, Icon } from '../../base';
 import { tooltip as vTooltip } from '../../../directives';
 
@@ -34,19 +34,19 @@ const emit = defineEmits(['applied']);
 
 const alignments = [
     {
-        id: Alignments.LEFT,
+        id: Alignment.LEFT,
         tooltip: { text: 'Align Left', hotkey: 'Mod Shift L' }
     },
     {
-        id: Alignments.CENTER,
+        id: Alignment.CENTER,
         tooltip: { text: 'Align Center', hotkey: 'Mod Shift E' }
     },
     {
-        id: Alignments.RIGHT,
+        id: Alignment.RIGHT,
         tooltip: { text: 'Align Right', hotkey: 'Mod Shift R' }
     },
     {
-        id: Alignments.JUSTIFY,
+        id: Alignment.JUSTIFY,
         tooltip: { text: 'Justify', hotkey: 'Mod Shift J' }
     }
 ];
@@ -54,7 +54,7 @@ const alignments = [
 const editor = inject(InjectionTokens.EDITOR);
 const currentValue = editor.commands.getAlignment();
 
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.ALIGNMENT);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.ALIGNMENT);
 
 function toggle(value) {
     editor.chain().focus().applyAlignment(value).run();

package/lib/components/toolbar/controls/CaseStyleControl.vue

@@ -16,15 +16,15 @@
 
 <script setup>
 import { inject } from 'vue';
-import { CaseStyles } from '../../../enums';
+import { CaseStyle } from '@/enums';
+import { InjectionTokens } from '@/injectionTokens';
 import { Dropdown, Button, Icon } from '../../base';
-import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
 
 const styles = [
-    { id: CaseStyles.UPPERCASE, title: 'UPPERCASE' },
-    { id: CaseStyles.LOWERCASE, title: 'lowercase' },
-    { id: CaseStyles.CAPITALIZE, title: 'Capitalize' }
+    { id: CaseStyle.UPPERCASE, title: 'UPPERCASE' },
+    { id: CaseStyle.LOWERCASE, title: 'lowercase' },
+    { id: CaseStyle.CAPITALIZE, title: 'Capitalize' }
 ];
 
 const editor = inject(InjectionTokens.EDITOR);

package/lib/components/toolbar/controls/FontColorControl.vue

@@ -27,12 +27,12 @@ import { inject } from 'vue';
 import { ColorPicker, Button, Icon } from '../../base';
 import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 
 const editor = inject(InjectionTokens.EDITOR);
 
 const currentValue = editor.commands.getFontColor();
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.FONT_COLOR);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.FONT_COLOR);
 
 const apply = (color) => editor.chain().applyFontColor(color).run();
 </script>

package/lib/components/toolbar/controls/FontFamilyControl.vue

@@ -28,7 +28,7 @@ import { computed, inject } from 'vue';
 import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
 import { Dropdown, DropdownOption } from '../../base';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 import { useRecentFonts } from './composables';
 
 const fonts = inject(InjectionTokens.FONTS);
@@ -36,7 +36,7 @@ const editor = inject(InjectionTokens.EDITOR);
 
 const defaultFontFamily = editor.commands.getDefaultFontFamily();
 const recentFontNames = useRecentFonts({ limit: 5 });
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.FONT_FAMILY);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.FONT_FAMILY);
 
 const recentFontsCategory = computed(() => ({
     id: 'Recently Used',

package/lib/components/toolbar/controls/FontSizeControl.vue

@@ -26,7 +26,7 @@ import { computed, inject } from 'vue';
 import { Dropdown, DropdownOption } from '../../base';
 import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 
 const fontSizes = inject(InjectionTokens.FONT_SIZES);
 const editor = inject(InjectionTokens.EDITOR);
@@ -42,7 +42,7 @@ const options = computed(() => {
 });
 
 const currentValue = editor.commands.getFontSize();
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.FONT_SIZE);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.FONT_SIZE);
 
 const apply = (value) => editor.chain().focus().applyFontSize(value).run();
 </script>

package/lib/components/toolbar/controls/FontWeightControl.vue

@@ -26,7 +26,7 @@ import { computed, inject, unref } from 'vue';
 import { InjectionTokens } from '../../../injectionTokens';
 import { Dropdown, DropdownOption } from '../../base';
 import { tooltip as vTooltip } from '../../../directives';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 
 const editor = inject(InjectionTokens.EDITOR);
 const font = editor.commands.getFont();
@@ -41,7 +41,7 @@ const options = computed(() => {
 });
 
 const currentValue = editor.commands.getFontWeight();
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.FONT_WEIGHT);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.FONT_WEIGHT);
 
 const apply = (value) => editor.chain().focus().applyFontWeight(value).run();
 </script>

package/lib/components/toolbar/controls/ItalicControl.vue

@@ -24,13 +24,13 @@ import { inject } from 'vue';
 import { Button, Icon } from '../../base';
 import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 
 const editor = inject(InjectionTokens.EDITOR);
 
 const currentValue = editor.commands.isItalic();
 const isAvailable = editor.commands.isItalicAvailable();
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.FONT_STYLE);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.FONT_STYLE);
 const apply = () => editor.chain().focus().toggleItalic().run();
 </script>
 

package/lib/components/toolbar/controls/LineHeightControl.vue

@@ -56,14 +56,14 @@ import { inject, ref } from 'vue';
 import { Button, Icon, Modal, Range, NumberField, FieldLabel, useModalToggler } from '../../base';
 import { InjectionTokens } from '../../../injectionTokens';
 import { tooltip as vTooltip } from '../../../directives';
-import { TextSettings } from '../../../enums';
+import { TextSetting } from '../../../enums';
 
 const editor = inject(InjectionTokens.EDITOR);
 const wrapperRef = ref(null);
 const toggler = useModalToggler();
 
 const currentValue = editor.commands.getLineHeight();
-const isCustomized = editor.commands.isSettingCustomized(TextSettings.LINE_HEIGHT);
+const isCustomized = editor.commands.isSettingCustomized(TextSetting.LINE_HEIGHT);
 
 const apply = (value) => editor.commands.applyLineHeight(String(value));
 </script>

package/lib/components/toolbar/controls/ListControl.vue

@@ -42,12 +42,12 @@
 
 <script setup>
 import { computed, inject, ref, unref } from 'vue';
-import { InjectionTokens } from '../../../injectionTokens';
+import { InjectionTokens } from '@/injectionTokens';
+import { ListTypeList, ListType } from '@/enums';
 import { Dropdown, DropdownOption, Button, Icon } from '../../base';
-import { ListTypes } from '../../../enums';
 import { tooltip as vTooltip } from '../../../directives';
 
-const listTypes = ListTypes.values.map((type) => ({
+const listTypes = ListTypeList.map((type) => ({
     id: type,
     icon: `list-${type}`
 }));
@@ -55,7 +55,7 @@ const listTypes = ListTypes.values.map((type) => ({
 const editor = inject(InjectionTokens.EDITOR);
 const selectionValue = editor.commands.getListType();
 const currentValue = computed(() => unref(selectionValue) || 'none');
-const recentListType = ref(ListTypes.DISC);
+const recentListType = ref(ListType.DISC);
 const isCurrentListSelected = computed(() => unref(selectionValue) === recentListType.value);
 
 const currentIcon = computed(() => `list-${recentListType.value}`);
@@ -65,7 +65,7 @@ const apply = (type) => {
     editor.chain().focus().applyList(type).run();
 };
 
-const toggle = () => apply(recentListType.value || ListTypes.DISC);
+const toggle = () => apply(recentListType.value || ListType.DISC);
 </script>
 
 <style scoped>

package/lib/components/toolbar/controls/__tests__/AlignmentControl.test.js

@@ -1,7 +1,7 @@
 import { shallowMount } from '@vue/test-utils';
 import { h, ref } from 'vue';
-import { InjectionTokens } from '../../../../injectionTokens';
-import { Alignments } from '../../../../enums';
+import { InjectionTokens } from '@/injectionTokens';
+import { Alignment } from '@/enums';
 import { ButtonToggle } from '../../../base';
 import AlignmentControl from '../AlignmentControl';
 
@@ -46,12 +46,12 @@ function createComponent({ editor, slotParams }) {
 
 describe('selection value', () => {
     test('should render value from selection', () => {
-        const editor = createEditor({ alignment: Alignments.RIGHT });
+        const editor = createEditor({ alignment: Alignment.RIGHT });
         const wrapper = createComponent({
             editor,
             slotParams: {
                 option: {
-                    id: Alignments.RIGHT,
+                    id: Alignment.RIGHT,
                     tooltip: { text: 'Align Right', hotkey: 'Mod Shift R' }
                 },
                 isActive: true
@@ -59,16 +59,16 @@ describe('selection value', () => {
         });
         const buttonWrapper = wrapper.findComponent(ButtonToggle);
 
-        expect(buttonWrapper.props('value')).toBe(Alignments.RIGHT);
+        expect(buttonWrapper.props('value')).toBe(Alignment.RIGHT);
     });
 
     test('should apply new value', () => {
-        const editor = createEditor({ alignment: Alignments.RIGHT });
+        const editor = createEditor({ alignment: Alignment.RIGHT });
         const wrapper = createComponent({
             editor,
             slotParams: {
                 option: {
-                    id: Alignments.RIGHT,
+                    id: Alignment.RIGHT,
                     tooltip: { text: 'Align Right', hotkey: 'Mod Shift R' }
                 },
                 isActive: true
@@ -76,23 +76,23 @@ describe('selection value', () => {
         });
         const buttonWrapper = wrapper.findComponent(ButtonToggle);
 
-        buttonWrapper.vm.$emit('change', Alignments.CENTER);
+        buttonWrapper.vm.$emit('change', Alignment.CENTER);
 
-        expect(editor.commands.applyAlignment).toHaveBeenCalledWith(Alignments.CENTER);
+        expect(editor.commands.applyAlignment).toHaveBeenCalledWith(Alignment.CENTER);
     });
 });
 
 describe('render indicator of customized styles', () => {
     test('should render indicator', () => {
         const editor = createEditor({
-            alignment: Alignments.LEFT,
+            alignment: Alignment.LEFT,
             isSettingCustomized: true
         });
         const wrapper = createComponent({
             editor,
             slotParams: {
                 option: {
-                    id: Alignments.LEFT,
+                    id: Alignment.LEFT,
                     tooltip: { text: 'Align Left', hotkey: 'Mod Shift L' }
                 },
                 isActive: true
@@ -103,12 +103,12 @@ describe('render indicator of customized styles', () => {
     });
 
     test('should not render indicator', () => {
-        const editor = createEditor({ alignment: Alignments.LEFT });
+        const editor = createEditor({ alignment: Alignment.LEFT });
         const wrapper = createComponent({
             editor,
             slotParams: {
                 option: {
-                    id: Alignments.LEFT,
+                    id: Alignment.LEFT,
                     tooltip: { text: 'Align Left', hotkey: 'Mod Shift L' }
                 },
                 isActive: true

package/lib/components/toolbar/controls/__tests__/CaseStyleControl.test.js

@@ -1,9 +1,9 @@
 import { shallowMount } from '@vue/test-utils';
 import { h } from 'vue';
-import { InjectionTokens } from '../../../../injectionTokens';
+import { InjectionTokens } from '@/injectionTokens';
+import { CaseStyle } from '@/enums';
 import { Dropdown } from '../../../base';
 import CaseStyleControl from '../CaseStyleControl';
-import { CaseStyles } from '../../../../enums';
 
 const createEditor = () => ({
     commands: {
@@ -37,8 +37,8 @@ describe('selection value', () => {
         const wrapper = createComponent({ editor });
         const dropdownWrapper = wrapper.findComponent(Dropdown);
 
-        dropdownWrapper.vm.$emit('change', CaseStyles.UPPERCASE);
+        dropdownWrapper.vm.$emit('change', CaseStyle.UPPERCASE);
 
-        expect(editor.commands.applyCaseStyle).toHaveBeenCalledWith(CaseStyles.UPPERCASE);
+        expect(editor.commands.applyCaseStyle).toHaveBeenCalledWith(CaseStyle.UPPERCASE);
     });
 });

package/lib/components/toolbar/controls/__tests__/ListControl.test.js

@@ -1,9 +1,9 @@
 import { shallowMount } from '@vue/test-utils';
 import { h, ref, nextTick } from 'vue';
-import { InjectionTokens } from '../../../../injectionTokens';
+import { InjectionTokens } from '@/injectionTokens';
+import { ListType } from '@/enums';
 import { Button, Dropdown, Icon } from '../../../base';
 import ListControl from '../ListControl';
-import { ListTypes } from '../../../../enums';
 
 const createEditor = ({ listType } = {}) => ({
     commands: {
@@ -49,11 +49,11 @@ describe('selection value', () => {
     });
 
     test('should pass type from selection', () => {
-        const editor = createEditor({ listType: ListTypes.LATIN });
+        const editor = createEditor({ listType: ListType.LATIN });
         const wrapper = createComponent({ editor });
         const dropdownWrapper = wrapper.findComponent(Dropdown);
 
-        expect(dropdownWrapper.props('value')).toBe(ListTypes.LATIN);
+        expect(dropdownWrapper.props('value')).toBe(ListType.LATIN);
     });
 
     test('should render none icon', () => {
@@ -65,12 +65,12 @@ describe('selection value', () => {
     });
 
     test('should render type icon', async () => {
-        const editor = createEditor({ listType: ListTypes.DECIMAL });
+        const editor = createEditor({ listType: ListType.DECIMAL });
         const wrapper = createComponent({ editor });
         const iconWrapper = wrapper.findComponent(Icon);
         const dropdownWrapper = wrapper.findComponent(Dropdown);
 
-        dropdownWrapper.vm.$emit('change', ListTypes.DECIMAL);
+        dropdownWrapper.vm.$emit('change', ListType.DECIMAL);
 
         await nextTick();
 
@@ -78,13 +78,13 @@ describe('selection value', () => {
     });
 
     test('should apply list', () => {
-        const editor = createEditor({ listType: ListTypes.LATIN });
+        const editor = createEditor({ listType: ListType.LATIN });
         const wrapper = createComponent({ editor });
         const dropdownWrapper = wrapper.findComponent(Dropdown);
 
-        dropdownWrapper.vm.$emit('change', ListTypes.LATIN);
+        dropdownWrapper.vm.$emit('change', ListType.LATIN);
 
-        expect(editor.commands.applyList).toHaveBeenCalledWith(ListTypes.LATIN);
+        expect(editor.commands.applyList).toHaveBeenCalledWith(ListType.LATIN);
     });
 
     test('should apply list with default type', () => {
@@ -94,6 +94,6 @@ describe('selection value', () => {
 
         buttonWrapper.vm.$emit('click');
 
-        expect(editor.commands.applyList).toHaveBeenCalledWith(ListTypes.DISC);
+        expect(editor.commands.applyList).toHaveBeenCalledWith(ListType.DISC);
     });
 });

package/lib/components/toolbar/controls/__tests__/StylePresetControl.test.js

@@ -3,7 +3,7 @@ import { ref } from 'vue';
 import { InjectionTokens } from '../../../../injectionTokens';
 import { Button, Dropdown } from '../../../base';
 import { StylePresetControl } from '../stylePreset';
-import { TextSettings } from '../../../../enums';
+import { TextSetting } from '../../../../enums';
 
 const createEditor = ({ presets, preset, customization } = {}) => ({
     commands: {
@@ -92,7 +92,7 @@ describe('rendering', () => {
     test('should enable reset if marks customized', () => {
         const editor = createEditor({
             customization: {
-                marks: [TextSettings.FONT_SIZE],
+                marks: [TextSetting.FONT_SIZE],
                 attributes: []
             }
         });
@@ -106,7 +106,7 @@ describe('rendering', () => {
         const editor = createEditor({
             customization: {
                 marks: [],
-                attributes: [TextSettings.ALIGNMENT]
+                attributes: [TextSetting.ALIGNMENT]
             }
         });
         const wrapper = createComponent({ editor });
@@ -118,8 +118,8 @@ describe('rendering', () => {
     test('should enable reset if attributes and marks customized', () => {
         const editor = createEditor({
             customization: {
-                marks: [TextSettings.FONT_SIZE],
-                attributes: [TextSettings.ALIGNMENT]
+                marks: [TextSetting.FONT_SIZE],
+                attributes: [TextSetting.ALIGNMENT]
             }
         });
         const wrapper = createComponent({ editor });
@@ -148,7 +148,7 @@ describe('apply preset', () => {
         dropdownWrapper.vm.$emit('change', 'regular-1');
 
         expect(editor.commands.expandSelectionToBlock).toHaveBeenCalled();
-        expect(editor.commands.removeMarks).toHaveBeenCalledWith([TextSettings.FONT_SIZE, TextSettings.FONT_WEIGHT]);
+        expect(editor.commands.removeMarks).toHaveBeenCalledWith([TextSetting.FONT_SIZE, TextSetting.FONT_WEIGHT]);
     });
 });
 

package/lib/components/toolbar/controls/link/LinkControl.vue

@@ -45,9 +45,9 @@
 
 <script setup>
 import { computed, ref, inject, unref } from 'vue';
-import { LinkDestinations, TextSettings } from '../../../../enums';
-import { InjectionTokens } from '../../../../injectionTokens';
-import { RegExps } from '../../../../regExps';
+import { LinkDestination, TextSetting } from '@/enums';
+import { InjectionTokens } from '@/injectionTokens';
+import { RegExps } from '@/regExps';
 import { tooltip as vTooltip } from '../../../../directives';
 import { useValidator } from '../../../base/composables';
 import { Button, Icon, Modal, TextField, useModalToggler } from '../../../base';
@@ -65,7 +65,7 @@ const isEmpty = () => {
 };
 
 const isValidUrl = () => {
-    if (link.currentDestination.value.id !== LinkDestinations.URL) return false;
+    if (link.currentDestination.value.id !== LinkDestination.URL) return false;
 
     const href = link.destinationHrefs.value.url;
     const isTelOrMail = RegExps.TEL_PROTOCOL.test(href) || RegExps.MAILTO_PROTOCOL.test(href);
@@ -93,7 +93,7 @@ const resetErrors = () => {
 
 const toggler = useModalToggler({
     onBeforeOpened: () => {
-        editor.commands.extendMarkRange(TextSettings.LINK);
+        editor.commands.extendMarkRange(TextSetting.LINK);
         resetErrors();
         link.prepareInitialFields();
     }