npm - @vkontakte/vkui - Versions diffs - 4.22.2 → 4.25.1 - Mend

@vkontakte/vkui 4.22.2 → 4.25.1

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

Files changed (2336) hide show

package/dist/cssm/components/Removable/Removable.js CHANGED Viewed

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["getRootRef", "children", "onRemove", "removePlaceholder", "align"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import { classNames } from "../../lib/classNames";
 import { getTitleFromChildren, noop } from "../../lib/utils";
 import { useExternRef } from "../../hooks/useExternRef";
@@ -12,7 +12,7 @@ import { getClassName } from "../../helpers/getClassName";
 import { useAdaptivity } from "../../hooks/useAdaptivity";
 import { useDOM } from "../../lib/dom";
 import { ANDROID, IOS, VKCOM } from "../../lib/platform";
-import { Icon24Cancel } from '@vkontakte/icons';
+import { Icon24Cancel } from "@vkontakte/icons";
 import IconButton from "../IconButton/IconButton";
 import { useGlobalEventListener } from "../../hooks/useGlobalEventListener";
 import Tappable from "../Tappable/Tappable";
@@ -34,10 +34,12 @@ var RemovableIos = function RemovableIos(_ref) {
       removeOffset = _React$useState2[0],
       updateRemoveOffset = _React$useState2[1];
-  useGlobalEventListener(window, 'click', function () {
+  useGlobalEventListener(window, "click", function () {
     if (removeOffset > 0) {
       updateRemoveOffset(0);
     }
+  }, {
+    capture: true
   });
   var onRemoveTransitionEnd = function onRemoveTransitionEnd() {
@@ -51,10 +53,11 @@ var RemovableIos = function RemovableIos(_ref) {
   var onRemoveActivateClick = function onRemoveActivateClick(e) {
     e.stopPropagation();
-    var _removeButtonRef$curr2 = removeButtonRef === null || removeButtonRef === void 0 ? void 0 : removeButtonRef.current,
-        _removeButtonRef$curr3 = _removeButtonRef$curr2.offsetWidth,
-        offsetWidth = _removeButtonRef$curr3 === void 0 ? 0 : _removeButtonRef$curr3;
+    if (!removeButtonRef.current) {
+      return;
+    }
+    var offsetWidth = removeButtonRef.current.offsetWidth;
     updateRemoveOffset(offsetWidth);
   };
@@ -96,9 +99,9 @@ export var Removable = function Removable(_ref2) {
       _ref2$onRemove = _ref2.onRemove,
       onRemove = _ref2$onRemove === void 0 ? noop : _ref2$onRemove,
       _ref2$removePlacehold = _ref2.removePlaceholder,
-      removePlaceholder = _ref2$removePlacehold === void 0 ? 'Удалить' : _ref2$removePlacehold,
+      removePlaceholder = _ref2$removePlacehold === void 0 ? "Удалить" : _ref2$removePlacehold,
       _ref2$align = _ref2.align,
-      align = _ref2$align === void 0 ? 'center' : _ref2$align,
+      align = _ref2$align === void 0 ? "center" : _ref2$align,
       restProps = _objectWithoutProperties(_ref2, _excluded);
   var platform = usePlatform();
@@ -116,7 +119,7 @@ export var Removable = function Removable(_ref2) {
   var removePlaceholderString = getTitleFromChildren(removePlaceholder);
   return createScopedElement("div", _extends({}, restProps, {
     ref: ref,
-    vkuiClass: classNames(getClassName('Removable', platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
+    vkuiClass: classNames(getClassName("Removable", platform), "Removable--".concat(align), "Removable--sizeY-".concat(sizeY))
   }), (platform === ANDROID || platform === VKCOM) && createScopedElement("div", {
     vkuiClass: "Removable__content"
   }, children, createScopedElement(IconButton, {

package/dist/cssm/components/Removable/Removable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Removable/Removable.tsx"],"names":["React","classNames","getTitleFromChildren","noop","useExternRef","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","useState","removeOffset","updateRemoveOffset","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","transform","Removable","getRootRef","onRemove","align","restProps","platform","sizeY","ref","preventDefault"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT;AACA,SAASC,oBAAT,EAA+BC,IAA/B;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,MAAT;AACA,SAASC,OAAT,EAAkBC,GAAlB,EAAuBC,KAAvB;AACA,SAASC,YAAT,QAA6B,kBAA7B;AACA,OAAOC,UAAP;AACA,SAASC,sBAAT;AACA,OAAOC,QAAP;AACA;;~~AAkBA~~,IAAMC,YAA4C,GAAG,SAA/CA,YAA+C,OAK/C;AAAA,MAJJC,aAII,QAJJA,aAII;AAAA,MAHJC,iBAGI,QAHJA,iBAGI;AAAA,MAFJC,uBAEI,QAFJA,uBAEI;AAAA,MADJC,QACI,QADJA,QACI;;AACJ,gBAAmBZ,MAAM,EAAzB;AAAA,MAAQa,MAAR,WAAQA,MAAR;;AAEA,MAAMC,eAAe,GAAGtB,KAAK,CAACuB,MAAN,~~CAAa~~,~~IAAb~~,CAAxB;;AACA,wBAA2CvB,KAAK,CAACwB,QAAN,CAAe,CAAf,CAA3C;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,kBAArB;;AAEAZ,EAAAA,sBAAsB,~~CAACO~~,~~MAAD~~,~~EAAS~~,~~OAAT~~,~~EAAkB~~,YAAM;~~AAC5C~~,QAAII,YAAY,GAAG,CAAnB,EAAsB;AACpBC,MAAAA,kBAAkB,CAAC,CAAD,CAAlB;AACD;AACF,~~GAJqB~~,CAAtB;;~~AAMA~~,MAAMC,qBAAqB,GAAG,SAAxBA,qBAAwB,GAAM;AAClC,~~QAAIF~~,YAAY,GAAG,CAAnB,EAAsB;AAAA;;AACpBH,MAAAA,eAAe,SAAf,IAAAA,eAAe,WAAf,qCAAAA,eAAe,~~CAAEM~~,OAAjB,gFAA0BC,KAA1B;AACD;AACF,GAJD;;AAMA,MAAMC,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,CAAD,EAAyB;AACrDA,IAAAA,CAAC,CAACC,eAAF;;~~AAEA~~,~~iCAA4BV~~,~~eAA5B~~,~~aAA4BA~~,~~eAA5B~~,~~uBAA4BA~~,~~eAAe,CAAEM,OAA7C~~;~~AAAA~~,~~wDAAQK~~,WAAR~~;AAAA~~,~~QAAQA~~,~~WAAR~~,~~uCAAsB~~,~~CAAtB;;AACAP~~,IAAAA,kBAAkB,~~CAACO~~,WAAD,CAAlB;AACD,~~GALD~~;;~~AAOA~~,SACE;AACE,IAAA,SAAS,EAAC,oBADZ;AAEE,IAAA,KAAK,EAAE;AAAEC,MAAAA,SAAS,~~wBAAiBT~~,YAAjB,aAAiBA,YAAjB,cAAiBA,YAAjB,GAAiC,CAAjC;AAAX,KAFT;AAGE,IAAA,eAAe,~~EAAEE~~;AAHnB,KAKE,oBAAC,UAAD;AACE,IAAA,SAAS,EAAE,KADb;AAEE,IAAA,QAAQ,EAAE,KAFZ;AAGE,~~kBAAYR~~,uBAHd;AAIE,IAAA,SAAS,EAAC,qCAJZ;AAKE,IAAA,OAAO,~~EAAEW~~,qBALX;AAME,IAAA,QAAQ,~~EAAEL~~,YAAY,GAAG;AAN3B,KAQE;AAAG,IAAA,SAAS,EAAC,sBAAb;AAAoC,IAAA,IAAI,EAAC;AAAzC,IARF,CALF,EAeGL,QAfH,EAiBE;AAAM,IAAA,SAAS,EAAC,mBAAhB;AAAoC,mBAAY;AAAhD,IAjBF,EAmBE,oBAAC,QAAD;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,SAAS,EAAE,KAFb;AAGE,IAAA,QAAQ,EAAE,KAHZ;AAIE,IAAA,QAAQ,EAAEK,YAAY,KAAK,CAJ7B;AAKE,IAAA,UAAU,EAAEH,eALd;AAME,IAAA,SAAS,EAAC,mBANZ;AAOE,IAAA,OAAO,EAAEL;AAPX,KASE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAwCC,iBAAxC,CATF,CAnBF,CADF;AAiCD,~~CA/DD~~;;~~AAwEA~~,OAAO,~~IAAMiB~~,SAAsC,GAAG,SAAzCA,SAAyC,QAO7B;AAAA,MANvBC,UAMuB,SANvBA,UAMuB;AAAA,~~MALvBhB~~,QAKuB,SALvBA,QAKuB;AAAA,~~6BAJvBiB~~,QAIuB;AAAA,MAJvBA,QAIuB,+~~BAJZlC~~,IAIY;AAAA,oCAHvBe,iBAGuB;AAAA,MAHvBA,iBAGuB,sCAHH,SAGG;AAAA,~~0BAFvBoB~~,KAEuB;AAAA,MAFvBA,KAEuB,4BAFf,QAEe;AAAA,MADpBC,SACoB;;AACvB,MAAMC,QAAQ,~~GAAGnC~~,WAAW,EAA5B;;AACA,uBAAkBE,aAAa,EAA/B;AAAA,~~MAAQkC~~,KAAR,kBAAQA,KAAR;;AAEA,MAAMC,GAAG,~~GAAGtC~~,YAAY,~~CAACgC~~,UAAD,CAAxB;;AAEA,~~MAAMnB~~,aAAa,GAAG,SAAhBA,aAAgB,~~CAACc~~,CAAD,EAAyB;AAC7CA,IAAAA,CAAC,CAACY,cAAF;AACAN,IAAAA,QAAQ,CAACN,CAAD,CAAR;AACD,GAHD;;AAKA,~~MAAMZ~~,uBAA+B,~~GAAGjB~~,oBAAoB,CAACgB,iBAAD,~~CAA5D~~;~~AAEA~~,SACE,~~wCACMqB~~,SADN;AAEE,IAAA,GAAG,EAAEG,GAFP;AAGE,IAAA,SAAS,~~EAAEzC~~,UAAU,CACnBK,YAAY,CAAC,WAAD,~~EAAckC~~,QAAd,CADO,uBAELF,KAFK,8BAGCG,KAHD;AAHvB,MASG,CAACD,QAAQ,~~KAAK/B~~,OAAb,~~IAAwB+B~~,QAAQ,~~KAAK7B~~,KAAtC,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGS,QADH,EAGE,oBAAC,UAAD;AACE,IAAA,UAAU,EAAC,SADb;AAEE,IAAA,SAAS,EAAC,SAFZ;AAGE,IAAA,SAAS,EAAC,mBAHZ;AAIE,IAAA,OAAO,EAAEH,aAJX;AAKE,kBAAYE;AALd,KAOE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAPF,CAHF,CAVJ,~~EAyBGqB~~,QAAQ,~~KAAK9B~~,GAAb,IACC,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEO,aADjB;AAEE,IAAA,iBAAiB,EAAEC,iBAFrB;AAGE,IAAA,uBAAuB,EAAEC;AAH3B,KAKGC,QALH,CA1BJ,CADF;AAqCD,~~CAzDM~~","sourcesContent":["import * as React from 'react';\nimport { HasRootRef } from '../../types';\nimport { classNames } from '../../lib/classNames';\nimport { getTitleFromChildren, noop } from '../../lib/utils';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { ANDROID, IOS, VKCOM } from '../../lib/platform';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport IconButton from '../IconButton/IconButton';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport Tappable from '../Tappable/Tappable';\nimport './Removable.css';\n\nexport interface RemovableProps {\n /*\n iOS only. Текст в выезжающей кнопке для удаления ячейки.\n /\n removePlaceholder?: React.ReactNode;\n /\n Коллбэк срабатывает при клике на контрол удаления.\n /\n onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableIosOwnProps extends Pick<RemovableProps, 'removePlaceholder'> {\n onRemoveClick?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n removePlaceholderString?: string;\n}\n\nconst RemovableIos: React.FC<RemovableIosOwnProps> = ({\n onRemoveClick,\n removePlaceholder,\n removePlaceholderString,\n children,\n}) => {\n const { window } = useDOM();\n\n const removeButtonRef = React.useRef(null);\n const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n useGlobalEventListener(window~~, '~~click', () => {\n if (removeOffset > 0) {\n updateRemoveOffset(0);\n }\n });\n\n const onRemoveTransitionEnd = () => {\n if (removeOffset > 0) {\n removeButtonRef?.current?.focus();\n }\n };\n\n const onRemoveActivateClick = (e: React.MouseEvent) => {\n e.stopPropagation();\n\n const { offsetWidth ~~= 0~~ } = removeButtonRef?.current;\n updateRemoveOffset(offsetWidth);\n };\n\n return (\n <div\n vkuiClass=\"Removable__content\"\n style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n onTransitionEnd={onRemoveTransitionEnd}\n >\n <IconButton\n hasActive={false}\n hasHover={false}\n aria-label={removePlaceholderString}\n vkuiClass=\"Removable__action Removable__toggle\"\n onClick={onRemoveActivateClick}\n disabled={removeOffset > 0}\n >\n <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n </IconButton>\n {children}\n\n <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n\n <Tappable\n Component=\"button\"\n hasActive={false}\n hasHover={false}\n disabled={removeOffset === 0}\n getRootRef={removeButtonRef}\n vkuiClass=\"Removable__remove\"\n onClick={onRemoveClick}\n >\n <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n </Tappable>\n </div>\n );\n};\n\ninterface RemovableOwnProps extends React.AllHTMLAttributes<HTMLElement>, RemovableProps, HasRootRef<HTMLDivElement> {\n /\n Расположение кнопки удаления.\n */\n align?: 'start' \| 'center';\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n getRootRef,\n children,\n onRemove = noop,\n removePlaceholder = ~~'Удалить'~~,\n align = 'center',\n ...restProps\n}: RemovableOwnProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n\n const ref = useExternRef(getRootRef);\n\n const onRemoveClick = (e: React.MouseEvent) => {\n e.preventDefault();\n onRemove(e);\n };\n\n const removePlaceholderString: string = getTitleFromChildren(removePlaceholder);\n\n return (\n <div\n {...restProps}\n ref={ref}\n vkuiClass={classNames(\n getClassName('Removable', platform),\n `Removable--${align}`,\n `Removable--sizeY-${sizeY}~~`,\~~n )}\n >\n {(platform === ANDROID \|\| platform === VKCOM) && (\n <div vkuiClass=\"Removable__content\">\n {children}\n\n <IconButton\n activeMode=\"opacity\"\n hoverMode=\"opacity\"\n vkuiClass=\"Removable__action\"\n onClick={onRemoveClick}\n aria-label={removePlaceholderString}\n >\n <Icon24Cancel role=\"presentation\" />\n </IconButton>\n </div>\n )}\n\n {platform === IOS && (\n <RemovableIos\n onRemoveClick={onRemoveClick}\n removePlaceholder={removePlaceholder}\n removePlaceholderString={removePlaceholderString}\n >\n {children}\n </RemovableIos>\n )}\n </div>\n );\n};\n"],"file":"Removable.js"}
1	+ {"version":3,"sources":["../../../../src/components/Removable/Removable.tsx"],"names":["React","classNames","getTitleFromChildren","noop","useExternRef","usePlatform","getClassName","useAdaptivity","useDOM","ANDROID","IOS","VKCOM","Icon24Cancel","IconButton","useGlobalEventListener","Tappable","RemovableIos","onRemoveClick","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","useState","removeOffset","updateRemoveOffset","capture","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","transform","Removable","getRootRef","onRemove","align","restProps","platform","sizeY","ref","preventDefault"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getTitleFromChildren, noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useDOM } from \"../../lib/dom\";\nimport { ANDROID, IOS, VKCOM } from \"../../lib/platform\";\nimport { Icon24Cancel } from \"@vkontakte/icons\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { useGlobalEventListener } from \"../../hooks/useGlobalEventListener\";\nimport Tappable from \"../Tappable/Tappable\";\nimport \"./Removable.css\";\n\nexport interface RemovableProps {\n /*\n iOS only. Текст в выезжающей кнопке для удаления ячейки.\n /\n removePlaceholder?: React.ReactNode;\n /\n Коллбэк срабатывает при клике на контрол удаления.\n /\n onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n}\n\ninterface RemovableIosOwnProps\n extends Pick<RemovableProps, \"removePlaceholder\"> {\n onRemoveClick?: (e: React.MouseEvent, rootEl?: HTMLElement) => void;\n removePlaceholderString?: string;\n}\n\nconst RemovableIos: React.FC<RemovableIosOwnProps> = ({\n onRemoveClick,\n removePlaceholder,\n removePlaceholderString,\n children,\n}) => {\n const { window } = useDOM();\n\n const removeButtonRef = React.useRef<HTMLElement>(null);\n const [removeOffset, updateRemoveOffset] = React.useState(0);\n\n useGlobalEventListener(\n window,\n \"click\",\n () => {\n if (removeOffset > 0) {\n updateRemoveOffset(0);\n }\n },\n { capture: true }\n );\n\n const onRemoveTransitionEnd = () => {\n if (removeOffset > 0) {\n removeButtonRef?.current?.focus();\n }\n };\n\n const onRemoveActivateClick = (e: React.MouseEvent) => {\n e.stopPropagation();\n if (!removeButtonRef.current) {\n return;\n }\n const { offsetWidth } = removeButtonRef.current;\n updateRemoveOffset(offsetWidth);\n };\n\n return (\n <div\n vkuiClass=\"Removable__content\"\n style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n onTransitionEnd={onRemoveTransitionEnd}\n >\n <IconButton\n hasActive={false}\n hasHover={false}\n aria-label={removePlaceholderString}\n vkuiClass=\"Removable__action Removable__toggle\"\n onClick={onRemoveActivateClick}\n disabled={removeOffset > 0}\n >\n <i vkuiClass=\"Removable__toggle-in\" role=\"presentation\" />\n </IconButton>\n {children}\n\n <span vkuiClass=\"Removable__offset\" aria-hidden=\"true\"></span>\n\n <Tappable\n Component=\"button\"\n hasActive={false}\n hasHover={false}\n disabled={removeOffset === 0}\n getRootRef={removeButtonRef}\n vkuiClass=\"Removable__remove\"\n onClick={onRemoveClick}\n >\n <span vkuiClass=\"Removable__remove-in\">{removePlaceholder}</span>\n </Tappable>\n </div>\n );\n};\n\ninterface RemovableOwnProps\n extends React.AllHTMLAttributes<HTMLElement>,\n RemovableProps,\n HasRootRef<HTMLDivElement> {\n /\n Расположение кнопки удаления.\n */\n align?: \"start\" \| \"center\";\n}\n\nexport const Removable: React.FC<RemovableOwnProps> = ({\n getRootRef,\n children,\n onRemove = noop,\n removePlaceholder = \"Удалить\",\n align = \"center\",\n ...restProps\n}: RemovableOwnProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n\n const ref = useExternRef(getRootRef);\n\n const onRemoveClick = (e: React.MouseEvent) => {\n e.preventDefault();\n onRemove(e);\n };\n\n const removePlaceholderString: string =\n getTitleFromChildren(removePlaceholder);\n\n return (\n <div\n {...restProps}\n ref={ref}\n vkuiClass={classNames(\n getClassName(\"Removable\", platform),\n `Removable--${align}`,\n `Removable--sizeY-${sizeY}`\n )}\n >\n {(platform === ANDROID \|\| platform === VKCOM) && (\n <div vkuiClass=\"Removable__content\">\n {children}\n\n <IconButton\n activeMode=\"opacity\"\n hoverMode=\"opacity\"\n vkuiClass=\"Removable__action\"\n onClick={onRemoveClick}\n aria-label={removePlaceholderString}\n >\n <Icon24Cancel role=\"presentation\" />\n </IconButton>\n </div>\n )}\n\n {platform === IOS && (\n <RemovableIos\n onRemoveClick={onRemoveClick}\n removePlaceholder={removePlaceholder}\n removePlaceholderString={removePlaceholderString}\n >\n {children}\n </RemovableIos>\n )}\n </div>\n );\n};\n"],"file":"Removable.js"}

package/dist/cssm/components/RichCell/RichCell.js CHANGED Viewed

@@ -26,8 +26,8 @@ var RichCell = function RichCell(_ref) {
   var platform = usePlatform();
   return createScopedElement(Tappable, _extends({}, restProps, {
-    vkuiClass: classNames(getClassName('RichCell', platform), {
-      'RichCell--mult': multiline
+    vkuiClass: classNames(getClassName("RichCell", platform), {
+      "RichCell--mult": multiline
     }, "RichCell--sizeY-".concat(sizeY))
   }), before, createScopedElement("div", {
     vkuiClass: "RichCell__in"
@@ -50,7 +50,8 @@ var RichCell = function RichCell(_ref) {
   }, bottom, hasReactNode(actions) && createScopedElement("div", {
     vkuiClass: "RichCell__actions"
   }, actions))));
-};
+}; // eslint-disable-next-line import/no-default-export
 export default withAdaptivity(RichCell, {
   sizeY: true

package/dist/cssm/components/RichCell/RichCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"names":["classNames","usePlatform","getClassName","Tappable","hasReactNode","Text","Subhead","withAdaptivity","RichCell","children","text","caption","before","after","bottom","actions","multiline","sizeY","restProps","platform"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;AACA,SAASC,cAAT;AACA;;AAkCA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAWpC;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,IASI,QATJA,IASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGlB,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMiB,SADN;AAEE,IAAA,SAAS,~~EACPlB~~,UAAU,~~CACRE~~,YAAY,CAAC,UAAD,EAAaiB,QAAb,~~CADJ~~,~~EAER~~;AACE,wBAAkBH;AADpB,~~KAFQ~~,~~4BAKWC~~,~~KALX~~;~~AAHd~~,~~MAYGL~~,~~MAZH~~,~~EAaE~~;AAAK,IAAA,SAAS,EAAC;AAAf,KAEGC,KAFH,EAGE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,QAAb;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCJ,QAArC,CADF,EAEGL,YAAY,CAACS,KAAD,CAAZ,~~IAAuB~~;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,~~CAF1B~~,CAHF,~~EAOGT~~,YAAY,CAACM,IAAD,CAAZ,~~IAAsB~~,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,SAAb;AAAuB,IAAA,SAAS,EAAC;AAAjC,~~KAAmDA~~,~~IAAnD~~,~~CAPzB~~,~~EAQGN~~,YAAY,CAACO,OAAD,CAAZ,~~IAAyB~~,oBAAC,OAAD;~~AAAS~~,IAAA,SAAS,EAAC,~~MAAnB~~;~~AAA0B~~,IAAA,MAAM,EAAC,~~SAAjC~~;~~AAA2C~~,IAAA,SAAS,EAAC;~~AAArD~~,~~KAA0EA~~,~~OAA1E~~,~~CAR5B~~,~~EASG~~,CAACP,YAAY,CAACU,MAAD,CAAZ,IAAwBV,YAAY,CAACW,OAAD,CAArC,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,MADH,EAEGV,YAAY,CAACW,OAAD,CAAZ,~~IAAyB~~;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,OAApC,~~CAF5B~~,~~CAVJ~~,~~CAbF~~,CADF;~~AAgCD~~,~~CA9CD;;AAgDA~~,eAAeR,cAAc,CAACC,QAAD,EAAW;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAX,CAA7B","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getClassName } from '../../helpers/getClassName';\nimport Tappable, { TappableProps } from '../Tappable/Tappable';\nimport { hasReactNode } from '../../lib/utils';\nimport Text from '../Typography/Text/Text';\nimport Subhead from '../Typography/Subhead/Subhead';\nimport { withAdaptivity } from '../../hoc/withAdaptivity';\nimport './RichCell.css';\n\nexport interface RichCellProps extends TappableProps {\n /*\n Контейнер для текста под `children`.\n /\n text?: React.ReactNode;\n /\n Контейнер для текста под `text`.\n /\n caption?: React.ReactNode;\n /\n Контейнер для контента под `caption`. Например `<UsersStack size=\"s\" />`\n /\n bottom?: React.ReactNode;\n /\n Кнопка или набор кнопок `<Button size=\"s\" />`. Располагается под `bottom`.\n /\n actions?: React.ReactNode;\n /\n `<Avatar size={48\|72} />`\n /\n before?: React.ReactNode;\n /\n Иконка 28 или текст\n /\n after?: React.ReactNode;\n /\n Убирает анимацию нажатия\n /\n disabled?: boolean;\n multiline?: boolean;\n}\n\nconst RichCell: React.FC<RichCellProps> = ({\n children,\n text,\n caption,\n before,\n after,\n bottom,\n actions,\n multiline,\n sizeY,\n ...restProps\n}) => {\n const platform = usePlatform();\n\n return (\n <Tappable\n {...restProps}\n vkuiClass={\n classNames(\n getClassName('RichCell', platform),\n {\n 'RichCell--mult': multiline,\n },\n `RichCell--sizeY-${sizeY}~~`,\~~n )\n }\n >\n {before}\n <div vkuiClass=\"RichCell__in\">\n {/ Этот after будет скрыт из верстки. Он нужен для CSS */}\n {after}\n <Text weight=\"medium\" vkuiClass=\"RichCell__content\">\n <div vkuiClass=\"RichCell__children\">{children}</div>\n {hasReactNode(after) && <div vkuiClass=\"RichCell__after\">{after}</div>}\n </Text>\n {hasReactNode(text) && <Text weight=\"regular\" vkuiClass=\"RichCell__text\">{text}</Text>}\n {hasReactNode(caption) && <Subhead Component=\"span\" weight=\"regular\" vkuiClass=\"RichCell__caption\">{caption}</Subhead>}\n {(hasReactNode(bottom) \|\| hasReactNode(actions)) && (\n <div vkuiClass=\"RichCell__bottom\">\n {bottom}\n {hasReactNode(actions) && <div vkuiClass=\"RichCell__actions\">{actions}</div>}\n </div>\n )}\n </div>\n </Tappable>\n );\n};\n\nexport default withAdaptivity(RichCell, { sizeY: true });\n"],"file":"RichCell.js"}
1	+ {"version":3,"sources":["../../../../src/components/RichCell/RichCell.tsx"],"names":["classNames","usePlatform","getClassName","Tappable","hasReactNode","Text","Subhead","withAdaptivity","RichCell","children","text","caption","before","after","bottom","actions","multiline","sizeY","restProps","platform"],"mappings":";;;;AACA,SAASA,UAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;AACA,SAASC,cAAT;AACA;;AAkCA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAWpC;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,IASI,QATJA,IASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,KAMI,QANJA,KAMI;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADDC,SACC;;AACJ,MAAMC,QAAQ,GAAGlB,WAAW,EAA5B;AAEA,SACE,oBAAC,QAAD,eACMiB,SADN;AAEE,IAAA,SAAS,EAAElB,UAAU,CACnBE,YAAY,CAAC,UAAD,EAAaiB,QAAb,CADO,EAEnB;AACE,wBAAkBH;AADpB,KAFmB,4BAKAC,KALA;AAFvB,MAUGL,MAVH,EAWE;AAAK,IAAA,SAAS,EAAC;AAAf,KAEGC,KAFH,EAGE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,QAAb;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCJ,QAArC,CADF,EAEGL,YAAY,CAACS,KAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAkCA,KAAlC,CAHJ,CAHF,EASGT,YAAY,CAACM,IAAD,CAAZ,IACC,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,SAAb;AAAuB,IAAA,SAAS,EAAC;AAAjC,KACGA,IADH,CAVJ,EAcGN,YAAY,CAACO,OAAD,CAAZ,IACC,oBAAC,OAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,OALH,CAfJ,EAuBG,CAACP,YAAY,CAACU,MAAD,CAAZ,IAAwBV,YAAY,CAACW,OAAD,CAArC,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,MADH,EAEGV,YAAY,CAACW,OAAD,CAAZ,IACC;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCA,OAApC,CAHJ,CAxBJ,CAXF,CADF;AA8CD,CA5DD,C,CA8DA;;;AACA,eAAeR,cAAc,CAACC,QAAD,EAAW;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAX,CAA7B","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport { withAdaptivity } from \"../../hoc/withAdaptivity\";\nimport \"./RichCell.css\";\n\nexport interface RichCellProps extends TappableProps {\n /*\n Контейнер для текста под `children`.\n /\n text?: React.ReactNode;\n /\n Контейнер для текста под `text`.\n /\n caption?: React.ReactNode;\n /\n Контейнер для контента под `caption`. Например `<UsersStack size=\"s\" />`\n /\n bottom?: React.ReactNode;\n /\n Кнопка или набор кнопок `<Button size=\"s\" />`. Располагается под `bottom`.\n /\n actions?: React.ReactNode;\n /\n `<Avatar size={48\|72} />`\n /\n before?: React.ReactNode;\n /\n Иконка 28 или текст\n /\n after?: React.ReactNode;\n /\n Убирает анимацию нажатия\n /\n disabled?: boolean;\n multiline?: boolean;\n}\n\nconst RichCell: React.FC<RichCellProps> = ({\n children,\n text,\n caption,\n before,\n after,\n bottom,\n actions,\n multiline,\n sizeY,\n ...restProps\n}) => {\n const platform = usePlatform();\n\n return (\n <Tappable\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"RichCell\", platform),\n {\n \"RichCell--mult\": multiline,\n },\n `RichCell--sizeY-${sizeY}`\n )}\n >\n {before}\n <div vkuiClass=\"RichCell__in\">\n {/ Этот after будет скрыт из верстки. Он нужен для CSS */}\n {after}\n <Text weight=\"medium\" vkuiClass=\"RichCell__content\">\n <div vkuiClass=\"RichCell__children\">{children}</div>\n {hasReactNode(after) && (\n <div vkuiClass=\"RichCell__after\">{after}</div>\n )}\n </Text>\n {hasReactNode(text) && (\n <Text weight=\"regular\" vkuiClass=\"RichCell__text\">\n {text}\n </Text>\n )}\n {hasReactNode(caption) && (\n <Subhead\n Component=\"span\"\n weight=\"regular\"\n vkuiClass=\"RichCell__caption\"\n >\n {caption}\n </Subhead>\n )}\n {(hasReactNode(bottom) \|\| hasReactNode(actions)) && (\n <div vkuiClass=\"RichCell__bottom\">\n {bottom}\n {hasReactNode(actions) && (\n <div vkuiClass=\"RichCell__actions\">{actions}</div>\n )}\n </div>\n )}\n </div>\n </Tappable>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(RichCell, { sizeY: true });\n"],"file":"RichCell.js"}

package/dist/cssm/components/RichTooltip/RichTooltip.css ADDED Viewed

	@@ -0,0 +1 @@
1	+ .vkuiRichTooltip{box-shadow:0 0 4px rgba(0,0,0,.04),0 4px 32px rgba(0,0,0,.16);border-radius:8px;background:#fff;background:var(--background_content);-webkit-animation:vkui-popper-fadein .2s ease;animation:vkui-popper-fadein .2s ease}.vkuiRichTooltip__arrow{color:#fff;color:var(--background_content)}

package/dist/cssm/components/RichTooltip/RichTooltip.js ADDED Viewed

@@ -0,0 +1,27 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children", "arrow"];
+import { createScopedElement } from "../../lib/jsxRuntime";
+import { HoverPopper } from "../HoverPopper/HoverPopper";
+import { getClassName } from "../../helpers/getClassName";
+import { usePlatform } from "../../hooks/usePlatform";
+import { useAppearance } from "../../hooks/useAppearance";
+import { classNames } from "../../lib/classNames";
+import { prefixClass } from "../../lib/prefixClass";
+import "./RichTooltip.css";
+export var RichTooltip = function RichTooltip(_ref) {
+  var children = _ref.children,
+      _ref$arrow = _ref.arrow,
+      arrow = _ref$arrow === void 0 ? true : _ref$arrow,
+      popperProps = _objectWithoutProperties(_ref, _excluded);
+  var platform = usePlatform();
+  var appearance = useAppearance();
+  return createScopedElement(HoverPopper, _extends({
+    vkuiClass: classNames(getClassName("RichTooltip", platform), _defineProperty({}, "RichTooltip--".concat(appearance), !!appearance)),
+    arrow: arrow,
+    arrowClassName: prefixClass("RichTooltip__arrow")
+  }, popperProps), children);
+};
+//# sourceMappingURL=RichTooltip.js.map

package/dist/cssm/components/RichTooltip/RichTooltip.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/components/RichTooltip/RichTooltip.tsx"],"names":["HoverPopper","getClassName","usePlatform","useAppearance","classNames","prefixClass","RichTooltip","children","arrow","popperProps","platform","appearance"],"mappings":";;;;;AACA,SAASA,WAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,aAAT;AACA,SAASC,UAAT;AACA,SAASC,WAAT;AACA;AAIA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAI/B;AAAA,MAHtBC,QAGsB,QAHtBA,QAGsB;AAAA,wBAFtBC,KAEsB;AAAA,MAFtBA,KAEsB,2BAFd,IAEc;AAAA,MADnBC,WACmB;;AACtB,MAAMC,QAAQ,GAAGR,WAAW,EAA5B;AACA,MAAMS,UAAU,GAAGR,aAAa,EAAhC;AAEA,SACE,oBAAC,WAAD;AACE,IAAA,SAAS,EAAEC,UAAU,CAACH,YAAY,CAAC,aAAD,EAAgBS,QAAhB,CAAb,6CACFC,UADE,GACa,CAAC,CAACA,UADf,EADvB;AAIE,IAAA,KAAK,EAAEH,KAJT;AAKE,IAAA,cAAc,EAAEH,WAAW,CAAC,oBAAD;AAL7B,KAMMI,WANN,GAQGF,QARH,CADF;AAYD,CApBM","sourcesContent":["import * as React from \"react\";\nimport { HoverPopper, HoverPopperProps } from \"../HoverPopper/HoverPopper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { useAppearance } from \"../../hooks/useAppearance\";\nimport { classNames } from \"../../lib/classNames\";\nimport { prefixClass } from \"../../lib/prefixClass\";\nimport \"./RichTooltip.css\";\n\nexport type RichTooltipProps = Omit<HoverPopperProps, \"arrowClassName\">;\n\nexport const RichTooltip: React.FC<RichTooltipProps> = ({\n children,\n arrow = true,\n ...popperProps\n}: RichTooltipProps) => {\n const platform = usePlatform();\n const appearance = useAppearance();\n\n return (\n <HoverPopper\n vkuiClass={classNames(getClassName(\"RichTooltip\", platform), {\n [`RichTooltip--${appearance}`]: !!appearance,\n })}\n arrow={arrow}\n arrowClassName={prefixClass(\"RichTooltip__arrow\")}\n {...popperProps}\n >\n {children}\n </HoverPopper>\n );\n};\n"],"file":"RichTooltip.js"}

package/dist/cssm/components/Root/Root.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiRoot{width:100%;height:100%;position:relative}.vkuiRoot--transition{pointer-events:none}.vkuiRoot__view{width:100%;height:100%;position:relative}.vkuiRoot--transition .vkuiRoot__view{position:fixed;left:0;top:0;overflow:hidden}.vkuiRoot__scrollCompensation{width:100%;height:100%}.vkuiRoot__view--show-back,.vkuiRoot__view--hide-forward{z-index:1}.vkuiRoot__view--show-forward,.vkuiRoot__view--hide-back{z-index:2}.vkuiRoot__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiRoot__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiRoot__modal:empty{display:none}.vkuiRoot--ios .vkuiRoot__view--show-back::after,.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{position:absolute;width:100%;height:100%;left:0;top:0;display:block;content:'';background-color:#000;z-index:6}.vkuiRoot--ios .vkuiRoot__view--show-back::after{-webkit-animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-back .6s var(--ios-easing);animation:vkui-root-ios-animation-show-back .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{-webkit-animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing)}@-webkit-keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@-webkit-keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@-webkit-keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.vkuiRoot--android .vkuiRoot__view--show-forward,.vkuiRoot--vkcom .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-show-forward .3s var(--android-easing);animation:vkui-root-android-animation-show-forward .3s var(--android-easing)}.vkuiRoot--android .vkuiRoot__view--hide-back,.vkuiRoot--vkcom .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-hide-back .3s var(--android-easing);animation:vkui-root-android-animation-hide-back .3s var(--android-easing)}@-webkit-keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@-webkit-keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.vkuiRoot--ios.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--android.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--vkcom.vkuiRoot--no-motion .vkuiRoot__view{-webkit-animation:none;animation:none}
1	+ .vkuiRoot{width:100%;height:100%;position:relative}.vkuiRoot--transition{pointer-events:none}.vkuiRoot__view{width:100%;height:100%;position:relative}.vkuiRoot--transition .vkuiRoot__view{position:fixed;left:0;top:0;overflow:hidden}.vkuiRoot__scrollCompensation{width:100%;height:100%}.vkuiRoot__view--show-back,.vkuiRoot__view--hide-forward{z-index:1}.vkuiRoot__view--show-forward,.vkuiRoot__view--hide-back{z-index:2}.vkuiRoot__popout{position:fixed;left:0;top:0;z-index:100;width:100%;height:100%}.vkuiRoot__modal{position:fixed;left:0;top:0;z-index:99;width:100%;height:100%}.vkuiRoot__modal:empty{display:none}.vkuiRoot--ios .vkuiRoot__view--show-back::after,.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{position:absolute;width:100%;height:100%;left:0;top:0;display:block;content:"";background-color:#000;z-index:6}.vkuiRoot--ios .vkuiRoot__view--show-back::after{-webkit-animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-back .6s var(--ios-easing);animation:vkui-root-ios-animation-show-back .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-forward::after{-webkit-animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-show-forward .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing);animation:vkui-root-ios-animation-show-forward .6s var(--ios-easing)}.vkuiRoot--ios .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);animation:vkui-root-ios-animation-hide-back .6s cubic-bezier(.36,.66,.04,1);-webkit-animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing);animation:vkui-root-ios-animation-hide-back .6s var(--ios-easing)}@-webkit-keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@keyframes vkui-root-ios-animation-show-back{0%{opacity:.3}to{opacity:0}}@-webkit-keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@keyframes vkui-root-ios-animation-hide-forward{0%{opacity:0}to{opacity:.3}}@-webkit-keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes vkui-root-ios-animation-hide-back{0%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes vkui-root-ios-animation-show-forward{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.vkuiRoot--android .vkuiRoot__view--show-forward,.vkuiRoot--vkcom .vkuiRoot__view--show-forward{-webkit-animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-show-forward .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-show-forward .3s var(--android-easing);animation:vkui-root-android-animation-show-forward .3s var(--android-easing)}.vkuiRoot--android .vkuiRoot__view--hide-back,.vkuiRoot--vkcom .vkuiRoot__view--hide-back{-webkit-animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);animation:vkui-root-android-animation-hide-back .3s cubic-bezier(.4,0,.2,1);-webkit-animation:vkui-root-android-animation-hide-back .3s var(--android-easing);animation:vkui-root-android-animation-hide-back .3s var(--android-easing)}@-webkit-keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@keyframes vkui-root-android-animation-hide-back{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}}@-webkit-keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes vkui-root-android-animation-show-forward{0%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.vkuiRoot--ios.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--android.vkuiRoot--no-motion .vkuiRoot__view,.vkuiRoot--vkcom.vkuiRoot--no-motion .vkuiRoot__view{-webkit-animation:none;animation:none}

package/dist/cssm/components/Root/Root.js CHANGED Viewed

@@ -3,7 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["popout", "modal", "children", "activeView", "onTransition", "nav"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import { classNames } from "../../lib/classNames";
 import { getClassName } from "../../helpers/getClassName";
 import { IOS } from "../../lib/platform";
@@ -19,7 +19,7 @@ import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 import { useTimeout } from "../../hooks/useTimeout";
 import { usePlatform } from "../../hooks/usePlatform";
 import "./Root.css";
-var warn = warnOnce('Root');
+var warn = warnOnce("Root");
 var Root = function Root(_ref) {
   var _ref$popout = _ref.popout,
@@ -81,19 +81,16 @@ var Root = function Root(_ref) {
     }
   };
-  var finishTransition = function finishTransition() {
+  var finishTransition = React.useCallback(function () {
     return _setState({
       activeView: activeView,
       prevView: prevView,
       isBack: isBack,
       transition: false
     });
-  };
+  }, [activeView, isBack, prevView]);
   useIsomorphicLayoutEffect(function () {
-    var _document$activeEleme;
-    (_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.blur();
+    document.activeElement.blur();
   }, [!!popout, activeView]); // Нужен переход
   useIsomorphicLayoutEffect(function () {
@@ -104,7 +101,7 @@ var Root = function Root(_ref) {
       // Закончился переход
       scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);
       onTransition && onTransition({
-        isBack: isBack,
+        isBack: Boolean(isBack),
         from: prevView,
         to: activeView
       });
@@ -118,20 +115,22 @@ var Root = function Root(_ref) {
     }
     disableAnimation ? finishTransition() : fallbackTransition.set();
-  }, [transition]);
+  }, [disableAnimation, fallbackTransition, finishTransition, transition]);
   var onAnimationEnd = function onAnimationEnd(e) {
-    if (['vkui-root-android-animation-hide-back', 'vkui-root-android-animation-show-forward', 'vkui-root-ios-animation-hide-back', 'vkui-root-ios-animation-show-forward'].includes(e.animationName)) {
+    if (["vkui-root-android-animation-hide-back", "vkui-root-android-animation-show-forward", "vkui-root-ios-animation-hide-back", "vkui-root-ios-animation-show-forward"].includes(e.animationName)) {
       finishTransition();
     }
   };
   return createScopedElement("div", _extends({}, restProps, {
-    vkuiClass: classNames(getClassName('Root', platform), {
-      'Root--transition': !disableAnimation && transition,
-      'Root--no-motion': disableAnimation
+    vkuiClass: classNames(getClassName("Root", platform), {
+      "Root--transition": !disableAnimation && transition,
+      "Root--no-motion": disableAnimation
     })
   }), views.map(function (view) {
+    var _scrolls$viewId;
     var viewId = getNavId(view.props, warn);
     if (viewId !== activeView && !(transition && viewId === prevView)) {
@@ -143,22 +142,22 @@ var Root = function Root(_ref) {
     return createScopedElement("div", {
       key: viewId,
       ref: function ref(e) {
-        return viewNodes[viewId] = e;
+        return viewId && (viewNodes[viewId] = e);
       },
-      onAnimationEnd: isTransitionTarget ? onAnimationEnd : null,
-      vkuiClass: classNames('Root__view', {
-        'Root__view--hide-back': transition && viewId === prevView && isBack,
-        'Root__view--hide-forward': transition && viewId === prevView && !isBack,
-        'Root__view--show-back': transition && viewId === activeView && isBack,
-        'Root__view--show-forward': transition && viewId === activeView && !isBack,
-        'Root__view--active': !transition && viewId === activeView
+      onAnimationEnd: isTransitionTarget ? onAnimationEnd : undefined,
+      vkuiClass: classNames("Root__view", {
+        "Root__view--hide-back": transition && viewId === prevView && isBack,
+        "Root__view--hide-forward": transition && viewId === prevView && !isBack,
+        "Root__view--show-back": transition && viewId === activeView && isBack,
+        "Root__view--show-forward": transition && viewId === activeView && !isBack,
+        "Root__view--active": !transition && viewId === activeView
       })
     }, createScopedElement(NavTransitionProvider, {
       entering: transition && viewId === activeView
     }, createScopedElement("div", {
       vkuiClass: "Root__scrollCompensation",
       style: {
-        marginTop: compensateScroll ? -scrolls[viewId] : null
+        marginTop: compensateScroll ? viewId && -((_scrolls$viewId = scrolls[viewId]) !== null && _scrolls$viewId !== void 0 ? _scrolls$viewId : 0) : undefined
       }
     }, view)));
   }), createScopedElement(AppRootPortal, null, !!popout && createScopedElement("div", {
@@ -166,7 +165,8 @@ var Root = function Root(_ref) {
   }, popout), !!modal && createScopedElement("div", {
     vkuiClass: "Root__modal"
   }, modal)));
-};
+}; // eslint-disable-next-line import/no-default-export
 export default Root;
 //# sourceMappingURL=Root.js.map

package/dist/cssm/components/Root/Root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","activeElement","blur","scrollTo","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","compensateScroll","marginTop"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNames } from '../../lib/classNames';\nimport { getClassName } from '../../helpers/getClassName';\nimport { IOS } from '../../lib/platform';\nimport { ConfigProviderContext } from '../ConfigProvider/ConfigProviderContext';\nimport { SplitColContext } from '../SplitCol/SplitCol';\nimport { AppRootPortal } from '../AppRoot/AppRootPortal';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './Root.css';\n\nconst warn = warnOnce('Root');\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n /*\n @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n \n Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n /\n popout?: React.ReactNode;\n /\n @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n \n Свойство для отрисовки `ModalRoot`.\n */\n modal?: React.ReactNode;\n}\n\nexport interface RootState {\n activeView: string;\n transition: boolean;\n isBack?: boolean;\n prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n popout = null, modal, children,\n activeView: _activeView, onTransition,\n nav,\n ...restProps\n}: RootProps) => {\n const scroll = React.useContext(ScrollContext);\n const platform = usePlatform();\n const { document } = useDOM();\n const scrolls = React.useRef<Record<string, number>>({}).current;\n const viewNodes = React.useRef<Record<string, HTMLElement>>({}).current;\n\n const { transitionMotionEnabled = true } = React.useContext(ConfigProviderContext);\n const { animate } = React.useContext(SplitColContext);\n const disableAnimation = !transitionMotionEnabled \|\| !animate;\n\n const views = React.Children.toArray(children) as React.ReactElement[];\n\n const [{ prevView, activeView, transition, isBack }, _setState] = React.useState<RootState>({\n activeView: _activeView,\n transition: false,\n });\n const transitionTo = (panel: string) => {\n if (panel !== activeView) {\n const viewIds = views.map((view) => getNavId(view.props, warn));\n const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n scrolls[activeView] = scroll.getScroll().y;\n _setState({ activeView: panel, prevView: activeView, transition: true, isBack });\n }\n };\n const finishTransition = () => _setState({ activeView, prevView, isBack, transition: false });\n\n useIsomorphicLayoutEffect(() => {\n (document.activeElement as HTMLElement)?.blur();\n }, [!!popout, activeView]);\n\n // Нужен переход\n useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n useIsomorphicLayoutEffect(() => {\n if (!transition && prevView) {\n // Закончился переход\n scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n onTransition && onTransition({ isBack, from: prevView, to: activeView });\n }\n }, [transition]);\n\n const fallbackTransition = useTimeout(finishTransition, platform === IOS ? 600 : 300);\n React.useEffect(() => {\n if (!transition) {\n fallbackTransition.clear();\n return;\n }\n disableAnimation ? finishTransition() : fallbackTransition.set();\n }, [transition]);\n\n const onAnimationEnd = (e: React.AnimationEvent) => {\n if ([\n 'vkui-root-android-animation-hide-back',\n 'vkui-root-android-animation-show-forward',\n 'vkui-root-ios-animation-hide-back',\n 'vkui-root-ios-animation-show-forward',\n ].includes(e.animationName)) {\n finishTransition();\n }\n };\n\n return (\n <div {...restProps} vkuiClass={classNames(getClassName('Root', platform), {\n 'Root--transition': !disableAnimation && transition,\n 'Root--no-motion': disableAnimation,\n })}>\n {views.map((view) => {\n const viewId = getNavId(view.props, warn);\n if (viewId !== activeView && !(transition && viewId === prevView)) {\n return null;\n }\n const isTransitionTarget = transition && viewId === (isBack ? prevView : activeView);\n const compensateScroll = transition && (viewId === prevView \|\| isBack && viewId === activeView);\n return (\n <div\n key={viewId}\n ref={(e) => viewNodes[viewId] = e}\n onAnimationEnd={isTransitionTarget ? onAnimationEnd : null}\n vkuiClass={classNames('Root__view', {\n 'Root__view--hide-back': transition && viewId === prevView && isBack,\n 'Root__view--hide-forward': transition && viewId === prevView && !isBack,\n 'Root__view--show-back': transition && viewId === activeView && isBack,\n 'Root__view--show-forward': transition && viewId === activeView && !isBack,\n 'Root__view--active': !transition && viewId === activeView,\n })}\n >\n <NavTransitionProvider entering={transition && viewId === activeView}>\n <div\n vkuiClass=\"Root__scrollCompensation\"\n style={{ marginTop: compensateScroll ? -scrolls[viewId] : null }}\n >\n {view}\n </div>\n </NavTransitionProvider>\n </div>\n );\n })}\n <AppRootPortal>\n {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n </AppRootPortal>\n </div>\n );\n};\n\nexport default Root;\n"],"file":"Root.js"}
1	+ {"version":3,"sources":["../../../../src/components/Root/Root.tsx"],"names":["React","classNames","getClassName","IOS","ConfigProviderContext","SplitColContext","AppRootPortal","ScrollContext","NavTransitionProvider","getNavId","warnOnce","useDOM","useIsomorphicLayoutEffect","useTimeout","usePlatform","warn","Root","popout","modal","children","_activeView","activeView","onTransition","nav","restProps","scroll","useContext","platform","document","scrolls","useRef","current","viewNodes","transitionMotionEnabled","animate","disableAnimation","views","Children","toArray","useState","transition","prevView","isBack","_setState","transitionTo","panel","viewIds","map","view","props","indexOf","getScroll","y","finishTransition","useCallback","activeElement","blur","scrollTo","Boolean","from","to","fallbackTransition","useEffect","clear","set","onAnimationEnd","e","includes","animationName","viewId","isTransitionTarget","compensateScroll","undefined","marginTop"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { IOS } from \"../../lib/platform\";\nimport { ConfigProviderContext } from \"../ConfigProvider/ConfigProviderContext\";\nimport { SplitColContext } from \"../SplitCol/SplitCol\";\nimport { AppRootPortal } from \"../AppRoot/AppRootPortal\";\nimport { ScrollContext } from \"../AppRoot/ScrollContext\";\nimport { NavTransitionProvider } from \"../NavTransitionContext/NavTransitionContext\";\nimport { getNavId, NavIdProps } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { useDOM } from \"../../lib/dom\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { useTimeout } from \"../../hooks/useTimeout\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Root.css\";\n\nconst warn = warnOnce(\"Root\");\n\nexport interface RootProps\n extends React.HTMLAttributes<HTMLDivElement>,\n NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n /*\n @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n \n Свойство для отрисовки `Alert`, `ActionSheet` и `ScreenSpinner`.\n /\n popout?: React.ReactNode;\n /\n @deprecated будет удалено в 5.0.0. Используйте одноименное свойство у `SplitLayout`.\n \n Свойство для отрисовки `ModalRoot`.\n */\n modal?: React.ReactNode;\n}\n\nexport interface RootState {\n activeView: string;\n transition: boolean;\n isBack?: boolean;\n prevView?: string;\n}\n\nconst Root: React.FC<RootProps> = ({\n popout = null,\n modal,\n children,\n activeView: _activeView,\n onTransition,\n nav,\n ...restProps\n}: RootProps) => {\n const scroll = React.useContext(ScrollContext);\n const platform = usePlatform();\n const { document } = useDOM();\n const scrolls = React.useRef<Record<string, number>>({}).current;\n const viewNodes = React.useRef<Record<string, HTMLElement \| null>>(\n {}\n ).current;\n\n const { transitionMotionEnabled = true } = React.useContext(\n ConfigProviderContext\n );\n const { animate } = React.useContext(SplitColContext);\n const disableAnimation = !transitionMotionEnabled \|\| !animate;\n\n const views = React.Children.toArray(children) as React.ReactElement[];\n\n const [{ prevView, activeView, transition, isBack }, _setState] =\n React.useState<RootState>({\n activeView: _activeView,\n transition: false,\n });\n const transitionTo = (panel: string) => {\n if (panel !== activeView) {\n const viewIds = views.map((view) => getNavId(view.props, warn));\n const isBack = viewIds.indexOf(panel) < viewIds.indexOf(activeView);\n scrolls[activeView] = scroll.getScroll().y;\n _setState({\n activeView: panel,\n prevView: activeView,\n transition: true,\n isBack,\n });\n }\n };\n const finishTransition = React.useCallback(\n () => _setState({ activeView, prevView, isBack, transition: false }),\n [activeView, isBack, prevView]\n );\n\n useIsomorphicLayoutEffect(() => {\n (document!.activeElement as HTMLElement).blur();\n }, [!!popout, activeView]);\n\n // Нужен переход\n useIsomorphicLayoutEffect(() => transitionTo(_activeView), [_activeView]);\n useIsomorphicLayoutEffect(() => {\n if (!transition && prevView) {\n // Закончился переход\n scroll.scrollTo(0, isBack ? scrolls[activeView] : 0);\n onTransition &&\n onTransition({\n isBack: Boolean(isBack),\n from: prevView,\n to: activeView,\n });\n }\n }, [transition]);\n\n const fallbackTransition = useTimeout(\n finishTransition,\n platform === IOS ? 600 : 300\n );\n React.useEffect(() => {\n if (!transition) {\n fallbackTransition.clear();\n return;\n }\n disableAnimation ? finishTransition() : fallbackTransition.set();\n }, [disableAnimation, fallbackTransition, finishTransition, transition]);\n\n const onAnimationEnd = (e: React.AnimationEvent) => {\n if (\n [\n \"vkui-root-android-animation-hide-back\",\n \"vkui-root-android-animation-show-forward\",\n \"vkui-root-ios-animation-hide-back\",\n \"vkui-root-ios-animation-show-forward\",\n ].includes(e.animationName)\n ) {\n finishTransition();\n }\n };\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(getClassName(\"Root\", platform), {\n \"Root--transition\": !disableAnimation && transition,\n \"Root--no-motion\": disableAnimation,\n })}\n >\n {views.map((view) => {\n const viewId = getNavId(view.props, warn);\n if (viewId !== activeView && !(transition && viewId === prevView)) {\n return null;\n }\n const isTransitionTarget =\n transition && viewId === (isBack ? prevView : activeView);\n const compensateScroll =\n transition &&\n (viewId === prevView \|\| (isBack && viewId === activeView));\n return (\n <div\n key={viewId}\n ref={(e) => viewId && (viewNodes[viewId] = e)}\n onAnimationEnd={isTransitionTarget ? onAnimationEnd : undefined}\n vkuiClass={classNames(\"Root__view\", {\n \"Root__view--hide-back\":\n transition && viewId === prevView && isBack,\n \"Root__view--hide-forward\":\n transition && viewId === prevView && !isBack,\n \"Root__view--show-back\":\n transition && viewId === activeView && isBack,\n \"Root__view--show-forward\":\n transition && viewId === activeView && !isBack,\n \"Root__view--active\": !transition && viewId === activeView,\n })}\n >\n <NavTransitionProvider\n entering={transition && viewId === activeView}\n >\n <div\n vkuiClass=\"Root__scrollCompensation\"\n style={{\n marginTop: compensateScroll\n ? viewId && -(scrolls[viewId] ?? 0)\n : undefined,\n }}\n >\n {view}\n </div>\n </NavTransitionProvider>\n </div>\n );\n })}\n <AppRootPortal>\n {!!popout && <div vkuiClass=\"Root__popout\">{popout}</div>}\n {!!modal && <div vkuiClass=\"Root__modal\">{modal}</div>}\n </AppRootPortal>\n </div>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Root;\n"],"file":"Root.js"}

package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js CHANGED Viewed

@@ -16,7 +16,7 @@ var ScreenSpinner = function ScreenSpinner(props) {
   var platform = usePlatform();
   return createScopedElement(PopoutWrapper, {
     hasMask: false,
-    vkuiClass: getClassName('ScreenSpinner', platform),
+    vkuiClass: getClassName("ScreenSpinner", platform),
     className: className,
     style: style
   }, createScopedElement("div", {
@@ -27,8 +27,9 @@ var ScreenSpinner = function ScreenSpinner(props) {
 };
 ScreenSpinner.defaultProps = {
-  'size': 'large',
-  'aria-label': 'Пожалуйста, подождите...'
-};
+  size: "large",
+  "aria-label": "Пожалуйста, подождите..."
+}; // eslint-disable-next-line import/no-default-export
 export default ScreenSpinner;
 //# sourceMappingURL=ScreenSpinner.js.map

package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":["Spinner","PopoutWrapper","getClassName","usePlatform","ScreenSpinner","props","style","className","restProps","platform","defaultProps"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,aAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA;;~~AAIA~~,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,~~CAACC~~,~~KAAD~~,~~EAA+B~~;~~AACjF~~,MAAQC,KAAR,GAA2CD,KAA3C,CAAQC,KAAR;AAAA,MAAeC,SAAf,GAA2CF,KAA3C,CAAeE,SAAf;AAAA,MAA6BC,SAA7B,4BAA2CH,KAA3C;;AACA,MAAMI,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,oBAAC,aAAD;AACE,IAAA,OAAO,EAAE,KADX;AAEE,IAAA,SAAS,EAAED,YAAY,CAAC,eAAD,EAAkBO,QAAlB,CAFzB;AAGE,IAAA,SAAS,EAAEF,SAHb;AAIE,IAAA,KAAK,EAAED;AAJT,KAME;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAgDE,SAAhD,EADF,CANF,CADF;AAYD,~~CAhBD~~;;~~AAkBAJ~~,aAAa,CAACM,YAAd,GAA6B;~~AAC3B~~,~~UAAQ~~,~~OADmB~~;AAE3B,gBAAc;AAFa,CAA7B~~;AAKA~~,~~eAAeN~~,aAAf","sourcesContent":["import * as React from 'react';\nimport Spinner, { SpinnerProps } from '../Spinner/Spinner';\nimport { PopoutWrapper } from '../PopoutWrapper/PopoutWrapper';\nimport { getClassName } from '../../helpers/getClassName';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport './ScreenSpinner.css';\n\nexport type ScreenSpinnerProps = React.HTMLAttributes<HTMLDivElement> & SpinnerProps;\n\nconst ScreenSpinner: React.FC<ScreenSpinnerProps> = (props: ScreenSpinnerProps) => {\n const { style, className, ...restProps } = props;\n const platform = usePlatform();\n\n return (\n <PopoutWrapper\n hasMask={false}\n vkuiClass={getClassName('ScreenSpinner', platform)}\n className={className}\n style={style}\n >\n <div vkuiClass=\"ScreenSpinner__container\">\n <Spinner vkuiClass=\"ScreenSpinner__spinner\" {...restProps} />\n </div>\n </PopoutWrapper>\n );\n};\n\nScreenSpinner.defaultProps = {\n 'size': 'large',\n 'aria-label': 'Пожалуйста, ~~подождите...'~~,\n};\n\nexport default ScreenSpinner;\n"],"file":"ScreenSpinner.js"}
1	+ {"version":3,"sources":["../../../../src/components/ScreenSpinner/ScreenSpinner.tsx"],"names":["Spinner","PopoutWrapper","getClassName","usePlatform","ScreenSpinner","props","style","className","restProps","platform","defaultProps","size"],"mappings":";;;;AACA,OAAOA,OAAP;AACA,SAASC,aAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA;;AAKA,IAAMC,aAA2C,GAAG,SAA9CA,aAA8C,CAClDC,KADkD,EAE/C;AACH,MAAQC,KAAR,GAA2CD,KAA3C,CAAQC,KAAR;AAAA,MAAeC,SAAf,GAA2CF,KAA3C,CAAeE,SAAf;AAAA,MAA6BC,SAA7B,4BAA2CH,KAA3C;;AACA,MAAMI,QAAQ,GAAGN,WAAW,EAA5B;AAEA,SACE,oBAAC,aAAD;AACE,IAAA,OAAO,EAAE,KADX;AAEE,IAAA,SAAS,EAAED,YAAY,CAAC,eAAD,EAAkBO,QAAlB,CAFzB;AAGE,IAAA,SAAS,EAAEF,SAHb;AAIE,IAAA,KAAK,EAAED;AAJT,KAME;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KAAgDE,SAAhD,EADF,CANF,CADF;AAYD,CAlBD;;AAoBAJ,aAAa,CAACM,YAAd,GAA6B;AAC3BC,EAAAA,IAAI,EAAE,OADqB;AAE3B,gBAAc;AAFa,CAA7B,C,CAKA;;AACA,eAAeP,aAAf","sourcesContent":["import * as React from \"react\";\nimport Spinner, { SpinnerProps } from \"../Spinner/Spinner\";\nimport { PopoutWrapper } from \"../PopoutWrapper/PopoutWrapper\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./ScreenSpinner.css\";\n\nexport type ScreenSpinnerProps = React.HTMLAttributes<HTMLDivElement> &\n SpinnerProps;\n\nconst ScreenSpinner: React.FC<ScreenSpinnerProps> = (\n props: ScreenSpinnerProps\n) => {\n const { style, className, ...restProps } = props;\n const platform = usePlatform();\n\n return (\n <PopoutWrapper\n hasMask={false}\n vkuiClass={getClassName(\"ScreenSpinner\", platform)}\n className={className}\n style={style}\n >\n <div vkuiClass=\"ScreenSpinner__container\">\n <Spinner vkuiClass=\"ScreenSpinner__spinner\" {...restProps} />\n </div>\n </PopoutWrapper>\n );\n};\n\nScreenSpinner.defaultProps = {\n size: \"large\",\n \"aria-label\": \"Пожалуйста, подождите...\",\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default ScreenSpinner;\n"],"file":"ScreenSpinner.js"}

package/dist/cssm/components/Search/Search.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiSearch{overflow:hidden;font-weight:400;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);line-height:normal}.vkuiSearch__in{position:relative}.vkuiSearch__width{height:36px;height:var(--search_default_height);white-space:nowrap;color:transparent;width:10000px}.vkuiSearch__control{display:flex;justify-content:flex-start;align-items:center;position:absolute;left:0;top:0;width:calc(100% - 1px);height:100%;border-radius:10px}.vkuiSearch__input{-webkit-appearance:none;border:0;margin:0;height:36px;height:var(--search_default_height);position:relative;padding:0 22px 0 36px;box-sizing:border-box;font-size:17px;border-radius:10px;max-width:100%;flex-grow:1;min-width:0;background-color:transparent;z-index:2;color:#000;color:var(--text_primary)}.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch--has-after .vkuiSearch__input{border-radius:10px 0 0 10px}.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__placeholder,.vkuiSearch--has-icon .vkuiSearch__placeholder{padding-right:40px}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__placeholder{padding-right:80px}.vkuiSearch__after-width{font-size:17px;height:36px;height:var(--search_default_height);line-height:36px;line-height:var(--search_default_height);padding-left:12px;padding-right:4px;flex-shrink:0;pointer-events:none;cursor:text}.vkuiSearch__placeholder{position:absolute;left:0;width:100%;cursor:text;z-index:1;text-align:left;height:36px;height:var(--search_default_height);font-size:0;padding-left:12px;padding-right:22px;pointer-events:none;box-sizing:border-box;display:flex}.vkuiSearch__placeholder-in{height:36px;height:var(--search_default_height);display:flex;align-items:center;overflow:hidden;flex-grow:1;max-width:100%}.vkuiSearch__placeholder-text{margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vkuiSearch--has-value .vkuiSearch__placeholder-text{opacity:0}.vkuiSearch__icons{position:absolute;right:100%;top:0;display:flex;align-items:center;justify-content:center;color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__icon{width:40px;height:36px;height:var(--search_default_height);display:flex;align-items:center;justify-content:center}.vkuiSearch__after{position:absolute;left:100%;top:0;line-height:36px;line-height:var(--search_default_height);z-index:2;-webkit-transform:translate(0);transform:translate(0);transition:-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1),-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing),-webkit-transform .3s var(--ios-easing);cursor:default}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{-webkit-transform:translate(-100%);transform:translate(-100%)}.vkuiSearch__after::before{position:absolute;right:calc(100% - 1px);display:block;height:100%;width:10px;content:'';pointer-events:none}.vkuiSearch__after-in{position:relative;z-index:2;cursor:pointer;font-size:17px;padding-left:12px;padding-right:4px}.vkuiSearch__after::after{position:absolute;right:100%;display:block;height:100%;width:10px;content:'';top:0;border-radius:0 10px 10px 0;cursor:text;pointer-events:none}.vkuiGroup--plain .vkuiSearch{padding-top:4px}.vkuiSearch{background:#fff;background:var(--search_bar_background)}.vkuiSearch__control{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiSearch__placeholder{color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__after-width{background:#ebedf0;background:var(--search_bar_field_background);color:#ebedf0;color:var(--search_bar_field_background)}.vkuiSearch__after{background:#fff;background:var(--search_bar_background);color:#2688eb;color:var(--accent)}.vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__after::before{background-color:#fff;background-color:var(--search_bar_background)}.vkuiPanelHeader .vkuiSearch{background:#fff;background:var(--header_background)}.vkuiPanelHeader .vkuiSearch__control{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiPanelHeader .vkuiSearch__placeholder{color:#818c99;color:var(--header_search_field_tint)}.vkuiPanelHeader .vkuiSearch__after-width{background:#ebedf0;background:var(--header_search_field_background);color:#ebedf0;color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after{background:#fff;background:var(--header_background);color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader .vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after::before{background-color:#fff;background-color:var(--header_background)}.vkuiSearch--ios{padding:8px 12px}.vkuiSearch--android{padding:8px 16px}.vkuiSearch--vkcom,.vkuiPanelHeader--vkcom .vkuiSearch{background:0 0}.vkuiSearch--vkcom .vkuiSearch__in{padding-top:6px;padding-bottom:6px}.vkuiSearch--vkcom .vkuiSearch__input{font-size:15px;line-height:20px;padding-left:40px}.vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:16px}.vkuiSearch--vkcom .vkuiSearch__icons{top:4px;right:calc(100% + 8px)}.vkuiSearch--vkcom.vkuiSearch--has-value .vkuiSearch__input{padding-right:56px}.vkuiSearch--vkcom.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{padding-right:92px}.vkuiSearch--vkcom .vkuiSearch__icon{width:40px;height:40px}.vkuiSearch--vkcom .vkuiSearch__icon:hover{background-color:rgba(0,0,0,.04);background-color:var(--background_hover);border-radius:50%}.vkuiSearch--vkcom .vkuiSearch__control{background-color:transparent}.vkuiPanelHeader--vkcom .vkuiSearch__separator{display:none}.vkuiSearch--vkcom .vkuiSearch__separator{color:#e1e3e6;color:var(--input_border)}.vkuiGroup--card .vkuiSearch--vkcom{margin:0 -8px}.vkuiGroup--card .vkuiSearch--vkcom:first-child{margin-top:-8px}.vkuiGroup--card .vkuiSearch--vkcom:not(:last-child){margin-bottom:8px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:20px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__input{padding-left:44px}
1	+ .vkuiSearch{overflow:hidden;font-weight:400;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--font-common);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);line-height:normal}.vkuiSearch__in{position:relative}.vkuiSearch__width{height:36px;height:var(--search_default_height);white-space:nowrap;color:transparent;width:10000px}.vkuiSearch__control{display:flex;justify-content:flex-start;align-items:center;position:absolute;left:0;top:0;width:calc(100% - 1px);height:100%;border-radius:10px}.vkuiSearch__input{-webkit-appearance:none;border:0;margin:0;height:36px;height:var(--search_default_height);position:relative;padding:0 22px 0 36px;box-sizing:border-box;font-size:17px;border-radius:10px;max-width:100%;flex-grow:1;min-width:0;background-color:transparent;z-index:2;color:#000;color:var(--text_primary)}.vkuiSearch__input::-webkit-search-decoration,.vkuiSearch__input::-webkit-search-cancel-button,.vkuiSearch__input::-webkit-search-results-button,.vkuiSearch__input::-webkit-search-results-decoration{display:none}.vkuiSearch--has-after .vkuiSearch__input{border-radius:10px 0 0 10px}.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon .vkuiSearch__input,.vkuiSearch--has-value .vkuiSearch__placeholder,.vkuiSearch--has-icon .vkuiSearch__placeholder{padding-right:40px}.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input,.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__placeholder{padding-right:80px}.vkuiSearch__after-width{font-size:17px;height:36px;height:var(--search_default_height);line-height:36px;line-height:var(--search_default_height);padding-left:12px;padding-right:4px;flex-shrink:0;pointer-events:none;cursor:text}.vkuiSearch__placeholder{position:absolute;left:0;width:100%;cursor:text;z-index:1;text-align:left;height:36px;height:var(--search_default_height);font-size:0;padding-left:12px;padding-right:22px;pointer-events:none;box-sizing:border-box;display:flex}.vkuiSearch__placeholder-in{height:36px;height:var(--search_default_height);display:flex;align-items:center;overflow:hidden;flex-grow:1;max-width:100%}.vkuiSearch__placeholder-text{margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vkuiSearch--has-value .vkuiSearch__placeholder-text{opacity:0}.vkuiSearch__icons{position:absolute;right:100%;top:0;display:flex;align-items:center;justify-content:center;color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__icon{width:40px;height:36px;height:var(--search_default_height);display:flex;align-items:center;justify-content:center}.vkuiSearch__after{position:absolute;left:100%;top:0;line-height:36px;line-height:var(--search_default_height);z-index:2;-webkit-transform:translate(0);transform:translate(0);transition:-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1);transition:transform .3s cubic-bezier(.36,.66,.04,1),-webkit-transform .3s cubic-bezier(.36,.66,.04,1);transition:-webkit-transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing);transition:transform .3s var(--ios-easing),-webkit-transform .3s var(--ios-easing);cursor:default}.vkuiSearch--focused .vkuiSearch__after,.vkuiSearch--has-value .vkuiSearch__after{-webkit-transform:translate(-100%);transform:translate(-100%)}.vkuiSearch__after::before{position:absolute;right:calc(100% - 1px);display:block;height:100%;width:10px;content:"";pointer-events:none}.vkuiSearch__after-in{position:relative;z-index:2;cursor:pointer;font-size:17px;padding-left:12px;padding-right:4px}.vkuiSearch__after::after{position:absolute;right:100%;display:block;height:100%;width:10px;content:"";top:0;border-radius:0 10px 10px 0;cursor:text;pointer-events:none}.vkuiGroup--plain .vkuiSearch{padding-top:4px}.vkuiSearch{background:#fff;background:var(--search_bar_background)}.vkuiSearch__control{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiSearch__placeholder{color:#818c99;color:var(--search_bar_field_tint)}.vkuiSearch__after-width{background:#ebedf0;background:var(--search_bar_field_background);color:#ebedf0;color:var(--search_bar_field_background)}.vkuiSearch__after{background:#fff;background:var(--search_bar_background);color:#2688eb;color:var(--accent)}.vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--search_bar_field_background)}.vkuiSearch__after::before{background-color:#fff;background-color:var(--search_bar_background)}.vkuiPanelHeader .vkuiSearch{background:#fff;background:var(--header_background)}.vkuiPanelHeader .vkuiSearch__control{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__input{color:#000;color:var(--text_primary)}.vkuiPanelHeader .vkuiSearch__placeholder{color:#818c99;color:var(--header_search_field_tint)}.vkuiPanelHeader .vkuiSearch__after-width{background:#ebedf0;background:var(--header_search_field_background);color:#ebedf0;color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after{background:#fff;background:var(--header_background);color:#2688eb;color:var(--header_tint)}.vkuiPanelHeader .vkuiSearch__after::after{background-color:#ebedf0;background-color:var(--header_search_field_background)}.vkuiPanelHeader .vkuiSearch__after::before{background-color:#fff;background-color:var(--header_background)}.vkuiSearch--ios{padding:8px 12px}.vkuiSearch--android{padding:8px 16px}.vkuiSearch--vkcom,.vkuiPanelHeader--vkcom .vkuiSearch{background:0 0}.vkuiSearch--vkcom .vkuiSearch__in{padding-top:6px;padding-bottom:6px}.vkuiSearch--vkcom .vkuiSearch__input{font-size:15px;line-height:20px;padding-left:40px}.vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:16px}.vkuiSearch--vkcom .vkuiSearch__icons{top:4px;right:calc(100% + 8px)}.vkuiSearch--vkcom.vkuiSearch--has-value .vkuiSearch__input{padding-right:56px}.vkuiSearch--vkcom.vkuiSearch--has-icon.vkuiSearch--has-value .vkuiSearch__input{padding-right:92px}.vkuiSearch--vkcom .vkuiSearch__icon{width:40px;height:40px}.vkuiSearch--vkcom .vkuiSearch__icon:hover{background-color:rgba(0,0,0,.04);background-color:var(--background_hover);border-radius:50%}.vkuiSearch--vkcom .vkuiSearch__control{background-color:transparent}.vkuiPanelHeader--vkcom .vkuiSearch__separator{display:none}.vkuiSearch--vkcom .vkuiSearch__separator{color:#e1e3e6;color:var(--input_border)}.vkuiGroup--card .vkuiSearch--vkcom{margin:0-8px}.vkuiGroup--card .vkuiSearch--vkcom:first-child{margin-top:-8px}.vkuiGroup--card .vkuiSearch--vkcom:not(:last-child){margin-bottom:8px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__placeholder{padding-left:20px}.vkuiGroup--card .vkuiSearch--vkcom .vkuiSearch__input{padding-left:44px}

package/dist/cssm/components/Search/Search.js CHANGED Viewed

@@ -3,11 +3,11 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["before", "className", "defaultValue", "placeholder", "after", "getRef", "platform", "icon", "onIconClick", "style"];
 import { createScopedElement } from "../../lib/jsxRuntime";
-import * as React from 'react';
+import * as React from "react";
 import { classNames } from "../../lib/classNames";
 import { withPlatform } from "../../hoc/withPlatform";
 import { getClassName } from "../../helpers/getClassName";
-import { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from '@vkontakte/icons';
+import { Icon16SearchOutline, Icon16Clear, Icon24Cancel } from "@vkontakte/icons";
 import { IOS, VKCOM } from "../../lib/platform";
 import { Touch } from "../Touch/Touch";
 import { noop } from "../../lib/utils";
@@ -56,30 +56,33 @@ var Search = function Search(_ref) {
     inputProps.onBlur && inputProps.onBlur(e);
   };
-  var onCancel = function onCancel() {
+  var onCancel = React.useCallback(function () {
+    var _Object$getOwnPropert, _inputRef$current;
     // eslint-disable-next-line @typescript-eslint/unbound-method
-    var nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value').set;
-    nativeInputValueSetter.call(inputRef.current, '');
-    var ev2 = new Event('input', {
+    var nativeInputValueSetter = (_Object$getOwnPropert = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value")) === null || _Object$getOwnPropert === void 0 ? void 0 : _Object$getOwnPropert.set;
+    nativeInputValueSetter === null || nativeInputValueSetter === void 0 ? void 0 : nativeInputValueSetter.call(inputRef.current, "");
+    var ev2 = new Event("input", {
       bubbles: true
     });
-    inputRef.current.dispatchEvent(ev2);
-  };
+    (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.dispatchEvent(ev2);
+  }, [inputRef]);
   var onIconClickStart = React.useCallback(function (e) {
     return onIconClick(e.originalEvent);
   }, [onIconClick]);
   var onIconCancelClickStart = React.useCallback(function (e) {
+    var _inputRef$current2;
     e.originalEvent.preventDefault();
-    inputRef.current.focus();
+    (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus();
     onCancel();
-  }, [onCancel]);
+  }, [inputRef, onCancel]);
   return createScopedElement("div", {
-    vkuiClass: classNames(getClassName('Search', platform), {
-      'Search--focused': isFocused,
-      'Search--has-value': !!value,
-      'Search--has-after': !!after,
-      'Search--has-icon': !!icon
+    vkuiClass: classNames(getClassName("Search", platform), {
+      "Search--focused": isFocused,
+      "Search--has-value": !!value,
+      "Search--has-after": !!after,
+      "Search--has-icon": !!icon
     }),
     className: className,
     style: style
@@ -133,11 +136,12 @@ var Search = function Search(_ref) {
 };
 Search.defaultProps = {
-  autoComplete: 'off',
-  defaultValue: '',
-  placeholder: 'Поиск',
-  after: 'Отмена',
+  autoComplete: "off",
+  defaultValue: "",
+  placeholder: "Поиск",
+  after: "Отмена",
   before: createScopedElement(Icon16SearchOutline, null)
-};
+}; // eslint-disable-next-line import/no-default-export
 export default withPlatform(Search);
 //# sourceMappingURL=Search.js.map