@vkontakte/vkui 4.24.0 → 4.25.0

package/.cache/ts/src/components/View/View.d.ts

@@ -10,7 +10,7 @@ declare enum SwipeBackResults {
     success = 2
 }
 interface Scrolls {
-    [index: string]: number;
+    [index: string]: number | undefined;
 }
 interface ViewsScrolls {
     [index: string]: Scrolls;
@@ -64,17 +64,17 @@ export interface ViewProps extends React.HTMLAttributes<HTMLElement>, HasPlatfor
 export interface ViewState {
     animated: boolean;
     visiblePanels: string[];
-    activePanel: string;
-    isBack: boolean;
-    prevPanel: string;
-    nextPanel: string;
+    activePanel: string | null;
+    isBack: boolean | undefined;
+    prevPanel: string | null;
+    nextPanel: string | null;
     swipingBack: boolean;
     swipebackStartX: number;
     swipeBackShift: number;
-    swipeBackNextPanel: string;
-    swipeBackPrevPanel: string;
-    swipeBackResult: SwipeBackResults;
+    swipeBackNextPanel: string | null;
+    swipeBackPrevPanel: string | null;
+    swipeBackResult: SwipeBackResults | null;
     browserSwipe: boolean;
 }
-declare const _default: React.FC<ViewProps>;
+declare const _default: React.FC<Pick<ViewProps, "style" | "placeholder" | "title" | "hidden" | "modal" | "role" | "security" | "dir" | "nav" | "slot" | "scroll" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "unselectable" | "inputMode" | "is" | "scheme" | "popout" | "onTransition" | "activePanel" | "onSwipeBack" | "onSwipeBackStart" | "onSwipeBackCancel" | "history" | "splitCol" | "configProvider">>;
 export default _default;

package/.cache/ts/src/components/View/ViewInfinite.d.ts

@@ -10,8 +10,8 @@ declare enum SwipeBackResults {
     success = 2
 }
 export declare type TransitionParams = {
-    from: string;
-    to: string;
+    from: string | null;
+    to: string | null;
 };
 export interface ViewInfiniteProps extends React.HTMLAttributes<HTMLElement>, HasPlatform, NavIdProps {
     activePanel: string;
@@ -49,18 +49,18 @@ export interface ViewInfiniteProps extends React.HTMLAttributes<HTMLElement>, Ha
 }
 export interface ViewInfiniteState {
     animated: boolean;
-    visiblePanels: string[];
-    activePanel: string;
-    isBack: boolean;
-    prevPanel: string;
-    nextPanel: string;
+    visiblePanels: Array<string | null>;
+    activePanel: string | null;
+    isBack?: boolean;
+    prevPanel: string | null;
+    nextPanel: string | null;
     swipingBack: boolean;
     swipebackStartX: number;
     swipeBackShift: number;
-    swipeBackNextPanel: string;
-    swipeBackPrevPanel: string;
-    swipeBackResult: SwipeBackResults;
+    swipeBackNextPanel: string | null;
+    swipeBackPrevPanel: string | null;
+    swipeBackResult: SwipeBackResults | null;
     browserSwipe: boolean;
 }
-declare const _default: React.FC<ViewInfiniteProps>;
+declare const _default: React.FC<Pick<ViewInfiniteProps, "style" | "placeholder" | "title" | "hidden" | "modal" | "role" | "security" | "dir" | "nav" | "slot" | "scroll" | "color" | "translate" | "prefix" | "children" | "className" | "id" | "lang" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "unselectable" | "inputMode" | "is" | "scheme" | "popout" | "onTransition" | "activePanel" | "onSwipeBack" | "onSwipeBackStart" | "onSwipeBackCancel" | "history" | "splitCol" | "configProvider" | "isBackCheck">>;
 export default _default;

package/.cache/ts/src/components/WriteBar/WriteBar.d.ts

@@ -3,7 +3,7 @@ import { HasRef, HasRootRef } from "../../types";
 import "./WriteBar.css";
 export interface WriteBarProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, HasRootRef<HTMLDivElement>, HasRef<HTMLTextAreaElement> {
     /**
-     * Содержимое, отображаемое слево от поля ввода.
+     * Содержимое, отображаемое слева от поля ввода.
      */
     before?: React.ReactNode;
     /**

package/.cache/ts/src/helpers/getScheme.d.ts

@@ -0,0 +1,8 @@
+import { AppearanceType } from "@vkontakte/vk-bridge";
+import { PlatformType } from "../lib/platform";
+import { Scheme } from "./scheme";
+export interface GetSchemeProps {
+    platform?: PlatformType;
+    appearance: AppearanceType;
+}
+export declare function getScheme({ platform, appearance }: GetSchemeProps): Scheme;

package/.cache/ts/src/helpers/scheme.d.ts

@@ -0,0 +1,34 @@
+import { AppearanceSchemeType, AppearanceType } from "@vkontakte/vk-bridge";
+import { PlatformType } from "../lib/platform";
+export declare enum Scheme {
+    /**
+     * @deprecated будет удалено в 5.0.0
+     * версия оставлена для совместимости со старыми версиями клиентов
+     */
+    DEPRECATED_CLIENT_LIGHT = "client_light",
+    /**
+     * @deprecated будет удалено в 5.0.0
+     * версия оставлена для совместимости со старыми версиями клиентов
+     */
+    DEPRECATED_CLIENT_DARK = "client_dark",
+    /**
+     * @deprecated будет удалено в 5.0.0
+     * версия оставлена для совместимости с vkcom, когда там была только одна схема
+     */
+    VKCOM = "vkcom",
+    BRIGHT_LIGHT = "bright_light",
+    SPACE_GRAY = "space_gray",
+    VKCOM_LIGHT = "vkcom_light",
+    VKCOM_DARK = "vkcom_dark"
+}
+export declare type AppearanceScheme = AppearanceSchemeType | Scheme.VKCOM | Scheme.VKCOM_DARK | Scheme.VKCOM_LIGHT | "inherit";
+export declare enum Appearance {
+    DARK = "dark",
+    LIGHT = "light"
+}
+export interface NormalizeSchemeProps {
+    platform: PlatformType;
+    scheme?: AppearanceScheme;
+    appearance?: AppearanceType;
+}
+export declare function normalizeScheme({ platform, scheme, appearance, }: NormalizeSchemeProps): Scheme | "inherit";

package/.cache/ts/src/hoc/withAdaptivity.d.ts

@@ -1,4 +1,5 @@
-import { SizeType, ViewHeight, ViewWidth, AdaptivityProps } from "../components/AdaptivityProvider/AdaptivityContext";
+import * as React from "react";
+import { SizeType, ViewHeight, ViewWidth, AdaptivityContextInterface, AdaptivityProps, SizeProps } from "../components/AdaptivityProvider/AdaptivityContext";
 export { SizeType, ViewWidth, ViewHeight };
 export type { AdaptivityProps };
 interface Config {
@@ -9,4 +10,4 @@ interface Config {
     hasMouse?: boolean;
     deviceHasHover?: boolean;
 }
-export declare function withAdaptivity<T>(TargetComponent: T, config: Config): T;
+export declare function withAdaptivity<T extends AdaptivityProps>(TargetComponent: React.ComponentType<T>, config: Config): React.FC<Omit<T, keyof AdaptivityContextInterface> & SizeProps>;

package/.cache/ts/src/hoc/withContext.d.ts

@@ -1,2 +1,2 @@
 import * as React from "react";
-export declare function withContext<T, X>(Component: T, Ctx: React.Context<X>, prop: string): T;
+export declare function withContext<T, X>(Component: React.ComponentType<T>, Ctx: React.Context<X>, prop: string): React.FC<T>;

package/.cache/ts/src/hoc/withInsets.d.ts

@@ -1 +1,3 @@
-export declare function withInsets<T>(Component: T): T;
+/// <reference types="react" />
+import { HasInsets } from "../types";
+export declare function withInsets<T extends HasInsets>(Component: React.ComponentType<T>): React.FC<Omit<T, keyof HasInsets>>;

package/.cache/ts/src/hoc/withPlatform.d.ts

@@ -1 +1,3 @@
-export declare function withPlatform<T>(Component: T): T;
+import * as React from "react";
+import { HasPlatform } from "../types";
+export declare function withPlatform<T extends HasPlatform>(Component: React.ComponentType<T>): React.FC<Omit<T, keyof HasPlatform>>;

package/.cache/ts/src/hooks/useAdaptivity.d.ts

@@ -1,3 +1,3 @@
-import { AdaptivityProps } from "../components/AdaptivityProvider/AdaptivityContext";
+import { AdaptivityProps, AdaptivityContextInterface } from "../components/AdaptivityProvider/AdaptivityContext";
 export type { AdaptivityProps };
-export declare const useAdaptivity: () => AdaptivityProps;
+export declare const useAdaptivity: () => AdaptivityContextInterface;

package/.cache/ts/src/hooks/useAppearance.d.ts

@@ -1 +1 @@
-export declare const useAppearance: () => import("@vkontakte/vk-bridge").AppearanceType;
+export declare const useAppearance: () => "light" | "dark" | undefined;

package/.cache/ts/src/hooks/useEnsuredControl.d.ts

@@ -3,4 +3,4 @@ export declare function useEnsuredControl<V, E>(props: {
     onChange?: (e: E) => any;
 }, options: {
     defaultValue: V;
-}): [V, (e: E) => any];
+}): [V | undefined, (e: E) => any];

package/.cache/ts/src/hooks/useEventListener.d.ts

@@ -1,7 +1,7 @@
 interface EventListenerHandle {
-    add: (el: HTMLElement | Document) => void;
+    add: (el: HTMLElement | Document | Window) => void;
     remove: () => void;
 }
-export declare function useEventListener<K extends keyof GlobalEventHandlersEventMap>(event: K, _cb: (ev: GlobalEventHandlersEventMap[K]) => any, _options?: AddEventListenerOptions): EventListenerHandle;
-export declare function useEventListener(event: string, _cb: (ev: Event) => any, _options?: AddEventListenerOptions): EventListenerHandle;
+export declare function useEventListener<K extends keyof GlobalEventHandlersEventMap>(event: K, _cb: false | null | undefined | ((ev: GlobalEventHandlersEventMap[K]) => void), _options?: AddEventListenerOptions): EventListenerHandle;
+export declare function useEventListener<E extends Event>(event: string, _cb: false | null | undefined | ((ev: E) => void), _options?: AddEventListenerOptions): EventListenerHandle;
 export {};

package/.cache/ts/src/hooks/useExternRef.d.ts

@@ -1,2 +1,2 @@
 import * as React from "react";
-export declare function useExternRef<T>(...externRefs: Array<React.Ref<T>>): React.MutableRefObject<T>;
+export declare function useExternRef<T>(...externRefs: Array<React.Ref<T> | undefined | false>): React.MutableRefObject<T | null>;

package/.cache/ts/src/hooks/useFocusVisible.d.ts

@@ -1,6 +1,6 @@
 import { FocusEvent } from "react";
 export declare function useFocusVisible(): {
-    focusVisible: boolean;
+    focusVisible: boolean | undefined;
     onFocus: (event: FocusEvent<HTMLElement, Element>) => void;
     onBlur: (event: FocusEvent<HTMLElement, Element>) => void;
 };

package/.cache/ts/src/hooks/useGlobalEventListener.d.ts

@@ -1,2 +1,2 @@
-export declare function useGlobalEventListener<K extends keyof GlobalEventHandlersEventMap>(element: HTMLElement | HTMLDocument | Window, event: K, cb: false | null | ((ev: GlobalEventHandlersEventMap[K]) => any), options?: AddEventListenerOptions): void;
-export declare function useGlobalEventListener(element: HTMLElement | HTMLDocument | Window, event: string, cb: false | null | ((ev: Event) => any), options?: AddEventListenerOptions): void;
+export declare function useGlobalEventListener<K extends keyof GlobalEventHandlersEventMap>(element: Document | HTMLElement | Window | null | undefined, event: K, cb: ((ev: GlobalEventHandlersEventMap[K]) => void) | null | false | undefined, options?: AddEventListenerOptions): void;
+export declare function useGlobalEventListener<E extends Event>(element: Document | HTMLElement | Window | null | undefined, event: string, cb: ((ev: E) => void) | null | false | undefined, options?: AddEventListenerOptions): void;

package/.cache/ts/src/hooks/useInsets.d.ts

@@ -1,2 +1,8 @@
-import { Insets } from "@vkontakte/vk-bridge";
+import { Insets as BridgeInsets } from "@vkontakte/vk-bridge";
+export interface Insets {
+    bottom: BridgeInsets["bottom"] | null;
+    top: BridgeInsets["top"] | null;
+    left: BridgeInsets["left"] | null;
+    right: BridgeInsets["right"] | null;
+}
 export declare function useInsets(): Insets;

package/.cache/ts/src/hooks/usePatchChildrenRef.d.ts

@@ -2,5 +2,5 @@ import * as React from "react";
 declare type ChildrenElement<T> = React.ReactElement<{
     getRootRef?: React.Ref<T>;
 }>;
-export declare const usePatchChildrenRef: <T = HTMLElement>(children: ChildrenElement<T>) => [React.MutableRefObject<T>, ChildrenElement<T>];
+export declare const usePatchChildrenRef: <T = HTMLElement>(children?: ChildrenElement<T> | undefined) => [React.MutableRefObject<T | null>, ChildrenElement<T> | undefined];
 export {};

package/.cache/ts/src/hooks/usePlatform.d.ts

@@ -1,2 +1,2 @@
 import { PlatformType } from "../lib/platform";
-export declare function usePlatform(): PlatformType;
+export declare function usePlatform(): PlatformType | undefined;

package/.cache/ts/src/hooks/useWaitTransitionFinish.d.ts

@@ -1,3 +1,3 @@
 export declare const useWaitTransitionFinish: () => {
-    waitTransitionFinish: (element: HTMLElement, eventHandler: VoidFunction, durationFallback: number) => void;
+    waitTransitionFinish: (element: HTMLElement | null, eventHandler: VoidFunction, durationFallback: number) => void;
 };

package/.cache/ts/src/index.d.ts

@@ -222,7 +222,9 @@ export { AppRoot } from "./components/AppRoot/AppRoot";
 export { default as AdaptivityProvider } from "./components/AdaptivityProvider/AdaptivityProvider";
 export { default as ConfigProvider } from "./components/ConfigProvider/ConfigProvider";
 export type { ConfigProviderProps } from "./components/ConfigProvider/ConfigProvider";
-export { ConfigProviderContext, Appearance, Scheme, WebviewType, } from "./components/ConfigProvider/ConfigProviderContext";
+export { ConfigProviderContext, WebviewType, } from "./components/ConfigProvider/ConfigProviderContext";
+export { AppearanceProvider } from "./components/AppearanceProvider/AppearanceProvider";
+export { Scheme, Appearance } from "./helpers/scheme";
 /**
  * Advertisement
  */

package/.cache/ts/src/lib/SSR.d.ts

@@ -2,7 +2,7 @@ import * as React from "react";
 import { PlatformType } from "./platform";
 import { BrowserInfo } from "./browser";
 export interface SSRContextInterface {
-    platform: PlatformType;
+    platform: PlatformType | null;
     userAgent?: string;
     browserInfo?: BrowserInfo;
 }

package/.cache/ts/src/lib/accessibility.d.ts

@@ -6,5 +6,5 @@ export declare enum Keys {
     TAB = "Tab",
     ESCAPE = "Escape"
 }
-export declare function pressedKey(e: KeyboardEvent | React.KeyboardEvent<HTMLElement>): Keys;
+export declare function pressedKey(e: KeyboardEvent | React.KeyboardEvent<HTMLElement>): Keys | null;
 export declare function shouldTriggerClickOnEnterOrSpace(e: KeyboardEvent | React.KeyboardEvent<HTMLElement>): boolean;

package/.cache/ts/src/lib/dom.d.ts

@@ -12,10 +12,10 @@ export interface DOMContextInterface {
 }
 export declare type DOMProps = DOMContextInterface;
 export declare const getDOM: () => {
-    window: Window & typeof globalThis;
-    document: Document;
+    window: (Window & typeof globalThis) | undefined;
+    document: Document | undefined;
 };
 export declare const DOMContext: React.Context<DOMContextInterface>;
 export declare const useDOM: () => DOMContextInterface;
-export declare function withDOM<Props>(Component: React.ComponentType<Props & DOMProps>): React.FC<Props>;
+export declare function withDOM<Props>(Component: React.ComponentType<Props & DOMProps>): React.ComponentType<Props>;
 export declare function blurActiveElement(document: Document | undefined): void;

package/.cache/ts/src/lib/getNavId.d.ts

@@ -3,4 +3,4 @@ export interface NavIdProps {
     nav?: string;
     id?: string;
 }
-export declare function getNavId(props: NavIdProps, warn?: (text: string) => any): string;
+export declare function getNavId(props: NavIdProps, warn?: (text: string) => any): string | undefined;

package/.cache/ts/src/lib/jsxRuntime.d.ts

@@ -1,4 +1,8 @@
 import * as React from "react";
-export declare const createScopedElement: typeof React.createElement & {
-    Fragment: typeof React.Fragment;
-};
+declare function createScopedElement(_type: any, props?: any): React.ReactElement<{}, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)>;
+declare namespace createScopedElement {
+    var Fragment: React.ExoticComponent<{
+        children?: React.ReactNode;
+    }>;
+}
+export { createScopedElement };

package/.cache/ts/src/lib/offset.d.ts

@@ -1,7 +1,7 @@
 export interface OffsetRectInterface {
-    top: number;
-    left: number;
-    width: number;
-    height: number;
+    top: number | undefined;
+    left: number | undefined;
+    width: number | undefined;
+    height: number | undefined;
 }
-export declare function getOffsetRect(elem: HTMLElement): OffsetRectInterface;
+export declare function getOffsetRect(elem: HTMLElement | null): OffsetRectInterface;

package/.cache/ts/src/lib/prefixClass.d.ts

@@ -1 +1 @@
-export declare function prefixClass(scopedStyle?: string | string[]): string;
+export declare function prefixClass(scopedStyle: string | string[]): string;

package/.cache/ts/src/lib/select.d.ts

@@ -2,6 +2,6 @@ declare type Option = {
     label?: string;
     [index: string]: any;
 };
-declare type GetOptionLabel = (option: Option) => string;
-export declare const defaultFilterFn: (query: string, option: Option, getOptionLabel?: GetOptionLabel) => boolean;
+declare type GetOptionLabel = (option: Option) => string | undefined;
+export declare const defaultFilterFn: (query: string | undefined, option: Option, getOptionLabel?: GetOptionLabel) => boolean;
 export {};

package/.cache/ts/src/lib/styles.d.ts

@@ -1 +1 @@
-export declare function setTransformStyle(element: HTMLElement | undefined, transform: string): void;
+export declare function setTransformStyle(element: HTMLElement | undefined | null, transform: string): void;

package/.cache/ts/src/lib/supportEvents.d.ts

@@ -1,6 +1,6 @@
 export declare type VKUISupportEvents = {
     supported: boolean;
-    name?: string;
+    name?: string | null;
 };
 declare const animationEvent: {
     supported: boolean;

package/.cache/ts/src/lib/utils.d.ts

@@ -9,6 +9,6 @@ export declare function leadingZero(val: number): string;
 export declare function hasReactNode(value: React.ReactNode): boolean;
 export declare function isPrimitiveReactNode(node: React.ReactNode): boolean;
 export declare function setRef<T>(element: T, ref: React.Ref<T>): void;
-export declare function multiRef<T>(...refs: Array<React.Ref<T>>): React.RefObject<T>;
+export declare function multiRef<T>(...refs: Array<React.Ref<T> | undefined>): React.RefObject<T>;
 export declare const noop: () => void;
 export declare function getTitleFromChildren(children: React.ReactNode): string;

package/.cache/ts/src/testing/utils.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="jest" />
 import * as React from "react";
-import { AdaptivityProviderProps } from "../components/AdaptivityProvider/AdaptivityProvider";
+import { AdaptivityProps } from "../components/AdaptivityProvider/AdaptivityContext";
 import { ImgOnlyAttributes } from "../lib/utils";
 export declare function fakeTimers(): void;
 export declare const runAllTimers: () => void;
@@ -11,7 +11,7 @@ export declare type ComponentTestOptions = {
     domAttr?: boolean;
     className?: boolean;
     style?: boolean;
-    adaptivity?: AdaptivityProviderProps;
+    adaptivity?: AdaptivityProps;
 };
 declare type BasicProps = {
     style?: any;

package/.cache/ts/src/tokenized/tokenized.d.ts

@@ -0,0 +1,2 @@
+export { default as Button } from "../components/Button/Button";
+export type { ButtonProps } from "../components/Button/Button";

package/.eslintrc.json

@@ -3,7 +3,8 @@
     "@vkontakte/eslint-config/typescript/react",
     "prettier",
     "prettier/react",
-    "prettier/@typescript-eslint"
+    "prettier/@typescript-eslint",
+    "plugin:react-hooks/recommended"
   ],
   "parserOptions": {
     "project": "./tsconfig.json",
@@ -18,12 +19,13 @@
   "globals": {
     "Element": true
   },
-  "ignorePatterns": ["unstable/**/*.ts"],
+  "ignorePatterns": ["unstable/**/*.ts", "tokenized/**/*.ts"],
   "env": {
     "es6": true, // Enable global es6 variables, like Set, Map, etc
     "browser": true,
     "node": true
   },
+  "plugins": ["import"],
   "rules": {
     "@typescript-eslint/explicit-member-accessibility": "off",
     "@typescript-eslint/no-unnecessary-condition": "off",
@@ -34,6 +36,7 @@
         "ignoreRestSiblings": true
       }
     ],
+    "@typescript-eslint/no-non-null-assertion": "off",
     "no-restricted-globals": ["error", "window", "document"],
     "no-restricted-imports": [
       "error",
@@ -49,7 +52,8 @@
           "styles",
           "testing",
           "types",
-          "unstable"
+          "unstable",
+          "tokenized"
         ],
         "patterns": [
           "@vkontakte/icons/dist/*",
@@ -63,7 +67,8 @@
           "styles/*",
           "testing/*",
           "types/*",
-          "unstable/*"
+          "unstable/*",
+          "tokenized/*"
         ]
       }
     ],
@@ -114,7 +119,8 @@
         "selector": "ImportDeclaration[source.value=/\\.css$/i] ~ ImportDeclaration[source.value!=/\\.css$/i]",
         "message": "CSS import must be last"
       }
-    ]
+    ],
+    "import/no-default-export": "error"
   },
   "overrides": [
     {

package/dist/cjs/components/ActionSheet/ActionSheet.js

@@ -70,7 +70,9 @@ var ActionSheet = function ActionSheet(_ref) {
   var _action = React.useRef(_utils.noop);
 
   var afterClose = function afterClose() {
-    restProps.onClose();
+    var _restProps$onClose;
+
+    (_restProps$onClose = restProps.onClose) === null || _restProps$onClose === void 0 ? void 0 : _restProps$onClose.call(restProps);
 
     _action.current();
 
@@ -100,7 +102,7 @@ var ActionSheet = function ActionSheet(_ref) {
     } else {
       fallbackTransitionFinish.clear();
     }
-  }, [closing]);
+  }, [closing, fallbackTransitionFinish]);
   var onItemClick = React.useCallback(function (action, immediateAction, autoclose) {
     return function (event) {
       event.persist();

package/dist/cjs/components/ActionSheet/ActionSheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"names":["warn","ActionSheet","children","className","header","text","style","iosCloseItem","restProps","platform","React","useState","closing","setClosing","onClose","_action","useRef","noop","afterClose","current","process","env","NODE_ENV","viewWidth","viewHeight","hasMouse","isDesktop","ViewWidth","SMALL_TABLET","ViewHeight","MEDIUM","timeout","IOS","fallbackTransitionFinish","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoclose","event","persist","contextValue","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","actionSheet","undefined","defaultProps","popupDirection"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { ViewWidth, ViewHeight } from \"../../hoc/withAdaptivity\";\nimport { IOS } from \"../../lib/platform\";\nimport { ActionSheetDropdownDesktop } from \"./ActionSheetDropdownDesktop\";\nimport { ActionSheetDropdown } from \"./ActionSheetDropdown\";\nimport { hasReactNode, noop } from \"../../lib/utils\";\nimport { ActionSheetContext, ItemClickHandler } from \"./ActionSheetContext\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useObjectMemo } from \"../../hooks/useObjectMemo\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { SharedDropdownProps, PopupDirection, ToggleRef } from \"./types\";\nimport \"./ActionSheet.css\";\n\nexport interface ActionSheetProps extends React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи. В v5 будет обязательным.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Только iOS. В v5 будет обязательным.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\nconst warn = warnOnce(\"ActionSheet\");\n\nexport const ActionSheet: React.FC<ActionSheetProps> = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  ...restProps\n}: ActionSheetProps) => {\n  const platform = usePlatform();\n  const [closing, setClosing] = React.useState(false);\n  const onClose = () => setClosing(true);\n  const _action = React.useRef(noop);\n\n  const afterClose = () => {\n    restProps.onClose();\n    _action.current();\n    _action.current = noop;\n  };\n\n  if (process.env.NODE_ENV === \"development\" && !restProps.onClose) {\n    warn(\"can't close on outer click without onClose\");\n  }\n\n  const { viewWidth, viewHeight, hasMouse } = useAdaptivity();\n  const isDesktop =\n    viewWidth >= ViewWidth.SMALL_TABLET &&\n    (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  let timeout = platform === IOS ? 300 : 200;\n\n  if (isDesktop) {\n    timeout = 0;\n  }\n\n  const fallbackTransitionFinish = useTimeout(afterClose, timeout);\n  React.useEffect(() => {\n    if (closing) {\n      fallbackTransitionFinish.set();\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closing]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    (action, immediateAction, autoclose) => (event) => {\n      event.persist();\n      immediateAction && immediateAction(event);\n      if (autoclose) {\n        _action.current = () => action && action(event);\n        setClosing(true);\n      } else {\n        action && action(event);\n      }\n    },\n    []\n  );\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop\n    ? ActionSheetDropdownDesktop\n    : ActionSheetDropdown;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={closing}\n        timeout={timeout}\n        {...(restProps as Omit<SharedDropdownProps, \"closing\">)}\n        onClose={onClose}\n        className={isDesktop ? className : undefined}\n        style={isDesktop ? style : undefined}\n      >\n        {(hasReactNode(header) || hasReactNode(text)) && (\n          <header vkuiClass=\"ActionSheet__header\">\n            {hasReactNode(header) && (\n              <Caption\n                level=\"1\"\n                weight={platform === IOS ? \"semibold\" : \"medium\"}\n                vkuiClass=\"ActionSheet__title\"\n              >\n                {header}\n              </Caption>\n            )}\n            {hasReactNode(text) && (\n              <Caption level=\"1\" weight=\"regular\" vkuiClass=\"ActionSheet__text\">\n                {text}\n              </Caption>\n            )}\n          </header>\n        )}\n        {children}\n        {platform === IOS && !isDesktop && iosCloseItem}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  if (isDesktop) {\n    return actionSheet;\n  }\n\n  return (\n    <PopoutWrapper\n      closing={closing}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={onClose}\n      hasMask\n      fixed\n    >\n      {actionSheet}\n    </PopoutWrapper>\n  );\n};\n\nActionSheet.defaultProps = {\n  popupDirection: \"bottom\",\n};\n"],"file":"ActionSheet.js"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheet.tsx"],"names":["warn","ActionSheet","children","className","header","text","style","iosCloseItem","restProps","platform","React","useState","closing","setClosing","onClose","_action","useRef","noop","afterClose","current","process","env","NODE_ENV","viewWidth","viewHeight","hasMouse","isDesktop","ViewWidth","SMALL_TABLET","ViewHeight","MEDIUM","timeout","IOS","fallbackTransitionFinish","useEffect","set","clear","onItemClick","useCallback","action","immediateAction","autoclose","event","persist","contextValue","DropdownComponent","ActionSheetDropdownDesktop","ActionSheetDropdown","actionSheet","undefined","defaultProps","popupDirection"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { ViewWidth, ViewHeight } from \"../../hoc/withAdaptivity\";\nimport { IOS } from \"../../lib/platform\";\nimport { ActionSheetDropdownDesktop } from \"./ActionSheetDropdownDesktop\";\nimport { ActionSheetDropdown } from \"./ActionSheetDropdown\";\nimport { hasReactNode, noop } from \"../../lib/utils\";\nimport { ActionSheetContext, ItemClickHandler } from \"./ActionSheetContext\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useObjectMemo } from \"../../hooks/useObjectMemo\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { SharedDropdownProps, PopupDirection, ToggleRef } from \"./types\";\nimport \"./ActionSheet.css\";\n\nexport interface ActionSheetProps extends React.HTMLAttributes<HTMLDivElement> {\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  /**\n   * Закрыть попап по клику снаружи. В v5 будет обязательным.\n   */\n  onClose?: VoidFunction;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Только iOS. В v5 будет обязательным.\n   */\n  iosCloseItem?: React.ReactNode;\n}\n\nconst warn = warnOnce(\"ActionSheet\");\n\nexport const ActionSheet: React.FC<ActionSheetProps> = ({\n  children,\n  className,\n  header,\n  text,\n  style,\n  iosCloseItem,\n  ...restProps\n}) => {\n  const platform = usePlatform();\n  const [closing, setClosing] = React.useState(false);\n  const onClose = () => setClosing(true);\n  const _action = React.useRef(noop);\n\n  const afterClose = () => {\n    restProps.onClose?.();\n    _action.current();\n    _action.current = noop;\n  };\n\n  if (process.env.NODE_ENV === \"development\" && !restProps.onClose) {\n    warn(\"can't close on outer click without onClose\");\n  }\n\n  const { viewWidth, viewHeight, hasMouse } = useAdaptivity();\n  const isDesktop =\n    viewWidth >= ViewWidth.SMALL_TABLET &&\n    (hasMouse || viewHeight >= ViewHeight.MEDIUM);\n\n  let timeout = platform === IOS ? 300 : 200;\n\n  if (isDesktop) {\n    timeout = 0;\n  }\n\n  const fallbackTransitionFinish = useTimeout(afterClose, timeout);\n  React.useEffect(() => {\n    if (closing) {\n      fallbackTransitionFinish.set();\n    } else {\n      fallbackTransitionFinish.clear();\n    }\n  }, [closing, fallbackTransitionFinish]);\n\n  const onItemClick = React.useCallback<ItemClickHandler>(\n    (action, immediateAction, autoclose) => (event) => {\n      event.persist();\n      immediateAction && immediateAction(event);\n      if (autoclose) {\n        _action.current = () => action && action(event);\n        setClosing(true);\n      } else {\n        action && action(event);\n      }\n    },\n    []\n  );\n  const contextValue = useObjectMemo({ onItemClick, isDesktop });\n\n  const DropdownComponent = isDesktop\n    ? ActionSheetDropdownDesktop\n    : ActionSheetDropdown;\n\n  const actionSheet = (\n    <ActionSheetContext.Provider value={contextValue}>\n      <DropdownComponent\n        closing={closing}\n        timeout={timeout}\n        {...(restProps as Omit<SharedDropdownProps, \"closing\">)}\n        onClose={onClose}\n        className={isDesktop ? className : undefined}\n        style={isDesktop ? style : undefined}\n      >\n        {(hasReactNode(header) || hasReactNode(text)) && (\n          <header vkuiClass=\"ActionSheet__header\">\n            {hasReactNode(header) && (\n              <Caption\n                level=\"1\"\n                weight={platform === IOS ? \"semibold\" : \"medium\"}\n                vkuiClass=\"ActionSheet__title\"\n              >\n                {header}\n              </Caption>\n            )}\n            {hasReactNode(text) && (\n              <Caption level=\"1\" weight=\"regular\" vkuiClass=\"ActionSheet__text\">\n                {text}\n              </Caption>\n            )}\n          </header>\n        )}\n        {children}\n        {platform === IOS && !isDesktop && iosCloseItem}\n      </DropdownComponent>\n    </ActionSheetContext.Provider>\n  );\n\n  if (isDesktop) {\n    return actionSheet;\n  }\n\n  return (\n    <PopoutWrapper\n      closing={closing}\n      alignY=\"bottom\"\n      className={className}\n      style={style}\n      onClick={onClose}\n      hasMask\n      fixed\n    >\n      {actionSheet}\n    </PopoutWrapper>\n  );\n};\n\nActionSheet.defaultProps = {\n  popupDirection: \"bottom\",\n};\n"],"file":"ActionSheet.js"}

package/dist/cjs/components/ActionSheet/ActionSheetContext.d.ts

@@ -1,7 +1,8 @@
 import * as React from "react";
-export declare type ActionType = (event: React.MouseEvent) => void;
-export declare type ItemClickHandler = (action: ActionType, immediateAction: ActionType, autoclose: boolean) => (event: React.MouseEvent) => void;
-export declare const ActionSheetContext: React.Context<{
-    onItemClick?: ItemClickHandler;
+export declare type ActionType<T> = (event: React.MouseEvent<T>) => void;
+export declare type ItemClickHandler<T extends Element = Element> = (action: ActionType<T> | undefined, immediateAction: ActionType<T> | undefined, autoclose: boolean) => (event: React.MouseEvent) => void;
+export declare type ActionSheetContextType<T extends Element = Element> = {
+    onItemClick?: ItemClickHandler<T>;
     isDesktop?: boolean;
-}>;
+};
+export declare const ActionSheetContext: React.Context<ActionSheetContextType<any>>;

package/dist/cjs/components/ActionSheet/ActionSheetContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetContext.ts"],"names":["ActionSheetContext","React","createContext"],"mappings":";;;;;;;;;AAAA;;AAUO,IAAMA,kBAAkB,gBAAGC,KAAK,CAACC,aAAN,CAG/B,EAH+B,CAA3B","sourcesContent":["import * as React from \"react\";\n\nexport type ActionType = (event: React.MouseEvent) => void;\n\nexport type ItemClickHandler = (\n  action: ActionType,\n  immediateAction: ActionType,\n  autoclose: boolean\n) => (event: React.MouseEvent) => void;\n\nexport const ActionSheetContext = React.createContext<{\n  onItemClick?: ItemClickHandler;\n  isDesktop?: boolean;\n}>({});\n"],"file":"ActionSheetContext.js"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetContext.ts"],"names":["ActionSheetContext","React","createContext"],"mappings":";;;;;;;;;AAAA;;AAeO,IAAMA,kBAAkB,gBAAGC,KAAK,CAACC,aAAN,CAEhC,EAFgC,CAA3B","sourcesContent":["import * as React from \"react\";\n\nexport type ActionType<T> = (event: React.MouseEvent<T>) => void;\n\nexport type ItemClickHandler<T extends Element = Element> = (\n  action: ActionType<T> | undefined,\n  immediateAction: ActionType<T> | undefined,\n  autoclose: boolean\n) => (event: React.MouseEvent) => void;\n\nexport type ActionSheetContextType<T extends Element = Element> = {\n  onItemClick?: ItemClickHandler<T>;\n  isDesktop?: boolean;\n};\n\nexport const ActionSheetContext = React.createContext<\n  ActionSheetContextType<any>\n>({});\n"],"file":"ActionSheetContext.js"}

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js

@@ -62,7 +62,7 @@ var ActionSheetDropdownDesktop = function ActionSheetDropdownDesktop(_ref) {
   var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
       sizeY = _useAdaptivity.sizeY;
 
-  var elementRef = React.useRef();
+  var elementRef = React.useRef(null);
   (0, _useEffectDev.useEffectDev)(function () {
     var toggleEl = getEl(toggleRef);
 
@@ -77,14 +77,14 @@ var ActionSheetDropdownDesktop = function ActionSheetDropdownDesktop(_ref) {
     var dropdownElement = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current;
 
     if (dropdownElement && !dropdownElement.contains(e.target)) {
-      onClose();
+      onClose === null || onClose === void 0 ? void 0 : onClose();
     }
   });
   React.useEffect(function () {
     setTimeout(function () {
       bodyClickListener.add(document.body);
     });
-  }, []);
+  }, [bodyClickListener, document]);
   var onClick = React.useCallback(function (e) {
     return e.stopPropagation();
   }, []);