@dialpad/dialtone 9.86.0 → 9.86.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 (624) hide show
  1. package/README.md +0 -16
  2. package/dist/css/dialtone-default-theme.css +1157 -10
  3. package/dist/css/dialtone-default-theme.min.css +1 -1
  4. package/dist/css/dialtone.css +1151 -4
  5. package/dist/css/dialtone.min.css +1 -1
  6. package/dist/css/tokens/tokens-base-dark.css +6 -6
  7. package/dist/css/tokens/tokens-base-light.css +6 -6
  8. package/dist/css/tokens/tokens-debug-base.css +6 -6
  9. package/dist/css/tokens/tokens-expressive-dark.css +6 -6
  10. package/dist/css/tokens/tokens-expressive-light.css +6 -6
  11. package/dist/css/tokens/tokens-expressive-sm-dark.css +6 -6
  12. package/dist/css/tokens/tokens-expressive-sm-light.css +6 -6
  13. package/dist/tokens/css/tokens-base-dark.css +6 -6
  14. package/dist/tokens/css/tokens-base-light.css +6 -6
  15. package/dist/tokens/css/tokens-debug-base.css +6 -6
  16. package/dist/tokens/css/tokens-expressive-dark.css +6 -6
  17. package/dist/tokens/css/tokens-expressive-light.css +6 -6
  18. package/dist/tokens/css/tokens-expressive-sm-dark.css +6 -6
  19. package/dist/tokens/css/tokens-expressive-sm-light.css +6 -6
  20. package/dist/tokens/doc.json +13006 -13006
  21. package/dist/tokens/themes/chunks/{tokens-base-dark-DhC8-lWj.js → tokens-base-dark-BnTEKGxK.js} +1 -1
  22. package/dist/tokens/themes/chunks/{tokens-base-dark-B5huG27C.js → tokens-base-dark-Ch4dTh7V.js} +1 -1
  23. package/dist/tokens/themes/chunks/{tokens-base-light-B2RDBIfm.js → tokens-base-light-BLxKOiup.js} +1 -1
  24. package/dist/tokens/themes/chunks/{tokens-base-light-y7MK4fBY.js → tokens-base-light-DWLxg2cD.js} +1 -1
  25. package/dist/tokens/themes/debug.cjs +1 -1
  26. package/dist/tokens/themes/debug.js +1 -1
  27. package/dist/tokens/themes/dp-dark.cjs +1 -1
  28. package/dist/tokens/themes/dp-dark.js +1 -1
  29. package/dist/tokens/themes/dp-light.cjs +1 -1
  30. package/dist/tokens/themes/dp-light.js +1 -1
  31. package/dist/tokens/themes/expressive-dark.cjs +1 -1
  32. package/dist/tokens/themes/expressive-dark.js +2 -2
  33. package/dist/tokens/themes/expressive-light.cjs +1 -1
  34. package/dist/tokens/themes/expressive-light.js +2 -2
  35. package/dist/tokens/themes/expressive-sm-dark.cjs +1 -1
  36. package/dist/tokens/themes/expressive-sm-dark.js +2 -2
  37. package/dist/tokens/themes/expressive-sm-light.cjs +1 -1
  38. package/dist/tokens/themes/expressive-sm-light.js +2 -2
  39. package/dist/tokens/themes/tmo-dark.cjs +1 -1
  40. package/dist/tokens/themes/tmo-dark.js +1 -1
  41. package/dist/tokens/themes/tmo-light.cjs +1 -1
  42. package/dist/tokens/themes/tmo-light.js +1 -1
  43. package/dist/vue2/_virtual/_plugin-vue2_normalizer.cjs +0 -3
  44. package/dist/vue2/_virtual/_plugin-vue2_normalizer.cjs.map +1 -1
  45. package/dist/vue2/_virtual/_plugin-vue2_normalizer.js +0 -3
  46. package/dist/vue2/_virtual/_plugin-vue2_normalizer.js.map +1 -1
  47. package/dist/vue2/common/sr_only_close_button.vue.cjs +1 -4
  48. package/dist/vue2/common/sr_only_close_button.vue.cjs.map +1 -1
  49. package/dist/vue2/common/sr_only_close_button.vue.js +1 -4
  50. package/dist/vue2/common/sr_only_close_button.vue.js.map +1 -1
  51. package/dist/vue2/component-documentation.json +1 -1
  52. package/dist/vue2/components/avatar/avatar.vue.cjs +1 -4
  53. package/dist/vue2/components/avatar/avatar.vue.cjs.map +1 -1
  54. package/dist/vue2/components/avatar/avatar.vue.js +1 -4
  55. package/dist/vue2/components/avatar/avatar.vue.js.map +1 -1
  56. package/dist/vue2/components/badge/badge.vue.cjs +1 -4
  57. package/dist/vue2/components/badge/badge.vue.cjs.map +1 -1
  58. package/dist/vue2/components/badge/badge.vue.js +1 -4
  59. package/dist/vue2/components/badge/badge.vue.js.map +1 -1
  60. package/dist/vue2/components/banner/banner.vue.cjs +1 -4
  61. package/dist/vue2/components/banner/banner.vue.cjs.map +1 -1
  62. package/dist/vue2/components/banner/banner.vue.js +1 -4
  63. package/dist/vue2/components/banner/banner.vue.js.map +1 -1
  64. package/dist/vue2/components/breadcrumbs/breadcrumb_item.vue.cjs +1 -4
  65. package/dist/vue2/components/breadcrumbs/breadcrumb_item.vue.cjs.map +1 -1
  66. package/dist/vue2/components/breadcrumbs/breadcrumb_item.vue.js +1 -4
  67. package/dist/vue2/components/breadcrumbs/breadcrumb_item.vue.js.map +1 -1
  68. package/dist/vue2/components/breadcrumbs/breadcrumbs.vue.cjs +1 -4
  69. package/dist/vue2/components/breadcrumbs/breadcrumbs.vue.cjs.map +1 -1
  70. package/dist/vue2/components/breadcrumbs/breadcrumbs.vue.js +1 -4
  71. package/dist/vue2/components/breadcrumbs/breadcrumbs.vue.js.map +1 -1
  72. package/dist/vue2/components/button/button.vue.cjs +1 -4
  73. package/dist/vue2/components/button/button.vue.cjs.map +1 -1
  74. package/dist/vue2/components/button/button.vue.js +1 -4
  75. package/dist/vue2/components/button/button.vue.js.map +1 -1
  76. package/dist/vue2/components/button_group/button_group.vue.cjs +1 -4
  77. package/dist/vue2/components/button_group/button_group.vue.cjs.map +1 -1
  78. package/dist/vue2/components/button_group/button_group.vue.js +1 -4
  79. package/dist/vue2/components/button_group/button_group.vue.js.map +1 -1
  80. package/dist/vue2/components/card/card.vue.cjs +1 -4
  81. package/dist/vue2/components/card/card.vue.cjs.map +1 -1
  82. package/dist/vue2/components/card/card.vue.js +1 -4
  83. package/dist/vue2/components/card/card.vue.js.map +1 -1
  84. package/dist/vue2/components/checkbox/checkbox.vue.cjs +1 -4
  85. package/dist/vue2/components/checkbox/checkbox.vue.cjs.map +1 -1
  86. package/dist/vue2/components/checkbox/checkbox.vue.js +1 -4
  87. package/dist/vue2/components/checkbox/checkbox.vue.js.map +1 -1
  88. package/dist/vue2/components/checkbox_group/checkbox_group.vue.cjs +1 -4
  89. package/dist/vue2/components/checkbox_group/checkbox_group.vue.cjs.map +1 -1
  90. package/dist/vue2/components/checkbox_group/checkbox_group.vue.js +1 -4
  91. package/dist/vue2/components/checkbox_group/checkbox_group.vue.js.map +1 -1
  92. package/dist/vue2/components/chip/chip.vue.cjs +1 -4
  93. package/dist/vue2/components/chip/chip.vue.cjs.map +1 -1
  94. package/dist/vue2/components/chip/chip.vue.js +1 -4
  95. package/dist/vue2/components/chip/chip.vue.js.map +1 -1
  96. package/dist/vue2/components/codeblock/codeblock.vue.cjs +1 -4
  97. package/dist/vue2/components/codeblock/codeblock.vue.cjs.map +1 -1
  98. package/dist/vue2/components/codeblock/codeblock.vue.js +1 -4
  99. package/dist/vue2/components/codeblock/codeblock.vue.js.map +1 -1
  100. package/dist/vue2/components/collapsible/collapsible.vue.cjs +1 -4
  101. package/dist/vue2/components/collapsible/collapsible.vue.cjs.map +1 -1
  102. package/dist/vue2/components/collapsible/collapsible.vue.js +1 -4
  103. package/dist/vue2/components/collapsible/collapsible.vue.js.map +1 -1
  104. package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.cjs +1 -4
  105. package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.cjs.map +1 -1
  106. package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.js +1 -4
  107. package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.js.map +1 -1
  108. package/dist/vue2/components/combobox/combobox.vue.cjs +1 -4
  109. package/dist/vue2/components/combobox/combobox.vue.cjs.map +1 -1
  110. package/dist/vue2/components/combobox/combobox.vue.js +1 -4
  111. package/dist/vue2/components/combobox/combobox.vue.js.map +1 -1
  112. package/dist/vue2/components/combobox/combobox_empty-list.vue.cjs +1 -4
  113. package/dist/vue2/components/combobox/combobox_empty-list.vue.cjs.map +1 -1
  114. package/dist/vue2/components/combobox/combobox_empty-list.vue.js +1 -4
  115. package/dist/vue2/components/combobox/combobox_empty-list.vue.js.map +1 -1
  116. package/dist/vue2/components/combobox/combobox_loading-list.vue.cjs +1 -4
  117. package/dist/vue2/components/combobox/combobox_loading-list.vue.cjs.map +1 -1
  118. package/dist/vue2/components/combobox/combobox_loading-list.vue.js +1 -4
  119. package/dist/vue2/components/combobox/combobox_loading-list.vue.js.map +1 -1
  120. package/dist/vue2/components/datepicker/datepicker.vue.cjs +1 -4
  121. package/dist/vue2/components/datepicker/datepicker.vue.cjs.map +1 -1
  122. package/dist/vue2/components/datepicker/datepicker.vue.js +1 -4
  123. package/dist/vue2/components/datepicker/datepicker.vue.js.map +1 -1
  124. package/dist/vue2/components/datepicker/modules/calendar.vue.cjs +1 -4
  125. package/dist/vue2/components/datepicker/modules/calendar.vue.cjs.map +1 -1
  126. package/dist/vue2/components/datepicker/modules/calendar.vue.js +1 -4
  127. package/dist/vue2/components/datepicker/modules/calendar.vue.js.map +1 -1
  128. package/dist/vue2/components/datepicker/modules/month-year-picker.vue.cjs +1 -4
  129. package/dist/vue2/components/datepicker/modules/month-year-picker.vue.cjs.map +1 -1
  130. package/dist/vue2/components/datepicker/modules/month-year-picker.vue.js +1 -4
  131. package/dist/vue2/components/datepicker/modules/month-year-picker.vue.js.map +1 -1
  132. package/dist/vue2/components/description_list/description_list.vue.cjs +1 -4
  133. package/dist/vue2/components/description_list/description_list.vue.cjs.map +1 -1
  134. package/dist/vue2/components/description_list/description_list.vue.js +1 -4
  135. package/dist/vue2/components/description_list/description_list.vue.js.map +1 -1
  136. package/dist/vue2/components/dropdown/dropdown.vue.cjs +1 -4
  137. package/dist/vue2/components/dropdown/dropdown.vue.cjs.map +1 -1
  138. package/dist/vue2/components/dropdown/dropdown.vue.js +1 -4
  139. package/dist/vue2/components/dropdown/dropdown.vue.js.map +1 -1
  140. package/dist/vue2/components/dropdown/dropdown_separator.vue.cjs +1 -4
  141. package/dist/vue2/components/dropdown/dropdown_separator.vue.cjs.map +1 -1
  142. package/dist/vue2/components/dropdown/dropdown_separator.vue.js +1 -4
  143. package/dist/vue2/components/dropdown/dropdown_separator.vue.js.map +1 -1
  144. package/dist/vue2/components/emoji/emoji.vue.cjs +1 -4
  145. package/dist/vue2/components/emoji/emoji.vue.cjs.map +1 -1
  146. package/dist/vue2/components/emoji/emoji.vue.js +1 -4
  147. package/dist/vue2/components/emoji/emoji.vue.js.map +1 -1
  148. package/dist/vue2/components/emoji_picker/emoji_picker.vue.cjs +1 -4
  149. package/dist/vue2/components/emoji_picker/emoji_picker.vue.cjs.map +1 -1
  150. package/dist/vue2/components/emoji_picker/emoji_picker.vue.js +1 -4
  151. package/dist/vue2/components/emoji_picker/emoji_picker.vue.js.map +1 -1
  152. package/dist/vue2/components/emoji_picker/modules/emoji_description.vue.cjs +1 -4
  153. package/dist/vue2/components/emoji_picker/modules/emoji_description.vue.cjs.map +1 -1
  154. package/dist/vue2/components/emoji_picker/modules/emoji_description.vue.js +1 -4
  155. package/dist/vue2/components/emoji_picker/modules/emoji_description.vue.js.map +1 -1
  156. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.cjs +1 -4
  157. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.cjs.map +1 -1
  158. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.js +1 -4
  159. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.js.map +1 -1
  160. package/dist/vue2/components/emoji_picker/modules/emoji_selector.vue.cjs +1 -4
  161. package/dist/vue2/components/emoji_picker/modules/emoji_selector.vue.cjs.map +1 -1
  162. package/dist/vue2/components/emoji_picker/modules/emoji_selector.vue.js +1 -4
  163. package/dist/vue2/components/emoji_picker/modules/emoji_selector.vue.js.map +1 -1
  164. package/dist/vue2/components/emoji_picker/modules/emoji_skin_selector.vue.cjs +1 -4
  165. package/dist/vue2/components/emoji_picker/modules/emoji_skin_selector.vue.cjs.map +1 -1
  166. package/dist/vue2/components/emoji_picker/modules/emoji_skin_selector.vue.js +1 -4
  167. package/dist/vue2/components/emoji_picker/modules/emoji_skin_selector.vue.js.map +1 -1
  168. package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs +1 -4
  169. package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs.map +1 -1
  170. package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js +1 -4
  171. package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js.map +1 -1
  172. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs +1 -4
  173. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs.map +1 -1
  174. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.js +1 -4
  175. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.js.map +1 -1
  176. package/dist/vue2/components/empty_state/empty_state.vue.cjs +1 -4
  177. package/dist/vue2/components/empty_state/empty_state.vue.cjs.map +1 -1
  178. package/dist/vue2/components/empty_state/empty_state.vue.js +1 -4
  179. package/dist/vue2/components/empty_state/empty_state.vue.js.map +1 -1
  180. package/dist/vue2/components/hovercard/hovercard.vue.cjs +1 -4
  181. package/dist/vue2/components/hovercard/hovercard.vue.cjs.map +1 -1
  182. package/dist/vue2/components/hovercard/hovercard.vue.js +1 -4
  183. package/dist/vue2/components/hovercard/hovercard.vue.js.map +1 -1
  184. package/dist/vue2/components/icon/icon.vue.cjs +1 -4
  185. package/dist/vue2/components/icon/icon.vue.cjs.map +1 -1
  186. package/dist/vue2/components/icon/icon.vue.js +1 -4
  187. package/dist/vue2/components/icon/icon.vue.js.map +1 -1
  188. package/dist/vue2/components/illustration/illustration.vue.cjs +1 -4
  189. package/dist/vue2/components/illustration/illustration.vue.cjs.map +1 -1
  190. package/dist/vue2/components/illustration/illustration.vue.js +1 -4
  191. package/dist/vue2/components/illustration/illustration.vue.js.map +1 -1
  192. package/dist/vue2/components/image_viewer/image_viewer.vue.cjs +1 -4
  193. package/dist/vue2/components/image_viewer/image_viewer.vue.cjs.map +1 -1
  194. package/dist/vue2/components/image_viewer/image_viewer.vue.js +1 -4
  195. package/dist/vue2/components/image_viewer/image_viewer.vue.js.map +1 -1
  196. package/dist/vue2/components/input/input.vue.cjs +1 -4
  197. package/dist/vue2/components/input/input.vue.cjs.map +1 -1
  198. package/dist/vue2/components/input/input.vue.js +1 -4
  199. package/dist/vue2/components/input/input.vue.js.map +1 -1
  200. package/dist/vue2/components/input_group/input_group.vue.cjs +1 -4
  201. package/dist/vue2/components/input_group/input_group.vue.cjs.map +1 -1
  202. package/dist/vue2/components/input_group/input_group.vue.js +1 -4
  203. package/dist/vue2/components/input_group/input_group.vue.js.map +1 -1
  204. package/dist/vue2/components/item_layout/item_layout.vue.cjs +1 -4
  205. package/dist/vue2/components/item_layout/item_layout.vue.cjs.map +1 -1
  206. package/dist/vue2/components/item_layout/item_layout.vue.js +1 -4
  207. package/dist/vue2/components/item_layout/item_layout.vue.js.map +1 -1
  208. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.cjs +1 -4
  209. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.cjs.map +1 -1
  210. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.js +1 -4
  211. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.js.map +1 -1
  212. package/dist/vue2/components/lazy_show/lazy_show.vue.cjs +1 -4
  213. package/dist/vue2/components/lazy_show/lazy_show.vue.cjs.map +1 -1
  214. package/dist/vue2/components/lazy_show/lazy_show.vue.js +1 -4
  215. package/dist/vue2/components/lazy_show/lazy_show.vue.js.map +1 -1
  216. package/dist/vue2/components/link/link.vue.cjs +1 -4
  217. package/dist/vue2/components/link/link.vue.cjs.map +1 -1
  218. package/dist/vue2/components/link/link.vue.js +1 -4
  219. package/dist/vue2/components/link/link.vue.js.map +1 -1
  220. package/dist/vue2/components/list_item/list_item.vue.cjs +1 -4
  221. package/dist/vue2/components/list_item/list_item.vue.cjs.map +1 -1
  222. package/dist/vue2/components/list_item/list_item.vue.js +1 -4
  223. package/dist/vue2/components/list_item/list_item.vue.js.map +1 -1
  224. package/dist/vue2/components/list_item_group/list_item_group.vue.cjs +1 -4
  225. package/dist/vue2/components/list_item_group/list_item_group.vue.cjs.map +1 -1
  226. package/dist/vue2/components/list_item_group/list_item_group.vue.js +1 -4
  227. package/dist/vue2/components/list_item_group/list_item_group.vue.js.map +1 -1
  228. package/dist/vue2/components/modal/modal.vue.cjs +1 -4
  229. package/dist/vue2/components/modal/modal.vue.cjs.map +1 -1
  230. package/dist/vue2/components/modal/modal.vue.js +1 -4
  231. package/dist/vue2/components/modal/modal.vue.js.map +1 -1
  232. package/dist/vue2/components/notice/notice.vue.cjs +1 -4
  233. package/dist/vue2/components/notice/notice.vue.cjs.map +1 -1
  234. package/dist/vue2/components/notice/notice.vue.js +1 -4
  235. package/dist/vue2/components/notice/notice.vue.js.map +1 -1
  236. package/dist/vue2/components/notice/notice_action.vue.cjs +1 -4
  237. package/dist/vue2/components/notice/notice_action.vue.cjs.map +1 -1
  238. package/dist/vue2/components/notice/notice_action.vue.js +1 -4
  239. package/dist/vue2/components/notice/notice_action.vue.js.map +1 -1
  240. package/dist/vue2/components/notice/notice_content.vue.cjs +1 -4
  241. package/dist/vue2/components/notice/notice_content.vue.cjs.map +1 -1
  242. package/dist/vue2/components/notice/notice_content.vue.js +1 -4
  243. package/dist/vue2/components/notice/notice_content.vue.js.map +1 -1
  244. package/dist/vue2/components/notice/notice_icon.vue.cjs +1 -4
  245. package/dist/vue2/components/notice/notice_icon.vue.cjs.map +1 -1
  246. package/dist/vue2/components/notice/notice_icon.vue.js +1 -4
  247. package/dist/vue2/components/notice/notice_icon.vue.js.map +1 -1
  248. package/dist/vue2/components/pagination/pagination.vue.cjs +1 -4
  249. package/dist/vue2/components/pagination/pagination.vue.cjs.map +1 -1
  250. package/dist/vue2/components/pagination/pagination.vue.js +1 -4
  251. package/dist/vue2/components/pagination/pagination.vue.js.map +1 -1
  252. package/dist/vue2/components/popover/popover.vue.cjs +1 -4
  253. package/dist/vue2/components/popover/popover.vue.cjs.map +1 -1
  254. package/dist/vue2/components/popover/popover.vue.js +1 -4
  255. package/dist/vue2/components/popover/popover.vue.js.map +1 -1
  256. package/dist/vue2/components/popover/popover_header_footer.vue.cjs +1 -4
  257. package/dist/vue2/components/popover/popover_header_footer.vue.cjs.map +1 -1
  258. package/dist/vue2/components/popover/popover_header_footer.vue.js +1 -4
  259. package/dist/vue2/components/popover/popover_header_footer.vue.js.map +1 -1
  260. package/dist/vue2/components/presence/presence.vue.cjs +1 -4
  261. package/dist/vue2/components/presence/presence.vue.cjs.map +1 -1
  262. package/dist/vue2/components/presence/presence.vue.js +1 -4
  263. package/dist/vue2/components/presence/presence.vue.js.map +1 -1
  264. package/dist/vue2/components/radio/radio.vue.cjs +1 -4
  265. package/dist/vue2/components/radio/radio.vue.cjs.map +1 -1
  266. package/dist/vue2/components/radio/radio.vue.js +1 -4
  267. package/dist/vue2/components/radio/radio.vue.js.map +1 -1
  268. package/dist/vue2/components/radio_group/radio_group.vue.cjs +1 -4
  269. package/dist/vue2/components/radio_group/radio_group.vue.cjs.map +1 -1
  270. package/dist/vue2/components/radio_group/radio_group.vue.js +1 -4
  271. package/dist/vue2/components/radio_group/radio_group.vue.js.map +1 -1
  272. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelComponent.vue.cjs +1 -4
  273. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelComponent.vue.cjs.map +1 -1
  274. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelComponent.vue.js +1 -4
  275. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelComponent.vue.js.map +1 -1
  276. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelSuggestion.vue.cjs +1 -4
  277. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelSuggestion.vue.cjs.map +1 -1
  278. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelSuggestion.vue.js +1 -4
  279. package/dist/vue2/components/rich_text_editor/extensions/channels/ChannelSuggestion.vue.js.map +1 -1
  280. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiComponent.vue.cjs +1 -4
  281. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiComponent.vue.cjs.map +1 -1
  282. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiComponent.vue.js +1 -4
  283. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiComponent.vue.js.map +1 -1
  284. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiSuggestion.vue.cjs +1 -4
  285. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiSuggestion.vue.cjs.map +1 -1
  286. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiSuggestion.vue.js +1 -4
  287. package/dist/vue2/components/rich_text_editor/extensions/emoji/EmojiSuggestion.vue.js.map +1 -1
  288. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionComponent.vue.cjs +1 -4
  289. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionComponent.vue.cjs.map +1 -1
  290. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionComponent.vue.js +1 -4
  291. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionComponent.vue.js.map +1 -1
  292. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs +1 -4
  293. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs.map +1 -1
  294. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js +1 -4
  295. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js.map +1 -1
  296. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.cjs +1 -4
  297. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.cjs.map +1 -1
  298. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.js +1 -4
  299. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.js.map +1 -1
  300. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.cjs +1 -4
  301. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.cjs.map +1 -1
  302. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.js +1 -4
  303. package/dist/vue2/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.js.map +1 -1
  304. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs +1 -4
  305. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs.map +1 -1
  306. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js +1 -4
  307. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js.map +1 -1
  308. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs +1 -4
  309. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs.map +1 -1
  310. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js +1 -4
  311. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js.map +1 -1
  312. package/dist/vue2/components/root_layout/root_layout.vue.cjs +1 -4
  313. package/dist/vue2/components/root_layout/root_layout.vue.cjs.map +1 -1
  314. package/dist/vue2/components/root_layout/root_layout.vue.js +1 -4
  315. package/dist/vue2/components/root_layout/root_layout.vue.js.map +1 -1
  316. package/dist/vue2/components/select_menu/select_menu.vue.cjs +1 -4
  317. package/dist/vue2/components/select_menu/select_menu.vue.cjs.map +1 -1
  318. package/dist/vue2/components/select_menu/select_menu.vue.js +1 -4
  319. package/dist/vue2/components/select_menu/select_menu.vue.js.map +1 -1
  320. package/dist/vue2/components/skeleton/skeleton-list-item.vue.cjs +1 -4
  321. package/dist/vue2/components/skeleton/skeleton-list-item.vue.cjs.map +1 -1
  322. package/dist/vue2/components/skeleton/skeleton-list-item.vue.js +1 -4
  323. package/dist/vue2/components/skeleton/skeleton-list-item.vue.js.map +1 -1
  324. package/dist/vue2/components/skeleton/skeleton-paragraph.vue.cjs +1 -4
  325. package/dist/vue2/components/skeleton/skeleton-paragraph.vue.cjs.map +1 -1
  326. package/dist/vue2/components/skeleton/skeleton-paragraph.vue.js +1 -4
  327. package/dist/vue2/components/skeleton/skeleton-paragraph.vue.js.map +1 -1
  328. package/dist/vue2/components/skeleton/skeleton-shape.vue.cjs +1 -4
  329. package/dist/vue2/components/skeleton/skeleton-shape.vue.cjs.map +1 -1
  330. package/dist/vue2/components/skeleton/skeleton-shape.vue.js +1 -4
  331. package/dist/vue2/components/skeleton/skeleton-shape.vue.js.map +1 -1
  332. package/dist/vue2/components/skeleton/skeleton-text.vue.cjs +1 -4
  333. package/dist/vue2/components/skeleton/skeleton-text.vue.cjs.map +1 -1
  334. package/dist/vue2/components/skeleton/skeleton-text.vue.js +1 -4
  335. package/dist/vue2/components/skeleton/skeleton-text.vue.js.map +1 -1
  336. package/dist/vue2/components/skeleton/skeleton.vue.cjs +1 -4
  337. package/dist/vue2/components/skeleton/skeleton.vue.cjs.map +1 -1
  338. package/dist/vue2/components/skeleton/skeleton.vue.js +1 -4
  339. package/dist/vue2/components/skeleton/skeleton.vue.js.map +1 -1
  340. package/dist/vue2/components/split_button/split_button-alpha.vue.cjs +1 -4
  341. package/dist/vue2/components/split_button/split_button-alpha.vue.cjs.map +1 -1
  342. package/dist/vue2/components/split_button/split_button-alpha.vue.js +1 -4
  343. package/dist/vue2/components/split_button/split_button-alpha.vue.js.map +1 -1
  344. package/dist/vue2/components/split_button/split_button-omega.vue.cjs +1 -4
  345. package/dist/vue2/components/split_button/split_button-omega.vue.cjs.map +1 -1
  346. package/dist/vue2/components/split_button/split_button-omega.vue.js +1 -4
  347. package/dist/vue2/components/split_button/split_button-omega.vue.js.map +1 -1
  348. package/dist/vue2/components/split_button/split_button.vue.cjs +1 -4
  349. package/dist/vue2/components/split_button/split_button.vue.cjs.map +1 -1
  350. package/dist/vue2/components/split_button/split_button.vue.js +1 -4
  351. package/dist/vue2/components/split_button/split_button.vue.js.map +1 -1
  352. package/dist/vue2/components/stack/stack.vue.cjs +1 -4
  353. package/dist/vue2/components/stack/stack.vue.cjs.map +1 -1
  354. package/dist/vue2/components/stack/stack.vue.js +1 -4
  355. package/dist/vue2/components/stack/stack.vue.js.map +1 -1
  356. package/dist/vue2/components/tab/tab.vue.cjs +1 -4
  357. package/dist/vue2/components/tab/tab.vue.cjs.map +1 -1
  358. package/dist/vue2/components/tab/tab.vue.js +1 -4
  359. package/dist/vue2/components/tab/tab.vue.js.map +1 -1
  360. package/dist/vue2/components/tab/tab_group.vue.cjs +1 -4
  361. package/dist/vue2/components/tab/tab_group.vue.cjs.map +1 -1
  362. package/dist/vue2/components/tab/tab_group.vue.js +1 -4
  363. package/dist/vue2/components/tab/tab_group.vue.js.map +1 -1
  364. package/dist/vue2/components/tab/tab_panel.vue.cjs +1 -4
  365. package/dist/vue2/components/tab/tab_panel.vue.cjs.map +1 -1
  366. package/dist/vue2/components/tab/tab_panel.vue.js +1 -4
  367. package/dist/vue2/components/tab/tab_panel.vue.js.map +1 -1
  368. package/dist/vue2/components/toast/toast.vue.cjs +1 -4
  369. package/dist/vue2/components/toast/toast.vue.cjs.map +1 -1
  370. package/dist/vue2/components/toast/toast.vue.js +1 -4
  371. package/dist/vue2/components/toast/toast.vue.js.map +1 -1
  372. package/dist/vue2/components/toggle/toggle.vue.cjs +1 -4
  373. package/dist/vue2/components/toggle/toggle.vue.cjs.map +1 -1
  374. package/dist/vue2/components/toggle/toggle.vue.js +1 -4
  375. package/dist/vue2/components/toggle/toggle.vue.js.map +1 -1
  376. package/dist/vue2/components/tooltip/tooltip.vue.cjs +1 -4
  377. package/dist/vue2/components/tooltip/tooltip.vue.cjs.map +1 -1
  378. package/dist/vue2/components/tooltip/tooltip.vue.js +1 -4
  379. package/dist/vue2/components/tooltip/tooltip.vue.js.map +1 -1
  380. package/dist/vue2/components/validation_messages/validation_messages.vue.cjs +1 -4
  381. package/dist/vue2/components/validation_messages/validation_messages.vue.cjs.map +1 -1
  382. package/dist/vue2/components/validation_messages/validation_messages.vue.js +1 -4
  383. package/dist/vue2/components/validation_messages/validation_messages.vue.js.map +1 -1
  384. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs +1 -5
  385. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs.map +1 -1
  386. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js +1 -5
  387. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js.map +1 -1
  388. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs +7 -11
  389. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs.map +1 -1
  390. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js +7 -11
  391. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js.map +1 -1
  392. package/dist/vue2/recipes/cards/ivr_node/ivr_node.vue.cjs +6 -10
  393. package/dist/vue2/recipes/cards/ivr_node/ivr_node.vue.cjs.map +1 -1
  394. package/dist/vue2/recipes/cards/ivr_node/ivr_node.vue.js +6 -10
  395. package/dist/vue2/recipes/cards/ivr_node/ivr_node.vue.js.map +1 -1
  396. package/dist/vue2/recipes/chips/grouped_chip/grouped_chip.vue.cjs +3 -7
  397. package/dist/vue2/recipes/chips/grouped_chip/grouped_chip.vue.cjs.map +1 -1
  398. package/dist/vue2/recipes/chips/grouped_chip/grouped_chip.vue.js +3 -7
  399. package/dist/vue2/recipes/chips/grouped_chip/grouped_chip.vue.js.map +1 -1
  400. package/dist/vue2/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.cjs +9 -10
  401. package/dist/vue2/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.cjs.map +1 -1
  402. package/dist/vue2/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js +9 -10
  403. package/dist/vue2/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js.map +1 -1
  404. package/dist/vue2/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.cjs +1 -4
  405. package/dist/vue2/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.cjs.map +1 -1
  406. package/dist/vue2/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.js +1 -4
  407. package/dist/vue2/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.js.map +1 -1
  408. package/dist/vue2/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.cjs +4 -8
  409. package/dist/vue2/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.cjs.map +1 -1
  410. package/dist/vue2/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js +4 -8
  411. package/dist/vue2/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js.map +1 -1
  412. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.cjs +2 -6
  413. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.cjs.map +1 -1
  414. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.js +2 -6
  415. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.js.map +1 -1
  416. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.cjs +2 -6
  417. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.cjs.map +1 -1
  418. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.js +2 -6
  419. package/dist/vue2/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.js.map +1 -1
  420. package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs +22 -26
  421. package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
  422. package/dist/vue2/recipes/conversation_view/editor/editor.vue.js +22 -26
  423. package/dist/vue2/recipes/conversation_view/editor/editor.vue.js.map +1 -1
  424. package/dist/vue2/recipes/conversation_view/emoji_row/emoji_row.vue.cjs +8 -9
  425. package/dist/vue2/recipes/conversation_view/emoji_row/emoji_row.vue.cjs.map +1 -1
  426. package/dist/vue2/recipes/conversation_view/emoji_row/emoji_row.vue.js +8 -9
  427. package/dist/vue2/recipes/conversation_view/emoji_row/emoji_row.vue.js.map +1 -1
  428. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs +1 -5
  429. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs.map +1 -1
  430. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js +1 -5
  431. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js.map +1 -1
  432. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.cjs +3 -3
  433. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.cjs.map +1 -1
  434. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.js +3 -3
  435. package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.js.map +1 -1
  436. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs +10 -14
  437. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs.map +1 -1
  438. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.js +10 -14
  439. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.js.map +1 -1
  440. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row_constants.cjs +2 -2
  441. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row_constants.cjs.map +1 -1
  442. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row_constants.js +2 -2
  443. package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row_constants.js.map +1 -1
  444. package/dist/vue2/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.cjs +4 -8
  445. package/dist/vue2/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.cjs.map +1 -1
  446. package/dist/vue2/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.js +4 -8
  447. package/dist/vue2/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.js.map +1 -1
  448. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.cjs +13 -17
  449. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.cjs.map +1 -1
  450. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.js +13 -17
  451. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.js.map +1 -1
  452. package/dist/vue2/recipes/conversation_view/time_pill/time_pill.vue.cjs +2 -6
  453. package/dist/vue2/recipes/conversation_view/time_pill/time_pill.vue.cjs.map +1 -1
  454. package/dist/vue2/recipes/conversation_view/time_pill/time_pill.vue.js +2 -6
  455. package/dist/vue2/recipes/conversation_view/time_pill/time_pill.vue.js.map +1 -1
  456. package/dist/vue2/recipes/header/settings_menu_button/settings_menu_button.vue.cjs +3 -7
  457. package/dist/vue2/recipes/header/settings_menu_button/settings_menu_button.vue.cjs.map +1 -1
  458. package/dist/vue2/recipes/header/settings_menu_button/settings_menu_button.vue.js +3 -7
  459. package/dist/vue2/recipes/header/settings_menu_button/settings_menu_button.vue.js.map +1 -1
  460. package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.cjs +3 -7
  461. package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.cjs.map +1 -1
  462. package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.js +3 -7
  463. package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.js.map +1 -1
  464. package/dist/vue2/recipes/leftbar/callbox/callbox.vue.cjs +4 -8
  465. package/dist/vue2/recipes/leftbar/callbox/callbox.vue.cjs.map +1 -1
  466. package/dist/vue2/recipes/leftbar/callbox/callbox.vue.js +4 -8
  467. package/dist/vue2/recipes/leftbar/callbox/callbox.vue.js.map +1 -1
  468. package/dist/vue2/recipes/leftbar/callbox/callbox_constants.cjs +3 -3
  469. package/dist/vue2/recipes/leftbar/callbox/callbox_constants.cjs.map +1 -1
  470. package/dist/vue2/recipes/leftbar/callbox/callbox_constants.js +3 -3
  471. package/dist/vue2/recipes/leftbar/callbox/callbox_constants.js.map +1 -1
  472. package/dist/vue2/recipes/leftbar/contact_centers_row/contact_centers_row.vue.cjs +12 -16
  473. package/dist/vue2/recipes/leftbar/contact_centers_row/contact_centers_row.vue.cjs.map +1 -1
  474. package/dist/vue2/recipes/leftbar/contact_centers_row/contact_centers_row.vue.js +12 -16
  475. package/dist/vue2/recipes/leftbar/contact_centers_row/contact_centers_row.vue.js.map +1 -1
  476. package/dist/vue2/recipes/leftbar/contact_row/contact_row.vue.cjs +2 -5
  477. package/dist/vue2/recipes/leftbar/contact_row/contact_row.vue.cjs.map +1 -1
  478. package/dist/vue2/recipes/leftbar/contact_row/contact_row.vue.js +2 -5
  479. package/dist/vue2/recipes/leftbar/contact_row/contact_row.vue.js.map +1 -1
  480. package/dist/vue2/recipes/leftbar/general_row/general_row.vue.cjs +28 -32
  481. package/dist/vue2/recipes/leftbar/general_row/general_row.vue.cjs.map +1 -1
  482. package/dist/vue2/recipes/leftbar/general_row/general_row.vue.js +28 -32
  483. package/dist/vue2/recipes/leftbar/general_row/general_row.vue.js.map +1 -1
  484. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs +2 -5
  485. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs.map +1 -1
  486. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js +2 -5
  487. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js.map +1 -1
  488. package/dist/vue2/recipes/leftbar/group_row/group_row.vue.cjs +1 -4
  489. package/dist/vue2/recipes/leftbar/group_row/group_row.vue.cjs.map +1 -1
  490. package/dist/vue2/recipes/leftbar/group_row/group_row.vue.js +1 -4
  491. package/dist/vue2/recipes/leftbar/group_row/group_row.vue.js.map +1 -1
  492. package/dist/vue2/recipes/leftbar/unread_pill/unread_pill.vue.cjs +2 -6
  493. package/dist/vue2/recipes/leftbar/unread_pill/unread_pill.vue.cjs.map +1 -1
  494. package/dist/vue2/recipes/leftbar/unread_pill/unread_pill.vue.js +2 -6
  495. package/dist/vue2/recipes/leftbar/unread_pill/unread_pill.vue.js.map +1 -1
  496. package/dist/vue2/recipes/notices/top_banner_info/top_banner_info.vue.cjs +2 -6
  497. package/dist/vue2/recipes/notices/top_banner_info/top_banner_info.vue.cjs.map +1 -1
  498. package/dist/vue2/recipes/notices/top_banner_info/top_banner_info.vue.js +2 -6
  499. package/dist/vue2/recipes/notices/top_banner_info/top_banner_info.vue.js.map +1 -1
  500. package/dist/vue2/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts.map +1 -1
  501. package/dist/vue2/types/recipes/conversation_view/emoji_row/emoji_row.vue.d.ts.map +1 -1
  502. package/dist/vue2/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts +4 -4
  503. package/dist/vue2/types/recipes/leftbar/contact_centers_row/contact_centers_row.vue.d.ts +2 -2
  504. package/dist/vue2/types/recipes/leftbar/general_row/general_row.vue.d.ts +6 -6
  505. package/dist/vue2/types/recipes/leftbar/general_row/general_row.vue.d.ts.map +1 -1
  506. package/dist/vue3/component-documentation.json +1 -1
  507. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.cjs +0 -1
  508. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.cjs.map +1 -1
  509. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.js +0 -1
  510. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.js.map +1 -1
  511. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs +7 -8
  512. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs.map +1 -1
  513. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js +7 -8
  514. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js.map +1 -1
  515. package/dist/vue3/recipes/cards/ivr_node/ivr_node.vue.cjs +7 -8
  516. package/dist/vue3/recipes/cards/ivr_node/ivr_node.vue.cjs.map +1 -1
  517. package/dist/vue3/recipes/cards/ivr_node/ivr_node.vue.js +7 -8
  518. package/dist/vue3/recipes/cards/ivr_node/ivr_node.vue.js.map +1 -1
  519. package/dist/vue3/recipes/chips/grouped_chip/grouped_chip.vue.cjs +3 -4
  520. package/dist/vue3/recipes/chips/grouped_chip/grouped_chip.vue.cjs.map +1 -1
  521. package/dist/vue3/recipes/chips/grouped_chip/grouped_chip.vue.js +3 -4
  522. package/dist/vue3/recipes/chips/grouped_chip/grouped_chip.vue.js.map +1 -1
  523. package/dist/vue3/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.cjs +13 -11
  524. package/dist/vue3/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.cjs.map +1 -1
  525. package/dist/vue3/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js +13 -11
  526. package/dist/vue3/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js.map +1 -1
  527. package/dist/vue3/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.cjs +4 -5
  528. package/dist/vue3/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.cjs.map +1 -1
  529. package/dist/vue3/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js +4 -5
  530. package/dist/vue3/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js.map +1 -1
  531. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.cjs +5 -6
  532. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.cjs.map +1 -1
  533. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.js +5 -6
  534. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.js.map +1 -1
  535. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.cjs +3 -4
  536. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.cjs.map +1 -1
  537. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.js +3 -4
  538. package/dist/vue3/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.js.map +1 -1
  539. package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs +22 -23
  540. package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
  541. package/dist/vue3/recipes/conversation_view/editor/editor.vue.js +22 -23
  542. package/dist/vue3/recipes/conversation_view/editor/editor.vue.js.map +1 -1
  543. package/dist/vue3/recipes/conversation_view/emoji_row/emoji_row.vue.cjs +8 -6
  544. package/dist/vue3/recipes/conversation_view/emoji_row/emoji_row.vue.cjs.map +1 -1
  545. package/dist/vue3/recipes/conversation_view/emoji_row/emoji_row.vue.js +8 -6
  546. package/dist/vue3/recipes/conversation_view/emoji_row/emoji_row.vue.js.map +1 -1
  547. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs +7 -8
  548. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs.map +1 -1
  549. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js +7 -8
  550. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js.map +1 -1
  551. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.cjs +3 -3
  552. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.cjs.map +1 -1
  553. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.js +3 -3
  554. package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill_constants.js.map +1 -1
  555. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs +28 -29
  556. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs.map +1 -1
  557. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.js +28 -29
  558. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.js.map +1 -1
  559. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row_constants.cjs +2 -2
  560. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row_constants.cjs.map +1 -1
  561. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row_constants.js +2 -2
  562. package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row_constants.js.map +1 -1
  563. package/dist/vue3/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.cjs +4 -5
  564. package/dist/vue3/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.cjs.map +1 -1
  565. package/dist/vue3/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.js +4 -5
  566. package/dist/vue3/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.js.map +1 -1
  567. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.cjs +21 -22
  568. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.cjs.map +1 -1
  569. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.js +21 -22
  570. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.js.map +1 -1
  571. package/dist/vue3/recipes/conversation_view/time_pill/time_pill.vue.cjs +2 -3
  572. package/dist/vue3/recipes/conversation_view/time_pill/time_pill.vue.cjs.map +1 -1
  573. package/dist/vue3/recipes/conversation_view/time_pill/time_pill.vue.js +2 -3
  574. package/dist/vue3/recipes/conversation_view/time_pill/time_pill.vue.js.map +1 -1
  575. package/dist/vue3/recipes/header/settings_menu_button/settings_menu_button.vue.cjs +4 -5
  576. package/dist/vue3/recipes/header/settings_menu_button/settings_menu_button.vue.cjs.map +1 -1
  577. package/dist/vue3/recipes/header/settings_menu_button/settings_menu_button.vue.js +4 -5
  578. package/dist/vue3/recipes/header/settings_menu_button/settings_menu_button.vue.js.map +1 -1
  579. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs +10 -11
  580. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs.map +1 -1
  581. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js +10 -11
  582. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js.map +1 -1
  583. package/dist/vue3/recipes/leftbar/callbox/callbox.vue.cjs +23 -24
  584. package/dist/vue3/recipes/leftbar/callbox/callbox.vue.cjs.map +1 -1
  585. package/dist/vue3/recipes/leftbar/callbox/callbox.vue.js +23 -24
  586. package/dist/vue3/recipes/leftbar/callbox/callbox.vue.js.map +1 -1
  587. package/dist/vue3/recipes/leftbar/callbox/callbox_constants.cjs +3 -3
  588. package/dist/vue3/recipes/leftbar/callbox/callbox_constants.cjs.map +1 -1
  589. package/dist/vue3/recipes/leftbar/callbox/callbox_constants.js +3 -3
  590. package/dist/vue3/recipes/leftbar/callbox/callbox_constants.js.map +1 -1
  591. package/dist/vue3/recipes/leftbar/contact_centers_row/contact_centers_row.vue.cjs +26 -27
  592. package/dist/vue3/recipes/leftbar/contact_centers_row/contact_centers_row.vue.cjs.map +1 -1
  593. package/dist/vue3/recipes/leftbar/contact_centers_row/contact_centers_row.vue.js +26 -27
  594. package/dist/vue3/recipes/leftbar/contact_centers_row/contact_centers_row.vue.js.map +1 -1
  595. package/dist/vue3/recipes/leftbar/contact_row/contact_row.vue.cjs +7 -7
  596. package/dist/vue3/recipes/leftbar/contact_row/contact_row.vue.cjs.map +1 -1
  597. package/dist/vue3/recipes/leftbar/contact_row/contact_row.vue.js +7 -7
  598. package/dist/vue3/recipes/leftbar/contact_row/contact_row.vue.js.map +1 -1
  599. package/dist/vue3/recipes/leftbar/general_row/general_row.vue.cjs +41 -43
  600. package/dist/vue3/recipes/leftbar/general_row/general_row.vue.cjs.map +1 -1
  601. package/dist/vue3/recipes/leftbar/general_row/general_row.vue.js +42 -44
  602. package/dist/vue3/recipes/leftbar/general_row/general_row.vue.js.map +1 -1
  603. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs +1 -1
  604. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs.map +1 -1
  605. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js +1 -1
  606. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js.map +1 -1
  607. package/dist/vue3/recipes/leftbar/unread_pill/unread_pill.vue.cjs +3 -4
  608. package/dist/vue3/recipes/leftbar/unread_pill/unread_pill.vue.cjs.map +1 -1
  609. package/dist/vue3/recipes/leftbar/unread_pill/unread_pill.vue.js +3 -4
  610. package/dist/vue3/recipes/leftbar/unread_pill/unread_pill.vue.js.map +1 -1
  611. package/dist/vue3/recipes/notices/top_banner_info/top_banner_info.vue.cjs +4 -5
  612. package/dist/vue3/recipes/notices/top_banner_info/top_banner_info.vue.cjs.map +1 -1
  613. package/dist/vue3/recipes/notices/top_banner_info/top_banner_info.vue.js +4 -5
  614. package/dist/vue3/recipes/notices/top_banner_info/top_banner_info.vue.js.map +1 -1
  615. package/dist/vue3/types/recipes/chips/grouped_chip/grouped_chip.vue.d.ts.map +1 -1
  616. package/dist/vue3/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts.map +1 -1
  617. package/dist/vue3/types/recipes/conversation_view/emoji_row/emoji_row.vue.d.ts.map +1 -1
  618. package/dist/vue3/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts +4 -4
  619. package/dist/vue3/types/recipes/leftbar/contact_centers_row/contact_centers_row.vue.d.ts +2 -2
  620. package/dist/vue3/types/recipes/leftbar/general_row/general_row.vue.d.ts +6 -6
  621. package/dist/vue3/types/recipes/leftbar/general_row/general_row.vue.d.ts.map +1 -1
  622. package/package.json +5 -7
  623. package/dist/vue2/style.css +0 -1424
  624. package/dist/vue3/style.css +0 -1427
@@ -1 +1 @@
1
- {"version":3,"file":"emoji_skin_selector.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_skin_selector.vue"],"sourcesContent":["<template>\n <div data-qa=\"skin-selector\">\n <div\n v-show=\"isOpen\"\n class=\"d-emoji-picker__skin-list\"\n >\n <button\n v-for=\"(skin, index) in skinList\"\n :key=\"skin.name\"\n :ref=\"`skinRef-${index}`\"\n :class=\"{\n 'selected': skinSelected?.skinCode === skin.skinCode,\n }\"\n @click=\"selectSkin(skin)\"\n @keydown=\"event => handleKeyDown(event, skin, index)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skin.name\"\n :aria-label=\"skin.name\"\n :title=\"skin.name\"\n :src=\"`${cdnUrl + skin.unicode_output}.png`\"\n >\n </button>\n </div>\n <div\n v-show=\"!isOpen\"\n class=\"d-emoji-picker__skin-selected\"\n >\n <dt-tooltip placement=\"top-end\">\n {{ skinSelectorButtonTooltipLabel }}\n <template #anchor>\n <button\n ref=\"skinSelectorRef\"\n :aria-label=\"skinSelectorButtonTooltipLabel\"\n tabindex=\"-1\"\n @click=\"toggleSkinList\"\n @keydown=\"event => handleKeyDown(event)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skinSelected?.name\"\n :aria-label=\"skinSelected?.name\"\n :title=\"skinSelected?.name\"\n :src=\"`${cdnUrl + skinSelected?.unicode_output}.png`\"\n >\n </button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n</template>\n\n<script>\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport { CDN_URL, EMOJI_PICKER_SKIN_TONE_MODIFIERS } from '@/components/emoji_picker/emoji_picker_constants';\n\nexport default {\n name: 'EmojiSkinSelector',\n\n components: {\n DtTooltip,\n },\n\n props: {\n skinTone: {\n type: String,\n required: true,\n },\n\n isHovering: {\n type: Boolean,\n default: false,\n },\n\n skinSelectorButtonTooltipLabel: {\n type: String,\n required: true,\n },\n },\n\n data () {\n return {\n isOpen: false,\n skinSelected: null,\n skinsRef: [],\n cdnUrl: CDN_URL,\n };\n },\n\n computed: {\n skinPassedIn () {\n return this.skinList.find(skin => skin.skinTone === this.skinTone);\n },\n\n skinList () {\n return [\n {\n name: ':wave_tone1:',\n unicode_output: '1f44b-1f3fb',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.LIGHT,\n skinCode: '_tone1',\n },\n {\n name: ':wave_tone2:',\n unicode_output: '1f44b-1f3fc',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_LIGHT,\n skinCode: '_tone2',\n },\n {\n name: ':wave_tone3:',\n unicode_output: '1f44b-1f3fd',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM,\n skinCode: '_tone3',\n },\n {\n name: ':wave_tone4:',\n unicode_output: '1f44b-1f3fe',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_DARK,\n skinCode: '_tone4',\n },\n {\n name: ':wave_tone5:',\n unicode_output: '1f44b-1f3ff',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DARK,\n skinCode: '_tone5',\n },\n {\n name: ':wave:',\n unicode_output: '1f44b',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DEFAULT,\n skinCode: '',\n },\n ];\n },\n },\n\n watch: {\n isHovering (newVal) {\n if (newVal) {\n this.isOpen = false;\n }\n },\n\n skinTone (newVal, oldVal) {\n if (newVal !== oldVal) {\n this.skinSelected = this.skinPassedIn;\n }\n },\n },\n\n mounted () {\n this.skinSelected = this.skinPassedIn;\n this.$nextTick(() => {\n this.setupSkinRefs();\n });\n },\n\n methods: {\n setupSkinRefs () {\n this.skinList.forEach((skin, index) => {\n const refKey = `skinRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.skinsRef, index, this.$refs[refKey][0]);\n }\n });\n },\n\n focusSkinSelector () {\n if (this.$refs.skinSelectorRef) {\n this.$refs.skinSelectorRef.focus();\n }\n },\n\n selectSkin (skin) {\n this.skinSelected = skin;\n this.isOpen = false;\n this.$emit('skin-tone', skin.skinTone);\n this.$nextTick(() => {\n this.focusSkinSelector();\n });\n },\n\n handleKeyDown (event, skin, index) {\n event.preventDefault();\n\n if (event.key === 'ArrowLeft') {\n if (index === 0) this.skinsRef[this.skinsRef.length - 1]?.focus();\n this.skinsRef[index - 1]?.focus();\n }\n\n if (event.key === 'ArrowRight') {\n if (this.skinsRef.length) this.skinsRef[0]?.focus();\n this.skinsRef[index + 1]?.focus();\n }\n\n if (event.key === 'Enter') {\n if (skin) { this.selectSkin(skin); } else {\n this.toggleSkinList();\n }\n }\n\n if (event.key === 'Tab') {\n if (event.shiftKey) {\n this.$emit('focus-last-emoji');\n } else {\n this.$emit('focus-tabset');\n }\n }\n },\n\n toggleSkinList () {\n this.isOpen = !this.isOpen;\n this.$nextTick(() => {\n if (this.skinsRef[0]) {\n this.skinsRef[0].focus();\n }\n });\n },\n },\n};\n</script>\n"],"names":["DtTooltip","CDN_URL","EMOJI_PICKER_SKIN_TONE_MODIFIERS"],"mappings":"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"}
1
+ {"version":3,"file":"emoji_skin_selector.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_skin_selector.vue"],"sourcesContent":["<template>\n <div data-qa=\"skin-selector\">\n <div\n v-show=\"isOpen\"\n class=\"d-emoji-picker__skin-list\"\n >\n <button\n v-for=\"(skin, index) in skinList\"\n :key=\"skin.name\"\n :ref=\"`skinRef-${index}`\"\n :class=\"{\n 'selected': skinSelected?.skinCode === skin.skinCode,\n }\"\n @click=\"selectSkin(skin)\"\n @keydown=\"event => handleKeyDown(event, skin, index)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skin.name\"\n :aria-label=\"skin.name\"\n :title=\"skin.name\"\n :src=\"`${cdnUrl + skin.unicode_output}.png`\"\n >\n </button>\n </div>\n <div\n v-show=\"!isOpen\"\n class=\"d-emoji-picker__skin-selected\"\n >\n <dt-tooltip placement=\"top-end\">\n {{ skinSelectorButtonTooltipLabel }}\n <template #anchor>\n <button\n ref=\"skinSelectorRef\"\n :aria-label=\"skinSelectorButtonTooltipLabel\"\n tabindex=\"-1\"\n @click=\"toggleSkinList\"\n @keydown=\"event => handleKeyDown(event)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skinSelected?.name\"\n :aria-label=\"skinSelected?.name\"\n :title=\"skinSelected?.name\"\n :src=\"`${cdnUrl + skinSelected?.unicode_output}.png`\"\n >\n </button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n</template>\n\n<script>\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport { CDN_URL, EMOJI_PICKER_SKIN_TONE_MODIFIERS } from '@/components/emoji_picker/emoji_picker_constants';\n\nexport default {\n name: 'EmojiSkinSelector',\n\n components: {\n DtTooltip,\n },\n\n props: {\n skinTone: {\n type: String,\n required: true,\n },\n\n isHovering: {\n type: Boolean,\n default: false,\n },\n\n skinSelectorButtonTooltipLabel: {\n type: String,\n required: true,\n },\n },\n\n data () {\n return {\n isOpen: false,\n skinSelected: null,\n skinsRef: [],\n cdnUrl: CDN_URL,\n };\n },\n\n computed: {\n skinPassedIn () {\n return this.skinList.find(skin => skin.skinTone === this.skinTone);\n },\n\n skinList () {\n return [\n {\n name: ':wave_tone1:',\n unicode_output: '1f44b-1f3fb',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.LIGHT,\n skinCode: '_tone1',\n },\n {\n name: ':wave_tone2:',\n unicode_output: '1f44b-1f3fc',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_LIGHT,\n skinCode: '_tone2',\n },\n {\n name: ':wave_tone3:',\n unicode_output: '1f44b-1f3fd',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM,\n skinCode: '_tone3',\n },\n {\n name: ':wave_tone4:',\n unicode_output: '1f44b-1f3fe',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_DARK,\n skinCode: '_tone4',\n },\n {\n name: ':wave_tone5:',\n unicode_output: '1f44b-1f3ff',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DARK,\n skinCode: '_tone5',\n },\n {\n name: ':wave:',\n unicode_output: '1f44b',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DEFAULT,\n skinCode: '',\n },\n ];\n },\n },\n\n watch: {\n isHovering (newVal) {\n if (newVal) {\n this.isOpen = false;\n }\n },\n\n skinTone (newVal, oldVal) {\n if (newVal !== oldVal) {\n this.skinSelected = this.skinPassedIn;\n }\n },\n },\n\n mounted () {\n this.skinSelected = this.skinPassedIn;\n this.$nextTick(() => {\n this.setupSkinRefs();\n });\n },\n\n methods: {\n setupSkinRefs () {\n this.skinList.forEach((skin, index) => {\n const refKey = `skinRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.skinsRef, index, this.$refs[refKey][0]);\n }\n });\n },\n\n focusSkinSelector () {\n if (this.$refs.skinSelectorRef) {\n this.$refs.skinSelectorRef.focus();\n }\n },\n\n selectSkin (skin) {\n this.skinSelected = skin;\n this.isOpen = false;\n this.$emit('skin-tone', skin.skinTone);\n this.$nextTick(() => {\n this.focusSkinSelector();\n });\n },\n\n handleKeyDown (event, skin, index) {\n event.preventDefault();\n\n if (event.key === 'ArrowLeft') {\n if (index === 0) this.skinsRef[this.skinsRef.length - 1]?.focus();\n this.skinsRef[index - 1]?.focus();\n }\n\n if (event.key === 'ArrowRight') {\n if (this.skinsRef.length) this.skinsRef[0]?.focus();\n this.skinsRef[index + 1]?.focus();\n }\n\n if (event.key === 'Enter') {\n if (skin) { this.selectSkin(skin); } else {\n this.toggleSkinList();\n }\n }\n\n if (event.key === 'Tab') {\n if (event.shiftKey) {\n this.$emit('focus-last-emoji');\n } else {\n this.$emit('focus-tabset');\n }\n }\n },\n\n toggleSkinList () {\n this.isOpen = !this.isOpen;\n this.$nextTick(() => {\n if (this.skinsRef[0]) {\n this.skinsRef[0].focus();\n }\n });\n },\n },\n};\n</script>\n"],"names":["DtTooltip","CDN_URL","EMOJI_PICKER_SKIN_TONE_MODIFIERS"],"mappings":"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"}
@@ -167,10 +167,7 @@ var _sfc_staticRenderFns = [];
167
167
  var __component__ = /* @__PURE__ */ normalizeComponent(
168
168
  _sfc_main,
169
169
  _sfc_render,
170
- _sfc_staticRenderFns,
171
- false,
172
- null,
173
- null
170
+ _sfc_staticRenderFns
174
171
  );
175
172
  const EmojiSkinSelector = __component__.exports;
176
173
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"emoji_skin_selector.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_skin_selector.vue"],"sourcesContent":["<template>\n <div data-qa=\"skin-selector\">\n <div\n v-show=\"isOpen\"\n class=\"d-emoji-picker__skin-list\"\n >\n <button\n v-for=\"(skin, index) in skinList\"\n :key=\"skin.name\"\n :ref=\"`skinRef-${index}`\"\n :class=\"{\n 'selected': skinSelected?.skinCode === skin.skinCode,\n }\"\n @click=\"selectSkin(skin)\"\n @keydown=\"event => handleKeyDown(event, skin, index)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skin.name\"\n :aria-label=\"skin.name\"\n :title=\"skin.name\"\n :src=\"`${cdnUrl + skin.unicode_output}.png`\"\n >\n </button>\n </div>\n <div\n v-show=\"!isOpen\"\n class=\"d-emoji-picker__skin-selected\"\n >\n <dt-tooltip placement=\"top-end\">\n {{ skinSelectorButtonTooltipLabel }}\n <template #anchor>\n <button\n ref=\"skinSelectorRef\"\n :aria-label=\"skinSelectorButtonTooltipLabel\"\n tabindex=\"-1\"\n @click=\"toggleSkinList\"\n @keydown=\"event => handleKeyDown(event)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skinSelected?.name\"\n :aria-label=\"skinSelected?.name\"\n :title=\"skinSelected?.name\"\n :src=\"`${cdnUrl + skinSelected?.unicode_output}.png`\"\n >\n </button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n</template>\n\n<script>\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport { CDN_URL, EMOJI_PICKER_SKIN_TONE_MODIFIERS } from '@/components/emoji_picker/emoji_picker_constants';\n\nexport default {\n name: 'EmojiSkinSelector',\n\n components: {\n DtTooltip,\n },\n\n props: {\n skinTone: {\n type: String,\n required: true,\n },\n\n isHovering: {\n type: Boolean,\n default: false,\n },\n\n skinSelectorButtonTooltipLabel: {\n type: String,\n required: true,\n },\n },\n\n data () {\n return {\n isOpen: false,\n skinSelected: null,\n skinsRef: [],\n cdnUrl: CDN_URL,\n };\n },\n\n computed: {\n skinPassedIn () {\n return this.skinList.find(skin => skin.skinTone === this.skinTone);\n },\n\n skinList () {\n return [\n {\n name: ':wave_tone1:',\n unicode_output: '1f44b-1f3fb',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.LIGHT,\n skinCode: '_tone1',\n },\n {\n name: ':wave_tone2:',\n unicode_output: '1f44b-1f3fc',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_LIGHT,\n skinCode: '_tone2',\n },\n {\n name: ':wave_tone3:',\n unicode_output: '1f44b-1f3fd',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM,\n skinCode: '_tone3',\n },\n {\n name: ':wave_tone4:',\n unicode_output: '1f44b-1f3fe',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_DARK,\n skinCode: '_tone4',\n },\n {\n name: ':wave_tone5:',\n unicode_output: '1f44b-1f3ff',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DARK,\n skinCode: '_tone5',\n },\n {\n name: ':wave:',\n unicode_output: '1f44b',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DEFAULT,\n skinCode: '',\n },\n ];\n },\n },\n\n watch: {\n isHovering (newVal) {\n if (newVal) {\n this.isOpen = false;\n }\n },\n\n skinTone (newVal, oldVal) {\n if (newVal !== oldVal) {\n this.skinSelected = this.skinPassedIn;\n }\n },\n },\n\n mounted () {\n this.skinSelected = this.skinPassedIn;\n this.$nextTick(() => {\n this.setupSkinRefs();\n });\n },\n\n methods: {\n setupSkinRefs () {\n this.skinList.forEach((skin, index) => {\n const refKey = `skinRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.skinsRef, index, this.$refs[refKey][0]);\n }\n });\n },\n\n focusSkinSelector () {\n if (this.$refs.skinSelectorRef) {\n this.$refs.skinSelectorRef.focus();\n }\n },\n\n selectSkin (skin) {\n this.skinSelected = skin;\n this.isOpen = false;\n this.$emit('skin-tone', skin.skinTone);\n this.$nextTick(() => {\n this.focusSkinSelector();\n });\n },\n\n handleKeyDown (event, skin, index) {\n event.preventDefault();\n\n if (event.key === 'ArrowLeft') {\n if (index === 0) this.skinsRef[this.skinsRef.length - 1]?.focus();\n this.skinsRef[index - 1]?.focus();\n }\n\n if (event.key === 'ArrowRight') {\n if (this.skinsRef.length) this.skinsRef[0]?.focus();\n this.skinsRef[index + 1]?.focus();\n }\n\n if (event.key === 'Enter') {\n if (skin) { this.selectSkin(skin); } else {\n this.toggleSkinList();\n }\n }\n\n if (event.key === 'Tab') {\n if (event.shiftKey) {\n this.$emit('focus-last-emoji');\n } else {\n this.$emit('focus-tabset');\n }\n }\n },\n\n toggleSkinList () {\n this.isOpen = !this.isOpen;\n this.$nextTick(() => {\n if (this.skinsRef[0]) {\n this.skinsRef[0].focus();\n }\n });\n },\n },\n};\n</script>\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"emoji_skin_selector.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_skin_selector.vue"],"sourcesContent":["<template>\n <div data-qa=\"skin-selector\">\n <div\n v-show=\"isOpen\"\n class=\"d-emoji-picker__skin-list\"\n >\n <button\n v-for=\"(skin, index) in skinList\"\n :key=\"skin.name\"\n :ref=\"`skinRef-${index}`\"\n :class=\"{\n 'selected': skinSelected?.skinCode === skin.skinCode,\n }\"\n @click=\"selectSkin(skin)\"\n @keydown=\"event => handleKeyDown(event, skin, index)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skin.name\"\n :aria-label=\"skin.name\"\n :title=\"skin.name\"\n :src=\"`${cdnUrl + skin.unicode_output}.png`\"\n >\n </button>\n </div>\n <div\n v-show=\"!isOpen\"\n class=\"d-emoji-picker__skin-selected\"\n >\n <dt-tooltip placement=\"top-end\">\n {{ skinSelectorButtonTooltipLabel }}\n <template #anchor>\n <button\n ref=\"skinSelectorRef\"\n :aria-label=\"skinSelectorButtonTooltipLabel\"\n tabindex=\"-1\"\n @click=\"toggleSkinList\"\n @keydown=\"event => handleKeyDown(event)\"\n >\n <img\n class=\"d-icon d-icon--size-500\"\n :alt=\"skinSelected?.name\"\n :aria-label=\"skinSelected?.name\"\n :title=\"skinSelected?.name\"\n :src=\"`${cdnUrl + skinSelected?.unicode_output}.png`\"\n >\n </button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n</template>\n\n<script>\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport { CDN_URL, EMOJI_PICKER_SKIN_TONE_MODIFIERS } from '@/components/emoji_picker/emoji_picker_constants';\n\nexport default {\n name: 'EmojiSkinSelector',\n\n components: {\n DtTooltip,\n },\n\n props: {\n skinTone: {\n type: String,\n required: true,\n },\n\n isHovering: {\n type: Boolean,\n default: false,\n },\n\n skinSelectorButtonTooltipLabel: {\n type: String,\n required: true,\n },\n },\n\n data () {\n return {\n isOpen: false,\n skinSelected: null,\n skinsRef: [],\n cdnUrl: CDN_URL,\n };\n },\n\n computed: {\n skinPassedIn () {\n return this.skinList.find(skin => skin.skinTone === this.skinTone);\n },\n\n skinList () {\n return [\n {\n name: ':wave_tone1:',\n unicode_output: '1f44b-1f3fb',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.LIGHT,\n skinCode: '_tone1',\n },\n {\n name: ':wave_tone2:',\n unicode_output: '1f44b-1f3fc',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_LIGHT,\n skinCode: '_tone2',\n },\n {\n name: ':wave_tone3:',\n unicode_output: '1f44b-1f3fd',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM,\n skinCode: '_tone3',\n },\n {\n name: ':wave_tone4:',\n unicode_output: '1f44b-1f3fe',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.MEDIUM_DARK,\n skinCode: '_tone4',\n },\n {\n name: ':wave_tone5:',\n unicode_output: '1f44b-1f3ff',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DARK,\n skinCode: '_tone5',\n },\n {\n name: ':wave:',\n unicode_output: '1f44b',\n skinTone: EMOJI_PICKER_SKIN_TONE_MODIFIERS.DEFAULT,\n skinCode: '',\n },\n ];\n },\n },\n\n watch: {\n isHovering (newVal) {\n if (newVal) {\n this.isOpen = false;\n }\n },\n\n skinTone (newVal, oldVal) {\n if (newVal !== oldVal) {\n this.skinSelected = this.skinPassedIn;\n }\n },\n },\n\n mounted () {\n this.skinSelected = this.skinPassedIn;\n this.$nextTick(() => {\n this.setupSkinRefs();\n });\n },\n\n methods: {\n setupSkinRefs () {\n this.skinList.forEach((skin, index) => {\n const refKey = `skinRef-${index}`;\n if (this.$refs[refKey]) {\n this.$set(this.skinsRef, index, this.$refs[refKey][0]);\n }\n });\n },\n\n focusSkinSelector () {\n if (this.$refs.skinSelectorRef) {\n this.$refs.skinSelectorRef.focus();\n }\n },\n\n selectSkin (skin) {\n this.skinSelected = skin;\n this.isOpen = false;\n this.$emit('skin-tone', skin.skinTone);\n this.$nextTick(() => {\n this.focusSkinSelector();\n });\n },\n\n handleKeyDown (event, skin, index) {\n event.preventDefault();\n\n if (event.key === 'ArrowLeft') {\n if (index === 0) this.skinsRef[this.skinsRef.length - 1]?.focus();\n this.skinsRef[index - 1]?.focus();\n }\n\n if (event.key === 'ArrowRight') {\n if (this.skinsRef.length) this.skinsRef[0]?.focus();\n this.skinsRef[index + 1]?.focus();\n }\n\n if (event.key === 'Enter') {\n if (skin) { this.selectSkin(skin); } else {\n this.toggleSkinList();\n }\n }\n\n if (event.key === 'Tab') {\n if (event.shiftKey) {\n this.$emit('focus-last-emoji');\n } else {\n this.$emit('focus-tabset');\n }\n }\n },\n\n toggleSkinList () {\n this.isOpen = !this.isOpen;\n this.$nextTick(() => {\n if (this.skinsRef[0]) {\n this.skinsRef[0].focus();\n }\n });\n },\n },\n};\n</script>\n"],"names":[],"mappings":"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"}
@@ -146,10 +146,7 @@ var _sfc_staticRenderFns = [];
146
146
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
147
147
  _sfc_main,
148
148
  _sfc_render,
149
- _sfc_staticRenderFns,
150
- false,
151
- null,
152
- null
149
+ _sfc_staticRenderFns
153
150
  );
154
151
  const EmojiTabset = __component__.exports;
155
152
  exports.default = EmojiTabset;
@@ -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 <component\n :is=\"tab.icon\"\n size=\"400\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport { DtTab, DtTabGroup } from '@/components/tab';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker/emoji_picker_constants';\nimport {\n DtIconClock,\n DtIconSatisfied,\n DtIconLivingThing,\n DtIconFood,\n DtIconObject,\n DtIconTransportation,\n DtIconLightbulb,\n DtIconHeart,\n DtIconFlag,\n} from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n },\n\n props: {\n /**\n * Whether to show the recently used tab or not\n * @type {Boolean}\n * @default false\n */\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 /**\n * The labels for the aria-label\n * @type {Array}\n * @required\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: DtIconClock },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: DtIconSatisfied },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: DtIconLivingThing },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: DtIconFood },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: DtIconObject },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: DtIconTransportation },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: DtIconLightbulb },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: DtIconHeart },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: DtIconFlag },\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","EMOJI_PICKER_CATEGORIES","DtIconClock","DtIconSatisfied","DtIconLivingThing","DtIconFood","DtIconObject","DtIconTransportation","DtIconLightbulb","DtIconHeart","DtIconFlag","tab"],"mappings":"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"}
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 <component\n :is=\"tab.icon\"\n size=\"400\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport { DtTab, DtTabGroup } from '@/components/tab';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker/emoji_picker_constants';\nimport {\n DtIconClock,\n DtIconSatisfied,\n DtIconLivingThing,\n DtIconFood,\n DtIconObject,\n DtIconTransportation,\n DtIconLightbulb,\n DtIconHeart,\n DtIconFlag,\n} from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n },\n\n props: {\n /**\n * Whether to show the recently used tab or not\n * @type {Boolean}\n * @default false\n */\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 /**\n * The labels for the aria-label\n * @type {Array}\n * @required\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: DtIconClock },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: DtIconSatisfied },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: DtIconLivingThing },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: DtIconFood },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: DtIconObject },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: DtIconTransportation },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: DtIconLightbulb },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: DtIconHeart },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: DtIconFlag },\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","EMOJI_PICKER_CATEGORIES","DtIconClock","DtIconSatisfied","DtIconLivingThing","DtIconFood","DtIconObject","DtIconTransportation","DtIconLightbulb","DtIconHeart","DtIconFlag","tab"],"mappings":"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"}
@@ -144,10 +144,7 @@ var _sfc_staticRenderFns = [];
144
144
  var __component__ = /* @__PURE__ */ normalizeComponent(
145
145
  _sfc_main,
146
146
  _sfc_render,
147
- _sfc_staticRenderFns,
148
- false,
149
- null,
150
- null
147
+ _sfc_staticRenderFns
151
148
  );
152
149
  const EmojiTabset = __component__.exports;
153
150
  export {
@@ -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 <component\n :is=\"tab.icon\"\n size=\"400\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport { DtTab, DtTabGroup } from '@/components/tab';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker/emoji_picker_constants';\nimport {\n DtIconClock,\n DtIconSatisfied,\n DtIconLivingThing,\n DtIconFood,\n DtIconObject,\n DtIconTransportation,\n DtIconLightbulb,\n DtIconHeart,\n DtIconFlag,\n} from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n },\n\n props: {\n /**\n * Whether to show the recently used tab or not\n * @type {Boolean}\n * @default false\n */\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 /**\n * The labels for the aria-label\n * @type {Array}\n * @required\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: DtIconClock },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: DtIconSatisfied },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: DtIconLivingThing },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: DtIconFood },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: DtIconObject },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: DtIconTransportation },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: DtIconLightbulb },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: DtIconHeart },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: DtIconFlag },\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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"}
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 <component\n :is=\"tab.icon\"\n size=\"400\"\n />\n </dt-tab>\n </template>\n </dt-tab-group>\n </div>\n</template>\n\n<script>\nimport { DtTab, DtTabGroup } from '@/components/tab';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker/emoji_picker_constants';\nimport {\n DtIconClock,\n DtIconSatisfied,\n DtIconLivingThing,\n DtIconFood,\n DtIconObject,\n DtIconTransportation,\n DtIconLightbulb,\n DtIconHeart,\n DtIconFlag,\n} from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'EmojiTabset',\n\n components: {\n DtTabGroup,\n DtTab,\n },\n\n props: {\n /**\n * Whether to show the recently used tab or not\n * @type {Boolean}\n * @default false\n */\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 /**\n * The labels for the aria-label\n * @type {Array}\n * @required\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: DtIconClock },\n { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: DtIconSatisfied },\n { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: DtIconLivingThing },\n { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: DtIconFood },\n { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: DtIconObject },\n { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: DtIconTransportation },\n { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: DtIconLightbulb },\n { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: DtIconHeart },\n { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: DtIconFlag },\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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"}
@@ -99,10 +99,7 @@ const _sfc_staticRenderFns = null;
99
99
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
100
100
  _sfc_main,
101
101
  _sfc_render,
102
- _sfc_staticRenderFns,
103
- false,
104
- null,
105
- null
102
+ _sfc_staticRenderFns
106
103
  );
107
104
  const DtEmojiTextWrapper = __component__.exports;
108
105
  exports.default = DtEmojiTextWrapper;
@@ -1 +1 @@
1
- {"version":3,"file":"emoji_text_wrapper.vue.cjs","sources":["../../../components/emoji_text_wrapper/emoji_text_wrapper.vue"],"sourcesContent":["<script>\nimport { DtEmoji } from '../emoji';\nimport { findEmojis, findShortCodes } from '@/common/emoji';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants';\n\n/**\n * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.\n * @see https://dialtone.dialpad.com/components/emoji_text_wrapper.html\n */\nexport default {\n name: 'DtEmojiTextWrapper',\n\n components: {\n DtEmoji,\n },\n\n props: {\n /**\n * Element type (tag name) to use for the wrapper.\n */\n elementType: {\n type: String,\n default: 'div',\n },\n\n /**\n * The icon size to render the emojis at: 100 to 800\n */\n size: {\n type: String,\n default: '500',\n validator: (t) => Object.keys(ICON_SIZE_MODIFIERS).includes(t),\n },\n },\n\n data () {\n return {\n loadingEmojiJson: true,\n };\n },\n\n async created () {\n this.loadingEmojiJson = false;\n },\n\n methods: {\n /**\n * Replaces the valid codes from the text content with a DtEmoji component.\n * @returns {Array<VNode|string>}\n */\n replaceDtEmojis (replaceList, textContent) {\n if (!replaceList.length) return textContent;\n // Escape the asterisk to avoid breaking the regex for the asterisk emoji\n const escapedReplaceList = replaceList.map(item =>\n item.replace(/\\*/g, '\\\\*'),\n );\n\n const regexp = new RegExp(`(${escapedReplaceList.join('|')})`, 'g');\n const items = textContent.split(regexp);\n\n return items\n .filter(item => item.trim() !== '')\n .map((item) => {\n if (replaceList.includes(item)) {\n return this.$createElement(DtEmoji, {\n props: { code: item, size: this.size },\n });\n }\n return this.$createElement('span', { class: 'd-emoji-text-wrapper__text' }, item);\n });\n },\n\n /**\n * Recursively search the Vue virtual DOM to find text\n * @param VNode\n * @returns {VNode|*}\n */\n searchVNodes (VNode) {\n // If VNode has no tag, it is a text node\n if (!VNode.tag && VNode.text) {\n return this.searchCodes(VNode.text);\n }\n\n const children = VNode.children ? VNode.children.map(VNodeChild => this.searchVNodes(VNodeChild)) : [];\n return this.$createElement(VNode.tag, VNode.data, children);\n },\n\n // TODO: Find a way to crawl vue components\n replaceVueComponentVNodeContent (VNode) {\n //\n },\n\n /**\n * Find codes in text.\n * @param textContent string\n * @returns {Array<VNode|string>|string}\n */\n searchCodes (textContent) {\n const shortcodes = findShortCodes(textContent);\n const emojis = findEmojis(textContent);\n\n const replaceList = [...shortcodes, ...emojis];\n return this.replaceDtEmojis(replaceList, textContent);\n },\n },\n\n render (h) {\n const defaultSlotContent = this.$slots.default || [];\n return h(\n this.elementType,\n {\n 'data-qa': 'emoji-text-wrapper',\n class: 'd-emoji-text-wrapper',\n },\n this.loadingEmojiJson\n ? defaultSlotContent\n : defaultSlotContent.map(VNode => this.searchVNodes(VNode)),\n );\n },\n};\n</script>\n"],"names":["DtEmoji","ICON_SIZE_MODIFIERS","findShortCodes","findEmojis"],"mappings":";;;;;;AASA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,SAAAA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAC,kCAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,kBAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,MAAA,UAAA;AACA,SAAA,mBAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA,aAAA,aAAA;AACA,UAAA,CAAA,YAAA,OAAA,QAAA;AAEA,YAAA,qBAAA,YAAA;AAAA,QAAA,UACA,KAAA,QAAA,OAAA,KAAA;AAAA,MACA;AAEA,YAAA,SAAA,IAAA,OAAA,IAAA,mBAAA,KAAA,GAAA,CAAA,KAAA,GAAA;AACA,YAAA,QAAA,YAAA,MAAA,MAAA;AAEA,aAAA,MACA,OAAA,UAAA,KAAA,KAAA,MAAA,EAAA,EACA,IAAA,CAAA,SAAA;AACA,YAAA,YAAA,SAAA,IAAA,GAAA;AACA,iBAAA,KAAA,eAAAD,eAAA;AAAA,YACA,OAAA,EAAA,MAAA,MAAA,MAAA,KAAA,KAAA;AAAA,UACA,CAAA;AAAA,QACA;AACA,eAAA,KAAA,eAAA,QAAA,EAAA,OAAA,6BAAA,GAAA,IAAA;AAAA,MACA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,aAAA,OAAA;AAEA,UAAA,CAAA,MAAA,OAAA,MAAA,MAAA;AACA,eAAA,KAAA,YAAA,MAAA,IAAA;AAAA,MACA;AAEA,YAAA,WAAA,MAAA,WAAA,MAAA,SAAA,IAAA,gBAAA,KAAA,aAAA,UAAA,CAAA,IAAA,CAAA;AACA,aAAA,KAAA,eAAA,MAAA,KAAA,MAAA,MAAA,QAAA;AAAA,IACA;AAAA;AAAA,IAGA,gCAAA,OAAA;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,YAAA,aAAA;AACA,YAAA,aAAAE,4BAAA,WAAA;AACA,YAAA,SAAAC,wBAAA,WAAA;AAEA,YAAA,cAAA,CAAA,GAAA,YAAA,GAAA,MAAA;AACA,aAAA,KAAA,gBAAA,aAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA,GAAA;AACA,UAAA,qBAAA,KAAA,OAAA,WAAA,CAAA;AACA,WAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,QACA,WAAA;AAAA,QACA,OAAA;AAAA,MACA;AAAA,MACA,KAAA,mBACA,qBACA,mBAAA,IAAA,WAAA,KAAA,aAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"emoji_text_wrapper.vue.cjs","sources":["../../../components/emoji_text_wrapper/emoji_text_wrapper.vue"],"sourcesContent":["<script>\nimport { DtEmoji } from '../emoji';\nimport { findEmojis, findShortCodes } from '@/common/emoji';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants';\n\n/**\n * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.\n * @see https://dialtone.dialpad.com/components/emoji_text_wrapper.html\n */\nexport default {\n name: 'DtEmojiTextWrapper',\n\n components: {\n DtEmoji,\n },\n\n props: {\n /**\n * Element type (tag name) to use for the wrapper.\n */\n elementType: {\n type: String,\n default: 'div',\n },\n\n /**\n * The icon size to render the emojis at: 100 to 800\n */\n size: {\n type: String,\n default: '500',\n validator: (t) => Object.keys(ICON_SIZE_MODIFIERS).includes(t),\n },\n },\n\n data () {\n return {\n loadingEmojiJson: true,\n };\n },\n\n async created () {\n this.loadingEmojiJson = false;\n },\n\n methods: {\n /**\n * Replaces the valid codes from the text content with a DtEmoji component.\n * @returns {Array<VNode|string>}\n */\n replaceDtEmojis (replaceList, textContent) {\n if (!replaceList.length) return textContent;\n // Escape the asterisk to avoid breaking the regex for the asterisk emoji\n const escapedReplaceList = replaceList.map(item =>\n item.replace(/\\*/g, '\\\\*'),\n );\n\n const regexp = new RegExp(`(${escapedReplaceList.join('|')})`, 'g');\n const items = textContent.split(regexp);\n\n return items\n .filter(item => item.trim() !== '')\n .map((item) => {\n if (replaceList.includes(item)) {\n return this.$createElement(DtEmoji, {\n props: { code: item, size: this.size },\n });\n }\n return this.$createElement('span', { class: 'd-emoji-text-wrapper__text' }, item);\n });\n },\n\n /**\n * Recursively search the Vue virtual DOM to find text\n * @param VNode\n * @returns {VNode|*}\n */\n searchVNodes (VNode) {\n // If VNode has no tag, it is a text node\n if (!VNode.tag && VNode.text) {\n return this.searchCodes(VNode.text);\n }\n\n const children = VNode.children ? VNode.children.map(VNodeChild => this.searchVNodes(VNodeChild)) : [];\n return this.$createElement(VNode.tag, VNode.data, children);\n },\n\n // TODO: Find a way to crawl vue components\n replaceVueComponentVNodeContent (VNode) {\n //\n },\n\n /**\n * Find codes in text.\n * @param textContent string\n * @returns {Array<VNode|string>|string}\n */\n searchCodes (textContent) {\n const shortcodes = findShortCodes(textContent);\n const emojis = findEmojis(textContent);\n\n const replaceList = [...shortcodes, ...emojis];\n return this.replaceDtEmojis(replaceList, textContent);\n },\n },\n\n render (h) {\n const defaultSlotContent = this.$slots.default || [];\n return h(\n this.elementType,\n {\n 'data-qa': 'emoji-text-wrapper',\n class: 'd-emoji-text-wrapper',\n },\n this.loadingEmojiJson\n ? defaultSlotContent\n : defaultSlotContent.map(VNode => this.searchVNodes(VNode)),\n );\n },\n};\n</script>\n"],"names":["DtEmoji","ICON_SIZE_MODIFIERS","findShortCodes","findEmojis"],"mappings":";;;;;;AASA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,SAAAA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAC,kCAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,kBAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,MAAA,UAAA;AACA,SAAA,mBAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA,aAAA,aAAA;AACA,UAAA,CAAA,YAAA,OAAA,QAAA;AAEA,YAAA,qBAAA,YAAA;AAAA,QAAA,UACA,KAAA,QAAA,OAAA,KAAA;AAAA,MACA;AAEA,YAAA,SAAA,IAAA,OAAA,IAAA,mBAAA,KAAA,GAAA,CAAA,KAAA,GAAA;AACA,YAAA,QAAA,YAAA,MAAA,MAAA;AAEA,aAAA,MACA,OAAA,UAAA,KAAA,KAAA,MAAA,EAAA,EACA,IAAA,CAAA,SAAA;AACA,YAAA,YAAA,SAAA,IAAA,GAAA;AACA,iBAAA,KAAA,eAAAD,eAAA;AAAA,YACA,OAAA,EAAA,MAAA,MAAA,MAAA,KAAA,KAAA;AAAA,UACA,CAAA;AAAA,QACA;AACA,eAAA,KAAA,eAAA,QAAA,EAAA,OAAA,6BAAA,GAAA,IAAA;AAAA,MACA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,aAAA,OAAA;AAEA,UAAA,CAAA,MAAA,OAAA,MAAA,MAAA;AACA,eAAA,KAAA,YAAA,MAAA,IAAA;AAAA,MACA;AAEA,YAAA,WAAA,MAAA,WAAA,MAAA,SAAA,IAAA,gBAAA,KAAA,aAAA,UAAA,CAAA,IAAA,CAAA;AACA,aAAA,KAAA,eAAA,MAAA,KAAA,MAAA,MAAA,QAAA;AAAA,IACA;AAAA;AAAA,IAGA,gCAAA,OAAA;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,YAAA,aAAA;AACA,YAAA,aAAAE,4BAAA,WAAA;AACA,YAAA,SAAAC,wBAAA,WAAA;AAEA,YAAA,cAAA,CAAA,GAAA,YAAA,GAAA,MAAA;AACA,aAAA,KAAA,gBAAA,aAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA,GAAA;AACA,UAAA,qBAAA,KAAA,OAAA,WAAA,CAAA;AACA,WAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,QACA,WAAA;AAAA,QACA,OAAA;AAAA,MACA;AAAA,MACA,KAAA,mBACA,qBACA,mBAAA,IAAA,WAAA,KAAA,aAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;"}
@@ -97,10 +97,7 @@ const _sfc_staticRenderFns = null;
97
97
  var __component__ = /* @__PURE__ */ normalizeComponent(
98
98
  _sfc_main,
99
99
  _sfc_render,
100
- _sfc_staticRenderFns,
101
- false,
102
- null,
103
- null
100
+ _sfc_staticRenderFns
104
101
  );
105
102
  const DtEmojiTextWrapper = __component__.exports;
106
103
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"emoji_text_wrapper.vue.js","sources":["../../../components/emoji_text_wrapper/emoji_text_wrapper.vue"],"sourcesContent":["<script>\nimport { DtEmoji } from '../emoji';\nimport { findEmojis, findShortCodes } from '@/common/emoji';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants';\n\n/**\n * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.\n * @see https://dialtone.dialpad.com/components/emoji_text_wrapper.html\n */\nexport default {\n name: 'DtEmojiTextWrapper',\n\n components: {\n DtEmoji,\n },\n\n props: {\n /**\n * Element type (tag name) to use for the wrapper.\n */\n elementType: {\n type: String,\n default: 'div',\n },\n\n /**\n * The icon size to render the emojis at: 100 to 800\n */\n size: {\n type: String,\n default: '500',\n validator: (t) => Object.keys(ICON_SIZE_MODIFIERS).includes(t),\n },\n },\n\n data () {\n return {\n loadingEmojiJson: true,\n };\n },\n\n async created () {\n this.loadingEmojiJson = false;\n },\n\n methods: {\n /**\n * Replaces the valid codes from the text content with a DtEmoji component.\n * @returns {Array<VNode|string>}\n */\n replaceDtEmojis (replaceList, textContent) {\n if (!replaceList.length) return textContent;\n // Escape the asterisk to avoid breaking the regex for the asterisk emoji\n const escapedReplaceList = replaceList.map(item =>\n item.replace(/\\*/g, '\\\\*'),\n );\n\n const regexp = new RegExp(`(${escapedReplaceList.join('|')})`, 'g');\n const items = textContent.split(regexp);\n\n return items\n .filter(item => item.trim() !== '')\n .map((item) => {\n if (replaceList.includes(item)) {\n return this.$createElement(DtEmoji, {\n props: { code: item, size: this.size },\n });\n }\n return this.$createElement('span', { class: 'd-emoji-text-wrapper__text' }, item);\n });\n },\n\n /**\n * Recursively search the Vue virtual DOM to find text\n * @param VNode\n * @returns {VNode|*}\n */\n searchVNodes (VNode) {\n // If VNode has no tag, it is a text node\n if (!VNode.tag && VNode.text) {\n return this.searchCodes(VNode.text);\n }\n\n const children = VNode.children ? VNode.children.map(VNodeChild => this.searchVNodes(VNodeChild)) : [];\n return this.$createElement(VNode.tag, VNode.data, children);\n },\n\n // TODO: Find a way to crawl vue components\n replaceVueComponentVNodeContent (VNode) {\n //\n },\n\n /**\n * Find codes in text.\n * @param textContent string\n * @returns {Array<VNode|string>|string}\n */\n searchCodes (textContent) {\n const shortcodes = findShortCodes(textContent);\n const emojis = findEmojis(textContent);\n\n const replaceList = [...shortcodes, ...emojis];\n return this.replaceDtEmojis(replaceList, textContent);\n },\n },\n\n render (h) {\n const defaultSlotContent = this.$slots.default || [];\n return h(\n this.elementType,\n {\n 'data-qa': 'emoji-text-wrapper',\n class: 'd-emoji-text-wrapper',\n },\n this.loadingEmojiJson\n ? defaultSlotContent\n : defaultSlotContent.map(VNode => this.searchVNodes(VNode)),\n );\n },\n};\n</script>\n"],"names":[],"mappings":";;;;AASA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,mBAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,kBAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,MAAA,UAAA;AACA,SAAA,mBAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA,aAAA,aAAA;AACA,UAAA,CAAA,YAAA,OAAA,QAAA;AAEA,YAAA,qBAAA,YAAA;AAAA,QAAA,UACA,KAAA,QAAA,OAAA,KAAA;AAAA,MACA;AAEA,YAAA,SAAA,IAAA,OAAA,IAAA,mBAAA,KAAA,GAAA,CAAA,KAAA,GAAA;AACA,YAAA,QAAA,YAAA,MAAA,MAAA;AAEA,aAAA,MACA,OAAA,UAAA,KAAA,KAAA,MAAA,EAAA,EACA,IAAA,CAAA,SAAA;AACA,YAAA,YAAA,SAAA,IAAA,GAAA;AACA,iBAAA,KAAA,eAAA,SAAA;AAAA,YACA,OAAA,EAAA,MAAA,MAAA,MAAA,KAAA,KAAA;AAAA,UACA,CAAA;AAAA,QACA;AACA,eAAA,KAAA,eAAA,QAAA,EAAA,OAAA,6BAAA,GAAA,IAAA;AAAA,MACA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,aAAA,OAAA;AAEA,UAAA,CAAA,MAAA,OAAA,MAAA,MAAA;AACA,eAAA,KAAA,YAAA,MAAA,IAAA;AAAA,MACA;AAEA,YAAA,WAAA,MAAA,WAAA,MAAA,SAAA,IAAA,gBAAA,KAAA,aAAA,UAAA,CAAA,IAAA,CAAA;AACA,aAAA,KAAA,eAAA,MAAA,KAAA,MAAA,MAAA,QAAA;AAAA,IACA;AAAA;AAAA,IAGA,gCAAA,OAAA;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,YAAA,aAAA;AACA,YAAA,aAAA,eAAA,WAAA;AACA,YAAA,SAAA,WAAA,WAAA;AAEA,YAAA,cAAA,CAAA,GAAA,YAAA,GAAA,MAAA;AACA,aAAA,KAAA,gBAAA,aAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA,GAAA;AACA,UAAA,qBAAA,KAAA,OAAA,WAAA,CAAA;AACA,WAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,QACA,WAAA;AAAA,QACA,OAAA;AAAA,MACA;AAAA,MACA,KAAA,mBACA,qBACA,mBAAA,IAAA,WAAA,KAAA,aAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;"}
1
+ {"version":3,"file":"emoji_text_wrapper.vue.js","sources":["../../../components/emoji_text_wrapper/emoji_text_wrapper.vue"],"sourcesContent":["<script>\nimport { DtEmoji } from '../emoji';\nimport { findEmojis, findShortCodes } from '@/common/emoji';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants';\n\n/**\n * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.\n * @see https://dialtone.dialpad.com/components/emoji_text_wrapper.html\n */\nexport default {\n name: 'DtEmojiTextWrapper',\n\n components: {\n DtEmoji,\n },\n\n props: {\n /**\n * Element type (tag name) to use for the wrapper.\n */\n elementType: {\n type: String,\n default: 'div',\n },\n\n /**\n * The icon size to render the emojis at: 100 to 800\n */\n size: {\n type: String,\n default: '500',\n validator: (t) => Object.keys(ICON_SIZE_MODIFIERS).includes(t),\n },\n },\n\n data () {\n return {\n loadingEmojiJson: true,\n };\n },\n\n async created () {\n this.loadingEmojiJson = false;\n },\n\n methods: {\n /**\n * Replaces the valid codes from the text content with a DtEmoji component.\n * @returns {Array<VNode|string>}\n */\n replaceDtEmojis (replaceList, textContent) {\n if (!replaceList.length) return textContent;\n // Escape the asterisk to avoid breaking the regex for the asterisk emoji\n const escapedReplaceList = replaceList.map(item =>\n item.replace(/\\*/g, '\\\\*'),\n );\n\n const regexp = new RegExp(`(${escapedReplaceList.join('|')})`, 'g');\n const items = textContent.split(regexp);\n\n return items\n .filter(item => item.trim() !== '')\n .map((item) => {\n if (replaceList.includes(item)) {\n return this.$createElement(DtEmoji, {\n props: { code: item, size: this.size },\n });\n }\n return this.$createElement('span', { class: 'd-emoji-text-wrapper__text' }, item);\n });\n },\n\n /**\n * Recursively search the Vue virtual DOM to find text\n * @param VNode\n * @returns {VNode|*}\n */\n searchVNodes (VNode) {\n // If VNode has no tag, it is a text node\n if (!VNode.tag && VNode.text) {\n return this.searchCodes(VNode.text);\n }\n\n const children = VNode.children ? VNode.children.map(VNodeChild => this.searchVNodes(VNodeChild)) : [];\n return this.$createElement(VNode.tag, VNode.data, children);\n },\n\n // TODO: Find a way to crawl vue components\n replaceVueComponentVNodeContent (VNode) {\n //\n },\n\n /**\n * Find codes in text.\n * @param textContent string\n * @returns {Array<VNode|string>|string}\n */\n searchCodes (textContent) {\n const shortcodes = findShortCodes(textContent);\n const emojis = findEmojis(textContent);\n\n const replaceList = [...shortcodes, ...emojis];\n return this.replaceDtEmojis(replaceList, textContent);\n },\n },\n\n render (h) {\n const defaultSlotContent = this.$slots.default || [];\n return h(\n this.elementType,\n {\n 'data-qa': 'emoji-text-wrapper',\n class: 'd-emoji-text-wrapper',\n },\n this.loadingEmojiJson\n ? defaultSlotContent\n : defaultSlotContent.map(VNode => this.searchVNodes(VNode)),\n );\n },\n};\n</script>\n"],"names":[],"mappings":";;;;AASA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,mBAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,kBAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,MAAA,UAAA;AACA,SAAA,mBAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA,aAAA,aAAA;AACA,UAAA,CAAA,YAAA,OAAA,QAAA;AAEA,YAAA,qBAAA,YAAA;AAAA,QAAA,UACA,KAAA,QAAA,OAAA,KAAA;AAAA,MACA;AAEA,YAAA,SAAA,IAAA,OAAA,IAAA,mBAAA,KAAA,GAAA,CAAA,KAAA,GAAA;AACA,YAAA,QAAA,YAAA,MAAA,MAAA;AAEA,aAAA,MACA,OAAA,UAAA,KAAA,KAAA,MAAA,EAAA,EACA,IAAA,CAAA,SAAA;AACA,YAAA,YAAA,SAAA,IAAA,GAAA;AACA,iBAAA,KAAA,eAAA,SAAA;AAAA,YACA,OAAA,EAAA,MAAA,MAAA,MAAA,KAAA,KAAA;AAAA,UACA,CAAA;AAAA,QACA;AACA,eAAA,KAAA,eAAA,QAAA,EAAA,OAAA,6BAAA,GAAA,IAAA;AAAA,MACA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,aAAA,OAAA;AAEA,UAAA,CAAA,MAAA,OAAA,MAAA,MAAA;AACA,eAAA,KAAA,YAAA,MAAA,IAAA;AAAA,MACA;AAEA,YAAA,WAAA,MAAA,WAAA,MAAA,SAAA,IAAA,gBAAA,KAAA,aAAA,UAAA,CAAA,IAAA,CAAA;AACA,aAAA,KAAA,eAAA,MAAA,KAAA,MAAA,MAAA,QAAA;AAAA,IACA;AAAA;AAAA,IAGA,gCAAA,OAAA;AAAA,IAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,YAAA,aAAA;AACA,YAAA,aAAA,eAAA,WAAA;AACA,YAAA,SAAA,WAAA,WAAA;AAEA,YAAA,cAAA,CAAA,GAAA,YAAA,GAAA,MAAA;AACA,aAAA,KAAA,gBAAA,aAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA,GAAA;AACA,UAAA,qBAAA,KAAA,OAAA,WAAA,CAAA;AACA,WAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,QACA,WAAA;AAAA,QACA,OAAA;AAAA,MACA;AAAA,MACA,KAAA,mBACA,qBACA,mBAAA,IAAA,WAAA,KAAA,aAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;"}
@@ -89,10 +89,7 @@ var _sfc_staticRenderFns = [];
89
89
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
90
90
  _sfc_main,
91
91
  _sfc_render,
92
- _sfc_staticRenderFns,
93
- false,
94
- null,
95
- null
92
+ _sfc_staticRenderFns
96
93
  );
97
94
  const empty_state = __component__.exports;
98
95
  exports.default = empty_state;
@@ -1 +1 @@
1
- {"version":3,"file":"empty_state.vue.cjs","sources":["../../../components/empty_state/empty_state.vue"],"sourcesContent":["<template>\n <dt-stack\n :class=\"emptyStateClasses\"\n >\n <span\n v-if=\"showIllustration\"\n class=\"d-empty-state__illustration\"\n >\n <!-- @slot Slot for the illustration. Displays when size is 'lg' or 'md'. Overrides icon. -->\n <slot name=\"illustration\" />\n </span>\n\n <span\n v-if=\"showIcon\"\n class=\"d-empty-state__icon\"\n >\n <!-- @slot Slot for the icon. Displayed if illustration is not provided. -->\n <slot\n name=\"icon\"\n :icon-size=\"'800'\"\n />\n </span>\n\n <dt-stack\n gap=\"450\"\n :class=\"['d-empty-state__content', contentClass]\"\n >\n <div :class=\"['d-empty-state__header-text', headlineClass]\">\n {{ headerText }}\n </div>\n\n <p\n v-if=\"bodyText\"\n :class=\"['d-empty-state__body-text', bodyClass]\"\n >\n {{ bodyText }}\n </p>\n </dt-stack>\n\n <slot name=\"body\" />\n </dt-stack>\n</template>\n\n<script>\nimport {\n EMPTY_STATE_BODY_SIZE_MODIFIERS,\n EMPTY_STATE_CONTENT_SIZE_MODIFIERS,\n EMPTY_STATE_HEADLINE_SIZE_MODIFIERS,\n EMPTY_STATE_SIZE_MODIFIERS,\n} from './empty_state_constants.js';\nimport { DtStack } from '@/components/stack';\n\nexport default {\n name: 'DtEmptyState',\n\n components: {\n DtStack,\n },\n\n props: {\n /**\n * The empty state size.\n * @values 'sm', 'md', 'lg'\n */\n size: {\n type: String,\n default: 'lg',\n validator: (s) => Object.keys(EMPTY_STATE_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * Header text\n * @type {String}\n */\n headerText: {\n type: String,\n required: true,\n },\n\n /**\n * Body text\n * @type {String}\n */\n bodyText: {\n type: String,\n default: null,\n },\n },\n\n computed: {\n hasIcon () {\n return this.$scopedSlots.icon && this.$scopedSlots.icon();\n },\n\n hasIllustration () {\n return this.$scopedSlots.illustration && this.$scopedSlots.illustration();\n },\n\n isSmallSize () {\n return this.size === 'sm';\n },\n\n /**\n * Icon will be shown in lg and md size only if illustration is not provided\n * Icon will always be shown in sm size\n */\n showIcon () {\n return this.hasIcon && (!this.hasIllustration || this.isSmallSize);\n },\n\n /**\n * Illustration will always be shown in lg and md size\n * Illustration will not be shown in sm size\n */\n showIllustration () {\n return this.hasIllustration && !this.isSmallSize;\n },\n\n sizeClass () {\n return EMPTY_STATE_SIZE_MODIFIERS[this.size];\n },\n\n emptyStateClasses () {\n return ['d-empty-state', this.sizeClass];\n },\n\n contentClass () {\n return EMPTY_STATE_CONTENT_SIZE_MODIFIERS[this.size];\n },\n\n headlineClass () {\n return EMPTY_STATE_HEADLINE_SIZE_MODIFIERS[this.size];\n },\n\n bodyClass () {\n return EMPTY_STATE_BODY_SIZE_MODIFIERS[this.size];\n },\n },\n\n mounted () {\n if (!this.bodyText && !this.$slots.body) {\n console.error('DtEmptyState: You should provide either bodyText or content on body slot.');\n }\n },\n};\n</script>\n"],"names":["DtStack","EMPTY_STATE_SIZE_MODIFIERS","EMPTY_STATE_CONTENT_SIZE_MODIFIERS","EMPTY_STATE_HEADLINE_SIZE_MODIFIERS","EMPTY_STATE_BODY_SIZE_MODIFIERS"],"mappings":";;;;;AAoDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,SAAAA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAC,gDAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,aAAA,QAAA,KAAA,aAAA;IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,gBAAA,KAAA,aAAA;IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AACA,aAAA,KAAA,YAAA,CAAA,KAAA,mBAAA,KAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,mBAAA;AACA,aAAA,KAAA,mBAAA,CAAA,KAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAAA,sBAAA,2BAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,oBAAA;AACA,aAAA,CAAA,iBAAA,KAAA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAAC,sBAAA,mCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAAC,sBAAA,oCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAAC,sBAAA,gCAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,QAAA,CAAA,KAAA,YAAA,CAAA,KAAA,OAAA,MAAA;AACA,cAAA,MAAA,2EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"empty_state.vue.cjs","sources":["../../../components/empty_state/empty_state.vue"],"sourcesContent":["<template>\n <dt-stack\n :class=\"emptyStateClasses\"\n >\n <span\n v-if=\"showIllustration\"\n class=\"d-empty-state__illustration\"\n >\n <!-- @slot Slot for the illustration. Displays when size is 'lg' or 'md'. Overrides icon. -->\n <slot name=\"illustration\" />\n </span>\n\n <span\n v-if=\"showIcon\"\n class=\"d-empty-state__icon\"\n >\n <!-- @slot Slot for the icon. Displayed if illustration is not provided. -->\n <slot\n name=\"icon\"\n :icon-size=\"'800'\"\n />\n </span>\n\n <dt-stack\n gap=\"450\"\n :class=\"['d-empty-state__content', contentClass]\"\n >\n <div :class=\"['d-empty-state__header-text', headlineClass]\">\n {{ headerText }}\n </div>\n\n <p\n v-if=\"bodyText\"\n :class=\"['d-empty-state__body-text', bodyClass]\"\n >\n {{ bodyText }}\n </p>\n </dt-stack>\n\n <slot name=\"body\" />\n </dt-stack>\n</template>\n\n<script>\nimport {\n EMPTY_STATE_BODY_SIZE_MODIFIERS,\n EMPTY_STATE_CONTENT_SIZE_MODIFIERS,\n EMPTY_STATE_HEADLINE_SIZE_MODIFIERS,\n EMPTY_STATE_SIZE_MODIFIERS,\n} from './empty_state_constants.js';\nimport { DtStack } from '@/components/stack';\n\nexport default {\n name: 'DtEmptyState',\n\n components: {\n DtStack,\n },\n\n props: {\n /**\n * The empty state size.\n * @values 'sm', 'md', 'lg'\n */\n size: {\n type: String,\n default: 'lg',\n validator: (s) => Object.keys(EMPTY_STATE_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * Header text\n * @type {String}\n */\n headerText: {\n type: String,\n required: true,\n },\n\n /**\n * Body text\n * @type {String}\n */\n bodyText: {\n type: String,\n default: null,\n },\n },\n\n computed: {\n hasIcon () {\n return this.$scopedSlots.icon && this.$scopedSlots.icon();\n },\n\n hasIllustration () {\n return this.$scopedSlots.illustration && this.$scopedSlots.illustration();\n },\n\n isSmallSize () {\n return this.size === 'sm';\n },\n\n /**\n * Icon will be shown in lg and md size only if illustration is not provided\n * Icon will always be shown in sm size\n */\n showIcon () {\n return this.hasIcon && (!this.hasIllustration || this.isSmallSize);\n },\n\n /**\n * Illustration will always be shown in lg and md size\n * Illustration will not be shown in sm size\n */\n showIllustration () {\n return this.hasIllustration && !this.isSmallSize;\n },\n\n sizeClass () {\n return EMPTY_STATE_SIZE_MODIFIERS[this.size];\n },\n\n emptyStateClasses () {\n return ['d-empty-state', this.sizeClass];\n },\n\n contentClass () {\n return EMPTY_STATE_CONTENT_SIZE_MODIFIERS[this.size];\n },\n\n headlineClass () {\n return EMPTY_STATE_HEADLINE_SIZE_MODIFIERS[this.size];\n },\n\n bodyClass () {\n return EMPTY_STATE_BODY_SIZE_MODIFIERS[this.size];\n },\n },\n\n mounted () {\n if (!this.bodyText && !this.$slots.body) {\n console.error('DtEmptyState: You should provide either bodyText or content on body slot.');\n }\n },\n};\n</script>\n"],"names":["DtStack","EMPTY_STATE_SIZE_MODIFIERS","EMPTY_STATE_CONTENT_SIZE_MODIFIERS","EMPTY_STATE_HEADLINE_SIZE_MODIFIERS","EMPTY_STATE_BODY_SIZE_MODIFIERS"],"mappings":";;;;;AAoDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,SAAAA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAC,gDAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,aAAA,QAAA,KAAA,aAAA;IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,gBAAA,KAAA,aAAA;IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AACA,aAAA,KAAA,YAAA,CAAA,KAAA,mBAAA,KAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,mBAAA;AACA,aAAA,KAAA,mBAAA,CAAA,KAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAAA,sBAAA,2BAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,oBAAA;AACA,aAAA,CAAA,iBAAA,KAAA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAAC,sBAAA,mCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAAC,sBAAA,oCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAAC,sBAAA,gCAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,QAAA,CAAA,KAAA,YAAA,CAAA,KAAA,OAAA,MAAA;AACA,cAAA,MAAA,2EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;"}
@@ -87,10 +87,7 @@ var _sfc_staticRenderFns = [];
87
87
  var __component__ = /* @__PURE__ */ normalizeComponent(
88
88
  _sfc_main,
89
89
  _sfc_render,
90
- _sfc_staticRenderFns,
91
- false,
92
- null,
93
- null
90
+ _sfc_staticRenderFns
94
91
  );
95
92
  const empty_state = __component__.exports;
96
93
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"empty_state.vue.js","sources":["../../../components/empty_state/empty_state.vue"],"sourcesContent":["<template>\n <dt-stack\n :class=\"emptyStateClasses\"\n >\n <span\n v-if=\"showIllustration\"\n class=\"d-empty-state__illustration\"\n >\n <!-- @slot Slot for the illustration. Displays when size is 'lg' or 'md'. Overrides icon. -->\n <slot name=\"illustration\" />\n </span>\n\n <span\n v-if=\"showIcon\"\n class=\"d-empty-state__icon\"\n >\n <!-- @slot Slot for the icon. Displayed if illustration is not provided. -->\n <slot\n name=\"icon\"\n :icon-size=\"'800'\"\n />\n </span>\n\n <dt-stack\n gap=\"450\"\n :class=\"['d-empty-state__content', contentClass]\"\n >\n <div :class=\"['d-empty-state__header-text', headlineClass]\">\n {{ headerText }}\n </div>\n\n <p\n v-if=\"bodyText\"\n :class=\"['d-empty-state__body-text', bodyClass]\"\n >\n {{ bodyText }}\n </p>\n </dt-stack>\n\n <slot name=\"body\" />\n </dt-stack>\n</template>\n\n<script>\nimport {\n EMPTY_STATE_BODY_SIZE_MODIFIERS,\n EMPTY_STATE_CONTENT_SIZE_MODIFIERS,\n EMPTY_STATE_HEADLINE_SIZE_MODIFIERS,\n EMPTY_STATE_SIZE_MODIFIERS,\n} from './empty_state_constants.js';\nimport { DtStack } from '@/components/stack';\n\nexport default {\n name: 'DtEmptyState',\n\n components: {\n DtStack,\n },\n\n props: {\n /**\n * The empty state size.\n * @values 'sm', 'md', 'lg'\n */\n size: {\n type: String,\n default: 'lg',\n validator: (s) => Object.keys(EMPTY_STATE_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * Header text\n * @type {String}\n */\n headerText: {\n type: String,\n required: true,\n },\n\n /**\n * Body text\n * @type {String}\n */\n bodyText: {\n type: String,\n default: null,\n },\n },\n\n computed: {\n hasIcon () {\n return this.$scopedSlots.icon && this.$scopedSlots.icon();\n },\n\n hasIllustration () {\n return this.$scopedSlots.illustration && this.$scopedSlots.illustration();\n },\n\n isSmallSize () {\n return this.size === 'sm';\n },\n\n /**\n * Icon will be shown in lg and md size only if illustration is not provided\n * Icon will always be shown in sm size\n */\n showIcon () {\n return this.hasIcon && (!this.hasIllustration || this.isSmallSize);\n },\n\n /**\n * Illustration will always be shown in lg and md size\n * Illustration will not be shown in sm size\n */\n showIllustration () {\n return this.hasIllustration && !this.isSmallSize;\n },\n\n sizeClass () {\n return EMPTY_STATE_SIZE_MODIFIERS[this.size];\n },\n\n emptyStateClasses () {\n return ['d-empty-state', this.sizeClass];\n },\n\n contentClass () {\n return EMPTY_STATE_CONTENT_SIZE_MODIFIERS[this.size];\n },\n\n headlineClass () {\n return EMPTY_STATE_HEADLINE_SIZE_MODIFIERS[this.size];\n },\n\n bodyClass () {\n return EMPTY_STATE_BODY_SIZE_MODIFIERS[this.size];\n },\n },\n\n mounted () {\n if (!this.bodyText && !this.$slots.body) {\n console.error('DtEmptyState: You should provide either bodyText or content on body slot.');\n }\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAoDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,0BAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,aAAA,QAAA,KAAA,aAAA;IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,gBAAA,KAAA,aAAA;IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AACA,aAAA,KAAA,YAAA,CAAA,KAAA,mBAAA,KAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,mBAAA;AACA,aAAA,KAAA,mBAAA,CAAA,KAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAA,2BAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,oBAAA;AACA,aAAA,CAAA,iBAAA,KAAA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAA,mCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAA,oCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAA,gCAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,QAAA,CAAA,KAAA,YAAA,CAAA,KAAA,OAAA,MAAA;AACA,cAAA,MAAA,2EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"empty_state.vue.js","sources":["../../../components/empty_state/empty_state.vue"],"sourcesContent":["<template>\n <dt-stack\n :class=\"emptyStateClasses\"\n >\n <span\n v-if=\"showIllustration\"\n class=\"d-empty-state__illustration\"\n >\n <!-- @slot Slot for the illustration. Displays when size is 'lg' or 'md'. Overrides icon. -->\n <slot name=\"illustration\" />\n </span>\n\n <span\n v-if=\"showIcon\"\n class=\"d-empty-state__icon\"\n >\n <!-- @slot Slot for the icon. Displayed if illustration is not provided. -->\n <slot\n name=\"icon\"\n :icon-size=\"'800'\"\n />\n </span>\n\n <dt-stack\n gap=\"450\"\n :class=\"['d-empty-state__content', contentClass]\"\n >\n <div :class=\"['d-empty-state__header-text', headlineClass]\">\n {{ headerText }}\n </div>\n\n <p\n v-if=\"bodyText\"\n :class=\"['d-empty-state__body-text', bodyClass]\"\n >\n {{ bodyText }}\n </p>\n </dt-stack>\n\n <slot name=\"body\" />\n </dt-stack>\n</template>\n\n<script>\nimport {\n EMPTY_STATE_BODY_SIZE_MODIFIERS,\n EMPTY_STATE_CONTENT_SIZE_MODIFIERS,\n EMPTY_STATE_HEADLINE_SIZE_MODIFIERS,\n EMPTY_STATE_SIZE_MODIFIERS,\n} from './empty_state_constants.js';\nimport { DtStack } from '@/components/stack';\n\nexport default {\n name: 'DtEmptyState',\n\n components: {\n DtStack,\n },\n\n props: {\n /**\n * The empty state size.\n * @values 'sm', 'md', 'lg'\n */\n size: {\n type: String,\n default: 'lg',\n validator: (s) => Object.keys(EMPTY_STATE_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * Header text\n * @type {String}\n */\n headerText: {\n type: String,\n required: true,\n },\n\n /**\n * Body text\n * @type {String}\n */\n bodyText: {\n type: String,\n default: null,\n },\n },\n\n computed: {\n hasIcon () {\n return this.$scopedSlots.icon && this.$scopedSlots.icon();\n },\n\n hasIllustration () {\n return this.$scopedSlots.illustration && this.$scopedSlots.illustration();\n },\n\n isSmallSize () {\n return this.size === 'sm';\n },\n\n /**\n * Icon will be shown in lg and md size only if illustration is not provided\n * Icon will always be shown in sm size\n */\n showIcon () {\n return this.hasIcon && (!this.hasIllustration || this.isSmallSize);\n },\n\n /**\n * Illustration will always be shown in lg and md size\n * Illustration will not be shown in sm size\n */\n showIllustration () {\n return this.hasIllustration && !this.isSmallSize;\n },\n\n sizeClass () {\n return EMPTY_STATE_SIZE_MODIFIERS[this.size];\n },\n\n emptyStateClasses () {\n return ['d-empty-state', this.sizeClass];\n },\n\n contentClass () {\n return EMPTY_STATE_CONTENT_SIZE_MODIFIERS[this.size];\n },\n\n headlineClass () {\n return EMPTY_STATE_HEADLINE_SIZE_MODIFIERS[this.size];\n },\n\n bodyClass () {\n return EMPTY_STATE_BODY_SIZE_MODIFIERS[this.size];\n },\n },\n\n mounted () {\n if (!this.bodyText && !this.$slots.body) {\n console.error('DtEmptyState: You should provide either bodyText or content on body slot.');\n }\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAoDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,0BAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,aAAA,QAAA,KAAA,aAAA;IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,gBAAA,KAAA,aAAA;IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AACA,aAAA,KAAA,YAAA,CAAA,KAAA,mBAAA,KAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,mBAAA;AACA,aAAA,KAAA,mBAAA,CAAA,KAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAA,2BAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,oBAAA;AACA,aAAA,CAAA,iBAAA,KAAA,SAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAA,mCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAA,oCAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,YAAA;AACA,aAAA,gCAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,QAAA,CAAA,KAAA,YAAA,CAAA,KAAA,OAAA,MAAA;AACA,cAAA,MAAA,2EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;"}
@@ -149,10 +149,7 @@ var _sfc_staticRenderFns = [];
149
149
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
150
150
  _sfc_main,
151
151
  _sfc_render,
152
- _sfc_staticRenderFns,
153
- false,
154
- null,
155
- null
152
+ _sfc_staticRenderFns
156
153
  );
157
154
  const hovercard = __component__.exports;
158
155
  exports.default = hovercard;
@@ -1 +1 @@
1
- {"version":3,"file":"hovercard.vue.cjs","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-popover\n :id=\"id\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n :hovercard=\"true\"\n :timer=\"timer\"\n data-qa=\"dt-hovercard\"\n @opened=\"(e) => ($emit('opened', e))\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\nimport useTimer from './timer';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the popover does not fit in the direction described by \"placement\",\n * it will attempt to change its direction to the \"fallbackPlacements\".\n * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n */\n placement: {\n type: String,\n default: 'top-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n timer: useTimer(),\n };\n },\n};\n</script>\n"],"names":["DtPopover","TOOLTIP_DIRECTIONS","POPOVER_PADDING_CLASSES","getUniqueString","POPOVER_APPEND_TO_VALUES","useTimer"],"mappings":";;;;;;;;AA6CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,WAAAA,QAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AACA,eAAA,CAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA,WAAA;AACA,eAAAC,kBAAA,mBAAA,SAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,YAAA;AACA,eAAA,OAAA,KAAAC,yCAAA,EAAA,KAAA,CAAA,SAAA,SAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA,GAAA,EAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAAC,aAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,UAAA;AAAA,MACA,MAAA,CAAA,aAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,cAAA;AACA,eAAAC,kBAAA,yBAAA,SAAA,QAAA,KACA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAAC,MAAAA,QAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"hovercard.vue.cjs","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-popover\n :id=\"id\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n :hovercard=\"true\"\n :timer=\"timer\"\n data-qa=\"dt-hovercard\"\n @opened=\"(e) => ($emit('opened', e))\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\nimport useTimer from './timer';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the popover does not fit in the direction described by \"placement\",\n * it will attempt to change its direction to the \"fallbackPlacements\".\n * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n */\n placement: {\n type: String,\n default: 'top-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n timer: useTimer(),\n };\n },\n};\n</script>\n"],"names":["DtPopover","TOOLTIP_DIRECTIONS","POPOVER_PADDING_CLASSES","getUniqueString","POPOVER_APPEND_TO_VALUES","useTimer"],"mappings":";;;;;;;;AA6CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,WAAAA,QAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AACA,eAAA,CAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA,WAAA;AACA,eAAAC,kBAAA,mBAAA,SAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,YAAA;AACA,eAAA,OAAA,KAAAC,yCAAA,EAAA,KAAA,CAAA,SAAA,SAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA,GAAA,EAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAAC,aAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,UAAA;AAAA,MACA,MAAA,CAAA,aAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,cAAA;AACA,eAAAC,kBAAA,yBAAA,SAAA,QAAA,KACA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAAC,MAAAA,QAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;"}
@@ -147,10 +147,7 @@ var _sfc_staticRenderFns = [];
147
147
  var __component__ = /* @__PURE__ */ normalizeComponent(
148
148
  _sfc_main,
149
149
  _sfc_render,
150
- _sfc_staticRenderFns,
151
- false,
152
- null,
153
- null
150
+ _sfc_staticRenderFns
154
151
  );
155
152
  const hovercard = __component__.exports;
156
153
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"hovercard.vue.js","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-popover\n :id=\"id\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n :hovercard=\"true\"\n :timer=\"timer\"\n data-qa=\"dt-hovercard\"\n @opened=\"(e) => ($emit('opened', e))\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\nimport useTimer from './timer';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the popover does not fit in the direction described by \"placement\",\n * it will attempt to change its direction to the \"fallbackPlacements\".\n * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n */\n placement: {\n type: String,\n default: 'top-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n timer: useTimer(),\n };\n },\n};\n</script>\n"],"names":[],"mappings":";;;;;;AA6CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AACA,eAAA,CAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA,WAAA;AACA,eAAA,mBAAA,SAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,YAAA;AACA,eAAA,OAAA,KAAA,uBAAA,EAAA,KAAA,CAAA,SAAA,SAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA,GAAA,EAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,UAAA;AAAA,MACA,MAAA,CAAA,aAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,cAAA;AACA,eAAA,yBAAA,SAAA,QAAA,KACA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAA,SAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"hovercard.vue.js","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-popover\n :id=\"id\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n :hovercard=\"true\"\n :timer=\"timer\"\n data-qa=\"dt-hovercard\"\n @opened=\"(e) => ($emit('opened', e))\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\nimport useTimer from './timer';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the popover does not fit in the direction described by \"placement\",\n * it will attempt to change its direction to the \"fallbackPlacements\".\n * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n */\n placement: {\n type: String,\n default: 'top-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n timer: useTimer(),\n };\n },\n};\n</script>\n"],"names":[],"mappings":";;;;;;AA6CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AACA,eAAA,CAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA,WAAA;AACA,eAAA,mBAAA,SAAA,SAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,YAAA;AACA,eAAA,OAAA,KAAA,uBAAA,EAAA,KAAA,CAAA,SAAA,SAAA,OAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA,GAAA,EAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,UAAA;AAAA,MACA,MAAA,CAAA,aAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,cAAA;AACA,eAAA,yBAAA,SAAA,QAAA,KACA,oBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAA,SAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;"}
@@ -45,10 +45,7 @@ var _sfc_staticRenderFns = [];
45
45
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
46
46
  _sfc_main,
47
47
  _sfc_render,
48
- _sfc_staticRenderFns,
49
- false,
50
- null,
51
- null
48
+ _sfc_staticRenderFns
52
49
  );
53
50
  const icon = __component__.exports;
54
51
  exports.default = icon;
@@ -1 +1 @@
1
- {"version":3,"file":"icon.vue.cjs","sources":["../../../components/icon/icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"icon\"\n v-if=\"icon\"\n :size=\"size\"\n :aria-label=\"ariaLabel\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-icon'\"\n />\n</template>\n\n<script>\nimport { icons } from '@dialpad/dialtone-icons/vue2';\nimport { ICON_SIZE_MODIFIERS, ICON_NAMES } from './icon_constants';\n\n/**\n * The Icon component provides a set of glyphs and sizes to provide context your application.\n * @see https://dialtone.dialpad.com/components/icon.html\n */\nexport default {\n name: 'DtIcon',\n\n props: {\n /**\n * The size of the icon.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n */\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * The icon name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ICON_NAMES.includes(name),\n },\n\n /**\n * The label of the icon as read out by a screenreader. Leave this unset if your icon is purely presentational\n */\n ariaLabel: {\n type: String,\n default: undefined,\n },\n },\n\n computed: {\n icon () {\n return icons[`./src/icons/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":["ICON_SIZE_MODIFIERS","ICON_NAMES","icons"],"mappings":";;;;;AAkBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAA,kCAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAAC,0BAAA,SAAA,IAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,aAAAC,KAAAA,MAAA,eAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"icon.vue.cjs","sources":["../../../components/icon/icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"icon\"\n v-if=\"icon\"\n :size=\"size\"\n :aria-label=\"ariaLabel\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-icon'\"\n />\n</template>\n\n<script>\nimport { icons } from '@dialpad/dialtone-icons/vue2';\nimport { ICON_SIZE_MODIFIERS, ICON_NAMES } from './icon_constants';\n\n/**\n * The Icon component provides a set of glyphs and sizes to provide context your application.\n * @see https://dialtone.dialpad.com/components/icon.html\n */\nexport default {\n name: 'DtIcon',\n\n props: {\n /**\n * The size of the icon.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n */\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * The icon name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ICON_NAMES.includes(name),\n },\n\n /**\n * The label of the icon as read out by a screenreader. Leave this unset if your icon is purely presentational\n */\n ariaLabel: {\n type: String,\n default: undefined,\n },\n },\n\n computed: {\n icon () {\n return icons[`./src/icons/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":["ICON_SIZE_MODIFIERS","ICON_NAMES","icons"],"mappings":";;;;;AAkBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAAA,kCAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAAC,0BAAA,SAAA,IAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,aAAAC,KAAAA,MAAA,eAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;"}
@@ -43,10 +43,7 @@ var _sfc_staticRenderFns = [];
43
43
  var __component__ = /* @__PURE__ */ normalizeComponent(
44
44
  _sfc_main,
45
45
  _sfc_render,
46
- _sfc_staticRenderFns,
47
- false,
48
- null,
49
- null
46
+ _sfc_staticRenderFns
50
47
  );
51
48
  const icon = __component__.exports;
52
49
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"icon.vue.js","sources":["../../../components/icon/icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"icon\"\n v-if=\"icon\"\n :size=\"size\"\n :aria-label=\"ariaLabel\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-icon'\"\n />\n</template>\n\n<script>\nimport { icons } from '@dialpad/dialtone-icons/vue2';\nimport { ICON_SIZE_MODIFIERS, ICON_NAMES } from './icon_constants';\n\n/**\n * The Icon component provides a set of glyphs and sizes to provide context your application.\n * @see https://dialtone.dialpad.com/components/icon.html\n */\nexport default {\n name: 'DtIcon',\n\n props: {\n /**\n * The size of the icon.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n */\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * The icon name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ICON_NAMES.includes(name),\n },\n\n /**\n * The label of the icon as read out by a screenreader. Leave this unset if your icon is purely presentational\n */\n ariaLabel: {\n type: String,\n default: undefined,\n },\n },\n\n computed: {\n icon () {\n return icons[`./src/icons/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAkBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,mBAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAA,WAAA,SAAA,IAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,aAAA,MAAA,eAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"icon.vue.js","sources":["../../../components/icon/icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"icon\"\n v-if=\"icon\"\n :size=\"size\"\n :aria-label=\"ariaLabel\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-icon'\"\n />\n</template>\n\n<script>\nimport { icons } from '@dialpad/dialtone-icons/vue2';\nimport { ICON_SIZE_MODIFIERS, ICON_NAMES } from './icon_constants';\n\n/**\n * The Icon component provides a set of glyphs and sizes to provide context your application.\n * @see https://dialtone.dialpad.com/components/icon.html\n */\nexport default {\n name: 'DtIcon',\n\n props: {\n /**\n * The size of the icon.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n */\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n },\n\n /**\n * The icon name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ICON_NAMES.includes(name),\n },\n\n /**\n * The label of the icon as read out by a screenreader. Leave this unset if your icon is purely presentational\n */\n ariaLabel: {\n type: String,\n default: undefined,\n },\n },\n\n computed: {\n icon () {\n return icons[`./src/icons/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAkBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,MAAA,OAAA,KAAA,mBAAA,EAAA,SAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAA,WAAA,SAAA,IAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,aAAA,MAAA,eAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;"}
@@ -29,10 +29,7 @@ var _sfc_staticRenderFns = [];
29
29
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
30
30
  _sfc_main,
31
31
  _sfc_render,
32
- _sfc_staticRenderFns,
33
- false,
34
- null,
35
- null
32
+ _sfc_staticRenderFns
36
33
  );
37
34
  const illustration = __component__.exports;
38
35
  exports.default = illustration;
@@ -1 +1 @@
1
- {"version":3,"file":"illustration.vue.cjs","sources":["../../../components/illustration/illustration.vue"],"sourcesContent":["<template>\n <component\n :is=\"illustration\"\n v-if=\"illustration\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-illustration'\"\n />\n</template>\n\n<script>\nimport { illustrations } from '@dialpad/dialtone-icons/vue2';\nimport { ILLUSTRATION_NAMES } from './illustration_constants';\n\nexport default {\n name: 'DtIllustration',\n\n props: {\n /**\n * The illustration name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ILLUSTRATION_NAMES.includes(name),\n },\n },\n\n computed: {\n illustration () {\n return illustrations[`./src/illustrations/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":["ILLUSTRATION_NAMES","illustrations"],"mappings":";;;;;AAYA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAAA,0CAAA,SAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,eAAA;AACA,aAAAC,KAAAA,cAAA,uBAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"illustration.vue.cjs","sources":["../../../components/illustration/illustration.vue"],"sourcesContent":["<template>\n <component\n :is=\"illustration\"\n v-if=\"illustration\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-illustration'\"\n />\n</template>\n\n<script>\nimport { illustrations } from '@dialpad/dialtone-icons/vue2';\nimport { ILLUSTRATION_NAMES } from './illustration_constants';\n\nexport default {\n name: 'DtIllustration',\n\n props: {\n /**\n * The illustration name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ILLUSTRATION_NAMES.includes(name),\n },\n },\n\n computed: {\n illustration () {\n return illustrations[`./src/illustrations/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":["ILLUSTRATION_NAMES","illustrations"],"mappings":";;;;;AAYA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAAA,0CAAA,SAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,eAAA;AACA,aAAAC,KAAAA,cAAA,uBAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;"}
@@ -27,10 +27,7 @@ var _sfc_staticRenderFns = [];
27
27
  var __component__ = /* @__PURE__ */ normalizeComponent(
28
28
  _sfc_main,
29
29
  _sfc_render,
30
- _sfc_staticRenderFns,
31
- false,
32
- null,
33
- null
30
+ _sfc_staticRenderFns
34
31
  );
35
32
  const illustration = __component__.exports;
36
33
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"illustration.vue.js","sources":["../../../components/illustration/illustration.vue"],"sourcesContent":["<template>\n <component\n :is=\"illustration\"\n v-if=\"illustration\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-illustration'\"\n />\n</template>\n\n<script>\nimport { illustrations } from '@dialpad/dialtone-icons/vue2';\nimport { ILLUSTRATION_NAMES } from './illustration_constants';\n\nexport default {\n name: 'DtIllustration',\n\n props: {\n /**\n * The illustration name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ILLUSTRATION_NAMES.includes(name),\n },\n },\n\n computed: {\n illustration () {\n return illustrations[`./src/illustrations/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAYA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAA,mBAAA,SAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,eAAA;AACA,aAAA,cAAA,uBAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"illustration.vue.js","sources":["../../../components/illustration/illustration.vue"],"sourcesContent":["<template>\n <component\n :is=\"illustration\"\n v-if=\"illustration\"\n :data-qa=\"$attrs['data-qa'] ?? 'dt-illustration'\"\n />\n</template>\n\n<script>\nimport { illustrations } from '@dialpad/dialtone-icons/vue2';\nimport { ILLUSTRATION_NAMES } from './illustration_constants';\n\nexport default {\n name: 'DtIllustration',\n\n props: {\n /**\n * The illustration name in kebab-case\n */\n name: {\n type: String,\n required: true,\n validator: (name) => ILLUSTRATION_NAMES.includes(name),\n },\n },\n\n computed: {\n illustration () {\n return illustrations[`./src/illustrations/${this.name}.vue`];\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;AAYA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAA,mBAAA,SAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,eAAA;AACA,aAAA,cAAA,uBAAA,KAAA,IAAA,MAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;"}
@@ -184,10 +184,7 @@ var _sfc_staticRenderFns = [];
184
184
  var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
185
185
  _sfc_main,
186
186
  _sfc_render,
187
- _sfc_staticRenderFns,
188
- false,
189
- null,
190
- null
187
+ _sfc_staticRenderFns
191
188
  );
192
189
  const DtImageViewer = __component__.exports;
193
190
  exports.default = DtImageViewer;