@dialpad/dialtone-vue 3.65.3 → 3.66.1
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 +21 -0
- package/dist/dialtone-vue.cjs +6 -6
- package/dist/dialtone-vue.js +739 -707
- package/dist/emoji.cjs +1 -1
- package/dist/emoji.js +98 -99
- package/dist/emoji_text_wrapper-099f66b6.cjs +38 -0
- package/dist/{emoji_text_wrapper-7edbe839.js → emoji_text_wrapper-2f4dd42b.js} +12715 -7077
- package/dist/style.css +1 -1
- package/package.json +10 -16
- package/dist/emoji_text_wrapper-14adf3de.cjs +0 -25
package/dist/emoji.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./emoji_text_wrapper-14adf3de.cjs"),e=require("vue");const w={class:"d-emoji-picker__search d-emoji-picker__alignment"},D={class:"d-emoji-picker__search-button"},U={__name:"emoji_search",props:{searchPlaceholderLabel:{type:String,required:!0},modelValue:{type:String,default:""}},emits:["update:modelValue"],setup(o){return(p,n)=>(e.openBlock(),e.createElementBlock("div",w,[e.createVNode(t.DtInput,{placeholder:o.searchPlaceholderLabel,"model-value":o.modelValue,"onUpdate:modelValue":n[1]||(n[1]=s=>p.$emit("update:modelValue",s))},e.createSlots({leftIcon:e.withCtx(()=>[e.createVNode(t.DtIcon,{name:"search"})]),_:2},[o.modelValue.length>0?{name:"rightIcon",fn:e.withCtx(()=>[e.createElementVNode("button",D,[e.createVNode(t.DtIcon,{name:"close",onClick:n[0]||(n[0]=s=>p.$emit("update:modelValue",""))})])]),key:"0"}:void 0]),1032,["placeholder","model-value"])]))}},I=t._export_sfc(U,[["__scopeId","data-v-20dd73b1"]]);const F={class:"d-emoji-picker__tabset"},A={__name:"emoji_tabset",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}},emits:["selected-tabset"],setup(o,{emit:p}){const n=o,s=[{label:"Recently used",icon:"clock"},{label:"Smiley’s and people",icon:"satisfied"},{label:"Nature",icon:"living-thing"},{label:"Food",icon:"food"},{label:"Activity",icon:"object"},{label:"Travel",icon:"transportation"},{label:"Objects",icon:"lightbulb"},{label:"Symbols",icon:"heart"},{label:"Flags",icon:"flag"}],b=e.computed(()=>(n.showRecentlyUsedTab?s:s.slice(1)).map((k,f)=>({...k,label:n.tabsetLabels[f],id:(f+1).toString(),panelId:(f+1).toString()}))),c=e.computed(()=>n.emojiFilter.length>0),_=e.ref("1"),{isScrolling:u}=e.toRefs(n);e.watch(()=>n.scrollIntoTab,()=>{!u.value&&!c.value&&(_.value=(n.scrollIntoTab+1).toString())}),e.watch(c,()=>{c.value&&(_.value=null)});function g(d){u.value||(_.value=d),p("selected-tabset",d)}return(d,k)=>(e.openBlock(),e.createElementBlock("div",F,[e.createVNode(t.DtTabGroup,{"tab-list-class":"d-emoji-picker__tabset-list",selected:_.value},{tabs:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(b),f=>(e.openBlock(),e.createBlock(t.DtTab,{id:f.id,key:f.id,"panel-id":f.panelId,label:f.label,"aria-controls":"d-emoji-picker-list",onClickCapture:e.withModifiers($=>g(f.id),["stop"])},{default:e.withCtx(()=>[e.createVNode(t.DtIcon,{size:"400",name:f.icon},null,8,["name"])]),_:2},1032,["id","panel-id","label","onClickCapture"]))),128))]),_:1},8,["selected"])]))}},T="https://static.dialpadcdn.com/joypixels/png/unicode/32/";const R={class:"d-emoji-picker__selector"},q={key:0,class:"d-emoji-picker__search-label d-emoji-picker__alignment"},x={key:0},O={class:"d-emoji-picker__tab"},G=["aria-label","onClick","onFocusin","onMouseover"],P=["alt","aria-label","title","src"],M={key:2,class:"d-emoji-picker__alignment"},z={class:"d-emoji-picker__tab"},J=["aria-label","onClick","onFocusin","onMouseover"],H=["alt","aria-label","title","src"],K={__name:"emoji_selector",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:()=>[]}},emits:["highlighted-emoji","selected-emoji","scroll-into-tab","is-scrolling"],setup(o,{emit:p}){const n=o,s=e.ref(null),b=e.ref(null),c=e.ref(null),_=["Recently used","People","Nature","Food","Activity","Travel","Objects","Symbols","Flags"],u=e.computed(()=>n.recentlyUsedEmojis.length?n.tabsetLabels.map(l=>({label:l,ref:e.ref(null)})):n.tabsetLabels.slice(1).map(l=>({label:l,ref:e.ref(null)}))),g=e.ref(u.value[0].label),d=e.computed(()=>n.recentlyUsedEmojis.length?_:_.slice(1)),k=e.ref([]),f=e.computed(()=>[...t.emojisGrouped[`People${n.skinTone}`],...t.emojisGrouped.Nature,...t.emojisGrouped.Food,...t.emojisGrouped[`Activity${n.skinTone}`],...t.emojisGrouped.Travel,...t.emojisGrouped[`Objects${n.skinTone}`],...t.emojisGrouped.Symbols,...t.emojisGrouped.Flags]),$=j(()=>{v()});e.watch(f,()=>{v()},{immediate:!0}),e.watch(()=>n.recentlyUsedEmojis,()=>{t.emojisGrouped["Recently used"]=n.recentlyUsedEmojis},{immediate:!0}),e.watch(()=>n.emojiFilter,()=>{V(),$()}),e.watch(()=>n.selectedTabset,l=>{L(l.tabId)},{deep:!0});function v(){const l=n.emojiFilter.toLowerCase();k.value=f.value.filter(r=>{const a=r.name.toLowerCase().includes(l),i=r.keywords.some(m=>m.toLowerCase().includes(l));return a||i})}function j(l,r=300){let a;return(...i)=>{clearTimeout(a),a=setTimeout(()=>l(...i),r)}}function E(l){return`${T+l}.png`}function C(l){l.target.parentNode.style.display="none"}function L(l){const a=u.value[l-1].ref.value[0];e.nextTick(()=>{const i=b.value,m=l==="1"?0:a.offsetTop-20;let h=!0,S=i.scrollTop;p("is-scrolling",!0),i.addEventListener("scroll",()=>{if(h){const y=i.scrollTop;(S<y&&y>=m||S>y&&y<=m)&&(h=!1,p("is-scrolling",!1)),S=y}}),i.scrollTop=m})}function V(){const l=b.value;l.scrollTop=0}function N(){c.value=new IntersectionObserver(l=>{l.forEach(r=>{var m,h,S,y,B;const{target:a}=r,i=parseInt(a.dataset.index);r.isIntersecting&&a.offsetTop<=s.value.offsetTop+50?(g.value=((m=u.value[i-1])==null?void 0:m.label)??((h=u.value[0])==null?void 0:h.label),p("scroll-into-tab",i-1)):r.boundingClientRect.bottom<=((S=s.value)==null?void 0:S.getBoundingClientRect().bottom)?(p("scroll-into-tab",i),g.value=(y=u.value[i])==null?void 0:y.label):i===1&&(p("scroll-into-tab",i),g.value=(B=u.value[0])==null?void 0:B.label)})}),c.value.observe(s.value),Array.from(b.value.children).forEach((l,r)=>{c.value.observe(l),l.dataset.index=r})}return e.onMounted(()=>{N()}),e.onUnmounted(()=>{c.value.disconnect()}),(l,r)=>(e.openBlock(),e.createElementBlock("div",R,[e.createElementVNode("div",{id:"d-emoji-picker-list",ref_key:"listRef",ref:b,class:"d-emoji-picker__list"},[o.emojiFilter?(e.openBlock(),e.createElementBlock("p",q,e.toDisplayString(k.value.length>0?o.searchResultsLabel:o.searchNoResultsLabel),1)):(e.openBlock(),e.createElementBlock("div",{key:1,ref_key:"tabCategoryRef",ref:s,class:"d-emoji-picker__category d-emoji-picker__alignment"},[e.createElementVNode("p",null,e.toDisplayString(g.value),1)],512)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u),(a,i)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:i,ref_for:!0,ref:a.ref,class:"d-emoji-picker__alignment"},[i?(e.openBlock(),e.createElementBlock("p",x,e.toDisplayString(a.label),1)):e.createCommentVNode("",!0),e.createElementVNode("div",O,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t.emojisGrouped)[e.unref(d)[i]+o.skinTone]?e.unref(t.emojisGrouped)[e.unref(d)[i]+o.skinTone]:e.unref(t.emojisGrouped)[e.unref(d)[i]],m=>(e.openBlock(),e.createElementBlock("button",{key:m.shortname,type:"button","aria-label":m.name,onClick:h=>l.$emit("selected-emoji",m),onFocusin:h=>l.$emit("highlighted-emoji",m),onFocusout:r[0]||(r[0]=h=>l.$emit("highlighted-emoji",null)),onMouseover:h=>l.$emit("highlighted-emoji",m),onMouseleave:r[1]||(r[1]=h=>l.$emit("highlighted-emoji",null))},[e.createElementVNode("img",{class:"d-icon d-icon--size-500",alt:m.name,"aria-label":m.name,title:m.name,src:E(m.unicode_character),onError:C},null,40,P)],40,G))),128))])])),[[e.vShow,!o.emojiFilter]])),128)),o.emojiFilter?(e.openBlock(),e.createElementBlock("div",M,[e.createElementVNode("div",z,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.value,a=>(e.openBlock(),e.createElementBlock("button",{key:a.shortname,type:"button","aria-label":a.name,onClick:i=>l.$emit("selected-emoji",a),onFocusin:i=>l.$emit("highlighted-emoji",a),onFocusout:r[2]||(r[2]=i=>l.$emit("highlighted-emoji",null)),onMouseover:i=>l.$emit("highlighted-emoji",a),onMouseleave:r[3]||(r[3]=i=>l.$emit("highlighted-emoji",null))},[e.createElementVNode("img",{class:"d-icon d-icon--size-500",alt:a.name,"aria-label":a.name,title:a.name,src:`${e.unref(T)+a.unicode_character}.png`},null,8,H)],40,J))),128))])])):e.createCommentVNode("",!0)],512)]))}},Q=t._export_sfc(K,[["__scopeId","data-v-183240d8"]]);const W={class:"d-emoji-picker__skin-list"},X=["onClick"],Y=["alt","aria-label","title","src"],Z={class:"d-emoji-picker__skin-selected"},ee=["alt","aria-label","title","src"],te={__name:"emoji_skin_selector",props:{skinTone:{type:String,required:!0},isHovering:{type:Boolean,default:!1},skinSelectorButtonTooltipLabel:{type:String,required:!0}},emits:["skin-tone"],setup(o,{emit:p}){const n=o,s=[{name:":wave_tone1:",unicode_output:"1f44b-1f3fb",skinTone:"Light",skinCode:"_tone1"},{name:":wave_tone2:",unicode_output:"1f44b-1f3fc",skinTone:"MediumLight",skinCode:"_tone2"},{name:":wave_tone3:",unicode_output:"1f44b-1f3fd",skinTone:"Medium",skinCode:"_tone3"},{name:":wave_tone4:",unicode_output:"1f44b-1f3fe",skinTone:"MediumDark",skinCode:"_tone4"},{name:":wave_tone5:",unicode_output:"1f44b-1f3ff",skinTone:"Dark",skinCode:"_tone5"},{name:":wave:",unicode_output:"1f44b",skinTone:"Default",skinCode:""}],b=e.ref(s.find(u=>u.skinTone===n.skinTone)),c=e.ref(!1);e.watchEffect(()=>n.isHovering&&(c.value=!1));function _(u){b.value=u,c.value=!1,p("skin-tone",u.skinTone)}return(u,g)=>(e.openBlock(),e.createElementBlock("div",null,[e.withDirectives(e.createElementVNode("div",W,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(s,d=>e.createElementVNode("button",{key:d.name,class:e.normalizeClass({selected:b.value.skinCode===d.skinCode}),onClick:k=>_(d)},[e.createElementVNode("img",{class:"d-icon d-icon--size-500",alt:d.name,"aria-label":d.name,title:d.name,src:`${e.unref(T)+d.unicode_output}.png`},null,8,Y)],10,X)),64))],512),[[e.vShow,c.value]]),e.withDirectives(e.createElementVNode("div",Z,[e.createVNode(t.DtTooltip,{placement:"top-end"},{anchor:e.withCtx(()=>[e.createElementVNode("button",{onClick:g[0]||(g[0]=d=>c.value=!0)},[e.createElementVNode("img",{class:"d-icon d-icon--size-500",alt:b.value.name,"aria-label":b.value.name,title:b.value.name,src:`${e.unref(T)+b.value.unicode_output}.png`},null,8,ee)])]),default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.skinSelectorButtonTooltipLabel)+" ",1)]),_:1})],512),[[e.vShow,!c.value]])]))}},oe=t._export_sfc(te,[["__scopeId","data-v-5c3fd4f6"]]);const le={class:"d-emoji-picker__data"},ne=["alt","aria-label","title","src"],ie={__name:"emoji_description",props:{emoji:{type:Object,default:null}},setup(o){return(p,n)=>{var s;return e.openBlock(),e.createElementBlock("div",le,[o.emoji?(e.openBlock(),e.createElementBlock("img",{key:0,class:"d-icon d-icon--size-500",alt:o.emoji.name,"aria-label":o.emoji.name,title:o.emoji.name,src:`${e.unref(T)+o.emoji.unicode_character}.png`},null,8,ne)):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString((s=o.emoji)==null?void 0:s.name),1)])}}},se=t._export_sfc(ie,[["__scopeId","data-v-48c61881"]]);const ae={class:"d-emoji-picker"},re={class:"d-emoji-picker--header"},ce={class:"d-emoji-picker--body"},ue={class:"d-emoji-picker--footer"},de={__name:"emoji_picker",props:{recentlyUsedEmojis:{type:Array,default:()=>[]},searchPlaceholderLabel:{type:String,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},skinTone:{type:String,default:"Default"},skinSelectorButtonTooltipLabel:{type:String,required:!0}},emits:["selected-emoji","skin-tone"],setup(o,{emit:p}){const n=o,s=e.ref(""),b=e.ref(null),c=e.ref({}),_=e.ref(0),u=e.ref(!1),g=e.computed(()=>n.recentlyUsedEmojis.length>0);function d(v){s.value="",c.value=v,c.value={...c.value,tabId:v}}function k(v){_.value=v}function f(v){u.value=v}function $(v){b.value=v}return(v,j)=>(e.openBlock(),e.createElementBlock("div",ae,[e.createElementVNode("div",re,[e.createVNode(A,{"emoji-filter":s.value,"show-recently-used-tab":e.unref(g),"scroll-into-tab":_.value,"tabset-labels":o.tabSetLabels,"is-scrolling":u.value,onSelectedTabset:d},null,8,["emoji-filter","show-recently-used-tab","scroll-into-tab","tabset-labels","is-scrolling"])]),e.createElementVNode("div",ce,[e.createVNode(I,{modelValue:s.value,"onUpdate:modelValue":j[0]||(j[0]=E=>s.value=E),"search-placeholder-label":o.searchPlaceholderLabel},null,8,["modelValue","search-placeholder-label"]),e.createVNode(Q,{"emoji-filter":s.value,"skin-tone":o.skinTone,"tabset-labels":o.tabSetLabels,"search-results-label":o.searchResultsLabel,"search-no-results-label":o.searchNoResultsLabel,"recently-used-emojis":o.recentlyUsedEmojis,"selected-tabset":c.value,onScrollIntoTab:k,onIsScrolling:f,onHighlightedEmoji:$,onSelectedEmoji:j[1]||(j[1]=E=>p("selected-emoji",E))},null,8,["emoji-filter","skin-tone","tabset-labels","search-results-label","search-no-results-label","recently-used-emojis","selected-tabset"])]),e.createElementVNode("div",ue,[e.createVNode(se,{emoji:b.value},null,8,["emoji"]),e.createVNode(oe,{"is-hovering":!!b.value,"skin-selector-button-tooltip-label":o.skinSelectorButtonTooltipLabel,"skin-tone":o.skinTone,onSkinTone:j[2]||(j[2]=E=>p("skin-tone",E))},null,8,["is-hovering","skin-selector-button-tooltip-label","skin-tone"])])]))}};exports.DtEmoji=t.DtEmoji;exports.DtEmojiTextWrapper=t._sfc_main;exports.codeToEmojiData=t.codeToEmojiData;Object.defineProperty(exports,"customEmojiAssetUrl",{enumerable:!0,get:()=>t.customEmojiAssetUrl});exports.defaultEmojiAssetUrl=t.defaultEmojiAssetUrl;Object.defineProperty(exports,"emojiFileExtensionLarge",{enumerable:!0,get:()=>t.emojiFileExtensionLarge});Object.defineProperty(exports,"emojiFileExtensionSmall",{enumerable:!0,get:()=>t.emojiFileExtensionSmall});Object.defineProperty(exports,"emojiImageUrlLarge",{enumerable:!0,get:()=>t.emojiImageUrlLarge});Object.defineProperty(exports,"emojiImageUrlSmall",{enumerable:!0,get:()=>t.emojiImageUrlSmall});exports.emojiJson=t.emojiJson;exports.emojiVersion=t.emojiVersion;exports.filterValidShortCodes=t.filterValidShortCodes;exports.findEmojis=t.findEmojis;exports.findShortCodes=t.findShortCodes;exports.getEmojiData=t.getEmojiData;exports.setCustomEmojiJson=t.setCustomEmojiJson;exports.setCustomEmojiUrl=t.setCustomEmojiUrl;exports.setEmojiAssetUrlLarge=t.setEmojiAssetUrlLarge;exports.setEmojiAssetUrlSmall=t.setEmojiAssetUrlSmall;exports.shortcodeToEmojiData=t.shortcodeToEmojiData;exports.stringToUnicode=t.stringToUnicode;exports.unicodeToString=t.unicodeToString;exports.validateCustomEmojiJson=t.validateCustomEmojiJson;exports.DtEmojiPicker=de;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./emoji_text_wrapper-099f66b6.cjs");const N={class:"d-emoji-picker__search d-emoji-picker__alignment"},w={class:"d-emoji-picker__search-button"},D={__name:"emoji_search",props:{searchPlaceholderLabel:{type:String,required:!0},modelValue:{type:String,default:""}},emits:["update:modelValue"],setup(t){return(b,l)=>(e.openBlock(),e.createElementBlock("div",N,[e.createVNode(e.DtInput,{placeholder:t.searchPlaceholderLabel,"model-value":t.modelValue,"onUpdate:modelValue":l[1]||(l[1]=i=>b.$emit("update:modelValue",i))},e.createSlots({leftIcon:e.withCtx(()=>[e.createVNode(e.DtIcon,{name:"search"})]),_:2},[t.modelValue.length>0?{name:"rightIcon",fn:e.withCtx(()=>[e.createBaseVNode("button",w,[e.createVNode(e.DtIcon,{name:"close",onClick:l[0]||(l[0]=i=>b.$emit("update:modelValue",""))})])]),key:"0"}:void 0]),1032,["placeholder","model-value"])]))}},U=e._export_sfc(D,[["__scopeId","data-v-20dd73b1"]]);const I={class:"d-emoji-picker__tabset"},F={__name:"emoji_tabset",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}},emits:["selected-tabset"],setup(t,{emit:b}){const l=t,i=[{label:"Recently used",icon:"clock"},{label:"Smiley’s and people",icon:"satisfied"},{label:"Nature",icon:"living-thing"},{label:"Food",icon:"food"},{label:"Activity",icon:"object"},{label:"Travel",icon:"transportation"},{label:"Objects",icon:"lightbulb"},{label:"Symbols",icon:"heart"},{label:"Flags",icon:"flag"}],m=e.computed(()=>(l.showRecentlyUsedTab?i:i.slice(1)).map((h,p)=>({...h,label:l.tabsetLabels[p],id:(p+1).toString(),panelId:(p+1).toString()}))),r=e.computed(()=>l.emojiFilter.length>0),f=e.ref("1"),{isScrolling:c}=e.toRefs(l);e.watch(()=>l.scrollIntoTab,()=>{!c.value&&!r.value&&(f.value=(l.scrollIntoTab+1).toString())}),e.watch(r,()=>{r.value&&(f.value=null)});function v(u){c.value||(f.value=u),b("selected-tabset",u)}return(u,h)=>(e.openBlock(),e.createElementBlock("div",I,[e.createVNode(e.DtTabGroup,{"tab-list-class":"d-emoji-picker__tabset-list",selected:f.value},{tabs:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(m),p=>(e.openBlock(),e.createBlock(e.DtTab,{id:p.id,key:p.id,"panel-id":p.panelId,label:p.label,"aria-controls":"d-emoji-picker-list",onClickCapture:e.withModifiers(E=>v(p.id),["stop"])},{default:e.withCtx(()=>[e.createVNode(e.DtIcon,{size:"400",name:p.icon},null,8,["name"])]),_:2},1032,["id","panel-id","label","onClickCapture"]))),128))]),_:1},8,["selected"])]))}},T="https://static.dialpadcdn.com/joypixels/png/unicode/32/";const A={class:"d-emoji-picker__selector"},R={key:0,class:"d-emoji-picker__search-label d-emoji-picker__alignment"},x={key:0},q={class:"d-emoji-picker__tab"},O=["aria-label","onClick","onFocusin","onMouseover"],G=["alt","aria-label","title","src"],P={key:2,class:"d-emoji-picker__alignment"},M={class:"d-emoji-picker__tab"},z=["aria-label","onClick","onFocusin","onMouseover"],J=["alt","aria-label","title","src"],H={__name:"emoji_selector",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:()=>[]}},emits:["highlighted-emoji","selected-emoji","scroll-into-tab","is-scrolling"],setup(t,{emit:b}){const l=t,i=e.ref(null),m=e.ref(null),r=e.ref(null),f=["Recently used","People","Nature","Food","Activity","Travel","Objects","Symbols","Flags"],c=e.computed(()=>l.recentlyUsedEmojis.length?l.tabsetLabels.map(o=>({label:o,ref:e.ref(null)})):l.tabsetLabels.slice(1).map(o=>({label:o,ref:e.ref(null)}))),v=e.ref(c.value[0].label),u=e.computed(()=>l.recentlyUsedEmojis.length?f:f.slice(1)),h=e.ref([]),p=e.computed(()=>[...e.emojisGrouped[`People${l.skinTone}`],...e.emojisGrouped.Nature,...e.emojisGrouped.Food,...e.emojisGrouped[`Activity${l.skinTone}`],...e.emojisGrouped.Travel,...e.emojisGrouped[`Objects${l.skinTone}`],...e.emojisGrouped.Symbols,...e.emojisGrouped.Flags]),E=k(()=>{_()});e.watch(p,()=>{_()},{immediate:!0}),e.watch(()=>l.recentlyUsedEmojis,()=>{e.emojisGrouped["Recently used"]=l.recentlyUsedEmojis},{immediate:!0}),e.watch(()=>l.emojiFilter,()=>{L(),E()}),e.watch(()=>l.selectedTabset,o=>{C(o.tabId)},{deep:!0});function _(){const o=l.emojiFilter.toLowerCase();h.value=p.value.filter(a=>{const s=a.name.toLowerCase().includes(o),n=a.keywords.some(d=>d.toLowerCase().includes(o));return s||n})}function k(o,a=300){let s;return(...n)=>{clearTimeout(s),s=setTimeout(()=>o(...n),a)}}function y(o){return`${T+o}.png`}function $(o){o.target.parentNode.style.display="none"}function C(o){const s=c.value[o-1].ref.value[0];e.nextTick(()=>{const n=m.value,d=o==="1"?0:s.offsetTop-20;let g=!0,S=n.scrollTop;b("is-scrolling",!0),n.addEventListener("scroll",()=>{if(g){const j=n.scrollTop;(S<j&&j>=d||S>j&&j<=d)&&(g=!1,b("is-scrolling",!1)),S=j}}),n.scrollTop=d})}function L(){const o=m.value;o.scrollTop=0}function V(){r.value=new IntersectionObserver(o=>{o.forEach(a=>{var d,g,S,j,B;const{target:s}=a,n=parseInt(s.dataset.index);a.isIntersecting&&s.offsetTop<=i.value.offsetTop+50?(v.value=((d=c.value[n-1])==null?void 0:d.label)??((g=c.value[0])==null?void 0:g.label),b("scroll-into-tab",n-1)):a.boundingClientRect.bottom<=((S=i.value)==null?void 0:S.getBoundingClientRect().bottom)?(b("scroll-into-tab",n),v.value=(j=c.value[n])==null?void 0:j.label):n===1&&(b("scroll-into-tab",n),v.value=(B=c.value[0])==null?void 0:B.label)})}),r.value.observe(i.value),Array.from(m.value.children).forEach((o,a)=>{r.value.observe(o),o.dataset.index=a})}return e.onMounted(()=>{V()}),e.onUnmounted(()=>{r.value.disconnect()}),(o,a)=>(e.openBlock(),e.createElementBlock("div",A,[e.createBaseVNode("div",{id:"d-emoji-picker-list",ref_key:"listRef",ref:m,class:"d-emoji-picker__list"},[t.emojiFilter?(e.openBlock(),e.createElementBlock("p",R,e.toDisplayString(h.value.length>0?t.searchResultsLabel:t.searchNoResultsLabel),1)):(e.openBlock(),e.createElementBlock("div",{key:1,ref_key:"tabCategoryRef",ref:i,class:"d-emoji-picker__category d-emoji-picker__alignment"},[e.createBaseVNode("p",null,e.toDisplayString(v.value),1)],512)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(c),(s,n)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:n,ref_for:!0,ref:s.ref,class:"d-emoji-picker__alignment"},[n?(e.openBlock(),e.createElementBlock("p",x,e.toDisplayString(s.label),1)):e.createCommentVNode("",!0),e.createBaseVNode("div",q,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(e.emojisGrouped)[e.unref(u)[n]+t.skinTone]?e.unref(e.emojisGrouped)[e.unref(u)[n]+t.skinTone]:e.unref(e.emojisGrouped)[e.unref(u)[n]],d=>(e.openBlock(),e.createElementBlock("button",{key:d.shortname,type:"button","aria-label":d.name,onClick:g=>o.$emit("selected-emoji",d),onFocusin:g=>o.$emit("highlighted-emoji",d),onFocusout:a[0]||(a[0]=g=>o.$emit("highlighted-emoji",null)),onMouseover:g=>o.$emit("highlighted-emoji",d),onMouseleave:a[1]||(a[1]=g=>o.$emit("highlighted-emoji",null))},[e.createBaseVNode("img",{class:"d-icon d-icon--size-500",alt:d.name,"aria-label":d.name,title:d.name,src:y(d.unicode_character),onError:$},null,40,G)],40,O))),128))])])),[[e.vShow,!t.emojiFilter]])),128)),t.emojiFilter?(e.openBlock(),e.createElementBlock("div",P,[e.createBaseVNode("div",M,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(h.value,s=>(e.openBlock(),e.createElementBlock("button",{key:s.shortname,type:"button","aria-label":s.name,onClick:n=>o.$emit("selected-emoji",s),onFocusin:n=>o.$emit("highlighted-emoji",s),onFocusout:a[2]||(a[2]=n=>o.$emit("highlighted-emoji",null)),onMouseover:n=>o.$emit("highlighted-emoji",s),onMouseleave:a[3]||(a[3]=n=>o.$emit("highlighted-emoji",null))},[e.createBaseVNode("img",{class:"d-icon d-icon--size-500",alt:s.name,"aria-label":s.name,title:s.name,src:`${e.unref(T)+s.unicode_character}.png`},null,8,J)],40,z))),128))])])):e.createCommentVNode("",!0)],512)]))}},K=e._export_sfc(H,[["__scopeId","data-v-183240d8"]]);const Q={class:"d-emoji-picker__skin-list"},W=["onClick"],X=["alt","aria-label","title","src"],Y={class:"d-emoji-picker__skin-selected"},Z=["alt","aria-label","title","src"],ee={__name:"emoji_skin_selector",props:{skinTone:{type:String,required:!0},isHovering:{type:Boolean,default:!1},skinSelectorButtonTooltipLabel:{type:String,required:!0}},emits:["skin-tone"],setup(t,{emit:b}){const l=t,i=[{name:":wave_tone1:",unicode_output:"1f44b-1f3fb",skinTone:"Light",skinCode:"_tone1"},{name:":wave_tone2:",unicode_output:"1f44b-1f3fc",skinTone:"MediumLight",skinCode:"_tone2"},{name:":wave_tone3:",unicode_output:"1f44b-1f3fd",skinTone:"Medium",skinCode:"_tone3"},{name:":wave_tone4:",unicode_output:"1f44b-1f3fe",skinTone:"MediumDark",skinCode:"_tone4"},{name:":wave_tone5:",unicode_output:"1f44b-1f3ff",skinTone:"Dark",skinCode:"_tone5"},{name:":wave:",unicode_output:"1f44b",skinTone:"Default",skinCode:""}],m=e.ref(i.find(c=>c.skinTone===l.skinTone)),r=e.ref(!1);e.watchEffect(()=>l.isHovering&&(r.value=!1));function f(c){m.value=c,r.value=!1,b("skin-tone",c.skinTone)}return(c,v)=>(e.openBlock(),e.createElementBlock("div",null,[e.withDirectives(e.createBaseVNode("div",Q,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(i,u=>e.createBaseVNode("button",{key:u.name,class:e.normalizeClass({selected:m.value.skinCode===u.skinCode}),onClick:h=>f(u)},[e.createBaseVNode("img",{class:"d-icon d-icon--size-500",alt:u.name,"aria-label":u.name,title:u.name,src:`${e.unref(T)+u.unicode_output}.png`},null,8,X)],10,W)),64))],512),[[e.vShow,r.value]]),e.withDirectives(e.createBaseVNode("div",Y,[e.createVNode(e.DtTooltip,{placement:"top-end"},{anchor:e.withCtx(()=>[e.createBaseVNode("button",{onClick:v[0]||(v[0]=u=>r.value=!0)},[e.createBaseVNode("img",{class:"d-icon d-icon--size-500",alt:m.value.name,"aria-label":m.value.name,title:m.value.name,src:`${e.unref(T)+m.value.unicode_output}.png`},null,8,Z)])]),default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.skinSelectorButtonTooltipLabel)+" ",1)]),_:1})],512),[[e.vShow,!r.value]])]))}},te=e._export_sfc(ee,[["__scopeId","data-v-5c3fd4f6"]]);const oe={class:"d-emoji-picker__data"},le=["alt","aria-label","title","src"],ne={__name:"emoji_description",props:{emoji:{type:Object,default:null}},setup(t){return(b,l)=>{var i;return e.openBlock(),e.createElementBlock("div",oe,[t.emoji?(e.openBlock(),e.createElementBlock("img",{key:0,class:"d-icon d-icon--size-500",alt:t.emoji.name,"aria-label":t.emoji.name,title:t.emoji.name,src:`${e.unref(T)+t.emoji.unicode_character}.png`},null,8,le)):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString((i=t.emoji)==null?void 0:i.name),1)])}}},ie=e._export_sfc(ne,[["__scopeId","data-v-48c61881"]]);const se={class:"d-emoji-picker"},ae={class:"d-emoji-picker--header"},re={class:"d-emoji-picker--body"},ce={class:"d-emoji-picker--footer"},ue={__name:"emoji_picker",props:{recentlyUsedEmojis:{type:Array,default:()=>[]},searchPlaceholderLabel:{type:String,required:!0},searchResultsLabel:{type:String,required:!0},searchNoResultsLabel:{type:String,required:!0},tabSetLabels:{type:Array,required:!0},skinTone:{type:String,default:"Default"},skinSelectorButtonTooltipLabel:{type:String,required:!0}},emits:["selected-emoji","skin-tone"],setup(t,{emit:b}){const l=t,i=e.ref(""),m=e.ref(null),r=e.ref({}),f=e.ref(0),c=e.ref(!1),v=e.computed(()=>l.recentlyUsedEmojis.length>0);function u(_){i.value="",r.value=_,r.value={...r.value,tabId:_}}function h(_){f.value=_}function p(_){c.value=_}function E(_){m.value=_}return(_,k)=>(e.openBlock(),e.createElementBlock("div",se,[e.createBaseVNode("div",ae,[e.createVNode(F,{"emoji-filter":i.value,"show-recently-used-tab":e.unref(v),"scroll-into-tab":f.value,"tabset-labels":t.tabSetLabels,"is-scrolling":c.value,onSelectedTabset:u},null,8,["emoji-filter","show-recently-used-tab","scroll-into-tab","tabset-labels","is-scrolling"])]),e.createBaseVNode("div",re,[e.createVNode(U,{modelValue:i.value,"onUpdate:modelValue":k[0]||(k[0]=y=>i.value=y),"search-placeholder-label":t.searchPlaceholderLabel},null,8,["modelValue","search-placeholder-label"]),e.createVNode(K,{"emoji-filter":i.value,"skin-tone":t.skinTone,"tabset-labels":t.tabSetLabels,"search-results-label":t.searchResultsLabel,"search-no-results-label":t.searchNoResultsLabel,"recently-used-emojis":t.recentlyUsedEmojis,"selected-tabset":r.value,onScrollIntoTab:h,onIsScrolling:p,onHighlightedEmoji:E,onSelectedEmoji:k[1]||(k[1]=y=>b("selected-emoji",y))},null,8,["emoji-filter","skin-tone","tabset-labels","search-results-label","search-no-results-label","recently-used-emojis","selected-tabset"])]),e.createBaseVNode("div",ce,[e.createVNode(ie,{emoji:m.value},null,8,["emoji"]),e.createVNode(te,{"is-hovering":!!m.value,"skin-selector-button-tooltip-label":t.skinSelectorButtonTooltipLabel,"skin-tone":t.skinTone,onSkinTone:k[2]||(k[2]=y=>b("skin-tone",y))},null,8,["is-hovering","skin-selector-button-tooltip-label","skin-tone"])])]))}};exports.DtEmoji=e.DtEmoji;exports.DtEmojiTextWrapper=e._sfc_main;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.DtEmojiPicker=ue;
|
package/dist/emoji.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { _ as
|
|
2
|
-
import {
|
|
3
|
-
import { openBlock as i, createElementBlock as d, createVNode as T, createSlots as Z, withCtx as F, createElementVNode as v, computed as D, ref as f, toRefs as ee, watch as w, Fragment as U, renderList as R, unref as h, createBlock as te, withModifiers as le, nextTick as oe, onMounted as se, onUnmounted as ne, toDisplayString as A, withDirectives as M, createCommentVNode as O, vShow as x, watchEffect as ae, normalizeClass as ie, createTextVNode as P } from "vue";
|
|
1
|
+
import { _ as B, o as i, c as d, i as T, B as Q, p as F, b as v, D as N, af as W, a6 as D, a5 as f, aK as X, a7 as w, F as U, y as R, f as Y, u as Z, aq as ee, aa as h, ap as te, aL as k, a9 as le, a8 as oe, aM as se, t as A, G as M, H as O, a as P, aN as ae, n as ne, j as z, ag as ie } from "./emoji_text_wrapper-2f4dd42b.js";
|
|
2
|
+
import { b7 as He, ai as Ge, b3 as Je, aQ as Ke, aP as Qe, aU as We, aS as Xe, aT as Ye, aR as Ze, aV as et, aO as tt, b5 as lt, b6 as ot, b4 as st, aW as at, a_ as nt, aZ as it, aY as rt, aX as ct, b0 as ut, b2 as dt, b1 as mt, a$ as bt } from "./emoji_text_wrapper-2f4dd42b.js";
|
|
4
3
|
const re = { class: "d-emoji-picker__search d-emoji-picker__alignment" }, ce = { class: "d-emoji-picker__search-button" }, ue = {
|
|
5
4
|
__name: "emoji_search",
|
|
6
5
|
props: {
|
|
@@ -16,13 +15,13 @@ const re = { class: "d-emoji-picker__search d-emoji-picker__alignment" }, ce = {
|
|
|
16
15
|
emits: ["update:modelValue"],
|
|
17
16
|
setup(e) {
|
|
18
17
|
return (_, l) => (i(), d("div", re, [
|
|
19
|
-
T(
|
|
18
|
+
T(W, {
|
|
20
19
|
placeholder: e.searchPlaceholderLabel,
|
|
21
20
|
"model-value": e.modelValue,
|
|
22
21
|
"onUpdate:modelValue": l[1] || (l[1] = (s) => _.$emit("update:modelValue", s))
|
|
23
|
-
},
|
|
22
|
+
}, Q({
|
|
24
23
|
leftIcon: F(() => [
|
|
25
|
-
T(
|
|
24
|
+
T(N, { name: "search" })
|
|
26
25
|
]),
|
|
27
26
|
_: 2
|
|
28
27
|
}, [
|
|
@@ -30,7 +29,7 @@ const re = { class: "d-emoji-picker__search d-emoji-picker__alignment" }, ce = {
|
|
|
30
29
|
name: "rightIcon",
|
|
31
30
|
fn: F(() => [
|
|
32
31
|
v("button", ce, [
|
|
33
|
-
T(
|
|
32
|
+
T(N, {
|
|
34
33
|
name: "close",
|
|
35
34
|
onClick: l[0] || (l[0] = (s) => _.$emit("update:modelValue", ""))
|
|
36
35
|
})
|
|
@@ -41,7 +40,7 @@ const re = { class: "d-emoji-picker__search d-emoji-picker__alignment" }, ce = {
|
|
|
41
40
|
]), 1032, ["placeholder", "model-value"])
|
|
42
41
|
]));
|
|
43
42
|
}
|
|
44
|
-
}, de = /* @__PURE__ */
|
|
43
|
+
}, de = /* @__PURE__ */ B(ue, [["__scopeId", "data-v-20dd73b1"]]);
|
|
45
44
|
const me = { class: "d-emoji-picker__tabset" }, be = {
|
|
46
45
|
__name: "emoji_tabset",
|
|
47
46
|
props: {
|
|
@@ -100,7 +99,7 @@ const me = { class: "d-emoji-picker__tabset" }, be = {
|
|
|
100
99
|
label: l.tabsetLabels[p],
|
|
101
100
|
id: (p + 1).toString(),
|
|
102
101
|
panelId: (p + 1).toString()
|
|
103
|
-
}))), r = D(() => l.emojiFilter.length > 0), g = f("1"), { isScrolling: c } =
|
|
102
|
+
}))), r = D(() => l.emojiFilter.length > 0), g = f("1"), { isScrolling: c } = X(l);
|
|
104
103
|
w(
|
|
105
104
|
() => l.scrollIntoTab,
|
|
106
105
|
() => {
|
|
@@ -116,21 +115,21 @@ const me = { class: "d-emoji-picker__tabset" }, be = {
|
|
|
116
115
|
c.value || (g.value = u), _("selected-tabset", u);
|
|
117
116
|
}
|
|
118
117
|
return (u, $) => (i(), d("div", me, [
|
|
119
|
-
T(
|
|
118
|
+
T(te, {
|
|
120
119
|
"tab-list-class": "d-emoji-picker__tabset-list",
|
|
121
120
|
selected: g.value
|
|
122
121
|
}, {
|
|
123
122
|
tabs: F(() => [
|
|
124
|
-
(i(!0), d(U, null, R(h(b), (p) => (i(),
|
|
123
|
+
(i(!0), d(U, null, R(h(b), (p) => (i(), Y(ee, {
|
|
125
124
|
id: p.id,
|
|
126
125
|
key: p.id,
|
|
127
126
|
"panel-id": p.panelId,
|
|
128
127
|
label: p.label,
|
|
129
128
|
"aria-controls": "d-emoji-picker-list",
|
|
130
|
-
onClickCapture:
|
|
129
|
+
onClickCapture: Z((q) => y(p.id), ["stop"])
|
|
131
130
|
}, {
|
|
132
131
|
default: F(() => [
|
|
133
|
-
T(
|
|
132
|
+
T(N, {
|
|
134
133
|
size: "400",
|
|
135
134
|
name: p.icon
|
|
136
135
|
}, null, 8, ["name"])
|
|
@@ -142,7 +141,7 @@ const me = { class: "d-emoji-picker__tabset" }, be = {
|
|
|
142
141
|
}, 8, ["selected"])
|
|
143
142
|
]));
|
|
144
143
|
}
|
|
145
|
-
},
|
|
144
|
+
}, V = "https://static.dialpadcdn.com/joypixels/png/unicode/32/";
|
|
146
145
|
const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
147
146
|
key: 0,
|
|
148
147
|
class: "d-emoji-picker__search-label d-emoji-picker__alignment"
|
|
@@ -241,7 +240,7 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
241
240
|
...k[`Objects${l.skinTone}`],
|
|
242
241
|
...k.Symbols,
|
|
243
242
|
...k.Flags
|
|
244
|
-
]),
|
|
243
|
+
]), q = E(() => {
|
|
245
244
|
j();
|
|
246
245
|
});
|
|
247
246
|
w(p, () => {
|
|
@@ -253,37 +252,37 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
253
252
|
},
|
|
254
253
|
{ immediate: !0 }
|
|
255
254
|
), w(() => l.emojiFilter, () => {
|
|
256
|
-
|
|
255
|
+
J(), q();
|
|
257
256
|
}), w(
|
|
258
257
|
() => l.selectedTabset,
|
|
259
258
|
(t) => {
|
|
260
|
-
|
|
259
|
+
G(t.tabId);
|
|
261
260
|
},
|
|
262
261
|
{ deep: !0 }
|
|
263
262
|
);
|
|
264
263
|
function j() {
|
|
265
264
|
const t = l.emojiFilter.toLowerCase();
|
|
266
|
-
$.value = p.value.filter((
|
|
267
|
-
const
|
|
268
|
-
return
|
|
265
|
+
$.value = p.value.filter((n) => {
|
|
266
|
+
const a = n.name.toLowerCase().includes(t), o = n.keywords.some((m) => m.toLowerCase().includes(t));
|
|
267
|
+
return a || o;
|
|
269
268
|
});
|
|
270
269
|
}
|
|
271
|
-
function E(t,
|
|
272
|
-
let
|
|
270
|
+
function E(t, n = 300) {
|
|
271
|
+
let a;
|
|
273
272
|
return (...o) => {
|
|
274
|
-
clearTimeout(
|
|
273
|
+
clearTimeout(a), a = setTimeout(() => t(...o), n);
|
|
275
274
|
};
|
|
276
275
|
}
|
|
277
276
|
function C(t) {
|
|
278
|
-
return `${
|
|
277
|
+
return `${V + t}.png`;
|
|
279
278
|
}
|
|
280
279
|
function H(t) {
|
|
281
280
|
t.target.parentNode.style.display = "none";
|
|
282
281
|
}
|
|
283
|
-
function
|
|
284
|
-
const
|
|
285
|
-
|
|
286
|
-
const o = b.value, m = t === "1" ? 0 :
|
|
282
|
+
function G(t) {
|
|
283
|
+
const a = c.value[t - 1].ref.value[0];
|
|
284
|
+
le(() => {
|
|
285
|
+
const o = b.value, m = t === "1" ? 0 : a.offsetTop - 20;
|
|
287
286
|
let S = !0, I = o.scrollTop;
|
|
288
287
|
_("is-scrolling", !0), o.addEventListener("scroll", () => {
|
|
289
288
|
if (S) {
|
|
@@ -293,26 +292,26 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
293
292
|
}), o.scrollTop = m;
|
|
294
293
|
});
|
|
295
294
|
}
|
|
296
|
-
function
|
|
295
|
+
function J() {
|
|
297
296
|
const t = b.value;
|
|
298
297
|
t.scrollTop = 0;
|
|
299
298
|
}
|
|
300
299
|
function K() {
|
|
301
300
|
r.value = new IntersectionObserver((t) => {
|
|
302
|
-
t.forEach((
|
|
303
|
-
var m, S, I, L,
|
|
304
|
-
const { target:
|
|
305
|
-
|
|
301
|
+
t.forEach((n) => {
|
|
302
|
+
var m, S, I, L, x;
|
|
303
|
+
const { target: a } = n, o = parseInt(a.dataset.index);
|
|
304
|
+
n.isIntersecting && a.offsetTop <= s.value.offsetTop + 50 ? (y.value = ((m = c.value[o - 1]) == null ? void 0 : m.label) ?? ((S = c.value[0]) == null ? void 0 : S.label), _("scroll-into-tab", o - 1)) : n.boundingClientRect.bottom <= ((I = s.value) == null ? void 0 : I.getBoundingClientRect().bottom) ? (_("scroll-into-tab", o), y.value = (L = c.value[o]) == null ? void 0 : L.label) : o === 1 && (_("scroll-into-tab", o), y.value = (x = c.value[0]) == null ? void 0 : x.label);
|
|
306
305
|
});
|
|
307
|
-
}), r.value.observe(s.value), Array.from(b.value.children).forEach((t,
|
|
308
|
-
r.value.observe(t), t.dataset.index =
|
|
306
|
+
}), r.value.observe(s.value), Array.from(b.value.children).forEach((t, n) => {
|
|
307
|
+
r.value.observe(t), t.dataset.index = n;
|
|
309
308
|
});
|
|
310
309
|
}
|
|
311
|
-
return
|
|
310
|
+
return oe(() => {
|
|
312
311
|
K();
|
|
313
|
-
}),
|
|
312
|
+
}), se(() => {
|
|
314
313
|
r.value.disconnect();
|
|
315
|
-
}), (t,
|
|
314
|
+
}), (t, n) => (i(), d("div", _e, [
|
|
316
315
|
v("div", {
|
|
317
316
|
id: "d-emoji-picker-list",
|
|
318
317
|
ref_key: "listRef",
|
|
@@ -327,13 +326,13 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
327
326
|
}, [
|
|
328
327
|
v("p", null, A(y.value), 1)
|
|
329
328
|
], 512)),
|
|
330
|
-
(i(!0), d(U, null, R(h(c), (
|
|
329
|
+
(i(!0), d(U, null, R(h(c), (a, o) => M((i(), d("div", {
|
|
331
330
|
key: o,
|
|
332
331
|
ref_for: !0,
|
|
333
|
-
ref:
|
|
332
|
+
ref: a.ref,
|
|
334
333
|
class: "d-emoji-picker__alignment"
|
|
335
334
|
}, [
|
|
336
|
-
o ? (i(), d("p", pe, A(
|
|
335
|
+
o ? (i(), d("p", pe, A(a.label), 1)) : P("", !0),
|
|
337
336
|
v("div", fe, [
|
|
338
337
|
(i(!0), d(U, null, R(h(k)[h(u)[o] + e.skinTone] ? h(k)[h(u)[o] + e.skinTone] : h(k)[h(u)[o]], (m) => (i(), d("button", {
|
|
339
338
|
key: m.shortname,
|
|
@@ -341,9 +340,9 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
341
340
|
"aria-label": m.name,
|
|
342
341
|
onClick: (S) => t.$emit("selected-emoji", m),
|
|
343
342
|
onFocusin: (S) => t.$emit("highlighted-emoji", m),
|
|
344
|
-
onFocusout:
|
|
343
|
+
onFocusout: n[0] || (n[0] = (S) => t.$emit("highlighted-emoji", null)),
|
|
345
344
|
onMouseover: (S) => t.$emit("highlighted-emoji", m),
|
|
346
|
-
onMouseleave:
|
|
345
|
+
onMouseleave: n[1] || (n[1] = (S) => t.$emit("highlighted-emoji", null))
|
|
347
346
|
}, [
|
|
348
347
|
v("img", {
|
|
349
348
|
class: "d-icon d-icon--size-500",
|
|
@@ -356,34 +355,34 @@ const _e = { class: "d-emoji-picker__selector" }, ve = {
|
|
|
356
355
|
], 40, he))), 128))
|
|
357
356
|
])
|
|
358
357
|
])), [
|
|
359
|
-
[
|
|
358
|
+
[O, !e.emojiFilter]
|
|
360
359
|
])), 128)),
|
|
361
360
|
e.emojiFilter ? (i(), d("div", je, [
|
|
362
361
|
v("div", ke, [
|
|
363
|
-
(i(!0), d(U, null, R($.value, (
|
|
364
|
-
key:
|
|
362
|
+
(i(!0), d(U, null, R($.value, (a) => (i(), d("button", {
|
|
363
|
+
key: a.shortname,
|
|
365
364
|
type: "button",
|
|
366
|
-
"aria-label":
|
|
367
|
-
onClick: (o) => t.$emit("selected-emoji",
|
|
368
|
-
onFocusin: (o) => t.$emit("highlighted-emoji",
|
|
369
|
-
onFocusout:
|
|
370
|
-
onMouseover: (o) => t.$emit("highlighted-emoji",
|
|
371
|
-
onMouseleave:
|
|
365
|
+
"aria-label": a.name,
|
|
366
|
+
onClick: (o) => t.$emit("selected-emoji", a),
|
|
367
|
+
onFocusin: (o) => t.$emit("highlighted-emoji", a),
|
|
368
|
+
onFocusout: n[2] || (n[2] = (o) => t.$emit("highlighted-emoji", null)),
|
|
369
|
+
onMouseover: (o) => t.$emit("highlighted-emoji", a),
|
|
370
|
+
onMouseleave: n[3] || (n[3] = (o) => t.$emit("highlighted-emoji", null))
|
|
372
371
|
}, [
|
|
373
372
|
v("img", {
|
|
374
373
|
class: "d-icon d-icon--size-500",
|
|
375
|
-
alt:
|
|
376
|
-
"aria-label":
|
|
377
|
-
title:
|
|
378
|
-
src: `${h(
|
|
374
|
+
alt: a.name,
|
|
375
|
+
"aria-label": a.name,
|
|
376
|
+
title: a.name,
|
|
377
|
+
src: `${h(V) + a.unicode_character}.png`
|
|
379
378
|
}, null, 8, Te)
|
|
380
379
|
], 40, ye))), 128))
|
|
381
380
|
])
|
|
382
|
-
])) :
|
|
381
|
+
])) : P("", !0)
|
|
383
382
|
], 512)
|
|
384
383
|
]));
|
|
385
384
|
}
|
|
386
|
-
}, $e = /* @__PURE__ */
|
|
385
|
+
}, $e = /* @__PURE__ */ B(Se, [["__scopeId", "data-v-183240d8"]]);
|
|
387
386
|
const Ee = { class: "d-emoji-picker__skin-list" }, Le = ["onClick"], Ce = ["alt", "aria-label", "title", "src"], Ie = { class: "d-emoji-picker__skin-selected" }, we = ["alt", "aria-label", "title", "src"], De = {
|
|
388
387
|
__name: "emoji_skin_selector",
|
|
389
388
|
props: {
|
|
@@ -462,7 +461,7 @@ const Ee = { class: "d-emoji-picker__skin-list" }, Le = ["onClick"], Ce = ["alt"
|
|
|
462
461
|
M(v("div", Ee, [
|
|
463
462
|
(i(), d(U, null, R(s, (u) => v("button", {
|
|
464
463
|
key: u.name,
|
|
465
|
-
class:
|
|
464
|
+
class: ne({
|
|
466
465
|
selected: b.value.skinCode === u.skinCode
|
|
467
466
|
}),
|
|
468
467
|
onClick: ($) => g(u)
|
|
@@ -472,14 +471,14 @@ const Ee = { class: "d-emoji-picker__skin-list" }, Le = ["onClick"], Ce = ["alt"
|
|
|
472
471
|
alt: u.name,
|
|
473
472
|
"aria-label": u.name,
|
|
474
473
|
title: u.name,
|
|
475
|
-
src: `${h(
|
|
474
|
+
src: `${h(V) + u.unicode_output}.png`
|
|
476
475
|
}, null, 8, Ce)
|
|
477
476
|
], 10, Le)), 64))
|
|
478
477
|
], 512), [
|
|
479
|
-
[
|
|
478
|
+
[O, r.value]
|
|
480
479
|
]),
|
|
481
480
|
M(v("div", Ie, [
|
|
482
|
-
T(
|
|
481
|
+
T(ie, { placement: "top-end" }, {
|
|
483
482
|
anchor: F(() => [
|
|
484
483
|
v("button", {
|
|
485
484
|
onClick: y[0] || (y[0] = (u) => r.value = !0)
|
|
@@ -489,21 +488,21 @@ const Ee = { class: "d-emoji-picker__skin-list" }, Le = ["onClick"], Ce = ["alt"
|
|
|
489
488
|
alt: b.value.name,
|
|
490
489
|
"aria-label": b.value.name,
|
|
491
490
|
title: b.value.name,
|
|
492
|
-
src: `${h(
|
|
491
|
+
src: `${h(V) + b.value.unicode_output}.png`
|
|
493
492
|
}, null, 8, we)
|
|
494
493
|
])
|
|
495
494
|
]),
|
|
496
495
|
default: F(() => [
|
|
497
|
-
|
|
496
|
+
z(A(e.skinSelectorButtonTooltipLabel) + " ", 1)
|
|
498
497
|
]),
|
|
499
498
|
_: 1
|
|
500
499
|
})
|
|
501
500
|
], 512), [
|
|
502
|
-
[
|
|
501
|
+
[O, !r.value]
|
|
503
502
|
])
|
|
504
503
|
]));
|
|
505
504
|
}
|
|
506
|
-
}, Fe = /* @__PURE__ */
|
|
505
|
+
}, Fe = /* @__PURE__ */ B(De, [["__scopeId", "data-v-5c3fd4f6"]]);
|
|
507
506
|
const Ue = { class: "d-emoji-picker__data" }, Re = ["alt", "aria-label", "title", "src"], Ae = {
|
|
508
507
|
__name: "emoji_description",
|
|
509
508
|
props: {
|
|
@@ -527,14 +526,14 @@ const Ue = { class: "d-emoji-picker__data" }, Re = ["alt", "aria-label", "title"
|
|
|
527
526
|
alt: e.emoji.name,
|
|
528
527
|
"aria-label": e.emoji.name,
|
|
529
528
|
title: e.emoji.name,
|
|
530
|
-
src: `${h(
|
|
531
|
-
}, null, 8, Re)) :
|
|
532
|
-
|
|
529
|
+
src: `${h(V) + e.emoji.unicode_character}.png`
|
|
530
|
+
}, null, 8, Re)) : P("", !0),
|
|
531
|
+
z(" " + A((s = e.emoji) == null ? void 0 : s.name), 1)
|
|
533
532
|
]);
|
|
534
533
|
};
|
|
535
534
|
}
|
|
536
|
-
},
|
|
537
|
-
const
|
|
535
|
+
}, Ve = /* @__PURE__ */ B(Ae, [["__scopeId", "data-v-48c61881"]]);
|
|
536
|
+
const qe = { class: "d-emoji-picker" }, Be = { class: "d-emoji-picker--header" }, Ne = { class: "d-emoji-picker--body" }, Me = { class: "d-emoji-picker--footer" }, Pe = {
|
|
538
537
|
__name: "emoji_picker",
|
|
539
538
|
props: {
|
|
540
539
|
/**
|
|
@@ -647,11 +646,11 @@ const Ve = { class: "d-emoji-picker" }, Ne = { class: "d-emoji-picker--header" }
|
|
|
647
646
|
function p(j) {
|
|
648
647
|
c.value = j;
|
|
649
648
|
}
|
|
650
|
-
function
|
|
649
|
+
function q(j) {
|
|
651
650
|
b.value = j;
|
|
652
651
|
}
|
|
653
|
-
return (j, E) => (i(), d("div",
|
|
654
|
-
v("div",
|
|
652
|
+
return (j, E) => (i(), d("div", qe, [
|
|
653
|
+
v("div", Be, [
|
|
655
654
|
T(be, {
|
|
656
655
|
"emoji-filter": s.value,
|
|
657
656
|
"show-recently-used-tab": h(y),
|
|
@@ -661,7 +660,7 @@ const Ve = { class: "d-emoji-picker" }, Ne = { class: "d-emoji-picker--header" }
|
|
|
661
660
|
onSelectedTabset: u
|
|
662
661
|
}, null, 8, ["emoji-filter", "show-recently-used-tab", "scroll-into-tab", "tabset-labels", "is-scrolling"])
|
|
663
662
|
]),
|
|
664
|
-
v("div",
|
|
663
|
+
v("div", Ne, [
|
|
665
664
|
T(de, {
|
|
666
665
|
modelValue: s.value,
|
|
667
666
|
"onUpdate:modelValue": E[0] || (E[0] = (C) => s.value = C),
|
|
@@ -677,12 +676,12 @@ const Ve = { class: "d-emoji-picker" }, Ne = { class: "d-emoji-picker--header" }
|
|
|
677
676
|
"selected-tabset": r.value,
|
|
678
677
|
onScrollIntoTab: $,
|
|
679
678
|
onIsScrolling: p,
|
|
680
|
-
onHighlightedEmoji:
|
|
679
|
+
onHighlightedEmoji: q,
|
|
681
680
|
onSelectedEmoji: E[1] || (E[1] = (C) => _("selected-emoji", C))
|
|
682
681
|
}, null, 8, ["emoji-filter", "skin-tone", "tabset-labels", "search-results-label", "search-no-results-label", "recently-used-emojis", "selected-tabset"])
|
|
683
682
|
]),
|
|
684
683
|
v("div", Me, [
|
|
685
|
-
T(
|
|
684
|
+
T(Ve, { emoji: b.value }, null, 8, ["emoji"]),
|
|
686
685
|
T(Fe, {
|
|
687
686
|
"is-hovering": !!b.value,
|
|
688
687
|
"skin-selector-button-tooltip-label": e.skinSelectorButtonTooltipLabel,
|
|
@@ -694,28 +693,28 @@ const Ve = { class: "d-emoji-picker" }, Ne = { class: "d-emoji-picker--header" }
|
|
|
694
693
|
}
|
|
695
694
|
};
|
|
696
695
|
export {
|
|
697
|
-
|
|
698
|
-
|
|
696
|
+
He as DtEmoji,
|
|
697
|
+
Pe as DtEmojiPicker,
|
|
699
698
|
Ge as DtEmojiTextWrapper,
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
699
|
+
Je as codeToEmojiData,
|
|
700
|
+
Ke as customEmojiAssetUrl,
|
|
701
|
+
Qe as defaultEmojiAssetUrl,
|
|
702
|
+
We as emojiFileExtensionLarge,
|
|
703
|
+
Xe as emojiFileExtensionSmall,
|
|
704
|
+
Ye as emojiImageUrlLarge,
|
|
705
|
+
Ze as emojiImageUrlSmall,
|
|
706
|
+
et as emojiJson,
|
|
707
|
+
tt as emojiVersion,
|
|
708
|
+
lt as filterValidShortCodes,
|
|
709
|
+
ot as findEmojis,
|
|
710
|
+
st as findShortCodes,
|
|
712
711
|
at as getEmojiData,
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
712
|
+
nt as setCustomEmojiJson,
|
|
713
|
+
it as setCustomEmojiUrl,
|
|
714
|
+
rt as setEmojiAssetUrlLarge,
|
|
715
|
+
ct as setEmojiAssetUrlSmall,
|
|
716
|
+
ut as shortcodeToEmojiData,
|
|
717
|
+
dt as stringToUnicode,
|
|
718
|
+
mt as unicodeToString,
|
|
719
|
+
bt as validateCustomEmojiJson
|
|
721
720
|
};
|