@dialpad/dialtone-vue 2.127.0 → 2.127.2

package/dist/lib/rich-text-editor.js

@@ -1,89 +1,93 @@
-import { NodeViewWrapper as E, nodeViewProps as k, VueRenderer as R, VueNodeViewRenderer as T, EditorContent as O, Editor as $ } from "@tiptap/vue-2";
-import M from "@tiptap/extension-blockquote";
-import B from "@tiptap/extension-code-block";
-import D from "@tiptap/extension-document";
-import H from "@tiptap/extension-hard-break";
-import q from "@tiptap/extension-paragraph";
-import N from "@tiptap/extension-placeholder";
-import U from "@tiptap/extension-bold";
-import F from "@tiptap/extension-bullet-list";
-import K from "@tiptap/extension-italic";
-import V from "@tiptap/extension-link";
-import z from "@tiptap/extension-list-item";
-import W from "@tiptap/extension-ordered-list";
-import J from "@tiptap/extension-strike";
-import X from "@tiptap/extension-underline";
-import Y from "@tiptap/extension-text";
-import G from "@tiptap/extension-text-align";
-import { Node as Q, mergeAttributes as g, nodeInputRule as y, nodePasteRule as v, getMarksBetween as Z, combineTransactionSteps as tt, getChangedRanges as et, findChildrenInRange as rt, Mark as nt } from "@tiptap/core";
-import { n as u } from "../chunks/_plugin-vue2_normalizer-u6G_3nkj.js";
-import { D as C, m as ot, o as S } from "../chunks/index-YkSDT8-g.js";
-import { PluginKey as I, Plugin as it } from "@tiptap/pm/state";
-import st from "@tiptap/suggestion";
-import { emojisIndexed as at } from "@dialpad/dialtone-emojis";
-import { DtListItem as ut } from "./list-item.js";
-import { DtStack as A } from "./stack.js";
-import j from "tippy.js";
-import { linkRegex as lt, getPhoneNumberRegex as ct } from "./utils.js";
-import dt from "@tiptap/extension-mention";
-import { DtLink as mt } from "./link.js";
-import { DtAvatar as pt } from "./avatar.js";
-import "emoji-regex";
-import "emoji-toolkit/emoji_strategy.json";
+import { NodeViewWrapper, nodeViewProps, VueRenderer, VueNodeViewRenderer, EditorContent, Editor } from "@tiptap/vue-2";
+import Blockquote from "@tiptap/extension-blockquote";
+import CodeBlock from "@tiptap/extension-code-block";
+import Document from "@tiptap/extension-document";
+import HardBreak from "@tiptap/extension-hard-break";
+import Paragraph from "@tiptap/extension-paragraph";
+import Placeholder from "@tiptap/extension-placeholder";
+import Bold from "@tiptap/extension-bold";
+import BulletList from "@tiptap/extension-bullet-list";
+import Italic from "@tiptap/extension-italic";
+import TipTapLink from "@tiptap/extension-link";
+import ListItem from "@tiptap/extension-list-item";
+import OrderedList from "@tiptap/extension-ordered-list";
+import Strike from "@tiptap/extension-strike";
+import Underline from "@tiptap/extension-underline";
+import Text from "@tiptap/extension-text";
+import TextAlign from "@tiptap/extension-text-align";
+import { Node, mergeAttributes, nodeInputRule, nodePasteRule, getMarksBetween, combineTransactionSteps, getChangedRanges, findChildrenInRange, Mark } from "@tiptap/core";
+import { normalizeComponent } from "../chunks/_plugin-vue2_normalizer-sOSkiPF3.js";
+import { DtEmoji } from "./emoji.js";
+import { shortcodeToEmojiData, codeToEmojiData } from "../common/emoji.js";
+import { PluginKey, Plugin } from "@tiptap/pm/state";
+import Suggestion from "@tiptap/suggestion";
+import { emojisIndexed } from "@dialpad/dialtone-emojis";
+import { DtListItem } from "./list-item.js";
+import { DtStack } from "./stack.js";
+import tippy from "tippy.js";
+import { linkRegex, getPhoneNumberRegex } from "../common/utils.js";
+import Mention from "@tiptap/extension-mention";
+import { DtLink } from "./link.js";
+import { DtAvatar } from "./avatar.js";
 import "./skeleton.js";
-import "../chunks/icon_constants-OpYAAKwF.js";
+import "../chunks/icon_constants-Dy4MEUJL.js";
 import "@dialpad/dialtone-icons/icons.json";
-import "../chunks/list_item_constants-LTUc74pD.js";
+import "emoji-regex";
+import "emoji-toolkit/emoji_strategy.json";
+import "../chunks/list_item_constants-u1xcN9Dd.js";
 import "./item-layout.js";
 import "./icon.js";
 import "@dialpad/dialtone-icons/vue2";
-import "../chunks/stack_constants-u7tNqGtc.js";
-import "./constants.js";
+import "../chunks/stack_constants-HraCekPm.js";
+import "../common/constants.js";
 import "vue";
-import "../chunks/link_constants-vIUB92L4.js";
+import "../chunks/link_constants-nWVlXQBs.js";
 import "./presence.js";
-const ft = {
+const _sfc_main$5 = {
   name: "EmojiComponent",
   components: {
-    NodeViewWrapper: E,
-    DtEmoji: C
+    NodeViewWrapper,
+    DtEmoji
   },
-  props: k
+  props: nodeViewProps
+};
+var _sfc_render$5 = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("node-view-wrapper", { staticClass: "d-d-inline-block d-va-bottom d-lh0" }, [_c("dt-emoji", { attrs: { "size": "500", "code": _vm.node.attrs.code } })], 1);
 };
-var ht = function() {
-  var e = this, r = e._self._c;
-  return r("node-view-wrapper", { staticClass: "d-d-inline-block d-va-bottom d-lh0" }, [r("dt-emoji", { attrs: { size: "500", code: e.node.attrs.code } })], 1);
-}, gt = [], _t = /* @__PURE__ */ u(
-  ft,
-  ht,
-  gt,
-  !1,
+var _sfc_staticRenderFns$5 = [];
+var __component__$5 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$5,
+  _sfc_render$5,
+  _sfc_staticRenderFns$5,
+  false,
   null,
   null,
   null,
   null
 );
-const yt = _t.exports, vt = {
+const EmojiComponent = __component__$5.exports;
+const _sfc_main$4 = {
   name: "SuggestionList",
   components: {
-    DtListItem: ut
+    DtListItem
   },
   props: {
     items: {
       type: Array,
-      required: !0
+      required: true
     },
     command: {
       type: Function,
-      required: !0
+      required: true
     },
     itemComponent: {
       type: Object,
-      required: !0
+      required: true
     },
     itemType: {
       type: String,
-      required: !0
+      required: true
     }
   },
   data() {
@@ -97,169 +101,238 @@ const yt = _t.exports, vt = {
     }
   },
   methods: {
-    onKeyDown({ event: t }) {
-      return t.key === "ArrowUp" ? (this.upHandler(), !0) : t.key === "ArrowDown" ? (this.downHandler(), !0) : t.key === "Enter" || t.key === "Tab" ? (t.preventDefault(), this.selectHandler(), t.stopPropagation(), !0) : !1;
+    onKeyDown({ event }) {
+      if (event.key === "ArrowUp") {
+        this.upHandler();
+        return true;
+      }
+      if (event.key === "ArrowDown") {
+        this.downHandler();
+        return true;
+      }
+      if (event.key === "Enter" || event.key === "Tab") {
+        event.preventDefault();
+        this.selectHandler();
+        event.stopPropagation();
+        return true;
+      }
+      return false;
     },
     upHandler() {
-      this.selectedIndex = (this.selectedIndex + this.items.length - 1) % this.items.length, this.scrollActiveElementIntoView();
+      this.selectedIndex = (this.selectedIndex + this.items.length - 1) % this.items.length;
+      this.scrollActiveElementIntoView();
     },
     downHandler() {
-      this.selectedIndex = (this.selectedIndex + 1) % this.items.length, this.scrollActiveElementIntoView();
+      this.selectedIndex = (this.selectedIndex + 1) % this.items.length;
+      this.scrollActiveElementIntoView();
     },
     scrollActiveElementIntoView() {
-      const t = this.$refs.suggestionList.querySelector(".dt-list-item--highlighted");
-      t && t.scrollIntoView({
-        behaviour: "smooth",
-        block: "center"
-      });
+      const activeElement = this.$refs.suggestionList.querySelector(".dt-list-item--highlighted");
+      if (activeElement) {
+        activeElement.scrollIntoView({
+          behaviour: "smooth",
+          block: "center"
+        });
+      }
     },
     selectHandler() {
       this.selectItem(this.selectedIndex);
     },
-    selectItem(t) {
-      const e = this.items[t];
+    selectItem(index) {
+      const item = this.items[index];
       switch (this.itemType) {
         case "emoji":
-          this.command(e);
+          this.command(item);
           return;
         case "mention":
-          this.command({ name: e.name, id: e.id, avatarSrc: e.avatarSrc });
+          this.command({ name: item.name, id: item.id, avatarSrc: item.avatarSrc });
           break;
       }
     }
   }
 };
-var wt = function() {
-  var e = this, r = e._self._c;
-  return r("div", { staticClass: "d-popover__dialog" }, [r("ul", { directives: [{ name: "show", rawName: "v-show", value: e.items.length, expression: "items.length" }], ref: "suggestionList", staticClass: "dt-suggestion-list" }, e._l(e.items, function(n, o) {
-    return r("dt-list-item", { key: n.id, class: [
+var _sfc_render$4 = function render2() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", { staticClass: "d-popover__dialog" }, [_c("ul", { directives: [{ name: "show", rawName: "v-show", value: _vm.items.length, expression: "items.length" }], ref: "suggestionList", staticClass: "dt-suggestion-list" }, _vm._l(_vm.items, function(item, index) {
+    return _c("dt-list-item", { key: item.id, class: [
       "dt-suggestion-list--item",
-      { "dt-list-item--highlighted": o === e.selectedIndex }
-    ], attrs: { "navigation-type": "arrow-keys" }, on: { click: function(i) {
-      return e.selectItem(o);
-    }, keydown: function(i) {
-      return i.preventDefault(), i.stopPropagation(), e.onKeyDown.apply(null, arguments);
-    } } }, [r(e.itemComponent, { tag: "component", attrs: { item: n } })], 1);
+      { "dt-list-item--highlighted": index === _vm.selectedIndex }
+    ], attrs: { "navigation-type": "arrow-keys" }, on: { "click": function($event) {
+      return _vm.selectItem(index);
+    }, "keydown": function($event) {
+      $event.preventDefault();
+      $event.stopPropagation();
+      return _vm.onKeyDown.apply(null, arguments);
+    } } }, [_c(_vm.itemComponent, { tag: "component", attrs: { "item": item } })], 1);
   }), 1)]);
-}, bt = [], xt = /* @__PURE__ */ u(
-  vt,
-  wt,
-  bt,
-  !1,
+};
+var _sfc_staticRenderFns$4 = [];
+var __component__$4 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$4,
+  _sfc_render$4,
+  _sfc_staticRenderFns$4,
+  false,
   null,
   null,
   null,
   null
 );
-const L = xt.exports, Et = {
+const SuggestionList = __component__$4.exports;
+const _sfc_main$3 = {
   name: "EmojiSuggestion",
   components: {
-    DtEmoji: C,
-    DtStack: A
+    DtEmoji,
+    DtStack
   },
   props: {
     item: {
       type: Object,
-      required: !0
+      required: true
     }
   }
 };
-var kt = function() {
-  var e = this, r = e._self._c;
-  return r("dt-stack", { attrs: { direction: "row", gap: "400" } }, [r("dt-emoji", { attrs: { size: "200", code: e.item.code } }), e._v(" " + e._s(e.item.code) + " ")], 1);
-}, Rt = [], Tt = /* @__PURE__ */ u(
-  Et,
-  kt,
-  Rt,
-  !1,
+var _sfc_render$3 = function render3() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-stack", { attrs: { "direction": "row", "gap": "400" } }, [_c("dt-emoji", { attrs: { "size": "200", "code": _vm.item.code } }), _vm._v(" " + _vm._s(_vm.item.code) + " ")], 1);
+};
+var _sfc_staticRenderFns$3 = [];
+var __component__$3 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$3,
+  _sfc_render$3,
+  _sfc_staticRenderFns$3,
+  false,
   null,
   null,
   null,
   null
 );
-const Ct = Tt.exports, St = {
-  items: ({ query: t }) => t.length < 2 ? [] : Object.values(at).filter(function(n) {
-    return !!n.shortname.substring(1, n.shortname.length - 1).startsWith(t.toLowerCase());
-  }).map((n) => ({ id: n.unicode_character, code: n.shortname })),
-  command: ({ editor: t, range: e, props: r }) => {
-    var i, s;
-    const n = t.view.state.selection.$to.nodeAfter;
-    ((i = n == null ? void 0 : n.text) == null ? void 0 : i.startsWith(" ")) && (e.to += 1), t.chain().focus().insertContentAt(e, [
+const EmojiSuggestion = __component__$3.exports;
+const suggestionOptions = {
+  items: ({ query }) => {
+    if (query.length < 2) {
+      return [];
+    }
+    const emojiList = Object.values(emojisIndexed);
+    const filteredEmoji = emojiList.filter(function(item) {
+      if (item.shortname.substring(1, item.shortname.length - 1).startsWith(query.toLowerCase())) {
+        return true;
+      }
+      return false;
+    });
+    return filteredEmoji.map((item) => {
+      return { id: item.unicode_character, code: item.shortname };
+    });
+  },
+  command: ({ editor, range, props }) => {
+    var _a, _b;
+    const nodeAfter = editor.view.state.selection.$to.nodeAfter;
+    const overrideSpace = (_a = nodeAfter == null ? void 0 : nodeAfter.text) == null ? void 0 : _a.startsWith(" ");
+    if (overrideSpace) {
+      range.to += 1;
+    }
+    editor.chain().focus().insertContentAt(range, [
       {
         type: "emoji",
-        attrs: r
+        attrs: props
       },
       {
         type: "text",
         text: " "
       }
-    ]).run(), (s = window.getSelection()) == null || s.collapseToEnd();
+    ]).run();
+    (_b = window.getSelection()) == null ? void 0 : _b.collapseToEnd();
   },
   render: () => {
-    let t, e;
+    let component;
+    let popup;
     return {
-      onStart: (r) => {
-        t = new R(L, {
+      onStart: (props) => {
+        component = new VueRenderer(SuggestionList, {
           parent: void 0,
           propsData: {
-            itemComponent: Ct,
+            itemComponent: EmojiSuggestion,
             itemType: "emoji",
-            ...r
+            ...props
           },
-          editor: r.editor
-        }), r.clientRect && (e = j("body", {
-          getReferenceClientRect: r.clientRect,
+          editor: props.editor
+        });
+        if (!props.clientRect) {
+          return;
+        }
+        popup = tippy("body", {
+          getReferenceClientRect: props.clientRect,
           appendTo: () => document.body,
-          content: t.element,
-          showOnCreate: !0,
-          interactive: !0,
+          content: component.element,
+          showOnCreate: true,
+          interactive: true,
           trigger: "manual",
           placement: "top-start",
           contentElement: null,
           zIndex: 650
-        }));
+        });
       },
-      onUpdate(r) {
-        t.updateProps(r), r.clientRect && e[0].setProps({
-          getReferenceClientRect: r.clientRect
+      onUpdate(props) {
+        component.updateProps(props);
+        if (!props.clientRect) {
+          return;
+        }
+        popup[0].setProps({
+          getReferenceClientRect: props.clientRect
         });
       },
-      onKeyDown(r) {
-        var n;
-        return r.event.key === "Escape" ? (e[0].hide(), !0) : (n = t.ref) == null ? void 0 : n.onKeyDown(r);
+      onKeyDown(props) {
+        var _a;
+        if (props.event.key === "Escape") {
+          popup[0].hide();
+          return true;
+        }
+        return (_a = component.ref) == null ? void 0 : _a.onKeyDown(props);
       },
       onExit() {
-        e[0].destroy(), t.destroy();
+        popup[0].destroy();
+        component.destroy();
       }
     };
   }
-}, It = new I("emoji"), At = /:\w+:$/, jt = /:\w+:/g, Lt = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])$/, Pt = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])/g, w = (t) => {
-  if (t && S(t[0]))
+};
+const EmojiPluginKey = new PluginKey("emoji");
+const inputShortCodeRegex = /:\w+:$/;
+const pasteShortCodeRegex = /:\w+:/g;
+const inputUnicodeRegex = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])$/;
+const pasteUnicodeRegex = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])/g;
+const inputRuleMatch = (match) => {
+  if (match && codeToEmojiData(match[0])) {
     return {
-      index: t.index,
-      text: t[0],
-      match: t
+      index: match.index,
+      text: match[0],
+      match
     };
-}, Ot = (t) => [...t.matchAll(jt)].filter((r) => S(r[0])).map((r) => ({
-  index: r.index,
-  text: r[0],
-  match: r
-})), $t = Q.create({
+  }
+};
+const shortCodePasteMatch = (text) => {
+  const matches = [...text.matchAll(pasteShortCodeRegex)];
+  return matches.filter((match) => codeToEmojiData(match[0])).map((match) => ({
+    index: match.index,
+    text: match[0],
+    match
+  }));
+};
+const Emoji = Node.create({
   addOptions() {
     return {
       HTMLAttributes: {},
       suggestion: {
         char: ":",
-        pluginKey: It
+        pluginKey: EmojiPluginKey
       }
     };
   },
   name: "emoji",
   group: "inline",
-  inline: !0,
-  selectable: !0,
+  inline: true,
+  selectable: true,
   addNodeView() {
-    return T(yt);
+    return VueNodeViewRenderer(EmojiComponent);
   },
   addAttributes() {
     return {
@@ -278,37 +351,38 @@ const Ct = Tt.exports, St = {
       }
     ];
   },
-  renderText({ node: t }) {
-    return t.attrs.code;
+  renderText({ node }) {
+    return node.attrs.code;
   },
-  renderHTML({ HTMLAttributes: t }) {
-    return ["emoji-component", g(this.options.HTMLAttributes, t)];
+  renderHTML({ HTMLAttributes }) {
+    return ["emoji-component", mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];
   },
   addInputRules() {
     return [
       // shortcode input
-      y({
-        find: (t) => {
-          const e = t.match(At);
-          return w(e);
+      nodeInputRule({
+        find: (text) => {
+          const match = text.match(inputShortCodeRegex);
+          return inputRuleMatch(match);
         },
         type: this.type,
-        getAttributes(t) {
+        getAttributes(attrs) {
           return {
-            code: t[0]
+            code: attrs[0]
           };
         }
       }),
-      y({
-        find: (t) => {
-          const e = t.match(Lt);
-          return w(e);
+      nodeInputRule({
+        find: (text) => {
+          const match = text.match(inputUnicodeRegex);
+          return inputRuleMatch(match);
         },
         type: this.type,
-        getAttributes(t) {
-          const e = ot(t[0]).unicode_output;
+        getAttributes(attrs) {
+          const unicode = shortcodeToEmojiData(attrs[0]).unicode_output;
+          const emoji = String.fromCodePoint(parseInt(unicode, 16));
           return {
-            code: String.fromCodePoint(parseInt(e, 16)),
+            code: emoji,
             label: "emoji"
           };
         }
@@ -317,21 +391,21 @@ const Ct = Tt.exports, St = {
   },
   addPasteRules() {
     return [
-      v({
-        find: Ot,
+      nodePasteRule({
+        find: shortCodePasteMatch,
         type: this.type,
-        getAttributes(t) {
+        getAttributes(attrs) {
           return {
-            code: t[0]
+            code: attrs[0]
           };
         }
       }),
-      v({
-        find: Pt,
+      nodePasteRule({
+        find: pasteUnicodeRegex,
         type: this.type,
-        getAttributes(t) {
+        getAttributes(attrs) {
           return {
-            code: t[0]
+            code: attrs[0]
           };
         }
       })
@@ -339,171 +413,207 @@ const Ct = Tt.exports, St = {
   },
   addProseMirrorPlugins() {
     return [
-      st({
+      Suggestion({
         editor: this.editor,
         ...this.options.suggestion,
-        ...St
+        ...suggestionOptions
       })
     ];
   }
 });
-function Mt(t, e, r = () => !0) {
-  const n = [];
-  e.lastIndex = 0;
-  let o;
-  for (; o = e.exec(t); )
-    r(t, o) && n.push(o);
-  return n;
+function getRegexMatches(text, regex, validator = () => true) {
+  const matches = [];
+  regex.lastIndex = 0;
+  let match;
+  while (match = regex.exec(text)) {
+    if (validator(text, match)) {
+      matches.push(match);
+    }
+  }
+  return matches;
 }
-function Bt(t, e) {
-  return !["#", "@"].includes(t.charAt(e.index)) && !["#", "@"].includes(t.charAt(e.index - 1));
+function hasValidPrefix(text, match) {
+  return !["#", "@"].includes(text.charAt(match.index)) && !["#", "@"].includes(text.charAt(match.index - 1));
 }
-function Dt(t) {
-  const e = new RegExp(
+function trimEndPunctiation(string) {
+  const endPunctuationRegex = new RegExp(
     "(?:" + [
       `[!?.,:;'"]`,
       "(?:&|&amp;)(?:lt|gt|quot|apos|raquo|laquo|rsaquo|lsaquo);)+$"
     ].join("|"),
     "g"
   );
-  return t.replace(e, "");
+  return string.replace(endPunctuationRegex, "");
 }
-function Ht(t, e) {
-  const r = t.slice(0, e + 1).search(/\S+\s*$/), n = t.slice(e).search(/\s/);
-  if (n < 0) {
-    const o = t.slice(r);
+function getWordAt(text, index) {
+  const left = text.slice(0, index + 1).search(/\S+\s*$/);
+  const right = text.slice(index).search(/\s/);
+  if (right < 0) {
+    const word = text.slice(left);
     return {
-      text: o,
-      from: r,
-      to: r + o.length
+      text: word,
+      from: left,
+      to: left + word.length
     };
   }
   return {
-    text: t.slice(r, n + e),
-    from: r,
-    to: n + e
+    text: text.slice(left, right + index),
+    from: left,
+    to: right + index
   };
 }
-function h(t, e, r, n) {
-  const o = Ht(t, e);
-  if (n.lastIndex = 0, !n.test(o.text))
-    return o;
-  const i = r === "left" ? o.from - 1 : o.to + 1;
-  return i <= 0 || i >= t.length || i === e ? o : h(t, i, r, n);
+function getWordAtUntil(text, index, direction, regex) {
+  const word = getWordAt(text, index);
+  regex.lastIndex = 0;
+  if (!regex.test(word.text)) {
+    return word;
+  }
+  const newIndex = direction === "left" ? word.from - 1 : word.to + 1;
+  if (newIndex <= 0 || newIndex >= text.length || newIndex === index) {
+    return word;
+  }
+  return getWordAtUntil(text, newIndex, direction, regex);
 }
-function qt(t, e, r, n) {
-  const o = Math.max(t.from - 1, 0), i = Math.min(t.to + 1, e.content.size), s = Z(o, i, e);
-  for (const a of s)
-    a.mark.type === n && r.removeMark(a.from, a.to, n);
+function removeMarks(range, doc, tr, type) {
+  const from = Math.max(range.from - 1, 0);
+  const to = Math.min(range.to + 1, doc.content.size);
+  const marksInRange = getMarksBetween(from, to, doc);
+  for (const mark of marksInRange) {
+    if (mark.mark.type !== type) {
+      continue;
+    }
+    tr.removeMark(mark.from, mark.to, type);
+  }
 }
-const b = ct(1, 15);
-function x(t, e, r, n, o, i) {
-  if (!t)
+const partialPhoneNumberRegex = getPhoneNumberRegex(1, 15);
+function addMarks(text, pos, from, to, tr, type) {
+  if (!text) {
     return;
-  let s = r - e - 1;
-  s = s < 0 ? 0 : s;
-  const a = n - e, d = h(
-    t,
-    s,
+  }
+  let rangeFrom = from - pos - 1;
+  rangeFrom = rangeFrom < 0 ? 0 : rangeFrom;
+  const rangeTo = to - pos;
+  const firstWordInRange = getWordAtUntil(
+    text,
+    rangeFrom,
     "left",
-    b
-  ), _ = h(
-    t,
-    a,
+    partialPhoneNumberRegex
+  );
+  const lastWordInRange = getWordAtUntil(
+    text,
+    rangeTo,
     "right",
-    b
-  ), l = t.slice(d.from, _.to);
-  Mt(l, lt, Bt).forEach((f) => {
-    const c = Dt(f[0]), p = e + d.from + f.index + 1, P = p + c.length;
-    o.addMark(p, P, i.create());
+    partialPhoneNumberRegex
+  );
+  const wordsInRange = text.slice(firstWordInRange.from, lastWordInRange.to);
+  const matches = getRegexMatches(wordsInRange, linkRegex, hasValidPrefix);
+  matches.forEach((match) => {
+    const word = trimEndPunctiation(match[0]);
+    const from2 = pos + firstWordInRange.from + match.index + 1;
+    const to2 = from2 + word.length;
+    tr.addMark(from2, to2, type.create());
   });
 }
-function Nt(t) {
-  let e = !1;
-  return new it({
-    key: new I("autolink"),
-    appendTransaction: (r, n, o) => {
-      const i = r.some((l) => l.docChanged) && !n.doc.eq(o.doc);
-      if (e && !i)
+function autolink(options) {
+  let hasInitialized = false;
+  return new Plugin({
+    key: new PluginKey("autolink"),
+    appendTransaction: (transactions, oldState, newState) => {
+      const contentChanged = transactions.some((tr2) => tr2.docChanged) && !oldState.doc.eq(newState.doc);
+      if (hasInitialized && !contentChanged) {
         return;
-      const { tr: s } = o, { textContent: a } = o.doc;
-      e || x(a, 0, 0, a.length, s, t.type), e = !0;
-      const d = tt(
-        n.doc,
-        [...r]
+      }
+      const { tr } = newState;
+      const { textContent } = newState.doc;
+      if (!hasInitialized) {
+        addMarks(textContent, 0, 0, textContent.length, tr, options.type);
+      }
+      hasInitialized = true;
+      const transform = combineTransactionSteps(
+        oldState.doc,
+        [...transactions]
       );
-      return et(d).forEach(({ oldRange: l, newRange: m }) => {
-        qt(m, o.doc, s, t.type), rt(
-          o.doc,
-          m,
-          (c) => c.isTextblock
-        ).forEach(({ node: c, pos: p }) => {
-          x(
-            c.textContent,
-            p,
-            l.from,
-            m.to,
-            s,
-            t.type
+      const changes = getChangedRanges(transform);
+      changes.forEach(({ oldRange, newRange }) => {
+        removeMarks(newRange, newState.doc, tr, options.type);
+        const paragraphs = findChildrenInRange(
+          newState.doc,
+          newRange,
+          (node) => node.isTextblock
+        );
+        paragraphs.forEach(({ node, pos }) => {
+          addMarks(
+            node.textContent,
+            pos,
+            oldRange.from,
+            newRange.to,
+            tr,
+            options.type
           );
         });
-      }), s;
+      });
+      return tr;
     }
   });
 }
-const Ut = {
+const defaultAttributes = {
   class: "d-link d-c-text d-d-inline-block",
   rel: "noopener noreferrer nofollow"
-}, Ft = nt.create({
+};
+const Link = Mark.create({
   name: "Link",
-  renderHTML({ HTMLAttributes: t }) {
+  renderHTML({ HTMLAttributes }) {
     return [
       "a",
-      g(
+      mergeAttributes(
         this.options.HTMLAttributes,
-        t,
-        Ut
+        HTMLAttributes,
+        defaultAttributes
       ),
       0
     ];
   },
-  renderText({ node: t }) {
-    return t.attrs.text;
+  renderText({ node }) {
+    return node.attrs.text;
   },
   addProseMirrorPlugins() {
     return [
-      Nt({ type: this.type })
+      autolink({ type: this.type })
     ];
   }
-}), Kt = {
+});
+const _sfc_main$2 = {
   name: "MentionComponent",
   components: {
-    NodeViewWrapper: E,
-    DtLink: mt
+    NodeViewWrapper,
+    DtLink
   },
-  props: k,
+  props: nodeViewProps,
   computed: {
     text() {
       return "@" + this.$props.node.attrs.name;
     }
   }
 };
-var Vt = function() {
-  var e = this, r = e._self._c;
-  return r("node-view-wrapper", { staticClass: "d-d-inline-block" }, [r("dt-link", { attrs: { kind: "mention" } }, [e._v(" " + e._s(e.text) + " ")])], 1);
-}, zt = [], Wt = /* @__PURE__ */ u(
-  Kt,
-  Vt,
-  zt,
-  !1,
+var _sfc_render$2 = function render4() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("node-view-wrapper", { staticClass: "d-d-inline-block" }, [_c("dt-link", { attrs: { "kind": "mention" } }, [_vm._v(" " + _vm._s(_vm.text) + " ")])], 1);
+};
+var _sfc_staticRenderFns$2 = [];
+var __component__$2 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$2,
+  _sfc_render$2,
+  _sfc_staticRenderFns$2,
+  false,
   null,
   null,
   null,
   null
 );
-const Jt = Wt.exports, Xt = dt.extend({
+const MentionComponent = __component__$2.exports;
+const MentionPlugin = Mention.extend({
   addNodeView() {
-    return T(Jt);
+    return VueNodeViewRenderer(MentionComponent);
   },
   parseHTML() {
     return [
@@ -525,37 +635,41 @@ const Jt = Wt.exports, Xt = dt.extend({
       }
     };
   },
-  renderText({ node: t }) {
-    return `@${t.attrs.id}`;
+  renderText({ node }) {
+    return `@${node.attrs.id}`;
   },
-  renderHTML({ HTMLAttributes: t }) {
-    return ["mention-component", g(this.options.HTMLAttributes, t), 0];
+  renderHTML({ HTMLAttributes }) {
+    return ["mention-component", mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0];
   }
-}), Yt = [
+});
+const RICH_TEXT_EDITOR_OUTPUT_FORMATS = [
   "text",
   "json",
   "html"
-], Gt = [
+];
+const RICH_TEXT_EDITOR_AUTOFOCUS_TYPES = [
   "start",
   "end",
   "all"
-], Qt = [
+];
+const RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS = [
   "https",
   "http",
   "ftp",
   "ftps",
   "sftp",
   "mailto"
-], Zt = {
+];
+const _sfc_main$1 = {
   name: "MentionSuggestion",
   components: {
-    DtAvatar: pt,
-    DtStack: A
+    DtAvatar,
+    DtStack
   },
   props: {
     item: {
       type: Object,
-      required: !0
+      required: true
     }
   },
   computed: {
@@ -567,63 +681,81 @@ const Jt = Wt.exports, Xt = dt.extend({
     }
   }
 };
-var te = function() {
-  var e = this, r = e._self._c;
-  return r("dt-stack", { attrs: { direction: "row", gap: "400" } }, [r("dt-avatar", { attrs: { "full-name": e.name, "image-src": e.avatarSrc, "image-alt": e.name, size: "xs" } }), e._v(" " + e._s(e.name) + " ")], 1);
-}, ee = [], re = /* @__PURE__ */ u(
-  Zt,
-  te,
-  ee,
-  !1,
+var _sfc_render$1 = function render5() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-stack", { attrs: { "direction": "row", "gap": "400" } }, [_c("dt-avatar", { attrs: { "full-name": _vm.name, "image-src": _vm.avatarSrc, "image-alt": _vm.name, "size": "xs" } }), _vm._v(" " + _vm._s(_vm.name) + " ")], 1);
+};
+var _sfc_staticRenderFns$1 = [];
+var __component__$1 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$1,
+  _sfc_render$1,
+  _sfc_staticRenderFns$1,
+  false,
   null,
   null,
   null,
   null
 );
-const ne = re.exports, oe = {
+const MentionSuggestion = __component__$1.exports;
+const suggestion = {
   // This function comes from the user and passed to the editor directly.
   // This will also activate the mention plugin on the editor
   // items: ({ query }) => { return [] },
-  allowSpaces: !0,
+  allowSpaces: true,
   render: () => {
-    let t, e;
+    let component;
+    let popup;
     return {
-      onStart: (r) => {
-        t = new R(L, {
+      onStart: (props) => {
+        component = new VueRenderer(SuggestionList, {
           parent: void 0,
           propsData: {
-            itemComponent: ne,
+            itemComponent: MentionSuggestion,
             itemType: "mention",
-            ...r
+            ...props
           },
-          editor: r.editor
-        }), r.clientRect && (e = j("body", {
-          getReferenceClientRect: r.clientRect,
+          editor: props.editor
+        });
+        if (!props.clientRect) {
+          return;
+        }
+        popup = tippy("body", {
+          getReferenceClientRect: props.clientRect,
           appendTo: () => document.body,
-          content: t.element,
-          showOnCreate: !0,
-          interactive: !0,
+          content: component.element,
+          showOnCreate: true,
+          interactive: true,
           trigger: "manual",
           placement: "top-start"
-        }));
+        });
       },
-      onUpdate(r) {
-        t.updateProps(r), r.clientRect && e[0].setProps({
-          getReferenceClientRect: r.clientRect
+      onUpdate(props) {
+        component.updateProps(props);
+        if (!props.clientRect) {
+          return;
+        }
+        popup[0].setProps({
+          getReferenceClientRect: props.clientRect
         });
       },
-      onKeyDown(r) {
-        return r.event.key === "Escape" ? (e[0].hide(), !0) : t == null ? void 0 : t.ref.onKeyDown(r);
+      onKeyDown(props) {
+        if (props.event.key === "Escape") {
+          popup[0].hide();
+          return true;
+        }
+        return component == null ? void 0 : component.ref.onKeyDown(props);
       },
       onExit() {
-        e[0].destroy(), t.destroy();
+        popup[0].destroy();
+        component.destroy();
       }
     };
   }
-}, ie = {
+};
+const _sfc_main = {
   name: "DtRichTextEditor",
   components: {
-    EditorContent: O
+    EditorContent
   },
   props: {
     /**
@@ -639,21 +771,21 @@ const ne = re.exports, oe = {
      */
     editable: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for line breaks to be introduced in the text.
      */
     allowLineBreaks: {
       type: Boolean,
-      default: !1
+      default: false
     },
     /**
      * Descriptive label for the input element
      */
     inputAriaLabel: {
       type: String,
-      required: !0
+      required: true
     },
     /**
      * Additional class name for the input element. Only accepts a String value
@@ -677,9 +809,12 @@ const ne = re.exports, oe = {
      */
     autoFocus: {
       type: [Boolean, String, Number],
-      default: !1,
-      validator(t) {
-        return typeof t == "string" ? Gt.includes(t) : !0;
+      default: false,
+      validator(autoFocus) {
+        if (typeof autoFocus === "string") {
+          return RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(autoFocus);
+        }
+        return true;
       }
     },
     /**
@@ -691,8 +826,8 @@ const ne = re.exports, oe = {
     outputFormat: {
       type: String,
       default: "text",
-      validator(t) {
-        return Yt.includes(t);
+      validator(outputFormat) {
+        return RICH_TEXT_EDITOR_OUTPUT_FORMATS.includes(outputFormat);
       }
     },
     /**
@@ -707,7 +842,7 @@ const ne = re.exports, oe = {
      */
     link: {
       type: [Boolean, Object],
-      default: !1
+      default: false
     },
     /**
      * suggestion object containing the items query function.
@@ -729,42 +864,42 @@ const ne = re.exports, oe = {
      */
     allowBlockquote: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for bold to be introduced in the text.
      */
     allowBold: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for bullet list to be introduced in the text.
     */
     allowBulletList: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for italic to be introduced in the text.
      */
     allowItalic: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for strike to be introduced in the text.
      */
     allowStrike: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Whether the input allows for underline to be introduced in the text.
      */
     allowUnderline: {
       type: Boolean,
-      default: !0
+      default: true
     }
   },
   emits: [
@@ -796,54 +931,88 @@ const ne = re.exports, oe = {
   data() {
     return {
       editor: null,
-      popoverOpened: !1
+      popoverOpened: false
     };
   },
   computed: {
     // eslint-disable-next-line complexity
     extensions() {
-      const t = [D, q, Y];
-      if (this.link && t.push(this.getExtension(Ft, this.link)), this.allowBlockquote && t.push(M), this.allowBold && t.push(U), this.allowBulletList && (t.push(F), t.push(z), t.push(W.configure({
-        itemTypeName: "listItem"
-      }))), this.allowItalic && t.push(K), this.allowStrike && t.push(J), this.allowUnderline && t.push(X), t.push(
-        N.configure({ placeholder: this.placeholder })
-      ), this.allowLineBreaks || t.push(
-        H.extend({
-          addKeyboardShortcuts() {
-            return {
-              Enter: () => !0,
-              "Shift-Enter": () => this.editor.commands.first(({ commands: e }) => [
-                () => e.newlineInCode(),
-                () => e.createParagraphNear(),
-                () => e.liftEmptyBlock(),
-                () => e.splitBlock()
-              ])
-            };
-          }
-        })
-      ), t.push(V.extend({ inclusive: !1 }).configure({
-        autolink: !0,
-        protocols: Qt
-      })), this.mentionSuggestion) {
-        const e = { ...this.mentionSuggestion, ...oe };
-        t.push(Xt.configure({ suggestion: e }));
-      }
-      return t.push($t), t.push(G.configure({
+      const extensions = [Document, Paragraph, Text];
+      if (this.link) {
+        extensions.push(this.getExtension(Link, this.link));
+      }
+      if (this.allowBlockquote) {
+        extensions.push(Blockquote);
+      }
+      if (this.allowBold) {
+        extensions.push(Bold);
+      }
+      if (this.allowBulletList) {
+        extensions.push(BulletList);
+        extensions.push(ListItem);
+        extensions.push(OrderedList.configure({
+          itemTypeName: "listItem"
+        }));
+      }
+      if (this.allowItalic) {
+        extensions.push(Italic);
+      }
+      if (this.allowStrike) {
+        extensions.push(Strike);
+      }
+      if (this.allowUnderline) {
+        extensions.push(Underline);
+      }
+      extensions.push(
+        Placeholder.configure({ placeholder: this.placeholder })
+      );
+      if (!this.allowLineBreaks) {
+        extensions.push(
+          HardBreak.extend({
+            addKeyboardShortcuts() {
+              return {
+                Enter: () => true,
+                "Shift-Enter": () => this.editor.commands.first(({ commands }) => [
+                  () => commands.newlineInCode(),
+                  () => commands.createParagraphNear(),
+                  () => commands.liftEmptyBlock(),
+                  () => commands.splitBlock()
+                ])
+              };
+            }
+          })
+        );
+      }
+      extensions.push(TipTapLink.extend({ inclusive: false }).configure({
+        autolink: true,
+        protocols: RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS
+      }));
+      if (this.mentionSuggestion) {
+        const suggestionObject = { ...this.mentionSuggestion, ...suggestion };
+        extensions.push(MentionPlugin.configure({ suggestion: suggestionObject }));
+      }
+      extensions.push(Emoji);
+      extensions.push(TextAlign.configure({
         types: ["paragraph"],
         defaultAlignment: "left"
-      })), t.push(B.configure({
+      }));
+      extensions.push(CodeBlock.configure({
         HTMLAttributes: {
           class: "dt-rich-text-editor--code-block"
         }
-      })), t;
+      }));
+      return extensions;
     },
     inputAttrs() {
-      const t = {
+      const attrs = {
         "aria-label": this.inputAriaLabel,
-        "aria-multiline": !0,
+        "aria-multiline": true,
         role: "textbox"
       };
-      return this.editable || (t["aria-readonly"] = !0), t;
+      if (!this.editable) {
+        attrs["aria-readonly"] = true;
+      }
+      return attrs;
     }
   },
   /**
@@ -852,21 +1021,30 @@ const ne = re.exports, oe = {
     * to be hooked up to the Editor's own API.
     */
   watch: {
-    editable(t) {
-      this.editor.setEditable(t), this.updateEditorAttributes({ "aria-readonly": !t });
+    editable(isEditable) {
+      this.editor.setEditable(isEditable);
+      this.updateEditorAttributes({ "aria-readonly": !isEditable });
     },
-    inputClass(t) {
-      this.updateEditorAttributes({ class: t });
+    inputClass(newClass) {
+      this.updateEditorAttributes({ class: newClass });
     },
-    inputAriaLabel(t) {
-      this.updateEditorAttributes({ "aria-label": t });
+    inputAriaLabel(newLabel) {
+      this.updateEditorAttributes({ "aria-label": newLabel });
     },
     extensions() {
-      this.destroyEditor(), this.createEditor();
+      this.destroyEditor();
+      this.createEditor();
     },
-    value(t) {
-      let e = this.getOutput();
-      this.outputFormat === "json" && (t = JSON.stringify(t), e = JSON.stringify(e)), t !== e && this.editor.commands.setContent(t, !1);
+    value(newValue) {
+      let currentValue = this.getOutput();
+      if (this.outputFormat === "json") {
+        newValue = JSON.stringify(newValue);
+        currentValue = JSON.stringify(currentValue);
+      }
+      if (newValue === currentValue) {
+        return;
+      }
+      this.editor.commands.setContent(newValue, false);
     }
   },
   created() {
@@ -877,7 +1055,7 @@ const ne = re.exports, oe = {
   },
   methods: {
     createEditor() {
-      this.editor = new $({
+      this.editor = new Editor({
         autofocus: this.autoFocus,
         content: this.value,
         editable: this.editable,
@@ -888,7 +1066,8 @@ const ne = re.exports, oe = {
             class: this.inputClass
           }
         }
-      }), this.addEditorListeners();
+      });
+      this.addEditorListeners();
     },
     destroyEditor() {
       this.editor.destroy();
@@ -899,12 +1078,15 @@ const ne = re.exports, oe = {
      */
     addEditorListeners() {
       this.editor.on("update", () => {
-        const t = this.getOutput();
-        this.$emit("input", t), this.$emit("update:value", t);
-      }), this.editor.on("focus", ({ event: t }) => {
-        this.$emit("focus", t);
-      }), this.editor.on("blur", ({ event: t }) => {
-        this.$emit("blur", t);
+        const value = this.getOutput();
+        this.$emit("input", value);
+        this.$emit("update:value", value);
+      });
+      this.editor.on("focus", ({ event }) => {
+        this.$emit("focus", event);
+      });
+      this.editor.on("blur", ({ event }) => {
+        this.$emit("blur", event);
       });
     },
     getOutput() {
@@ -918,35 +1100,40 @@ const ne = re.exports, oe = {
           return this.editor.getText();
       }
     },
-    getExtension(t, e) {
-      var r;
-      return typeof e == "boolean" ? t : (r = t.configure) == null ? void 0 : r.call(t, e);
+    getExtension(extension, options) {
+      var _a;
+      if (typeof options === "boolean") {
+        return extension;
+      }
+      return (_a = extension.configure) == null ? void 0 : _a.call(extension, options);
     },
-    updateEditorAttributes(t) {
-      this.editor.setOptions({ editorProps: { attributes: t } });
+    updateEditorAttributes(attributes) {
+      this.editor.setOptions({ editorProps: { attributes } });
     },
     focusEditor() {
       this.editor.commands.focus();
     }
   }
 };
-var se = function() {
-  var e = this, r = e._self._c;
-  return r("editor-content", { staticClass: "dt-rich-text-editor", attrs: { editor: e.editor, "data-qa": "dt-rich-text-editor" } });
-}, ae = [], ue = /* @__PURE__ */ u(
-  ie,
-  se,
-  ae,
-  !1,
+var _sfc_render = function render6() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("editor-content", { staticClass: "dt-rich-text-editor", attrs: { "editor": _vm.editor, "data-qa": "dt-rich-text-editor" } });
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
   null,
   null,
   null,
   null
 );
-const Ze = ue.exports;
+const DtRichTextEditor = __component__.exports;
 export {
-  Ze as DtRichTextEditor,
-  Gt as RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,
-  Yt as RICH_TEXT_EDITOR_OUTPUT_FORMATS
+  DtRichTextEditor,
+  RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,
+  RICH_TEXT_EDITOR_OUTPUT_FORMATS
 };
 //# sourceMappingURL=rich-text-editor.js.map