@vkontakte/vkui 6.7.2 → 6.7.4

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 (296) hide show
  1. package/dist/cjs/components/BaseGallery/BaseGallery.d.ts.map +1 -1
  2. package/dist/cjs/components/BaseGallery/BaseGallery.js +5 -2
  3. package/dist/cjs/components/BaseGallery/BaseGallery.js.map +1 -1
  4. package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.d.ts.map +1 -1
  5. package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.js +5 -1
  6. package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.js.map +1 -1
  7. package/dist/cjs/components/Button/Button.d.ts +1 -0
  8. package/dist/cjs/components/Button/Button.d.ts.map +1 -1
  9. package/dist/cjs/components/Button/Button.js.map +1 -1
  10. package/dist/cjs/components/Calendar/Calendar.d.ts +6 -6
  11. package/dist/cjs/components/Calendar/Calendar.d.ts.map +1 -1
  12. package/dist/cjs/components/Calendar/Calendar.js +25 -5
  13. package/dist/cjs/components/Calendar/Calendar.js.map +1 -1
  14. package/dist/cjs/components/CalendarDay/CalendarDay.d.ts +4 -1
  15. package/dist/cjs/components/CalendarDay/CalendarDay.d.ts.map +1 -1
  16. package/dist/cjs/components/CalendarDay/CalendarDay.js +5 -3
  17. package/dist/cjs/components/CalendarDay/CalendarDay.js.map +1 -1
  18. package/dist/cjs/components/CalendarDays/CalendarDays.d.ts +6 -3
  19. package/dist/cjs/components/CalendarDays/CalendarDays.d.ts.map +1 -1
  20. package/dist/cjs/components/CalendarDays/CalendarDays.js +5 -3
  21. package/dist/cjs/components/CalendarDays/CalendarDays.js.map +1 -1
  22. package/dist/cjs/components/CalendarHeader/CalendarHeader.d.ts +8 -2
  23. package/dist/cjs/components/CalendarHeader/CalendarHeader.d.ts.map +1 -1
  24. package/dist/cjs/components/CalendarHeader/CalendarHeader.js +14 -6
  25. package/dist/cjs/components/CalendarHeader/CalendarHeader.js.map +1 -1
  26. package/dist/cjs/components/CalendarRange/CalendarRange.d.ts +8 -4
  27. package/dist/cjs/components/CalendarRange/CalendarRange.d.ts.map +1 -1
  28. package/dist/cjs/components/CalendarRange/CalendarRange.js +13 -8
  29. package/dist/cjs/components/CalendarRange/CalendarRange.js.map +1 -1
  30. package/dist/cjs/components/CalendarTime/CalendarTime.d.ts +9 -2
  31. package/dist/cjs/components/CalendarTime/CalendarTime.d.ts.map +1 -1
  32. package/dist/cjs/components/CalendarTime/CalendarTime.js +10 -5
  33. package/dist/cjs/components/CalendarTime/CalendarTime.js.map +1 -1
  34. package/dist/cjs/components/Clickable/useState.d.ts +1 -1
  35. package/dist/cjs/components/Clickable/useState.d.ts.map +1 -1
  36. package/dist/cjs/components/Clickable/useState.js +12 -19
  37. package/dist/cjs/components/Clickable/useState.js.map +1 -1
  38. package/dist/cjs/components/CustomSelect/CustomSelect.d.ts.map +1 -1
  39. package/dist/cjs/components/CustomSelect/CustomSelect.js +3 -18
  40. package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
  41. package/dist/cjs/components/DateInput/DateInput.d.ts +12 -3
  42. package/dist/cjs/components/DateInput/DateInput.d.ts.map +1 -1
  43. package/dist/cjs/components/DateInput/DateInput.js +26 -11
  44. package/dist/cjs/components/DateInput/DateInput.js.map +1 -1
  45. package/dist/cjs/components/DateRangeInput/DateRangeInput.d.ts +15 -3
  46. package/dist/cjs/components/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  47. package/dist/cjs/components/DateRangeInput/DateRangeInput.js +22 -11
  48. package/dist/cjs/components/DateRangeInput/DateRangeInput.js.map +1 -1
  49. package/dist/cjs/components/FocusTrap/FocusTrap.d.ts +1 -1
  50. package/dist/cjs/components/FocusTrap/FocusTrap.d.ts.map +1 -1
  51. package/dist/cjs/components/FocusTrap/FocusTrap.js +50 -41
  52. package/dist/cjs/components/FocusTrap/FocusTrap.js.map +1 -1
  53. package/dist/cjs/components/FormItem/FormItem.d.ts +0 -2
  54. package/dist/cjs/components/FormItem/FormItem.d.ts.map +1 -1
  55. package/dist/cjs/components/FormItem/FormItem.js.map +1 -1
  56. package/dist/cjs/components/Gallery/Gallery.d.ts +1 -1
  57. package/dist/cjs/components/Gallery/Gallery.d.ts.map +1 -1
  58. package/dist/cjs/components/Gallery/Gallery.js +12 -3
  59. package/dist/cjs/components/Gallery/Gallery.js.map +1 -1
  60. package/dist/cjs/components/Gallery/hooks.d.ts +9 -1
  61. package/dist/cjs/components/Gallery/hooks.d.ts.map +1 -1
  62. package/dist/cjs/components/Gallery/hooks.js +43 -25
  63. package/dist/cjs/components/Gallery/hooks.js.map +1 -1
  64. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
  65. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +19 -26
  66. package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  67. package/dist/cjs/components/Popover/Popover.js +1 -1
  68. package/dist/cjs/components/Popover/Popover.js.map +1 -1
  69. package/dist/cjs/hooks/useDateInput.d.ts +2 -1
  70. package/dist/cjs/hooks/useDateInput.d.ts.map +1 -1
  71. package/dist/cjs/hooks/useDateInput.js +29 -9
  72. package/dist/cjs/hooks/useDateInput.js.map +1 -1
  73. package/dist/cjs/lib/floating/customResizeObserver.d.ts.map +1 -1
  74. package/dist/cjs/lib/floating/customResizeObserver.js +0 -1
  75. package/dist/cjs/lib/floating/customResizeObserver.js.map +1 -1
  76. package/dist/cjs/lib/floating/types/component.d.ts +2 -2
  77. package/dist/cjs/lib/floating/types/component.d.ts.map +1 -1
  78. package/dist/cjs/lib/floating/useFloatingWithInteractions/index.d.ts +1 -0
  79. package/dist/cjs/lib/floating/useFloatingWithInteractions/index.d.ts.map +1 -1
  80. package/dist/cjs/lib/floating/useFloatingWithInteractions/index.js.map +1 -1
  81. package/dist/cjs/lib/floating/useFloatingWithInteractions/types.d.ts +2 -1
  82. package/dist/cjs/lib/floating/useFloatingWithInteractions/types.d.ts.map +1 -1
  83. package/dist/cjs/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.d.ts.map +1 -1
  84. package/dist/cjs/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +14 -1
  85. package/dist/cjs/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  86. package/dist/components/BaseGallery/BaseGallery.d.ts.map +1 -1
  87. package/dist/components/BaseGallery/BaseGallery.js +5 -2
  88. package/dist/components/BaseGallery/BaseGallery.js.map +1 -1
  89. package/dist/components/BaseGallery/CarouselBase/CarouselBase.d.ts.map +1 -1
  90. package/dist/components/BaseGallery/CarouselBase/CarouselBase.js +5 -1
  91. package/dist/components/BaseGallery/CarouselBase/CarouselBase.js.map +1 -1
  92. package/dist/components/Button/Button.d.ts +1 -0
  93. package/dist/components/Button/Button.d.ts.map +1 -1
  94. package/dist/components/Button/Button.js.map +1 -1
  95. package/dist/components/Calendar/Calendar.d.ts +6 -6
  96. package/dist/components/Calendar/Calendar.d.ts.map +1 -1
  97. package/dist/components/Calendar/Calendar.js +25 -5
  98. package/dist/components/Calendar/Calendar.js.map +1 -1
  99. package/dist/components/CalendarDay/CalendarDay.d.ts +4 -1
  100. package/dist/components/CalendarDay/CalendarDay.d.ts.map +1 -1
  101. package/dist/components/CalendarDay/CalendarDay.js +5 -3
  102. package/dist/components/CalendarDay/CalendarDay.js.map +1 -1
  103. package/dist/components/CalendarDays/CalendarDays.d.ts +6 -3
  104. package/dist/components/CalendarDays/CalendarDays.d.ts.map +1 -1
  105. package/dist/components/CalendarDays/CalendarDays.js +5 -3
  106. package/dist/components/CalendarDays/CalendarDays.js.map +1 -1
  107. package/dist/components/CalendarHeader/CalendarHeader.d.ts +8 -2
  108. package/dist/components/CalendarHeader/CalendarHeader.d.ts.map +1 -1
  109. package/dist/components/CalendarHeader/CalendarHeader.js +14 -6
  110. package/dist/components/CalendarHeader/CalendarHeader.js.map +1 -1
  111. package/dist/components/CalendarRange/CalendarRange.d.ts +8 -4
  112. package/dist/components/CalendarRange/CalendarRange.d.ts.map +1 -1
  113. package/dist/components/CalendarRange/CalendarRange.js +13 -8
  114. package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
  115. package/dist/components/CalendarTime/CalendarTime.d.ts +9 -2
  116. package/dist/components/CalendarTime/CalendarTime.d.ts.map +1 -1
  117. package/dist/components/CalendarTime/CalendarTime.js +10 -5
  118. package/dist/components/CalendarTime/CalendarTime.js.map +1 -1
  119. package/dist/components/Clickable/useState.d.ts +1 -1
  120. package/dist/components/Clickable/useState.d.ts.map +1 -1
  121. package/dist/components/Clickable/useState.js +12 -19
  122. package/dist/components/Clickable/useState.js.map +1 -1
  123. package/dist/components/CustomSelect/CustomSelect.d.ts.map +1 -1
  124. package/dist/components/CustomSelect/CustomSelect.js +3 -18
  125. package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
  126. package/dist/components/DateInput/DateInput.d.ts +12 -3
  127. package/dist/components/DateInput/DateInput.d.ts.map +1 -1
  128. package/dist/components/DateInput/DateInput.js +26 -11
  129. package/dist/components/DateInput/DateInput.js.map +1 -1
  130. package/dist/components/DateRangeInput/DateRangeInput.d.ts +15 -3
  131. package/dist/components/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  132. package/dist/components/DateRangeInput/DateRangeInput.js +22 -11
  133. package/dist/components/DateRangeInput/DateRangeInput.js.map +1 -1
  134. package/dist/components/FocusTrap/FocusTrap.d.ts +1 -1
  135. package/dist/components/FocusTrap/FocusTrap.d.ts.map +1 -1
  136. package/dist/components/FocusTrap/FocusTrap.js +51 -42
  137. package/dist/components/FocusTrap/FocusTrap.js.map +1 -1
  138. package/dist/components/FormItem/FormItem.d.ts +0 -2
  139. package/dist/components/FormItem/FormItem.d.ts.map +1 -1
  140. package/dist/components/FormItem/FormItem.js.map +1 -1
  141. package/dist/components/Gallery/Gallery.d.ts +1 -1
  142. package/dist/components/Gallery/Gallery.d.ts.map +1 -1
  143. package/dist/components/Gallery/Gallery.js +12 -3
  144. package/dist/components/Gallery/Gallery.js.map +1 -1
  145. package/dist/components/Gallery/hooks.d.ts +9 -1
  146. package/dist/components/Gallery/hooks.d.ts.map +1 -1
  147. package/dist/components/Gallery/hooks.js +43 -25
  148. package/dist/components/Gallery/hooks.js.map +1 -1
  149. package/dist/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
  150. package/dist/components/HorizontalScroll/HorizontalScroll.js +20 -27
  151. package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  152. package/dist/components/Popover/Popover.js +1 -1
  153. package/dist/components/Popover/Popover.js.map +1 -1
  154. package/dist/components.css +1 -1
  155. package/dist/components.css.map +1 -1
  156. package/dist/components.js.tmp +382 -230
  157. package/dist/cssm/components/BaseGallery/BaseGallery.d.ts.map +1 -1
  158. package/dist/cssm/components/BaseGallery/BaseGallery.js +3 -1
  159. package/dist/cssm/components/BaseGallery/BaseGallery.js.map +1 -1
  160. package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.d.ts.map +1 -1
  161. package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.js +5 -1
  162. package/dist/cssm/components/BaseGallery/CarouselBase/CarouselBase.js.map +1 -1
  163. package/dist/cssm/components/Button/Button.d.ts +1 -0
  164. package/dist/cssm/components/Button/Button.d.ts.map +1 -1
  165. package/dist/cssm/components/Button/Button.js +1 -0
  166. package/dist/cssm/components/Button/Button.js.map +1 -1
  167. package/dist/cssm/components/Calendar/Calendar.d.ts +6 -6
  168. package/dist/cssm/components/Calendar/Calendar.d.ts.map +1 -1
  169. package/dist/cssm/components/Calendar/Calendar.js +14 -4
  170. package/dist/cssm/components/Calendar/Calendar.js.map +1 -1
  171. package/dist/cssm/components/CalendarDay/CalendarDay.d.ts +4 -1
  172. package/dist/cssm/components/CalendarDay/CalendarDay.d.ts.map +1 -1
  173. package/dist/cssm/components/CalendarDay/CalendarDay.js +2 -1
  174. package/dist/cssm/components/CalendarDay/CalendarDay.js.map +1 -1
  175. package/dist/cssm/components/CalendarDays/CalendarDays.d.ts +6 -3
  176. package/dist/cssm/components/CalendarDays/CalendarDays.d.ts.map +1 -1
  177. package/dist/cssm/components/CalendarDays/CalendarDays.js +2 -1
  178. package/dist/cssm/components/CalendarDays/CalendarDays.js.map +1 -1
  179. package/dist/cssm/components/CalendarHeader/CalendarHeader.d.ts +8 -2
  180. package/dist/cssm/components/CalendarHeader/CalendarHeader.d.ts.map +1 -1
  181. package/dist/cssm/components/CalendarHeader/CalendarHeader.js +7 -3
  182. package/dist/cssm/components/CalendarHeader/CalendarHeader.js.map +1 -1
  183. package/dist/cssm/components/CalendarRange/CalendarRange.d.ts +8 -4
  184. package/dist/cssm/components/CalendarRange/CalendarRange.d.ts.map +1 -1
  185. package/dist/cssm/components/CalendarRange/CalendarRange.js +9 -5
  186. package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
  187. package/dist/cssm/components/CalendarTime/CalendarTime.d.ts +9 -2
  188. package/dist/cssm/components/CalendarTime/CalendarTime.d.ts.map +1 -1
  189. package/dist/cssm/components/CalendarTime/CalendarTime.js +10 -5
  190. package/dist/cssm/components/CalendarTime/CalendarTime.js.map +1 -1
  191. package/dist/cssm/components/CalendarTime/CalendarTime.module.css +4 -0
  192. package/dist/cssm/components/Clickable/useState.d.ts +1 -1
  193. package/dist/cssm/components/Clickable/useState.d.ts.map +1 -1
  194. package/dist/cssm/components/Clickable/useState.js +10 -11
  195. package/dist/cssm/components/Clickable/useState.js.map +1 -1
  196. package/dist/cssm/components/CustomSelect/CustomSelect.d.ts.map +1 -1
  197. package/dist/cssm/components/CustomSelect/CustomSelect.js +3 -18
  198. package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
  199. package/dist/cssm/components/DateInput/DateInput.d.ts +12 -3
  200. package/dist/cssm/components/DateInput/DateInput.d.ts.map +1 -1
  201. package/dist/cssm/components/DateInput/DateInput.js +18 -9
  202. package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
  203. package/dist/cssm/components/DateRangeInput/DateRangeInput.d.ts +15 -3
  204. package/dist/cssm/components/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  205. package/dist/cssm/components/DateRangeInput/DateRangeInput.js +17 -9
  206. package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map +1 -1
  207. package/dist/cssm/components/FocusTrap/FocusTrap.d.ts +1 -1
  208. package/dist/cssm/components/FocusTrap/FocusTrap.d.ts.map +1 -1
  209. package/dist/cssm/components/FocusTrap/FocusTrap.js +51 -42
  210. package/dist/cssm/components/FocusTrap/FocusTrap.js.map +1 -1
  211. package/dist/cssm/components/FormItem/FormItem.d.ts +0 -2
  212. package/dist/cssm/components/FormItem/FormItem.d.ts.map +1 -1
  213. package/dist/cssm/components/FormItem/FormItem.js.map +1 -1
  214. package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.module.css +1 -0
  215. package/dist/cssm/components/Gallery/Gallery.d.ts +1 -1
  216. package/dist/cssm/components/Gallery/Gallery.d.ts.map +1 -1
  217. package/dist/cssm/components/Gallery/Gallery.js +9 -2
  218. package/dist/cssm/components/Gallery/Gallery.js.map +1 -1
  219. package/dist/cssm/components/Gallery/hooks.d.ts +9 -1
  220. package/dist/cssm/components/Gallery/hooks.d.ts.map +1 -1
  221. package/dist/cssm/components/Gallery/hooks.js +43 -25
  222. package/dist/cssm/components/Gallery/hooks.js.map +1 -1
  223. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.d.ts.map +1 -1
  224. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +20 -27
  225. package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
  226. package/dist/cssm/components/Popover/Popover.js +1 -1
  227. package/dist/cssm/components/Popover/Popover.js.map +1 -1
  228. package/dist/cssm/hooks/useDateInput.d.ts +2 -1
  229. package/dist/cssm/hooks/useDateInput.d.ts.map +1 -1
  230. package/dist/cssm/hooks/useDateInput.js +30 -9
  231. package/dist/cssm/hooks/useDateInput.js.map +1 -1
  232. package/dist/cssm/lib/floating/customResizeObserver.d.ts.map +1 -1
  233. package/dist/cssm/lib/floating/customResizeObserver.js +0 -1
  234. package/dist/cssm/lib/floating/customResizeObserver.js.map +1 -1
  235. package/dist/cssm/lib/floating/types/component.d.ts +2 -2
  236. package/dist/cssm/lib/floating/types/component.d.ts.map +1 -1
  237. package/dist/cssm/lib/floating/types/component.js.map +1 -1
  238. package/dist/cssm/lib/floating/useFloatingWithInteractions/index.d.ts +1 -0
  239. package/dist/cssm/lib/floating/useFloatingWithInteractions/index.d.ts.map +1 -1
  240. package/dist/cssm/lib/floating/useFloatingWithInteractions/index.js.map +1 -1
  241. package/dist/cssm/lib/floating/useFloatingWithInteractions/types.d.ts +2 -1
  242. package/dist/cssm/lib/floating/useFloatingWithInteractions/types.d.ts.map +1 -1
  243. package/dist/cssm/lib/floating/useFloatingWithInteractions/types.js.map +1 -1
  244. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.d.ts.map +1 -1
  245. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +14 -1
  246. package/dist/cssm/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  247. package/dist/hooks/useDateInput.d.ts +2 -1
  248. package/dist/hooks/useDateInput.d.ts.map +1 -1
  249. package/dist/hooks/useDateInput.js +30 -9
  250. package/dist/hooks/useDateInput.js.map +1 -1
  251. package/dist/lib/floating/customResizeObserver.d.ts.map +1 -1
  252. package/dist/lib/floating/customResizeObserver.js +0 -1
  253. package/dist/lib/floating/customResizeObserver.js.map +1 -1
  254. package/dist/lib/floating/types/component.d.ts +2 -2
  255. package/dist/lib/floating/types/component.d.ts.map +1 -1
  256. package/dist/lib/floating/types/component.js.map +1 -1
  257. package/dist/lib/floating/useFloatingWithInteractions/index.d.ts +1 -0
  258. package/dist/lib/floating/useFloatingWithInteractions/index.d.ts.map +1 -1
  259. package/dist/lib/floating/useFloatingWithInteractions/index.js.map +1 -1
  260. package/dist/lib/floating/useFloatingWithInteractions/types.d.ts +2 -1
  261. package/dist/lib/floating/useFloatingWithInteractions/types.d.ts.map +1 -1
  262. package/dist/lib/floating/useFloatingWithInteractions/types.js.map +1 -1
  263. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.d.ts.map +1 -1
  264. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js +14 -1
  265. package/dist/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.js.map +1 -1
  266. package/dist/vkui.css +1 -1
  267. package/dist/vkui.css.map +1 -1
  268. package/dist/vkui.js.tmp +382 -230
  269. package/package.json +1 -1
  270. package/src/components/BaseGallery/BaseGallery.tsx +8 -1
  271. package/src/components/BaseGallery/CarouselBase/CarouselBase.tsx +6 -1
  272. package/src/components/Button/Button.tsx +1 -0
  273. package/src/components/Calendar/Calendar.tsx +49 -6
  274. package/src/components/CalendarDay/CalendarDay.tsx +7 -1
  275. package/src/components/CalendarDays/CalendarDays.tsx +9 -1
  276. package/src/components/CalendarHeader/CalendarHeader.tsx +21 -1
  277. package/src/components/CalendarRange/CalendarRange.tsx +24 -3
  278. package/src/components/CalendarTime/CalendarTime.module.css +4 -0
  279. package/src/components/CalendarTime/CalendarTime.tsx +39 -10
  280. package/src/components/Clickable/useState.tsx +30 -27
  281. package/src/components/CustomSelect/CustomSelect.tsx +4 -17
  282. package/src/components/DateInput/DateInput.tsx +32 -3
  283. package/src/components/DateRangeInput/DateRangeInput.tsx +28 -1
  284. package/src/components/FocusTrap/FocusTrap.tsx +75 -45
  285. package/src/components/FormItem/FormItem.tsx +0 -2
  286. package/src/components/FormLayoutGroup/FormLayoutGroup.module.css +1 -0
  287. package/src/components/Gallery/Gallery.tsx +10 -1
  288. package/src/components/Gallery/hooks.ts +49 -33
  289. package/src/components/HorizontalScroll/HorizontalScroll.tsx +23 -28
  290. package/src/components/Popover/Popover.tsx +1 -1
  291. package/src/hooks/useDateInput.ts +23 -6
  292. package/src/lib/floating/customResizeObserver.ts +0 -1
  293. package/src/lib/floating/types/component.ts +2 -1
  294. package/src/lib/floating/useFloatingWithInteractions/index.ts +2 -0
  295. package/src/lib/floating/useFloatingWithInteractions/types.ts +3 -1
  296. package/src/lib/floating/useFloatingWithInteractions/useFloatingWithInteractions.ts +15 -3
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/CalendarDay/CalendarDay.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ENABLE_KEYBOARD_INPUT_EVENT_NAME } from '../../hooks/useKeyboardInputTracker';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarDay.module.css';\n\nexport type CalendarDayElementProps = Omit<\n React.AllHTMLAttributes<HTMLElement>,\n 'onChange' | 'size' | 'disabled' | 'selected'\n>;\n\nexport interface CalendarDayProps extends CalendarDayElementProps {\n day: Date;\n today?: boolean;\n selected?: boolean;\n selectionStart?: boolean;\n selectionEnd?: boolean;\n hintedSelectionStart?: boolean;\n hintedSelectionEnd?: boolean;\n active?: boolean;\n hidden?: boolean;\n disabled?: boolean;\n focused?: boolean;\n hinted?: boolean;\n sameMonth?: boolean;\n size?: 's' | 'm';\n onChange: (value: Date) => void;\n onEnter?: (value: Date) => void;\n onLeave?: (value: Date) => void;\n // Функция отрисовки контента в ячейке дня\n renderDayContent?: (day: Date) => React.ReactNode;\n}\n\nexport const CalendarDay: React.FC<CalendarDayProps> = React.memo(\n ({\n day,\n today,\n selected,\n onChange,\n hidden,\n disabled,\n active,\n selectionStart,\n selectionEnd,\n focused,\n onEnter,\n onLeave,\n hinted,\n hintedSelectionStart,\n hintedSelectionEnd,\n sameMonth,\n size,\n className,\n children,\n renderDayContent,\n ...restProps\n }: CalendarDayProps) => {\n const { locale } = useConfigProvider();\n const ref = React.useRef<HTMLElement>(null);\n const onClick = React.useCallback(() => onChange(day), [day, onChange]);\n const handleEnter = React.useCallback(() => onEnter?.(day), [day, onEnter]);\n const handleLeave = React.useCallback(() => onLeave?.(day), [day, onLeave]);\n\n const label = new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(day);\n\n React.useEffect(() => {\n if (focused && ref.current) {\n ref.current.dispatchEvent(new Event(ENABLE_KEYBOARD_INPUT_EVENT_NAME, { bubbles: true }));\n ref.current.focus();\n }\n }, [focused]);\n\n const content = React.useMemo(() => {\n if (renderDayContent) {\n return renderDayContent(day);\n }\n return (\n <div className={styles['CalendarDay__day-number']}>\n <VisuallyHidden>{children ?? label}</VisuallyHidden>\n <span aria-hidden>{day.getDate()}</span>\n </div>\n );\n }, [renderDayContent, day, children, label]);\n\n if (hidden) {\n return <div className={styles['CalendarDay__hidden']} />;\n }\n\n return (\n <Tappable\n className={classNames(\n styles['CalendarDay'],\n size === 's' && styles['CalendarDay--size-s'],\n today && styles['CalendarDay--today'],\n selected && !disabled && styles['CalendarDay--selected'],\n selectionStart && styles['CalendarDay--selection-start'],\n selectionEnd && styles['CalendarDay--selection-end'],\n disabled && styles['CalendarDay--disabled'],\n !sameMonth && styles['CalendarDay--not-same-month'],\n className,\n )}\n hoverMode={active ? '' : styles['CalendarDay--hover']}\n hasActive={false}\n onClick={onClick}\n disabled={disabled}\n tabIndex={-1}\n getRootRef={ref}\n focusVisibleMode={active ? 'outside' : 'inside'}\n onPointerEnter={handleEnter}\n onPointerLeave={handleLeave}\n {...restProps}\n >\n <div\n className={classNames(\n styles['CalendarDay__hinted'],\n hinted && styles['CalendarDay__hinted--active'],\n hintedSelectionStart && styles['CalendarDay__hinted--selection-start'],\n hintedSelectionEnd && styles['CalendarDay__hinted--selection-end'],\n )}\n >\n <div\n className={classNames(\n styles['CalendarDay__inner'],\n active && !disabled && styles['CalendarDay__inner--active'],\n )}\n >\n {content}\n </div>\n </div>\n </Tappable>\n );\n },\n);\n\nCalendarDay.displayName = 'CalendarDay';\n"],"names":["React","classNames","ENABLE_KEYBOARD_INPUT_EVENT_NAME","useConfigProvider","Tappable","VisuallyHidden","styles","CalendarDay","memo","day","today","selected","onChange","hidden","disabled","active","selectionStart","selectionEnd","focused","onEnter","onLeave","hinted","hintedSelectionStart","hintedSelectionEnd","sameMonth","size","className","children","renderDayContent","restProps","locale","ref","useRef","onClick","useCallback","handleEnter","handleLeave","label","Intl","DateTimeFormat","weekday","year","month","format","useEffect","current","dispatchEvent","Event","bubbles","focus","content","useMemo","div","span","aria-hidden","getDate","hoverMode","hasActive","tabIndex","getRootRef","focusVisibleMode","onPointerEnter","onPointerLeave","displayName"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/CalendarDay/CalendarDay.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ENABLE_KEYBOARD_INPUT_EVENT_NAME } from '../../hooks/useKeyboardInputTracker';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarDay.module.css';\n\nexport type CalendarDayElementProps = Omit<\n React.AllHTMLAttributes<HTMLElement>,\n 'onChange' | 'size' | 'disabled' | 'selected'\n>;\n\nexport type CalendarDayTestsProps = {\n testId?: string | ((day: Date) => string);\n};\n\nexport interface CalendarDayProps extends CalendarDayElementProps, CalendarDayTestsProps {\n day: Date;\n today?: boolean;\n selected?: boolean;\n selectionStart?: boolean;\n selectionEnd?: boolean;\n hintedSelectionStart?: boolean;\n hintedSelectionEnd?: boolean;\n active?: boolean;\n hidden?: boolean;\n disabled?: boolean;\n focused?: boolean;\n hinted?: boolean;\n sameMonth?: boolean;\n size?: 's' | 'm';\n onChange: (value: Date) => void;\n onEnter?: (value: Date) => void;\n onLeave?: (value: Date) => void;\n // Функция отрисовки контента в ячейке дня\n renderDayContent?: (day: Date) => React.ReactNode;\n}\n\nexport const CalendarDay: React.FC<CalendarDayProps> = React.memo(\n ({\n day,\n today,\n selected,\n onChange,\n hidden,\n disabled,\n active,\n selectionStart,\n selectionEnd,\n focused,\n onEnter,\n onLeave,\n hinted,\n hintedSelectionStart,\n hintedSelectionEnd,\n sameMonth,\n size,\n className,\n children,\n renderDayContent,\n testId,\n ...restProps\n }: CalendarDayProps) => {\n const { locale } = useConfigProvider();\n const ref = React.useRef<HTMLElement>(null);\n const onClick = React.useCallback(() => onChange(day), [day, onChange]);\n const handleEnter = React.useCallback(() => onEnter?.(day), [day, onEnter]);\n const handleLeave = React.useCallback(() => onLeave?.(day), [day, onLeave]);\n\n const label = new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(day);\n\n React.useEffect(() => {\n if (focused && ref.current) {\n ref.current.dispatchEvent(new Event(ENABLE_KEYBOARD_INPUT_EVENT_NAME, { bubbles: true }));\n ref.current.focus();\n }\n }, [focused]);\n\n const content = React.useMemo(() => {\n if (renderDayContent) {\n return renderDayContent(day);\n }\n return (\n <div className={styles['CalendarDay__day-number']}>\n <VisuallyHidden>{children ?? label}</VisuallyHidden>\n <span aria-hidden>{day.getDate()}</span>\n </div>\n );\n }, [renderDayContent, day, children, label]);\n\n if (hidden) {\n return <div className={styles['CalendarDay__hidden']} />;\n }\n\n return (\n <Tappable\n className={classNames(\n styles['CalendarDay'],\n size === 's' && styles['CalendarDay--size-s'],\n today && styles['CalendarDay--today'],\n selected && !disabled && styles['CalendarDay--selected'],\n selectionStart && styles['CalendarDay--selection-start'],\n selectionEnd && styles['CalendarDay--selection-end'],\n disabled && styles['CalendarDay--disabled'],\n !sameMonth && styles['CalendarDay--not-same-month'],\n className,\n )}\n hoverMode={active ? '' : styles['CalendarDay--hover']}\n hasActive={false}\n onClick={onClick}\n disabled={disabled}\n tabIndex={-1}\n getRootRef={ref}\n focusVisibleMode={active ? 'outside' : 'inside'}\n onPointerEnter={handleEnter}\n onPointerLeave={handleLeave}\n data-testid={typeof testId === 'string' ? testId : testId?.(day)}\n {...restProps}\n >\n <div\n className={classNames(\n styles['CalendarDay__hinted'],\n hinted && styles['CalendarDay__hinted--active'],\n hintedSelectionStart && styles['CalendarDay__hinted--selection-start'],\n hintedSelectionEnd && styles['CalendarDay__hinted--selection-end'],\n )}\n >\n <div\n className={classNames(\n styles['CalendarDay__inner'],\n active && !disabled && styles['CalendarDay__inner--active'],\n )}\n >\n {content}\n </div>\n </div>\n </Tappable>\n );\n },\n);\n\nCalendarDay.displayName = 'CalendarDay';\n"],"names":["React","classNames","ENABLE_KEYBOARD_INPUT_EVENT_NAME","useConfigProvider","Tappable","VisuallyHidden","styles","CalendarDay","memo","day","today","selected","onChange","hidden","disabled","active","selectionStart","selectionEnd","focused","onEnter","onLeave","hinted","hintedSelectionStart","hintedSelectionEnd","sameMonth","size","className","children","renderDayContent","testId","restProps","locale","ref","useRef","onClick","useCallback","handleEnter","handleLeave","label","Intl","DateTimeFormat","weekday","year","month","format","useEffect","current","dispatchEvent","Event","bubbles","focus","content","useMemo","div","span","aria-hidden","getDate","hoverMode","hasActive","tabIndex","getRootRef","focusVisibleMode","onPointerEnter","onPointerLeave","data-testid","displayName"],"mappings":"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"}
@@ -1,7 +1,10 @@
1
1
  import * as React from 'react';
2
2
  import type { HTMLAttributesWithRootRef } from '../../types';
3
- import { type CalendarDayElementProps, type CalendarDayProps } from '../CalendarDay/CalendarDay';
4
- export interface CalendarDaysProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, Pick<CalendarDayProps, 'renderDayContent'> {
3
+ import { type CalendarDayElementProps, type CalendarDayProps, type CalendarDayTestsProps } from '../CalendarDay/CalendarDay';
4
+ export type CalendarDaysTestsProps = {
5
+ dayTestId?: CalendarDayTestsProps['testId'];
6
+ };
7
+ export interface CalendarDaysProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, Pick<CalendarDayProps, 'renderDayContent'>, CalendarDaysTestsProps {
5
8
  value?: Date | Array<Date | null>;
6
9
  viewDate: Date;
7
10
  weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
@@ -22,5 +25,5 @@ export interface CalendarDaysProps extends Omit<HTMLAttributesWithRootRef<HTMLDi
22
25
  onDayEnter?: (value: Date) => void;
23
26
  onDayLeave?: (value: Date) => void;
24
27
  }
25
- export declare const CalendarDays: ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth, dayProps, listenDayChangesForUpdate, getRootRef, renderDayContent, ...props }: CalendarDaysProps) => React.ReactNode;
28
+ export declare const CalendarDays: ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth, dayProps, listenDayChangesForUpdate, getRootRef, renderDayContent, dayTestId, ...props }: CalendarDaysProps) => React.ReactNode;
26
29
  //# sourceMappingURL=CalendarDays.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarDays.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,gBAAgB,EACtB,MAAM,4BAA4B,CAAC;AAMpC,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CAAC,gBAAgB,EAAE,kBAAkB,CAAC;IAC5C,KAAK,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAClC,QAAQ,EAAE,IAAI,CAAC;IACf,YAAY,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACxC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB,QAAQ,CAAC,EAAE,uBAAuB,CAAC;IACnC,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACxC,mBAAmB,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACjE,iBAAiB,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/D,yBAAyB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACxE,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACtE,WAAW,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACvC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACzC,YAAY,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACvC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,YAAY,sVAuBtB,iBAAiB,KAAG,KAAK,CAAC,SA2E5B,CAAC"}
1
+ {"version":3,"file":"CalendarDays.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC3B,MAAM,4BAA4B,CAAC;AAMpC,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;CAC7C,CAAC;AAEF,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CAAC,gBAAgB,EAAE,kBAAkB,CAAC,EAC1C,sBAAsB;IACxB,KAAK,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAClC,QAAQ,EAAE,IAAI,CAAC;IACf,YAAY,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACxC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB,QAAQ,CAAC,EAAE,uBAAuB,CAAC;IACnC,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACxC,mBAAmB,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACjE,iBAAiB,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/D,yBAAyB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACxE,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC;IACtE,WAAW,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACvC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACzC,YAAY,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IACvC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,YAAY,iWAwBtB,iBAAiB,KAAG,KAAK,CAAC,SA4E5B,CAAC"}
@@ -10,7 +10,7 @@ import { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';
10
10
  import { RootComponent } from '../RootComponent/RootComponent';
11
11
  import { Footnote } from '../Typography/Footnote/Footnote';
12
12
  import styles from './CalendarDays.module.css';
13
- export const CalendarDays = ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth = false, dayProps, listenDayChangesForUpdate = false, getRootRef, renderDayContent, ...props })=>{
13
+ export const CalendarDays = ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth = false, dayProps, listenDayChangesForUpdate = false, getRootRef, renderDayContent, dayTestId, ...props })=>{
14
14
  const { locale } = useConfigProvider();
15
15
  const ref = useExternRef(getRootRef);
16
16
  const now = useTodayDate(listenDayChangesForUpdate);
@@ -65,6 +65,7 @@ export const CalendarDays = ({ viewDate, value, weekStartsOn, onDayChange, isDay
65
65
  sameMonth: sameMonth,
66
66
  size: size,
67
67
  renderDayContent: renderDayContent,
68
+ testId: dayTestId,
68
69
  ...dayProps
69
70
  }, day.toISOString());
70
71
  })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isSameDay, isSameMonth } from 'date-fns';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport {\n CalendarDay,\n type CalendarDayElementProps,\n type CalendarDayProps,\n} from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport interface CalendarDaysProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<CalendarDayProps, 'renderDayContent'> {\n value?: Date | Array<Date | null>;\n viewDate: Date;\n weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n showNeighboringMonth?: boolean;\n size?: 's' | 'm';\n dayProps?: CalendarDayElementProps;\n listenDayChangesForUpdate?: boolean;\n onDayChange: (value: Date) => void;\n isDayDisabled: (value: Date) => boolean;\n isDaySelectionStart: (value: Date, dayOfWeek: number) => boolean;\n isDaySelectionEnd: (value: Date, dayOfWeek: number) => boolean;\n isHintedDaySelectionStart?: (value: Date, dayOfWeek: number) => boolean;\n isHintedDaySelectionEnd?: (value: Date, dayOfWeek: number) => boolean;\n isDayActive: (value: Date) => boolean;\n isDayHinted?: (value: Date) => boolean;\n isDaySelected?: (value: Date) => boolean;\n isDayFocused: (value: Date) => boolean;\n onDayEnter?: (value: Date) => void;\n onDayLeave?: (value: Date) => void;\n}\n\nexport const CalendarDays = ({\n viewDate,\n value,\n weekStartsOn,\n onDayChange,\n isDaySelected,\n isDayActive,\n isDaySelectionEnd,\n isDaySelectionStart,\n onDayEnter,\n onDayLeave,\n isDayHinted,\n isHintedDaySelectionStart,\n isHintedDaySelectionEnd,\n isDayFocused,\n isDayDisabled,\n size,\n showNeighboringMonth = false,\n dayProps,\n listenDayChangesForUpdate = false,\n getRootRef,\n renderDayContent,\n ...props\n}: CalendarDaysProps): React.ReactNode => {\n const { locale } = useConfigProvider();\n const ref = useExternRef(getRootRef);\n const now = useTodayDate(listenDayChangesForUpdate);\n\n const weeks = React.useMemo(() => getWeeks(viewDate, weekStartsOn), [weekStartsOn, viewDate]);\n\n const daysNames = React.useMemo(\n () => getDaysNames(now, weekStartsOn, locale),\n [locale, now, weekStartsOn],\n );\n\n const handleDayChange = React.useCallback(\n (date: Date) => {\n onDayChange(date);\n\n ref.current?.focus();\n },\n [onDayChange, ref],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarDays']} getRootRef={ref}>\n <div\n className={classNames(\n styles['CalendarDays__row'],\n size === 's' && styles['CalendarDays__row--size-s'],\n )}\n >\n {daysNames.map((dayName) => (\n <Footnote key={dayName} className={styles['CalendarDays__weekday']}>\n {dayName}\n </Footnote>\n ))}\n </div>\n\n {weeks.map((week, i) => (\n <div\n className={classNames(\n styles['CalendarDays__row'],\n size === 's' && styles['CalendarDays__row--size-s'],\n )}\n key={i}\n >\n {week.map((day, i) => {\n const sameMonth = isSameMonth(day, viewDate);\n return (\n <CalendarDay\n key={day.toISOString()}\n day={day}\n today={isSameDay(day, now)}\n active={isDayActive(day)}\n onChange={handleDayChange}\n hidden={!showNeighboringMonth && !sameMonth}\n disabled={isDayDisabled(day)}\n selectionStart={isDaySelectionStart(day, i)}\n selectionEnd={isDaySelectionEnd(day, i)}\n hintedSelectionStart={isHintedDaySelectionStart?.(day, i)}\n hintedSelectionEnd={isHintedDaySelectionEnd?.(day, i)}\n selected={isDaySelected?.(day)}\n focused={isDayFocused(day)}\n onEnter={onDayEnter}\n onLeave={onDayLeave}\n hinted={isDayHinted?.(day)}\n sameMonth={sameMonth}\n size={size}\n renderDayContent={renderDayContent}\n {...dayProps}\n />\n );\n })}\n </div>\n ))}\n </RootComponent>\n );\n};\n"],"names":["React","classNames","isSameDay","isSameMonth","useExternRef","useTodayDate","getDaysNames","getWeeks","CalendarDay","useConfigProvider","RootComponent","Footnote","styles","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","listenDayChangesForUpdate","getRootRef","renderDayContent","props","locale","ref","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","baseClassName","div","className","map","dayName","week","i","day","sameMonth","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted","toISOString"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,SAAS,EAAEC,WAAW,QAAQ,WAAW;AAClD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,EAAEC,QAAQ,QAAQ,qBAAqB;AAE5D,SACEC,WAAW,QAGN,6BAA6B;AACpC,SAASC,iBAAiB,QAAQ,0CAA0C;AAC5E,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,OAAOC,YAAY,4BAA4B;AA0B/C,OAAO,MAAMC,eAAe,CAAC,EAC3BC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,mBAAmB,EACnBC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,yBAAyB,EACzBC,uBAAuB,EACvBC,YAAY,EACZC,aAAa,EACbC,IAAI,EACJC,uBAAuB,KAAK,EAC5BC,QAAQ,EACRC,4BAA4B,KAAK,EACjCC,UAAU,EACVC,gBAAgB,EAChB,GAAGC,OACe;IAClB,MAAM,EAAEC,MAAM,EAAE,GAAG3B;IACnB,MAAM4B,MAAMjC,aAAa6B;IACzB,MAAMK,MAAMjC,aAAa2B;IAEzB,MAAMO,QAAQvC,MAAMwC,OAAO,CAAC,IAAMjC,SAASO,UAAUE,eAAe;QAACA;QAAcF;KAAS;IAE5F,MAAM2B,YAAYzC,MAAMwC,OAAO,CAC7B,IAAMlC,aAAagC,KAAKtB,cAAcoB,SACtC;QAACA;QAAQE;QAAKtB;KAAa;IAG7B,MAAM0B,kBAAkB1C,MAAM2C,WAAW,CACvC,CAACC;QACC3B,YAAY2B;QAEZP,IAAIQ,OAAO,EAAEC;IACf,GACA;QAAC7B;QAAaoB;KAAI;IAGpB,qBACE,MAAC3B;QAAe,GAAGyB,KAAK;QAAEY,eAAenC,MAAM,CAAC,eAAe;QAAEqB,YAAYI;;0BAC3E,KAACW;gBACCC,WAAWhD,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;0BAGpD6B,UAAUS,GAAG,CAAC,CAACC,wBACd,KAACxC;wBAAuBsC,WAAWrC,MAAM,CAAC,wBAAwB;kCAC/DuC;uBADYA;;YAMlBZ,MAAMW,GAAG,CAAC,CAACE,MAAMC,kBAChB,KAACL;oBACCC,WAAWhD,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;8BAIpDwC,KAAKF,GAAG,CAAC,CAACI,KAAKD;wBACd,MAAME,YAAYpD,YAAYmD,KAAKxC;wBACnC,qBACE,KAACN;4BAEC8C,KAAKA;4BACLE,OAAOtD,UAAUoD,KAAKhB;4BACtBmB,QAAQtC,YAAYmC;4BACpBI,UAAUhB;4BACViB,QAAQ,CAAC7B,wBAAwB,CAACyB;4BAClCK,UAAUhC,cAAc0B;4BACxBO,gBAAgBxC,oBAAoBiC,KAAKD;4BACzCS,cAAc1C,kBAAkBkC,KAAKD;4BACrCU,sBAAsBtC,4BAA4B6B,KAAKD;4BACvDW,oBAAoBtC,0BAA0B4B,KAAKD;4BACnDY,UAAU/C,gBAAgBoC;4BAC1BY,SAASvC,aAAa2B;4BACtBa,SAAS7C;4BACT8C,SAAS7C;4BACT8C,QAAQ7C,cAAc8B;4BACtBC,WAAWA;4BACX1B,MAAMA;4BACNK,kBAAkBA;4BACjB,GAAGH,QAAQ;2BAnBPuB,IAAIgB,WAAW;oBAsB1B;mBA5BKjB;;;AAiCf,EAAE"}
1
+ {"version":3,"sources":["../../../../src/components/CalendarDays/CalendarDays.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isSameDay, isSameMonth } from 'date-fns';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useTodayDate } from '../../hooks/useTodayDate';\nimport { getDaysNames, getWeeks } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport {\n CalendarDay,\n type CalendarDayElementProps,\n type CalendarDayProps,\n type CalendarDayTestsProps,\n} from '../CalendarDay/CalendarDay';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './CalendarDays.module.css';\n\nexport type CalendarDaysTestsProps = {\n dayTestId?: CalendarDayTestsProps['testId'];\n};\n\nexport interface CalendarDaysProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<CalendarDayProps, 'renderDayContent'>,\n CalendarDaysTestsProps {\n value?: Date | Array<Date | null>;\n viewDate: Date;\n weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n showNeighboringMonth?: boolean;\n size?: 's' | 'm';\n dayProps?: CalendarDayElementProps;\n listenDayChangesForUpdate?: boolean;\n onDayChange: (value: Date) => void;\n isDayDisabled: (value: Date) => boolean;\n isDaySelectionStart: (value: Date, dayOfWeek: number) => boolean;\n isDaySelectionEnd: (value: Date, dayOfWeek: number) => boolean;\n isHintedDaySelectionStart?: (value: Date, dayOfWeek: number) => boolean;\n isHintedDaySelectionEnd?: (value: Date, dayOfWeek: number) => boolean;\n isDayActive: (value: Date) => boolean;\n isDayHinted?: (value: Date) => boolean;\n isDaySelected?: (value: Date) => boolean;\n isDayFocused: (value: Date) => boolean;\n onDayEnter?: (value: Date) => void;\n onDayLeave?: (value: Date) => void;\n}\n\nexport const CalendarDays = ({\n viewDate,\n value,\n weekStartsOn,\n onDayChange,\n isDaySelected,\n isDayActive,\n isDaySelectionEnd,\n isDaySelectionStart,\n onDayEnter,\n onDayLeave,\n isDayHinted,\n isHintedDaySelectionStart,\n isHintedDaySelectionEnd,\n isDayFocused,\n isDayDisabled,\n size,\n showNeighboringMonth = false,\n dayProps,\n listenDayChangesForUpdate = false,\n getRootRef,\n renderDayContent,\n dayTestId,\n ...props\n}: CalendarDaysProps): React.ReactNode => {\n const { locale } = useConfigProvider();\n const ref = useExternRef(getRootRef);\n const now = useTodayDate(listenDayChangesForUpdate);\n\n const weeks = React.useMemo(() => getWeeks(viewDate, weekStartsOn), [weekStartsOn, viewDate]);\n\n const daysNames = React.useMemo(\n () => getDaysNames(now, weekStartsOn, locale),\n [locale, now, weekStartsOn],\n );\n\n const handleDayChange = React.useCallback(\n (date: Date) => {\n onDayChange(date);\n\n ref.current?.focus();\n },\n [onDayChange, ref],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarDays']} getRootRef={ref}>\n <div\n className={classNames(\n styles['CalendarDays__row'],\n size === 's' && styles['CalendarDays__row--size-s'],\n )}\n >\n {daysNames.map((dayName) => (\n <Footnote key={dayName} className={styles['CalendarDays__weekday']}>\n {dayName}\n </Footnote>\n ))}\n </div>\n\n {weeks.map((week, i) => (\n <div\n className={classNames(\n styles['CalendarDays__row'],\n size === 's' && styles['CalendarDays__row--size-s'],\n )}\n key={i}\n >\n {week.map((day, i) => {\n const sameMonth = isSameMonth(day, viewDate);\n return (\n <CalendarDay\n key={day.toISOString()}\n day={day}\n today={isSameDay(day, now)}\n active={isDayActive(day)}\n onChange={handleDayChange}\n hidden={!showNeighboringMonth && !sameMonth}\n disabled={isDayDisabled(day)}\n selectionStart={isDaySelectionStart(day, i)}\n selectionEnd={isDaySelectionEnd(day, i)}\n hintedSelectionStart={isHintedDaySelectionStart?.(day, i)}\n hintedSelectionEnd={isHintedDaySelectionEnd?.(day, i)}\n selected={isDaySelected?.(day)}\n focused={isDayFocused(day)}\n onEnter={onDayEnter}\n onLeave={onDayLeave}\n hinted={isDayHinted?.(day)}\n sameMonth={sameMonth}\n size={size}\n renderDayContent={renderDayContent}\n testId={dayTestId}\n {...dayProps}\n />\n );\n })}\n </div>\n ))}\n </RootComponent>\n );\n};\n"],"names":["React","classNames","isSameDay","isSameMonth","useExternRef","useTodayDate","getDaysNames","getWeeks","CalendarDay","useConfigProvider","RootComponent","Footnote","styles","CalendarDays","viewDate","value","weekStartsOn","onDayChange","isDaySelected","isDayActive","isDaySelectionEnd","isDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","isHintedDaySelectionStart","isHintedDaySelectionEnd","isDayFocused","isDayDisabled","size","showNeighboringMonth","dayProps","listenDayChangesForUpdate","getRootRef","renderDayContent","dayTestId","props","locale","ref","now","weeks","useMemo","daysNames","handleDayChange","useCallback","date","current","focus","baseClassName","div","className","map","dayName","week","i","day","sameMonth","today","active","onChange","hidden","disabled","selectionStart","selectionEnd","hintedSelectionStart","hintedSelectionEnd","selected","focused","onEnter","onLeave","hinted","testId","toISOString"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,SAAS,EAAEC,WAAW,QAAQ,WAAW;AAClD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,EAAEC,QAAQ,QAAQ,qBAAqB;AAE5D,SACEC,WAAW,QAIN,6BAA6B;AACpC,SAASC,iBAAiB,QAAQ,0CAA0C;AAC5E,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,OAAOC,YAAY,4BAA4B;AA+B/C,OAAO,MAAMC,eAAe,CAAC,EAC3BC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,mBAAmB,EACnBC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,yBAAyB,EACzBC,uBAAuB,EACvBC,YAAY,EACZC,aAAa,EACbC,IAAI,EACJC,uBAAuB,KAAK,EAC5BC,QAAQ,EACRC,4BAA4B,KAAK,EACjCC,UAAU,EACVC,gBAAgB,EAChBC,SAAS,EACT,GAAGC,OACe;IAClB,MAAM,EAAEC,MAAM,EAAE,GAAG5B;IACnB,MAAM6B,MAAMlC,aAAa6B;IACzB,MAAMM,MAAMlC,aAAa2B;IAEzB,MAAMQ,QAAQxC,MAAMyC,OAAO,CAAC,IAAMlC,SAASO,UAAUE,eAAe;QAACA;QAAcF;KAAS;IAE5F,MAAM4B,YAAY1C,MAAMyC,OAAO,CAC7B,IAAMnC,aAAaiC,KAAKvB,cAAcqB,SACtC;QAACA;QAAQE;QAAKvB;KAAa;IAG7B,MAAM2B,kBAAkB3C,MAAM4C,WAAW,CACvC,CAACC;QACC5B,YAAY4B;QAEZP,IAAIQ,OAAO,EAAEC;IACf,GACA;QAAC9B;QAAaqB;KAAI;IAGpB,qBACE,MAAC5B;QAAe,GAAG0B,KAAK;QAAEY,eAAepC,MAAM,CAAC,eAAe;QAAEqB,YAAYK;;0BAC3E,KAACW;gBACCC,WAAWjD,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;0BAGpD8B,UAAUS,GAAG,CAAC,CAACC,wBACd,KAACzC;wBAAuBuC,WAAWtC,MAAM,CAAC,wBAAwB;kCAC/DwC;uBADYA;;YAMlBZ,MAAMW,GAAG,CAAC,CAACE,MAAMC,kBAChB,KAACL;oBACCC,WAAWjD,WACTW,MAAM,CAAC,oBAAoB,EAC3BiB,SAAS,OAAOjB,MAAM,CAAC,4BAA4B;8BAIpDyC,KAAKF,GAAG,CAAC,CAACI,KAAKD;wBACd,MAAME,YAAYrD,YAAYoD,KAAKzC;wBACnC,qBACE,KAACN;4BAEC+C,KAAKA;4BACLE,OAAOvD,UAAUqD,KAAKhB;4BACtBmB,QAAQvC,YAAYoC;4BACpBI,UAAUhB;4BACViB,QAAQ,CAAC9B,wBAAwB,CAAC0B;4BAClCK,UAAUjC,cAAc2B;4BACxBO,gBAAgBzC,oBAAoBkC,KAAKD;4BACzCS,cAAc3C,kBAAkBmC,KAAKD;4BACrCU,sBAAsBvC,4BAA4B8B,KAAKD;4BACvDW,oBAAoBvC,0BAA0B6B,KAAKD;4BACnDY,UAAUhD,gBAAgBqC;4BAC1BY,SAASxC,aAAa4B;4BACtBa,SAAS9C;4BACT+C,SAAS9C;4BACT+C,QAAQ9C,cAAc+B;4BACtBC,WAAWA;4BACX3B,MAAMA;4BACNK,kBAAkBA;4BAClBqC,QAAQpC;4BACP,GAAGJ,QAAQ;2BApBPwB,IAAIiB,WAAW;oBAuB1B;mBA7BKlB;;;AAkCf,EAAE"}
@@ -1,7 +1,13 @@
1
1
  import * as React from 'react';
2
2
  import type { HTMLAttributesWithRootRef } from '../../types';
3
3
  type ArrowMonthProps = Omit<React.AllHTMLAttributes<HTMLElement>, 'onClick' | 'aria-label'>;
4
- export interface CalendarHeaderProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {
4
+ export type CalendarHeaderTestsProps = {
5
+ monthDropdownTestId?: string | ((monthIndex: number) => string);
6
+ yearDropdownTestId?: string | ((year: number) => string);
7
+ nextMonthButtonTestId?: string;
8
+ prevMonthButtonTestId?: string;
9
+ };
10
+ export interface CalendarHeaderProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, CalendarHeaderTestsProps {
5
11
  viewDate: Date;
6
12
  /**
7
13
  * Скрывает иконку для переключения на предыдущий месяц
@@ -32,6 +38,6 @@ export interface CalendarHeaderProps extends Omit<HTMLAttributesWithRootRef<HTML
32
38
  */
33
39
  onPrevMonth?: () => void;
34
40
  }
35
- export declare const CalendarHeader: ({ viewDate, onChange, prevMonthHidden: prevMonthHiddenProp, nextMonthHidden: nextMonthHiddenProp, disablePickers, onNextMonth, onPrevMonth, prevMonthProps, nextMonthProps, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, prevMonthIcon, nextMonthIcon, isMonthDisabled, isYearDisabled, ...restProps }: CalendarHeaderProps) => React.ReactNode;
41
+ export declare const CalendarHeader: ({ viewDate, onChange, prevMonthHidden: prevMonthHiddenProp, nextMonthHidden: nextMonthHiddenProp, disablePickers, onNextMonth, onPrevMonth, prevMonthProps, nextMonthProps, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, prevMonthIcon, nextMonthIcon, isMonthDisabled, isYearDisabled, monthDropdownTestId, yearDropdownTestId, prevMonthButtonTestId, nextMonthButtonTestId, ...restProps }: CalendarHeaderProps) => React.ReactNode;
36
42
  export {};
37
43
  //# sourceMappingURL=CalendarHeader.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAU7D,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;AAE5F,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACnE,QAAQ,EAAE,IAAI,CAAC;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC;IAClE,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD,QAAQ,EAAE,CAAC,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,iUA+BxB,mBAAmB,KAAG,KAAK,CAAC,SAgK9B,CAAC"}
1
+ {"version":3,"file":"CalendarHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAU7D,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC,CAAC;AAE5F,MAAM,MAAM,wBAAwB,GAAG;IACrC,mBAAmB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,UAAU,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IAChE,kBAAkB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IACzD,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,wBAAwB;IAC1B,QAAQ,EAAE,IAAI,CAAC;IACf;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,cAAc,CAAC,EAAE,eAAe,CAAC;IACjC,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC;IAClE,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD,QAAQ,EAAE,CAAC,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,cAAc,wZAmCxB,mBAAmB,KAAG,KAAK,CAAC,SAwK9B,CAAC"}
@@ -20,7 +20,7 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
20
20
  className: styles['CalendarHeader__nav-icon--accent'],
21
21
  width: 30,
22
22
  height: 30
23
- }), isMonthDisabled, isYearDisabled, ...restProps })=>{
23
+ }), isMonthDisabled, isYearDisabled, monthDropdownTestId, yearDropdownTestId, prevMonthButtonTestId, nextMonthButtonTestId, ...restProps })=>{
24
24
  const { locale } = useConfigProvider();
25
25
  const onMonthsChange = React.useCallback((event)=>onChange(setMonth(viewDate, Number(event.target.value))), [
26
26
  onChange,
@@ -73,6 +73,7 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
73
73
  children: /*#__PURE__*/ _jsxs(Tappable, {
74
74
  className: classNames(styles['CalendarHeader__nav-icon'], styles['CalendarHeader__nav-icon-prev'], prevMonthClassName),
75
75
  onClick: onPrevMonth,
76
+ "data-testid": prevMonthButtonTestId,
76
77
  ...restPrevMonthProps,
77
78
  children: [
78
79
  /*#__PURE__*/ _jsxs(VisuallyHidden, {
@@ -116,7 +117,8 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
116
117
  onChange: onMonthsChange,
117
118
  forceDropdownPortal: false,
118
119
  selectType: "accent",
119
- "aria-label": changeMonthLabel
120
+ "aria-label": changeMonthLabel,
121
+ "data-testid": typeof monthDropdownTestId === 'string' ? monthDropdownTestId : monthDropdownTestId?.(currentMonth)
120
122
  }),
121
123
  /*#__PURE__*/ _jsx(CustomSelect, {
122
124
  className: classNames(styles['CalendarHeader__picker'], 'vkuiInternalCalendarHeader__picker'),
@@ -128,7 +130,8 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
128
130
  onChange: onYearChange,
129
131
  forceDropdownPortal: false,
130
132
  selectType: "accent",
131
- "aria-label": changeYearLabel
133
+ "aria-label": changeYearLabel,
134
+ "data-testid": yearDropdownTestId
132
135
  })
133
136
  ]
134
137
  })
@@ -138,6 +141,7 @@ export const CalendarHeader = ({ viewDate, onChange, prevMonthHidden: prevMonthH
138
141
  children: /*#__PURE__*/ _jsxs(Tappable, {
139
142
  className: classNames(styles['CalendarHeader__nav-icon'], styles['CalendarHeader__nav-icon-next'], nextMonthClassName),
140
143
  onClick: onNextMonth,
144
+ "data-testid": nextMonthButtonTestId,
141
145
  ...restNextMonthProps,
142
146
  children: [
143
147
  /*#__PURE__*/ _jsxs(VisuallyHidden, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon12Dropdown,\n Icon20ChevronLeftOutline,\n Icon20ChevronRightOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { addMonths, setMonth, setYear, subMonths } from 'date-fns';\nimport { DEFAULT_MAX_YEAR, DEFAULT_MIN_YEAR, getMonths, getYears } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<React.AllHTMLAttributes<HTMLElement>, 'onClick' | 'aria-label'>;\n\nexport interface CalendarHeaderProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {\n viewDate: Date;\n /**\n * Скрывает иконку для переключения на предыдущий месяц\n */\n prevMonthHidden?: boolean;\n /**\n * Скрывает иконку для переключения на следующий месяц\n */\n nextMonthHidden?: boolean;\n disablePickers?: boolean;\n prevMonthLabel?: string;\n nextMonthLabel?: string;\n changeMonthLabel?: string;\n changeYearLabel?: string;\n prevMonthIcon?: React.ReactNode;\n nextMonthIcon?: React.ReactNode;\n prevMonthProps?: ArrowMonthProps;\n nextMonthProps?: ArrowMonthProps;\n isMonthDisabled?: (monthNumber: number, year?: number) => boolean;\n isYearDisabled?: (yearNumber: number) => boolean;\n onChange: (viewDate: Date) => void;\n /**\n * Нажатие на кнопку переключения на следующий месяц.\n */\n onNextMonth?: () => void;\n /**\n * Нажатие на кнопку переключения на предыдущий месяц.\n */\n onPrevMonth?: () => void;\n}\n\nexport const CalendarHeader = ({\n viewDate,\n onChange,\n prevMonthHidden: prevMonthHiddenProp = false,\n nextMonthHidden: nextMonthHiddenProp = false,\n disablePickers = false,\n onNextMonth,\n onPrevMonth,\n prevMonthProps = {},\n nextMonthProps = {},\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n prevMonthIcon = (\n <Icon20ChevronLeftOutline\n className={styles['CalendarHeader__nav-icon--accent']}\n width={30}\n height={30}\n />\n ),\n nextMonthIcon = (\n <Icon20ChevronRightOutline\n className={styles['CalendarHeader__nav-icon--accent']}\n width={30}\n height={30}\n />\n ),\n isMonthDisabled,\n isYearDisabled,\n ...restProps\n}: CalendarHeaderProps): React.ReactNode => {\n const { locale } = useConfigProvider();\n const onMonthsChange = React.useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) =>\n onChange(setMonth(viewDate, Number(event.target.value))),\n [onChange, viewDate],\n );\n const onYearChange = React.useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) =>\n onChange(setYear(viewDate, Number(event.target.value))),\n [onChange, viewDate],\n );\n\n const currentYear = viewDate.getFullYear();\n const currentMonth = viewDate.getMonth();\n\n const months = React.useMemo(\n () =>\n getMonths(locale).map(({ value, label }) => ({\n value,\n label: <span className={styles['CalendarHeader__month']}>{label}</span>,\n disabled: isMonthDisabled && isMonthDisabled(value),\n })),\n [locale, isMonthDisabled],\n );\n\n const years = React.useMemo(\n () =>\n getYears(currentYear, 100).map((year) => ({\n ...year,\n disabled: isYearDisabled && isYearDisabled(year.value),\n })),\n [currentYear, isYearDisabled],\n );\n\n const formatter = new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n month: 'long',\n });\n\n const { className: prevMonthClassName, ...restPrevMonthProps } = prevMonthProps;\n const { className: nextMonthClassName, ...restNextMonthProps } = nextMonthProps;\n\n let nextMonthHidden =\n nextMonthHiddenProp || (currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR);\n if (isMonthDisabled && !nextMonthHidden) {\n nextMonthHidden = isMonthDisabled(\n currentMonth === 11 ? 0 : currentMonth + 1,\n currentMonth === 11 ? Math.min(currentYear + 1, DEFAULT_MAX_YEAR) : currentYear,\n );\n }\n\n let prevMonthHidden =\n prevMonthHiddenProp || (currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR);\n if (isMonthDisabled && !prevMonthHidden) {\n prevMonthHidden = isMonthDisabled(\n currentMonth === 0 ? 11 : currentMonth - 1,\n currentMonth === 0 ? Math.max(currentYear - 1, DEFAULT_MIN_YEAR) : currentYear,\n );\n }\n\n return (\n <RootComponent baseClassName={styles['CalendarHeader']} {...restProps}>\n {!prevMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-prev'],\n prevMonthClassName,\n )}\n onClick={onPrevMonth}\n {...restPrevMonthProps}\n >\n <VisuallyHidden>\n {prevMonthLabel}, {formatter.format(subMonths(viewDate, 1))}\n </VisuallyHidden>\n {prevMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n {disablePickers ? (\n <Paragraph\n className={classNames(\n styles['CalendarHeader__pickers'],\n 'vkuiInternalCalendarHeader__pickers',\n )}\n weight=\"2\"\n >\n <span className={styles['CalendarHeader__month']}>\n {new Intl.DateTimeFormat(locale, {\n month: 'long',\n }).format(viewDate)}\n </span>\n &nbsp;\n {new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n }).format(viewDate)}\n </Paragraph>\n ) : (\n <AdaptivityProvider sizeY=\"compact\">\n <div\n className={classNames(\n styles['CalendarHeader__pickers'],\n 'vkuiInternalCalendarHeader__pickers',\n )}\n >\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentMonth}\n options={months}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onMonthsChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeMonthLabel}\n />\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentYear}\n options={years}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onYearChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeYearLabel}\n />\n </div>\n </AdaptivityProvider>\n )}\n {!nextMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-next'],\n nextMonthClassName,\n )}\n onClick={onNextMonth}\n {...restNextMonthProps}\n >\n <VisuallyHidden>\n {nextMonthLabel}, {formatter.format(addMonths(viewDate, 1))}\n </VisuallyHidden>\n {nextMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n </RootComponent>\n );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","addMonths","setMonth","setYear","subMonths","DEFAULT_MAX_YEAR","DEFAULT_MIN_YEAR","getMonths","getYears","AdaptivityProvider","useConfigProvider","CustomSelect","RootComponent","Tappable","Paragraph","VisuallyHidden","styles","CalendarHeader","viewDate","onChange","prevMonthHidden","prevMonthHiddenProp","nextMonthHidden","nextMonthHiddenProp","disablePickers","onNextMonth","onPrevMonth","prevMonthProps","nextMonthProps","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","prevMonthIcon","className","width","height","nextMonthIcon","isMonthDisabled","isYearDisabled","restProps","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","currentYear","getFullYear","currentMonth","getMonth","months","useMemo","map","label","span","disabled","years","year","formatter","Intl","DateTimeFormat","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","Math","min","max","baseClassName","sizeX","onClick","format","weight","sizeY","div","options","dropdownOffsetDistance","dropdownAutoWidth","icon","forceDropdownPortal","selectType","aria-label"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Icon12Dropdown,\n Icon20ChevronLeftOutline,\n Icon20ChevronRightOutline,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { addMonths, setMonth, setYear, subMonths } from 'date-fns';\nimport { DEFAULT_MAX_YEAR, DEFAULT_MIN_YEAR, getMonths, getYears } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './CalendarHeader.module.css';\n\ntype ArrowMonthProps = Omit<React.AllHTMLAttributes<HTMLElement>, 'onClick' | 'aria-label'>;\n\nexport type CalendarHeaderTestsProps = {\n monthDropdownTestId?: string | ((monthIndex: number) => string);\n yearDropdownTestId?: string | ((year: number) => string);\n nextMonthButtonTestId?: string;\n prevMonthButtonTestId?: string;\n};\n\nexport interface CalendarHeaderProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n CalendarHeaderTestsProps {\n viewDate: Date;\n /**\n * Скрывает иконку для переключения на предыдущий месяц\n */\n prevMonthHidden?: boolean;\n /**\n * Скрывает иконку для переключения на следующий месяц\n */\n nextMonthHidden?: boolean;\n disablePickers?: boolean;\n prevMonthLabel?: string;\n nextMonthLabel?: string;\n changeMonthLabel?: string;\n changeYearLabel?: string;\n prevMonthIcon?: React.ReactNode;\n nextMonthIcon?: React.ReactNode;\n prevMonthProps?: ArrowMonthProps;\n nextMonthProps?: ArrowMonthProps;\n isMonthDisabled?: (monthNumber: number, year?: number) => boolean;\n isYearDisabled?: (yearNumber: number) => boolean;\n onChange: (viewDate: Date) => void;\n /**\n * Нажатие на кнопку переключения на следующий месяц.\n */\n onNextMonth?: () => void;\n /**\n * Нажатие на кнопку переключения на предыдущий месяц.\n */\n onPrevMonth?: () => void;\n}\n\nexport const CalendarHeader = ({\n viewDate,\n onChange,\n prevMonthHidden: prevMonthHiddenProp = false,\n nextMonthHidden: nextMonthHiddenProp = false,\n disablePickers = false,\n onNextMonth,\n onPrevMonth,\n prevMonthProps = {},\n nextMonthProps = {},\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n prevMonthIcon = (\n <Icon20ChevronLeftOutline\n className={styles['CalendarHeader__nav-icon--accent']}\n width={30}\n height={30}\n />\n ),\n nextMonthIcon = (\n <Icon20ChevronRightOutline\n className={styles['CalendarHeader__nav-icon--accent']}\n width={30}\n height={30}\n />\n ),\n isMonthDisabled,\n isYearDisabled,\n monthDropdownTestId,\n yearDropdownTestId,\n prevMonthButtonTestId,\n nextMonthButtonTestId,\n ...restProps\n}: CalendarHeaderProps): React.ReactNode => {\n const { locale } = useConfigProvider();\n const onMonthsChange = React.useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) =>\n onChange(setMonth(viewDate, Number(event.target.value))),\n [onChange, viewDate],\n );\n const onYearChange = React.useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>) =>\n onChange(setYear(viewDate, Number(event.target.value))),\n [onChange, viewDate],\n );\n\n const currentYear = viewDate.getFullYear();\n const currentMonth = viewDate.getMonth();\n\n const months = React.useMemo(\n () =>\n getMonths(locale).map(({ value, label }) => ({\n value,\n label: <span className={styles['CalendarHeader__month']}>{label}</span>,\n disabled: isMonthDisabled && isMonthDisabled(value),\n })),\n [locale, isMonthDisabled],\n );\n\n const years = React.useMemo(\n () =>\n getYears(currentYear, 100).map((year) => ({\n ...year,\n disabled: isYearDisabled && isYearDisabled(year.value),\n })),\n [currentYear, isYearDisabled],\n );\n\n const formatter = new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n month: 'long',\n });\n\n const { className: prevMonthClassName, ...restPrevMonthProps } = prevMonthProps;\n const { className: nextMonthClassName, ...restNextMonthProps } = nextMonthProps;\n\n let nextMonthHidden =\n nextMonthHiddenProp || (currentMonth === 11 && currentYear === DEFAULT_MAX_YEAR);\n if (isMonthDisabled && !nextMonthHidden) {\n nextMonthHidden = isMonthDisabled(\n currentMonth === 11 ? 0 : currentMonth + 1,\n currentMonth === 11 ? Math.min(currentYear + 1, DEFAULT_MAX_YEAR) : currentYear,\n );\n }\n\n let prevMonthHidden =\n prevMonthHiddenProp || (currentMonth === 0 && currentYear === DEFAULT_MIN_YEAR);\n if (isMonthDisabled && !prevMonthHidden) {\n prevMonthHidden = isMonthDisabled(\n currentMonth === 0 ? 11 : currentMonth - 1,\n currentMonth === 0 ? Math.max(currentYear - 1, DEFAULT_MIN_YEAR) : currentYear,\n );\n }\n\n return (\n <RootComponent baseClassName={styles['CalendarHeader']} {...restProps}>\n {!prevMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-prev'],\n prevMonthClassName,\n )}\n onClick={onPrevMonth}\n data-testid={prevMonthButtonTestId}\n {...restPrevMonthProps}\n >\n <VisuallyHidden>\n {prevMonthLabel}, {formatter.format(subMonths(viewDate, 1))}\n </VisuallyHidden>\n {prevMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n {disablePickers ? (\n <Paragraph\n className={classNames(\n styles['CalendarHeader__pickers'],\n 'vkuiInternalCalendarHeader__pickers',\n )}\n weight=\"2\"\n >\n <span className={styles['CalendarHeader__month']}>\n {new Intl.DateTimeFormat(locale, {\n month: 'long',\n }).format(viewDate)}\n </span>\n &nbsp;\n {new Intl.DateTimeFormat(locale, {\n year: 'numeric',\n }).format(viewDate)}\n </Paragraph>\n ) : (\n <AdaptivityProvider sizeY=\"compact\">\n <div\n className={classNames(\n styles['CalendarHeader__pickers'],\n 'vkuiInternalCalendarHeader__pickers',\n )}\n >\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentMonth}\n options={months}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onMonthsChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeMonthLabel}\n data-testid={\n typeof monthDropdownTestId === 'string'\n ? monthDropdownTestId\n : monthDropdownTestId?.(currentMonth)\n }\n />\n <CustomSelect\n className={classNames(\n styles['CalendarHeader__picker'],\n 'vkuiInternalCalendarHeader__picker',\n )}\n value={currentYear}\n options={years}\n dropdownOffsetDistance={4}\n dropdownAutoWidth\n icon={<Icon12Dropdown />}\n onChange={onYearChange}\n forceDropdownPortal={false}\n selectType=\"accent\"\n aria-label={changeYearLabel}\n data-testid={yearDropdownTestId}\n />\n </div>\n </AdaptivityProvider>\n )}\n {!nextMonthHidden && (\n <AdaptivityProvider sizeX=\"regular\">\n <Tappable\n className={classNames(\n styles['CalendarHeader__nav-icon'],\n styles['CalendarHeader__nav-icon-next'],\n nextMonthClassName,\n )}\n onClick={onNextMonth}\n data-testid={nextMonthButtonTestId}\n {...restNextMonthProps}\n >\n <VisuallyHidden>\n {nextMonthLabel}, {formatter.format(addMonths(viewDate, 1))}\n </VisuallyHidden>\n {nextMonthIcon}\n </Tappable>\n </AdaptivityProvider>\n )}\n </RootComponent>\n );\n};\n"],"names":["React","Icon12Dropdown","Icon20ChevronLeftOutline","Icon20ChevronRightOutline","classNames","addMonths","setMonth","setYear","subMonths","DEFAULT_MAX_YEAR","DEFAULT_MIN_YEAR","getMonths","getYears","AdaptivityProvider","useConfigProvider","CustomSelect","RootComponent","Tappable","Paragraph","VisuallyHidden","styles","CalendarHeader","viewDate","onChange","prevMonthHidden","prevMonthHiddenProp","nextMonthHidden","nextMonthHiddenProp","disablePickers","onNextMonth","onPrevMonth","prevMonthProps","nextMonthProps","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","prevMonthIcon","className","width","height","nextMonthIcon","isMonthDisabled","isYearDisabled","monthDropdownTestId","yearDropdownTestId","prevMonthButtonTestId","nextMonthButtonTestId","restProps","locale","onMonthsChange","useCallback","event","Number","target","value","onYearChange","currentYear","getFullYear","currentMonth","getMonth","months","useMemo","map","label","span","disabled","years","year","formatter","Intl","DateTimeFormat","month","prevMonthClassName","restPrevMonthProps","nextMonthClassName","restNextMonthProps","Math","min","max","baseClassName","sizeX","onClick","data-testid","format","weight","sizeY","div","options","dropdownOffsetDistance","dropdownAutoWidth","icon","forceDropdownPortal","selectType","aria-label"],"mappings":"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"}
@@ -1,9 +1,13 @@
1
1
  import * as React from 'react';
2
2
  import type { HTMLAttributesWithRootRef } from '../../types';
3
- import { type CalendarDaysProps } from '../CalendarDays/CalendarDays';
4
- import { type CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';
3
+ import { type CalendarDaysProps, type CalendarDaysTestsProps } from '../CalendarDays/CalendarDays';
4
+ import { type CalendarHeaderProps, type CalendarHeaderTestsProps } from '../CalendarHeader/CalendarHeader';
5
5
  export type DateRangeType = [Date | null, Date | null];
6
- export interface CalendarRangeProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, Pick<CalendarHeaderProps, 'prevMonthLabel' | 'nextMonthLabel' | 'changeMonthLabel' | 'changeYearLabel' | 'prevMonthIcon' | 'nextMonthIcon'>, Pick<CalendarDaysProps, 'listenDayChangesForUpdate' | 'renderDayContent'> {
6
+ export type CalendarRangeTestsProps = CalendarDaysTestsProps & {
7
+ leftPartHeaderTestsData?: CalendarHeaderTestsProps;
8
+ rightPartHeaderTestsData?: CalendarHeaderTestsProps;
9
+ };
10
+ export interface CalendarRangeProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, Pick<CalendarHeaderProps, 'prevMonthLabel' | 'nextMonthLabel' | 'changeMonthLabel' | 'changeYearLabel' | 'prevMonthIcon' | 'nextMonthIcon'>, Pick<CalendarDaysProps, 'listenDayChangesForUpdate' | 'renderDayContent'>, CalendarRangeTestsProps {
7
11
  value?: DateRangeType;
8
12
  disablePast?: boolean;
9
13
  disableFuture?: boolean;
@@ -17,5 +21,5 @@ export interface CalendarRangeProps extends Omit<HTMLAttributesWithRootRef<HTMLD
17
21
  /**
18
22
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
19
23
  */
20
- export declare const CalendarRange: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn, disablePickers, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, changeDayLabel, prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, renderDayContent, ...props }: CalendarRangeProps) => React.ReactNode;
24
+ export declare const CalendarRange: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn, disablePickers, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, changeDayLabel, prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, renderDayContent, dayTestId, leftPartHeaderTestsData, rightPartHeaderTestsData, ...props }: CalendarRangeProps) => React.ReactNode;
21
25
  //# sourceMappingURL=CalendarRange.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACpF,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAI5F,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAEvD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,GAAG,kBAAkB,CAAC;IAC3E,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACtD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,sRAmBvB,kBAAkB,KAAG,KAAK,CAAC,SAoM7B,CAAC"}
1
+ {"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,sBAAsB,EAC5B,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,wBAAwB,EAC9B,MAAM,kCAAkC,CAAC;AAI1C,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAEvD,MAAM,MAAM,uBAAuB,GAAG,sBAAsB,GAAG;IAC7D,uBAAuB,CAAC,EAAE,wBAAwB,CAAC;IACnD,wBAAwB,CAAC,EAAE,wBAAwB,CAAC;CACrD,CAAC;AAEF,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,GAAG,kBAAkB,CAAC,EACzE,uBAAuB;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACtD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,oVAsBvB,kBAAkB,KAAG,KAAK,CAAC,SAwM7B,CAAC"}
@@ -18,7 +18,7 @@ const getIsDaySelected = (day, value)=>{
18
18
  };
19
19
  /**
20
20
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
21
- */ export const CalendarRange = ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn = 1, disablePickers, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeDayLabel = 'Изменить день', prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, renderDayContent, ...props })=>{
21
+ */ export const CalendarRange = ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn = 1, disablePickers, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeDayLabel = 'Изменить день', prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, renderDayContent, dayTestId, leftPartHeaderTestsData, rightPartHeaderTestsData, ...props })=>{
22
22
  const { viewDate, setViewDate, setPrevMonth, setNextMonth, focusedDay, setFocusedDay, isDayFocused, isDayDisabled, resetSelectedDay, isMonthDisabled, isYearDisabled } = useCalendar({
23
23
  value,
24
24
  disableFuture,
@@ -135,7 +135,8 @@ const getIsDaySelected = (day, value)=>{
135
135
  changeYearLabel: changeYearLabel,
136
136
  prevMonthIcon: prevMonthIcon,
137
137
  isMonthDisabled: isMonthDisabled,
138
- isYearDisabled: isYearDisabled
138
+ isYearDisabled: isYearDisabled,
139
+ ...leftPartHeaderTestsData
139
140
  }),
140
141
  /*#__PURE__*/ _jsx(CalendarDays, {
141
142
  viewDate: viewDate,
@@ -156,7 +157,8 @@ const getIsDaySelected = (day, value)=>{
156
157
  isDayDisabled: isDayDisabled,
157
158
  listenDayChangesForUpdate: listenDayChangesForUpdate,
158
159
  renderDayContent: renderDayContent,
159
- "aria-label": changeDayLabel
160
+ "aria-label": changeDayLabel,
161
+ dayTestId: dayTestId
160
162
  })
161
163
  ]
162
164
  }),
@@ -176,7 +178,8 @@ const getIsDaySelected = (day, value)=>{
176
178
  changeYearLabel: changeYearLabel,
177
179
  nextMonthIcon: nextMonthIcon,
178
180
  isMonthDisabled: isMonthDisabled,
179
- isYearDisabled: isYearDisabled
181
+ isYearDisabled: isYearDisabled,
182
+ ...rightPartHeaderTestsData
180
183
  }),
181
184
  /*#__PURE__*/ _jsx(CalendarDays, {
182
185
  viewDate: secondViewDate,
@@ -199,7 +202,8 @@ const getIsDaySelected = (day, value)=>{
199
202
  listenDayChangesForUpdate: listenDayChangesForUpdate,
200
203
  renderDayContent: renderDayContent,
201
204
  tabIndex: 0,
202
- onBlur: resetSelectedDay
205
+ onBlur: resetSelectedDay,
206
+ dayTestId: dayTestId
203
207
  })
204
208
  ]
205
209
  })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n addMonths,\n endOfDay,\n isAfter,\n isBefore,\n isSameDay,\n isSameMonth,\n isWithinInterval,\n startOfDay,\n subMonths,\n} from 'date-fns';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, type CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, type CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport type DateRangeType = [Date | null, Date | null];\n\nexport interface CalendarRangeProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<\n CalendarHeaderProps,\n | 'prevMonthLabel'\n | 'nextMonthLabel'\n | 'changeMonthLabel'\n | 'changeYearLabel'\n | 'prevMonthIcon'\n | 'nextMonthIcon'\n >,\n Pick<CalendarDaysProps, 'listenDayChangesForUpdate' | 'renderDayContent'> {\n value?: DateRangeType;\n disablePast?: boolean;\n disableFuture?: boolean;\n disablePickers?: boolean;\n changeDayLabel?: string;\n weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n onChange?: (value: DateRangeType | undefined) => void;\n shouldDisableDate?: (value: Date) => boolean;\n onClose?: () => void;\n}\n\nconst getIsDaySelected = (day: Date, value?: DateRangeType) => {\n if (!value?.[0] || !value[1]) {\n return false;\n }\n\n return isWithinInterval(day, { start: startOfDay(value[0]), end: endOfDay(value[1]) });\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n value,\n onChange,\n disablePast,\n disableFuture,\n shouldDisableDate,\n onClose,\n weekStartsOn = 1,\n disablePickers,\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n changeDayLabel = 'Изменить день',\n prevMonthIcon,\n nextMonthIcon,\n listenDayChangesForUpdate,\n renderDayContent,\n ...props\n}: CalendarRangeProps): React.ReactNode => {\n const {\n viewDate,\n setViewDate,\n setPrevMonth,\n setNextMonth,\n focusedDay,\n setFocusedDay,\n isDayFocused,\n isDayDisabled,\n resetSelectedDay,\n isMonthDisabled,\n isYearDisabled,\n } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n const [hintedDate, setHintedDate] = React.useState<DateRangeType>();\n const secondViewDate = addMonths(viewDate, 1);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n event.preventDefault();\n }\n\n const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n if (\n newFocusedDay &&\n !isSameMonth(newFocusedDay, viewDate) &&\n !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n ) {\n setViewDate(newFocusedDay);\n }\n setFocusedDay(newFocusedDay);\n },\n [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n );\n\n const getNewValue = React.useCallback(\n (date: Date): DateRangeType => {\n const isValueEmpty = !value || (value[0] === null && value[1] === null);\n if (isValueEmpty) {\n return [date, null];\n }\n\n const [start, end] = value;\n if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n return [setTimeEqual(date, start), setTimeEqual(date, end)];\n } else if (start && isBefore(date, start)) {\n return [setTimeEqual(date, start), end];\n } else if (start && isAfter(date, start)) {\n return [start, setTimeEqual(date, end)];\n }\n return value;\n },\n [value],\n );\n\n const onDayChange = React.useCallback(\n (date: Date) => {\n onChange?.(getNewValue(date));\n setHintedDate(undefined);\n },\n [onChange, getNewValue],\n );\n\n const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n const isDayActive = React.useCallback(\n (day: Date) =>\n Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n [value],\n );\n\n const isDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n [value],\n );\n\n const isHintedDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n [hintedDate],\n );\n\n const isDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n [value],\n );\n\n const isHintedDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n [hintedDate],\n );\n\n const onDayEnter = React.useCallback(\n (date: Date) => setHintedDate(getNewValue(date)),\n [setHintedDate, getNewValue],\n );\n\n const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n const isDayHinted = React.useCallback(\n (day: Date) => getIsDaySelected(day, hintedDate),\n [hintedDate],\n );\n\n const onRightPartViewDateChange = React.useCallback(\n (newDate: Date) => setViewDate(subMonths(newDate, 1)),\n [setViewDate],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={viewDate}\n onChange={setViewDate}\n nextMonthHidden\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n prevMonthIcon={prevMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\n />\n <CalendarDays\n viewDate={viewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n onKeyDown={handleKeyDown}\n isDayFocused={isDayFocused}\n onDayChange={onDayChange}\n isDaySelected={isDaySelected}\n isDayActive={isDayActive}\n isDaySelectionEnd={isDaySelectionEnd}\n isDaySelectionStart={isDaySelectionStart}\n isDayHinted={isDayHinted}\n onDayEnter={onDayEnter}\n onDayLeave={onDayLeave}\n isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n isHintedDaySelectionStart={isHintedDaySelectionStart}\n isDayDisabled={isDayDisabled}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n renderDayContent={renderDayContent}\n aria-label={changeDayLabel}\n />\n </div>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={secondViewDate}\n onChange={onRightPartViewDateChange}\n prevMonthHidden\n onNextMonth={setNextMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n nextMonthIcon={nextMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\n />\n <CalendarDays\n viewDate={secondViewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n aria-label={changeDayLabel}\n onKeyDown={handleKeyDown}\n isDayFocused={isDayFocused}\n onDayChange={onDayChange}\n isDaySelected={isDaySelected}\n isDayActive={isDayActive}\n isDaySelectionEnd={isDaySelectionEnd}\n isDaySelectionStart={isDaySelectionStart}\n isDayHinted={isDayHinted}\n onDayEnter={onDayEnter}\n onDayLeave={onDayLeave}\n isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n isHintedDaySelectionStart={isHintedDaySelectionStart}\n isDayDisabled={isDayDisabled}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n renderDayContent={renderDayContent}\n tabIndex={0}\n onBlur={resetSelectedDay}\n />\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","subMonths","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","CalendarDays","CalendarHeader","RootComponent","styles","getIsDaySelected","day","value","start","end","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","disablePickers","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeDayLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","renderDayContent","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","isMonthDisabled","isYearDisabled","hintedDate","setHintedDate","useState","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","isValueEmpty","onDayChange","undefined","isDaySelected","isDayActive","Boolean","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","onRightPartViewDateChange","newDate","baseClassName","div","className","nextMonthHidden","onPrevMonth","onKeyDown","aria-label","prevMonthHidden","onNextMonth","tabIndex","onBlur"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n addMonths,\n endOfDay,\n isAfter,\n isBefore,\n isSameDay,\n isSameMonth,\n isWithinInterval,\n startOfDay,\n subMonths,\n} from 'date-fns';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport {\n CalendarDays,\n type CalendarDaysProps,\n type CalendarDaysTestsProps,\n} from '../CalendarDays/CalendarDays';\nimport {\n CalendarHeader,\n type CalendarHeaderProps,\n type CalendarHeaderTestsProps,\n} from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport type DateRangeType = [Date | null, Date | null];\n\nexport type CalendarRangeTestsProps = CalendarDaysTestsProps & {\n leftPartHeaderTestsData?: CalendarHeaderTestsProps;\n rightPartHeaderTestsData?: CalendarHeaderTestsProps;\n};\n\nexport interface CalendarRangeProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<\n CalendarHeaderProps,\n | 'prevMonthLabel'\n | 'nextMonthLabel'\n | 'changeMonthLabel'\n | 'changeYearLabel'\n | 'prevMonthIcon'\n | 'nextMonthIcon'\n >,\n Pick<CalendarDaysProps, 'listenDayChangesForUpdate' | 'renderDayContent'>,\n CalendarRangeTestsProps {\n value?: DateRangeType;\n disablePast?: boolean;\n disableFuture?: boolean;\n disablePickers?: boolean;\n changeDayLabel?: string;\n weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n onChange?: (value: DateRangeType | undefined) => void;\n shouldDisableDate?: (value: Date) => boolean;\n onClose?: () => void;\n}\n\nconst getIsDaySelected = (day: Date, value?: DateRangeType) => {\n if (!value?.[0] || !value[1]) {\n return false;\n }\n\n return isWithinInterval(day, { start: startOfDay(value[0]), end: endOfDay(value[1]) });\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n value,\n onChange,\n disablePast,\n disableFuture,\n shouldDisableDate,\n onClose,\n weekStartsOn = 1,\n disablePickers,\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Изменить месяц',\n changeYearLabel = 'Изменить год',\n changeDayLabel = 'Изменить день',\n prevMonthIcon,\n nextMonthIcon,\n listenDayChangesForUpdate,\n renderDayContent,\n dayTestId,\n leftPartHeaderTestsData,\n rightPartHeaderTestsData,\n ...props\n}: CalendarRangeProps): React.ReactNode => {\n const {\n viewDate,\n setViewDate,\n setPrevMonth,\n setNextMonth,\n focusedDay,\n setFocusedDay,\n isDayFocused,\n isDayDisabled,\n resetSelectedDay,\n isMonthDisabled,\n isYearDisabled,\n } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n const [hintedDate, setHintedDate] = React.useState<DateRangeType>();\n const secondViewDate = addMonths(viewDate, 1);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n event.preventDefault();\n }\n\n const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n if (\n newFocusedDay &&\n !isSameMonth(newFocusedDay, viewDate) &&\n !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n ) {\n setViewDate(newFocusedDay);\n }\n setFocusedDay(newFocusedDay);\n },\n [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n );\n\n const getNewValue = React.useCallback(\n (date: Date): DateRangeType => {\n const isValueEmpty = !value || (value[0] === null && value[1] === null);\n if (isValueEmpty) {\n return [date, null];\n }\n\n const [start, end] = value;\n if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n return [setTimeEqual(date, start), setTimeEqual(date, end)];\n } else if (start && isBefore(date, start)) {\n return [setTimeEqual(date, start), end];\n } else if (start && isAfter(date, start)) {\n return [start, setTimeEqual(date, end)];\n }\n return value;\n },\n [value],\n );\n\n const onDayChange = React.useCallback(\n (date: Date) => {\n onChange?.(getNewValue(date));\n setHintedDate(undefined);\n },\n [onChange, getNewValue],\n );\n\n const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n const isDayActive = React.useCallback(\n (day: Date) =>\n Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n [value],\n );\n\n const isDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n [value],\n );\n\n const isHintedDaySelectionEnd = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n [hintedDate],\n );\n\n const isDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n [value],\n );\n\n const isHintedDaySelectionStart = React.useCallback(\n (day: Date, dayOfWeek: number) =>\n Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n [hintedDate],\n );\n\n const onDayEnter = React.useCallback(\n (date: Date) => setHintedDate(getNewValue(date)),\n [setHintedDate, getNewValue],\n );\n\n const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n const isDayHinted = React.useCallback(\n (day: Date) => getIsDaySelected(day, hintedDate),\n [hintedDate],\n );\n\n const onRightPartViewDateChange = React.useCallback(\n (newDate: Date) => setViewDate(subMonths(newDate, 1)),\n [setViewDate],\n );\n\n return (\n <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={viewDate}\n onChange={setViewDate}\n nextMonthHidden\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n prevMonthIcon={prevMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\n {...leftPartHeaderTestsData}\n />\n <CalendarDays\n viewDate={viewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n onKeyDown={handleKeyDown}\n isDayFocused={isDayFocused}\n onDayChange={onDayChange}\n isDaySelected={isDaySelected}\n isDayActive={isDayActive}\n isDaySelectionEnd={isDaySelectionEnd}\n isDaySelectionStart={isDaySelectionStart}\n isDayHinted={isDayHinted}\n onDayEnter={onDayEnter}\n onDayLeave={onDayLeave}\n isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n isHintedDaySelectionStart={isHintedDaySelectionStart}\n isDayDisabled={isDayDisabled}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n renderDayContent={renderDayContent}\n aria-label={changeDayLabel}\n dayTestId={dayTestId}\n />\n </div>\n <div className={styles['CalendarRange__inner']}>\n <CalendarHeader\n viewDate={secondViewDate}\n onChange={onRightPartViewDateChange}\n prevMonthHidden\n onNextMonth={setNextMonth}\n disablePickers={disablePickers}\n className={styles['CalendarRange__header']}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n nextMonthIcon={nextMonthIcon}\n isMonthDisabled={isMonthDisabled}\n isYearDisabled={isYearDisabled}\n {...rightPartHeaderTestsData}\n />\n <CalendarDays\n viewDate={secondViewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n aria-label={changeDayLabel}\n onKeyDown={handleKeyDown}\n isDayFocused={isDayFocused}\n onDayChange={onDayChange}\n isDaySelected={isDaySelected}\n isDayActive={isDayActive}\n isDaySelectionEnd={isDaySelectionEnd}\n isDaySelectionStart={isDaySelectionStart}\n isDayHinted={isDayHinted}\n onDayEnter={onDayEnter}\n onDayLeave={onDayLeave}\n isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n isHintedDaySelectionStart={isHintedDaySelectionStart}\n isDayDisabled={isDayDisabled}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n renderDayContent={renderDayContent}\n tabIndex={0}\n onBlur={resetSelectedDay}\n dayTestId={dayTestId}\n />\n </div>\n </RootComponent>\n );\n};\n"],"names":["React","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","subMonths","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","CalendarDays","CalendarHeader","RootComponent","styles","getIsDaySelected","day","value","start","end","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","disablePickers","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeDayLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","renderDayContent","dayTestId","leftPartHeaderTestsData","rightPartHeaderTestsData","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","isMonthDisabled","isYearDisabled","hintedDate","setHintedDate","useState","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","isValueEmpty","onDayChange","undefined","isDaySelected","isDayActive","Boolean","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","onRightPartViewDateChange","newDate","baseClassName","div","className","nextMonthHidden","onPrevMonth","onKeyDown","aria-label","prevMonthHidden","onNextMonth","tabIndex","onBlur"],"mappings":"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"}
@@ -1,12 +1,19 @@
1
1
  import * as React from 'react';
2
- export interface CalendarTimeProps {
2
+ export type CalendarTimeTestsProps = {
3
+ hoursTestId?: string;
4
+ minutesTestId?: string;
5
+ doneButtonTestId?: string;
6
+ };
7
+ export interface CalendarTimeProps extends CalendarTimeTestsProps {
3
8
  value: Date;
4
9
  doneButtonText?: string;
10
+ doneButtonShow?: boolean;
11
+ doneButtonDisabled?: boolean;
5
12
  changeHoursLabel?: string;
6
13
  changeMinutesLabel?: string;
7
14
  onChange?: (value: Date) => void;
8
15
  onClose?: () => void;
9
16
  isDayDisabled?: (day: Date, withTime?: boolean) => boolean;
10
17
  }
11
- export declare const CalendarTime: ({ value, doneButtonText, onChange, onClose, changeHoursLabel, changeMinutesLabel, isDayDisabled, }: CalendarTimeProps) => React.ReactNode;
18
+ export declare const CalendarTime: ({ value, onChange, onClose, changeHoursLabel, changeMinutesLabel, isDayDisabled, doneButtonText, doneButtonDisabled, doneButtonShow, minutesTestId, hoursTestId, doneButtonTestId, }: CalendarTimeProps) => React.ReactNode;
12
19
  //# sourceMappingURL=CalendarTime.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CalendarTime.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,IAAI,CAAC;IACZ,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC;CAC5D;AAkBD,eAAO,MAAM,YAAY,uGAQtB,iBAAiB,KAAG,KAAK,CAAC,SA0D5B,CAAC"}
1
+ {"version":3,"file":"CalendarTime.d.ts","sourceRoot":"","sources":["../../../../src/components/CalendarTime/CalendarTime.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,MAAM,sBAAsB,GAAG;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,iBAAkB,SAAQ,sBAAsB;IAC/D,KAAK,EAAE,IAAI,CAAC;IACZ,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC;CAC5D;AAkBD,eAAO,MAAM,YAAY,yLAatB,iBAAiB,KAAG,KAAK,CAAC,SAyE5B,CAAC"}
@@ -1,5 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import * as React from 'react';
3
+ import { classNames } from '@vkontakte/vkjs';
3
4
  import { setHours, setMinutes } from 'date-fns';
4
5
  import { AdaptivityProvider } from '../AdaptivityProvider/AdaptivityProvider';
5
6
  import { Button } from '../Button/Button';
@@ -19,7 +20,7 @@ for(let i = 0; i < 60; i += 1){
19
20
  label: String(i).padStart(2, '0')
20
21
  });
21
22
  }
22
- export const CalendarTime = ({ value, doneButtonText = 'Готово', onChange, onClose, changeHoursLabel, changeMinutesLabel, isDayDisabled })=>{
23
+ export const CalendarTime = ({ value, onChange, onClose, changeHoursLabel, changeMinutesLabel, isDayDisabled, doneButtonText = 'Готово', doneButtonDisabled = false, doneButtonShow = true, minutesTestId, hoursTestId, doneButtonTestId })=>{
23
24
  const localHours = isDayDisabled ? hours.map((hour)=>{
24
25
  return {
25
26
  ...hour,
@@ -41,7 +42,7 @@ export const CalendarTime = ({ value, doneButtonText = 'Готово', onChange,
41
42
  value
42
43
  ]);
43
44
  return /*#__PURE__*/ _jsxs("div", {
44
- className: styles['CalendarTime'],
45
+ className: classNames(styles['CalendarTime'], !doneButtonShow && styles['CalendarTime__withoutDone']),
45
46
  children: [
46
47
  /*#__PURE__*/ _jsx("div", {
47
48
  className: styles['CalendarTime__picker'],
@@ -52,7 +53,8 @@ export const CalendarTime = ({ value, doneButtonText = 'Готово', onChange,
52
53
  options: localHours,
53
54
  onChange: onHoursChange,
54
55
  forceDropdownPortal: false,
55
- "aria-label": changeHoursLabel
56
+ "aria-label": changeHoursLabel,
57
+ "data-testid": hoursTestId
56
58
  })
57
59
  })
58
60
  }),
@@ -69,11 +71,12 @@ export const CalendarTime = ({ value, doneButtonText = 'Готово', onChange,
69
71
  options: localMinutes,
70
72
  onChange: onMinutesChange,
71
73
  forceDropdownPortal: false,
72
- "aria-label": changeMinutesLabel
74
+ "aria-label": changeMinutesLabel,
75
+ "data-testid": minutesTestId
73
76
  })
74
77
  })
75
78
  }),
76
- /*#__PURE__*/ _jsx("div", {
79
+ doneButtonShow && /*#__PURE__*/ _jsx("div", {
77
80
  className: styles['CalendarTime__button'],
78
81
  children: /*#__PURE__*/ _jsx(AdaptivityProvider, {
79
82
  sizeY: "compact",
@@ -81,6 +84,8 @@ export const CalendarTime = ({ value, doneButtonText = 'Готово', onChange,
81
84
  mode: "secondary",
82
85
  onClick: onClose,
83
86
  size: "l",
87
+ disabled: doneButtonDisabled,
88
+ "data-testid": doneButtonTestId,
84
89
  children: doneButtonText
85
90
  })
86
91
  })