@vkontakte/vkui 7.6.4 → 7.7.1

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 (139) hide show
  1. package/dist/components/Calendar/Calendar.d.ts.map +1 -1
  2. package/dist/components/Calendar/Calendar.js +1 -2
  3. package/dist/components/Calendar/Calendar.js.map +1 -1
  4. package/dist/components/CalendarHeader/CalendarHeader.js +1 -1
  5. package/dist/components/CalendarHeader/CalendarHeader.js.map +1 -1
  6. package/dist/components/CalendarRange/CalendarRange.d.ts.map +1 -1
  7. package/dist/components/CalendarRange/CalendarRange.js +2 -3
  8. package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
  9. package/dist/components/CalendarRange/utils.d.ts.map +1 -1
  10. package/dist/components/CalendarRange/utils.js +1 -2
  11. package/dist/components/CalendarRange/utils.js.map +1 -1
  12. package/dist/components/CalendarTime/CalendarTime.js +1 -1
  13. package/dist/components/CalendarTime/CalendarTime.js.map +1 -1
  14. package/dist/components/CarouselBase/CarouselBase.d.ts +1 -1
  15. package/dist/components/CarouselBase/CarouselBase.d.ts.map +1 -1
  16. package/dist/components/CarouselBase/CarouselBase.js +38 -18
  17. package/dist/components/CarouselBase/CarouselBase.js.map +1 -1
  18. package/dist/components/CarouselBase/CarouselViewPort.d.ts +3 -2
  19. package/dist/components/CarouselBase/CarouselViewPort.d.ts.map +1 -1
  20. package/dist/components/CarouselBase/CarouselViewPort.js +13 -1
  21. package/dist/components/CarouselBase/CarouselViewPort.js.map +1 -1
  22. package/dist/components/CarouselBase/ScrollArrows.d.ts +3 -2
  23. package/dist/components/CarouselBase/ScrollArrows.d.ts.map +1 -1
  24. package/dist/components/CarouselBase/ScrollArrows.js +22 -11
  25. package/dist/components/CarouselBase/ScrollArrows.js.map +1 -1
  26. package/dist/components/CarouselBase/types.d.ts +9 -0
  27. package/dist/components/CarouselBase/types.d.ts.map +1 -1
  28. package/dist/components/CarouselBase/types.js.map +1 -1
  29. package/dist/components/Cell/Cell.d.ts +4 -0
  30. package/dist/components/Cell/Cell.d.ts.map +1 -1
  31. package/dist/components/Cell/Cell.js +3 -1
  32. package/dist/components/Cell/Cell.js.map +1 -1
  33. package/dist/components/DateInput/DateInput.d.ts.map +1 -1
  34. package/dist/components/DateInput/DateInput.js +1 -2
  35. package/dist/components/DateInput/DateInput.js.map +1 -1
  36. package/dist/components/Gallery/Gallery.d.ts +5 -1
  37. package/dist/components/Gallery/Gallery.d.ts.map +1 -1
  38. package/dist/components/Gallery/Gallery.js +19 -3
  39. package/dist/components/Gallery/Gallery.js.map +1 -1
  40. package/dist/components/ModalPage/ModalPageInternal.js +16 -8
  41. package/dist/components/ModalPage/ModalPageInternal.js.map +1 -1
  42. package/dist/components/ModalPage/types.d.ts +2 -2
  43. package/dist/components/ModalPage/types.d.ts.map +1 -1
  44. package/dist/components/ModalPage/types.js.map +1 -1
  45. package/dist/components/Search/Search.d.ts +5 -1
  46. package/dist/components/Search/Search.d.ts.map +1 -1
  47. package/dist/components/Search/Search.js +6 -4
  48. package/dist/components/Search/Search.js.map +1 -1
  49. package/dist/components/TabsItem/TabsItem.js +1 -1
  50. package/dist/components/TabsItem/TabsItem.js.map +1 -1
  51. package/dist/components.css +1 -1
  52. package/dist/components.css.map +1 -1
  53. package/dist/cssm/components/Calendar/Calendar.js +1 -2
  54. package/dist/cssm/components/Calendar/Calendar.js.map +1 -1
  55. package/dist/cssm/components/CalendarHeader/CalendarHeader.js +1 -1
  56. package/dist/cssm/components/CalendarHeader/CalendarHeader.js.map +1 -1
  57. package/dist/cssm/components/CalendarRange/CalendarRange.js +2 -3
  58. package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
  59. package/dist/cssm/components/CalendarRange/utils.js +1 -2
  60. package/dist/cssm/components/CalendarRange/utils.js.map +1 -1
  61. package/dist/cssm/components/CalendarTime/CalendarTime.js +1 -1
  62. package/dist/cssm/components/CalendarTime/CalendarTime.js.map +1 -1
  63. package/dist/cssm/components/CarouselBase/CarouselBase.js +31 -15
  64. package/dist/cssm/components/CarouselBase/CarouselBase.js.map +1 -1
  65. package/dist/cssm/components/CarouselBase/CarouselBase.module.css +2 -0
  66. package/dist/cssm/components/CarouselBase/CarouselViewPort.js +13 -1
  67. package/dist/cssm/components/CarouselBase/CarouselViewPort.js.map +1 -1
  68. package/dist/cssm/components/CarouselBase/ScrollArrows.js +14 -7
  69. package/dist/cssm/components/CarouselBase/ScrollArrows.js.map +1 -1
  70. package/dist/cssm/components/CarouselBase/types.js.map +1 -1
  71. package/dist/cssm/components/Cell/Cell.js +2 -1
  72. package/dist/cssm/components/Cell/Cell.js.map +1 -1
  73. package/dist/cssm/components/DateInput/DateInput.js +1 -2
  74. package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
  75. package/dist/cssm/components/Gallery/Gallery.js +14 -1
  76. package/dist/cssm/components/Gallery/Gallery.js.map +1 -1
  77. package/dist/cssm/components/ModalCard/ModalCard.module.css +0 -1
  78. package/dist/cssm/components/ModalOutlet/ModalOutlet.module.css +1 -0
  79. package/dist/cssm/components/ModalPage/ModalPage.module.css +2 -9
  80. package/dist/cssm/components/ModalPage/ModalPageInternal.js +16 -8
  81. package/dist/cssm/components/ModalPage/ModalPageInternal.js.map +1 -1
  82. package/dist/cssm/components/ModalPage/types.js.map +1 -1
  83. package/dist/cssm/components/Search/Search.js +4 -3
  84. package/dist/cssm/components/Search/Search.js.map +1 -1
  85. package/dist/cssm/components/TabsItem/TabsItem.js +1 -1
  86. package/dist/cssm/components/TabsItem/TabsItem.js.map +1 -1
  87. package/dist/cssm/hooks/useCalendar.js +1 -2
  88. package/dist/cssm/hooks/useCalendar.js.map +1 -1
  89. package/dist/cssm/hooks/useTodayDate.js +2 -2
  90. package/dist/cssm/hooks/useTodayDate.js.map +1 -1
  91. package/dist/cssm/lib/calendar.js +8 -12
  92. package/dist/cssm/lib/calendar.js.map +1 -1
  93. package/dist/cssm/lib/date.js +142 -1
  94. package/dist/cssm/lib/date.js.map +1 -1
  95. package/dist/cssm/styles/constants.css +3 -0
  96. package/dist/hooks/useCalendar.d.ts.map +1 -1
  97. package/dist/hooks/useCalendar.js +1 -2
  98. package/dist/hooks/useCalendar.js.map +1 -1
  99. package/dist/hooks/useTodayDate.js +2 -2
  100. package/dist/hooks/useTodayDate.js.map +1 -1
  101. package/dist/lib/calendar.d.ts.map +1 -1
  102. package/dist/lib/calendar.js +8 -12
  103. package/dist/lib/calendar.js.map +1 -1
  104. package/dist/lib/date.d.ts +41 -0
  105. package/dist/lib/date.d.ts.map +1 -1
  106. package/dist/lib/date.js +142 -1
  107. package/dist/lib/date.js.map +1 -1
  108. package/dist/vkui.css +1 -1
  109. package/dist/vkui.css.map +1 -1
  110. package/package.json +3 -4
  111. package/src/components/Calendar/Calendar.tsx +6 -2
  112. package/src/components/CalendarHeader/CalendarHeader.tsx +1 -1
  113. package/src/components/CalendarRange/CalendarRange.tsx +9 -3
  114. package/src/components/CalendarRange/utils.ts +1 -2
  115. package/src/components/CalendarTime/CalendarTime.tsx +1 -1
  116. package/src/components/CarouselBase/CarouselBase.module.css +2 -0
  117. package/src/components/CarouselBase/CarouselBase.module.css.d.ts.map +1 -1
  118. package/src/components/CarouselBase/CarouselBase.tsx +38 -16
  119. package/src/components/CarouselBase/CarouselViewPort.tsx +25 -2
  120. package/src/components/CarouselBase/ScrollArrows.tsx +14 -2
  121. package/src/components/CarouselBase/types.ts +9 -0
  122. package/src/components/Cell/Cell.tsx +6 -0
  123. package/src/components/DateInput/DateInput.tsx +8 -2
  124. package/src/components/Gallery/Gallery.tsx +20 -0
  125. package/src/components/ModalCard/ModalCard.module.css +0 -1
  126. package/src/components/ModalCard/ModalCard.module.css.d.ts.map +1 -1
  127. package/src/components/ModalOutlet/ModalOutlet.module.css +1 -0
  128. package/src/components/ModalPage/ModalPage.module.css +2 -9
  129. package/src/components/ModalPage/ModalPage.module.css.d.ts.map +1 -1
  130. package/src/components/ModalPage/ModalPageInternal.tsx +8 -11
  131. package/src/components/ModalPage/types.ts +5 -2
  132. package/src/components/Search/Search.tsx +44 -31
  133. package/src/components/TabsItem/TabsItem.tsx +1 -1
  134. package/src/hooks/useCalendar.ts +1 -2
  135. package/src/hooks/useTodayDate.ts +2 -2
  136. package/src/lib/calendar.ts +12 -10
  137. package/src/lib/date.ts +187 -0
  138. package/src/lib/floating/useFloatingWithInteractions/__snapshots__/useFloatingWithInteractions.test.tsx.snap +1 -1
  139. package/src/styles/constants.css +3 -0
@@ -22,7 +22,8 @@ import { calcMax, calcMin, calculateIndent, getLoopPoints, getTargetIndex, isBig
22
22
  import { useSlideAnimation } from "./hooks.js";
23
23
  const warn = warnOnce('Gallery');
24
24
  export const CarouselBase = (_param)=>{
25
- var { bullets = false, getRootRef, children, slideWidth = '100%', slideIndex = 0, dragDisabled = false, resizeSource = 'window', onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align = 'left', showArrows, getRef, arrowSize, arrowAreaHeight, arrowNextLabel, arrowPrevLabel, slideTestId, bulletTestId, nextArrowTestId, prevArrowTestId, looped = false } = _param, restProps = _object_without_properties(_param, [
25
+ var { bullets = false, getRootRef, children, slideWidth = '100%', slideIndex = 0, dragDisabled = false, resizeSource = 'window', onDragStart, onDragEnd, onChange, onPrevClick, onNextClick, align = 'left', showArrows, getRef, arrowSize, arrowAreaHeight, slideTestId, bulletTestId, nextArrowTestId, prevArrowTestId, looped = false, // a11y
26
+ 'aria-roledescription': ariaRoleDescription = 'Карусель', arrowNextLabel = 'Следующий слайд', arrowPrevLabel = 'Предыдущий слайд', slideLabel, slideRoleDescription } = _param, restProps = _object_without_properties(_param, [
26
27
  "bullets",
27
28
  "getRootRef",
28
29
  "children",
@@ -40,13 +41,16 @@ export const CarouselBase = (_param)=>{
40
41
  "getRef",
41
42
  "arrowSize",
42
43
  "arrowAreaHeight",
43
- "arrowNextLabel",
44
- "arrowPrevLabel",
45
44
  "slideTestId",
46
45
  "bulletTestId",
47
46
  "nextArrowTestId",
48
47
  "prevArrowTestId",
49
- "looped"
48
+ "looped",
49
+ 'aria-roledescription',
50
+ "arrowNextLabel",
51
+ "arrowPrevLabel",
52
+ "slideLabel",
53
+ "slideRoleDescription"
50
54
  ]);
51
55
  const slidesStore = React.useRef({});
52
56
  const slidesManager = React.useRef(SLIDES_MANAGER_STATE);
@@ -63,6 +67,7 @@ export const CarouselBase = (_param)=>{
63
67
  const isDragging = React.useRef(false);
64
68
  const [controlElementsState, setControlElementsState] = React.useState(CONTROL_ELEMENTS_STATE);
65
69
  const hasPointer = useAdaptivityHasPointer();
70
+ const slidesContainerId = React.useId();
66
71
  const isCenterAlign = align === 'center';
67
72
  const calculateCanSlideLeft = ()=>{
68
73
  if (looped) {
@@ -397,10 +402,35 @@ export const CarouselBase = (_param)=>{
397
402
  slidesStore.current[slideIndex] = slideRef;
398
403
  };
399
404
  const { isDraggable, canSlideRight, canSlideLeft } = controlElementsState;
405
+ const handleScrollForFixVoiceOverBehavior = (event)=>{
406
+ var _restProps_onScroll;
407
+ (_restProps_onScroll = restProps.onScroll) === null || _restProps_onScroll === void 0 ? void 0 : _restProps_onScroll.call(restProps, event);
408
+ if (rootRef.current) {
409
+ event.currentTarget.scrollLeft = 0;
410
+ }
411
+ };
400
412
  return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({}, restProps), {
413
+ role: "region",
414
+ onScroll: handleScrollForFixVoiceOverBehavior,
415
+ "aria-roledescription": ariaRoleDescription,
401
416
  baseClassName: classNames("vkuiCarouselBase__host", slideWidth === 'custom' && "vkuiCarouselBase__customWidth", isDraggable && "vkuiCarouselBase__draggable"),
402
417
  getRootRef: rootRef,
403
418
  children: [
419
+ /*#__PURE__*/ _jsx(ScrollArrows, {
420
+ hasPointer: hasPointer,
421
+ canSlideLeft: canSlideLeft,
422
+ canSlideRight: canSlideRight,
423
+ onSlideRight: slideRight,
424
+ onSlideLeft: slideLeft,
425
+ showArrows: showArrows,
426
+ arrowSize: arrowSize,
427
+ arrowAreaHeight: arrowAreaHeight,
428
+ arrowPrevLabel: arrowPrevLabel,
429
+ arrowNextLabel: arrowNextLabel,
430
+ prevArrowTestId: prevArrowTestId,
431
+ nextArrowTestId: nextArrowTestId,
432
+ slidesContainerId: slidesContainerId
433
+ }),
404
434
  /*#__PURE__*/ _jsx(CarouselViewPort, {
405
435
  slideWidth: slideWidth,
406
436
  slideTestId: slideTestId,
@@ -410,6 +440,10 @@ export const CarouselBase = (_param)=>{
410
440
  getRootRef: viewportRef,
411
441
  layerRef: layerRef,
412
442
  setSlideRef: setSlideRef,
443
+ slidesContainerId: slidesContainerId,
444
+ slideLabel: slideLabel,
445
+ slideRoleDescription: slideRoleDescription,
446
+ onChange: onChange,
413
447
  children: children
414
448
  }),
415
449
  bullets && /*#__PURE__*/ _jsx(Bullets, {
@@ -417,20 +451,6 @@ export const CarouselBase = (_param)=>{
417
451
  slideIndex: slideIndex,
418
452
  count: React.Children.count(children),
419
453
  bulletTestId: bulletTestId
420
- }),
421
- /*#__PURE__*/ _jsx(ScrollArrows, {
422
- hasPointer: hasPointer,
423
- canSlideLeft: canSlideLeft,
424
- canSlideRight: canSlideRight,
425
- onSlideRight: slideRight,
426
- onSlideLeft: slideLeft,
427
- showArrows: showArrows,
428
- arrowSize: arrowSize,
429
- arrowAreaHeight: arrowAreaHeight,
430
- arrowPrevLabel: arrowPrevLabel,
431
- arrowNextLabel: arrowNextLabel,
432
- prevArrowTestId: prevArrowTestId,
433
- nextArrowTestId: nextArrowTestId
434
454
  })
435
455
  ]
436
456
  }));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMutationObserver } from '../../hooks/useMutationObserver';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { type CustomTouchEvent } from '../Touch/Touch';\nimport { Bullets } from './Bullets';\nimport { CarouselViewPort } from './CarouselViewPort';\nimport { ScrollArrows } from './ScrollArrows';\nimport {\n ANIMATION_DURATION,\n CONTROL_ELEMENTS_STATE,\n SLIDE_THRESHOLD,\n SLIDES_MANAGER_STATE,\n} from './constants';\nimport {\n calcMax,\n calcMin,\n calculateIndent,\n getLoopPoints,\n getTargetIndex,\n isBigger,\n isBiggerOrEqual,\n isLowerOrEqual,\n revertRtlValue,\n validateIndent,\n} from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport {\n type BaseGalleryProps,\n type ControlElementsState,\n type GallerySlidesState,\n type SlidesManagerState,\n} from './types';\nimport styles from './CarouselBase.module.css';\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n resizeSource = 'window',\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize,\n arrowAreaHeight,\n arrowNextLabel,\n arrowPrevLabel,\n slideTestId,\n bulletTestId,\n nextArrowTestId,\n prevArrowTestId,\n looped = false,\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n const textDirection = useConfigDirection();\n const isRtl = textDirection === 'rtl';\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { animationInQueue, addToAnimationQueue, getAnimateFunction, startAnimation } =\n useSlideAnimation();\n const isDragging = React.useRef(false);\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterAlign = align === 'center';\n\n const calculateCanSlideLeft = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n const isStartShiftX = isBiggerOrEqual(shiftXCurrentRef.current, 0, isRtl);\n return !slidesManager.current.isFullyVisible && !isStartShiftX;\n };\n\n const calculateCanSlideRight = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return (\n !slidesManager.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n slidesManager.current.containerWidth - revertRtlValue(shiftXCurrentRef.current, isRtl) <\n (slidesManager.current.layerWidth ?? 0)) ||\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < slidesManager.current.slides.length - 1))\n );\n };\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n shiftX = Math.round(shiftX);\n if (looped) {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n } else {\n Object.values(slidesStore.current).forEach((slide) => {\n if (slide) {\n slide.style.transform = '';\n }\n });\n }\n\n if (layerRef.current) {\n const indent =\n isDragging.current && !looped\n ? validateIndent(\n slidesManager.current,\n shiftXCurrentRef.current + shiftXDeltaRef.current,\n isRtl,\n false,\n )\n : shiftX;\n\n layerRef.current.style.transform = `translate3d(${indent}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const checkShiftOutOfBoundsFromStart = (shiftX: number, snaps: number[]) =>\n isBigger(shiftX, snaps[0], isRtl);\n\n const checkShiftOutOfBoundsFromEnd = (shiftX: number, slides: GallerySlidesState[]) => {\n /**\n * Поскольку при `align=\"center\"` слайды сдвинуты, прежде чем рассчитать крайнюю правую точку,\n * нужно вычесть сдвиг слайдов.\n */\n const firstSlideShift =\n align === 'center'\n ? (slidesManager.current.containerWidth - slidesManager.current.slides[0].width) / 2\n : 0;\n\n const lastPoint =\n slides[slides.length - 1].width + slides[slides.length - 1].coordX - firstSlideShift;\n return isRtl ? shiftX >= lastPoint : shiftX <= -lastPoint;\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n /**\n * Для бесконечной галереи проверяем, что при dnd мы прокрутили левее, чем первый слайд,\n * чтобы сбросить `shiftXCurrentRef`.\n */\n if (looped && checkShiftOutOfBoundsFromStart(shiftX, snaps)) {\n const firstSnap = revertRtlValue(snaps[0], isRtl);\n shiftXCurrentRef.current = revertRtlValue(-contentSize + firstSnap, isRtl);\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n\n /**\n * Для бесконечной галереи проверяем, что при dnd мы прокрутили правее, чем последний слайд,\n * чтобы правильно пересчитать `shiftXCurrentRef`.\n */\n if (looped && checkShiftOutOfBoundsFromEnd(shiftX, slides)) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n animationFrameRef.current = null;\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current || !viewportRef.current || !layerRef.current) {\n return;\n }\n const layerOffsetWidth = layerRef.current.offsetWidth;\n\n const calcRtlCoord = (element: HTMLDivElement) => {\n const offsetLeft = element.offsetLeft;\n const offsetWidth = element.offsetWidth;\n return layerOffsetWidth - offsetLeft - offsetWidth;\n };\n\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i];\n if (!elem) {\n return { coordX: 0, width: 0 };\n }\n const coordX = isRtl ? calcRtlCoord(elem) : elem.offsetLeft;\n return { coordX, width: elem.offsetWidth };\n }) || [];\n\n if (localSlides.length === 0) {\n initialized.current = false;\n return;\n }\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development' && looped) {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.',\n );\n }\n }\n\n const currentSlideOffsetOnCenterAlignment =\n (containerWidth - (localSlides[slideIndex]?.width ?? 0)) / 2;\n const isFullyVisible =\n align === 'center'\n ? layerWidth + currentSlideOffsetOnCenterAlignment <= containerWidth\n : layerWidth <= containerWidth;\n\n const onlyOneSlide = localSlides.length === 1;\n\n slidesManager.current = {\n ...slidesManager.current,\n layerWidth,\n containerWidth,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible,\n max:\n looped || onlyOneSlide\n ? null\n : calcMax({\n slides: localSlides,\n containerWidth,\n isCenterAlign,\n isRtl,\n }),\n min:\n looped || onlyOneSlide\n ? null\n : calcMin({\n containerWidth,\n layerWidth,\n slides: localSlides,\n viewportOffsetWidth,\n isFullyVisible,\n align,\n isRtl,\n }),\n };\n const snaps = localSlides.map((_, index) =>\n calculateIndent({\n targetIndex: index,\n slidesManager: slidesManager.current,\n isCenter: isCenterAlign,\n looped,\n isRtl,\n }),\n );\n\n let contentSize = Math.abs(snaps[snaps.length - 1]) + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += revertRtlValue(snaps[0], isRtl);\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n // Если галерея не зациклена и слайд всего один, то рассчитывать loopPoints тоже не надо\n if (looped && !onlyOneSlide && !isFullyVisible) {\n slidesManager.current.loopPoints = getLoopPoints(\n slidesManager.current,\n containerWidth,\n isRtl,\n );\n }\n\n const isAnimationInProgress = animationInQueue() || animationFrameRef.current !== null;\n\n if (isAnimationInProgress) {\n return;\n }\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n setControlElementsState({\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n });\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n const { window } = useDOM();\n useResizeObserver(resizeSource === 'element' ? rootRef : window, onResize);\n\n const loopedSlideChangePerform = () => {\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n const fromLastToFirst = isLowerOrEqual(\n shiftXCurrentRef.current,\n snaps[snaps.length - 1],\n isRtl,\n );\n /**\n * Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения.\n */\n if (indent === snaps[0] && fromLastToFirst) {\n const endEdge = revertRtlValue(\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width,\n isRtl,\n );\n const distance = endEdge + startPoint;\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /**\n * Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\".\n */\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - revertRtlValue(slides[slides.length - 1].width, isRtl);\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - revertRtlValue(slides[slides.length - 1].width, isRtl);\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n const diff = revertRtlValue(progress * slides[slides.length - 1].width, isRtl);\n transformCssStyles(startPoint + diff);\n })();\n });\n });\n /**\n * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения.\n */\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n };\n\n const simpleSlideChangePerform = () => {\n const { snaps } = slidesManager.current;\n requestTransform(snaps[slideIndex], true);\n };\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps } = slidesManager.current;\n const indent = snaps[slideIndex];\n\n if (looped) {\n loopedSlideChangePerform();\n } else {\n simpleSlideChangePerform();\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n\n setControlElementsState((v) => ({\n ...v,\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n }));\n },\n [slideIndex],\n );\n\n useIsomorphicLayoutEffect(\n function updateIsDraggable() {\n setControlElementsState((v) => ({\n ...v,\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n }));\n },\n [dragDisabled],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth, looped, isRtl]);\n\n const calculateMinDeltaXToSlide = () => {\n return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;\n };\n\n const slideLeft = (event: React.MouseEvent) => {\n if (slideIndex > 0) {\n shiftXCurrentRef.current += revertRtlValue(calculateMinDeltaXToSlide(), isRtl);\n }\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n if (slideIndex < slidesManager.current.slides.length - 1) {\n shiftXCurrentRef.current -= revertRtlValue(calculateMinDeltaXToSlide(), isRtl);\n }\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n isDragging.current = true;\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n isDragging.current = false;\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex({\n slides: slidesManager.current.slides,\n slideIndex,\n currentShiftX: shiftXCurrentRef.current,\n currentShiftXDelta: shiftXDeltaRef.current,\n max: slidesManager.current.max,\n looped,\n isRtl,\n });\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { isDraggable, canSlideRight, canSlideLeft } = controlElementsState;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles.host,\n slideWidth === 'custom' && styles.customWidth,\n isDraggable && styles.draggable,\n )}\n getRootRef={rootRef}\n >\n <CarouselViewPort\n slideWidth={slideWidth}\n slideTestId={slideTestId}\n onStart={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n getRootRef={viewportRef}\n layerRef={layerRef}\n setSlideRef={setSlideRef}\n >\n {children}\n </CarouselViewPort>\n\n {bullets && (\n <Bullets\n bullets={bullets}\n slideIndex={slideIndex}\n count={React.Children.count(children)}\n bulletTestId={bulletTestId}\n />\n )}\n <ScrollArrows\n hasPointer={hasPointer}\n canSlideLeft={canSlideLeft}\n canSlideRight={canSlideRight}\n onSlideRight={slideRight}\n onSlideLeft={slideLeft}\n showArrows={showArrows}\n arrowSize={arrowSize}\n arrowAreaHeight={arrowAreaHeight}\n arrowPrevLabel={arrowPrevLabel}\n arrowNextLabel={arrowNextLabel}\n prevArrowTestId={prevArrowTestId}\n nextArrowTestId={nextArrowTestId}\n />\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useConfigDirection","useExternRef","useMutationObserver","useResizeObserver","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","Bullets","CarouselViewPort","ScrollArrows","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDE_THRESHOLD","SLIDES_MANAGER_STATE","calcMax","calcMin","calculateIndent","getLoopPoints","getTargetIndex","isBigger","isBiggerOrEqual","isLowerOrEqual","revertRtlValue","validateIndent","useSlideAnimation","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","resizeSource","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","arrowAreaHeight","arrowNextLabel","arrowPrevLabel","slideTestId","bulletTestId","nextArrowTestId","prevArrowTestId","looped","restProps","slidesStore","useRef","slidesManager","textDirection","isRtl","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","animationInQueue","addToAnimationQueue","getAnimateFunction","startAnimation","isDragging","controlElementsState","setControlElementsState","useState","hasPointer","isCenterAlign","calculateCanSlideLeft","current","isFullyVisible","isStartShiftX","calculateCanSlideRight","containerWidth","layerWidth","slides","length","transformCssStyles","shiftX","animation","Math","round","loopPoints","forEach","loopPoint","target","index","slide","style","transform","Object","values","indent","transition","checkShiftOutOfBoundsFromStart","snaps","checkShiftOutOfBoundsFromEnd","firstSlideShift","width","lastPoint","coordX","requestTransform","contentSize","cancelAnimationFrame","requestAnimationFrame","firstSnap","abs","initializeSlides","localSlides","layerOffsetWidth","offsetWidth","calcRtlCoord","element","offsetLeft","Children","map","_item","i","elem","viewportOffsetWidth","reduce","val","process","env","NODE_ENV","remainingWidth","currentSlideOffsetOnCenterAlignment","onlyOneSlide","max","min","_","targetIndex","isCenter","isAnimationInProgress","canSlideLeft","canSlideRight","isDraggable","onResize","window","loopedSlideChangePerform","startPoint","fromLastToFirst","endEdge","distance","progress","diff","direction","simpleSlideChangePerform","performSlideChange","v","updateIsDraggable","calculateMinDeltaXToSlide","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","isSlide","currentShiftX","currentShiftXDelta","initialShiftX","setSlideRef","slideRef","baseClassName","count","onSlideRight","onSlideLeft"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/CarouselBase/CarouselBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useConfigDirection } from '../../hooks/useConfigDirection';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMutationObserver } from '../../hooks/useMutationObserver';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { type CustomTouchEvent } from '../Touch/Touch';\nimport { Bullets } from './Bullets';\nimport { CarouselViewPort } from './CarouselViewPort';\nimport { ScrollArrows } from './ScrollArrows';\nimport {\n ANIMATION_DURATION,\n CONTROL_ELEMENTS_STATE,\n SLIDE_THRESHOLD,\n SLIDES_MANAGER_STATE,\n} from './constants';\nimport {\n calcMax,\n calcMin,\n calculateIndent,\n getLoopPoints,\n getTargetIndex,\n isBigger,\n isBiggerOrEqual,\n isLowerOrEqual,\n revertRtlValue,\n validateIndent,\n} from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport {\n type BaseGalleryProps,\n type ControlElementsState,\n type GallerySlidesState,\n type SlidesManagerState,\n} from './types';\nimport styles from './CarouselBase.module.css';\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n resizeSource = 'window',\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize,\n arrowAreaHeight,\n slideTestId,\n bulletTestId,\n nextArrowTestId,\n prevArrowTestId,\n looped = false,\n\n // a11y\n 'aria-roledescription': ariaRoleDescription = 'Карусель',\n arrowNextLabel = 'Следующий слайд',\n arrowPrevLabel = 'Предыдущий слайд',\n slideLabel,\n slideRoleDescription,\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n const textDirection = useConfigDirection();\n const isRtl = textDirection === 'rtl';\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> | null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { animationInQueue, addToAnimationQueue, getAnimateFunction, startAnimation } =\n useSlideAnimation();\n const isDragging = React.useRef(false);\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const hasPointer = useAdaptivityHasPointer();\n\n const slidesContainerId = React.useId();\n\n const isCenterAlign = align === 'center';\n\n const calculateCanSlideLeft = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n const isStartShiftX = isBiggerOrEqual(shiftXCurrentRef.current, 0, isRtl);\n return !slidesManager.current.isFullyVisible && !isStartShiftX;\n };\n\n const calculateCanSlideRight = () => {\n if (looped) {\n return !slidesManager.current.isFullyVisible;\n }\n return (\n !slidesManager.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n slidesManager.current.containerWidth - revertRtlValue(shiftXCurrentRef.current, isRtl) <\n (slidesManager.current.layerWidth ?? 0)) ||\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < slidesManager.current.slides.length - 1))\n );\n };\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n shiftX = Math.round(shiftX);\n if (looped) {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n } else {\n Object.values(slidesStore.current).forEach((slide) => {\n if (slide) {\n slide.style.transform = '';\n }\n });\n }\n\n if (layerRef.current) {\n const indent =\n isDragging.current && !looped\n ? validateIndent(\n slidesManager.current,\n shiftXCurrentRef.current + shiftXDeltaRef.current,\n isRtl,\n false,\n )\n : shiftX;\n\n layerRef.current.style.transform = `translate3d(${indent}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const checkShiftOutOfBoundsFromStart = (shiftX: number, snaps: number[]) =>\n isBigger(shiftX, snaps[0], isRtl);\n\n const checkShiftOutOfBoundsFromEnd = (shiftX: number, slides: GallerySlidesState[]) => {\n /**\n * Поскольку при `align=\"center\"` слайды сдвинуты, прежде чем рассчитать крайнюю правую точку,\n * нужно вычесть сдвиг слайдов.\n */\n const firstSlideShift =\n align === 'center'\n ? (slidesManager.current.containerWidth - slidesManager.current.slides[0].width) / 2\n : 0;\n\n const lastPoint =\n slides[slides.length - 1].width + slides[slides.length - 1].coordX - firstSlideShift;\n return isRtl ? shiftX >= lastPoint : shiftX <= -lastPoint;\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n /**\n * Для бесконечной галереи проверяем, что при dnd мы прокрутили левее, чем первый слайд,\n * чтобы сбросить `shiftXCurrentRef`.\n */\n if (looped && checkShiftOutOfBoundsFromStart(shiftX, snaps)) {\n const firstSnap = revertRtlValue(snaps[0], isRtl);\n shiftXCurrentRef.current = revertRtlValue(-contentSize + firstSnap, isRtl);\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n\n /**\n * Для бесконечной галереи проверяем, что при dnd мы прокрутили правее, чем последний слайд,\n * чтобы правильно пересчитать `shiftXCurrentRef`.\n */\n if (looped && checkShiftOutOfBoundsFromEnd(shiftX, slides)) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n animationFrameRef.current = null;\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current || !viewportRef.current || !layerRef.current) {\n return;\n }\n const layerOffsetWidth = layerRef.current.offsetWidth;\n\n const calcRtlCoord = (element: HTMLDivElement) => {\n const offsetLeft = element.offsetLeft;\n const offsetWidth = element.offsetWidth;\n return layerOffsetWidth - offsetLeft - offsetWidth;\n };\n\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i];\n if (!elem) {\n return { coordX: 0, width: 0 };\n }\n const coordX = isRtl ? calcRtlCoord(elem) : elem.offsetLeft;\n return { coordX, width: elem.offsetWidth };\n }) || [];\n\n if (localSlides.length === 0) {\n initialized.current = false;\n return;\n }\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development' && looped) {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.',\n );\n }\n }\n\n const currentSlideOffsetOnCenterAlignment =\n (containerWidth - (localSlides[slideIndex]?.width ?? 0)) / 2;\n const isFullyVisible =\n align === 'center'\n ? layerWidth + currentSlideOffsetOnCenterAlignment <= containerWidth\n : layerWidth <= containerWidth;\n\n const onlyOneSlide = localSlides.length === 1;\n\n slidesManager.current = {\n ...slidesManager.current,\n layerWidth,\n containerWidth,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible,\n max:\n looped || onlyOneSlide\n ? null\n : calcMax({\n slides: localSlides,\n containerWidth,\n isCenterAlign,\n isRtl,\n }),\n min:\n looped || onlyOneSlide\n ? null\n : calcMin({\n containerWidth,\n layerWidth,\n slides: localSlides,\n viewportOffsetWidth,\n isFullyVisible,\n align,\n isRtl,\n }),\n };\n const snaps = localSlides.map((_, index) =>\n calculateIndent({\n targetIndex: index,\n slidesManager: slidesManager.current,\n isCenter: isCenterAlign,\n looped,\n isRtl,\n }),\n );\n\n let contentSize = Math.abs(snaps[snaps.length - 1]) + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += revertRtlValue(snaps[0], isRtl);\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n // Если галерея не зациклена и слайд всего один, то рассчитывать loopPoints тоже не надо\n if (looped && !onlyOneSlide && !isFullyVisible) {\n slidesManager.current.loopPoints = getLoopPoints(\n slidesManager.current,\n containerWidth,\n isRtl,\n );\n }\n\n const isAnimationInProgress = animationInQueue() || animationFrameRef.current !== null;\n\n if (isAnimationInProgress) {\n return;\n }\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n setControlElementsState({\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n });\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n const { window } = useDOM();\n useResizeObserver(resizeSource === 'element' ? rootRef : window, onResize);\n\n const loopedSlideChangePerform = () => {\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n const fromLastToFirst = isLowerOrEqual(\n shiftXCurrentRef.current,\n snaps[snaps.length - 1],\n isRtl,\n );\n /**\n * Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения.\n */\n if (indent === snaps[0] && fromLastToFirst) {\n const endEdge = revertRtlValue(\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width,\n isRtl,\n );\n const distance = endEdge + startPoint;\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /**\n * Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\".\n */\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - revertRtlValue(slides[slides.length - 1].width, isRtl);\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - revertRtlValue(slides[slides.length - 1].width, isRtl);\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n const diff = revertRtlValue(progress * slides[slides.length - 1].width, isRtl);\n transformCssStyles(startPoint + diff);\n })();\n });\n });\n /**\n * Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения.\n */\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress * distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n };\n\n const simpleSlideChangePerform = () => {\n const { snaps } = slidesManager.current;\n requestTransform(snaps[slideIndex], true);\n };\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps } = slidesManager.current;\n const indent = snaps[slideIndex];\n\n if (looped) {\n loopedSlideChangePerform();\n } else {\n simpleSlideChangePerform();\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n\n setControlElementsState((v) => ({\n ...v,\n canSlideLeft: calculateCanSlideLeft(),\n canSlideRight: calculateCanSlideRight(),\n }));\n },\n [slideIndex],\n );\n\n useIsomorphicLayoutEffect(\n function updateIsDraggable() {\n setControlElementsState((v) => ({\n ...v,\n isDraggable: !(dragDisabled || slidesManager.current.isFullyVisible),\n }));\n },\n [dragDisabled],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth, looped, isRtl]);\n\n const calculateMinDeltaXToSlide = () => {\n return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;\n };\n\n const slideLeft = (event: React.MouseEvent) => {\n if (slideIndex > 0) {\n shiftXCurrentRef.current += revertRtlValue(calculateMinDeltaXToSlide(), isRtl);\n }\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n if (slideIndex < slidesManager.current.slides.length - 1) {\n shiftXCurrentRef.current -= revertRtlValue(calculateMinDeltaXToSlide(), isRtl);\n }\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n isDragging.current = true;\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n isDragging.current = false;\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex({\n slides: slidesManager.current.slides,\n slideIndex,\n currentShiftX: shiftXCurrentRef.current,\n currentShiftXDelta: shiftXDeltaRef.current,\n max: slidesManager.current.max,\n looped,\n isRtl,\n });\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement | null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { isDraggable, canSlideRight, canSlideLeft } = controlElementsState;\n\n const handleScrollForFixVoiceOverBehavior = (event: React.UIEvent<HTMLDivElement>) => {\n restProps.onScroll?.(event);\n if (rootRef.current) {\n event.currentTarget.scrollLeft = 0;\n }\n };\n\n return (\n <RootComponent\n {...restProps}\n role=\"region\"\n onScroll={handleScrollForFixVoiceOverBehavior}\n aria-roledescription={ariaRoleDescription}\n baseClassName={classNames(\n styles.host,\n slideWidth === 'custom' && styles.customWidth,\n isDraggable && styles.draggable,\n )}\n getRootRef={rootRef}\n >\n <ScrollArrows\n hasPointer={hasPointer}\n canSlideLeft={canSlideLeft}\n canSlideRight={canSlideRight}\n onSlideRight={slideRight}\n onSlideLeft={slideLeft}\n showArrows={showArrows}\n arrowSize={arrowSize}\n arrowAreaHeight={arrowAreaHeight}\n arrowPrevLabel={arrowPrevLabel}\n arrowNextLabel={arrowNextLabel}\n prevArrowTestId={prevArrowTestId}\n nextArrowTestId={nextArrowTestId}\n slidesContainerId={slidesContainerId}\n />\n <CarouselViewPort\n slideWidth={slideWidth}\n slideTestId={slideTestId}\n onStart={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n getRootRef={viewportRef}\n layerRef={layerRef}\n setSlideRef={setSlideRef}\n slidesContainerId={slidesContainerId}\n slideLabel={slideLabel}\n slideRoleDescription={slideRoleDescription}\n onChange={onChange}\n >\n {children}\n </CarouselViewPort>\n\n {bullets && (\n <Bullets\n bullets={bullets}\n slideIndex={slideIndex}\n count={React.Children.count(children)}\n bulletTestId={bulletTestId}\n />\n )}\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useConfigDirection","useExternRef","useMutationObserver","useResizeObserver","useDOM","useIsomorphicLayoutEffect","warnOnce","RootComponent","Bullets","CarouselViewPort","ScrollArrows","ANIMATION_DURATION","CONTROL_ELEMENTS_STATE","SLIDE_THRESHOLD","SLIDES_MANAGER_STATE","calcMax","calcMin","calculateIndent","getLoopPoints","getTargetIndex","isBigger","isBiggerOrEqual","isLowerOrEqual","revertRtlValue","validateIndent","useSlideAnimation","warn","CarouselBase","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","resizeSource","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","arrowAreaHeight","slideTestId","bulletTestId","nextArrowTestId","prevArrowTestId","looped","ariaRoleDescription","arrowNextLabel","arrowPrevLabel","slideLabel","slideRoleDescription","restProps","slidesStore","useRef","slidesManager","textDirection","isRtl","rootRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","animationInQueue","addToAnimationQueue","getAnimateFunction","startAnimation","isDragging","controlElementsState","setControlElementsState","useState","hasPointer","slidesContainerId","useId","isCenterAlign","calculateCanSlideLeft","current","isFullyVisible","isStartShiftX","calculateCanSlideRight","containerWidth","layerWidth","slides","length","transformCssStyles","shiftX","animation","Math","round","loopPoints","forEach","loopPoint","target","index","slide","style","transform","Object","values","indent","transition","checkShiftOutOfBoundsFromStart","snaps","checkShiftOutOfBoundsFromEnd","firstSlideShift","width","lastPoint","coordX","requestTransform","contentSize","cancelAnimationFrame","requestAnimationFrame","firstSnap","abs","initializeSlides","localSlides","layerOffsetWidth","offsetWidth","calcRtlCoord","element","offsetLeft","Children","map","_item","i","elem","viewportOffsetWidth","reduce","val","process","env","NODE_ENV","remainingWidth","currentSlideOffsetOnCenterAlignment","onlyOneSlide","max","min","_","targetIndex","isCenter","isAnimationInProgress","canSlideLeft","canSlideRight","isDraggable","onResize","window","loopedSlideChangePerform","startPoint","fromLastToFirst","endEdge","distance","progress","diff","direction","simpleSlideChangePerform","performSlideChange","v","updateIsDraggable","calculateMinDeltaXToSlide","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","isSlide","currentShiftX","currentShiftXDelta","initialShiftX","setSlideRef","slideRef","handleScrollForFixVoiceOverBehavior","onScroll","currentTarget","scrollLeft","role","aria-roledescription","baseClassName","onSlideRight","onSlideLeft","count"],"mappings":"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"}
@@ -2,13 +2,14 @@ import * as React from 'react';
2
2
  import { type HasChildren, type HasRootRef } from '../../types';
3
3
  import { type CustomTouchEvent } from '../Touch/Touch';
4
4
  import { type BaseGalleryProps } from './types';
5
- type GalleryViewPortProps = Pick<BaseGalleryProps, 'slideWidth' | 'slideTestId'> & HasRootRef<HTMLElement> & HasChildren & {
5
+ type GalleryViewPortProps = Pick<BaseGalleryProps, 'slideWidth' | 'slideTestId' | 'slideRoleDescription' | 'slideLabel' | 'onChange'> & HasRootRef<HTMLElement> & HasChildren & {
6
6
  onStart: (e: CustomTouchEvent) => void;
7
7
  onMoveX: (e: CustomTouchEvent) => void;
8
8
  onEnd: (e: CustomTouchEvent) => void;
9
9
  setSlideRef: (slideRef: HTMLDivElement | null, slideIndex: number) => void;
10
10
  layerRef?: React.Ref<HTMLDivElement>;
11
+ slidesContainerId: string;
11
12
  };
12
- export declare const CarouselViewPort: ({ slideTestId, slideWidth, onStart, onMoveX, onEnd, getRootRef, layerRef, children, setSlideRef, }: GalleryViewPortProps) => import("react/jsx-runtime").JSX.Element;
13
+ export declare const CarouselViewPort: ({ slideTestId, slideWidth, slideLabel, slideRoleDescription, onChange, onStart, onMoveX, onEnd, getRootRef, layerRef, children, setSlideRef, slidesContainerId, }: GalleryViewPortProps) => import("react/jsx-runtime").JSX.Element;
13
14
  export {};
14
15
  //# sourceMappingURL=CarouselViewPort.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CarouselViewPort.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/CarouselViewPort.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,MAAM,aAAa,CAAC;AAChE,OAAO,EAAE,KAAK,gBAAgB,EAAS,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAGhD,KAAK,oBAAoB,GAAG,IAAI,CAAC,gBAAgB,EAAE,YAAY,GAAG,aAAa,CAAC,GAC9E,UAAU,CAAC,WAAW,CAAC,GACvB,WAAW,GAAG;IACZ,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACvC,KAAK,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACrC,WAAW,EAAE,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACtC,CAAC;AAEJ,eAAO,MAAM,gBAAgB,GAAI,oGAU9B,oBAAoB,4CAyBtB,CAAC"}
1
+ {"version":3,"file":"CarouselViewPort.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/CarouselViewPort.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,MAAM,aAAa,CAAC;AAChE,OAAO,EAAE,KAAK,gBAAgB,EAAS,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAGhD,KAAK,oBAAoB,GAAG,IAAI,CAC9B,gBAAgB,EAChB,YAAY,GAAG,aAAa,GAAG,sBAAsB,GAAG,YAAY,GAAG,UAAU,CAClF,GACC,UAAU,CAAC,WAAW,CAAC,GACvB,WAAW,GAAG;IACZ,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACvC,KAAK,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACrC,WAAW,EAAE,CAAC,QAAQ,EAAE,cAAc,GAAG,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,iBAAiB,EAAE,MAAM,CAAC;CAC3B,CAAC;AAIJ,eAAO,MAAM,gBAAgB,GAAI,mKAc9B,oBAAoB,4CAsCtB,CAAC"}
@@ -2,7 +2,12 @@
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  /* eslint-disable jsdoc/require-jsdoc */ import * as React from "react";
4
4
  import { Touch } from "../Touch/Touch.js";
5
- export const CarouselViewPort = ({ slideTestId, slideWidth, onStart, onMoveX, onEnd, getRootRef, layerRef, children, setSlideRef })=>{
5
+ const defaultSlideLabel = (index, slidesCount)=>`${index + 1} из ${slidesCount}`;
6
+ export const CarouselViewPort = ({ slideTestId, slideWidth, slideLabel = defaultSlideLabel, slideRoleDescription = 'Слайд', onChange, onStart, onMoveX, onEnd, getRootRef, layerRef, children, setSlideRef, slidesContainerId })=>{
7
+ const slidesCount = React.Children.count(children);
8
+ const onSlideFocus = React.useCallback((e)=>onChange === null || onChange === void 0 ? void 0 : onChange(Number(e.currentTarget.dataset.index)), [
9
+ onChange
10
+ ]);
6
11
  return /*#__PURE__*/ _jsx(Touch, {
7
12
  className: "vkuiCarouselBase__viewport",
8
13
  onStartX: onStart,
@@ -16,10 +21,17 @@ export const CarouselViewPort = ({ slideTestId, slideWidth, onStart, onMoveX, on
16
21
  children: /*#__PURE__*/ _jsx("div", {
17
22
  className: "vkuiCarouselBase__layer",
18
23
  ref: layerRef,
24
+ id: slidesContainerId,
19
25
  children: React.Children.map(children, (item, i)=>/*#__PURE__*/ _jsx("div", {
26
+ role: "group",
27
+ "aria-roledescription": slideRoleDescription,
28
+ "aria-label": typeof slideLabel === 'function' ? slideLabel(i, slidesCount) : slideLabel,
20
29
  className: "vkuiCarouselBase__slide",
21
30
  "data-testid": slideTestId === null || slideTestId === void 0 ? void 0 : slideTestId(i),
22
31
  ref: (el)=>setSlideRef(el, i),
32
+ "data-index": i,
33
+ tabIndex: 0,
34
+ onFocus: onSlideFocus,
23
35
  children: item
24
36
  }, `slide-${i}`))
25
37
  })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CarouselBase/CarouselViewPort.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { type HasChildren, type HasRootRef } from '../../types';\nimport { type CustomTouchEvent, Touch } from '../Touch/Touch';\nimport { type BaseGalleryProps } from './types';\nimport styles from './CarouselBase.module.css';\n\ntype GalleryViewPortProps = Pick<BaseGalleryProps, 'slideWidth' | 'slideTestId'> &\n HasRootRef<HTMLElement> &\n HasChildren & {\n onStart: (e: CustomTouchEvent) => void;\n onMoveX: (e: CustomTouchEvent) => void;\n onEnd: (e: CustomTouchEvent) => void;\n setSlideRef: (slideRef: HTMLDivElement | null, slideIndex: number) => void;\n layerRef?: React.Ref<HTMLDivElement>;\n };\n\nexport const CarouselViewPort = ({\n slideTestId,\n slideWidth,\n onStart,\n onMoveX,\n onEnd,\n getRootRef,\n layerRef,\n children,\n setSlideRef,\n}: GalleryViewPortProps) => {\n return (\n <Touch\n className={styles.viewport}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n noSlideClick\n getRootRef={getRootRef}\n >\n <div className={styles.layer} ref={layerRef}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n className={styles.slide}\n key={`slide-${i}`}\n data-testid={slideTestId?.(i)}\n ref={(el) => setSlideRef(el, i)}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n );\n};\n"],"names":["React","Touch","CarouselViewPort","slideTestId","slideWidth","onStart","onMoveX","onEnd","getRootRef","layerRef","children","setSlideRef","className","onStartX","style","width","noSlideClick","div","ref","Children","map","item","i","data-testid","el"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAE/B,SAAgCC,KAAK,QAAQ,oBAAiB;AAc9D,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,WAAW,EACXC,UAAU,EACVC,OAAO,EACPC,OAAO,EACPC,KAAK,EACLC,UAAU,EACVC,QAAQ,EACRC,QAAQ,EACRC,WAAW,EACU;IACrB,qBACE,KAACV;QACCW,SAAS;QACTC,UAAUR;QACVC,SAASA;QACTC,OAAOA;QACPO,OAAO;YAAEC,OAAOX,eAAe,WAAW,SAASA;QAAW;QAC9DY,YAAY;QACZR,YAAYA;kBAEZ,cAAA,KAACS;YAAIL,SAAS;YAAgBM,KAAKT;sBAChCT,MAAMmB,QAAQ,CAACC,GAAG,CAACV,UAAU,CAACW,MAAuBC,kBACpD,KAACL;oBACCL,SAAS;oBAETW,aAAW,EAAEpB,wBAAAA,kCAAAA,YAAcmB;oBAC3BJ,KAAK,CAACM,KAAOb,YAAYa,IAAIF;8BAE5BD;mBAJI,CAAC,MAAM,EAAEC,GAAG;;;AAU7B,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/CarouselBase/CarouselViewPort.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { type HasChildren, type HasRootRef } from '../../types';\nimport { type CustomTouchEvent, Touch } from '../Touch/Touch';\nimport { type BaseGalleryProps } from './types';\nimport styles from './CarouselBase.module.css';\n\ntype GalleryViewPortProps = Pick<\n BaseGalleryProps,\n 'slideWidth' | 'slideTestId' | 'slideRoleDescription' | 'slideLabel' | 'onChange'\n> &\n HasRootRef<HTMLElement> &\n HasChildren & {\n onStart: (e: CustomTouchEvent) => void;\n onMoveX: (e: CustomTouchEvent) => void;\n onEnd: (e: CustomTouchEvent) => void;\n setSlideRef: (slideRef: HTMLDivElement | null, slideIndex: number) => void;\n layerRef?: React.Ref<HTMLDivElement>;\n slidesContainerId: string;\n };\n\nconst defaultSlideLabel = (index: number, slidesCount: number) => `${index + 1} из ${slidesCount}`;\n\nexport const CarouselViewPort = ({\n slideTestId,\n slideWidth,\n slideLabel = defaultSlideLabel,\n slideRoleDescription = 'Слайд',\n onChange,\n onStart,\n onMoveX,\n onEnd,\n getRootRef,\n layerRef,\n children,\n setSlideRef,\n slidesContainerId,\n}: GalleryViewPortProps) => {\n const slidesCount = React.Children.count(children);\n\n const onSlideFocus = React.useCallback(\n (e: React.FocusEvent<HTMLDivElement>) => onChange?.(Number(e.currentTarget.dataset.index)),\n [onChange],\n );\n\n return (\n <Touch\n className={styles.viewport}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n noSlideClick\n getRootRef={getRootRef}\n >\n <div className={styles.layer} ref={layerRef} id={slidesContainerId}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n role=\"group\"\n aria-roledescription={slideRoleDescription}\n aria-label={typeof slideLabel === 'function' ? slideLabel(i, slidesCount) : slideLabel}\n className={styles.slide}\n key={`slide-${i}`}\n data-testid={slideTestId?.(i)}\n ref={(el) => setSlideRef(el, i)}\n data-index={i}\n tabIndex={0}\n onFocus={onSlideFocus}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n );\n};\n"],"names":["React","Touch","defaultSlideLabel","index","slidesCount","CarouselViewPort","slideTestId","slideWidth","slideLabel","slideRoleDescription","onChange","onStart","onMoveX","onEnd","getRootRef","layerRef","children","setSlideRef","slidesContainerId","Children","count","onSlideFocus","useCallback","e","Number","currentTarget","dataset","className","onStartX","style","width","noSlideClick","div","ref","id","map","item","i","role","aria-roledescription","aria-label","data-testid","el","data-index","tabIndex","onFocus"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAE/B,SAAgCC,KAAK,QAAQ,oBAAiB;AAkB9D,MAAMC,oBAAoB,CAACC,OAAeC,cAAwB,GAAGD,QAAQ,EAAE,IAAI,EAAEC,aAAa;AAElG,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,WAAW,EACXC,UAAU,EACVC,aAAaN,iBAAiB,EAC9BO,uBAAuB,OAAO,EAC9BC,QAAQ,EACRC,OAAO,EACPC,OAAO,EACPC,KAAK,EACLC,UAAU,EACVC,QAAQ,EACRC,QAAQ,EACRC,WAAW,EACXC,iBAAiB,EACI;IACrB,MAAMd,cAAcJ,MAAMmB,QAAQ,CAACC,KAAK,CAACJ;IAEzC,MAAMK,eAAerB,MAAMsB,WAAW,CACpC,CAACC,IAAwCb,qBAAAA,+BAAAA,SAAWc,OAAOD,EAAEE,aAAa,CAACC,OAAO,CAACvB,KAAK,IACxF;QAACO;KAAS;IAGZ,qBACE,KAACT;QACC0B,SAAS;QACTC,UAAUjB;QACVC,SAASA;QACTC,OAAOA;QACPgB,OAAO;YAAEC,OAAOvB,eAAe,WAAW,SAASA;QAAW;QAC9DwB,YAAY;QACZjB,YAAYA;kBAEZ,cAAA,KAACkB;YAAIL,SAAS;YAAgBM,KAAKlB;YAAUmB,IAAIhB;sBAC9ClB,MAAMmB,QAAQ,CAACgB,GAAG,CAACnB,UAAU,CAACoB,MAAuBC,kBACpD,KAACL;oBACCM,MAAK;oBACLC,wBAAsB9B;oBACtB+B,cAAY,OAAOhC,eAAe,aAAaA,WAAW6B,GAAGjC,eAAeI;oBAC5EmB,SAAS;oBAETc,aAAW,EAAEnC,wBAAAA,kCAAAA,YAAc+B;oBAC3BJ,KAAK,CAACS,KAAOzB,YAAYyB,IAAIL;oBAC7BM,cAAYN;oBACZO,UAAU;oBACVC,SAASxB;8BAERe;mBAPI,CAAC,MAAM,EAAEC,GAAG;;;AAa7B,EAAE"}
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { type BaseGalleryProps } from './types';
3
- export declare const getArrowClassName: (side: "start" | "end", arrowAreaHeight: Exclude<BaseGalleryProps["arrowAreaHeight"], undefined>) => string;
3
+ export declare const getArrowClassName: (side: "start" | "end", arrowAreaHeight: Exclude<BaseGalleryProps["arrowAreaHeight"], undefined>, focusVisible: boolean) => string;
4
4
  export interface ScrollArrowsTestIds {
5
5
  /**
6
6
  * Передает атрибут `data-testid` для кнопки перехода к следующему слайду.
@@ -17,7 +17,8 @@ interface ScrollArrowsProps extends Pick<BaseGalleryProps, 'showArrows' | 'arrow
17
17
  canSlideRight: boolean;
18
18
  onSlideLeft: (e: React.MouseEvent) => void;
19
19
  onSlideRight: (e: React.MouseEvent) => void;
20
+ slidesContainerId: string;
20
21
  }
21
- export declare const ScrollArrows: ({ hasPointer, canSlideLeft, canSlideRight, onSlideRight, onSlideLeft, showArrows, arrowSize, arrowAreaHeight, arrowPrevLabel, arrowNextLabel, nextArrowTestId, prevArrowTestId, }: ScrollArrowsProps) => import("react/jsx-runtime").JSX.Element | null;
22
+ export declare const ScrollArrows: ({ hasPointer, canSlideLeft, canSlideRight, onSlideRight, onSlideLeft, showArrows, arrowSize, arrowAreaHeight, arrowPrevLabel, arrowNextLabel, nextArrowTestId, prevArrowTestId, slidesContainerId, }: ScrollArrowsProps) => import("react/jsx-runtime").JSX.Element | null;
22
23
  export {};
23
24
  //# sourceMappingURL=ScrollArrows.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollArrows.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/ScrollArrows.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAQhD,eAAO,MAAM,iBAAiB,GAC5B,MAAM,OAAO,GAAG,KAAK,EACrB,iBAAiB,OAAO,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,WAOzE,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,UAAU,iBACR,SAAQ,IAAI,CACR,gBAAgB,EAChB,YAAY,GAAG,WAAW,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,gBAAgB,CACrF,EACD,mBAAmB;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC3C,YAAY,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,YAAY,GAAI,mLAa1B,iBAAiB,mDAyBnB,CAAC"}
1
+ {"version":3,"file":"ScrollArrows.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/ScrollArrows.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAQhD,eAAO,MAAM,iBAAiB,GAC5B,MAAM,OAAO,GAAG,KAAK,EACrB,iBAAiB,OAAO,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,EAAE,SAAS,CAAC,EACxE,cAAc,OAAO,WAQtB,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,UAAU,iBACR,SAAQ,IAAI,CACR,gBAAgB,EAChB,YAAY,GAAG,WAAW,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,gBAAgB,CACrF,EACD,mBAAmB;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC3C,YAAY,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,iBAAiB,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,GAAI,sMAc1B,iBAAiB,mDAgCnB,CAAC"}
@@ -1,34 +1,45 @@
1
1
  'use client';
2
+ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
3
+ import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
2
4
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
5
  /* eslint-disable jsdoc/require-jsdoc */ import * as React from "react";
4
6
  import { classNames } from "@vkontakte/vkjs";
7
+ import { useFocusVisible } from "../../hooks/useFocusVisible.js";
5
8
  import { ScrollArrow } from "../ScrollArrow/ScrollArrow.js";
6
9
  const stylesArrowAreaHeight = {
7
10
  stretch: "vkuiCarouselBase__arrowAreaStretch",
8
11
  fit: "vkuiCarouselBase__arrowAreaFit"
9
12
  };
10
- export const getArrowClassName = (side, arrowAreaHeight)=>{
11
- return classNames("vkuiCarouselBase__arrow", side === 'start' ? "vkuiCarouselBase__arrowStart" : "vkuiCarouselBase__arrowEnd", stylesArrowAreaHeight[arrowAreaHeight]);
13
+ export const getArrowClassName = (side, arrowAreaHeight, focusVisible)=>{
14
+ return classNames("vkuiCarouselBase__arrow", side === 'start' ? "vkuiCarouselBase__arrowStart" : "vkuiCarouselBase__arrowEnd", stylesArrowAreaHeight[arrowAreaHeight], focusVisible && "vkuiCarouselBase__arrowFocusVisible");
12
15
  };
13
- export const ScrollArrows = ({ hasPointer, canSlideLeft, canSlideRight, onSlideRight, onSlideLeft, showArrows = false, arrowSize = 'm', arrowAreaHeight = 'stretch', arrowPrevLabel, arrowNextLabel, nextArrowTestId, prevArrowTestId })=>{
16
+ export const ScrollArrows = ({ hasPointer, canSlideLeft, canSlideRight, onSlideRight, onSlideLeft, showArrows = false, arrowSize = 'm', arrowAreaHeight = 'stretch', arrowPrevLabel, arrowNextLabel, nextArrowTestId, prevArrowTestId, slidesContainerId })=>{
17
+ const _useFocusVisible = useFocusVisible(), { focusVisible: prevArrowFocusVisible } = _useFocusVisible, prevArrowFocusHandlers = _object_without_properties(_useFocusVisible, [
18
+ "focusVisible"
19
+ ]);
20
+ const _useFocusVisible1 = useFocusVisible(), { focusVisible: nextArrowFocusVisible } = _useFocusVisible1, nextArrowFocusHandlers = _object_without_properties(_useFocusVisible1, [
21
+ "focusVisible"
22
+ ]);
14
23
  return showArrows && hasPointer ? /*#__PURE__*/ _jsxs(_Fragment, {
15
24
  children: [
16
- canSlideLeft && /*#__PURE__*/ _jsx(ScrollArrow, {
17
- className: getArrowClassName('start', arrowAreaHeight),
25
+ canSlideLeft && /*#__PURE__*/ _jsx(ScrollArrow, _object_spread({
26
+ className: getArrowClassName('start', arrowAreaHeight, prevArrowFocusVisible),
18
27
  direction: "left",
19
28
  onClick: onSlideLeft,
20
29
  size: arrowSize,
21
30
  "data-testid": prevArrowTestId,
22
- label: arrowPrevLabel
23
- }),
24
- canSlideRight && /*#__PURE__*/ _jsx(ScrollArrow, {
25
- className: getArrowClassName('end', arrowAreaHeight),
31
+ label: arrowPrevLabel,
32
+ "aria-controls": slidesContainerId
33
+ }, prevArrowFocusHandlers)),
34
+ canSlideRight && /*#__PURE__*/ _jsx(ScrollArrow, _object_spread({
35
+ className: getArrowClassName('end', arrowAreaHeight, nextArrowFocusVisible),
26
36
  direction: "right",
27
37
  onClick: onSlideRight,
28
38
  size: arrowSize,
29
39
  "data-testid": nextArrowTestId,
30
- label: arrowNextLabel
31
- })
40
+ label: arrowNextLabel,
41
+ "aria-controls": slidesContainerId
42
+ }, nextArrowFocusHandlers))
32
43
  ]
33
44
  }) : null;
34
45
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CarouselBase/ScrollArrows.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { type BaseGalleryProps } from './types';\nimport styles from './CarouselBase.module.css';\n\nconst stylesArrowAreaHeight = {\n stretch: styles.arrowAreaStretch,\n fit: styles.arrowAreaFit,\n};\n\nexport const getArrowClassName = (\n side: 'start' | 'end',\n arrowAreaHeight: Exclude<BaseGalleryProps['arrowAreaHeight'], undefined>,\n) => {\n return classNames(\n styles.arrow,\n side === 'start' ? styles.arrowStart : styles.arrowEnd,\n stylesArrowAreaHeight[arrowAreaHeight],\n );\n};\n\nexport interface ScrollArrowsTestIds {\n /**\n * Передает атрибут `data-testid` для кнопки перехода к следующему слайду.\n */\n nextArrowTestId?: string;\n /**\n * Передает атрибут `data-testid` для кнопки перехода к предыдущему слайду.\n */\n prevArrowTestId?: string;\n}\n\ninterface ScrollArrowsProps\n extends Pick<\n BaseGalleryProps,\n 'showArrows' | 'arrowSize' | 'arrowAreaHeight' | 'arrowPrevLabel' | 'arrowNextLabel'\n >,\n ScrollArrowsTestIds {\n hasPointer?: boolean;\n canSlideLeft: boolean;\n canSlideRight: boolean;\n onSlideLeft: (e: React.MouseEvent) => void;\n onSlideRight: (e: React.MouseEvent) => void;\n}\n\nexport const ScrollArrows = ({\n hasPointer,\n canSlideLeft,\n canSlideRight,\n onSlideRight,\n onSlideLeft,\n showArrows = false,\n arrowSize = 'm',\n arrowAreaHeight = 'stretch',\n arrowPrevLabel,\n arrowNextLabel,\n nextArrowTestId,\n prevArrowTestId,\n}: ScrollArrowsProps) => {\n return showArrows && hasPointer ? (\n <>\n {canSlideLeft && (\n <ScrollArrow\n className={getArrowClassName('start', arrowAreaHeight)}\n direction=\"left\"\n onClick={onSlideLeft}\n size={arrowSize}\n data-testid={prevArrowTestId}\n label={arrowPrevLabel}\n />\n )}\n {canSlideRight && (\n <ScrollArrow\n className={getArrowClassName('end', arrowAreaHeight)}\n direction=\"right\"\n onClick={onSlideRight}\n size={arrowSize}\n data-testid={nextArrowTestId}\n label={arrowNextLabel}\n />\n )}\n </>\n ) : null;\n};\n"],"names":["React","classNames","ScrollArrow","stylesArrowAreaHeight","stretch","fit","getArrowClassName","side","arrowAreaHeight","ScrollArrows","hasPointer","canSlideLeft","canSlideRight","onSlideRight","onSlideLeft","showArrows","arrowSize","arrowPrevLabel","arrowNextLabel","nextArrowTestId","prevArrowTestId","className","direction","onClick","size","data-testid","label"],"mappings":"AAAA;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,gCAA6B;AAIzD,MAAMC,wBAAwB;IAC5BC,OAAO;IACPC,GAAG;AACL;AAEA,OAAO,MAAMC,oBAAoB,CAC/BC,MACAC;IAEA,OAAOP,sCAELM,SAAS,yEACTJ,qBAAqB,CAACK,gBAAgB;AAE1C,EAAE;AA0BF,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,WAAW,EACXC,aAAa,KAAK,EAClBC,YAAY,GAAG,EACfR,kBAAkB,SAAS,EAC3BS,cAAc,EACdC,cAAc,EACdC,eAAe,EACfC,eAAe,EACG;IAClB,OAAOL,cAAcL,2BACnB;;YACGC,8BACC,KAACT;gBACCmB,WAAWf,kBAAkB,SAASE;gBACtCc,WAAU;gBACVC,SAAST;gBACTU,MAAMR;gBACNS,eAAaL;gBACbM,OAAOT;;YAGVL,+BACC,KAACV;gBACCmB,WAAWf,kBAAkB,OAAOE;gBACpCc,WAAU;gBACVC,SAASV;gBACTW,MAAMR;gBACNS,eAAaN;gBACbO,OAAOR;;;SAIX;AACN,EAAE"}
1
+ {"version":3,"sources":["../../../src/components/CarouselBase/ScrollArrows.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { type BaseGalleryProps } from './types';\nimport styles from './CarouselBase.module.css';\n\nconst stylesArrowAreaHeight = {\n stretch: styles.arrowAreaStretch,\n fit: styles.arrowAreaFit,\n};\n\nexport const getArrowClassName = (\n side: 'start' | 'end',\n arrowAreaHeight: Exclude<BaseGalleryProps['arrowAreaHeight'], undefined>,\n focusVisible: boolean,\n) => {\n return classNames(\n styles.arrow,\n side === 'start' ? styles.arrowStart : styles.arrowEnd,\n stylesArrowAreaHeight[arrowAreaHeight],\n focusVisible && styles.arrowFocusVisible,\n );\n};\n\nexport interface ScrollArrowsTestIds {\n /**\n * Передает атрибут `data-testid` для кнопки перехода к следующему слайду.\n */\n nextArrowTestId?: string;\n /**\n * Передает атрибут `data-testid` для кнопки перехода к предыдущему слайду.\n */\n prevArrowTestId?: string;\n}\n\ninterface ScrollArrowsProps\n extends Pick<\n BaseGalleryProps,\n 'showArrows' | 'arrowSize' | 'arrowAreaHeight' | 'arrowPrevLabel' | 'arrowNextLabel'\n >,\n ScrollArrowsTestIds {\n hasPointer?: boolean;\n canSlideLeft: boolean;\n canSlideRight: boolean;\n onSlideLeft: (e: React.MouseEvent) => void;\n onSlideRight: (e: React.MouseEvent) => void;\n slidesContainerId: string;\n}\n\nexport const ScrollArrows = ({\n hasPointer,\n canSlideLeft,\n canSlideRight,\n onSlideRight,\n onSlideLeft,\n showArrows = false,\n arrowSize = 'm',\n arrowAreaHeight = 'stretch',\n arrowPrevLabel,\n arrowNextLabel,\n nextArrowTestId,\n prevArrowTestId,\n slidesContainerId,\n}: ScrollArrowsProps) => {\n const { focusVisible: prevArrowFocusVisible, ...prevArrowFocusHandlers } = useFocusVisible();\n const { focusVisible: nextArrowFocusVisible, ...nextArrowFocusHandlers } = useFocusVisible();\n\n return showArrows && hasPointer ? (\n <>\n {canSlideLeft && (\n <ScrollArrow\n className={getArrowClassName('start', arrowAreaHeight, prevArrowFocusVisible)}\n direction=\"left\"\n onClick={onSlideLeft}\n size={arrowSize}\n data-testid={prevArrowTestId}\n label={arrowPrevLabel}\n aria-controls={slidesContainerId}\n {...prevArrowFocusHandlers}\n />\n )}\n {canSlideRight && (\n <ScrollArrow\n className={getArrowClassName('end', arrowAreaHeight, nextArrowFocusVisible)}\n direction=\"right\"\n onClick={onSlideRight}\n size={arrowSize}\n data-testid={nextArrowTestId}\n label={arrowNextLabel}\n aria-controls={slidesContainerId}\n {...nextArrowFocusHandlers}\n />\n )}\n </>\n ) : null;\n};\n"],"names":["React","classNames","useFocusVisible","ScrollArrow","stylesArrowAreaHeight","stretch","fit","getArrowClassName","side","arrowAreaHeight","focusVisible","ScrollArrows","hasPointer","canSlideLeft","canSlideRight","onSlideRight","onSlideLeft","showArrows","arrowSize","arrowPrevLabel","arrowNextLabel","nextArrowTestId","prevArrowTestId","slidesContainerId","prevArrowFocusVisible","prevArrowFocusHandlers","nextArrowFocusVisible","nextArrowFocusHandlers","className","direction","onClick","size","data-testid","label","aria-controls"],"mappings":"AAAA;;;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,iCAA8B;AAC9D,SAASC,WAAW,QAAQ,gCAA6B;AAIzD,MAAMC,wBAAwB;IAC5BC,OAAO;IACPC,GAAG;AACL;AAEA,OAAO,MAAMC,oBAAoB,CAC/BC,MACAC,iBACAC;IAEA,OAAOT,sCAELO,SAAS,yEACTJ,qBAAqB,CAACK,gBAAgB,EACtCC;AAEJ,EAAE;AA2BF,OAAO,MAAMC,eAAe,CAAC,EAC3BC,UAAU,EACVC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,WAAW,EACXC,aAAa,KAAK,EAClBC,YAAY,GAAG,EACfT,kBAAkB,SAAS,EAC3BU,cAAc,EACdC,cAAc,EACdC,eAAe,EACfC,eAAe,EACfC,iBAAiB,EACC;IAClB,MAA2ErB,mBAAAA,mBAArE,EAAEQ,cAAcc,qBAAqB,EAA6B,GAAGtB,kBAA3BuB,oDAA2BvB;QAAnEQ;;IACR,MAA2ER,oBAAAA,mBAArE,EAAEQ,cAAcgB,qBAAqB,EAA6B,GAAGxB,mBAA3ByB,oDAA2BzB;QAAnEQ;;IAER,OAAOO,cAAcL,2BACnB;;YACGC,8BACC,KAACV;gBACCyB,WAAWrB,kBAAkB,SAASE,iBAAiBe;gBACvDK,WAAU;gBACVC,SAASd;gBACTe,MAAMb;gBACNc,eAAaV;gBACbW,OAAOd;gBACPe,iBAAeX;eACXE;YAGPX,+BACC,KAACX;gBACCyB,WAAWrB,kBAAkB,OAAOE,iBAAiBiB;gBACrDG,WAAU;gBACVC,SAASf;gBACTgB,MAAMb;gBACNc,eAAaX;gBACbY,OAAOb;gBACPc,iBAAeX;eACXI;;SAIR;AACN,EAAE"}
@@ -113,6 +113,15 @@ export interface BaseGalleryProps extends Omit<HTMLAttributesWithRootRef<HTMLDiv
113
113
  * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.
114
114
  */
115
115
  arrowNextLabel?: string;
116
+ /**
117
+ * Текст для слайда. Делает его доступным для ассистивных технологий. Может быть функцией.
118
+ * По умолчанию устанавливает `aria-label` вида `${Номер слайда} из ${Количества слайдов}`.
119
+ */
120
+ slideLabel?: string | ((index: number, slidesCount: number) => string);
121
+ /**
122
+ * Описание роли для слайда, для лучше понимания пользователей скринридеров. По умолчанию - `Слайд`.
123
+ */
124
+ slideRoleDescription?: string;
116
125
  /**
117
126
  * Передает атрибут `data-testid` для слайда.
118
127
  */
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/CarouselBase/types.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CarouselBase/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\nimport type * as React from 'react';\nimport type { HasAlign, HasRef, HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\nimport type { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport type { CustomTouchEvent, CustomTouchEventHandler } from '../Touch/Touch';\nimport { type BulletsTestIds } from './Bullets';\nimport { type ScrollArrowsTestIds } from './ScrollArrows';\n\nexport interface GallerySlidesState {\n coordX: number;\n width: number;\n}\n\nexport interface LayoutState {\n containerWidth: number;\n viewportOffsetWidth: number;\n layerWidth: number;\n min?: number;\n max: number;\n slides: GallerySlidesState[];\n isFullyVisible: boolean;\n}\n\nexport interface LoopPoint {\n /**\n * Индекс слайда.\n */\n index: number;\n /**\n * Функция, которая по текущему сдвигу галереи определяет нужный сдвиг слайда.\n */\n target: (this: void, location: number) => void;\n}\n\nexport interface ControlElementsState {\n /**\n * Отвечает за отображение стрелки влево.\n */\n canSlideLeft: boolean;\n /**\n * Отвечает за отображение стрелки вправо.\n */\n canSlideRight: boolean;\n /**\n * Возможность листать слайды drag'ом.\n */\n isDraggable: boolean;\n}\n\nexport interface SlidesManagerState {\n /**\n * Общая ширина всех слайдов.\n */\n contentSize: number;\n /**\n * Массив с пограничными точками слайдов, которые необходимо смещать, чтобы они всегда были в области видимости\n * (пример: для последнего слайда это n-первых слайдов, необходимых для заполнения оставшейся ширины,\n * или для первого слайда это n-последних слайдов при выравнивании по центру).\n */\n loopPoints: LoopPoint[];\n /**\n * Массив с правыми границами слайдов.\n */\n snaps: number[];\n /**\n * Ширина видимой области слайдов.\n */\n viewportOffsetWidth: number;\n /**\n * Массив слайдов с координатой начала слайда и шириной.\n */\n slides: GallerySlidesState[];\n /**\n * Все слайды видимы без скрола.\n */\n isFullyVisible: boolean;\n min: number | null;\n max: number | null;\n containerWidth: number;\n layerWidth: number;\n}\n\nexport interface BaseGalleryProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>,\n HasAlign,\n HasRef<HTMLElement>,\n BulletsTestIds,\n ScrollArrowsTestIds {\n /**\n * Размер слайда.\n *\n * Значение `\"custom\"` используется, если ширина у слайдов разная.\n */\n slideWidth?: LiteralUnion<'custom', string> | number;\n slideIndex?: number;\n onDragStart?: CustomTouchEventHandler;\n onDragEnd?: (e: CustomTouchEvent, targetIndex: number) => void;\n onChange?: (current: number) => void;\n /**\n * Будет вызвано при нажатии на кнопку-стрелку влево.\n */\n onPrevClick?: (event: React.MouseEvent) => void;\n /**\n * Будет вызвано при нажатии на кнопку-стрелку вправо.\n */\n onNextClick?: (event: React.MouseEvent) => void;\n bullets?: 'dark' | 'light' | false;\n /**\n * Позволяет отключить реагирование на тач-события.\n */\n dragDisabled?: boolean;\n showArrows?: boolean;\n /**\n * Размер активной зоны стрелок (в пикселях).\n * Определяет область вокруг стрелок, реагирующую на взаимодействие пользователя. В дизайне свойство называется `arrowArea`.\n */\n arrowAreaHeight?: 'stretch' | 'fit';\n hasPointer?: boolean;\n arrowSize?: ScrollArrowProps['size'];\n /**\n * Текст для кнопки-стрелки влево (назад). Делает ее доступной для ассистивных технологий.\n */\n arrowPrevLabel?: string;\n /**\n * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.\n */\n arrowNextLabel?: string;\n /**\n * Передает атрибут `data-testid` для слайда.\n */\n slideTestId?: (index: number) => string;\n /**\n * Включает зацикленность слайдов.\n */\n looped?: boolean;\n /**\n * Тип источника для отслеживания размера:\n * - `window`: пересчет позиции слайдов будет происходить при изменении размеров `window`\n * - `element`: пересчет позиции слайдов будет происходить при изменении размеров компонента.\n */\n resizeSource?: 'window' | 'element';\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GAkFtC,WA2DC"}
1
+ {"version":3,"sources":["../../../src/components/CarouselBase/types.ts"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc */\nimport type * as React from 'react';\nimport type { HasAlign, HasRef, HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\nimport type { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport type { CustomTouchEvent, CustomTouchEventHandler } from '../Touch/Touch';\nimport { type BulletsTestIds } from './Bullets';\nimport { type ScrollArrowsTestIds } from './ScrollArrows';\n\nexport interface GallerySlidesState {\n coordX: number;\n width: number;\n}\n\nexport interface LayoutState {\n containerWidth: number;\n viewportOffsetWidth: number;\n layerWidth: number;\n min?: number;\n max: number;\n slides: GallerySlidesState[];\n isFullyVisible: boolean;\n}\n\nexport interface LoopPoint {\n /**\n * Индекс слайда.\n */\n index: number;\n /**\n * Функция, которая по текущему сдвигу галереи определяет нужный сдвиг слайда.\n */\n target: (this: void, location: number) => void;\n}\n\nexport interface ControlElementsState {\n /**\n * Отвечает за отображение стрелки влево.\n */\n canSlideLeft: boolean;\n /**\n * Отвечает за отображение стрелки вправо.\n */\n canSlideRight: boolean;\n /**\n * Возможность листать слайды drag'ом.\n */\n isDraggable: boolean;\n}\n\nexport interface SlidesManagerState {\n /**\n * Общая ширина всех слайдов.\n */\n contentSize: number;\n /**\n * Массив с пограничными точками слайдов, которые необходимо смещать, чтобы они всегда были в области видимости\n * (пример: для последнего слайда это n-первых слайдов, необходимых для заполнения оставшейся ширины,\n * или для первого слайда это n-последних слайдов при выравнивании по центру).\n */\n loopPoints: LoopPoint[];\n /**\n * Массив с правыми границами слайдов.\n */\n snaps: number[];\n /**\n * Ширина видимой области слайдов.\n */\n viewportOffsetWidth: number;\n /**\n * Массив слайдов с координатой начала слайда и шириной.\n */\n slides: GallerySlidesState[];\n /**\n * Все слайды видимы без скрола.\n */\n isFullyVisible: boolean;\n min: number | null;\n max: number | null;\n containerWidth: number;\n layerWidth: number;\n}\n\nexport interface BaseGalleryProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>,\n HasAlign,\n HasRef<HTMLElement>,\n BulletsTestIds,\n ScrollArrowsTestIds {\n /**\n * Размер слайда.\n *\n * Значение `\"custom\"` используется, если ширина у слайдов разная.\n */\n slideWidth?: LiteralUnion<'custom', string> | number;\n slideIndex?: number;\n onDragStart?: CustomTouchEventHandler;\n onDragEnd?: (e: CustomTouchEvent, targetIndex: number) => void;\n onChange?: (current: number) => void;\n /**\n * Будет вызвано при нажатии на кнопку-стрелку влево.\n */\n onPrevClick?: (event: React.MouseEvent) => void;\n /**\n * Будет вызвано при нажатии на кнопку-стрелку вправо.\n */\n onNextClick?: (event: React.MouseEvent) => void;\n bullets?: 'dark' | 'light' | false;\n /**\n * Позволяет отключить реагирование на тач-события.\n */\n dragDisabled?: boolean;\n showArrows?: boolean;\n /**\n * Размер активной зоны стрелок (в пикселях).\n * Определяет область вокруг стрелок, реагирующую на взаимодействие пользователя. В дизайне свойство называется `arrowArea`.\n */\n arrowAreaHeight?: 'stretch' | 'fit';\n hasPointer?: boolean;\n arrowSize?: ScrollArrowProps['size'];\n /**\n * Текст для кнопки-стрелки влево (назад). Делает ее доступной для ассистивных технологий.\n */\n arrowPrevLabel?: string;\n /**\n * Текст для кнопки-стрелки вправо (вперед). Делает ее доступной для ассистивных технологий.\n */\n arrowNextLabel?: string;\n /**\n * Текст для слайда. Делает его доступным для ассистивных технологий. Может быть функцией.\n * По умолчанию устанавливает `aria-label` вида `${Номер слайда} из ${Количества слайдов}`.\n */\n slideLabel?: string | ((index: number, slidesCount: number) => string);\n /**\n * Описание роли для слайда, для лучше понимания пользователей скринридеров. По умолчанию - `Слайд`.\n */\n slideRoleDescription?: string;\n /**\n * Передает атрибут `data-testid` для слайда.\n */\n slideTestId?: (index: number) => string;\n /**\n * Включает зацикленность слайдов.\n */\n looped?: boolean;\n /**\n * Тип источника для отслеживания размера:\n * - `window`: пересчет позиции слайдов будет происходить при изменении размеров `window`\n * - `element`: пересчет позиции слайдов будет происходить при изменении размеров компонента.\n */\n resizeSource?: 'window' | 'element';\n}\n"],"names":[],"mappings":"AAAA,sCAAsC,GAkFtC,WAoEC"}
@@ -39,6 +39,10 @@ export interface CellProps extends Omit<SimpleCellProps, 'getRootRef'>, Removabl
39
39
  * Текст для кнопки перетаскивания ячейки.
40
40
  */
41
41
  draggerLabel?: string;
42
+ /**
43
+ * Передает атрибут `data-testid` для кнопки перетаскивания ячейки.
44
+ */
45
+ draggerTestId?: string;
42
46
  }
43
47
  /**
44
48
  * @see https://vkui.io/components/cell
@@ -1 +1 @@
1
- {"version":3,"file":"Cell.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAG3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAA0B,MAAM,6BAA6B,CAAC;AAKnF,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,cAAc,EACd,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,YAAY,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,gBAAgB,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG;IACvC,QAAQ,EAAE,OAAO,YAAY,CAAC;CAkI/B,CAAC"}
1
+ {"version":3,"file":"Cell.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAG3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAA0B,MAAM,6BAA6B,CAAC;AAKnF,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,cAAc,EACd,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,GAAG,YAAY,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,gBAAgB,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG;IACvC,QAAQ,EAAE,OAAO,YAAY,CAAC;CAoI/B,CAAC"}
@@ -15,7 +15,7 @@ import { DEFAULT_DRAGGABLE_LABEL } from "./constants.js";
15
15
  /**
16
16
  * @see https://vkui.io/components/cell
17
17
  */ export const Cell = (_param)=>{
18
- var { mode, onRemove, removePlaceholder = 'Удалить', onDragFinish, before, after, disabled, draggable, Component: ComponentProps, onChange, name, value, checked, defaultChecked, getRootRef, draggerLabel = DEFAULT_DRAGGABLE_LABEL, className, style, toggleButtonTestId, removeButtonTestId, href: hrefProp } = _param, restProps = _object_without_properties(_param, [
18
+ var { mode, onRemove, removePlaceholder = 'Удалить', onDragFinish, before, after, disabled, draggable, Component: ComponentProps, onChange, name, value, checked, defaultChecked, getRootRef, draggerLabel = DEFAULT_DRAGGABLE_LABEL, className, style, toggleButtonTestId, removeButtonTestId, draggerTestId, href: hrefProp } = _param, restProps = _object_without_properties(_param, [
19
19
  "mode",
20
20
  "onRemove",
21
21
  "removePlaceholder",
@@ -36,6 +36,7 @@ import { DEFAULT_DRAGGABLE_LABEL } from "./constants.js";
36
36
  "style",
37
37
  "toggleButtonTestId",
38
38
  "removeButtonTestId",
39
+ "draggerTestId",
39
40
  "href"
40
41
  ]);
41
42
  const [dragging, setDragging] = React.useState(false);
@@ -50,6 +51,7 @@ import { DEFAULT_DRAGGABLE_LABEL } from "./constants.js";
50
51
  className: classNames("vkuiCell__dragger", !before && !selectable && "vkuiCell__controlNoBefore"),
51
52
  onDragStateChange: setDragging,
52
53
  onDragFinish: onDragFinish,
54
+ "data-testid": draggerTestId,
53
55
  children: draggerLabel
54
56
  }) : null;
55
57
  let checkbox;