@vkontakte/vkui 6.3.1 → 6.4.1

package/src/components/Snackbar/Snackbar.tsx

@@ -49,8 +49,10 @@ export interface SnackbarProps
    * > Note: в мобильном режиме:
    * > - `"top-start"`/`"top-end"` перебивается на `"top"`, чтобы поведение было схожим с нативными
    * >   уведомлениями;
-   * > - `"bottom"`/`"bottom-end"` перебивается на "bottom-start", чтобы избежать вызова системных
+   * > - `"bottom"` перебивается на `"bottom-start"`, чтобы избежать вызова системных
    * >   функций, таких как **Pull To Refresh** и **Режим управления одной рукой**.
+   * > - `"bottom-start"`/`"bottom-end"` закрываются смахиванием в любое из направлений
+   * >   по горизонтальной оси.
    */
   placement?: SnackbarPlacement;
   /**
@@ -126,7 +128,7 @@ export const Snackbar: React.FC<SnackbarProps> & { Basic: typeof Basic } = ({
   }, []);
 
   const updateShiftAxisCSSProperties = React.useCallback(
-    (x: number | null, y: number | null) => {
+    (x: number | null, y: number | null, direction: number | null) => {
       rafRef.current = requestAnimationFrame(() => {
         if (rootRef.current) {
           x === null
@@ -135,6 +137,13 @@ export const Snackbar: React.FC<SnackbarProps> & { Basic: typeof Basic } = ({
           y === null
             ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_shift_y')
             : rootRef.current.style.setProperty('--vkui_internal--snackbar_shift_y', `${y}px`);
+          direction === null
+            ? rootRef.current.style.removeProperty('--vkui_internal--snackbar_direction')
+            : /* istanbul ignore next: TODO чтобы протестировать кейс, нужно мокать useMediaQueries(), чтобы перебивать mediaQueries.smallTabletPlus.matches */
+              rootRef.current.style.setProperty(
+                '--vkui_internal--snackbar_direction',
+                `${direction}`,
+              );
         }
       });
     },
@@ -174,7 +183,11 @@ export const Snackbar: React.FC<SnackbarProps> & { Basic: typeof Basic } = ({
       );
 
       if (shiftDataRef.current.shifted) {
-        updateShiftAxisCSSProperties(shiftDataRef.current.x, shiftDataRef.current.y);
+        updateShiftAxisCSSProperties(
+          shiftDataRef.current.x,
+          shiftDataRef.current.y,
+          shiftDataRef.current.direction,
+        );
       }
     }
   };
@@ -218,7 +231,7 @@ export const Snackbar: React.FC<SnackbarProps> & { Basic: typeof Basic } = ({
         panGestureRecognizer.current = null;
 
         if (open) {
-          updateShiftAxisCSSProperties(null, null);
+          updateShiftAxisCSSProperties(null, null, null);
         }
       }
     },

package/src/components/Snackbar/types.ts

@@ -9,6 +9,7 @@ export type SnackbarPlacement =
 export type ShiftData = {
   x: number;
   y: number;
+  direction: number | null;
   width: number;
   height: number;
   shifted: boolean;

package/src/components/Snackbar/utils.ts

@@ -30,7 +30,8 @@ export function getInitialShiftData(
 ): ShiftData {
   return {
     shifted: false,
-    isDesktop: mediaQueries.smallTabletPlus.matches, // eslint-disable-line no-restricted-properties
+    direction: null,
+    isDesktop: mediaQueries.smallTabletPlus.matches, // eslint-disable-line no-restricted-properties,
     x: 0,
     y: 0,
     width,
@@ -55,7 +56,11 @@ export function getMovedShiftData(
       shiftData.y = rubberbandIfOutOfBounds(nextShift.y, 0, shiftData.height);
     }
   } else if (placement.startsWith('bottom')) {
-    shiftData.x = rubberbandIfOutOfBounds(nextShift.x, -shiftData.width, 0);
+    shiftData.x = nextShift.x;
+
+    const movingToLeft = nextShift.x < 0 ? -1 : null;
+    const movingToRight = nextShift.x > 0 ? 1 : null;
+    shiftData.direction = movingToLeft || movingToRight;
   }
 
   if (placement.startsWith('top')) {
@@ -100,9 +105,12 @@ export function shouldBeClosedByShiftData(
         relativeClientRect.y > 0 ? velocity.y > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;
     }
   } else if (placement.startsWith('bottom')) {
-    shouldBeClosedThreshold.x = relativeClientRect.x < -relativeClientRect.width / 2;
+    shouldBeClosedThreshold.x =
+      relativeClientRect.x < -relativeClientRect.width / 2 ||
+      relativeClientRect.x > relativeClientRect.width / 2;
     shouldBeClosedByVelocity.x =
-      relativeClientRect.x < 0 ? velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE : false;
+      (relativeClientRect.x < 0 && velocity.x < -MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE) ||
+      (relativeClientRect.x > 0 && velocity.x > MINIMUM_PAN_GESTURE_FOR_TRIGGER_CLOSE);
   }
 
   if (placement.startsWith('top')) {

package/src/components/Textarea/Textarea.tsx

@@ -18,7 +18,6 @@ export interface TextareaProps
   extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onResize'>,
     HasRef<HTMLTextAreaElement>,
     HasRootRef<HTMLElement>,
-    Pick<React.CSSProperties, 'maxHeight'>,
     HasAlign,
     FormFieldProps {
   grow?: boolean;
@@ -73,11 +72,11 @@ export const Textarea = ({
       before={before}
       afterAlign={afterAlign}
       beforeAlign={beforeAlign}
+      maxHeight={maxHeight}
     >
       <UnstyledTextField
         {...restProps}
         as="textarea"
-        style={{ maxHeight }}
         rows={rows}
         className={styles['Textarea__el']}
         onChange={callMultiple(onChange, resize)}

package/src/components/Tooltip/Tooltip.tsx

@@ -55,6 +55,10 @@ export interface TooltipProps extends AllowedFloatingComponentProps, AllowedTool
    * Отключает закрытие по клику.
    */
   disableCloseAfterClick?: boolean;
+  /**
+   * Отключает появление при фокусе.
+   */
+  disableTriggerOnFocus?: boolean;
 }
 
 /**
@@ -69,6 +73,7 @@ export const Tooltip = ({
   offsetByCrossAxis = 0,
   hideWhenReferenceHidden,
   disableFlipMiddleware = false,
+  disableTriggerOnFocus = false,
 
   // useFloatingWithInteractions
   defaultShown,
@@ -131,7 +136,7 @@ export const Tooltip = ({
     shown: shownProp,
     onShownChange,
     placement: strictPlacement,
-    trigger: ['hover', 'focus'],
+    trigger: disableTriggerOnFocus ? 'hover' : ['hover', 'focus'],
     hoverDelay,
     closeAfterClick: !disableCloseAfterClick,
     disableInteractive: !enableInteractive,

package/src/index.ts

@@ -124,8 +124,11 @@ export type {
 export { ActionSheetItem } from './components/ActionSheetItem/ActionSheetItem';
 export type { ActionSheetItemProps } from './components/ActionSheetItem/ActionSheetItem';
 export { ActionSheetDefaultIosCloseItem } from './components/ActionSheet/ActionSheetDefaultIosCloseItem';
-export { ScreenSpinner } from './components/ScreenSpinner/ScreenSpinner';
-export type { ScreenSpinnerProps } from './components/ScreenSpinner/ScreenSpinner';
+export { ScreenSpinner, ScreenSpinnerContext } from './components/ScreenSpinner/ScreenSpinner';
+export type {
+  ScreenSpinnerProps,
+  ScreenSpinnerContextProps,
+} from './components/ScreenSpinner/ScreenSpinner';
 export { Snackbar } from './components/Snackbar/Snackbar';
 export type { SnackbarProps } from './components/Snackbar/Snackbar';
 export { Tooltip } from './components/Tooltip/Tooltip';

package/src/lib/animation/useCSSKeyframesAnimationController.ts

@@ -1,111 +1,95 @@
-import * as React from 'react';
+import { useState } from 'react';
 import { noop } from '@vkontakte/vkjs';
+import { usePrevious } from '../../hooks/usePrevious';
 import { useStableCallback } from '../../hooks/useStableCallback';
 import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect';
 
 export type UseCSSAnimationControllerCallback = {
-  onEnter?: () => void;
-  onEntering?: () => void;
-  onEntered?: () => void;
-  onExit?: () => void;
-  onExiting?: () => void;
-  onExited?: () => void;
+  onEnter?: VoidFunction;
+  onEntering?: VoidFunction;
+  onEntered?: VoidFunction;
+  onExit?: VoidFunction;
+  onExiting?: VoidFunction;
+  onExited?: VoidFunction;
 };
 
 export type AnimationState = 'enter' | 'entering' | 'entered' | 'exit' | 'exiting' | 'exited';
 
-export type AnimationHandlers = { onAnimationStart: () => void; onAnimationEnd: () => void };
+export type AnimationHandlers = { onAnimationStart: VoidFunction; onAnimationEnd: VoidFunction };
 
 export const useCSSKeyframesAnimationController = (
   stateProp: 'enter' | 'exit',
   {
-    onEnter: onEnterProp = noop,
-    onEntering: onEnteringProp = noop,
-    onEntered: onEnteredProp = noop,
-    onExit: onExitProp = noop,
-    onExiting: onExitingProp = noop,
-    onExited: onExitedProp = noop,
+    onEnter: onEnterProp,
+    onEntering,
+    onEntered,
+    onExit: onExitProp,
+    onExiting,
+    onExited,
   }: UseCSSAnimationControllerCallback = {},
   disableInitAnimation = false,
 ): [AnimationState, AnimationHandlers] => {
-  const isFirstInitRef = React.useRef(disableInitAnimation);
-  const [state, setState] = React.useState<AnimationState>(stateProp);
-  const [willBeEnter, setWillBeEnter] = React.useState(stateProp === 'enter');
-  const [willBeExit, setWillBeExit] = React.useState(stateProp === 'exit');
-
-  const onEnter = useStableCallback(onEnterProp);
-  const onEntering = useStableCallback(onEnteringProp);
-  const onEntered = useStableCallback(onEnteredProp);
-  const onExit = useStableCallback(onExitProp);
-  const onExiting = useStableCallback(onExitingProp);
-  const onExited = useStableCallback(onExitedProp);
-
-  const entered = React.useCallback(() => {
-    setState('entered');
-    setWillBeEnter(false);
-    onEntered();
-  }, [onEntered]);
-
-  const exited = React.useCallback(() => {
-    setState('exited');
-    setWillBeExit(false);
-    onExited();
-  }, [onExited]);
+  const [state, setState] = useState<AnimationState>(() =>
+    disableInitAnimation ? (stateProp === 'enter' ? 'entered' : 'exited') : stateProp,
+  );
+  const prevState = usePrevious(stateProp);
 
   const onAnimationStart = () => {
-    if (state === 'enter' && willBeEnter) {
+    if (state === 'enter') {
       setState('entering');
-      onEntering();
-    } else if (state === 'exit' && willBeExit) {
+      if (onEntering) {
+        onEntering();
+      }
+    } else if (state === 'exit') {
       setState('exiting');
-      onExiting();
+      if (onExiting) {
+        onExiting();
+      }
     }
   };
 
   const onAnimationEnd = () => {
-    if (state === 'entering' && willBeEnter) {
-      entered();
-    } else if (state === 'exiting' && willBeExit) {
-      exited();
+    if (state === 'entering') {
+      setState('entered');
+      if (onEntered) {
+        onEntered();
+      }
+    } else if (state === 'exiting') {
+      setState('exited');
+      if (onExited) {
+        onExited();
+      }
     }
   };
 
+  const onEnter = useStableCallback(onEnterProp || noop);
+  const onExit = useStableCallback(onExitProp || noop);
+
   useIsomorphicLayoutEffect(
     function updateState() {
+      if (prevState === stateProp) {
+        return;
+      }
       switch (stateProp) {
         case 'enter':
-          if (isFirstInitRef.current && state === 'enter') {
-            entered();
-            break;
-          }
-
-          if (willBeEnter || state === 'entering' || state === 'entered') {
+          if (state === 'entering' || state === 'entered') {
             break;
           }
 
           setState('enter');
-          setWillBeEnter(true);
           onEnter();
           break;
         case 'exit':
-          if (isFirstInitRef.current && state === 'exit') {
-            exited();
-            break;
-          }
-
-          if (willBeExit || state === 'exiting' || state === 'exited') {
+          if (state === 'exiting' || state === 'exited') {
             break;
           }
 
           setState('exit');
-          setWillBeExit(true);
           onExit();
           break;
       }
-
-      isFirstInitRef.current = false;
     },
-    [state, stateProp, willBeEnter, willBeExit, entered, exited, onEnter, onExit],
+    [state, prevState, stateProp, onEnter, onExit],
   );
 
   return [state, { onAnimationStart, onAnimationEnd }];

package/src/lib/utils.ts

@@ -1,4 +1,6 @@
 import * as React from 'react';
+import { shouldTriggerClickOnEnterOrSpace } from './accessibility';
+import { isHTMLElement } from './dom';
 
 export type ImgOnlyAttributes = {
   [index in Exclude<
@@ -7,15 +9,6 @@ export type ImgOnlyAttributes = {
   >]: React.ImgHTMLAttributes<HTMLImageElement>[index];
 };
 
-export function debounce<A extends any[]>(fn: (...args: A) => void, delay: number) {
-  let timeout: any;
-
-  return (...args: A): void => {
-    clearTimeout(timeout);
-    timeout = setTimeout(() => fn(...args), delay);
-  };
-}
-
 export function setRef<T>(element: T, ref?: React.Ref<T>): void {
   if (ref) {
     if (typeof ref === 'function') {
@@ -128,3 +121,19 @@ export function getFetchPriorityProp(value: React.ImgHTMLAttributes<HTMLElement>
   }
   return { fetchpriority: value };
 }
+
+/*
+ * [a11y]
+ * Обрабатывает событие onkeydown
+ * для кастомных доступных элементов:
+ * - role="link" (активация по Enter)
+ * - role="button" (активация по Space и Enter)
+ */
+export function clickByKeyboardHandler(event: React.KeyboardEvent<HTMLDivElement>): void {
+  if (!isHTMLElement(event.target) || !shouldTriggerClickOnEnterOrSpace(event)) {
+    return;
+  }
+
+  event.preventDefault();
+  event.target.click?.();
+}

package/dist/cjs/components/Clickable/useKeyboard.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-export declare function useKeyboard(): {
-    onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;
-};
-//# sourceMappingURL=useKeyboard.d.ts.map

package/dist/cjs/components/Clickable/useKeyboard.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useKeyboard.d.ts","sourceRoot":"","sources":["../../../../src/components/Clickable/useKeyboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,wBAAgB,WAAW,IAAI;IAC7B,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC7D,CAaA"}

package/dist/cjs/components/Clickable/useKeyboard.js

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "useKeyboard", {
-    enumerable: true,
-    get: function() {
-        return useKeyboard;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _accessibility = require("../../lib/accessibility");
-function useKeyboard() {
-    function onKeyDown(e) {
-        var // @ts-expect-error: TS2339 У элемента должен быть клик
-        _e_target_click, _e_target;
-        if (!(0, _accessibility.shouldTriggerClickOnEnterOrSpace)(e)) {
-            return;
-        }
-        e.preventDefault();
-        (_e_target_click = (_e_target = e.target).click) === null || _e_target_click === void 0 ? void 0 : _e_target_click.call(_e_target);
-    }
-    return {
-        onKeyDown
-    };
-}
-
-//# sourceMappingURL=useKeyboard.js.map

package/dist/cjs/components/Clickable/useKeyboard.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Clickable/useKeyboard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\n\n/*\n * [a11y]\n * Обрабатывает событие onkeydown\n * для кастомных доступных элементов:\n * - role=\"link\" (активация по Enter)\n * - role=\"button\" (активация по Space и Enter)\n */\nexport function useKeyboard(): {\n  onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;\n} {\n  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n    if (!shouldTriggerClickOnEnterOrSpace(e)) {\n      return;\n    }\n\n    e.preventDefault();\n\n    // @ts-expect-error: TS2339 У элемента должен быть клик\n    e.target.click?.();\n  }\n\n  return { onKeyDown };\n}\n"],"names":["useKeyboard","onKeyDown","e","shouldTriggerClickOnEnterOrSpace","preventDefault","target","click"],"mappings":";;;;+BAUgBA;;;eAAAA;;;;iEAVO;+BAC0B;AAS1C,SAASA;IAGd,SAASC,UAAUC,CAAsC;YAOvD,uDAAuD;QACvDA,iBAAAA;QAPA,IAAI,CAACC,IAAAA,+CAAgC,EAACD,IAAI;YACxC;QACF;QAEAA,EAAEE,cAAc;SAGhBF,kBAAAA,CAAAA,YAAAA,EAAEG,MAAM,EAACC,KAAK,cAAdJ,sCAAAA,qBAAAA;IACF;IAEA,OAAO;QAAED;IAAU;AACrB"}

package/dist/cjs/vkui.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./index"), exports);
-
-//# sourceMappingURL=vkui.js.map

package/dist/cjs/vkui.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/vkui.js"],"sourcesContent":["export * from './index';\n"],"names":[],"mappings":";;;;;uBAAc"}

package/dist/components/Clickable/useKeyboard.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-export declare function useKeyboard(): {
-    onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;
-};
-//# sourceMappingURL=useKeyboard.d.ts.map

package/dist/components/Clickable/useKeyboard.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useKeyboard.d.ts","sourceRoot":"","sources":["../../../src/components/Clickable/useKeyboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,wBAAgB,WAAW,IAAI;IAC7B,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC7D,CAaA"}

package/dist/components/Clickable/useKeyboard.js

@@ -1,24 +0,0 @@
-import * as React from 'react';
-import { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';
-/*
- * [a11y]
- * Обрабатывает событие onkeydown
- * для кастомных доступных элементов:
- * - role="link" (активация по Enter)
- * - role="button" (активация по Space и Enter)
- */ export function useKeyboard() {
-    function onKeyDown(e) {
-        var // @ts-expect-error: TS2339 У элемента должен быть клик
-        _e_target_click, _e_target;
-        if (!shouldTriggerClickOnEnterOrSpace(e)) {
-            return;
-        }
-        e.preventDefault();
-        (_e_target_click = (_e_target = e.target).click) === null || _e_target_click === void 0 ? void 0 : _e_target_click.call(_e_target);
-    }
-    return {
-        onKeyDown
-    };
-}
-
-//# sourceMappingURL=useKeyboard.js.map

package/dist/components/Clickable/useKeyboard.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/Clickable/useKeyboard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\n\n/*\n * [a11y]\n * Обрабатывает событие onkeydown\n * для кастомных доступных элементов:\n * - role=\"link\" (активация по Enter)\n * - role=\"button\" (активация по Space и Enter)\n */\nexport function useKeyboard(): {\n  onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;\n} {\n  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n    if (!shouldTriggerClickOnEnterOrSpace(e)) {\n      return;\n    }\n\n    e.preventDefault();\n\n    // @ts-expect-error: TS2339 У элемента должен быть клик\n    e.target.click?.();\n  }\n\n  return { onKeyDown };\n}\n"],"names":["React","shouldTriggerClickOnEnterOrSpace","useKeyboard","onKeyDown","e","preventDefault","target","click"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gCAAgC,QAAQ,0BAA0B;AAE3E;;;;;;CAMC,GACD,OAAO,SAASC;IAGd,SAASC,UAAUC,CAAsC;YAOvD,uDAAuD;QACvDA,iBAAAA;QAPA,IAAI,CAACH,iCAAiCG,IAAI;YACxC;QACF;QAEAA,EAAEC,cAAc;SAGhBD,kBAAAA,CAAAA,YAAAA,EAAEE,MAAM,EAACC,KAAK,cAAdH,sCAAAA,qBAAAA;IACF;IAEA,OAAO;QAAED;IAAU;AACrB"}

package/dist/cssm/components/Clickable/useKeyboard.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-export declare function useKeyboard(): {
-    onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;
-};
-//# sourceMappingURL=useKeyboard.d.ts.map

package/dist/cssm/components/Clickable/useKeyboard.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useKeyboard.d.ts","sourceRoot":"","sources":["../../../../src/components/Clickable/useKeyboard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,wBAAgB,WAAW,IAAI;IAC7B,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC7D,CAaA"}

package/dist/cssm/components/Clickable/useKeyboard.js

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';
-/*
- * [a11y]
- * Обрабатывает событие onkeydown
- * для кастомных доступных элементов:
- * - role="link" (активация по Enter)
- * - role="button" (активация по Space и Enter)
- */ export function useKeyboard() {
-    function onKeyDown(e) {
-        if (!shouldTriggerClickOnEnterOrSpace(e)) {
-            return;
-        }
-        e.preventDefault();
-        // @ts-expect-error: TS2339 У элемента должен быть клик
-        e.target.click?.();
-    }
-    return {
-        onKeyDown
-    };
-}
-
-//# sourceMappingURL=useKeyboard.js.map

package/dist/cssm/components/Clickable/useKeyboard.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Clickable/useKeyboard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';\n\n/*\n * [a11y]\n * Обрабатывает событие onkeydown\n * для кастомных доступных элементов:\n * - role=\"link\" (активация по Enter)\n * - role=\"button\" (активация по Space и Enter)\n */\nexport function useKeyboard(): {\n  onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;\n} {\n  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n    if (!shouldTriggerClickOnEnterOrSpace(e)) {\n      return;\n    }\n\n    e.preventDefault();\n\n    // @ts-expect-error: TS2339 У элемента должен быть клик\n    e.target.click?.();\n  }\n\n  return { onKeyDown };\n}\n"],"names":["React","shouldTriggerClickOnEnterOrSpace","useKeyboard","onKeyDown","e","preventDefault","target","click"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gCAAgC,QAAQ,0BAA0B;AAE3E;;;;;;CAMC,GACD,OAAO,SAASC;IAGd,SAASC,UAAUC,CAAsC;QACvD,IAAI,CAACH,iCAAiCG,IAAI;YACxC;QACF;QAEAA,EAAEC,cAAc;QAEhB,uDAAuD;QACvDD,EAAEE,MAAM,CAACC,KAAK;IAChB;IAEA,OAAO;QAAEJ;IAAU;AACrB"}

package/dist/cssm/vkui.js

@@ -1,3 +0,0 @@
-export * from './index';
-
-//# sourceMappingURL=vkui.js.map

package/dist/cssm/vkui.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/vkui.js"],"sourcesContent":["export * from './index';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU"}

package/dist/vkui.js

@@ -1,3 +0,0 @@
-export * from './index';
-
-//# sourceMappingURL=vkui.js.map

package/dist/vkui.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/vkui.js"],"sourcesContent":["export * from './index';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU"}

package/src/components/Clickable/useKeyboard.tsx

@@ -1,26 +0,0 @@
-import * as React from 'react';
-import { shouldTriggerClickOnEnterOrSpace } from '../../lib/accessibility';
-
-/*
- * [a11y]
- * Обрабатывает событие onkeydown
- * для кастомных доступных элементов:
- * - role="link" (активация по Enter)
- * - role="button" (активация по Space и Enter)
- */
-export function useKeyboard(): {
-  onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => void;
-} {
-  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {
-    if (!shouldTriggerClickOnEnterOrSpace(e)) {
-      return;
-    }
-
-    e.preventDefault();
-
-    // @ts-expect-error: TS2339 У элемента должен быть клик
-    e.target.click?.();
-  }
-
-  return { onKeyDown };
-}