{"version":3,"file":"emoji.cjs","sources":["../../../components/emoji/emoji.vue"],"sourcesContent":["<template>\n  <span :class=\"['d-emoji d-icon', emojiSize]\">\n    <dt-skeleton\n      v-show=\"imgLoading && showSkeleton\"\n      :offset=\"0\"\n      :class=\"['d-icon', emojiSize]\"\n      :shape-option=\"{ shape: 'circle', size: '100%' }\"\n    />\n    <img\n      v-show=\"!imgLoading\"\n      ref=\"emojiImg\"\n      :class=\"['d-icon', emojiSize, imgClass]\"\n      :aria-label=\"emojiLabel\"\n      :alt=\"emojiAlt\"\n      :title=\"emojiLabel\"\n      :src=\"emojiSrc\"\n      @load=\"imageLoaded\"\n      @error=\"imageErrored\"\n    >\n  </span>\n</template>\n\n<script>\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon';\nimport {\n  codeToEmojiData,\n  stringToUnicode,\n  emojiImageUrlSmall,\n  emojiFileExtensionSmall,\n  emojiImageUrlLarge,\n  emojiFileExtensionLarge,\n  customEmojiAssetUrl,\n} from '@/common/emoji';\nimport { DtSkeleton } from '@/components/skeleton';\n\n/**\n * Renders an emoji from a shortcode such as :smile: or unicode character such as 😄\n * @see https://dialtone.dialpad.com/components/emoji.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtEmoji',\n\n  components: {\n    DtSkeleton,\n  },\n\n  props: {\n    /**\n     * Supports shortcode ex: :smile: or unicode ex: 😄. Will display the resulting emoji.\n     * <a class=\"d-link\" href=\"https://emojipedia.org/joypixels/\" target=\"_blank\">JoyPixels</a>\n     * for all supported shortcode/unicode or the docs for setting up custom emojis.\n     */\n    code: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * The size of the emoji. Can be any of the icon size utility classes from\n     * <a class=\"d-link\" href=\"https://dialtone.dialpad.com/components/icon.html\" target=\"_blank\"> Dialpad Icon Size</a>\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    size: {\n      type: String,\n      default: '500',\n      validator: (t) => Object.keys(ICON_SIZE_MODIFIERS).includes(t),\n    },\n\n    /**\n     * Additional class name for the emoji img element.\n     * Can accept String, Object, and Array, i.e. has the\n     * same API as Vue's built-in handling of the class attribute.\n     */\n    imgClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * Will be read out on a screen reader for this emoji. You must use this prop if you want your emoji to be i18n\n     * Compatible as Dialtone Vue will not translate it by itself. If you do not set this prop the aria-label will\n     * be set to the english description of the emoji. You can retrieve the description for an emoji yourself via the\n     * getEmojiData() function\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Shows a skeleton loader while the emoji asset is loading.\n     * @values true, false\n     */\n    showSkeleton: {\n      type: Boolean,\n      default: true,\n    },\n  },\n\n  data () {\n    return {\n      emojiData: null,\n      imgLoading: false,\n    };\n  },\n\n  computed: {\n    emojiDataValid () {\n      return !!this.emojiData;\n    },\n\n    emojiSrc () {\n      if (!this.emojiDataValid) { return 'invalid'; }\n\n      // custom emoji\n      if (this.emojiData?.custom) {\n        return customEmojiAssetUrl + this.emojiData.key + this.emojiData.extension;\n      }\n\n      if (['100', '200'].includes(this.size)) {\n        return emojiImageUrlSmall + this.emojiData.key + emojiFileExtensionSmall;\n      } else {\n        return emojiImageUrlLarge + this.emojiData.key + emojiFileExtensionLarge;\n      }\n    },\n\n    emojiAlt () {\n      if (!this.emojiDataValid) { return undefined; }\n      return this.emojiData.unicode_output ? stringToUnicode(this.emojiData.unicode_output) : this.emojiData.name;\n    },\n\n    emojiLabel () {\n      if (!this.emojiDataValid) { return 'Invalid Emoji'; }\n      return this.ariaLabel ? this.ariaLabel : this.emojiData.name;\n    },\n\n    emojiSize () {\n      return ICON_SIZE_MODIFIERS[this.size];\n    },\n  },\n\n  watch: {\n    code: {\n      handler: function () {\n        this.getEmojiData();\n      },\n\n      immediate: true,\n    },\n\n    emojiSrc: {\n      handler: async function () {\n        this.imgLoading = true;\n      },\n\n      immediate: true,\n    },\n  },\n\n  methods: {\n    getEmojiData () {\n      this.emojiData = codeToEmojiData(this.code);\n    },\n\n    imageLoaded () {\n      this.imgLoading = false;\n    },\n\n    imageErrored () {\n      this.imgLoading = false;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeleton","t","ICON_SIZE_MODIFIERS","_a","customEmojiAssetUrl","emojiImageUrlSmall","emojiFileExtensionSmall","emojiImageUrlLarge","emojiFileExtensionLarge","stringToUnicode","codeToEmojiData","_hoisted_1","_createElementBlock","_normalizeClass","$options","_createVNode","_component_dt_skeleton","_vShow","$data","$props","_createElementVNode","args"],"mappings":"qTAuCKA,EAAU,CACb,aAAc,CAAE,KAAM,CAAG,EACzB,KAAM,UAEN,WAAY,YACVC,EAAU,OACX,EAED,MAAO,CAML,KAAM,CACJ,KAAM,OACN,SAAU,EACX,EAOD,KAAM,CACJ,KAAM,OACN,QAAS,MACT,UAAYC,GAAM,OAAO,KAAKC,qBAAmB,EAAE,SAASD,CAAC,CAC9D,EAOD,SAAU,CACR,KAAM,CAAC,OAAQ,OAAQ,KAAK,EAC5B,QAAS,EACV,EAQD,UAAW,CACT,KAAM,OACN,QAAS,IACV,EAMD,aAAc,CACZ,KAAM,QACN,QAAS,EACV,CACF,EAED,MAAQ,CACN,MAAO,CACL,UAAW,KACX,WAAY,GAEf,EAED,SAAU,CACR,gBAAkB,CAChB,MAAO,CAAC,CAAC,KAAK,SACf,EAED,UAAY,OACV,OAAK,KAAK,gBAGNE,EAAA,KAAK,YAAL,MAAAA,EAAgB,OACXC,EAAAA,oBAAsB,KAAK,UAAU,IAAM,KAAK,UAAU,UAG/D,CAAC,MAAO,KAAK,EAAE,SAAS,KAAK,IAAI,EAC5BC,EAAiB,mBAAI,KAAK,UAAU,IAAMC,EAAAA,wBAE1CC,EAAiB,mBAAI,KAAK,UAAU,IAAMC,EAAAA,wBAVhB,SAYpC,EAED,UAAY,CACV,GAAK,KAAK,eACV,OAAO,KAAK,UAAU,eAAiBC,kBAAgB,KAAK,UAAU,cAAc,EAAI,KAAK,UAAU,IACxG,EAED,YAAc,CACZ,OAAK,KAAK,eACH,KAAK,UAAY,KAAK,UAAY,KAAK,UAAU,KADrB,eAEpC,EAED,WAAa,CACX,OAAOP,EAAmB,oBAAC,KAAK,IAAI,CACrC,CACF,EAED,MAAO,CACL,KAAM,CACJ,QAAS,UAAY,CACnB,KAAK,aAAY,CAClB,EAED,UAAW,EACZ,EAED,SAAU,CACR,QAAS,gBAAkB,CACzB,KAAK,WAAa,EACnB,EAED,UAAW,EACZ,CACF,EAED,QAAS,CACP,cAAgB,CACd,KAAK,UAAYQ,EAAAA,gBAAgB,KAAK,IAAI,CAC3C,EAED,aAAe,CACb,KAAK,WAAa,EACnB,EAED,cAAgB,CACd,KAAK,WAAa,EACnB,CACF,CACH,EA7KAC,EAAA,CAAA,aAAA,MAAA,QAAA,KAAA,yFACEC,EAkBO,mBAAA,OAAA,CAlBA,MADTC,EAAAA,iCACmCC,EAAS,SAAA,CAAA,qBACxCC,EAKE,YAAAC,EAAA,CAHC,OAAQ,EACR,MALPH,EAAAA,yBAKyBC,EAAS,SAAA,CAAA,EAC3B,eAAc,CAAiC,MAAA,SAAA,KAAA,MAAA,sBAHxC,CAAAG,EAAA,MAAAC,EAAA,YAAcC,EAAY,YAAA,qBAKpCC,EAUC,mBAAA,MAAA,CARC,IAAI,WACH,MAXPP,EAAA,eAAA,CAAA,SAWyBC,EAAS,UAAEK,EAAQ,QAAA,CAAA,EACrC,aAAYL,EAAU,WACtB,IAAKA,EAAQ,SACb,MAAOA,EAAU,WACjB,IAAKA,EAAQ,SACb,2BAAMA,EAAW,aAAAA,EAAA,YAAA,GAAAO,CAAA,GACjB,4BAAOP,EAAY,cAAAA,EAAA,aAAA,GAAAO,CAAA,EAjB1B,EAAA,KAAA,GAAAV,CAAA,EAAA,WASeO,EAAU,UAAA"}