npm - @vkontakte/vkui - Versions diffs - 5.1.2 → 5.2.1 - Mend

@vkontakte/vkui 5.1.2 → 5.2.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 (1245) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PullToRefresh.js","names":["React","useDOM","classNames","Platform","runTapticImpactOccurred","useIsomorphicLayoutEffect","usePlatform","useGlobalEventListener","useScroll","Touch","FixedLayout","PullToRefreshSpinner","TouchRootContext","usePrevious","useTimeout","clamp","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","setWaitFetchingTimeout","set","clearWaitFetchingTimeout","clear","undefined","runRefreshing","prevSpinnerY","onTouchStart","e","onTouchMove","isY","shiftY","pageYOffset","getScroll","y","shift","Math","current","currentY","progress","abs","onTouchEnd","spinnerTransform","contentTransform","transform","WebkitTransform","opacity"],"sources":["../../../../src/components/PullToRefresh/PullToRefresh.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AnyFunction } from '../../types';\nimport { DOMProps, useDOM } from '../../lib/dom';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Platform } from '../../lib/platform';\nimport { runTapticImpactOccurred } from '../../lib/taptic';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { ScrollContextInterface, useScroll } from '../AppRoot/ScrollContext';\nimport { Touch, TouchEvent, TouchProps } from '../Touch/Touch';\nimport { FixedLayout } from '../FixedLayout/FixedLayout';\nimport { PullToRefreshSpinner } from './PullToRefreshSpinner';\nimport TouchRootContext from '../Touch/TouchContext';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { useTimeout } from '../../hooks/useTimeout';\nimport { clamp } from '../../helpers/math';\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"],"mappings":"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"}
1	+ {"version":3,"file":"PullToRefresh.js","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","setWaitFetchingTimeout","set","clearWaitFetchingTimeout","clear","undefined","runRefreshing","prevSpinnerY","onTouchStart","e","onTouchMove","isY","shiftY","pageYOffset","getScroll","y","shift","Math","current","currentY","progress","abs","onTouchEnd","spinnerTransform","contentTransform","transform","WebkitTransform","opacity"],"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"],"mappings":"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"}

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

@@ -1,16 +1,20 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children", "description", "style", "className", "getRootRef"];
 import * as React from 'react';
-import { ACTIVE_EFFECT_DELAY, Tappable } from '../Tappable/Tappable';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
-import { Platform } from '../../lib/platform';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
 import { usePlatform } from '../../hooks/usePlatform';
-import { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';
+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 { getSizeYClassName } from '../../helpers/getSizeYClassName';
-import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';
 import "./Radio.module.css";
+var sizeYClassNames = _defineProperty({
+  none: "vkuiRadio--sizeY-none"
+}, SizeType.COMPACT, "vkuiRadio--sizeY-compact");
 var RadioIcon = function RadioIcon(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
@@ -43,11 +47,12 @@ export var Radio = function Radio(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded);
   var platform = usePlatform();
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   return /*#__PURE__*/React.createElement(Tappable, {
     Component: "label",
     style: style,
-    className: classNames("vkuiRadio", getSizeYClassName("vkuiRadio", sizeY), className),
+    className: classNames("vkuiRadio", sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], className),
     activeEffectDelay: platform === Platform.IOS ? 100 : ACTIVE_EFFECT_DELAY,
     disabled: restProps.disabled,
     getRootRef: getRootRef

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Radio.js","names":["React","~~ACTIVE_EFFECT_DELAY~~","~~Tappable~~","~~classNames~~","~~hasReactNode~~","Platform","~~usePlatform~~","~~VisuallyHiddenInput~~","Footnote","~~getSizeYClassName~~","~~useAdaptivity~~","RadioIcon","props","Radio","children","description","style","className","getRootRef","restProps","platform","sizeY","IOS","disabled"],"sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~ACTIVE_EFFECT_DELAY~~, ~~Tappable~~ } from '~~../Tappable~~/~~Tappable~~';\nimport { ~~classNames,~~ ~~hasReactNode~~ } from '~~@vkontakte~~/~~vkjs~~';\nimport { ~~Platform~~ } from '../../~~lib~~/~~platform~~';\nimport { ~~HasRef,~~ ~~HasRootRef~~ } from '../../~~types~~';\nimport { ~~usePlatform~~ } from '../../~~hooks~~/~~usePlatform~~';\nimport { ~~VisuallyHiddenInput~~ } from '~~../VisuallyHiddenInput/VisuallyHiddenInput~~';\nimport { ~~Footnote~~ } from '../~~Typography~~/~~Footnote/Footnote~~';\nimport { ~~getSizeYClassName~~ } from '~~../../helpers~~/~~getSizeYClassName~~';\nimport { ~~useAdaptivity~~ } from '~~../../hooks~~/~~useAdaptivity~~';\nimport styles from './Radio.module.css';\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 } = useAdaptivity();\n\n return (\n <Tappable\n Component=\"label\"\n style={style}\n className={classNames(styles['Radio'], ~~getSizeYClassName(styles~~[~~'Radio'~~]~~, sizeY),~~ className)}\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"],"mappings":"~~;;;~~AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~mBAAmB~~,EAAEC,~~QAAQ~~,QAAQ,~~sBAAsB~~;~~AACpE~~,SAASC,~~UAAU~~,~~EAAEC~~,~~YAAY~~,QAAQ,~~iBAAiB~~;~~AAC1D~~,SAASC,QAAQ,QAAQ,~~oBAAoB~~;~~AAE7C~~,SAASC,~~WAAW~~,QAAQ,~~yBAAyB~~;~~AACrD~~,SAASC,mBAAmB,QAAQ,~~4CAA4C~~;~~AAChF~~,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,~~iBAAiB~~,QAAQ,~~iCAAiC~~;~~AACnE~~,~~SAASC~~,~~aAAa~~,QAAQ,~~2BAA2B~~;~~AAAC;AAG1D~~,IAAMC,SAAS,GAAG,SAAZA,SAAS,CAAIC,KAAoC,EAAK;EAC1D,oBACE;IAAK,KAAK,EAAC,4BAA4B;IAAC,OAAO,EAAC,WAAW;IAAC;EAAW,GAAKA,KAAK,gBAC/E;IAAQ,EAAE,EAAC,IAAI;IAAC,EAAE,EAAC,IAAI;IAAC,CAAC,EAAC,IAAI;IAAC,MAAM,EAAC,cAAc;IAAC,WAAW,EAAC,GAAG;IAAC,IAAI,EAAC;EAAM,EAAG,eACnF;IAAQ,EAAE,EAAC,IAAI;IAAC,EAAE,EAAC,IAAI;IAAC,CAAC,EAAC,KAAK;IAAC,SAAS,kBAAuB;IAAC,IAAI,EAAC;EAAc,EAAG,CACnF;AAEV,CAAC;AASD;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,IANhBC,QAAQ,QAARA,QAAQ;IACRC,WAAW,QAAXA,WAAW;IACXC,KAAK,QAALA,KAAK;IACLC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,~~GAAGd~~,WAAW,EAAE;EAC9B,~~qBAAkBI~~,aAAa,EAAE;~~IAAzBW~~,KAAK,~~kBAALA~~,~~KAAK~~;~~EAEb~~,oBACE,oBAAC,QAAQ;IACP,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEL,KAAM;IACb,SAAS,~~EAAEb~~,UAAU,~~cAAkBM~~,~~iBAAiB~~,~~cAAkBY~~,KAAK,CAAC,~~EAAEJ~~,SAAS,~~CAAE~~;~~IAC7F~~,iBAAiB,EAAEG,QAAQ,~~KAAKf~~,QAAQ,~~CAACiB~~,GAAG,GAAG,GAAG,~~GAAGrB~~,mBAAoB;IACzE,QAAQ,~~EAAEkB~~,SAAS,~~CAACI~~,QAAS;IAC7B,UAAU,~~EAAEL~~;EAAW,gBAEvB,oBAAC,mBAAmB,eAAKC,SAAS;IAAE,SAAS,oBAAyB;IAAC,IAAI,EAAC;EAAO,GAAG,eACtF;IAAK,SAAS;EAA6B,gBACzC,oBAAC,SAAS;IAAC,SAAS;EAAwB,EAAG,eAC/C;IAAK,SAAS;EAA2B,gBACvC;IAAK,SAAS;EAA4B,GAAEL,QAAQ,CAAO,~~EAC1DV~~,YAAY,~~CAACW~~,WAAW,CAAC,iBACxB,oBAAC,QAAQ;IAAC,SAAS;EAA+B,GAAEA,WAAW,CAChE,CACG,CACF,CACG;AAEf,CAAC"}
1	+ {"version":3,"file":"Radio.js","names":["React","classNames","hasReactNode","useAdaptivity","usePlatform","SizeType","Platform","ACTIVE_EFFECT_DELAY","Tappable","Footnote","VisuallyHiddenInput","sizeYClassNames","none","COMPACT","RadioIcon","props","Radio","children","description","style","className","getRootRef","restProps","platform","sizeY","REGULAR","IOS","disabled"],"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"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,QAAQ,QAAQ,oBAAoB;AAE7C,SAASC,mBAAmB,EAAEC,QAAQ,QAAQ,sBAAsB;AACpE,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,mBAAmB,QAAQ,4CAA4C;AAAC;AAGjF,IAAMC,eAAe;EACnBC,IAAI;AAA6B,GAChCP,QAAQ,CAACQ,OAAO,6BAClB;AAED,IAAMC,SAAS,GAAG,SAAZA,SAAS,CAAIC,KAAoC,EAAK;EAC1D,oBACE;IAAK,KAAK,EAAC,4BAA4B;IAAC,OAAO,EAAC,WAAW;IAAC;EAAW,GAAKA,KAAK,gBAC/E;IAAQ,EAAE,EAAC,IAAI;IAAC,EAAE,EAAC,IAAI;IAAC,CAAC,EAAC,IAAI;IAAC,MAAM,EAAC,cAAc;IAAC,WAAW,EAAC,GAAG;IAAC,IAAI,EAAC;EAAM,EAAG,eACnF;IAAQ,EAAE,EAAC,IAAI;IAAC,EAAE,EAAC,IAAI;IAAC,CAAC,EAAC,KAAK;IAAC,SAAS,kBAAuB;IAAC,IAAI,EAAC;EAAc,EAAG,CACnF;AAEV,CAAC;AASD;AACA;AACA;AACA,OAAO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAOA;EAAA,IANhBC,QAAQ,QAARA,QAAQ;IACRC,WAAW,QAAXA,WAAW;IACXC,KAAK,QAALA,KAAK;IACLC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAGnB,WAAW,EAAE;EAC9B,qBAA2BD,aAAa,EAAE;IAAA,sCAAlCqB,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE,oBAAC,QAAQ;IACP,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEL,KAAM;IACb,SAAS,EAAElB,UAAU,cAEnBuB,KAAK,KAAKnB,QAAQ,CAACoB,OAAO,IAAId,eAAe,CAACa,KAAK,CAAC,EACpDJ,SAAS,CACT;IACF,iBAAiB,EAAEG,QAAQ,KAAKjB,QAAQ,CAACoB,GAAG,GAAG,GAAG,GAAGnB,mBAAoB;IACzE,QAAQ,EAAEe,SAAS,CAACK,QAAS;IAC7B,UAAU,EAAEN;EAAW,gBAEvB,oBAAC,mBAAmB,eAAKC,SAAS;IAAE,SAAS,oBAAyB;IAAC,IAAI,EAAC;EAAO,GAAG,eACtF;IAAK,SAAS;EAA6B,gBACzC,oBAAC,SAAS;IAAC,SAAS;EAAwB,EAAG,eAC/C;IAAK,SAAS;EAA2B,gBACvC;IAAK,SAAS;EAA4B,GAAEL,QAAQ,CAAO,EAC1Df,YAAY,CAACgB,WAAW,CAAC,iBACxB,oBAAC,QAAQ;IAAC,SAAS;EAA+B,GAAEA,WAAW,CAChE,CACG,CACF,CACG;AAEf,CAAC"}

package/dist/cssm/components/Radio/Radio.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiRadio{display:block;font-family~~:VK Sans Text,-~~apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem .vkuiRadio{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular));width:100%}.vkuiRadio__container{align-items:center;display:flex;justify-content:flex-start}.vkuiRadio__input:disabled~.vkuiRadio__container{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiRadio__icon{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);flex-shrink:0;height:22px;margin-right:14px;transition:color .15s cubic-bezier(.4,0,.2,1);transition:color .15s var(--vkui--animation_easing_platform);width:22px}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiRadio__icon .vkuiRadio__pin{transform:scale(0);transform-origin:12px 12px;transition:transform .15s cubic-bezier(.4,0,.2,1);transition:transform .15s var(--vkui--animation_easing_platform)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon .vkuiRadio__pin{transform:none}.vkuiRadio__content{color:#000;color:var(--vkui--color_text_primary);display:block;flex-grow:1;max-width:100%}.vkuiRadio__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin-bottom:12px;margin-top:2px}.vkuiRadio__children{margin-top:12px}.vkuiRadio__children:last-child{margin-bottom:12px}.vkuiRadio--sizeY-compact .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-compact .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-compact .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-compact .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-compact .vkuiRadio__icon:after{height:12px;width:12px}@media (pointer:fine) and (min-width:768px)~~,not (min-height:415px)~~{.vkuiRadio--sizeY-none .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-none .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-none .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-none .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-none .vkuiRadio__icon:after{height:12px;width:12px}}.vkuiRadioGroup .vkuiRadio{box-sizing:border-box;flex:1;margin:0}
1	+ .vkuiRadio{display:block;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);padding:0 16px;padding:0 var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem .vkuiRadio{box-sizing:initial;margin:0 calc(-1 * 16px);margin:0 calc(-1 * var(--vkui--size_base_padding_horizontal--regular));width:100%}.vkuiRadio__container{align-items:center;display:flex;justify-content:flex-start}.vkuiRadio__input:disabled~.vkuiRadio__container{opacity:.64;opacity:var(--vkui--opacity_disable_accessibility)}.vkuiRadio__icon{color:#b8c1cc;color:var(--vkui--color_icon_tertiary);flex-shrink:0;height:22px;margin-right:14px;transition:color .15s cubic-bezier(.4,0,.2,1);transition:color .15s var(--vkui--animation_easing_platform);width:22px}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon{color:#2688eb;color:var(--vkui--color_icon_accent)}.vkuiRadio__icon .vkuiRadio__pin{transform:scale(0);transform-origin:12px 12px;transition:transform .15s cubic-bezier(.4,0,.2,1);transition:transform .15s var(--vkui--animation_easing_platform)}.vkuiRadio__input:checked~.vkuiRadio__container .vkuiRadio__icon .vkuiRadio__pin{transform:none}.vkuiRadio__content{color:#000;color:var(--vkui--color_text_primary);display:block;flex-grow:1;max-width:100%}.vkuiRadio__description{color:#818c99;color:var(--vkui--color_text_secondary);display:block;margin-bottom:12px;margin-top:2px}.vkuiRadio__children{margin-top:12px}.vkuiRadio__children:last-child{margin-bottom:12px}.vkuiRadio--sizeY-compact .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-compact .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-compact .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-compact .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-compact .vkuiRadio__icon:after{height:12px;width:12px}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiRadio--sizeY-none .vkuiRadio__children{margin-top:8px}.vkuiRadio--sizeY-none .vkuiRadio__children:last-child{margin-bottom:8px}.vkuiRadio--sizeY-none .vkuiRadio__description{margin-bottom:7px}.vkuiRadio--sizeY-none .vkuiRadio__icon{height:18px;width:18px}.vkuiRadio--sizeY-none .vkuiRadio__icon:after{height:12px;width:12px}}.vkuiRadioGroup .vkuiRadio{box-sizing:border-box;flex:1;margin:0}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RangeSlider.js","names":["React","clamp","UniversalSlider","RangeSlider","onChange","min","max","defaultValue","step","props","isControlled","value","undefined","useState","localValue","setValue","start","end","useMemo","handleChange","useCallback","nextValue","event","disabled"],"sources":["../../../../src/components/RangeSlider/RangeSlider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { ~~UniversalSlider,~~ ~~UniversalSliderProps~~ } from '~~./UniversalSlider~~';\nimport { ~~TouchEvent~~ } from '~~../Touch/Touch~~';\n\nexport type Value = [number, number];\nexport type RangeSliderProps = UniversalSliderProps<Value>;\n\n/*\n @see https://vkcom.github.io/VKUI/#/RangeSlider\n */\nexport const RangeSlider = ({\n onChange,\n min = 0,\n max = 100,\n defaultValue = [min, max],\n step = 0,\n ...props\n}: RangeSliderProps) => {\n const isControlled = props.value !== undefined;\n\n const [localValue, setValue] = React.useState(defaultValue);\n const [start, end] = props.value \|\| localValue;\n const value = React.useMemo(\n () => [clamp(start, min, max), clamp(end, min, max)] as Value,\n [end, max, min, start],\n );\n\n const handleChange: RangeSliderProps['onChange'] = React.useCallback(\n (nextValue: Value, event: TouchEvent) => {\n if (props.disabled \|\| (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n return;\n }\n !isControlled && setValue(nextValue);\n onChange && onChange(nextValue, event);\n },\n [props.disabled, value, isControlled, onChange],\n );\n\n return (\n <UniversalSlider\n {...props}\n value={value}\n onChange={handleChange}\n min={min}\n max={max}\n step={step}\n />\n );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,KAAK,QAAQ,oBAAoB;~~AAC1C~~,SAASC,eAAe,QAA8B,mBAAmB;~~AAMzE~~;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAOA;EAAA,IANtBC,QAAQ,QAARA,QAAQ;IAAA,gBACRC,GAAG;IAAHA,GAAG,yBAAG,CAAC;IAAA,gBACPC,GAAG;IAAHA,GAAG,yBAAG,GAAG;IAAA,yBACTC,YAAY;IAAZA,YAAY,kCAAG,CAACF,GAAG,EAAEC,GAAG,CAAC;IAAA,iBACzBE,IAAI;IAAJA,IAAI,0BAAG,CAAC;IACLC,KAAK;EAER,IAAMC,YAAY,GAAGD,KAAK,CAACE,KAAK,KAAKC,SAAS;EAE9C,sBAA+BZ,KAAK,CAACa,QAAQ,CAACN,YAAY,CAAC;IAAA;IAApDO,UAAU;IAAEC,QAAQ;EAC3B,YAAqBN,KAAK,CAACE,KAAK,IAAIG,UAAU;IAAA;IAAvCE,KAAK;IAAEC,GAAG;EACjB,IAAMN,KAAK,GAAGX,KAAK,CAACkB,OAAO,CACzB;IAAA,OAAM,CAACjB,KAAK,CAACe,KAAK,EAAEX,GAAG,EAAEC,GAAG,CAAC,EAAEL,KAAK,CAACgB,GAAG,EAAEZ,GAAG,EAAEC,GAAG,CAAC,CAAC;EAAA,CAAS,EAC7D,CAACW,GAAG,EAAEX,GAAG,EAAED,GAAG,EAAEW,KAAK,CAAC,CACvB;EAED,IAAMG,YAA0C,GAAGnB,KAAK,CAACoB,WAAW,CAClE,UAACC,SAAgB,EAAEC,KAAiB,EAAK;IACvC,IAAIb,KAAK,CAACc,QAAQ,IAAKZ,KAAK,CAAC,CAAC,CAAC,KAAKU,SAAS,CAAC,CAAC,CAAC,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAKU,SAAS,CAAC,CAAC,CAAE,EAAE;MAC9E;IACF;IACA,CAACX,YAAY,IAAIK,QAAQ,CAACM,SAAS,CAAC;IACpCjB,QAAQ,IAAIA,QAAQ,CAACiB,SAAS,EAAEC,KAAK,CAAC;EACxC,CAAC,EACD,CAACb,KAAK,CAACc,QAAQ,EAAEZ,KAAK,EAAED,YAAY,EAAEN,QAAQ,CAAC,CAChD;EAED,oBACE,oBAAC,eAAe,eACVK,KAAK;IACT,KAAK,EAAEE,KAAM;IACb,QAAQ,EAAEQ,YAAa;IACvB,GAAG,EAAEd,GAAI;IACT,GAAG,EAAEC,GAAI;IACT,IAAI,EAAEE;EAAK,GACX;AAEN,CAAC"}
1	+ {"version":3,"file":"RangeSlider.js","names":["React","clamp","UniversalSlider","RangeSlider","onChange","min","max","defaultValue","step","props","isControlled","value","undefined","useState","localValue","setValue","start","end","useMemo","handleChange","useCallback","nextValue","event","disabled"],"sources":["../../../../src/components/RangeSlider/RangeSlider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { TouchEvent } from '../Touch/Touch';\nimport { UniversalSlider, UniversalSliderProps } from './UniversalSlider';\n\nexport type Value = [number, number];\nexport type RangeSliderProps = UniversalSliderProps<Value>;\n\n/*\n @see https://vkcom.github.io/VKUI/#/RangeSlider\n */\nexport const RangeSlider = ({\n onChange,\n min = 0,\n max = 100,\n defaultValue = [min, max],\n step = 0,\n ...props\n}: RangeSliderProps) => {\n const isControlled = props.value !== undefined;\n\n const [localValue, setValue] = React.useState(defaultValue);\n const [start, end] = props.value \|\| localValue;\n const value = React.useMemo(\n () => [clamp(start, min, max), clamp(end, min, max)] as Value,\n [end, max, min, start],\n );\n\n const handleChange: RangeSliderProps['onChange'] = React.useCallback(\n (nextValue: Value, event: TouchEvent) => {\n if (props.disabled \|\| (value[0] === nextValue[0] && value[1] === nextValue[1])) {\n return;\n }\n !isControlled && setValue(nextValue);\n onChange && onChange(nextValue, event);\n },\n [props.disabled, value, isControlled, onChange],\n );\n\n return (\n <UniversalSlider\n {...props}\n value={value}\n onChange={handleChange}\n min={min}\n max={max}\n step={step}\n />\n );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,KAAK,QAAQ,oBAAoB;AAE1C,SAASC,eAAe,QAA8B,mBAAmB;AAKzE;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAOA;EAAA,IANtBC,QAAQ,QAARA,QAAQ;IAAA,gBACRC,GAAG;IAAHA,GAAG,yBAAG,CAAC;IAAA,gBACPC,GAAG;IAAHA,GAAG,yBAAG,GAAG;IAAA,yBACTC,YAAY;IAAZA,YAAY,kCAAG,CAACF,GAAG,EAAEC,GAAG,CAAC;IAAA,iBACzBE,IAAI;IAAJA,IAAI,0BAAG,CAAC;IACLC,KAAK;EAER,IAAMC,YAAY,GAAGD,KAAK,CAACE,KAAK,KAAKC,SAAS;EAE9C,sBAA+BZ,KAAK,CAACa,QAAQ,CAACN,YAAY,CAAC;IAAA;IAApDO,UAAU;IAAEC,QAAQ;EAC3B,YAAqBN,KAAK,CAACE,KAAK,IAAIG,UAAU;IAAA;IAAvCE,KAAK;IAAEC,GAAG;EACjB,IAAMN,KAAK,GAAGX,KAAK,CAACkB,OAAO,CACzB;IAAA,OAAM,CAACjB,KAAK,CAACe,KAAK,EAAEX,GAAG,EAAEC,GAAG,CAAC,EAAEL,KAAK,CAACgB,GAAG,EAAEZ,GAAG,EAAEC,GAAG,CAAC,CAAC;EAAA,CAAS,EAC7D,CAACW,GAAG,EAAEX,GAAG,EAAED,GAAG,EAAEW,KAAK,CAAC,CACvB;EAED,IAAMG,YAA0C,GAAGnB,KAAK,CAACoB,WAAW,CAClE,UAACC,SAAgB,EAAEC,KAAiB,EAAK;IACvC,IAAIb,KAAK,CAACc,QAAQ,IAAKZ,KAAK,CAAC,CAAC,CAAC,KAAKU,SAAS,CAAC,CAAC,CAAC,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAKU,SAAS,CAAC,CAAC,CAAE,EAAE;MAC9E;IACF;IACA,CAACX,YAAY,IAAIK,QAAQ,CAACM,SAAS,CAAC;IACpCjB,QAAQ,IAAIA,QAAQ,CAACiB,SAAS,EAAEC,KAAK,CAAC;EACxC,CAAC,EACD,CAACb,KAAK,CAACc,QAAQ,EAAEZ,KAAK,EAAED,YAAY,EAAEN,QAAQ,CAAC,CAChD;EAED,oBACE,oBAAC,eAAe,eACVK,KAAK;IACT,KAAK,EAAEE,KAAM;IACb,QAAQ,EAAEQ,YAAa;IACvB,GAAG,EAAEd,GAAI;IACT,GAAG,EAAEC,GAAI;IACT,IAAI,EAAEE;EAAK,GACX;AAEN,CAAC"}

package/dist/cssm/components/RangeSlider/UniversalSlider.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { TouchEvent } from '../Touch/Touch';
 import { HasRootRef } from '../../types';
+import { TouchEvent } from '../Touch/Touch';
 export declare type UniversalValue = [number | null, number];
 export interface UniversalSliderProps<Value> extends HasRootRef<HTMLDivElement>, Omit<React.HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'> {
     min?: number;

package/dist/cssm/components/RangeSlider/UniversalSlider.js CHANGED Viewed

@@ -1,15 +1,19 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["min", "max", "step", "value", "defaultValue", "onChange", "getRootRef", "disabled", "className"];
 import * as React from 'react';
-import { Touch } from '../Touch/Touch';
 import { classNames } from '@vkontakte/vkjs';
 import { rescale } from '../../helpers/math';
-import { useExternRef } from '../../hooks/useExternRef';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
+import { useExternRef } from '../../hooks/useExternRef';
+import { SizeType } from '../../lib/adaptivity';
+import { Touch } from '../Touch/Touch';
 import "../Slider/Slider.module.css";
+var sizeYClassNames = _defineProperty({
+  none: "vkuiSlider--sizeY-none"
+}, SizeType.COMPACT, "vkuiSlider--sizeY-compact");
 export var UniversalSlider = function UniversalSlider(_ref) {
   var _ref$min = _ref.min,
     min = _ref$min === void 0 ? 0 : _ref$min,
@@ -37,7 +41,8 @@ export var UniversalSlider = function UniversalSlider(_ref) {
   var thumbStart = React.useRef(null);
   var thumbEnd = React.useRef(null);
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   var offsetToValue = function offsetToValue(absolute) {
     return rescale(absolute, [0, gesture.containerWidth], [min, max], {
       step: step
@@ -111,7 +116,7 @@ export var UniversalSlider = function UniversalSlider(_ref) {
     onMove: onMove,
     onEnd: onEnd
   }, {
-    className: classNames("vkuiSlider", getSizeYClassName("vkuiSlider", sizeY), disabled && "vkuiSlider--disabled", className)
+    className: classNames("vkuiSlider", sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], disabled && "vkuiSlider--disabled", className)
   }), /*#__PURE__*/React.createElement("div", {
     ref: container,
     className: "vkuiSlider__in"

package/dist/cssm/components/RangeSlider/UniversalSlider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UniversalSlider.js","names":["React","~~Touch~~","~~classNames~~","~~rescale~~","useExternRef","~~useAdaptivity~~","~~getSizeYClassName~~","UniversalSlider","min","max","step","value","defaultValue","onChange","getRootRef","disabled","className","restProps","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","sizeY","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join"],"sources":["../../../../src/components/RangeSlider/UniversalSlider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~Touch,~~ ~~TouchEvent, TouchEventHandler~~ } from '~~../Touch~~/~~Touch~~';\nimport { ~~classNames~~ } from '~~@vkontakte~~/~~vkjs~~';\nimport { ~~HasRootRef~~ } from '../../~~types~~';\nimport { ~~rescale~~ } from '../../~~helpers~~/~~math~~';\nimport { ~~useExternRef~~ } from '../../~~hooks~~/~~useExternRef~~';\nimport { ~~useAdaptivity~~ } from '../../~~hooks/useAdaptivity~~';\nimport { ~~getSizeYClassName~~ } from '~~../../helpers~~/~~getSizeYClassName~~';\nimport styles from '../Slider/Slider.module.css';\n\nexport type UniversalValue = [number \| null, number];\n\nexport interface UniversalSliderProps<Value>\n extends HasRootRef<HTMLDivElement>,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'value' \| 'defaultValue' \| 'onChange'> {\n min?: number;\n max?: number;\n step?: number;\n value?: Value;\n defaultValue?: Value;\n disabled?: boolean;\n onChange?(value: Value, e: TouchEvent): void;\n}\n\nexport const UniversalSlider = ({\n min = 0,\n max = 100,\n step,\n value = [0, 0],\n defaultValue,\n onChange,\n getRootRef,\n disabled,\n className,\n ...restProps\n}: UniversalSliderProps<UniversalValue>) => {\n const [start, end] = value;\n const isRange = start != null;\n const gesture = React.useRef({\n dragging: false as false \| 'start' \| 'end',\n startX: 0,\n containerWidth: 0,\n }).current;\n const container = useExternRef(getRootRef);\n const thumbStart = React.useRef<HTMLDivElement>(null);\n const thumbEnd = React.useRef<HTMLDivElement>(null);\n const { sizeY } = useAdaptivity();\n\n const offsetToValue = (absolute: number) => {\n return rescale(absolute, [0, gesture.containerWidth], [min, max], { step });\n };\n\n const updateRange = (nextValue: number): UniversalValue => {\n if (start == null) {\n return [null, nextValue];\n }\n\n const { dragging } = gesture;\n if (dragging === 'start') {\n if (nextValue > end) {\n // \"перехватиться\", если перетянули за конец\n gesture.dragging = 'end';\n return [end, nextValue];\n }\n return [nextValue, end];\n }\n if (dragging === 'end') {\n if (nextValue < start) {\n // \"перехватиться\", если перетянули за начало\n gesture.dragging = 'start';\n return [nextValue, start];\n }\n return [start, nextValue];\n }\n\n return value;\n };\n\n const snapDirection = (pos: number, target: EventTarget \| null) => {\n if (target === thumbStart.current) {\n return 'start';\n }\n if (target === thumbEnd.current) {\n return 'end';\n }\n return Math.abs((start ?? 0) - pos) <= Math.abs(end - pos) ? 'start' : 'end';\n };\n\n const onStart: TouchEventHandler = (e: TouchEvent) => {\n const boundingRect = container.current?.getBoundingClientRect();\n gesture.containerWidth = boundingRect?.width ?? 0;\n\n const absolutePosition = e.startX - (boundingRect?.left ?? 0);\n const pos = offsetToValue(absolutePosition);\n gesture.dragging = snapDirection(pos, e.originalEvent.target);\n gesture.startX = absolutePosition;\n\n onChange?.(updateRange(pos), e);\n e.originalEvent.stopPropagation();\n };\n\n const onMove: TouchEventHandler = (e: TouchEvent) => {\n onChange?.(updateRange(offsetToValue(gesture.startX + (e.shiftX \|\| 0))), e);\n\n e.originalEvent.stopPropagation();\n e.originalEvent.preventDefault();\n };\n\n const onEnd: TouchEventHandler = (e) => {\n gesture.dragging = false;\n e.originalEvent.stopPropagation();\n };\n\n const toPercent = (v: number) => ((v - min) / (max - min)) * 100;\n const draggerStyle = isRange\n ? {\n width: `${toPercent(end) - toPercent(start ?? 0)}%`,\n left: `${toPercent(start ?? 0)}%`,\n }\n : {\n width: `${toPercent(end)}%`,\n };\n\n return (\n <Touch\n data-value={isRange ? value.join(',') : value}\n {...restProps}\n {...(disabled ? {} : { onStart, onMove, onEnd })}\n className={classNames(\n styles['Slider'],\n ~~getSizeYClassName(styles~~[~~'Slider'~~]~~, sizeY)~~,\n disabled && styles['Slider--disabled'],\n className,\n )}\n >\n <div ref={container} className={styles['Slider__in']}>\n <div className={styles['Slider__dragger']} style={draggerStyle}>\n {isRange && (\n <span\n className={classNames(styles['Slider__thumb'], styles['Slider__thumb--start'])}\n ref={thumbStart}\n />\n )}\n <span\n className={classNames(styles['Slider__thumb'], styles['Slider__thumb--end'])}\n ref={thumbEnd}\n />\n </div>\n </div>\n </Touch>\n );\n};\n"],"mappings":"~~;;;;~~AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~KAAK~~,~~QAAuC~~,~~gBAAgB~~;~~AACrE~~,SAASC,~~UAAU~~,QAAQ,~~iBAAiB~~;~~AAE5C~~,SAASC,~~OAAO~~,QAAQ,~~oBAAoB~~;~~AAC5C~~,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,~~aAAa~~,QAAQ,~~2BAA2B~~;~~AACzD~~,SAASC,~~iBAAiB~~,~~QAAQ~~,~~iCAAiC~~;AAAC;~~AAiBpE~~,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAe,OAWgB;EAAA,oBAV1CC,GAAG;IAAHA,GAAG,yBAAG,CAAC;IAAA,gBACPC,GAAG;IAAHA,GAAG,yBAAG,GAAG;IACTC,IAAI,QAAJA,IAAI;IAAA,kBACJC,KAAK;IAALA,KAAK,2BAAG,CAAC,CAAC,EAAE,CAAC,CAAC;IACdC,YAAY,QAAZA,YAAY;IACZC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,4BAAqBN,KAAK;IAAnBO,KAAK;IAAEC,GAAG;EACjB,IAAMC,OAAO,GAAGF,KAAK,IAAI,IAAI;EAC7B,IAAMG,OAAO,~~GAAGrB~~,KAAK,~~CAACsB~~,MAAM,CAAC;IAC3BC,QAAQ,EAAE,KAAgC;IAC1CC,MAAM,EAAE,CAAC;IACTC,cAAc,EAAE;EAClB,CAAC,CAAC,CAACC,OAAO;EACV,IAAMC,SAAS,~~GAAGvB~~,YAAY,~~CAACU~~,UAAU,CAAC;EAC1C,IAAMc,UAAU,~~GAAG5B~~,KAAK,~~CAACsB~~,MAAM,CAAiB,IAAI,CAAC;EACrD,IAAMO,QAAQ,~~GAAG7B~~,KAAK,~~CAACsB~~,MAAM,CAAiB,IAAI,CAAC;EACnD,~~qBAAkBjB~~,aAAa,EAAE;~~IAAzByB~~,KAAK,~~kBAALA~~,~~KAAK~~;~~EAEb~~,IAAMC,aAAa,GAAG,SAAhBA,aAAa,CAAIC,QAAgB,EAAK;IAC1C,~~OAAO7B~~,OAAO,~~CAAC6B~~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~~EAAElD~~,UAAU,~~eAEnBI~~,~~iBAAiB~~,~~eAAmBwB~~,KAAK,CAAC,~~EAC1Cf~~,QAAQ,0BAA8B,EACtCC,SAAS;EACT,iBAEF;IAAK,GAAG,EAAEW,SAAU;IAAC,SAAS;EAAuB,gBACnD;IAAK,SAAS,uBAA4B;IAAC,KAAK,EAAE4B;EAAa,GAC5DnC,OAAO,iBACN;IACE,SAAS,~~EAAElB~~,UAAU,iDAA0D;IAC/E,GAAG,~~EAAE0B~~;EAAW,EAEnB,eACD;IACE,SAAS,~~EAAE1B~~,UAAU,+CAAwD;IAC7E,GAAG,~~EAAE2B~~;EAAS,EACd,CACE,CACF,CACA;AAEZ,CAAC"}
1	+ {"version":3,"file":"UniversalSlider.js","names":["React","classNames","rescale","useAdaptivity","useExternRef","SizeType","Touch","sizeYClassNames","none","COMPACT","UniversalSlider","min","max","step","value","defaultValue","onChange","getRootRef","disabled","className","restProps","start","end","isRange","gesture","useRef","dragging","startX","containerWidth","current","container","thumbStart","thumbEnd","sizeY","offsetToValue","absolute","updateRange","nextValue","snapDirection","pos","target","Math","abs","onStart","e","boundingRect","getBoundingClientRect","width","absolutePosition","left","originalEvent","stopPropagation","onMove","shiftX","preventDefault","onEnd","toPercent","v","draggerStyle","join","REGULAR"],"sources":["../../../../src/components/RangeSlider/UniversalSlider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { rescale } from '../../helpers/math';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasRootRef } from '../../types';\nimport { Touch, TouchEvent, TouchEventHandler } from '../Touch/Touch';\nimport styles from '../Slider/Slider.module.css';\n\nconst sizeYClassNames = {\n none: styles['Slider--sizeY-none'],\n [SizeType.COMPACT]: styles['Slider--sizeY-compact'],\n};\n\nexport type UniversalValue = [number \| null, number];\n\nexport interface UniversalSliderProps<Value>\n extends HasRootRef<HTMLDivElement>,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'value' \| 'defaultValue' \| 'onChange'> {\n min?: number;\n max?: number;\n step?: number;\n value?: Value;\n defaultValue?: Value;\n disabled?: boolean;\n onChange?(value: Value, e: TouchEvent): void;\n}\n\nexport const UniversalSlider = ({\n min = 0,\n max = 100,\n step,\n value = [0, 0],\n defaultValue,\n onChange,\n getRootRef,\n disabled,\n className,\n ...restProps\n}: UniversalSliderProps<UniversalValue>) => {\n const [start, end] = value;\n const isRange = start != null;\n const gesture = React.useRef({\n dragging: false as false \| 'start' \| 'end',\n startX: 0,\n containerWidth: 0,\n }).current;\n const container = useExternRef(getRootRef);\n const thumbStart = React.useRef<HTMLDivElement>(null);\n const thumbEnd = React.useRef<HTMLDivElement>(null);\n const { sizeY = 'none' } = useAdaptivity();\n\n const offsetToValue = (absolute: number) => {\n return rescale(absolute, [0, gesture.containerWidth], [min, max], { step });\n };\n\n const updateRange = (nextValue: number): UniversalValue => {\n if (start == null) {\n return [null, nextValue];\n }\n\n const { dragging } = gesture;\n if (dragging === 'start') {\n if (nextValue > end) {\n // \"перехватиться\", если перетянули за конец\n gesture.dragging = 'end';\n return [end, nextValue];\n }\n return [nextValue, end];\n }\n if (dragging === 'end') {\n if (nextValue < start) {\n // \"перехватиться\", если перетянули за начало\n gesture.dragging = 'start';\n return [nextValue, start];\n }\n return [start, nextValue];\n }\n\n return value;\n };\n\n const snapDirection = (pos: number, target: EventTarget \| null) => {\n if (target === thumbStart.current) {\n return 'start';\n }\n if (target === thumbEnd.current) {\n return 'end';\n }\n return Math.abs((start ?? 0) - pos) <= Math.abs(end - pos) ? 'start' : 'end';\n };\n\n const onStart: TouchEventHandler = (e: TouchEvent) => {\n const boundingRect = container.current?.getBoundingClientRect();\n gesture.containerWidth = boundingRect?.width ?? 0;\n\n const absolutePosition = e.startX - (boundingRect?.left ?? 0);\n const pos = offsetToValue(absolutePosition);\n gesture.dragging = snapDirection(pos, e.originalEvent.target);\n gesture.startX = absolutePosition;\n\n onChange?.(updateRange(pos), e);\n e.originalEvent.stopPropagation();\n };\n\n const onMove: TouchEventHandler = (e: TouchEvent) => {\n onChange?.(updateRange(offsetToValue(gesture.startX + (e.shiftX \|\| 0))), e);\n\n e.originalEvent.stopPropagation();\n e.originalEvent.preventDefault();\n };\n\n const onEnd: TouchEventHandler = (e) => {\n gesture.dragging = false;\n e.originalEvent.stopPropagation();\n };\n\n const toPercent = (v: number) => ((v - min) / (max - min)) * 100;\n const draggerStyle = isRange\n ? {\n width: `${toPercent(end) - toPercent(start ?? 0)}%`,\n left: `${toPercent(start ?? 0)}%`,\n }\n : {\n width: `${toPercent(end)}%`,\n };\n\n return (\n <Touch\n data-value={isRange ? value.join(',') : value}\n {...restProps}\n {...(disabled ? {} : { onStart, onMove, onEnd })}\n className={classNames(\n styles['Slider'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n disabled && styles['Slider--disabled'],\n className,\n )}\n >\n <div ref={container} className={styles['Slider__in']}>\n <div className={styles['Slider__dragger']} style={draggerStyle}>\n {isRange && (\n <span\n className={classNames(styles['Slider__thumb'], styles['Slider__thumb--start'])}\n ref={thumbStart}\n />\n )}\n <span\n className={classNames(styles['Slider__thumb'], styles['Slider__thumb--end'])}\n ref={thumbEnd}\n />\n </div>\n </div>\n </Touch>\n );\n};\n"],"mappings":"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"}

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

@@ -3,18 +3,16 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["getRootRef", "children", "onRemove", "removePlaceholder", "align", "className"];
 import * as React from 'react';
+import { Icon24Cancel } from '@vkontakte/icons';
 import { classNames, noop } from '@vkontakte/vkjs';
-import { getTitleFromChildren } from '../../lib/utils';
 import { useExternRef } from '../../hooks/useExternRef';
+import { useGlobalEventListener } from '../../hooks/useGlobalEventListener';
 import { usePlatform } from '../../hooks/usePlatform';
-import { useAdaptivity } from '../../hooks/useAdaptivity';
 import { useDOM } from '../../lib/dom';
 import { Platform } from '../../lib/platform';
-import { Icon24Cancel } from '@vkontakte/icons';
+import { getTitleFromChildren } from '../../lib/utils';
 import { IconButton } from '../IconButton/IconButton';
-import { useGlobalEventListener } from '../../hooks/useGlobalEventListener';
 import { Tappable } from '../Tappable/Tappable';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
 import "./Removable.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/RemovableIos
@@ -102,8 +100,6 @@ export var Removable = function Removable(_ref2) {
     className = _ref2.className,
     restProps = _objectWithoutProperties(_ref2, _excluded);
   var platform = usePlatform();
-  var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
   var ref = useExternRef(getRootRef);
   var onRemoveClick = function onRemoveClick(e) {
     e.preventDefault();
@@ -112,7 +108,7 @@ export var Removable = function Removable(_ref2) {
   var removePlaceholderString = getTitleFromChildren(removePlaceholder);
   return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
     ref: ref,
-    className: classNames("vkuiRemovable", platform === Platform.IOS && "vkuiRemovable--ios", styles["Removable--align-".concat(align)], getSizeYClassName("vkuiRemovable", sizeY), className)
+    className: classNames("vkuiRemovable", platform === Platform.IOS && "vkuiRemovable--ios", styles["Removable--align-".concat(align)], className)
   }), platform !== Platform.IOS && /*#__PURE__*/React.createElement("div", {
     className: "vkuiRemovable__content"
   }, children, /*#__PURE__*/React.createElement(IconButton, {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Removable.js","names":["React","~~classNames~~","~~noop~~","~~getTitleFromChildren~~","useExternRef","~~usePlatform~~","~~useAdaptivity~~","useDOM","Platform","~~Icon24Cancel~~","IconButton","~~useGlobalEventListener","~~Tappable","~~getSizeYClassName","~~RemovableIos","onRemove","removePlaceholder","removePlaceholderString","children","window","removeButtonRef","useRef","disabledRef","useState","removeOffset","updateRemoveOffset","capture","onRemoveTransitionEnd","current","focus","onRemoveActivateClick","e","stopPropagation","offsetWidth","transform","Removable","getRootRef","align","className","restProps","platform","~~sizeY","~~ref","onRemoveClick","preventDefault","IOS","styles"],"sources":["../../../../src/components/Removable/Removable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~HasRootRef~~ } from '~~../../types~~';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { ~~getTitleFromChildren~~ } from '../../~~lib~~/~~utils~~';\nimport { ~~useExternRef~~ } from '../../hooks/~~useExternRef~~';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { ~~useAdaptivity~~ } from '../../~~hooks~~/~~useAdaptivity~~';\nimport { ~~useDOM~~ } from '../../lib/~~dom~~';\nimport { ~~Platform~~ } from '../../lib/~~platform~~';\nimport { ~~Icon24Cancel~~ } from '~~@vkontakte/icons~~';\nimport { IconButton } from '../IconButton/IconButton';\nimport { ~~useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport {~~ Tappable } from '../Tappable/Tappable';\nimport ~~{ getSizeYClassName } from '../../helpers/getSizeYClassName';\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={styles['Removable__content']}\n style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n onTransitionEnd={onRemoveTransitionEnd}\n >\n <IconButton\n hasActive={false}\n hasHover={false}\n aria-label={removePlaceholderString}\n 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 ~~const { sizeY } = useAdaptivity();\n~~\n const ref = useExternRef(getRootRef);\n\n const onRemoveClick = (e: React.MouseEvent) => {\n e.preventDefault();\n onRemove(e);\n };\n\n const removePlaceholderString: string = getTitleFromChildren(removePlaceholder);\n\n return (\n <div\n {...restProps}\n ref={ref}\n className={classNames(\n styles['Removable'],\n platform === Platform.IOS && styles['Removable--ios'],\n styles[`Removable--align-${align}`],\n ~~getSizeYClassName(styles['Removable'], sizeY),\n~~ className,\n )}\n >\n {platform !== Platform.IOS && (\n <div className={styles['Removable__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"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;~~AAE9B~~,SAASC,~~UAAU~~,~~EAAEC,IAAI,~~QAAQ,~~iBAAiB~~;~~AAClD~~,SAASC,~~oBAAoB~~,QAAQ,iBAAiB;~~AACtD~~,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,~~WAAW~~,QAAQ,~~yBAAyB~~;~~AACrD~~,SAASC,~~aAAa~~,QAAQ,~~2BAA2B~~;~~AACzD~~,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,~~YAAY~~,QAAQ,~~kBAAkB~~;~~AAC/C~~,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SAASC,~~sBAAsB,~~QAAQ,~~oCAAoC;AAC3E,SAASC,~~QAAQ,~~QAAQ,~~sBAAsB;~~AAC/C,SAASC,iBAAiB,QAAQ,iCAAiC;~~AAAC;~~AAmBpE~~;AACA;AACA;AACA,IAAMC,YAAY,GAAG,SAAfA,YAAY,OAKU;EAAA,IAJ1BC,QAAQ,QAARA,QAAQ;IACRC,iBAAiB,QAAjBA,iBAAiB;IACjBC,uBAAuB,QAAvBA,uBAAuB;IACvBC,QAAQ,QAARA,QAAQ;EAER,~~cAAmBX~~,MAAM,EAAE;~~IAAnBY~~,MAAM,WAANA,MAAM;EAEd,IAAMC,eAAe,~~GAAGpB~~,KAAK,~~CAACqB~~,MAAM,CAAc,IAAI,CAAC;EACvD,IAAMC,WAAW,~~GAAGtB~~,KAAK,~~CAACqB~~,MAAM,CAAC,IAAI,CAAC;EACtC,~~sBAA2CrB~~,KAAK,~~CAACuB~~,QAAQ,CAAC,CAAC,CAAC;IAAA;IAArDC,YAAY;IAAEC,kBAAkB;~~EAEvCd~~,sBAAsB,~~CACpBQ~~,MAAM,EACN,OAAO,EACP,YAAM;IACJ,IAAIK,YAAY,GAAG,CAAC,EAAE;MACpBC,kBAAkB,CAAC,CAAC,CAAC;IACvB;EACF,CAAC,EACD;IAAEC,OAAO,EAAE;EAAK,CAAC,CAClB;EAED,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqB,GAAS;IAClC,IAAIH,YAAY,GAAG,CAAC,EAAE;MAAA;MACpBJ,eAAe,aAAfA,eAAe,gDAAfA,eAAe,CAAEQ,OAAO,0DAAxB,sBAA0BC,KAAK,EAAE;IACnC,CAAC,MAAM;MACLP,WAAW,CAACM,OAAO,GAAG,IAAI;IAC5B;EACF,CAAC;EAED,IAAME,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIC,CAAmB,EAAK;IACrDA,CAAC,CAACC,eAAe,EAAE;IACnB,IAAI,CAACZ,eAAe,CAACQ,OAAO,EAAE;MAC5B;IACF;IACA,IAAQK,WAAW,GAAKb,eAAe,CAACQ,OAAO,CAAvCK,WAAW;IACnBX,WAAW,CAACM,OAAO,GAAG,KAAK;IAC3BH,kBAAkB,CAACQ,WAAW,CAAC;EACjC,CAAC;EAED,oBACE;IACE,SAAS,0BAA+B;IACxC,KAAK,EAAE;MAAEC,SAAS,wBAAiBV,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,CAAC;IAAM,CAAE;IAC5D,eAAe,EAAEG;EAAsB,gBAEvC,oBAAC,UAAU;IACT,SAAS,EAAE,KAAM;IACjB,QAAQ,EAAE,KAAM;IAChB,cAAYV,uBAAwB;IACpC,SAAS,~~EAAEhB~~,UAAU,kDAA2D;IAChF,OAAO,~~EAAE6B~~,qBAAsB;IAC/B,QAAQ,EAAEN,YAAY,GAAG;EAAE,gBAE3B;IAAG,SAAS,4BAAiC;IAAC,IAAI,EAAC;EAAc,EAAG,CACzD,EACZN,QAAQ,eAET;IAAM,SAAS,yBAA8B;IAAC;EAAW,EAAG,eAE5D,oBAAC,QAAQ;IACP,SAAS,EAAC,QAAQ;IAClB,SAAS,EAAE,KAAM;IACjB,QAAQ,EAAE,KAAM;IAChB,QAAQ,EAAEI,WAAW,CAACM,OAAQ;IAC9B,UAAU,EAAER,eAAgB;IAC5B,SAAS,yBAA8B;IACvC,OAAO,EAAEL;EAAS,gBAElB;IAAM,SAAS;EAAiC,GAAEC,iBAAiB,CAAQ,CAClE,CACP;AAEV,CAAC;AAYD;AACA;AACA;AACA,OAAO,IAAMmB,SAAS,GAAG,SAAZA,SAAS,QAQG;EAAA,IAPvBC,UAAU,SAAVA,UAAU;IACVlB,QAAQ,SAARA,QAAQ;IAAA,uBACRH,QAAQ;IAARA,QAAQ,+~~BAAGb~~,IAAI;IAAA,~~8BACfc~~,iBAAiB;IAAjBA,iBAAiB,sCAAG,SAAS;IAAA,oBAC7BqB,KAAK;IAALA,KAAK,4BAAG,QAAQ;IAChBC,SAAS,SAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,~~GAAGnC~~,WAAW,EAAE;~~EAC9B~~,~~qBAAkBC~~,~~aAAa,EAAE;IAAzBmC,KAAK,kBAALA,KAAK;EAEb,IAAMC,~~GAAG,~~GAAGtC~~,YAAY,~~CAACgC~~,UAAU,CAAC;EAEpC,~~IAAMO~~,aAAa,GAAG,SAAhBA,aAAa,~~CAAIZ~~,CAAmB,EAAK;IAC7CA,CAAC,~~CAACa~~,cAAc,EAAE;~~IAClB7B~~,QAAQ,CAACgB,CAAC,CAAC;EACb,CAAC;EAED,IAAMd,uBAA+B,~~GAAGd~~,oBAAoB,~~CAACa~~,iBAAiB,CAAC;EAE/E,oBACE,wCACMuB,SAAS;IACb,GAAG,~~EAAEG~~,GAAI;IACT,SAAS,~~EAAEzC~~,UAAU,~~kBAEnBuC~~,QAAQ,~~KAAKhC~~,QAAQ,~~CAACqC~~,GAAG,wBAA4B,EACrDC,MAAM,~~4BAAqBT~~,KAAK,EAAG,~~EACnCxB~~,~~iBAAiB,kBAAsB4B,KAAK,CAAC,EAC7CH,~~SAAS;EACT,IAEDE,QAAQ,~~KAAKhC~~,QAAQ,~~CAACqC~~,GAAG,iBACxB;IAAK,SAAS;EAA+B,~~GAC1C3B~~,QAAQ,eAET,oBAAC,UAAU;IACT,UAAU,EAAC,SAAS;IACpB,SAAS,EAAC,SAAS;IACnB,SAAS,yBAA8B;IACvC,OAAO,~~EAAEyB~~,aAAc;IACvB,~~cAAY1B~~;EAAwB,gBAEpC,oBAAC,YAAY;IAAC,IAAI,EAAC;EAAc,EAAG,CACzB,eAEb;IAAM,SAAS,yBAA8B;IAAC;EAAW,EAAG,CAE/D,EAEAuB,QAAQ,~~KAAKhC~~,QAAQ,~~CAACqC~~,GAAG,iBACxB,oBAAC,YAAY;IACX,QAAQ,EAAEF,aAAc;IACxB,iBAAiB,~~EAAE3B~~,iBAAkB;IACrC,uBAAuB,EAAEC;EAAwB,GAEhDC,QAAQ,CAEZ,CACG;AAEV,CAAC;AAAC;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"Removable.js","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","transform","Removable","getRootRef","align","className","restProps","platform","ref","onRemoveClick","preventDefault","IOS","styles"],"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={styles['Removable__content']}\n style={{ transform: `translateX(-${removeOffset ?? 0}px)` }}\n onTransitionEnd={onRemoveTransitionEnd}\n >\n <IconButton\n hasActive={false}\n hasHover={false}\n aria-label={removePlaceholderString}\n 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 styles['Removable'],\n platform === Platform.IOS && styles['Removable--ios'],\n styles[`Removable--align-${align}`],\n className,\n )}\n >\n {platform !== Platform.IOS && (\n <div className={styles['Removable__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"],"mappings":"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"}

package/dist/cssm/components/Removable/Removable.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiRemovable__content{align-items:center;display:flex;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);position:relative}.vkuiRemovable__action{border:none;flex-grow:0;flex-shrink:0;position:relative}.vkuiRemovable__action.vkuiRemovable__action{color:#99a2ad;color:var(--vkui--color_icon_secondary)}.vkuiRemovable--align-start .vkuiRemovable__action{align-self:flex-start}.vkuiRemovable--ios{overflow:hidden}.vkuiRemovable__remove{background-color:#e64646;background-color:var(--vkui--color_background_negative);border:none;border-radius:0;color:#fff;color:var(--vkui_internal--white);font-size:15px;height:100%;left:100%;line-height:45px;padding:0 10px;position:absolute;top:0}.vkuiRemovable__remove-in{align-items:center;display:flex;height:100%;justify-content:center;width:100%}@media (prefers-reduced-motion:no-preference){.vkuiRemovable--ios .vkuiRemovable__content{transition:transform .6s cubic-bezier(.4,0,.2,1);transition:transform .6s var(--vkui--animation_easing_platform)}}.vkuiRemovable__toggle{background:none;display:block;height:44px;margin:0 2px;width:44px}.vkuiRemovable__toggle-in{align-content:center;align-items:center;border:none;display:flex;height:100%;justify-content:center;position:relative;width:100%}.vkuiRemovable__toggle-in:after{background-color:#e64646;background-color:var(--vkui--color_background_negative);border-radius:50%;content:"";height:22px;width:22px}.vkuiRemovable__toggle-in:before{background-color:#fff;background-color:var(--vkui_internal--white);content:"";display:block;height:2px;position:absolute;width:12px}.vkuiRemovable--ios .vkuiRemovable__content{padding-left:0;padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem--removable .vkuiRemovable__content,.vkuiFormLayoutGroup--removable .vkuiRemovable__content{align-items:flex-start;flex-wrap:wrap}.vkuiRemovable__offset{display:none}.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{display:block;height:calc(2px + 18px + 8px);height:calc(2px + var(--vkui--font_subhead--line_height--regular) + 8px);order:-1;width:100%}.vkuiFormItem--sizeY-compact.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--sizeY-compact.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}@media (pointer:fine) and (min-width:768px)~~,not (min-height:415px)~~{.vkuiFormItem--sizeY-none.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--sizeY-none.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}}
1	+ .vkuiRemovable__content{align-items:center;display:flex;padding-left:16px;padding-left:var(--vkui--size_base_padding_horizontal--regular);position:relative}.vkuiRemovable__action{border:none;flex-grow:0;flex-shrink:0;position:relative}.vkuiRemovable__action.vkuiRemovable__action{color:#99a2ad;color:var(--vkui--color_icon_secondary)}.vkuiRemovable--align-start .vkuiRemovable__action{align-self:flex-start}.vkuiRemovable--ios{overflow:hidden}.vkuiRemovable__remove{background-color:#e64646;background-color:var(--vkui--color_background_negative);border:none;border-radius:0;color:#fff;color:var(--vkui_internal--white);font-size:15px;height:100%;left:100%;line-height:45px;padding:0 10px;position:absolute;top:0}.vkuiRemovable__remove-in{align-items:center;display:flex;height:100%;justify-content:center;width:100%}@media (prefers-reduced-motion:no-preference){.vkuiRemovable--ios .vkuiRemovable__content{transition:transform .6s cubic-bezier(.4,0,.2,1);transition:transform .6s var(--vkui--animation_easing_platform)}}.vkuiRemovable__toggle{background:none;display:block;height:44px;margin:0 2px;width:44px}.vkuiRemovable__toggle-in{align-content:center;align-items:center;border:none;display:flex;height:100%;justify-content:center;position:relative;width:100%}.vkuiRemovable__toggle-in:after{background-color:#e64646;background-color:var(--vkui--color_background_negative);border-radius:50%;content:"";height:22px;width:22px}.vkuiRemovable__toggle-in:before{background-color:#fff;background-color:var(--vkui_internal--white);content:"";display:block;height:2px;position:absolute;width:12px}.vkuiRemovable--ios .vkuiRemovable__content{padding-left:0;padding-right:16px;padding-right:var(--vkui--size_base_padding_horizontal--regular)}.vkuiFormItem--removable .vkuiRemovable__content,.vkuiFormLayoutGroup--removable .vkuiRemovable__content{align-items:flex-start;flex-wrap:wrap}.vkuiRemovable__offset{display:none}.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{display:block;height:calc(2px + 18px + 8px);height:calc(2px + var(--vkui--font_subhead--line_height--regular) + 8px);order:-1;width:100%}.vkuiFormItem--sizeY-compact.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--sizeY-compact.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiFormItem--sizeY-none.vkuiFormItem--withTop .vkuiFormItem__removable~.vkuiRemovable__offset,.vkuiFormLayoutGroup--sizeY-none.vkuiFormLayoutGroup--removable .vkuiFormItem--withTop~.vkuiRemovable__offset{height:calc(2px + 16px + 6px);height:calc(2px + var(--vkui--font_subhead--line_height--compact) + 6px)}}

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

@@ -1,13 +1,17 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["subhead", "children", "text", "caption", "before", "after", "afterCaption", "bottom", "actions", "multiline", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
+import { useAdaptivity } from '../../hooks/useAdaptivity';
+import { SizeType } from '../../lib/adaptivity';
 import { Tappable } from '../Tappable/Tappable';
 import { Subhead } from '../Typography/Subhead/Subhead';
-import { getSizeYClassName } from '../../helpers/getSizeYClassName';
-import { useAdaptivity } from '../../hooks/useAdaptivity';
 import "./RichCell.module.css";
+var sizeYClassNames = _defineProperty({
+  none: "vkuiRichCell--sizeY-none"
+}, SizeType.COMPACT, "vkuiRichCell--sizeY-compact");
 /**
  * @see https://vkcom.github.io/VKUI/#/RichCell
  */
@@ -25,9 +29,10 @@ export var RichCell = function RichCell(_ref) {
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useAdaptivity = useAdaptivity(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
   return /*#__PURE__*/React.createElement(Tappable, _extends({}, restProps, {
-    className: classNames("vkuiRichCell", !multiline && "vkuiRichCell--text-ellipsis", getSizeYClassName("vkuiRichCell", sizeY), className)
+    className: classNames("vkuiRichCell", !multiline && "vkuiRichCell--text-ellipsis", sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY], className)
   }), before && /*#__PURE__*/React.createElement("div", {
     className: "vkuiRichCell__before"
   }, before), /*#__PURE__*/React.createElement("div", {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RichCell.js","names":["React","classNames","Tappable","Subhead","~~getSizeYClassName~~","~~useAdaptivity~~","RichCell","subhead","children","text","caption","before","after","afterCaption","bottom","actions","multiline","className","restProps","sizeY"],"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ~~TappableProps,~~ ~~Tappable~~ } from '~~../Tappable~~/~~Tappable~~';\nimport { ~~Subhead~~ } from '~~../Typography~~/~~Subhead/Subhead~~';\nimport { ~~getSizeYClassName~~ } from '~~../../helpers~~/~~getSizeYClassName~~';\nimport { ~~useAdaptivity~~ } from '~~../../hooks~~/~~useAdaptivity~~';\nimport styles from './RichCell.module.css';\n\nexport interface RichCellProps extends TappableProps {\n /*\n Контейнер для текста над `children`.\n /\n subhead?: React.ReactNode;\n /\n Контейнер для текста под `children`.\n /\n text?: React.ReactNode;\n /\n Контейнер для текста под `text`.\n /\n caption?: React.ReactNode;\n /\n Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n /\n bottom?: React.ReactNode;\n /\n Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n \n - `mode=\"primary\" size=\"s\"`\n * - `mode=\"secondary\" size=\"s\"`\n \n Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n \n - `mode=\"horizontal\" gap=\"s\" stretched`\n /\n actions?: React.ReactNode;\n /\n `<Avatar size={40\|48\|72} />`.\n /\n before?: React.ReactNode;\n /\n Иконка 24 или текст.\n /\n after?: React.ReactNode;\n /\n Текст под `after`.\n /\n afterCaption?: React.ReactNode;\n /\n Убирает анимацию нажатия.\n /\n disabled?: boolean;\n /\n Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n /\n multiline?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/RichCell\n */\nexport const RichCell = ({\n subhead,\n children,\n text,\n caption,\n before,\n after,\n afterCaption,\n bottom,\n actions,\n multiline,\n className,\n ...restProps\n}: RichCellProps) => {\n const { sizeY } = useAdaptivity();\n\n return (\n <Tappable\n {...restProps}\n className={classNames(\n styles['RichCell'],\n !multiline && styles['RichCell--text-ellipsis'],\n ~~getSizeYClassName(styles~~[~~'RichCell'~~]~~, sizeY)~~,\n className,\n )}\n >\n {before && <div className={styles['RichCell__before']}>{before}</div>}\n <div className={styles['RichCell__in']}>\n <div className={styles['RichCell__content']}>\n <div className={styles['RichCell__content-before']}>\n {subhead && (\n <Subhead Component=\"div\" className={styles['RichCell__subhead']}>\n {subhead}\n </Subhead>\n )}\n <div className={styles['RichCell__children']}>{children}</div>\n {text && <div className={styles['RichCell__text']}>{text}</div>}\n {caption && (\n <Subhead Component=\"div\" className={styles['RichCell__caption']}>\n {caption}\n </Subhead>\n )}\n </div>\n {(after \|\| afterCaption) && (\n <div className={styles['RichCell__content-after']}>\n {after && <div className={styles['RichCell__after-children']}>{after}</div>}\n {afterCaption && (\n <div className={styles['RichCell__after-caption']}>{afterCaption}</div>\n )}\n </div>\n )}\n </div>\n {bottom && <div className={styles['RichCell__bottom']}>{bottom}</div>}\n {actions && <div className={styles['RichCell__actions']}>{actions}</div>}\n </div>\n </Tappable>\n );\n};\n"],"mappings":"~~;;;~~AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,~~SAAwBC~~,QAAQ,QAAQ,sBAAsB;AAC9D,SAASC,OAAO,QAAQ,+BAA+B;~~AACvD~~,~~SAASC~~,~~iBAAiB~~,~~QAAQ,iCAAiC~~;~~AACnE~~,~~SAASC~~,~~aAAa,~~QAAQ,~~2BAA2B~~;~~AAAC~~;~~AAqD1D;~~AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAaA;EAAA,IAZnBC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,YAAY,QAAZA,YAAY;IACZC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,~~qBAAkBb~~,aAAa,EAAE;~~IAAzBc~~,KAAK,~~kBAALA~~,~~KAAK~~;~~EAEb~~,oBACE,oBAAC,QAAQ,eACHD,SAAS;IACb,SAAS,~~EAAEjB~~,UAAU,iBAEnB,~~CAACe~~,SAAS,iCAAqC,EAC/CZ,~~iBAAiB~~,~~iBAAqBe~~,KAAK,CAAC,~~EAC5CF~~,SAAS;EACT,IAEDN,MAAM,iBAAI;IAAK,SAAS;EAA6B,GAAEA,MAAM,CAAO,eACrE;IAAK,SAAS;EAAyB,gBACrC;IAAK,SAAS;EAA8B,gBAC1C;IAAK,SAAS;EAAqC,GAChDJ,OAAO,iBACN,oBAAC,OAAO;IAAC,SAAS,EAAC,KAAK;IAAC,SAAS;EAA8B,GAC7DA,OAAO,CAEX,eACD;IAAK,SAAS;EAA+B,GAAEC,QAAQ,CAAO,EAC7DC,IAAI,iBAAI;IAAK,SAAS;EAA2B,GAAEA,IAAI,CAAO,EAC9DC,OAAO,iBACN,oBAAC,OAAO;IAAC,SAAS,EAAC,KAAK;IAAC,SAAS;EAA8B,GAC7DA,OAAO,CAEX,CACG,EACL,CAACE,KAAK,IAAIC,YAAY,kBACrB;IAAK,SAAS;EAAoC,GAC/CD,KAAK,iBAAI;IAAK,SAAS;EAAqC,GAAEA,KAAK,CAAO,EAC1EC,YAAY,iBACX;IAAK,SAAS;EAAoC,GAAEA,YAAY,CACjE,CAEJ,CACG,EACLC,MAAM,iBAAI;IAAK,SAAS;EAA6B,GAAEA,MAAM,CAAO,EACpEC,OAAO,iBAAI;IAAK,SAAS;EAA8B,GAAEA,OAAO,CAAO,CACpE,CACG;AAEf,CAAC"}
1	+ {"version":3,"file":"RichCell.js","names":["React","classNames","useAdaptivity","SizeType","Tappable","Subhead","sizeYClassNames","none","COMPACT","RichCell","subhead","children","text","caption","before","after","afterCaption","bottom","actions","multiline","className","restProps","sizeY","REGULAR"],"sources":["../../../../src/components/RichCell/RichCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './RichCell.module.css';\n\nconst sizeYClassNames = {\n none: styles['RichCell--sizeY-none'],\n [SizeType.COMPACT]: styles['RichCell--sizeY-compact'],\n};\n\nexport interface RichCellProps extends TappableProps {\n /*\n Контейнер для текста над `children`.\n /\n subhead?: React.ReactNode;\n /\n Контейнер для текста под `children`.\n /\n text?: React.ReactNode;\n /\n Контейнер для текста под `text`.\n /\n caption?: React.ReactNode;\n /\n Контейнер для контента под `caption`. Например `<UsersStack size=\"m\" />`.\n /\n bottom?: React.ReactNode;\n /\n Кнопки-действия. Принимает [`Button`](https://vkcom.github.io/VKUI/#/Button) с параметрами:\n \n - `mode=\"primary\" size=\"s\"`\n * - `mode=\"secondary\" size=\"s\"`\n \n Для набора кнопок используйте [`ButtonGroup`](https://vkcom.github.io/VKUI/#/ButtonGroup) с параметрами:\n \n - `mode=\"horizontal\" gap=\"s\" stretched`\n /\n actions?: React.ReactNode;\n /\n `<Avatar size={40\|48\|72} />`.\n /\n before?: React.ReactNode;\n /\n Иконка 24 или текст.\n /\n after?: React.ReactNode;\n /\n Текст под `after`.\n /\n afterCaption?: React.ReactNode;\n /\n Убирает анимацию нажатия.\n /\n disabled?: boolean;\n /\n Включает многострочный режим для `subhead`, `children`, `text` и `caption`.\n /\n multiline?: boolean;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/RichCell\n */\nexport const RichCell = ({\n subhead,\n children,\n text,\n caption,\n before,\n after,\n afterCaption,\n bottom,\n actions,\n multiline,\n className,\n ...restProps\n}: RichCellProps) => {\n const { sizeY = 'none' } = useAdaptivity();\n\n return (\n <Tappable\n {...restProps}\n className={classNames(\n styles['RichCell'],\n !multiline && styles['RichCell--text-ellipsis'],\n sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n className,\n )}\n >\n {before && <div className={styles['RichCell__before']}>{before}</div>}\n <div className={styles['RichCell__in']}>\n <div className={styles['RichCell__content']}>\n <div className={styles['RichCell__content-before']}>\n {subhead && (\n <Subhead Component=\"div\" className={styles['RichCell__subhead']}>\n {subhead}\n </Subhead>\n )}\n <div className={styles['RichCell__children']}>{children}</div>\n {text && <div className={styles['RichCell__text']}>{text}</div>}\n {caption && (\n <Subhead Component=\"div\" className={styles['RichCell__caption']}>\n {caption}\n </Subhead>\n )}\n </div>\n {(after \|\| afterCaption) && (\n <div className={styles['RichCell__content-after']}>\n {after && <div className={styles['RichCell__after-children']}>{after}</div>}\n {afterCaption && (\n <div className={styles['RichCell__after-caption']}>{afterCaption}</div>\n )}\n </div>\n )}\n </div>\n {bottom && <div className={styles['RichCell__bottom']}>{bottom}</div>}\n {actions && <div className={styles['RichCell__actions']}>{actions}</div>}\n </div>\n </Tappable>\n );\n};\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SAASC,QAAQ,QAAuB,sBAAsB;AAC9D,SAASC,OAAO,QAAQ,+BAA+B;AAAC;AAGxD,IAAMC,eAAe;EACnBC,IAAI;AAAgC,GACnCJ,QAAQ,CAACK,OAAO,gCAClB;AAoDD;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAaA;EAAA,IAZnBC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,YAAY,QAAZA,YAAY;IACZC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,qBAA2BnB,aAAa,EAAE;IAAA,sCAAlCoB,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE,oBAAC,QAAQ,eACHD,SAAS;IACb,SAAS,EAAEpB,UAAU,iBAEnB,CAACkB,SAAS,iCAAqC,EAC/CG,KAAK,KAAKnB,QAAQ,CAACoB,OAAO,IAAIjB,eAAe,CAACgB,KAAK,CAAC,EACpDF,SAAS;EACT,IAEDN,MAAM,iBAAI;IAAK,SAAS;EAA6B,GAAEA,MAAM,CAAO,eACrE;IAAK,SAAS;EAAyB,gBACrC;IAAK,SAAS;EAA8B,gBAC1C;IAAK,SAAS;EAAqC,GAChDJ,OAAO,iBACN,oBAAC,OAAO;IAAC,SAAS,EAAC,KAAK;IAAC,SAAS;EAA8B,GAC7DA,OAAO,CAEX,eACD;IAAK,SAAS;EAA+B,GAAEC,QAAQ,CAAO,EAC7DC,IAAI,iBAAI;IAAK,SAAS;EAA2B,GAAEA,IAAI,CAAO,EAC9DC,OAAO,iBACN,oBAAC,OAAO;IAAC,SAAS,EAAC,KAAK;IAAC,SAAS;EAA8B,GAC7DA,OAAO,CAEX,CACG,EACL,CAACE,KAAK,IAAIC,YAAY,kBACrB;IAAK,SAAS;EAAoC,GAC/CD,KAAK,iBAAI;IAAK,SAAS;EAAqC,GAAEA,KAAK,CAAO,EAC1EC,YAAY,iBACX;IAAK,SAAS;EAAoC,GAAEA,YAAY,CACjE,CAEJ,CACG,EACLC,MAAM,iBAAI;IAAK,SAAS;EAA6B,GAAEA,MAAM,CAAO,EACpEC,OAAO,iBAAI;IAAK,SAAS;EAA8B,GAAEA,OAAO,CAAO,CACpE,CACG;AAEf,CAAC"}

package/dist/cssm/components/RichCell/RichCell.module.css CHANGED Viewed

	@@ -1 +1 @@
1	- .vkuiRichCell{box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:flex;font-family~~:VK Sans Text,-~~apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);min-height:64px;padding:8px 16px;padding:8px var(--vkui--size_base_padding_horizontal--regular);text-decoration:none}.vkuiRichCell--sizeY-compact{min-height:60px}.vkuiRichCell__before{margin-right:12px}.vkuiRichCell__in{display:flex;flex-direction:column;flex-grow:1;justify-content:center;max-width:100%;min-width:0}.vkuiRichCell__content{display:flex}.vkuiRichCell__content-before{flex-grow:1;min-width:0}.vkuiRichCell__content-after{align-items:flex-end;box-sizing:border-box;display:flex;flex-direction:column;flex-shrink:0;padding-left:4px}.vkuiRichCell__after-children{font-weight:500;font-weight:var(--vkui--font_weight_accent2)}.vkuiRichCell__after-caption{color:#818c99;color:var(--vkui--color_text_secondary);font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular);margin-top:2px}.vkuiRichCell--sizeY-compact .vkuiRichCell__after-caption{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular)}@media (pointer:fine) and (min-width:768px)~~,not (min-height:415px)~~{.vkuiRichCell--sizeY-none .vkuiRichCell__after-caption{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular)}}.vkuiRichCell__caption,.vkuiRichCell__subhead{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiRichCell__caption{margin-top:1px}.vkuiRichCell__children{font-weight:500;font-weight:var(--vkui--font_weight_accent2)}.vkuiRichCell--text-ellipsis .vkuiRichCell__caption,.vkuiRichCell--text-ellipsis .vkuiRichCell__children,.vkuiRichCell--text-ellipsis .vkuiRichCell__subhead,.vkuiRichCell--text-ellipsis .vkuiRichCell__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiRichCell__bottom{margin-top:5px}.vkuiRichCell__actions{margin-top:8px}.vkuiRichCell__after-children,.vkuiRichCell__children,.vkuiRichCell__text{font-size:15px;font-size:var(--vkui--font_paragraph--font_size--regular);line-height:20px;line-height:var(--vkui--font_paragraph--line_height--regular)}.vkuiRichCell--sizeY-compact .vkuiRichCell__after-children,.vkuiRichCell--sizeY-compact .vkuiRichCell__children,.vkuiRichCell--sizeY-compact .vkuiRichCell__text{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}@media (pointer:fine) and (min-width:768px)~~,not (min-height:415px)~~{.vkuiRichCell--sizeY-none .vkuiRichCell__after-children,.vkuiRichCell--sizeY-none .vkuiRichCell__children,.vkuiRichCell--sizeY-none .vkuiRichCell__text{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}}.vkuiFormItem .vkuiRichCell{margin-left:calc(-1 * 16px);margin-left:calc(-1 * var(--vkui--size_base_padding_horizontal--regular));margin-right:calc(-1 * 16px);margin-right:calc(-1 * var(--vkui--size_base_padding_horizontal--regular))}@media (pointer:fine) and (min-width:768px)~~,not (min-height:415px)~~{.vkuiRichCell--sizeY-none{min-height:60px}}
1	+ .vkuiRichCell{box-sizing:border-box;color:#000;color:var(--vkui--color_text_primary);display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);min-height:64px;padding:8px 16px;padding:8px var(--vkui--size_base_padding_horizontal--regular);text-decoration:none}.vkuiRichCell--sizeY-compact{min-height:60px}.vkuiRichCell__before{margin-right:12px}.vkuiRichCell__in{display:flex;flex-direction:column;flex-grow:1;justify-content:center;max-width:100%;min-width:0}.vkuiRichCell__content{display:flex}.vkuiRichCell__content-before{flex-grow:1;min-width:0}.vkuiRichCell__content-after{align-items:flex-end;box-sizing:border-box;display:flex;flex-direction:column;flex-shrink:0;padding-left:4px}.vkuiRichCell__after-children{font-weight:500;font-weight:var(--vkui--font_weight_accent2)}.vkuiRichCell__after-caption{color:#818c99;color:var(--vkui--color_text_secondary);font-size:13px;font-size:var(--vkui--font_footnote--font_size--regular);line-height:16px;line-height:var(--vkui--font_footnote--line_height--regular);margin-top:2px}.vkuiRichCell--sizeY-compact .vkuiRichCell__after-caption{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiRichCell--sizeY-none .vkuiRichCell__after-caption{font-size:12px;font-size:var(--vkui--font_caption1--font_size--regular);line-height:14px;line-height:var(--vkui--font_caption1--line_height--regular)}}.vkuiRichCell__caption,.vkuiRichCell__subhead{color:#818c99;color:var(--vkui--color_text_secondary)}.vkuiRichCell__caption{margin-top:1px}.vkuiRichCell__children{font-weight:500;font-weight:var(--vkui--font_weight_accent2)}.vkuiRichCell--text-ellipsis .vkuiRichCell__caption,.vkuiRichCell--text-ellipsis .vkuiRichCell__children,.vkuiRichCell--text-ellipsis .vkuiRichCell__subhead,.vkuiRichCell--text-ellipsis .vkuiRichCell__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiRichCell__bottom{margin-top:5px}.vkuiRichCell__actions{margin-top:8px}.vkuiRichCell__after-children,.vkuiRichCell__children,.vkuiRichCell__text{font-size:15px;font-size:var(--vkui--font_paragraph--font_size--regular);line-height:20px;line-height:var(--vkui--font_paragraph--line_height--regular)}.vkuiRichCell--sizeY-compact .vkuiRichCell__after-children,.vkuiRichCell--sizeY-compact .vkuiRichCell__children,.vkuiRichCell--sizeY-compact .vkuiRichCell__text{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiRichCell--sizeY-none .vkuiRichCell__after-children,.vkuiRichCell--sizeY-none .vkuiRichCell__children,.vkuiRichCell--sizeY-none .vkuiRichCell__text{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}}.vkuiFormItem .vkuiRichCell{margin-left:calc(-1 * 16px);margin-left:calc(-1 * var(--vkui--size_base_padding_horizontal--regular));margin-right:calc(-1 * 16px);margin-right:calc(-1 * var(--vkui--size_base_padding_horizontal--regular))}@media (max-height:414.9px),(pointer:fine) and (min-width:768px){.vkuiRichCell--sizeY-none{min-height:60px}}

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

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "arrow", "appearance", "className"];
 import * as React from 'react';
-import { HoverPopper } from '../HoverPopper/HoverPopper';
 import { classNames } from '@vkontakte/vkjs';
+import { HoverPopper } from '../HoverPopper/HoverPopper';
 import "./RichTooltip.module.css";
 /**
  * @see https://vkcom.github.io/VKUI/#/RichTooltip

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTooltip.js","names":["React","~~HoverPopper~~","~~classNames~~","RichTooltip","children","arrow","appearance","className","popperProps","styles"],"sources":["../../../../src/components/RichTooltip/RichTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ~~HoverPopper,~~ ~~HoverPopperProps~~ } from '~~../HoverPopper~~/~~HoverPopper~~';\nimport { ~~classNames~~ } from '~~@vkontakte~~/~~vkjs~~';\nimport styles from './RichTooltip.module.css';\n\nexport interface RichTooltipProps extends Omit<HoverPopperProps, 'arrowClassName'> {\n /*\n Стиль отображения подсказки\n /\n appearance?: 'accent' \| 'neutral' \| 'white' \| 'black' \| 'inversion';\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/RichTooltip\n */\nexport const RichTooltip = ({\n children,\n arrow = true,\n appearance = 'neutral',\n className,\n ...popperProps\n}: RichTooltipProps) => {\n return (\n <HoverPopper\n className={classNames(\n styles['RichTooltip'],\n styles[`RichTooltip--appearance-${appearance}`],\n className,\n )}\n arrow={arrow}\n arrowClassName={styles['RichTooltip__arrow']}\n {...popperProps}\n >\n {children}\n </HoverPopper>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,~~WAAW~~,~~QAA0B~~,~~4BAA4B~~;~~AAC1E~~,SAASC,~~UAAU~~,~~QAAQ~~,~~iBAAiB~~;AAAC;~~AAU7C~~;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAMA;EAAA,IALtBC,QAAQ,QAARA,QAAQ;IAAA,kBACRC,KAAK;IAALA,KAAK,2BAAG,IAAI;IAAA,uBACZC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,SAAS,QAATA,SAAS;IACNC,WAAW;EAEd,oBACE,oBAAC,WAAW;IACV,SAAS,~~EAAEN~~,UAAU,~~oBAEnBO~~,MAAM,mCAA4BH,UAAU,EAAG,EAC/CC,SAAS,CACT;IACF,KAAK,EAAEF,KAAM;IACb,cAAc;EAA+B,GACzCG,WAAW,GAEdJ,QAAQ,CACG;AAElB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}
1	+ {"version":3,"file":"RichTooltip.js","names":["React","classNames","HoverPopper","RichTooltip","children","arrow","appearance","className","popperProps","styles"],"sources":["../../../../src/components/RichTooltip/RichTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HoverPopper, HoverPopperProps } from '../HoverPopper/HoverPopper';\nimport styles from './RichTooltip.module.css';\n\nexport interface RichTooltipProps extends Omit<HoverPopperProps, 'arrowClassName'> {\n /*\n Стиль отображения подсказки\n /\n appearance?: 'accent' \| 'neutral' \| 'white' \| 'black' \| 'inversion';\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/RichTooltip\n */\nexport const RichTooltip = ({\n children,\n arrow = true,\n appearance = 'neutral',\n className,\n ...popperProps\n}: RichTooltipProps) => {\n return (\n <HoverPopper\n className={classNames(\n styles['RichTooltip'],\n styles[`RichTooltip--appearance-${appearance}`],\n className,\n )}\n arrow={arrow}\n arrowClassName={styles['RichTooltip__arrow']}\n {...popperProps}\n >\n {children}\n </HoverPopper>\n );\n};\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,iBAAiB;AAC5C,SAASC,WAAW,QAA0B,4BAA4B;AAAC;AAU3E;AACA;AACA;AACA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAMA;EAAA,IALtBC,QAAQ,QAARA,QAAQ;IAAA,kBACRC,KAAK;IAALA,KAAK,2BAAG,IAAI;IAAA,uBACZC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,SAAS,QAATA,SAAS;IACNC,WAAW;EAEd,oBACE,oBAAC,WAAW;IACV,SAAS,EAAEP,UAAU,oBAEnBQ,MAAM,mCAA4BH,UAAU,EAAG,EAC/CC,SAAS,CACT;IACF,KAAK,EAAEF,KAAM;IACb,cAAc;EAA+B,GACzCG,WAAW,GAEdJ,QAAQ,CACG;AAElB,CAAC;AAAC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA"}

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

@@ -4,17 +4,17 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["children", "activeView", "onTransition", "nav", "className"];
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
+import { usePlatform } from '../../hooks/usePlatform';
+import { useTimeout } from '../../hooks/useTimeout';
+import { useDOM } from '../../lib/dom';
+import { getNavId } from '../../lib/getNavId';
 import { Platform } from '../../lib/platform';
-import { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';
-import { SplitColContext } from '../SplitCol/SplitCol';
+import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
+import { warnOnce } from '../../lib/warnOnce';
 import { ScrollContext } from '../AppRoot/ScrollContext';
+import { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';
 import { NavTransitionProvider } from '../NavTransitionContext/NavTransitionContext';
-import { getNavId } from '../../lib/getNavId';
-import { warnOnce } from '../../lib/warnOnce';
-import { useDOM } from '../../lib/dom';
-import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
-import { useTimeout } from '../../hooks/useTimeout';
-import { usePlatform } from '../../hooks/usePlatform';
+import { SplitColContext } from '../SplitCol/SplitColContext';
 import "./Root.module.css";
 var warn = warnOnce('Root');