npm - @vkontakte/vkui - Versions diffs - 5.7.2 → 5.8.0 - Mend

@vkontakte/vkui 5.7.2 → 5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1106) hide show

package/dist/components/BaseGallery/BaseGallery.js CHANGED Viewed

@@ -9,6 +9,7 @@ import { useExternRef } from "../../hooks/useExternRef";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import { useDOM } from "../../lib/dom";
 import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
+import { RootComponent } from "../RootComponent/RootComponent";
 import { ScrollArrow } from "../ScrollArrow/ScrollArrow";
 import { Touch } from "../Touch/Touch";
 import { calcMax, calcMin } from "./helpers";
@@ -29,8 +30,12 @@ var SHIFT_DEFAULT_STATE = {
     deltaX: 0,
     indent: 0
 };
+var stylesBullets = {
+    dark: "vkuiBaseGallery__bullets--dark",
+    light: "vkuiBaseGallery__bullets--light"
+};
 export var BaseGallery = function(_param) {
-    var _param_bullets = _param.bullets, bullets = _param_bullets === void 0 ? false : _param_bullets, getRootRef = _param.getRootRef, children = _param.children, _param_slideWidth = _param.slideWidth, slideWidth = _param_slideWidth === void 0 ? "100%" : _param_slideWidth, _param_slideIndex = _param.slideIndex, slideIndex = _param_slideIndex === void 0 ? 0 : _param_slideIndex, tmp = _param.isDraggable, isDraggableProp = tmp === void 0 ? true : tmp, onDragStart = _param.onDragStart, onDragEnd = _param.onDragEnd, onChange = _param.onChange, onPrevClick = _param.onPrevClick, onNextClick = _param.onNextClick, _param_align = _param.align, align = _param_align === void 0 ? "left" : _param_align, showArrows = _param.showArrows, getRef = _param.getRef, className = _param.className, _param_arrowSize = _param.arrowSize, arrowSize = _param_arrowSize === void 0 ? "l" : _param_arrowSize, restProps = _object_without_properties(_param, [
+    var _param_bullets = _param.bullets, bullets = _param_bullets === void 0 ? false : _param_bullets, getRootRef = _param.getRootRef, children = _param.children, _param_slideWidth = _param.slideWidth, slideWidth = _param_slideWidth === void 0 ? "100%" : _param_slideWidth, _param_slideIndex = _param.slideIndex, slideIndex = _param_slideIndex === void 0 ? 0 : _param_slideIndex, tmp = _param.isDraggable, isDraggableProp = tmp === void 0 ? true : tmp, onDragStart = _param.onDragStart, onDragEnd = _param.onDragEnd, onChange = _param.onChange, onPrevClick = _param.onPrevClick, onNextClick = _param.onNextClick, _param_align = _param.align, align = _param_align === void 0 ? "left" : _param_align, showArrows = _param.showArrows, getRef = _param.getRef, _param_arrowSize = _param.arrowSize, arrowSize = _param_arrowSize === void 0 ? "l" : _param_arrowSize, restProps = _object_without_properties(_param, [
         "bullets",
         "getRootRef",
         "children",
@@ -45,7 +50,6 @@ export var BaseGallery = function(_param) {
         "align",
         "showArrows",
         "getRef",
-        "className",
         "arrowSize"
     ]);
     var slidesStore = React.useRef({});
@@ -277,9 +281,9 @@ export var BaseGallery = function(_param) {
     (align === "left" && layoutState.current.containerWidth - shiftState.shiftX < ((_layoutState_current_layerWidth = layoutState.current.layerWidth) !== null && _layoutState_current_layerWidth !== void 0 ? _layoutState_current_layerWidth : 0) || // otherwise we need to check current slide index (align = right or align = center)
     align !== "left" && slideIndex < layoutState.current.slides.length - 1);
     var isDraggable = isDraggableProp && !layoutState.current.isFullyVisible;
-    return /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, restProps), {
-        className: classNames("vkuiBaseGallery", align === "center" && "vkuiBaseGallery--align-center", slideWidth === "custom" && "vkuiBaseGallery--custom-width", isDraggable && "vkuiBaseGallery--draggable", className),
-        ref: rootRef
+    return /*#__PURE__*/ React.createElement(RootComponent, _object_spread_props(_object_spread({}, restProps), {
+        baseClassName: classNames("vkuiBaseGallery", align === "center" && "vkuiBaseGallery--align-center", slideWidth === "custom" && "vkuiBaseGallery--custom-width", isDraggable && "vkuiBaseGallery--draggable"),
+        getRootRef: rootRef
     }), /*#__PURE__*/ React.createElement(Touch, {
         className: "vkuiBaseGallery__viewport",
         onStartX: onStart,
@@ -303,10 +307,7 @@ export var BaseGallery = function(_param) {
         }, item);
     }))), bullets && /*#__PURE__*/ React.createElement("div", {
         "aria-hidden": true,
-        className: classNames("vkuiBaseGallery__bullets", {
-            dark: "vkuiBaseGallery__bullets--dark",
-            light: "vkuiBaseGallery__bullets--light"
-        }[bullets])
+        className: classNames("vkuiBaseGallery__bullets", stylesBullets[bullets])
     }, React.Children.map(children, function(_item, index) {
         return /*#__PURE__*/ React.createElement("div", {
             className: classNames("vkuiBaseGallery__bullet", index === slideIndex && "vkuiBaseGallery__bullet--active"),

package/dist/components/BaseGallery/BaseGallery.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/BaseGallery/BaseGallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { calcMax, calcMin } from './helpers';\nimport { BaseGalleryProps, GallerySlidesState, LayoutState, ShiftingState } from './types';\nimport styles from './BaseGallery.module.css';\n\nconst ANIMATION_DURATION = 0.24;\n\nconst LAYOUT_DEFAULT_STATE = {\n containerWidth: 0,\n viewportOffsetWidth: 0,\n layerWidth: 0,\n min: 0,\n max: 0,\n slides: [],\n isFullyVisible: true,\n};\n\nconst SHIFT_DEFAULT_STATE = {\n animation: undefined,\n shiftX: 0,\n dragging: false,\n deltaX: 0,\n indent: 0,\n};\n\nexport const BaseGallery = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n isDraggable: isDraggableProp = true,\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n className,\n arrowSize = 'l',\n ...restProps\n}: BaseGalleryProps) => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement \| null>>({});\n const layoutState = React.useRef<LayoutState>(LAYOUT_DEFAULT_STATE);\n const [shiftState, setShiftState] = React.useState<ShiftingState>(SHIFT_DEFAULT_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n\n const { window } = useDOM();\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n const validateIndent = (value: number) => {\n const localMax = layoutState.current.max ?? 0;\n const localMin = layoutState.current.min ?? 0;\n\n if (value < localMin) {\n return localMin;\n } else if (value > localMax) {\n return localMax;\n }\n\n return value;\n };\n\n /\n Считает отступ слоя галереи\n /\n const calculateIndent = (targetIndex: number) => {\n if (layoutState.current.isFullyVisible) {\n return 0;\n }\n\n const targetSlide = layoutState.current.slides?.length\n ? layoutState.current.slides[targetIndex]\n : null;\n\n if (targetSlide) {\n const { coordX, width } = targetSlide;\n\n if (isCenterWithCustomWidth) {\n const viewportWidth = layoutState.current.viewportOffsetWidth ?? 0;\n return viewportWidth / 2 - coordX - width / 2;\n }\n\n return validateIndent(-1 coordX);\n }\n\n return 0;\n };\n\n /\n Считает отступ слоя галереи во время драга\n /\n const calculateDragIndent = () => {\n const localMax = layoutState.current.max ?? 0;\n const localMin = layoutState.current.min ?? 0;\n const indent = shiftState.shiftX + shiftState.deltaX;\n\n if (indent > localMax) {\n return localMax + Number((indent - localMax) / 3);\n } else if (indent < localMin) {\n return localMin + Number((indent - localMin) / 3);\n }\n\n return indent;\n };\n\n const initializeSlides = (options: { animation?: boolean } = {}) => {\n const localSlides =\n React.Children.map(children, (_item: React.ReactNode, i: number): GallerySlidesState => {\n const elem = slidesStore.current[`slide-${i}`];\n return {\n coordX: elem?.offsetLeft ?? 0,\n width: elem?.offsetWidth ?? 0,\n };\n }) ?? [];\n\n const localContainerWidth = rootRef.current?.offsetWidth ?? 0;\n const localViewportOffsetWidth = viewportRef.current?.offsetWidth ?? 0;\n const localLayerWidth = localSlides.reduce(\n (val: number, slide: GallerySlidesState) => slide.width + val,\n 0,\n );\n const adjustShiftX =\n localSlides.length <= layoutState.current.slides.length \|\|\n layoutState.current.slides[slideIndex]?.coordX !== localSlides[slideIndex]?.coordX;\n\n layoutState.current = {\n containerWidth: localContainerWidth,\n viewportOffsetWidth: localViewportOffsetWidth,\n layerWidth: localLayerWidth,\n max: calcMax({\n slides: localSlides,\n viewportOffsetWidth: localViewportOffsetWidth,\n isCenterWithCustomWidth,\n }),\n min: calcMin({\n containerWidth: localContainerWidth,\n layerWidth: localLayerWidth,\n slides: localSlides,\n viewportOffsetWidth: localViewportOffsetWidth,\n isCenterWithCustomWidth,\n align,\n }),\n slides: localSlides,\n isFullyVisible: localLayerWidth <= localContainerWidth,\n };\n\n setShiftState((prevState) => ({\n ...prevState,\n shiftX: adjustShiftX ? calculateIndent(slideIndex) : prevState.shiftX,\n animation: options.animation ?? prevState.shiftX === validateIndent(prevState.shiftX),\n }));\n };\n\n const onResize = () => {\n if (shiftState.animation !== undefined) {\n initializeSlides({ animation: false });\n }\n };\n\n useGlobalEventListener(window, 'resize', onResize);\n\n useIsomorphicLayoutEffect(() => {\n initializeSlides({ animation: false });\n }, [children, align, slideWidth]);\n\n useIsomorphicLayoutEffect(() => {\n if (shiftState.animation !== undefined) {\n setShiftState((prevState) => ({\n ...prevState,\n animation: true,\n deltaX: 0,\n shiftX: calculateIndent(slideIndex ?? 0),\n }));\n }\n }, [slideIndex]);\n\n const slideLeft = (event: React.MouseEvent) => {\n onChange?.(slideIndex - 1);\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n onChange?.(slideIndex + 1);\n onNextClick?.(event);\n };\n\n /\n * Получает индекс слайда, к которому будет осуществлен переход\n /\n const getTarget = (e: TouchEvent) => {\n const expectDeltaX = (shiftState.deltaX / e.duration) 240 * 0.6;\n const shift =\n shiftState.shiftX + shiftState.deltaX + expectDeltaX - (layoutState.current.max ?? 0);\n const direction = shiftState.deltaX < 0 ? 1 : -1;\n\n // Находим ближайшую границу слайда к текущему отступу\n let targetIndex = layoutState.current.slides.reduce(\n (val: number, item: GallerySlidesState, index: number) => {\n const previousValue = Math.abs(layoutState.current.slides[val].coordX + shift);\n const currentValue = Math.abs(item.coordX + shift);\n\n return previousValue < currentValue ? val : index;\n },\n slideIndex,\n );\n\n if (targetIndex === slideIndex) {\n let targetSlide = slideIndex + direction;\n\n if (targetSlide >= 0 && targetSlide < layoutState.current.slides.length) {\n if (Math.abs(shiftState.deltaX) > layoutState.current.slides[targetSlide].width * 0.05) {\n targetIndex = targetSlide;\n }\n }\n }\n\n return targetIndex;\n };\n\n const onStart = (e: TouchEvent) => {\n onDragStart?.(e);\n setShiftState((prevState) => ({ ...prevState, animation: false }));\n };\n\n const onMoveX = (e: TouchEvent) => {\n if (isDraggableProp && !layoutState.current.isFullyVisible) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n if (shiftState.deltaX !== e.shiftX) {\n setShiftState((prevState) => ({\n ...prevState,\n deltaX: e.shiftX,\n dragging: e.isSlideX,\n }));\n }\n }\n }\n };\n\n const onEnd = (e: TouchEvent) => {\n const targetIndex = e.isSlide ? getTarget(e) : slideIndex ?? 0;\n onDragEnd?.(e, targetIndex);\n\n const nextShiftState: Partial<ShiftingState> = {\n animation: true,\n dragging: false,\n deltaX: 0,\n };\n\n const shiftXStick = calculateDragIndent();\n if (targetIndex !== slideIndex) {\n // Сохраняем сдвиг слайда в том положении, в каком его оставили после драга (fix issue #2185)\n nextShiftState.shiftX = shiftXStick;\n }\n\n setShiftState((prevState) => ({ ...prevState, ...nextShiftState }));\n if (targetIndex !== slideIndex) {\n onChange?.(targetIndex);\n }\n };\n\n const indent = shiftState.dragging ? calculateDragIndent() : shiftState.shiftX;\n\n const layerStyle = {\n WebkitTransform: `translateX(${indent}px)`,\n transform: `translateX(${indent}px)`,\n WebkitTransition: shiftState.animation\n ? `-webkit-transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n : 'none',\n transition: shiftState.animation\n ? `transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n : 'none',\n };\n\n const setSlideRef = (slideRef: HTMLDivElement \| null, slideIndex: number) => {\n slidesStore.current[`slide-${slideIndex}`] = slideRef;\n };\n\n // shiftX is negative number <= 0, we can swipe back only if it is < 0\n const canSlideLeft = !layoutState.current.isFullyVisible && shiftState.shiftX < 0;\n\n const canSlideRight =\n !layoutState.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n layoutState.current.containerWidth - shiftState.shiftX <\n (layoutState.current.layerWidth ?? 0)) \|\|\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < layoutState.current.slides.length - 1));\n\n const isDraggable = isDraggableProp && !layoutState.current.isFullyVisible;\n\n return (\n <div\n {...restProps}\n className={classNames(\n styles['BaseGallery'],\n align === 'center' && styles['BaseGallery--align-center'],\n slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n isDraggable && styles['BaseGallery--draggable'],\n className,\n )}\n ref={rootRef}\n >\n <Touch\n className={styles['BaseGallery__viewport']}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n getRootRef={viewportRef}\n noSlideClick\n >\n <div className={styles['BaseGallery__layer']} style={layerStyle}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n className={styles['BaseGallery__slide']}\n key={`slide-${i}`}\n ref={(el) => setSlideRef(el, i)}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n\n {bullets && (\n <div\n aria-hidden\n className={classNames(\n styles['BaseGallery__bullets'],\n {\n dark: styles['BaseGallery__bullets--dark'],\n light: styles['BaseGallery__bullets--light'],\n }[bullets],\n )}\n >\n {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n <div\n className={classNames(\n styles['BaseGallery__bullet'],\n index === slideIndex && styles['BaseGallery__bullet--active'],\n )}\n key={index}\n />\n ))}\n </div>\n )}\n\n {showArrows && hasPointer && canSlideLeft && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"left\"\n onClick={slideLeft}\n size={arrowSize}\n />\n )}\n {showArrows && hasPointer && canSlideRight && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"right\"\n onClick={slideRight}\n size={arrowSize}\n />\n )}\n </div>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","ScrollArrow","Touch","calcMax","calcMin","ANIMATION_DURATION","LAYOUT_DEFAULT_STATE","containerWidth","viewportOffsetWidth","layerWidth","min","max","slides","isFullyVisible","SHIFT_DEFAULT_STATE","animation","undefined","shiftX","dragging","deltaX","indent","BaseGallery","bullets","getRootRef","children","slideWidth","slideIndex","isDraggableProp","isDraggable","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","className","arrowSize","restProps","slidesStore","useRef","layoutState","useState","shiftState","setShiftState","rootRef","viewportRef","window","hasPointer","isCenterWithCustomWidth","validateIndent","value","localMax","current","localMin","calculateIndent","targetIndex","targetSlide","length","coordX","width","viewportWidth","calculateDragIndent","Number","initializeSlides","options","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","localContainerWidth","localViewportOffsetWidth","localLayerWidth","reduce","val","slide","adjustShiftX","prevState","onResize","slideLeft","event","slideRight","getTarget","e","expectDeltaX","duration","shift","direction","item","index","previousValue","Math","abs","currentValue","onStart","onMoveX","originalEvent","preventDefault","isSlideX","onEnd","isSlide","nextShiftState","shiftXStick","layerStyle","WebkitTransform","transform","WebkitTransition","transition","setSlideRef","slideRef","canSlideLeft","canSlideRight","div","ref","onStartX","style","noSlideClick","key","el","aria-hidden","dark","light","onClick","size"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/BaseGallery/BaseGallery.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollArrow } from '../ScrollArrow/ScrollArrow';\nimport { Touch, TouchEvent } from '../Touch/Touch';\nimport { calcMax, calcMin } from './helpers';\nimport { BaseGalleryProps, GallerySlidesState, LayoutState, ShiftingState } from './types';\nimport styles from './BaseGallery.module.css';\n\nconst ANIMATION_DURATION = 0.24;\n\nconst LAYOUT_DEFAULT_STATE = {\n containerWidth: 0,\n viewportOffsetWidth: 0,\n layerWidth: 0,\n min: 0,\n max: 0,\n slides: [],\n isFullyVisible: true,\n};\n\nconst SHIFT_DEFAULT_STATE = {\n animation: undefined,\n shiftX: 0,\n dragging: false,\n deltaX: 0,\n indent: 0,\n};\n\nconst stylesBullets = {\n dark: styles['BaseGallery__bullets--dark'],\n light: styles['BaseGallery__bullets--light'],\n};\nexport const BaseGallery = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n isDraggable: isDraggableProp = true,\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize = 'l',\n ...restProps\n}: BaseGalleryProps) => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement \| null>>({});\n const layoutState = React.useRef<LayoutState>(LAYOUT_DEFAULT_STATE);\n const [shiftState, setShiftState] = React.useState<ShiftingState>(SHIFT_DEFAULT_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n\n const { window } = useDOM();\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n const validateIndent = (value: number) => {\n const localMax = layoutState.current.max ?? 0;\n const localMin = layoutState.current.min ?? 0;\n\n if (value < localMin) {\n return localMin;\n } else if (value > localMax) {\n return localMax;\n }\n\n return value;\n };\n\n /\n Считает отступ слоя галереи\n /\n const calculateIndent = (targetIndex: number) => {\n if (layoutState.current.isFullyVisible) {\n return 0;\n }\n\n const targetSlide = layoutState.current.slides?.length\n ? layoutState.current.slides[targetIndex]\n : null;\n\n if (targetSlide) {\n const { coordX, width } = targetSlide;\n\n if (isCenterWithCustomWidth) {\n const viewportWidth = layoutState.current.viewportOffsetWidth ?? 0;\n return viewportWidth / 2 - coordX - width / 2;\n }\n\n return validateIndent(-1 coordX);\n }\n\n return 0;\n };\n\n /\n Считает отступ слоя галереи во время драга\n /\n const calculateDragIndent = () => {\n const localMax = layoutState.current.max ?? 0;\n const localMin = layoutState.current.min ?? 0;\n const indent = shiftState.shiftX + shiftState.deltaX;\n\n if (indent > localMax) {\n return localMax + Number((indent - localMax) / 3);\n } else if (indent < localMin) {\n return localMin + Number((indent - localMin) / 3);\n }\n\n return indent;\n };\n\n const initializeSlides = (options: { animation?: boolean } = {}) => {\n const localSlides =\n React.Children.map(children, (_item: React.ReactNode, i: number): GallerySlidesState => {\n const elem = slidesStore.current[`slide-${i}`];\n return {\n coordX: elem?.offsetLeft ?? 0,\n width: elem?.offsetWidth ?? 0,\n };\n }) ?? [];\n\n const localContainerWidth = rootRef.current?.offsetWidth ?? 0;\n const localViewportOffsetWidth = viewportRef.current?.offsetWidth ?? 0;\n const localLayerWidth = localSlides.reduce(\n (val: number, slide: GallerySlidesState) => slide.width + val,\n 0,\n );\n const adjustShiftX =\n localSlides.length <= layoutState.current.slides.length \|\|\n layoutState.current.slides[slideIndex]?.coordX !== localSlides[slideIndex]?.coordX;\n\n layoutState.current = {\n containerWidth: localContainerWidth,\n viewportOffsetWidth: localViewportOffsetWidth,\n layerWidth: localLayerWidth,\n max: calcMax({\n slides: localSlides,\n viewportOffsetWidth: localViewportOffsetWidth,\n isCenterWithCustomWidth,\n }),\n min: calcMin({\n containerWidth: localContainerWidth,\n layerWidth: localLayerWidth,\n slides: localSlides,\n viewportOffsetWidth: localViewportOffsetWidth,\n isCenterWithCustomWidth,\n align,\n }),\n slides: localSlides,\n isFullyVisible: localLayerWidth <= localContainerWidth,\n };\n\n setShiftState((prevState) => ({\n ...prevState,\n shiftX: adjustShiftX ? calculateIndent(slideIndex) : prevState.shiftX,\n animation: options.animation ?? prevState.shiftX === validateIndent(prevState.shiftX),\n }));\n };\n\n const onResize = () => {\n if (shiftState.animation !== undefined) {\n initializeSlides({ animation: false });\n }\n };\n\n useGlobalEventListener(window, 'resize', onResize);\n\n useIsomorphicLayoutEffect(() => {\n initializeSlides({ animation: false });\n }, [children, align, slideWidth]);\n\n useIsomorphicLayoutEffect(() => {\n if (shiftState.animation !== undefined) {\n setShiftState((prevState) => ({\n ...prevState,\n animation: true,\n deltaX: 0,\n shiftX: calculateIndent(slideIndex ?? 0),\n }));\n }\n }, [slideIndex]);\n\n const slideLeft = (event: React.MouseEvent) => {\n onChange?.(slideIndex - 1);\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n onChange?.(slideIndex + 1);\n onNextClick?.(event);\n };\n\n /\n * Получает индекс слайда, к которому будет осуществлен переход\n /\n const getTarget = (e: TouchEvent) => {\n const expectDeltaX = (shiftState.deltaX / e.duration) 240 * 0.6;\n const shift =\n shiftState.shiftX + shiftState.deltaX + expectDeltaX - (layoutState.current.max ?? 0);\n const direction = shiftState.deltaX < 0 ? 1 : -1;\n\n // Находим ближайшую границу слайда к текущему отступу\n let targetIndex = layoutState.current.slides.reduce(\n (val: number, item: GallerySlidesState, index: number) => {\n const previousValue = Math.abs(layoutState.current.slides[val].coordX + shift);\n const currentValue = Math.abs(item.coordX + shift);\n\n return previousValue < currentValue ? val : index;\n },\n slideIndex,\n );\n\n if (targetIndex === slideIndex) {\n let targetSlide = slideIndex + direction;\n\n if (targetSlide >= 0 && targetSlide < layoutState.current.slides.length) {\n if (Math.abs(shiftState.deltaX) > layoutState.current.slides[targetSlide].width * 0.05) {\n targetIndex = targetSlide;\n }\n }\n }\n\n return targetIndex;\n };\n\n const onStart = (e: TouchEvent) => {\n onDragStart?.(e);\n setShiftState((prevState) => ({ ...prevState, animation: false }));\n };\n\n const onMoveX = (e: TouchEvent) => {\n if (isDraggableProp && !layoutState.current.isFullyVisible) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n if (shiftState.deltaX !== e.shiftX) {\n setShiftState((prevState) => ({\n ...prevState,\n deltaX: e.shiftX,\n dragging: e.isSlideX,\n }));\n }\n }\n }\n };\n\n const onEnd = (e: TouchEvent) => {\n const targetIndex = e.isSlide ? getTarget(e) : slideIndex ?? 0;\n onDragEnd?.(e, targetIndex);\n\n const nextShiftState: Partial<ShiftingState> = {\n animation: true,\n dragging: false,\n deltaX: 0,\n };\n\n const shiftXStick = calculateDragIndent();\n if (targetIndex !== slideIndex) {\n // Сохраняем сдвиг слайда в том положении, в каком его оставили после драга (fix issue #2185)\n nextShiftState.shiftX = shiftXStick;\n }\n\n setShiftState((prevState) => ({ ...prevState, ...nextShiftState }));\n if (targetIndex !== slideIndex) {\n onChange?.(targetIndex);\n }\n };\n\n const indent = shiftState.dragging ? calculateDragIndent() : shiftState.shiftX;\n\n const layerStyle = {\n WebkitTransform: `translateX(${indent}px)`,\n transform: `translateX(${indent}px)`,\n WebkitTransition: shiftState.animation\n ? `-webkit-transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n : 'none',\n transition: shiftState.animation\n ? `transform ${ANIMATION_DURATION}s cubic-bezier(.1, 0, .25, 1)`\n : 'none',\n };\n\n const setSlideRef = (slideRef: HTMLDivElement \| null, slideIndex: number) => {\n slidesStore.current[`slide-${slideIndex}`] = slideRef;\n };\n\n // shiftX is negative number <= 0, we can swipe back only if it is < 0\n const canSlideLeft = !layoutState.current.isFullyVisible && shiftState.shiftX < 0;\n\n const canSlideRight =\n !layoutState.current.isFullyVisible &&\n // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side\n ((align === 'left' &&\n layoutState.current.containerWidth - shiftState.shiftX <\n (layoutState.current.layerWidth ?? 0)) \|\|\n // otherwise we need to check current slide index (align = right or align = center)\n (align !== 'left' && slideIndex < layoutState.current.slides.length - 1));\n\n const isDraggable = isDraggableProp && !layoutState.current.isFullyVisible;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['BaseGallery'],\n align === 'center' && styles['BaseGallery--align-center'],\n slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n isDraggable && styles['BaseGallery--draggable'],\n )}\n getRootRef={rootRef}\n >\n <Touch\n className={styles['BaseGallery__viewport']}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n getRootRef={viewportRef}\n noSlideClick\n >\n <div className={styles['BaseGallery__layer']} style={layerStyle}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n className={styles['BaseGallery__slide']}\n key={`slide-${i}`}\n ref={(el) => setSlideRef(el, i)}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n\n {bullets && (\n <div\n aria-hidden\n className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n >\n {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n <div\n className={classNames(\n styles['BaseGallery__bullet'],\n index === slideIndex && styles['BaseGallery__bullet--active'],\n )}\n key={index}\n />\n ))}\n </div>\n )}\n\n {showArrows && hasPointer && canSlideLeft && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"left\"\n onClick={slideLeft}\n size={arrowSize}\n />\n )}\n {showArrows && hasPointer && canSlideRight && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"right\"\n onClick={slideRight}\n size={arrowSize}\n />\n )}\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useAdaptivityHasPointer","useExternRef","useGlobalEventListener","useDOM","useIsomorphicLayoutEffect","RootComponent","ScrollArrow","Touch","calcMax","calcMin","ANIMATION_DURATION","LAYOUT_DEFAULT_STATE","containerWidth","viewportOffsetWidth","layerWidth","min","max","slides","isFullyVisible","SHIFT_DEFAULT_STATE","animation","undefined","shiftX","dragging","deltaX","indent","stylesBullets","dark","light","BaseGallery","bullets","getRootRef","children","slideWidth","slideIndex","isDraggableProp","isDraggable","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","useRef","layoutState","useState","shiftState","setShiftState","rootRef","viewportRef","window","hasPointer","isCenterWithCustomWidth","validateIndent","value","localMax","current","localMin","calculateIndent","targetIndex","targetSlide","length","coordX","width","viewportWidth","calculateDragIndent","Number","initializeSlides","options","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","localContainerWidth","localViewportOffsetWidth","localLayerWidth","reduce","val","slide","adjustShiftX","prevState","onResize","slideLeft","event","slideRight","getTarget","e","expectDeltaX","duration","shift","direction","item","index","previousValue","Math","abs","currentValue","onStart","onMoveX","originalEvent","preventDefault","isSlideX","onEnd","isSlide","nextShiftState","shiftXStick","layerStyle","WebkitTransform","transform","WebkitTransition","transition","setSlideRef","slideRef","canSlideLeft","canSlideRight","baseClassName","className","onStartX","style","noSlideClick","div","key","ref","el","aria-hidden","onClick","size"],"mappings":"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"}

package/dist/components/BaseGallery/types.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { HasAlign, HasRef, HasRootRef } from '../../types';
+import { HasAlign, HasRef, HTMLAttributesWithRootRef } from '../../types';
 import { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';
 import { TouchEvent, TouchEventHandler } from '../Touch/Touch';
 export interface GallerySlidesState {
@@ -21,7 +21,7 @@ export interface LayoutState {
     slides: GallerySlidesState[];
     isFullyVisible: boolean;
 }
-export interface BaseGalleryProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>, HasAlign, HasRootRef<HTMLDivElement>, HasRef<HTMLElement> {
+export interface BaseGalleryProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' | 'onDragStart' | 'onDragEnd'>, HasAlign, HasRef<HTMLElement> {
     slideWidth?: string | number;
     slideIndex?: number;
     onDragStart?: TouchEventHandler;

package/dist/components/BaseGallery/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/BaseGallery/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { HasAlign, HasRef, ~~HasRootRef~~ } from '../../types';\nimport { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport { TouchEvent, TouchEventHandler } from '../Touch/Touch';\n\nexport interface GallerySlidesState {\n coordX: number;\n width: number;\n}\n\nexport interface ShiftingState {\n deltaX: number;\n shiftX: number;\n animation?: boolean;\n dragging: boolean;\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 BaseGalleryProps\n extends Omit<~~React.HTMLAttributes~~<HTMLDivElement>, 'onChange' \| 'onDragStart' \| 'onDragEnd'>,\n HasAlign,\n ~~HasRootRef<HTMLDivElement>,\n~~ HasRef<HTMLElement> {\n slideWidth?: string \| number;\n slideIndex?: number;\n onDragStart?: TouchEventHandler;\n onDragEnd?(e: TouchEvent, 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 isDraggable?: boolean;\n showArrows?: boolean;\n hasPointer?: boolean;\n arrowSize?: ScrollArrowProps['size'];\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1	+ {"version":3,"sources":["../../../src/components/BaseGallery/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { HasAlign, HasRef, HTMLAttributesWithRootRef } from '../../types';\nimport { ScrollArrowProps } from '../ScrollArrow/ScrollArrow';\nimport { TouchEvent, TouchEventHandler } from '../Touch/Touch';\n\nexport interface GallerySlidesState {\n coordX: number;\n width: number;\n}\n\nexport interface ShiftingState {\n deltaX: number;\n shiftX: number;\n animation?: boolean;\n dragging: boolean;\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 BaseGalleryProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange' \| 'onDragStart' \| 'onDragEnd'>,\n HasAlign,\n HasRef<HTMLElement> {\n slideWidth?: string \| number;\n slideIndex?: number;\n onDragStart?: TouchEventHandler;\n onDragEnd?(e: TouchEvent, 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 isDraggable?: boolean;\n showArrows?: boolean;\n hasPointer?: boolean;\n arrowSize?: ScrollArrowProps['size'];\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/dist/components/Button/Button.js CHANGED Viewed

@@ -10,6 +10,31 @@ import { SizeType } from "../../lib/adaptivity";
 import { Platform } from "../../lib/platform";
 import { Spinner } from "../Spinner/Spinner";
 import { Tappable } from "../Tappable/Tappable";
+var stylesSize = {
+    s: "vkuiButton--size-s",
+    m: "vkuiButton--size-m",
+    l: "vkuiButton--size-l"
+};
+var stylesMode = {
+    primary: "vkuiButton--mode-primary",
+    secondary: "vkuiButton--mode-secondary",
+    tertiary: "vkuiButton--mode-tertiary",
+    outline: "vkuiButton--mode-outline",
+    link: "vkuiButton--mode-link"
+};
+var stylesAppearance = {
+    "accent": "vkuiButton--appearance-accent",
+    "positive": "vkuiButton--appearance-positive",
+    "negative": "vkuiButton--appearance-negative",
+    "neutral": "vkuiButton--appearance-neutral",
+    "overlay": "vkuiButton--appearance-overlay",
+    "accent-invariable": "vkuiButton--appearance-accent-invariable"
+};
+var stylesAlign = {
+    left: "vkuiButton--align-left",
+    center: "vkuiButton--align-center",
+    right: "vkuiButton--align-right"
+};
 var sizeYClassNames = _define_property({
     none: "vkuiButton--sizeY-none"
 }, SizeType.REGULAR, "vkuiButton--sizeY-regular");
@@ -44,28 +69,7 @@ var sizeYClassNames = _define_property({
     }, restProps), {
         onClick: loading ? undefined : onClick,
         stopPropagation: stopPropagation,
-        className: classNames(className, "vkuiButton", {
-            s: "vkuiButton--size-s",
-            m: "vkuiButton--size-m",
-            l: "vkuiButton--size-l"
-        }[size], {
-            primary: "vkuiButton--mode-primary",
-            secondary: "vkuiButton--mode-secondary",
-            tertiary: "vkuiButton--mode-tertiary",
-            outline: "vkuiButton--mode-outline",
-            link: "vkuiButton--mode-link"
-        }[mode], {
-            "accent": "vkuiButton--appearance-accent",
-            "positive": "vkuiButton--appearance-positive",
-            "negative": "vkuiButton--appearance-negative",
-            "neutral": "vkuiButton--appearance-neutral",
-            "overlay": "vkuiButton--appearance-overlay",
-            "accent-invariable": "vkuiButton--appearance-accent-invariable"
-        }[appearance], {
-            left: "vkuiButton--align-left",
-            center: "vkuiButton--align-center",
-            right: "vkuiButton--align-right"
-        }[align], sizeY !== SizeType.COMPACT && sizeYClassNames[sizeY], platform === Platform.IOS && "vkuiButton--ios", stretched && "vkuiButton--stretched", hasIcons && "vkuiButton--with-icon", hasIconOnly && !stretched && "vkuiButton--singleIcon", loading && "vkuiButton--loading"),
+        className: classNames(className, "vkuiButton", stylesSize[size], stylesMode[mode], stylesAppearance[appearance], stylesAlign[align], sizeY !== SizeType.COMPACT && sizeYClassNames[sizeY], platform === Platform.IOS && "vkuiButton--ios", stretched && "vkuiButton--stretched", hasIcons && "vkuiButton--with-icon", hasIconOnly && !stretched && "vkuiButton--singleIcon", loading && "vkuiButton--loading"),
         getRootRef: getRootRef
     }), loading && /*#__PURE__*/ React.createElement(Spinner, {
         size: "small",

package/dist/components/Button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasAlign } from '../../types';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport '../Spinner/Spinner.module.css';\nimport styles from './Button.module.css';\n\nconst sizeYClassNames = {\n none: styles['Button--sizeY-none'],\n [SizeType.REGULAR]: styles['Button--sizeY-regular'],\n};\n\nexport interface VKUIButtonProps extends HasAlign {\n mode?: 'primary' \| 'secondary' \| 'tertiary' \| 'outline' \| 'link';\n appearance?: 'accent' \| 'positive' \| 'negative' \| 'neutral' \| 'overlay' \| 'accent-invariable';\n size?: 's' \| 'm' \| 'l';\n stretched?: boolean;\n before?: React.ReactNode;\n after?: React.ReactNode;\n loading?: boolean;\n disableSpinnerAnimation?: boolean;\n}\n\nexport interface ButtonProps extends Omit<TappableProps, 'size'>, VKUIButtonProps {}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Button\n */\nexport const Button = ({\n size = 's',\n mode = 'primary',\n appearance = 'accent',\n stretched = false,\n align = 'center',\n children,\n before,\n after,\n getRootRef,\n loading,\n onClick,\n stopPropagation = true,\n className,\n disableSpinnerAnimation,\n ...restProps\n}: ButtonProps) => {\n const hasIcons = Boolean(before \|\| after);\n const hasIconOnly = !children && Boolean(after) !== Boolean(before);\n const { sizeY = 'none' } = useAdaptivity();\n const platform = usePlatform();\n\n return (\n <Tappable\n hoverMode={styles['Button--hover']}\n activeMode={styles['Button--active']}\n Component={restProps.href ? 'a' : 'button'}\n focusVisibleMode=\"outside\"\n {...restProps}\n onClick={loading ? undefined : onClick}\n stopPropagation={stopPropagation}\n className={classNames(\n className,\n styles.Button,\n ~~{\n s: styles~~[~~'Button--~~size~~-s'~~],\n ~~m: styles['Button--size-m'],\n l: styles['Button--size-l'],\n~~ }[~~size],\n {\n primary: styles['Button--~~mode~~-primary'~~],\n ~~secondary: styles['Button--mode-secondary'],\n tertiary: styles['Button--mode-tertiary'],\n outline: styles['Button--mode-outline'],\n link: styles['Button--mode-link'],\n~~ }[~~mode],\n {\n 'accent': styles['Button--~~appearance~~-accent'~~],\n 'positive': styles['Button--appearance-positive'],\n 'negative': styles['Button--appearance-negative'],\n 'neutral': styles['Button--appearance-neutral'],\n 'overlay': styles['Button--appearance-overlay'],\n 'accent-invariable': styles['Button--appearance-accent-invariable'],\n }[~~appearance],\n {\n left: styles['Button--~~align~~-left'~~],\n ~~center: styles['Button--align-center'],\n right: styles['Button--align-right'],\n~~ ~~}[align],\n~~ sizeY !== SizeType.COMPACT && sizeYClassNames[sizeY],\n platform === Platform.IOS && styles['Button--ios'],\n stretched && styles['Button--stretched'],\n hasIcons && styles['Button--with-icon'],\n hasIconOnly && !stretched && styles['Button--singleIcon'],\n loading && styles['Button--loading'],\n )}\n getRootRef={getRootRef}\n >\n {loading && (\n <Spinner\n size=\"small\"\n className={styles.Button__spinner}\n disableAnimation={disableSpinnerAnimation}\n />\n )}\n <span className={styles.Button__in}>\n {hasReactNode(before) && (\n <span\n className={styles.Button__before}\n role=\"presentation\"\n data-testid={process.env.NODE_ENV === 'test' ? 'before' : undefined}\n >\n {before}\n </span>\n )}\n {hasReactNode(children) && (\n <span\n className={styles.Button__content}\n data-testid={process.env.NODE_ENV === 'test' ? 'children' : undefined}\n >\n {children}\n </span>\n )}\n {hasReactNode(after) && (\n <span\n className={styles.Button__after}\n role=\"presentation\"\n data-testid={process.env.NODE_ENV === 'test' ? 'after' : undefined}\n >\n {after}\n </span>\n )}\n </span>\n </Tappable>\n );\n};\n"],"names":["React","classNames","hasReactNode","useAdaptivity","usePlatform","SizeType","Platform","Spinner","Tappable","~~sizeYClassNames~~","~~none~~","~~REGULAR~~","~~Button~~","~~size~~","~~mode~~","~~appearance~~","~~stretched~~","~~align~~","~~children~~","~~before~~","~~after~~","~~getRootRef~~","~~loading~~","~~onClick~~","~~stopPropagation~~","~~className~~","~~disableSpinnerAnimation~~","~~restProps~~","~~hasIcons~~","~~Boolean~~","~~hasIconOnly~~","~~sizeY~~","~~platform~~","~~hoverMode~~","~~activeMode~~","~~Component~~","~~href~~","~~focusVisibleMode~~","~~undefined~~","s","m","l","~~primary~~","~~secondary~~","~~tertiary~~","~~outline~~","~~link~~","~~left~~","~~center~~","~~right~~","COMPACT","IOS","disableAnimation","span","role","data-testid","process","env","NODE_ENV"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,OAAO,QAAQ,qBAAqB;AAC7C,SAASC,QAAQ,QAAuB,uBAAuB;AAI/D,IAAMC;IACJC,IAAI;~~GACHL~~,~~SAASM~~,OAAO;AAgBnB;;CAEC,GACD,OAAO,IAAMC,SAAS;6BACpBC,MAAAA,gCAAO,wCACPC,MAAAA,gCAAO,oDACPC,YAAAA,4CAAa,wDACbC,WAAAA,0CAAY,gDACZC,OAAAA,kCAAQ,yBACRC,kBAAAA,UACAC,gBAAAA,QACAC,eAAAA,OACAC,oBAAAA,YACAC,iBAAAA,SACAC,iBAAAA,yCACAC,iBAAAA,sDAAkB,+BAClBC,mBAAAA,WACAC,iCAAAA,yBACGC;QAdHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWC,QAAQV,UAAUC;IACnC,IAAMU,cAAc,CAACZ,YAAYW,QAAQT,WAAWS,QAAQV;IAC5D,~~IAA2BhB~~,iBAAAA,wCAAAA,~~eAAnB4B~~,OAAAA,0CAAQ;IAChB,IAAMC,~~WAAW5B~~;IAEjB,qBACE,oBAACI;~~QACCyB~~,SAAS;QACTC,UAAU;QACVC,WAAWR,UAAUS,IAAI,GAAG,MAAM;QAClCC,kBAAiB;OACbV;QACJJ,SAASD,UAAUgB,YAAYf;QAC/BC,iBAAiBA;QACjBC,~~WAAWxB~~,~~WACTwB~~,yBAEA~~;YACEc~~,~~CAAC;YACDC~~,~~CAAC;YACDC~~,~~CAAC;QACH,CAAC,CAAC5B,~~KAAK,~~EACP;YACE6B~~,~~OAAO;YACPC~~,~~SAAS;YACTC~~,~~QAAQ;YACRC,OAAO;YACPC,IAAI;QACN,CAAC,CAAChC,~~KAAK,~~EACP;YACE~~,~~QAAQ;YACR~~,~~UAAU;YACV~~,~~UAAU;YACV~~,~~SAAS;YACT~~,~~SAAS;YACT,mBAAmB;QACrB,CAAC,CAACC,~~WAAW,~~EACb;YACEgC~~,~~IAAI;YACJC,~~MAAM~~;YACNC~~,~~KAAK;QACP~~,~~CAAC~~,~~CAAChC~~,~~MAAM,EACRc,UAAU1B,SAAS6C,~~OAAO,~~IAAIzC~~,eAAe,CAACsB,MAAM,EACpDC,~~aAAa1B~~,~~SAAS6C~~,GAAG,~~uBACzBnC~~,sCACAY,qCACAE,eAAe,CAACd,uCAChBM;QAEFD,YAAYA;QAEXC,yBACC,~~oBAACf~~;~~QACCM~~,MAAK;QACLY,SAAS;~~QACT2B~~,~~kBAAkB1B~~;sBAGtB,~~oBAAC2B~~;~~QAAK5B~~,SAAS;~~OACZvB~~,~~aAAaiB~~,yBACZ,~~oBAACkC~~;~~QACC5B~~,SAAS;~~QACT6B~~,MAAK;QACLC,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,~~WAAWpB~~;OAEzDnB,~~SAGJjB~~,~~aAAagB~~,2BACZ,~~oBAACmC~~;~~QACC5B~~,SAAS;~~QACT8B~~,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,~~aAAapB~~;OAE3DpB,~~WAGJhB~~,~~aAAakB~~,wBACZ,~~oBAACiC~~;~~QACC5B~~,SAAS;~~QACT6B~~,MAAK;QACLC,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,~~UAAUpB~~;OAExDlB;AAMb,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasAlign } from '../../types';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport '../Spinner/Spinner.module.css';\nimport styles from './Button.module.css';\n\nconst stylesSize = {\n s: styles['Button--size-s'],\n m: styles['Button--size-m'],\n l: styles['Button--size-l'],\n};\n\nconst stylesMode = {\n primary: styles['Button--mode-primary'],\n secondary: styles['Button--mode-secondary'],\n tertiary: styles['Button--mode-tertiary'],\n outline: styles['Button--mode-outline'],\n link: styles['Button--mode-link'],\n};\n\nconst stylesAppearance = {\n 'accent': styles['Button--appearance-accent'],\n 'positive': styles['Button--appearance-positive'],\n 'negative': styles['Button--appearance-negative'],\n 'neutral': styles['Button--appearance-neutral'],\n 'overlay': styles['Button--appearance-overlay'],\n 'accent-invariable': styles['Button--appearance-accent-invariable'],\n};\n\nconst stylesAlign = {\n left: styles['Button--align-left'],\n center: styles['Button--align-center'],\n right: styles['Button--align-right'],\n};\n\nconst sizeYClassNames = {\n none: styles['Button--sizeY-none'],\n [SizeType.REGULAR]: styles['Button--sizeY-regular'],\n};\n\nexport interface VKUIButtonProps extends HasAlign {\n mode?: 'primary' \| 'secondary' \| 'tertiary' \| 'outline' \| 'link';\n appearance?: 'accent' \| 'positive' \| 'negative' \| 'neutral' \| 'overlay' \| 'accent-invariable';\n size?: 's' \| 'm' \| 'l';\n stretched?: boolean;\n before?: React.ReactNode;\n after?: React.ReactNode;\n loading?: boolean;\n disableSpinnerAnimation?: boolean;\n}\n\nexport interface ButtonProps extends Omit<TappableProps, 'size'>, VKUIButtonProps {}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Button\n */\nexport const Button = ({\n size = 's',\n mode = 'primary',\n appearance = 'accent',\n stretched = false,\n align = 'center',\n children,\n before,\n after,\n getRootRef,\n loading,\n onClick,\n stopPropagation = true,\n className,\n disableSpinnerAnimation,\n ...restProps\n}: ButtonProps) => {\n const hasIcons = Boolean(before \|\| after);\n const hasIconOnly = !children && Boolean(after) !== Boolean(before);\n const { sizeY = 'none' } = useAdaptivity();\n const platform = usePlatform();\n\n return (\n <Tappable\n hoverMode={styles['Button--hover']}\n activeMode={styles['Button--active']}\n Component={restProps.href ? 'a' : 'button'}\n focusVisibleMode=\"outside\"\n {...restProps}\n onClick={loading ? undefined : onClick}\n stopPropagation={stopPropagation}\n className={classNames(\n className,\n styles.Button,\n stylesSize[size],\n stylesMode[mode],\n stylesAppearance[appearance],\n stylesAlign[align],\n sizeY !== SizeType.COMPACT && sizeYClassNames[sizeY],\n platform === Platform.IOS && styles['Button--ios'],\n stretched && styles['Button--stretched'],\n hasIcons && styles['Button--with-icon'],\n hasIconOnly && !stretched && styles['Button--singleIcon'],\n loading && styles['Button--loading'],\n )}\n getRootRef={getRootRef}\n >\n {loading && (\n <Spinner\n size=\"small\"\n className={styles.Button__spinner}\n disableAnimation={disableSpinnerAnimation}\n />\n )}\n <span className={styles.Button__in}>\n {hasReactNode(before) && (\n <span\n className={styles.Button__before}\n role=\"presentation\"\n data-testid={process.env.NODE_ENV === 'test' ? 'before' : undefined}\n >\n {before}\n </span>\n )}\n {hasReactNode(children) && (\n <span\n className={styles.Button__content}\n data-testid={process.env.NODE_ENV === 'test' ? 'children' : undefined}\n >\n {children}\n </span>\n )}\n {hasReactNode(after) && (\n <span\n className={styles.Button__after}\n role=\"presentation\"\n data-testid={process.env.NODE_ENV === 'test' ? 'after' : undefined}\n >\n {after}\n </span>\n )}\n </span>\n </Tappable>\n );\n};\n"],"names":["React","classNames","hasReactNode","useAdaptivity","usePlatform","SizeType","Platform","Spinner","Tappable","stylesSize","s","m","l","stylesMode","primary","secondary","tertiary","outline","link","stylesAppearance","stylesAlign","left","center","right","sizeYClassNames","none","REGULAR","Button","size","mode","appearance","stretched","align","children","before","after","getRootRef","loading","onClick","stopPropagation","className","disableSpinnerAnimation","restProps","hasIcons","Boolean","hasIconOnly","sizeY","platform","hoverMode","activeMode","Component","href","focusVisibleMode","undefined","COMPACT","IOS","disableAnimation","span","role","data-testid","process","env","NODE_ENV"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,OAAO,QAAQ,qBAAqB;AAC7C,SAASC,QAAQ,QAAuB,uBAAuB;AAI/D,IAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;AACH;AAEA,IAAMC,aAAa;IACjBC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACRC,OAAO;IACPC,IAAI;AACN;AAEA,IAAMC,mBAAmB;IACvB,QAAQ;IACR,UAAU;IACV,UAAU;IACV,SAAS;IACT,SAAS;IACT,mBAAmB;AACrB;AAEA,IAAMC,cAAc;IAClBC,IAAI;IACJC,MAAM;IACNC,KAAK;AACP;AAEA,IAAMC;IACJC,IAAI;GACHpB,SAASqB,OAAO;AAgBnB;;CAEC,GACD,OAAO,IAAMC,SAAS;6BACpBC,MAAAA,gCAAO,wCACPC,MAAAA,gCAAO,oDACPC,YAAAA,4CAAa,wDACbC,WAAAA,0CAAY,gDACZC,OAAAA,kCAAQ,yBACRC,kBAAAA,UACAC,gBAAAA,QACAC,eAAAA,OACAC,oBAAAA,YACAC,iBAAAA,SACAC,iBAAAA,yCACAC,iBAAAA,sDAAkB,+BAClBC,mBAAAA,WACAC,iCAAAA,yBACGC;QAdHd;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,WAAWC,QAAQV,UAAUC;IACnC,IAAMU,cAAc,CAACZ,YAAYW,QAAQT,WAAWS,QAAQV;IAC5D,IAA2B/B,iBAAAA,wCAAAA,eAAnB2C,OAAAA,0CAAQ;IAChB,IAAMC,WAAW3C;IAEjB,qBACE,oBAACI;QACCwC,SAAS;QACTC,UAAU;QACVC,WAAWR,UAAUS,IAAI,GAAG,MAAM;QAClCC,kBAAiB;OACbV;QACJJ,SAASD,UAAUgB,YAAYf;QAC/BC,iBAAiBA;QACjBC,WAAWvC,WACTuC,yBAEA/B,UAAU,CAACmB,KAAK,EAChBf,UAAU,CAACgB,KAAK,EAChBV,gBAAgB,CAACW,WAAW,EAC5BV,WAAW,CAACY,MAAM,EAClBc,UAAUzC,SAASiD,OAAO,IAAI9B,eAAe,CAACsB,MAAM,EACpDC,aAAazC,SAASiD,GAAG,uBACzBxB,sCACAY,qCACAE,eAAe,CAACd,uCAChBM;QAEFD,YAAYA;QAEXC,yBACC,oBAAC9B;QACCqB,MAAK;QACLY,SAAS;QACTgB,kBAAkBf;sBAGtB,oBAACgB;QAAKjB,SAAS;OACZtC,aAAagC,yBACZ,oBAACuB;QACCjB,SAAS;QACTkB,MAAK;QACLC,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,WAAWT;OAEzDnB,SAGJhC,aAAa+B,2BACZ,oBAACwB;QACCjB,SAAS;QACTmB,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,aAAaT;OAE3DpB,WAGJ/B,aAAaiC,wBACZ,oBAACsB;QACCjB,SAAS;QACTkB,MAAK;QACLC,eAAaC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,UAAUT;OAExDlB;AAMb,EAAE"}

package/dist/components/ButtonGroup/ButtonGroup.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { AlignType, HasRootRef } from '../../types';
-export interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
+import type { AlignType, HTMLAttributesWithRootRef } from '../../types';
+export interface ButtonGroupProps extends HTMLAttributesWithRootRef<HTMLDivElement> {
     /**
      * Задает расположение элементов внутри группы, вертикальное или горизонтальное.
      */
@@ -23,4 +23,4 @@ export interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement>,
 /**
  * @see https://vkcom.github.io/VKUI/#/ButtonGroup
  */
-export declare const ButtonGroup: ({ mode, gap, stretched, align, getRootRef, className, children, ...restProps }: ButtonGroupProps) => React.JSX.Element;
+export declare const ButtonGroup: ({ mode, gap, stretched, align, ...restProps }: ButtonGroupProps) => React.JSX.Element;

package/dist/components/ButtonGroup/ButtonGroup.js CHANGED Viewed

@@ -2,34 +2,34 @@ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
+import { RootComponent } from "../RootComponent/RootComponent";
+var stylesMode = {
+    vertical: "vkuiButtonGroup--mode-vertical",
+    horizontal: "vkuiButtonGroup--mode-horizontal"
+};
+var stylesGap = {
+    space: "vkuiButtonGroup--gap-space",
+    s: "vkuiButtonGroup--gap-s",
+    m: "vkuiButtonGroup--gap-m"
+};
+var stylesAlign = {
+    left: "vkuiButtonGroup--align-left",
+    center: "vkuiButtonGroup--align-center",
+    right: "vkuiButtonGroup--align-right"
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/ButtonGroup
  */ export var ButtonGroup = function(_param) {
-    var _param_mode = _param.mode, mode = _param_mode === void 0 ? "horizontal" : _param_mode, _param_gap = _param.gap, gap = _param_gap === void 0 ? "m" : _param_gap, _param_stretched = _param.stretched, stretched = _param_stretched === void 0 ? false : _param_stretched, _param_align = _param.align, align = _param_align === void 0 ? "left" /* NOTE: Чтобы блоки по-умолчанию не растягивались на всю ширину контейнера */  : _param_align, getRootRef = _param.getRootRef, className = _param.className, children = _param.children, restProps = _object_without_properties(_param, [
+    var _param_mode = _param.mode, mode = _param_mode === void 0 ? "horizontal" : _param_mode, _param_gap = _param.gap, gap = _param_gap === void 0 ? "m" : _param_gap, _param_stretched = _param.stretched, stretched = _param_stretched === void 0 ? false : _param_stretched, _param_align = _param.align, align = _param_align === void 0 ? "left" /* NOTE: Чтобы блоки по-умолчанию не растягивались на всю ширину контейнера */  : _param_align, restProps = _object_without_properties(_param, [
         "mode",
         "gap",
         "stretched",
-        "align",
-        "getRootRef",
-        "className",
-        "children"
+        "align"
     ]);
-    return /*#__PURE__*/ React.createElement("div", _object_spread({
-        className: classNames(className, "vkuiButtonGroup", {
-            vertical: "vkuiButtonGroup--mode-vertical",
-            horizontal: "vkuiButtonGroup--mode-horizontal"
-        }[mode], gap !== "none" && ({
-            space: "vkuiButtonGroup--gap-space",
-            s: "vkuiButtonGroup--gap-s",
-            m: "vkuiButtonGroup--gap-m"
-        })[gap], stretched && "vkuiButtonGroup--stretched", {
-            left: "vkuiButtonGroup--align-left",
-            center: "vkuiButtonGroup--align-center",
-            right: "vkuiButtonGroup--align-right"
-        }[align]),
-        role: "group",
-        ref: getRootRef
-    }, restProps), children);
+    return /*#__PURE__*/ React.createElement(RootComponent, _object_spread({
+        baseClassName: classNames("vkuiButtonGroup", stylesMode[mode], gap !== "none" && stylesGap[gap], stretched && "vkuiButtonGroup--stretched", stylesAlign[align]),
+        role: "group"
+    }, restProps));
 };
 //# sourceMappingURL=ButtonGroup.js.map

package/dist/components/ButtonGroup/ButtonGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { AlignType, ~~HasRootRef~~ } from '../../types';\nimport styles from './ButtonGroup.module.css';\n\nexport interface ButtonGroupProps\n extends ~~React.HTMLAttributes~~<HTMLDivElement~~>,\n HasRootRef<HTMLDivElement~~> {\n /*\n Задает расположение элементов внутри группы, вертикальное или горизонтальное.\n /\n mode?: 'vertical' \| 'horizontal';\n /\n Выставляет в зависимости от `mode` отступ по вертикали или горизонтали.\n /\n gap?: 'none' \| 'space' \| 's' \| 'm';\n /\n Растягивает компонент на всю ширину контейнера.\n \n Note: Для потомков соответствующее поведение нужно определять самостоятельно, где это необходимо.\n /\n stretched?: boolean;\n /\n Горизонтальное выравнивание элементов внутри группы.\n /\n align?: AlignType;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/ButtonGroup\n /\nexport const ButtonGroup = ({\n mode = 'horizontal',\n gap = 'm',\n stretched = false,\n align = 'left' / NOTE: Чтобы блоки по-умолчанию не растягивались на всю ширину контейнера */,\n ~~getRootRef,\n className,\n children,\n~~ ...restProps\n}: ButtonGroupProps) => {\n return (\n <~~div~~\n ~~className~~={classNames(\n ~~className,\n~~ styles.ButtonGroup,\n ~~{\n vertical: styles~~[~~'ButtonGroup--~~mode~~-vertical'~~],\n ~~horizontal: styles['ButtonGroup--mode-horizontal'],\n~~ ~~}[mode],\n~~ gap !== 'none' ~~&&\n {\n space:~~ ~~styles~~[~~'ButtonGroup--~~gap~~-space'~~],\n ~~s: styles['ButtonGroup--gap-s'],\n m: styles['ButtonGroup--gap-m'],\n }[gap],\n~~ stretched && styles['ButtonGroup--stretched'],\n ~~{\n left: styles~~[~~'ButtonGroup--~~align~~-left'~~],\n ~~center: styles['ButtonGroup--align-center'],\n right: styles['ButtonGroup--align-right'],\n }[align],\n~~ )}\n role=\"group\"\n ~~ref=~~{~~getRootRef}\n {~~...restProps}\n >\n ~~{children}\n </div>\n~~ );\n};\n"],"names":["React","classNames","~~ButtonGroup~~","~~mode~~","~~gap~~","~~stretched~~","~~align~~","~~getRootRef~~","~~className~~","~~children~~","~~restProps~~","~~div~~","~~vertical~~","~~horizontal~~","~~space~~","s","m","~~left~~","~~center~~","~~right~~","~~role~~","~~ref~~"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;~~AA2B7C~~;;CAEC,GACD,OAAO,IAAMC,cAAc;6BACzBC,MAAAA,gCAAO,gDACPC,KAAAA,8BAAM,4CACNC,WAAAA,0CAAY,gDACZC,OAAAA,kCAAQ,OAAO,4EAA4E,~~oBAC3FC,oBAAAA,YACAC,mBAAAA,WACAC,kBAAAA,UACGC~~;~~QAPHP~~;QACAC;QACAC;QACAC~~;QACAC;QACAC;QACAC~~;;IAGA,qBACE,~~oBAACE~~;~~QACCH~~,~~WAAWP~~,~~WACTO~~,~~8BAEA;YACEI,QAAQ;YACRC,~~UAAU~~;QACZ~~,~~CAAC~~,~~CAACV,~~KAAK,~~EACPC~~,QAAQ,~~UACN~~,~~CAAA;YACEU~~,~~KAAK;YACLC~~,~~CAAC;YACDC,CAAC;QACH,CAAA,CAAC,CAACZ,~~IAAI,~~EACRC~~,~~2CACA;YACEY~~,~~IAAI;YACJC~~,~~MAAM;YACNC~~,~~KAAK;QACP,CAAC,CAACb,~~MAAM;~~QAEVc~~,MAAK;~~QACLC,KAAKd~~;~~OACDG~~,~~YAEHD;AAGP,~~EAAE"}
1	+ {"version":3,"sources":["../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { AlignType, HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './ButtonGroup.module.css';\n\nconst stylesMode = {\n vertical: styles['ButtonGroup--mode-vertical'],\n horizontal: styles['ButtonGroup--mode-horizontal'],\n};\n\nconst stylesGap = {\n space: styles['ButtonGroup--gap-space'],\n s: styles['ButtonGroup--gap-s'],\n m: styles['ButtonGroup--gap-m'],\n};\n\nconst stylesAlign = {\n left: styles['ButtonGroup--align-left'],\n center: styles['ButtonGroup--align-center'],\n right: styles['ButtonGroup--align-right'],\n};\n\nexport interface ButtonGroupProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n /*\n Задает расположение элементов внутри группы, вертикальное или горизонтальное.\n /\n mode?: 'vertical' \| 'horizontal';\n /\n Выставляет в зависимости от `mode` отступ по вертикали или горизонтали.\n /\n gap?: 'none' \| 'space' \| 's' \| 'm';\n /\n Растягивает компонент на всю ширину контейнера.\n \n Note: Для потомков соответствующее поведение нужно определять самостоятельно, где это необходимо.\n /\n stretched?: boolean;\n /\n Горизонтальное выравнивание элементов внутри группы.\n /\n align?: AlignType;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/ButtonGroup\n /\nexport const ButtonGroup = ({\n mode = 'horizontal',\n gap = 'm',\n stretched = false,\n align = 'left' / NOTE: Чтобы блоки по-умолчанию не растягивались на всю ширину контейнера */,\n ...restProps\n}: ButtonGroupProps) => {\n return (\n <RootComponent\n baseClassName={classNames(\n styles.ButtonGroup,\n stylesMode[mode],\n gap !== 'none' && stylesGap[gap],\n stretched && styles['ButtonGroup--stretched'],\n stylesAlign[align],\n )}\n role=\"group\"\n {...restProps}\n />\n );\n};\n"],"names":["React","classNames","RootComponent","stylesMode","vertical","horizontal","stylesGap","space","s","m","stylesAlign","left","center","right","ButtonGroup","mode","gap","stretched","align","restProps","baseClassName","role"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,aAAa,QAAQ,iCAAiC;AAG/D,IAAMC,aAAa;IACjBC,QAAQ;IACRC,UAAU;AACZ;AAEA,IAAMC,YAAY;IAChBC,KAAK;IACLC,CAAC;IACDC,CAAC;AACH;AAEA,IAAMC,cAAc;IAClBC,IAAI;IACJC,MAAM;IACNC,KAAK;AACP;AAuBA;;CAEC,GACD,OAAO,IAAMC,cAAc;6BACzBC,MAAAA,gCAAO,gDACPC,KAAAA,8BAAM,4CACNC,WAAAA,0CAAY,gDACZC,OAAAA,kCAAQ,OAAO,4EAA4E,oBACxFC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,qBACE,oBAAChB;QACCkB,eAAenB,8BAEbE,UAAU,CAACY,KAAK,EAChBC,QAAQ,UAAUV,SAAS,CAACU,IAAI,EAChCC,2CACAP,WAAW,CAACQ,MAAM;QAEpBG,MAAK;OACDF;AAGV,EAAE"}

package/dist/components/Calendar/Calendar.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { HasRootRef } from '../../types';
+import { HTMLAttributesWithRootRef } from '../../types';
 import { CalendarDaysProps } from '../CalendarDays/CalendarDays';
 import { CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';
 import { CalendarTimeProps } from '../CalendarTime/CalendarTime';
-export interface CalendarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, Pick<CalendarTimeProps, 'changeHoursAriaLabel' | 'changeMinutesAriaLabel'>, Pick<CalendarHeaderProps, 'prevMonthAriaLabel' | 'nextMonthAriaLabel' | 'changeMonthAriaLabel' | 'changeYearAriaLabel' | 'onNextMonth' | 'onPrevMonth' | 'prevMonthIcon' | 'nextMonthIcon' | 'prevMonthProps' | 'nextMonthProps'>, Pick<CalendarDaysProps, 'dayProps' | 'listenDayChangesForUpdate'>, HasRootRef<HTMLDivElement> {
+export interface CalendarProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>, Pick<CalendarTimeProps, 'changeHoursAriaLabel' | 'changeMinutesAriaLabel'>, Pick<CalendarHeaderProps, 'prevMonthAriaLabel' | 'nextMonthAriaLabel' | 'changeMonthAriaLabel' | 'changeYearAriaLabel' | 'onNextMonth' | 'onPrevMonth' | 'prevMonthIcon' | 'nextMonthIcon' | 'prevMonthProps' | 'nextMonthProps'>, Pick<CalendarDaysProps, 'dayProps' | 'listenDayChangesForUpdate'> {
     value?: Date;
     disablePast?: boolean;
     disableFuture?: boolean;
@@ -30,4 +30,4 @@ export interface CalendarProps extends Omit<React.HTMLAttributes<HTMLDivElement>
 /**
  * @see https://vkcom.github.io/VKUI/#/Calendar
  */
-export declare const Calendar: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, enableTime, doneButtonText, weekStartsOn, getRootRef, disablePickers, changeHoursAriaLabel, changeMinutesAriaLabel, prevMonthAriaLabel, nextMonthAriaLabel, changeMonthAriaLabel, changeYearAriaLabel, showNeighboringMonth, changeDayAriaLabel, size, viewDate: externalViewDate, onHeaderChange, onNextMonth, onPrevMonth, prevMonthIcon, nextMonthIcon, prevMonthProps, nextMonthProps, dayProps, className, listenDayChangesForUpdate, ...props }: CalendarProps) => React.JSX.Element;
+export declare const Calendar: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, enableTime, doneButtonText, weekStartsOn, disablePickers, changeHoursAriaLabel, changeMinutesAriaLabel, prevMonthAriaLabel, nextMonthAriaLabel, changeMonthAriaLabel, changeYearAriaLabel, showNeighboringMonth, changeDayAriaLabel, size, viewDate: externalViewDate, onHeaderChange, onNextMonth, onPrevMonth, prevMonthIcon, nextMonthIcon, prevMonthProps, nextMonthProps, dayProps, listenDayChangesForUpdate, ...props }: CalendarProps) => React.JSX.Element;

package/dist/components/Calendar/Calendar.js CHANGED Viewed

@@ -11,11 +11,12 @@ import { warnOnce } from "../../lib/warnOnce";
 import { CalendarDays } from "../CalendarDays/CalendarDays";
 import { CalendarHeader } from "../CalendarHeader/CalendarHeader";
 import { CalendarTime } from "../CalendarTime/CalendarTime";
+import { RootComponent } from "../RootComponent/RootComponent";
 var warn = warnOnce("Calendar");
 /**
  * @see https://vkcom.github.io/VKUI/#/Calendar
  */ export var Calendar = function(_param) {
-    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_enableTime = _param.enableTime, enableTime = _param_enableTime === void 0 ? false : _param_enableTime, doneButtonText = _param.doneButtonText, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, getRootRef = _param.getRootRef, disablePickers = _param.disablePickers, changeHoursAriaLabel = _param.changeHoursAriaLabel, changeMinutesAriaLabel = _param.changeMinutesAriaLabel, prevMonthAriaLabel = _param.prevMonthAriaLabel, nextMonthAriaLabel = _param.nextMonthAriaLabel, changeMonthAriaLabel = _param.changeMonthAriaLabel, changeYearAriaLabel = _param.changeYearAriaLabel, showNeighboringMonth = _param.showNeighboringMonth, _param_changeDayAriaLabel = _param.changeDayAriaLabel, changeDayAriaLabel = _param_changeDayAriaLabel === void 0 ? "Изменить день" : _param_changeDayAriaLabel, _param_size = _param.size, size = _param_size === void 0 ? "m" : _param_size, externalViewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, prevMonthProps = _param.prevMonthProps, nextMonthProps = _param.nextMonthProps, dayProps = _param.dayProps, className = _param.className, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, props = _object_without_properties(_param, [
+    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_enableTime = _param.enableTime, enableTime = _param_enableTime === void 0 ? false : _param_enableTime, doneButtonText = _param.doneButtonText, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, changeHoursAriaLabel = _param.changeHoursAriaLabel, changeMinutesAriaLabel = _param.changeMinutesAriaLabel, prevMonthAriaLabel = _param.prevMonthAriaLabel, nextMonthAriaLabel = _param.nextMonthAriaLabel, changeMonthAriaLabel = _param.changeMonthAriaLabel, changeYearAriaLabel = _param.changeYearAriaLabel, showNeighboringMonth = _param.showNeighboringMonth, _param_changeDayAriaLabel = _param.changeDayAriaLabel, changeDayAriaLabel = _param_changeDayAriaLabel === void 0 ? "Изменить день" : _param_changeDayAriaLabel, _param_size = _param.size, size = _param_size === void 0 ? "m" : _param_size, externalViewDate = _param.viewDate, onHeaderChange = _param.onHeaderChange, onNextMonth = _param.onNextMonth, onPrevMonth = _param.onPrevMonth, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, prevMonthProps = _param.prevMonthProps, nextMonthProps = _param.nextMonthProps, dayProps = _param.dayProps, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, props = _object_without_properties(_param, [
         "value",
         "onChange",
         "disablePast",
@@ -25,7 +26,6 @@ var warn = warnOnce("Calendar");
         "enableTime",
         "doneButtonText",
         "weekStartsOn",
-        "getRootRef",
         "disablePickers",
         "changeHoursAriaLabel",
         "changeMinutesAriaLabel",
@@ -45,7 +45,6 @@ var warn = warnOnce("Calendar");
         "prevMonthProps",
         "nextMonthProps",
         "dayProps",
-        "className",
         "listenDayChangesForUpdate"
     ]);
     var _useCalendar = useCalendar({
@@ -103,9 +102,8 @@ var warn = warnOnce("Calendar");
     }, [
         value
     ]);
-    return /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, props), {
-        ref: getRootRef,
-        className: classNames("vkuiCalendar", size === "s" && "vkuiCalendar--size-s", className)
+    return /*#__PURE__*/ React.createElement(RootComponent, _object_spread_props(_object_spread({}, props), {
+        baseClassName: classNames("vkuiCalendar", size === "s" && "vkuiCalendar--size-s")
     }), /*#__PURE__*/ React.createElement(CalendarHeader, {
         viewDate: externalViewDate || viewDate,
         onChange: setViewDate,

package/dist/components/Calendar/Calendar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HasRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { CalendarTime, CalendarTimeProps } from '../CalendarTime/CalendarTime';\nimport styles from './Calendar.module.css';\n\nexport interface CalendarProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>,\n Pick<CalendarTimeProps, 'changeHoursAriaLabel' \| 'changeMinutesAriaLabel'>,\n Pick<\n CalendarHeaderProps,\n \| 'prevMonthAriaLabel'\n \| 'nextMonthAriaLabel'\n \| 'changeMonthAriaLabel'\n \| 'changeYearAriaLabel'\n \| 'onNextMonth'\n \| 'onPrevMonth'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'prevMonthProps'\n \| 'nextMonthProps'\n >,\n Pick<CalendarDaysProps, 'dayProps' \| 'listenDayChangesForUpdate'>,\n HasRootRef<HTMLDivElement> {\n value?: Date;\n disablePast?: boolean;\n disableFuture?: boolean;\n enableTime?: boolean;\n disablePickers?: boolean;\n doneButtonText?: string;\n changeDayAriaLabel?: string;\n weekStartsOn?: 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n showNeighboringMonth?: boolean;\n size?: 's' \| 'm';\n onChange?(value?: Date): void;\n shouldDisableDate?(value: Date): boolean;\n onClose?(): void;\n /*\n Дата отображаемого месяца.\n * При использовании обновление даты должно происходить вне компонента.\n /\n viewDate?: Date;\n /\n Изменение даты в шапке календаря.\n /\n onHeaderChange?(value: Date): void;\n}\n\nconst warn = warnOnce('Calendar');\n\n/\n @see https://vkcom.github.io/VKUI/#/Calendar\n */\nexport const Calendar = ({\n value,\n onChange,\n disablePast,\n disableFuture,\n shouldDisableDate,\n onClose,\n enableTime = false,\n doneButtonText,\n weekStartsOn = 1,\n getRootRef,\n disablePickers,\n changeHoursAriaLabel,\n changeMinutesAriaLabel,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n showNeighboringMonth,\n changeDayAriaLabel = 'Изменить день',\n size = 'm',\n viewDate: externalViewDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n prevMonthIcon,\n nextMonthIcon,\n prevMonthProps,\n nextMonthProps,\n dayProps,\n className,\n listenDayChangesForUpdate,\n ...props\n}: CalendarProps) => {\n const {\n viewDate,\n setViewDate,\n setPrevMonth,\n setNextMonth,\n focusedDay,\n setFocusedDay,\n isDayFocused,\n isDayDisabled,\n resetSelectedDay,\n } = useCalendar({\n value,\n disableFuture,\n disablePast,\n shouldDisableDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n });\n\n useIsomorphicLayoutEffect(() => {\n if (value) {\n setViewDate(value);\n }\n }, [value]);\n\n if (process.env.NODE_ENV === 'development' && !disablePickers && size === 's') {\n warn(\"Нельзя включить селекты выбора месяца/года, если размер календаря 's'\", 'error');\n }\n\n if (process.env.NODE_ENV === 'development' && enableTime && size === 's') {\n warn(\"Нельзя включить выбор времени, если размер календаря 's'\", 'error');\n }\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n event.preventDefault();\n }\n\n const newFocusedDay = navigateDate(focusedDay ?? value, event.key);\n\n if (newFocusedDay && !isSameMonth(newFocusedDay, viewDate)) {\n setViewDate(newFocusedDay);\n }\n setFocusedDay(newFocusedDay);\n },\n [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n );\n\n const onDayChange = React.useCallback(\n (date: Date) => {\n onChange?.(setTimeEqual(date, value as Date \| undefined \| null));\n },\n [value, onChange],\n );\n\n const isDayActive = React.useCallback(\n (day: Date) => Boolean(value && isSameDay(day, value)),\n [value],\n );\n\n return (\n <div\n {...props}\n ref={getRootRef}\n className={classNames(\n styles['Calendar'],\n size === 's' && styles['Calendar--size-s'],\n className,\n )}\n >\n <CalendarHeader\n viewDate={externalViewDate \|\| viewDate}\n onChange={setViewDate}\n onNextMonth={setNextMonth}\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers \|\| size === 's'}\n className={styles['Calendar__header']}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n prevMonthProps={prevMonthProps}\n nextMonthProps={nextMonthProps}\n />\n <CalendarDays\n viewDate={externalViewDate \|\| viewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n isDayFocused={isDayFocused}\n tabIndex={0}\n aria-label={changeDayAriaLabel}\n onKeyDown={handleKeyDown}\n onDayChange={onDayChange}\n isDayActive={isDayActive}\n isDaySelectionStart={isFirstDay}\n isDaySelectionEnd={isLastDay}\n isDayDisabled={isDayDisabled}\n onBlur={resetSelectedDay}\n showNeighboringMonth={showNeighboringMonth}\n size={size}\n dayProps={dayProps}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n />\n {enableTime && value && size !== 's' && (\n <div className={styles['Calendar__time']}>\n <CalendarTime\n value={value}\n onChange={onChange}\n onClose={onClose}\n doneButtonText={doneButtonText}\n changeHoursAriaLabel={changeHoursAriaLabel}\n changeMinutesAriaLabel={changeMinutesAriaLabel}\n />\n </div>\n )}\n </div>\n );\n};\n"],"names":["React","classNames","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","isSameDay","isSameMonth","useIsomorphicLayoutEffect","warnOnce","CalendarDays","CalendarHeader","CalendarTime","warn","Calendar","value","onChange","disablePast","disableFuture","shouldDisableDate","onClose","enableTime","doneButtonText","weekStartsOn","getRootRef","disablePickers","changeHoursAriaLabel","changeMinutesAriaLabel","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","showNeighboringMonth","changeDayAriaLabel","size","viewDate","externalViewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","prevMonthProps","nextMonthProps","dayProps","className","listenDayChangesForUpdate","props","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","process","env","NODE_ENV","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","onDayChange","date","isDayActive","day","Boolean","div","ref","tabIndex","aria-label","onKeyDown","isDaySelectionStart","isDaySelectionEnd","onBlur"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport { isSameDay, isSameMonth } from '../../lib/date';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { CalendarTime, CalendarTimeProps } from '../CalendarTime/CalendarTime';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Calendar.module.css';\n\nexport interface CalendarProps\n extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n Pick<CalendarTimeProps, 'changeHoursAriaLabel' \| 'changeMinutesAriaLabel'>,\n Pick<\n CalendarHeaderProps,\n \| 'prevMonthAriaLabel'\n \| 'nextMonthAriaLabel'\n \| 'changeMonthAriaLabel'\n \| 'changeYearAriaLabel'\n \| 'onNextMonth'\n \| 'onPrevMonth'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'prevMonthProps'\n \| 'nextMonthProps'\n >,\n Pick<CalendarDaysProps, 'dayProps' \| 'listenDayChangesForUpdate'> {\n value?: Date;\n disablePast?: boolean;\n disableFuture?: boolean;\n enableTime?: boolean;\n disablePickers?: boolean;\n doneButtonText?: string;\n changeDayAriaLabel?: string;\n weekStartsOn?: 0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n showNeighboringMonth?: boolean;\n size?: 's' \| 'm';\n onChange?(value?: Date): void;\n shouldDisableDate?(value: Date): boolean;\n onClose?(): void;\n /*\n Дата отображаемого месяца.\n * При использовании обновление даты должно происходить вне компонента.\n /\n viewDate?: Date;\n /\n Изменение даты в шапке календаря.\n /\n onHeaderChange?(value: Date): void;\n}\n\nconst warn = warnOnce('Calendar');\n\n/\n @see https://vkcom.github.io/VKUI/#/Calendar\n */\nexport const Calendar = ({\n value,\n onChange,\n disablePast,\n disableFuture,\n shouldDisableDate,\n onClose,\n enableTime = false,\n doneButtonText,\n weekStartsOn = 1,\n disablePickers,\n changeHoursAriaLabel,\n changeMinutesAriaLabel,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n showNeighboringMonth,\n changeDayAriaLabel = 'Изменить день',\n size = 'm',\n viewDate: externalViewDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n prevMonthIcon,\n nextMonthIcon,\n prevMonthProps,\n nextMonthProps,\n dayProps,\n listenDayChangesForUpdate,\n ...props\n}: CalendarProps) => {\n const {\n viewDate,\n setViewDate,\n setPrevMonth,\n setNextMonth,\n focusedDay,\n setFocusedDay,\n isDayFocused,\n isDayDisabled,\n resetSelectedDay,\n } = useCalendar({\n value,\n disableFuture,\n disablePast,\n shouldDisableDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n });\n\n useIsomorphicLayoutEffect(() => {\n if (value) {\n setViewDate(value);\n }\n }, [value]);\n\n if (process.env.NODE_ENV === 'development' && !disablePickers && size === 's') {\n warn(\"Нельзя включить селекты выбора месяца/года, если размер календаря 's'\", 'error');\n }\n\n if (process.env.NODE_ENV === 'development' && enableTime && size === 's') {\n warn(\"Нельзя включить выбор времени, если размер календаря 's'\", 'error');\n }\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n event.preventDefault();\n }\n\n const newFocusedDay = navigateDate(focusedDay ?? value, event.key);\n\n if (newFocusedDay && !isSameMonth(newFocusedDay, viewDate)) {\n setViewDate(newFocusedDay);\n }\n setFocusedDay(newFocusedDay);\n },\n [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n );\n\n const onDayChange = React.useCallback(\n (date: Date) => {\n onChange?.(setTimeEqual(date, value as Date \| undefined \| null));\n },\n [value, onChange],\n );\n\n const isDayActive = React.useCallback(\n (day: Date) => Boolean(value && isSameDay(day, value)),\n [value],\n );\n\n return (\n <RootComponent\n {...props}\n baseClassName={classNames(styles['Calendar'], size === 's' && styles['Calendar--size-s'])}\n >\n <CalendarHeader\n viewDate={externalViewDate \|\| viewDate}\n onChange={setViewDate}\n onNextMonth={setNextMonth}\n onPrevMonth={setPrevMonth}\n disablePickers={disablePickers \|\| size === 's'}\n className={styles['Calendar__header']}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n prevMonthProps={prevMonthProps}\n nextMonthProps={nextMonthProps}\n />\n <CalendarDays\n viewDate={externalViewDate \|\| viewDate}\n value={value}\n weekStartsOn={weekStartsOn}\n isDayFocused={isDayFocused}\n tabIndex={0}\n aria-label={changeDayAriaLabel}\n onKeyDown={handleKeyDown}\n onDayChange={onDayChange}\n isDayActive={isDayActive}\n isDaySelectionStart={isFirstDay}\n isDaySelectionEnd={isLastDay}\n isDayDisabled={isDayDisabled}\n onBlur={resetSelectedDay}\n showNeighboringMonth={showNeighboringMonth}\n size={size}\n dayProps={dayProps}\n listenDayChangesForUpdate={listenDayChangesForUpdate}\n />\n {enableTime && value && size !== 's' && (\n <div className={styles['Calendar__time']}>\n <CalendarTime\n value={value}\n onChange={onChange}\n onClose={onClose}\n doneButtonText={doneButtonText}\n changeHoursAriaLabel={changeHoursAriaLabel}\n changeMinutesAriaLabel={changeMinutesAriaLabel}\n />\n </div>\n )}\n </RootComponent>\n );\n};\n"],"names":["React","classNames","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","isSameDay","isSameMonth","useIsomorphicLayoutEffect","warnOnce","CalendarDays","CalendarHeader","CalendarTime","RootComponent","warn","Calendar","value","onChange","disablePast","disableFuture","shouldDisableDate","onClose","enableTime","doneButtonText","weekStartsOn","disablePickers","changeHoursAriaLabel","changeMinutesAriaLabel","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","showNeighboringMonth","changeDayAriaLabel","size","viewDate","externalViewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","prevMonthProps","nextMonthProps","dayProps","listenDayChangesForUpdate","props","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","process","env","NODE_ENV","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","onDayChange","date","isDayActive","day","Boolean","baseClassName","className","tabIndex","aria-label","onKeyDown","isDaySelectionStart","isDaySelectionEnd","onBlur","div"],"mappings":"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"}

package/dist/components/CalendarDays/CalendarDays.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
 import * as React from 'react';
+import { HTMLAttributesWithRootRef } from '../../types';
 import { CalendarDayElementProps } from '../CalendarDay/CalendarDay';
-export interface CalendarDaysProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+export interface CalendarDaysProps extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'> {
     value?: Date | Array<Date | null>;
     viewDate: Date;
     weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
@@ -21,4 +22,4 @@ export interface CalendarDaysProps extends Omit<React.HTMLAttributes<HTMLDivElem
     onDayEnter?(value: Date): void;
     onDayLeave?(value: Date): void;
 }
-export declare const CalendarDays: ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth, dayProps, className, listenDayChangesForUpdate, ...props }: CalendarDaysProps) => React.JSX.Element;
+export declare const CalendarDays: ({ viewDate, value, weekStartsOn, onDayChange, isDaySelected, isDayActive, isDaySelectionEnd, isDaySelectionStart, onDayEnter, onDayLeave, isDayHinted, isHintedDaySelectionStart, isHintedDaySelectionEnd, isDayFocused, isDayDisabled, size, showNeighboringMonth, dayProps, listenDayChangesForUpdate, getRootRef, ...props }: CalendarDaysProps) => React.JSX.Element;