@dialpad/dialtone-vue 3.150.0 → 3.150.1

package/dist/lib/editor.cjs

@@ -1,714 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const vue = require("vue");
-const _pluginVue_exportHelper = require("../chunks/_plugin-vue_export-helper-fhnQq0tA.js");
-const lib_richTextEditor = require("./rich-text-editor.cjs");
-const lib_button = require("./button.cjs");
-const lib_icon = require("./icon.cjs");
-const lib_popover = require("./popover.cjs");
-const lib_stack = require("./stack.cjs");
-const lib_input = require("./input.cjs");
-const lib_tooltip = require("./tooltip.cjs");
-require("@tiptap/vue-3");
-require("@tiptap/extension-blockquote");
-require("@tiptap/extension-code-block");
-require("@tiptap/extension-document");
-require("@tiptap/extension-hard-break");
-require("@tiptap/extension-paragraph");
-require("@tiptap/extension-placeholder");
-require("@tiptap/extension-bold");
-require("@tiptap/extension-bullet-list");
-require("@tiptap/extension-italic");
-require("@tiptap/extension-link");
-require("@tiptap/extension-list-item");
-require("@tiptap/extension-ordered-list");
-require("@tiptap/extension-strike");
-require("@tiptap/extension-underline");
-require("@tiptap/extension-text");
-require("@tiptap/extension-text-align");
-require("@tiptap/extension-history");
-require("@tiptap/core");
-require("./emoji.cjs");
-require("../chunks/index-lu2o2f4r.js");
-require("@dialpad/dialtone-emojis");
-require("./skeleton.cjs");
-require("../chunks/icon_constants-da57m7BZ.js");
-require("@dialpad/dialtone-icons/icons.js");
-require("@tiptap/pm/state");
-require("@tiptap/suggestion");
-require("./list-item.cjs");
-require("../chunks/list_item_constants-EiqkqZvP.js");
-require("../common/utils.cjs");
-require("../common/constants.cjs");
-require("./item-layout.cjs");
-require("@dialpad/dialtone-icons/vue3");
-require("tippy.js");
-require("@tiptap/extension-mention");
-require("./link.cjs");
-require("../chunks/link_constants-x8NwdqmA.js");
-require("./avatar.cjs");
-require("./presence.cjs");
-require("@dialpad/dialtone-icons/vue3/hash");
-require("@dialpad/dialtone-icons/vue3/lock");
-require("../chunks/stack_constants-SMzMWnAQ.js");
-require("../chunks/popover_constants-XnGWXaxX.js");
-require("../chunks/modal-VgxXAQFP.js");
-require("../chunks/sr_only_close_button-xGrHFjwA.js");
-require("./lazy-show.cjs");
-require("../chunks/input-ttnte8zB.js");
-require("../common/validators.cjs");
-require("./validation-messages.cjs");
-const EDITOR_SUPPORTED_LINK_PROTOCOLS = [
-  /^https?:\/\//,
-  /^http?:\/\//,
-  /^ftp?:\/\//,
-  /^ftps?:\/\//,
-  /^ftps?:\/\//,
-  /mailto:([^?]*)/
-];
-const EDITOR_DEFAULT_LINK_PREFIX = "https://";
-const _sfc_main = {
-  name: "DtRecipeEditor",
-  components: {
-    DtRichTextEditor: lib_richTextEditor.DtRichTextEditor,
-    DtButton: lib_button.DtButton,
-    DtIcon: lib_icon.DtIcon,
-    DtPopover: lib_popover.DtPopover,
-    DtStack: lib_stack.DtStack,
-    DtInput: lib_input.DtInput,
-    DtTooltip: lib_tooltip.DtTooltip
-  },
-  mixins: [],
-  inheritAttrs: false,
-  props: {
-    /**
-     * Value of the input. The object format should match TipTap's JSON
-     * document structure: https://tiptap.dev/guide/output#option-1-json
-     */
-    value: {
-      type: [Object, String],
-      default: ""
-    },
-    /**
-     * Whether the input is editable
-     */
-    editable: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Descriptive label for the input element
-     */
-    inputAriaLabel: {
-      type: String,
-      required: true,
-      default: ""
-    },
-    /**
-     * Additional class name for the input element. Only accepts a String value
-     * because this is passed to the editor via options. For multiple classes,
-     * join them into one string, e.g. "d-p8 d-hmx96"
-     */
-    inputClass: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Whether the input should receive focus after the component has been
-     * mounted. Either one of `start`, `end`, `all` or a Boolean or a Number.
-     * - `start`  Sets the focus to the beginning of the input
-     * - `end`    Sets the focus to the end of the input
-     * - `all`    Selects the whole contents of the input
-     * - `Number` Sets the focus to a specific position in the input
-     * - `true`   Defaults to `start`
-     * - `false`  Disables autofocus
-     * @values true, false, start, end, all, number
-     */
-    autoFocus: {
-      type: [Boolean, String, Number],
-      default: false,
-      validator(autoFocus) {
-        if (typeof autoFocus === "string") {
-          return lib_richTextEditor.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(autoFocus);
-        }
-        return true;
-      }
-    },
-    /**
-     * Placeholder text
-     */
-    placeholder: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Content area needs to dynamically adjust height based on the conversation area height.
-     * can be vh|px|rem|em|%
-     */
-    maxHeight: {
-      type: String,
-      default: "unset"
-    },
-    /**
-     * Confirm set link button defaults.
-     */
-    confirmSetLinkButton: {
-      type: Object,
-      default: () => ({ label: "Confirm", ariaLabel: "Confirm set link" })
-    },
-    /**
-     * Remove link button defaults.
-     */
-    removeLinkButton: {
-      type: Object,
-      default: () => ({ label: "Remove", ariaLabel: "Remove link" })
-    },
-    /**
-     * Cancel set link button defaults.
-     */
-    cancelSetLinkButton: {
-      type: Object,
-      default: () => ({ label: "Cancel", ariaLabel: "Cancel set link" })
-    },
-    /**
-     * Placeholder text for the set link input field
-     */
-    setLinkPlaceholder: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Show button to render text as bold
-     */
-    showBoldButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to render text in italics
-     */
-    showItalicsButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to underline text
-     */
-    showUnderlineButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to strike text
-     */
-    showStrikeButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to render list items
-     */
-    showListItemsButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to render ordered list items
-     */
-    showOrderedListButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to align text to the left
-     */
-    showAlignLeftButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to align text to the center
-     */
-    showAlignCenterButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to align text to the right
-     */
-    showAlignRightButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to justify text
-     */
-    showAlignJustifyButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to add quote format to text
-     */
-    showQuoteButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to add code block
-     */
-    showCodeBlockButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show button to handle quick replies
-     */
-    showQuickRepliesButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Show add link default config.
-     */
-    showAddLink: {
-      type: Object,
-      default: () => ({
-        showAddLinkButton: true,
-        setLinkTitle: "Add a link",
-        setLinkInputAriaLabel: "Input field to add link"
-      })
-    }
-  },
-  emits: [
-    /**
-     * Native focus event
-     * @event input
-     * @type {String|JSON}
-     */
-    "focus",
-    /**
-     * Native blur event
-     * @event input
-     * @type {String|JSON}
-     */
-    "blur",
-    /**
-     * Native input event
-     * @event input
-     * @type {String|JSON}
-     */
-    "input",
-    /**
-     * Quick replies button
-     * pressed event
-     * @event quick-replies-click
-    */
-    "quick-replies-click"
-  ],
-  data() {
-    return {
-      internalInputValue: this.value,
-      // internal input content
-      hasFocus: false,
-      linkOptions: {
-        class: "d-link d-c-text d-d-inline-block"
-      },
-      showLinkInput: false,
-      linkInput: ""
-    };
-  },
-  computed: {
-    inputLength() {
-      return this.internalInputValue.length;
-    },
-    htmlOutputFormat() {
-      return lib_richTextEditor.RICH_TEXT_EDITOR_OUTPUT_FORMATS[2];
-    },
-    showingTextFormatButtons() {
-      return this.showBoldButton || this.showItalicsButton || this.showStrikeButton || this.showUnderlineButton;
-    },
-    showingAlignmentButtons() {
-      return this.showAlignLeftButton || this.showAlignCenterButton || this.showAlignRightButton || this.showAlignJustifyButton;
-    },
-    showingListButtons() {
-      return this.showListItemsButton || this.showOrderedListButton;
-    },
-    buttonGroups() {
-      const individualButtonStacks = this.individualButtons.map((buttonData) => ({
-        key: buttonData.selector,
-        buttonGroup: [buttonData]
-      }));
-      return [
-        { key: "new", buttonGroup: this.newButtons },
-        { key: "format", buttonGroup: this.textFormatButtons },
-        { key: "alignment", buttonGroup: this.alignmentButtons },
-        { key: "list", buttonGroup: this.listButtons },
-        ...individualButtonStacks
-      ].filter((buttonGroupData) => buttonGroupData.buttonGroup.length > 0);
-    },
-    newButtons() {
-      return [
-        { showBtn: this.showQuickRepliesButton, label: "Quick reply", selector: "quickReplies", iconName: "lightning-bolt", dataQA: "dt-editor-quick-replies-btn", tooltipMessage: "Quick Reply", onClick: this.onQuickRepliesClick }
-      ].filter((button) => button.showBtn);
-    },
-    textFormatButtons() {
-      return [
-        { showBtn: this.showBoldButton, selector: "bold", iconName: "bold", dataQA: "dt-editor-bold-btn", tooltipMessage: "Bold", onClick: this.onBoldTextToggle },
-        { showBtn: this.showItalicsButton, selector: "italic", iconName: "italic", dataQA: "dt-editor-italics-btn", tooltipMessage: "Italics", onClick: this.onItalicTextToggle },
-        { showBtn: this.showUnderlineButton, selector: "underline", iconName: "underline", dataQA: "dt-editor-underline-btn", tooltipMessage: "Underline", onClick: this.onUnderlineTextToggle },
-        { showBtn: this.showStrikeButton, selector: "strike", iconName: "strikethrough", dataQA: "dt-editor-strike-btn", tooltipMessage: "Strike", onClick: this.onStrikethroughTextToggle }
-      ].filter((button) => button.showBtn);
-    },
-    alignmentButtons() {
-      return [
-        { showBtn: this.showAlignLeftButton, selector: { textAlign: "left" }, iconName: "align-left", dataQA: "dt-editor-align-left-btn", tooltipMessage: "Align Left", onClick: () => this.onTextAlign("left") },
-        { showBtn: this.showAlignCenterButton, selector: { textAlign: "center" }, iconName: "align-center", dataQA: "dt-editor-align-center-btn", tooltipMessage: "Align Center", onClick: () => this.onTextAlign("center") },
-        { showBtn: this.showAlignRightButton, selector: { textAlign: "right" }, iconName: "align-right", dataQA: "dt-editor-align-right-btn", tooltipMessage: "Align Right", onClick: () => this.onTextAlign("right") },
-        { showBtn: this.showAlignJustifyButton, selector: { textAlign: "justify" }, iconName: "align-justify", dataQA: "dt-editor-align-justify-btn", tooltipMessage: "Align Justify", onClick: () => this.onTextAlign("justify") }
-      ].filter((button) => button.showBtn);
-    },
-    listButtons() {
-      return [
-        { showBtn: this.showListItemsButton, selector: "bulletList", iconName: "list-bullet", dataQA: "dt-editor-list-items-btn", tooltipMessage: "Bullet List", onClick: this.onBulletListToggle },
-        { showBtn: this.showOrderedListButton, selector: "orderedList", iconName: "list-ordered", dataQA: "dt-editor-ordered-list-items-btn", tooltipMessage: "Ordered List", onClick: this.onOrderedListToggle }
-      ].filter((button) => button.showBtn);
-    },
-    individualButtons() {
-      return [
-        { showBtn: this.showQuoteButton, selector: "blockquote", iconName: "quote", dataQA: "dt-editor-blockquote-btn", tooltipMessage: "Quote", onClick: this.onBlockquoteToggle },
-        { showBtn: this.showCodeBlockButton, selector: "codeBlock", iconName: "code-block", dataQA: "dt-editor-code-block-btn", tooltipMessage: "Code", onClick: this.onCodeBlockToggle }
-      ].filter((button) => button.showBtn);
-    },
-    linkButton() {
-      return { showBtn: this.showAddLink.showAddLinkButton, selector: "link", iconName: "link-2", dataQA: "dt-editor-add-link-btn", tooltipMessage: "Link", onClick: this.openLinkInput };
-    }
-  },
-  watch: {
-    value(newValue) {
-      this.internalInputValue = newValue;
-    }
-  },
-  methods: {
-    onInputFocus(event) {
-      event == null ? void 0 : event.stopPropagation();
-    },
-    removeLink() {
-      var _a, _b, _c, _d, _e;
-      (_e = (_d = (_c = (_b = (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.chain()) == null ? void 0 : _c.focus()) == null ? void 0 : _d.unsetLink()) == null ? void 0 : _e.run();
-      this.closeLinkInput();
-    },
-    setLink(event) {
-      var _a, _b, _c;
-      const editor2 = (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor;
-      event == null ? void 0 : event.preventDefault();
-      event == null ? void 0 : event.stopPropagation();
-      if (!this.linkInput) {
-        this.removeLink();
-        return;
-      }
-      const prefix = EDITOR_SUPPORTED_LINK_PROTOCOLS.find((prefixRegex) => prefixRegex.test(this.linkInput));
-      if (!prefix) {
-        this.linkInput = `${EDITOR_DEFAULT_LINK_PREFIX}${this.linkInput}`;
-      }
-      const selection = (_c = (_b = editor2 == null ? void 0 : editor2.view) == null ? void 0 : _b.state) == null ? void 0 : _c.selection;
-      if (selection.anchor === selection.head) {
-        editor2.chain().focus().insertContentAt(
-          selection.anchor,
-          `<a class="${this.linkOptions.class}" href=${this.linkInput}>${this.linkInput}</a>`
-        ).run();
-      } else {
-        editor2.chain().focus().extendMarkRange("link").setLink({ href: this.linkInput, class: this.linkOptions.class }).run();
-      }
-      this.closeLinkInput();
-    },
-    openLinkInput() {
-      this.showLinkInput = true;
-    },
-    updateInput(openedInput) {
-      var _a, _b, _c;
-      if (!openedInput) {
-        return this.closeLinkInput();
-      }
-      this.linkInput = (_c = (_b = (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.getAttributes("link")) == null ? void 0 : _c.href;
-    },
-    closeLinkInput() {
-      var _a;
-      this.showLinkInput = false;
-      this.linkInput = "";
-      (_a = this.$refs.richTextEditor.editor) == null ? void 0 : _a.chain().focus();
-    },
-    onBoldTextToggle() {
-      var _a, _b;
-      (_b = (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.chain().focus().toggleBold().run();
-    },
-    onItalicTextToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleItalic().run();
-    },
-    onUnderlineTextToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleUnderline().run();
-    },
-    onStrikethroughTextToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleStrike().run();
-    },
-    onTextAlign(alignment) {
-      var _a, _b, _c, _d;
-      if ((_b = (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.isActive({ textAlign: alignment })) {
-        return (_c = this.$refs.richTextEditor) == null ? void 0 : _c.editor.chain().focus().unsetTextAlign().run();
-      }
-      (_d = this.$refs.richTextEditor) == null ? void 0 : _d.editor.chain().focus().setTextAlign(alignment).run();
-    },
-    onBulletListToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleBulletList().run();
-    },
-    onOrderedListToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleOrderedList().run();
-    },
-    onCodeBlockToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleCodeBlock().run();
-    },
-    onQuickRepliesClick() {
-      this.$emit("quick-replies-click");
-    },
-    onBlockquoteToggle() {
-      var _a;
-      (_a = this.$refs.richTextEditor) == null ? void 0 : _a.editor.chain().focus().toggleBlockquote().run();
-    },
-    onFocus(event) {
-      this.hasFocus = true;
-      this.$emit("focus", event);
-    },
-    onBlur(event) {
-      this.hasFocus = false;
-      this.$emit("blur", event);
-    },
-    onInput(event) {
-      this.$emit("input", event);
-    }
-  }
-};
-const _hoisted_1 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dt-editor--button-group-divider" }, null, -1);
-const _hoisted_2 = { key: 0 };
-const _hoisted_3 = { class: "d-ml8 d-mr12" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dt_icon = vue.resolveComponent("dt-icon");
-  const _component_dt_button = vue.resolveComponent("dt-button");
-  const _component_dt_tooltip = vue.resolveComponent("dt-tooltip");
-  const _component_dt_stack = vue.resolveComponent("dt-stack");
-  const _component_dt_input = vue.resolveComponent("dt-input");
-  const _component_dt_popover = vue.resolveComponent("dt-popover");
-  const _component_dt_rich_text_editor = vue.resolveComponent("dt-rich-text-editor");
-  return vue.openBlock(), vue.createElementBlock("div", {
-    "data-qa": "dt-editor",
-    role: "presentation",
-    class: "d-d-flex d-fd-column",
-    onClick: _cache[4] || (_cache[4] = ($event) => _ctx.$refs.richTextEditor.focusEditor())
-  }, [
-    vue.createVNode(_component_dt_stack, {
-      direction: "row",
-      gap: "450",
-      class: "d-p8 dt-editor--top-bar-background"
-    }, {
-      default: vue.withCtx(() => [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.buttonGroups, (buttonGroup) => {
-          return vue.openBlock(), vue.createBlock(_component_dt_stack, {
-            key: buttonGroup.key,
-            direction: "row",
-            gap: "300"
-          }, {
-            default: vue.withCtx(() => [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(buttonGroup.buttonGroup, (button) => {
-                return vue.openBlock(), vue.createBlock(_component_dt_tooltip, {
-                  key: `${buttonGroup.key}-${JSON.stringify(button.selector)}`,
-                  message: button.tooltipMessage,
-                  placement: "top"
-                }, {
-                  anchor: vue.withCtx(() => {
-                    var _a, _b;
-                    return [
-                      vue.createVNode(_component_dt_button, {
-                        "data-qa": button.dataQA,
-                        importance: "clear",
-                        kind: "muted",
-                        active: (_b = (_a = _ctx.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.isActive(button.selector),
-                        size: "xs",
-                        "aria-label": button.tooltipMessage,
-                        class: vue.normalizeClass({ "d-btn--icon-only": !button.label }),
-                        onClick: ($event) => button.onClick()
-                      }, {
-                        icon: vue.withCtx(() => [
-                          vue.createVNode(_component_dt_icon, {
-                            name: button.iconName,
-                            size: "200"
-                          }, null, 8, ["name"])
-                        ]),
-                        default: vue.withCtx(() => [
-                          vue.createTextVNode(" " + vue.toDisplayString(button == null ? void 0 : button.label), 1)
-                        ]),
-                        _: 2
-                      }, 1032, ["data-qa", "active", "aria-label", "class", "onClick"])
-                    ];
-                  }),
-                  _: 2
-                }, 1032, ["message"]);
-              }), 128)),
-              _hoisted_1
-            ]),
-            _: 2
-          }, 1024);
-        }), 128)),
-        $options.linkButton.showBtn ? (vue.openBlock(), vue.createBlock(_component_dt_stack, {
-          key: 0,
-          direction: "row",
-          gap: "300"
-        }, {
-          default: vue.withCtx(() => [
-            vue.createVNode(_component_dt_popover, {
-              open: $data.showLinkInput,
-              placement: "bottom-start",
-              "visually-hidden-close": true,
-              "visually-hidden-close-label": "Close link input popover",
-              "data-qa": "dt-editor-link-input-popover",
-              "show-close-button": false,
-              onClick: [
-                $options.onInputFocus,
-                vue.withModifiers($options.onInputFocus, ["stop"])
-              ],
-              onOpened: $options.updateInput
-            }, {
-              anchor: vue.withCtx(() => [
-                (vue.openBlock(), vue.createBlock(_component_dt_tooltip, {
-                  key: $options.linkButton.key,
-                  message: $options.linkButton.tooltipMessage,
-                  placement: "top"
-                }, {
-                  anchor: vue.withCtx(() => {
-                    var _a, _b;
-                    return [
-                      vue.createVNode(_component_dt_button, {
-                        "data-qa": $options.linkButton.dataQA,
-                        importance: "clear",
-                        kind: "muted",
-                        class: "d-ol-none",
-                        active: (_b = (_a = _ctx.$refs.richTextEditor) == null ? void 0 : _a.editor) == null ? void 0 : _b.isActive($options.linkButton.selector),
-                        size: "xs",
-                        "aria-label": $options.linkButton.tooltipMessage,
-                        onClick: _cache[0] || (_cache[0] = ($event) => $options.linkButton.onClick())
-                      }, {
-                        icon: vue.withCtx(() => [
-                          vue.createVNode(_component_dt_icon, {
-                            name: $options.linkButton.iconName,
-                            size: "200",
-                            class: "d-fw-bold"
-                          }, null, 8, ["name"])
-                        ]),
-                        _: 1
-                      }, 8, ["data-qa", "active", "aria-label"])
-                    ];
-                  }),
-                  _: 1
-                }, 8, ["message"]))
-              ]),
-              content: vue.withCtx(() => [
-                $props.showAddLink.setLinkTitle.length > 0 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, vue.toDisplayString($props.showAddLink.setLinkTitle), 1)) : vue.createCommentVNode("", true),
-                vue.createVNode(_component_dt_input, {
-                  modelValue: $data.linkInput,
-                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => $data.linkInput = $event),
-                  "input-aria-label": $props.showAddLink.setLinkInputAriaLabel,
-                  "data-qa": "dt-editor-link-input",
-                  placeholder: $props.setLinkPlaceholder,
-                  "input-wrapper-class": "d-bgc-black-100 d-mt6 d-bar5 d-ba d-baw1 d-bc-black-300 d-py2 d-ol-none",
-                  onClick: [
-                    $options.onInputFocus,
-                    vue.withModifiers($options.onInputFocus, ["stop"])
-                  ],
-                  onFocus: $options.onInputFocus,
-                  onKeydown: vue.withKeys($options.setLink, ["enter"])
-                }, null, 8, ["modelValue", "input-aria-label", "placeholder", "onClick", "onFocus", "onKeydown"])
-              ]),
-              footerContent: vue.withCtx(() => [
-                vue.createElementVNode("div", _hoisted_3, [
-                  vue.createVNode(_component_dt_button, {
-                    class: "d-mx2",
-                    "aria-label": $props.removeLinkButton.ariaLabel,
-                    importance: "clear",
-                    kind: "muted",
-                    size: "sm",
-                    "data-qa": "dt-editor-remove-link-btn",
-                    onClick: $options.removeLink
-                  }, {
-                    default: vue.withCtx(() => [
-                      vue.createTextVNode(vue.toDisplayString($props.removeLinkButton.label), 1)
-                    ]),
-                    _: 1
-                  }, 8, ["aria-label", "onClick"]),
-                  vue.createVNode(_component_dt_button, {
-                    class: "d-mx2",
-                    "aria-label": $props.cancelSetLinkButton.ariaLabel,
-                    importance: "clear",
-                    kind: "muted",
-                    size: "sm",
-                    "data-qa": "dt-editor-set-link-cancel-btn",
-                    onClick: $options.closeLinkInput
-                  }, {
-                    default: vue.withCtx(() => [
-                      vue.createTextVNode(vue.toDisplayString($props.cancelSetLinkButton.label), 1)
-                    ]),
-                    _: 1
-                  }, 8, ["aria-label", "onClick"]),
-                  vue.createVNode(_component_dt_button, {
-                    class: "d-mx2",
-                    size: "sm",
-                    "aria-label": $props.confirmSetLinkButton.ariaLabel,
-                    "data-qa": "dt-editor-set-link-confirm-btn",
-                    onClick: $options.setLink
-                  }, {
-                    default: vue.withCtx(() => [
-                      vue.createTextVNode(vue.toDisplayString($props.confirmSetLinkButton.label), 1)
-                    ]),
-                    _: 1
-                  }, 8, ["aria-label", "onClick"])
-                ])
-              ]),
-              _: 1
-            }, 8, ["open", "onClick", "onOpened"])
-          ]),
-          _: 1
-        })) : vue.createCommentVNode("", true)
-      ]),
-      _: 1
-    }),
-    vue.createElementVNode("div", {
-      class: "d-of-auto d-mx16 d-mt8 d-mb16 d-c-text",
-      style: vue.normalizeStyle({ "max-height": $props.maxHeight })
-    }, [
-      vue.createVNode(_component_dt_rich_text_editor, vue.mergeProps({
-        ref: "richTextEditor",
-        modelValue: $data.internalInputValue,
-        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => $data.internalInputValue = $event),
-        "data-qa": "dt-rich-text-editor",
-        editable: $props.editable,
-        "input-aria-label": $props.inputAriaLabel,
-        "input-class": `d-ml16 d-ol-none d-my6 ${$props.inputClass}`,
-        "output-format": $options.htmlOutputFormat,
-        "auto-focus": $props.autoFocus,
-        placeholder: $props.placeholder,
-        "allow-line-breaks": true,
-        link: true
-      }, _ctx.$attrs, {
-        onFocus: $options.onFocus,
-        onBlur: $options.onBlur,
-        onInput: _cache[3] || (_cache[3] = ($event) => $options.onInput($event))
-      }), null, 16, ["modelValue", "editable", "input-aria-label", "input-class", "output-format", "auto-focus", "placeholder", "onFocus", "onBlur"])
-    ], 4)
-  ]);
-}
-const editor = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+const editor = require("../recipes/conversation_view/editor/editor.vue.cjs");
 exports.DtRecipeWysiwygEditor = editor;
 //# sourceMappingURL=editor.cjs.map