@dialpad/dialtone 9.72.1 → 9.72.3

package/dist/vue2/types/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.d.ts

@@ -21,7 +21,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {}, {}, {}, {
     removeMediaItem(index: any): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "remove-media"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "remove-media"[], string, Readonly<import("vue").ExtractPropTypes<{
     mediaItem: {
         type: ObjectConstructor;
         required: true;

package/dist/vue2/types/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.d.ts

@@ -14,7 +14,7 @@ declare const _default: import("vue").DefineComponent<{
         '--stroke-dashoffset': number;
         '--stroke-dasharray': number;
     };
-}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
     progressbarAriaLabel: {
         type: StringConstructor;
         required: true;

package/dist/vue2/types/recipes/conversation_view/editor/editor.vue.d.ts

@@ -309,7 +309,7 @@ declare const _default: import("vue").DefineComponent<{
     onFocus(event: any): void;
     onBlur(event: any): void;
     onInput(event: any): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("input" | "focus" | "blur" | "quick-replies-click")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "focus" | "blur" | "quick-replies-click")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Value of the input. The object format should match TipTap's JSON
      * document structure: https://tiptap.dev/guide/output#option-1-json

package/dist/vue2/types/recipes/conversation_view/emoji_row/emoji_row.vue.d.ts

@@ -10,7 +10,7 @@ declare const _default: import("vue").DefineComponent<{
 }, {}, {}, {}, {
     emojiClicked(reaction: any): void;
     emojiHovered(reaction: any, state: any): void;
-}, never, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("emoji-clicked" | "emoji-hovered")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, never, import("vue").ComponentOptionsMixin, ("emoji-clicked" | "emoji-hovered")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Provide an array of reaction objects to be shown.
      */

package/dist/vue2/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts

@@ -106,7 +106,7 @@ declare const _default: import("vue").DefineComponent<{
         _getFocusableElements(el?: object, includeNegativeTabIndex?: bool): any[];
         focusTrappedTabPress(e: object, el: object): void;
     };
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("focus" | "keydown" | "hover")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, ("focus" | "keydown" | "hover")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.
      */

package/dist/vue2/types/recipes/conversation_view/feed_pill/feed_item_pill.vue.d.ts

@@ -63,7 +63,7 @@ declare const _default: import("vue").DefineComponent<{
     borderClass(): any;
 }, {
     onClick(): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Accepts a DtIcon name to be shown in the left
      */

package/dist/vue2/types/recipes/conversation_view/message_input/meeting_pill/MeetingPill.vue.d.ts

@@ -1,43 +1,43 @@
 declare const _default: import("vue").DefineComponent<{
-    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
-    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/pm/model").Node>;
-    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
-    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
-    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
-    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
+    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
+    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/pm/model").Node>;
+    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
+    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
+    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
+    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
         required: true;
     } & {
         default?: (() => () => number) | undefined;
     };
-    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
+    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
         required: true;
     } & {
         default?: (() => (attributes: Record<string, any>) => void) | undefined;
     };
-    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
+    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
         required: true;
     } & {
         default?: (() => () => void) | undefined;
     };
 }, {}, {}, {}, {
     close(e: any): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "meeting-pill-close"[], string, Readonly<import("vue").ExtractPropTypes<{
-    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
-    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/pm/model").Node>;
-    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
-    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
-    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
-    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "meeting-pill-close"[], string, Readonly<import("vue").ExtractPropTypes<{
+    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
+    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/pm/model").Node>;
+    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
+    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
+    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
+    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
         required: true;
     } & {
         default?: (() => () => number) | undefined;
     };
-    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
+    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
         required: true;
     } & {
         default?: (() => (attributes: Record<string, any>) => void) | undefined;
     };
-    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
+    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.16/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
         required: true;
     } & {
         default?: (() => () => void) | undefined;

package/dist/vue2/types/recipes/conversation_view/message_input/message_input.vue.d.ts

@@ -279,7 +279,7 @@ declare const _default: import("vue").DefineComponent<{
     onSend(): void;
     onCancel(): void;
     onInput(event: any): void;
-}, never, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("submit" | "cancel" | "selected-emoji" | "skin-tone" | "selected-command" | "update:value" | "meeting-pill-close" | "select-media" | "add-media" | "paste-media")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, never, import("vue").ComponentOptionsMixin, ("submit" | "cancel" | "selected-emoji" | "skin-tone" | "selected-command" | "update:value" | "meeting-pill-close" | "select-media" | "add-media" | "paste-media")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Value of the input. The object format should match TipTap's JSON
      * document structure: https://tiptap.dev/guide/output#option-1-json

package/dist/vue2/types/recipes/conversation_view/time_pill/time_pill.vue.d.ts

@@ -15,7 +15,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
         validator: (t: unknown) => boolean;
     };
-}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Date time display value
      */

package/dist/vue2/types/recipes/header/settings_menu_button/settings_menu_button.vue.d.ts

@@ -15,7 +15,7 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         required: true;
     };
-}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Determines whether the button should display the update state
      * default is false

package/dist/vue2/types/recipes/item_layout/contact_info/contact_info.vue.d.ts

@@ -91,7 +91,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {}, {}, {}, {
     avatarClick(): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "avatar-click"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "avatar-click"[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * String to use for the item's role.
      */

package/dist/vue2/types/recipes/leftbar/callbox/callbox.vue.d.ts

@@ -75,7 +75,7 @@ declare const _default: import("vue").DefineComponent<{
     borderClass(): any;
 }, {
     handleClick(e: any): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Text for the badge element
      */

package/dist/vue2/types/recipes/leftbar/contact_centers_row/contact_centers_row.vue.d.ts

@@ -52,7 +52,7 @@ declare const _default: import("vue").DefineComponent<{
     showUnreadCount(): boolean;
 }, {
     adjustLabelWidth(): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("click" | "click-menu")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "click-menu")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Will be read out by a screen reader upon focus of this row. If not defined "description" will be read.
      */

package/dist/vue2/types/recipes/leftbar/contact_row/contact_row.vue.d.ts

@@ -121,7 +121,7 @@ declare const _default: import("vue").DefineComponent<{
     presenceColorClass(): "d-fc-success" | "d-fc-critical" | "d-fc-warning" | undefined;
     contactDescription(): string;
     iconName(): "user" | null;
-}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("click" | "call")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "call")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Optional avatar image url.
      * If not provided it will use the initial of the name.

package/dist/vue2/types/recipes/leftbar/general_row/general_row.vue.d.ts

@@ -162,7 +162,7 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     validateProps(): void;
     adjustLabelWidth(): void;
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("click" | "call")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "call")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Determines the icon to show.
      * If type is contact center, the color prop must be provided and will determine the color of the icon

package/dist/vue2/types/recipes/leftbar/general_row/leftbar_general_row_icon.vue.d.ts

@@ -18,7 +18,7 @@ declare const _default: import("vue").DefineComponent<{
     getIconName(): string;
     contactCenterIconClasses(): any[];
     dialbotClasses(): string[];
-}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
     type: {
         type: StringConstructor;
         default: null;

package/dist/vue2/types/recipes/leftbar/group_row/group_row.vue.d.ts

@@ -51,7 +51,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {}, {}, {
     ariaLabel(): string;
-}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Screen reader will read out the number of users in the group using this text. Ex: "2 users"
      */

package/dist/vue2/types/recipes/leftbar/unread_pill/unread_pill.vue.d.ts

@@ -17,7 +17,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
         validator: (dir: unknown) => boolean;
     };
-}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The kind of unread pill which determines the styling
      * @values 'mentions', 'messages'

package/dist/vue2/types/recipes/notices/top_banner_info/top_banner_info.vue.d.ts

@@ -9,7 +9,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {}, {}, {
     bannerInfoClass(): any[];
-}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * color of the banner background
      */

package/dist/vue3/components/checkbox/checkbox.vue.cjs

@@ -115,7 +115,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             value: _ctx.value,
             disabled: _ctx.internalDisabled,
             class: ["d-checkbox", $options.inputValidationClass, _ctx.inputClass]
-          }, _ctx.$attrs, { ".indeterminate": _ctx.internalIndeterminate }, vue.toHandlers($options.inputListeners, true)), null, 16, _hoisted_2)
+          }, _ctx.$attrs, { ".indeterminate": _ctx.internalIndeterminate }, vue.toHandlers($options.inputListeners, true)), null, 48, _hoisted_2)
         ]),
         $options.hasLabelOrDescription ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
           $options.hasLabel ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({

package/dist/vue3/components/checkbox/checkbox.vue.js

@@ -114,7 +114,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             value: _ctx.value,
             disabled: _ctx.internalDisabled,
             class: ["d-checkbox", $options.inputValidationClass, _ctx.inputClass]
-          }, _ctx.$attrs, { ".indeterminate": _ctx.internalIndeterminate }, toHandlers($options.inputListeners, true)), null, 16, _hoisted_2)
+          }, _ctx.$attrs, { ".indeterminate": _ctx.internalIndeterminate }, toHandlers($options.inputListeners, true)), null, 48, _hoisted_2)
         ]),
         $options.hasLabelOrDescription ? (openBlock(), createElementBlock("div", _hoisted_3, [
           $options.hasLabel ? (openBlock(), createElementBlock("div", mergeProps({

package/dist/vue3/components/rich_text_editor/extensions/emoji/emoji.cjs

@@ -1,24 +1,19 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const core = require("@tiptap/core");
+const state = require("@tiptap/pm/state");
 const vue3 = require("@tiptap/vue-3");
+const Suggestion = require("@tiptap/suggestion");
+const regexCombinedEmojis = require("regex-combined-emojis");
 const EmojiComponent = require("./EmojiComponent.vue.cjs");
 const common_emoji = require("../../../../common/emoji.cjs");
-const state = require("@tiptap/pm/state");
-const Suggestion = require("@tiptap/suggestion");
 const suggestion = require("./suggestion.cjs");
-const regexCombinedEmojis = require("regex-combined-emojis");
-const EmojiPluginKey = new state.PluginKey("emoji");
-const inputShortCodeRegex = new RegExp("(^| |(?<=:))(:\\w+:)$");
+const inputShortCodeRegex = /(:\w+:)$/;
 const inputUnicodeRegex = new RegExp(regexCombinedEmojis.emojiPattern + "$");
 const inputRuleMatch = (match) => {
   if (match && common_emoji.codeToEmojiData(match[0])) {
     const text = match[2] || match[0];
-    return {
-      index: match.index,
-      text,
-      match
-    };
+    return { text };
   }
 };
 const shortCodePasteMatch = (text) => {
@@ -30,19 +25,16 @@ const shortCodePasteMatch = (text) => {
   }));
 };
 const Emoji = core.Node.create({
+  name: "emoji",
   addOptions() {
     return {
-      HTMLAttributes: {},
-      suggestion: {
-        char: ":",
-        pluginKey: EmojiPluginKey
-      }
+      HTMLAttributes: {}
     };
   },
-  name: "emoji",
   group: "inline",
   inline: true,
-  selectable: true,
+  selectable: false,
+  atom: true,
   addNodeView() {
     return vue3.VueNodeViewRenderer(EmojiComponent);
   },
@@ -69,32 +61,17 @@ const Emoji = core.Node.create({
   },
   addInputRules() {
     return [
-      // shortcode input
-      core.nodeInputRule({
+      new core.InputRule({
         find: (text) => {
-          const match = text.match(inputShortCodeRegex);
+          const match = text.match(inputShortCodeRegex) || text.match(inputUnicodeRegex);
           if (!match) return;
           return inputRuleMatch(match);
         },
-        type: this.type,
-        getAttributes(attrs) {
-          return {
-            code: attrs[0]
-          };
-        }
-      }),
-      core.nodeInputRule({
-        find: (text) => {
-          const match = text.match(inputUnicodeRegex);
-          if (!match) return;
-          return inputRuleMatch(match);
-        },
-        type: this.type,
-        getAttributes(attrs) {
-          const emoji = common_emoji.codeToEmojiData(attrs[0]).shortname;
-          return {
-            code: emoji
-          };
+        handler: ({ state: state2, range, match, commands, chain, can }) => {
+          const { tr } = state2;
+          const start = range.from;
+          const end = range.to;
+          tr.replaceWith(start, end, this.type.create({ code: match[0] }));
         }
       })
     ];
@@ -124,13 +101,34 @@ const Emoji = core.Node.create({
   addProseMirrorPlugins() {
     return [
       Suggestion({
+        char: ":",
+        pluginKey: new state.PluginKey("emoji"),
         editor: this.editor,
         ...this.options.suggestion,
         ...suggestion
       })
     ];
+  },
+  addKeyboardShortcuts() {
+    return {
+      Backspace: () => this.editor.commands.command(({ tr, state: state2 }) => {
+        let isEmoji = false;
+        const { selection } = state2;
+        const { empty, anchor } = selection;
+        if (!empty) {
+          return false;
+        }
+        state2.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
+          if (node.type.name === this.name) {
+            isEmoji = true;
+            tr.insertText("", pos, pos + node.nodeSize);
+            return false;
+          }
+        });
+        return isEmoji;
+      })
+    };
   }
 });
 exports.Emoji = Emoji;
-exports.EmojiPluginKey = EmojiPluginKey;
 //# sourceMappingURL=emoji.cjs.map

package/dist/vue3/components/rich_text_editor/extensions/emoji/emoji.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"emoji.cjs","sources":["../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"sourcesContent":["import { mergeAttributes, Node, nodeInputRule, nodePasteRule } from '@tiptap/core';\nimport { VueNodeViewRenderer } from '@tiptap/vue-3';\nimport EmojiComponent from './EmojiComponent.vue';\nimport { codeToEmojiData, emojiShortCodeRegex, emojiRegex, stringToUnicode } from '@/common/emoji';\nimport { PluginKey } from '@tiptap/pm/state';\n\nimport Suggestion from '@tiptap/suggestion';\nimport suggestionOptions from './suggestion';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nexport const EmojiPluginKey = new PluginKey('emoji');\n\nconst inputShortCodeRegex = /(^| |(?<=:))(:\\w+:)$/;\nconst inputUnicodeRegex = new RegExp(emojiPattern + '$');\n\nconst inputRuleMatch = (match) => {\n  if (match && codeToEmojiData(match[0])) {\n    const text = match[2] || match[0];\n    // needs to be a dict returned\n    // ref type InputRuleMatch:\n    // https://github.com/ueberdosis/tiptap/blob/main/packages/core/src/InputRule.ts#L16\n    return {\n      index: match.index,\n      text,\n      match,\n    };\n  }\n};\n\nconst shortCodePasteMatch = (text) => {\n  const matches = [...text.matchAll(emojiShortCodeRegex)];\n\n  return matches\n    .filter(match => codeToEmojiData(match[0]))\n    .map(match => ({\n      index: match.index,\n      text: match[0],\n      match,\n    }));\n};\n\nexport const Emoji = Node.create({\n  addOptions () {\n    return {\n      HTMLAttributes: {},\n      suggestion: {\n        char: ':',\n        pluginKey: EmojiPluginKey,\n      },\n    };\n  },\n  name: 'emoji',\n  group: 'inline',\n  inline: true,\n  selectable: true,\n\n  addNodeView () {\n    return VueNodeViewRenderer(EmojiComponent);\n  },\n\n  addAttributes () {\n    return {\n      code: {\n        default: null,\n      },\n    };\n  },\n\n  parseHTML () {\n    return [\n      {\n        tag: 'emoji-component',\n      },\n    ];\n  },\n\n  renderText ({ node }) {\n    // output emoji in text as unicode character rather than shortname for backwards compatibility with\n    // our backend.\n    const unicodeEmoji = stringToUnicode(codeToEmojiData(node.attrs.code).unicode_output);\n    return unicodeEmoji;\n  },\n\n  renderHTML ({ HTMLAttributes }) {\n    return ['emoji-component', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];\n  },\n\n  addInputRules () {\n    return [\n      // shortcode input\n      nodeInputRule({\n        find: (text) => {\n          const match = text.match(inputShortCodeRegex);\n          if (!match) return;\n          return inputRuleMatch(match);\n        },\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n\n      nodeInputRule({\n        find: (text) => {\n          const match = text.match(inputUnicodeRegex);\n          if (!match) return;\n          return inputRuleMatch(match);\n        },\n        type: this.type,\n        getAttributes (attrs) {\n          const emoji = codeToEmojiData(attrs[0]).shortname;\n          return {\n            code: emoji,\n          };\n        },\n      }),\n    ];\n  },\n\n  addPasteRules () {\n    return [\n      nodePasteRule({\n        find: shortCodePasteMatch,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n      nodePasteRule({\n        find: emojiRegex,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n    ];\n  },\n\n  addProseMirrorPlugins () {\n    return [\n      Suggestion({\n        editor: this.editor,\n        ...this.options.suggestion,\n        ...suggestionOptions,\n      }),\n    ];\n  },\n});\n"],"names":["PluginKey","emojiPattern","codeToEmojiData","emojiShortCodeRegex","Node","VueNodeViewRenderer","stringToUnicode","mergeAttributes","nodeInputRule","nodePasteRule","emojiRegex","suggestionOptions"],"mappings":"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"}
+{"version":3,"file":"emoji.cjs","sources":["../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"sourcesContent":["import { InputRule, mergeAttributes, Node, nodePasteRule } from '@tiptap/core';\nimport { PluginKey } from '@tiptap/pm/state';\nimport { VueNodeViewRenderer } from '@tiptap/vue-3';\nimport Suggestion from '@tiptap/suggestion';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nimport EmojiComponent from './EmojiComponent.vue';\nimport { codeToEmojiData, emojiShortCodeRegex, emojiRegex, stringToUnicode } from '@/common/emoji';\nimport suggestionOptions from './suggestion';\n\nconst inputShortCodeRegex = /(:\\w+:)$/;\nconst inputUnicodeRegex = new RegExp(emojiPattern + '$');\n\nconst inputRuleMatch = (match) => {\n  if (match && codeToEmojiData(match[0])) {\n    const text = match[2] || match[0];\n    // needs to be a dict returned\n    // ref type InputRuleMatch:\n    // https://github.com/ueberdosis/tiptap/blob/main/packages/core/src/InputRule.ts#L16\n    return { text };\n  }\n};\n\nconst shortCodePasteMatch = (text) => {\n  const matches = [...text.matchAll(emojiShortCodeRegex)];\n\n  return matches\n    .filter(match => codeToEmojiData(match[0]))\n    .map(match => ({\n      index: match.index,\n      text: match[0],\n      match,\n    }));\n};\n\nexport const Emoji = Node.create({\n  name: 'emoji',\n  addOptions () {\n    return {\n      HTMLAttributes: {},\n    };\n  },\n  group: 'inline',\n  inline: true,\n  selectable: false,\n  atom: true,\n\n  addNodeView () {\n    return VueNodeViewRenderer(EmojiComponent);\n  },\n\n  addAttributes () {\n    return {\n      code: {\n        default: null,\n      },\n    };\n  },\n\n  parseHTML () {\n    return [\n      {\n        tag: 'emoji-component',\n      },\n    ];\n  },\n\n  renderText ({ node }) {\n    // output emoji in text as unicode character rather than shortname for backwards compatibility with\n    // our backend.\n    const unicodeEmoji = stringToUnicode(codeToEmojiData(node.attrs.code).unicode_output);\n    return unicodeEmoji;\n  },\n\n  renderHTML ({ HTMLAttributes }) {\n    return ['emoji-component', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];\n  },\n\n  addInputRules () {\n    return [\n      new InputRule({\n        find: (text) => {\n          const match = text.match(inputShortCodeRegex) || text.match(inputUnicodeRegex);\n          if (!match) return;\n\n          return inputRuleMatch(match);\n        },\n        handler: ({ state, range, match, commands, chain, can }) => {\n          const { tr } = state;\n          const start = range.from;\n          const end = range.to;\n          tr.replaceWith(start, end, this.type.create({ code: match[0] }));\n        },\n      }),\n    ];\n  },\n\n  addPasteRules () {\n    return [\n      nodePasteRule({\n        find: shortCodePasteMatch,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n      nodePasteRule({\n        find: emojiRegex,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n    ];\n  },\n\n  addProseMirrorPlugins () {\n    return [\n      Suggestion({\n        char: ':',\n        pluginKey: new PluginKey('emoji'),\n        editor: this.editor,\n        ...this.options.suggestion,\n        ...suggestionOptions,\n      }),\n    ];\n  },\n\n  addKeyboardShortcuts () {\n    return {\n      Backspace: () => this.editor.commands.command(({ tr, state }) => {\n        let isEmoji = false;\n        const { selection } = state;\n        const { empty, anchor } = selection;\n        if (!empty) { return false; }\n        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n          if (node.type.name === this.name) {\n            isEmoji = true;\n            tr.insertText('', pos, pos + node.nodeSize);\n            return false;\n          }\n        });\n        return isEmoji;\n      }),\n    };\n  },\n});\n"],"names":["emojiPattern","codeToEmojiData","emojiShortCodeRegex","Node","VueNodeViewRenderer","stringToUnicode","mergeAttributes","InputRule","state","nodePasteRule","emojiRegex","PluginKey","suggestionOptions"],"mappings":"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"}

package/dist/vue3/components/rich_text_editor/extensions/emoji/emoji.js

@@ -1,22 +1,17 @@
-import { Node, mergeAttributes, nodeInputRule, nodePasteRule } from "@tiptap/core";
+import { Node, mergeAttributes, InputRule, nodePasteRule } from "@tiptap/core";
+import { PluginKey } from "@tiptap/pm/state";
 import { VueNodeViewRenderer } from "@tiptap/vue-3";
+import Suggestion from "@tiptap/suggestion";
+import { emojiPattern } from "regex-combined-emojis";
 import EmojiComponent from "./EmojiComponent.vue.js";
 import { stringToUnicode, codeToEmojiData, emojiRegex, emojiShortCodeRegex } from "../../../../common/emoji.js";
-import { PluginKey } from "@tiptap/pm/state";
-import Suggestion from "@tiptap/suggestion";
 import suggestionOptions from "./suggestion.js";
-import { emojiPattern } from "regex-combined-emojis";
-const EmojiPluginKey = new PluginKey("emoji");
-const inputShortCodeRegex = new RegExp("(^| |(?<=:))(:\\w+:)$");
+const inputShortCodeRegex = /(:\w+:)$/;
 const inputUnicodeRegex = new RegExp(emojiPattern + "$");
 const inputRuleMatch = (match) => {
   if (match && codeToEmojiData(match[0])) {
     const text = match[2] || match[0];
-    return {
-      index: match.index,
-      text,
-      match
-    };
+    return { text };
   }
 };
 const shortCodePasteMatch = (text) => {
@@ -28,19 +23,16 @@ const shortCodePasteMatch = (text) => {
   }));
 };
 const Emoji = Node.create({
+  name: "emoji",
   addOptions() {
     return {
-      HTMLAttributes: {},
-      suggestion: {
-        char: ":",
-        pluginKey: EmojiPluginKey
-      }
+      HTMLAttributes: {}
     };
   },
-  name: "emoji",
   group: "inline",
   inline: true,
-  selectable: true,
+  selectable: false,
+  atom: true,
   addNodeView() {
     return VueNodeViewRenderer(EmojiComponent);
   },
@@ -67,32 +59,17 @@ const Emoji = Node.create({
   },
   addInputRules() {
     return [
-      // shortcode input
-      nodeInputRule({
+      new InputRule({
         find: (text) => {
-          const match = text.match(inputShortCodeRegex);
+          const match = text.match(inputShortCodeRegex) || text.match(inputUnicodeRegex);
           if (!match) return;
           return inputRuleMatch(match);
         },
-        type: this.type,
-        getAttributes(attrs) {
-          return {
-            code: attrs[0]
-          };
-        }
-      }),
-      nodeInputRule({
-        find: (text) => {
-          const match = text.match(inputUnicodeRegex);
-          if (!match) return;
-          return inputRuleMatch(match);
-        },
-        type: this.type,
-        getAttributes(attrs) {
-          const emoji = codeToEmojiData(attrs[0]).shortname;
-          return {
-            code: emoji
-          };
+        handler: ({ state, range, match, commands, chain, can }) => {
+          const { tr } = state;
+          const start = range.from;
+          const end = range.to;
+          tr.replaceWith(start, end, this.type.create({ code: match[0] }));
         }
       })
     ];
@@ -122,15 +99,36 @@ const Emoji = Node.create({
   addProseMirrorPlugins() {
     return [
       Suggestion({
+        char: ":",
+        pluginKey: new PluginKey("emoji"),
         editor: this.editor,
         ...this.options.suggestion,
         ...suggestionOptions
       })
     ];
+  },
+  addKeyboardShortcuts() {
+    return {
+      Backspace: () => this.editor.commands.command(({ tr, state }) => {
+        let isEmoji = false;
+        const { selection } = state;
+        const { empty, anchor } = selection;
+        if (!empty) {
+          return false;
+        }
+        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
+          if (node.type.name === this.name) {
+            isEmoji = true;
+            tr.insertText("", pos, pos + node.nodeSize);
+            return false;
+          }
+        });
+        return isEmoji;
+      })
+    };
   }
 });
 export {
-  Emoji,
-  EmojiPluginKey
+  Emoji
 };
 //# sourceMappingURL=emoji.js.map

package/dist/vue3/components/rich_text_editor/extensions/emoji/emoji.js.map

@@ -1 +1 @@
-{"version":3,"file":"emoji.js","sources":["../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"sourcesContent":["import { mergeAttributes, Node, nodeInputRule, nodePasteRule } from '@tiptap/core';\nimport { VueNodeViewRenderer } from '@tiptap/vue-3';\nimport EmojiComponent from './EmojiComponent.vue';\nimport { codeToEmojiData, emojiShortCodeRegex, emojiRegex, stringToUnicode } from '@/common/emoji';\nimport { PluginKey } from '@tiptap/pm/state';\n\nimport Suggestion from '@tiptap/suggestion';\nimport suggestionOptions from './suggestion';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nexport const EmojiPluginKey = new PluginKey('emoji');\n\nconst inputShortCodeRegex = /(^| |(?<=:))(:\\w+:)$/;\nconst inputUnicodeRegex = new RegExp(emojiPattern + '$');\n\nconst inputRuleMatch = (match) => {\n  if (match && codeToEmojiData(match[0])) {\n    const text = match[2] || match[0];\n    // needs to be a dict returned\n    // ref type InputRuleMatch:\n    // https://github.com/ueberdosis/tiptap/blob/main/packages/core/src/InputRule.ts#L16\n    return {\n      index: match.index,\n      text,\n      match,\n    };\n  }\n};\n\nconst shortCodePasteMatch = (text) => {\n  const matches = [...text.matchAll(emojiShortCodeRegex)];\n\n  return matches\n    .filter(match => codeToEmojiData(match[0]))\n    .map(match => ({\n      index: match.index,\n      text: match[0],\n      match,\n    }));\n};\n\nexport const Emoji = Node.create({\n  addOptions () {\n    return {\n      HTMLAttributes: {},\n      suggestion: {\n        char: ':',\n        pluginKey: EmojiPluginKey,\n      },\n    };\n  },\n  name: 'emoji',\n  group: 'inline',\n  inline: true,\n  selectable: true,\n\n  addNodeView () {\n    return VueNodeViewRenderer(EmojiComponent);\n  },\n\n  addAttributes () {\n    return {\n      code: {\n        default: null,\n      },\n    };\n  },\n\n  parseHTML () {\n    return [\n      {\n        tag: 'emoji-component',\n      },\n    ];\n  },\n\n  renderText ({ node }) {\n    // output emoji in text as unicode character rather than shortname for backwards compatibility with\n    // our backend.\n    const unicodeEmoji = stringToUnicode(codeToEmojiData(node.attrs.code).unicode_output);\n    return unicodeEmoji;\n  },\n\n  renderHTML ({ HTMLAttributes }) {\n    return ['emoji-component', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];\n  },\n\n  addInputRules () {\n    return [\n      // shortcode input\n      nodeInputRule({\n        find: (text) => {\n          const match = text.match(inputShortCodeRegex);\n          if (!match) return;\n          return inputRuleMatch(match);\n        },\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n\n      nodeInputRule({\n        find: (text) => {\n          const match = text.match(inputUnicodeRegex);\n          if (!match) return;\n          return inputRuleMatch(match);\n        },\n        type: this.type,\n        getAttributes (attrs) {\n          const emoji = codeToEmojiData(attrs[0]).shortname;\n          return {\n            code: emoji,\n          };\n        },\n      }),\n    ];\n  },\n\n  addPasteRules () {\n    return [\n      nodePasteRule({\n        find: shortCodePasteMatch,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n      nodePasteRule({\n        find: emojiRegex,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n    ];\n  },\n\n  addProseMirrorPlugins () {\n    return [\n      Suggestion({\n        editor: this.editor,\n        ...this.options.suggestion,\n        ...suggestionOptions,\n      }),\n    ];\n  },\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"emoji.js","sources":["../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"sourcesContent":["import { InputRule, mergeAttributes, Node, nodePasteRule } from '@tiptap/core';\nimport { PluginKey } from '@tiptap/pm/state';\nimport { VueNodeViewRenderer } from '@tiptap/vue-3';\nimport Suggestion from '@tiptap/suggestion';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nimport EmojiComponent from './EmojiComponent.vue';\nimport { codeToEmojiData, emojiShortCodeRegex, emojiRegex, stringToUnicode } from '@/common/emoji';\nimport suggestionOptions from './suggestion';\n\nconst inputShortCodeRegex = /(:\\w+:)$/;\nconst inputUnicodeRegex = new RegExp(emojiPattern + '$');\n\nconst inputRuleMatch = (match) => {\n  if (match && codeToEmojiData(match[0])) {\n    const text = match[2] || match[0];\n    // needs to be a dict returned\n    // ref type InputRuleMatch:\n    // https://github.com/ueberdosis/tiptap/blob/main/packages/core/src/InputRule.ts#L16\n    return { text };\n  }\n};\n\nconst shortCodePasteMatch = (text) => {\n  const matches = [...text.matchAll(emojiShortCodeRegex)];\n\n  return matches\n    .filter(match => codeToEmojiData(match[0]))\n    .map(match => ({\n      index: match.index,\n      text: match[0],\n      match,\n    }));\n};\n\nexport const Emoji = Node.create({\n  name: 'emoji',\n  addOptions () {\n    return {\n      HTMLAttributes: {},\n    };\n  },\n  group: 'inline',\n  inline: true,\n  selectable: false,\n  atom: true,\n\n  addNodeView () {\n    return VueNodeViewRenderer(EmojiComponent);\n  },\n\n  addAttributes () {\n    return {\n      code: {\n        default: null,\n      },\n    };\n  },\n\n  parseHTML () {\n    return [\n      {\n        tag: 'emoji-component',\n      },\n    ];\n  },\n\n  renderText ({ node }) {\n    // output emoji in text as unicode character rather than shortname for backwards compatibility with\n    // our backend.\n    const unicodeEmoji = stringToUnicode(codeToEmojiData(node.attrs.code).unicode_output);\n    return unicodeEmoji;\n  },\n\n  renderHTML ({ HTMLAttributes }) {\n    return ['emoji-component', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)];\n  },\n\n  addInputRules () {\n    return [\n      new InputRule({\n        find: (text) => {\n          const match = text.match(inputShortCodeRegex) || text.match(inputUnicodeRegex);\n          if (!match) return;\n\n          return inputRuleMatch(match);\n        },\n        handler: ({ state, range, match, commands, chain, can }) => {\n          const { tr } = state;\n          const start = range.from;\n          const end = range.to;\n          tr.replaceWith(start, end, this.type.create({ code: match[0] }));\n        },\n      }),\n    ];\n  },\n\n  addPasteRules () {\n    return [\n      nodePasteRule({\n        find: shortCodePasteMatch,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n      nodePasteRule({\n        find: emojiRegex,\n        type: this.type,\n        getAttributes (attrs) {\n          return {\n            code: attrs[0],\n          };\n        },\n      }),\n    ];\n  },\n\n  addProseMirrorPlugins () {\n    return [\n      Suggestion({\n        char: ':',\n        pluginKey: new PluginKey('emoji'),\n        editor: this.editor,\n        ...this.options.suggestion,\n        ...suggestionOptions,\n      }),\n    ];\n  },\n\n  addKeyboardShortcuts () {\n    return {\n      Backspace: () => this.editor.commands.command(({ tr, state }) => {\n        let isEmoji = false;\n        const { selection } = state;\n        const { empty, anchor } = selection;\n        if (!empty) { return false; }\n        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n          if (node.type.name === this.name) {\n            isEmoji = true;\n            tr.insertText('', pos, pos + node.nodeSize);\n            return false;\n          }\n        });\n        return isEmoji;\n      }),\n    };\n  },\n});\n"],"names":[],"mappings":"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"}

package/dist/vue3/components/rich_text_editor/extensions/emoji/index.cjs

@@ -1,4 +1,6 @@
 "use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const emoji = require("./emoji.cjs");
-module.exports = emoji.Emoji;
+exports.Emoji = emoji.Emoji;
+exports.default = emoji.Emoji;
 //# sourceMappingURL=index.cjs.map