@vkontakte/vkui 5.4.3 → 5.5.0

package/dist/cjs/components/AppRoot/AppRootPortal.js

@@ -8,27 +8,42 @@ Object.defineProperty(exports, "AppRootPortal", {
         return AppRootPortal;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-var _reactDom = require("react-dom");
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+var _reactdom = require("react-dom");
 var _useAppearance = require("../../hooks/useAppearance");
 var _useIsClient = require("../../hooks/useIsClient");
-var _appearanceProvider = require("../AppearanceProvider/AppearanceProvider");
-var _appRootContext = require("./AppRootContext");
+var _isRefObject = require("../../lib/isRefObject");
+var _AppearanceProvider = require("../AppearanceProvider/AppearanceProvider");
+var _AppRootContext = require("./AppRootContext");
 var AppRootPortal = function(param) {
-    var children = param.children, className = param.className, forcePortalProp = param.forcePortal;
-    var _React_useContext = _react.useContext(_appRootContext.AppRootContext), portalRoot = _React_useContext.portalRoot, mode = _React_useContext.mode, disablePortal = _React_useContext.disablePortal;
+    var children = param.children, className = param.className, forcePortalProp = param.forcePortal, tmp = param.portalRoot, portalRootProp = tmp === void 0 ? null : tmp;
+    var _React_useContext = _react.useContext(_AppRootContext.AppRootContext), portalRoot = _React_useContext.portalRoot, mode = _React_useContext.mode, disablePortal = _React_useContext.disablePortal;
     var appearance = (0, _useAppearance.useAppearance)();
     var isClient = (0, _useIsClient.useIsClient)();
     if (!isClient) {
         return null;
     }
     var forcePortal = forcePortalProp !== null && forcePortalProp !== void 0 ? forcePortalProp : mode !== "full";
-    return !disablePortal && portalRoot && forcePortal ? /*#__PURE__*/ (0, _reactDom.createPortal)(/*#__PURE__*/ _react.createElement(_appearanceProvider.AppearanceProvider, {
+    var portalContainer = getPortalContainer(portalRootProp, portalRoot);
+    var ignoreDisablePortalFlagFromContext = portalRootProp && forcePortal;
+    var shouldUsePortal = ignoreDisablePortalFlagFromContext ? true : !disablePortal && portalContainer && forcePortal;
+    return shouldUsePortal && portalContainer ? /*#__PURE__*/ (0, _reactdom.createPortal)(/*#__PURE__*/ _react.createElement(_AppearanceProvider.AppearanceProvider, {
         appearance: appearance
     }, /*#__PURE__*/ _react.createElement("div", {
         className: className
-    }, children)), portalRoot) : /*#__PURE__*/ _react.createElement(_react.Fragment, null, children);
+    }, children)), portalContainer) : /*#__PURE__*/ _react.createElement(_react.Fragment, null, children);
 };
+/**
+ * Получает из кастомного пропа `partialRootProp` и `partialRoot` контекста
+ * контейнер-элемент для портала.
+ * `partialRootProp` может быть ref элементом.
+ *
+ */ function getPortalContainer(portalRootProp, portalRoot) {
+    if (!portalRootProp) {
+        return portalRoot;
+    }
+    return (0, _isRefObject.isRefObject)(portalRootProp) ? portalRootProp.current : portalRootProp;
+}
 
 //# sourceMappingURL=AppRootPortal.js.map

package/dist/cjs/components/AppRoot/AppRootPortal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AppRoot/AppRootPortal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { HasChildren } from '../../types';\nimport { AppearanceProvider } from '../AppearanceProvider/AppearanceProvider';\nimport { AppRootContext } from './AppRootContext';\n\nexport interface AppRootPortalProps extends HasChildren {\n  className?: string;\n  forcePortal?: boolean;\n}\n\nexport const AppRootPortal = ({\n  children,\n  className,\n  forcePortal: forcePortalProp,\n}: AppRootPortalProps) => {\n  const { portalRoot, mode, disablePortal } = React.useContext(AppRootContext);\n  const appearance = useAppearance();\n\n  const isClient = useIsClient();\n  if (!isClient) {\n    return null;\n  }\n\n  const forcePortal = forcePortalProp ?? mode !== 'full';\n\n  return !disablePortal && portalRoot && forcePortal ? (\n    createPortal(\n      <AppearanceProvider appearance={appearance}>\n        <div className={className}>{children}</div>\n      </AppearanceProvider>,\n      portalRoot,\n    )\n  ) : (\n    <React.Fragment>{children}</React.Fragment>\n  );\n};\n"],"names":["AppRootPortal","children","className","forcePortal","forcePortalProp","React","useContext","AppRootContext","portalRoot","mode","disablePortal","appearance","useAppearance","isClient","useIsClient","createPortal","AppearanceProvider","div","Fragment"],"mappings":";;;;+BAaaA;;;eAAAA;;;;2DAbU;wBACM;6BACC;2BACF;kCAEO;8BACJ;AAOxB,IAAMA,gBAAgB,gBAIH;QAHxBC,iBAAAA,UACAC,kBAAAA,WACAC,AAAaC,wBAAbD;IAEA,IAA4CE,oBAAAA,OAAMC,UAAU,CAACC,8BAAc,GAAnEC,aAAoCH,kBAApCG,YAAYC,OAAwBJ,kBAAxBI,MAAMC,gBAAkBL,kBAAlBK;IAC1B,IAAMC,aAAaC,IAAAA,4BAAa;IAEhC,IAAMC,WAAWC,IAAAA,wBAAW;IAC5B,IAAI,CAACD,UAAU;QACb,OAAO,IAAI;IACb,CAAC;IAED,IAAMV,cAAcC,4BAAAA,6BAAAA,kBAAmBK,SAAS,MAAM;IAEtD,OAAO,CAACC,iBAAiBF,cAAcL,4BACrCY,IAAAA,sBAAY,gBACV,qBAACC,sCAAkB;QAACL,YAAYA;qBAC9B,qBAACM;QAAIf,WAAWA;OAAYD,YAE9BO,4BAGF,qBAACH,OAAMa,QAAQ,QAAEjB,SAClB;AACH"}
+{"version":3,"sources":["../../../../src/components/AppRoot/AppRootPortal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { useAppearance } from '../../hooks/useAppearance';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { HasChildren } from '../../types';\nimport { AppearanceProvider } from '../AppearanceProvider/AppearanceProvider';\nimport { AppRootContext } from './AppRootContext';\n\nexport interface AppRootPortalProps extends HasChildren {\n  className?: string;\n  forcePortal?: boolean;\n  /**\n   * Кастомный root-элемент портала.\n   * При передаче вместе с `forcePorta=true` игнорируется `portalRoot` и `disablePortal`\n   * из контекста `AppRoot`.\n   */\n  portalRoot?: HTMLElement | React.RefObject<HTMLElement> | null;\n}\n\nexport const AppRootPortal = ({\n  children,\n  className,\n  forcePortal: forcePortalProp,\n  portalRoot: portalRootProp = null,\n}: AppRootPortalProps) => {\n  const { portalRoot, mode, disablePortal } = React.useContext(AppRootContext);\n  const appearance = useAppearance();\n\n  const isClient = useIsClient();\n  if (!isClient) {\n    return null;\n  }\n\n  const forcePortal = forcePortalProp ?? mode !== 'full';\n\n  const portalContainer = getPortalContainer(portalRootProp, portalRoot);\n\n  const ignoreDisablePortalFlagFromContext = portalRootProp && forcePortal;\n  const shouldUsePortal = ignoreDisablePortalFlagFromContext\n    ? true\n    : !disablePortal && portalContainer && forcePortal;\n\n  return shouldUsePortal && portalContainer ? (\n    createPortal(\n      <AppearanceProvider appearance={appearance}>\n        <div className={className}>{children}</div>\n      </AppearanceProvider>,\n      portalContainer,\n    )\n  ) : (\n    <React.Fragment>{children}</React.Fragment>\n  );\n};\n\n/**\n * Получает из кастомного пропа `partialRootProp` и `partialRoot` контекста\n * контейнер-элемент для портала.\n * `partialRootProp` может быть ref элементом.\n *\n */\nfunction getPortalContainer(\n  portalRootProp?: HTMLElement | React.RefObject<HTMLElement> | null,\n  portalRoot?: HTMLElement | null,\n) {\n  if (!portalRootProp) {\n    return portalRoot;\n  }\n\n  return isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp;\n}\n"],"names":["AppRootPortal","children","className","forcePortal","forcePortalProp","portalRootProp","portalRoot","React","useContext","AppRootContext","mode","disablePortal","appearance","useAppearance","isClient","useIsClient","portalContainer","getPortalContainer","ignoreDisablePortalFlagFromContext","shouldUsePortal","createPortal","AppearanceProvider","div","Fragment","isRefObject","current"],"mappings":";;;;+BAoBaA;;;eAAAA;;;;+DApBU;wBACM;6BACC;2BACF;2BACA;kCAEO;8BACJ;AAaxB,IAAMA,gBAAgB;QAC3BC,iBAAAA,UACAC,kBAAAA,WACAC,AAAaC,wBAAbD,aACYE,YAAZC,YAAYD,iBAAAA,iBAAiB,OAAjBA;IAEZ,IAA4CE,oBAAAA,OAAMC,WAAWC,iCAArDH,aAAoCC,kBAApCD,YAAYI,OAAwBH,kBAAxBG,MAAMC,gBAAkBJ,kBAAlBI;IAC1B,IAAMC,aAAaC,IAAAA;IAEnB,IAAMC,WAAWC,IAAAA;IACjB,IAAI,CAACD,UAAU;QACb,OAAO;IACT;IAEA,IAAMX,cAAcC,4BAAAA,6BAAAA,kBAAmBM,SAAS;IAEhD,IAAMM,kBAAkBC,mBAAmBZ,gBAAgBC;IAE3D,IAAMY,qCAAqCb,kBAAkBF;IAC7D,IAAMgB,kBAAkBD,qCACpB,OACA,CAACP,iBAAiBK,mBAAmBb;IAEzC,OAAOgB,mBAAmBH,gCACxBI,IAAAA,sCACE,qBAACC;QAAmBT,YAAYA;qBAC9B,qBAACU;QAAIpB,WAAWA;OAAYD,YAE9Be,iCAGF,qBAACT,OAAMgB,gBAAUtB;AAErB;AAEA;;;;;CAKC,GACD,SAASgB,mBACPZ,cAAkE,EAClEC,UAA+B;IAE/B,IAAI,CAACD,gBAAgB;QACnB,OAAOC;IACT;IAEA,OAAOkB,IAAAA,0BAAYnB,kBAAkBA,eAAeoB,UAAUpB;AAChE"}

package/dist/cjs/components/AppRoot/ScrollContext.d.ts

@@ -16,8 +16,8 @@ export declare const useScroll: () => ScrollContextInterface;
 export interface ScrollControllerProps extends HasChildren {
     elRef: React.RefObject<HTMLElement>;
 }
-export declare const GlobalScrollController: ({ children }: ScrollControllerProps) => JSX.Element;
-export declare const ElementScrollController: ({ elRef, children }: ScrollControllerProps) => JSX.Element;
+export declare const GlobalScrollController: ({ children }: ScrollControllerProps) => React.JSX.Element;
+export declare const ElementScrollController: ({ elRef, children }: ScrollControllerProps) => React.JSX.Element;
 /**
  * Вызывает функцию effect, до блокировки прокрутки
  * @param effect функция, которая может возвращать функцию очистки

package/dist/cjs/components/AppRoot/ScrollContext.js

@@ -28,9 +28,9 @@ _export(exports, {
         return useScrollLock;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _slicedToArray = require("@swc/helpers/lib/_sliced_to_array.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _math = require("../../helpers/math");
 var _dom = require("../../lib/dom");
@@ -70,7 +70,7 @@ var useScroll = function() {
 var GlobalScrollController = function(param) {
     var children = param.children;
     var _useDOM = (0, _dom.useDOM)(), window = _useDOM.window, document = _useDOM.document;
-    var _React_useState = _slicedToArray(_react.useState(false), 2), isScrollLock = _React_useState[0], setScrollLock = _React_useState[1];
+    var _React_useState = _sliced_to_array._(_react.useState(false), 2), isScrollLock = _React_useState[0], setScrollLock = _React_useState[1];
     var beforeScrollLockFnSetRef = _react.useRef(new Set());
     var getScroll = _react.useCallback(function() {
         return {
@@ -141,7 +141,7 @@ var GlobalScrollController = function(param) {
 };
 var ElementScrollController = function(param) {
     var elRef = param.elRef, children = param.children;
-    var _React_useState = _slicedToArray(_react.useState(false), 2), isScrollLock = _React_useState[0], setScrollLock = _React_useState[1];
+    var _React_useState = _sliced_to_array._(_react.useState(false), 2), isScrollLock = _React_useState[0], setScrollLock = _React_useState[1];
     var beforeScrollLockFnSetRef = _react.useRef(new Set());
     var _elRef_current_scrollLeft, _elRef_current_scrollTop;
     var getScroll = _react.useCallback(function() {

package/dist/cjs/components/AppRoot/ScrollContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AppRoot/ScrollContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasChildren } from '../../types';\n\nconst clearDisableScrollStyle = (node: HTMLElement) => {\n  Object.assign(node.style, {\n    position: '',\n    top: '',\n    left: '',\n    right: '',\n    overflowY: '',\n    overflowX: '',\n  });\n};\n\nconst getPageYOffsetWithoutKeyboardHeight = (window: Window) => {\n  // Note: здесь расчёт на то, что `clientHeight` равен `window.innerHeight`.\n  //  Это достигается тем, что тегу `html` задали`height: 100%` и у него нет отступов сверху и снизу. Если есть отступы,\n  //  то надо задать `box-sizing: border-box`, чтобы они не учитывались.\n  const diffOfClientHeightAndViewportHeight =\n    window.document.documentElement.clientHeight - window.innerHeight;\n  return window.pageYOffset - diffOfClientHeightAndViewportHeight;\n};\n\nexport interface ScrollContextInterface {\n  getScroll(this: void): { x: number; y: number };\n  scrollTo(this: void, x?: number, y?: number): void;\n  isScrollLock: boolean;\n  enableScrollLock(this: void): void;\n  disableScrollLock(this: void): void;\n  beforeScrollLockFnSetRef?: React.RefObject<Set<() => void>>;\n}\n\nexport const ScrollContext = React.createContext<ScrollContextInterface>({\n  getScroll: () => ({ x: 0, y: 0 }),\n  scrollTo: noop,\n  isScrollLock: false,\n  enableScrollLock: noop,\n  disableScrollLock: noop,\n});\n\nexport const useScroll = () => React.useContext(ScrollContext);\n\nexport interface ScrollControllerProps extends HasChildren {\n  elRef: React.RefObject<HTMLElement>;\n}\n\nexport const GlobalScrollController = ({ children }: ScrollControllerProps) => {\n  const { window, document } = useDOM();\n  const [isScrollLock, setScrollLock] = React.useState(false);\n  const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());\n\n  const getScroll = React.useCallback<ScrollContextInterface['getScroll']>(\n    () => ({\n      x: window!.pageXOffset,\n      y: getPageYOffsetWithoutKeyboardHeight(window!),\n    }),\n    [window],\n  );\n  const scrollTo = React.useCallback<ScrollContextInterface['scrollTo']>(\n    (x = 0, y = 0) => {\n      // Some iOS versions do not normalize scroll — do it manually.\n      window!.scrollTo(\n        x ? clamp(x, 0, document!.body.scrollWidth - window!.innerWidth) : 0,\n        y ? clamp(y, 0, document!.body.scrollHeight - window!.innerHeight) : 0,\n      );\n    },\n    [document, window],\n  );\n\n  const enableScrollLock = React.useCallback<ScrollContextInterface['enableScrollLock']>(() => {\n    beforeScrollLockFnSetRef.current.forEach((fn) => {\n      fn();\n    });\n\n    const scrollY = window!.pageYOffset;\n    const scrollX = window!.pageXOffset;\n    const overflowY = window!.innerWidth > document!.documentElement.clientWidth ? 'scroll' : '';\n    const overflowX = window!.innerHeight > document!.documentElement.clientHeight ? 'scroll' : '';\n\n    Object.assign(document!.body.style, {\n      position: 'fixed',\n      top: `-${scrollY}px`,\n      left: `-${scrollX}px`,\n      right: '0',\n      overflowY,\n      overflowX,\n    });\n    setScrollLock(true);\n  }, [document, window]);\n\n  const disableScrollLock = React.useCallback<ScrollContextInterface['disableScrollLock']>(() => {\n    const scrollY = document!.body.style.top;\n    const scrollX = document!.body.style.left;\n\n    clearDisableScrollStyle(document!.body);\n    window!.scrollTo(-parseInt(scrollX || '0'), -parseInt(scrollY || '0'));\n    setScrollLock(false);\n  }, [document, window]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => ({\n      getScroll,\n      scrollTo,\n      isScrollLock,\n      disableScrollLock,\n      enableScrollLock,\n\n      beforeScrollLockFnSetRef: beforeScrollLockFnSetRef,\n    }),\n    [getScroll, scrollTo, isScrollLock, disableScrollLock, enableScrollLock],\n  );\n\n  return <ScrollContext.Provider value={scrollController}>{children}</ScrollContext.Provider>;\n};\n\nexport const ElementScrollController = ({ elRef, children }: ScrollControllerProps) => {\n  const [isScrollLock, setScrollLock] = React.useState(false);\n  const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());\n\n  const getScroll = React.useCallback<ScrollContextInterface['getScroll']>(\n    () => ({\n      x: elRef.current?.scrollLeft ?? 0,\n      y: elRef.current?.scrollTop ?? 0,\n    }),\n    [elRef],\n  );\n  const scrollTo = React.useCallback<ScrollContextInterface['scrollTo']>(\n    (x = 0, y = 0) => {\n      const el = elRef.current;\n      // Some iOS versions do not normalize scroll — do it manually.\n      el?.scrollTo(\n        x ? clamp(x, 0, el.scrollWidth - el.clientWidth) : 0,\n        y ? clamp(y, 0, el.scrollHeight - el.clientHeight) : 0,\n      );\n    },\n    [elRef],\n  );\n\n  const enableScrollLock = React.useCallback<ScrollContextInterface['enableScrollLock']>(() => {\n    const el = elRef.current;\n    if (!el) {\n      return;\n    }\n    beforeScrollLockFnSetRef.current.forEach((fn) => {\n      fn();\n    });\n\n    const scrollY = el.scrollTop;\n    const scrollX = el.scrollLeft;\n    const overflowY = el.scrollWidth > el.clientWidth ? 'scroll' : '';\n    const overflowX = el.scrollHeight > el.clientHeight ? 'scroll' : '';\n\n    Object.assign(el.style, {\n      position: 'absolute',\n      top: `-${scrollY}px`,\n      left: `-${scrollX}px`,\n      right: '0',\n      overflowY,\n      overflowX,\n    });\n    setScrollLock(true);\n  }, [elRef]);\n\n  const disableScrollLock = React.useCallback<ScrollContextInterface['disableScrollLock']>(() => {\n    const el = elRef.current;\n    if (!el) {\n      return;\n    }\n\n    const scrollY = el.style.top;\n    const scrollX = el.style.left;\n\n    clearDisableScrollStyle(el);\n    el.scrollTo(-parseInt(scrollX || '0'), -parseInt(scrollY || '0'));\n    setScrollLock(false);\n  }, [elRef]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => ({\n      getScroll,\n      scrollTo,\n      isScrollLock,\n      disableScrollLock,\n      enableScrollLock,\n      beforeScrollLockFnSetRef,\n    }),\n    [getScroll, scrollTo, isScrollLock, disableScrollLock, enableScrollLock],\n  );\n\n  return <ScrollContext.Provider value={scrollController}>{children}</ScrollContext.Provider>;\n};\n\n/**\n * Вызывает функцию effect, до блокировки прокрутки\n * @param effect функция, которая может возвращать функцию очистки\n * @param deps effect обновится только при изменении значений в списке.\n */\nexport const useScrollLockEffect = (effect: React.EffectCallback, deps: React.DependencyList) => {\n  const destructorRef = React.useRef<ReturnType<React.EffectCallback>>(noop);\n  const { isScrollLock, beforeScrollLockFnSetRef } = useScroll();\n\n  // Изменяем effectCallback только при изменении deps\n  const effectCallback = React.useCallback(() => {\n    destructorRef.current = effect();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps);\n\n  // Добавляем effectCallback в список функций, которые необходимо вызвать\n  // до блокировки\n  React.useEffect(() => {\n    const beforeSet = beforeScrollLockFnSetRef?.current;\n    if (!beforeSet) {\n      return noop;\n    }\n\n    beforeSet.add(effectCallback);\n\n    return () => {\n      beforeSet.delete(effectCallback);\n    };\n  }, [beforeScrollLockFnSetRef, effectCallback]);\n\n  // Вызываем сбрасывающую функцию, после отключения блокировки\n  React.useEffect(() => {\n    if (!isScrollLock && destructorRef.current) {\n      destructorRef.current();\n    }\n  }, [isScrollLock]);\n};\n\nexport const useScrollLock = (enabled = true) => {\n  const { enableScrollLock, disableScrollLock } = useScroll();\n  useIsomorphicLayoutEffect(() => {\n    if (enabled) {\n      enableScrollLock();\n      return disableScrollLock;\n    }\n    return noop;\n  }, [enableScrollLock, disableScrollLock, enabled]);\n};\n"],"names":["ScrollContext","useScroll","GlobalScrollController","ElementScrollController","useScrollLockEffect","useScrollLock","clearDisableScrollStyle","node","Object","assign","style","position","top","left","right","overflowY","overflowX","getPageYOffsetWithoutKeyboardHeight","window","diffOfClientHeightAndViewportHeight","document","documentElement","clientHeight","innerHeight","pageYOffset","React","createContext","getScroll","x","y","scrollTo","noop","isScrollLock","enableScrollLock","disableScrollLock","useContext","children","useDOM","useState","setScrollLock","beforeScrollLockFnSetRef","useRef","Set","useCallback","pageXOffset","clamp","body","scrollWidth","innerWidth","scrollHeight","current","forEach","fn","scrollY","scrollX","clientWidth","parseInt","scrollController","useMemo","Provider","value","elRef","scrollLeft","scrollTop","el","effect","deps","destructorRef","effectCallback","useEffect","beforeSet","add","delete","enabled","useIsomorphicLayoutEffect"],"mappings":";;;;;;;;;;;IAoCaA,aAAa;eAAbA;;IAQAC,SAAS;eAATA;;IAMAC,sBAAsB;eAAtBA;;IAqEAC,uBAAuB;eAAvBA;;IAkFAC,mBAAmB;eAAnBA;;IAiCAC,aAAa;eAAbA;;;;;2DA1OU;oBACF;oBACC;mBACC;yCACmB;AAG1C,IAAMC,0BAA0B,SAACC,MAAsB;IACrDC,OAAOC,MAAM,CAACF,KAAKG,KAAK,EAAE;QACxBC,UAAU;QACVC,KAAK;QACLC,MAAM;QACNC,OAAO;QACPC,WAAW;QACXC,WAAW;IACb;AACF;AAEA,IAAMC,sCAAsC,SAACC,QAAmB;IAC9D,2EAA2E;IAC3E,sHAAsH;IACtH,sEAAsE;IACtE,IAAMC,sCACJD,OAAOE,QAAQ,CAACC,eAAe,CAACC,YAAY,GAAGJ,OAAOK,WAAW;IACnE,OAAOL,OAAOM,WAAW,GAAGL;AAC9B;AAWO,IAAMnB,8BAAgByB,OAAMC,aAAa,CAAyB;IACvEC,WAAW;eAAO;YAAEC,GAAG;YAAGC,GAAG;QAAE;;IAC/BC,UAAUC,UAAI;IACdC,cAAc,KAAK;IACnBC,kBAAkBF,UAAI;IACtBG,mBAAmBH,UAAI;AACzB;AAEO,IAAM9B,YAAY;WAAMwB,OAAMU,UAAU,CAACnC;;AAMzC,IAAME,yBAAyB,gBAAyC;QAAtCkC,iBAAAA;IACvC,IAA6BC,UAAAA,IAAAA,WAAM,KAA3BnB,SAAqBmB,QAArBnB,QAAQE,WAAaiB,QAAbjB;IAChB,IAAsCK,iCAAAA,OAAMa,QAAQ,CAAC,KAAK,OAAnDN,eAA+BP,oBAAjBc,gBAAiBd;IACtC,IAAMe,2BAA2Bf,OAAMgB,MAAM,CAAkB,IAAIC;IAEnE,IAAMf,YAAYF,OAAMkB,WAAW,CACjC;eAAO;YACLf,GAAGV,OAAQ0B,WAAW;YACtBf,GAAGZ,oCAAoCC;QACzC;OACA;QAACA;KAAO;IAEV,IAAMY,WAAWL,OAAMkB,WAAW,CAChC,WAAkB;YAAjBf,qEAAI,GAAGC,qEAAI;QACV,8DAA8D;QAC9DX,OAAQY,QAAQ,CACdF,IAAIiB,IAAAA,WAAK,EAACjB,GAAG,GAAGR,SAAU0B,IAAI,CAACC,WAAW,GAAG7B,OAAQ8B,UAAU,IAAI,CAAC,EACpEnB,IAAIgB,IAAAA,WAAK,EAAChB,GAAG,GAAGT,SAAU0B,IAAI,CAACG,YAAY,GAAG/B,OAAQK,WAAW,IAAI,CAAC;IAE1E,GACA;QAACH;QAAUF;KAAO;IAGpB,IAAMe,mBAAmBR,OAAMkB,WAAW,CAA6C,WAAM;QAC3FH,yBAAyBU,OAAO,CAACC,OAAO,CAAC,SAACC,IAAO;YAC/CA;QACF;QAEA,IAAMC,UAAUnC,OAAQM,WAAW;QACnC,IAAM8B,UAAUpC,OAAQ0B,WAAW;QACnC,IAAM7B,YAAYG,OAAQ8B,UAAU,GAAG5B,SAAUC,eAAe,CAACkC,WAAW,GAAG,WAAW,EAAE;QAC5F,IAAMvC,YAAYE,OAAQK,WAAW,GAAGH,SAAUC,eAAe,CAACC,YAAY,GAAG,WAAW,EAAE;QAE9Fd,OAAOC,MAAM,CAACW,SAAU0B,IAAI,CAACpC,KAAK,EAAE;YAClCC,UAAU;YACVC,KAAK,AAAC,IAAW,OAARyC,SAAQ;YACjBxC,MAAM,AAAC,IAAW,OAARyC,SAAQ;YAClBxC,OAAO;YACPC,WAAAA;YACAC,WAAAA;QACF;QACAuB,cAAc,IAAI;IACpB,GAAG;QAACnB;QAAUF;KAAO;IAErB,IAAMgB,oBAAoBT,OAAMkB,WAAW,CAA8C,WAAM;QAC7F,IAAMU,UAAUjC,SAAU0B,IAAI,CAACpC,KAAK,CAACE,GAAG;QACxC,IAAM0C,UAAUlC,SAAU0B,IAAI,CAACpC,KAAK,CAACG,IAAI;QAEzCP,wBAAwBc,SAAU0B,IAAI;QACtC5B,OAAQY,QAAQ,CAAC,CAAC0B,SAASF,WAAW,MAAM,CAACE,SAASH,WAAW;QACjEd,cAAc,KAAK;IACrB,GAAG;QAACnB;QAAUF;KAAO;IAErB,IAAMuC,mBAAmBhC,OAAMiC,OAAO,CACpC;eAAO;YACL/B,WAAAA;YACAG,UAAAA;YACAE,cAAAA;YACAE,mBAAAA;YACAD,kBAAAA;YAEAO,0BAA0BA;QAC5B;OACA;QAACb;QAAWG;QAAUE;QAAcE;QAAmBD;KAAiB;IAG1E,qBAAO,qBAACjC,cAAc2D,QAAQ;QAACC,OAAOH;OAAmBrB;AAC3D;AAEO,IAAMjC,0BAA0B,gBAAgD;QAA7C0D,cAAAA,OAAOzB,iBAAAA;IAC/C,IAAsCX,iCAAAA,OAAMa,QAAQ,CAAC,KAAK,OAAnDN,eAA+BP,oBAAjBc,gBAAiBd;IACtC,IAAMe,2BAA2Bf,OAAMgB,MAAM,CAAkB,IAAIC;QAI5DmB,2BACAA;IAHP,IAAMlC,YAAYF,OAAMkB,WAAW,CACjC;YACKkB,gBACAA;QAFE,OAAA;YACLjC,GAAGiC,CAAAA,4BAAAA,CAAAA,iBAAAA,MAAMX,OAAO,cAAbW,4BAAAA,KAAAA,IAAAA,eAAeC,UAAU,cAAzBD,uCAAAA,4BAA6B,CAAC;YACjChC,GAAGgC,CAAAA,2BAAAA,CAAAA,kBAAAA,MAAMX,OAAO,cAAbW,6BAAAA,KAAAA,IAAAA,gBAAeE,SAAS,cAAxBF,sCAAAA,2BAA4B,CAAC;QAClC;OACA;QAACA;KAAM;IAET,IAAM/B,WAAWL,OAAMkB,WAAW,CAChC,WAAkB;YAAjBf,qEAAI,GAAGC,qEAAI;QACV,IAAMmC,KAAKH,MAAMX,OAAO;QACxB,8DAA8D;QAC9Dc,eAAAA,gBAAAA,KAAAA,IAAAA,GAAIlC,QAAQ,CACVF,IAAIiB,IAAAA,WAAK,EAACjB,GAAG,GAAGoC,GAAGjB,WAAW,GAAGiB,GAAGT,WAAW,IAAI,CAAC,EACpD1B,IAAIgB,IAAAA,WAAK,EAAChB,GAAG,GAAGmC,GAAGf,YAAY,GAAGe,GAAG1C,YAAY,IAAI,CAAC;IAE1D,GACA;QAACuC;KAAM;IAGT,IAAM5B,mBAAmBR,OAAMkB,WAAW,CAA6C,WAAM;QAC3F,IAAMqB,KAAKH,MAAMX,OAAO;QACxB,IAAI,CAACc,IAAI;YACP;QACF,CAAC;QACDxB,yBAAyBU,OAAO,CAACC,OAAO,CAAC,SAACC,IAAO;YAC/CA;QACF;QAEA,IAAMC,UAAUW,GAAGD,SAAS;QAC5B,IAAMT,UAAUU,GAAGF,UAAU;QAC7B,IAAM/C,YAAYiD,GAAGjB,WAAW,GAAGiB,GAAGT,WAAW,GAAG,WAAW,EAAE;QACjE,IAAMvC,YAAYgD,GAAGf,YAAY,GAAGe,GAAG1C,YAAY,GAAG,WAAW,EAAE;QAEnEd,OAAOC,MAAM,CAACuD,GAAGtD,KAAK,EAAE;YACtBC,UAAU;YACVC,KAAK,AAAC,IAAW,OAARyC,SAAQ;YACjBxC,MAAM,AAAC,IAAW,OAARyC,SAAQ;YAClBxC,OAAO;YACPC,WAAAA;YACAC,WAAAA;QACF;QACAuB,cAAc,IAAI;IACpB,GAAG;QAACsB;KAAM;IAEV,IAAM3B,oBAAoBT,OAAMkB,WAAW,CAA8C,WAAM;QAC7F,IAAMqB,KAAKH,MAAMX,OAAO;QACxB,IAAI,CAACc,IAAI;YACP;QACF,CAAC;QAED,IAAMX,UAAUW,GAAGtD,KAAK,CAACE,GAAG;QAC5B,IAAM0C,UAAUU,GAAGtD,KAAK,CAACG,IAAI;QAE7BP,wBAAwB0D;QACxBA,GAAGlC,QAAQ,CAAC,CAAC0B,SAASF,WAAW,MAAM,CAACE,SAASH,WAAW;QAC5Dd,cAAc,KAAK;IACrB,GAAG;QAACsB;KAAM;IAEV,IAAMJ,mBAAmBhC,OAAMiC,OAAO,CACpC;eAAO;YACL/B,WAAAA;YACAG,UAAAA;YACAE,cAAAA;YACAE,mBAAAA;YACAD,kBAAAA;YACAO,0BAAAA;QACF;OACA;QAACb;QAAWG;QAAUE;QAAcE;QAAmBD;KAAiB;IAG1E,qBAAO,qBAACjC,cAAc2D,QAAQ;QAACC,OAAOH;OAAmBrB;AAC3D;AAOO,IAAMhC,sBAAsB,SAAC6D,QAA8BC,MAA+B;IAC/F,IAAMC,gBAAgB1C,OAAMgB,MAAM,CAAmCV,UAAI;IACzE,IAAmD9B,aAAAA,aAA3C+B,eAA2C/B,WAA3C+B,cAAcQ,2BAA6BvC,WAA7BuC;IAEtB,oDAAoD;IACpD,IAAM4B,iBAAiB3C,OAAMkB,WAAW,CAAC,WAAM;QAC7CwB,cAAcjB,OAAO,GAAGe;IACxB,uDAAuD;IACzD,GAAGC;IAEH,wEAAwE;IACxE,gBAAgB;IAChBzC,OAAM4C,SAAS,CAAC,WAAM;QACpB,IAAMC,YAAY9B,qCAAAA,sCAAAA,KAAAA,IAAAA,yBAA0BU,OAAO;QACnD,IAAI,CAACoB,WAAW;YACd,OAAOvC,UAAI;QACb,CAAC;QAEDuC,UAAUC,GAAG,CAACH;QAEd,OAAO,WAAM;YACXE,UAAUE,MAAM,CAACJ;QACnB;IACF,GAAG;QAAC5B;QAA0B4B;KAAe;IAE7C,6DAA6D;IAC7D3C,OAAM4C,SAAS,CAAC,WAAM;QACpB,IAAI,CAACrC,gBAAgBmC,cAAcjB,OAAO,EAAE;YAC1CiB,cAAcjB,OAAO;QACvB,CAAC;IACH,GAAG;QAAClB;KAAa;AACnB;AAEO,IAAM3B,gBAAgB,WAAoB;QAAnBoE,2EAAU,IAAI;IAC1C,IAAgDxE,aAAAA,aAAxCgC,mBAAwChC,WAAxCgC,kBAAkBC,oBAAsBjC,WAAtBiC;IAC1BwC,IAAAA,oDAAyB,EAAC,WAAM;QAC9B,IAAID,SAAS;YACXxC;YACA,OAAOC;QACT,CAAC;QACD,OAAOH,UAAI;IACb,GAAG;QAACE;QAAkBC;QAAmBuC;KAAQ;AACnD"}
+{"version":3,"sources":["../../../../src/components/AppRoot/ScrollContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasChildren } from '../../types';\n\nconst clearDisableScrollStyle = (node: HTMLElement) => {\n  Object.assign(node.style, {\n    position: '',\n    top: '',\n    left: '',\n    right: '',\n    overflowY: '',\n    overflowX: '',\n  });\n};\n\nconst getPageYOffsetWithoutKeyboardHeight = (window: Window) => {\n  // Note: здесь расчёт на то, что `clientHeight` равен `window.innerHeight`.\n  //  Это достигается тем, что тегу `html` задали`height: 100%` и у него нет отступов сверху и снизу. Если есть отступы,\n  //  то надо задать `box-sizing: border-box`, чтобы они не учитывались.\n  const diffOfClientHeightAndViewportHeight =\n    window.document.documentElement.clientHeight - window.innerHeight;\n  return window.pageYOffset - diffOfClientHeightAndViewportHeight;\n};\n\nexport interface ScrollContextInterface {\n  getScroll(this: void): { x: number; y: number };\n  scrollTo(this: void, x?: number, y?: number): void;\n  isScrollLock: boolean;\n  enableScrollLock(this: void): void;\n  disableScrollLock(this: void): void;\n  beforeScrollLockFnSetRef?: React.RefObject<Set<() => void>>;\n}\n\nexport const ScrollContext = React.createContext<ScrollContextInterface>({\n  getScroll: () => ({ x: 0, y: 0 }),\n  scrollTo: noop,\n  isScrollLock: false,\n  enableScrollLock: noop,\n  disableScrollLock: noop,\n});\n\nexport const useScroll = () => React.useContext(ScrollContext);\n\nexport interface ScrollControllerProps extends HasChildren {\n  elRef: React.RefObject<HTMLElement>;\n}\n\nexport const GlobalScrollController = ({ children }: ScrollControllerProps) => {\n  const { window, document } = useDOM();\n  const [isScrollLock, setScrollLock] = React.useState(false);\n  const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());\n\n  const getScroll = React.useCallback<ScrollContextInterface['getScroll']>(\n    () => ({\n      x: window!.pageXOffset,\n      y: getPageYOffsetWithoutKeyboardHeight(window!),\n    }),\n    [window],\n  );\n  const scrollTo = React.useCallback<ScrollContextInterface['scrollTo']>(\n    (x = 0, y = 0) => {\n      // Some iOS versions do not normalize scroll — do it manually.\n      window!.scrollTo(\n        x ? clamp(x, 0, document!.body.scrollWidth - window!.innerWidth) : 0,\n        y ? clamp(y, 0, document!.body.scrollHeight - window!.innerHeight) : 0,\n      );\n    },\n    [document, window],\n  );\n\n  const enableScrollLock = React.useCallback<ScrollContextInterface['enableScrollLock']>(() => {\n    beforeScrollLockFnSetRef.current.forEach((fn) => {\n      fn();\n    });\n\n    const scrollY = window!.pageYOffset;\n    const scrollX = window!.pageXOffset;\n    const overflowY = window!.innerWidth > document!.documentElement.clientWidth ? 'scroll' : '';\n    const overflowX = window!.innerHeight > document!.documentElement.clientHeight ? 'scroll' : '';\n\n    Object.assign(document!.body.style, {\n      position: 'fixed',\n      top: `-${scrollY}px`,\n      left: `-${scrollX}px`,\n      right: '0',\n      overflowY,\n      overflowX,\n    });\n    setScrollLock(true);\n  }, [document, window]);\n\n  const disableScrollLock = React.useCallback<ScrollContextInterface['disableScrollLock']>(() => {\n    const scrollY = document!.body.style.top;\n    const scrollX = document!.body.style.left;\n\n    clearDisableScrollStyle(document!.body);\n    window!.scrollTo(-parseInt(scrollX || '0'), -parseInt(scrollY || '0'));\n    setScrollLock(false);\n  }, [document, window]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => ({\n      getScroll,\n      scrollTo,\n      isScrollLock,\n      disableScrollLock,\n      enableScrollLock,\n\n      beforeScrollLockFnSetRef: beforeScrollLockFnSetRef,\n    }),\n    [getScroll, scrollTo, isScrollLock, disableScrollLock, enableScrollLock],\n  );\n\n  return <ScrollContext.Provider value={scrollController}>{children}</ScrollContext.Provider>;\n};\n\nexport const ElementScrollController = ({ elRef, children }: ScrollControllerProps) => {\n  const [isScrollLock, setScrollLock] = React.useState(false);\n  const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());\n\n  const getScroll = React.useCallback<ScrollContextInterface['getScroll']>(\n    () => ({\n      x: elRef.current?.scrollLeft ?? 0,\n      y: elRef.current?.scrollTop ?? 0,\n    }),\n    [elRef],\n  );\n  const scrollTo = React.useCallback<ScrollContextInterface['scrollTo']>(\n    (x = 0, y = 0) => {\n      const el = elRef.current;\n      // Some iOS versions do not normalize scroll — do it manually.\n      el?.scrollTo(\n        x ? clamp(x, 0, el.scrollWidth - el.clientWidth) : 0,\n        y ? clamp(y, 0, el.scrollHeight - el.clientHeight) : 0,\n      );\n    },\n    [elRef],\n  );\n\n  const enableScrollLock = React.useCallback<ScrollContextInterface['enableScrollLock']>(() => {\n    const el = elRef.current;\n    if (!el) {\n      return;\n    }\n    beforeScrollLockFnSetRef.current.forEach((fn) => {\n      fn();\n    });\n\n    const scrollY = el.scrollTop;\n    const scrollX = el.scrollLeft;\n    const overflowY = el.scrollWidth > el.clientWidth ? 'scroll' : '';\n    const overflowX = el.scrollHeight > el.clientHeight ? 'scroll' : '';\n\n    Object.assign(el.style, {\n      position: 'absolute',\n      top: `-${scrollY}px`,\n      left: `-${scrollX}px`,\n      right: '0',\n      overflowY,\n      overflowX,\n    });\n    setScrollLock(true);\n  }, [elRef]);\n\n  const disableScrollLock = React.useCallback<ScrollContextInterface['disableScrollLock']>(() => {\n    const el = elRef.current;\n    if (!el) {\n      return;\n    }\n\n    const scrollY = el.style.top;\n    const scrollX = el.style.left;\n\n    clearDisableScrollStyle(el);\n    el.scrollTo(-parseInt(scrollX || '0'), -parseInt(scrollY || '0'));\n    setScrollLock(false);\n  }, [elRef]);\n\n  const scrollController = React.useMemo<ScrollContextInterface>(\n    () => ({\n      getScroll,\n      scrollTo,\n      isScrollLock,\n      disableScrollLock,\n      enableScrollLock,\n      beforeScrollLockFnSetRef,\n    }),\n    [getScroll, scrollTo, isScrollLock, disableScrollLock, enableScrollLock],\n  );\n\n  return <ScrollContext.Provider value={scrollController}>{children}</ScrollContext.Provider>;\n};\n\n/**\n * Вызывает функцию effect, до блокировки прокрутки\n * @param effect функция, которая может возвращать функцию очистки\n * @param deps effect обновится только при изменении значений в списке.\n */\nexport const useScrollLockEffect = (effect: React.EffectCallback, deps: React.DependencyList) => {\n  const destructorRef = React.useRef<ReturnType<React.EffectCallback>>(noop);\n  const { isScrollLock, beforeScrollLockFnSetRef } = useScroll();\n\n  // Изменяем effectCallback только при изменении deps\n  const effectCallback = React.useCallback(() => {\n    destructorRef.current = effect();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps);\n\n  // Добавляем effectCallback в список функций, которые необходимо вызвать\n  // до блокировки\n  React.useEffect(() => {\n    const beforeSet = beforeScrollLockFnSetRef?.current;\n    if (!beforeSet) {\n      return noop;\n    }\n\n    beforeSet.add(effectCallback);\n\n    return () => {\n      beforeSet.delete(effectCallback);\n    };\n  }, [beforeScrollLockFnSetRef, effectCallback]);\n\n  // Вызываем сбрасывающую функцию, после отключения блокировки\n  React.useEffect(() => {\n    if (!isScrollLock && destructorRef.current) {\n      destructorRef.current();\n    }\n  }, [isScrollLock]);\n};\n\nexport const useScrollLock = (enabled = true) => {\n  const { enableScrollLock, disableScrollLock } = useScroll();\n  useIsomorphicLayoutEffect(() => {\n    if (enabled) {\n      enableScrollLock();\n      return disableScrollLock;\n    }\n    return noop;\n  }, [enableScrollLock, disableScrollLock, enabled]);\n};\n"],"names":["ScrollContext","useScroll","GlobalScrollController","ElementScrollController","useScrollLockEffect","useScrollLock","clearDisableScrollStyle","node","Object","assign","style","position","top","left","right","overflowY","overflowX","getPageYOffsetWithoutKeyboardHeight","window","diffOfClientHeightAndViewportHeight","document","documentElement","clientHeight","innerHeight","pageYOffset","React","createContext","getScroll","x","y","scrollTo","noop","isScrollLock","enableScrollLock","disableScrollLock","useContext","children","useDOM","useState","setScrollLock","beforeScrollLockFnSetRef","useRef","Set","useCallback","pageXOffset","clamp","body","scrollWidth","innerWidth","scrollHeight","current","forEach","fn","scrollY","scrollX","clientWidth","parseInt","scrollController","useMemo","Provider","value","elRef","scrollLeft","scrollTop","el","effect","deps","destructorRef","effectCallback","useEffect","beforeSet","add","delete","enabled","useIsomorphicLayoutEffect"],"mappings":"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"}

package/dist/cjs/components/AppearanceProvider/AppearanceProvider.d.ts

@@ -7,4 +7,4 @@ export interface AppearanceProviderProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/AppearanceProvider
  */
-export declare const AppearanceProvider: ({ appearance, children }: AppearanceProviderProps) => JSX.Element;
+export declare const AppearanceProvider: ({ appearance, children }: AppearanceProviderProps) => React.JSX.Element;

package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js

@@ -8,15 +8,15 @@ Object.defineProperty(exports, "AppearanceProvider", {
         return AppearanceProvider;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _usePlatform = require("../../hooks/usePlatform");
 var _tokensClassProvider = require("../../lib/tokensClassProvider");
-var _configProviderOverride = require("../ConfigProvider/ConfigProviderOverride");
+var _ConfigProviderOverride = require("../ConfigProvider/ConfigProviderOverride");
 var AppearanceProvider = function(param) {
     var appearance = param.appearance, children = param.children;
     var platform = (0, _usePlatform.usePlatform)();
-    return /*#__PURE__*/ _react.createElement(_configProviderOverride.ConfigProviderOverride, {
+    return /*#__PURE__*/ _react.createElement(_ConfigProviderOverride.ConfigProviderOverride, {
         appearance: appearance
     }, /*#__PURE__*/ _react.createElement(_tokensClassProvider.TokensClassProvider, {
         platform: platform,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/AppearanceProvider/AppearanceProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AppearanceType } from '@vkontakte/vk-bridge';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface AppearanceProviderProps {\n  appearance: AppearanceType;\n  children: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AppearanceProvider\n */\nexport const AppearanceProvider = ({ appearance, children }: AppearanceProviderProps) => {\n  const platform = usePlatform();\n\n  return (\n    <ConfigProviderOverride appearance={appearance}>\n      <TokensClassProvider platform={platform} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderOverride>\n  );\n};\n"],"names":["AppearanceProvider","appearance","children","platform","usePlatform","ConfigProviderOverride","TokensClassProvider"],"mappings":";;;;+BAcaA;;;eAAAA;;;;2DAdU;2BAEK;mCACQ;sCACG;AAUhC,IAAMA,qBAAqB,gBAAuD;QAApDC,mBAAAA,YAAYC,iBAAAA;IAC/C,IAAMC,WAAWC,IAAAA,wBAAW;IAE5B,qBACE,qBAACC,8CAAsB;QAACJ,YAAYA;qBAClC,qBAACK,wCAAmB;QAACH,UAAUA;QAAUF,YAAYA;OAClDC;AAIT"}
+{"version":3,"sources":["../../../../src/components/AppearanceProvider/AppearanceProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AppearanceType } from '@vkontakte/vk-bridge';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface AppearanceProviderProps {\n  appearance: AppearanceType;\n  children: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/AppearanceProvider\n */\nexport const AppearanceProvider = ({ appearance, children }: AppearanceProviderProps) => {\n  const platform = usePlatform();\n\n  return (\n    <ConfigProviderOverride appearance={appearance}>\n      <TokensClassProvider platform={platform} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderOverride>\n  );\n};\n"],"names":["AppearanceProvider","appearance","children","platform","usePlatform","ConfigProviderOverride","TokensClassProvider"],"mappings":";;;;+BAcaA;;;eAAAA;;;;+DAdU;2BAEK;mCACQ;sCACG;AAUhC,IAAMA,qBAAqB;QAAGC,mBAAAA,YAAYC,iBAAAA;IAC/C,IAAMC,WAAWC,IAAAA;IAEjB,qBACE,qBAACC;QAAuBJ,YAAYA;qBAClC,qBAACK;QAAoBH,UAAUA;QAAUF,YAAYA;OAClDC;AAIT"}

package/dist/cjs/components/AspectRatio/AspectRatio.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { HasRootRef } from '../../types';
+export interface AspectRatioProps extends React.HTMLAttributes<HTMLDivElement>, HasRootRef<HTMLDivElement> {
+    className?: string;
+    /**
+     * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.
+     */
+    mode?: 'stretch' | 'none';
+    children: React.ReactNode;
+    /**
+     * Например 16 / 9, 4 / 3, 1920 / 1080
+     */
+    ratio: number;
+}
+/**
+ * `AspectRatio` позволяет поддерживать постоянное соотношение ширины и высоты.
+ * Его можно использовать для отображения изображений, карт, видео и других медиафайлов.
+ 
+ * @since 5.5.0
+ * @see https://vkcom.github.io/VKUI/#/AspectRatio
+ */
+export declare function AspectRatio({ ratio, children, mode, className, getRootRef, style: styleProp, ...props }: AspectRatioProps): JSX.Element;

package/dist/cjs/components/AspectRatio/AspectRatio.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "AspectRatio", {
+    enumerable: true,
+    get: function() {
+        return AspectRatio;
+    }
+});
+var _define_property = require("@swc/helpers/_/_define_property");
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+var _vkjs = require("@vkontakte/vkjs");
+function AspectRatio(_param) {
+    var ratio = _param.ratio, children = _param.children, _param_mode = _param.mode, mode = _param_mode === void 0 ? "stretch" : _param_mode, className = _param.className, getRootRef = _param.getRootRef, styleProp = _param.style, props = _object_without_properties._(_param, [
+        "ratio",
+        "children",
+        "mode",
+        "className",
+        "getRootRef",
+        "style"
+    ]);
+    var style = _define_property._({}, "--vkui_internal--aspect_ratio", String(ratio));
+    return /*#__PURE__*/ _react.createElement("div", _object_spread._({
+        className: (0, _vkjs.classNames)("vkuiAspectRatio", mode === "stretch" && "vkuiAspectRatio--mode-stretch", className),
+        style: _object_spread._({}, styleProp, style),
+        ref: getRootRef
+    }, props), children);
+}
+
+//# sourceMappingURL=AspectRatio.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { CSSCustomProperties, HasRootRef } from '../../types';\nimport styles from './AspectRatio.module.css';\n\nexport interface AspectRatioProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement> {\n  className?: string;\n  /**\n   * По умолчанию, вложенный контент будет растягиваться и заполнять весь блок.\n   */\n  mode?: 'stretch' | 'none';\n  children: React.ReactNode;\n  /**\n   * Например 16 / 9, 4 / 3, 1920 / 1080\n   */\n  ratio: number;\n}\n\n/**\n * `AspectRatio` позволяет поддерживать постоянное соотношение ширины и высоты.\n * Его можно использовать для отображения изображений, карт, видео и других медиафайлов.\n \n * @since 5.5.0\n * @see https://vkcom.github.io/VKUI/#/AspectRatio\n */\nexport function AspectRatio({\n  ratio,\n  children,\n  mode = 'stretch',\n  className,\n  getRootRef,\n  style: styleProp,\n  ...props\n}: AspectRatioProps): JSX.Element {\n  const style: React.CSSProperties & CSSCustomProperties = {\n    ['--vkui_internal--aspect_ratio']: String(ratio),\n  };\n\n  return (\n    <div\n      className={classNames(\n        styles.AspectRatio,\n        mode === 'stretch' && styles['AspectRatio--mode-stretch'],\n        className,\n      )}\n      style={{ ...styleProp, ...style }}\n      ref={getRootRef}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["AspectRatio","ratio","children","mode","className","getRootRef","style","styleProp","props","String","div","classNames","ref"],"mappings":";;;;+BA2BgBA;;;eAAAA;;;;;;;+DA3BO;oBACI;AA0BpB,SAASA,YAAY;QAC1BC,QAD0B,OAC1BA,OACAC,WAF0B,OAE1BA,wBAF0B,OAG1BC,MAAAA,gCAAO,yBACPC,YAJ0B,OAI1BA,WACAC,aAL0B,OAK1BA,YACAC,AAAOC,YANmB,OAM1BD,OACGE,qCAPuB;QAC1BP;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAMA,QACJ,uBAAC,iCAAkCG,OAAOR;IAG5C,qBACE,qBAACS;QACCN,WAAWO,IAAAA,qCAETR,SAAS,8CACTC;QAEFE,OAAO,qBAAKC,WAAcD;QAC1BM,KAAKP;OACDG,QAEHN;AAGP"}

package/dist/cjs/components/Avatar/Avatar.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { type ImageBaseOverlayProps, type ImageBaseProps } from '../ImageBase/ImageBase';
 import { type AvatarBadgeProps } from './AvatarBadge/AvatarBadge';
 import { type AvatarBadgeWithPresetProps } from './AvatarBadge/AvatarBadgeWithPreset';
@@ -48,8 +48,8 @@ export interface AvatarProps extends ImageBaseProps {
  * @see https://vkcom.github.io/VKUI/#/Avatar
  */
 export declare const Avatar: {
-    ({ size, className, gradientColor, initials, fallbackIcon, children, ...restProps }: AvatarProps): JSX.Element;
-    Badge: ({ className, ...restProps }: import("../ImageBase/ImageBase").ImageBaseBadgeProps) => JSX.Element;
-    BadgeWithPreset: ({ preset, className, ...restProps }: AvatarBadgeWithPresetProps) => JSX.Element;
-    Overlay: ({ className, theme: themeProp, visibility: visibilityProp, children, onClick, ...restProps }: ImageBaseOverlayProps) => JSX.Element;
+    ({ size, className, gradientColor, initials, fallbackIcon, children, ...restProps }: AvatarProps): React.JSX.Element;
+    Badge: ({ className, ...restProps }: import("../ImageBase/ImageBase").ImageBaseBadgeProps) => React.JSX.Element;
+    BadgeWithPreset: ({ preset, className, ...restProps }: AvatarBadgeWithPresetProps) => React.JSX.Element;
+    Overlay: ({ className, theme: themeProp, visibility: visibilityProp, children, onClick, ...restProps }: ImageBaseOverlayProps) => React.JSX.Element;
 };

package/dist/cjs/components/Avatar/Avatar.js

@@ -16,15 +16,15 @@ _export(exports, {
         return Avatar;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+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 _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _imageBase = require("../ImageBase/ImageBase");
-var _avatarBadge = require("./AvatarBadge/AvatarBadge");
-var _avatarBadgeWithPreset = require("./AvatarBadge/AvatarBadgeWithPreset");
+var _ImageBase = require("../ImageBase/ImageBase");
+var _AvatarBadge = require("./AvatarBadge/AvatarBadge");
+var _AvatarBadgeWithPreset = require("./AvatarBadge/AvatarBadgeWithPreset");
 var _helpers = require("./helpers");
 var AVATAR_DEFAULT_SIZE = 48;
 var COLORS_NUMBER_TO_TEXT_MAP = {
@@ -45,7 +45,7 @@ var gradientStyles = {
     "violet": "vkuiAvatar--gradient-violet"
 };
 var Avatar = function(_param) {
-    var _param_size = _param.size, size = _param_size === void 0 ? AVATAR_DEFAULT_SIZE : _param_size, className = _param.className, gradientColor = _param.gradientColor, initials = _param.initials, fallbackIcon = _param.fallbackIcon, children = _param.children, restProps = _objectWithoutProperties(_param, [
+    var _param_size = _param.size, size = _param_size === void 0 ? AVATAR_DEFAULT_SIZE : _param_size, className = _param.className, gradientColor = _param.gradientColor, initials = _param.initials, fallbackIcon = _param.fallbackIcon, children = _param.children, restProps = _object_without_properties._(_param, [
         "size",
         "className",
         "gradientColor",
@@ -56,7 +56,7 @@ var Avatar = function(_param) {
     var gradientName = typeof gradientColor === "number" ? COLORS_NUMBER_TO_TEXT_MAP[gradientColor] : gradientColor;
     var isGradientNotCustom = gradientName && gradientName !== "custom";
     var rewrittenFallbackIcon = initials ? undefined : fallbackIcon;
-    return /*#__PURE__*/ _react.createElement(_imageBase.ImageBase, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(_ImageBase.ImageBase, _object_spread_props._(_object_spread._({}, restProps), {
         size: size,
         fallbackIcon: rewrittenFallbackIcon,
         className: (0, _vkjs.classNames)("vkuiAvatar", gradientName && "vkuiAvatar--has-gradient", isGradientNotCustom && gradientStyles[gradientName], className)
@@ -67,8 +67,8 @@ var Avatar = function(_param) {
         }
     }, initials), children);
 };
-Avatar.Badge = _avatarBadge.AvatarBadge;
-Avatar.BadgeWithPreset = _avatarBadgeWithPreset.AvatarBadgeWithPreset;
-Avatar.Overlay = _imageBase.ImageBase.Overlay;
+Avatar.Badge = _AvatarBadge.AvatarBadge;
+Avatar.BadgeWithPreset = _AvatarBadgeWithPreset.AvatarBadgeWithPreset;
+Avatar.Overlay = _ImageBase.ImageBase.Overlay;
 
 //# sourceMappingURL=Avatar.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseOverlayProps, type ImageBaseProps } from '../ImageBase/ImageBase';\nimport { AvatarBadge, type AvatarBadgeProps } from './AvatarBadge/AvatarBadge';\nimport {\n  AvatarBadgeWithPreset,\n  type AvatarBadgeWithPresetProps,\n} from './AvatarBadge/AvatarBadgeWithPreset';\nimport { getInitialsFontSize } from './helpers';\nimport styles from './Avatar.module.css';\n\nexport type {\n  AvatarBadgeProps,\n  AvatarBadgeWithPresetProps,\n  ImageBaseOverlayProps as AvatarOverlayProps,\n};\n\nexport const AVATAR_DEFAULT_SIZE = 48;\n\nconst COLORS_NUMBER_TO_TEXT_MAP = {\n  1: 'red',\n  2: 'orange',\n  3: 'yellow',\n  4: 'green',\n  5: 'l-blue',\n  6: 'violet',\n} as const;\n\n/**\n * Градиенты, которые можно использовать в алгоритме поиска градиентов по числовому идентификатору пользователя.\n * @example user.id % 6 + 1\n */\nexport type InitialsAvatarNumberGradients = keyof typeof COLORS_NUMBER_TO_TEXT_MAP;\n\nexport type InitialsAvatarTextGradients =\n  | (typeof COLORS_NUMBER_TO_TEXT_MAP)[InitialsAvatarNumberGradients]\n  | 'blue';\n\nconst gradientStyles = {\n  'red': styles['Avatar--gradient-red'],\n  'orange': styles['Avatar--gradient-orange'],\n  'yellow': styles['Avatar--gradient-yellow'],\n  'green': styles['Avatar--gradient-green'],\n  'blue': styles['Avatar--gradient-blue'],\n  'l-blue': styles['Avatar--gradient-l-blue'],\n  'violet': styles['Avatar--gradient-violet'],\n};\n\nexport interface AvatarProps extends ImageBaseProps {\n  /**\n   * Инициалы пользователя.\n   *\n   * > Note: Если аватарка не прогрузится, то пользователь увидит инициалы.\n   *\n   * > ⚠️ Перебивает `fallbackIcon`.\n   */\n  initials?: string;\n  /**\n   * Задаёт градиент для фона.\n   *\n   * Если передано число, то оно будет сконвертировано в строчное представление цвета по следующей схеме:\n   *\n   * 1: 'red'\n   * 2: 'orange'\n   * 3: 'yellow'\n   * 4: 'green'\n   * 5: 'l-blue'\n   * 6: 'violet'\n   *\n   * > Если необходимо задать свой градиент, то используйте значение `\"custom\"` и определите цвет градиента либо через\n   * > свой класс в `className`, либо через `style={{ backgroundImage: \"...\" }}`.\n   */\n  gradientColor?: InitialsAvatarNumberGradients | InitialsAvatarTextGradients | 'custom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Avatar\n */\nexport const Avatar = ({\n  size = AVATAR_DEFAULT_SIZE,\n  className,\n  gradientColor,\n  initials,\n  fallbackIcon,\n  children,\n  ...restProps\n}: AvatarProps) => {\n  const gradientName =\n    typeof gradientColor === 'number' ? COLORS_NUMBER_TO_TEXT_MAP[gradientColor] : gradientColor;\n  const isGradientNotCustom = gradientName && gradientName !== 'custom';\n  const rewrittenFallbackIcon = initials ? undefined : fallbackIcon;\n\n  return (\n    <ImageBase\n      {...restProps}\n      size={size}\n      fallbackIcon={rewrittenFallbackIcon}\n      className={classNames(\n        styles['Avatar'],\n        gradientName && styles['Avatar--has-gradient'],\n        isGradientNotCustom && gradientStyles[gradientName],\n        className,\n      )}\n    >\n      {initials && (\n        <div\n          className={styles['Avatar__initials']}\n          style={{\n            fontSize: getInitialsFontSize(size),\n          }}\n        >\n          {initials}\n        </div>\n      )}\n      {children}\n    </ImageBase>\n  );\n};\n\nAvatar.Badge = AvatarBadge;\n\nAvatar.BadgeWithPreset = AvatarBadgeWithPreset;\n\nAvatar.Overlay = ImageBase.Overlay;\n"],"names":["AVATAR_DEFAULT_SIZE","Avatar","COLORS_NUMBER_TO_TEXT_MAP","gradientStyles","size","className","gradientColor","initials","fallbackIcon","children","restProps","gradientName","isGradientNotCustom","rewrittenFallbackIcon","undefined","ImageBase","classNames","div","style","fontSize","getInitialsFontSize","Badge","AvatarBadge","BadgeWithPreset","AvatarBadgeWithPreset","Overlay"],"mappings":";;;;;;;;;;;IAiBaA,mBAAmB;eAAnBA;;IA6DAC,MAAM;eAANA;;;;;;;2DA9EU;oBACI;yBACgD;2BACxB;qCAI5C;uBAC6B;AAS7B,IAAMD,sBAAsB;AAEnC,IAAME,4BAA4B;IAChC,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;AACL;AAYA,IAAMC,iBAAiB;IACrB,KAAK;IACL,QAAQ;IACR,QAAQ;IACR,OAAO;IACP,MAAM;IACN,QAAQ;IACR,QAAQ;AACV;AAgCO,IAAMF,SAAS,iBAQH;6BAPjBG,MAAAA,gCAAOJ,mCACPK,mBAAAA,WACAC,uBAAAA,eACAC,kBAAAA,UACAC,sBAAAA,cACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,eACJ,OAAOL,kBAAkB,WAAWJ,yBAAyB,CAACI,cAAc,GAAGA,aAAa;IAC9F,IAAMM,sBAAsBD,gBAAgBA,iBAAiB;IAC7D,IAAME,wBAAwBN,WAAWO,YAAYN,YAAY;IAEjE,qBACE,qBAACO,oBAAS,uCACJL;QACJN,MAAMA;QACNI,cAAcK;QACdR,WAAWW,IAAAA,gBAAU,gBAEnBL,4CACAC,uBAAuBT,cAAc,CAACQ,aAAa,EACnDN;QAGDE,0BACC,qBAACU;QACCZ,SAAS;QACTa,OAAO;YACLC,UAAUC,IAAAA,4BAAmB,EAAChB;QAChC;OAECG,WAGJE;AAGP;AAEAR,OAAOoB,KAAK,GAAGC,wBAAW;AAE1BrB,OAAOsB,eAAe,GAAGC,4CAAqB;AAE9CvB,OAAOwB,OAAO,GAAGV,oBAAS,CAACU,OAAO"}
+{"version":3,"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseOverlayProps, type ImageBaseProps } from '../ImageBase/ImageBase';\nimport { AvatarBadge, type AvatarBadgeProps } from './AvatarBadge/AvatarBadge';\nimport {\n  AvatarBadgeWithPreset,\n  type AvatarBadgeWithPresetProps,\n} from './AvatarBadge/AvatarBadgeWithPreset';\nimport { getInitialsFontSize } from './helpers';\nimport styles from './Avatar.module.css';\n\nexport type {\n  AvatarBadgeProps,\n  AvatarBadgeWithPresetProps,\n  ImageBaseOverlayProps as AvatarOverlayProps,\n};\n\nexport const AVATAR_DEFAULT_SIZE = 48;\n\nconst COLORS_NUMBER_TO_TEXT_MAP = {\n  1: 'red',\n  2: 'orange',\n  3: 'yellow',\n  4: 'green',\n  5: 'l-blue',\n  6: 'violet',\n} as const;\n\n/**\n * Градиенты, которые можно использовать в алгоритме поиска градиентов по числовому идентификатору пользователя.\n * @example user.id % 6 + 1\n */\nexport type InitialsAvatarNumberGradients = keyof typeof COLORS_NUMBER_TO_TEXT_MAP;\n\nexport type InitialsAvatarTextGradients =\n  | (typeof COLORS_NUMBER_TO_TEXT_MAP)[InitialsAvatarNumberGradients]\n  | 'blue';\n\nconst gradientStyles = {\n  'red': styles['Avatar--gradient-red'],\n  'orange': styles['Avatar--gradient-orange'],\n  'yellow': styles['Avatar--gradient-yellow'],\n  'green': styles['Avatar--gradient-green'],\n  'blue': styles['Avatar--gradient-blue'],\n  'l-blue': styles['Avatar--gradient-l-blue'],\n  'violet': styles['Avatar--gradient-violet'],\n};\n\nexport interface AvatarProps extends ImageBaseProps {\n  /**\n   * Инициалы пользователя.\n   *\n   * > Note: Если аватарка не прогрузится, то пользователь увидит инициалы.\n   *\n   * > ⚠️ Перебивает `fallbackIcon`.\n   */\n  initials?: string;\n  /**\n   * Задаёт градиент для фона.\n   *\n   * Если передано число, то оно будет сконвертировано в строчное представление цвета по следующей схеме:\n   *\n   * 1: 'red'\n   * 2: 'orange'\n   * 3: 'yellow'\n   * 4: 'green'\n   * 5: 'l-blue'\n   * 6: 'violet'\n   *\n   * > Если необходимо задать свой градиент, то используйте значение `\"custom\"` и определите цвет градиента либо через\n   * > свой класс в `className`, либо через `style={{ backgroundImage: \"...\" }}`.\n   */\n  gradientColor?: InitialsAvatarNumberGradients | InitialsAvatarTextGradients | 'custom';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Avatar\n */\nexport const Avatar = ({\n  size = AVATAR_DEFAULT_SIZE,\n  className,\n  gradientColor,\n  initials,\n  fallbackIcon,\n  children,\n  ...restProps\n}: AvatarProps) => {\n  const gradientName =\n    typeof gradientColor === 'number' ? COLORS_NUMBER_TO_TEXT_MAP[gradientColor] : gradientColor;\n  const isGradientNotCustom = gradientName && gradientName !== 'custom';\n  const rewrittenFallbackIcon = initials ? undefined : fallbackIcon;\n\n  return (\n    <ImageBase\n      {...restProps}\n      size={size}\n      fallbackIcon={rewrittenFallbackIcon}\n      className={classNames(\n        styles['Avatar'],\n        gradientName && styles['Avatar--has-gradient'],\n        isGradientNotCustom && gradientStyles[gradientName],\n        className,\n      )}\n    >\n      {initials && (\n        <div\n          className={styles['Avatar__initials']}\n          style={{\n            fontSize: getInitialsFontSize(size),\n          }}\n        >\n          {initials}\n        </div>\n      )}\n      {children}\n    </ImageBase>\n  );\n};\n\nAvatar.Badge = AvatarBadge;\n\nAvatar.BadgeWithPreset = AvatarBadgeWithPreset;\n\nAvatar.Overlay = ImageBase.Overlay;\n"],"names":["AVATAR_DEFAULT_SIZE","Avatar","COLORS_NUMBER_TO_TEXT_MAP","gradientStyles","size","className","gradientColor","initials","fallbackIcon","children","restProps","gradientName","isGradientNotCustom","rewrittenFallbackIcon","undefined","ImageBase","classNames","div","style","fontSize","getInitialsFontSize","Badge","AvatarBadge","BadgeWithPreset","AvatarBadgeWithPreset","Overlay"],"mappings":";;;;;;;;;;;IAiBaA,mBAAmB;eAAnBA;;IA6DAC,MAAM;eAANA;;;;;;;+DA9EU;oBACI;yBACgD;2BACxB;qCAI5C;uBAC6B;AAS7B,IAAMD,sBAAsB;AAEnC,IAAME,4BAA4B;IAChC,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;AACL;AAYA,IAAMC,iBAAiB;IACrB,KAAK;IACL,QAAQ;IACR,QAAQ;IACR,OAAO;IACP,MAAM;IACN,QAAQ;IACR,QAAQ;AACV;AAgCO,IAAMF,SAAS;6BACpBG,MAAAA,gCAAOJ,mCACPK,mBAAAA,WACAC,uBAAAA,eACAC,kBAAAA,UACAC,sBAAAA,cACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAME,eACJ,OAAOL,kBAAkB,WAAWJ,yBAAyB,CAACI,cAAc,GAAGA;IACjF,IAAMM,sBAAsBD,gBAAgBA,iBAAiB;IAC7D,IAAME,wBAAwBN,WAAWO,YAAYN;IAErD,qBACE,qBAACO,kEACKL;QACJN,MAAMA;QACNI,cAAcK;QACdR,WAAWW,IAAAA,gCAETL,4CACAC,uBAAuBT,cAAc,CAACQ,aAAa,EACnDN;QAGDE,0BACC,qBAACU;QACCZ,SAAS;QACTa,OAAO;YACLC,UAAUC,IAAAA,8BAAoBhB;QAChC;OAECG,WAGJE;AAGP;AAEAR,OAAOoB,QAAQC;AAEfrB,OAAOsB,kBAAkBC;AAEzBvB,OAAOwB,UAAUV,qBAAUU"}

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadge.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { type ImageBaseBadgeProps } from '../../ImageBase/ImageBase';
 export type AvatarBadgeProps = ImageBaseBadgeProps;
-export declare const AvatarBadge: ({ className, ...restProps }: AvatarBadgeProps) => JSX.Element;
+export declare const AvatarBadge: ({ className, ...restProps }: AvatarBadgeProps) => React.JSX.Element;

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadge.js

@@ -8,19 +8,19 @@ Object.defineProperty(exports, "AvatarBadge", {
         return AvatarBadge;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+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 _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _imageBase = require("../../ImageBase/ImageBase");
+var _ImageBase = require("../../ImageBase/ImageBase");
 var AvatarBadge = function(_param) {
-    var className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var className = _param.className, restProps = _object_without_properties._(_param, [
         "className"
     ]);
-    var size = _react.useContext(_imageBase.ImageBaseContext).size;
-    return /*#__PURE__*/ _react.createElement(_imageBase.ImageBase.Badge, _objectSpreadProps(_objectSpread({}, restProps), {
+    var size = _react.useContext(_ImageBase.ImageBaseContext).size;
+    return /*#__PURE__*/ _react.createElement(_ImageBase.ImageBase.Badge, _object_spread_props._(_object_spread._({}, restProps), {
         className: (0, _vkjs.classNames)("vkuiAvatarBadge", size < 96 && "vkuiAvatarBadge--shifted", className)
     }));
 };

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/AvatarBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseBadgeProps, ImageBaseContext } from '../../ImageBase/ImageBase';\nimport styles from './AvatarBadge.module.css';\n\nexport type AvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const AvatarBadge = ({ className, ...restProps }: AvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNames(\n        styles['AvatarBadge'],\n        size < 96 && styles['AvatarBadge--shifted'],\n        className,\n      )}\n    />\n  );\n};\n"],"names":["AvatarBadge","className","restProps","size","React","useContext","ImageBaseContext","ImageBase","Badge","classNames"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;;;2DAPU;oBACI;yBAC2C;AAK/D,IAAMA,cAAc,iBAAmD;QAAhDC,mBAAAA,WAAcC;QAAdD;;IAC5B,IAAM,AAAEE,OAASC,OAAMC,UAAU,CAACC,2BAAgB,EAA1CH;IACR,qBACE,qBAACI,oBAAS,CAACC,KAAK,uCACVN;QACJD,WAAWQ,IAAAA,gBAAU,qBAEnBN,OAAO,kCACPF;;AAIR"}
+{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/AvatarBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ImageBase, type ImageBaseBadgeProps, ImageBaseContext } from '../../ImageBase/ImageBase';\nimport styles from './AvatarBadge.module.css';\n\nexport type AvatarBadgeProps = ImageBaseBadgeProps;\n\nexport const AvatarBadge = ({ className, ...restProps }: AvatarBadgeProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  return (\n    <ImageBase.Badge\n      {...restProps}\n      className={classNames(\n        styles['AvatarBadge'],\n        size < 96 && styles['AvatarBadge--shifted'],\n        className,\n      )}\n    />\n  );\n};\n"],"names":["AvatarBadge","className","restProps","size","React","useContext","ImageBaseContext","ImageBase","Badge","classNames"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;;;+DAPU;oBACI;yBAC2C;AAK/D,IAAMA,cAAc;QAAGC,mBAAAA,WAAcC;QAAdD;;IAC5B,IAAM,AAAEE,OAASC,OAAMC,WAAWC,6BAA1BH;IACR,qBACE,qBAACI,qBAAUC,mDACLN;QACJD,WAAWQ,IAAAA,qCAETN,OAAO,kCACPF;;AAIR"}

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { type ImageBaseBadgeProps } from '../../ImageBase/ImageBase';
 export interface AvatarBadgeWithPresetProps extends Omit<ImageBaseBadgeProps, 'background' | 'children'> {
     /**
@@ -8,4 +8,4 @@ export interface AvatarBadgeWithPresetProps extends Omit<ImageBaseBadgeProps, 'b
      */
     preset?: 'online' | 'online-mobile';
 }
-export declare const AvatarBadgeWithPreset: ({ preset, className, ...restProps }: AvatarBadgeWithPresetProps) => JSX.Element;
+export declare const AvatarBadgeWithPreset: ({ preset, className, ...restProps }: AvatarBadgeWithPresetProps) => React.JSX.Element;

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.js

@@ -8,24 +8,24 @@ Object.defineProperty(exports, "AvatarBadgeWithPreset", {
         return AvatarBadgeWithPreset;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _object_spread = require("@swc/helpers/_/_object_spread");
+var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _imageBase = require("../../ImageBase/ImageBase");
+var _ImageBase = require("../../ImageBase/ImageBase");
 var _icons = require("./icons");
 var AvatarBadgeWithPreset = function(_param) {
-    var _param_preset = _param.preset, preset = _param_preset === void 0 ? "online" : _param_preset, className = _param.className, restProps = _objectWithoutProperties(_param, [
+    var _param_preset = _param.preset, preset = _param_preset === void 0 ? "online" : _param_preset, className = _param.className, restProps = _object_without_properties._(_param, [
         "preset",
         "className"
     ]);
-    var size = _react.useContext(_imageBase.ImageBaseContext).size;
-    var badgeSize = (0, _imageBase.getBadgeIconSizeByImageBaseSize)(size);
+    var size = _react.useContext(_ImageBase.ImageBaseContext).size;
+    var badgeSize = (0, _ImageBase.getBadgeIconSizeByImageBaseSize)(size);
     var isOnlinePreset = preset === "online";
     var presetClassName = isOnlinePreset ? "vkuiAvatarBadge--preset-online" : "vkuiAvatarBadge--preset-onlineMobile";
     var Icon = isOnlinePreset ? _icons.Icon12Circle : _icons.Icon12OnlineMobile;
-    return /*#__PURE__*/ _react.createElement(_imageBase.ImageBase.Badge, _objectSpread({
+    return /*#__PURE__*/ _react.createElement(_ImageBase.ImageBase.Badge, _object_spread._({
         background: "stroke",
         className: (0, _vkjs.classNames)("vkuiAvatarBadge", presetClassName, className)
     }, restProps), /*#__PURE__*/ _react.createElement(Icon, {

package/dist/cjs/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  getBadgeIconSizeByImageBaseSize,\n  ImageBase,\n  type ImageBaseBadgeProps,\n  ImageBaseContext,\n} from '../../ImageBase/ImageBase';\nimport { Icon12Circle, Icon12OnlineMobile } from './icons';\nimport styles from './AvatarBadge.module.css';\n\nexport interface AvatarBadgeWithPresetProps\n  extends Omit<ImageBaseBadgeProps, 'background' | 'children'> {\n  /**\n   * Использует предзаданные настройки.\n   *\n   * За каждым пресетом закреплена своя иконка и стили.\n   */\n  preset?: 'online' | 'online-mobile';\n}\n\nexport const AvatarBadgeWithPreset = ({\n  preset = 'online',\n  className,\n  ...restProps\n}: AvatarBadgeWithPresetProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  const badgeSize = getBadgeIconSizeByImageBaseSize(size);\n  const isOnlinePreset = preset === 'online';\n  const presetClassName = isOnlinePreset\n    ? styles['AvatarBadge--preset-online']\n    : styles['AvatarBadge--preset-onlineMobile'];\n  const Icon = isOnlinePreset ? Icon12Circle : Icon12OnlineMobile;\n\n  return (\n    <ImageBase.Badge\n      background=\"stroke\"\n      className={classNames(styles['AvatarBadge'], presetClassName, className)}\n      {...restProps}\n    >\n      <Icon width={badgeSize} height={badgeSize} />\n    </ImageBase.Badge>\n  );\n};\n"],"names":["AvatarBadgeWithPreset","preset","className","restProps","size","React","useContext","ImageBaseContext","badgeSize","getBadgeIconSizeByImageBaseSize","isOnlinePreset","presetClassName","Icon","Icon12Circle","Icon12OnlineMobile","ImageBase","Badge","background","classNames","width","height"],"mappings":";;;;+BAqBaA;;;eAAAA;;;;;;2DArBU;oBACI;yBAMpB;qBAC0C;AAa1C,IAAMA,wBAAwB,iBAIH;+BAHhCC,QAAAA,oCAAS,0BACTC,mBAAAA,WACGC;QAFHF;QACAC;;IAGA,IAAM,AAAEE,OAASC,OAAMC,UAAU,CAACC,2BAAgB,EAA1CH;IACR,IAAMI,YAAYC,IAAAA,0CAA+B,EAACL;IAClD,IAAMM,iBAAiBT,WAAW;IAClC,IAAMU,kBAAkBD,0FAEsB;IAC9C,IAAME,OAAOF,iBAAiBG,mBAAY,GAAGC,yBAAkB;IAE/D,qBACE,qBAACC,oBAAS,CAACC,KAAK;QACdC,YAAW;QACXf,WAAWgB,IAAAA,gBAAU,qBAAwBP,iBAAiBT;OAC1DC,0BAEJ,qBAACS;QAAKO,OAAOX;QAAWY,QAAQZ;;AAGtC"}
+{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport {\n  getBadgeIconSizeByImageBaseSize,\n  ImageBase,\n  type ImageBaseBadgeProps,\n  ImageBaseContext,\n} from '../../ImageBase/ImageBase';\nimport { Icon12Circle, Icon12OnlineMobile } from './icons';\nimport styles from './AvatarBadge.module.css';\n\nexport interface AvatarBadgeWithPresetProps\n  extends Omit<ImageBaseBadgeProps, 'background' | 'children'> {\n  /**\n   * Использует предзаданные настройки.\n   *\n   * За каждым пресетом закреплена своя иконка и стили.\n   */\n  preset?: 'online' | 'online-mobile';\n}\n\nexport const AvatarBadgeWithPreset = ({\n  preset = 'online',\n  className,\n  ...restProps\n}: AvatarBadgeWithPresetProps) => {\n  const { size } = React.useContext(ImageBaseContext);\n  const badgeSize = getBadgeIconSizeByImageBaseSize(size);\n  const isOnlinePreset = preset === 'online';\n  const presetClassName = isOnlinePreset\n    ? styles['AvatarBadge--preset-online']\n    : styles['AvatarBadge--preset-onlineMobile'];\n  const Icon = isOnlinePreset ? Icon12Circle : Icon12OnlineMobile;\n\n  return (\n    <ImageBase.Badge\n      background=\"stroke\"\n      className={classNames(styles['AvatarBadge'], presetClassName, className)}\n      {...restProps}\n    >\n      <Icon width={badgeSize} height={badgeSize} />\n    </ImageBase.Badge>\n  );\n};\n"],"names":["AvatarBadgeWithPreset","preset","className","restProps","size","React","useContext","ImageBaseContext","badgeSize","getBadgeIconSizeByImageBaseSize","isOnlinePreset","presetClassName","Icon","Icon12Circle","Icon12OnlineMobile","ImageBase","Badge","background","classNames","width","height"],"mappings":";;;;+BAqBaA;;;eAAAA;;;;;;+DArBU;oBACI;yBAMpB;qBAC0C;AAa1C,IAAMA,wBAAwB;+BACnCC,QAAAA,oCAAS,0BACTC,mBAAAA,WACGC;QAFHF;QACAC;;IAGA,IAAM,AAAEE,OAASC,OAAMC,WAAWC,6BAA1BH;IACR,IAAMI,YAAYC,IAAAA,4CAAgCL;IAClD,IAAMM,iBAAiBT,WAAW;IAClC,IAAMU,kBAAkBD;IAGxB,IAAME,OAAOF,iBAAiBG,sBAAeC;IAE7C,qBACE,qBAACC,qBAAUC;QACTC,YAAW;QACXf,WAAWgB,IAAAA,qCAAkCP,iBAAiBT;OAC1DC,0BAEJ,qBAACS;QAAKO,OAAOX;QAAWY,QAAQZ;;AAGtC"}

package/dist/cjs/components/Avatar/AvatarBadge/icons.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 import { Icon12Circle as Icon12CircleLib, Icon12OnlineMobile as Icon12OnlineMobileLib } from '@vkontakte/icons';
-export declare const Icon12Circle: ({ width, height, ...restProps }: React.ComponentProps<typeof Icon12CircleLib>) => JSX.Element;
-export declare const Icon12OnlineMobile: ({ width, height, ...restProps }: React.ComponentProps<typeof Icon12OnlineMobileLib>) => JSX.Element;
+export declare const Icon12Circle: ({ width, height, ...restProps }: React.ComponentProps<typeof Icon12CircleLib>) => React.JSX.Element;
+export declare const Icon12OnlineMobile: ({ width, height, ...restProps }: React.ComponentProps<typeof Icon12OnlineMobileLib>) => React.JSX.Element;

package/dist/cjs/components/Avatar/AvatarBadge/icons.js

@@ -16,28 +16,28 @@ _export(exports, {
         return Icon12OnlineMobile;
     }
 });
-var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
-var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
-var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
-var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+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 _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _icons = require("@vkontakte/icons");
 var Icon12Circle = function(_param) {
-    var _param_width = _param.width, width = _param_width === void 0 ? 12 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 12 : _param_height, restProps = _objectWithoutProperties(_param, [
+    var _param_width = _param.width, width = _param_width === void 0 ? 12 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 12 : _param_height, restProps = _object_without_properties._(_param, [
         "width",
         "height"
     ]);
-    return /*#__PURE__*/ _react.createElement(_icons.Icon12Circle, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(_icons.Icon12Circle, _object_spread_props._(_object_spread._({}, restProps), {
         width: width >= 24 ? 15 : 12,
         height: height >= 24 ? 15 : 12
     }));
 };
 var Icon12OnlineMobile = function(_param) {
-    var _param_width = _param.width, width = _param_width === void 0 ? 8 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 12 : _param_height, restProps = _objectWithoutProperties(_param, [
+    var _param_width = _param.width, width = _param_width === void 0 ? 8 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 12 : _param_height, restProps = _object_without_properties._(_param, [
         "width",
         "height"
     ]);
-    return /*#__PURE__*/ _react.createElement(_icons.Icon12OnlineMobile, _objectSpreadProps(_objectSpread({}, restProps), {
+    return /*#__PURE__*/ _react.createElement(_icons.Icon12OnlineMobile, _object_spread_props._(_object_spread._({}, restProps), {
         width: width >= 24 ? 9 : 8,
         height: height >= 24 ? 15 : 12
     }));

package/dist/cjs/components/Avatar/AvatarBadge/icons.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/icons.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon12Circle as Icon12CircleLib,\n  Icon12OnlineMobile as Icon12OnlineMobileLib,\n} from '@vkontakte/icons';\n\nexport const Icon12Circle = ({\n  width = 12,\n  height = 12,\n  ...restProps\n}: React.ComponentProps<typeof Icon12CircleLib>) => {\n  return (\n    <Icon12CircleLib {...restProps} width={width >= 24 ? 15 : 12} height={height >= 24 ? 15 : 12} />\n  );\n};\n\nexport const Icon12OnlineMobile = ({\n  width = 8,\n  height = 12,\n  ...restProps\n}: React.ComponentProps<typeof Icon12OnlineMobileLib>) => {\n  return (\n    <Icon12OnlineMobileLib\n      {...restProps}\n      width={width >= 24 ? 9 : 8}\n      height={height >= 24 ? 15 : 12}\n    />\n  );\n};\n"],"names":["Icon12Circle","Icon12OnlineMobile","width","height","restProps","Icon12CircleLib","Icon12OnlineMobileLib"],"mappings":";;;;;;;;;;;IAMaA,YAAY;eAAZA;;IAUAC,kBAAkB;eAAlBA;;;;;;;2DAhBU;qBAIhB;AAEA,IAAMD,eAAe,iBAIwB;8BAHlDE,OAAAA,kCAAQ,0CACRC,QAAAA,oCAAS,oBACNC;QAFHF;QACAC;;IAGA,qBACE,qBAACE,mBAAe,uCAAKD;QAAWF,OAAOA,SAAS,KAAK,KAAK,EAAE;QAAEC,QAAQA,UAAU,KAAK,KAAK,EAAE;;AAEhG;AAEO,IAAMF,qBAAqB,iBAIwB;8BAHxDC,OAAAA,kCAAQ,yCACRC,QAAAA,oCAAS,oBACNC;QAFHF;QACAC;;IAGA,qBACE,qBAACG,yBAAqB,uCAChBF;QACJF,OAAOA,SAAS,KAAK,IAAI,CAAC;QAC1BC,QAAQA,UAAU,KAAK,KAAK,EAAE;;AAGpC"}
+{"version":3,"sources":["../../../../../src/components/Avatar/AvatarBadge/icons.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon12Circle as Icon12CircleLib,\n  Icon12OnlineMobile as Icon12OnlineMobileLib,\n} from '@vkontakte/icons';\n\nexport const Icon12Circle = ({\n  width = 12,\n  height = 12,\n  ...restProps\n}: React.ComponentProps<typeof Icon12CircleLib>) => {\n  return (\n    <Icon12CircleLib {...restProps} width={width >= 24 ? 15 : 12} height={height >= 24 ? 15 : 12} />\n  );\n};\n\nexport const Icon12OnlineMobile = ({\n  width = 8,\n  height = 12,\n  ...restProps\n}: React.ComponentProps<typeof Icon12OnlineMobileLib>) => {\n  return (\n    <Icon12OnlineMobileLib\n      {...restProps}\n      width={width >= 24 ? 9 : 8}\n      height={height >= 24 ? 15 : 12}\n    />\n  );\n};\n"],"names":["Icon12Circle","Icon12OnlineMobile","width","height","restProps","Icon12CircleLib","Icon12OnlineMobileLib"],"mappings":";;;;;;;;;;;IAMaA,YAAY;eAAZA;;IAUAC,kBAAkB;eAAlBA;;;;;;;+DAhBU;qBAIhB;AAEA,IAAMD,eAAe;8BAC1BE,OAAAA,kCAAQ,0CACRC,QAAAA,oCAAS,oBACNC;QAFHF;QACAC;;IAGA,qBACE,qBAACE,iEAAoBD;QAAWF,OAAOA,SAAS,KAAK,KAAK;QAAIC,QAAQA,UAAU,KAAK,KAAK;;AAE9F;AAEO,IAAMF,qBAAqB;8BAChCC,OAAAA,kCAAQ,yCACRC,QAAAA,oCAAS,oBACNC;QAFHF;QACAC;;IAGA,qBACE,qBAACG,uEACKF;QACJF,OAAOA,SAAS,KAAK,IAAI;QACzBC,QAAQA,UAAU,KAAK,KAAK;;AAGlC"}