UNPKG

@dialpad/dialtone

Version:

Dialpad's Dialtone design system monorepo

3 lines (2 loc) 2.49 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../common/emoji/index.cjs"),e=require("vue"),d=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),u=require("../skeleton/skeleton.cjs"),s=require("../icon/icon-constants.cjs"),c={compatConfig:{MODE:3},name:"DtEmoji",components:{DtSkeleton:u.default},props:{code:{type:String,required:!0},size:{type:String,default:"500",validator:a=>Object.keys(s.ICON_SIZE_MODIFIERS).includes(a)},imgClass:{type:[String,Object,Array],default:""},ariaLabel:{type:String,default:null},showSkeleton:{type:Boolean,default:!0}},data(){return{emojiData:null,imgLoading:!1}},computed:{emojiDataValid(){return!!this.emojiData},emojiSrc(){var a;return this.emojiDataValid?(a=this.emojiData)!=null&&a.custom?t.customEmojiAssetUrl+this.emojiData.key+this.emojiData.extension:["100","200"].includes(this.size)?t.emojiImageUrlSmall+this.emojiData.key+t.emojiFileExtensionSmall:t.emojiImageUrlLarge+this.emojiData.key+t.emojiFileExtensionLarge:"invalid"},emojiAlt(){if(this.emojiDataValid)return this.emojiData.unicode_output?t.stringToUnicode(this.emojiData.unicode_output):this.emojiData.name},emojiLabel(){return this.emojiDataValid?this.ariaLabel?this.ariaLabel:this.emojiData.name:"Invalid Emoji"},emojiSize(){return s.ICON_SIZE_MODIFIERS[this.size]}},watch:{code:{handler:function(){this.getEmojiData()},immediate:!0},emojiSrc:{handler:async function(){this.imgLoading=!0},immediate:!0}},methods:{getEmojiData(){this.emojiData=t.codeToEmojiData(this.code)},imageLoaded(){this.imgLoading=!1},imageErrored(){this.imgLoading=!1}}},j=["aria-label","alt","title","src"];function g(a,o,n,D,l,i){const m=e.resolveComponent("dt-skeleton");return e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["d-emoji d-icon",i.emojiSize])},[e.withDirectives(e.createVNode(m,{offset:0,class:e.normalizeClass(["d-icon",i.emojiSize]),"shape-option":{shape:"circle",size:"100%"}},null,8,["class"]),[[e.vShow,l.imgLoading&&n.showSkeleton]]),e.withDirectives(e.createElementVNode("img",{ref:"emojiImg",class:e.normalizeClass(["d-icon",i.emojiSize,n.imgClass]),"aria-label":i.emojiLabel,alt:i.emojiAlt,title:i.emojiLabel,src:i.emojiSrc,onLoad:o[0]||(o[0]=(...r)=>i.imageLoaded&&i.imageLoaded(...r)),onError:o[1]||(o[1]=(...r)=>i.imageErrored&&i.imageErrored(...r))},null,42,j),[[e.vShow,!l.imgLoading]])],2)}const h=d._(c,[["render",g]]);exports.default=h; //# sourceMappingURL=emoji.cjs.map