tiptapify 0.0.10 → 0.0.11

package/src/extensions/components/LineHeight.vue

@@ -0,0 +1,82 @@
+<script setup lang="ts">
+
+import { Editor } from "@tiptap/vue-3";
+
+import { computed, inject, Ref, ref } from 'vue'
+import { useI18n } from "vue-i18n";
+
+const props = defineProps({
+  lineHeights: { type: Array<number>, default () { return [] } },
+  lineHeight: { type: Number, default () { return null } },
+})
+
+const { t } = useI18n();
+
+const emit = defineEmits(['close'])
+
+const editor = inject('tiptapifyEditor') as Ref<Editor>
+
+const initialLineHeight = ref(computed(() => props.lineHeight).value)
+
+const lineHeightSelected = ref<boolean>(false)
+
+function hoverLineHeight(lineHeight: number) {
+  lineHeightSelected.value = false
+
+  editor.value.chain().focus().setLineHeight(lineHeight.toString()).run()
+}
+
+function resetLineHeight() {
+  if (lineHeightSelected.value) {
+    return
+  }
+
+  initialLineHeight.value
+    ? editor.value.chain().focus().setLineHeight(initialLineHeight.value.toString()).run()
+    : editor.value.chain().focus().unsetLineHeight().run()
+}
+
+function clearLineHeight() {
+  editor.value.chain().focus().unsetLineHeight().run()
+  emit('close')
+}
+
+function setLineHeight() {
+  lineHeightSelected.value = true
+
+  emit('close')
+}
+
+function isLineHeightActive(lineHeight: number): boolean {
+  return editor.value.isActive('textStyle', { lineHeight }) || lineHeight === initialLineHeight.value
+}
+</script>
+
+<template>
+  <VList class="tiptapify-line-height-list">
+    <VListItem :disabled="lineHeight === null" density="compact" @click="clearLineHeight">
+      <VListItemTitle class="font-italic text-grey-darken-1">
+        {{ t('defaultValue') }}
+      </VListItemTitle>
+    </VListItem>
+    <VListItem
+      v-for="lineHeight in lineHeights"
+      :active="isLineHeightActive(lineHeight)"
+      :color="lineHeight === initialLineHeight ? 'primary' : ''"
+      density="compact"
+      @click="setLineHeight"
+      @mouseover="hoverLineHeight(lineHeight)"
+      @mouseleave="resetLineHeight"
+    >
+      <VListItemTitle>
+        {{ lineHeight }}
+      </VListItemTitle>
+    </VListItem>
+  </VList>
+</template>
+
+<style lang="scss" scoped>
+.tiptapify-line-height-list {
+  max-height: 390px;
+}
+</style>

package/src/extensions/components/LinkDialog.vue

@@ -63,7 +63,7 @@ function close() {
 }
 
 const showLink = (event: CustomEvent) => {
-  attrs.value.href = event.detail.link?.href
+  attrs.value.href = event.detail.link?.href ?? ''
   attrs.value.target = targetAttrs.value.find(item => item.value === event.detail.link?.target) ?? targetAttrs[0]
   attrs.value.rel = event.detail.link?.rel?.split(' ')
   attrs.value.cssClass = event.detail.link?.class
@@ -80,9 +80,25 @@ onUnmounted(() => {
 })
 
 watch(() => attrs.value.href, () => {
-  const regex = new RegExp(/^((https?|ftps?|sftp):\/\/[a-z0-9]+(\.[a-z0-9]+)+|mailto:\w+@[a-z]+(\.[a-z]+)*|tel:\+?\d+)$/, 'igu')
+  const azAZ09 = 'a-zA-Z0-9'
 
-  hrefInvalid.value = !regex.test(attrs.value.href)
+  const regexHrefProto = 'https?:\\/\\/'
+  const regexHrefAuth = `([${azAZ09}]+(:[${azAZ09}]+)?@)?`
+  const regexHrefDomain = `[${azAZ09}]+(\\.[${azAZ09}]+(-?[${azAZ09}]+)?)+`
+  const regexHrefPath = `(\\/[${azAZ09}\\-]+)*`
+  const regexHrefFragment = '(#[^\\s]*)?'
+  const regexHrefQueryParam = `(\\?[${azAZ09}\\-_]+((\\[[${azAZ09}]+\\])?=[${azAZ09}\\-_%]+)?)?`
+  const regexHrefQueryParamExtra = `(&[${azAZ09}\\-_]+((\\[[${azAZ09}]+\\])?=[${azAZ09}\\-_%]+)?)*`
+  const regexHref = `${regexHrefProto}${regexHrefAuth}${regexHrefDomain}${regexHrefPath}${regexHrefFragment}${regexHrefQueryParam}${regexHrefQueryParamExtra}`
+
+  const regexMailto = `mailto:\\w+@[${azAZ09}]+(\\.[${azAZ09}]+)*`
+  const regexTel = 'tel:\\+?[0-9]+'
+
+  const regexAll = [regexHref, regexMailto, regexTel].join('|')
+
+  const regex = new RegExp(`^(${regexAll})$`, 'i')
+
+  hrefInvalid.value = attrs.value.href !== '' && !regex.test(attrs.value.href)
 })
 </script>
 
@@ -146,7 +162,7 @@ watch(() => attrs.value.href, () => {
             <VBtn :variant="variantBtn" @click="close" class="mr-2">
               {{ t('dialog.close') }}
             </VBtn>
-            <VBtn color="primary" :variant="variantBtn" :disabled="isDisabled" @click="apply">
+            <VBtn color="primary" :variant="variantBtn" :disabled="isDisabled || hrefInvalid" @click="apply">
               {{ t('dialog.apply') }}
             </VBtn>
           </VCol>

package/src/extensions/components/ShowSourceDialog.vue

@@ -19,9 +19,9 @@ const formatted = ref(false)
 const sourceCode = ref('')
 
 const formatHtml = (html: string): string => {
+  const singleTags = ['img', 'hr', 'br', 'input']
   let formatted = html.replace(/>/g, '>\n');
 
-  formatted = formatted.replace(/\n</g, '\n<');
   formatted = formatted.replace(/([^>\n])</g, '$1\n<');
 
   const lines = formatted.split('\n');
@@ -35,7 +35,8 @@ const formatHtml = (html: string): string => {
 
         const indentedLine = ' '.repeat(indentLevel * props.indent) + line;
 
-        if (line.match(/<[^\/][^>]*>/) && !line.match(/<.*\/>/)) {
+        const tag = line.match(/<\/?(\S+).*>/) ?? []
+        if (!singleTags.includes(tag[1] ?? '') && line.match(/<[^\/][^>]*>/) && !line.match(/<.*\/>/)) {
           indentLevel++;
         }
 

package/src/extensions/link.ts

@@ -2,6 +2,14 @@ import Link from "@tiptap/extension-link";
 
 const name: string = 'link'
 
+declare module '@tiptap/core' {
+  interface Commands<ReturnType> {
+    link: {
+      showLink: () => ReturnType
+    }
+  }
+}
+
 export const TiptapifyLink = Link.extend({
   name,
 

package/src/extensions/slash-commands.ts

@@ -9,7 +9,7 @@ export default Extension.create(
       return {
         suggestion: {
           char: '/',
-          command: ({editor, range, props}) => {
+          command: ({ editor, range, props }) => {
             props.command({editor, range})
           },
         },

package/src/i18n/index.ts

@@ -11,7 +11,6 @@ let _i18n: any = null
 export const getI18n = (locale: string) => {
   if (_i18n === null) {
     _i18n = createI18n({
-      legacy: false,
       locale: locale,
       fallbackLocale: 'en',
       messages

package/src/i18n/locales/ch.json

@@ -1,118 +1,119 @@
 {
+  "defaultValue": "默认值",
   "content": {
-    "placeholder": "Schriibä Sie öppis da..."
+    "placeholder": "写点什么..."
   },
   "style": {
-    "paragraph": "Absatz",
-    "heading": "Überschrift",
+    "paragraph": "段落",
+    "heading": "标题",
     "headings": {
-      "h1": "Überschrift Stufe 1",
-      "h2": "Überschrift Stufe 2",
-      "h3": "Überschrift Stufe 3",
-      "h4": "Überschrift Stufe 4",
-      "h5": "Überschrift Stufe 5",
-      "h6": "Überschrift Stufe 6"
+      "h1": "1级标题",
+      "h2": "2级标题",
+      "h3": "3级标题",
+      "h4": "4级标题",
+      "h5": "5级标题",
+      "h6": "6级标题"
     },
-    "fontFamily": "Schriftart",
-    "fontSize": "Schriftgrösse",
-    "lineHeight": "Zylähöchi",
+    "fontFamily": "字体",
+    "fontSize": "大小",
+    "lineHeight": "行高",
     "color": {
-      "highlight": "Markierigsfäru",
-      "text": "Täxtfäru",
-      "unset": "Färu entfärnä",
-      "custom": "Benutzerdefinierti Färu"
+      "highlight": "高亮颜色",
+      "text": "文本颜色",
+      "unset": "清除颜色",
+      "custom": "自定义选择"
     }
   },
   "format": {
-    "bold": "Fett",
-    "italic": "Kursiv",
-    "strike": "Durchgstrichä",
-    "underline": "Unterstrichä",
-    "sup": "Hochgstellt",
-    "sub": "Tiefgstellt",
-    "break": "Hartä Umbruch",
-    "line": "Horizontali Linie",
-    "blockquote": "Zitat",
-    "code": "Code",
-    "codeblock": "Code-Block",
-    "formatClear": "Formatierig löschä"
+    "bold": "粗体",
+    "italic": "斜体",
+    "strike": "删除线",
+    "underline": "下划线",
+    "sup": "上标",
+    "sub": "下标",
+    "break": "换行",
+    "line": "水平线",
+    "blockquote": "引用",
+    "code": "代码",
+    "codeblock": "代码块",
+    "formatClear": "清除格式"
   },
   "media": {
-    "link": "Äxtärnä Link",
-    "image": "Bild",
+    "link": "外部链接",
+    "image": "图片",
     "tables": {
-      "table": "Tabälle",
-      "insertTable": "Tabälle yfügä",
-      "deleteTable": "Tabälle löschä",
-      "insertWithHeaderRow": "Tabälle mit Chopfzyle yfügä",
-      "rows": "Zylä",
-      "row": "Zyle",
-      "insertRowBefore": "Zyle dervor yfügä",
-      "insertRowAfter": "Zyle dernah yfügä",
-      "deleteRow": "Zyle löschä",
-      "cols": "Spaltä",
-      "col": "Spalte",
-      "insertColBefore": "Spalte dervor yfügä",
-      "insertColAfter": "Spalte dernah yfügä",
-      "deleteCol": "Spalte löschä",
-      "mergeCells": "Zällä zämmäfüärä",
-      "splitCell": "Zälle teilä"
+      "table": "表格",
+      "insertTable": "插入表格",
+      "deleteTable": "删除表格",
+      "insertWithHeaderRow": "插入带标题的表格",
+      "rows": "行",
+      "row": "行",
+      "insertRowBefore": "在前面插入行",
+      "insertRowAfter": "在后面插入行",
+      "deleteRow": "删除行",
+      "cols": "列",
+      "col": "列",
+      "insertColBefore": "在前面插入列",
+      "insertColAfter": "在后面插入列",
+      "deleteCol": "删除列",
+      "mergeCells": "合并单元格",
+      "splitCell": "拆分单元格"
     }
   },
   "action": {
-    "undo": "Rückgängig",
-    "redo": "Wiederholä"
+    "undo": "撤销",
+    "redo": "重做"
   },
-  "alignment": "Usrichtig",
+  "alignment": "对齐",
   "alignments": {
-    "left": "Links usrichtä",
-    "center": "Zentriert usrichtä",
-    "right": "Rächts usrichtä",
-    "justify": "Blocksatz"
+    "left": "左对齐",
+    "center": "居中对齐",
+    "right": "右对齐",
+    "justify": "两端对齐"
   },
-  "list": "Lischtä",
+  "list": "列表",
   "lists": {
-    "bullet": "Ungordneti Lischtä",
-    "numbered": "Nummerierti Lischtä",
-    "task": "Uufgabälischtä",
-    "indent": "Lischtäelemänt yrückä",
-    "outdent": "Lischtäelemänt usrückä"
+    "bullet": "无序列表",
+    "numbered": "有序列表",
+    "task": "任务列表",
+    "indent": "增加列表项缩进",
+    "outdent": "减少列表项缩进"
   },
   "dialog": {
-    "apply": "Awändä",
-    "clear": "Löschä",
-    "close": "Schliässä",
+    "apply": "应用",
+    "clear": "清除",
+    "close": "关闭",
     "image": {
-      "title": "Bild hinzuefügä/bearbyitä",
-      "src": "Quälle",
-      "alt": "Alt-Täxt",
-      "width": "Bryti",
-      "height": "Höchi"
+      "title": "添加/修改图片",
+      "src": "源",
+      "alt": "替代文本",
+      "width": "宽度",
+      "height": "高度"
     },
     "link": {
-      "title": "Link hinzuefügä/bearbyitä",
-      "href": "Link-Adrässe",
-      "href_error": "Ungültigi Link-Adrässe",
-      "target": "Öffnä i...",
-      "target_blank": "Neus Fänschter",
-      "target_self": "Aktuells Fänschter",
-      "rel": "Rel",
-      "class": "CSS-Klasse"
+      "title": "添加/修改链接",
+      "href": "链接地址",
+      "href_error": "无效的链接地址",
+      "target": "打开方式...",
+      "target_blank": "新窗口",
+      "target_self": "当前窗口",
+      "rel": "rel",
+      "class": "CSS类"
     },
     "preview": {
-      "title": "Vorschau"
+      "title": "预览"
     },
     "source": {
-      "title": "Quellcode azygä",
-      "prettify": "Verschönärä"
+      "title": "查看源代码",
+      "prettify": "美化"
     }
   },
   "misc": {
-    "source": "Quellcode azygä",
-    "preview": "Vorschau"
+    "source": "查看源代码",
+    "preview": "预览"
   },
   "footer": {
-    "words": "Wörter",
-    "chars": "Zeichä"
+    "words": "单词",
+    "chars": "字符"
   }
 }

package/src/i18n/locales/cz.json

@@ -1,26 +1,27 @@
 {
+  "defaultValue": "Výchozí hodnota",
   "content": {
-    "placeholder": "Napište něco zde..."
+    "placeholder": "Napište něco..."
   },
   "style": {
-    "paragraph": "Odstavec",
+    "paragraph": "odstavec",
     "heading": "Nadpis",
     "headings": {
-      "h1": "Nadpis úroveň 1",
-      "h2": "Nadpis úroveň 2",
-      "h3": "Nadpis úroveň 3",
-      "h4": "Nadpis úroveň 4",
-      "h5": "Nadpis úroveň 5",
-      "h6": "Nadpis úroveň 6"
+      "h1": "Nadpis 1. úrovně",
+      "h2": "Nadpis 2. úrovně",
+      "h3": "Nadpis 3. úrovně",
+      "h4": "Nadpis 4. úrovně",
+      "h5": "Nadpis 5. úrovně",
+      "h6": "Nadpis 6. úrovně"
     },
-    "fontFamily": "Rodina písma",
-    "fontSize": "Velikost písma",
+    "fontFamily": "Písmo",
+    "fontSize": "Velikost",
     "lineHeight": "Výška řádku",
     "color": {
       "highlight": "Barva zvýraznění",
       "text": "Barva textu",
-      "unset": "Zrušit barvu",
-      "custom": "Vlastní barva"
+      "unset": "Vymazat barvu",
+      "custom": "Vlastní výběr"
     }
   },
   "format": {
@@ -30,9 +31,9 @@
     "underline": "Podtržené",
     "sup": "Horní index",
     "sub": "Dolní index",
-    "break": "Tvrdé zalomení",
-    "line": "Vodorovná čára",
-    "blockquote": "Citace",
+    "break": "Zalomení řádku",
+    "line": "Horizontální čára",
+    "blockquote": "Citát",
     "code": "Kód",
     "codeblock": "Blok kódu",
     "formatClear": "Vymazat formátování"
@@ -65,38 +66,38 @@
   },
   "alignment": "Zarovnání",
   "alignments": {
-    "left": "Zarovnat vlevo",
-    "center": "Zarovnat na střed",
-    "right": "Zarovnat vpravo",
-    "justify": "Zarovnat do bloku"
+    "left": "Zarovnání vlevo",
+    "center": "Zarovnání na střed",
+    "right": "Zarovnání vpravo",
+    "justify": "Zarovnání do bloku"
   },
   "list": "Seznam",
   "lists": {
-    "bullet": "Neuspořádaný seznam",
+    "bullet": "Odrážkový seznam",
     "numbered": "Číslovaný seznam",
     "task": "Seznam úkolů",
-    "indent": "Odsadit položku",
-    "outdent": "Zrušit odsazení"
+    "indent": "Zvětšit odsazení položky seznamu",
+    "outdent": "Zmenšit odsazení položky seznamu"
   },
   "dialog": {
     "apply": "Použít",
     "clear": "Vymazat",
     "close": "Zavřít",
     "image": {
-      "title": "Přidat/upravit obrázek",
+      "title": "Přidání/úprava obrázku",
       "src": "Zdroj",
-      "alt": "Alternativní text",
+      "alt": "alt",
       "width": "Šířka",
       "height": "Výška"
     },
     "link": {
-      "title": "Přidat/upravit odkaz",
+      "title": "Přidání/úprava odkazu",
       "href": "Adresa odkazu",
       "href_error": "Neplatná adresa odkazu",
       "target": "Otevřít v...",
-      "target_blank": "Nové okno",
-      "target_self": "Aktuální okno",
-      "rel": "Rel",
+      "target_blank": "Novém okně",
+      "target_self": "Aktuálním okně",
+      "rel": "rel",
       "class": "CSS třída"
     },
     "preview": {
@@ -104,7 +105,7 @@
     },
     "source": {
       "title": "Zobrazit zdrojový kód",
-      "prettify": "Formátovat"
+      "prettify": "prettify"
     }
   },
   "misc": {

package/src/i18n/locales/de.json

@@ -1,26 +1,27 @@
 {
+  "defaultValue": "Standardwert",
   "content": {
-    "placeholder": "Schreiben Sie hier etwas..."
+    "placeholder": "Schreiben Sie etwas..."
   },
   "style": {
     "paragraph": "Absatz",
     "heading": "Überschrift",
     "headings": {
-      "h1": "Überschrift Ebene 1",
-      "h2": "Überschrift Ebene 2",
-      "h3": "Überschrift Ebene 3",
-      "h4": "Überschrift Ebene 4",
-      "h5": "Überschrift Ebene 5",
-      "h6": "Überschrift Ebene 6"
+      "h1": "Überschrift 1. Ebene",
+      "h2": "Überschrift 2. Ebene",
+      "h3": "Überschrift 3. Ebene",
+      "h4": "Überschrift 4. Ebene",
+      "h5": "Überschrift 5. Ebene",
+      "h6": "Überschrift 6. Ebene"
     },
     "fontFamily": "Schriftart",
-    "fontSize": "Schriftgröße",
+    "fontSize": "Größe",
     "lineHeight": "Zeilenhöhe",
     "color": {
-      "highlight": "Markierungsfarbe",
+      "highlight": "Hervorhebungsfarbe",
       "text": "Textfarbe",
-      "unset": "Farbe zurücksetzen",
-      "custom": "Benutzerdefinierte Farbe"
+      "unset": "Farbe löschen",
+      "custom": "Eigene Auswahl"
     }
   },
   "format": {
@@ -30,7 +31,7 @@
     "underline": "Unterstrichen",
     "sup": "Hochgestellt",
     "sub": "Tiefgestellt",
-    "break": "Harter Umbruch",
+    "break": "Zeilenumbruch",
     "line": "Horizontale Linie",
     "blockquote": "Zitat",
     "code": "Code",
@@ -65,38 +66,38 @@
   },
   "alignment": "Ausrichtung",
   "alignments": {
-    "left": "Links ausrichten",
-    "center": "Zentriert ausrichten",
-    "right": "Rechts ausrichten",
+    "left": "Linksbündig",
+    "center": "Zentriert",
+    "right": "Rechtsbündig",
     "justify": "Blocksatz"
   },
   "list": "Liste",
   "lists": {
-    "bullet": "Ungeordnete Liste",
+    "bullet": "Aufzählung",
     "numbered": "Nummerierte Liste",
     "task": "Aufgabenliste",
-    "indent": "Listenelement einrücken",
-    "outdent": "Listenelement ausrücken"
+    "indent": "Einzug vergrößern",
+    "outdent": "Einzug verkleinern"
   },
   "dialog": {
     "apply": "Anwenden",
     "clear": "Löschen",
     "close": "Schließen",
     "image": {
-      "title": "Bild hinzufügen/bearbeiten",
+      "title": "Bild hinzufügen/ändern",
       "src": "Quelle",
-      "alt": "Alt-Text",
+      "alt": "alt",
       "width": "Breite",
       "height": "Höhe"
     },
     "link": {
-      "title": "Link hinzufügen/bearbeiten",
+      "title": "Link hinzufügen/ändern",
       "href": "Link-Adresse",
       "href_error": "Ungültige Link-Adresse",
       "target": "Öffnen in...",
-      "target_blank": "Neues Fenster",
-      "target_self": "Aktuelles Fenster",
-      "rel": "Rel",
+      "target_blank": "Neuem Fenster",
+      "target_self": "Aktuellem Fenster",
+      "rel": "rel",
       "class": "CSS-Klasse"
     },
     "preview": {
@@ -104,7 +105,7 @@
     },
     "source": {
       "title": "Quellcode anzeigen",
-      "prettify": "Verschönern"
+      "prettify": "prettify"
     }
   },
   "misc": {

package/src/i18n/locales/en.json

@@ -1,4 +1,5 @@
 {
+  "defaultValue": "Default value",
   "content": {
     "placeholder": "Write something here..."
   },