@dialpad/dialtone-vue 2.117.0 → 2.117.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +1 -1
- package/CHANGELOG.md +22 -0
- package/dist/component-documentation.json +1 -1
- package/dist/dialtone-vue.cjs +2 -2
- package/dist/dialtone-vue.js +24 -31
- package/dist/emoji.cjs +1 -1
- package/dist/emoji.js +3 -3
- package/dist/{emoji_picker-OJ6lh20K.js → emoji_picker-GfisVsYp.js} +1 -1
- package/dist/{emoji_picker-z-B8k83O.cjs → emoji_picker-zi8qwHtl.cjs} +1 -1
- package/dist/{emoji_text_wrapper-KI_hDGH2.cjs → emoji_text_wrapper-JQf6BpGc.cjs} +1 -1
- package/dist/{emoji_text_wrapper-M-VioW2S.js → emoji_text_wrapper-OrF0kZ6L.js} +1 -1
- package/dist/{index-6ISTdsJ4.js → index-G0QxbVGe.js} +1 -1
- package/dist/index-ihXjcrB-.cjs +1 -0
- package/dist/message_input.cjs +1 -1
- package/dist/message_input.js +3 -3
- package/dist/{rich_text_editor-ZG0IhFjX.cjs → rich_text_editor-MzdHNizj.cjs} +17 -17
- package/dist/{rich_text_editor-vIzUWZRb.js → rich_text_editor-trHmm1VD.js} +1368 -1360
- package/dist/style.css +1 -1
- package/dist/types/components/avatar/avatar.vue.d.ts +27 -9
- package/dist/types/components/avatar/avatar.vue.d.ts.map +1 -1
- package/dist/types/components/list_item/list_item.vue.d.ts +2 -0
- package/dist/types/components/list_item/list_item.vue.d.ts.map +1 -1
- package/dist/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts +4 -2
- package/dist/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts.map +1 -1
- package/dist/types/recipes/item_layout/contact_info/contact_info.vue.d.ts +11 -11
- package/dist/types/recipes/leftbar/callbox/callbox.vue.d.ts +4 -4
- package/dist/types/recipes/leftbar/contact_row/contact_row.vue.d.ts +0 -17
- package/dist/types/recipes/leftbar/contact_row/contact_row.vue.d.ts.map +1 -1
- package/package.json +4 -3
- package/dist/index-sX8rogLr.cjs +0 -1
package/dist/dialtone-vue.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
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-
|
|
2
|
-
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-
|
|
3
|
-
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-
|
|
4
|
-
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-
|
|
1
|
+
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";
|
|
2
|
+
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";
|
|
3
|
+
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";
|
|
4
|
+
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";
|
|
5
5
|
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";
|
|
6
6
|
import { r as zu, c as Gu, x as Qu, v as Xu, w as Zu, V as Ju, f as ef } from "./tooltip-AVHt9lw0.js";
|
|
7
7
|
import pe, { reactive as pa } from "vue";
|
|
8
|
-
import { D as Ae } from "./emoji_text_wrapper-
|
|
8
|
+
import { D as Ae } from "./emoji_text_wrapper-OrF0kZ6L.js";
|
|
9
9
|
const Ze = {
|
|
10
10
|
default: "",
|
|
11
11
|
info: "d-badge--info",
|
|
@@ -7396,7 +7396,7 @@ var el = function() {
|
|
|
7396
7396
|
tl,
|
|
7397
7397
|
!1,
|
|
7398
7398
|
null,
|
|
7399
|
-
"
|
|
7399
|
+
"e8b2c5a4",
|
|
7400
7400
|
null,
|
|
7401
7401
|
null
|
|
7402
7402
|
);
|
|
@@ -7810,8 +7810,8 @@ const Ec = ul.exports, fl = {
|
|
|
7810
7810
|
default: null
|
|
7811
7811
|
},
|
|
7812
7812
|
/**
|
|
7813
|
-
* Avatar's full name, used
|
|
7814
|
-
* to
|
|
7813
|
+
* Avatar's full name, used to extract initials
|
|
7814
|
+
* to display in avatar if `avatarSrc` and `avatarIcon` are empty.
|
|
7815
7815
|
*/
|
|
7816
7816
|
avatarFullName: {
|
|
7817
7817
|
type: String,
|
|
@@ -7833,9 +7833,9 @@ const Ec = ul.exports, fl = {
|
|
|
7833
7833
|
default: "lg"
|
|
7834
7834
|
},
|
|
7835
7835
|
/**
|
|
7836
|
-
* The aria
|
|
7836
|
+
* The aria-labelledby of the button containing avatars
|
|
7837
7837
|
*/
|
|
7838
|
-
|
|
7838
|
+
avatarLabelledBy: {
|
|
7839
7839
|
type: String,
|
|
7840
7840
|
default: ""
|
|
7841
7841
|
},
|
|
@@ -7853,7 +7853,7 @@ const Ec = ul.exports, fl = {
|
|
|
7853
7853
|
* Showing multiple avatars in contact info.
|
|
7854
7854
|
* The props of array items are: <br>
|
|
7855
7855
|
* `src` - avatar image url (optional) <br>
|
|
7856
|
-
* `fullName` - full name, used
|
|
7856
|
+
* `fullName` - full name, used to extract initials to display in avatar<br>
|
|
7857
7857
|
* if `avatarSrc` and `avatarIcon` are empty<br>
|
|
7858
7858
|
* `seed` - determines uniqueness of avatar background <br>
|
|
7859
7859
|
* `text` - text that overlays the avatar (optional) <br>
|
|
@@ -7875,9 +7875,9 @@ const Ec = ul.exports, fl = {
|
|
|
7875
7875
|
var hl = function() {
|
|
7876
7876
|
var e = this, a = e._self._c;
|
|
7877
7877
|
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() {
|
|
7878
|
-
return [a("button", { staticClass: "dt-contact-info__left", attrs: { "data-qa": "contact-info-left", "aria-labelledby": e.
|
|
7879
|
-
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 }] } });
|
|
7880
|
-
}), 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)];
|
|
7878
|
+
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) {
|
|
7879
|
+
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 }] } });
|
|
7880
|
+
}), 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)];
|
|
7881
7881
|
}, proxy: !0 } : null, { key: "default", fn: function() {
|
|
7882
7882
|
return [a("div", { attrs: { "data-qa": "contact-info-header" } }, [e._t("header")], 2)];
|
|
7883
7883
|
}, proxy: !0 }, { key: "subtitle", fn: function() {
|
|
@@ -7893,7 +7893,7 @@ var hl = function() {
|
|
|
7893
7893
|
pl,
|
|
7894
7894
|
!1,
|
|
7895
7895
|
null,
|
|
7896
|
-
"
|
|
7896
|
+
"a3c913d1",
|
|
7897
7897
|
null,
|
|
7898
7898
|
null
|
|
7899
7899
|
);
|
|
@@ -8639,14 +8639,6 @@ const Fc = Ql.exports, Xl = {
|
|
|
8639
8639
|
type: String,
|
|
8640
8640
|
default: ""
|
|
8641
8641
|
},
|
|
8642
|
-
/**
|
|
8643
|
-
* Optional avatar image alt text.
|
|
8644
|
-
* If not provided it will use the name.
|
|
8645
|
-
*/
|
|
8646
|
-
avatarAlt: {
|
|
8647
|
-
type: String,
|
|
8648
|
-
default: ""
|
|
8649
|
-
},
|
|
8650
8642
|
/**
|
|
8651
8643
|
* Determines whether to show the presence indicator for
|
|
8652
8644
|
* Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',
|
|
@@ -8791,7 +8783,7 @@ const Fc = Ql.exports, Xl = {
|
|
|
8791
8783
|
var Zl = function() {
|
|
8792
8784
|
var e = this, a = e._self._c;
|
|
8793
8785
|
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() {
|
|
8794
|
-
return [a("dt-avatar", { attrs: { "full-name": e.name, "image-src": e.avatarSrc, "image-alt":
|
|
8786
|
+
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 } })];
|
|
8795
8787
|
}, proxy: !0 }, { key: "label", fn: function() {
|
|
8796
8788
|
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)];
|
|
8797
8789
|
}, proxy: !0 }]) }, "dt-recipe-general-row", e.$attrs, !1), e.$listeners));
|
|
@@ -8883,7 +8875,8 @@ const Hc = id.exports, _t = {
|
|
|
8883
8875
|
default: !1
|
|
8884
8876
|
},
|
|
8885
8877
|
/**
|
|
8886
|
-
*
|
|
8878
|
+
* Optional avatar image url.
|
|
8879
|
+
* If not provided it will use extracted initials from displayName.
|
|
8887
8880
|
*/
|
|
8888
8881
|
avatarImageUrl: {
|
|
8889
8882
|
type: String,
|
|
@@ -9018,7 +9011,7 @@ var ld = function() {
|
|
|
9018
9011
|
var e = this, a = e._self._c;
|
|
9019
9012
|
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() {
|
|
9020
9013
|
return [e.showHeader ? a("div", { staticClass: "dt-feed-item-row__avatar-container" }, [e._t("avatar", function() {
|
|
9021
|
-
return [a("dt-avatar", { attrs: { "full-name": e.displayName, "image-src": e.avatarImageUrl, seed: e.avatarSeed } })];
|
|
9014
|
+
return [a("dt-avatar", { attrs: { "full-name": e.displayName, "image-src": e.avatarImageUrl, "image-alt": "", seed: e.avatarSeed } })];
|
|
9022
9015
|
})], 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) + " ")])];
|
|
9023
9016
|
}, proxy: !0 }, { key: "bottom", fn: function() {
|
|
9024
9017
|
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() {
|
|
|
9031
9024
|
dd,
|
|
9032
9025
|
!1,
|
|
9033
9026
|
null,
|
|
9034
|
-
"
|
|
9027
|
+
"c255872d",
|
|
9035
9028
|
null,
|
|
9036
9029
|
null
|
|
9037
9030
|
);
|
|
@@ -9965,8 +9958,8 @@ const Kc = Ud.exports, vt = {
|
|
|
9965
9958
|
default: ""
|
|
9966
9959
|
},
|
|
9967
9960
|
/**
|
|
9968
|
-
* Avatar's full name, used
|
|
9969
|
-
* to
|
|
9961
|
+
* Avatar's full name, used to extract initials
|
|
9962
|
+
* to display if `avatarSrc` is empty.
|
|
9970
9963
|
*/
|
|
9971
9964
|
avatarFullName: {
|
|
9972
9965
|
type: String,
|
|
@@ -10039,7 +10032,7 @@ const Kc = Ud.exports, vt = {
|
|
|
10039
10032
|
};
|
|
10040
10033
|
var Yd = function() {
|
|
10041
10034
|
var e = this, a = e._self._c;
|
|
10042
|
-
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() {
|
|
10035
|
+
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() {
|
|
10043
10036
|
return [a("dt-badge", { class: e.badgeClass, attrs: { text: e.badgeText } })];
|
|
10044
10037
|
})], 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()])]);
|
|
10045
10038
|
}, Kd = [], zd = /* @__PURE__ */ c(
|
|
@@ -10048,7 +10041,7 @@ var Yd = function() {
|
|
|
10048
10041
|
Kd,
|
|
10049
10042
|
!1,
|
|
10050
10043
|
null,
|
|
10051
|
-
"
|
|
10044
|
+
"ef08f46e",
|
|
10052
10045
|
null,
|
|
10053
10046
|
null
|
|
10054
10047
|
);
|
package/dist/emoji.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-ihXjcrB-.cjs"),t=require("./emoji_text_wrapper-JQf6BpGc.cjs"),o=require("./emoji_picker-zi8qwHtl.cjs");require("./tooltip-6msmWvq0.cjs");require("vue");exports.DtEmoji=e.DtEmoji;exports.codeToEmojiData=e.codeToEmojiData;Object.defineProperty(exports,"customEmojiAssetUrl",{enumerable:!0,get:()=>e.customEmojiAssetUrl});exports.defaultEmojiAssetUrl=e.defaultEmojiAssetUrl;Object.defineProperty(exports,"emojiFileExtensionLarge",{enumerable:!0,get:()=>e.emojiFileExtensionLarge});Object.defineProperty(exports,"emojiFileExtensionSmall",{enumerable:!0,get:()=>e.emojiFileExtensionSmall});Object.defineProperty(exports,"emojiImageUrlLarge",{enumerable:!0,get:()=>e.emojiImageUrlLarge});Object.defineProperty(exports,"emojiImageUrlSmall",{enumerable:!0,get:()=>e.emojiImageUrlSmall});exports.emojiJson=e.emojiJson;exports.emojiVersion=e.emojiVersion;exports.filterValidShortCodes=e.filterValidShortCodes;exports.findEmojis=e.findEmojis;exports.findShortCodes=e.findShortCodes;exports.getEmojiData=e.getEmojiData;exports.setCustomEmojiJson=e.setCustomEmojiJson;exports.setCustomEmojiUrl=e.setCustomEmojiUrl;exports.setEmojiAssetUrlLarge=e.setEmojiAssetUrlLarge;exports.setEmojiAssetUrlSmall=e.setEmojiAssetUrlSmall;exports.shortcodeToEmojiData=e.shortcodeToEmojiData;exports.stringToUnicode=e.stringToUnicode;exports.unicodeToString=e.unicodeToString;exports.validateCustomEmojiJson=e.validateCustomEmojiJson;exports.DtEmojiTextWrapper=t.DtEmojiTextWrapper;exports.CDN_URL=o.CDN_URL;exports.DtEmojiPicker=o.DtEmojiPicker;exports.EMOJIS_PER_ROW=o.EMOJIS_PER_ROW;exports.EMOJI_PICKER_CATEGORIES=o.EMOJI_PICKER_CATEGORIES;exports.EMOJI_PICKER_SKIN_TONE_MODIFIERS=o.EMOJI_PICKER_SKIN_TONE_MODIFIERS;
|
package/dist/emoji.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { D as i, o as m, c as t, d as r, g as E, b as j, f as l, a as n, h as d, e as D, q as I, r as C, p as S, i as g, l as U, k as _, j as f, s as p, m as c, n as u, u as O, v as R } from "./index-
|
|
2
|
-
import { D as x } from "./emoji_text_wrapper-
|
|
3
|
-
import { C as A, D as h, E as L, b as M, a as P } from "./emoji_picker-
|
|
1
|
+
import { D as i, o as m, c as t, d as r, g as E, b as j, f as l, a as n, h as d, e as D, q as I, r as C, p as S, i as g, l as U, k as _, j as f, s as p, m as c, n as u, u as O, v as R } from "./index-G0QxbVGe.js";
|
|
2
|
+
import { D as x } from "./emoji_text_wrapper-OrF0kZ6L.js";
|
|
3
|
+
import { C as A, D as h, E as L, b as M, a as P } from "./emoji_picker-GfisVsYp.js";
|
|
4
4
|
import "./tooltip-AVHt9lw0.js";
|
|
5
5
|
import "vue";
|
|
6
6
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const d=require("./index-sX8rogLr.cjs"),m=require("./tooltip-6msmWvq0.cjs");require("vue");const b={name:"EmojiTabset",components:{DtTabGroup:d.DtTabGroup,DtTab:d.DtTab,DtIcon:d.DtIcon},props:{showRecentlyUsedTab:{type:Boolean,default:!1},scrollIntoTab:{type:Number,required:!0},isScrolling:{type:Boolean,default:!1},emojiFilter:{type:String,default:""},tabSetLabels:{type:Array,required:!0}},data(){return{selectedTab:"1",tabsetRef:[],TABS_DATA:[{label:u.MOST_RECENTLY_USED,icon:"clock"},{label:u.SMILEYS_AND_PEOPLE,icon:"satisfied"},{label:u.NATURE,icon:"living-thing"},{label:u.FOOD,icon:"food"},{label:u.ACTIVITY,icon:"object"},{label:u.TRAVEL,icon:"transportation"},{label:u.OBJECTS,icon:"lightbulb"},{label:u.SYMBOLS,icon:"heart"},{label:u.FLAGS,icon:"flag"}]}},computed:{tabs(){return(this.showRecentlyUsedTab?this.TABS_DATA:this.TABS_DATA.slice(1)).map((e,i)=>({...e,label:this.tabSetLabels[i],id:(i+1).toString(),panelId:(i+1).toString()}))},isSearching(){return this.emojiFilter.length>0}},watch:{scrollIntoTab:function(t){!this.isScrolling&&!this.isSearching&&(this.selectedTab=(t+1).toString())},isSearching:function(t){t&&(this.selectedTab=null)}},mounted(){this.$nextTick(()=>{this.setTabsetRef()})},methods:{selectTabset(t){this.isScrolling||(this.selectedTab=t),this.$emit("selected-tabset",t)},setTabsetRef(){this.tabs.forEach((t,e)=>{const i=`tabsetRef-${e}`;this.$refs[i]&&this.$set(this.tabsetRef,e,this.$refs[i][0].$el)})},focusTabset(){this.tabsetRef[0]&&this.tabsetRef[0].focus()},handleKeyDown(t,e){t.key==="Enter"&&(this.selectTabset(e),this.tabsetRef[e-1]&&this.tabsetRef[e-1].blur()),t.key==="Tab"&&(t.preventDefault(),t.shiftKey?this.$emit("focus-skin-selector"):this.$emit("focus-search-input")),t.key==="ArrowDown"&&this.$emit("focus-search-input")}}};var _=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__tabset"},[i("dt-tab-group",{attrs:{"tab-list-class":"d-emoji-picker__tabset-list",selected:e.selectedTab},scopedSlots:e._u([{key:"tabs",fn:function(){return e._l(e.tabs,function(s,n){return i("dt-tab",{key:s.id,ref:`tabsetRef-${n}`,refInFor:!0,attrs:{id:s.id,"panel-id":s.panelId,label:s.label,"aria-controls":"d-emoji-picker-list",tabindex:n+1},on:{"!click":function(o){return o.stopPropagation(),e.selectTabset(s.id)},keydown:function(o){return e.handleKeyDown(o,s.id)}}},[i("dt-icon",{attrs:{size:"400",name:s.icon}})],1)})},proxy:!0}])})],1)},k=[],j=m.normalizeComponent(b,_,k,!1,null,null,null,null);const g=j.exports,y={name:"EmojiSearch",components:{DtInput:d.DtInput,DtIcon:d.DtIcon},props:{searchPlaceholderLabel:{type:String,required:!0},modelValue:{type:String,default:""}},mounted(){this.focusSearchInput()},methods:{updateModelValue(t){this.$emit("update:model-value",t)},focusEmojiSelector(){this.$emit("focus-emoji-selector")},focusTabset(){this.$emit("focus-tabset")},selectFirstEmoji(){this.$emit("select-first-emoji")},clearSearch(){this.$emit("update:model-value",""),this.focusSearchInput()},focusSearchInput(){this.$refs.searchInputRef.focus()}}};var R=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__search d-emoji-picker__alignment"},[i("dt-input",{ref:"searchInputRef",attrs:{id:"searchInput",placeholder:e.searchPlaceholderLabel,value:e.modelValue},on:{input:e.updateModelValue,keydown:[function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"up",38,s.key,["Up","ArrowUp"])?null:e.focusTabset.apply(null,arguments)},function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"down",40,s.key,["Down","ArrowDown"])?null:(s.preventDefault(),e.focusEmojiSelector.apply(null,arguments))},function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"enter",13,s.key,"Enter")?null:e.selectFirstEmoji.apply(null,arguments)}]},scopedSlots:e._u([{key:"leftIcon",fn:function(){return[i("dt-icon",{attrs:{name:"search"}})]},proxy:!0},e.modelValue.length>0?{key:"rightIcon",fn:function(){return[i("button",{staticClass:"d-emoji-picker__search-button",on:{click:e.clearSearch,keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"enter",13,s.key,"Enter")?null:e.clearSearch.apply(null,arguments)}}},[i("dt-icon",{attrs:{name:"close"}})],1)]},proxy:!0}:null],null,!0)})],1)},S=[],E=m.normalizeComponent(y,R,S,!1,null,null,null,null);const $=E.exports,T={name:"EmojiSelector",props:{emojiFilter:{type:String,default:""},skinTone:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},selectedTabset:{type:Object,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},recentlyUsedEmojis:{type:Array,default:()=>[]}},data(){return{emojiRefs:[],emojiFilteredRefs:[],isFiltering:!1,hoverFirstEmoji:!0,fixedLabel:"",filteredEmojis:[],TABS_DATA:["Recently used","People","Nature","Food","Activity","Travel","Objects","Symbols","Flags"],tabLabelObserver:null}},computed:{currentEmojis(){return[...this.emojis[`People${this.skinTone}`]||[],...this.emojis.Nature||[],...this.emojis.Food||[],...this.emojis[`Activity${this.skinTone}`]||[],...this.emojis.Travel||[],...this.emojis[`Objects${this.skinTone}`]||[],...this.emojis.Symbols||[],...this.emojis.Flags||[]]},emojis(){return d.emojisGrouped},CDN_URL(){return p},tabLabels(){return this.recentlyUsedEmojis.length?this.tabSetLabels.map((t,e)=>({label:t,ref:this.$refs[`tabLabelRef-${e}`]})):this.tabSetLabels.slice(1).map((t,e)=>({label:t,ref:this.$refs[`tabLabelRef-${e}`]}))},tabs(){return this.recentlyUsedEmojis.length?this.TABS_DATA:this.TABS_DATA.slice(1)}},watch:{currentEmojis:{handler(){this.searchByNameAndKeywords()},immediate:!0},recentlyUsedEmojis:{handler(t){this.emojis["Recently used"]=t},immediate:!0},emojiFilter:{handler(t){this.resetScroll(),t?this.isFiltering=!0:(this.isFiltering=!1,this.$emit("highlighted-emoji",null)),this.debouncedSearch()}},selectedTabset:{handler(t){this.scrollToTab(t.tabId)},deep:!0}},created(){this.debouncedSearch=this.debounce(this.searchByNameAndKeywords,300)},mounted(){this.$nextTick(()=>{this.setupEmojiRefs(),this.setupFilteredRefs(),this.setupTabLabelRefs(),this.setTabLabelObserver()})},beforeDestroy(){this.tabLabelObserver&&this.tabLabelObserver.disconnect()},methods:{setupTabLabelRefs(){var t;(t=this.tabSetLabels)==null||t.forEach((e,i)=>{const s=`tabLabelRef-${i}`;this.$refs[s]&&this.$set(this.tabLabels,i,{label:e,ref:this.$refs[s]})})},setupFilteredRefs(){this.emojiFilteredRefs=[],this.filteredEmojis.forEach((t,e)=>{const i=`filteredEmoji-${e}`;this.$refs[i]&&this.setFilteredRef(this.$refs[i],e)})},setupEmojiRefs(){for(let t=0;t<this.tabs.length;t++){const e=`emojiRef-${t}`;this.$refs[e]&&this.$refs[e].forEach((i,s)=>{i&&this.setEmojiRef(i,t,s)})}},searchByNameAndKeywords(){const t=this.emojiFilter.toLowerCase();this.filteredEmojis=this.currentEmojis.filter(function(e){const i=e.name.toLowerCase().includes(t),s=e.keywords.some(function(n){return n.toLowerCase().includes(t)});return i||s}),this.$nextTick(function(){t&&(this.hoverEmoji(this.filteredEmojis[0],!0),this.setupFilteredRefs())})},debounce:function(t,e){e===void 0&&(e=300);let i;return function(){const s=[];let n=arguments.length;for(;n--;)s[n]=arguments[n];clearTimeout(i),i=setTimeout(function(){t.apply(void 0,s)},e)}},getImgSrc:function(t){return this.CDN_URL+t+".png"},handleImageError:function(t){t.target.parentNode.style.display="none"},scrollToTab:function(t,e){const i=this;e===void 0&&(e=!0);const n=i.tabLabels[t-1].ref[0];i.$nextTick(function(){const o=i.$refs.listRef,r=t==="1"?0:n.offsetTop-20;let l=!0,c=o.scrollTop;i.$emit("is-scrolling",!0),o.addEventListener("scroll",function(){if(l){const f=o.scrollTop;(c<f&&f>=r||c>f&&f<=r)&&(l=!1,i.$emit("is-scrolling",!1)),c=f}}),o.scrollTop=r,e&&i.focusEmoji(t-1,0)})},resetScroll:function(){const t=this.$refs.listRef;t.scrollTop=0},focusEmojiSelector:function(){this.focusEmoji(0,0)},hoverEmoji(t,e){e===void 0&&(e=!1),this.hoverFirstEmoji=e,this.$emit("highlighted-emoji",t)},setEmojiRef:function(t,e,i){this.emojiRefs[e]||this.$set(this.emojiRefs,e,[]),this.$set(this.emojiRefs[e],i,t)},setFilteredRef:function(t,e){this.$set(this.emojiFilteredRefs,e,t)},focusEmoji:function(t,e){var s;const i=this.isFiltering?(s=this.emojiFilteredRefs[e])==null?void 0:s[0]:this.emojiRefs[t]&&this.emojiRefs[t][e];return i?(i.focus(),!0):!1},handleKeyDown:function(t,e,i,s){var n,o;if(t.preventDefault(),t.key==="ArrowUp"){const r=i%a;if(e===0){const l=a-this.emojiRefs[this.emojiRefs.length-1].length%a,c=this.emojiRefs[this.emojiRefs.length-1].length+l-(a-r);this.focusEmoji(this.emojiRefs.length-1,c)||this.focusEmoji(this.emojiRefs.length-1,this.emojiRefs[this.emojiRefs.length-1].length-1);return}if(!this.focusEmoji(e,i-a)){const l=e-1<0?0:e-1,c=this.emojiRefs[l].length,f=c-c%a+r;this.focusEmoji(l,f)||this.focusEmoji(e-1,this.emojiRefs[e-1].length-1)}}if(t.key==="ArrowDown"&&!this.focusEmoji(e,i+a)){const r=i%a;(o=(n=this.emojiRefs)==null?void 0:n[e])!=null&&o[i+(a-r)]?this.focusEmoji(e,this.emojiRefs[e].length-1):this.focusEmoji(e+1,r)||this.focusEmoji(0,r)||this.focusEmoji(0,this.emojiRefs[0].length-1)}t.key==="ArrowLeft"&&this.handleHorizontalNavigation("left",e,i),t.key==="ArrowRight"&&this.handleHorizontalNavigation("right",e,i),t.key==="Tab"&&(this.focusEmoji(e+1,0)?this.scrollToTab(e+1+1,!1):this.$emit("focus-skin-selector")),t.key==="Tab"&&t.shiftKey&&(this.focusEmoji(e,0)&&e>0?this.scrollToTab(e,!0):(this.scrollToTab(1,!1),this.$emit("focus-search-input"))),t.key==="Enter"&&this.$emit("selected-emoji",s)},handleHorizontalNavigation:function(t,e,i){this.isFiltering?t==="left"?this.handleArrowLeftFiltered(e,i):t==="right"&&this.handleArrowRightFiltered(e,i):t==="left"?this.handleArrowLeft(e,i):t==="right"&&this.handleArrowRight(e,i)},handleArrowLeftFiltered:function(t,e){this.focusEmoji(0,e-1)||this.focusEmoji(0,this.emojiFilteredRefs.length-1)},handleArrowRightFiltered:function(t,e){this.focusEmoji(0,e+1)||this.focusEmoji(0,0)},handleArrowLeft:function(t,e){this.focusEmoji(t,e-1)||(this.emojiRefs[t-1]?this.focusEmoji(t-1,this.emojiRefs[t-1].length-1):this.focusEmoji(this.emojiRefs.length-1,this.emojiRefs[this.emojiRefs.length-1].length-1))},handleArrowRight:function(t,e){this.focusEmoji(t,e+1)||this.focusEmoji(t+1,0)||this.focusEmoji(0,0)},handleKeyDownFilteredEmojis(t,e,i){var s;if(t.preventDefault(),this.hoverFirstEmoji=!1,t.key==="ArrowUp"){const n=e%a;if(!this.focusEmoji(0,e-a)){const o=this.emojiFilteredRefs.length-this.emojiFilteredRefs.length%a+n;this.focusEmoji(0,o),this.focusEmoji(0,o)||this.focusEmoji(0,this.emojiFilteredRefs.length-1)}}if(t.key==="ArrowDown"&&!this.focusEmoji(0,e+a)){const n=e%a;(s=this.emojiFilteredRefs)!=null&&s[e+(a-n)]?this.focusEmoji(0,this.emojiFilteredRefs.length-1):this.focusEmoji(0,n)}t.key==="ArrowLeft"&&this.handleHorizontalNavigation("left",0,e),t.key==="ArrowRight"&&this.handleHorizontalNavigation("right",0,e),t.key==="Tab"&&this.$emit("focus-skin-selector"),t.key==="Enter"&&this.$emit("selected-emoji",i)},setTabLabelObserver(){this.tabLabelObserver=new IntersectionObserver(t=>{t.forEach(e=>{var n,o,r,l,c,f;const{target:i}=e,s=parseInt(i.dataset.index);e.isIntersecting&&i.offsetTop<=((n=this.$refs.tabCategoryRef)==null?void 0:n.offsetTop)+50?(this.fixedLabel=((o=this.tabLabels[s-1])==null?void 0:o.label)??((r=this.tabLabels[0])==null?void 0:r.label),this.$emit("scroll-into-tab",s-1)):e.boundingClientRect.bottom<=((l=this.$refs.tabCategoryRef)==null?void 0:l.getBoundingClientRect().bottom)?(this.$emit("scroll-into-tab",s),this.fixedLabel=(c=this.tabLabels[s])==null?void 0:c.label):s===1&&(this.$emit("scroll-into-tab",s),this.fixedLabel=(f=this.tabLabels[0])==null?void 0:f.label)})}),this.tabLabelObserver.observe(this.$refs.tabCategoryRef),Array.from(this.$refs.listRef.children).forEach((t,e)=>{this.tabLabelObserver.observe(t),t.dataset.index=e})},focusLastEmoji(){this.focusEmoji(this.tabs.length-1,0)}}};var v=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__selector"},[i("div",{ref:"listRef",staticClass:"d-emoji-picker__list",attrs:{id:"d-emoji-picker-list"}},[e.emojiFilter?i("p",{staticClass:"d-emoji-picker__search-label d-emoji-picker__alignment"},[e._v(" "+e._s(e.filteredEmojis.length>0?e.searchResultsLabel:e.searchNoResultsLabel)+" ")]):i("div",{ref:"tabCategoryRef",staticClass:"d-emoji-picker__category d-emoji-picker__alignment"},[i("p",[e._v(" "+e._s(e.fixedLabel)+" ")])]),e._l(e.tabLabels,function(s,n){return i("div",{directives:[{name:"show",rawName:"v-show",value:!e.emojiFilter,expression:"!emojiFilter"}],key:n,ref:`tabLabelRef-${n}`,refInFor:!0,staticClass:"d-emoji-picker__alignment"},[n?i("p",[e._v(" "+e._s(s.label)+" ")]):e._e(),i("div",{staticClass:"d-emoji-picker__tab"},e._l(e.emojis[e.tabs[n]+e.skinTone]?e.emojis[e.tabs[n]+e.skinTone]:e.emojis[e.tabs[n]],function(o,r){return i("button",{key:o.shortname,ref:`emojiRef-${n}`,refInFor:!0,attrs:{type:"button","aria-label":o.name},on:{click:function(l){return e.$emit("selected-emoji",o)},focusin:function(l){return e.$emit("highlighted-emoji",o)},focusout:function(l){return e.$emit("highlighted-emoji",null)},mouseover:function(l){return e.$emit("highlighted-emoji",o)},mouseleave:function(l){return e.$emit("highlighted-emoji",null)},keydown:l=>e.handleKeyDown(l,n,r,o)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:o.name,"aria-label":o.name,title:o.name,src:e.getImgSrc(o.unicode_character)},on:{error:e.handleImageError}})])}),0)])}),e.emojiFilter?i("div",{staticClass:"d-emoji-picker__alignment"},[i("div",{staticClass:"d-emoji-picker__tab",attrs:{"data-qa":"filtered-emojis"}},e._l(e.filteredEmojis,function(s,n){return i("button",{key:s.shortname,ref:`filteredEmoji-${n}`,refInFor:!0,class:{"hover-emoji":n===0&&e.hoverFirstEmoji},attrs:{type:"button","aria-label":s.name},on:{click:function(o){return e.$emit("selected-emoji",s)},focusin:function(o){return e.$emit("highlighted-emoji",s)},focusout:function(o){return e.$emit("highlighted-emoji",null)},mouseover:function(o){return e.hoverEmoji(s)},mouseleave:function(o){return e.hoverEmoji(null)},keydown:o=>e.handleKeyDownFilteredEmojis(o,n,s)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:s.name,"aria-label":s.name,title:s.name,src:`${e.CDN_URL+s.unicode_character}.png`}})])}),0)]):e._e()],2)])},L=[],w=m.normalizeComponent(T,v,L,!1,null,null,null,null);const I=w.exports,p="https://static.dialpadcdn.com/joypixels/png/unicode/32/",a=9,h={DEFAULT:"Default",LIGHT:"Light",MEDIUM_LIGHT:"MediumLight",MEDIUM:"Medium",MEDIUM_DARK:"MediumDark",DARK:"Dark"},u={MOST_RECENTLY_USED:"Most recently used",SMILEYS_AND_PEOPLE:"Smileys and people",NATURE:"Nature",FOOD:"Food",ACTIVITY:"Activity",TRAVEL:"Travel",OBJECTS:"Objects",SYMBOLS:"Symbols",FLAGS:"Flags"},D={name:"EmojiDescription",props:{emoji:{type:Object,default:()=>null}},data(){return{CDN_URL:p}}};var C=function(){var s;var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__data"},[e.emoji?i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:e.emoji.name,"aria-label":e.emoji.name,title:e.emoji.name,src:`${e.CDN_URL+e.emoji.unicode_character}.png`}}):e._e(),e._v(" "+e._s((s=e.emoji)==null?void 0:s.name)+" ")])},A=[],F=m.normalizeComponent(D,C,A,!1,null,null,null,null);const O=F.exports,N={name:"EmojiSkinSelector",components:{DtTooltip:m.DtTooltip},props:{skinTone:{type:String,required:!0},isHovering:{type:Boolean,default:!1},skinSelectorButtonTooltipLabel:{type:String,required:!0}},data(){return{isOpen:!1,skinSelected:null,skinsRef:[],cdnUrl:p}},computed:{skinPassedIn(){return this.skinList.find(t=>t.skinTone===this.skinTone)},skinList(){return[{name:":wave_tone1:",unicode_output:"1f44b-1f3fb",skinTone:h.LIGHT,skinCode:"_tone1"},{name:":wave_tone2:",unicode_output:"1f44b-1f3fc",skinTone:h.MEDIUM_LIGHT,skinCode:"_tone2"},{name:":wave_tone3:",unicode_output:"1f44b-1f3fd",skinTone:h.MEDIUM,skinCode:"_tone3"},{name:":wave_tone4:",unicode_output:"1f44b-1f3fe",skinTone:h.MEDIUM_DARK,skinCode:"_tone4"},{name:":wave_tone5:",unicode_output:"1f44b-1f3ff",skinTone:h.DARK,skinCode:"_tone5"},{name:":wave:",unicode_output:"1f44b",skinTone:h.DEFAULT,skinCode:""}]}},watch:{isHovering(t){t&&(this.isOpen=!1)},skinTone(t,e){t!==e&&(this.skinSelected=this.skinPassedIn)}},mounted(){this.skinSelected=this.skinPassedIn,this.$nextTick(()=>{this.setupSkinRefs()})},methods:{setupSkinRefs(){this.skinList.forEach((t,e)=>{const i=`skinRef-${e}`;this.$refs[i]&&this.$set(this.skinsRef,e,this.$refs[i][0])})},focusSkinSelector(){this.$refs.skinSelectorRef&&this.$refs.skinSelectorRef.focus()},selectSkin(t){this.skinSelected=t,this.isOpen=!1,this.$emit("skin-tone",t.skinTone),this.$nextTick(()=>{this.focusSkinSelector()})},handleKeyDown(t,e,i){var s,n,o,r;t.preventDefault(),t.key==="ArrowLeft"&&(i===0&&((s=this.skinsRef[this.skinsRef.length-1])==null||s.focus()),(n=this.skinsRef[i-1])==null||n.focus()),t.key==="ArrowRight"&&(this.skinsRef.length&&((o=this.skinsRef[0])==null||o.focus()),(r=this.skinsRef[i+1])==null||r.focus()),t.key==="Enter"&&(e?this.selectSkin(e):this.toggleSkinList()),t.key==="Tab"&&(t.shiftKey?this.$emit("focus-last-emoji"):this.$emit("focus-tabset"))},toggleSkinList(){this.isOpen=!this.isOpen,this.$nextTick(()=>{this.skinsRef[0]&&this.skinsRef[0].focus()})}}};var U=function(){var e=this,i=e._self._c;return i("div",{attrs:{"data-qa":"skin-selector"}},[i("div",{directives:[{name:"show",rawName:"v-show",value:e.isOpen,expression:"isOpen"}],staticClass:"d-emoji-picker__skin-list"},e._l(e.skinList,function(s,n){var o;return i("button",{key:s.name,ref:`skinRef-${n}`,refInFor:!0,class:{selected:((o=e.skinSelected)==null?void 0:o.skinCode)===s.skinCode},on:{click:function(r){return e.selectSkin(s)},keydown:r=>e.handleKeyDown(r,s,n)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:s.name,"aria-label":s.name,title:s.name,src:`${e.cdnUrl+s.unicode_output}.png`}})])}),0),i("div",{directives:[{name:"show",rawName:"v-show",value:!e.isOpen,expression:"!isOpen"}],staticClass:"d-emoji-picker__skin-selected"},[i("dt-tooltip",{attrs:{placement:"top-end"},scopedSlots:e._u([{key:"anchor",fn:function(){var s,n,o,r;return[i("button",{ref:"skinSelectorRef",attrs:{"aria-label":e.skinSelectorButtonTooltipLabel,tabindex:"-1"},on:{click:e.toggleSkinList,keydown:l=>e.handleKeyDown(l)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:(s=e.skinSelected)==null?void 0:s.name,"aria-label":(n=e.skinSelected)==null?void 0:n.name,title:(o=e.skinSelected)==null?void 0:o.name,src:`${e.cdnUrl+((r=e.skinSelected)==null?void 0:r.unicode_output)}.png`}})])]},proxy:!0}])},[e._v(" "+e._s(e.skinSelectorButtonTooltipLabel)+" ")])],1)])},M=[],K=m.normalizeComponent(N,U,M,!1,null,null,null,null);const P=K.exports,B={name:"DtEmojiPicker",components:{EmojiTabset:g,EmojiSearch:$,EmojiSelector:I,EmojiDescription:O,EmojiSkinSelector:P},props:{recentlyUsedEmojis:{type:Array},searchPlaceholderLabel:{type:String,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},skinTone:{type:String},skinSelectorButtonTooltipLabel:{type:String,required:!0}},data(){return{searchQuery:"",highlightedEmoji:null,selectedTabset:{},scrollIntoTab:0,isScrolling:!1}},computed:{showRecentlyUsedTab(){var t;return((t=this.recentlyUsedEmojis)==null?void 0:t.length)>0}},methods:{scrollToSelectedTabset(t){this.searchQuery="",this.selectedTabset={...this.selectedTabset,tabId:t}},updateScrollIntoTab(t){this.scrollIntoTab=t},updateIsScrolling(t){this.isScrolling=t},updateHighlightedEmoji(t){this.highlightedEmoji=t}}};var q=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker"},[i("div",{staticClass:"d-emoji-picker--header"},[i("emoji-tabset",{ref:"tabsetRef",attrs:{"emoji-filter":e.searchQuery,"show-recently-used-tab":e.showRecentlyUsedTab,"scroll-into-tab":e.scrollIntoTab,"tab-set-labels":e.tabSetLabels,"is-scrolling":e.isScrolling},on:{"focus-search-input":function(s){return e.$refs.searchInputRef.focusSearchInput()},"focus-skin-selector":function(s){return e.$refs.skinSelectorRef.focusSkinSelector()},"selected-tabset":e.scrollToSelectedTabset},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1),i("div",{staticClass:"d-emoji-picker--body"},[i("emoji-search",{ref:"searchInputRef",attrs:{"model-value":e.searchQuery,"search-placeholder-label":e.searchPlaceholderLabel},on:{"update:model-value":s=>e.searchQuery=s,"select-first-emoji":function(s){return e.$emit("selected-emoji",e.highlightedEmoji)},"focus-tabset":function(s){return e.$refs.tabsetRef.focusTabset()},"focus-emoji-selector":function(s){return e.$refs.emojiSelectorRef.focusEmojiSelector()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}}),i("emoji-selector",{ref:"emojiSelectorRef",attrs:{"emoji-filter":e.searchQuery,"skin-tone":e.skinTone,"tab-set-labels":e.tabSetLabels,"search-results-label":e.searchResultsLabel,"search-no-results-label":e.searchNoResultsLabel,"recently-used-emojis":e.recentlyUsedEmojis,"selected-tabset":e.selectedTabset},on:{"scroll-into-tab":e.updateScrollIntoTab,"is-scrolling":e.updateIsScrolling,"highlighted-emoji":e.updateHighlightedEmoji,"selected-emoji":function(s){return e.$emit("selected-emoji",s)},"focus-skin-selector":function(s){return e.$refs.skinSelectorRef.focusSkinSelector()},"focus-search-input":function(s){return e.$refs.searchInputRef.focusSearchInput()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1),i("div",{staticClass:"d-emoji-picker--footer"},[i("emoji-description",{attrs:{emoji:e.highlightedEmoji}}),i("emoji-skin-selector",{ref:"skinSelectorRef",attrs:{"is-hovering":!!e.highlightedEmoji,"skin-selector-button-tooltip-label":e.skinSelectorButtonTooltipLabel,"skin-tone":e.skinTone},on:{"skin-tone":function(s){return e.$emit("skin-tone",s)},"focus-tabset":function(s){return e.$refs.tabsetRef.focusTabset()},"focus-last-emoji":function(s){return e.$refs.emojiSelectorRef.focusLastEmoji()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1)])},z=[],H=m.normalizeComponent(B,q,z,!1,null,null,null,null);const G=H.exports;exports.CDN_URL=p;exports.DtEmojiPicker=G;exports.EMOJIS_PER_ROW=a;exports.EMOJI_PICKER_CATEGORIES=u;exports.EMOJI_PICKER_SKIN_TONE_MODIFIERS=h;
|
|
1
|
+
"use strict";const d=require("./index-ihXjcrB-.cjs"),m=require("./tooltip-6msmWvq0.cjs");require("vue");const b={name:"EmojiTabset",components:{DtTabGroup:d.DtTabGroup,DtTab:d.DtTab,DtIcon:d.DtIcon},props:{showRecentlyUsedTab:{type:Boolean,default:!1},scrollIntoTab:{type:Number,required:!0},isScrolling:{type:Boolean,default:!1},emojiFilter:{type:String,default:""},tabSetLabels:{type:Array,required:!0}},data(){return{selectedTab:"1",tabsetRef:[],TABS_DATA:[{label:u.MOST_RECENTLY_USED,icon:"clock"},{label:u.SMILEYS_AND_PEOPLE,icon:"satisfied"},{label:u.NATURE,icon:"living-thing"},{label:u.FOOD,icon:"food"},{label:u.ACTIVITY,icon:"object"},{label:u.TRAVEL,icon:"transportation"},{label:u.OBJECTS,icon:"lightbulb"},{label:u.SYMBOLS,icon:"heart"},{label:u.FLAGS,icon:"flag"}]}},computed:{tabs(){return(this.showRecentlyUsedTab?this.TABS_DATA:this.TABS_DATA.slice(1)).map((e,i)=>({...e,label:this.tabSetLabels[i],id:(i+1).toString(),panelId:(i+1).toString()}))},isSearching(){return this.emojiFilter.length>0}},watch:{scrollIntoTab:function(t){!this.isScrolling&&!this.isSearching&&(this.selectedTab=(t+1).toString())},isSearching:function(t){t&&(this.selectedTab=null)}},mounted(){this.$nextTick(()=>{this.setTabsetRef()})},methods:{selectTabset(t){this.isScrolling||(this.selectedTab=t),this.$emit("selected-tabset",t)},setTabsetRef(){this.tabs.forEach((t,e)=>{const i=`tabsetRef-${e}`;this.$refs[i]&&this.$set(this.tabsetRef,e,this.$refs[i][0].$el)})},focusTabset(){this.tabsetRef[0]&&this.tabsetRef[0].focus()},handleKeyDown(t,e){t.key==="Enter"&&(this.selectTabset(e),this.tabsetRef[e-1]&&this.tabsetRef[e-1].blur()),t.key==="Tab"&&(t.preventDefault(),t.shiftKey?this.$emit("focus-skin-selector"):this.$emit("focus-search-input")),t.key==="ArrowDown"&&this.$emit("focus-search-input")}}};var _=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__tabset"},[i("dt-tab-group",{attrs:{"tab-list-class":"d-emoji-picker__tabset-list",selected:e.selectedTab},scopedSlots:e._u([{key:"tabs",fn:function(){return e._l(e.tabs,function(s,n){return i("dt-tab",{key:s.id,ref:`tabsetRef-${n}`,refInFor:!0,attrs:{id:s.id,"panel-id":s.panelId,label:s.label,"aria-controls":"d-emoji-picker-list",tabindex:n+1},on:{"!click":function(o){return o.stopPropagation(),e.selectTabset(s.id)},keydown:function(o){return e.handleKeyDown(o,s.id)}}},[i("dt-icon",{attrs:{size:"400",name:s.icon}})],1)})},proxy:!0}])})],1)},k=[],j=m.normalizeComponent(b,_,k,!1,null,null,null,null);const g=j.exports,y={name:"EmojiSearch",components:{DtInput:d.DtInput,DtIcon:d.DtIcon},props:{searchPlaceholderLabel:{type:String,required:!0},modelValue:{type:String,default:""}},mounted(){this.focusSearchInput()},methods:{updateModelValue(t){this.$emit("update:model-value",t)},focusEmojiSelector(){this.$emit("focus-emoji-selector")},focusTabset(){this.$emit("focus-tabset")},selectFirstEmoji(){this.$emit("select-first-emoji")},clearSearch(){this.$emit("update:model-value",""),this.focusSearchInput()},focusSearchInput(){this.$refs.searchInputRef.focus()}}};var R=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__search d-emoji-picker__alignment"},[i("dt-input",{ref:"searchInputRef",attrs:{id:"searchInput",placeholder:e.searchPlaceholderLabel,value:e.modelValue},on:{input:e.updateModelValue,keydown:[function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"up",38,s.key,["Up","ArrowUp"])?null:e.focusTabset.apply(null,arguments)},function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"down",40,s.key,["Down","ArrowDown"])?null:(s.preventDefault(),e.focusEmojiSelector.apply(null,arguments))},function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"enter",13,s.key,"Enter")?null:e.selectFirstEmoji.apply(null,arguments)}]},scopedSlots:e._u([{key:"leftIcon",fn:function(){return[i("dt-icon",{attrs:{name:"search"}})]},proxy:!0},e.modelValue.length>0?{key:"rightIcon",fn:function(){return[i("button",{staticClass:"d-emoji-picker__search-button",on:{click:e.clearSearch,keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"enter",13,s.key,"Enter")?null:e.clearSearch.apply(null,arguments)}}},[i("dt-icon",{attrs:{name:"close"}})],1)]},proxy:!0}:null],null,!0)})],1)},S=[],E=m.normalizeComponent(y,R,S,!1,null,null,null,null);const $=E.exports,T={name:"EmojiSelector",props:{emojiFilter:{type:String,default:""},skinTone:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},selectedTabset:{type:Object,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},recentlyUsedEmojis:{type:Array,default:()=>[]}},data(){return{emojiRefs:[],emojiFilteredRefs:[],isFiltering:!1,hoverFirstEmoji:!0,fixedLabel:"",filteredEmojis:[],TABS_DATA:["Recently used","People","Nature","Food","Activity","Travel","Objects","Symbols","Flags"],tabLabelObserver:null}},computed:{currentEmojis(){return[...this.emojis[`People${this.skinTone}`]||[],...this.emojis.Nature||[],...this.emojis.Food||[],...this.emojis[`Activity${this.skinTone}`]||[],...this.emojis.Travel||[],...this.emojis[`Objects${this.skinTone}`]||[],...this.emojis.Symbols||[],...this.emojis.Flags||[]]},emojis(){return d.emojisGrouped},CDN_URL(){return p},tabLabels(){return this.recentlyUsedEmojis.length?this.tabSetLabels.map((t,e)=>({label:t,ref:this.$refs[`tabLabelRef-${e}`]})):this.tabSetLabels.slice(1).map((t,e)=>({label:t,ref:this.$refs[`tabLabelRef-${e}`]}))},tabs(){return this.recentlyUsedEmojis.length?this.TABS_DATA:this.TABS_DATA.slice(1)}},watch:{currentEmojis:{handler(){this.searchByNameAndKeywords()},immediate:!0},recentlyUsedEmojis:{handler(t){this.emojis["Recently used"]=t},immediate:!0},emojiFilter:{handler(t){this.resetScroll(),t?this.isFiltering=!0:(this.isFiltering=!1,this.$emit("highlighted-emoji",null)),this.debouncedSearch()}},selectedTabset:{handler(t){this.scrollToTab(t.tabId)},deep:!0}},created(){this.debouncedSearch=this.debounce(this.searchByNameAndKeywords,300)},mounted(){this.$nextTick(()=>{this.setupEmojiRefs(),this.setupFilteredRefs(),this.setupTabLabelRefs(),this.setTabLabelObserver()})},beforeDestroy(){this.tabLabelObserver&&this.tabLabelObserver.disconnect()},methods:{setupTabLabelRefs(){var t;(t=this.tabSetLabels)==null||t.forEach((e,i)=>{const s=`tabLabelRef-${i}`;this.$refs[s]&&this.$set(this.tabLabels,i,{label:e,ref:this.$refs[s]})})},setupFilteredRefs(){this.emojiFilteredRefs=[],this.filteredEmojis.forEach((t,e)=>{const i=`filteredEmoji-${e}`;this.$refs[i]&&this.setFilteredRef(this.$refs[i],e)})},setupEmojiRefs(){for(let t=0;t<this.tabs.length;t++){const e=`emojiRef-${t}`;this.$refs[e]&&this.$refs[e].forEach((i,s)=>{i&&this.setEmojiRef(i,t,s)})}},searchByNameAndKeywords(){const t=this.emojiFilter.toLowerCase();this.filteredEmojis=this.currentEmojis.filter(function(e){const i=e.name.toLowerCase().includes(t),s=e.keywords.some(function(n){return n.toLowerCase().includes(t)});return i||s}),this.$nextTick(function(){t&&(this.hoverEmoji(this.filteredEmojis[0],!0),this.setupFilteredRefs())})},debounce:function(t,e){e===void 0&&(e=300);let i;return function(){const s=[];let n=arguments.length;for(;n--;)s[n]=arguments[n];clearTimeout(i),i=setTimeout(function(){t.apply(void 0,s)},e)}},getImgSrc:function(t){return this.CDN_URL+t+".png"},handleImageError:function(t){t.target.parentNode.style.display="none"},scrollToTab:function(t,e){const i=this;e===void 0&&(e=!0);const n=i.tabLabels[t-1].ref[0];i.$nextTick(function(){const o=i.$refs.listRef,r=t==="1"?0:n.offsetTop-20;let l=!0,c=o.scrollTop;i.$emit("is-scrolling",!0),o.addEventListener("scroll",function(){if(l){const f=o.scrollTop;(c<f&&f>=r||c>f&&f<=r)&&(l=!1,i.$emit("is-scrolling",!1)),c=f}}),o.scrollTop=r,e&&i.focusEmoji(t-1,0)})},resetScroll:function(){const t=this.$refs.listRef;t.scrollTop=0},focusEmojiSelector:function(){this.focusEmoji(0,0)},hoverEmoji(t,e){e===void 0&&(e=!1),this.hoverFirstEmoji=e,this.$emit("highlighted-emoji",t)},setEmojiRef:function(t,e,i){this.emojiRefs[e]||this.$set(this.emojiRefs,e,[]),this.$set(this.emojiRefs[e],i,t)},setFilteredRef:function(t,e){this.$set(this.emojiFilteredRefs,e,t)},focusEmoji:function(t,e){var s;const i=this.isFiltering?(s=this.emojiFilteredRefs[e])==null?void 0:s[0]:this.emojiRefs[t]&&this.emojiRefs[t][e];return i?(i.focus(),!0):!1},handleKeyDown:function(t,e,i,s){var n,o;if(t.preventDefault(),t.key==="ArrowUp"){const r=i%a;if(e===0){const l=a-this.emojiRefs[this.emojiRefs.length-1].length%a,c=this.emojiRefs[this.emojiRefs.length-1].length+l-(a-r);this.focusEmoji(this.emojiRefs.length-1,c)||this.focusEmoji(this.emojiRefs.length-1,this.emojiRefs[this.emojiRefs.length-1].length-1);return}if(!this.focusEmoji(e,i-a)){const l=e-1<0?0:e-1,c=this.emojiRefs[l].length,f=c-c%a+r;this.focusEmoji(l,f)||this.focusEmoji(e-1,this.emojiRefs[e-1].length-1)}}if(t.key==="ArrowDown"&&!this.focusEmoji(e,i+a)){const r=i%a;(o=(n=this.emojiRefs)==null?void 0:n[e])!=null&&o[i+(a-r)]?this.focusEmoji(e,this.emojiRefs[e].length-1):this.focusEmoji(e+1,r)||this.focusEmoji(0,r)||this.focusEmoji(0,this.emojiRefs[0].length-1)}t.key==="ArrowLeft"&&this.handleHorizontalNavigation("left",e,i),t.key==="ArrowRight"&&this.handleHorizontalNavigation("right",e,i),t.key==="Tab"&&(this.focusEmoji(e+1,0)?this.scrollToTab(e+1+1,!1):this.$emit("focus-skin-selector")),t.key==="Tab"&&t.shiftKey&&(this.focusEmoji(e,0)&&e>0?this.scrollToTab(e,!0):(this.scrollToTab(1,!1),this.$emit("focus-search-input"))),t.key==="Enter"&&this.$emit("selected-emoji",s)},handleHorizontalNavigation:function(t,e,i){this.isFiltering?t==="left"?this.handleArrowLeftFiltered(e,i):t==="right"&&this.handleArrowRightFiltered(e,i):t==="left"?this.handleArrowLeft(e,i):t==="right"&&this.handleArrowRight(e,i)},handleArrowLeftFiltered:function(t,e){this.focusEmoji(0,e-1)||this.focusEmoji(0,this.emojiFilteredRefs.length-1)},handleArrowRightFiltered:function(t,e){this.focusEmoji(0,e+1)||this.focusEmoji(0,0)},handleArrowLeft:function(t,e){this.focusEmoji(t,e-1)||(this.emojiRefs[t-1]?this.focusEmoji(t-1,this.emojiRefs[t-1].length-1):this.focusEmoji(this.emojiRefs.length-1,this.emojiRefs[this.emojiRefs.length-1].length-1))},handleArrowRight:function(t,e){this.focusEmoji(t,e+1)||this.focusEmoji(t+1,0)||this.focusEmoji(0,0)},handleKeyDownFilteredEmojis(t,e,i){var s;if(t.preventDefault(),this.hoverFirstEmoji=!1,t.key==="ArrowUp"){const n=e%a;if(!this.focusEmoji(0,e-a)){const o=this.emojiFilteredRefs.length-this.emojiFilteredRefs.length%a+n;this.focusEmoji(0,o),this.focusEmoji(0,o)||this.focusEmoji(0,this.emojiFilteredRefs.length-1)}}if(t.key==="ArrowDown"&&!this.focusEmoji(0,e+a)){const n=e%a;(s=this.emojiFilteredRefs)!=null&&s[e+(a-n)]?this.focusEmoji(0,this.emojiFilteredRefs.length-1):this.focusEmoji(0,n)}t.key==="ArrowLeft"&&this.handleHorizontalNavigation("left",0,e),t.key==="ArrowRight"&&this.handleHorizontalNavigation("right",0,e),t.key==="Tab"&&this.$emit("focus-skin-selector"),t.key==="Enter"&&this.$emit("selected-emoji",i)},setTabLabelObserver(){this.tabLabelObserver=new IntersectionObserver(t=>{t.forEach(e=>{var n,o,r,l,c,f;const{target:i}=e,s=parseInt(i.dataset.index);e.isIntersecting&&i.offsetTop<=((n=this.$refs.tabCategoryRef)==null?void 0:n.offsetTop)+50?(this.fixedLabel=((o=this.tabLabels[s-1])==null?void 0:o.label)??((r=this.tabLabels[0])==null?void 0:r.label),this.$emit("scroll-into-tab",s-1)):e.boundingClientRect.bottom<=((l=this.$refs.tabCategoryRef)==null?void 0:l.getBoundingClientRect().bottom)?(this.$emit("scroll-into-tab",s),this.fixedLabel=(c=this.tabLabels[s])==null?void 0:c.label):s===1&&(this.$emit("scroll-into-tab",s),this.fixedLabel=(f=this.tabLabels[0])==null?void 0:f.label)})}),this.tabLabelObserver.observe(this.$refs.tabCategoryRef),Array.from(this.$refs.listRef.children).forEach((t,e)=>{this.tabLabelObserver.observe(t),t.dataset.index=e})},focusLastEmoji(){this.focusEmoji(this.tabs.length-1,0)}}};var v=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__selector"},[i("div",{ref:"listRef",staticClass:"d-emoji-picker__list",attrs:{id:"d-emoji-picker-list"}},[e.emojiFilter?i("p",{staticClass:"d-emoji-picker__search-label d-emoji-picker__alignment"},[e._v(" "+e._s(e.filteredEmojis.length>0?e.searchResultsLabel:e.searchNoResultsLabel)+" ")]):i("div",{ref:"tabCategoryRef",staticClass:"d-emoji-picker__category d-emoji-picker__alignment"},[i("p",[e._v(" "+e._s(e.fixedLabel)+" ")])]),e._l(e.tabLabels,function(s,n){return i("div",{directives:[{name:"show",rawName:"v-show",value:!e.emojiFilter,expression:"!emojiFilter"}],key:n,ref:`tabLabelRef-${n}`,refInFor:!0,staticClass:"d-emoji-picker__alignment"},[n?i("p",[e._v(" "+e._s(s.label)+" ")]):e._e(),i("div",{staticClass:"d-emoji-picker__tab"},e._l(e.emojis[e.tabs[n]+e.skinTone]?e.emojis[e.tabs[n]+e.skinTone]:e.emojis[e.tabs[n]],function(o,r){return i("button",{key:o.shortname,ref:`emojiRef-${n}`,refInFor:!0,attrs:{type:"button","aria-label":o.name},on:{click:function(l){return e.$emit("selected-emoji",o)},focusin:function(l){return e.$emit("highlighted-emoji",o)},focusout:function(l){return e.$emit("highlighted-emoji",null)},mouseover:function(l){return e.$emit("highlighted-emoji",o)},mouseleave:function(l){return e.$emit("highlighted-emoji",null)},keydown:l=>e.handleKeyDown(l,n,r,o)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:o.name,"aria-label":o.name,title:o.name,src:e.getImgSrc(o.unicode_character)},on:{error:e.handleImageError}})])}),0)])}),e.emojiFilter?i("div",{staticClass:"d-emoji-picker__alignment"},[i("div",{staticClass:"d-emoji-picker__tab",attrs:{"data-qa":"filtered-emojis"}},e._l(e.filteredEmojis,function(s,n){return i("button",{key:s.shortname,ref:`filteredEmoji-${n}`,refInFor:!0,class:{"hover-emoji":n===0&&e.hoverFirstEmoji},attrs:{type:"button","aria-label":s.name},on:{click:function(o){return e.$emit("selected-emoji",s)},focusin:function(o){return e.$emit("highlighted-emoji",s)},focusout:function(o){return e.$emit("highlighted-emoji",null)},mouseover:function(o){return e.hoverEmoji(s)},mouseleave:function(o){return e.hoverEmoji(null)},keydown:o=>e.handleKeyDownFilteredEmojis(o,n,s)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:s.name,"aria-label":s.name,title:s.name,src:`${e.CDN_URL+s.unicode_character}.png`}})])}),0)]):e._e()],2)])},L=[],w=m.normalizeComponent(T,v,L,!1,null,null,null,null);const I=w.exports,p="https://static.dialpadcdn.com/joypixels/png/unicode/32/",a=9,h={DEFAULT:"Default",LIGHT:"Light",MEDIUM_LIGHT:"MediumLight",MEDIUM:"Medium",MEDIUM_DARK:"MediumDark",DARK:"Dark"},u={MOST_RECENTLY_USED:"Most recently used",SMILEYS_AND_PEOPLE:"Smileys and people",NATURE:"Nature",FOOD:"Food",ACTIVITY:"Activity",TRAVEL:"Travel",OBJECTS:"Objects",SYMBOLS:"Symbols",FLAGS:"Flags"},D={name:"EmojiDescription",props:{emoji:{type:Object,default:()=>null}},data(){return{CDN_URL:p}}};var C=function(){var s;var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker__data"},[e.emoji?i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:e.emoji.name,"aria-label":e.emoji.name,title:e.emoji.name,src:`${e.CDN_URL+e.emoji.unicode_character}.png`}}):e._e(),e._v(" "+e._s((s=e.emoji)==null?void 0:s.name)+" ")])},A=[],F=m.normalizeComponent(D,C,A,!1,null,null,null,null);const O=F.exports,N={name:"EmojiSkinSelector",components:{DtTooltip:m.DtTooltip},props:{skinTone:{type:String,required:!0},isHovering:{type:Boolean,default:!1},skinSelectorButtonTooltipLabel:{type:String,required:!0}},data(){return{isOpen:!1,skinSelected:null,skinsRef:[],cdnUrl:p}},computed:{skinPassedIn(){return this.skinList.find(t=>t.skinTone===this.skinTone)},skinList(){return[{name:":wave_tone1:",unicode_output:"1f44b-1f3fb",skinTone:h.LIGHT,skinCode:"_tone1"},{name:":wave_tone2:",unicode_output:"1f44b-1f3fc",skinTone:h.MEDIUM_LIGHT,skinCode:"_tone2"},{name:":wave_tone3:",unicode_output:"1f44b-1f3fd",skinTone:h.MEDIUM,skinCode:"_tone3"},{name:":wave_tone4:",unicode_output:"1f44b-1f3fe",skinTone:h.MEDIUM_DARK,skinCode:"_tone4"},{name:":wave_tone5:",unicode_output:"1f44b-1f3ff",skinTone:h.DARK,skinCode:"_tone5"},{name:":wave:",unicode_output:"1f44b",skinTone:h.DEFAULT,skinCode:""}]}},watch:{isHovering(t){t&&(this.isOpen=!1)},skinTone(t,e){t!==e&&(this.skinSelected=this.skinPassedIn)}},mounted(){this.skinSelected=this.skinPassedIn,this.$nextTick(()=>{this.setupSkinRefs()})},methods:{setupSkinRefs(){this.skinList.forEach((t,e)=>{const i=`skinRef-${e}`;this.$refs[i]&&this.$set(this.skinsRef,e,this.$refs[i][0])})},focusSkinSelector(){this.$refs.skinSelectorRef&&this.$refs.skinSelectorRef.focus()},selectSkin(t){this.skinSelected=t,this.isOpen=!1,this.$emit("skin-tone",t.skinTone),this.$nextTick(()=>{this.focusSkinSelector()})},handleKeyDown(t,e,i){var s,n,o,r;t.preventDefault(),t.key==="ArrowLeft"&&(i===0&&((s=this.skinsRef[this.skinsRef.length-1])==null||s.focus()),(n=this.skinsRef[i-1])==null||n.focus()),t.key==="ArrowRight"&&(this.skinsRef.length&&((o=this.skinsRef[0])==null||o.focus()),(r=this.skinsRef[i+1])==null||r.focus()),t.key==="Enter"&&(e?this.selectSkin(e):this.toggleSkinList()),t.key==="Tab"&&(t.shiftKey?this.$emit("focus-last-emoji"):this.$emit("focus-tabset"))},toggleSkinList(){this.isOpen=!this.isOpen,this.$nextTick(()=>{this.skinsRef[0]&&this.skinsRef[0].focus()})}}};var U=function(){var e=this,i=e._self._c;return i("div",{attrs:{"data-qa":"skin-selector"}},[i("div",{directives:[{name:"show",rawName:"v-show",value:e.isOpen,expression:"isOpen"}],staticClass:"d-emoji-picker__skin-list"},e._l(e.skinList,function(s,n){var o;return i("button",{key:s.name,ref:`skinRef-${n}`,refInFor:!0,class:{selected:((o=e.skinSelected)==null?void 0:o.skinCode)===s.skinCode},on:{click:function(r){return e.selectSkin(s)},keydown:r=>e.handleKeyDown(r,s,n)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:s.name,"aria-label":s.name,title:s.name,src:`${e.cdnUrl+s.unicode_output}.png`}})])}),0),i("div",{directives:[{name:"show",rawName:"v-show",value:!e.isOpen,expression:"!isOpen"}],staticClass:"d-emoji-picker__skin-selected"},[i("dt-tooltip",{attrs:{placement:"top-end"},scopedSlots:e._u([{key:"anchor",fn:function(){var s,n,o,r;return[i("button",{ref:"skinSelectorRef",attrs:{"aria-label":e.skinSelectorButtonTooltipLabel,tabindex:"-1"},on:{click:e.toggleSkinList,keydown:l=>e.handleKeyDown(l)}},[i("img",{staticClass:"d-icon d-icon--size-500",attrs:{alt:(s=e.skinSelected)==null?void 0:s.name,"aria-label":(n=e.skinSelected)==null?void 0:n.name,title:(o=e.skinSelected)==null?void 0:o.name,src:`${e.cdnUrl+((r=e.skinSelected)==null?void 0:r.unicode_output)}.png`}})])]},proxy:!0}])},[e._v(" "+e._s(e.skinSelectorButtonTooltipLabel)+" ")])],1)])},M=[],K=m.normalizeComponent(N,U,M,!1,null,null,null,null);const P=K.exports,B={name:"DtEmojiPicker",components:{EmojiTabset:g,EmojiSearch:$,EmojiSelector:I,EmojiDescription:O,EmojiSkinSelector:P},props:{recentlyUsedEmojis:{type:Array},searchPlaceholderLabel:{type:String,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},skinTone:{type:String},skinSelectorButtonTooltipLabel:{type:String,required:!0}},data(){return{searchQuery:"",highlightedEmoji:null,selectedTabset:{},scrollIntoTab:0,isScrolling:!1}},computed:{showRecentlyUsedTab(){var t;return((t=this.recentlyUsedEmojis)==null?void 0:t.length)>0}},methods:{scrollToSelectedTabset(t){this.searchQuery="",this.selectedTabset={...this.selectedTabset,tabId:t}},updateScrollIntoTab(t){this.scrollIntoTab=t},updateIsScrolling(t){this.isScrolling=t},updateHighlightedEmoji(t){this.highlightedEmoji=t}}};var q=function(){var e=this,i=e._self._c;return i("div",{staticClass:"d-emoji-picker"},[i("div",{staticClass:"d-emoji-picker--header"},[i("emoji-tabset",{ref:"tabsetRef",attrs:{"emoji-filter":e.searchQuery,"show-recently-used-tab":e.showRecentlyUsedTab,"scroll-into-tab":e.scrollIntoTab,"tab-set-labels":e.tabSetLabels,"is-scrolling":e.isScrolling},on:{"focus-search-input":function(s){return e.$refs.searchInputRef.focusSearchInput()},"focus-skin-selector":function(s){return e.$refs.skinSelectorRef.focusSkinSelector()},"selected-tabset":e.scrollToSelectedTabset},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1),i("div",{staticClass:"d-emoji-picker--body"},[i("emoji-search",{ref:"searchInputRef",attrs:{"model-value":e.searchQuery,"search-placeholder-label":e.searchPlaceholderLabel},on:{"update:model-value":s=>e.searchQuery=s,"select-first-emoji":function(s){return e.$emit("selected-emoji",e.highlightedEmoji)},"focus-tabset":function(s){return e.$refs.tabsetRef.focusTabset()},"focus-emoji-selector":function(s){return e.$refs.emojiSelectorRef.focusEmojiSelector()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}}),i("emoji-selector",{ref:"emojiSelectorRef",attrs:{"emoji-filter":e.searchQuery,"skin-tone":e.skinTone,"tab-set-labels":e.tabSetLabels,"search-results-label":e.searchResultsLabel,"search-no-results-label":e.searchNoResultsLabel,"recently-used-emojis":e.recentlyUsedEmojis,"selected-tabset":e.selectedTabset},on:{"scroll-into-tab":e.updateScrollIntoTab,"is-scrolling":e.updateIsScrolling,"highlighted-emoji":e.updateHighlightedEmoji,"selected-emoji":function(s){return e.$emit("selected-emoji",s)},"focus-skin-selector":function(s){return e.$refs.skinSelectorRef.focusSkinSelector()},"focus-search-input":function(s){return e.$refs.searchInputRef.focusSearchInput()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1),i("div",{staticClass:"d-emoji-picker--footer"},[i("emoji-description",{attrs:{emoji:e.highlightedEmoji}}),i("emoji-skin-selector",{ref:"skinSelectorRef",attrs:{"is-hovering":!!e.highlightedEmoji,"skin-selector-button-tooltip-label":e.skinSelectorButtonTooltipLabel,"skin-tone":e.skinTone},on:{"skin-tone":function(s){return e.$emit("skin-tone",s)},"focus-tabset":function(s){return e.$refs.tabsetRef.focusTabset()},"focus-last-emoji":function(s){return e.$refs.emojiSelectorRef.focusLastEmoji()}},nativeOn:{keydown:function(s){return!s.type.indexOf("key")&&e._k(s.keyCode,"esc",27,s.key,["Esc","Escape"])?null:e.$emit("close")}}})],1)])},z=[],H=m.normalizeComponent(B,q,z,!1,null,null,null,null);const G=H.exports;exports.CDN_URL=p;exports.DtEmojiPicker=G;exports.EMOJIS_PER_ROW=a;exports.EMOJI_PICKER_CATEGORIES=u;exports.EMOJI_PICKER_SKIN_TONE_MODIFIERS=h;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const n=require("./index-
|
|
1
|
+
"use strict";const n=require("./index-ihXjcrB-.cjs"),o=require("./tooltip-6msmWvq0.cjs"),a={name:"DtEmojiTextWrapper",components:{DtEmoji:n.DtEmoji},props:{elementType:{type:String,default:"div"},size:{type:String,default:"500",validator:e=>Object.keys(n.ICON_SIZE_MODIFIERS).includes(e)}},data(){return{loadingEmojiJson:!0}},async created(){this.loadingEmojiJson=!1},methods:{replaceDtEmojis(e,t){const s=new RegExp(`(${e.join("|")})`,"g");return t.split(s).map(i=>e.includes(i)?this.$createElement(n.DtEmoji,{props:{code:i,size:this.size,...this.$attrs}}):this.$createElement("span",i))},searchVNodes(e){if(!e.tag&&e.text)return this.searchCodes(e.text);const t=e.children?e.children.map(s=>this.searchVNodes(s)):[];return this.$createElement(e.tag,e.data,t)},replaceVueComponentVNodeContent(e){},searchCodes(e){const t=n.findShortCodes(e),s=n.findEmojis(e),r=[...t,...s];return r.length===0?e:this.replaceDtEmojis(r,e)}},render(e){const t=this.$slots.default||[];return e(this.elementType,{class:"d-emoji-text-wrapper"},this.loadingEmojiJson?t:t.map(s=>this.searchVNodes(s)))}},l=null,c=null;var p=o.normalizeComponent(a,l,c,!1,null,null,null,null);const d=p.exports;exports.DtEmojiTextWrapper=d;
|
|
@@ -11718,7 +11718,7 @@ const nT = QO.exports, eP = ["default", "sm"], aP = {
|
|
|
11718
11718
|
this.focusId = a;
|
|
11719
11719
|
},
|
|
11720
11720
|
getTabChildren() {
|
|
11721
|
-
return this.$
|
|
11721
|
+
return Array.from(this.$el.querySelectorAll(".d-tab")).map((a) => {
|
|
11722
11722
|
var e, o;
|
|
11723
11723
|
return {
|
|
11724
11724
|
context: a,
|