@dialpad/dialtone 9.15.1 → 9.16.0

package/dist/vue2/dialtone-vue.js

@@ -1,5 +1,5 @@
-import { S as Te, c as A, M as Z, d as Zt, e as De, f as Jt, D as J, L as ye, P as fe, g as ea, h as ta, i as Oe, j as aa, k as he, l as Ct, a as na, R as ra, b as sa } from "./rich_text_editor-eFa_UQsN.js";
-import { q as tu, r as au, p as nu, m as ru, n as su, o as iu, A as ou, C as lu, E as du, y as cu, s as uu, x as fu, t as hu, v as pu, u as mu, w as gu, z as _u, B as bu } from "./rich_text_editor-eFa_UQsN.js";
+import { S as Te, c as A, M as Z, d as Zt, e as De, f as Jt, D as J, L as ye, P as fe, g as ea, h as ta, i as Oe, j as aa, k as he, l as Ct, a as na, R as ra, b as sa } from "./rich_text_editor-trHmm1VD.js";
+import { q as tu, r as au, p as nu, m as ru, n as su, o as iu, A as ou, C as lu, E as du, y as cu, s as uu, x as fu, t as hu, v as pu, u as mu, w as gu, z as _u, B as bu } from "./rich_text_editor-trHmm1VD.js";
 import { w as y, t as S, F as ia, M as oa, G as la, H as W, J as St, K as kt, N as It, O as xt, P as Le, x as Tt, D as da } from "./index-G0QxbVGe.js";
 import { W as yu, S as wu, R as Cu, Q as Su, T as ku, a1 as Iu, a4 as xu, a3 as Tu, a2 as Du, z as Ou, y as Lu, U as $u, I as Eu, Y as Au, X as Mu, V as Ru, C as Bu, L as Pu, a9 as Nu, a5 as Fu, a6 as qu, a8 as Hu, a7 as Wu, a0 as Vu, $ as Uu, Z as ju, _ as Yu } from "./index-G0QxbVGe.js";
 import { n as c, u as E, g as T, e as $e, E as C, k as Qe, o as ca, b as Xe, a as Se, L as ua, p as fa, D as ee, s as Ee, q as ha } from "./tooltip-AVHt9lw0.js";
@@ -7396,7 +7396,7 @@ var el = function() {
   tl,
   !1,
   null,
-  "b2859861",
+  "e8b2c5a4",
   null,
   null
 );
@@ -7810,8 +7810,8 @@ const Ec = ul.exports, fl = {
       default: null
     },
     /**
-     * Avatar's full name, used as alt attribute for image and
-     * to extract initials to display in avatar if `avatarSrc` and `avatarIcon` are empty.
+     * Avatar's full name, used to extract initials
+     * to display in avatar if `avatarSrc` and `avatarIcon` are empty.
      */
     avatarFullName: {
       type: String,
@@ -7833,9 +7833,9 @@ const Ec = ul.exports, fl = {
       default: "lg"
     },
     /**
-     * The aria label of the avatar
+     * The aria-labelledby of the button containing avatars
      */
-    avatarAriaLabel: {
+    avatarLabelledBy: {
       type: String,
       default: ""
     },
@@ -7853,7 +7853,7 @@ const Ec = ul.exports, fl = {
      * Showing multiple avatars in contact info.
      * The props of array items are: <br>
      * `src` - avatar image url (optional) <br>
-     * `fullName` - full name, used as alt attribute for image and extract initials to display in avatar<br>
+     * `fullName` - full name, used to extract initials to display in avatar<br>
      *  if `avatarSrc` and `avatarIcon` are empty<br>
      * `seed` - determines uniqueness of avatar background <br>
      * `text` - text that overlays the avatar (optional) <br>
@@ -7875,9 +7875,9 @@ const Ec = ul.exports, fl = {
 var hl = function() {
   var e = this, a = e._self._c;
   return a("dt-item-layout", { staticClass: "dt-contact-info", attrs: { role: e.role, "data-qa": "contact-info" }, scopedSlots: e._u([e.showAvatar ? { key: "left", fn: function() {
-    return [a("button", { staticClass: "dt-contact-info__left", attrs: { "data-qa": "contact-info-left", "aria-labelledby": e.avatarAriaLabel }, on: { click: e.avatarClick } }, [e.avatarList ? a("span", { staticClass: "dt-contact-info--avatars" }, e._l(e.avatarList, function(n, r) {
-      return a("dt-avatar", { key: r, attrs: { size: e.avatarSize, seed: n.seed, "full-name": n.fullName, "image-src": n.src, "icon-name": e.avatarIcon, "overlay-icon": n.icon, "overlay-text": n.text, "avatar-class": [{ "d-mln24": r > 0, "d-bc-brand": !!n.halo }] } });
-    }), 1) : a("dt-avatar", { attrs: { size: e.avatarSize, "full-name": e.avatarFullName, "image-src": e.avatarSrc, "icon-name": e.avatarIcon, seed: e.avatarSeed, presence: e.presence } })], 1)];
+    return [a("button", { staticClass: "dt-contact-info__left", attrs: { "data-qa": "contact-info-left", "aria-labelledby": e.avatarLabelledBy }, on: { click: e.avatarClick } }, [e.avatarList ? a("span", { staticClass: "dt-contact-info--avatars" }, e._l(e.avatarList, function(n, r) {
+      return a("dt-avatar", { key: r, attrs: { size: e.avatarSize, seed: n.seed, "full-name": n.fullName, "image-src": n.src, "image-alt": "", "icon-name": e.avatarIcon, "overlay-icon": n.icon, "overlay-text": n.text, "avatar-class": [{ "d-mln24": r > 0, "d-bc-brand": !!n.halo }] } });
+    }), 1) : a("dt-avatar", { attrs: { size: e.avatarSize, "full-name": e.avatarFullName, "image-src": e.avatarSrc, "image-alt": "", "icon-name": e.avatarIcon, seed: e.avatarSeed, presence: e.presence } })], 1)];
   }, proxy: !0 } : null, { key: "default", fn: function() {
     return [a("div", { attrs: { "data-qa": "contact-info-header" } }, [e._t("header")], 2)];
   }, proxy: !0 }, { key: "subtitle", fn: function() {
@@ -7893,7 +7893,7 @@ var hl = function() {
   pl,
   !1,
   null,
-  "f49cb6dd",
+  "a3c913d1",
   null,
   null
 );
@@ -8639,14 +8639,6 @@ const Fc = Ql.exports, Xl = {
       type: String,
       default: ""
     },
-    /**
-     * Optional avatar image alt text.
-     * If not provided it will use the name.
-     */
-    avatarAlt: {
-      type: String,
-      default: ""
-    },
     /**
      * Determines whether to show the presence indicator for
      * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',
@@ -8791,7 +8783,7 @@ const Fc = Ql.exports, Xl = {
 var Zl = function() {
   var e = this, a = e._self._c;
   return a("dt-recipe-general-row", e._g(e._b({ attrs: { "unread-count": e.unreadCount, description: e.contactDescription, "has-unreads": e.hasUnreads, selected: e.selected, "has-call-button": e.hasCallButton, muted: e.muted, "is-typing": e.isTyping, "call-button-tooltip": e.callButtonTooltip, "unread-count-tooltip": e.unreadCountTooltip }, scopedSlots: e._u([{ key: "left", fn: function() {
-    return [a("dt-avatar", { attrs: { "full-name": e.name, "image-src": e.avatarSrc, "image-alt": e.avatarAlt, "icon-name": e.iconName, "icon-size": "200", size: "sm", seed: e.avatarSeed, presence: e.avatarPresence } })];
+    return [a("dt-avatar", { attrs: { "full-name": e.name, "image-src": e.avatarSrc, "image-alt": "", "icon-name": e.iconName, "icon-size": "200", size: "sm", seed: e.avatarSeed, presence: e.avatarPresence } })];
   }, proxy: !0 }, { key: "label", fn: function() {
     return [a("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__description", attrs: { "data-qa": "dt-leftbar-row-description", size: "200" } }, [e._v(" " + e._s(e.name) + " ")]), a("div", { staticClass: "dt-leftbar-row__status" }, [e.presenceText ? a("span", { class: ["dt-leftbar-row__meta-context", e.presenceColorClass], attrs: { "data-qa": "dt-leftbar-row-presence-text" } }, [e._v(" " + e._s(e.presenceText) + " ")]) : e._e(), e.userStatus ? a("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__meta-custom", attrs: { size: "100", "element-type": "span", "data-qa": "dt-leftbar-row-user-status" } }, [e._v(" " + e._s(e.userStatus) + " ")]) : e._e()], 1)];
   }, proxy: !0 }]) }, "dt-recipe-general-row", e.$attrs, !1), e.$listeners));
@@ -8883,7 +8875,8 @@ const Hc = id.exports, _t = {
       default: !1
     },
     /**
-     * Show the avatar of the user, if this is not passed in, the initials would display
+     * Optional avatar image url.
+     * If not provided it will use extracted initials from displayName.
      */
     avatarImageUrl: {
       type: String,
@@ -9018,7 +9011,7 @@ var ld = function() {
   var e = this, a = e._self._c;
   return a("dt-list-item", e._g(e._b({ ref: "FeedItemRef", class: ["dt-feed-item-row", e.listItemClasses], attrs: { "navigation-type": "none", "data-qa": "dt-feed-item-row" }, scopedSlots: e._u([{ key: "left", fn: function() {
     return [e.showHeader ? a("div", { staticClass: "dt-feed-item-row__avatar-container" }, [e._t("avatar", function() {
-      return [a("dt-avatar", { attrs: { "full-name": e.displayName, "image-src": e.avatarImageUrl, seed: e.avatarSeed } })];
+      return [a("dt-avatar", { attrs: { "full-name": e.displayName, "image-src": e.avatarImageUrl, "image-alt": "", seed: e.avatarSeed } })];
     })], 2) : e._e(), e.showHeader ? e._e() : a("span", { directives: [{ name: "show", rawName: "v-show", value: e.isActive, expression: "isActive" }], staticClass: "dt-feed-item-row__left-time", attrs: { "data-qa": "dt-feed-item-row--left-time" } }, [e._v(" " + e._s(e.shortTime) + " ")])];
   }, proxy: !0 }, { key: "bottom", fn: function() {
     return [e.$slots.reactions ? a("div", { staticClass: "dt-feed-item-row__reactions", attrs: { "data-qa": "dt-feed-item-row--reactions" } }, [e._t("reactions")], 2) : e._e(), e.$slots.threading ? a("div", { staticClass: "dt-feed-item-row__threading" }, [e._t("threading")], 2) : e._e()];
@@ -9031,7 +9024,7 @@ var ld = function() {
   dd,
   !1,
   null,
-  "266b4474",
+  "e9baa8ed",
   null,
   null
 );
@@ -9965,8 +9958,8 @@ const Kc = Ud.exports, vt = {
       default: ""
     },
     /**
-     * Avatar's full name, used as alt attribute for image and
-     * to extract initials to display in avatar if `avatarSrc` is empty.
+     * Avatar's full name, used to extract initials
+     * to display if `avatarSrc` is empty.
      */
     avatarFullName: {
       type: String,
@@ -10039,7 +10032,7 @@ const Kc = Ud.exports, vt = {
 };
 var Yd = function() {
   var e = this, a = e._self._c;
-  return a("div", { staticClass: "dt-recipe-callbox", attrs: { "data-qa": "dt-recipe-callbox" } }, [e.$slots.video ? a("div", { staticClass: "dt-recipe-callbox--video", attrs: { "data-qa": "dt-recipe-callbox--video-wrapper" } }, [e._t("video")], 2) : e._e(), a("div", { class: ["dt-recipe-callbox--main-content", e.borderClass, { "dt-recipe-callbox--clickable": e.clickable }], attrs: { "data-qa": "dt-recipe-callbox--main-content" } }, [a("div", { staticClass: "dt-recipe-callbox--main-content-top" }, [e.shouldShowAvatar ? a("dt-avatar", { attrs: { "avatar-class": "dt-recipe-callbox--avatar", "image-src": e.avatarSrc, "full-name": e.avatarFullName, seed: e.avatarSeed, clickable: e.clickable, "overlay-icon": e.isOnHold ? "pause" : null, size: "sm" }, on: { click: e.handleClick } }) : e._e(), a("div", { staticClass: "dt-recipe-callbox--content" }, [a(e.clickable ? "button" : "span", { tag: "component", staticClass: "dt-recipe-callbox--content-title", attrs: { "data-qa": "dt-recipe-callbox--title" }, on: { click: e.handleClick } }, [e._v(" " + e._s(e.title) + " ")]), e.$slots.badge || e.badgeText ? a("div", { staticClass: "dt-recipe-callbox--content-badge", attrs: { "data-qa": "dt-recipe-callbox--badge-wrapper" } }, [e._t("badge", function() {
+  return a("div", { staticClass: "dt-recipe-callbox", attrs: { "data-qa": "dt-recipe-callbox" } }, [e.$slots.video ? a("div", { staticClass: "dt-recipe-callbox--video", attrs: { "data-qa": "dt-recipe-callbox--video-wrapper" } }, [e._t("video")], 2) : e._e(), a("div", { class: ["dt-recipe-callbox--main-content", e.borderClass, { "dt-recipe-callbox--clickable": e.clickable }], attrs: { "data-qa": "dt-recipe-callbox--main-content" } }, [a("div", { staticClass: "dt-recipe-callbox--main-content-top" }, [e.shouldShowAvatar ? a("dt-avatar", { attrs: { "avatar-class": "dt-recipe-callbox--avatar", "image-src": e.avatarSrc, "image-alt": "", "full-name": e.avatarFullName, seed: e.avatarSeed, clickable: e.clickable, "overlay-icon": e.isOnHold ? "pause" : null, size: "sm" }, on: { click: e.handleClick } }) : e._e(), a("div", { staticClass: "dt-recipe-callbox--content" }, [a(e.clickable ? "button" : "span", { tag: "component", staticClass: "dt-recipe-callbox--content-title", attrs: { "data-qa": "dt-recipe-callbox--title" }, on: { click: e.handleClick } }, [e._v(" " + e._s(e.title) + " ")]), e.$slots.badge || e.badgeText ? a("div", { staticClass: "dt-recipe-callbox--content-badge", attrs: { "data-qa": "dt-recipe-callbox--badge-wrapper" } }, [e._t("badge", function() {
     return [a("dt-badge", { class: e.badgeClass, attrs: { text: e.badgeText } })];
   })], 2) : e._e(), e.$slots.subtitle ? a("div", { staticClass: "dt-recipe-callbox--content-subtitle", attrs: { "data-qa": "dt-recipe-callbox--subtitle-wrapper" } }, [e._t("subtitle")], 2) : e._e()], 1), e.$slots.right ? a("div", { staticClass: "dt-recipe-callbox--right", attrs: { "data-qa": "dt-recipe-callbox--right-wrapper" } }, [e._t("right")], 2) : e._e()], 1), e.$slots.bottom ? a("div", { staticClass: "dt-recipe-callbox--main-content-bottom", attrs: { "data-qa": "dt-recipe-callbox--bottom-wrapper" } }, [e._t("bottom")], 2) : e._e()])]);
 }, Kd = [], zd = /* @__PURE__ */ c(
@@ -10048,7 +10041,7 @@ var Yd = function() {
   Kd,
   !1,
   null,
-  "66800ae7",
+  "ef08f46e",
   null,
   null
 );

package/dist/vue2/message_input.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./rich_text_editor-VIRykWIa.cjs"),a=require("./index-ihXjcrB-.cjs"),l=require("./emoji_picker-zi8qwHtl.cjs"),s=require("./tooltip-6msmWvq0.cjs");require("vue");const u={name:"DtRecipeMessageInput",components:{DtButton:a.DtButton,DtEmojiPicker:l.DtEmojiPicker,DtIcon:a.DtIcon,DtInput:a.DtInput,DtPopover:o.DtPopover,DtRichTextEditor:o.DtRichTextEditor,DtTooltip:s.DtTooltip},mixins:[],inheritAttrs:!1,props:{value:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(t){return typeof t=="string"?o.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(t):!0}},outputFormat:{type:String,default:"text",validator(t){return o.RICH_TEXT_EDITOR_OUTPUT_FORMATS.includes(t)}},link:{type:[Boolean,Object],default:!1},placeholder:{type:String,default:""},disableSend:{type:Boolean,default:!1},maxHeight:{type:String,default:"unset"},showEmojiPicker:{type:Boolean,default:!0},emojiPickerProps:{type:Object,default:()=>({}),validate(t){return["searchNoResultsLabel","searchResultsLabel","searchPlaceholderLabel","skinSelectorButtonTooltipLabel","tabSetLabels"].every(e=>t[e]!=null)}},emojiTooltipMessage:{type:String,default:"Emoji"},emojiButtonAriaLabel:{type:String,default:"emoji button"},showCharacterLimit:{type:[Boolean,Object],default:()=>({count:1500,warning:500,message:""})},showImagePicker:{type:[Boolean,Object],default:()=>({tooltipLabel:"Attach Image",ariaLabel:"image button"})},showSend:{type:[Boolean,Object],default:()=>({icon:"send"})},showCancel:{type:[Boolean,Object],default:()=>({text:"Cancel"})},mentionSuggestion:{type:Object,default:null}},emits:["submit","select-media","add-media","cancel","skin-tone","selected-emoji","focus","blur","input"],data(){return{internalInputValue:this.value,hasFocus:!1,imagePickerFocus:!1,emojiPickerFocus:!1,sendButtonFocus:!1,emojiPickerOpened:!1}},computed:{inputLength(){return this.internalInputValue.length},displayCharacterLimitWarning(){return!!this.showCharacterLimit&&this.showCharacterLimit.count-this.inputLength<=this.showCharacterLimit.warning},characterLimitTooltipEnabled(){return this.showCharacterLimit.message&&this.showCharacterLimit.count-this.inputLength<0},isSendDisabled(){return this.inputLength===0||this.disableSend||this.showCharacterLimit&&this.inputLength>this.showCharacterLimit.count},computedCloseButtonProps(){return{ariaLabel:"Close"}},emojiPickerHovered(){return this.emojiPickerFocus||this.emojiPickerOpened},sendButtonKind(){return this.isSendDisabled?"muted":"default"}},watch:{value(t){this.internalInputValue=t}},methods:{onDrag(t){t.stopPropagation(),t.preventDefault()},onDrop(t){t.stopPropagation(),t.preventDefault();const e=t.dataTransfer,i=Array.from(e.files).map(r=>r.name);this.$emit("add-media",i)},onSkinTone(t){this.$emit("skin-tone",t)},onSelectEmoji(t){if(!t){this.emojiPickerOpened=!1;return}this.$refs.richTextEditor.editor.commands.insertContent({type:"emoji",attrs:{code:t.shortname}}),this.emojiPickerOpened=!1,this.$emit("selected-emoji",t)},onSelectImage(){this.$refs.messageInputImageUpload.$refs.input.click()},onImageUpload(t){this.$emit("select-media",t)},toggleEmojiPicker(){this.emojiPickerOpened=!this.emojiPickerOpened},onSend(){this.isSendDisabled||this.$emit("submit",this.internalInputValue)},onCancel(){this.$emit("cancel")},onFocus(t){this.hasFocus=!0,this.$refs.richTextEditor.focusEditor(),this.$emit("focus",t)},onBlur(t){this.hasFocus=!1,this.$emit("blur",t)},onInput(t){this.$emit("input",t)}}};var c=function(){var e=this,n=e._self._c;return n("div",{class:["d-d-flex","d-fd-column","d-bar8","d-baw1","d-ba","d-c-text",{"d-bc-black-500 d-bs-sm":e.hasFocus,"d-bc-default":!e.hasFocus}],attrs:{"data-qa":"dt-message-input",role:"presentation"},on:{click:function(i){return e.$refs.richTextEditor.focusEditor()},"drag-enter":e.onDrag,"drag-over":e.onDrag,drop:e.onDrop,keydown:function(i){return!i.type.indexOf("key")&&e._k(i.keyCode,"enter",13,i.key,"Enter")||i.ctrlKey||i.shiftKey||i.altKey||i.metaKey?null:e.onSend.apply(null,arguments)}}},[n("div",{staticClass:"d-of-auto d-mx16 d-mt8 d-mb4",style:{"max-height":e.maxHeight}},[n("dt-rich-text-editor",e._b({ref:"richTextEditor",attrs:{editable:e.editable,"input-aria-label":e.inputAriaLabel,"input-class":e.inputClass,"output-format":e.outputFormat,"auto-focus":e.autoFocus,link:e.link,placeholder:e.placeholder,"mention-suggestion":e.mentionSuggestion},on:{focus:e.onFocus,blur:e.onBlur,input:function(i){return e.onInput(i)}},model:{value:e.internalInputValue,callback:function(i){e.internalInputValue=i},expression:"internalInputValue"}},"dt-rich-text-editor",e.$attrs,!1))],1),e._t("middle"),n("section",{staticClass:"d-d-flex d-jc-space-between d-mx8 d-my4"},[n("div",{staticClass:"d-d-flex"},[e.showImagePicker?n("dt-tooltip",{attrs:{placement:"top-start",message:e.showImagePicker.tooltipLabel,offset:[-4,-4]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{attrs:{"data-qa":"dt-message-input-image-btn",size:"sm",circle:"",kind:e.imagePickerFocus?"default":"muted",importance:"clear","aria-label":e.showImagePicker.ariaLabel},on:{click:e.onSelectImage,mouseenter:function(i){e.imagePickerFocus=!0},mouseleave:function(i){e.imagePickerFocus=!1},focus:function(i){e.imagePickerFocus=!0},blur:function(i){e.imagePickerFocus=!1}},scopedSlots:e._u([{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:"image",size:"300"}})]},proxy:!0}],null,!1,2561380377)}),n("dt-input",{ref:"messageInputImageUpload",staticClass:"d-ps-absolute",attrs:{"data-qa":"dt-message-input-image-input",type:"file",multiple:"",hidden:""},on:{input:e.onImageUpload}})]},proxy:!0}],null,!1,3687934814)}):e._e(),e.showEmojiPicker?n("dt-popover",{attrs:{"data-qa":"dt-message-input-emoji-picker-popover",open:e.emojiPickerOpened,"initial-focus-element":"#searchInput",padding:"none"},on:{opened:i=>{e.emojiPickerOpened=i}},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-tooltip",{attrs:{message:e.emojiTooltipMessage,offset:[0,-4]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{attrs:{"data-qa":"dt-message-input-emoji-picker-btn",size:"sm",circle:"",kind:e.emojiPickerHovered?"default":"muted",importance:"clear","aria-label":e.emojiButtonAriaLabel,offset:[0,0]},on:{click:e.toggleEmojiPicker,mouseenter:function(i){e.emojiPickerFocus=!0},mouseleave:function(i){e.emojiPickerFocus=!1},focus:function(i){e.emojiPickerFocus=!0},blur:function(i){e.emojiPickerFocus=!1}},scopedSlots:e._u([{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:e.emojiPickerHovered?"very-satisfied":"satisfied",size:"300"}})]},proxy:!0}],null,!1,352772906)})]},proxy:!0}],null,!1,3933528398)})]},proxy:!0},{key:"content",fn:function(){return[n("dt-emoji-picker",e._b({on:{"skin-tone":e.onSkinTone,"selected-emoji":e.onSelectEmoji}},"dt-emoji-picker",e.emojiPickerProps,!1))]},proxy:!0}],null,!1,1278205067)}):e._e()],1),n("div",{staticClass:"d-d-flex"},[e.showCharacterLimit?n("dt-tooltip",{staticClass:"dt-message-input--remaining-char-tooltip",attrs:{placement:"top-end",enabled:e.characterLimitTooltipEnabled,message:e.showCharacterLimit.message,offset:[10,-8]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("p",{directives:[{name:"show",rawName:"v-show",value:e.displayCharacterLimitWarning,expression:"displayCharacterLimitWarning"}],staticClass:"d-fc-error d-mr16 dt-message-input--remaining-char",attrs:{"data-qa":"dt-message-input-character-limit"}},[e._v(" "+e._s(e.showCharacterLimit.count-e.inputLength)+" ")])]},proxy:!0}],null,!1,2591914334)}):e._e(),e.showCancel?n("dt-button",{staticClass:"dt-message-input--cancel-button",attrs:{"data-qa":"dt-message-input-cancel-button",size:"sm",kind:"muted",importance:"clear","aria-label":e.showCancel.ariaLabel},on:{click:e.onCancel}},[n("p",[e._v(e._s(e.showCancel.text))])]):e._e(),e.showSend?n("dt-tooltip",{attrs:{placement:"top-end",enabled:!e.showSend,message:e.showSend.tooltipLabel,show:!e.isSendDisabled&&e.sendButtonFocus,offset:[6,-8]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{class:{"message-input-button__disabled d-fc-muted":e.isSendDisabled},attrs:{"data-qa":"dt-message-input-send-btn",size:"sm",kind:e.sendButtonKind,circle:!!e.showSend.icon,importance:"primary","aria-label":e.showSend.ariaLabel,"aria-disabled":e.isSendDisabled},on:{click:e.onSend,mouseenter:function(i){e.sendButtonFocus=!0},mouseleave:function(i){e.sendButtonFocus=!1},focus:function(i){e.sendButtonFocus=!0},blur:function(i){e.sendButtonFocus=!1}},scopedSlots:e._u([e.showSend.icon?{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:e.showSend.icon,size:"300"}})]},proxy:!0}:null],null,!0)},[e.showSend.text?[n("p",[e._v(e._s(e.showSend.text))])]:e._e()],2)]},proxy:!0}],null,!1,370079737)}):e._e()],1)])],2)},d=[],m=s.normalizeComponent(u,c,d,!1,null,null,null,null);const p=m.exports;exports.DtRichTextEditor=o.DtRichTextEditor;exports.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES=o.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES;exports.RICH_TEXT_EDITOR_OUTPUT_FORMATS=o.RICH_TEXT_EDITOR_OUTPUT_FORMATS;exports.DtRecipeMessageInput=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./rich_text_editor-MzdHNizj.cjs"),a=require("./index-ihXjcrB-.cjs"),l=require("./emoji_picker-zi8qwHtl.cjs"),s=require("./tooltip-6msmWvq0.cjs");require("vue");const u={name:"DtRecipeMessageInput",components:{DtButton:a.DtButton,DtEmojiPicker:l.DtEmojiPicker,DtIcon:a.DtIcon,DtInput:a.DtInput,DtPopover:o.DtPopover,DtRichTextEditor:o.DtRichTextEditor,DtTooltip:s.DtTooltip},mixins:[],inheritAttrs:!1,props:{value:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(t){return typeof t=="string"?o.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(t):!0}},outputFormat:{type:String,default:"text",validator(t){return o.RICH_TEXT_EDITOR_OUTPUT_FORMATS.includes(t)}},link:{type:[Boolean,Object],default:!1},placeholder:{type:String,default:""},disableSend:{type:Boolean,default:!1},maxHeight:{type:String,default:"unset"},showEmojiPicker:{type:Boolean,default:!0},emojiPickerProps:{type:Object,default:()=>({}),validate(t){return["searchNoResultsLabel","searchResultsLabel","searchPlaceholderLabel","skinSelectorButtonTooltipLabel","tabSetLabels"].every(e=>t[e]!=null)}},emojiTooltipMessage:{type:String,default:"Emoji"},emojiButtonAriaLabel:{type:String,default:"emoji button"},showCharacterLimit:{type:[Boolean,Object],default:()=>({count:1500,warning:500,message:""})},showImagePicker:{type:[Boolean,Object],default:()=>({tooltipLabel:"Attach Image",ariaLabel:"image button"})},showSend:{type:[Boolean,Object],default:()=>({icon:"send"})},showCancel:{type:[Boolean,Object],default:()=>({text:"Cancel"})},mentionSuggestion:{type:Object,default:null}},emits:["submit","select-media","add-media","cancel","skin-tone","selected-emoji","focus","blur","input"],data(){return{internalInputValue:this.value,hasFocus:!1,imagePickerFocus:!1,emojiPickerFocus:!1,sendButtonFocus:!1,emojiPickerOpened:!1}},computed:{inputLength(){return this.internalInputValue.length},displayCharacterLimitWarning(){return!!this.showCharacterLimit&&this.showCharacterLimit.count-this.inputLength<=this.showCharacterLimit.warning},characterLimitTooltipEnabled(){return this.showCharacterLimit.message&&this.showCharacterLimit.count-this.inputLength<0},isSendDisabled(){return this.inputLength===0||this.disableSend||this.showCharacterLimit&&this.inputLength>this.showCharacterLimit.count},computedCloseButtonProps(){return{ariaLabel:"Close"}},emojiPickerHovered(){return this.emojiPickerFocus||this.emojiPickerOpened},sendButtonKind(){return this.isSendDisabled?"muted":"default"}},watch:{value(t){this.internalInputValue=t}},methods:{onDrag(t){t.stopPropagation(),t.preventDefault()},onDrop(t){t.stopPropagation(),t.preventDefault();const e=t.dataTransfer,i=Array.from(e.files).map(r=>r.name);this.$emit("add-media",i)},onSkinTone(t){this.$emit("skin-tone",t)},onSelectEmoji(t){if(!t){this.emojiPickerOpened=!1;return}this.$refs.richTextEditor.editor.commands.insertContent({type:"emoji",attrs:{code:t.shortname}}),this.emojiPickerOpened=!1,this.$emit("selected-emoji",t)},onSelectImage(){this.$refs.messageInputImageUpload.$refs.input.click()},onImageUpload(t){this.$emit("select-media",t)},toggleEmojiPicker(){this.emojiPickerOpened=!this.emojiPickerOpened},onSend(){this.isSendDisabled||this.$emit("submit",this.internalInputValue)},onCancel(){this.$emit("cancel")},onFocus(t){this.hasFocus=!0,this.$refs.richTextEditor.focusEditor(),this.$emit("focus",t)},onBlur(t){this.hasFocus=!1,this.$emit("blur",t)},onInput(t){this.$emit("input",t)}}};var c=function(){var e=this,n=e._self._c;return n("div",{class:["d-d-flex","d-fd-column","d-bar8","d-baw1","d-ba","d-c-text",{"d-bc-bold d-bs-sm":e.hasFocus,"d-bc-default":!e.hasFocus}],attrs:{"data-qa":"dt-message-input",role:"presentation"},on:{click:function(i){return e.$refs.richTextEditor.focusEditor()},"drag-enter":e.onDrag,"drag-over":e.onDrag,drop:e.onDrop,keydown:function(i){return!i.type.indexOf("key")&&e._k(i.keyCode,"enter",13,i.key,"Enter")||i.ctrlKey||i.shiftKey||i.altKey||i.metaKey?null:e.onSend.apply(null,arguments)}}},[n("div",{staticClass:"d-of-auto d-mx16 d-mt8 d-mb4",style:{"max-height":e.maxHeight}},[n("dt-rich-text-editor",e._b({ref:"richTextEditor",attrs:{editable:e.editable,"input-aria-label":e.inputAriaLabel,"input-class":e.inputClass,"output-format":e.outputFormat,"auto-focus":e.autoFocus,link:e.link,placeholder:e.placeholder,"mention-suggestion":e.mentionSuggestion},on:{focus:e.onFocus,blur:e.onBlur,input:function(i){return e.onInput(i)}},model:{value:e.internalInputValue,callback:function(i){e.internalInputValue=i},expression:"internalInputValue"}},"dt-rich-text-editor",e.$attrs,!1))],1),e._t("middle"),n("section",{staticClass:"d-d-flex d-jc-space-between d-mx8 d-my4"},[n("div",{staticClass:"d-d-flex"},[e.showImagePicker?n("dt-tooltip",{attrs:{placement:"top-start",message:e.showImagePicker.tooltipLabel,offset:[-4,-4]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{attrs:{"data-qa":"dt-message-input-image-btn",size:"sm",circle:"",kind:e.imagePickerFocus?"default":"muted",importance:"clear","aria-label":e.showImagePicker.ariaLabel},on:{click:e.onSelectImage,mouseenter:function(i){e.imagePickerFocus=!0},mouseleave:function(i){e.imagePickerFocus=!1},focus:function(i){e.imagePickerFocus=!0},blur:function(i){e.imagePickerFocus=!1}},scopedSlots:e._u([{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:"image",size:"300"}})]},proxy:!0}],null,!1,2561380377)}),n("dt-input",{ref:"messageInputImageUpload",staticClass:"d-ps-absolute",attrs:{"data-qa":"dt-message-input-image-input",type:"file",multiple:"",hidden:""},on:{input:e.onImageUpload}})]},proxy:!0}],null,!1,3687934814)}):e._e(),e.showEmojiPicker?n("dt-popover",{attrs:{"data-qa":"dt-message-input-emoji-picker-popover",open:e.emojiPickerOpened,"initial-focus-element":"#searchInput",padding:"none"},on:{opened:i=>{e.emojiPickerOpened=i}},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-tooltip",{attrs:{message:e.emojiTooltipMessage,offset:[0,-4]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{attrs:{"data-qa":"dt-message-input-emoji-picker-btn",size:"sm",circle:"",kind:e.emojiPickerHovered?"default":"muted",importance:"clear","aria-label":e.emojiButtonAriaLabel,offset:[0,0]},on:{click:e.toggleEmojiPicker,mouseenter:function(i){e.emojiPickerFocus=!0},mouseleave:function(i){e.emojiPickerFocus=!1},focus:function(i){e.emojiPickerFocus=!0},blur:function(i){e.emojiPickerFocus=!1}},scopedSlots:e._u([{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:e.emojiPickerHovered?"very-satisfied":"satisfied",size:"300"}})]},proxy:!0}],null,!1,352772906)})]},proxy:!0}],null,!1,3933528398)})]},proxy:!0},{key:"content",fn:function(){return[n("dt-emoji-picker",e._b({on:{"skin-tone":e.onSkinTone,"selected-emoji":e.onSelectEmoji}},"dt-emoji-picker",e.emojiPickerProps,!1))]},proxy:!0}],null,!1,1278205067)}):e._e()],1),n("div",{staticClass:"d-d-flex"},[e.showCharacterLimit?n("dt-tooltip",{staticClass:"dt-message-input--remaining-char-tooltip",attrs:{placement:"top-end",enabled:e.characterLimitTooltipEnabled,message:e.showCharacterLimit.message,offset:[10,-8]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("p",{directives:[{name:"show",rawName:"v-show",value:e.displayCharacterLimitWarning,expression:"displayCharacterLimitWarning"}],staticClass:"d-fc-error d-mr16 dt-message-input--remaining-char",attrs:{"data-qa":"dt-message-input-character-limit"}},[e._v(" "+e._s(e.showCharacterLimit.count-e.inputLength)+" ")])]},proxy:!0}],null,!1,2591914334)}):e._e(),e.showCancel?n("dt-button",{staticClass:"dt-message-input--cancel-button",attrs:{"data-qa":"dt-message-input-cancel-button",size:"sm",kind:"muted",importance:"clear","aria-label":e.showCancel.ariaLabel},on:{click:e.onCancel}},[n("p",[e._v(e._s(e.showCancel.text))])]):e._e(),e.showSend?n("dt-tooltip",{attrs:{placement:"top-end",enabled:!e.showSend,message:e.showSend.tooltipLabel,show:!e.isSendDisabled&&e.sendButtonFocus,offset:[6,-8]},scopedSlots:e._u([{key:"anchor",fn:function(){return[n("dt-button",{class:{"message-input-button__disabled d-fc-muted":e.isSendDisabled},attrs:{"data-qa":"dt-message-input-send-btn",size:"sm",kind:e.sendButtonKind,circle:!!e.showSend.icon,importance:"primary","aria-label":e.showSend.ariaLabel,"aria-disabled":e.isSendDisabled},on:{click:e.onSend,mouseenter:function(i){e.sendButtonFocus=!0},mouseleave:function(i){e.sendButtonFocus=!1},focus:function(i){e.sendButtonFocus=!0},blur:function(i){e.sendButtonFocus=!1}},scopedSlots:e._u([e.showSend.icon?{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:e.showSend.icon,size:"300"}})]},proxy:!0}:null],null,!0)},[e.showSend.text?[n("p",[e._v(e._s(e.showSend.text))])]:e._e()],2)]},proxy:!0}],null,!1,370079737)}):e._e()],1)])],2)},d=[],m=s.normalizeComponent(u,c,d,!1,null,null,null,null);const p=m.exports;exports.DtRichTextEditor=o.DtRichTextEditor;exports.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES=o.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES;exports.RICH_TEXT_EDITOR_OUTPUT_FORMATS=o.RICH_TEXT_EDITOR_OUTPUT_FORMATS;exports.DtRecipeMessageInput=p;

package/dist/vue2/message_input.js

@@ -1,4 +1,4 @@
-import { D as o, a as s, R as r, b as l } from "./rich_text_editor-eFa_UQsN.js";
+import { D as o, a as s, R as r, b as l } from "./rich_text_editor-trHmm1VD.js";
 import { t as u, w as c, x as d } from "./index-G0QxbVGe.js";
 import { D as m } from "./emoji_picker-GfisVsYp.js";
 import { n as p, D as f } from "./tooltip-AVHt9lw0.js";
@@ -348,7 +348,7 @@ var g = function() {
     "d-baw1",
     "d-ba",
     "d-c-text",
-    { "d-bc-black-500 d-bs-sm": e.hasFocus, "d-bc-default": !e.hasFocus }
+    { "d-bc-bold d-bs-sm": e.hasFocus, "d-bc-default": !e.hasFocus }
   ], attrs: { "data-qa": "dt-message-input", role: "presentation" }, on: { click: function(n) {
     return e.$refs.richTextEditor.focusEditor();
   }, "drag-enter": e.onDrag, "drag-over": e.onDrag, drop: e.onDrop, keydown: function(n) {