npm - @dialpad/dialtone - Versions diffs - 9.76.0 → 9.76.2 - Mend

@dialpad/dialtone 9.76.0 → 9.76.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.

Files changed (936) hide show

package/dist/vue2/components/emoji_picker/modules/emoji_selector.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"emoji_selector.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_selector.vue"],"sourcesContent":["<template>\n <div\n class=\"d-emoji-picker__selector\"\n >\n <div\n id=\"d-emoji-picker-list\"\n ref=\"listRef\"\n class=\"d-emoji-picker__list\"\n >\n <p\n v-if=\"emojiFilter\"\n class=\"d-emoji-picker__search-label d-emoji-picker__alignment\"\n >\n {{ filteredEmojis.length > 0 ? searchResultsLabel : searchNoResultsLabel }}\n </p>\n <div\n v-else\n ref=\"tabCategoryRef\"\n class=\"d-emoji-picker__category d-emoji-picker__alignment\"\n >\n <p>\n {{ fixedLabel }}\n </p>\n </div>\n <div\n v-for=\"(tabLabel, indexTab) in tabLabels\"\n v-show=\"!emojiFilter\"\n :key=\"indexTab\"\n :ref=\"`tabLabelRef-${indexTab}`\"\n class=\"d-emoji-picker__alignment\"\n >\n <p\n v-if=\"indexTab\"\n >\n {{ tabLabel.label }}\n </p>\n <div\n class=\"d-emoji-picker__tab\"\n >\n <button\n v-for=\"(emoji, indexEmoji) in\n (emojis[tabs[indexTab] + skinTone] ? emojis[tabs[indexTab] + skinTone] : emojis[tabs[indexTab]])\"\n :key=\"emoji.shortname\"\n :ref=\"`emojiRef-${indexTab}`\"\n type=\"button\"\n :aria-label=\"emoji.name\"\n @click=\"$emit('selected-emoji', emoji)\"\n @focusin=\"$emit('highlighted-emoji', emoji)\"\n @focusout=\"$emit('highlighted-emoji', null)\"\n @mouseover=\"$emit('highlighted-emoji', emoji)\"\n @mouseleave=\"$emit('highlighted-emoji', null)\"\n @keydown=\"event => handleKeyDown(event, indexTab, indexEmoji, emoji)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"emoji.name\"\n :aria-label=\"emoji.name\"\n :title=\"emoji.name\"\n :src=\"getImgSrc(emoji.unicode_character)\"\n @error=\"handleImageError\"\n >\n </button>\n </div>\n </div>\n <div\n v-if=\"emojiFilter\"\n class=\"d-emoji-picker__alignment\"\n >\n <div\n class=\"d-emoji-picker__tab \"\n data-qa=\"filtered-emojis\"\n >\n <button\n v-for=\"(emoji, index) in filteredEmojis\"\n :key=\"emoji.shortname\"\n :ref=\"`filteredEmoji-${index}`\"\n type=\"button\"\n :aria-label=\"emoji.name\"\n :class=\"{\n 'hover-emoji': (index === 0 && hoverFirstEmoji),\n }\"\n @click=\"$emit('selected-emoji', emoji)\"\n @focusin=\"$emit('highlighted-emoji', emoji)\"\n @focusout=\"$emit('highlighted-emoji', null)\"\n @mouseover=\"hoverEmoji(emoji)\"\n @mouseleave=\"hoverEmoji(null)\"\n @keydown=\"event => handleKeyDownFilteredEmojis(event, index, emoji)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"emoji.name\"\n :aria-label=\"emoji.name\"\n :title=\"emoji.name\"\n :src=\"`${CDN_URL + emoji.unicode_character}.png`\"\n >\n </button>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<script>\n/* eslint-disable max-len /\n/ eslint-disable max-lines /\nimport { emojisGrouped as emojisImported } from '@dialpad/dialtone-emojis';\nimport { CDN_URL, EMOJIS_PER_ROW } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiSelector',\n\n props: {\n emojiFilter: {\n type: String,\n default: '',\n },\n\n skinTone: {\n type: String,\n required: true,\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n\n selectedTabset: {\n type: Object,\n required: true,\n },\n\n searchResultsLabel: {\n type: String,\n required: true,\n },\n\n searchNoResultsLabel: {\n type: String,\n required: true,\n },\n\n recentlyUsedEmojis: {\n type: Array,\n default: () => [],\n },\n },\n\n data () {\n return {\n emojiRefs: [],\n emojiFilteredRefs: [],\n isFiltering: false,\n hoverFirstEmoji: true,\n fixedLabel: '',\n filteredEmojis: [],\n TABS_DATA: ['Recently used', 'People', 'Nature', 'Food', 'Activity', 'Travel', 'Objects', 'Symbols', 'Flags'],\n tabLabelObserver: null,\n };\n },\n\n computed: {\n / eslint-disable-next-line complexity /\n currentEmojis () {\n return [\n ...this.emojis[`People${this.skinTone}`] \|\| [],\n ...this.emojis.Nature \|\| [],\n ...this.emojis.Food \|\| [],\n ...this.emojis[`Activity${this.skinTone}`] \|\| [],\n ...this.emojis.Travel \|\| [],\n ...this.emojis[`Objects${this.skinTone}`] \|\| [],\n ...this.emojis.Symbols \|\| [],\n ...this.emojis.Flags \|\| [],\n ];\n },\n\n emojis () {\n return emojisImported;\n },\n\n CDN_URL () {\n return CDN_URL;\n },\n\n tabLabels () {\n return this.recentlyUsedEmojis.length\n ? this.tabSetLabels.map((label, index) => ({ label, ref: this.$refs[`tabLabelRef-${index}`] }))\n : this.tabSetLabels.slice(1).map((label, index) => ({ label, ref: this.$refs[`tabLabelRef-${index}`] }));\n },\n\n tabs () {\n return this.recentlyUsedEmojis.length ? this.TABS_DATA : this.TABS_DATA.slice(1);\n },\n },\n\n watch: {\n currentEmojis: {\n handler () {\n this.searchByNameAndKeywords();\n },\n\n immediate: true,\n },\n\n recentlyUsedEmojis: {\n handler (newValue) {\n this.emojis['Recently used'] = newValue;\n },\n\n immediate: true,\n },\n\n emojiFilter: {\n handler (newFilter) {\n this.resetScroll();\n if (newFilter) {\n this.isFiltering = true;\n } else {\n this.isFiltering = false;\n this.$emit('highlighted-emoji', null);\n }\n\n this.debouncedSearch();\n },\n },\n\n selectedTabset: {\n handler (newValue) {\n this.scrollToTab(newValue.tabId);\n },\n\n deep: true,\n },\n },\n\n created () {\n this.debouncedSearch = this.debounce(this.searchByNameAndKeywords, 300);\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setupEmojiRefs();\n this.setupFilteredRefs();\n this.setupTabLabelRefs();\n this.setTabLabelObserver();\n });\n },\n\n beforeDestroy () {\n if (this.tabLabelObserver) {\n this.tabLabelObserver.disconnect();\n }\n },\n\n methods: {\n setupTabLabelRefs () {\n this.tabSetLabels?.forEach((label, index) => {\n const refKey = `tabLabelRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabLabels, index, { label, ref: this.$refs[refKey] });\n }\n });\n },\n\n setupFilteredRefs () {\n // it is necessary to clean the array before setting the new refs\n this.emojiFilteredRefs = [];\n\n this.filteredEmojis.forEach((emoji, index) => {\n const refKey = `filteredEmoji-${index}`;\n if (this.$refs[refKey]) {\n this.setFilteredRef(this.$refs[refKey], index);\n }\n });\n },\n\n setupEmojiRefs () {\n for (let i = 0; i < this.tabs.length; i++) {\n const refKey = `emojiRef-${i}`;\n if (this.$refs[refKey]) {\n this.$refs[refKey].forEach((el, indexEmoji) => {\n if (el) {\n this.setEmojiRef(el, i, indexEmoji);\n }\n });\n }\n }\n },\n\n searchByNameAndKeywords () {\n const searchStr = this.emojiFilter.toLowerCase();\n this.filteredEmojis = this.currentEmojis.filter(function (obj) {\n const nameIncludesSearchStr = obj.name.toLowerCase().includes(searchStr);\n const keywordsIncludeSearchStr = obj.keywords.some(function (keyword) {\n return keyword.toLowerCase().includes(searchStr);\n });\n return nameIncludesSearchStr \|\| keywordsIncludeSearchStr;\n });\n this.$nextTick(function () {\n if (searchStr) {\n this.hoverEmoji(this.filteredEmojis[0], true);\n this.setupFilteredRefs();\n }\n });\n },\n\n debounce: function (fn, delay) {\n if (delay === undefined) { delay = 300; }\n let timeout;\n return function () {\n const args = []; let len = arguments.length;\n while (len--) args[len] = arguments[len];\n\n clearTimeout(timeout);\n timeout = setTimeout(function () {\n fn.apply(undefined, args);\n }, delay);\n };\n },\n\n getImgSrc: function (emoji) {\n return this.CDN_URL + emoji + '.png';\n },\n\n handleImageError: function (event) {\n event.target.parentNode.style.display = 'none';\n },\n\n scrollToTab: function (tabIndex, focusFirstEmoji) {\n const vm = this;\n if (focusFirstEmoji === undefined) { focusFirstEmoji = true; }\n const tabLabel = vm.tabLabels[tabIndex - 1];\n const tabElement = tabLabel.ref[0];\n\n vm.$nextTick(function () {\n const container = vm.$refs.listRef;\n const offsetTop = tabIndex === '1' ? 0 : tabElement.offsetTop - 20;\n\n let isScrolling = true;\n let prevScrollTop = container.scrollTop;\n vm.$emit('is-scrolling', true);\n\n / eslint-disable-next-line complexity /\n container.addEventListener('scroll', function () {\n if (isScrolling) {\n const scrollTop = container.scrollTop;\n if (\n (prevScrollTop < scrollTop && scrollTop >= offsetTop) \|\|\n (prevScrollTop > scrollTop && scrollTop <= offsetTop)\n ) {\n isScrolling = false;\n vm.$emit('is-scrolling', false);\n }\n prevScrollTop = scrollTop;\n }\n });\n\n container.scrollTop = offsetTop;\n\n if (focusFirstEmoji) {\n vm.focusEmoji(tabIndex - 1, 0);\n }\n });\n },\n\n resetScroll: function () {\n const container = this.$refs.listRef;\n container.scrollTop = 0;\n },\n\n focusEmojiSelector: function () {\n this.focusEmoji(0, 0);\n },\n\n hoverEmoji (emoji, isFirst) {\n if (isFirst === undefined) { isFirst = false; }\n this.hoverFirstEmoji = isFirst;\n this.$emit('highlighted-emoji', emoji);\n },\n\n setEmojiRef: function (el, indexTab, indexEmoji) {\n if (!this.emojiRefs[indexTab]) {\n this.$set(this.emojiRefs, indexTab, []);\n }\n this.$set(this.emojiRefs[indexTab], indexEmoji, el);\n },\n\n setFilteredRef: function (el, index) {\n this.$set(this.emojiFilteredRefs, index, el);\n },\n\n focusEmoji: function (indexTab, indexEmoji) {\n // eslint-disable-next-line max-len\n const emojiRef = this.isFiltering ? this.emojiFilteredRefs[indexEmoji]?.[0] : this.emojiRefs[indexTab] && this.emojiRefs[indexTab][indexEmoji];\n if (emojiRef) {\n emojiRef.focus();\n return true;\n }\n\n return false;\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown: function (event, indexTab, indexEmoji, emoji) {\n event.preventDefault();\n\n if (event.key === 'ArrowUp') {\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n if (indexTab === 0) {\n // we are on the first emoji tab, then we should jump to the last row of the last emoji tab\n const numberOfMissingEmojis =\n EMOJIS_PER_ROW - (this.emojiRefs[this.emojiRefs.length - 1].length % EMOJIS_PER_ROW);\n\n const emojiToJump =\n this.emojiRefs[this.emojiRefs.length - 1].length + numberOfMissingEmojis - (EMOJIS_PER_ROW - position);\n\n if (!this.focusEmoji(this.emojiRefs.length - 1, emojiToJump)) {\n // if there is no emoji in this position, jump to the last emoji of the row\n this.focusEmoji(this.emojiRefs.length - 1, this.emojiRefs[this.emojiRefs.length - 1].length - 1);\n }\n return;\n }\n\n // if we are not on the first tab, we should jump to the previous row of the current tab\n if (!this.focusEmoji(indexTab, indexEmoji - EMOJIS_PER_ROW)) {\n // if there is no previous row, we should jump to emoji in the sampe position of the previous tab\n const previousTab = indexTab - 1 < 0 ? 0 : indexTab - 1;\n const emojisInPreviousTab = this.emojiRefs[previousTab].length;\n const lastEmojiPosition = emojisInPreviousTab - (emojisInPreviousTab % EMOJIS_PER_ROW) + position;\n\n if (!this.focusEmoji(previousTab, lastEmojiPosition)) {\n // if there is no emoji in this position, jump to the last emoji of the row\n this.focusEmoji(indexTab - 1, this.emojiRefs[indexTab - 1].length - 1);\n }\n }\n }\n\n if (event.key === 'ArrowDown') {\n if (!this.focusEmoji(indexTab, indexEmoji + EMOJIS_PER_ROW)) {\n // if cannot go down\n\n // Calculate position from cell 0 to cell 8\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n // check if it exists a next row in the current tab\n if (this.emojiRefs?.[indexTab]?.[indexEmoji + (EMOJIS_PER_ROW - position)]) {\n // if it exists, we should focus the last emoji of the next row in the current tab\n this.focusEmoji(indexTab, this.emojiRefs[indexTab].length - 1);\n // if we are at the end of the list it will do nothing\n } else {\n // We don't have next row, we are in the last of the tab, then jump\n // to the next tab but in the equal emoji position in row 0.\n\n if (!this.focusEmoji(indexTab + 1, position)) {\n // We are on the bottom!, should jump to the same position emoji in the first row of the first tabset\n // if it doesn't has, jump to the last\n if (!this.focusEmoji(0, position)) {\n this.focusEmoji(0, this.emojiRefs[0].length - 1);\n }\n }\n }\n }\n }\n\n if (event.key === 'ArrowLeft') {\n this.handleHorizontalNavigation('left', indexTab, indexEmoji);\n }\n\n if (event.key === 'ArrowRight') {\n this.handleHorizontalNavigation('right', indexTab, indexEmoji);\n }\n\n if (event.key === 'Tab') {\n if (this.focusEmoji(indexTab + 1, 0)) {\n this.scrollToTab((indexTab + 1) + 1, false);\n } else {\n // We are on the last emoji tabset, jump to the skin selector\n this.$emit('focus-skin-selector');\n }\n }\n\n if (event.key === 'Tab' && event.shiftKey) {\n if (this.focusEmoji(indexTab, 0) && indexTab > 0) {\n this.scrollToTab(indexTab, true);\n } else {\n this.scrollToTab(1, false);\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'Enter') {\n this.$emit('selected-emoji', emoji);\n }\n },\n\n / eslint-disable-next-line complexity /\n handleHorizontalNavigation: function (direction, indexTab, indexEmoji) {\n if (this.isFiltering) {\n if (direction === 'left') {\n this.handleArrowLeftFiltered(indexTab, indexEmoji);\n } else if (direction === 'right') {\n this.handleArrowRightFiltered(indexTab, indexEmoji);\n }\n } else {\n if (direction === 'left') {\n this.handleArrowLeft(indexTab, indexEmoji);\n } else if (direction === 'right') {\n this.handleArrowRight(indexTab, indexEmoji);\n }\n }\n },\n\n handleArrowLeftFiltered: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(0, indexEmoji - 1)) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n }\n },\n\n handleArrowRightFiltered: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(0, indexEmoji + 1)) {\n this.focusEmoji(0, 0);\n }\n },\n\n handleArrowLeft: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(indexTab, indexEmoji - 1)) {\n if (this.emojiRefs[indexTab - 1]) {\n this.focusEmoji(indexTab - 1, this.emojiRefs[indexTab - 1].length - 1);\n } else {\n this.focusEmoji(this.emojiRefs.length - 1, this.emojiRefs[this.emojiRefs.length - 1].length - 1);\n }\n }\n },\n\n handleArrowRight: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(indexTab, indexEmoji + 1)) {\n if (!this.focusEmoji(indexTab + 1, 0)) {\n this.focusEmoji(0, 0);\n }\n }\n },\n\n / eslint-disable-next-line complexity /\n handleKeyDownFilteredEmojis (event, indexEmoji, emoji) {\n event.preventDefault();\n this.hoverFirstEmoji = false;\n\n if (event.key === 'ArrowUp') {\n const position = indexEmoji % EMOJIS_PER_ROW;\n if (!this.focusEmoji(0, indexEmoji - EMOJIS_PER_ROW)) {\n const lastEmojiPosition =\n this.emojiFilteredRefs.length - (this.emojiFilteredRefs.length % EMOJIS_PER_ROW) + position;\n\n this.focusEmoji(0, lastEmojiPosition);\n\n if (!this.focusEmoji(0, lastEmojiPosition)) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n }\n }\n }\n\n if (event.key === 'ArrowDown') {\n if (!this.focusEmoji(0, indexEmoji + EMOJIS_PER_ROW)) {\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n if (this.emojiFilteredRefs?.[indexEmoji + (EMOJIS_PER_ROW - position)]) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n } else {\n this.focusEmoji(0, position);\n }\n }\n }\n\n if (event.key === 'ArrowLeft') {\n this.handleHorizontalNavigation('left', 0, indexEmoji);\n }\n\n if (event.key === 'ArrowRight') {\n this.handleHorizontalNavigation('right', 0, indexEmoji);\n }\n\n if (event.key === 'Tab') {\n this.$emit('focus-skin-selector');\n }\n\n if (event.key === 'Enter') {\n this.$emit('selected-emoji', emoji);\n }\n },\n\n setTabLabelObserver () {\n this.tabLabelObserver = new IntersectionObserver(entries => {\n this.$emit('is-scrolling', false);\n / eslint-disable-next-line complexity */\n entries.forEach(entry => {\n const { target } = entry;\n const index = parseInt(target.dataset.index);\n\n if (entry.isIntersecting && target.offsetTop <= this.$refs.tabCategoryRef?.offsetTop + 50) {\n this.fixedLabel = this.tabLabels[index - 1]?.label ?? this.tabLabels[0]?.label;\n this.$emit('scroll-into-tab', index - 1);\n } else if (entry.boundingClientRect.bottom <= this.$refs.tabCategoryRef?.getBoundingClientRect().bottom) {\n this.$emit('scroll-into-tab', index);\n this.fixedLabel = this.tabLabels[index]?.label;\n } else if (index === 1) {\n this.$emit('scroll-into-tab', index);\n this.fixedLabel = this.tabLabels[0]?.label;\n }\n });\n });\n\n this.tabLabelObserver.observe(this.$refs.tabCategoryRef);\n\n Array.from(this.$refs.listRef.children).forEach((child, index) => {\n this.tabLabelObserver.observe(child);\n child.dataset.index = index;\n });\n },\n\n focusLastEmoji () {\n this.focusEmoji(this.tabs.length - 1, 0);\n },\n\n },\n\n};\n</script>\n"],"names":["emojisImported"],"mappings":"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"}
1	+ {"version":3,"file":"emoji_selector.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_selector.vue"],"sourcesContent":["<template>\n <div\n class=\"d-emoji-picker__selector\"\n >\n <div\n id=\"d-emoji-picker-list\"\n ref=\"listRef\"\n class=\"d-emoji-picker__list\"\n >\n <p\n v-if=\"emojiFilter\"\n class=\"d-emoji-picker__search-label d-emoji-picker__alignment\"\n >\n {{ filteredEmojis.length > 0 ? searchResultsLabel : searchNoResultsLabel }}\n </p>\n <div\n v-else\n ref=\"tabCategoryRef\"\n class=\"d-emoji-picker__category d-emoji-picker__alignment\"\n >\n <p>\n {{ fixedLabel }}\n </p>\n </div>\n <div\n v-for=\"(tabLabel, indexTab) in tabLabels\"\n v-show=\"!emojiFilter\"\n :key=\"indexTab\"\n :ref=\"`tabLabelRef-${indexTab}`\"\n class=\"d-emoji-picker__alignment\"\n >\n <p\n v-if=\"indexTab\"\n >\n {{ tabLabel.label }}\n </p>\n <div\n class=\"d-emoji-picker__tab\"\n >\n <button\n v-for=\"(emoji, indexEmoji) in\n (emojis[tabs[indexTab] + skinTone] ? emojis[tabs[indexTab] + skinTone] : emojis[tabs[indexTab]])\"\n :key=\"emoji.shortname\"\n :ref=\"`emojiRef-${indexTab}`\"\n type=\"button\"\n :aria-label=\"emoji.name\"\n @click=\"$emit('selected-emoji', emoji)\"\n @focusin=\"$emit('highlighted-emoji', emoji)\"\n @focusout=\"$emit('highlighted-emoji', null)\"\n @mouseover=\"$emit('highlighted-emoji', emoji)\"\n @mouseleave=\"$emit('highlighted-emoji', null)\"\n @keydown=\"event => handleKeyDown(event, indexTab, indexEmoji, emoji)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"emoji.name\"\n :aria-label=\"emoji.name\"\n :title=\"emoji.name\"\n :src=\"getImgSrc(emoji.unicode_character)\"\n @error=\"handleImageError\"\n >\n </button>\n </div>\n </div>\n <div\n v-if=\"emojiFilter\"\n class=\"d-emoji-picker__alignment\"\n >\n <div\n class=\"d-emoji-picker__tab \"\n data-qa=\"filtered-emojis\"\n >\n <button\n v-for=\"(emoji, index) in filteredEmojis\"\n :key=\"emoji.shortname\"\n :ref=\"`filteredEmoji-${index}`\"\n type=\"button\"\n :aria-label=\"emoji.name\"\n :class=\"{\n 'hover-emoji': (index === 0 && hoverFirstEmoji),\n }\"\n @click=\"$emit('selected-emoji', emoji)\"\n @focusin=\"$emit('highlighted-emoji', emoji)\"\n @focusout=\"$emit('highlighted-emoji', null)\"\n @mouseover=\"hoverEmoji(emoji)\"\n @mouseleave=\"hoverEmoji(null)\"\n @keydown=\"event => handleKeyDownFilteredEmojis(event, index, emoji)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"emoji.name\"\n :aria-label=\"emoji.name\"\n :title=\"emoji.name\"\n :src=\"`${CDN_URL + emoji.unicode_character}.png`\"\n >\n </button>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<script>\n/* eslint-disable max-len /\n/ eslint-disable max-lines /\nimport { emojisGrouped as emojisImported } from '@dialpad/dialtone-emojis';\nimport { CDN_URL, EMOJIS_PER_ROW } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiSelector',\n\n props: {\n emojiFilter: {\n type: String,\n default: '',\n },\n\n skinTone: {\n type: String,\n required: true,\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n\n selectedTabset: {\n type: Object,\n required: true,\n },\n\n searchResultsLabel: {\n type: String,\n required: true,\n },\n\n searchNoResultsLabel: {\n type: String,\n required: true,\n },\n\n recentlyUsedEmojis: {\n type: Array,\n default: () => [],\n },\n },\n\n data () {\n return {\n emojiRefs: [],\n emojiFilteredRefs: [],\n isFiltering: false,\n hoverFirstEmoji: true,\n fixedLabel: '',\n filteredEmojis: [],\n TABS_DATA: ['Recently used', 'People', 'Nature', 'Food', 'Activity', 'Travel', 'Objects', 'Symbols', 'Flags'],\n tabLabelObserver: null,\n };\n },\n\n computed: {\n / eslint-disable-next-line complexity /\n currentEmojis () {\n return [\n ...this.emojis[`People${this.skinTone}`] \|\| [],\n ...this.emojis.Nature \|\| [],\n ...this.emojis.Food \|\| [],\n ...this.emojis[`Activity${this.skinTone}`] \|\| [],\n ...this.emojis.Travel \|\| [],\n ...this.emojis[`Objects${this.skinTone}`] \|\| [],\n ...this.emojis.Symbols \|\| [],\n ...this.emojis.Flags \|\| [],\n ];\n },\n\n emojis () {\n return emojisImported;\n },\n\n CDN_URL () {\n return CDN_URL;\n },\n\n tabLabels () {\n return this.recentlyUsedEmojis.length\n ? this.tabSetLabels.map((label, index) => ({ label, ref: this.$refs[`tabLabelRef-${index}`] }))\n : this.tabSetLabels.slice(1).map((label, index) => ({ label, ref: this.$refs[`tabLabelRef-${index}`] }));\n },\n\n tabs () {\n return this.recentlyUsedEmojis.length ? this.TABS_DATA : this.TABS_DATA.slice(1);\n },\n },\n\n watch: {\n currentEmojis: {\n handler () {\n this.searchByNameAndKeywords();\n },\n\n immediate: true,\n },\n\n recentlyUsedEmojis: {\n handler (newValue) {\n this.emojis['Recently used'] = newValue;\n },\n\n immediate: true,\n },\n\n emojiFilter: {\n handler (newFilter) {\n this.resetScroll();\n if (newFilter) {\n this.isFiltering = true;\n } else {\n this.isFiltering = false;\n this.$emit('highlighted-emoji', null);\n }\n\n this.debouncedSearch();\n },\n },\n\n selectedTabset: {\n handler (newValue) {\n this.scrollToTab(newValue.tabId);\n },\n\n deep: true,\n },\n },\n\n created () {\n this.debouncedSearch = this.debounce(this.searchByNameAndKeywords, 300);\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setupEmojiRefs();\n this.setupFilteredRefs();\n this.setupTabLabelRefs();\n this.setTabLabelObserver();\n });\n },\n\n beforeDestroy () {\n if (this.tabLabelObserver) {\n this.tabLabelObserver.disconnect();\n }\n },\n\n methods: {\n setupTabLabelRefs () {\n this.tabSetLabels?.forEach((label, index) => {\n const refKey = `tabLabelRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabLabels, index, { label, ref: this.$refs[refKey] });\n }\n });\n },\n\n setupFilteredRefs () {\n // it is necessary to clean the array before setting the new refs\n this.emojiFilteredRefs = [];\n\n this.filteredEmojis.forEach((emoji, index) => {\n const refKey = `filteredEmoji-${index}`;\n if (this.$refs[refKey]) {\n this.setFilteredRef(this.$refs[refKey], index);\n }\n });\n },\n\n setupEmojiRefs () {\n for (let i = 0; i < this.tabs.length; i++) {\n const refKey = `emojiRef-${i}`;\n if (this.$refs[refKey]) {\n this.$refs[refKey].forEach((el, indexEmoji) => {\n if (el) {\n this.setEmojiRef(el, i, indexEmoji);\n }\n });\n }\n }\n },\n\n searchByNameAndKeywords () {\n const searchStr = this.emojiFilter.toLowerCase();\n this.filteredEmojis = this.currentEmojis.filter(function (obj) {\n const nameIncludesSearchStr = obj.name.toLowerCase().includes(searchStr);\n const keywordsIncludeSearchStr = obj.keywords.some(function (keyword) {\n return keyword.toLowerCase().includes(searchStr);\n });\n return nameIncludesSearchStr \|\| keywordsIncludeSearchStr;\n });\n this.$nextTick(function () {\n if (searchStr) {\n this.hoverEmoji(this.filteredEmojis[0], true);\n this.setupFilteredRefs();\n }\n });\n },\n\n debounce: function (fn, delay) {\n if (delay === undefined) { delay = 300; }\n let timeout;\n return function () {\n const args = []; let len = arguments.length;\n while (len--) args[len] = arguments[len];\n\n clearTimeout(timeout);\n timeout = setTimeout(function () {\n fn.apply(undefined, args);\n }, delay);\n };\n },\n\n getImgSrc: function (emoji) {\n return this.CDN_URL + emoji + '.png';\n },\n\n handleImageError: function (event) {\n event.target.parentNode.style.display = 'none';\n },\n\n scrollToTab: function (tabIndex, focusFirstEmoji) {\n const vm = this;\n if (focusFirstEmoji === undefined) { focusFirstEmoji = true; }\n const tabLabel = vm.tabLabels[tabIndex - 1];\n const tabElement = tabLabel.ref[0];\n\n vm.$nextTick(function () {\n const container = vm.$refs.listRef;\n const offsetTop = tabIndex === 1 ? 0 : tabElement.offsetTop - 15;\n\n container.scrollTop = offsetTop;\n\n if (focusFirstEmoji) {\n vm.focusEmoji(tabIndex - 1, 0);\n }\n });\n },\n\n resetScroll: function () {\n const container = this.$refs.listRef;\n container.scrollTop = 0;\n },\n\n focusEmojiSelector: function () {\n this.focusEmoji(0, 0);\n },\n\n hoverEmoji (emoji, isFirst) {\n if (isFirst === undefined) { isFirst = false; }\n this.hoverFirstEmoji = isFirst;\n this.$emit('highlighted-emoji', emoji);\n },\n\n setEmojiRef: function (el, indexTab, indexEmoji) {\n if (!this.emojiRefs[indexTab]) {\n this.$set(this.emojiRefs, indexTab, []);\n }\n this.$set(this.emojiRefs[indexTab], indexEmoji, el);\n },\n\n setFilteredRef: function (el, index) {\n this.$set(this.emojiFilteredRefs, index, el);\n },\n\n focusEmoji: function (indexTab, indexEmoji) {\n // eslint-disable-next-line max-len\n const emojiRef = this.isFiltering ? this.emojiFilteredRefs[indexEmoji]?.[0] : this.emojiRefs[indexTab] && this.emojiRefs[indexTab][indexEmoji];\n if (emojiRef) {\n emojiRef.focus();\n return true;\n }\n\n return false;\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown: function (event, indexTab, indexEmoji, emoji) {\n event.preventDefault();\n\n if (event.key === 'ArrowUp') {\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n if (indexTab === 0) {\n // we are on the first emoji tab, then we should jump to the last row of the last emoji tab\n const numberOfMissingEmojis =\n EMOJIS_PER_ROW - (this.emojiRefs[this.emojiRefs.length - 1].length % EMOJIS_PER_ROW);\n\n const emojiToJump =\n this.emojiRefs[this.emojiRefs.length - 1].length + numberOfMissingEmojis - (EMOJIS_PER_ROW - position);\n\n if (!this.focusEmoji(this.emojiRefs.length - 1, emojiToJump)) {\n // if there is no emoji in this position, jump to the last emoji of the row\n this.focusEmoji(this.emojiRefs.length - 1, this.emojiRefs[this.emojiRefs.length - 1].length - 1);\n }\n return;\n }\n\n // if we are not on the first tab, we should jump to the previous row of the current tab\n if (!this.focusEmoji(indexTab, indexEmoji - EMOJIS_PER_ROW)) {\n // if there is no previous row, we should jump to emoji in the sampe position of the previous tab\n const previousTab = indexTab - 1 < 0 ? 0 : indexTab - 1;\n const emojisInPreviousTab = this.emojiRefs[previousTab].length;\n const lastEmojiPosition = emojisInPreviousTab - (emojisInPreviousTab % EMOJIS_PER_ROW) + position;\n\n if (!this.focusEmoji(previousTab, lastEmojiPosition)) {\n // if there is no emoji in this position, jump to the last emoji of the row\n this.focusEmoji(indexTab - 1, this.emojiRefs[indexTab - 1].length - 1);\n }\n }\n }\n\n if (event.key === 'ArrowDown') {\n if (!this.focusEmoji(indexTab, indexEmoji + EMOJIS_PER_ROW)) {\n // if cannot go down\n\n // Calculate position from cell 0 to cell 8\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n // check if it exists a next row in the current tab\n if (this.emojiRefs?.[indexTab]?.[indexEmoji + (EMOJIS_PER_ROW - position)]) {\n // if it exists, we should focus the last emoji of the next row in the current tab\n this.focusEmoji(indexTab, this.emojiRefs[indexTab].length - 1);\n // if we are at the end of the list it will do nothing\n } else {\n // We don't have next row, we are in the last of the tab, then jump\n // to the next tab but in the equal emoji position in row 0.\n\n if (!this.focusEmoji(indexTab + 1, position)) {\n // We are on the bottom!, should jump to the same position emoji in the first row of the first tabset\n // if it doesn't has, jump to the last\n if (!this.focusEmoji(0, position)) {\n this.focusEmoji(0, this.emojiRefs[0].length - 1);\n }\n }\n }\n }\n }\n\n if (event.key === 'ArrowLeft') {\n this.handleHorizontalNavigation('left', indexTab, indexEmoji);\n }\n\n if (event.key === 'ArrowRight') {\n this.handleHorizontalNavigation('right', indexTab, indexEmoji);\n }\n\n if (event.key === 'Tab' && !event.shiftKey) {\n if (this.focusEmoji(indexTab + 1, 0)) {\n this.scrollToTab((indexTab + 1) + 1, false);\n } else {\n // We are on the last emoji tabset, jump to the skin selector\n this.$emit('focus-skin-selector');\n }\n }\n\n if (event.key === 'Tab' && event.shiftKey) {\n if (this.focusEmoji(indexTab, 0) && indexTab > 0) {\n this.scrollToTab(indexTab, true);\n } else {\n this.scrollToTab(1, false);\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'Enter') {\n this.$emit('selected-emoji', emoji);\n }\n },\n\n / eslint-disable-next-line complexity /\n handleHorizontalNavigation: function (direction, indexTab, indexEmoji) {\n if (this.isFiltering) {\n if (direction === 'left') {\n this.handleArrowLeftFiltered(indexTab, indexEmoji);\n } else if (direction === 'right') {\n this.handleArrowRightFiltered(indexTab, indexEmoji);\n }\n } else {\n if (direction === 'left') {\n this.handleArrowLeft(indexTab, indexEmoji);\n } else if (direction === 'right') {\n this.handleArrowRight(indexTab, indexEmoji);\n }\n }\n },\n\n handleArrowLeftFiltered: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(0, indexEmoji - 1)) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n }\n },\n\n handleArrowRightFiltered: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(0, indexEmoji + 1)) {\n this.focusEmoji(0, 0);\n }\n },\n\n handleArrowLeft: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(indexTab, indexEmoji - 1)) {\n if (this.emojiRefs[indexTab - 1]) {\n this.focusEmoji(indexTab - 1, this.emojiRefs[indexTab - 1].length - 1);\n } else {\n this.focusEmoji(this.emojiRefs.length - 1, this.emojiRefs[this.emojiRefs.length - 1].length - 1);\n }\n }\n },\n\n handleArrowRight: function (indexTab, indexEmoji) {\n if (!this.focusEmoji(indexTab, indexEmoji + 1)) {\n if (!this.focusEmoji(indexTab + 1, 0)) {\n this.focusEmoji(0, 0);\n }\n }\n },\n\n / eslint-disable-next-line complexity /\n handleKeyDownFilteredEmojis (event, indexEmoji, emoji) {\n event.preventDefault();\n this.hoverFirstEmoji = false;\n\n if (event.key === 'ArrowUp') {\n const position = indexEmoji % EMOJIS_PER_ROW;\n if (!this.focusEmoji(0, indexEmoji - EMOJIS_PER_ROW)) {\n const lastEmojiPosition =\n this.emojiFilteredRefs.length - (this.emojiFilteredRefs.length % EMOJIS_PER_ROW) + position;\n\n this.focusEmoji(0, lastEmojiPosition);\n\n if (!this.focusEmoji(0, lastEmojiPosition)) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n }\n }\n }\n\n if (event.key === 'ArrowDown') {\n if (!this.focusEmoji(0, indexEmoji + EMOJIS_PER_ROW)) {\n const position = indexEmoji % EMOJIS_PER_ROW;\n\n if (this.emojiFilteredRefs?.[indexEmoji + (EMOJIS_PER_ROW - position)]) {\n this.focusEmoji(0, this.emojiFilteredRefs.length - 1);\n } else {\n this.focusEmoji(0, position);\n }\n }\n }\n\n if (event.key === 'ArrowLeft') {\n this.handleHorizontalNavigation('left', 0, indexEmoji);\n }\n\n if (event.key === 'ArrowRight') {\n this.handleHorizontalNavigation('right', 0, indexEmoji);\n }\n\n if (event.key === 'Tab') {\n this.$emit('focus-skin-selector');\n }\n\n if (event.key === 'Enter') {\n this.$emit('selected-emoji', emoji);\n }\n },\n\n setTabLabelObserver () {\n this.tabLabelObserver = new IntersectionObserver(entries => {\n / eslint-disable-next-line complexity */\n entries.forEach(entry => {\n const { target } = entry;\n const index = parseInt(target.dataset.index);\n\n if (entry.isIntersecting && target.offsetTop <= this.$refs.tabCategoryRef?.offsetTop + 50) {\n this.fixedLabel = this.tabLabels[index - 1]?.label ?? this.tabLabels[0]?.label;\n this.$emit('scroll-into-tab', index - 1);\n } else if (entry.boundingClientRect.bottom <= this.$refs.tabCategoryRef?.getBoundingClientRect().bottom) {\n this.$emit('scroll-into-tab', index);\n this.fixedLabel = this.tabLabels[index]?.label;\n } else if (index === 1) {\n this.$emit('scroll-into-tab', index);\n this.fixedLabel = this.tabLabels[0]?.label;\n }\n });\n });\n\n this.tabLabelObserver.observe(this.$refs.tabCategoryRef);\n\n Array.from(this.$refs.listRef.children).forEach((child, index) => {\n this.tabLabelObserver.observe(child);\n child.dataset.index = index;\n });\n },\n\n focusLastEmoji () {\n this.scrollToTab(this.tabs.length, true);\n },\n\n },\n\n};\n</script>\n"],"names":["emojisImported"],"mappings":"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"}

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs CHANGED Viewed

@@ -20,10 +20,6 @@ const _sfc_main = {
       type: Number,
       required: true
     },
-    isScrolling: {
-      type: Boolean,
-      default: false
-    },
     emojiFilter: {
       type: String,
       default: ""
@@ -56,6 +52,7 @@ const _sfc_main = {
       return tabsData.map((tab2, index) => ({
         ...tab2,
         label: this.tabSetLabels[index],
+        // IDs on dt-tab component need to be on string
         id: (index + 1).toString(),
         panelId: (index + 1).toString()
       }));
@@ -66,7 +63,7 @@ const _sfc_main = {
   },
   watch: {
     scrollIntoTab: function(newVal) {
-      if (!this.isScrolling && !this.isSearching) {
+      if (!this.isSearching) {
         this.selectedTab = (newVal + 1).toString();
       }
     },
@@ -83,10 +80,9 @@ const _sfc_main = {
   },
   methods: {
     selectTabset(id) {
-      if (!this.isScrolling) {
-        this.selectedTab = id;
-      }
-      this.$emit("selected-tabset", id);
+      const parseId = parseInt(id);
+      this.selectedTab = id;
+      this.$emit("selected-tabset", parseId);
     },
     setTabsetRef() {
       this.tabs.forEach((skin, index) => {

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n <div class=\"d-emoji-picker__tabset\">\n <dt-tab-group\n size=\"sm\"\n tab-list-class=\"d-emoji-picker__tabset-list\"\n :selected=\"selectedTab\"\n >\n <template #tabs>\n <dt-tab\n v-for=\"(tab, index) in tabs\"\n :id=\"tab.id\"\n :ref=\"`tabsetRef-${index}`\"\n :key=\"tab.id\"\n :panel-id=\"tab.panelId\"\n :label=\"tab.label\"\n aria-controls=\"d-emoji-picker-list\"\n :tabindex=\"index + 1\"\n @click.capture.stop=\"selectTabset(tab.id)\"\n @keydown=\"handleKeyDown($event, tab.id)\"\n >\n <dt-icon\n size=\"400\"\n :name=\"tab.icon\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n DtIcon,\n },\n\n props: {\n showRecentlyUsedTab: {\n type: Boolean,\n default: false,\n },\n\n scrollIntoTab: {\n type: Number,\n required: true,\n },\n\n ~~isScrolling: {\n type: Boolean,\n default: false,\n },\n\n~~ emojiFilter: {\n type: String,\n default: '',\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n },\n\n data () {\n return {\n selectedTab: '1',\n tabsetRef: [],\n TABS_DATA: [\n { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n ],\n };\n },\n\n computed: {\n tabs () {\n const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n return tabsData.map((tab, index) => ({\n ...tab,\n label: this.tabSetLabels[index],\n id: (index + 1).toString(),\n panelId: (index + 1).toString(),\n }));\n },\n\n isSearching () {\n return this.emojiFilter.length > 0;\n },\n },\n\n watch: {\n scrollIntoTab: function (newVal) {\n if (!this.~~isScrolling && !this.~~isSearching) {\n this.selectedTab = (newVal + 1).toString();\n }\n },\n\n isSearching: function (newVal) {\n if (newVal) {\n this.selectedTab = null;\n }\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setTabsetRef();\n });\n },\n\n methods: {\n selectTabset (id) {\n if (~~!this.isScrolling~~) {\n this.selectedTab = id;\n ~~}\n~~ this.$emit('selected-tabset', id);\n },\n\n setTabsetRef () {\n this.tabs.forEach((skin, index) => {\n const refKey = `tabsetRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n }\n });\n },\n\n focusTabset () {\n if (this.tabsetRef[0]) {\n this.tabsetRef[0].focus();\n }\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown (event, tabId) {\n if (event.key === 'Enter') {\n this.selectTabset(tabId);\n if (this.tabsetRef[tabId - 1]) {\n this.tabsetRef[tabId - 1].blur();\n }\n }\n\n if (event.key === 'Tab') {\n event.preventDefault();\n if (event.shiftKey) {\n this.$emit('focus-skin-selector');\n } else {\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'ArrowDown') {\n this.$emit('focus-search-input');\n }\n },\n },\n};\n</script>\n"],"names":["DtTabGroup","DtTab","DtIcon","EMOJI_PICKER_CATEGORIES","tab"],"mappings":";;;;;;AAoCA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,YAAAA;AAAAA,IACA,OAAAC;AAAAA,IACA,QAAAC;AAAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,qBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,IAEA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,~~aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,~~cAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA,CAAA;AAAA,MACA,WAAA;AAAA,QACA,EAAA,OAAAC,uBAAA,wBAAA,oBAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,oBAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,QAAA,MAAA,eAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,MAAA,MAAA,OAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,UAAA,MAAA,SAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,QAAA,MAAA,iBAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,SAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,SAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,OAAA,MAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,YAAA,WAAA,KAAA,sBAAA,KAAA,YAAA,KAAA,UAAA,MAAA,CAAA;AACA,aAAA,SAAA,IAAA,CAAAC,MAAA,WAAA;AAAA,QACA,GAAAA;AAAA,QACA,OAAA,KAAA,aAAA,KAAA;AAAA,~~QACA~~,KAAA,QAAA,GAAA,SAAA;AAAA,QACA,UAAA,QAAA,GAAA,SAAA;AAAA,MACA,EAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,YAAA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,eAAA,SAAA,QAAA;AACA,UAAA,CAAA,KAAA,~~eAAA,CAAA,KAAA,~~aAAA;AACA,aAAA,eAAA,SAAA,GAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,aAAA,SAAA,QAAA;AACA,UAAA,QAAA;AACA,aAAA,cAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,UAAA,MAAA;AACA,WAAA,aAAA;AAAA,IACA,CAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,aAAA,IAAA;~~AACA~~,UAAA,~~CAAA~~,~~KAAA,aAAA~~;~~AACA~~,~~aAAA~~,cAAA;~~AAAA,MACA;~~AACA,WAAA,MAAA,mBAAA,~~EAAA~~;AAAA,IACA;AAAA,IAEA,eAAA;AACA,WAAA,KAAA,QAAA,CAAA,MAAA,UAAA;AACA,cAAA,SAAA,aAAA,KAAA;AACA,YAAA,KAAA,MAAA,MAAA,GAAA;AACA,eAAA,KAAA,KAAA,WAAA,OAAA,KAAA,MAAA,MAAA,EAAA,CAAA,EAAA,GAAA;AAAA,QACA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,UAAA,KAAA,UAAA,CAAA,GAAA;AACA,aAAA,UAAA,CAAA,EAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA,IAGA,cAAA,OAAA,OAAA;AACA,UAAA,MAAA,QAAA,SAAA;AACA,aAAA,aAAA,KAAA;AACA,YAAA,KAAA,UAAA,QAAA,CAAA,GAAA;AACA,eAAA,UAAA,QAAA,CAAA,EAAA,KAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,OAAA;AACA,cAAA,eAAA;AACA,YAAA,MAAA,UAAA;AACA,eAAA,MAAA,qBAAA;AAAA,QACA,OAAA;AACA,eAAA,MAAA,oBAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,aAAA;AACA,aAAA,MAAA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n <div class=\"d-emoji-picker__tabset\">\n <dt-tab-group\n size=\"sm\"\n tab-list-class=\"d-emoji-picker__tabset-list\"\n :selected=\"selectedTab\"\n >\n <template #tabs>\n <dt-tab\n v-for=\"(tab, index) in tabs\"\n :id=\"tab.id\"\n :ref=\"`tabsetRef-${index}`\"\n :key=\"tab.id\"\n :panel-id=\"tab.panelId\"\n :label=\"tab.label\"\n aria-controls=\"d-emoji-picker-list\"\n :tabindex=\"index + 1\"\n @click.capture.stop=\"selectTabset(tab.id)\"\n @keydown=\"handleKeyDown($event, tab.id)\"\n >\n <dt-icon\n size=\"400\"\n :name=\"tab.icon\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n DtIcon,\n },\n\n props: {\n showRecentlyUsedTab: {\n type: Boolean,\n default: false,\n },\n\n scrollIntoTab: {\n type: Number,\n required: true,\n },\n\n emojiFilter: {\n type: String,\n default: '',\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n },\n\n data () {\n return {\n selectedTab: '1',\n tabsetRef: [],\n TABS_DATA: [\n { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n ],\n };\n },\n\n computed: {\n tabs () {\n const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n return tabsData.map((tab, index) => ({\n ...tab,\n label: this.tabSetLabels[index],\n // IDs on dt-tab component need to be on string\n id: (index + 1).toString(),\n panelId: (index + 1).toString(),\n }));\n },\n\n isSearching () {\n return this.emojiFilter.length > 0;\n },\n },\n\n watch: {\n scrollIntoTab: function (newVal) {\n if (!this.isSearching) {\n this.selectedTab = (newVal + 1).toString();\n }\n },\n\n isSearching: function (newVal) {\n if (newVal) {\n this.selectedTab = null;\n }\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setTabsetRef();\n });\n },\n\n methods: {\n selectTabset (id) {\n // IDs on scrollToTab need to be on number\n const parseId = parseInt(id);\n // IDs on dt-tab component need to be on string\n this.selectedTab = id;\n this.$emit('selected-tabset', parseId);\n },\n\n setTabsetRef () {\n this.tabs.forEach((skin, index) => {\n const refKey = `tabsetRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n }\n });\n },\n\n focusTabset () {\n if (this.tabsetRef[0]) {\n this.tabsetRef[0].focus();\n }\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown (event, tabId) {\n if (event.key === 'Enter') {\n this.selectTabset(tabId);\n if (this.tabsetRef[tabId - 1]) {\n this.tabsetRef[tabId - 1].blur();\n }\n }\n\n if (event.key === 'Tab') {\n event.preventDefault();\n if (event.shiftKey) {\n this.$emit('focus-skin-selector');\n } else {\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'ArrowDown') {\n this.$emit('focus-search-input');\n }\n },\n },\n};\n</script>\n"],"names":["DtTabGroup","DtTab","DtIcon","EMOJI_PICKER_CATEGORIES","tab"],"mappings":";;;;;;AAoCA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,YAAAA;AAAAA,IACA,OAAAC;AAAAA,IACA,QAAAC;AAAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,qBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,IAEA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA,CAAA;AAAA,MACA,WAAA;AAAA,QACA,EAAA,OAAAC,uBAAA,wBAAA,oBAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,oBAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,QAAA,MAAA,eAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,MAAA,MAAA,OAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,UAAA,MAAA,SAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,QAAA,MAAA,iBAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,SAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,SAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAAA,uBAAA,wBAAA,OAAA,MAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,YAAA,WAAA,KAAA,sBAAA,KAAA,YAAA,KAAA,UAAA,MAAA,CAAA;AACA,aAAA,SAAA,IAAA,CAAAC,MAAA,WAAA;AAAA,QACA,GAAAA;AAAA,QACA,OAAA,KAAA,aAAA,KAAA;AAAA;AAAA,QAEA,KAAA,QAAA,GAAA,SAAA;AAAA,QACA,UAAA,QAAA,GAAA,SAAA;AAAA,MACA,EAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,YAAA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,eAAA,SAAA,QAAA;AACA,UAAA,CAAA,KAAA,aAAA;AACA,aAAA,eAAA,SAAA,GAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,aAAA,SAAA,QAAA;AACA,UAAA,QAAA;AACA,aAAA,cAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,UAAA,MAAA;AACA,WAAA,aAAA;AAAA,IACA,CAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,aAAA,IAAA;AAEA,YAAA,UAAA,SAAA,EAAA;AAEA,WAAA,cAAA;AACA,WAAA,MAAA,mBAAA,OAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,WAAA,KAAA,QAAA,CAAA,MAAA,UAAA;AACA,cAAA,SAAA,aAAA,KAAA;AACA,YAAA,KAAA,MAAA,MAAA,GAAA;AACA,eAAA,KAAA,KAAA,WAAA,OAAA,KAAA,MAAA,MAAA,EAAA,CAAA,EAAA,GAAA;AAAA,QACA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,UAAA,KAAA,UAAA,CAAA,GAAA;AACA,aAAA,UAAA,CAAA,EAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA,IAGA,cAAA,OAAA,OAAA;AACA,UAAA,MAAA,QAAA,SAAA;AACA,aAAA,aAAA,KAAA;AACA,YAAA,KAAA,UAAA,QAAA,CAAA,GAAA;AACA,eAAA,UAAA,QAAA,CAAA,EAAA,KAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,OAAA;AACA,cAAA,eAAA;AACA,YAAA,MAAA,UAAA;AACA,eAAA,MAAA,qBAAA;AAAA,QACA,OAAA;AACA,eAAA,MAAA,oBAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,aAAA;AACA,aAAA,MAAA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js CHANGED Viewed

@@ -19,10 +19,6 @@ const _sfc_main = {
       type: Number,
       required: true
     },
-    isScrolling: {
-      type: Boolean,
-      default: false
-    },
     emojiFilter: {
       type: String,
       default: ""
@@ -55,6 +51,7 @@ const _sfc_main = {
       return tabsData.map((tab, index) => ({
         ...tab,
         label: this.tabSetLabels[index],
+        // IDs on dt-tab component need to be on string
         id: (index + 1).toString(),
         panelId: (index + 1).toString()
       }));
@@ -65,7 +62,7 @@ const _sfc_main = {
   },
   watch: {
     scrollIntoTab: function(newVal) {
-      if (!this.isScrolling && !this.isSearching) {
+      if (!this.isSearching) {
         this.selectedTab = (newVal + 1).toString();
       }
     },
@@ -82,10 +79,9 @@ const _sfc_main = {
   },
   methods: {
     selectTabset(id) {
-      if (!this.isScrolling) {
-        this.selectedTab = id;
-      }
-      this.$emit("selected-tabset", id);
+      const parseId = parseInt(id);
+      this.selectedTab = id;
+      this.$emit("selected-tabset", parseId);
     },
     setTabsetRef() {
       this.tabs.forEach((skin, index) => {

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n <div class=\"d-emoji-picker__tabset\">\n <dt-tab-group\n size=\"sm\"\n tab-list-class=\"d-emoji-picker__tabset-list\"\n :selected=\"selectedTab\"\n >\n <template #tabs>\n <dt-tab\n v-for=\"(tab, index) in tabs\"\n :id=\"tab.id\"\n :ref=\"`tabsetRef-${index}`\"\n :key=\"tab.id\"\n :panel-id=\"tab.panelId\"\n :label=\"tab.label\"\n aria-controls=\"d-emoji-picker-list\"\n :tabindex=\"index + 1\"\n @click.capture.stop=\"selectTabset(tab.id)\"\n @keydown=\"handleKeyDown($event, tab.id)\"\n >\n <dt-icon\n size=\"400\"\n :name=\"tab.icon\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n DtIcon,\n },\n\n props: {\n showRecentlyUsedTab: {\n type: Boolean,\n default: false,\n },\n\n scrollIntoTab: {\n type: Number,\n required: true,\n },\n\n ~~isScrolling: {\n type: Boolean,\n default: false,\n },\n\n~~ emojiFilter: {\n type: String,\n default: '',\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n },\n\n data () {\n return {\n selectedTab: '1',\n tabsetRef: [],\n TABS_DATA: [\n { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n ],\n };\n },\n\n computed: {\n tabs () {\n const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n return tabsData.map((tab, index) => ({\n ...tab,\n label: this.tabSetLabels[index],\n id: (index + 1).toString(),\n panelId: (index + 1).toString(),\n }));\n },\n\n isSearching () {\n return this.emojiFilter.length > 0;\n },\n },\n\n watch: {\n scrollIntoTab: function (newVal) {\n if (!this.~~isScrolling && !this.~~isSearching) {\n this.selectedTab = (newVal + 1).toString();\n }\n },\n\n isSearching: function (newVal) {\n if (newVal) {\n this.selectedTab = null;\n }\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setTabsetRef();\n });\n },\n\n methods: {\n selectTabset (id) {\n if (~~!this.isScrolling~~) {\n this.selectedTab = id;\n ~~}\n~~ this.$emit('selected-tabset', id);\n },\n\n setTabsetRef () {\n this.tabs.forEach((skin, index) => {\n const refKey = `tabsetRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n }\n });\n },\n\n focusTabset () {\n if (this.tabsetRef[0]) {\n this.tabsetRef[0].focus();\n }\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown (event, tabId) {\n if (event.key === 'Enter') {\n this.selectTabset(tabId);\n if (this.tabsetRef[tabId - 1]) {\n this.tabsetRef[tabId - 1].blur();\n }\n }\n\n if (event.key === 'Tab') {\n event.preventDefault();\n if (event.shiftKey) {\n this.$emit('focus-skin-selector');\n } else {\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'ArrowDown') {\n this.$emit('focus-search-input');\n }\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;;;AAoCA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,qBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,IAEA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,~~aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,~~cAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA,CAAA;AAAA,MACA,WAAA;AAAA,QACA,EAAA,OAAA,wBAAA,oBAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAA,wBAAA,oBAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAA,wBAAA,QAAA,MAAA,eAAA;AAAA,QACA,EAAA,OAAA,wBAAA,MAAA,MAAA,OAAA;AAAA,QACA,EAAA,OAAA,wBAAA,UAAA,MAAA,SAAA;AAAA,QACA,EAAA,OAAA,wBAAA,QAAA,MAAA,iBAAA;AAAA,QACA,EAAA,OAAA,wBAAA,SAAA,MAAA,YAAA;AAAA,QACA,EAAA,OAAA,wBAAA,SAAA,MAAA,QAAA;AAAA,QACA,EAAA,OAAA,wBAAA,OAAA,MAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,YAAA,WAAA,KAAA,sBAAA,KAAA,YAAA,KAAA,UAAA,MAAA,CAAA;AACA,aAAA,SAAA,IAAA,CAAA,KAAA,WAAA;AAAA,QACA,GAAA;AAAA,QACA,OAAA,KAAA,aAAA,KAAA;AAAA,~~QACA~~,KAAA,QAAA,GAAA,SAAA;AAAA,QACA,UAAA,QAAA,GAAA,SAAA;AAAA,MACA,EAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,YAAA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,eAAA,SAAA,QAAA;AACA,UAAA,CAAA,KAAA,~~eAAA,CAAA,KAAA,~~aAAA;AACA,aAAA,eAAA,SAAA,GAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,aAAA,SAAA,QAAA;AACA,UAAA,QAAA;AACA,aAAA,cAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,UAAA,MAAA;AACA,WAAA,aAAA;AAAA,IACA,CAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,aAAA,IAAA;~~AACA~~,UAAA,~~CAAA~~,~~KAAA,aAAA~~;~~AACA~~,~~aAAA~~,cAAA;~~AAAA,MACA;~~AACA,WAAA,MAAA,mBAAA,~~EAAA~~;AAAA,IACA;AAAA,IAEA,eAAA;AACA,WAAA,KAAA,QAAA,CAAA,MAAA,UAAA;AACA,cAAA,SAAA,aAAA,KAAA;AACA,YAAA,KAAA,MAAA,MAAA,GAAA;AACA,eAAA,KAAA,KAAA,WAAA,OAAA,KAAA,MAAA,MAAA,EAAA,CAAA,EAAA,GAAA;AAAA,QACA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,UAAA,KAAA,UAAA,CAAA,GAAA;AACA,aAAA,UAAA,CAAA,EAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA,IAGA,cAAA,OAAA,OAAA;AACA,UAAA,MAAA,QAAA,SAAA;AACA,aAAA,aAAA,KAAA;AACA,YAAA,KAAA,UAAA,QAAA,CAAA,GAAA;AACA,eAAA,UAAA,QAAA,CAAA,EAAA,KAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,OAAA;AACA,cAAA,eAAA;AACA,YAAA,MAAA,UAAA;AACA,eAAA,MAAA,qBAAA;AAAA,QACA,OAAA;AACA,eAAA,MAAA,oBAAA;AAAA,QACA;AAAA,MACA;AAEA,UAAA,MAAA,QAAA,aAAA;AACA,aAAA,MAAA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n <div class=\"d-emoji-picker__tabset\">\n <dt-tab-group\n size=\"sm\"\n tab-list-class=\"d-emoji-picker__tabset-list\"\n :selected=\"selectedTab\"\n >\n <template #tabs>\n <dt-tab\n v-for=\"(tab, index) in tabs\"\n :id=\"tab.id\"\n :ref=\"`tabsetRef-${index}`\"\n :key=\"tab.id\"\n :panel-id=\"tab.panelId\"\n :label=\"tab.label\"\n aria-controls=\"d-emoji-picker-list\"\n :tabindex=\"index + 1\"\n @click.capture.stop=\"selectTabset(tab.id)\"\n @keydown=\"handleKeyDown($event, tab.id)\"\n >\n <dt-icon\n size=\"400\"\n :name=\"tab.icon\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n DtIcon,\n },\n\n props: {\n showRecentlyUsedTab: {\n type: Boolean,\n default: false,\n },\n\n scrollIntoTab: {\n type: Number,\n required: true,\n },\n\n emojiFilter: {\n type: String,\n default: '',\n },\n\n tabSetLabels: {\n type: Array,\n required: true,\n },\n },\n\n data () {\n return {\n selectedTab: '1',\n tabsetRef: [],\n TABS_DATA: [\n { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n ],\n };\n },\n\n computed: {\n tabs () {\n const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n return tabsData.map((tab, index) => ({\n ...tab,\n label: this.tabSetLabels[index],\n // IDs on dt-tab component need to be on string\n id: (index + 1).toString(),\n panelId: (index + 1).toString(),\n }));\n },\n\n isSearching () {\n return this.emojiFilter.length > 0;\n },\n },\n\n watch: {\n scrollIntoTab: function (newVal) {\n if (!this.isSearching) {\n this.selectedTab = (newVal + 1).toString();\n }\n },\n\n isSearching: function (newVal) {\n if (newVal) {\n this.selectedTab = null;\n }\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.setTabsetRef();\n });\n },\n\n methods: {\n selectTabset (id) {\n // IDs on scrollToTab need to be on number\n const parseId = parseInt(id);\n // IDs on dt-tab component need to be on string\n this.selectedTab = id;\n this.$emit('selected-tabset', parseId);\n },\n\n setTabsetRef () {\n this.tabs.forEach((skin, index) => {\n const refKey = `tabsetRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n }\n });\n },\n\n focusTabset () {\n if (this.tabsetRef[0]) {\n this.tabsetRef[0].focus();\n }\n },\n\n // eslint-disable-next-line complexity\n handleKeyDown (event, tabId) {\n if (event.key === 'Enter') {\n this.selectTabset(tabId);\n if (this.tabsetRef[tabId - 1]) {\n this.tabsetRef[tabId - 1].blur();\n }\n }\n\n if (event.key === 'Tab') {\n event.preventDefault();\n if (event.shiftKey) {\n this.$emit('focus-skin-selector');\n } else {\n this.$emit('focus-search-input');\n }\n }\n\n if (event.key === 'ArrowDown') {\n this.$emit('focus-search-input');\n }\n },\n },\n};\n</script>\n"],"names":[],"mappings":"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"}

package/dist/vue2/types/common/dates/index.d.ts CHANGED Viewed

@@ -1,49 +1,5 @@
-/**
- * Sets the locale for date-fns. This should be called before any date-fns functions are called.
- * @param {Locale} locale A date-fns locale object
- */
 export function setDateLocale(locale: Locale): void;
-/**
- * This formats a date to the Dialtone standard medium date format as shown here:
- * https://dialtone.dialpad.com/guides/writing-guidelines/#formats-by-length
- * @param {Date} date A javascript date object
- * @returns {string} A string in the format of 'September 2, 2022'
- */
 export function getDateMedium(date: Date): string;
-/**
- * Converts a call duration in total number of seconds to a human readable string
- * such as 'less than a minute' or '4 hours 34 minutes'.
- * @param {number} durationInSeconds The duration of the call in seconds
- * @returns {string} A human readable string representing the duration of the call
- */
 export function durationInHHMM(durationInSeconds: number): string;
-/**
- * Returns the distance between the passed in date and now in a human readable format, typically used
- * when showing a history of items in a log such as a feed list.
- *
- * datefns does not support 'today' and 'yesterday' without showing time so we use Intl for these cases.
- *
- * examples below to explain
- * the different potential formats:
- *
- * If current day:
- * Today
- *
- * If previous day:
- * Yesterday
- *
- * Older than yesterday, but in the same calendar week:
- * Monday
- *
- * Older than the most recent calendar week, but in the same year:
- * Monday, October 14
- *
- * older than a calendar year:
- * October 14, 2022
- *
- *
- * @param {Date} date The timestamp of the item's date
- * @returns {string} A human readable string representing the distance between the date and now
- */
 export function relativeDate(date: Date): string;
 //# sourceMappingURL=index.d.ts.map

package/dist/vue2/types/common/dates/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../common/dates/index.js"],"names":[],"mappings":"~~AAiDA;;;GAGG;AACH~~,sCAFW,MAAM,QAIhB;~~AAED;;;;;GAKG;AACH~~,oCAHW,IAAI,GACF,MAAM,CAIlB;~~AAED;;;;;GAKG;AACH~~,kDAHW,MAAM,GACJ,MAAM,CAalB;~~AAaD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH~~,mCAHW,IAAI,GACF,MAAM,CAclB"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../common/dates/index.js"],"names":[],"mappings":"AAqDA,sCAFW,MAAM,QAIhB;AAQD,oCAHW,IAAI,GACF,MAAM,CAIlB;AAQD,kDAHW,MAAM,GACJ,MAAM,CAalB;AAyCD,mCAHW,IAAI,GACF,MAAM,CAclB"}

package/dist/vue2/types/common/emoji/index.d.ts CHANGED Viewed

@@ -29620,9 +29620,6 @@ export function setEmojiAssetUrlSmall(url: any, fileExtension?: string): void;
 export function setEmojiAssetUrlLarge(url: any, fileExtension?: string): void;
 export function setCustomEmojiUrl(url: any): void;
 export function setCustomEmojiJson(json: any): void;
-/**
- * Validate custom emoji json
- */
 export function validateCustomEmojiJson(json: any): void;
 export function shortcodeToEmojiData(shortcode: any): undefined;
 export function unicodeToString(emoji: any): string;