npm - @vkontakte/vkui - Versions diffs - 5.3.2 → 5.4.1 - Mend

@vkontakte/vkui 5.3.2 → 5.4.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 (792) hide show

package/dist/components/Popover/Popover.js CHANGED Viewed

@@ -15,7 +15,7 @@ import { Popper } from "../Popper/Popper";
 /**
  * @see https://vkcom.github.io/VKUI/#/Popover
  */ export var Popover = function(_param) {
-    var _param_action = _param.action, action = _param_action === void 0 ? "click" : _param_action, shownProp = _param.shown, _param_showDelay = _param.showDelay, showDelay = _param_showDelay === void 0 ? 150 : _param_showDelay, _param_hideDelay = _param.hideDelay, hideDelay = _param_hideDelay === void 0 ? 150 : _param_hideDelay, _param_offsetDistance = _param.offsetDistance, offsetDistance = _param_offsetDistance === void 0 ? 8 : _param_offsetDistance, content = _param.content, children = _param.children, styleProp = _param.style, className = _param.className, getRef = _param.getRef, onShownChange = _param.onShownChange, restProps = _object_without_properties(_param, [
+    var _param_action = _param.action, action = _param_action === void 0 ? "click" : _param_action, shownProp = _param.shown, _param_showDelay = _param.showDelay, showDelay = _param_showDelay === void 0 ? 150 : _param_showDelay, _param_hideDelay = _param.hideDelay, hideDelay = _param_hideDelay === void 0 ? 150 : _param_hideDelay, _param_offsetDistance = _param.offsetDistance, offsetDistance = _param_offsetDistance === void 0 ? 8 : _param_offsetDistance, content = _param.content, children = _param.children, styleProp = _param.style, className = _param.className, getRef = _param.getRef, onShownChange = _param.onShownChange, _param_restoreFocus = _param.restoreFocus, restoreFocus = _param_restoreFocus === void 0 ? true : _param_restoreFocus, restProps = _object_without_properties(_param, [
         "action",
         "shown",
         "showDelay",
@@ -26,7 +26,8 @@ import { Popper } from "../Popper/Popper";
         "style",
         "className",
         "getRef",
-        "onShownChange"
+        "onShownChange",
+        "restoreFocus"
     ]);
     var document = useDOM().document;
     var hoverable = action === "hover";
@@ -121,7 +122,8 @@ import { Popper } from "../Popper/Popper";
             var wrapperClassName = param.className;
             return /*#__PURE__*/ React.createElement(FocusTrap, {
                 className: wrapperClassName,
-                onClose: handleContentKeyDownEscape
+                onClose: handleContentKeyDownEscape,
+                restoreFocus: restoreFocus
             }, content);
         },
         onMouseOver: hoverable ? hideTimeout.clear : undefined,

package/dist/components/Popover/Popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper, PopperCommonProps } from '../Popper/Popper';\nimport styles from './Popover.module.css';\n\nexport interface PopoverProps extends Omit<PopperCommonProps, 'arrow' \| 'arrowClassName'> {\n /*\n Механика вызова всплывающего окна.\n \n - `\"click\"` – показывается/скрывается только при нажатии.\n * - `\"hover\"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.\n \n > ⚠️`\"hover\"` на тач-устройствах будет работать как `\"click\"`, с одним лишь нюансом, что не будет закрываться\n * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента\n * > и выпадающего окна.\n /\n action?: 'click' \| 'hover';\n /\n Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.\n /\n shown?: boolean;\n /\n Количество миллисекунд, после которых произойдёт показ всплывающего окна.\n \n > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n /\n showDelay?: number;\n /\n Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.\n \n > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n /\n hideDelay?: number;\n /\n Содержимое всплывающего окна.\n /\n content?: React.ReactNode;\n /\n Целевой элемент. Всплывающее окно появится возле него.\n \n > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.\n /\n children?: React.ReactElement;\n /\n Вызывается при каждом изменении видимости всплывающего окна.\n /\n onShownChange?(shown: boolean): void;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/Popover\n */\nexport const Popover = ({\n action = 'click',\n shown: shownProp,\n showDelay = 150,\n hideDelay = 150,\n offsetDistance = 8,\n content,\n children,\n style: styleProp,\n className,\n getRef,\n onShownChange,\n ...restProps\n}: PopoverProps) => {\n const { document } = useDOM();\n\n const hoverable = action === 'hover';\n const hovered = React.useRef(false);\n const [computedShown, setComputedShown] = React.useState(shownProp \|\| false);\n const [dropdownNode, setPopperNode] = React.useState<HTMLElement \| null>(null);\n\n const shown = typeof shownProp === 'boolean' ? shownProp : computedShown;\n\n const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n const [childRef, child] = usePatchChildrenRef(children);\n\n const setShown = (value: boolean) => {\n if (typeof shownProp !== 'boolean') {\n setComputedShown(value);\n }\n typeof onShownChange === 'function' && onShownChange(value);\n };\n\n const showTimeout = useTimeout(() => setShown(true), showDelay);\n\n const hideTimeout = useTimeout(() => setShown(false), hideDelay);\n\n const handleTargetEnter = () => {\n hovered.current = true;\n hideTimeout.clear();\n showTimeout.set();\n };\n\n const handleTargetClick = () => {\n if (hovered.current && shown) {\n return;\n }\n setShown(!shown);\n };\n\n const handleTargetLeave = () => {\n hovered.current = false;\n showTimeout.clear();\n hideTimeout.set();\n };\n\n const handleContentKeyDownEscape = () => {\n setShown(false);\n };\n\n const handleOutsideClick = (e: MouseEvent) => {\n if (\n dropdownNode &&\n !childRef.current?.contains(e.target as Node) &&\n !dropdownNode.contains(e.target as Node)\n ) {\n setShown(false);\n }\n };\n\n useGlobalEventListener(document, 'click', handleOutsideClick, {\n capture: true,\n passive: true,\n });\n const targetEnterListener = useEventListener('mouseenter', handleTargetEnter);\n const targetClickEvent = useEventListener('click', handleTargetClick);\n const targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);\n\n React.useEffect(() => {\n if (!childRef.current) {\n return;\n }\n\n targetClickEvent.add(childRef.current);\n }, [childRef, targetClickEvent]);\n\n React.useEffect(() => {\n if (!childRef.current) {\n return;\n }\n\n if (hoverable) {\n targetEnterListener.add(childRef.current);\n targetLeaveListener.add(childRef.current);\n }\n\n return () => {\n targetEnterListener.remove();\n targetLeaveListener.remove();\n };\n }, [childRef, hoverable, targetEnterListener, targetLeaveListener]);\n\n return (\n <React.Fragment>\n {child}\n {shown && (\n <Popper\n {...restProps}\n className={classNames(styles['Popover'], className)}\n targetRef={childRef}\n getRef={patchedPopperRef}\n offsetDistance={offsetDistance}\n style={\n // Reason: Typescript ругается на CSS Custom Properties в объекте\n // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n {\n ...styleProp,\n '--vkui_internal--popover_safe_zone_padding': `${offsetDistance}px`,\n } as React.CSSProperties\n }\n renderContent={({ className: wrapperClassName }) => (\n <FocusTrap className={wrapperClassName} onClose={handleContentKeyDownEscape}>\n {content}\n </FocusTrap>\n )}\n onMouseOver={hoverable ? hideTimeout.clear : undefined}\n onMouseOut={hoverable ? handleTargetLeave : undefined}\n />\n )}\n </React.Fragment>\n );\n};\n"],"names":["React","classNames","useEventListener","useExternRef","useGlobalEventListener","usePatchChildrenRef","useTimeout","useDOM","FocusTrap","Popper","Popover","action","shown","shownProp","showDelay","hideDelay","offsetDistance","content","children","style","styleProp","className","getRef","onShownChange","restProps","document","hoverable","hovered","useRef","useState","computedShown","setComputedShown","dropdownNode","setPopperNode","patchedPopperRef","childRef","child","setShown","value","showTimeout","hideTimeout","handleTargetEnter","current","clear","set","handleTargetClick","handleTargetLeave","handleContentKeyDownEscape","handleOutsideClick","e","contains","target","capture","passive","targetEnterListener","targetClickEvent","targetLeaveListener","useEffect","add","remove","Fragment","targetRef","renderContent","wrapperClassName","onClose","onMouseOver","undefined","onMouseOut"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePatchChildrenRef } from '../../hooks/usePatchChildrenRef';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { FocusTrap, FocusTrapProps } from '../FocusTrap/FocusTrap';\nimport { Popper, PopperCommonProps } from '../Popper/Popper';\nimport styles from './Popover.module.css';\n\nexport interface PopoverProps\n extends Omit<PopperCommonProps, 'arrow' \| 'arrowClassName' \| 'content'>,\n Pick<FocusTrapProps, 'restoreFocus'> {\n /*\n Механика вызова всплывающего окна.\n \n - `\"click\"` – показывается/скрывается только при нажатии.\n * - `\"hover\"` – помимо нажатия, будет показываться/скрывается при наведении/отведении мыши.\n \n > ⚠️`\"hover\"` на тач-устройствах будет работать как `\"click\"`, с одним лишь нюансом, что не будет закрываться\n * > при повторном нажатии на целевой элемент. Для закрытия необходимо нажать на область вне целевого элемента\n * > и выпадающего окна.\n /\n action?: 'click' \| 'hover';\n /\n Если передан, то всплывающее окно будет показан/скрыт в зависимости от значения свойства.\n /\n shown?: boolean;\n /\n Количество миллисекунд, после которых произойдёт показ всплывающего окна.\n \n > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n /\n showDelay?: number;\n /\n Количество миллисекунд, после которых произойдёт скрытие всплывающего окна.\n \n > Используется только для `action=\"hover\"` при наведении/отведении мыши.\n /\n hideDelay?: number;\n /\n Содержимое всплывающего окна.\n /\n content?: React.ReactNode;\n /\n Целевой элемент. Всплывающее окно появится возле него.\n \n > ⚠️ Если это пользовательский компонент, то он должен предоставлять параметры либо `getRootRef`, либо `ref` для получения ссылки на DOM-узел.\n /\n children?: React.ReactElement;\n /\n Вызывается при каждом изменении видимости всплывающего окна.\n /\n onShownChange?(shown: boolean): void;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/Popover\n */\nexport const Popover = ({\n action = 'click',\n shown: shownProp,\n showDelay = 150,\n hideDelay = 150,\n offsetDistance = 8,\n content,\n children,\n style: styleProp,\n className,\n getRef,\n onShownChange,\n restoreFocus = true,\n ...restProps\n}: PopoverProps) => {\n const { document } = useDOM();\n\n const hoverable = action === 'hover';\n const hovered = React.useRef(false);\n const [computedShown, setComputedShown] = React.useState(shownProp \|\| false);\n const [dropdownNode, setPopperNode] = React.useState<HTMLElement \| null>(null);\n\n const shown = typeof shownProp === 'boolean' ? shownProp : computedShown;\n\n const patchedPopperRef = useExternRef<HTMLDivElement>(setPopperNode, getRef);\n\n const [childRef, child] = usePatchChildrenRef(children);\n\n const setShown = (value: boolean) => {\n if (typeof shownProp !== 'boolean') {\n setComputedShown(value);\n }\n typeof onShownChange === 'function' && onShownChange(value);\n };\n\n const showTimeout = useTimeout(() => setShown(true), showDelay);\n\n const hideTimeout = useTimeout(() => setShown(false), hideDelay);\n\n const handleTargetEnter = () => {\n hovered.current = true;\n hideTimeout.clear();\n showTimeout.set();\n };\n\n const handleTargetClick = () => {\n if (hovered.current && shown) {\n return;\n }\n setShown(!shown);\n };\n\n const handleTargetLeave = () => {\n hovered.current = false;\n showTimeout.clear();\n hideTimeout.set();\n };\n\n const handleContentKeyDownEscape = () => {\n setShown(false);\n };\n\n const handleOutsideClick = (e: MouseEvent) => {\n if (\n dropdownNode &&\n !childRef.current?.contains(e.target as Node) &&\n !dropdownNode.contains(e.target as Node)\n ) {\n setShown(false);\n }\n };\n\n useGlobalEventListener(document, 'click', handleOutsideClick, {\n capture: true,\n passive: true,\n });\n const targetEnterListener = useEventListener('mouseenter', handleTargetEnter);\n const targetClickEvent = useEventListener('click', handleTargetClick);\n const targetLeaveListener = useEventListener('mouseleave', handleTargetLeave);\n\n React.useEffect(() => {\n if (!childRef.current) {\n return;\n }\n\n targetClickEvent.add(childRef.current);\n }, [childRef, targetClickEvent]);\n\n React.useEffect(() => {\n if (!childRef.current) {\n return;\n }\n\n if (hoverable) {\n targetEnterListener.add(childRef.current);\n targetLeaveListener.add(childRef.current);\n }\n\n return () => {\n targetEnterListener.remove();\n targetLeaveListener.remove();\n };\n }, [childRef, hoverable, targetEnterListener, targetLeaveListener]);\n\n return (\n <React.Fragment>\n {child}\n {shown && (\n <Popper\n {...restProps}\n className={classNames(styles['Popover'], className)}\n targetRef={childRef}\n getRef={patchedPopperRef}\n offsetDistance={offsetDistance}\n style={\n // Reason: Typescript ругается на CSS Custom Properties в объекте\n // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n {\n ...styleProp,\n '--vkui_internal--popover_safe_zone_padding': `${offsetDistance}px`,\n } as React.CSSProperties\n }\n renderContent={({ className: wrapperClassName }) => (\n <FocusTrap\n className={wrapperClassName}\n onClose={handleContentKeyDownEscape}\n restoreFocus={restoreFocus}\n >\n {content}\n </FocusTrap>\n )}\n onMouseOver={hoverable ? hideTimeout.clear : undefined}\n onMouseOut={hoverable ? handleTargetLeave : undefined}\n />\n )}\n </React.Fragment>\n );\n};\n"],"names":["React","classNames","useEventListener","useExternRef","useGlobalEventListener","usePatchChildrenRef","useTimeout","useDOM","FocusTrap","Popper","Popover","action","shown","shownProp","showDelay","hideDelay","offsetDistance","content","children","style","styleProp","className","getRef","onShownChange","restoreFocus","restProps","document","hoverable","hovered","useRef","useState","computedShown","setComputedShown","dropdownNode","setPopperNode","patchedPopperRef","childRef","child","setShown","value","showTimeout","hideTimeout","handleTargetEnter","current","clear","set","handleTargetClick","handleTargetLeave","handleContentKeyDownEscape","handleOutsideClick","e","contains","target","capture","passive","targetEnterListener","targetClickEvent","targetLeaveListener","useEffect","add","remove","Fragment","targetRef","renderContent","wrapperClassName","onClose","onMouseOver","undefined","onMouseOut"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,gBAAgB,QAAQ,+BAA+B;AAChE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,sBAAsB,QAAQ,qCAAqC;AAC5E,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,MAAM,QAA2B,mBAAmB;AAiD7D;;CAEC,GACD,OAAO,IAAMC,UAAU,iBAcH;+BAblBC,QAAAA,oCAAS,yBACTC,AAAOC,mBAAPD,iCACAE,WAAAA,0CAAY,kDACZC,WAAAA,0CAAY,uDACZC,gBAAAA,oDAAiB,2BACjBC,iBAAAA,SACAC,kBAAAA,UACAC,AAAOC,mBAAPD,OACAE,mBAAAA,WACAC,gBAAAA,QACAC,uBAAAA,4CACAC,cAAAA,gDAAe,IAAI,wBAChBC;QAZHd;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;QACAC;QACAC;;IAGA,IAAM,AAAEE,WAAanB,SAAbmB;IAER,IAAMC,YAAYhB,WAAW;IAC7B,IAAMiB,UAAU5B,MAAM6B,MAAM,CAAC,KAAK;IAClC,IAA0C7B,mCAAAA,MAAM8B,QAAQ,CAACjB,aAAa,KAAK,OAApEkB,gBAAmC/B,oBAApBgC,mBAAoBhC;IAC1C,IAAsCA,oCAAAA,MAAM8B,QAAQ,CAAqB,IAAI,OAAtEG,eAA+BjC,qBAAjBkC,gBAAiBlC;IAEtC,IAAMY,QAAQ,OAAOC,cAAc,YAAYA,YAAYkB,aAAa;IAExE,IAAMI,mBAAmBhC,aAA6B+B,eAAeZ;IAErE,IAA0BjB,wCAAAA,oBAAoBa,eAAvCkB,WAAmB/B,yBAATgC,QAAShC;IAE1B,IAAMiC,WAAW,SAACC,OAAmB;QACnC,IAAI,OAAO1B,cAAc,WAAW;YAClCmB,iBAAiBO;QACnB,CAAC;QACD,OAAOhB,kBAAkB,cAAcA,cAAcgB;IACvD;IAEA,IAAMC,cAAclC,WAAW;eAAMgC,SAAS,IAAI;OAAGxB;IAErD,IAAM2B,cAAcnC,WAAW;eAAMgC,SAAS,KAAK;OAAGvB;IAEtD,IAAM2B,oBAAoB,WAAM;QAC9Bd,QAAQe,OAAO,GAAG,IAAI;QACtBF,YAAYG,KAAK;QACjBJ,YAAYK,GAAG;IACjB;IAEA,IAAMC,oBAAoB,WAAM;QAC9B,IAAIlB,QAAQe,OAAO,IAAI/B,OAAO;YAC5B;QACF,CAAC;QACD0B,SAAS,CAAC1B;IACZ;IAEA,IAAMmC,oBAAoB,WAAM;QAC9BnB,QAAQe,OAAO,GAAG,KAAK;QACvBH,YAAYI,KAAK;QACjBH,YAAYI,GAAG;IACjB;IAEA,IAAMG,6BAA6B,WAAM;QACvCV,SAAS,KAAK;IAChB;IAEA,IAAMW,qBAAqB,SAACC,GAAkB;YAGzCd;QAFH,IACEH,gBACA,EAACG,CAAAA,oBAAAA,SAASO,OAAO,cAAhBP,+BAAAA,KAAAA,IAAAA,kBAAkBe,SAASD,EAAEE,MAAM,MACpC,CAACnB,aAAakB,QAAQ,CAACD,EAAEE,MAAM,GAC/B;YACAd,SAAS,KAAK;QAChB,CAAC;IACH;IAEAlC,uBAAuBsB,UAAU,SAASuB,oBAAoB;QAC5DI,SAAS,IAAI;QACbC,SAAS,IAAI;IACf;IACA,IAAMC,sBAAsBrD,iBAAiB,cAAcwC;IAC3D,IAAMc,mBAAmBtD,iBAAiB,SAAS4C;IACnD,IAAMW,sBAAsBvD,iBAAiB,cAAc6C;IAE3D/C,MAAM0D,SAAS,CAAC,WAAM;QACpB,IAAI,CAACtB,SAASO,OAAO,EAAE;YACrB;QACF,CAAC;QAEDa,iBAAiBG,GAAG,CAACvB,SAASO,OAAO;IACvC,GAAG;QAACP;QAAUoB;KAAiB;IAE/BxD,MAAM0D,SAAS,CAAC,WAAM;QACpB,IAAI,CAACtB,SAASO,OAAO,EAAE;YACrB;QACF,CAAC;QAED,IAAIhB,WAAW;YACb4B,oBAAoBI,GAAG,CAACvB,SAASO,OAAO;YACxCc,oBAAoBE,GAAG,CAACvB,SAASO,OAAO;QAC1C,CAAC;QAED,OAAO,WAAM;YACXY,oBAAoBK,MAAM;YAC1BH,oBAAoBG,MAAM;QAC5B;IACF,GAAG;QAACxB;QAAUT;QAAW4B;QAAqBE;KAAoB;IAElE,qBACE,oBAACzD,MAAM6D,QAAQ,QACZxB,OACAzB,uBACC,oBAACH,gDACKgB;QACJJ,WAAWpB,0BAA8BoB;QACzCyC,WAAW1B;QACXd,QAAQa;QACRnB,gBAAgBA;QAChBG,OACE,iEAAiE;QACjE,yEAAyE;QACzE,wCACKC;YACH,8CAA8C,AAAC,GAAiB,OAAfJ,gBAAe;;QAGpE+C,eAAe;gBAAG1C,AAAW2C,yBAAX3C;iCAChB,oBAACb;gBACCa,WAAW2C;gBACXC,SAASjB;gBACTxB,cAAcA;eAEbP;;QAGLiD,aAAavC,YAAYc,YAAYG,KAAK,GAAGuB,SAAS;QACtDC,YAAYzC,YAAYoB,oBAAoBoB,SAAS;;AAK/D,EAAE"}

package/dist/components/PromoBanner/PromoBanner.js CHANGED Viewed

@@ -12,6 +12,7 @@ import { Image } from "../Image/Image";
 import { SimpleCell } from "../SimpleCell/SimpleCell";
 import { Footnote } from "../Typography/Footnote/Footnote";
 var warn = warnOnce("PromoBanner");
+// TODO [>=6]: Удалить компонент
 /**
  * @see https://vkcom.github.io/VKUI/#/PromoBanner
  * @deprecated v5.3.1

package/dist/components/PromoBanner/PromoBanner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/PromoBanner/PromoBanner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { Button } from '../Button/Button';\nimport { Image } from '../Image/Image';\nimport { SimpleCell } from '../SimpleCell/SimpleCell';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './PromoBanner.module.css';\n\nconst warn = warnOnce('PromoBanner');\n\ntype StatsType =\n \| 'playbackStarted' // Начало показа\n \| 'click'; // Клик по баннеру\n\ntype BannerData = {\n title?: string;\n url_types?: string;\n bannerID?: string;\n imageWidth?: number;\n imageHeight?: number;\n imageLink?: string;\n trackingLink?: string;\n type?: string;\n iconWidth?: number;\n domain?: string;\n ctaText?: string;\n advertisingLabel?: string;\n iconLink?: string;\n statistics?: Array<{ type: StatsType; url: string }>;\n openInBrowser?: boolean;\n iconHeight?: number;\n directLink?: boolean;\n navigationType?: string;\n description?: string;\n ageRestrictions?: string;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Данные рекламного баннера, полученные из VKWebAppGetAds /\n bannerData: BannerData;\n /* Флаг скрытия кнопки закрытия рекламы /\n isCloseButtonHidden?: boolean;\n /* Хандлер закрытия рекламы /\n onClose: () => void;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/PromoBanner\n * @deprecated v5.3.1\n \n Используйте событие [VKWebAppShowBannerAd](https://dev.vk.com/mini-apps/monetization/ad/banners)\n */\nexport const PromoBanner = ({\n bannerData = {},\n onClose,\n isCloseButtonHidden,\n className,\n ...restProps\n}: PromoBannerProps) => {\n if (process.env.NODE_ENV === 'development') {\n warn(\n 'Компонент устарел и будет удален в v6. Используйте событие VKWebAppShowBannerAd https://dev.vk.com/mini-apps/monetization/ad/banners',\n );\n }\n\n const [currentPixel, setCurrentPixel] = React.useState('');\n\n const statsPixels = React.useMemo(\n () =>\n (bannerData.statistics\n ? bannerData.statistics.reduce((acc, item) => ({ ...acc, [item.type]: item.url }), {})\n : {}) as Record<StatsType, string \| void>,\n [bannerData.statistics],\n );\n\n const onClick = React.useCallback(\n () => setCurrentPixel(statsPixels.click \|\| ''),\n [statsPixels.click],\n );\n\n React.useEffect(() => {\n if (statsPixels.playbackStarted) {\n setCurrentPixel(statsPixels.playbackStarted);\n }\n }, [statsPixels.playbackStarted]);\n\n return (\n <div className={classNames(styles['PromoBanner'], className)} {...restProps}>\n <div className={styles['PromoBanner__head']}>\n <Footnote>{bannerData.advertisingLabel \|\| 'Advertisement'}</Footnote>\n {bannerData.ageRestrictions && (\n <Footnote className={styles['PromoBanner__age']}>{bannerData.ageRestrictions}</Footnote>\n )}\n\n {!isCloseButtonHidden && (\n <div className={styles['PromoBanner__close']} onClick={onClose}>\n <Icon24Dismiss />\n </div>\n )}\n </div>\n <SimpleCell\n href={bannerData.trackingLink}\n onClick={onClick}\n rel=\"nofollow noopener noreferrer\"\n target=\"_blank\"\n before={\n bannerData.iconLink && (\n <Image\n size={48}\n src={bannerData.iconLink}\n alt={bannerData.title}\n data-testid={process.env.NODE_ENV === 'test' ? 'avatar' : undefined}\n />\n )\n }\n after={\n bannerData.ctaText && (\n <Button\n mode=\"outline\"\n data-testid={process.env.NODE_ENV === 'test' ? 'button-ctaText' : undefined}\n >\n {bannerData.ctaText}\n </Button>\n )\n }\n subtitle={bannerData.domain}\n >\n {bannerData.title}\n </SimpleCell>\n\n {currentPixel.length > 0 && (\n <div className={styles['PromoBanner__pixels']}>\n <img src={currentPixel} alt=\"\" />\n </div>\n )}\n </div>\n );\n};\n"],"names":["React","Icon24Dismiss","classNames","warnOnce","Button","Image","SimpleCell","Footnote","warn","PromoBanner","bannerData","onClose","isCloseButtonHidden","className","restProps","process","env","NODE_ENV","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","div","advertisingLabel","ageRestrictions","href","trackingLink","rel","target","before","iconLink","size","src","alt","title","data-testid","undefined","after","ctaText","mode","subtitle","domain","length","img"],"mappings":";;;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,KAAK,QAAQ,iBAAiB;AACvC,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,QAAQ,QAAQ,kCAAkC;AAG3D,IAAMC,OAAOL,SAAS;AAsCtB;;;;;CAKC,GACD,OAAO,IAAMM,cAAc,iBAMH;mCALtBC,YAAAA,4CAAa,CAAC,uBACdC,iBAAAA,SACAC,6BAAAA,qBACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1CT,KACE;IAEJ,CAAC;IAED,IAAwCR,mCAAAA,MAAMkB,QAAQ,CAAC,SAAhDC,eAAiCnB,oBAAnBoB,kBAAmBpB;IAExC,IAAMqB,cAAcrB,MAAMsB,OAAO,CAC/B;eACGZ,WAAWa,UAAU,GAClBb,WAAWa,UAAU,CAACC,MAAM,CAAC,SAACC,KAAKC;mBAAU,wCAAKD,MAAK,qBAACC,KAAKC,IAAI,EAAGD,KAAKE,GAAG;WAAK,CAAC,KAClF,CAAC,CAAC;OACR;QAAClB,WAAWa,UAAU;KAAC;IAGzB,IAAMM,UAAU7B,MAAM8B,WAAW,CAC/B;eAAMV,gBAAgBC,YAAYU,KAAK,IAAI;OAC3C;QAACV,YAAYU,KAAK;KAAC;IAGrB/B,MAAMgC,SAAS,CAAC,WAAM;QACpB,IAAIX,YAAYY,eAAe,EAAE;YAC/Bb,gBAAgBC,YAAYY,eAAe;QAC7C,CAAC;IACH,GAAG;QAACZ,YAAYY,eAAe;KAAC;IAEhC,qBACE,oBAACC;QAAIrB,WAAWX,8BAAkCW;OAAgBC,0BAChE,oBAACoB;QAAIrB,SAAS;qBACZ,oBAACN,gBAAUG,WAAWyB,gBAAgB,IAAI,kBACzCzB,WAAW0B,eAAe,kBACzB,oBAAC7B;QAASM,SAAS;OAA+BH,WAAW0B,eAAe,GAG7E,CAACxB,qCACA,oBAACsB;QAAIrB,SAAS;QAAgCgB,SAASlB;qBACrD,oBAACV,sCAIP,oBAACK;QACC+B,MAAM3B,WAAW4B,YAAY;QAC7BT,SAASA;QACTU,KAAI;QACJC,QAAO;QACPC,QACE/B,WAAWgC,QAAQ,kBACjB,oBAACrC;YACCsC,MAAM;YACNC,KAAKlC,WAAWgC,QAAQ;YACxBG,KAAKnC,WAAWoC,KAAK;YACrBC,eAAahC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,WAAW+B,SAAS;;QAIzEC,OACEvC,WAAWwC,OAAO,kBAChB,oBAAC9C;YACC+C,MAAK;YACLJ,eAAahC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,mBAAmB+B,SAAS;WAE1EtC,WAAWwC,OAAO;QAIzBE,UAAU1C,WAAW2C,MAAM;OAE1B3C,WAAWoC,KAAK,GAGlB3B,aAAamC,MAAM,GAAG,mBACrB,oBAACpB;QAAIrB,SAAS;qBACZ,oBAAC0C;QAAIX,KAAKzB;QAAc0B,KAAI;;AAKtC,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/PromoBanner/PromoBanner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Dismiss } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { Button } from '../Button/Button';\nimport { Image } from '../Image/Image';\nimport { SimpleCell } from '../SimpleCell/SimpleCell';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './PromoBanner.module.css';\n\nconst warn = warnOnce('PromoBanner');\n\ntype StatsType =\n \| 'playbackStarted' // Начало показа\n \| 'click'; // Клик по баннеру\n\ntype BannerData = {\n title?: string;\n url_types?: string;\n bannerID?: string;\n imageWidth?: number;\n imageHeight?: number;\n imageLink?: string;\n trackingLink?: string;\n type?: string;\n iconWidth?: number;\n domain?: string;\n ctaText?: string;\n advertisingLabel?: string;\n iconLink?: string;\n statistics?: Array<{ type: StatsType; url: string }>;\n openInBrowser?: boolean;\n iconHeight?: number;\n directLink?: boolean;\n navigationType?: string;\n description?: string;\n ageRestrictions?: string;\n};\n\nexport interface PromoBannerProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Данные рекламного баннера, полученные из VKWebAppGetAds /\n bannerData: BannerData;\n /* Флаг скрытия кнопки закрытия рекламы /\n isCloseButtonHidden?: boolean;\n /* Хандлер закрытия рекламы /\n onClose: () => void;\n}\n\n// TODO [>=6]: Удалить компонент\n\n/\n @see https://vkcom.github.io/VKUI/#/PromoBanner\n * @deprecated v5.3.1\n \n Используйте событие [VKWebAppShowBannerAd](https://dev.vk.com/mini-apps/monetization/ad/banners)\n */\nexport const PromoBanner = ({\n bannerData = {},\n onClose,\n isCloseButtonHidden,\n className,\n ...restProps\n}: PromoBannerProps) => {\n if (process.env.NODE_ENV === 'development') {\n warn(\n 'Компонент устарел и будет удален в v6. Используйте событие VKWebAppShowBannerAd https://dev.vk.com/mini-apps/monetization/ad/banners',\n );\n }\n\n const [currentPixel, setCurrentPixel] = React.useState('');\n\n const statsPixels = React.useMemo(\n () =>\n (bannerData.statistics\n ? bannerData.statistics.reduce((acc, item) => ({ ...acc, [item.type]: item.url }), {})\n : {}) as Record<StatsType, string \| void>,\n [bannerData.statistics],\n );\n\n const onClick = React.useCallback(\n () => setCurrentPixel(statsPixels.click \|\| ''),\n [statsPixels.click],\n );\n\n React.useEffect(() => {\n if (statsPixels.playbackStarted) {\n setCurrentPixel(statsPixels.playbackStarted);\n }\n }, [statsPixels.playbackStarted]);\n\n return (\n <div className={classNames(styles['PromoBanner'], className)} {...restProps}>\n <div className={styles['PromoBanner__head']}>\n <Footnote>{bannerData.advertisingLabel \|\| 'Advertisement'}</Footnote>\n {bannerData.ageRestrictions && (\n <Footnote className={styles['PromoBanner__age']}>{bannerData.ageRestrictions}</Footnote>\n )}\n\n {!isCloseButtonHidden && (\n <div className={styles['PromoBanner__close']} onClick={onClose}>\n <Icon24Dismiss />\n </div>\n )}\n </div>\n <SimpleCell\n href={bannerData.trackingLink}\n onClick={onClick}\n rel=\"nofollow noopener noreferrer\"\n target=\"_blank\"\n before={\n bannerData.iconLink && (\n <Image\n size={48}\n src={bannerData.iconLink}\n alt={bannerData.title}\n data-testid={process.env.NODE_ENV === 'test' ? 'avatar' : undefined}\n />\n )\n }\n after={\n bannerData.ctaText && (\n <Button\n mode=\"outline\"\n data-testid={process.env.NODE_ENV === 'test' ? 'button-ctaText' : undefined}\n >\n {bannerData.ctaText}\n </Button>\n )\n }\n subtitle={bannerData.domain}\n >\n {bannerData.title}\n </SimpleCell>\n\n {currentPixel.length > 0 && (\n <div className={styles['PromoBanner__pixels']}>\n <img src={currentPixel} alt=\"\" />\n </div>\n )}\n </div>\n );\n};\n"],"names":["React","Icon24Dismiss","classNames","warnOnce","Button","Image","SimpleCell","Footnote","warn","PromoBanner","bannerData","onClose","isCloseButtonHidden","className","restProps","process","env","NODE_ENV","useState","currentPixel","setCurrentPixel","statsPixels","useMemo","statistics","reduce","acc","item","type","url","onClick","useCallback","click","useEffect","playbackStarted","div","advertisingLabel","ageRestrictions","href","trackingLink","rel","target","before","iconLink","size","src","alt","title","data-testid","undefined","after","ctaText","mode","subtitle","domain","length","img"],"mappings":";;;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,KAAK,QAAQ,iBAAiB;AACvC,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,QAAQ,QAAQ,kCAAkC;AAG3D,IAAMC,OAAOL,SAAS;AAsCtB,gCAAgC;AAEhC;;;;;CAKC,GACD,OAAO,IAAMM,cAAc,iBAMH;mCALtBC,YAAAA,4CAAa,CAAC,uBACdC,iBAAAA,SACAC,6BAAAA,qBACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1CT,KACE;IAEJ,CAAC;IAED,IAAwCR,mCAAAA,MAAMkB,QAAQ,CAAC,SAAhDC,eAAiCnB,oBAAnBoB,kBAAmBpB;IAExC,IAAMqB,cAAcrB,MAAMsB,OAAO,CAC/B;eACGZ,WAAWa,UAAU,GAClBb,WAAWa,UAAU,CAACC,MAAM,CAAC,SAACC,KAAKC;mBAAU,wCAAKD,MAAK,qBAACC,KAAKC,IAAI,EAAGD,KAAKE,GAAG;WAAK,CAAC,KAClF,CAAC,CAAC;OACR;QAAClB,WAAWa,UAAU;KAAC;IAGzB,IAAMM,UAAU7B,MAAM8B,WAAW,CAC/B;eAAMV,gBAAgBC,YAAYU,KAAK,IAAI;OAC3C;QAACV,YAAYU,KAAK;KAAC;IAGrB/B,MAAMgC,SAAS,CAAC,WAAM;QACpB,IAAIX,YAAYY,eAAe,EAAE;YAC/Bb,gBAAgBC,YAAYY,eAAe;QAC7C,CAAC;IACH,GAAG;QAACZ,YAAYY,eAAe;KAAC;IAEhC,qBACE,oBAACC;QAAIrB,WAAWX,8BAAkCW;OAAgBC,0BAChE,oBAACoB;QAAIrB,SAAS;qBACZ,oBAACN,gBAAUG,WAAWyB,gBAAgB,IAAI,kBACzCzB,WAAW0B,eAAe,kBACzB,oBAAC7B;QAASM,SAAS;OAA+BH,WAAW0B,eAAe,GAG7E,CAACxB,qCACA,oBAACsB;QAAIrB,SAAS;QAAgCgB,SAASlB;qBACrD,oBAACV,sCAIP,oBAACK;QACC+B,MAAM3B,WAAW4B,YAAY;QAC7BT,SAASA;QACTU,KAAI;QACJC,QAAO;QACPC,QACE/B,WAAWgC,QAAQ,kBACjB,oBAACrC;YACCsC,MAAM;YACNC,KAAKlC,WAAWgC,QAAQ;YACxBG,KAAKnC,WAAWoC,KAAK;YACrBC,eAAahC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,WAAW+B,SAAS;;QAIzEC,OACEvC,WAAWwC,OAAO,kBAChB,oBAAC9C;YACC+C,MAAK;YACLJ,eAAahC,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAAS,mBAAmB+B,SAAS;WAE1EtC,WAAWwC,OAAO;QAIzBE,UAAU1C,WAAW2C,MAAM;OAE1B3C,WAAWoC,KAAK,GAGlB3B,aAAamC,MAAM,GAAG,mBACrB,oBAACpB;QAAIrB,SAAS;qBACZ,oBAAC0C;QAAIX,KAAKzB;QAAc0B,KAAI;;AAKtC,EAAE"}

package/dist/components/PullToRefresh/PullToRefresh.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-import * as React from 'react';
+/// <reference types="react" />
 import { DOMProps } from '../../lib/dom';
-import { AnyFunction } from '../../types';
+import { AnyFunction, HasChildren } from '../../types';
 import { ScrollContextInterface } from '../AppRoot/ScrollContext';
 import { TouchProps } from '../Touch/Touch';
-export interface PullToRefreshProps extends DOMProps, TouchProps {
+export interface PullToRefreshProps extends DOMProps, TouchProps, HasChildren {
     /**
      * Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным коллбэком)
      */
@@ -14,7 +14,6 @@ export interface PullToRefreshProps extends DOMProps, TouchProps {
     isFetching?: boolean;
     /** @ignore */
     scroll?: ScrollContextInterface;
-    children?: React.ReactNode;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/PullToRefresh

package/dist/components/PullToRefresh/PullToRefresh.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { DOMProps, useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { runTapticImpactOccurred } from '../../lib/taptic';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { AnyFunction } from '../../types';\nimport { ScrollContextInterface, useScroll } from '../AppRoot/ScrollContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { PullToRefreshSpinner } from './PullToRefreshSpinner';\nimport styles from './PullToRefresh.module.css';\n\nfunction cancelEvent(event: any) {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault && event.cancelable) {\n event.preventDefault();\n }\n if (event.stopPropagation) {\n event.stopPropagation();\n }\n return false;\n}\n\nexport interface PullToRefreshProps extends DOMProps, TouchProps {\n /*\n Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным коллбэком)\n /\n onRefresh: AnyFunction;\n /\n Определяет, выполняется ли обновление. Для скрытия спиннера после получения контента необходимо передать `false`\n /\n isFetching?: boolean;\n /* @ignore /\n scroll?: ScrollContextInterface;\n children?: React.ReactNode;\n}\n\nconst TOUCH_MOVE_EVENT_PARAMS = {\n cancelable: true,\n passive: false,\n};\n\n/\n @see https://vkcom.github.io/VKUI/#/PullToRefresh\n /\nexport const PullToRefresh = ({\n children,\n isFetching,\n onRefresh,\n className,\n ...restProps\n}: PullToRefreshProps) => {\n const platform = usePlatform();\n const scroll = useScroll();\n const { document } = useDOM();\n const prevIsFetching = usePrevious(isFetching);\n\n const initParams = React.useMemo(\n () => ({\n start: platform === Platform.IOS ? -10 : -45,\n max: platform === Platform.IOS ? 50 : 80,\n maxY: platform === Platform.IOS ? 400 : 80,\n refreshing: platform === Platform.IOS ? 36 : 50,\n positionMultiplier: platform === Platform.IOS ? 0.21 : 1,\n }),\n [platform],\n );\n\n const [spinnerY, setSpinnerY] = React.useState(initParams.start);\n const [watching, setWatching] = React.useState(false);\n const [refreshing, setRefreshing] = React.useState(false);\n const [canRefresh, setCanRefresh] = React.useState(false);\n const [touchDown, setTouchDown] = React.useState(false);\n const prevTouchDown = usePrevious(touchDown);\n\n const touchY = React.useRef(0);\n const [contentShift, setContentShift] = React.useState(0);\n const [spinnerProgress, setSpinnerProgress] = React.useState(0);\n\n const onWindowTouchMove = (event: Event) => {\n if (refreshing) {\n event.preventDefault();\n event.stopPropagation();\n }\n };\n\n useGlobalEventListener(document, 'touchmove', onWindowTouchMove, TOUCH_MOVE_EVENT_PARAMS);\n\n const resetRefreshingState = React.useCallback(() => {\n setWatching(false);\n setCanRefresh(false);\n setRefreshing(false);\n setSpinnerY(initParams.start);\n setSpinnerProgress(0);\n setContentShift(0);\n }, [initParams]);\n\n const onRefreshingFinish = React.useCallback(() => {\n if (!touchDown) {\n resetRefreshingState();\n }\n }, [touchDown, resetRefreshingState]);\n\n const { set: setWaitFetchingTimeout, clear: clearWaitFetchingTimeout } = useTimeout(\n onRefreshingFinish,\n 1000,\n );\n\n useIsomorphicLayoutEffect(() => {\n if (prevIsFetching !== undefined && prevIsFetching && !isFetching) {\n onRefreshingFinish();\n }\n }, [prevIsFetching, isFetching, onRefreshingFinish]);\n\n useIsomorphicLayoutEffect(() => {\n if (prevIsFetching !== undefined && !prevIsFetching && isFetching) {\n clearWaitFetchingTimeout();\n }\n }, [isFetching, prevIsFetching, clearWaitFetchingTimeout]);\n\n const runRefreshing = React.useCallback(() => {\n if (!refreshing && onRefresh) {\n // cleanup if the consumer does not start fetching in 1s\n setWaitFetchingTimeout();\n\n setRefreshing(true);\n setSpinnerY((prevSpinnerY) =>\n platform === Platform.IOS ? prevSpinnerY : initParams.refreshing,\n );\n\n onRefresh();\n runTapticImpactOccurred('light');\n }\n }, [refreshing, onRefresh, setWaitFetchingTimeout, platform, initParams.refreshing]);\n\n useIsomorphicLayoutEffect(() => {\n if (prevTouchDown !== undefined && prevTouchDown && !touchDown) {\n if (!refreshing && canRefresh) {\n runRefreshing();\n } else if (refreshing && !isFetching) {\n // only iOS can start refresh before gesture end\n resetRefreshingState();\n } else {\n // refreshing && isFetching: refresh in progress\n // OR !refreshing && !canRefresh: pull was not strong enough\n setSpinnerY(refreshing ? initParams.refreshing : initParams.start);\n setSpinnerProgress(0);\n setContentShift(0);\n }\n }\n }, [\n initParams,\n prevIsFetching,\n isFetching,\n onRefreshingFinish,\n prevTouchDown,\n touchDown,\n refreshing,\n canRefresh,\n runRefreshing,\n ]);\n\n const onTouchStart = (e: TouchEvent) => {\n if (refreshing) {\n cancelEvent(e);\n }\n setTouchDown(true);\n };\n\n const onTouchMove = (e: TouchEvent) => {\n const { isY, shiftY } = e;\n const { start, max } = initParams;\n const pageYOffset = scroll?.getScroll().y;\n\n if (watching && touchDown) {\n cancelEvent(e);\n\n const { positionMultiplier, maxY } = initParams;\n\n const shift = Math.max(0, shiftY - touchY.current);\n\n const currentY = clamp(start + shift positionMultiplier, start, maxY);\n const progress = currentY > -10 ? Math.abs((currentY + 10) / max) * 80 : 0;\n\n setSpinnerY(currentY);\n setSpinnerProgress(clamp(progress, 0, 80));\n setCanRefresh(progress > 80);\n setContentShift((currentY + 10) * 2.3);\n\n if (progress > 85 && !refreshing && platform === Platform.IOS) {\n runRefreshing();\n }\n } else if (isY && pageYOffset === 0 && shiftY > 0 && !refreshing && touchDown) {\n cancelEvent(e);\n\n touchY.current = shiftY;\n setWatching(true);\n setSpinnerY(start);\n setSpinnerProgress(0);\n }\n };\n\n const onTouchEnd = () => {\n setWatching(false);\n setTouchDown(false);\n };\n\n const spinnerTransform = `translate3d(0, ${spinnerY}px, 0)`;\n let contentTransform = '';\n\n if (platform === Platform.IOS && refreshing && !touchDown) {\n contentTransform = 'translate3d(0, 100px, 0)';\n } else if (platform === Platform.IOS && (contentShift \|\| refreshing)) {\n contentTransform = `translate3d(0, ${contentShift}px, 0)`;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <Touch\n {...restProps}\n onStart={onTouchStart}\n onMove={onTouchMove}\n onEnd={onTouchEnd}\n className={classNames(\n styles['PullToRefresh'],\n platform === Platform.IOS && styles['PullToRefresh--ios'],\n watching && styles['PullToRefresh--watching'],\n refreshing && styles['PullToRefresh--refreshing'],\n className,\n )}\n >\n <FixedLayout className={styles['PullToRefresh__controls']}>\n <PullToRefreshSpinner\n style={{\n transform: spinnerTransform,\n WebkitTransform: spinnerTransform,\n opacity: watching \|\| refreshing \|\| canRefresh ? 1 : 0,\n }}\n on={refreshing}\n progress={refreshing ? undefined : spinnerProgress}\n />\n </FixedLayout>\n\n <div\n className={styles['PullToRefresh__content']}\n style={{\n transform: contentTransform,\n WebkitTransform: contentTransform,\n }}\n >\n {children}\n </div>\n </Touch>\n </TouchRootContext.Provider>\n );\n};\n"],"names":["React","classNames","clamp","useGlobalEventListener","usePlatform","usePrevious","useTimeout","useDOM","Platform","runTapticImpactOccurred","useIsomorphicLayoutEffect","useScroll","FixedLayout","Touch","TouchRootContext","PullToRefreshSpinner","cancelEvent","event","originalEvent","preventDefault","cancelable","stopPropagation","TOUCH_MOVE_EVENT_PARAMS","passive","PullToRefresh","children","isFetching","onRefresh","className","restProps","platform","scroll","document","prevIsFetching","initParams","useMemo","start","IOS","max","maxY","refreshing","positionMultiplier","useState","spinnerY","setSpinnerY","watching","setWatching","setRefreshing","canRefresh","setCanRefresh","touchDown","setTouchDown","prevTouchDown","touchY","useRef","contentShift","setContentShift","spinnerProgress","setSpinnerProgress","onWindowTouchMove","resetRefreshingState","useCallback","onRefreshingFinish","set","setWaitFetchingTimeout","clear","clearWaitFetchingTimeout","undefined","runRefreshing","prevSpinnerY","onTouchStart","e","onTouchMove","isY","shiftY","pageYOffset","getScroll","y","shift","Math","current","currentY","progress","abs","onTouchEnd","spinnerTransform","contentTransform","Provider","value","onStart","onMove","onEnd","style","transform","WebkitTransform","opacity","on","div"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { clamp } from '../../helpers/math';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { DOMProps, useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { runTapticImpactOccurred } from '../../lib/taptic';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { AnyFunction, HasChildren } from '../../types';\nimport { ScrollContextInterface, useScroll } from '../AppRoot/ScrollContext';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { PullToRefreshSpinner } from './PullToRefreshSpinner';\nimport styles from './PullToRefresh.module.css';\n\nfunction cancelEvent(event: any) {\n if (!event) {\n return false;\n }\n while (event.originalEvent) {\n event = event.originalEvent;\n }\n if (event.preventDefault && event.cancelable) {\n event.preventDefault();\n }\n if (event.stopPropagation) {\n event.stopPropagation();\n }\n return false;\n}\n\nexport interface PullToRefreshProps extends DOMProps, TouchProps, HasChildren {\n /*\n Будет вызвана для обновления контента (прим.: функция должна быть мемоизированным коллбэком)\n /\n onRefresh: AnyFunction;\n /\n Определяет, выполняется ли обновление. Для скрытия спиннера после получения контента необходимо передать `false`\n /\n isFetching?: boolean;\n /* @ignore /\n scroll?: ScrollContextInterface;\n}\n\nconst TOUCH_MOVE_EVENT_PARAMS = {\n cancelable: true,\n passive: false,\n};\n\n/\n @see https://vkcom.github.io/VKUI/#/PullToRefresh\n /\nexport const PullToRefresh = ({\n children,\n isFetching,\n onRefresh,\n className,\n ...restProps\n}: PullToRefreshProps) => {\n const platform = usePlatform();\n const scroll = useScroll();\n const { document } = useDOM();\n const prevIsFetching = usePrevious(isFetching);\n\n const initParams = React.useMemo(\n () => ({\n start: platform === Platform.IOS ? -10 : -45,\n max: platform === Platform.IOS ? 50 : 80,\n maxY: platform === Platform.IOS ? 400 : 80,\n refreshing: platform === Platform.IOS ? 36 : 50,\n positionMultiplier: platform === Platform.IOS ? 0.21 : 1,\n }),\n [platform],\n );\n\n const [spinnerY, setSpinnerY] = React.useState(initParams.start);\n const [watching, setWatching] = React.useState(false);\n const [refreshing, setRefreshing] = React.useState(false);\n const [canRefresh, setCanRefresh] = React.useState(false);\n const [touchDown, setTouchDown] = React.useState(false);\n const prevTouchDown = usePrevious(touchDown);\n\n const touchY = React.useRef(0);\n const [contentShift, setContentShift] = React.useState(0);\n const [spinnerProgress, setSpinnerProgress] = React.useState(0);\n\n const onWindowTouchMove = (event: Event) => {\n if (refreshing) {\n event.preventDefault();\n event.stopPropagation();\n }\n };\n\n useGlobalEventListener(document, 'touchmove', onWindowTouchMove, TOUCH_MOVE_EVENT_PARAMS);\n\n const resetRefreshingState = React.useCallback(() => {\n setWatching(false);\n setCanRefresh(false);\n setRefreshing(false);\n setSpinnerY(initParams.start);\n setSpinnerProgress(0);\n setContentShift(0);\n }, [initParams]);\n\n const onRefreshingFinish = React.useCallback(() => {\n if (!touchDown) {\n resetRefreshingState();\n }\n }, [touchDown, resetRefreshingState]);\n\n const { set: setWaitFetchingTimeout, clear: clearWaitFetchingTimeout } = useTimeout(\n onRefreshingFinish,\n 1000,\n );\n\n useIsomorphicLayoutEffect(() => {\n if (prevIsFetching !== undefined && prevIsFetching && !isFetching) {\n onRefreshingFinish();\n }\n }, [prevIsFetching, isFetching, onRefreshingFinish]);\n\n useIsomorphicLayoutEffect(() => {\n if (prevIsFetching !== undefined && !prevIsFetching && isFetching) {\n clearWaitFetchingTimeout();\n }\n }, [isFetching, prevIsFetching, clearWaitFetchingTimeout]);\n\n const runRefreshing = React.useCallback(() => {\n if (!refreshing && onRefresh) {\n // cleanup if the consumer does not start fetching in 1s\n setWaitFetchingTimeout();\n\n setRefreshing(true);\n setSpinnerY((prevSpinnerY) =>\n platform === Platform.IOS ? prevSpinnerY : initParams.refreshing,\n );\n\n onRefresh();\n runTapticImpactOccurred('light');\n }\n }, [refreshing, onRefresh, setWaitFetchingTimeout, platform, initParams.refreshing]);\n\n useIsomorphicLayoutEffect(() => {\n if (prevTouchDown !== undefined && prevTouchDown && !touchDown) {\n if (!refreshing && canRefresh) {\n runRefreshing();\n } else if (refreshing && !isFetching) {\n // only iOS can start refresh before gesture end\n resetRefreshingState();\n } else {\n // refreshing && isFetching: refresh in progress\n // OR !refreshing && !canRefresh: pull was not strong enough\n setSpinnerY(refreshing ? initParams.refreshing : initParams.start);\n setSpinnerProgress(0);\n setContentShift(0);\n }\n }\n }, [\n initParams,\n prevIsFetching,\n isFetching,\n onRefreshingFinish,\n prevTouchDown,\n touchDown,\n refreshing,\n canRefresh,\n runRefreshing,\n ]);\n\n const onTouchStart = (e: TouchEvent) => {\n if (refreshing) {\n cancelEvent(e);\n }\n setTouchDown(true);\n };\n\n const onTouchMove = (e: TouchEvent) => {\n const { isY, shiftY } = e;\n const { start, max } = initParams;\n const pageYOffset = scroll?.getScroll().y;\n\n if (watching && touchDown) {\n cancelEvent(e);\n\n const { positionMultiplier, maxY } = initParams;\n\n const shift = Math.max(0, shiftY - touchY.current);\n\n const currentY = clamp(start + shift positionMultiplier, start, maxY);\n const progress = currentY > -10 ? Math.abs((currentY + 10) / max) * 80 : 0;\n\n setSpinnerY(currentY);\n setSpinnerProgress(clamp(progress, 0, 80));\n setCanRefresh(progress > 80);\n setContentShift((currentY + 10) * 2.3);\n\n if (progress > 85 && !refreshing && platform === Platform.IOS) {\n runRefreshing();\n }\n } else if (isY && pageYOffset === 0 && shiftY > 0 && !refreshing && touchDown) {\n cancelEvent(e);\n\n touchY.current = shiftY;\n setWatching(true);\n setSpinnerY(start);\n setSpinnerProgress(0);\n }\n };\n\n const onTouchEnd = () => {\n setWatching(false);\n setTouchDown(false);\n };\n\n const spinnerTransform = `translate3d(0, ${spinnerY}px, 0)`;\n let contentTransform = '';\n\n if (platform === Platform.IOS && refreshing && !touchDown) {\n contentTransform = 'translate3d(0, 100px, 0)';\n } else if (platform === Platform.IOS && (contentShift \|\| refreshing)) {\n contentTransform = `translate3d(0, ${contentShift}px, 0)`;\n }\n\n return (\n <TouchRootContext.Provider value={true}>\n <Touch\n {...restProps}\n onStart={onTouchStart}\n onMove={onTouchMove}\n onEnd={onTouchEnd}\n className={classNames(\n styles['PullToRefresh'],\n platform === Platform.IOS && styles['PullToRefresh--ios'],\n watching && styles['PullToRefresh--watching'],\n refreshing && styles['PullToRefresh--refreshing'],\n className,\n )}\n >\n <FixedLayout className={styles['PullToRefresh__controls']}>\n <PullToRefreshSpinner\n style={{\n transform: spinnerTransform,\n WebkitTransform: spinnerTransform,\n opacity: watching \|\| refreshing \|\| canRefresh ? 1 : 0,\n }}\n on={refreshing}\n progress={refreshing ? undefined : spinnerProgress}\n />\n </FixedLayout>\n\n <div\n className={styles['PullToRefresh__content']}\n style={{\n transform: contentTransform,\n WebkitTransform: contentTransform,\n }}\n >\n {children}\n </div>\n </Touch>\n </TouchRootContext.Provider>\n );\n};\n"],"names":["React","classNames","clamp","useGlobalEventListener","usePlatform","usePrevious","useTimeout","useDOM","Platform","runTapticImpactOccurred","useIsomorphicLayoutEffect","useScroll","FixedLayout","Touch","TouchRootContext","PullToRefreshSpinner","cancelEvent","event","originalEvent","preventDefault","cancelable","stopPropagation","TOUCH_MOVE_EVENT_PARAMS","passive","PullToRefresh","children","isFetching","onRefresh","className","restProps","platform","scroll","document","prevIsFetching","initParams","useMemo","start","IOS","max","maxY","refreshing","positionMultiplier","useState","spinnerY","setSpinnerY","watching","setWatching","setRefreshing","canRefresh","setCanRefresh","touchDown","setTouchDown","prevTouchDown","touchY","useRef","contentShift","setContentShift","spinnerProgress","setSpinnerProgress","onWindowTouchMove","resetRefreshingState","useCallback","onRefreshingFinish","set","setWaitFetchingTimeout","clear","clearWaitFetchingTimeout","undefined","runRefreshing","prevSpinnerY","onTouchStart","e","onTouchMove","isY","shiftY","pageYOffset","getScroll","y","shift","Math","current","currentY","progress","abs","onTouchEnd","spinnerTransform","contentTransform","Provider","value","onStart","onMove","onEnd","style","transform","WebkitTransform","opacity","on","div"],"mappings":"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"}

package/dist/components/Radio/Radio.d.ts CHANGED Viewed

@@ -2,8 +2,9 @@ import * as React from 'react';
 import { HasRef, HasRootRef } from '../../types';
 export interface RadioProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasRootRef<HTMLLabelElement> {
     description?: React.ReactNode;
+    titleAfter?: React.ReactNode;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Radio
  */
-export declare const Radio: ({ children, description, style, className, getRootRef, ...restProps }: RadioProps) => JSX.Element;
+export declare const Radio: ({ children, description, style, className, getRootRef, titleAfter, getRef, ...restProps }: RadioProps) => JSX.Element;

package/dist/components/Radio/Radio.js CHANGED Viewed

@@ -10,7 +10,7 @@ import { SizeType } from "../../lib/adaptivity";
 import { Platform } from "../../lib/platform";
 import { ACTIVE_EFFECT_DELAY, Tappable } from "../Tappable/Tappable";
 import { Footnote } from "../Typography/Footnote/Footnote";
-import { VisuallyHiddenInput } from "../VisuallyHiddenInput/VisuallyHiddenInput";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden";
 var sizeYClassNames = _define_property({
     none: "vkuiRadio--sizeY-none"
 }, SizeType.COMPACT, "vkuiRadio--sizeY-compact");
@@ -37,12 +37,14 @@ var RadioIcon = function(props) {
 /**
  * @see https://vkcom.github.io/VKUI/#/Radio
  */ export var Radio = function(_param) {
-    var children = _param.children, description = _param.description, style = _param.style, className = _param.className, getRootRef = _param.getRootRef, restProps = _object_without_properties(_param, [
+    var children = _param.children, description = _param.description, style = _param.style, className = _param.className, getRootRef = _param.getRootRef, titleAfter = _param.titleAfter, getRef = _param.getRef, restProps = _object_without_properties(_param, [
         "children",
         "description",
         "style",
         "className",
-        "getRootRef"
+        "getRootRef",
+        "titleAfter",
+        "getRef"
     ]);
     var platform = usePlatform();
     var _useAdaptivity = useAdaptivity(), _useAdaptivity_sizeY = _useAdaptivity.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
@@ -53,9 +55,11 @@ var RadioIcon = function(props) {
         activeEffectDelay: platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY,
         disabled: restProps.disabled,
         getRootRef: getRootRef
-    }, /*#__PURE__*/ React.createElement(VisuallyHiddenInput, _object_spread_props(_object_spread({}, restProps), {
-        className: "vkuiRadio__input",
-        type: "radio"
+    }, /*#__PURE__*/ React.createElement(VisuallyHidden, _object_spread_props(_object_spread({}, restProps), {
+        Component: "input",
+        type: "radio",
+        getRootRef: getRef,
+        className: "vkuiRadio__input"
     })), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiRadio__container"
     }, /*#__PURE__*/ React.createElement(RadioIcon, {
@@ -63,8 +67,10 @@ var RadioIcon = function(props) {
     }), /*#__PURE__*/ React.createElement("div", {
         className: "vkuiRadio__content"
     }, /*#__PURE__*/ React.createElement("div", {
-        className: "vkuiRadio__children"
-    }, children), hasReactNode(description) && /*#__PURE__*/ React.createElement(Footnote, {
+        className: "vkuiRadio__title"
+    }, /*#__PURE__*/ React.createElement("span", null, children), /*#__PURE__*/ React.createElement("div", {
+        className: "vkuiRadio__titleAfter"
+    }, titleAfter)), hasReactNode(description) && /*#__PURE__*/ React.createElement(Footnote, {
         className: "vkuiRadio__description"
     }, description))));
 };

package/dist/components/Radio/Radio.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { ACTIVE_EFFECT_DELAY, Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { ~~VisuallyHiddenInput~~ } from '../~~VisuallyHiddenInput~~/~~VisuallyHiddenInput~~';\nimport styles from './Radio.module.css';\n\nconst sizeYClassNames = {\n none: styles['Radio--sizeY-none'],\n [SizeType.COMPACT]: styles['Radio--sizeY-compact'],\n};\n\nconst RadioIcon = (props: React.SVGProps<SVGSVGElement>) => {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" aria-hidden {...props}>\n <circle cx=\"12\" cy=\"12\" r=\"11\" stroke=\"currentColor\" strokeWidth=\"2\" fill=\"none\" />\n <circle cx=\"12\" cy=\"12\" r=\"7.5\" className={styles['Radio__pin']} fill=\"currentColor\" />\n </svg>\n );\n};\n\nexport interface RadioProps\n extends React.InputHTMLAttributes<HTMLInputElement>,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLLabelElement> {\n description?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Radio\n */\nexport const Radio = ({\n children,\n description,\n style,\n className,\n getRootRef,\n ...restProps\n}: RadioProps) => {\n const platform = usePlatform();\n const { sizeY = 'none' } = useAdaptivity();\n\n return (\n <Tappable\n Component=\"label\"\n style={style}\n className={classNames(\n styles['Radio'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n activeEffectDelay={platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY}\n disabled={restProps.disabled}\n getRootRef={getRootRef}\n >\n <~~VisuallyHiddenInput~~ {...restProps} className={styles['Radio__input']} ~~type=\"radio~~\" />\n <div className={styles['Radio__container']}>\n <RadioIcon className={styles['Radio__icon']} />\n <div className={styles['Radio__content']}>\n <div className={styles['~~Radio__children~~']}>{children}</div>\n {hasReactNode(description) && (\n <Footnote className={styles['Radio__description']}>{description}</Footnote>\n )}\n </div>\n </div>\n </Tappable>\n );\n};\n"],"names":["React","classNames","hasReactNode","useAdaptivity","usePlatform","SizeType","Platform","ACTIVE_EFFECT_DELAY","Tappable","Footnote","~~VisuallyHiddenInput~~","sizeYClassNames","none","COMPACT","RadioIcon","props","svg","xmlns","viewBox","aria-hidden","circle","cx","cy","r","stroke","strokeWidth","fill","className","Radio","children","description","style","getRootRef","restProps","platform","sizeY","Component","REGULAR","activeEffectDelay","IOS","disabled","type","div"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,mBAAmB,EAAEC,QAAQ,QAAQ,uBAAuB;AACrE,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,~~mBAAmB~~,QAAQ,~~6CAA6C~~;~~AAGjF~~,IAAMC;IACJC,IAAI;GACHP,SAASQ,OAAO;AAGnB,IAAMC,YAAY,SAACC,OAAyC;IAC1D,qBACE,oBAACC;QAAIC,OAAM;QAA6BC,SAAQ;QAAYC,eAAAA,IAAW;OAAKJ,sBAC1E,oBAACK;QAAOC,IAAG;QAAKC,IAAG;QAAKC,GAAE;QAAKC,QAAO;QAAeC,aAAY;QAAIC,MAAK;sBAC1E,oBAACN;QAAOC,IAAG;QAAKC,IAAG;QAAKC,GAAE;QAAMI,SAAS;QAAwBD,MAAK;;AAG5E;~~AASA~~;;CAEC,GACD,OAAO,IAAME,QAAQ,~~iBAOH~~;~~QANhBC~~,kBAAAA,UACAC,qBAAAA,aACAC,eAAAA,OACAJ,mBAAAA,WACAK,oBAAAA,~~YACGC~~;~~QALHJ~~;QACAC;QACAC;QACAJ;QACAK;;IAGA,IAAME,~~WAAW9B~~;IACjB,IAA2BD,iBAAAA,wCAAAA,~~eAAnBgC~~,OAAAA,0CAAQ;IAEhB,qBACE,~~oBAAC3B~~;~~QACC4B~~,WAAU;~~QACVL~~,OAAOA;QACPJ,WAAW1B,~~wBAETkC~~,~~UAAU9B~~,~~SAASgC~~,OAAO,~~IAAI1B~~,eAAe,~~CAACwB~~,MAAM,~~EACpDR~~;~~QAEFW~~,mBAAmBJ,~~aAAa5B~~,~~SAASiC~~,GAAG,GAAG,~~MAAMhC~~,mBAAmB;~~QACxEiC~~,UAAUP,UAAUO,QAAQ;~~QAC5BR~~,YAAYA;qBAEZ,oBAACtB,~~6DAAwBuB~~;~~QAAWN~~,~~SAAS~~;~~QAA0Bc~~,MAAK;~~uBAC5E~~,~~oBAACC~~;~~QAAIf~~,SAAS;qBACZ,oBAACb;QAAUa,SAAS;sBACpB,~~oBAACe~~;~~QAAIf~~,SAAS;qBACZ,oBAACe;~~QAAIf~~,SAAS;~~OAA8BE~~,~~WAC3C3B~~,aAAa4B,8BACZ,oBAACrB;QAASkB,SAAS;OAAiCG;AAMhE,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { ACTIVE_EFFECT_DELAY, Tappable } from '../Tappable/Tappable';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './Radio.module.css';\n\nconst sizeYClassNames = {\n none: styles['Radio--sizeY-none'],\n [SizeType.COMPACT]: styles['Radio--sizeY-compact'],\n};\n\nconst RadioIcon = (props: React.SVGProps<SVGSVGElement>) => {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" aria-hidden {...props}>\n <circle cx=\"12\" cy=\"12\" r=\"11\" stroke=\"currentColor\" strokeWidth=\"2\" fill=\"none\" />\n <circle cx=\"12\" cy=\"12\" r=\"7.5\" className={styles['Radio__pin']} fill=\"currentColor\" />\n </svg>\n );\n};\n\nexport interface RadioProps\n extends React.InputHTMLAttributes<HTMLInputElement>,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLLabelElement> {\n description?: React.ReactNode;\n titleAfter?: React.ReactNode;\n}\n\n/*\n @see https://vkcom.github.io/VKUI/#/Radio\n */\nexport const Radio = ({\n children,\n description,\n style,\n className,\n getRootRef,\n titleAfter,\n getRef,\n ...restProps\n}: RadioProps) => {\n const platform = usePlatform();\n const { sizeY = 'none' } = useAdaptivity();\n\n return (\n <Tappable\n Component=\"label\"\n style={style}\n className={classNames(\n styles['Radio'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n activeEffectDelay={platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY}\n disabled={restProps.disabled}\n getRootRef={getRootRef}\n >\n <VisuallyHidden\n {...restProps}\n Component=\"input\"\n type=\"radio\"\n getRootRef={getRef}\n className={styles['Radio__input']}\n />\n <div className={styles['Radio__container']}>\n <RadioIcon className={styles['Radio__icon']} />\n <div className={styles['Radio__content']}>\n <div className={styles['Radio__title']}>\n <span>{children}</span>\n <div className={styles['Radio__titleAfter']}>{titleAfter}</div>\n </div>\n {hasReactNode(description) && (\n <Footnote className={styles['Radio__description']}>{description}</Footnote>\n )}\n </div>\n </div>\n </Tappable>\n );\n};\n"],"names":["React","classNames","hasReactNode","useAdaptivity","usePlatform","SizeType","Platform","ACTIVE_EFFECT_DELAY","Tappable","Footnote","VisuallyHidden","sizeYClassNames","none","COMPACT","RadioIcon","props","svg","xmlns","viewBox","aria-hidden","circle","cx","cy","r","stroke","strokeWidth","fill","className","Radio","children","description","style","getRootRef","titleAfter","getRef","restProps","platform","sizeY","Component","REGULAR","activeEffectDelay","IOS","disabled","type","div","span"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,QAAQ,QAAQ,qBAAqB;AAE9C,SAASC,mBAAmB,EAAEC,QAAQ,QAAQ,uBAAuB;AACrE,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,cAAc,QAAQ,mCAAmC;AAGlE,IAAMC;IACJC,IAAI;GACHP,SAASQ,OAAO;AAGnB,IAAMC,YAAY,SAACC,OAAyC;IAC1D,qBACE,oBAACC;QAAIC,OAAM;QAA6BC,SAAQ;QAAYC,eAAAA,IAAW;OAAKJ,sBAC1E,oBAACK;QAAOC,IAAG;QAAKC,IAAG;QAAKC,GAAE;QAAKC,QAAO;QAAeC,aAAY;QAAIC,MAAK;sBAC1E,oBAACN;QAAOC,IAAG;QAAKC,IAAG;QAAKC,GAAE;QAAMI,SAAS;QAAwBD,MAAK;;AAG5E;AAUA;;CAEC,GACD,OAAO,IAAME,QAAQ,iBASH;QARhBC,kBAAAA,UACAC,qBAAAA,aACAC,eAAAA,OACAJ,mBAAAA,WACAK,oBAAAA,YACAC,oBAAAA,YACAC,gBAAAA,QACGC;QAPHN;QACAC;QACAC;QACAJ;QACAK;QACAC;QACAC;;IAGA,IAAME,WAAWhC;IACjB,IAA2BD,iBAAAA,wCAAAA,eAAnBkC,OAAAA,0CAAQ;IAEhB,qBACE,oBAAC7B;QACC8B,WAAU;QACVP,OAAOA;QACPJ,WAAW1B,wBAEToC,UAAUhC,SAASkC,OAAO,IAAI5B,eAAe,CAAC0B,MAAM,EACpDV;QAEFa,mBAAmBJ,aAAa9B,SAASmC,GAAG,GAAG,MAAMlC,mBAAmB;QACxEmC,UAAUP,UAAUO,QAAQ;QAC5BV,YAAYA;qBAEZ,oBAACtB,wDACKyB;QACJG,WAAU;QACVK,MAAK;QACLX,YAAYE;QACZP,SAAS;uBAEX,oBAACiB;QAAIjB,SAAS;qBACZ,oBAACb;QAAUa,SAAS;sBACpB,oBAACiB;QAAIjB,SAAS;qBACZ,oBAACiB;QAAIjB,SAAS;qBACZ,oBAACkB,cAAMhB,yBACP,oBAACe;QAAIjB,SAAS;OAAgCM,cAE/C/B,aAAa4B,8BACZ,oBAACrB;QAASkB,SAAS;OAAiCG;AAMhE,EAAE"}

package/dist/components/Removable/Removable.d.ts CHANGED Viewed

@@ -10,14 +10,19 @@ export interface RemovableProps {
      */
     onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement | null) => void;
 }
-interface RemovableOwnProps extends React.AllHTMLAttributes<HTMLElement>, RemovableProps, HasRootRef<HTMLDivElement> {
+interface RemovableOwnProps extends React.HTMLAttributes<HTMLDivElement>, RemovableProps, HasRootRef<HTMLDivElement> {
     /**
      * Расположение кнопки удаления.
      */
     align?: 'start' | 'center';
+    /**
+     * Скрывает кнопку, но оставляет отступ.
+     * @since 5.4.0
+     */
+    indent?: boolean;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Removable
  */
-export declare const Removable: ({ getRootRef, children, onRemove, removePlaceholder, align, className, ...restProps }: RemovableOwnProps) => JSX.Element;
+export declare const Removable: ({ getRootRef, children, onRemove, removePlaceholder, align, className, indent, ...restProps }: RemovableOwnProps) => JSX.Element;
 export {};

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

@@ -79,13 +79,14 @@ import { Tappable } from "../Tappable/Tappable";
 /**
  * @see https://vkcom.github.io/VKUI/#/Removable
  */ export var Removable = function(_param) {
-    var getRootRef = _param.getRootRef, children = _param.children, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, _param_align = _param.align, align = _param_align === void 0 ? "center" : _param_align, className = _param.className, restProps = _object_without_properties(_param, [
+    var getRootRef = _param.getRootRef, children = _param.children, _param_onRemove = _param.onRemove, onRemove = _param_onRemove === void 0 ? noop : _param_onRemove, _param_removePlaceholder = _param.removePlaceholder, removePlaceholder = _param_removePlaceholder === void 0 ? "Удалить" : _param_removePlaceholder, _param_align = _param.align, align = _param_align === void 0 ? "center" : _param_align, className = _param.className, _param_indent = _param.indent, indent = _param_indent === void 0 ? false : _param_indent, restProps = _object_without_properties(_param, [
         "getRootRef",
         "children",
         "onRemove",
         "removePlaceholder",
         "align",
-        "className"
+        "className",
+        "indent"
     ]);
     var platform = usePlatform();
     var ref = useExternRef(getRootRef);
@@ -96,7 +97,7 @@ import { Tappable } from "../Tappable/Tappable";
     var removePlaceholderString = getTitleFromChildren(removePlaceholder);
     return /*#__PURE__*/ React.createElement("div", _object_spread_props(_object_spread({}, restProps), {
         ref: ref,
-        className: classNames(platform === Platform.IOS && "vkuiRemovable--ios", align === "start" && "vkuiRemovable--align-start", className)
+        className: classNames(platform === Platform.IOS && "vkuiRemovable--ios", align === "start" && "vkuiRemovable--align-start", indent && "vkuiRemovable--indent", className)
     }), platform !== Platform.IOS && /*#__PURE__*/ React.createElement("div", {
         className: classNames("vkuiRemovable__content", "vkuiInternalRemovable__content")
     }, children, /*#__PURE__*/ React.createElement(IconButton, {

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Removable/Removable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { HasRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Tappable } from '../Tappable/Tappable';\nimport styles from './Removable.module.css';\n\nexport interface RemovableProps {\n /*\n iOS only. Текст в выезжающей кнопке для удаления ячейки.\n /\n removePlaceholder?: React.ReactNode;\n /\n Коллбэк срабатывает при клике на контрол удаления.\n /\n onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement \| null) => void;\n}\n\ninterface RemovableIosOwnProps extends RemovableProps {\n removePlaceholderString?: string;\n ~~children?: React.ReactNode;\n~~}\n\n/\n @see https://vkcom.github.io/VKUI/#/RemovableIos\n /\nconst RemovableIos = ({\n onRemove,\n removePlaceholder,\n removePlaceholderString,\n children,\n}: RemovableIosOwnProps) => {\n const { window } = useDOM();\n\n const removeButtonRef = React.useRef<HTMLElement>(null);\n const disabledRef = React.useRef(true);\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 } else {\n disabledRef.current = true;\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 disabledRef.current = false;\n updateRemoveOffset(offsetWidth);\n };\n\n return (\n <div\n className={classNames(styles['Removable__content'], 'vkuiInternalRemovable__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 className={classNames(styles['Removable__action'], styles['Removable__toggle'])}\n onClick={onRemoveActivateClick}\n disabled={removeOffset > 0}\n >\n <i className={styles['Removable__toggle-in']} role=\"presentation\" />\n </IconButton>\n {children}\n\n <span className={styles['Removable__offset']} aria-hidden />\n\n <Tappable\n Component=\"button\"\n hasActive={false}\n hasHover={false}\n disabled={disabledRef.current}\n getRootRef={removeButtonRef}\n className={styles['Removable__remove']}\n onClick={onRemove}\n >\n <span className={styles['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\n/\n @see https://vkcom.github.io/VKUI/#/Removable\n */\nexport const Removable = ({\n getRootRef,\n children,\n onRemove = noop,\n removePlaceholder = 'Удалить',\n align = 'center',\n className,\n ...restProps\n}: RemovableOwnProps) => {\n const platform = usePlatform();\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 className={classNames(\n platform === Platform.IOS && styles['Removable--ios'],\n align === 'start' && styles['Removable--align-start'],\n className,\n )}\n >\n {platform !== Platform.IOS && (\n <div className={classNames(styles['Removable__content'], 'vkuiInternalRemovable__content')}>\n {children}\n\n <IconButton\n activeMode=\"opacity\"\n hoverMode=\"opacity\"\n className={styles['Removable__action']}\n onClick={onRemoveClick}\n aria-label={removePlaceholderString}\n >\n <Icon24Cancel role=\"presentation\" />\n </IconButton>\n\n <span className={styles['Removable__offset']} aria-hidden />\n </div>\n )}\n\n {platform === Platform.IOS && (\n <RemovableIos\n onRemove={onRemoveClick}\n removePlaceholder={removePlaceholder}\n removePlaceholderString={removePlaceholderString}\n >\n {children}\n </RemovableIos>\n )}\n </div>\n );\n};\n"],"names":["React","Icon24Cancel","classNames","noop","useExternRef","useGlobalEventListener","usePlatform","useDOM","Platform","getTitleFromChildren","IconButton","Tappable","RemovableIos","onRemove","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","disabledRef","useState","removeOffset","updateRemoveOffset","capture","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","div","className","style","transform","onTransitionEnd","hasActive","hasHover","aria-label","onClick","disabled","i","role","span","aria-hidden","Component","getRootRef","Removable","align","restProps","platform","ref","onRemoveClick","preventDefault","IOS","activeMode","hoverMode"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,sBAAsB,QAAQ,qCAAqC;AAC5E,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,SAASC,oBAAoB,QAAQ,kBAAkB;AAEvD,SAASC,UAAU,QAAQ,2BAA2B;AACtD,SAASC,QAAQ,QAAQ,uBAAuB;~~AAmBhD~~;;CAEC,GACD,IAAMC,eAAe,gBAKO;QAJ1BC,iBAAAA,UACAC,0BAAAA,mBACAC,gCAAAA,yBACAC,iBAAAA;IAEA,IAAM,AAAEC,SAAWV,SAAXU;IAER,IAAMC,kBAAkBlB,MAAMmB,MAAM,CAAc,IAAI;IACtD,IAAMC,cAAcpB,MAAMmB,MAAM,CAAC,IAAI;IACrC,IAA2CnB,mCAAAA,MAAMqB,QAAQ,CAAC,QAAnDC,eAAoCtB,oBAAtBuB,qBAAsBvB;IAE3CK,uBACEY,QACA,SACA,WAAM;QACJ,IAAIK,eAAe,GAAG;YACpBC,mBAAmB;QACrB,CAAC;IACH,GACA;QAAEC,SAAS,IAAI;IAAC;IAGlB,IAAMC,wBAAwB,WAAM;QAClC,IAAIH,eAAe,GAAG;gBACpBJ;YAAAA,4BAAAA,6BAAAA,KAAAA,IAAAA,CAAAA,2BAAAA,gBAAiBQ,OAAO,cAAxBR,sCAAAA,KAAAA,IAAAA,yBAA0BS;QAC5B,OAAO;YACLP,YAAYM,OAAO,GAAG,IAAI;QAC5B,CAAC;IACH;IAEA,IAAME,wBAAwB,SAACC,GAAwB;QACrDA,EAAEC,eAAe;QACjB,IAAI,CAACZ,gBAAgBQ,OAAO,EAAE;YAC5B;QACF,CAAC;QACD,IAAM,AAAEK,cAAgBb,gBAAgBQ,OAAO,CAAvCK;QACRX,YAAYM,OAAO,GAAG,KAAK;QAC3BH,mBAAmBQ;IACrB;IAEA,qBACE,oBAACC;QACCC,WAAW/B,qCAAyC;QACpDgC,OAAO;YAAEC,WAAW,AAAC,eAAgC,OAAlBb,yBAAAA,0BAAAA,eAAgB,CAAC,EAAC;QAAK;QAC1Dc,iBAAiBX;qBAEjB,oBAACf;QACC2B,WAAW,KAAK;QAChBC,UAAU,KAAK;QACfC,cAAYxB;QACZkB,WAAW/B;QACXsC,SAASZ;QACTa,UAAUnB,eAAe;qBAEzB,oBAACoB;QAAET,SAAS;QAAkCU,MAAK;SAEpD3B,wBAED,oBAAC4B;QAAKX,SAAS;QAA+BY,eAAAA,IAAW;sBAEzD,oBAAClC;QACCmC,WAAU;QACVT,WAAW,KAAK;QAChBC,UAAU,KAAK;QACfG,UAAUrB,YAAYM,OAAO;QAC7BqB,YAAY7B;QACZe,SAAS;QACTO,SAAS3B;qBAET,oBAAC+B;QAAKX,SAAS;OAAmCnB;AAI1D;~~AAYA~~;;CAEC,GACD,OAAO,IAAMkC,YAAY,~~iBAQA~~;~~QAPvBD~~,oBAAAA,YACA/B,kBAAAA,mCACAH,UAAAA,wCAAWV,0DACXW,mBAAAA,0DAAoB,4DACpBmC,OAAAA,kCAAQ,yBACRhB,mBAAAA,~~WACGiB~~;~~QANHH~~;QACA/B;QACAH;QACAC;QACAmC;QACAhB;;IAGA,~~IAAMkB~~,~~WAAW7C~~;IAEjB,~~IAAM8C~~,~~MAAMhD~~,aAAa2C;IAEzB,~~IAAMM~~,gBAAgB,~~SAACxB~~,GAAwB;QAC7CA,~~EAAEyB~~,cAAc;~~QAChBzC~~,SAASgB;IACX;IAEA,IAAMd,0BAAkCN,qBAAqBK;IAE7D,qBACE,oBAACkB,+~~CACKkB~~;QACJE,KAAKA;~~QACLnB~~,WAAW/B,~~WACTiD~~,~~aAAa3C~~,~~SAAS+C~~,GAAG,~~0BACzBN~~,UAAU,~~yCACVhB~~;~~QAGDkB~~,~~aAAa3C~~,~~SAAS+C~~,GAAG,kBACxB,~~oBAACvB~~;QAAIC,WAAW/B,qCAAyC;OACtDc,wBAED,oBAACN;~~QACC8C~~,YAAW;QACXC,WAAU;~~QACVxB~~,SAAS;QACTO,~~SAASa~~;~~QACTd~~,cAAYxB;qBAEZ,oBAACd;QAAa0C,MAAK;uBAGrB,oBAACC;QAAKX,SAAS;QAA+BY,eAAAA,IAAW;~~SAI5DM~~,~~aAAa3C~~,~~SAAS+C~~,GAAG,kBACxB,~~oBAAC3C~~;QACCC,~~UAAUwC~~;~~QACVvC~~,mBAAmBA;QACnBC,yBAAyBA;OAExBC;AAKX,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/Removable/Removable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon24Cancel } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { getTitleFromChildren } from '../../lib/utils';\nimport { HasChildren, HasRootRef } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Tappable } from '../Tappable/Tappable';\nimport styles from './Removable.module.css';\n\nexport interface RemovableProps {\n /*\n iOS only. Текст в выезжающей кнопке для удаления ячейки.\n /\n removePlaceholder?: React.ReactNode;\n /\n Коллбэк срабатывает при клике на контрол удаления.\n /\n onRemove?: (e: React.MouseEvent, rootEl?: HTMLElement \| null) => void;\n}\n\ninterface RemovableIosOwnProps extends RemovableProps, HasChildren {\n removePlaceholderString?: string;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/RemovableIos\n /\nconst RemovableIos = ({\n onRemove,\n removePlaceholder,\n removePlaceholderString,\n children,\n}: RemovableIosOwnProps) => {\n const { window } = useDOM();\n\n const removeButtonRef = React.useRef<HTMLElement>(null);\n const disabledRef = React.useRef(true);\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 } else {\n disabledRef.current = true;\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 disabledRef.current = false;\n updateRemoveOffset(offsetWidth);\n };\n\n return (\n <div\n className={classNames(styles['Removable__content'], 'vkuiInternalRemovable__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 className={classNames(styles['Removable__action'], styles['Removable__toggle'])}\n onClick={onRemoveActivateClick}\n disabled={removeOffset > 0}\n >\n <i className={styles['Removable__toggle-in']} role=\"presentation\" />\n </IconButton>\n {children}\n\n <span className={styles['Removable__offset']} aria-hidden />\n\n <Tappable\n Component=\"button\"\n hasActive={false}\n hasHover={false}\n disabled={disabledRef.current}\n getRootRef={removeButtonRef}\n className={styles['Removable__remove']}\n onClick={onRemove}\n >\n <span className={styles['Removable__remove-in']}>{removePlaceholder}</span>\n </Tappable>\n </div>\n );\n};\n\ninterface RemovableOwnProps\n extends React.HTMLAttributes<HTMLDivElement>,\n RemovableProps,\n HasRootRef<HTMLDivElement> {\n /\n Расположение кнопки удаления.\n /\n align?: 'start' \| 'center';\n /\n Скрывает кнопку, но оставляет отступ.\n * @since 5.4.0\n /\n indent?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/Removable\n */\nexport const Removable = ({\n getRootRef,\n children,\n onRemove = noop,\n removePlaceholder = 'Удалить',\n align = 'center',\n className,\n indent = false,\n ...restProps\n}: RemovableOwnProps) => {\n const platform = usePlatform();\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 className={classNames(\n platform === Platform.IOS && styles['Removable--ios'],\n align === 'start' && styles['Removable--align-start'],\n indent && styles['Removable--indent'],\n className,\n )}\n >\n {platform !== Platform.IOS && (\n <div className={classNames(styles['Removable__content'], 'vkuiInternalRemovable__content')}>\n {children}\n\n <IconButton\n activeMode=\"opacity\"\n hoverMode=\"opacity\"\n className={styles['Removable__action']}\n onClick={onRemoveClick}\n aria-label={removePlaceholderString}\n >\n <Icon24Cancel role=\"presentation\" />\n </IconButton>\n\n <span className={styles['Removable__offset']} aria-hidden />\n </div>\n )}\n\n {platform === Platform.IOS && (\n <RemovableIos\n onRemove={onRemoveClick}\n removePlaceholder={removePlaceholder}\n removePlaceholderString={removePlaceholderString}\n >\n {children}\n </RemovableIos>\n )}\n </div>\n );\n};\n"],"names":["React","Icon24Cancel","classNames","noop","useExternRef","useGlobalEventListener","usePlatform","useDOM","Platform","getTitleFromChildren","IconButton","Tappable","RemovableIos","onRemove","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","disabledRef","useState","removeOffset","updateRemoveOffset","capture","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","div","className","style","transform","onTransitionEnd","hasActive","hasHover","aria-label","onClick","disabled","i","role","span","aria-hidden","Component","getRootRef","Removable","align","indent","restProps","platform","ref","onRemoveClick","preventDefault","IOS","activeMode","hoverMode"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n}\n\nexport interface RootState {\n activeView: string;\n transition: boolean;\n isBack?: boolean;\n prevView?: string;\n}\n\nconst warn = warnOnce('Root');\n\n/*\n @see https://vkcom.github.io/VKUI/#/Root\n */\nexport const Root = ({\n children,\n activeView: _activeView,\n onTransition,\n nav,\n className,\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>>({}).current;\n\n const { transitionMotionEnabled = true } = useConfigProvider();\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({\n activeView: panel,\n prevView: activeView,\n transition: !disableAnimation,\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 }, [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, prevView]);\n\n const fallbackTransition = useTimeout(finishTransition, platform === Platform.IOS ? 600 : 300);\n React.useEffect(() => {\n if (!transition) {\n fallbackTransition.clear();\n return;\n }\n fallbackTransition.set();\n }, [fallbackTransition, 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 className={classNames(\n styles['Root'],\n platform === Platform.IOS && styles['Root--ios'],\n transition && styles['Root--transition'],\n className,\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 = transition && viewId === (isBack ? prevView : activeView);\n const compensateScroll =\n transition && (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 className={classNames(\n styles['Root__view'],\n transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n )}\n >\n <NavTransitionProvider entering={transition && viewId === activeView}>\n <div\n className={styles['Root__scrollCompensation']}\n style={{\n marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n }}\n >\n {view}\n </div>\n </NavTransitionProvider>\n </div>\n );\n })}\n </div>\n );\n};\n"],"names":["React","classNames","usePlatform","useTimeout","useDOM","getNavId","Platform","useIsomorphicLayoutEffect","warnOnce","ScrollContext","useConfigProvider","NavTransitionProvider","SplitColContext","warn","Root","children","activeView","_activeView","onTransition","nav","className","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","IOS","useEffect","clear","set","onAnimationEnd","e","includes","animationName","div","viewId","isTransitionTarget","compensateScroll","key","ref","undefined","entering","style","marginTop"],"mappings":"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~~;YACE;YACA;YACA;YACA;SACD~~,CAACC,QAAQ,CAACD,EAAEE,aAAa,GAC1B;YACAhB;QACF,CAAC;IACH;IAEA,qBACE,oBAACiB,+CACK9C;QACJD,WAAWnB,uBAETuB,aAAalB,SAASqD,GAAG,qBACzBtB,sCACAjB;QAGDa,MAAMW,GAAG,CAAC,SAACC,MAAS;QACnB,IAAMuB,SAAS/D,SAASwC,KAAKC,KAAK,EAAEjC;QACpC,IAAIuD,WAAWpD,cAAc,CAAEqB,CAAAA,cAAc+B,WAAW9B,QAAO,GAAI;YACjE,OAAO,IAAI;QACb,CAAC;QACD,IAAM+B,qBAAqBhC,cAAc+B,WAAY7B,CAAAA,SAASD,WAAWtB,UAAU,AAAD;QAClF,IAAMsD,mBACJjC,cAAe+B,CAAAA,WAAW9B,YAAaC,UAAU6B,WAAWpD,UAAU;YAkBpBU;QAjBpD,qBACE,oBAACyC;YACCI,KAAKH;YACLI,KAAK,SAACR;uBAAMI,UAAWvC,CAAAA,SAAS,CAACuC,OAAO,GAAGJ,CAAAA;;YAC3CD,gBAAgBM,qBAAqBN,iBAAiBU,SAAS;YAC/DrD,WAAWnB,6BAEToC,cAAc+B,WAAW9B,YAAYC,uCACrCF,cAAc+B,WAAW9B,YAAY,CAACC,0CACtCF,cAAc+B,WAAWpD,cAAcuB,uCACvCF,cAAc+B,WAAWpD,cAAc,CAACuB;yBAG1C,oBAAC5B;YAAsB+D,UAAUrC,cAAc+B,WAAWpD;yBACxD,oBAACmD;YACC/C,SAAS;YACTuD,OAAO;gBACLC,WAAWN,mBAAmBF,UAAU,CAAE1C,CAAAA,CAAAA,kBAAAA,OAAO,CAAC0C,OAAO,cAAf1C,6BAAAA,kBAAmB,CAAC,AAAD,IAAK+C,SAAS;YAC7E;WAEC5B;IAKX;AAGN,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/Root/Root.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { useDOM } from '../../lib/dom';\nimport { getNavId, NavIdProps } from '../../lib/getNavId';\nimport { Platform } from '../../lib/platform';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './Root.module.css';\n\nexport interface RootProps extends React.HTMLAttributes<HTMLDivElement>, NavIdProps {\n activeView: string;\n onTransition?(params: { isBack: boolean; from: string; to: string }): void;\n}\n\nexport interface RootState {\n activeView: string;\n transition: boolean;\n isBack?: boolean;\n prevView?: string;\n}\n\nconst warn = warnOnce('Root');\n\n/*\n @see https://vkcom.github.io/VKUI/#/Root\n */\nexport const Root = ({\n children,\n activeView: _activeView,\n onTransition,\n nav,\n className,\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>>({}).current;\n\n const { transitionMotionEnabled = true } = useConfigProvider();\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({\n activeView: panel,\n prevView: activeView,\n transition: !disableAnimation,\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 }, [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, prevView]);\n\n const fallbackTransition = useTimeout(finishTransition, platform === Platform.IOS ? 600 : 300);\n React.useEffect(() => {\n if (!transition) {\n fallbackTransition.clear();\n return;\n }\n fallbackTransition.set();\n }, [fallbackTransition, transition]);\n\n const onAnimationEnd = (e: React.AnimationEvent) => {\n if (\n [\n styles['vkui-root-android-animation-hide-back'],\n styles['vkui-root-android-animation-show-forward'],\n styles['vkui-root-ios-animation-hide-back'],\n styles['vkui-root-ios-animation-show-forward'],\n ].includes(e.animationName)\n ) {\n finishTransition();\n }\n };\n\n return (\n <div\n {...restProps}\n className={classNames(\n styles['Root'],\n platform === Platform.IOS && styles['Root--ios'],\n transition && styles['Root--transition'],\n className,\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 = transition && viewId === (isBack ? prevView : activeView);\n const compensateScroll =\n transition && (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 className={classNames(\n styles['Root__view'],\n transition && viewId === prevView && isBack && styles['Root__view--hide-back'],\n transition && viewId === prevView && !isBack && styles['Root__view--hide-forward'],\n transition && viewId === activeView && isBack && styles['Root__view--show-back'],\n transition && viewId === activeView && !isBack && styles['Root__view--show-forward'],\n )}\n >\n <NavTransitionProvider entering={transition && viewId === activeView}>\n <div\n className={styles['Root__scrollCompensation']}\n style={{\n marginTop: compensateScroll ? viewId && -(scrolls[viewId] ?? 0) : undefined,\n }}\n >\n {view}\n </div>\n </NavTransitionProvider>\n </div>\n );\n })}\n </div>\n );\n};\n"],"names":["React","classNames","usePlatform","useTimeout","useDOM","getNavId","Platform","useIsomorphicLayoutEffect","warnOnce","ScrollContext","useConfigProvider","NavTransitionProvider","SplitColContext","warn","Root","children","activeView","_activeView","onTransition","nav","className","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","IOS","useEffect","clear","set","onAnimationEnd","e","includes","animationName","div","viewId","isTransitionTarget","compensateScroll","key","ref","undefined","entering","style","marginTop"],"mappings":"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"}

package/dist/components/Search/Search.d.ts CHANGED Viewed

@@ -10,8 +10,10 @@ export interface SearchProps extends React.InputHTMLAttributes<HTMLInputElement>
     icon?: React.ReactNode;
     onIconClick?: (e: VKUITouchEvent) => void;
     defaultValue?: string;
+    iconAriaLabel?: string;
+    clearAriaLabel?: string;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Search
  */
-export declare const Search: ({ before, className, defaultValue, placeholder, after, getRef, icon, onIconClick, style, autoComplete, onChange: onChangeProp, value: valueProp, ...inputProps }: SearchProps) => JSX.Element;
+export declare const Search: ({ before, className, defaultValue, placeholder, after, getRef, icon, onIconClick, style, autoComplete, onChange: onChangeProp, value: valueProp, iconAriaLabel, clearAriaLabel, ...inputProps }: SearchProps) => JSX.Element;