@dialpad/dialtone-vue 2.126.0 → 2.127.0

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 (279) hide show
  1. package/dist/chunks/_plugin-vue2_normalizer-ZK80B3OL.js +2 -0
  2. package/dist/chunks/_plugin-vue2_normalizer-ZK80B3OL.js.map +1 -0
  3. package/dist/chunks/dropdown-zhMEz3bn.js +2 -0
  4. package/dist/chunks/dropdown-zhMEz3bn.js.map +1 -0
  5. package/dist/chunks/dropdown_constants-KHFvVI2L.js +2 -0
  6. package/dist/chunks/dropdown_constants-KHFvVI2L.js.map +1 -0
  7. package/dist/chunks/icon_constants-2S_OSQ1t.js +2 -0
  8. package/dist/chunks/icon_constants-2S_OSQ1t.js.map +1 -0
  9. package/dist/chunks/index-2jPosQBn.js +3 -0
  10. package/dist/chunks/index-2jPosQBn.js.map +1 -0
  11. package/dist/chunks/index-sdfB7Aok.js +2 -0
  12. package/dist/chunks/index-sdfB7Aok.js.map +1 -0
  13. package/dist/chunks/input-o-fc1X4b.js +2 -0
  14. package/dist/chunks/input-o-fc1X4b.js.map +1 -0
  15. package/dist/chunks/input_group-j2gTtc1C.js +2 -0
  16. package/dist/chunks/input_group-j2gTtc1C.js.map +1 -0
  17. package/dist/chunks/keyboard_list_navigation-N74Bpdq7.js +2 -0
  18. package/dist/chunks/keyboard_list_navigation-N74Bpdq7.js.map +1 -0
  19. package/dist/chunks/link_constants-Kn6kP4i1.js +2 -0
  20. package/dist/chunks/link_constants-Kn6kP4i1.js.map +1 -0
  21. package/dist/chunks/list_item_constants-Tsz5CO1m.js +2 -0
  22. package/dist/chunks/list_item_constants-Tsz5CO1m.js.map +1 -0
  23. package/dist/chunks/modal-qEzlo0Sj.js +2 -0
  24. package/dist/chunks/modal-qEzlo0Sj.js.map +1 -0
  25. package/dist/chunks/notice_action-u3ZKIhit.js +2 -0
  26. package/dist/chunks/notice_action-u3ZKIhit.js.map +1 -0
  27. package/dist/chunks/notice_constants-mC6al2Dm.js +2 -0
  28. package/dist/chunks/notice_constants-mC6al2Dm.js.map +1 -0
  29. package/dist/chunks/popover_constants-hOEhklvr.js +2 -0
  30. package/dist/chunks/popover_constants-hOEhklvr.js.map +1 -0
  31. package/dist/chunks/sr_only_close_button-ErijKGYR.js +3 -0
  32. package/dist/chunks/sr_only_close_button-ErijKGYR.js.map +1 -0
  33. package/dist/chunks/stack_constants-m9Ickqw0.js +2 -0
  34. package/dist/chunks/stack_constants-m9Ickqw0.js.map +1 -0
  35. package/dist/chunks/tab-7hJQSLFx.js +2 -0
  36. package/dist/chunks/tab-7hJQSLFx.js.map +1 -0
  37. package/dist/component-documentation.json +1 -1
  38. package/dist/dialtone-vue.cjs +2 -0
  39. package/dist/dialtone-vue.cjs.map +1 -0
  40. package/dist/lib/attachment-carousel.cjs +2 -0
  41. package/dist/lib/attachment-carousel.cjs.map +1 -0
  42. package/dist/lib/attachment-carousel.js +2 -3
  43. package/dist/lib/attachment-carousel.js.map +1 -1
  44. package/dist/lib/avatar.cjs +2 -0
  45. package/dist/lib/avatar.cjs.map +1 -0
  46. package/dist/lib/avatar.js +2 -3
  47. package/dist/lib/avatar.js.map +1 -1
  48. package/dist/lib/badge.cjs +2 -0
  49. package/dist/lib/badge.cjs.map +1 -0
  50. package/dist/lib/badge.js +2 -3
  51. package/dist/lib/badge.js.map +1 -1
  52. package/dist/lib/banner.cjs +3 -0
  53. package/dist/lib/banner.cjs.map +1 -0
  54. package/dist/lib/banner.js +2 -3
  55. package/dist/lib/banner.js.map +1 -1
  56. package/dist/lib/breadcrumbs.cjs +2 -0
  57. package/dist/lib/breadcrumbs.cjs.map +1 -0
  58. package/dist/lib/button-group.cjs +2 -0
  59. package/dist/lib/button-group.cjs.map +1 -0
  60. package/dist/lib/button.cjs +2 -0
  61. package/dist/lib/button.cjs.map +1 -0
  62. package/dist/lib/callbar-button-with-popover.cjs +2 -0
  63. package/dist/lib/callbar-button-with-popover.cjs.map +1 -0
  64. package/dist/lib/callbar-button-with-popover.js +2 -3
  65. package/dist/lib/callbar-button-with-popover.js.map +1 -1
  66. package/dist/lib/callbar-button.cjs +2 -0
  67. package/dist/lib/callbar-button.cjs.map +1 -0
  68. package/dist/lib/callbox.cjs +2 -0
  69. package/dist/lib/callbox.cjs.map +1 -0
  70. package/dist/lib/callbox.js +2 -3
  71. package/dist/lib/callbox.js.map +1 -1
  72. package/dist/lib/card.cjs +2 -0
  73. package/dist/lib/card.cjs.map +1 -0
  74. package/dist/lib/checkbox-group.cjs +2 -0
  75. package/dist/lib/checkbox-group.cjs.map +1 -0
  76. package/dist/lib/checkbox.cjs +2 -0
  77. package/dist/lib/checkbox.cjs.map +1 -0
  78. package/dist/lib/chip.cjs +2 -0
  79. package/dist/lib/chip.cjs.map +1 -0
  80. package/dist/lib/chip.js +2 -3
  81. package/dist/lib/chip.js.map +1 -1
  82. package/dist/lib/codeblock.cjs +3 -0
  83. package/dist/lib/codeblock.cjs.map +1 -0
  84. package/dist/lib/collapsible.cjs +2 -0
  85. package/dist/lib/collapsible.cjs.map +1 -0
  86. package/dist/lib/collapsible.js +2 -3
  87. package/dist/lib/collapsible.js.map +1 -1
  88. package/dist/lib/combobox-multi-select.cjs +2 -0
  89. package/dist/lib/combobox-multi-select.cjs.map +1 -0
  90. package/dist/lib/combobox-with-popover.cjs +2 -0
  91. package/dist/lib/combobox-with-popover.cjs.map +1 -0
  92. package/dist/lib/combobox-with-popover.js +1 -1
  93. package/dist/lib/combobox.cjs +2 -0
  94. package/dist/lib/combobox.cjs.map +1 -0
  95. package/dist/lib/constants.cjs +2 -0
  96. package/dist/lib/constants.cjs.map +1 -0
  97. package/dist/lib/contact-info.cjs +2 -0
  98. package/dist/lib/contact-info.cjs.map +1 -0
  99. package/dist/lib/contact-info.js +2 -3
  100. package/dist/lib/contact-info.js.map +1 -1
  101. package/dist/lib/contact-row.cjs +2 -0
  102. package/dist/lib/contact-row.cjs.map +1 -0
  103. package/dist/lib/datepicker.cjs +2 -0
  104. package/dist/lib/datepicker.cjs.map +1 -0
  105. package/dist/lib/datepicker.js +12 -13
  106. package/dist/lib/datepicker.js.map +1 -1
  107. package/dist/lib/dates.cjs +2 -0
  108. package/dist/lib/dates.cjs.map +1 -0
  109. package/dist/lib/description-list.cjs +2 -0
  110. package/dist/lib/description-list.cjs.map +1 -0
  111. package/dist/lib/dropdown.cjs +2 -0
  112. package/dist/lib/dropdown.cjs.map +1 -0
  113. package/dist/lib/dropdown.js +6 -7
  114. package/dist/lib/dropdown.js.map +1 -1
  115. package/dist/lib/editor.cjs +2 -0
  116. package/dist/lib/editor.cjs.map +1 -0
  117. package/dist/lib/emoji-picker.cjs +2 -0
  118. package/dist/lib/emoji-picker.cjs.map +1 -0
  119. package/dist/lib/emoji-picker.js +2 -3
  120. package/dist/lib/emoji-picker.js.map +1 -1
  121. package/dist/lib/emoji-row.cjs +2 -0
  122. package/dist/lib/emoji-row.cjs.map +1 -0
  123. package/dist/lib/emoji-text-wrapper.cjs +2 -0
  124. package/dist/lib/emoji-text-wrapper.cjs.map +1 -0
  125. package/dist/lib/emoji.cjs +2 -0
  126. package/dist/lib/emoji.cjs.map +1 -0
  127. package/dist/lib/feed-item-row.cjs +2 -0
  128. package/dist/lib/feed-item-row.cjs.map +1 -0
  129. package/dist/lib/feed-item-row.js +2 -3
  130. package/dist/lib/feed-item-row.js.map +1 -1
  131. package/dist/lib/feed-pill.cjs +2 -0
  132. package/dist/lib/feed-pill.cjs.map +1 -0
  133. package/dist/lib/feed-pill.js +2 -3
  134. package/dist/lib/feed-pill.js.map +1 -1
  135. package/dist/lib/general-row.cjs +2 -0
  136. package/dist/lib/general-row.cjs.map +1 -0
  137. package/dist/lib/group-row.cjs +2 -0
  138. package/dist/lib/group-row.cjs.map +1 -0
  139. package/dist/lib/group-row.js +1 -1
  140. package/dist/lib/grouped-chip.cjs +2 -0
  141. package/dist/lib/grouped-chip.cjs.map +1 -0
  142. package/dist/lib/grouped-chip.js +6 -7
  143. package/dist/lib/grouped-chip.js.map +1 -1
  144. package/dist/lib/hovercard.cjs +2 -0
  145. package/dist/lib/hovercard.cjs.map +1 -0
  146. package/dist/lib/hovercard.js +6 -7
  147. package/dist/lib/hovercard.js.map +1 -1
  148. package/dist/lib/icon.cjs +2 -0
  149. package/dist/lib/icon.cjs.map +1 -0
  150. package/dist/lib/icon.js +14 -38
  151. package/dist/lib/icon.js.map +1 -1
  152. package/dist/lib/image-viewer.cjs +2 -0
  153. package/dist/lib/image-viewer.cjs.map +1 -0
  154. package/dist/lib/image-viewer.js +11 -12
  155. package/dist/lib/image-viewer.js.map +1 -1
  156. package/dist/lib/input-group.cjs +2 -0
  157. package/dist/lib/input-group.cjs.map +1 -0
  158. package/dist/lib/input.cjs +2 -0
  159. package/dist/lib/input.cjs.map +1 -0
  160. package/dist/lib/item-layout.cjs +2 -0
  161. package/dist/lib/item-layout.cjs.map +1 -0
  162. package/dist/lib/ivr-node.cjs +2 -0
  163. package/dist/lib/ivr-node.cjs.map +1 -0
  164. package/dist/lib/ivr-node.js +4 -5
  165. package/dist/lib/ivr-node.js.map +1 -1
  166. package/dist/lib/keyboard-shortcut.cjs +2 -0
  167. package/dist/lib/keyboard-shortcut.cjs.map +1 -0
  168. package/dist/lib/keyboard-shortcut.js +4 -5
  169. package/dist/lib/keyboard-shortcut.js.map +1 -1
  170. package/dist/lib/lazy-show.cjs +2 -0
  171. package/dist/lib/lazy-show.cjs.map +1 -0
  172. package/dist/lib/link.cjs +2 -0
  173. package/dist/lib/link.cjs.map +1 -0
  174. package/dist/lib/list-item-group.cjs +2 -0
  175. package/dist/lib/list-item-group.cjs.map +1 -0
  176. package/dist/lib/list-item.cjs +2 -0
  177. package/dist/lib/list-item.cjs.map +1 -0
  178. package/dist/lib/list-item.js +2 -3
  179. package/dist/lib/list-item.js.map +1 -1
  180. package/dist/lib/message-input.cjs +2 -0
  181. package/dist/lib/message-input.cjs.map +1 -0
  182. package/dist/lib/message-input.js +89 -47
  183. package/dist/lib/message-input.js.map +1 -1
  184. package/dist/lib/mixins.cjs +2 -0
  185. package/dist/lib/mixins.cjs.map +1 -0
  186. package/dist/lib/modal.cjs +3 -0
  187. package/dist/lib/modal.cjs.map +1 -0
  188. package/dist/lib/modal.js +10 -11
  189. package/dist/lib/modal.js.map +1 -1
  190. package/dist/lib/notice.cjs +2 -0
  191. package/dist/lib/notice.cjs.map +1 -0
  192. package/dist/lib/notice.js +2 -3
  193. package/dist/lib/notice.js.map +1 -1
  194. package/dist/lib/pagination.cjs +2 -0
  195. package/dist/lib/pagination.cjs.map +1 -0
  196. package/dist/lib/pagination.js +2 -3
  197. package/dist/lib/pagination.js.map +1 -1
  198. package/dist/lib/popover.cjs +2 -0
  199. package/dist/lib/popover.cjs.map +1 -0
  200. package/dist/lib/popover.js +4 -5
  201. package/dist/lib/popover.js.map +1 -1
  202. package/dist/lib/presence.cjs +2 -0
  203. package/dist/lib/presence.cjs.map +1 -0
  204. package/dist/lib/radio-group.cjs +2 -0
  205. package/dist/lib/radio-group.cjs.map +1 -0
  206. package/dist/lib/radio.cjs +2 -0
  207. package/dist/lib/radio.cjs.map +1 -0
  208. package/dist/lib/rich-text-editor.cjs +2 -0
  209. package/dist/lib/rich-text-editor.cjs.map +1 -0
  210. package/dist/lib/rich-text-editor.js +106 -74
  211. package/dist/lib/rich-text-editor.js.map +1 -1
  212. package/dist/lib/root-layout.cjs +2 -0
  213. package/dist/lib/root-layout.cjs.map +1 -0
  214. package/dist/lib/select-menu.cjs +2 -0
  215. package/dist/lib/select-menu.cjs.map +1 -0
  216. package/dist/lib/settings-menu-button.cjs +2 -0
  217. package/dist/lib/settings-menu-button.cjs.map +1 -0
  218. package/dist/lib/settings-menu-button.js +2 -3
  219. package/dist/lib/settings-menu-button.js.map +1 -1
  220. package/dist/lib/skeleton.cjs +2 -0
  221. package/dist/lib/skeleton.cjs.map +1 -0
  222. package/dist/lib/stack.cjs +2 -0
  223. package/dist/lib/stack.cjs.map +1 -0
  224. package/dist/lib/tabs.cjs +2 -0
  225. package/dist/lib/tabs.cjs.map +1 -0
  226. package/dist/lib/time-pill.cjs +2 -0
  227. package/dist/lib/time-pill.cjs.map +1 -0
  228. package/dist/lib/toast.cjs +2 -0
  229. package/dist/lib/toast.cjs.map +1 -0
  230. package/dist/lib/toast.js +2 -3
  231. package/dist/lib/toast.js.map +1 -1
  232. package/dist/lib/toggle.cjs +2 -0
  233. package/dist/lib/toggle.cjs.map +1 -0
  234. package/dist/lib/tooltip-directive.cjs +2 -0
  235. package/dist/lib/tooltip-directive.cjs.map +1 -0
  236. package/dist/lib/tooltip.cjs +2 -0
  237. package/dist/lib/tooltip.cjs.map +1 -0
  238. package/dist/lib/top-banner-info.cjs +2 -0
  239. package/dist/lib/top-banner-info.cjs.map +1 -0
  240. package/dist/lib/unread-pill.cjs +2 -0
  241. package/dist/lib/unread-pill.cjs.map +1 -0
  242. package/dist/lib/unread-pill.js +3 -4
  243. package/dist/lib/unread-pill.js.map +1 -1
  244. package/dist/lib/utils.cjs +2 -0
  245. package/dist/lib/utils.cjs.map +1 -0
  246. package/dist/lib/validation-messages.cjs +2 -0
  247. package/dist/lib/validation-messages.cjs.map +1 -0
  248. package/dist/lib/validators.cjs +2 -0
  249. package/dist/lib/validators.cjs.map +1 -0
  250. package/dist/style.css +1 -1
  251. package/dist/types/components/avatar/avatar.vue.d.ts +1 -1
  252. package/dist/types/components/button/button.vue.d.ts +2 -2
  253. package/dist/types/components/card/card.vue.d.ts +1 -1
  254. package/dist/types/components/chip/chip.vue.d.ts +1 -1
  255. package/dist/types/components/collapsible/collapsible.vue.d.ts +2 -2
  256. package/dist/types/components/combobox/combobox.vue.d.ts +1 -1
  257. package/dist/types/components/dropdown/dropdown.vue.d.ts +1 -1
  258. package/dist/types/components/emoji/emoji.vue.d.ts +1 -1
  259. package/dist/types/components/icon/icon.vue.d.ts +2 -22
  260. package/dist/types/components/icon/icon.vue.d.ts.map +1 -1
  261. package/dist/types/components/list_item_group/list_item_group.vue.d.ts +1 -1
  262. package/dist/types/components/modal/modal.vue.d.ts +2 -2
  263. package/dist/types/components/popover/popover_header_footer.vue.d.ts +1 -1
  264. package/dist/types/components/rich_text_editor/rich_text_editor.vue.d.ts +91 -1
  265. package/dist/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
  266. package/dist/types/components/skeleton/skeleton-list-item.vue.d.ts +1 -1
  267. package/dist/types/components/skeleton/skeleton-paragraph.vue.d.ts +3 -3
  268. package/dist/types/components/skeleton/skeleton-shape.vue.d.ts +2 -2
  269. package/dist/types/components/skeleton/skeleton-text.vue.d.ts +2 -2
  270. package/dist/types/components/skeleton/skeleton.vue.d.ts +1 -1
  271. package/dist/types/components/tooltip/tooltip.vue.d.ts +2 -2
  272. package/dist/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts +1 -1
  273. package/dist/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts +1 -1
  274. package/dist/types/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.d.ts +2 -2
  275. package/dist/types/recipes/conversation_view/message_input/message_input.vue.d.ts +90 -0
  276. package/dist/types/recipes/conversation_view/message_input/message_input.vue.d.ts.map +1 -1
  277. package/dist/types/recipes/leftbar/general_row/general_row.vue.d.ts +1 -1
  278. package/dist/types/recipes/leftbar/general_row/leftbar_general_row_icon.vue.d.ts +1 -1
  279. package/package.json +10 -9
@@ -0,0 +1 @@
1
+ {"version":3,"file":"datepicker.cjs","sources":["../../components/datepicker/datepicker_constants.js","../../components/datepicker/utils.js","../../components/datepicker/modules/month-year-picker.vue","../../components/datepicker/modules/calendar.vue","../../components/datepicker/datepicker.vue","../../components/datepicker/formatUtils.js"],"sourcesContent":["/**\n * Week start day\n * 0 - Sunday\n * 1 - Monday\n */\nexport const WEEK_START = 0;\n\nexport const MONTH_FORMAT = 'MMMM';\n\nexport const INTL_MONTH_FORMAT = 'long';\n","import {\n startOfWeek, addDays, getMonth, isEqual,\n addMonths, startOfMonth, getDay, getDate,\n subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n const dates = [];\n for (let i = 0; i < 7; i++) {\n const next = addDays(startDate, i);\n const isNext = getMonth(next) !== month;\n dates.push({\n text: next.getDate(),\n value: next,\n currentMonth: !isNext,\n isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n // will be selected if the date is the same as the selected day and is from the current month\n selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n });\n }\n return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n if (!date || !dateToCompare) {\n return false;\n }\n return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n const weeks = [];\n const firstDate = _parsedGetDate(new Date(year, month));\n const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n const weekStartsOn = WEEK_START;\n\n const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n const addDaysToWeek = (date) => {\n const days = getWeekDays(date, month, selectedDay);\n\n weeks.push({ days });\n\n if (\n !weeks[weeks.length - 1].days.some((day) =>\n isDateEqual(day.value, lastDate),\n )\n ) {\n const nextDate = addDays(date, 7);\n addDaysToWeek(nextDate);\n }\n };\n\n addDaysToWeek(firstDateInCalendar);\n\n return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n // Get list in order from sun ... sat\n const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n .slice(0, 2);\n });\n\n // Get days that are in order before specified week start\n const beforeWeekStart = days.slice(0, weekStart);\n // Get days that are in order after specified week start\n const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n // return them in correct order\n return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n const nextMonthDate = addMonths(date, 1);\n const nextMonthStart = startOfMonth(nextMonthDate);\n const nextMonthStartWeekday = getDay(nextMonthStart);\n\n const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n // Add the difference in days to the first day of the next month\n const focusDate = addDays(nextMonthStart, dayDifference);\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n\n // Move to the last day of the previous month\n const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n let focusDate = lastDayOfPrevMonth;\n\n // Adjust to the same weekday in the last week of the previous month\n while (getDay(focusDate) !== currentWeekday) {\n focusDate = addDays(focusDate, -1);\n }\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n","<template>\n <dt-stack\n direction=\"row\"\n class=\"d-datepicker__month-year\"\n gap=\"300\"\n >\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"prevYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevYearButton\"\n :ref=\"refNames[0]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevYearLabel} ${selectYear - 1}`\"\n @click=\"changeYear(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"prevMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevMonthButton\"\n :ref=\"refNames[1]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevMonthLabel} ${formattedMonth(selectMonth - 1)}`\"\n @click=\"changeMonth(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n <div\n id=\"calendar-heading\"\n class=\"d-datepicker__month-year-title\"\n >\n {{ formattedMonth(selectMonth) }}\n\n {{ selectYear }}\n </div>\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"nextMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextMonthButton\"\n :ref=\"refNames[2]\"\n size=\"xs\"\n importance=\"clear\"\n :circle=\"true\"\n kind=\"muted\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextMonthLabel} ${formattedMonth(selectMonth + 1)}`\"\n @click=\"changeMonth(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"nextYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextYearButton\"\n :ref=\"refNames[3]\"\n size=\"xs\"\n kind=\"muted\"\n :circle=\"true\"\n importance=\"clear\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextYearLabel} ${selectYear + 1}`\"\n @click=\"changeYear(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n </dt-stack>\n</template>\n\n<script>\nimport { DtIcon } from '@/components/icon';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport DtStack from '@/components/stack/stack.vue';\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerMonthYearPicker',\n\n components: { DtButton, DtTooltip, DtStack, DtIcon },\n\n props: {\n locale: {\n type: String,\n required: true,\n },\n\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n changeToLabel: {\n type: String,\n required: true,\n },\n\n selectedDate: {\n type: Date,\n required: true,\n },\n },\n\n emits: [\n /**\n * Will retrieve the calendar days of the given date\n *\n * @event calendar-days\n * @type {Array}\n */\n 'calendar-days',\n\n /**\n * Will focus first day in calendar\n *\n * @event focus-first-day\n */\n 'focus-first-day',\n\n /**\n * Will focus last day in calendar\n *\n * @event focus-last-day\n */\n 'focus-last-day',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n selectMonth: getMonth(this.selectedDate),\n selectYear: getYear(this.selectedDate),\n highlightedDay: null,\n focusPicker: 0,\n focusRefs: [],\n refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n };\n },\n\n computed: {\n // Get days for the currently selected month and year and highlight the selected day\n calendarDays () {\n return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n },\n\n formattedMonth () {\n return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.locale);\n },\n },\n\n watch: {\n selectMonth: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n selectYear: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n },\n\n mounted () {\n this.setButtonsRef();\n this.focusMonthYearPicker();\n },\n\n methods: {\n setButtonsRef () {\n this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n },\n\n focusMonthYearPicker () {\n this.focusPicker = 0;\n this.focusRefs[0].$el.focus();\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusPicker === 0) {\n this.focusPicker = 3;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker--;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusPicker === 3) {\n this.focusPicker = 0;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker++;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n highlightDay () {\n const year = getYear(this.selectedDate);\n const month = getMonth(this.selectedDate);\n\n if (year !== this.selectYear || month !== this.selectMonth) {\n this.highlightedDay = null;\n } else {\n this.highlightedDay = getDate(this.selectedDate);\n }\n },\n\n changeMonth (value) {\n // Adjust year when changing from January to December or vice versa\n if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n this.selectYear += value;\n }\n\n // Calculate the new date by adding or subtracting months\n const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n // Update the selected month\n this.selectMonth = getMonth(newDate);\n },\n\n changeYear (value) {\n this.selectYear = this.selectYear + value;\n },\n\n goToNextMonth () {\n this.changeMonth(1);\n },\n\n goToPrevMonth () {\n this.changeMonth(-1);\n },\n },\n};\n</script>\n","<template>\n <table\n class=\"d-datepicker__calendar\"\n aria-labelledby=\"calendar-heading\"\n >\n <thead>\n <tr>\n <th\n v-for=\"day in weekDays\"\n :key=\"day\"\n scope=\"col\"\n class=\"d-datepicker__cell d-datepicker__cell--header\"\n >\n <span\n class=\"d-datepicker__weekday\"\n :title=\"day\"\n :aria-label=\"day\"\n > {{ day }}</span>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n v-for=\"(week, indexWeek) in calendarDays\"\n :key=\"indexWeek\"\n >\n <td\n v-for=\"(day, indexDays) in week.days\"\n :key=\"indexWeek + indexDays\"\n class=\"d-datepicker__cell\"\n role=\"listbox\"\n >\n <dt-button\n :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n class=\"d-datepicker__day\"\n :circle=\"true\"\n size=\"sm\"\n importance=\"clear\"\n :disabled=\"!day.currentMonth\"\n :class=\"{\n 'd-datepicker__day--disabled': !day.currentMonth,\n 'd-datepicker__day--selected': selectedDay\n ? ((day.text === selectedDay) && day.currentMonth)\n : day.selected,\n }\"\n type=\"button\"\n :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n :aria-label=\"dayAriaLabel(day)\"\n role=\"option\"\n @click=\"selectDay(day)\"\n @keydown=\"handleKeyDown($event)\"\n >\n {{ day.text }}\n </dt-button>\n </td>\n </tr>\n </tbody>\n </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate } from '@/components/datepicker/utils';\nimport { WEEK_START, MONTH_FORMAT } from '@/components/datepicker/datepicker_constants.js';\nimport { format, getYear } from 'date-fns';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerCalendar',\n components: { DtButton },\n\n props: {\n calendarDays: {\n type: Array,\n required: true,\n },\n\n locale: {\n type: String,\n required: true,\n },\n\n selectDayLabel: {\n type: String,\n required: true,\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event select-date\n * @type {Date}\n */\n 'select-date',\n\n /**\n * Will focus the month and year picker\n *\n * @event focus-month-year-picker\n */\n 'focus-month-year-picker',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n // local selectedDay to override the received by props calendarDays\n selectedDay: null,\n focusDay: 0,\n daysRef: [],\n };\n },\n\n computed: {\n weekDays () {\n return getWeekDayNames(this.locale, WEEK_START);\n },\n },\n\n watch: {\n calendarDays () {\n // on calendarDays update, reset our local variables\n this.focusDay = 0;\n this.selectedDay = null;\n\n this.daysRef = [];\n\n this.$nextTick(() => {\n this.daysRef = [];\n this.setDayRef();\n });\n },\n },\n\n methods: {\n dayAriaLabel (day) {\n return `${this.selectDayLabel} ${day.text} ${format(day.value, MONTH_FORMAT)} ${getYear(day.value)}`;\n },\n\n setDayRef (el, day) {\n this.calendarDays.forEach((week, weekIndex) => {\n week.days.forEach((day, dayIndex) => {\n const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n const dayButton = this.$refs[refKey];\n if (dayButton && day.currentMonth) {\n this.daysRef.push({ el: dayButton[0], day });\n }\n });\n });\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n this.focusDay -= 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[prevFocusDate - 1].el.$el.focus();\n this.focusDay += prevFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusDay += 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[nextFocusDate - 1].el.$el.focus();\n this.focusDay += nextFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusDay > 0) {\n this.focusDay -= 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month first day, jump to last day of prev month\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.focusLastDay();\n });\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusDay < this.daysRef.length - 1) {\n this.focusDay += 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month last day, jump to first day of next month\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.focusFirstDay();\n });\n }\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-month-year-picker');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n focusFirstDay () {\n this.focusDay = 0;\n this.$nextTick(() => {\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n focusLastDay () {\n this.$nextTick(() => {\n this.focusDay = this.daysRef.length - 1;\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n selectDay (day) {\n if (!day.currentMonth) { return; }\n\n // local selectedDay is updated when a day is selected\n this.selectedDay = day.text;\n this.$emit('select-date', day.value);\n },\n },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-stack\n class=\"d-datepicker\"\n gap=\"400\"\n >\n <div class=\"d-datepicker__hd\">\n <month-year-picker\n ref=\"monthYearPicker\"\n :locale=\"locale\"\n :prev-month-label=\"prevMonthLabel\"\n :next-month-label=\"nextMonthLabel\"\n :prev-year-label=\"prevYearLabel\"\n :next-year-label=\"nextYearLabel\"\n :change-to-label=\"changeToLabel\"\n :selected-date=\"selectedDate\"\n @calendar-days=\"updateCalendarDays\"\n @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n @focus-last-day=\"$refs.calendar.focusLastDay()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n />\n </div>\n <div class=\"d-datepicker__bd\">\n <calendar\n ref=\"calendar\"\n :locale=\"locale\"\n :calendar-days=\"calendarDays\"\n :select-day-label=\"selectDayLabel\"\n @select-date=\"$emit('selected-date', $event)\"\n @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n />\n </div>\n </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport DtStack from '@/components/stack/stack.vue';\n\nexport default {\n name: 'DtDatepicker',\n\n components: { DtStack, MonthYearPicker, Calendar },\n\n props: {\n /**\n * Label for the previous month button\n *\n * @type {String}\n * @example 'Previous month'\n */\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next month button\n *\n * @type {String}\n * @example 'Next month'\n */\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the previous year button\n *\n * @type {String}\n * @example 'Previous year'\n */\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next year button\n *\n * @type {String}\n * @example 'Next year'\n */\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the select day button\n *\n * @type {String}\n * @example 'Select day'\n */\n selectDayLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the change to button\n *\n * @type {String}\n * @example 'Change to'\n */\n changeToLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Locale for the calendar\n *\n * @type {String}\n */\n locale: {\n type: String,\n default: 'en-US',\n },\n\n /**\n * Selected date\n *\n * @type {Date}\n */\n selectedDate: {\n type: Date,\n default: () => (new Date()),\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event selected-date\n * @type {Date}\n */\n 'selected-date',\n\n /**\n * Event fired when user presses the esc key\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n calendarDays: [],\n };\n },\n\n methods: {\n updateCalendarDays (days) {\n this.calendarDays = days;\n },\n },\n};\n</script>\n","export function formatLong (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatMedium (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatShort (date, locale = 'default', showWeekday = true) {\n const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n return new Intl.DateTimeFormat(locale, options).format(date);\n}\n\nexport function formatNoYear (date, locale = 'default', abbreviated = false) {\n const monthFormat = abbreviated ? 'short' : 'long';\n return new Intl.DateTimeFormat(locale, { month: monthFormat, day: 'numeric' }).format(date);\n}\n\nexport function formatNumerical (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n formatLong,\n formatMedium,\n formatShort,\n formatNoYear,\n formatNumerical,\n};\n"],"names":["WEEK_START","MONTH_FORMAT","INTL_MONTH_FORMAT","_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","weekStartsOn","firstDateInCalendar","startOfWeek","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths","_sfc_main","DtButton","DtTooltip","DtStack","DtIcon","getYear","refName","event","initialDate","set","newDate","format","el","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","nextFocusDate","MonthYearPicker","Calendar","formatLong","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","formatNumerical"],"mappings":"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"}
@@ -15,7 +15,6 @@ import "../chunks/link_constants-vIUB92L4.js";
15
15
  import "@dialpad/dialtone-icons/vue2";
16
16
  import "../chunks/icon_constants-OpYAAKwF.js";
17
17
  import "@dialpad/dialtone-icons/icons.json";
18
- import "./skeleton.js";
19
18
  const $ = 0, P = "MMMM", C = "long", f = (t) => t ? new Date(t) : /* @__PURE__ */ new Date(), F = (t, e, a) => {
20
19
  const r = f(JSON.parse(JSON.stringify(t))), n = [];
21
20
  for (let s = 0; s < 7; s++) {
@@ -523,30 +522,30 @@ var V = function() {
523
522
  null,
524
523
  null
525
524
  );
526
- const _e = ee.exports;
527
- function ge(t, e = "default") {
525
+ const ke = ee.exports;
526
+ function _e(t, e = "default") {
528
527
  return new Intl.DateTimeFormat(e, { weekday: "long", year: "numeric", month: "long", day: "numeric" }).format(t);
529
528
  }
530
- function be(t, e = "default") {
529
+ function ge(t, e = "default") {
531
530
  return new Intl.DateTimeFormat(e, { year: "numeric", month: "long", day: "numeric" }).format(t);
532
531
  }
533
- function $e(t, e = "default", a = !0) {
532
+ function be(t, e = "default", a = !0) {
534
533
  const r = a ? { weekday: "short", year: "numeric", month: "short", day: "numeric" } : { year: "numeric", month: "short", day: "numeric" };
535
534
  return new Intl.DateTimeFormat(e, r).format(t);
536
535
  }
537
- function ve(t, e = "default", a = !1) {
536
+ function $e(t, e = "default", a = !1) {
538
537
  const r = a ? "short" : "long";
539
538
  return new Intl.DateTimeFormat(e, { month: r, day: "numeric" }).format(t);
540
539
  }
541
- function Me(t, e = "default") {
540
+ function ve(t, e = "default") {
542
541
  return new Intl.DateTimeFormat(e, { year: "2-digit", month: "2-digit", day: "2-digit" }).format(t);
543
542
  }
544
543
  export {
545
- _e as DtDatepicker,
546
- ge as formatLong,
547
- be as formatMedium,
548
- ve as formatNoYear,
549
- Me as formatNumerical,
550
- $e as formatShort
544
+ ke as DtDatepicker,
545
+ _e as formatLong,
546
+ ge as formatMedium,
547
+ $e as formatNoYear,
548
+ ve as formatNumerical,
549
+ be as formatShort
551
550
  };
552
551
  //# sourceMappingURL=datepicker.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"datepicker.js","sources":["../../components/datepicker/datepicker_constants.js","../../components/datepicker/utils.js","../../components/datepicker/modules/month-year-picker.vue","../../components/datepicker/modules/calendar.vue","../../components/datepicker/datepicker.vue","../../components/datepicker/formatUtils.js"],"sourcesContent":["/**\n * Week start day\n * 0 - Sunday\n * 1 - Monday\n */\nexport const WEEK_START = 0;\n\nexport const MONTH_FORMAT = 'MMMM';\n\nexport const INTL_MONTH_FORMAT = 'long';\n","import {\n startOfWeek, addDays, getMonth, isEqual,\n addMonths, startOfMonth, getDay, getDate,\n subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n const dates = [];\n for (let i = 0; i < 7; i++) {\n const next = addDays(startDate, i);\n const isNext = getMonth(next) !== month;\n dates.push({\n text: next.getDate(),\n value: next,\n currentMonth: !isNext,\n isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n // will be selected if the date is the same as the selected day and is from the current month\n selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n });\n }\n return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n if (!date || !dateToCompare) {\n return false;\n }\n return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n const weeks = [];\n const firstDate = _parsedGetDate(new Date(year, month));\n const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n const weekStartsOn = WEEK_START;\n\n const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n const addDaysToWeek = (date) => {\n const days = getWeekDays(date, month, selectedDay);\n\n weeks.push({ days });\n\n if (\n !weeks[weeks.length - 1].days.some((day) =>\n isDateEqual(day.value, lastDate),\n )\n ) {\n const nextDate = addDays(date, 7);\n addDaysToWeek(nextDate);\n }\n };\n\n addDaysToWeek(firstDateInCalendar);\n\n return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n // Get list in order from sun ... sat\n const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n .slice(0, 2);\n });\n\n // Get days that are in order before specified week start\n const beforeWeekStart = days.slice(0, weekStart);\n // Get days that are in order after specified week start\n const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n // return them in correct order\n return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n const nextMonthDate = addMonths(date, 1);\n const nextMonthStart = startOfMonth(nextMonthDate);\n const nextMonthStartWeekday = getDay(nextMonthStart);\n\n const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n // Add the difference in days to the first day of the next month\n const focusDate = addDays(nextMonthStart, dayDifference);\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n\n // Move to the last day of the previous month\n const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n let focusDate = lastDayOfPrevMonth;\n\n // Adjust to the same weekday in the last week of the previous month\n while (getDay(focusDate) !== currentWeekday) {\n focusDate = addDays(focusDate, -1);\n }\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n","<template>\n <dt-stack\n direction=\"row\"\n class=\"d-datepicker__month-year\"\n gap=\"300\"\n >\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"prevYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevYearButton\"\n :ref=\"refNames[0]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevYearLabel} ${selectYear - 1}`\"\n @click=\"changeYear(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"prevMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevMonthButton\"\n :ref=\"refNames[1]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevMonthLabel} ${formattedMonth(selectMonth - 1)}`\"\n @click=\"changeMonth(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n <div\n id=\"calendar-heading\"\n class=\"d-datepicker__month-year-title\"\n >\n {{ formattedMonth(selectMonth) }}\n\n {{ selectYear }}\n </div>\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"nextMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextMonthButton\"\n :ref=\"refNames[2]\"\n size=\"xs\"\n importance=\"clear\"\n :circle=\"true\"\n kind=\"muted\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextMonthLabel} ${formattedMonth(selectMonth + 1)}`\"\n @click=\"changeMonth(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"nextYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextYearButton\"\n :ref=\"refNames[3]\"\n size=\"xs\"\n kind=\"muted\"\n :circle=\"true\"\n importance=\"clear\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextYearLabel} ${selectYear + 1}`\"\n @click=\"changeYear(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n </dt-stack>\n</template>\n\n<script>\nimport { DtIcon } from '@/components/icon';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport DtStack from '@/components/stack/stack.vue';\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerMonthYearPicker',\n\n components: { DtButton, DtTooltip, DtStack, DtIcon },\n\n props: {\n locale: {\n type: String,\n required: true,\n },\n\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n changeToLabel: {\n type: String,\n required: true,\n },\n\n selectedDate: {\n type: Date,\n required: true,\n },\n },\n\n emits: [\n /**\n * Will retrieve the calendar days of the given date\n *\n * @event calendar-days\n * @type {Array}\n */\n 'calendar-days',\n\n /**\n * Will focus first day in calendar\n *\n * @event focus-first-day\n */\n 'focus-first-day',\n\n /**\n * Will focus last day in calendar\n *\n * @event focus-last-day\n */\n 'focus-last-day',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n selectMonth: getMonth(this.selectedDate),\n selectYear: getYear(this.selectedDate),\n highlightedDay: null,\n focusPicker: 0,\n focusRefs: [],\n refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n };\n },\n\n computed: {\n // Get days for the currently selected month and year and highlight the selected day\n calendarDays () {\n return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n },\n\n formattedMonth () {\n return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.locale);\n },\n },\n\n watch: {\n selectMonth: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n selectYear: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n },\n\n mounted () {\n this.setButtonsRef();\n this.focusMonthYearPicker();\n },\n\n methods: {\n setButtonsRef () {\n this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n },\n\n focusMonthYearPicker () {\n this.focusPicker = 0;\n this.focusRefs[0].$el.focus();\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusPicker === 0) {\n this.focusPicker = 3;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker--;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusPicker === 3) {\n this.focusPicker = 0;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker++;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n highlightDay () {\n const year = getYear(this.selectedDate);\n const month = getMonth(this.selectedDate);\n\n if (year !== this.selectYear || month !== this.selectMonth) {\n this.highlightedDay = null;\n } else {\n this.highlightedDay = getDate(this.selectedDate);\n }\n },\n\n changeMonth (value) {\n // Adjust year when changing from January to December or vice versa\n if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n this.selectYear += value;\n }\n\n // Calculate the new date by adding or subtracting months\n const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n // Update the selected month\n this.selectMonth = getMonth(newDate);\n },\n\n changeYear (value) {\n this.selectYear = this.selectYear + value;\n },\n\n goToNextMonth () {\n this.changeMonth(1);\n },\n\n goToPrevMonth () {\n this.changeMonth(-1);\n },\n },\n};\n</script>\n","<template>\n <table\n class=\"d-datepicker__calendar\"\n aria-labelledby=\"calendar-heading\"\n >\n <thead>\n <tr>\n <th\n v-for=\"day in weekDays\"\n :key=\"day\"\n scope=\"col\"\n class=\"d-datepicker__cell d-datepicker__cell--header\"\n >\n <span\n class=\"d-datepicker__weekday\"\n :title=\"day\"\n :aria-label=\"day\"\n > {{ day }}</span>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n v-for=\"(week, indexWeek) in calendarDays\"\n :key=\"indexWeek\"\n >\n <td\n v-for=\"(day, indexDays) in week.days\"\n :key=\"indexWeek + indexDays\"\n class=\"d-datepicker__cell\"\n role=\"listbox\"\n >\n <dt-button\n :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n class=\"d-datepicker__day\"\n :circle=\"true\"\n size=\"sm\"\n importance=\"clear\"\n :disabled=\"!day.currentMonth\"\n :class=\"{\n 'd-datepicker__day--disabled': !day.currentMonth,\n 'd-datepicker__day--selected': selectedDay\n ? ((day.text === selectedDay) && day.currentMonth)\n : day.selected,\n }\"\n type=\"button\"\n :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n :aria-label=\"dayAriaLabel(day)\"\n role=\"option\"\n @click=\"selectDay(day)\"\n @keydown=\"handleKeyDown($event)\"\n >\n {{ day.text }}\n </dt-button>\n </td>\n </tr>\n </tbody>\n </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate } from '@/components/datepicker/utils';\nimport { WEEK_START, MONTH_FORMAT } from '@/components/datepicker/datepicker_constants.js';\nimport { format, getYear } from 'date-fns';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerCalendar',\n components: { DtButton },\n\n props: {\n calendarDays: {\n type: Array,\n required: true,\n },\n\n locale: {\n type: String,\n required: true,\n },\n\n selectDayLabel: {\n type: String,\n required: true,\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event select-date\n * @type {Date}\n */\n 'select-date',\n\n /**\n * Will focus the month and year picker\n *\n * @event focus-month-year-picker\n */\n 'focus-month-year-picker',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n // local selectedDay to override the received by props calendarDays\n selectedDay: null,\n focusDay: 0,\n daysRef: [],\n };\n },\n\n computed: {\n weekDays () {\n return getWeekDayNames(this.locale, WEEK_START);\n },\n },\n\n watch: {\n calendarDays () {\n // on calendarDays update, reset our local variables\n this.focusDay = 0;\n this.selectedDay = null;\n\n this.daysRef = [];\n\n this.$nextTick(() => {\n this.daysRef = [];\n this.setDayRef();\n });\n },\n },\n\n methods: {\n dayAriaLabel (day) {\n return `${this.selectDayLabel} ${day.text} ${format(day.value, MONTH_FORMAT)} ${getYear(day.value)}`;\n },\n\n setDayRef (el, day) {\n this.calendarDays.forEach((week, weekIndex) => {\n week.days.forEach((day, dayIndex) => {\n const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n const dayButton = this.$refs[refKey];\n if (dayButton && day.currentMonth) {\n this.daysRef.push({ el: dayButton[0], day });\n }\n });\n });\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n this.focusDay -= 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[prevFocusDate - 1].el.$el.focus();\n this.focusDay += prevFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusDay += 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[nextFocusDate - 1].el.$el.focus();\n this.focusDay += nextFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusDay > 0) {\n this.focusDay -= 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month first day, jump to last day of prev month\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.focusLastDay();\n });\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusDay < this.daysRef.length - 1) {\n this.focusDay += 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month last day, jump to first day of next month\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.focusFirstDay();\n });\n }\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-month-year-picker');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n focusFirstDay () {\n this.focusDay = 0;\n this.$nextTick(() => {\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n focusLastDay () {\n this.$nextTick(() => {\n this.focusDay = this.daysRef.length - 1;\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n selectDay (day) {\n if (!day.currentMonth) { return; }\n\n // local selectedDay is updated when a day is selected\n this.selectedDay = day.text;\n this.$emit('select-date', day.value);\n },\n },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-stack\n class=\"d-datepicker\"\n gap=\"400\"\n >\n <div class=\"d-datepicker__hd\">\n <month-year-picker\n ref=\"monthYearPicker\"\n :locale=\"locale\"\n :prev-month-label=\"prevMonthLabel\"\n :next-month-label=\"nextMonthLabel\"\n :prev-year-label=\"prevYearLabel\"\n :next-year-label=\"nextYearLabel\"\n :change-to-label=\"changeToLabel\"\n :selected-date=\"selectedDate\"\n @calendar-days=\"updateCalendarDays\"\n @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n @focus-last-day=\"$refs.calendar.focusLastDay()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n />\n </div>\n <div class=\"d-datepicker__bd\">\n <calendar\n ref=\"calendar\"\n :locale=\"locale\"\n :calendar-days=\"calendarDays\"\n :select-day-label=\"selectDayLabel\"\n @select-date=\"$emit('selected-date', $event)\"\n @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n />\n </div>\n </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport DtStack from '@/components/stack/stack.vue';\n\nexport default {\n name: 'DtDatepicker',\n\n components: { DtStack, MonthYearPicker, Calendar },\n\n props: {\n /**\n * Label for the previous month button\n *\n * @type {String}\n * @example 'Previous month'\n */\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next month button\n *\n * @type {String}\n * @example 'Next month'\n */\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the previous year button\n *\n * @type {String}\n * @example 'Previous year'\n */\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next year button\n *\n * @type {String}\n * @example 'Next year'\n */\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the select day button\n *\n * @type {String}\n * @example 'Select day'\n */\n selectDayLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the change to button\n *\n * @type {String}\n * @example 'Change to'\n */\n changeToLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Locale for the calendar\n *\n * @type {String}\n */\n locale: {\n type: String,\n default: 'en-US',\n },\n\n /**\n * Selected date\n *\n * @type {Date}\n */\n selectedDate: {\n type: Date,\n default: () => (new Date()),\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event selected-date\n * @type {Date}\n */\n 'selected-date',\n\n /**\n * Event fired when user presses the esc key\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n calendarDays: [],\n };\n },\n\n methods: {\n updateCalendarDays (days) {\n this.calendarDays = days;\n },\n },\n};\n</script>\n","export function formatLong (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatMedium (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatShort (date, locale = 'default', showWeekday = true) {\n const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n return new Intl.DateTimeFormat(locale, options).format(date);\n}\n\nexport function formatNoYear (date, locale = 'default', abbreviated = false) {\n const monthFormat = abbreviated ? 'short' : 'long';\n return new Intl.DateTimeFormat(locale, { month: monthFormat, day: 'numeric' }).format(date);\n}\n\nexport function formatNumerical (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n formatLong,\n formatMedium,\n formatShort,\n formatNoYear,\n formatNumerical,\n};\n"],"names":["WEEK_START","MONTH_FORMAT","INTL_MONTH_FORMAT","_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","firstDateInCalendar","startOfWeek","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths","_sfc_main","DtButton","DtTooltip","DtStack","DtIcon","getYear","refName","event","initialDate","set","newDate","format","el","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","nextFocusDate","MonthYearPicker","Calendar","formatLong","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","formatNumerical"],"mappings":"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"}
1
+ {"version":3,"file":"datepicker.js","sources":["../../components/datepicker/datepicker_constants.js","../../components/datepicker/utils.js","../../components/datepicker/modules/month-year-picker.vue","../../components/datepicker/modules/calendar.vue","../../components/datepicker/datepicker.vue","../../components/datepicker/formatUtils.js"],"sourcesContent":["/**\n * Week start day\n * 0 - Sunday\n * 1 - Monday\n */\nexport const WEEK_START = 0;\n\nexport const MONTH_FORMAT = 'MMMM';\n\nexport const INTL_MONTH_FORMAT = 'long';\n","import {\n startOfWeek, addDays, getMonth, isEqual,\n addMonths, startOfMonth, getDay, getDate,\n subMonths, endOfMonth,\n} from 'date-fns';\nimport { WEEK_START } from '@/components/datepicker/datepicker_constants.js';\n\nconst _parsedGetDate = (value) => (value ? new Date(value) : new Date());\n\n/**\n * Get 7 days from the provided start date, month is used to check\n * whether the date is from the specified month or in the offset\n */\nconst getWeekDays = (startDay, month, selectedDay) => {\n const startDate = _parsedGetDate(JSON.parse(JSON.stringify(startDay)));\n const dates = [];\n for (let i = 0; i < 7; i++) {\n const next = addDays(startDate, i);\n const isNext = getMonth(next) !== month;\n dates.push({\n text: next.getDate(),\n value: next,\n currentMonth: !isNext,\n isFirstDayOfMonth: next.getDate() === 1 && !isNext,\n // will be selected if the date is the same as the selected day and is from the current month\n selected: selectedDay ? (next.getDate() === selectedDay && !isNext) : false,\n });\n }\n return dates;\n};\n\nconst isDateEqual = (date, dateToCompare) => {\n if (!date || !dateToCompare) {\n return false;\n }\n return isEqual(date, dateToCompare);\n};\n\n/**\n * Get days for the calendar to be displayed in a table grouped by weeks\n */\nexport const getCalendarDays = (month, year, selectedDay) => {\n const weeks = [];\n const firstDate = _parsedGetDate(new Date(year, month));\n const lastDate = _parsedGetDate(new Date(year, month + 1, 0));\n\n const weekStartsOn = WEEK_START;\n\n const firstDateInCalendar = startOfWeek(firstDate, { weekStartsOn });\n\n const addDaysToWeek = (date) => {\n const days = getWeekDays(date, month, selectedDay);\n\n weeks.push({ days });\n\n if (\n !weeks[weeks.length - 1].days.some((day) =>\n isDateEqual(day.value, lastDate),\n )\n ) {\n const nextDate = addDays(date, 7);\n addDaysToWeek(nextDate);\n }\n };\n\n addDaysToWeek(firstDateInCalendar);\n\n return weeks;\n};\n\n/**\n * Generate week day names based on locale and in order specified in week start\n */\nexport const getWeekDayNames = (locale, weekStart) => {\n // Get list in order from sun ... sat\n const days = [1, 2, 3, 4, 5, 6, 7].map((day) => {\n return new Intl.DateTimeFormat(locale, { weekday: 'short', timeZone: 'UTC' })\n .format(new Date(`2017-01-0${day}T00:00:00+00:00`))\n .slice(0, 2);\n });\n\n // Get days that are in order before specified week start\n const beforeWeekStart = days.slice(0, weekStart);\n // Get days that are in order after specified week start\n const afterWeekStart = days.slice(weekStart + 1, days.length);\n\n // return them in correct order\n return [days[weekStart]].concat(...afterWeekStart).concat(...beforeWeekStart);\n};\n\nexport const formatMonth = (month, monthFormat, locale) => {\n return new Intl.DateTimeFormat(locale, { month: monthFormat }).format(new Date(2000, month, 1));\n};\n\nexport const calculateNextFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n const nextMonthDate = addMonths(date, 1);\n const nextMonthStart = startOfMonth(nextMonthDate);\n const nextMonthStartWeekday = getDay(nextMonthStart);\n\n const dayDifference = (currentWeekday - nextMonthStartWeekday + 7) % 7;\n\n // Add the difference in days to the first day of the next month\n const focusDate = addDays(nextMonthStart, dayDifference);\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n\nexport const calculatePrevFocusDate = (currentDate) => {\n const date = new Date(currentDate);\n const currentWeekday = getDay(date);\n\n // Move to the last day of the previous month\n const lastDayOfPrevMonth = endOfMonth(subMonths(date, 1));\n let focusDate = lastDayOfPrevMonth;\n\n // Adjust to the same weekday in the last week of the previous month\n while (getDay(focusDate) !== currentWeekday) {\n focusDate = addDays(focusDate, -1);\n }\n\n // Returns only the day of the month\n return getDate(focusDate);\n};\n","<template>\n <dt-stack\n direction=\"row\"\n class=\"d-datepicker__month-year\"\n gap=\"300\"\n >\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"prevYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevYearButton\"\n :ref=\"refNames[0]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevYearLabel} ${selectYear - 1}`\"\n @click=\"changeYear(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"prevMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"prevMonthButton\"\n :ref=\"refNames[1]\"\n size=\"xs\"\n importance=\"clear\"\n kind=\"muted\"\n :circle=\"true\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${prevMonthLabel} ${formattedMonth(selectMonth - 1)}`\"\n @click=\"changeMonth(-1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-left\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n <div\n id=\"calendar-heading\"\n class=\"d-datepicker__month-year-title\"\n >\n {{ formattedMonth(selectMonth) }}\n\n {{ selectYear }}\n </div>\n <dt-stack\n as=\"nav\"\n direction=\"row\"\n gap=\"200\"\n class=\"d-datepicker__nav\"\n >\n <dt-tooltip\n :message=\"nextMonthLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextMonthButton\"\n :ref=\"refNames[2]\"\n size=\"xs\"\n importance=\"clear\"\n :circle=\"true\"\n kind=\"muted\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextMonthLabel} ${formattedMonth(selectMonth + 1)}`\"\n @click=\"changeMonth(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevron-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n <dt-tooltip\n :message=\"nextYearLabel\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n id=\"nextYearButton\"\n :ref=\"refNames[3]\"\n size=\"xs\"\n kind=\"muted\"\n :circle=\"true\"\n importance=\"clear\"\n class=\"d-datepicker__nav-btn\"\n type=\"button\"\n :aria-label=\"`${changeToLabel} ${nextYearLabel} ${selectYear + 1}`\"\n @click=\"changeYear(1)\"\n @keydown=\"handleKeyDown($event)\"\n >\n <dt-icon\n name=\"chevrons-right\"\n size=\"200\"\n />\n </dt-button>\n </template>\n </dt-tooltip>\n </dt-stack>\n </dt-stack>\n</template>\n\n<script>\nimport { DtIcon } from '@/components/icon';\nimport { getYear, addMonths, getMonth, set, subMonths, getDate } from 'date-fns';\nimport { getCalendarDays, formatMonth } from '../utils';\nimport { INTL_MONTH_FORMAT } from '../datepicker_constants';\nimport DtStack from '@/components/stack/stack.vue';\nimport DtTooltip from '@/components/tooltip/tooltip.vue';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerMonthYearPicker',\n\n components: { DtButton, DtTooltip, DtStack, DtIcon },\n\n props: {\n locale: {\n type: String,\n required: true,\n },\n\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n changeToLabel: {\n type: String,\n required: true,\n },\n\n selectedDate: {\n type: Date,\n required: true,\n },\n },\n\n emits: [\n /**\n * Will retrieve the calendar days of the given date\n *\n * @event calendar-days\n * @type {Array}\n */\n 'calendar-days',\n\n /**\n * Will focus first day in calendar\n *\n * @event focus-first-day\n */\n 'focus-first-day',\n\n /**\n * Will focus last day in calendar\n *\n * @event focus-last-day\n */\n 'focus-last-day',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n selectMonth: getMonth(this.selectedDate),\n selectYear: getYear(this.selectedDate),\n highlightedDay: null,\n focusPicker: 0,\n focusRefs: [],\n refNames: ['prevYearButtonRef', 'prevMonthButtonRef', 'nextMonthButtonRef', 'nextYearButtonRef'],\n };\n },\n\n computed: {\n // Get days for the currently selected month and year and highlight the selected day\n calendarDays () {\n return getCalendarDays(this.selectMonth, this.selectYear, this.highlightedDay);\n },\n\n formattedMonth () {\n return (month) => formatMonth(month, INTL_MONTH_FORMAT, this.locale);\n },\n },\n\n watch: {\n selectMonth: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n selectYear: {\n handler () {\n this.highlightDay();\n this.$emit('calendar-days', this.calendarDays);\n },\n\n immediate: true,\n },\n\n },\n\n mounted () {\n this.setButtonsRef();\n this.focusMonthYearPicker();\n },\n\n methods: {\n setButtonsRef () {\n this.focusRefs = this.refNames.map(refName => this.$refs[refName]);\n },\n\n focusMonthYearPicker () {\n this.focusPicker = 0;\n this.focusRefs[0].$el.focus();\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusPicker === 0) {\n this.focusPicker = 3;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker--;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusPicker === 3) {\n this.focusPicker = 0;\n this.focusRefs[this.focusPicker].$el.focus();\n } else {\n this.focusPicker++;\n this.focusRefs[this.focusPicker].$el.focus();\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-first-day');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n highlightDay () {\n const year = getYear(this.selectedDate);\n const month = getMonth(this.selectedDate);\n\n if (year !== this.selectYear || month !== this.selectMonth) {\n this.highlightedDay = null;\n } else {\n this.highlightedDay = getDate(this.selectedDate);\n }\n },\n\n changeMonth (value) {\n // Adjust year when changing from January to December or vice versa\n if ((this.selectMonth === 0 && value === -1) || (this.selectMonth === 11 && value === 1)) {\n this.selectYear += value;\n }\n\n // Calculate the new date by adding or subtracting months\n const initialDate = set(this.selectedDate, { month: this.selectMonth, year: this.selectYear });\n const newDate = value === 1 ? addMonths(initialDate, 1) : subMonths(initialDate, 1);\n\n // Update the selected month\n this.selectMonth = getMonth(newDate);\n },\n\n changeYear (value) {\n this.selectYear = this.selectYear + value;\n },\n\n goToNextMonth () {\n this.changeMonth(1);\n },\n\n goToPrevMonth () {\n this.changeMonth(-1);\n },\n },\n};\n</script>\n","<template>\n <table\n class=\"d-datepicker__calendar\"\n aria-labelledby=\"calendar-heading\"\n >\n <thead>\n <tr>\n <th\n v-for=\"day in weekDays\"\n :key=\"day\"\n scope=\"col\"\n class=\"d-datepicker__cell d-datepicker__cell--header\"\n >\n <span\n class=\"d-datepicker__weekday\"\n :title=\"day\"\n :aria-label=\"day\"\n > {{ day }}</span>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n v-for=\"(week, indexWeek) in calendarDays\"\n :key=\"indexWeek\"\n >\n <td\n v-for=\"(day, indexDays) in week.days\"\n :key=\"indexWeek + indexDays\"\n class=\"d-datepicker__cell\"\n role=\"listbox\"\n >\n <dt-button\n :ref=\"`buttonRef_${indexWeek}_${indexDays}`\"\n class=\"d-datepicker__day\"\n :circle=\"true\"\n size=\"sm\"\n importance=\"clear\"\n :disabled=\"!day.currentMonth\"\n :class=\"{\n 'd-datepicker__day--disabled': !day.currentMonth,\n 'd-datepicker__day--selected': selectedDay\n ? ((day.text === selectedDay) && day.currentMonth)\n : day.selected,\n }\"\n type=\"button\"\n :aria-selected=\"!!selectedDay ? ((day.text === selectedDay) && day.currentMonth) : day.selected\"\n :aria-label=\"dayAriaLabel(day)\"\n role=\"option\"\n @click=\"selectDay(day)\"\n @keydown=\"handleKeyDown($event)\"\n >\n {{ day.text }}\n </dt-button>\n </td>\n </tr>\n </tbody>\n </table>\n</template>\n\n<script>\nimport { getWeekDayNames, calculateNextFocusDate, calculatePrevFocusDate } from '@/components/datepicker/utils';\nimport { WEEK_START, MONTH_FORMAT } from '@/components/datepicker/datepicker_constants.js';\nimport { format, getYear } from 'date-fns';\nimport DtButton from '@/components/button/button.vue';\n\nexport default {\n name: 'DtDatepickerCalendar',\n components: { DtButton },\n\n props: {\n calendarDays: {\n type: Array,\n required: true,\n },\n\n locale: {\n type: String,\n required: true,\n },\n\n selectDayLabel: {\n type: String,\n required: true,\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event select-date\n * @type {Date}\n */\n 'select-date',\n\n /**\n * Will focus the month and year picker\n *\n * @event focus-month-year-picker\n */\n 'focus-month-year-picker',\n\n /**\n * Will close the datepicker\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n // local selectedDay to override the received by props calendarDays\n selectedDay: null,\n focusDay: 0,\n daysRef: [],\n };\n },\n\n computed: {\n weekDays () {\n return getWeekDayNames(this.locale, WEEK_START);\n },\n },\n\n watch: {\n calendarDays () {\n // on calendarDays update, reset our local variables\n this.focusDay = 0;\n this.selectedDay = null;\n\n this.daysRef = [];\n\n this.$nextTick(() => {\n this.daysRef = [];\n this.setDayRef();\n });\n },\n },\n\n methods: {\n dayAriaLabel (day) {\n return `${this.selectDayLabel} ${day.text} ${format(day.value, MONTH_FORMAT)} ${getYear(day.value)}`;\n },\n\n setDayRef (el, day) {\n this.calendarDays.forEach((week, weekIndex) => {\n week.days.forEach((day, dayIndex) => {\n const refKey = `buttonRef_${weekIndex}_${dayIndex}`;\n const dayButton = this.$refs[refKey];\n if (dayButton && day.currentMonth) {\n this.daysRef.push({ el: dayButton[0], day });\n }\n });\n });\n },\n\n handleKeyDown (event) {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n this.focusDay -= 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const prevFocusDate = calculatePrevFocusDate(this.daysRef[this.focusDay + 7].day.value);\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[prevFocusDate - 1].el.$el.focus();\n this.focusDay += prevFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusDay += 7;\n try {\n this.daysRef[this.focusDay].el.$el.focus();\n } catch (error) {\n const nextFocusDate = calculateNextFocusDate(this.daysRef[this.focusDay - 7].day.value);\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.setDayRef();\n this.daysRef[nextFocusDate - 1].el.$el.focus();\n this.focusDay += nextFocusDate - 1;\n });\n }\n break;\n\n case 'ArrowLeft':\n event.preventDefault();\n if (this.focusDay > 0) {\n this.focusDay -= 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month first day, jump to last day of prev month\n this.$emit('go-to-prev-month');\n this.$nextTick(() => {\n this.focusLastDay();\n });\n }\n break;\n\n case 'ArrowRight':\n event.preventDefault();\n if (this.focusDay < this.daysRef.length - 1) {\n this.focusDay += 1;\n this.daysRef[this.focusDay].el.$el.focus();\n } else {\n // if we are on month last day, jump to first day of next month\n this.$emit('go-to-next-month');\n this.$nextTick(() => {\n this.focusFirstDay();\n });\n }\n break;\n\n case 'Tab':\n event.preventDefault();\n this.$emit('focus-month-year-picker');\n break;\n\n case 'Escape':\n this.$emit('close-datepicker');\n break;\n }\n },\n\n focusFirstDay () {\n this.focusDay = 0;\n this.$nextTick(() => {\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n focusLastDay () {\n this.$nextTick(() => {\n this.focusDay = this.daysRef.length - 1;\n this.daysRef[this.focusDay].el.$el.focus();\n });\n },\n\n selectDay (day) {\n if (!day.currentMonth) { return; }\n\n // local selectedDay is updated when a day is selected\n this.selectedDay = day.text;\n this.$emit('select-date', day.value);\n },\n },\n};\n</script>\n","<!-- eslint-disable vue/multi-word-component-names -->\n<template>\n <dt-stack\n class=\"d-datepicker\"\n gap=\"400\"\n >\n <div class=\"d-datepicker__hd\">\n <month-year-picker\n ref=\"monthYearPicker\"\n :locale=\"locale\"\n :prev-month-label=\"prevMonthLabel\"\n :next-month-label=\"nextMonthLabel\"\n :prev-year-label=\"prevYearLabel\"\n :next-year-label=\"nextYearLabel\"\n :change-to-label=\"changeToLabel\"\n :selected-date=\"selectedDate\"\n @calendar-days=\"updateCalendarDays\"\n @focus-first-day=\"$refs.calendar.focusFirstDay()\"\n @focus-last-day=\"$refs.calendar.focusLastDay()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n />\n </div>\n <div class=\"d-datepicker__bd\">\n <calendar\n ref=\"calendar\"\n :locale=\"locale\"\n :calendar-days=\"calendarDays\"\n :select-day-label=\"selectDayLabel\"\n @select-date=\"$emit('selected-date', $event)\"\n @focus-month-year-picker=\"$refs.monthYearPicker.focusMonthYearPicker()\"\n @close-datepicker=\"$emit('close-datepicker')\"\n @go-to-next-month=\"$refs.monthYearPicker.goToNextMonth()\"\n @go-to-prev-month=\"$refs.monthYearPicker.goToPrevMonth()\"\n />\n </div>\n </dt-stack>\n</template>\n\n<script>\nimport MonthYearPicker from './modules/month-year-picker.vue';\nimport Calendar from './modules/calendar.vue';\nimport DtStack from '@/components/stack/stack.vue';\n\nexport default {\n name: 'DtDatepicker',\n\n components: { DtStack, MonthYearPicker, Calendar },\n\n props: {\n /**\n * Label for the previous month button\n *\n * @type {String}\n * @example 'Previous month'\n */\n prevMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next month button\n *\n * @type {String}\n * @example 'Next month'\n */\n nextMonthLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the previous year button\n *\n * @type {String}\n * @example 'Previous year'\n */\n prevYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the next year button\n *\n * @type {String}\n * @example 'Next year'\n */\n nextYearLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the select day button\n *\n * @type {String}\n * @example 'Select day'\n */\n selectDayLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Label for the change to button\n *\n * @type {String}\n * @example 'Change to'\n */\n changeToLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Locale for the calendar\n *\n * @type {String}\n */\n locale: {\n type: String,\n default: 'en-US',\n },\n\n /**\n * Selected date\n *\n * @type {Date}\n */\n selectedDate: {\n type: Date,\n default: () => (new Date()),\n },\n },\n\n emits: [\n /**\n * Event fired when a date is selected\n *\n * @event selected-date\n * @type {Date}\n */\n 'selected-date',\n\n /**\n * Event fired when user presses the esc key\n *\n * @event close-datepicker\n */\n 'close-datepicker',\n ],\n\n data () {\n return {\n calendarDays: [],\n };\n },\n\n methods: {\n updateCalendarDays (days) {\n this.calendarDays = days;\n },\n },\n};\n</script>\n","export function formatLong (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatMedium (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', day: 'numeric' }).format(date);\n}\n\nexport function formatShort (date, locale = 'default', showWeekday = true) {\n const options = showWeekday ? { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' } : { year: 'numeric', month: 'short', day: 'numeric' };\n return new Intl.DateTimeFormat(locale, options).format(date);\n}\n\nexport function formatNoYear (date, locale = 'default', abbreviated = false) {\n const monthFormat = abbreviated ? 'short' : 'long';\n return new Intl.DateTimeFormat(locale, { month: monthFormat, day: 'numeric' }).format(date);\n}\n\nexport function formatNumerical (date, locale = 'default') {\n return new Intl.DateTimeFormat(locale, { year: '2-digit', month: '2-digit', day: '2-digit' }).format(date);\n}\n\nexport default {\n formatLong,\n formatMedium,\n formatShort,\n formatNoYear,\n formatNumerical,\n};\n"],"names":["WEEK_START","MONTH_FORMAT","INTL_MONTH_FORMAT","_parsedGetDate","value","getWeekDays","startDay","month","selectedDay","startDate","dates","i","next","addDays","isNext","getMonth","isDateEqual","date","dateToCompare","isEqual","getCalendarDays","year","weeks","firstDate","lastDate","firstDateInCalendar","startOfWeek","addDaysToWeek","days","day","nextDate","getWeekDayNames","locale","weekStart","beforeWeekStart","afterWeekStart","formatMonth","monthFormat","calculateNextFocusDate","currentDate","currentWeekday","getDay","nextMonthDate","addMonths","nextMonthStart","startOfMonth","nextMonthStartWeekday","dayDifference","focusDate","getDate","calculatePrevFocusDate","endOfMonth","subMonths","_sfc_main","DtButton","DtTooltip","DtStack","DtIcon","getYear","refName","event","initialDate","set","newDate","format","el","week","weekIndex","dayIndex","refKey","dayButton","prevFocusDate","nextFocusDate","MonthYearPicker","Calendar","formatLong","formatMedium","formatShort","showWeekday","options","formatNoYear","abbreviated","formatNumerical"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("date-fns"),u=require("./utils.cjs");require("./constants.cjs");require("vue");let n;function a(e,t){return i(),r.format(e,t,{locale:n})}function l(e,t){return i(),r.formatDuration(e,{locale:n,format:t})}function c(e,t){return i(),r.formatDistance(e,t,{locale:n})}function s(){return n!==void 0}function i(){if(!s())throw new Error("Locale not set, please call setDateLocale(locale) and pass in a datefns locale object as the locale param before calling this function")}function f(e){n=e}function M(e){return a(e,"MMMM d, y")}function m(e){if(e<60)return c(0,29*1e3);const t=r.intervalToDuration({start:0,end:e*1e3});return l(t,["hours","minutes"])}function o(e){const t=new Intl.RelativeTimeFormat(n.code,{numeric:"auto"});return u.capitalizeFirstLetter(t.formatToParts(e,"day")[0].value,n.code)}function d(e){return r.isToday(e)?o(0):r.isYesterday(e)?o(-1):r.isThisWeek(e)?a(e,"EEEE"):r.isThisYear(e)?a(e,"EEEE, MMMM d"):a(e,"MMMM d, y")}exports.durationInHHMM=m;exports.getDateMedium=M;exports.relativeDate=d;exports.setDateLocale=f;
2
+ //# sourceMappingURL=dates.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dates.cjs","sources":["../../common/dates/index.js"],"sourcesContent":["import {\n format,\n formatDuration,\n intervalToDuration,\n formatDistance,\n isToday,\n isYesterday,\n isThisWeek,\n isThisYear,\n} from 'date-fns';\nimport { capitalizeFirstLetter } from '../utils';\n\nlet dialtoneLocale;\n\n// Base functions just wrap core date-fns functions, but this allows us to do checks and set default options.\n\nfunction _baseFormat (date, formatString) {\n _checkLocaleSet();\n return format(date, formatString, {\n locale: dialtoneLocale,\n });\n}\n\nfunction _baseFormatDuration (duration, formatString) {\n _checkLocaleSet();\n return formatDuration(duration, {\n locale: dialtoneLocale,\n format: formatString,\n });\n}\n\nfunction _baseFormatDistance (date, baseDate) {\n _checkLocaleSet();\n return formatDistance(date, baseDate, {\n locale: dialtoneLocale,\n });\n}\n\nfunction _isLocaleSet () {\n return dialtoneLocale !== undefined;\n}\n\nfunction _checkLocaleSet () {\n if (!_isLocaleSet()) {\n throw new Error('Locale not set, please call setDateLocale(locale) and pass ' +\n 'in a datefns locale object as the locale param before calling this function');\n }\n}\n\n/**\n * Sets the locale for date-fns. This should be called before any date-fns functions are called.\n * @param {Locale} locale A date-fns locale object\n */\nexport function setDateLocale (locale) {\n dialtoneLocale = locale;\n}\n\n/**\n * This formats a date to the Dialtone standard medium date format as shown here:\n * https://dialtone.dialpad.com/guides/writing-guidelines/#formats-by-length\n * @param {Date} date A javascript date object\n * @returns {string} A string in the format of 'September 2, 2022'\n */\nexport function getDateMedium (date) {\n return _baseFormat(date, 'MMMM d, y');\n}\n\n/**\n * Converts a call duration in total number of seconds to a human readable string\n * such as 'less than a minute' or '4 hours 34 minutes'.\n * @param {number} durationInSeconds The duration of the call in seconds\n * @returns {string} A human readable string representing the duration of the call\n */\nexport function durationInHHMM (durationInSeconds) {\n if (durationInSeconds < 60) {\n // returns 'less than a minute', we're doing it like this instead of returning a string\n // so datefns handles i18n.\n return _baseFormatDistance(0, 29 * 1000);\n }\n const duration = intervalToDuration({\n start: 0,\n end: durationInSeconds * 1000,\n });\n return _baseFormatDuration(duration, ['hours', 'minutes']);\n}\n\n/**\n * gets the human readable name of the day relative to the current time. For example, if you pass in -1 it will\n * say \"Yesterday\" if you pass in 0 it will say \"Today\", if you pass in 1 it will say \"Tomorrow\".\n * @param {number} days The number of days relative to the current time\n * @returns {string} A human readable string representing the distance between the date and now\n */\nfunction _getRelativeDaysText (days) {\n const rtl = new Intl.RelativeTimeFormat(dialtoneLocale.code, { numeric: 'auto' });\n return capitalizeFirstLetter(rtl.formatToParts(days, 'day')[0].value, dialtoneLocale.code);\n}\n\n/**\n * Returns the distance between the passed in date and now in a human readable format, typically used\n * when showing a history of items in a log such as a feed list.\n *\n * datefns does not support 'today' and 'yesterday' without showing time so we use Intl for these cases.\n *\n * examples below to explain\n * the different potential formats:\n *\n * If current day:\n * Today\n *\n * If previous day:\n * Yesterday\n *\n * Older than yesterday, but in the same calendar week:\n * Monday\n *\n * Older than the most recent calendar week, but in the same year:\n * Monday, October 14\n *\n * older than a calendar year:\n * October 14, 2022\n *\n *\n * @param {Date} date The timestamp of the item's date\n * @returns {string} A human readable string representing the distance between the date and now\n */\nexport function relativeDate (date) {\n if (isToday(date)) {\n return _getRelativeDaysText(0);\n } else if (isYesterday(date)) {\n return _getRelativeDaysText(-1);\n } else if (isThisWeek(date)) {\n return _baseFormat(date, 'EEEE');\n } else if (isThisYear(date)) {\n return _baseFormat(date, 'EEEE, MMMM d');\n } else {\n return _baseFormat(date, 'MMMM d, y');\n }\n}\n"],"names":["dialtoneLocale","_baseFormat","date","formatString","_checkLocaleSet","format","_baseFormatDuration","duration","formatDuration","_baseFormatDistance","baseDate","formatDistance","_isLocaleSet","setDateLocale","locale","getDateMedium","durationInHHMM","durationInSeconds","intervalToDuration","_getRelativeDaysText","days","rtl","capitalizeFirstLetter","relativeDate","isToday","isYesterday","isThisWeek","isThisYear"],"mappings":"+KAYA,IAAIA,EAIJ,SAASC,EAAaC,EAAMC,EAAc,CACxC,OAAAC,IACOC,EAAM,OAACH,EAAMC,EAAc,CAChC,OAAQH,CACZ,CAAG,CACH,CAEA,SAASM,EAAqBC,EAAUJ,EAAc,CACpD,OAAAC,IACOI,EAAAA,eAAeD,EAAU,CAC9B,OAAQP,EACR,OAAQG,CACZ,CAAG,CACH,CAEA,SAASM,EAAqBP,EAAMQ,EAAU,CAC5C,OAAAN,IACOO,EAAc,eAACT,EAAMQ,EAAU,CACpC,OAAQV,CACZ,CAAG,CACH,CAEA,SAASY,GAAgB,CACvB,OAAOZ,IAAmB,MAC5B,CAEA,SAASI,GAAmB,CAC1B,GAAI,CAACQ,EAAY,EACf,MAAM,IAAI,MAAM,wIAC6D,CAEjF,CAMO,SAASC,EAAeC,EAAQ,CACrCd,EAAiBc,CACnB,CAQO,SAASC,EAAeb,EAAM,CACnC,OAAOD,EAAYC,EAAM,WAAW,CACtC,CAQO,SAASc,EAAgBC,EAAmB,CACjD,GAAIA,EAAoB,GAGtB,OAAOR,EAAoB,EAAG,GAAK,GAAI,EAEzC,MAAMF,EAAWW,EAAAA,mBAAmB,CAClC,MAAO,EACP,IAAKD,EAAoB,GAC7B,CAAG,EACD,OAAOX,EAAoBC,EAAU,CAAC,QAAS,SAAS,CAAC,CAC3D,CAQA,SAASY,EAAsBC,EAAM,CACnC,MAAMC,EAAM,IAAI,KAAK,mBAAmBrB,EAAe,KAAM,CAAE,QAAS,MAAM,CAAE,EAChF,OAAOsB,wBAAsBD,EAAI,cAAcD,EAAM,KAAK,EAAE,CAAC,EAAE,MAAOpB,EAAe,IAAI,CAC3F,CA8BO,SAASuB,EAAcrB,EAAM,CAClC,OAAIsB,EAAAA,QAAQtB,CAAI,EACPiB,EAAqB,CAAC,EACpBM,EAAAA,YAAYvB,CAAI,EAClBiB,EAAqB,EAAE,EACrBO,EAAAA,WAAWxB,CAAI,EACjBD,EAAYC,EAAM,MAAM,EACtByB,EAAAA,WAAWzB,CAAI,EACjBD,EAAYC,EAAM,cAAc,EAEhCD,EAAYC,EAAM,WAAW,CAExC"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../chunks/stack_constants-m9Ickqw0.js"),a=require("../chunks/_plugin-vue2_normalizer-ZK80B3OL.js"),i=["row","column"],l=t=>t.term?typeof t.term=="string":!1,d=t=>t.description?typeof t.description=="string":!1,o=t=>Array.isArray(t)?t.every(r=>!(typeof r!="object"||!l(r)||!d(r))):!1,c={name:"DtDescriptionList",props:{direction:{type:String,default:"row",validator:t=>i.includes(t)},items:{type:Array,default:()=>[],validator:t=>o(t),required:!0},gap:{type:String,default:"400",validator:t=>n.b.includes(t)},termClass:{type:[String,Array,Object],default:""},descriptionClass:{type:[String,Array,Object],default:""}},computed:{dtClass(){return["dt-description-list__term",this.termClass]},ddClass(){return["dt-description-list__description",this.descriptionClass]},getDirectionClass(){return`dt-description-list--${this.direction}`},getGapClass(){return`dt-description-list--gap-${this.gap}`}}};var u=function(){var r=this,s=r._self._c;return s("dl",{class:["dt-description-list",r.getDirectionClass,r.getGapClass]},[r._l(r.items,function(e){return[s("dt",{key:`dt-${e.term}`,class:r.dtClass},[r._v(" "+r._s(e.term)+" ")]),s("dd",{key:`dd-${e.term}`,class:r.ddClass},[r._v(" "+r._s(e.description)+" ")])]})],2)},p=[],_=a.n(c,u,p,!1,null,null,null,null);const f=_.exports;exports.DT_DESCRIPTION_LIST_DIRECTION=i;exports.DtDescriptionList=f;
2
+ //# sourceMappingURL=description-list.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"description-list.cjs","sources":["../../components/description_list/description_list_constants.js","../../components/description_list/description_list_validators.js","../../components/description_list/description_list.vue"],"sourcesContent":["export const DT_DESCRIPTION_LIST_DIRECTION = ['row', 'column'];\n","const hasValidTerm = item => {\n if (!item.term) {\n return false;\n }\n\n return typeof item.term === 'string';\n};\n\nconst hasValidDescription = item => {\n if (!item.description) {\n return false;\n }\n\n return typeof item.description === 'string';\n};\n\nexport const itemsValidator = items => {\n if (!Array.isArray(items)) {\n return false;\n }\n\n return items.every(item => {\n if (typeof item !== 'object') {\n return false;\n }\n\n if (!hasValidTerm(item)) {\n return false;\n }\n\n if (!hasValidDescription(item)) {\n return false;\n }\n\n return true;\n });\n};\n","<template>\n <dl :class=\"['dt-description-list', getDirectionClass, getGapClass]\">\n <template\n v-for=\"item in items\"\n >\n <dt\n :key=\"`dt-${item.term}`\"\n :class=\"dtClass\"\n >\n {{ item.term }}\n </dt>\n <dd\n :key=\"`dd-${item.term}`\"\n :class=\"ddClass\"\n >\n {{ item.description }}\n </dd>\n </template>\n </dl>\n</template>\n\n<script>\nimport { DT_STACK_GAP } from '../stack/stack_constants';\nimport { DT_DESCRIPTION_LIST_DIRECTION } from './description_list_constants';\nimport { itemsValidator } from './description_list_validators';\n\nexport default {\n name: 'DtDescriptionList',\n\n props: {\n /**\n * The direction for the list\n * @values row, column\n */\n direction: {\n type: String,\n default: 'row',\n validator: direction => DT_DESCRIPTION_LIST_DIRECTION.includes(direction),\n },\n\n /**\n * A list of items that represent the term and the description\n */\n items: {\n type: Array,\n default: () => [],\n validator: items => itemsValidator(items),\n required: true,\n },\n\n /**\n * Set the space between the elements\n * @values 0, 100, 200, 300, 400, 500, 600\n */\n gap: {\n type: String,\n default: '400',\n validator: (gap) => DT_STACK_GAP.includes(gap),\n },\n\n /**\n * Used to customize the term element\n */\n termClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Used to customize the description element\n */\n descriptionClass: {\n type: [String, Array, Object],\n default: '',\n },\n },\n\n computed: {\n dtClass () {\n return ['dt-description-list__term', this.termClass];\n },\n\n ddClass () {\n return ['dt-description-list__description', this.descriptionClass];\n },\n\n getDirectionClass () {\n return `dt-description-list--${this.direction}`;\n },\n\n getGapClass () {\n return `dt-description-list--gap-${this.gap}`;\n },\n },\n};\n</script>\n\n<style lang=\"less\">\n.dt-description-list {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n flex-direction: row;\n line-height: var(--dt-font-line-height-300);\n font-size: var(--dt-font-size-100);\n --description-list-gap: var(--dt-space-400);\n gap: var(--description-list-gap);\n each(range(0, 600, 100), {\n &--gap-@{value} {\n --description-list-gap: ~\"var(--dt-space-@{value})\";\n }\n });\n &--column {\n flex-direction: column;\n }\n &__term {\n color: var(--dt-color-foreground-tertiary);\n flex: 0 1 40%;\n }\n &__description {\n color: var(--dt-color-foreground-primary);\n flex: 1 1 50%;\n margin-left: 0;\n }\n}\n</style>\n"],"names":["DT_DESCRIPTION_LIST_DIRECTION","hasValidTerm","item","hasValidDescription","itemsValidator","items","_sfc_main","direction","gap","DT_STACK_GAP"],"mappings":"oMAAaA,EAAgC,CAAC,MAAO,QAAQ,ECAvDC,EAAeC,GACdA,EAAK,KAIH,OAAOA,EAAK,MAAS,SAHnB,GAMLC,EAAsBD,GACrBA,EAAK,YAIH,OAAOA,EAAK,aAAgB,SAH1B,GAMEE,EAAiBC,GACvB,MAAM,QAAQA,CAAK,EAIjBA,EAAM,MAAMH,GACb,SAAOA,GAAS,UAIhB,CAACD,EAAaC,CAAI,GAIlB,CAACC,EAAoBD,CAAI,EAK9B,EAjBQ,GCQXI,EAAA,CACA,KAAA,oBAEA,MAAA,CAKA,UAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAC,GAAAP,EAAA,SAAAO,CAAA,CACA,EAKA,MAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EACA,UAAAF,GAAAD,EAAAC,CAAA,EACA,SAAA,EACA,EAMA,IAAA,CACA,KAAA,OACA,QAAA,MACA,UAAAG,GAAAC,IAAA,SAAAD,CAAA,CACA,EAKA,UAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,iBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,CACA,EAEA,SAAA,CACA,SAAA,CACA,MAAA,CAAA,4BAAA,KAAA,SAAA,CACA,EAEA,SAAA,CACA,MAAA,CAAA,mCAAA,KAAA,gBAAA,CACA,EAEA,mBAAA,CACA,MAAA,wBAAA,KAAA,SAAA,EACA,EAEA,aAAA,CACA,MAAA,4BAAA,KAAA,GAAA,EACA,CACA,CACA"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../chunks/dropdown-zhMEz3bn.js"),n=require("../chunks/_plugin-vue2_normalizer-ZK80B3OL.js"),t=require("../chunks/dropdown_constants-KHFvVI2L.js");require("../chunks/keyboard_list_navigation-N74Bpdq7.js");require("./utils.cjs");require("./constants.cjs");require("vue");require("../chunks/sr_only_close_button-ErijKGYR.js");require("./icon.cjs");require("@dialpad/dialtone-icons/vue2");require("../chunks/icon_constants-2S_OSQ1t.js");require("@dialpad/dialtone-icons/icons.json");require("./button.cjs");require("../chunks/link_constants-Kn6kP4i1.js");require("./popover.cjs");require("../chunks/popover_constants-hOEhklvr.js");require("tippy.js");require("@linusborg/vue-simple-portal");require("../chunks/modal-qEzlo0Sj.js");require("./lazy-show.cjs");require("../chunks/list_item_constants-Tsz5CO1m.js");const u={name:"DtDropdownSeparator"};var o=function(){var r=this,e=r._self._c;return e("li",{staticClass:"dt-list-separator",attrs:{"aria-hidden":"true"}})},a=[],s=n.n(u,o,a,!1,null,null,null,null);const q=s.exports;exports.DtDropdown=i.D;exports.DROPDOWN_PADDING_CLASSES=t.D;exports.DtDropdownSeparator=q;
2
+ //# sourceMappingURL=dropdown.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dropdown.cjs","sources":["../../components/dropdown/dropdown_separator.vue"],"sourcesContent":["<template>\n <li\n aria-hidden=\"true\"\n class=\"dt-list-separator\"\n />\n</template>\n\n<script>\nexport default {\n name: 'DtDropdownSeparator',\n};\n</script>\n\n<style lang=\"less\">\n.dt-list-item[role=\"menuitem\"] {\n border-radius: var(--dt-size-300);\n}\n.dt-list-separator {\n border-top: var(--dt-size-100) solid var(--dt-color-border-default);\n list-style: none;\n margin: var(--dt-space-300) var(--dt-space-300-negative);\n}\n</style>\n"],"names":["_sfc_main"],"mappings":"u4BAQA,MAAAA,EAAA,CACA,KAAA,qBACA"}
@@ -1,6 +1,6 @@
1
- import { D as G } from "../chunks/dropdown-SMWaTWyF.js";
1
+ import { D as F } from "../chunks/dropdown-SMWaTWyF.js";
2
2
  import { n as t } from "../chunks/_plugin-vue2_normalizer-u6G_3nkj.js";
3
- import { D as L } from "../chunks/dropdown_constants-EUcDxBrX.js";
3
+ import { D as I } from "../chunks/dropdown_constants-EUcDxBrX.js";
4
4
  import "../chunks/keyboard_list_navigation-F0O8nht0.js";
5
5
  import "./utils.js";
6
6
  import "./constants.js";
@@ -10,7 +10,6 @@ import "./icon.js";
10
10
  import "@dialpad/dialtone-icons/vue2";
11
11
  import "../chunks/icon_constants-OpYAAKwF.js";
12
12
  import "@dialpad/dialtone-icons/icons.json";
13
- import "./skeleton.js";
14
13
  import "./button.js";
15
14
  import "../chunks/link_constants-vIUB92L4.js";
16
15
  import "./popover.js";
@@ -36,10 +35,10 @@ var i = function() {
36
35
  null,
37
36
  null
38
37
  );
39
- const z = a.exports;
38
+ const R = a.exports;
40
39
  export {
41
- L as DROPDOWN_PADDING_CLASSES,
42
- G as DtDropdown,
43
- z as DtDropdownSeparator
40
+ I as DROPDOWN_PADDING_CLASSES,
41
+ F as DtDropdown,
42
+ R as DtDropdownSeparator
44
43
  };
45
44
  //# sourceMappingURL=dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.js","sources":["../../components/dropdown/dropdown_separator.vue"],"sourcesContent":["<template>\n <li\n aria-hidden=\"true\"\n class=\"dt-list-separator\"\n />\n</template>\n\n<script>\nexport default {\n name: 'DtDropdownSeparator',\n};\n</script>\n\n<style lang=\"less\">\n.dt-list-item[role=\"menuitem\"] {\n border-radius: var(--dt-size-300);\n}\n.dt-list-separator {\n border-top: var(--dt-size-100) solid var(--dt-color-border-default);\n list-style: none;\n margin: var(--dt-space-300) var(--dt-space-300-negative);\n}\n</style>\n"],"names":["_sfc_main"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAQA,MAAAA,IAAA;AAAA,EACA,MAAA;AACA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"dropdown.js","sources":["../../components/dropdown/dropdown_separator.vue"],"sourcesContent":["<template>\n <li\n aria-hidden=\"true\"\n class=\"dt-list-separator\"\n />\n</template>\n\n<script>\nexport default {\n name: 'DtDropdownSeparator',\n};\n</script>\n\n<style lang=\"less\">\n.dt-list-item[role=\"menuitem\"] {\n border-radius: var(--dt-size-300);\n}\n.dt-list-separator {\n border-top: var(--dt-size-100) solid var(--dt-color-border-default);\n list-style: none;\n margin: var(--dt-space-300) var(--dt-space-300-negative);\n}\n</style>\n"],"names":["_sfc_main"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAQA,MAAAA,IAAA;AAAA,EACA,MAAA;AACA;;;;;;;;;;;;;;;"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../chunks/_plugin-vue2_normalizer-ZK80B3OL.js"),l=require("./rich-text-editor.cjs"),c=require("./button.cjs"),d=require("./icon.cjs"),h=require("./popover.cjs"),p=require("./stack.cjs"),k=require("./input.cjs"),f=require("./tooltip.cjs");require("@tiptap/vue-2");require("@tiptap/extension-blockquote");require("@tiptap/extension-code-block");require("@tiptap/extension-document");require("@tiptap/extension-hard-break");require("@tiptap/extension-paragraph");require("@tiptap/extension-placeholder");require("@tiptap/extension-bold");require("@tiptap/extension-bullet-list");require("@tiptap/extension-italic");require("@tiptap/extension-link");require("@tiptap/extension-list-item");require("@tiptap/extension-ordered-list");require("@tiptap/extension-strike");require("@tiptap/extension-underline");require("@tiptap/extension-text");require("@tiptap/extension-text-align");require("@tiptap/core");require("../chunks/index-sdfB7Aok.js");require("emoji-regex");require("emoji-toolkit/emoji_strategy.json");require("./skeleton.cjs");require("../chunks/icon_constants-2S_OSQ1t.js");require("@dialpad/dialtone-icons/icons.json");require("@tiptap/pm/state");require("@tiptap/suggestion");require("@dialpad/dialtone-emojis");require("./list-item.cjs");require("../chunks/list_item_constants-Tsz5CO1m.js");require("./utils.cjs");require("./constants.cjs");require("vue");require("./item-layout.cjs");require("@dialpad/dialtone-icons/vue2");require("tippy.js");require("@tiptap/extension-mention");require("./link.cjs");require("../chunks/link_constants-Kn6kP4i1.js");require("./avatar.cjs");require("./presence.cjs");require("../chunks/stack_constants-m9Ickqw0.js");require("../chunks/popover_constants-hOEhklvr.js");require("@linusborg/vue-simple-portal");require("../chunks/modal-qEzlo0Sj.js");require("../chunks/sr_only_close_button-ErijKGYR.js");require("./lazy-show.cjs");require("../chunks/input-o-fc1X4b.js");require("./validators.cjs");require("./validation-messages.cjs");const g=[/^https?:\/\//,/^http?:\/\//,/^ftp?:\/\//,/^ftps?:\/\//,/^ftps?:\/\//,/mailto:([^?]*)/],B="https://",m={name:"DtRecipeEditor",components:{DtRichTextEditor:l.DtRichTextEditor,DtButton:c.DtButton,DtIcon:d.DtIcon,DtPopover:h.DtPopover,DtStack:p.DtStack,DtInput:k.DtInput,DtTooltip:f.DtTooltip},inheritAttrs:!1,props:{value:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(e){return typeof e=="string"?l.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(e):!0}},placeholder:{type:String,default:""},maxHeight:{type:String,default:"unset"},confirmSetLinkButton:{type:Object,default:()=>({label:"Confirm",ariaLabel:"Confirm set link"})},removeLinkButton:{type:Object,default:()=>({label:"Remove",ariaLabel:"Remove link"})},cancelSetLinkButton:{type:Object,default:()=>({label:"Cancel",ariaLabel:"Cancel set link"})},setLinkPlaceholder:{type:String,default:""},showBoldButton:{type:Boolean,default:!0},showItalicsButton:{type:Boolean,default:!0},showUnderlineButton:{type:Boolean,default:!0},showStrikeButton:{type:Boolean,default:!0},showListItemsButton:{type:Boolean,default:!0},showOrderedListButton:{type:Boolean,default:!0},showAlignLeftButton:{type:Boolean,default:!0},showAlignCenterButton:{type:Boolean,default:!0},showAlignRightButton:{type:Boolean,default:!0},showAlignJustifyButton:{type:Boolean,default:!0},showQuoteButton:{type:Boolean,default:!0},showCodeBlockButton:{type:Boolean,default:!0},showQuickRepliesButton:{type:Boolean,default:!0},showAddLink:{type:Object,default:()=>({showAddLinkButton:!0,setLinkTitle:"Add a link",setLinkInputAriaLabel:"Input field to add link"})}},emits:["focus","blur","input","quick-replies-click"],data(){return{internalInputValue:this.value,hasFocus:!1,linkOptions:{class:"d-link d-c-text d-d-inline-block"},showLinkInput:!1,linkInput:""}},computed:{inputLength(){return this.internalInputValue.length},htmlOutputFormat(){return l.RICH_TEXT_EDITOR_OUTPUT_FORMATS[2]},showingTextFormatButtons(){return this.showBoldButton||this.showItalicsButton||this.showStrikeButton||this.showUnderlineButton},showingAlignmentButtons(){return this.showAlignLeftButton||this.showAlignCenterButton||this.showAlignRightButton||this.showAlignJustifyButton},showingListButtons(){return this.showListItemsButton||this.showOrderedListButton},buttonGroups(){const e=this.individualButtons.map(t=>({key:t.selector,buttonGroup:[t]}));return[{key:"new",buttonGroup:this.newButtons},{key:"format",buttonGroup:this.textFormatButtons},{key:"alignment",buttonGroup:this.alignmentButtons},{key:"list",buttonGroup:this.listButtons},...e].filter(t=>t.buttonGroup.length>0)},newButtons(){return[{showBtn:this.showQuickRepliesButton,label:"Quick reply",selector:"quickReplies",iconName:"lightning-bolt",dataQA:"dt-editor-quick-replies-btn",tooltipMessage:"Quick Reply",onClick:this.onQuickRepliesClick}].filter(e=>e.showBtn)},textFormatButtons(){return[{showBtn:this.showBoldButton,selector:"bold",iconName:"bold",dataQA:"dt-editor-bold-btn",tooltipMessage:"Bold",onClick:this.onBoldTextToggle},{showBtn:this.showItalicsButton,selector:"italic",iconName:"italic",dataQA:"dt-editor-italics-btn",tooltipMessage:"Italics",onClick:this.onItalicTextToggle},{showBtn:this.showUnderlineButton,selector:"underline",iconName:"underline",dataQA:"dt-editor-underline-btn",tooltipMessage:"Underline",onClick:this.onUnderlineTextToggle},{showBtn:this.showStrikeButton,selector:"strike",iconName:"strikethrough",dataQA:"dt-editor-strike-btn",tooltipMessage:"Strike",onClick:this.onStrikethroughTextToggle}].filter(e=>e.showBtn)},alignmentButtons(){return[{showBtn:this.showAlignLeftButton,selector:{textAlign:"left"},iconName:"align-left",dataQA:"dt-editor-align-left-btn",tooltipMessage:"Align Left",onClick:()=>this.onTextAlign("left")},{showBtn:this.showAlignCenterButton,selector:{textAlign:"center"},iconName:"align-center",dataQA:"dt-editor-align-center-btn",tooltipMessage:"Align Center",onClick:()=>this.onTextAlign("center")},{showBtn:this.showAlignRightButton,selector:{textAlign:"right"},iconName:"align-right",dataQA:"dt-editor-align-right-btn",tooltipMessage:"Align Right",onClick:()=>this.onTextAlign("right")},{showBtn:this.showAlignJustifyButton,selector:{textAlign:"justify"},iconName:"align-justify",dataQA:"dt-editor-align-justify-btn",tooltipMessage:"Align Justify",onClick:()=>this.onTextAlign("justify")}].filter(e=>e.showBtn)},listButtons(){return[{showBtn:this.showListItemsButton,selector:"bulletList",iconName:"list-bullet",dataQA:"dt-editor-list-items-btn",tooltipMessage:"Bullet List",onClick:this.onBulletListToggle},{showBtn:this.showOrderedListButton,selector:"orderedList",iconName:"list-ordered",dataQA:"dt-editor-ordered-list-items-btn",tooltipMessage:"Ordered List",onClick:this.onOrderedListToggle}].filter(e=>e.showBtn)},individualButtons(){return[{showBtn:this.showQuoteButton,selector:"blockquote",iconName:"quote",dataQA:"dt-editor-blockquote-btn",tooltipMessage:"Quote",onClick:this.onBlockquoteToggle},{showBtn:this.showCodeBlockButton,selector:"codeBlock",iconName:"code-block",dataQA:"dt-editor-code-block-btn",tooltipMessage:"Code",onClick:this.onCodeBlockToggle}].filter(e=>e.showBtn)},linkButton(){return{showBtn:this.showAddLink.showAddLinkButton,selector:"link",iconName:"link-2",dataQA:"dt-editor-add-link-btn",tooltipMessage:"Link",onClick:this.openLinkInput}}},watch:{value(e){this.internalInputValue=e}},methods:{onInputFocus(e){e==null||e.stopPropagation()},removeLink(){var e,t,n,i,o;(o=(i=(n=(t=(e=this.$refs.richTextEditor)==null?void 0:e.editor)==null?void 0:t.chain())==null?void 0:n.focus())==null?void 0:i.unsetLink())==null||o.run(),this.closeLinkInput()},setLink(e){var o,r,s;const t=(o=this.$refs.richTextEditor)==null?void 0:o.editor;if(e==null||e.preventDefault(),e==null||e.stopPropagation(),!this.linkInput){this.removeLink();return}g.find(u=>u.test(this.linkInput))||(this.linkInput=`${B}${this.linkInput}`);const i=(s=(r=t==null?void 0:t.view)==null?void 0:r.state)==null?void 0:s.selection;i.anchor===i.head?t.chain().focus().insertContentAt(i.anchor,`<a class="${this.linkOptions.class}" href=${this.linkInput}>${this.linkInput}</a>`).run():t.chain().focus().extendMarkRange("link").setLink({href:this.linkInput,class:this.linkOptions.class}).run(),this.closeLinkInput()},openLinkInput(){this.showLinkInput=!0},updateInput(e){var t,n,i;if(!e)return this.closeLinkInput();this.linkInput=(i=(n=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null?void 0:n.getAttributes("link"))==null?void 0:i.href},closeLinkInput(){var e;this.showLinkInput=!1,this.linkInput="",(e=this.$refs.richTextEditor.editor)==null||e.chain().focus()},onBoldTextToggle(){var e,t;(t=(e=this.$refs.richTextEditor)==null?void 0:e.editor)==null||t.chain().focus().toggleBold().run()},onItalicTextToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleItalic().run()},onUnderlineTextToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleUnderline().run()},onStrikethroughTextToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleStrike().run()},onTextAlign(e){var t,n,i,o;if((n=(t=this.$refs.richTextEditor)==null?void 0:t.editor)!=null&&n.isActive({textAlign:e}))return(i=this.$refs.richTextEditor)==null?void 0:i.editor.chain().focus().unsetTextAlign().run();(o=this.$refs.richTextEditor)==null||o.editor.chain().focus().setTextAlign(e).run()},onBulletListToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleBulletList().run()},onOrderedListToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleOrderedList().run()},onCodeBlockToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleCodeBlock().run()},onQuickRepliesClick(){this.$emit("quick-replies-click")},onBlockquoteToggle(){var e;(e=this.$refs.richTextEditor)==null||e.editor.chain().focus().toggleBlockquote().run()},onFocus(e){this.hasFocus=!0,this.$emit("focus",e)},onBlur(e){this.hasFocus=!1,this.$emit("blur",e)},onInput(e){this.$emit("input",e)}}};var b=function(){var t=this,n=t._self._c;return n("div",{staticClass:"d-d-flex d-fd-column",attrs:{"data-qa":"dt-editor",role:"presentation"},on:{click:function(i){return t.$refs.richTextEditor.focusEditor()}}},[n("dt-stack",{staticClass:"d-p8 dt-editor--top-bar-background",attrs:{direction:"row",gap:"450"}},[t._l(t.buttonGroups,function(i){return n("dt-stack",{key:i.key,attrs:{direction:"row",gap:"300"}},[t._l(i.buttonGroup,function(o){return n("dt-tooltip",{key:`${i.key}-${JSON.stringify(o.selector)}`,attrs:{message:o.tooltipMessage,placement:"top"},scopedSlots:t._u([{key:"anchor",fn:function(){var r,s;return[n("dt-button",{attrs:{"data-qa":o.dataQA,importance:"clear",kind:"muted",active:(s=(r=t.$refs.richTextEditor)==null?void 0:r.editor)==null?void 0:s.isActive(o.selector),size:"xs","aria-label":o.tooltipMessage},on:{click:function(u){return o.onClick()}},scopedSlots:t._u([{key:"icon",fn:function(){return[n("dt-icon",{attrs:{name:o.iconName,size:"200"}})]},proxy:!0}],null,!0)},[o.label?n("span",[t._v(t._s(o.label))]):t._e()])]},proxy:!0}],null,!0)})}),n("div",{staticClass:"dt-editor--button-group-divider"})],2)}),t.linkButton.showBtn?n("dt-stack",{attrs:{direction:"row",gap:"300"}},[n("dt-popover",{attrs:{open:t.showLinkInput,placement:"bottom-start","visually-hidden-close":!0,"visually-hidden-close-label":"Close link input popover","data-qa":"dt-editor-link-input-popover","show-close-button":!1},on:{"update:open":function(i){t.showLinkInput=i},click:t.onInputFocus,opened:t.updateInput},nativeOn:{click:function(i){return i.stopPropagation(),t.onInputFocus.apply(null,arguments)}},scopedSlots:t._u([{key:"anchor",fn:function(){return[n("dt-tooltip",{key:t.linkButton.key,attrs:{message:t.linkButton.tooltipMessage,placement:"top"},scopedSlots:t._u([{key:"anchor",fn:function(){var i,o;return[n("dt-button",{staticClass:"d-ol-none",attrs:{"data-qa":t.linkButton.dataQA,importance:"clear",kind:"muted",active:(o=(i=t.$refs.richTextEditor)==null?void 0:i.editor)==null?void 0:o.isActive(t.linkButton.selector),size:"xs","aria-label":t.linkButton.tooltipMessage},on:{click:function(r){return t.linkButton.onClick()}},scopedSlots:t._u([{key:"icon",fn:function(){return[n("dt-icon",{staticClass:"d-fw-bold",attrs:{name:t.linkButton.iconName,size:"200"}})]},proxy:!0}],null,!1,540616731)})]},proxy:!0}],null,!1,2091397100)})]},proxy:!0},{key:"content",fn:function(){return[t.showAddLink.setLinkTitle.length>0?n("span",[t._v(" "+t._s(t.showAddLink.setLinkTitle)+" ")]):t._e(),n("dt-input",{attrs:{"input-aria-label":t.showAddLink.setLinkInputAriaLabel,"data-qa":"dt-editor-link-input",placeholder:t.setLinkPlaceholder,"input-wrapper-class":"d-bgc-black-100 d-mt6 d-bar5 d-ba d-baw1 d-bc-black-300 d-py2 d-ol-none"},on:{click:t.onInputFocus,focus:t.onInputFocus,keydown:function(i){return!i.type.indexOf("key")&&t._k(i.keyCode,"enter",13,i.key,"Enter")?null:t.setLink.apply(null,arguments)}},nativeOn:{click:function(i){return i.stopPropagation(),t.onInputFocus.apply(null,arguments)}},model:{value:t.linkInput,callback:function(i){t.linkInput=i},expression:"linkInput"}})]},proxy:!0},{key:"footerContent",fn:function(){return[n("div",{staticClass:"d-ml8 d-mr12"},[n("dt-button",{staticClass:"d-mx2",attrs:{"aria-label":t.removeLinkButton.ariaLabel,importance:"clear",kind:"muted",size:"sm","data-qa":"dt-editor-remove-link-btn"},on:{click:t.removeLink}},[t._v(" "+t._s(t.removeLinkButton.label)+" ")]),n("dt-button",{staticClass:"d-mx2",attrs:{"aria-label":t.cancelSetLinkButton.ariaLabel,importance:"clear",kind:"muted",size:"sm","data-qa":"dt-editor-set-link-cancel-btn"},on:{click:t.closeLinkInput}},[t._v(" "+t._s(t.cancelSetLinkButton.label)+" ")]),n("dt-button",{staticClass:"d-mx2",attrs:{size:"sm","aria-label":t.confirmSetLinkButton.ariaLabel,"data-qa":"dt-editor-set-link-confirm-btn"},on:{click:t.setLink}},[t._v(" "+t._s(t.confirmSetLinkButton.label)+" ")])],1)]},proxy:!0}],null,!1,1792797475)})],1):t._e()],2),n("div",{staticClass:"d-of-auto d-mx16 d-mt8 d-mb16 d-c-text",style:{"max-height":t.maxHeight}},[n("dt-rich-text-editor",t._b({ref:"richTextEditor",attrs:{"data-qa":"dt-rich-text-editor",editable:t.editable,"input-aria-label":t.inputAriaLabel,"input-class":`d-ml16 d-ol-none d-my6 ${t.inputClass}`,"output-format":t.htmlOutputFormat,"auto-focus":t.autoFocus,placeholder:t.placeholder,"allow-line-breaks":!0,link:!1},on:{focus:t.onFocus,blur:t.onBlur,input:function(i){return t.onInput(i)}},model:{value:t.internalInputValue,callback:function(i){t.internalInputValue=i},expression:"internalInputValue"}},"dt-rich-text-editor",t.$attrs,!1))],1)],1)},w=[],L=a.n(m,b,w,!1,null,null,null,null);const q=L.exports;exports.DtRecipeEditor=q;
2
+ //# sourceMappingURL=editor.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"editor.cjs","sources":["../../recipes/conversation_view/editor/editor_constants.js","../../recipes/conversation_view/editor/editor.vue"],"sourcesContent":["export const EDITOR_SUPPORTED_LINK_PROTOCOLS = [\n /^https?:\\/\\//,\n /^http?:\\/\\//,\n /^ftp?:\\/\\//,\n /^ftps?:\\/\\//,\n /^ftps?:\\/\\//,\n /mailto:([^?]*)/,\n];\n\nexport const EDITOR_DEFAULT_LINK_PREFIX = 'https://';\n\nexport default {\n EDITOR_SUPPORTED_LINK_PROTOCOLS,\n EDITOR_DEFAULT_LINK_PREFIX,\n};\n","<!-- eslint-disable vue/no-restricted-class -->\n<template>\n <div\n data-qa=\"dt-editor\"\n role=\"presentation\"\n class=\"d-d-flex d-fd-column\"\n @click=\"$refs.richTextEditor.focusEditor()\"\n >\n <!-- Section for the top UI -->\n <dt-stack\n direction=\"row\"\n gap=\"450\"\n class=\"d-p8 dt-editor--top-bar-background\"\n >\n <dt-stack\n v-for=\"buttonGroup in buttonGroups\"\n :key=\"buttonGroup.key\"\n direction=\"row\"\n gap=\"300\"\n >\n <dt-tooltip\n v-for=\"button in buttonGroup.buttonGroup\"\n :key=\"`${buttonGroup.key}-${JSON.stringify(button.selector)}`\"\n :message=\"button.tooltipMessage\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n :data-qa=\"button.dataQA\"\n importance=\"clear\"\n kind=\"muted\"\n :active=\"$refs.richTextEditor?.editor?.isActive(button.selector)\"\n size=\"xs\"\n :aria-label=\"button.tooltipMessage\"\n @click=\"button.onClick()\"\n >\n <template #icon>\n <dt-icon\n :name=\"button.iconName\"\n size=\"200\"\n />\n </template>\n <span v-if=\"button.label\">{{ button.label }}</span>\n </dt-button>\n </template>\n </dt-tooltip>\n <div class=\"dt-editor--button-group-divider\" />\n </dt-stack>\n <dt-stack\n v-if=\"linkButton.showBtn\"\n direction=\"row\"\n gap=\"300\"\n >\n <dt-popover\n :open.sync=\"showLinkInput\"\n placement=\"bottom-start\"\n :visually-hidden-close=\"true\"\n :visually-hidden-close-label=\"'Close link input popover'\"\n data-qa=\"dt-editor-link-input-popover\"\n :show-close-button=\"false\"\n @click=\"onInputFocus\"\n @click.native.stop=\"onInputFocus\"\n @opened=\"updateInput\"\n >\n <template #anchor>\n <dt-tooltip\n :key=\"linkButton.key\"\n :message=\"linkButton.tooltipMessage\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n :data-qa=\"linkButton.dataQA\"\n importance=\"clear\"\n kind=\"muted\"\n class=\"d-ol-none\"\n :active=\"$refs.richTextEditor?.editor?.isActive(linkButton.selector)\"\n size=\"xs\"\n :aria-label=\"linkButton.tooltipMessage\"\n @click=\"linkButton.onClick()\"\n >\n <template #icon>\n <dt-icon\n :name=\"linkButton.iconName\"\n size=\"200\"\n class=\"d-fw-bold\"\n />\n </template>\n </dt-button>\n </template>\n </dt-tooltip>\n </template>\n\n <template #content>\n <span\n v-if=\"showAddLink.setLinkTitle.length > 0\"\n >\n {{ showAddLink.setLinkTitle }}\n </span>\n <dt-input\n v-model=\"linkInput\"\n :input-aria-label=\"showAddLink.setLinkInputAriaLabel\"\n data-qa=\"dt-editor-link-input\"\n :placeholder=\"setLinkPlaceholder\"\n input-wrapper-class=\"d-bgc-black-100 d-mt6 d-bar5 d-ba d-baw1 d-bc-black-300 d-py2 d-ol-none\"\n @click=\"onInputFocus\"\n @click.native.stop=\"onInputFocus\"\n @focus=\"onInputFocus\"\n @keydown.enter=\"setLink\"\n />\n </template>\n <template #footerContent>\n <div class=\"d-ml8 d-mr12\">\n <dt-button\n class=\"d-mx2\"\n :aria-label=\"removeLinkButton.ariaLabel\"\n importance=\"clear\"\n kind=\"muted\"\n size=\"sm\"\n data-qa=\"dt-editor-remove-link-btn\"\n @click=\"removeLink\"\n >\n {{ removeLinkButton.label }}\n </dt-button>\n <dt-button\n class=\"d-mx2\"\n :aria-label=\"cancelSetLinkButton.ariaLabel\"\n importance=\"clear\"\n kind=\"muted\"\n size=\"sm\"\n data-qa=\"dt-editor-set-link-cancel-btn\"\n @click=\"closeLinkInput\"\n >\n {{ cancelSetLinkButton.label }}\n </dt-button>\n <dt-button\n class=\"d-mx2\"\n size=\"sm\"\n :aria-label=\"confirmSetLinkButton.ariaLabel\"\n data-qa=\"dt-editor-set-link-confirm-btn\"\n @click=\"setLink\"\n >\n {{ confirmSetLinkButton.label }}\n </dt-button>\n </div>\n </template>\n </dt-popover>\n </dt-stack>\n </dt-stack>\n\n <!-- Some wrapper to restrict the height and show the scrollbar -->\n <div\n class=\"d-of-auto d-mx16 d-mt8 d-mb16 d-c-text\"\n :style=\"{ 'max-height': maxHeight }\"\n >\n <dt-rich-text-editor\n ref=\"richTextEditor\"\n v-model=\"internalInputValue\"\n data-qa=\"dt-rich-text-editor\"\n :editable=\"editable\"\n :input-aria-label=\"inputAriaLabel\"\n :input-class=\"`d-ml16 d-ol-none d-my6 ${inputClass}`\"\n :output-format=\"htmlOutputFormat\"\n :auto-focus=\"autoFocus\"\n :placeholder=\"placeholder\"\n :allow-line-breaks=\"true\"\n :link=\"false\"\n v-bind=\"$attrs\"\n @focus=\"onFocus\"\n @blur=\"onBlur\"\n @input=\"onInput($event)\"\n />\n </div>\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport {\n DtRichTextEditor,\n RICH_TEXT_EDITOR_OUTPUT_FORMATS,\n RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,\n} from '@/components/rich_text_editor';\nimport {\n EDITOR_SUPPORTED_LINK_PROTOCOLS,\n EDITOR_DEFAULT_LINK_PREFIX,\n} from './editor_constants.js';\nimport { DtIcon } from '@/components/icon';\nimport { DtButton } from '@/components/button';\nimport { DtPopover } from '@/components/popover';\nimport { DtStack } from '@/components/stack';\nimport { DtInput } from '@/components/input';\nimport { DtTooltip } from '@/components/tooltip';\n\nexport default {\n name: 'DtRecipeEditor',\n\n components: {\n DtRichTextEditor,\n DtButton,\n DtIcon,\n DtPopover,\n DtStack,\n DtInput,\n DtTooltip,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Value of the input. The object format should match TipTap's JSON\n * document structure: https://tiptap.dev/guide/output#option-1-json\n */\n value: {\n type: [Object, String],\n default: '',\n },\n\n /**\n * Whether the input is editable\n */\n editable: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Descriptive label for the input element\n */\n inputAriaLabel: {\n type: String,\n required: true,\n default: '',\n },\n\n /**\n * Additional class name for the input element. Only accepts a String value\n * because this is passed to the editor via options. For multiple classes,\n * join them into one string, e.g. \"d-p8 d-hmx96\"\n */\n inputClass: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the input should receive focus after the component has been\n * mounted. Either one of `start`, `end`, `all` or a Boolean or a Number.\n * - `start` Sets the focus to the beginning of the input\n * - `end` Sets the focus to the end of the input\n * - `all` Selects the whole contents of the input\n * - `Number` Sets the focus to a specific position in the input\n * - `true` Defaults to `start`\n * - `false` Disables autofocus\n * @values true, false, start, end, all, number\n */\n autoFocus: {\n type: [Boolean, String, Number],\n default: false,\n validator (autoFocus) {\n if (typeof autoFocus === 'string') {\n return RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(autoFocus);\n }\n return true;\n },\n },\n\n /**\n * Placeholder text\n */\n placeholder: {\n type: String,\n default: '',\n },\n\n /**\n * Content area needs to dynamically adjust height based on the conversation area height.\n * can be vh|px|rem|em|%\n */\n maxHeight: {\n type: String,\n default: 'unset',\n },\n\n /**\n * Confirm set link button defaults.\n */\n confirmSetLinkButton: {\n type: Object,\n default: () => ({ label: 'Confirm', ariaLabel: 'Confirm set link' }),\n },\n\n /**\n * Remove link button defaults.\n */\n removeLinkButton: {\n type: Object,\n default: () => ({ label: 'Remove', ariaLabel: 'Remove link' }),\n },\n\n /**\n * Cancel set link button defaults.\n */\n cancelSetLinkButton: {\n type: Object,\n default: () => ({ label: 'Cancel', ariaLabel: 'Cancel set link' }),\n },\n\n /**\n * Placeholder text for the set link input field\n */\n setLinkPlaceholder: {\n type: String,\n default: '',\n },\n\n /**\n * Show button to render text as bold\n */\n showBoldButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to render text in italics\n */\n showItalicsButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to underline text\n */\n showUnderlineButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to strike text\n */\n showStrikeButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to render list items\n */\n showListItemsButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to render ordered list items\n */\n showOrderedListButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to align text to the left\n */\n showAlignLeftButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to align text to the center\n */\n showAlignCenterButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to align text to the right\n */\n showAlignRightButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to justify text\n */\n showAlignJustifyButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to add quote format to text\n */\n showQuoteButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to add code block\n */\n showCodeBlockButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show button to handle quick replies\n */\n showQuickRepliesButton: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Show add link default config.\n */\n showAddLink: {\n type: Object,\n default: () => ({\n showAddLinkButton: true,\n setLinkTitle: 'Add a link',\n setLinkInputAriaLabel: 'Input field to add link',\n }),\n },\n },\n\n emits: [\n /**\n * Native focus event\n * @event input\n * @type {String|JSON}\n */\n 'focus',\n\n /**\n * Native blur event\n * @event input\n * @type {String|JSON}\n */\n 'blur',\n\n /**\n * Native input event\n * @event input\n * @type {String|JSON}\n */\n 'input',\n\n /**\n * Quick replies button\n * pressed event\n * @event quick-replies-click\n */\n 'quick-replies-click',\n ],\n\n data () {\n return {\n internalInputValue: this.value, // internal input content\n hasFocus: false,\n\n linkOptions: {\n class: 'd-link d-c-text d-d-inline-block',\n },\n\n showLinkInput: false,\n linkInput: '',\n };\n },\n\n computed: {\n inputLength () {\n return this.internalInputValue.length;\n },\n\n htmlOutputFormat () {\n return RICH_TEXT_EDITOR_OUTPUT_FORMATS[2];\n },\n\n showingTextFormatButtons () {\n return this.showBoldButton || this.showItalicsButton || this.showStrikeButton || this.showUnderlineButton;\n },\n\n showingAlignmentButtons () {\n return this.showAlignLeftButton || this.showAlignCenterButton ||\n this.showAlignRightButton || this.showAlignJustifyButton;\n },\n\n showingListButtons () {\n return this.showListItemsButton || this.showOrderedListButton;\n },\n\n buttonGroups () {\n const individualButtonStacks = this.individualButtons.map(buttonData => ({\n key: buttonData.selector,\n buttonGroup: [buttonData],\n }));\n return [\n { key: 'new', buttonGroup: this.newButtons },\n { key: 'format', buttonGroup: this.textFormatButtons },\n { key: 'alignment', buttonGroup: this.alignmentButtons },\n { key: 'list', buttonGroup: this.listButtons },\n ...individualButtonStacks,\n ].filter(buttonGroupData => buttonGroupData.buttonGroup.length > 0);\n },\n\n newButtons () {\n return [\n { showBtn: this.showQuickRepliesButton, label: 'Quick reply', selector: 'quickReplies', iconName: 'lightning-bolt', dataQA: 'dt-editor-quick-replies-btn', tooltipMessage: 'Quick Reply', onClick: this.onQuickRepliesClick },\n ].filter(button => button.showBtn);\n },\n\n textFormatButtons () {\n return [\n { showBtn: this.showBoldButton, selector: 'bold', iconName: 'bold', dataQA: 'dt-editor-bold-btn', tooltipMessage: 'Bold', onClick: this.onBoldTextToggle },\n { showBtn: this.showItalicsButton, selector: 'italic', iconName: 'italic', dataQA: 'dt-editor-italics-btn', tooltipMessage: 'Italics', onClick: this.onItalicTextToggle },\n { showBtn: this.showUnderlineButton, selector: 'underline', iconName: 'underline', dataQA: 'dt-editor-underline-btn', tooltipMessage: 'Underline', onClick: this.onUnderlineTextToggle },\n { showBtn: this.showStrikeButton, selector: 'strike', iconName: 'strikethrough', dataQA: 'dt-editor-strike-btn', tooltipMessage: 'Strike', onClick: this.onStrikethroughTextToggle },\n ].filter(button => button.showBtn);\n },\n\n alignmentButtons () {\n return [\n { showBtn: this.showAlignLeftButton, selector: { textAlign: 'left' }, iconName: 'align-left', dataQA: 'dt-editor-align-left-btn', tooltipMessage: 'Align Left', onClick: () => this.onTextAlign('left') },\n { showBtn: this.showAlignCenterButton, selector: { textAlign: 'center' }, iconName: 'align-center', dataQA: 'dt-editor-align-center-btn', tooltipMessage: 'Align Center', onClick: () => this.onTextAlign('center') },\n { showBtn: this.showAlignRightButton, selector: { textAlign: 'right' }, iconName: 'align-right', dataQA: 'dt-editor-align-right-btn', tooltipMessage: 'Align Right', onClick: () => this.onTextAlign('right') },\n { showBtn: this.showAlignJustifyButton, selector: { textAlign: 'justify' }, iconName: 'align-justify', dataQA: 'dt-editor-align-justify-btn', tooltipMessage: 'Align Justify', onClick: () => this.onTextAlign('justify') },\n ].filter(button => button.showBtn);\n },\n\n listButtons () {\n return [\n { showBtn: this.showListItemsButton, selector: 'bulletList', iconName: 'list-bullet', dataQA: 'dt-editor-list-items-btn', tooltipMessage: 'Bullet List', onClick: this.onBulletListToggle },\n { showBtn: this.showOrderedListButton, selector: 'orderedList', iconName: 'list-ordered', dataQA: 'dt-editor-ordered-list-items-btn', tooltipMessage: 'Ordered List', onClick: this.onOrderedListToggle },\n ].filter(button => button.showBtn);\n },\n\n individualButtons () {\n return [\n { showBtn: this.showQuoteButton, selector: 'blockquote', iconName: 'quote', dataQA: 'dt-editor-blockquote-btn', tooltipMessage: 'Quote', onClick: this.onBlockquoteToggle },\n { showBtn: this.showCodeBlockButton, selector: 'codeBlock', iconName: 'code-block', dataQA: 'dt-editor-code-block-btn', tooltipMessage: 'Code', onClick: this.onCodeBlockToggle },\n ].filter(button => button.showBtn);\n },\n\n linkButton () {\n return { showBtn: this.showAddLink.showAddLinkButton, selector: 'link', iconName: 'link-2', dataQA: 'dt-editor-add-link-btn', tooltipMessage: 'Link', onClick: this.openLinkInput };\n },\n },\n\n watch: {\n value (newValue) {\n this.internalInputValue = newValue;\n },\n },\n\n methods: {\n onInputFocus (event) {\n event?.stopPropagation();\n },\n\n removeLink () {\n this.$refs.richTextEditor?.editor?.chain()?.focus()?.unsetLink()?.run();\n this.closeLinkInput();\n },\n\n setLink (event) {\n const editor = this.$refs.richTextEditor?.editor;\n event?.preventDefault();\n event?.stopPropagation();\n\n if (!this.linkInput) {\n // If link text is set to empty string,\n // remove any existing links.\n this.removeLink();\n return;\n }\n\n // Check if input matches any of the supported link formats\n const prefix = EDITOR_SUPPORTED_LINK_PROTOCOLS.find(prefixRegex => prefixRegex.test(this.linkInput));\n\n if (!prefix) {\n // If no matching pattern is found, prepend default prefix\n this.linkInput = `${EDITOR_DEFAULT_LINK_PREFIX}${this.linkInput}`;\n }\n\n const selection = editor?.view?.state?.selection;\n\n if (selection.anchor === selection.head) {\n // If no text has been selected, manually insert the link text.\n // Do not rely on link options set through DtRichTextEditor\n // component, because they clash with these and cause issues.\n editor\n .chain()\n .focus()\n .insertContentAt(\n selection.anchor,\n `<a class=\"${this.linkOptions.class}\" href=${this.linkInput}>${this.linkInput}</a>`,\n )\n .run();\n } else {\n // Set or edit the link\n editor\n .chain()\n .focus()\n .extendMarkRange('link')\n .setLink({ href: this.linkInput, class: this.linkOptions.class })\n .run();\n }\n\n this.closeLinkInput();\n },\n\n openLinkInput () {\n this.showLinkInput = true;\n },\n\n updateInput (openedInput) {\n if (!openedInput) {\n return this.closeLinkInput();\n }\n this.linkInput = this.$refs.richTextEditor?.editor?.getAttributes('link')?.href;\n },\n\n closeLinkInput () {\n this.showLinkInput = false;\n this.linkInput = '';\n this.$refs.richTextEditor.editor?.chain().focus();\n },\n\n onBoldTextToggle () {\n this.$refs.richTextEditor?.editor?.chain().focus().toggleBold().run();\n },\n\n onItalicTextToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleItalic().run();\n },\n\n onUnderlineTextToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleUnderline().run();\n },\n\n onStrikethroughTextToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleStrike().run();\n },\n\n onTextAlign (alignment) {\n if (this.$refs.richTextEditor?.editor?.isActive({ textAlign: alignment })) {\n // If this alignment type is already set here, unset it\n return this.$refs.richTextEditor?.editor.chain().focus().unsetTextAlign().run();\n }\n this.$refs.richTextEditor?.editor.chain().focus().setTextAlign(alignment).run();\n },\n\n onBulletListToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleBulletList().run();\n },\n\n onOrderedListToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleOrderedList().run();\n },\n\n onCodeBlockToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleCodeBlock().run();\n },\n\n onQuickRepliesClick () {\n this.$emit('quick-replies-click');\n },\n\n onBlockquoteToggle () {\n this.$refs.richTextEditor?.editor.chain().focus().toggleBlockquote().run();\n },\n\n onFocus (event) {\n this.hasFocus = true;\n this.$emit('focus', event);\n },\n\n onBlur (event) {\n this.hasFocus = false;\n this.$emit('blur', event);\n },\n\n onInput (event) {\n this.$emit('input', event);\n },\n\n },\n};\n</script>\n\n<style lang=\"less\">\n.dt-editor--top-bar-background {\n background-color: var(--dt-color-surface-secondary);\n}\n\n.dt-editor--button-group-divider {\n margin-left: var(--dt-space-400);\n height: calc(var(--dt-size-550) + var(--dt-size-300));\n width: var(--dt-size-100);\n background: var(--dt-color-border-subtle);\n}\n</style>\n"],"names":["EDITOR_SUPPORTED_LINK_PROTOCOLS","EDITOR_DEFAULT_LINK_PREFIX","_sfc_main","DtRichTextEditor","DtButton","DtIcon","DtPopover","DtStack","DtInput","DtTooltip","autoFocus","RICH_TEXT_EDITOR_AUTOFOCUS_TYPES","RICH_TEXT_EDITOR_OUTPUT_FORMATS","individualButtonStacks","buttonData","buttonGroupData","button","newValue","event","_e","_d","_c","_b","_a","editor","prefixRegex","selection","openedInput","alignment"],"mappings":"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"}