@vkontakte/vkui 5.9.0 → 5.9.2

package/dist/cjs/lib/floating/adapters.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"adapters.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/adapters.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,aAAa,EAC3B,KAAK,iBAAiB,EACtB,KAAK,eAAe,EACpB,KAAK,aAAa,EACnB,MAAM,wBAAwB,CAAC;AAYhC,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,eAAe,EACzB,MAAM,EAAE,MAAM,IAAI,EAClB,OAAO,GAAE,OAAO,CAAC,iBAAiB,CAAkB,GACnD,UAAU,CAAC,OAAO,aAAa,CAAC,CA4ClC"}
+{"version":3,"file":"adapters.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/adapters.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,aAAa,EAC3B,KAAK,iBAAiB,EACtB,KAAK,eAAe,EACpB,KAAK,aAAa,EACnB,MAAM,uCAAuC,CAAC;AAY/C,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,eAAe,EACzB,MAAM,EAAE,MAAM,IAAI,EAClB,OAAO,GAAE,OAAO,CAAC,iBAAiB,CAAkB,GACnD,UAAU,CAAC,OAAO,aAAa,CAAC,CA4ClC"}

package/dist/cjs/lib/floating/adapters.js

@@ -12,7 +12,7 @@ var _instanceof = require("@swc/helpers/_/_instanceof");
 var _object_spread = require("@swc/helpers/_/_object_spread");
 var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
 var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
-var _reactdom = require("@floating-ui/react-dom");
+var _reactdom = require("@vkontakte/vkui-floating-ui/react-dom");
 var defaultOptions = {
     ancestorScroll: true,
     ancestorResize: true,

package/dist/cjs/lib/floating/adapters.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/floating/adapters.ts"],"sourcesContent":["import {\n  autoUpdate as autoUpdateLib,\n  type AutoUpdateOptions,\n  type FloatingElement,\n  type ReferenceType,\n} from '@floating-ui/react-dom';\n\nconst defaultOptions = {\n  ancestorScroll: true,\n  ancestorResize: true,\n  // По умолчанию отключаем, т.к. навешивать `MutationObserver` может быть дорого.\n  // В `autoUpdateLib` по умолчанию опция включена. Там используется ResizeObserver, но и он не менее дорогостоящий.\n  // https://github.com/floating-ui/floating-ui/blob/0a34fe9cc2c7483976785a71bd0777cd7c3f2a6a/packages/dom/src/autoUpdate.ts#L6-L33\n  elementResize: false,\n  animationFrame: false,\n};\n\nexport function autoUpdateFloatingElement(\n  reference: ReferenceType,\n  floating: FloatingElement,\n  update: () => void,\n  options: Partial<AutoUpdateOptions> = defaultOptions,\n): ReturnType<typeof autoUpdateLib> {\n  const { elementResize = false, ...restOptions } = options;\n\n  const autoUpdateLibDisposer = autoUpdateLib(reference, floating, update, {\n    ...restOptions,\n    // Отключаем в библиотеке, т.к. под капотом используется `ResizeObserver`, которое не покрывается нашим `browserlist`.\n    // Вместо него мы используем `MutationObserver`.\n    // https://caniuse.com/resizeobserver\n    elementResize: false,\n  });\n\n  // В случае если `ResizeObserver` будет полифилиться или он будет покрываться нашим `browserlist`, то надо удалить\n  // код с `MutationObserver`.\n  let observer: MutationObserver | null = null;\n  if (elementResize) {\n    let initialUpdate = true;\n    observer = new MutationObserver(() => {\n      if (!initialUpdate) {\n        update();\n      }\n\n      initialUpdate = false;\n    });\n\n    if (reference instanceof Element) {\n      observer.observe(reference, {\n        childList: true,\n        subtree: true,\n      });\n    }\n\n    observer.observe(floating, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  return () => {\n    if (observer !== null) {\n      observer.disconnect();\n      observer = null;\n    }\n    autoUpdateLibDisposer();\n  };\n}\n"],"names":["autoUpdateFloatingElement","defaultOptions","ancestorScroll","ancestorResize","elementResize","animationFrame","reference","floating","update","options","restOptions","autoUpdateLibDisposer","autoUpdateLib","observer","initialUpdate","MutationObserver","Element","observe","childList","subtree","disconnect"],"mappings":";;;;+BAiBgBA;;;eAAAA;;;;;;;wBAZT;AAEP,IAAMC,iBAAiB;IACrBC,gBAAgB;IAChBC,gBAAgB;IAChB,gFAAgF;IAChF,kHAAkH;IAClH,iIAAiI;IACjIC,eAAe;IACfC,gBAAgB;AAClB;AAEO,SAASL,0BACdM,SAAwB,EACxBC,QAAyB,EACzBC,MAAkB;QAClBC,UAAAA,iEAAsCR;IAEtC,6BAAkDQ,QAA1CL,eAAAA,oDAAgB,gCAAUM,2CAAgBD;QAA1CL;;IAER,IAAMO,wBAAwBC,IAAAA,oBAAa,EAACN,WAAWC,UAAUC,QAAQ,4CACpEE;QACH,sHAAsH;QACtH,gDAAgD;QAChD,qCAAqC;QACrCN,eAAe;;IAGjB,kHAAkH;IAClH,4BAA4B;IAC5B,IAAIS,WAAoC;IACxC,IAAIT,eAAe;QACjB,IAAIU,gBAAgB;QACpBD,WAAW,IAAIE,iBAAiB;YAC9B,IAAI,CAACD,eAAe;gBAClBN;YACF;YAEAM,gBAAgB;QAClB;QAEA,IAAIR,AAAS,aAAYU,CAArBV,WAAqBU,UAAS;YAChCH,SAASI,OAAO,CAACX,WAAW;gBAC1BY,WAAW;gBACXC,SAAS;YACX;QACF;QAEAN,SAASI,OAAO,CAACV,UAAU;YACzBW,WAAW;YACXC,SAAS;QACX;IACF;IAEA,OAAO;QACL,IAAIN,aAAa,MAAM;YACrBA,SAASO,UAAU;YACnBP,WAAW;QACb;QACAF;IACF;AACF"}
+{"version":3,"sources":["../../../../src/lib/floating/adapters.ts"],"sourcesContent":["import {\n  autoUpdate as autoUpdateLib,\n  type AutoUpdateOptions,\n  type FloatingElement,\n  type ReferenceType,\n} from '@vkontakte/vkui-floating-ui/react-dom';\n\nconst defaultOptions = {\n  ancestorScroll: true,\n  ancestorResize: true,\n  // По умолчанию отключаем, т.к. навешивать `MutationObserver` может быть дорого.\n  // В `autoUpdateLib` по умолчанию опция включена. Там используется ResizeObserver, но и он не менее дорогостоящий.\n  // https://github.com/floating-ui/floating-ui/blob/0a34fe9cc2c7483976785a71bd0777cd7c3f2a6a/packages/dom/src/autoUpdate.ts#L6-L33\n  elementResize: false,\n  animationFrame: false,\n};\n\nexport function autoUpdateFloatingElement(\n  reference: ReferenceType,\n  floating: FloatingElement,\n  update: () => void,\n  options: Partial<AutoUpdateOptions> = defaultOptions,\n): ReturnType<typeof autoUpdateLib> {\n  const { elementResize = false, ...restOptions } = options;\n\n  const autoUpdateLibDisposer = autoUpdateLib(reference, floating, update, {\n    ...restOptions,\n    // Отключаем в библиотеке, т.к. под капотом используется `ResizeObserver`, которое не покрывается нашим `browserlist`.\n    // Вместо него мы используем `MutationObserver`.\n    // https://caniuse.com/resizeobserver\n    elementResize: false,\n  });\n\n  // В случае если `ResizeObserver` будет полифилиться или он будет покрываться нашим `browserlist`, то надо удалить\n  // код с `MutationObserver`.\n  let observer: MutationObserver | null = null;\n  if (elementResize) {\n    let initialUpdate = true;\n    observer = new MutationObserver(() => {\n      if (!initialUpdate) {\n        update();\n      }\n\n      initialUpdate = false;\n    });\n\n    if (reference instanceof Element) {\n      observer.observe(reference, {\n        childList: true,\n        subtree: true,\n      });\n    }\n\n    observer.observe(floating, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  return () => {\n    if (observer !== null) {\n      observer.disconnect();\n      observer = null;\n    }\n    autoUpdateLibDisposer();\n  };\n}\n"],"names":["autoUpdateFloatingElement","defaultOptions","ancestorScroll","ancestorResize","elementResize","animationFrame","reference","floating","update","options","restOptions","autoUpdateLibDisposer","autoUpdateLib","observer","initialUpdate","MutationObserver","Element","observe","childList","subtree","disconnect"],"mappings":";;;;+BAiBgBA;;;eAAAA;;;;;;;wBAZT;AAEP,IAAMC,iBAAiB;IACrBC,gBAAgB;IAChBC,gBAAgB;IAChB,gFAAgF;IAChF,kHAAkH;IAClH,iIAAiI;IACjIC,eAAe;IACfC,gBAAgB;AAClB;AAEO,SAASL,0BACdM,SAAwB,EACxBC,QAAyB,EACzBC,MAAkB;QAClBC,UAAAA,iEAAsCR;IAEtC,6BAAkDQ,QAA1CL,eAAAA,oDAAgB,gCAAUM,2CAAgBD;QAA1CL;;IAER,IAAMO,wBAAwBC,IAAAA,oBAAa,EAACN,WAAWC,UAAUC,QAAQ,4CACpEE;QACH,sHAAsH;QACtH,gDAAgD;QAChD,qCAAqC;QACrCN,eAAe;;IAGjB,kHAAkH;IAClH,4BAA4B;IAC5B,IAAIS,WAAoC;IACxC,IAAIT,eAAe;QACjB,IAAIU,gBAAgB;QACpBD,WAAW,IAAIE,iBAAiB;YAC9B,IAAI,CAACD,eAAe;gBAClBN;YACF;YAEAM,gBAAgB;QAClB;QAEA,IAAIR,AAAS,aAAYU,CAArBV,WAAqBU,UAAS;YAChCH,SAASI,OAAO,CAACX,WAAW;gBAC1BY,WAAW;gBACXC,SAAS;YACX;QACF;QAEAN,SAASI,OAAO,CAACV,UAAU;YACzBW,WAAW;YACXC,SAAS;QACX;IACF;IAEA,OAAO;QACL,IAAIN,aAAa,MAAM;YACrBA,SAASO,UAAU;YACnBP,WAAW;QACb;QACAF;IACF;AACF"}

package/dist/cjs/lib/floating/index.d.ts

@@ -1,4 +1,4 @@
-export { useFloating, offset as offsetMiddleware, flip as flipMiddleware, shift as shiftMiddleware, autoPlacement as autoPlacementMiddleware, arrow as arrowMiddleware, size as sizeMiddleware, hide as hideMiddleware, getOverflowAncestors, } from '@floating-ui/react-dom';
+export { useFloating, offset as offsetMiddleware, flip as flipMiddleware, shift as shiftMiddleware, autoPlacement as autoPlacementMiddleware, arrow as arrowMiddleware, size as sizeMiddleware, hide as hideMiddleware, getOverflowAncestors, } from '@vkontakte/vkui-floating-ui/react-dom';
 export type { Placement, PlacementWithAuto, AutoPlacementType, UseFloatingMiddleware, } from './types';
 export { checkIsNotAutoPlacement, getAutoPlacementAlign, convertFloatingDataToReactCSSProperties, } from './functions';
 export { autoUpdateFloatingElement } from './adapters';

package/dist/cjs/lib/floating/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,MAAM,IAAI,gBAAgB,EAC1B,IAAI,IAAI,cAAc,EACtB,KAAK,IAAI,eAAe,EACxB,aAAa,IAAI,uBAAuB,EACxC,KAAK,IAAI,eAAe,EACxB,IAAI,IAAI,cAAc,EACtB,IAAI,IAAI,cAAc,EACtB,oBAAoB,GACrB,MAAM,wBAAwB,CAAC;AAEhC,YAAY,EACV,SAAS,EACT,iBAAiB,EACjB,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,SAAS,CAAC;AAEjB,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,uCAAuC,GACxC,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,MAAM,IAAI,gBAAgB,EAC1B,IAAI,IAAI,cAAc,EACtB,KAAK,IAAI,eAAe,EACxB,aAAa,IAAI,uBAAuB,EACxC,KAAK,IAAI,eAAe,EACxB,IAAI,IAAI,cAAc,EACtB,IAAI,IAAI,cAAc,EACtB,oBAAoB,GACrB,MAAM,uCAAuC,CAAC;AAE/C,YAAY,EACV,SAAS,EACT,iBAAiB,EACjB,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,SAAS,CAAC;AAEjB,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,uCAAuC,GACxC,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC"}

package/dist/cjs/lib/floating/index.js

@@ -49,7 +49,7 @@ _export(exports, {
         return _reactdom.useFloating;
     }
 });
-var _reactdom = require("@floating-ui/react-dom");
+var _reactdom = require("@vkontakte/vkui-floating-ui/react-dom");
 var _functions = require("./functions");
 var _adapters = require("./adapters");
 

package/dist/cjs/lib/floating/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/floating/index.ts"],"sourcesContent":["export {\n  useFloating,\n  offset as offsetMiddleware,\n  flip as flipMiddleware,\n  shift as shiftMiddleware,\n  autoPlacement as autoPlacementMiddleware,\n  arrow as arrowMiddleware,\n  size as sizeMiddleware,\n  hide as hideMiddleware,\n  getOverflowAncestors,\n} from '@floating-ui/react-dom';\n\nexport type {\n  Placement,\n  PlacementWithAuto,\n  AutoPlacementType,\n  UseFloatingMiddleware,\n} from './types';\n\nexport {\n  checkIsNotAutoPlacement,\n  getAutoPlacementAlign,\n  convertFloatingDataToReactCSSProperties,\n} from './functions';\n\nexport { autoUpdateFloatingElement } from './adapters';\n"],"names":["arrowMiddleware","arrow","autoPlacementMiddleware","autoPlacement","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","flip","getAutoPlacementAlign","getOverflowAncestors","hideMiddleware","hide","offsetMiddleware","offset","shiftMiddleware","shift","sizeMiddleware","size","useFloating"],"mappings":";;;;;;;;;;;IAMWA,eAAe;eAAxBC,eAAK;;IADYC,uBAAuB;eAAxCC,uBAAa;;IAoBNC,yBAAyB;eAAzBA,mCAAyB;;IALhCC,uBAAuB;eAAvBA,kCAAuB;;IAEvBC,uCAAuC;eAAvCA,kDAAuC;;IAnB/BC,cAAc;eAAtBC,cAAI;;IAkBJC,qBAAqB;eAArBA,gCAAqB;;IAZrBC,oBAAoB;eAApBA,8BAAoB;;IADZC,cAAc;eAAtBC,cAAI;;IANMC,gBAAgB;eAA1BC,gBAAM;;IAEGC,eAAe;eAAxBC,eAAK;;IAGGC,cAAc;eAAtBC,cAAI;;IANJC,WAAW;eAAXA,qBAAW;;;wBASN;yBAaA;wBAEmC"}
+{"version":3,"sources":["../../../../src/lib/floating/index.ts"],"sourcesContent":["export {\n  useFloating,\n  offset as offsetMiddleware,\n  flip as flipMiddleware,\n  shift as shiftMiddleware,\n  autoPlacement as autoPlacementMiddleware,\n  arrow as arrowMiddleware,\n  size as sizeMiddleware,\n  hide as hideMiddleware,\n  getOverflowAncestors,\n} from '@vkontakte/vkui-floating-ui/react-dom';\n\nexport type {\n  Placement,\n  PlacementWithAuto,\n  AutoPlacementType,\n  UseFloatingMiddleware,\n} from './types';\n\nexport {\n  checkIsNotAutoPlacement,\n  getAutoPlacementAlign,\n  convertFloatingDataToReactCSSProperties,\n} from './functions';\n\nexport { autoUpdateFloatingElement } from './adapters';\n"],"names":["arrowMiddleware","arrow","autoPlacementMiddleware","autoPlacement","autoUpdateFloatingElement","checkIsNotAutoPlacement","convertFloatingDataToReactCSSProperties","flipMiddleware","flip","getAutoPlacementAlign","getOverflowAncestors","hideMiddleware","hide","offsetMiddleware","offset","shiftMiddleware","shift","sizeMiddleware","size","useFloating"],"mappings":";;;;;;;;;;;IAMWA,eAAe;eAAxBC,eAAK;;IADYC,uBAAuB;eAAxCC,uBAAa;;IAoBNC,yBAAyB;eAAzBA,mCAAyB;;IALhCC,uBAAuB;eAAvBA,kCAAuB;;IAEvBC,uCAAuC;eAAvCA,kDAAuC;;IAnB/BC,cAAc;eAAtBC,cAAI;;IAkBJC,qBAAqB;eAArBA,gCAAqB;;IAZrBC,oBAAoB;eAApBA,8BAAoB;;IADZC,cAAc;eAAtBC,cAAI;;IANMC,gBAAgB;eAA1BC,gBAAM;;IAEGC,eAAe;eAAxBC,eAAK;;IAGGC,cAAc;eAAtBC,cAAI;;IANJC,WAAW;eAAXA,qBAAW;;;wBASN;yBAaA;wBAEmC"}

package/dist/cjs/lib/floating/types.d.ts

@@ -1,5 +1,5 @@
-import type { Placement } from '@floating-ui/react-dom';
+import type { Placement } from '@vkontakte/vkui-floating-ui/react-dom';
 export type AutoPlacementType = 'auto' | 'auto-start' | 'auto-end';
 export type PlacementWithAuto = AutoPlacementType | Placement;
-export type { Placement, Middleware as UseFloatingMiddleware, UseFloatingData, Strategy as FloatingPositionStrategy, } from '@floating-ui/react-dom';
+export type { Placement, Middleware as UseFloatingMiddleware, UseFloatingData, Strategy as FloatingPositionStrategy, } from '@vkontakte/vkui-floating-ui/react-dom';
 //# sourceMappingURL=types.d.ts.map

package/dist/cjs/lib/floating/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAC;AAEnE,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,GAAG,SAAS,CAAC;AAE9D,YAAY,EACV,SAAS,EACT,UAAU,IAAI,qBAAqB,EACnC,eAAe,EACf,QAAQ,IAAI,wBAAwB,GACrC,MAAM,wBAAwB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/floating/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAEvE,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAC;AAEnE,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,GAAG,SAAS,CAAC;AAE9D,YAAY,EACV,SAAS,EACT,UAAU,IAAI,qBAAqB,EACnC,eAAe,EACf,QAAQ,IAAI,wBAAwB,GACrC,MAAM,uCAAuC,CAAC"}

package/dist/components/Alert/Alert.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute } from '../../types';
+import { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute, HasRootRef } from '../../types';
 import { ButtonProps } from '../Button/Button';
 import { AlertActionProps } from './AlertAction';
 type AlertActionMode = 'cancel' | 'destructive' | 'default';
@@ -9,7 +9,7 @@ export interface AlertActionInterface extends Pick<ButtonProps, 'Component'>, An
     autoClose?: boolean;
     mode: AlertActionMode;
 }
-export interface AlertProps extends React.HTMLAttributes<HTMLElement> {
+export interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement> {
     actionsLayout?: 'vertical' | 'horizontal';
     actionsAlign?: AlignType;
     actions?: AlertActionInterface[];
@@ -30,6 +30,6 @@ export interface AlertProps extends React.HTMLAttributes<HTMLElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/Alert
  */
-export declare const Alert: ({ actions, actionsLayout, children, className, style, text, header, onClose, dismissLabel, renderAction, actionsAlign, dismissButtonMode, ...restProps }: AlertProps) => React.JSX.Element;
+export declare const Alert: ({ actions, actionsLayout, children, className, style, text, header, onClose, dismissLabel, renderAction, actionsAlign, dismissButtonMode, getRootRef, ...restProps }: AlertProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=Alert.d.ts.map

package/dist/components/Alert/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpF,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAKjD,KAAK,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC;AAE5D,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,EACpC,wBAAwB,EACxB,gBAAgB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACnE,aAAa,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC;IAEtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC1C;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,6JAcf,UAAU,sBA6GZ,CAAC"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEhG,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAKjD,KAAK,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC;AAE5D,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,EACpC,wBAAwB,EACxB,gBAAgB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,eAAe,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC;IAC/F,aAAa,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC5D,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC;IAEtB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC1C;AAED;;GAEG;AACH,eAAO,MAAM,KAAK,yKAef,UAAU,sBAmHZ,CAAC"}

package/dist/components/Alert/Alert.js

@@ -21,7 +21,7 @@ import { AlertHeader, AlertText } from "./AlertTypography";
 /**
  * @see https://vkcom.github.io/VKUI/#/Alert
  */ export var Alert = function(_param) {
-    var _param_actions = _param.actions, actions = _param_actions === void 0 ? [] : _param_actions, _param_actionsLayout = _param.actionsLayout, actionsLayout = _param_actionsLayout === void 0 ? "horizontal" : _param_actionsLayout, children = _param.children, className = _param.className, style = _param.style, text = _param.text, header = _param.header, onClose = _param.onClose, _param_dismissLabel = _param.dismissLabel, dismissLabel = _param_dismissLabel === void 0 ? "Закрыть предупреждение" : _param_dismissLabel, renderAction = _param.renderAction, actionsAlign = _param.actionsAlign, _param_dismissButtonMode = _param.dismissButtonMode, dismissButtonMode = _param_dismissButtonMode === void 0 ? "outside" : _param_dismissButtonMode, restProps = _object_without_properties(_param, [
+    var _param_actions = _param.actions, actions = _param_actions === void 0 ? [] : _param_actions, _param_actionsLayout = _param.actionsLayout, actionsLayout = _param_actionsLayout === void 0 ? "horizontal" : _param_actionsLayout, children = _param.children, className = _param.className, style = _param.style, text = _param.text, header = _param.header, onClose = _param.onClose, _param_dismissLabel = _param.dismissLabel, dismissLabel = _param_dismissLabel === void 0 ? "Закрыть предупреждение" : _param_dismissLabel, renderAction = _param.renderAction, actionsAlign = _param.actionsAlign, _param_dismissButtonMode = _param.dismissButtonMode, dismissButtonMode = _param_dismissButtonMode === void 0 ? "outside" : _param_dismissButtonMode, getRootRef = _param.getRootRef, restProps = _object_without_properties(_param, [
         "actions",
         "actionsLayout",
         "children",
@@ -33,7 +33,8 @@ import { AlertHeader, AlertText } from "./AlertTypography";
         "dismissLabel",
         "renderAction",
         "actionsAlign",
-        "dismissButtonMode"
+        "dismissButtonMode",
+        "getRootRef"
     ]);
     var generatedId = useId();
     var headerId = "vkui-alert-".concat(generatedId, "-header");
@@ -82,7 +83,8 @@ import { AlertHeader, AlertText } from "./AlertTypography";
         className: className,
         closing: closing,
         style: style,
-        onClick: close
+        onClick: close,
+        getRootRef: getRootRef
     }, /*#__PURE__*/ React.createElement(FocusTrap, _object_spread_props(_object_spread({}, restProps), {
         getRootRef: elementRef,
         onClick: stopPropagation,

package/dist/components/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useId } from '../../hooks/useId';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useWaitTransitionFinish } from '../../hooks/useWaitTransitionFinish';\nimport { Platform } from '../../lib/platform';\nimport { stopPropagation } from '../../lib/utils';\nimport { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertHeader, AlertText } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  title: string;\n  action?: VoidFunction;\n  autoClose?: boolean;\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement> {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actionsAlign?: AlignType;\n  actions?: AlertActionInterface[];\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`\n   */\n  dismissButtonMode?: 'inside' | 'outside';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = 'horizontal',\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  ...restProps\n}: AlertProps) => {\n  const generatedId = useId();\n\n  const headerId = `vkui-alert-${generatedId}-header`;\n  const textId = `vkui-alert-${generatedId}-text`;\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n  const isDismissButtonVisible = isDesktop && platform !== Platform.IOS;\n\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const timeout = platform === Platform.IOS ? 300 : 200;\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n    waitTransitionFinish(\n      elementRef.current,\n      (e?: TransitionEvent) => {\n        if (!e || e.propertyName === 'opacity') {\n          onClose();\n        }\n      },\n      timeout,\n    );\n  }, [elementRef, waitTransitionFinish, onClose, timeout]);\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action, autoClose } = item;\n\n      if (autoClose) {\n        setClosing(true);\n        waitTransitionFinish(\n          elementRef.current,\n          (e?: TransitionEvent) => {\n            if (!e || e.propertyName === 'opacity') {\n              onClose();\n              action && action();\n            }\n          },\n          timeout,\n        );\n      } else {\n        action && action();\n      }\n    },\n    [elementRef, waitTransitionFinish, onClose, timeout],\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper className={className} closing={closing} style={style} onClick={close}>\n      <FocusTrap\n        {...restProps}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        timeout={timeout}\n        className={classNames(\n          styles['Alert'],\n          platform === Platform.IOS && styles['Alert--ios'],\n          platform === Platform.VKCOM && styles['Alert--vkcom'],\n          closing && styles['Alert--closing'],\n          isDesktop && styles['Alert--desktop'],\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={headerId}\n        aria-describedby={textId}\n      >\n        <div\n          className={classNames(\n            styles['Alert__content'],\n            dismissButtonMode === 'inside' && styles['Alert__content--withButton'],\n          )}\n        >\n          {hasReactNode(header) && <AlertHeader id={headerId}>{header}</AlertHeader>}\n          {hasReactNode(text) && <AlertText id={textId}>{text}</AlertText>}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              aria-label={dismissLabel}\n              className={classNames(styles['Alert__dismiss'], 'vkuiInternalAlert__dismiss')}\n              onClick={close}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={close} aria-label={dismissLabel} />\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","useId","usePlatform","useWaitTransitionFinish","Platform","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertHeader","AlertText","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","restProps","generatedId","headerId","textId","platform","isDesktop","waitTransitionFinish","useState","closing","setClosing","isDismissButtonVisible","IOS","elementRef","useRef","timeout","close","useCallback","current","e","propertyName","onItemClick","item","action","autoClose","onClick","getRootRef","VKCOM","role","aria-modal","aria-labelledby","aria-describedby","div","id","aria-label","hoverMode","activeMode"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20Cancel } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useId } from '../../hooks/useId';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useWaitTransitionFinish } from '../../hooks/useWaitTransitionFinish';\nimport { Platform } from '../../lib/platform';\nimport { stopPropagation } from '../../lib/utils';\nimport { AlignType, AnchorHTMLAttributesOnly, HasDataAttribute, HasRootRef } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ButtonProps } from '../Button/Button';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ModalDismissButton } from '../ModalDismissButton/ModalDismissButton';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { AlertActionProps } from './AlertAction';\nimport { AlertActions } from './AlertActions';\nimport { AlertHeader, AlertText } from './AlertTypography';\nimport styles from './Alert.module.css';\n\ntype AlertActionMode = 'cancel' | 'destructive' | 'default';\n\nexport interface AlertActionInterface\n  extends Pick<ButtonProps, 'Component'>,\n    AnchorHTMLAttributesOnly,\n    HasDataAttribute {\n  title: string;\n  action?: VoidFunction;\n  autoClose?: boolean;\n  mode: AlertActionMode;\n}\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLElement>, HasRootRef<HTMLDivElement> {\n  actionsLayout?: 'vertical' | 'horizontal';\n  actionsAlign?: AlignType;\n  actions?: AlertActionInterface[];\n  renderAction?: (props: AlertActionProps) => React.ReactNode;\n  header?: React.ReactNode;\n  text?: React.ReactNode;\n  onClose: VoidFunction;\n\n  /**\n   * `aria-label` для кнопки закрытия. Необходим, чтобы кнопка была доступной.\n   */\n  dismissLabel?: string;\n  /**\n   * Расположение кнопки закрытия (внутри и вне `popout'a`)\n   * Доступно только в `compact`-режиме, не отображается на `iOS`\n   */\n  dismissButtonMode?: 'inside' | 'outside';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Alert\n */\nexport const Alert = ({\n  actions = [],\n  actionsLayout = 'horizontal',\n  children,\n  className,\n  style,\n  text,\n  header,\n  onClose,\n  dismissLabel = 'Закрыть предупреждение',\n  renderAction,\n  actionsAlign,\n  dismissButtonMode = 'outside',\n  getRootRef,\n  ...restProps\n}: AlertProps) => {\n  const generatedId = useId();\n\n  const headerId = `vkui-alert-${generatedId}-header`;\n  const textId = `vkui-alert-${generatedId}-text`;\n\n  const platform = usePlatform();\n  const { isDesktop } = useAdaptivityWithJSMediaQueries();\n  const { waitTransitionFinish } = useWaitTransitionFinish();\n\n  const [closing, setClosing] = React.useState(false);\n  const isDismissButtonVisible = isDesktop && platform !== Platform.IOS;\n\n  const elementRef = React.useRef<HTMLDivElement>(null);\n\n  const timeout = platform === Platform.IOS ? 300 : 200;\n\n  const close = React.useCallback(() => {\n    setClosing(true);\n    waitTransitionFinish(\n      elementRef.current,\n      (e?: TransitionEvent) => {\n        if (!e || e.propertyName === 'opacity') {\n          onClose();\n        }\n      },\n      timeout,\n    );\n  }, [elementRef, waitTransitionFinish, onClose, timeout]);\n\n  const onItemClick = React.useCallback(\n    (item: AlertActionInterface) => {\n      const { action, autoClose } = item;\n\n      if (autoClose) {\n        setClosing(true);\n        waitTransitionFinish(\n          elementRef.current,\n          (e?: TransitionEvent) => {\n            if (!e || e.propertyName === 'opacity') {\n              onClose();\n              action && action();\n            }\n          },\n          timeout,\n        );\n      } else {\n        action && action();\n      }\n    },\n    [elementRef, waitTransitionFinish, onClose, timeout],\n  );\n\n  useScrollLock();\n\n  return (\n    <PopoutWrapper\n      className={className}\n      closing={closing}\n      style={style}\n      onClick={close}\n      getRootRef={getRootRef}\n    >\n      <FocusTrap\n        {...restProps}\n        getRootRef={elementRef}\n        onClick={stopPropagation}\n        onClose={close}\n        timeout={timeout}\n        className={classNames(\n          styles['Alert'],\n          platform === Platform.IOS && styles['Alert--ios'],\n          platform === Platform.VKCOM && styles['Alert--vkcom'],\n          closing && styles['Alert--closing'],\n          isDesktop && styles['Alert--desktop'],\n        )}\n        role=\"alertdialog\"\n        aria-modal\n        aria-labelledby={headerId}\n        aria-describedby={textId}\n      >\n        <div\n          className={classNames(\n            styles['Alert__content'],\n            dismissButtonMode === 'inside' && styles['Alert__content--withButton'],\n          )}\n        >\n          {hasReactNode(header) && <AlertHeader id={headerId}>{header}</AlertHeader>}\n          {hasReactNode(text) && <AlertText id={textId}>{text}</AlertText>}\n          {children}\n          {isDismissButtonVisible && dismissButtonMode === 'inside' && (\n            <IconButton\n              aria-label={dismissLabel}\n              className={classNames(styles['Alert__dismiss'], 'vkuiInternalAlert__dismiss')}\n              onClick={close}\n              hoverMode=\"opacity\"\n              activeMode=\"opacity\"\n            >\n              <Icon20Cancel />\n            </IconButton>\n          )}\n        </div>\n        <AlertActions\n          actions={actions}\n          actionsAlign={actionsAlign}\n          actionsLayout={actionsLayout}\n          renderAction={renderAction}\n          onItemClick={onItemClick}\n        />\n        {isDismissButtonVisible && dismissButtonMode === 'outside' && (\n          <ModalDismissButton onClick={close} aria-label={dismissLabel} />\n        )}\n      </FocusTrap>\n    </PopoutWrapper>\n  );\n};\n"],"names":["React","Icon20Cancel","classNames","hasReactNode","useAdaptivityWithJSMediaQueries","useId","usePlatform","useWaitTransitionFinish","Platform","stopPropagation","useScrollLock","FocusTrap","IconButton","ModalDismissButton","PopoutWrapper","AlertActions","AlertHeader","AlertText","Alert","actions","actionsLayout","children","className","style","text","header","onClose","dismissLabel","renderAction","actionsAlign","dismissButtonMode","getRootRef","restProps","generatedId","headerId","textId","platform","isDesktop","waitTransitionFinish","useState","closing","setClosing","isDismissButtonVisible","IOS","elementRef","useRef","timeout","close","useCallback","current","e","propertyName","onItemClick","item","action","autoClose","onClick","VKCOM","role","aria-modal","aria-labelledby","aria-describedby","div","id","aria-label","hoverMode","activeMode"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,+BAA+B,QAAQ,8CAA8C;AAC9F,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,uBAAuB,QAAQ,sCAAsC;AAC9E,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,eAAe,QAAQ,kBAAkB;AAElD,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,SAAS,QAAQ,yBAAyB;AACnD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,kBAAkB,QAAQ,2CAA2C;AAC9E,SAASC,aAAa,QAAQ,iCAAiC;AAE/D,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,WAAW,EAAEC,SAAS,QAAQ,oBAAoB;AAmC3D;;CAEC,GACD,OAAO,IAAMC,QAAQ;gCACnBC,SAAAA,sCAAU,EAAE,iDACZC,eAAAA,kDAAgB,qCAChBC,kBAAAA,UACAC,mBAAAA,WACAC,eAAAA,OACAC,cAAAA,MACAC,gBAAAA,QACAC,iBAAAA,sCACAC,cAAAA,gDAAe,gDACfC,sBAAAA,cACAC,sBAAAA,gDACAC,mBAAAA,0DAAoB,sCACpBC,oBAAAA,YACGC;QAbHb;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,cAAc5B;IAEpB,IAAM6B,WAAW,AAAC,cAAyB,OAAZD,aAAY;IAC3C,IAAME,SAAS,AAAC,cAAyB,OAAZF,aAAY;IAEzC,IAAMG,WAAW9B;IACjB,IAAM,AAAE+B,YAAcjC,kCAAdiC;IACR,IAAM,AAAEC,uBAAyB/B,0BAAzB+B;IAER,IAA8BtC,mCAAAA,MAAMuC,QAAQ,CAAC,YAAtCC,UAAuBxC,oBAAdyC,aAAczC;IAC9B,IAAM0C,yBAAyBL,aAAaD,aAAa5B,SAASmC,GAAG;IAErE,IAAMC,aAAa5C,MAAM6C,MAAM,CAAiB;IAEhD,IAAMC,UAAUV,aAAa5B,SAASmC,GAAG,GAAG,MAAM;IAElD,IAAMI,QAAQ/C,MAAMgD,WAAW,CAAC;QAC9BP,WAAW;QACXH,qBACEM,WAAWK,OAAO,EAClB,SAACC;YACC,IAAI,CAACA,KAAKA,EAAEC,YAAY,KAAK,WAAW;gBACtCzB;YACF;QACF,GACAoB;IAEJ,GAAG;QAACF;QAAYN;QAAsBZ;QAASoB;KAAQ;IAEvD,IAAMM,cAAcpD,MAAMgD,WAAW,CACnC,SAACK;QACC,IAAQC,SAAsBD,KAAtBC,QAAQC,YAAcF,KAAdE;QAEhB,IAAIA,WAAW;YACbd,WAAW;YACXH,qBACEM,WAAWK,OAAO,EAClB,SAACC;gBACC,IAAI,CAACA,KAAKA,EAAEC,YAAY,KAAK,WAAW;oBACtCzB;oBACA4B,UAAUA;gBACZ;YACF,GACAR;QAEJ,OAAO;YACLQ,UAAUA;QACZ;IACF,GACA;QAACV;QAAYN;QAAsBZ;QAASoB;KAAQ;IAGtDpC;IAEA,qBACE,oBAACI;QACCQ,WAAWA;QACXkB,SAASA;QACTjB,OAAOA;QACPiC,SAAST;QACThB,YAAYA;qBAEZ,oBAACpB,mDACKqB;QACJD,YAAYa;QACZY,SAAS/C;QACTiB,SAASqB;QACTD,SAASA;QACTxB,WAAWpB,wBAETkC,aAAa5B,SAASmC,GAAG,sBACzBP,aAAa5B,SAASiD,KAAK,wBAC3BjB,iCACAH;QAEFqB,MAAK;QACLC,cAAAA;QACAC,mBAAiB1B;QACjB2B,oBAAkB1B;sBAElB,oBAAC2B;QACCxC,WAAWpB,iCAET4B,sBAAsB;OAGvB3B,aAAasB,yBAAW,oBAACT;QAAY+C,IAAI7B;OAAWT,SACpDtB,aAAaqB,uBAAS,oBAACP;QAAU8C,IAAI5B;OAASX,OAC9CH,UACAqB,0BAA0BZ,sBAAsB,0BAC/C,oBAAClB;QACCoD,cAAYrC;QACZL,WAAWpB,iCAAqC;QAChDsD,SAAST;QACTkB,WAAU;QACVC,YAAW;qBAEX,oBAACjE,qCAIP,oBAACc;QACCI,SAASA;QACTU,cAAcA;QACdT,eAAeA;QACfQ,cAAcA;QACdwB,aAAaA;QAEdV,0BAA0BZ,sBAAsB,2BAC/C,oBAACjB;QAAmB2C,SAAST;QAAOiB,cAAYrC;;AAK1D,EAAE"}

package/dist/components/CalendarRange/CalendarRange.d.ts

@@ -16,5 +16,5 @@ export interface CalendarRangeProps extends Omit<HTMLAttributesWithRootRef<HTMLD
 /**
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
  */
-export declare const CalendarRange: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn, getRootRef, disablePickers, prevMonthAriaLabel, nextMonthAriaLabel, changeMonthAriaLabel, changeYearAriaLabel, changeDayAriaLabel, prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, ...props }: CalendarRangeProps) => React.JSX.Element;
+export declare const CalendarRange: ({ value, onChange, disablePast, disableFuture, shouldDisableDate, onClose, weekStartsOn, disablePickers, prevMonthAriaLabel, nextMonthAriaLabel, changeMonthAriaLabel, changeYearAriaLabel, changeDayAriaLabel, prevMonthIcon, nextMonthIcon, listenDayChangesForUpdate, ...props }: CalendarRangeProps) => React.JSX.Element;
 //# sourceMappingURL=CalendarRange.d.ts.map

package/dist/components/CalendarRange/CalendarRange.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAgB,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAIvF,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,oBAAoB,GACpB,oBAAoB,GACpB,sBAAsB,GACtB,qBAAqB,GACrB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,CAAC;IACtD,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAC5C,iBAAiB,CAAC,CAAC,KAAK,EAAE,IAAI,GAAG,OAAO,CAAC;IACzC,OAAO,CAAC,IAAI,IAAI,CAAC;CAClB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,oSAmBvB,kBAAkB,sBAwLpB,CAAC"}
+{"version":3,"file":"CalendarRange.d.ts","sourceRoot":"","sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAgB,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAIvF,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EACjE,IAAI,CACF,mBAAmB,EACjB,oBAAoB,GACpB,oBAAoB,GACpB,sBAAsB,GACtB,qBAAqB,GACrB,eAAe,GACf,eAAe,CAClB,EACD,IAAI,CAAC,iBAAiB,EAAE,2BAA2B,CAAC;IACtD,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACzC,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAC5C,iBAAiB,CAAC,CAAC,KAAK,EAAE,IAAI,GAAG,OAAO,CAAC;IACzC,OAAO,CAAC,IAAI,IAAI,CAAC;CAClB;AAUD;;GAEG;AACH,eAAO,MAAM,aAAa,wRAkBvB,kBAAkB,sBAwLpB,CAAC"}

package/dist/components/CalendarRange/CalendarRange.js

@@ -18,7 +18,7 @@ var getIsDaySelected = function(day, value) {
 /**
  * @see https://vkcom.github.io/VKUI/#/CalendarRange
  */ export var CalendarRange = function(_param) {
-    var value = _param.value, onChange = _param.onChange, disablePast = _param.disablePast, disableFuture = _param.disableFuture, shouldDisableDate = _param.shouldDisableDate, onClose = _param.onClose, _param_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, getRootRef = _param.getRootRef, disablePickers = _param.disablePickers, prevMonthAriaLabel = _param.prevMonthAriaLabel, nextMonthAriaLabel = _param.nextMonthAriaLabel, changeMonthAriaLabel = _param.changeMonthAriaLabel, changeYearAriaLabel = _param.changeYearAriaLabel, _param_changeDayAriaLabel = _param.changeDayAriaLabel, changeDayAriaLabel = _param_changeDayAriaLabel === void 0 ? "Изменить день" : _param_changeDayAriaLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, 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_weekStartsOn = _param.weekStartsOn, weekStartsOn = _param_weekStartsOn === void 0 ? 1 : _param_weekStartsOn, disablePickers = _param.disablePickers, prevMonthAriaLabel = _param.prevMonthAriaLabel, nextMonthAriaLabel = _param.nextMonthAriaLabel, changeMonthAriaLabel = _param.changeMonthAriaLabel, changeYearAriaLabel = _param.changeYearAriaLabel, _param_changeDayAriaLabel = _param.changeDayAriaLabel, changeDayAriaLabel = _param_changeDayAriaLabel === void 0 ? "Изменить день" : _param_changeDayAriaLabel, prevMonthIcon = _param.prevMonthIcon, nextMonthIcon = _param.nextMonthIcon, listenDayChangesForUpdate = _param.listenDayChangesForUpdate, props = _object_without_properties(_param, [
         "value",
         "onChange",
         "disablePast",
@@ -26,7 +26,6 @@ var getIsDaySelected = function(day, value) {
         "shouldDisableDate",
         "onClose",
         "weekStartsOn",
-        "getRootRef",
         "disablePickers",
         "prevMonthAriaLabel",
         "nextMonthAriaLabel",

package/dist/components/CalendarRange/CalendarRange.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport {\n  addMonths,\n  endOfDay,\n  isAfter,\n  isBefore,\n  isSameDay,\n  isSameMonth,\n  isWithinInterval,\n  startOfDay,\n} from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport interface CalendarRangeProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n    Pick<\n      CalendarHeaderProps,\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    Pick<CalendarDaysProps, 'listenDayChangesForUpdate'> {\n  value?: Array<Date | null>;\n  disablePast?: boolean;\n  disableFuture?: boolean;\n  disablePickers?: boolean;\n  changeDayAriaLabel?: string;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  onChange?(value?: Array<Date | null>): void;\n  shouldDisableDate?(value: Date): boolean;\n  onClose?(): void;\n}\n\nconst getIsDaySelected = (day: Date, value?: Array<Date | null>) => {\n  if (!value?.[0] || !value[1]) {\n    return false;\n  }\n\n  return Boolean(isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1])));\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n  value,\n  onChange,\n  disablePast,\n  disableFuture,\n  shouldDisableDate,\n  onClose,\n  weekStartsOn = 1,\n  getRootRef,\n  disablePickers,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeDayAriaLabel = 'Изменить день',\n  prevMonthIcon,\n  nextMonthIcon,\n  listenDayChangesForUpdate,\n  ...props\n}: CalendarRangeProps) => {\n  const {\n    viewDate,\n    setViewDate,\n    setPrevMonth,\n    setNextMonth,\n    focusedDay,\n    setFocusedDay,\n    isDayFocused,\n    isDayDisabled,\n    resetSelectedDay,\n  } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n  const [hintedDate, setHintedDate] = React.useState<Array<Date | null>>();\n  const secondViewDate = addMonths(viewDate, 1);\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n        event.preventDefault();\n      }\n\n      const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n      if (\n        newFocusedDay &&\n        !isSameMonth(newFocusedDay, viewDate) &&\n        !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n      ) {\n        setViewDate(newFocusedDay);\n      }\n      setFocusedDay(newFocusedDay);\n    },\n    [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n  );\n\n  const getNewValue = React.useCallback(\n    (date: Date) => {\n      if (!value) {\n        return [date, null];\n      }\n\n      const start = value[0];\n      const end = value[1];\n      if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n        return [setTimeEqual(date, start), setTimeEqual(date, end)];\n      } else if (start && isBefore(date, start)) {\n        return [setTimeEqual(date, start), end];\n      } else if (start && isAfter(date, start)) {\n        return [start, setTimeEqual(date, end)];\n      }\n\n      return value;\n    },\n    [value],\n  );\n\n  const onDayChange = React.useCallback(\n    (date: Date) => {\n      onChange?.(getNewValue(date));\n      setHintedDate(undefined);\n    },\n    [onChange, getNewValue],\n  );\n\n  const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n  const isDayActive = React.useCallback(\n    (day: Date) =>\n      Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isHintedDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n    [hintedDate],\n  );\n\n  const isDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n    [value],\n  );\n\n  const isHintedDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n    [hintedDate],\n  );\n\n  const onDayEnter = React.useCallback(\n    (date: Date) => setHintedDate(getNewValue(date)),\n    [setHintedDate, getNewValue],\n  );\n\n  const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n  const isDayHinted = React.useCallback(\n    (day: Date) => getIsDaySelected(day, hintedDate),\n    [hintedDate],\n  );\n\n  return (\n    <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={viewDate}\n          onChange={setViewDate}\n          nextMonth={false}\n          onPrevMonth={setPrevMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          prevMonthIcon={prevMonthIcon}\n        />\n        <CalendarDays\n          viewDate={viewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          aria-label={changeDayAriaLabel}\n        />\n      </div>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={secondViewDate}\n          onChange={setViewDate}\n          prevMonth={false}\n          onNextMonth={setNextMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          nextMonthIcon={nextMonthIcon}\n        />\n        <CalendarDays\n          viewDate={secondViewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          aria-label={changeDayAriaLabel}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          tabIndex={0}\n          onBlur={resetSelectedDay}\n        />\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","CalendarDays","CalendarHeader","RootComponent","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","getRootRef","disablePickers","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","useState","hintedDate","setHintedDate","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","baseClassName","div","className","nextMonth","onPrevMonth","onKeyDown","aria-label","prevMonth","onNextMonth","tabIndex","onBlur"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCalendar } from '../../hooks/useCalendar';\nimport { isFirstDay, isLastDay, navigateDate, setTimeEqual } from '../../lib/calendar';\nimport {\n  addMonths,\n  endOfDay,\n  isAfter,\n  isBefore,\n  isSameDay,\n  isSameMonth,\n  isWithinInterval,\n  startOfDay,\n} from '../../lib/date';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CalendarDays, CalendarDaysProps } from '../CalendarDays/CalendarDays';\nimport { CalendarHeader, CalendarHeaderProps } from '../CalendarHeader/CalendarHeader';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './CalendarRange.module.css';\n\nexport interface CalendarRangeProps\n  extends Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'onChange'>,\n    Pick<\n      CalendarHeaderProps,\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    Pick<CalendarDaysProps, 'listenDayChangesForUpdate'> {\n  value?: Array<Date | null>;\n  disablePast?: boolean;\n  disableFuture?: boolean;\n  disablePickers?: boolean;\n  changeDayAriaLabel?: string;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  onChange?(value?: Array<Date | null>): void;\n  shouldDisableDate?(value: Date): boolean;\n  onClose?(): void;\n}\n\nconst getIsDaySelected = (day: Date, value?: Array<Date | null>) => {\n  if (!value?.[0] || !value[1]) {\n    return false;\n  }\n\n  return Boolean(isWithinInterval(day, startOfDay(value[0]), endOfDay(value[1])));\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/CalendarRange\n */\nexport const CalendarRange = ({\n  value,\n  onChange,\n  disablePast,\n  disableFuture,\n  shouldDisableDate,\n  onClose,\n  weekStartsOn = 1,\n  disablePickers,\n  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeDayAriaLabel = 'Изменить день',\n  prevMonthIcon,\n  nextMonthIcon,\n  listenDayChangesForUpdate,\n  ...props\n}: CalendarRangeProps) => {\n  const {\n    viewDate,\n    setViewDate,\n    setPrevMonth,\n    setNextMonth,\n    focusedDay,\n    setFocusedDay,\n    isDayFocused,\n    isDayDisabled,\n    resetSelectedDay,\n  } = useCalendar({ value, disableFuture, disablePast, shouldDisableDate });\n  const [hintedDate, setHintedDate] = React.useState<Array<Date | null>>();\n  const secondViewDate = addMonths(viewDate, 1);\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent) => {\n      if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) {\n        event.preventDefault();\n      }\n\n      const newFocusedDay = navigateDate(focusedDay ?? value?.[1], event.key);\n\n      if (\n        newFocusedDay &&\n        !isSameMonth(newFocusedDay, viewDate) &&\n        !isSameMonth(newFocusedDay, addMonths(viewDate, 1))\n      ) {\n        setViewDate(newFocusedDay);\n      }\n      setFocusedDay(newFocusedDay);\n    },\n    [focusedDay, setFocusedDay, setViewDate, value, viewDate],\n  );\n\n  const getNewValue = React.useCallback(\n    (date: Date) => {\n      if (!value) {\n        return [date, null];\n      }\n\n      const start = value[0];\n      const end = value[1];\n      if ((start && isSameDay(date, start)) || (end && isSameDay(date, end))) {\n        return [setTimeEqual(date, start), setTimeEqual(date, end)];\n      } else if (start && isBefore(date, start)) {\n        return [setTimeEqual(date, start), end];\n      } else if (start && isAfter(date, start)) {\n        return [start, setTimeEqual(date, end)];\n      }\n\n      return value;\n    },\n    [value],\n  );\n\n  const onDayChange = React.useCallback(\n    (date: Date) => {\n      onChange?.(getNewValue(date));\n      setHintedDate(undefined);\n    },\n    [onChange, getNewValue],\n  );\n\n  const isDaySelected = React.useCallback((day: Date) => getIsDaySelected(day, value), [value]);\n\n  const isDayActive = React.useCallback(\n    (day: Date) =>\n      Boolean((value?.[0] && isSameDay(day, value[0])) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (value?.[1] && isSameDay(day, value[1]))),\n    [value],\n  );\n\n  const isHintedDaySelectionEnd = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isLastDay(day, dayOfWeek) || (hintedDate?.[1] && isSameDay(day, hintedDate[1]))),\n    [hintedDate],\n  );\n\n  const isDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (value?.[0] && isSameDay(day, value[0]))),\n    [value],\n  );\n\n  const isHintedDaySelectionStart = React.useCallback(\n    (day: Date, dayOfWeek: number) =>\n      Boolean(isFirstDay(day, dayOfWeek) || (hintedDate?.[0] && isSameDay(day, hintedDate[0]))),\n    [hintedDate],\n  );\n\n  const onDayEnter = React.useCallback(\n    (date: Date) => setHintedDate(getNewValue(date)),\n    [setHintedDate, getNewValue],\n  );\n\n  const onDayLeave = React.useCallback(() => setHintedDate(undefined), [setHintedDate]);\n\n  const isDayHinted = React.useCallback(\n    (day: Date) => getIsDaySelected(day, hintedDate),\n    [hintedDate],\n  );\n\n  return (\n    <RootComponent {...props} baseClassName={styles['CalendarRange']}>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={viewDate}\n          onChange={setViewDate}\n          nextMonth={false}\n          onPrevMonth={setPrevMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          prevMonthIcon={prevMonthIcon}\n        />\n        <CalendarDays\n          viewDate={viewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          aria-label={changeDayAriaLabel}\n        />\n      </div>\n      <div className={styles['CalendarRange__inner']}>\n        <CalendarHeader\n          viewDate={secondViewDate}\n          onChange={setViewDate}\n          prevMonth={false}\n          onNextMonth={setNextMonth}\n          disablePickers={disablePickers}\n          className={styles['CalendarRange__header']}\n          prevMonthAriaLabel={prevMonthAriaLabel}\n          nextMonthAriaLabel={nextMonthAriaLabel}\n          changeMonthAriaLabel={changeMonthAriaLabel}\n          changeYearAriaLabel={changeYearAriaLabel}\n          nextMonthIcon={nextMonthIcon}\n        />\n        <CalendarDays\n          viewDate={secondViewDate}\n          value={value}\n          weekStartsOn={weekStartsOn}\n          aria-label={changeDayAriaLabel}\n          onKeyDown={handleKeyDown}\n          isDayFocused={isDayFocused}\n          onDayChange={onDayChange}\n          isDaySelected={isDaySelected}\n          isDayActive={isDayActive}\n          isDaySelectionEnd={isDaySelectionEnd}\n          isDaySelectionStart={isDaySelectionStart}\n          isDayHinted={isDayHinted}\n          onDayEnter={onDayEnter}\n          onDayLeave={onDayLeave}\n          isHintedDaySelectionEnd={isHintedDaySelectionEnd}\n          isHintedDaySelectionStart={isHintedDaySelectionStart}\n          isDayDisabled={isDayDisabled}\n          listenDayChangesForUpdate={listenDayChangesForUpdate}\n          tabIndex={0}\n          onBlur={resetSelectedDay}\n        />\n      </div>\n    </RootComponent>\n  );\n};\n"],"names":["React","useCalendar","isFirstDay","isLastDay","navigateDate","setTimeEqual","addMonths","endOfDay","isAfter","isBefore","isSameDay","isSameMonth","isWithinInterval","startOfDay","CalendarDays","CalendarHeader","RootComponent","getIsDaySelected","day","value","Boolean","CalendarRange","onChange","disablePast","disableFuture","shouldDisableDate","onClose","weekStartsOn","disablePickers","prevMonthAriaLabel","nextMonthAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","prevMonthIcon","nextMonthIcon","listenDayChangesForUpdate","props","viewDate","setViewDate","setPrevMonth","setNextMonth","focusedDay","setFocusedDay","isDayFocused","isDayDisabled","resetSelectedDay","useState","hintedDate","setHintedDate","secondViewDate","handleKeyDown","useCallback","event","includes","key","preventDefault","newFocusedDay","getNewValue","date","start","end","onDayChange","undefined","isDaySelected","isDayActive","isDaySelectionEnd","dayOfWeek","isHintedDaySelectionEnd","isDaySelectionStart","isHintedDaySelectionStart","onDayEnter","onDayLeave","isDayHinted","baseClassName","div","className","nextMonth","onPrevMonth","onKeyDown","aria-label","prevMonth","onNextMonth","tabIndex","onBlur"],"mappings":"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"}

package/dist/components/ChipsSelect/ChipsSelect.js

@@ -72,7 +72,7 @@ var chipsSelectDefaultProps = _object_spread_props(_object_spread({}, chipsInput
     var document = useDOM().document;
     var _React_useState = _sliced_to_array(React.useState(undefined), 2), popperPlacement = _React_useState[0], setPopperPlacement = _React_useState[1];
     var scrollBoxRef = React.useRef(null);
-    var rootRef = useExternRef(getRef);
+    var rootRef = useExternRef(getRootRef);
     var _useChipsSelect = useChipsSelect(propsWithDefault), fieldValue = _useChipsSelect.fieldValue, _useChipsSelect_selectedOptions = _useChipsSelect.selectedOptions, selectedOptions = _useChipsSelect_selectedOptions === void 0 ? [] : _useChipsSelect_selectedOptions, opened = _useChipsSelect.opened, setOpened = _useChipsSelect.setOpened, addOptionFromInput = _useChipsSelect.addOptionFromInput, filteredOptions = _useChipsSelect.filteredOptions, addOption = _useChipsSelect.addOption, handleInputChange = _useChipsSelect.handleInputChange, clearInput = _useChipsSelect.clearInput, focusedOption = _useChipsSelect.focusedOption, setFocusedOption = _useChipsSelect.setFocusedOption, focusedOptionIndex = _useChipsSelect.focusedOptionIndex, setFocusedOptionIndex = _useChipsSelect.setFocusedOptionIndex;
     var showCreatable = Boolean(creatable && creatableText && !filteredOptions.length && fieldValue);
     var handleFocus = function(e) {

package/dist/components/ChipsSelect/ChipsSelect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ChipsSelect/ChipsSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useChipsSelect } from '../../hooks/useChipsSelect';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipOption, ChipValue, RenderChip } from '../Chip/Chip';\nimport { ChipsInputProps } from '../ChipsInput/ChipsInput';\nimport { ChipsInputBase, chipsInputDefaultProps } from '../ChipsInputBase/ChipsInputBase';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './ChipsSelect.module.css';\n\nexport interface ChipsSelectProps<Option extends ChipOption>\n  extends Omit<ChipsInputProps<Option>, 'after'> {\n  popupDirection?: 'top' | 'bottom';\n  options?: Option[];\n  filterFn?:\n    | false\n    | ((\n        value?: string,\n        option?: Option,\n        getOptionLabel?: Pick<ChipsInputProps<Option>, 'getOptionLabel'>['getOptionLabel'],\n      ) => boolean);\n  /**\n   * Возможность создавать чипы которых нет в списке (по enter или с помощью пункта в меню, см creatableText)\n   */\n  creatable?: boolean;\n  /**\n   * Отрисовка лоадера вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  renderOption?: (props: CustomSelectOptionProps) => React.ReactNode;\n  /**\n   * Показывать или скрывать уже выбранные опции\n   */\n  showSelected?: boolean;\n  /**\n   * Текст для пункта создающего чипы при клике, так же отвечает за то будет ли показан этот пункт (показывается после того как в списке не отсанется опций)\n   */\n  creatableText?: string;\n  /**\n   * Текст который показывается если список опций пуст\n   */\n  emptyText?: string;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?: (e: React.MouseEvent | React.KeyboardEvent, option: Option) => void;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  fixDropdownWidth?: boolean;\n  forceDropdownPortal?: boolean;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Добавляет значение в список на событие `onBlur` (использовать вместе с `creatable`)\n   */\n  addOnBlur?: boolean;\n}\n\ntype FocusActionType = 'next' | 'prev';\n\nconst FOCUS_ACTION_NEXT: FocusActionType = 'next';\nconst FOCUS_ACTION_PREV: FocusActionType = 'prev';\n\nconst chipsSelectDefaultProps: ChipsSelectProps<any> = {\n  ...chipsInputDefaultProps,\n  emptyText: 'Ничего не найдено',\n  creatableText: 'Создать значение',\n  onChangeStart: noop,\n  creatable: false,\n  fetching: false,\n  showSelected: true,\n  closeAfterSelect: true,\n  options: [],\n  filterFn: defaultFilterFn,\n  renderOption(props) {\n    return <CustomSelectOption {...props} />;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>(props: ChipsSelectProps<Option>) => {\n  const propsWithDefault = { ...chipsSelectDefaultProps, ...props };\n  const {\n    style,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    className,\n    fetching,\n    renderOption,\n    emptyText,\n    getRef,\n    getRootRef,\n    disabled,\n    placeholder,\n    tabIndex,\n    getOptionValue,\n    getOptionLabel,\n    showSelected,\n    getNewOptionData,\n    renderChip,\n    popupDirection,\n    creatable,\n    filterFn,\n    inputValue,\n    creatableText,\n    closeAfterSelect,\n    onChangeStart,\n    before,\n    icon,\n    options,\n    fixDropdownWidth,\n    forceDropdownPortal,\n    ...restProps\n  } = propsWithDefault;\n\n  const { document } = useDOM();\n\n  const [popperPlacement, setPopperPlacement] = React.useState<Placement | undefined>(undefined);\n\n  const scrollBoxRef = React.useRef<HTMLDivElement>(null);\n  const rootRef = useExternRef(getRef);\n  const {\n    fieldValue,\n    selectedOptions = [],\n    opened,\n    setOpened,\n    addOptionFromInput,\n    filteredOptions,\n    addOption,\n    handleInputChange,\n    clearInput,\n    focusedOption,\n    setFocusedOption,\n    focusedOptionIndex,\n    setFocusedOptionIndex,\n  } = useChipsSelect(propsWithDefault);\n\n  const showCreatable = Boolean(\n    creatable && creatableText && !filteredOptions.length && fieldValue,\n  );\n\n  const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setOpened(true);\n    setFocusedOptionIndex(null);\n    onFocus!(e);\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    onBlur!(e);\n\n    // Не добавляем значение, если его нужно выбрать строго из списка\n    if (!e.defaultPrevented && !creatable) {\n      e.preventDefault();\n    }\n  };\n\n  const handleClickOutside = (e: MouseEvent) => {\n    const isClickOutsideFormField = !rootRef.current?.contains(e.target as Node);\n    const isClickOutsideDropdown = !scrollBoxRef.current?.contains(e.target as Node);\n\n    if (isClickOutsideFormField && isClickOutsideDropdown) {\n      setOpened(false);\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = scrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\n    if (!item || !dropdown) {\n      return;\n    }\n\n    const dropdownHeight = dropdown.offsetHeight;\n    const scrollTop = dropdown.scrollTop;\n    const itemTop = item.offsetTop;\n    const itemHeight = item.offsetHeight;\n\n    if (center) {\n      dropdown.scrollTop = itemTop - dropdownHeight / 2 + itemHeight / 2;\n    } else if (itemTop + itemHeight > dropdownHeight + scrollTop) {\n      dropdown.scrollTop = itemTop - dropdownHeight + itemHeight;\n    } else if (itemTop < scrollTop) {\n      dropdown.scrollTop = itemTop;\n    }\n  };\n\n  const focusOptionByIndex = (index: number, oldIndex: number | null) => {\n    const { length } = filteredOptions;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\n      return;\n    }\n\n    scrollToElement(index);\n    setFocusedOptionIndex(index);\n  };\n\n  const focusOption = (nextIndex: number | null, type: FocusActionType) => {\n    let index = nextIndex === null ? -1 : nextIndex;\n\n    if (type === FOCUS_ACTION_NEXT) {\n      index = index + 1;\n    } else if (type === FOCUS_ACTION_PREV) {\n      index = index - 1;\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown!(e);\n\n    if (e.key === 'ArrowUp' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_PREV);\n      }\n    }\n\n    if (e.key === 'ArrowDown' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_NEXT);\n      }\n    }\n\n    if (e.key === 'Enter' && !e.defaultPrevented && opened) {\n      if (focusedOptionIndex != null) {\n        const option = filteredOptions[focusedOptionIndex];\n\n        if (option) {\n          onChangeStart!(e, option);\n\n          if (!e.defaultPrevented) {\n            addOption(option);\n            setFocusedOptionIndex(null);\n            clearInput();\n            closeAfterSelect && setOpened(false);\n            e.preventDefault();\n          }\n        } else if (!creatable) {\n          e.preventDefault();\n        }\n      } else if (!creatable) {\n        e.preventDefault();\n      }\n    }\n\n    if (['Escape', 'Tab'].includes(e.key) && !e.defaultPrevented && opened) {\n      setOpened(false);\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex != null && filteredOptions[focusedOptionIndex]) {\n      setFocusedOption(filteredOptions[focusedOptionIndex]);\n    } else if (focusedOptionIndex === null || focusedOptionIndex === 0) {\n      setFocusedOption(null);\n    }\n  }, [focusedOptionIndex, filteredOptions, setFocusedOption]);\n\n  useGlobalEventListener(document, 'click', handleClickOutside);\n\n  const renderChipWrapper = (renderChipProps: RenderChip<Option> | undefined) => {\n    if (renderChipProps === undefined) {\n      return null;\n    }\n    const onRemoveWrapper = (e: React.MouseEvent | undefined, value: ChipValue | undefined) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      renderChipProps.onRemove?.(e, value);\n    };\n\n    return renderChip!({\n      ...renderChipProps,\n      onRemove: onRemoveWrapper,\n    });\n  };\n\n  const isPopperDirectionTop = popperPlacement?.includes('top');\n\n  const onPlacementChange = React.useCallback(\n    (placement?: Placement) => {\n      setPopperPlacement(placement);\n    },\n    [setPopperPlacement],\n  );\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const toggleOpened = () => {\n    setOpened((prevOpened) => !prevOpened);\n  };\n\n  return (\n    <>\n      <FormField\n        getRootRef={rootRef}\n        style={style}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            (isPopperDirectionTop\n              ? styles['ChipsSelect--pop-up']\n              : styles['ChipsSelect--pop-down']),\n          className,\n        )}\n        disabled={disabled}\n        role=\"application\"\n        aria-disabled={disabled}\n        aria-readonly={restProps.readOnly}\n        after={\n          <IconButton\n            className={styles['ChipsSelect__dropdown']}\n            activeMode=\"\"\n            hoverMode=\"\"\n            // TODO [>=6]: add label customization\n            aria-label={opened ? 'Скрыть' : 'Развернуть'}\n            onClick={toggleOpened}\n          >\n            {icon ?? <DropdownIcon className={styles['ChipsSelect__icon']} opened={opened} />}\n          </IconButton>\n        }\n        before={before}\n      >\n        <ChipsInputBase\n          {...restProps}\n          tabIndex={tabIndex}\n          value={selectedOptions}\n          inputValue={fieldValue}\n          getNewOptionData={getNewOptionData}\n          getOptionLabel={getOptionLabel}\n          getOptionValue={getOptionValue}\n          renderChip={renderChipWrapper}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          getRef={getRef}\n          disabled={disabled}\n          onInputChange={handleInputChange}\n        />\n      </FormField>\n      {opened && (\n        <CustomSelectDropdown\n          targetRef={rootRef}\n          placement={popupDirection}\n          scrollBoxRef={scrollBoxRef}\n          onPlacementChange={onPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          sameWidth={fixDropdownWidth}\n          forcePortal={forceDropdownPortal}\n        >\n          {showCreatable && (\n            <CustomSelectOption\n              hovered={focusedOptionIndex === 0}\n              onMouseDown={addOptionFromInput}\n              onMouseEnter={() => setFocusedOptionIndex(0)}\n            >\n              {creatableText}\n            </CustomSelectOption>\n          )}\n          {!filteredOptions?.length && !showCreatable && emptyText ? (\n            <Footnote className={styles['ChipsSelect__empty']}>{emptyText}</Footnote>\n          ) : (\n            filteredOptions.map((option: Option, index: number) => {\n              const label = getOptionLabel!(option);\n              const hovered =\n                focusedOption && getOptionValue!(option) === getOptionValue!(focusedOption);\n              const selected = selectedOptions.find((selectedOption: Option) => {\n                return getOptionValue!(selectedOption) === getOptionValue!(option);\n              });\n              const value = getOptionValue!(option);\n\n              return (\n                <React.Fragment key={`${typeof value}-${value}`}>\n                  {renderOption!({\n                    option,\n                    hovered: Boolean(hovered),\n                    children: label,\n                    selected: !!selected,\n                    getRootRef: (e) => {\n                      if (e) {\n                        return (chipsSelectOptions[index] = e);\n                      }\n                      return undefined;\n                    },\n                    onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n                      onChangeStart?.(e, option);\n\n                      if (!e.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter: () => setFocusedOptionIndex(index),\n                  })}\n                </React.Fragment>\n              );\n            })\n          )}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","noop","useChipsSelect","useExternRef","useGlobalEventListener","useDOM","defaultFilterFn","ChipsInputBase","chipsInputDefaultProps","CustomSelectDropdown","CustomSelectOption","DropdownIcon","FormField","IconButton","Footnote","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","chipsSelectDefaultProps","emptyText","creatableText","onChangeStart","creatable","fetching","showSelected","closeAfterSelect","options","filterFn","renderOption","props","ChipsSelect","propsWithDefault","style","onFocus","onBlur","onKeyDown","className","getRef","getRootRef","disabled","placeholder","tabIndex","getOptionValue","getOptionLabel","getNewOptionData","renderChip","popupDirection","inputValue","before","icon","fixDropdownWidth","forceDropdownPortal","restProps","document","useState","undefined","popperPlacement","setPopperPlacement","scrollBoxRef","useRef","rootRef","fieldValue","selectedOptions","opened","setOpened","addOptionFromInput","filteredOptions","addOption","handleInputChange","clearInput","focusedOption","setFocusedOption","focusedOptionIndex","setFocusedOptionIndex","showCreatable","Boolean","length","handleFocus","e","handleBlur","defaultPrevented","preventDefault","handleClickOutside","isClickOutsideFormField","current","contains","target","isClickOutsideDropdown","chipsSelectOptions","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","handleKeyDown","key","option","includes","useEffect","renderChipWrapper","renderChipProps","onRemoveWrapper","value","stopPropagation","onRemove","isPopperDirectionTop","onPlacementChange","useCallback","placement","onDropdownMouseLeave","toggleOpened","prevOpened","role","aria-disabled","aria-readonly","readOnly","after","activeMode","hoverMode","aria-label","onClick","onInputChange","targetRef","onMouseLeave","sameWidth","forcePortal","hovered","onMouseDown","onMouseEnter","map","label","selected","find","selectedOption","Fragment","children"],"mappings":";;;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,sBAAsB,QAAQ,qCAAqC;AAC5E,SAASC,MAAM,QAAQ,gBAAgB;AAEvC,SAASC,eAAe,QAAQ,mBAAmB;AAGnD,SAASC,cAAc,EAAEC,sBAAsB,QAAQ,mCAAmC;AAC1F,SAASC,oBAAoB,QAAQ,+CAA+C;AACpF,SACEC,kBAAkB,QAEb,2CAA2C;AAClD,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,SAAS,QAAQ,yBAAyB;AACnD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,QAAQ,QAAQ,kCAAkC;AAyD3D,IAAMC,oBAAqC;AAC3C,IAAMC,oBAAqC;AAE3C,IAAMC,0BAAiD,wCAClDT;IACHU,WAAW;IACXC,eAAe;IACfC,eAAenB;IACfoB,WAAW;IACXC,UAAU;IACVC,cAAc;IACdC,kBAAkB;IAClBC,SAAS,EAAE;IACXC,UAAUpB;IACVqB,cAAAA,SAAAA,aAAaC,KAAK;QAChB,qBAAO,oBAAClB,oBAAuBkB;IACjC;;AAGF;;CAEC,GACD,OAAO,IAAMC,cAAc,SAA4BD;IACrD,IAAME,mBAAmB,mBAAKb,yBAA4BW;IAC1D,IACEG,QA+BED,iBA/BFC,OACAC,UA8BEF,iBA9BFE,SACAC,SA6BEH,iBA7BFG,QACAC,YA4BEJ,iBA5BFI,WACAC,YA2BEL,iBA3BFK,WACAb,WA0BEQ,iBA1BFR,UACAK,eAyBEG,iBAzBFH,cACAT,YAwBEY,iBAxBFZ,WACAkB,SAuBEN,iBAvBFM,QACAC,aAsBEP,iBAtBFO,YACAC,WAqBER,iBArBFQ,UACAC,cAoBET,iBApBFS,aACAC,WAmBEV,iBAnBFU,UACAC,iBAkBEX,iBAlBFW,gBACAC,iBAiBEZ,iBAjBFY,gBACAnB,eAgBEO,iBAhBFP,cACAoB,mBAeEb,iBAfFa,kBACAC,aAcEd,iBAdFc,YACAC,iBAaEf,iBAbFe,gBACAxB,YAYES,iBAZFT,WACAK,WAWEI,iBAXFJ,UACAoB,aAUEhB,iBAVFgB,YACA3B,gBASEW,iBATFX,eACAK,mBAQEM,iBARFN,kBACAJ,gBAOEU,iBAPFV,eACA2B,SAMEjB,iBANFiB,QACAC,OAKElB,iBALFkB,MACAvB,UAIEK,iBAJFL,SACAwB,mBAGEnB,iBAHFmB,kBACAC,sBAEEpB,iBAFFoB,qBACGC,uCACDrB;QA/BFC;QACAC;QACAC;QACAC;QACAC;QACAb;QACAK;QACAT;QACAkB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAnB;QACAoB;QACAC;QACAC;QACAxB;QACAK;QACAoB;QACA3B;QACAK;QACAJ;QACA2B;QACAC;QACAvB;QACAwB;QACAC;;IAIF,IAAM,AAAEE,WAAa/C,SAAb+C;IAER,IAA8CrD,mCAAAA,MAAMsD,QAAQ,CAAwBC,gBAA7EC,kBAAuCxD,oBAAtByD,qBAAsBzD;IAE9C,IAAM0D,eAAe1D,MAAM2D,MAAM,CAAiB;IAClD,IAAMC,UAAUxD,aAAaiC;IAC7B,IAcIlC,kBAAAA,eAAe4B,mBAbjB8B,aAaE1D,gBAbF0D,8CAaE1D,gBAZF2D,iBAAAA,+DAAkB,EAAE,oCACpBC,SAWE5D,gBAXF4D,QACAC,YAUE7D,gBAVF6D,WACAC,qBASE9D,gBATF8D,oBACAC,kBAQE/D,gBARF+D,iBACAC,YAOEhE,gBAPFgE,WACAC,oBAMEjE,gBANFiE,mBACAC,aAKElE,gBALFkE,YACAC,gBAIEnE,gBAJFmE,eACAC,mBAGEpE,gBAHFoE,kBACAC,qBAEErE,gBAFFqE,oBACAC,wBACEtE,gBADFsE;IAGF,IAAMC,gBAAgBC,QACpBrD,aAAaF,iBAAiB,CAAC8C,gBAAgBU,MAAM,IAAIf;IAG3D,IAAMgB,cAAc,SAACC;QACnBd,UAAU;QACVS,sBAAsB;QACtBxC,QAAS6C;IACX;IAEA,IAAMC,aAAa,SAACD;QAClB5C,OAAQ4C;QAER,iEAAiE;QACjE,IAAI,CAACA,EAAEE,gBAAgB,IAAI,CAAC1D,WAAW;YACrCwD,EAAEG,cAAc;QAClB;IACF;IAEA,IAAMC,qBAAqB,SAACJ;YACOlB,kBACDF;QADhC,IAAMyB,0BAA0B,GAACvB,mBAAAA,QAAQwB,OAAO,cAAfxB,uCAAAA,iBAAiByB,QAAQ,CAACP,EAAEQ,MAAM;QACnE,IAAMC,yBAAyB,GAAC7B,wBAAAA,aAAa0B,OAAO,cAApB1B,4CAAAA,sBAAsB2B,QAAQ,CAACP,EAAEQ,MAAM;QAEvE,IAAIH,2BAA2BI,wBAAwB;YACrDvB,UAAU;QACZ;IACF;IAEA,IAAMwB,qBAAqBxF,MAAM2D,MAAM,CAAgB,EAAE,EAAEyB,OAAO;IAElE,IAAMK,kBAAkB,SAACC;YAAeC,0EAAS;QAC/C,IAAMC,WAAWlC,aAAa0B,OAAO;QACrC,IAAMS,OAAOL,kBAAkB,CAACE,MAAM;QAEtC,IAAI,CAACG,QAAQ,CAACD,UAAU;YACtB;QACF;QAEA,IAAME,iBAAiBF,SAASG,YAAY;QAC5C,IAAMC,YAAYJ,SAASI,SAAS;QACpC,IAAMC,UAAUJ,KAAKK,SAAS;QAC9B,IAAMC,aAAaN,KAAKE,YAAY;QAEpC,IAAIJ,QAAQ;YACVC,SAASI,SAAS,GAAGC,UAAUH,iBAAiB,IAAIK,aAAa;QACnE,OAAO,IAAIF,UAAUE,aAAaL,iBAAiBE,WAAW;YAC5DJ,SAASI,SAAS,GAAGC,UAAUH,iBAAiBK;QAClD,OAAO,IAAIF,UAAUD,WAAW;YAC9BJ,SAASI,SAAS,GAAGC;QACvB;IACF;IAEA,IAAMG,qBAAqB,SAACV,OAAeW;QACzC,IAAM,AAAEzB,SAAWV,gBAAXU;QAER,IAAIc,QAAQ,GAAG;YACbA,QAAQd,SAAS;QACnB,OAAO,IAAIc,SAASd,QAAQ;YAC1Bc,QAAQ;QACV;QAEA,IAAIA,UAAUW,UAAU;YACtB;QACF;QAEAZ,gBAAgBC;QAChBjB,sBAAsBiB;IACxB;IAEA,IAAMY,cAAc,SAACC,WAA0BC;QAC7C,IAAId,QAAQa,cAAc,OAAO,CAAC,IAAIA;QAEtC,IAAIC,SAASxF,mBAAmB;YAC9B0E,QAAQA,QAAQ;QAClB,OAAO,IAAIc,SAASvF,mBAAmB;YACrCyE,QAAQA,QAAQ;QAClB;QAEAU,mBAAmBV,OAAOlB;IAC5B;IAEA,IAAMiC,gBAAgB,SAAC3B;QACrB3C,UAAW2C;QAEX,IAAIA,EAAE4B,GAAG,KAAK,aAAa,CAAC5B,EAAEE,gBAAgB,EAAE;YAC9CF,EAAEG,cAAc;YAEhB,IAAI,CAAClB,QAAQ;gBACXC,UAAU;gBACVS,sBAAsB;YACxB,OAAO;gBACL6B,YAAY9B,oBAAoBvD;YAClC;QACF;QAEA,IAAI6D,EAAE4B,GAAG,KAAK,eAAe,CAAC5B,EAAEE,gBAAgB,EAAE;YAChDF,EAAEG,cAAc;YAEhB,IAAI,CAAClB,QAAQ;gBACXC,UAAU;gBACVS,sBAAsB;YACxB,OAAO;gBACL6B,YAAY9B,oBAAoBxD;YAClC;QACF;QAEA,IAAI8D,EAAE4B,GAAG,KAAK,WAAW,CAAC5B,EAAEE,gBAAgB,IAAIjB,QAAQ;YACtD,IAAIS,sBAAsB,MAAM;gBAC9B,IAAMmC,SAASzC,eAAe,CAACM,mBAAmB;gBAElD,IAAImC,QAAQ;oBACVtF,cAAeyD,GAAG6B;oBAElB,IAAI,CAAC7B,EAAEE,gBAAgB,EAAE;wBACvBb,UAAUwC;wBACVlC,sBAAsB;wBACtBJ;wBACA5C,oBAAoBuC,UAAU;wBAC9Bc,EAAEG,cAAc;oBAClB;gBACF,OAAO,IAAI,CAAC3D,WAAW;oBACrBwD,EAAEG,cAAc;gBAClB;YACF,OAAO,IAAI,CAAC3D,WAAW;gBACrBwD,EAAEG,cAAc;YAClB;QACF;QAEA,IAAI;YAAC;YAAU;SAAM,CAAC2B,QAAQ,CAAC9B,EAAE4B,GAAG,KAAK,CAAC5B,EAAEE,gBAAgB,IAAIjB,QAAQ;YACtEC,UAAU;QACZ;IACF;IAEAhE,MAAM6G,SAAS,CAAC;QACd,IAAIrC,sBAAsB,QAAQN,eAAe,CAACM,mBAAmB,EAAE;YACrED,iBAAiBL,eAAe,CAACM,mBAAmB;QACtD,OAAO,IAAIA,uBAAuB,QAAQA,uBAAuB,GAAG;YAClED,iBAAiB;QACnB;IACF,GAAG;QAACC;QAAoBN;QAAiBK;KAAiB;IAE1DlE,uBAAuBgD,UAAU,SAAS6B;IAE1C,IAAM4B,oBAAoB,SAACC;QACzB,IAAIA,oBAAoBxD,WAAW;YACjC,OAAO;QACT;QACA,IAAMyD,kBAAkB,SAAClC,GAAiCmC;gBAIxDF;YAHAjC,cAAAA,wBAAAA,EAAGG,cAAc;YACjBH,cAAAA,wBAAAA,EAAGoC,eAAe;aAElBH,4BAAAA,gBAAgBI,QAAQ,cAAxBJ,gDAAAA,+BAAAA,iBAA2BjC,GAAGmC;QAChC;QAEA,OAAOpE,WAAY,wCACdkE;YACHI,UAAUH;;IAEd;IAEA,IAAMI,uBAAuB5D,4BAAAA,sCAAAA,gBAAiBoD,QAAQ,CAAC;IAEvD,IAAMS,oBAAoBrH,MAAMsH,WAAW,CACzC,SAACC;QACC9D,mBAAmB8D;IACrB,GACA;QAAC9D;KAAmB;IAGtB,IAAM+D,uBAAuBxH,MAAMsH,WAAW,CAAC;QAC7C7C,sBAAsB;IACxB,GAAG;QAACA;KAAsB;IAE1B,IAAMgD,eAAe;QACnBzD,UAAU,SAAC0D;mBAAe,CAACA;;IAC7B;IAEA,qBACE,wDACE,oBAAC7G;QACCyB,YAAYsB;QACZ5B,OAAOA;QACPI,WAAWnC,8BAET8D,UACGqD,CAAAA,8EAEiC,GACpChF;QAEFG,UAAUA;QACVoF,MAAK;QACLC,iBAAerF;QACfsF,iBAAezE,UAAU0E,QAAQ;QACjCC,qBACE,oBAACjH;YACCsB,SAAS;YACT4F,YAAW;YACXC,WAAU;YACV,sCAAsC;YACtCC,cAAYnE,SAAS,WAAW;YAChCoE,SAASV;WAERxE,iBAAAA,kBAAAA,qBAAQ,oBAACrC;YAAawB,SAAS;YAA+B2B,QAAQA;;QAG3Ef,QAAQA;qBAER,oBAACxC,wDACK4C;QACJX,UAAUA;QACVwE,OAAOnD;QACPf,YAAYc;QACZjB,kBAAkBA;QAClBD,gBAAgBA;QAChBD,gBAAgBA;QAChBG,YAAYiE;QACZ7E,SAAS4C;QACT3C,QAAQ6C;QACR5C,WAAWsE;QACXjE,aAAaA;QACbH,QAAQA;QACRE,UAAUA;QACV6F,eAAehE;UAGlBL,wBACC,oBAACrD;QACC2H,WAAWzE;QACX2D,WAAWzE;QACXY,cAAcA;QACd2D,mBAAmBA;QACnBiB,cAAcd;QACdjG,UAAUA;QACVgH,WAAWrF;QACXsF,aAAarF;OAEZuB,+BACC,oBAAC/D;QACC8H,SAASjE,uBAAuB;QAChCkE,aAAazE;QACb0E,cAAc;mBAAMlE,sBAAsB;;OAEzCrD,gBAGJ,EAAC8C,4BAAAA,sCAAAA,gBAAiBU,MAAM,KAAI,CAACF,iBAAiBvD,0BAC7C,oBAACJ;QAASqB,SAAS;OAAiCjB,aAEpD+C,gBAAgB0E,GAAG,CAAC,SAACjC,QAAgBjB;QACnC,IAAMmD,QAAQlG,eAAgBgE;QAC9B,IAAM8B,UACJnE,iBAAiB5B,eAAgBiE,YAAYjE,eAAgB4B;QAC/D,IAAMwE,WAAWhF,gBAAgBiF,IAAI,CAAC,SAACC;YACrC,OAAOtG,eAAgBsG,oBAAoBtG,eAAgBiE;QAC7D;QACA,IAAMM,QAAQvE,eAAgBiE;QAE9B,qBACE,oBAAC3G,MAAMiJ,QAAQ;YAACvC,KAAK,AAAC,GAAkBO,OAAhB,OAAOA,sCAAP,SAAOA,QAAM,KAAS,OAANA;WACrCrF,aAAc;YACb+E,QAAAA;YACA8B,SAAS9D,QAAQ8D;YACjBS,UAAUL;YACVC,UAAU,CAAC,CAACA;YACZxG,YAAY,SAACwC;gBACX,IAAIA,GAAG;oBACL,OAAQU,kBAAkB,CAACE,MAAM,GAAGZ;gBACtC;gBACA,OAAOvB;YACT;YACAmF,aAAa,SAAC5D;gBACZzD,0BAAAA,oCAAAA,cAAgByD,GAAG6B;gBAEnB,IAAI,CAAC7B,EAAEE,gBAAgB,EAAE;oBACvBvD,oBAAoBuC,UAAU;oBAC9BG,UAAUwC;oBACVtC;gBACF;YACF;YACAsE,cAAc;uBAAMlE,sBAAsBiB;;QAC5C;IAGN;AAMZ,EAAE"}
+{"version":3,"sources":["../../../src/components/ChipsSelect/ChipsSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useChipsSelect } from '../../hooks/useChipsSelect';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipOption, ChipValue, RenderChip } from '../Chip/Chip';\nimport { ChipsInputProps } from '../ChipsInput/ChipsInput';\nimport { ChipsInputBase, chipsInputDefaultProps } from '../ChipsInputBase/ChipsInputBase';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './ChipsSelect.module.css';\n\nexport interface ChipsSelectProps<Option extends ChipOption>\n  extends Omit<ChipsInputProps<Option>, 'after'> {\n  popupDirection?: 'top' | 'bottom';\n  options?: Option[];\n  filterFn?:\n    | false\n    | ((\n        value?: string,\n        option?: Option,\n        getOptionLabel?: Pick<ChipsInputProps<Option>, 'getOptionLabel'>['getOptionLabel'],\n      ) => boolean);\n  /**\n   * Возможность создавать чипы которых нет в списке (по enter или с помощью пункта в меню, см creatableText)\n   */\n  creatable?: boolean;\n  /**\n   * Отрисовка лоадера вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  renderOption?: (props: CustomSelectOptionProps) => React.ReactNode;\n  /**\n   * Показывать или скрывать уже выбранные опции\n   */\n  showSelected?: boolean;\n  /**\n   * Текст для пункта создающего чипы при клике, так же отвечает за то будет ли показан этот пункт (показывается после того как в списке не отсанется опций)\n   */\n  creatableText?: string;\n  /**\n   * Текст который показывается если список опций пуст\n   */\n  emptyText?: string;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?: (e: React.MouseEvent | React.KeyboardEvent, option: Option) => void;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  fixDropdownWidth?: boolean;\n  forceDropdownPortal?: boolean;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Добавляет значение в список на событие `onBlur` (использовать вместе с `creatable`)\n   */\n  addOnBlur?: boolean;\n}\n\ntype FocusActionType = 'next' | 'prev';\n\nconst FOCUS_ACTION_NEXT: FocusActionType = 'next';\nconst FOCUS_ACTION_PREV: FocusActionType = 'prev';\n\nconst chipsSelectDefaultProps: ChipsSelectProps<any> = {\n  ...chipsInputDefaultProps,\n  emptyText: 'Ничего не найдено',\n  creatableText: 'Создать значение',\n  onChangeStart: noop,\n  creatable: false,\n  fetching: false,\n  showSelected: true,\n  closeAfterSelect: true,\n  options: [],\n  filterFn: defaultFilterFn,\n  renderOption(props) {\n    return <CustomSelectOption {...props} />;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>(props: ChipsSelectProps<Option>) => {\n  const propsWithDefault = { ...chipsSelectDefaultProps, ...props };\n  const {\n    style,\n    onFocus,\n    onBlur,\n    onKeyDown,\n    className,\n    fetching,\n    renderOption,\n    emptyText,\n    getRef,\n    getRootRef,\n    disabled,\n    placeholder,\n    tabIndex,\n    getOptionValue,\n    getOptionLabel,\n    showSelected,\n    getNewOptionData,\n    renderChip,\n    popupDirection,\n    creatable,\n    filterFn,\n    inputValue,\n    creatableText,\n    closeAfterSelect,\n    onChangeStart,\n    before,\n    icon,\n    options,\n    fixDropdownWidth,\n    forceDropdownPortal,\n    ...restProps\n  } = propsWithDefault;\n\n  const { document } = useDOM();\n\n  const [popperPlacement, setPopperPlacement] = React.useState<Placement | undefined>(undefined);\n\n  const scrollBoxRef = React.useRef<HTMLDivElement>(null);\n  const rootRef = useExternRef(getRootRef);\n  const {\n    fieldValue,\n    selectedOptions = [],\n    opened,\n    setOpened,\n    addOptionFromInput,\n    filteredOptions,\n    addOption,\n    handleInputChange,\n    clearInput,\n    focusedOption,\n    setFocusedOption,\n    focusedOptionIndex,\n    setFocusedOptionIndex,\n  } = useChipsSelect(propsWithDefault);\n\n  const showCreatable = Boolean(\n    creatable && creatableText && !filteredOptions.length && fieldValue,\n  );\n\n  const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setOpened(true);\n    setFocusedOptionIndex(null);\n    onFocus!(e);\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    onBlur!(e);\n\n    // Не добавляем значение, если его нужно выбрать строго из списка\n    if (!e.defaultPrevented && !creatable) {\n      e.preventDefault();\n    }\n  };\n\n  const handleClickOutside = (e: MouseEvent) => {\n    const isClickOutsideFormField = !rootRef.current?.contains(e.target as Node);\n    const isClickOutsideDropdown = !scrollBoxRef.current?.contains(e.target as Node);\n\n    if (isClickOutsideFormField && isClickOutsideDropdown) {\n      setOpened(false);\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = scrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\n    if (!item || !dropdown) {\n      return;\n    }\n\n    const dropdownHeight = dropdown.offsetHeight;\n    const scrollTop = dropdown.scrollTop;\n    const itemTop = item.offsetTop;\n    const itemHeight = item.offsetHeight;\n\n    if (center) {\n      dropdown.scrollTop = itemTop - dropdownHeight / 2 + itemHeight / 2;\n    } else if (itemTop + itemHeight > dropdownHeight + scrollTop) {\n      dropdown.scrollTop = itemTop - dropdownHeight + itemHeight;\n    } else if (itemTop < scrollTop) {\n      dropdown.scrollTop = itemTop;\n    }\n  };\n\n  const focusOptionByIndex = (index: number, oldIndex: number | null) => {\n    const { length } = filteredOptions;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\n      return;\n    }\n\n    scrollToElement(index);\n    setFocusedOptionIndex(index);\n  };\n\n  const focusOption = (nextIndex: number | null, type: FocusActionType) => {\n    let index = nextIndex === null ? -1 : nextIndex;\n\n    if (type === FOCUS_ACTION_NEXT) {\n      index = index + 1;\n    } else if (type === FOCUS_ACTION_PREV) {\n      index = index - 1;\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown!(e);\n\n    if (e.key === 'ArrowUp' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_PREV);\n      }\n    }\n\n    if (e.key === 'ArrowDown' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_NEXT);\n      }\n    }\n\n    if (e.key === 'Enter' && !e.defaultPrevented && opened) {\n      if (focusedOptionIndex != null) {\n        const option = filteredOptions[focusedOptionIndex];\n\n        if (option) {\n          onChangeStart!(e, option);\n\n          if (!e.defaultPrevented) {\n            addOption(option);\n            setFocusedOptionIndex(null);\n            clearInput();\n            closeAfterSelect && setOpened(false);\n            e.preventDefault();\n          }\n        } else if (!creatable) {\n          e.preventDefault();\n        }\n      } else if (!creatable) {\n        e.preventDefault();\n      }\n    }\n\n    if (['Escape', 'Tab'].includes(e.key) && !e.defaultPrevented && opened) {\n      setOpened(false);\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex != null && filteredOptions[focusedOptionIndex]) {\n      setFocusedOption(filteredOptions[focusedOptionIndex]);\n    } else if (focusedOptionIndex === null || focusedOptionIndex === 0) {\n      setFocusedOption(null);\n    }\n  }, [focusedOptionIndex, filteredOptions, setFocusedOption]);\n\n  useGlobalEventListener(document, 'click', handleClickOutside);\n\n  const renderChipWrapper = (renderChipProps: RenderChip<Option> | undefined) => {\n    if (renderChipProps === undefined) {\n      return null;\n    }\n    const onRemoveWrapper = (e: React.MouseEvent | undefined, value: ChipValue | undefined) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      renderChipProps.onRemove?.(e, value);\n    };\n\n    return renderChip!({\n      ...renderChipProps,\n      onRemove: onRemoveWrapper,\n    });\n  };\n\n  const isPopperDirectionTop = popperPlacement?.includes('top');\n\n  const onPlacementChange = React.useCallback(\n    (placement?: Placement) => {\n      setPopperPlacement(placement);\n    },\n    [setPopperPlacement],\n  );\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const toggleOpened = () => {\n    setOpened((prevOpened) => !prevOpened);\n  };\n\n  return (\n    <>\n      <FormField\n        getRootRef={rootRef}\n        style={style}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            (isPopperDirectionTop\n              ? styles['ChipsSelect--pop-up']\n              : styles['ChipsSelect--pop-down']),\n          className,\n        )}\n        disabled={disabled}\n        role=\"application\"\n        aria-disabled={disabled}\n        aria-readonly={restProps.readOnly}\n        after={\n          <IconButton\n            className={styles['ChipsSelect__dropdown']}\n            activeMode=\"\"\n            hoverMode=\"\"\n            // TODO [>=6]: add label customization\n            aria-label={opened ? 'Скрыть' : 'Развернуть'}\n            onClick={toggleOpened}\n          >\n            {icon ?? <DropdownIcon className={styles['ChipsSelect__icon']} opened={opened} />}\n          </IconButton>\n        }\n        before={before}\n      >\n        <ChipsInputBase\n          {...restProps}\n          tabIndex={tabIndex}\n          value={selectedOptions}\n          inputValue={fieldValue}\n          getNewOptionData={getNewOptionData}\n          getOptionLabel={getOptionLabel}\n          getOptionValue={getOptionValue}\n          renderChip={renderChipWrapper}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          getRef={getRef}\n          disabled={disabled}\n          onInputChange={handleInputChange}\n        />\n      </FormField>\n      {opened && (\n        <CustomSelectDropdown\n          targetRef={rootRef}\n          placement={popupDirection}\n          scrollBoxRef={scrollBoxRef}\n          onPlacementChange={onPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          sameWidth={fixDropdownWidth}\n          forcePortal={forceDropdownPortal}\n        >\n          {showCreatable && (\n            <CustomSelectOption\n              hovered={focusedOptionIndex === 0}\n              onMouseDown={addOptionFromInput}\n              onMouseEnter={() => setFocusedOptionIndex(0)}\n            >\n              {creatableText}\n            </CustomSelectOption>\n          )}\n          {!filteredOptions?.length && !showCreatable && emptyText ? (\n            <Footnote className={styles['ChipsSelect__empty']}>{emptyText}</Footnote>\n          ) : (\n            filteredOptions.map((option: Option, index: number) => {\n              const label = getOptionLabel!(option);\n              const hovered =\n                focusedOption && getOptionValue!(option) === getOptionValue!(focusedOption);\n              const selected = selectedOptions.find((selectedOption: Option) => {\n                return getOptionValue!(selectedOption) === getOptionValue!(option);\n              });\n              const value = getOptionValue!(option);\n\n              return (\n                <React.Fragment key={`${typeof value}-${value}`}>\n                  {renderOption!({\n                    option,\n                    hovered: Boolean(hovered),\n                    children: label,\n                    selected: !!selected,\n                    getRootRef: (e) => {\n                      if (e) {\n                        return (chipsSelectOptions[index] = e);\n                      }\n                      return undefined;\n                    },\n                    onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n                      onChangeStart?.(e, option);\n\n                      if (!e.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter: () => setFocusedOptionIndex(index),\n                  })}\n                </React.Fragment>\n              );\n            })\n          )}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","noop","useChipsSelect","useExternRef","useGlobalEventListener","useDOM","defaultFilterFn","ChipsInputBase","chipsInputDefaultProps","CustomSelectDropdown","CustomSelectOption","DropdownIcon","FormField","IconButton","Footnote","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","chipsSelectDefaultProps","emptyText","creatableText","onChangeStart","creatable","fetching","showSelected","closeAfterSelect","options","filterFn","renderOption","props","ChipsSelect","propsWithDefault","style","onFocus","onBlur","onKeyDown","className","getRef","getRootRef","disabled","placeholder","tabIndex","getOptionValue","getOptionLabel","getNewOptionData","renderChip","popupDirection","inputValue","before","icon","fixDropdownWidth","forceDropdownPortal","restProps","document","useState","undefined","popperPlacement","setPopperPlacement","scrollBoxRef","useRef","rootRef","fieldValue","selectedOptions","opened","setOpened","addOptionFromInput","filteredOptions","addOption","handleInputChange","clearInput","focusedOption","setFocusedOption","focusedOptionIndex","setFocusedOptionIndex","showCreatable","Boolean","length","handleFocus","e","handleBlur","defaultPrevented","preventDefault","handleClickOutside","isClickOutsideFormField","current","contains","target","isClickOutsideDropdown","chipsSelectOptions","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","handleKeyDown","key","option","includes","useEffect","renderChipWrapper","renderChipProps","onRemoveWrapper","value","stopPropagation","onRemove","isPopperDirectionTop","onPlacementChange","useCallback","placement","onDropdownMouseLeave","toggleOpened","prevOpened","role","aria-disabled","aria-readonly","readOnly","after","activeMode","hoverMode","aria-label","onClick","onInputChange","targetRef","onMouseLeave","sameWidth","forcePortal","hovered","onMouseDown","onMouseEnter","map","label","selected","find","selectedOption","Fragment","children"],"mappings":"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"}

package/dist/components/CustomScrollView/CustomScrollView.d.ts

@@ -1,12 +1,14 @@
 import * as React from 'react';
 import { DOMProps } from '../../lib/dom';
+import type { HasRootRef } from '../../types';
 import { TrackerOptionsProps } from './useTrackerVisibility';
-export interface CustomScrollViewProps extends DOMProps, TrackerOptionsProps {
+export interface CustomScrollViewProps extends React.AllHTMLAttributes<HTMLDivElement>, DOMProps, // TODO [>=6]: remove
+HasRootRef<HTMLDivElement>, TrackerOptionsProps {
     windowResize?: boolean;
     boxRef?: React.Ref<HTMLDivElement>;
     className?: HTMLDivElement['className'];
     onScroll?(event: React.UIEvent<HTMLDivElement>): void;
     children: React.ReactNode;
 }
-export declare const CustomScrollView: ({ className, children, boxRef: externalBoxRef, windowResize, autoHideScrollbar, autoHideScrollbarDelay, onScroll, }: CustomScrollViewProps) => React.JSX.Element;
+export declare const CustomScrollView: ({ className, children, boxRef: externalBoxRef, windowResize, autoHideScrollbar, autoHideScrollbarDelay, onScroll, getRootRef, ...restProps }: CustomScrollViewProps) => React.JSX.Element;
 //# sourceMappingURL=CustomScrollView.d.ts.map

package/dist/components/CustomScrollView/CustomScrollView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CustomScrollView.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAC;AAGjD,OAAO,EAAE,mBAAmB,EAAwB,MAAM,wBAAwB,CAAC;AAGnF,MAAM,WAAW,qBAAsB,SAAQ,QAAQ,EAAE,mBAAmB;IAC1E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,QAAQ,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,wHAQ1B,qBAAqB,sBAyKvB,CAAC"}
+{"version":3,"file":"CustomScrollView.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAC;AAGjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAwB,MAAM,wBAAwB,CAAC;AAGnF,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,EAC7C,QAAQ,EAAE,qBAAqB;AAC/B,UAAU,CAAC,cAAc,CAAC,EAC1B,mBAAmB;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,QAAQ,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,iJAU1B,qBAAqB,sBA6KvB,CAAC"}

package/dist/components/CustomScrollView/CustomScrollView.js

@@ -1,3 +1,5 @@
+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 { useEventListener } from "../../hooks/useEventListener";
@@ -6,8 +8,7 @@ import { useDOM } from "../../lib/dom";
 import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 import { stopPropagation } from "../../lib/utils";
 import { useTrackerVisibility } from "./useTrackerVisibility";
-export var CustomScrollView = function(param) {
-    var className = param.className, children = param.children, externalBoxRef = param.boxRef, windowResize = param.windowResize, _param_autoHideScrollbar = param.autoHideScrollbar, autoHideScrollbar = _param_autoHideScrollbar === void 0 ? false : _param_autoHideScrollbar, autoHideScrollbarDelay = param.autoHideScrollbarDelay, onScroll = param.onScroll;
+export var CustomScrollView = function(_param) {
     var subscribe = function subscribe(el) {
         if (el) {
             listeners.forEach(function(l) {
@@ -20,6 +21,16 @@ export var CustomScrollView = function(param) {
             return l.remove();
         });
     };
+    var className = _param.className, children = _param.children, externalBoxRef = _param.boxRef, windowResize = _param.windowResize, _param_autoHideScrollbar = _param.autoHideScrollbar, autoHideScrollbar = _param_autoHideScrollbar === void 0 ? false : _param_autoHideScrollbar, autoHideScrollbarDelay = _param.autoHideScrollbarDelay, onScroll = _param.onScroll, getRootRef = _param.getRootRef, restProps = _object_without_properties(_param, [
+        "className",
+        "children",
+        "boxRef",
+        "windowResize",
+        "autoHideScrollbar",
+        "autoHideScrollbarDelay",
+        "onScroll",
+        "getRootRef"
+    ]);
     var _useDOM = useDOM(), document = _useDOM.document, window = _useDOM.window;
     var ratio = React.useRef(NaN);
     var lastTrackerTop = React.useRef(0);
@@ -128,9 +139,10 @@ export var CustomScrollView = function(param) {
         }
         subscribe(document);
     };
-    return /*#__PURE__*/ React.createElement("div", {
-        className: classNames("vkuiCustomScrollView", className)
-    }, /*#__PURE__*/ React.createElement("div", {
+    return /*#__PURE__*/ React.createElement("div", _object_spread({
+        className: classNames("vkuiCustomScrollView", className),
+        ref: getRootRef
+    }, restProps), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiCustomScrollView__box",
         tabIndex: -1,
         ref: boxRef,