@vkontakte/vkui 5.2.3 → 5.3.0

package/dist/cjs/components/ActionSheet/ActionSheetDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionSheetDropdown.js","names":["stopPropagation","e","ActionSheetDropdown","children","closing","toggleRef","className","restProps","useAdaptivityWithJSMediaQueries","sizeY","platform","usePlatform","classNames","Platform","IOS","SizeType","COMPACT"],"sources":["../../../../src/components/ActionSheet/ActionSheetDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n  SharedDropdownProps,\n  'popupDirection' | 'popupOffsetDistance'\n>;\n\nexport const ActionSheetDropdown = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  return (\n    <FocusTrap\n      {...restProps}\n      onClick={stopPropagation}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === Platform.IOS && styles['ActionSheet--ios'],\n        closing && styles['ActionSheet--closing'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAmD;AAInD,IAAMA,eAAwC,GAAG,SAA3CA,eAAwC,CAAIC,CAAC;EAAA,OAAKA,CAAC,CAACD,eAAe,EAAE;AAAA;AAOpE,IAAME,mBAAmB,GAAG,SAAtBA,mBAAmB,OAOL;EAAA,IANzBC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IAEPC,SAAS,QAATA,SAAS;IACTC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,4BAAkB,IAAAC,gEAA+B,GAAE;IAA3CC,KAAK,yBAALA,KAAK;EACb,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,oBAAS,6BACJJ,SAAS;IACb,OAAO,EAAEP,eAAgB;IACzB,SAAS,EAAE,IAAAY,gBAAU,qBAEnBF,QAAQ,KAAKG,kBAAQ,CAACC,GAAG,0BAA8B,EACvDV,OAAO,8BAAkC,EACzCK,KAAK,KAAKM,oBAAQ,CAACC,OAAO,oCAAwC,EAClEV,SAAS;EACT,IAEDH,QAAQ,CACC;AAEhB,CAAC;AAAC"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst stopPropagation: React.MouseEventHandler = (e) => e.stopPropagation();\n\nexport type ActionSheetDropdownProps = Omit<\n  SharedDropdownProps,\n  'popupDirection' | 'popupOffsetDistance'\n>;\n\nexport const ActionSheetDropdown = ({\n  children,\n  closing,\n  // these 2 props are only omitted - ActionSheetDesktop compat\n  toggleRef,\n  className,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const platform = usePlatform();\n\n  return (\n    <FocusTrap\n      {...restProps}\n      onClick={stopPropagation}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === Platform.IOS && styles['ActionSheet--ios'],\n        closing && styles['ActionSheet--closing'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n    >\n      {children}\n    </FocusTrap>\n  );\n};\n"],"names":["ActionSheetDropdown","stopPropagation","e","children","closing","toggleRef","className","restProps","sizeY","useAdaptivityWithJSMediaQueries","platform","usePlatform","FocusTrap","onClick","classNames","Platform","IOS","SizeType","COMPACT"],"mappings":";;;;+BAiBaA;;;eAAAA;;;;;;;2DAjBU;oBACI;+CACqB;2BACpB;0BACH;wBACA;yBACC;AAI1B,IAAMC,kBAA2C,SAACC;WAAMA,EAAED,eAAe;;AAOlE,IAAMD,sBAAsB,iBAOR;QANzBG,kBAAAA,UACAC,iBAAAA,SACA,6DAA6D;IAC7DC,mBAAAA,WACAC,mBAAAA,WACGC;QALHJ;QACAC;QAEAC;QACAC;;IAGA,IAAM,AAAEE,QAAUC,IAAAA,gEAA+B,IAAzCD;IACR,IAAME,WAAWC,IAAAA,wBAAW;IAE5B,qBACE,qBAACC,oBAAS,uCACJL;QACJM,SAASZ;QACTK,WAAWQ,IAAAA,gBAAU,qBAEnBJ,aAAaK,kBAAQ,CAACC,GAAG,4BACzBZ,uCACAI,UAAUS,oBAAQ,CAACC,OAAO,sCAC1BZ;QAGDH;AAGP"}

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js

@@ -1,14 +1,18 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "ActionSheetDropdownDesktop", {
+    enumerable: true,
+    get: function() {
+        return ActionSheetDropdownDesktop;
+    }
 });
-exports.ActionSheetDropdownDesktop = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var React = _interopRequireWildcard(require("react"));
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
+var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
+var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivityWithJSMediaQueries = require("../../hooks/useAdaptivityWithJSMediaQueries");
 var _useEffectDev = require("../../hooks/useEffectDev");
@@ -19,74 +23,81 @@ var _dom = require("../../lib/dom");
 var _isRefObject = require("../../lib/isRefObject");
 var _platform = require("../../lib/platform");
 var _warnOnce = require("../../lib/warnOnce");
-var _FocusTrap = require("../FocusTrap/FocusTrap");
-var _Popper = require("../Popper/Popper");
-var _excluded = ["children", "toggleRef", "closing", "popupDirection", "onClose", "className", "style", "popupOffsetDistance"];
-var warn = (0, _warnOnce.warnOnce)('ActionSheet');
+var _focusTrap = require("../FocusTrap/FocusTrap");
+var _popper = require("../Popper/Popper");
+var warn = (0, _warnOnce.warnOnce)("ActionSheet");
 function getEl(ref) {
-  return ref && 'current' in ref ? ref.current : ref;
+    return ref && "current" in ref ? ref.current : ref;
 }
-var ActionSheetDropdownDesktop = function ActionSheetDropdownDesktop(_ref) {
-  var children = _ref.children,
-    toggleRef = _ref.toggleRef,
-    closing = _ref.closing,
-    popupDirection = _ref.popupDirection,
-    onClose = _ref.onClose,
-    className = _ref.className,
-    style = _ref.style,
-    _ref$popupOffsetDista = _ref.popupOffsetDistance,
-    popupOffsetDistance = _ref$popupOffsetDista === void 0 ? 0 : _ref$popupOffsetDista,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _useDOM = (0, _dom.useDOM)(),
-    document = _useDOM.document;
-  var platform = (0, _usePlatform.usePlatform)();
-  var _useAdaptivityWithJSM = (0, _useAdaptivityWithJSMediaQueries.useAdaptivityWithJSMediaQueries)(),
-    sizeY = _useAdaptivityWithJSM.sizeY;
-  var elementRef = React.useRef(null);
-  (0, _useEffectDev.useEffectDev)(function () {
-    var toggleEl = getEl(toggleRef);
-    if (!toggleEl) {
-      warn("\u0421\u0432\u043E\u0439\u0441\u0442\u0432\u043E \"toggleRef\" \u043D\u0435 \u043F\u0435\u0440\u0435\u0434\u0430\u043D\u043E", 'error');
-    }
-  }, [toggleRef]);
-  var isPopupDirectionTop = React.useMemo(function () {
-    return popupDirection === 'top' || typeof popupDirection === 'function' && popupDirection(elementRef) === 'top';
-  }, [popupDirection, elementRef]);
-  var bodyClickListener = (0, _useEventListener.useEventListener)('click', function (e) {
-    var dropdownElement = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current;
-    if (dropdownElement && !dropdownElement.contains(e.target)) {
-      onClose === null || onClose === void 0 ? void 0 : onClose();
-    }
-  });
-  React.useEffect(function () {
-    setTimeout(function () {
-      bodyClickListener.add(document.body);
+var ActionSheetDropdownDesktop = function(_param) {
+    var children = _param.children, toggleRef = _param.toggleRef, closing = _param.closing, popupDirection = _param.popupDirection, onClose = _param.onClose, className = _param.className, style = _param.style, _param_popupOffsetDistance = _param.popupOffsetDistance, popupOffsetDistance = _param_popupOffsetDistance === void 0 ? 0 : _param_popupOffsetDistance, restProps = _objectWithoutProperties(_param, [
+        "children",
+        "toggleRef",
+        "closing",
+        "popupDirection",
+        "onClose",
+        "className",
+        "style",
+        "popupOffsetDistance"
+    ]);
+    var document = (0, _dom.useDOM)().document;
+    var platform = (0, _usePlatform.usePlatform)();
+    var sizeY = (0, _useAdaptivityWithJSMediaQueries.useAdaptivityWithJSMediaQueries)().sizeY;
+    var elementRef = _react.useRef(null);
+    (0, _useEffectDev.useEffectDev)(function() {
+        var toggleEl = getEl(toggleRef);
+        if (!toggleEl) {
+            warn('Свойство "toggleRef" не передано', "error");
+        }
+    }, [
+        toggleRef
+    ]);
+    var isPopupDirectionTop = _react.useMemo(function() {
+        return popupDirection === "top" || typeof popupDirection === "function" && popupDirection(elementRef) === "top";
+    }, [
+        popupDirection,
+        elementRef
+    ]);
+    var bodyClickListener = (0, _useEventListener.useEventListener)("click", function(e) {
+        var dropdownElement = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current;
+        if (dropdownElement && !dropdownElement.contains(e.target)) {
+            onClose === null || onClose === void 0 ? void 0 : onClose();
+        }
     });
-  }, [bodyClickListener, document]);
-  var onClick = React.useCallback(function (e) {
-    return e.stopPropagation();
-  }, []);
-  var targetRef = React.useMemo(function () {
-    if ((0, _isRefObject.isRefObject)(toggleRef)) {
-      return toggleRef;
-    }
-    return {
-      current: toggleRef
-    };
-  }, [toggleRef]);
-  return /*#__PURE__*/React.createElement(_Popper.Popper, {
-    targetRef: targetRef,
-    offsetDistance: popupOffsetDistance,
-    placement: isPopupDirectionTop ? 'top-end' : 'bottom-end',
-    className: (0, _vkjs.classNames)("vkuiActionSheet", platform === _platform.Platform.IOS && "vkuiActionSheet--ios", "vkuiActionSheet--desktop", sizeY === _adaptivity.SizeType.COMPACT && "vkuiActionSheet--sizeY-compact", className),
-    style: style,
-    getRef: elementRef,
-    forcePortal: false
-  }, /*#__PURE__*/React.createElement(_FocusTrap.FocusTrap, (0, _extends2.default)({
-    onClose: onClose
-  }, restProps, {
-    onClick: onClick
-  }), children));
+    _react.useEffect(function() {
+        setTimeout(function() {
+            bodyClickListener.add(document.body);
+        });
+    }, [
+        bodyClickListener,
+        document
+    ]);
+    var onClick = _react.useCallback(function(e) {
+        return e.stopPropagation();
+    }, []);
+    var targetRef = _react.useMemo(function() {
+        if ((0, _isRefObject.isRefObject)(toggleRef)) {
+            return toggleRef;
+        }
+        return {
+            current: toggleRef
+        };
+    }, [
+        toggleRef
+    ]);
+    return /*#__PURE__*/ _react.createElement(_popper.Popper, {
+        targetRef: targetRef,
+        offsetDistance: popupOffsetDistance,
+        placement: isPopupDirectionTop ? "top-end" : "bottom-end",
+        className: (0, _vkjs.classNames)("vkuiActionSheet", platform === _platform.Platform.IOS && "vkuiActionSheet--ios", "vkuiActionSheet--desktop", sizeY === _adaptivity.SizeType.COMPACT && "vkuiActionSheet--sizeY-compact", className),
+        style: style,
+        getRef: elementRef,
+        forcePortal: false
+    }, /*#__PURE__*/ _react.createElement(_focusTrap.FocusTrap, _objectSpreadProps(_objectSpread({
+        onClose: onClose
+    }, restProps), {
+        onClick: onClick
+    }), children));
 };
-exports.ActionSheetDropdownDesktop = ActionSheetDropdownDesktop;
+
 //# sourceMappingURL=ActionSheetDropdownDesktop.js.map

package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionSheetDropdownDesktop.js","names":["warn","warnOnce","getEl","ref","current","ActionSheetDropdownDesktop","children","toggleRef","closing","popupDirection","onClose","className","style","popupOffsetDistance","restProps","useDOM","document","platform","usePlatform","useAdaptivityWithJSMediaQueries","sizeY","elementRef","React","useRef","useEffectDev","toggleEl","isPopupDirectionTop","useMemo","bodyClickListener","useEventListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation","targetRef","isRefObject","classNames","Platform","IOS","SizeType","COMPACT"],"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownDesktop.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useEffectDev } from '../../hooks/useEffectDev';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownDesktop = ({\n  children,\n  toggleRef,\n  closing,\n  popupDirection,\n  onClose,\n  className,\n  style,\n  popupOffsetDistance = 0,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n  useEffectDev(() => {\n    const toggleEl = getEl(toggleRef);\n    if (!toggleEl) {\n      warn(`Свойство \"toggleRef\" не передано`, 'error');\n    }\n  }, [toggleRef]);\n\n  const isPopupDirectionTop = React.useMemo(\n    () =>\n      popupDirection === 'top' ||\n      (typeof popupDirection === 'function' && popupDirection(elementRef) === 'top'),\n    [popupDirection, elementRef],\n  );\n\n  const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n    const dropdownElement = elementRef?.current;\n    if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n      onClose?.();\n    }\n  });\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      bodyClickListener.add(document!.body);\n    });\n  }, [bodyClickListener, document]);\n\n  const onClick = React.useCallback((e: React.MouseEvent<HTMLElement>) => e.stopPropagation(), []);\n\n  const targetRef = React.useMemo(() => {\n    if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n      return toggleRef;\n    }\n\n    return { current: toggleRef as HTMLElement };\n  }, [toggleRef]);\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetDistance={popupOffsetDistance}\n      placement={isPopupDirectionTop ? 'top-end' : 'bottom-end'}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === Platform.IOS && styles['ActionSheet--ios'],\n        styles['ActionSheet--desktop'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n      style={style}\n      getRef={elementRef}\n      forcePortal={false}\n    >\n      <FocusTrap onClose={onClose} {...restProps} onClick={onClick}>\n        {children}\n      </FocusTrap>\n    </Popper>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ActionSheet/ActionSheetDropdownDesktop.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useEffectDev } from '../../hooks/useEffectDev';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { useDOM } from '../../lib/dom';\nimport { isRefObject } from '../../lib/isRefObject';\nimport { Platform } from '../../lib/platform';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { Popper } from '../Popper/Popper';\nimport { SharedDropdownProps } from './types';\nimport styles from './ActionSheet.module.css';\n\nconst warn = warnOnce('ActionSheet');\nfunction getEl(ref: SharedDropdownProps['toggleRef']): Element | null | undefined {\n  return ref && 'current' in ref ? ref.current : ref;\n}\n\nexport const ActionSheetDropdownDesktop = ({\n  children,\n  toggleRef,\n  closing,\n  popupDirection,\n  onClose,\n  className,\n  style,\n  popupOffsetDistance = 0,\n  ...restProps\n}: SharedDropdownProps) => {\n  const { document } = useDOM();\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n  const elementRef = React.useRef<HTMLDivElement | null>(null);\n\n  useEffectDev(() => {\n    const toggleEl = getEl(toggleRef);\n    if (!toggleEl) {\n      warn(`Свойство \"toggleRef\" не передано`, 'error');\n    }\n  }, [toggleRef]);\n\n  const isPopupDirectionTop = React.useMemo(\n    () =>\n      popupDirection === 'top' ||\n      (typeof popupDirection === 'function' && popupDirection(elementRef) === 'top'),\n    [popupDirection, elementRef],\n  );\n\n  const bodyClickListener = useEventListener('click', (e: MouseEvent) => {\n    const dropdownElement = elementRef?.current;\n    if (dropdownElement && !dropdownElement.contains(e.target as Node)) {\n      onClose?.();\n    }\n  });\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      bodyClickListener.add(document!.body);\n    });\n  }, [bodyClickListener, document]);\n\n  const onClick = React.useCallback((e: React.MouseEvent<HTMLElement>) => e.stopPropagation(), []);\n\n  const targetRef = React.useMemo(() => {\n    if (isRefObject<SharedDropdownProps['toggleRef'], HTMLElement>(toggleRef)) {\n      return toggleRef;\n    }\n\n    return { current: toggleRef as HTMLElement };\n  }, [toggleRef]);\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetDistance={popupOffsetDistance}\n      placement={isPopupDirectionTop ? 'top-end' : 'bottom-end'}\n      className={classNames(\n        styles['ActionSheet'],\n        platform === Platform.IOS && styles['ActionSheet--ios'],\n        styles['ActionSheet--desktop'],\n        sizeY === SizeType.COMPACT && styles['ActionSheet--sizeY-compact'],\n        className,\n      )}\n      style={style}\n      getRef={elementRef}\n      forcePortal={false}\n    >\n      <FocusTrap onClose={onClose} {...restProps} onClick={onClick}>\n        {children}\n      </FocusTrap>\n    </Popper>\n  );\n};\n"],"names":["ActionSheetDropdownDesktop","warn","warnOnce","getEl","ref","current","children","toggleRef","closing","popupDirection","onClose","className","style","popupOffsetDistance","restProps","document","useDOM","platform","usePlatform","sizeY","useAdaptivityWithJSMediaQueries","elementRef","React","useRef","useEffectDev","toggleEl","isPopupDirectionTop","useMemo","bodyClickListener","useEventListener","e","dropdownElement","contains","target","useEffect","setTimeout","add","body","onClick","useCallback","stopPropagation","targetRef","isRefObject","Popper","offsetDistance","placement","classNames","Platform","IOS","SizeType","COMPACT","getRef","forcePortal","FocusTrap"],"mappings":";;;;+BAqBaA;;;eAAAA;;;;;;;2DArBU;oBACI;+CACqB;4BACnB;gCACI;2BACL;0BACH;mBACF;2BACK;wBACH;wBACA;yBACC;sBACH;AAIvB,IAAMC,OAAOC,IAAAA,kBAAQ,EAAC;AACtB,SAASC,MAAMC,GAAqC,EAA8B;IAChF,OAAOA,OAAO,aAAaA,MAAMA,IAAIC,OAAO,GAAGD,GAAG;AACpD;AAEO,IAAMJ,6BAA6B,iBAUf;QATzBM,kBAAAA,UACAC,mBAAAA,WACAC,iBAAAA,SACAC,wBAAAA,gBACAC,iBAAAA,SACAC,mBAAAA,WACAC,eAAAA,2CACAC,qBAAAA,8DAAsB,gCACnBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAAM,AAAEE,WAAaC,IAAAA,WAAM,IAAnBD;IACR,IAAME,WAAWC,IAAAA,wBAAW;IAC5B,IAAM,AAAEC,QAAUC,IAAAA,gEAA+B,IAAzCD;IACR,IAAME,aAAaC,OAAMC,MAAM,CAAwB,IAAI;IAE3DC,IAAAA,0BAAY,EAAC,WAAM;QACjB,IAAMC,WAAWtB,MAAMI;QACvB,IAAI,CAACkB,UAAU;YACbxB,KAAM,oCAAmC;QAC3C,CAAC;IACH,GAAG;QAACM;KAAU;IAEd,IAAMmB,sBAAsBJ,OAAMK,OAAO,CACvC;eACElB,mBAAmB,SAClB,OAAOA,mBAAmB,cAAcA,eAAeY,gBAAgB;OAC1E;QAACZ;QAAgBY;KAAW;IAG9B,IAAMO,oBAAoBC,IAAAA,kCAAgB,EAAC,SAAS,SAACC,GAAkB;QACrE,IAAMC,kBAAkBV,uBAAAA,wBAAAA,KAAAA,IAAAA,WAAYhB,OAAO;QAC3C,IAAI0B,mBAAmB,CAACA,gBAAgBC,QAAQ,CAACF,EAAEG,MAAM,GAAW;YAClEvB,oBAAAA,qBAAAA,KAAAA,IAAAA;QACF,CAAC;IACH;IAEAY,OAAMY,SAAS,CAAC,WAAM;QACpBC,WAAW,WAAM;YACfP,kBAAkBQ,GAAG,CAACrB,SAAUsB,IAAI;QACtC;IACF,GAAG;QAACT;QAAmBb;KAAS;IAEhC,IAAMuB,UAAUhB,OAAMiB,WAAW,CAAC,SAACT;eAAqCA,EAAEU,eAAe;OAAI,EAAE;IAE/F,IAAMC,YAAYnB,OAAMK,OAAO,CAAC,WAAM;QACpC,IAAIe,IAAAA,wBAAW,EAAgDnC,YAAY;YACzE,OAAOA;QACT,CAAC;QAED,OAAO;YAAEF,SAASE;QAAyB;IAC7C,GAAG;QAACA;KAAU;IAEd,qBACE,qBAACoC,cAAM;QACLF,WAAWA;QACXG,gBAAgB/B;QAChBgC,WAAWnB,sBAAsB,YAAY,YAAY;QACzDf,WAAWmC,IAAAA,gBAAU,qBAEnB7B,aAAa8B,kBAAQ,CAACC,GAAG,wDAEzB7B,UAAU8B,oBAAQ,CAACC,OAAO,sCAC1BvC;QAEFC,OAAOA;QACPuC,QAAQ9B;QACR+B,aAAa,KAAK;qBAElB,qBAACC,oBAAS;QAAC3C,SAASA;OAAaI;QAAWwB,SAASA;QAClDhC;AAIT"}

package/dist/cjs/components/ActionSheet/types.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { FocusTrapProps } from '../FocusTrap/FocusTrap';
-export declare type PopupDirection = 'top' | 'bottom' | ((elRef: React.RefObject<HTMLDivElement>) => 'top' | 'bottom');
-export declare type ToggleRef = Element | null | undefined | React.RefObject<Element>;
+export type PopupDirection = 'top' | 'bottom' | ((elRef: React.RefObject<HTMLDivElement>) => 'top' | 'bottom');
+export type ToggleRef = Element | null | undefined | React.RefObject<Element>;
 export interface SharedDropdownProps extends React.AllHTMLAttributes<HTMLElement>, FocusTrapProps {
     closing: boolean;
     /**

package/dist/cjs/components/ActionSheet/types.js

@@ -1,6 +1,8 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+
 //# sourceMappingURL=types.js.map

package/dist/cjs/components/ActionSheet/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/ActionSheet/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { FocusTrapProps } from '../FocusTrap/FocusTrap';\n\nexport type PopupDirection =\n  | 'top'\n  | 'bottom'\n  | ((elRef: React.RefObject<HTMLDivElement>) => 'top' | 'bottom');\nexport type ToggleRef = Element | null | undefined | React.RefObject<Element>;\n\nexport interface SharedDropdownProps extends React.AllHTMLAttributes<HTMLElement>, FocusTrapProps {\n  closing: boolean;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Отступ, где заданное кол-во единиц равняется пикселям\n   * */\n  popupOffsetDistance?: number;\n}\n"],"mappings":""}
+{"version":3,"sources":["../../../../src/components/ActionSheet/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { FocusTrapProps } from '../FocusTrap/FocusTrap';\n\nexport type PopupDirection =\n  | 'top'\n  | 'bottom'\n  | ((elRef: React.RefObject<HTMLDivElement>) => 'top' | 'bottom');\nexport type ToggleRef = Element | null | undefined | React.RefObject<Element>;\n\nexport interface SharedDropdownProps extends React.AllHTMLAttributes<HTMLElement>, FocusTrapProps {\n  closing: boolean;\n  /**\n   * Элемент, рядом с которым вылезает попап на десктопе.\n   * Лучше передавать RefObject c current.\n   * В v5 будет обязательным.\n   */\n  toggleRef?: ToggleRef;\n  /**\n   * Направление на десктопе\n   */\n  popupDirection?: PopupDirection;\n  /**\n   * Отступ, где заданное кол-во единиц равняется пикселям\n   * */\n  popupOffsetDistance?: number;\n}\n"],"names":[],"mappings":";;;;;2DAAuB"}

package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js

@@ -1,104 +1,96 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "ActionSheetItem", {
+    enumerable: true,
+    get: function() {
+        return ActionSheetItem;
+    }
 });
-exports.ActionSheetItem = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var React = _interopRequireWildcard(require("react"));
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
+var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
+var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _icons = require("@vkontakte/icons");
 var _vkjs = require("@vkontakte/vkjs");
 var _useAdaptivityWithJSMediaQueries = require("../../hooks/useAdaptivityWithJSMediaQueries");
 var _usePlatform = require("../../hooks/usePlatform");
 var _adaptivity = require("../../lib/adaptivity");
 var _platform = require("../../lib/platform");
-var _ActionSheetContext = require("../ActionSheet/ActionSheetContext");
-var _Tappable = require("../Tappable/Tappable");
-var _Subhead = require("../Typography/Subhead/Subhead");
-var _Text = require("../Typography/Text/Text");
-var _excluded = ["children", "autoClose", "mode", "meta", "subtitle", "before", "selectable", "value", "name", "checked", "defaultChecked", "onChange", "onClick", "onImmediateClick", "multiline", "iconChecked", "className"];
+var _actionSheetContext = require("../ActionSheet/ActionSheetContext");
+var _tappable = require("../Tappable/Tappable");
+var _subhead = require("../Typography/Subhead/Subhead");
+var _text = require("../Typography/Text/Text");
 /**
  * @see https://vkcom.github.io/VKUI/#/ActionSheetItem
- */
-var ActionSheetItem = function ActionSheetItem(_ref) {
-  var children = _ref.children,
-    autoClose = _ref.autoClose,
-    _ref$mode = _ref.mode,
-    mode = _ref$mode === void 0 ? 'default' : _ref$mode,
-    meta = _ref.meta,
-    subtitle = _ref.subtitle,
-    before = _ref.before,
-    selectable = _ref.selectable,
-    value = _ref.value,
-    name = _ref.name,
-    checked = _ref.checked,
-    defaultChecked = _ref.defaultChecked,
-    onChange = _ref.onChange,
-    onClick = _ref.onClick,
-    onImmediateClick = _ref.onImmediateClick,
-    _ref$multiline = _ref.multiline,
-    multiline = _ref$multiline === void 0 ? false : _ref$multiline,
-    iconCheckedProp = _ref.iconChecked,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var platform = (0, _usePlatform.usePlatform)();
-  var _React$useContext = React.useContext(_ActionSheetContext.ActionSheetContext),
-    _React$useContext$onI = _React$useContext.onItemClick,
-    onItemClick = _React$useContext$onI === void 0 ? function () {
-      return _vkjs.noop;
-    } : _React$useContext$onI,
-    isDesktop = _React$useContext.isDesktop;
-  var _useAdaptivityWithJSM = (0, _useAdaptivityWithJSMediaQueries.useAdaptivityWithJSMediaQueries)(),
-    sizeY = _useAdaptivityWithJSM.sizeY;
-  var iconChecked = iconCheckedProp || (sizeY === _adaptivity.SizeType.COMPACT ? /*#__PURE__*/React.createElement(_icons.Icon20CheckCircleOn, null) : /*#__PURE__*/React.createElement(_icons.Icon24CheckCircleOn, null));
-  var Component = restProps.href ? 'a' : 'div';
-  if (selectable) {
-    Component = 'label';
-  }
-  var isRich = subtitle || meta || selectable;
-  var isCentered = !isRich && !before && platform === _platform.Platform.IOS;
-  return /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({
-    Component: Component
-  }, restProps, {
-    onClick: selectable ? onClick : onItemClick(onClick, onImmediateClick, Boolean(autoClose)),
-    activeMode: platform === _platform.Platform.IOS ? "vkuiActionSheetItem--active" : undefined,
-    className: (0, _vkjs.classNames)("vkuiActionSheetItem", platform === _platform.Platform.IOS && "vkuiActionSheetItem--ios", styles["ActionSheetItem--mode-".concat(mode)], sizeY === _adaptivity.SizeType.COMPACT && "vkuiActionSheetItem--sizeY-compact", isRich && "vkuiActionSheetItem--rich", isDesktop && "vkuiActionSheetItem--desktop", className)
-  }), before && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiActionSheetItem__before"
-  }, before), /*#__PURE__*/React.createElement("div", {
-    className: (0, _vkjs.classNames)("vkuiActionSheetItem__container", !multiline && "vkuiActionSheetItem--ellipsis")
-  }, /*#__PURE__*/React.createElement("div", {
-    className: (0, _vkjs.classNames)("vkuiActionSheetItem__content", isCentered && "vkuiActionSheetItem--centered")
-  }, /*#__PURE__*/React.createElement(_Text.Text, {
-    weight: mode === 'cancel' ? '2' : undefined,
-    className: "vkuiActionSheetItem__children"
-  }, children), meta && /*#__PURE__*/React.createElement(_Text.Text, {
-    className: "vkuiActionSheetItem__meta"
-  }, meta)), subtitle && /*#__PURE__*/React.createElement(_Subhead.Subhead, {
-    className: "vkuiActionSheetItem__subtitle"
-  }, subtitle)), selectable && /*#__PURE__*/React.createElement("div", {
-    className: "vkuiActionSheetItem__after"
-  }, /*#__PURE__*/React.createElement("input", {
-    type: "radio",
-    className: "vkuiActionSheetItem__radio",
-    name: name,
-    value: value,
-    onChange: onChange,
-    onClick: onItemClick(_vkjs.noop, _vkjs.noop, Boolean(autoClose)),
-    defaultChecked: defaultChecked,
-    checked: checked,
-    disabled: restProps.disabled
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "vkuiActionSheetItem__marker"
-  }, iconChecked)));
-};
-exports.ActionSheetItem = ActionSheetItem;
-var styles = {
-  "ActionSheetItem--mode-destructive": "vkuiActionSheetItem--mode-destructive",
-  "ActionSheetItem--mode-cancel": "vkuiActionSheetItem--mode-cancel",
-  "ActionSheetItem--mode-default": "vkuiActionSheetItem--mode-default"
+ */ var ActionSheetItem = function(_param) {
+    var children = _param.children, autoClose = _param.autoClose, _param_mode = _param.mode, mode = _param_mode === void 0 ? "default" : _param_mode, meta = _param.meta, subtitle = _param.subtitle, before = _param.before, selectable = _param.selectable, value = _param.value, name = _param.name, checked = _param.checked, defaultChecked = _param.defaultChecked, onChange = _param.onChange, onClick = _param.onClick, onImmediateClick = _param.onImmediateClick, _param_multiline = _param.multiline, multiline = _param_multiline === void 0 ? false : _param_multiline, iconCheckedProp = _param.iconChecked, className = _param.className, restProps = _objectWithoutProperties(_param, [
+        "children",
+        "autoClose",
+        "mode",
+        "meta",
+        "subtitle",
+        "before",
+        "selectable",
+        "value",
+        "name",
+        "checked",
+        "defaultChecked",
+        "onChange",
+        "onClick",
+        "onImmediateClick",
+        "multiline",
+        "iconChecked",
+        "className"
+    ]);
+    var platform = (0, _usePlatform.usePlatform)();
+    var _React_useContext = _react.useContext(_actionSheetContext.ActionSheetContext), _React_useContext_onItemClick = _React_useContext.onItemClick, onItemClick = _React_useContext_onItemClick === void 0 ? function() {
+        return _vkjs.noop;
+    } : _React_useContext_onItemClick, isDesktop = _React_useContext.isDesktop;
+    var sizeY = (0, _useAdaptivityWithJSMediaQueries.useAdaptivityWithJSMediaQueries)().sizeY;
+    var iconChecked = iconCheckedProp || (sizeY === _adaptivity.SizeType.COMPACT ? /*#__PURE__*/ _react.createElement(_icons.Icon20CheckCircleOn, null) : /*#__PURE__*/ _react.createElement(_icons.Icon24CheckCircleOn, null));
+    var Component = restProps.href ? "a" : "div";
+    if (selectable) {
+        Component = "label";
+    }
+    var isRich = subtitle || meta || selectable;
+    var isCentered = !isRich && !before && platform === _platform.Platform.IOS;
+    return /*#__PURE__*/ _react.createElement(_tappable.Tappable, _objectSpreadProps(_objectSpread({
+        Component: Component
+    }, restProps), {
+        onClick: selectable ? onClick : onItemClick(onClick, onImmediateClick, Boolean(autoClose)),
+        activeMode: platform === _platform.Platform.IOS ? "vkuiActionSheetItem--active" : undefined,
+        className: (0, _vkjs.classNames)("vkuiActionSheetItem", platform === _platform.Platform.IOS && "vkuiActionSheetItem--ios", mode === "cancel" && "vkuiActionSheetItem--mode-cancel", mode === "destructive" && "vkuiActionSheetItem--mode-destructive", sizeY === _adaptivity.SizeType.COMPACT && "vkuiActionSheetItem--sizeY-compact", isRich && "vkuiActionSheetItem--rich", isDesktop && "vkuiActionSheetItem--desktop", className)
+    }), before && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiActionSheetItem__before"
+    }, before), /*#__PURE__*/ _react.createElement("div", {
+        className: (0, _vkjs.classNames)("vkuiActionSheetItem__container", !multiline && "vkuiActionSheetItem--ellipsis")
+    }, /*#__PURE__*/ _react.createElement("div", {
+        className: (0, _vkjs.classNames)("vkuiActionSheetItem__content", isCentered && "vkuiActionSheetItem--centered")
+    }, /*#__PURE__*/ _react.createElement(_text.Text, {
+        weight: mode === "cancel" ? "2" : undefined,
+        className: "vkuiActionSheetItem__children"
+    }, children), meta && /*#__PURE__*/ _react.createElement(_text.Text, {
+        className: "vkuiActionSheetItem__meta"
+    }, meta)), subtitle && /*#__PURE__*/ _react.createElement(_subhead.Subhead, {
+        className: "vkuiActionSheetItem__subtitle"
+    }, subtitle)), selectable && /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiActionSheetItem__after"
+    }, /*#__PURE__*/ _react.createElement("input", {
+        type: "radio",
+        className: "vkuiActionSheetItem__radio",
+        name: name,
+        value: value,
+        onChange: onChange,
+        onClick: onItemClick(_vkjs.noop, _vkjs.noop, Boolean(autoClose)),
+        defaultChecked: defaultChecked,
+        checked: checked,
+        disabled: restProps.disabled
+    }), /*#__PURE__*/ _react.createElement("div", {
+        className: "vkuiActionSheetItem__marker"
+    }, iconChecked)));
 };
+
 //# sourceMappingURL=ActionSheetItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ActionSheetItem.js","names":["ActionSheetItem","children","autoClose","mode","meta","subtitle","before","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconCheckedProp","iconChecked","className","restProps","platform","usePlatform","React","useContext","ActionSheetContext","onItemClick","noop","isDesktop","useAdaptivityWithJSMediaQueries","sizeY","SizeType","COMPACT","Component","href","isRich","isCentered","Platform","IOS","Boolean","undefined","classNames","styles","disabled"],"sources":["../../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  mode?: 'default' | 'destructive' | 'cancel';\n  before?: React.ReactNode;\n  meta?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  autoClose?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * Если autoClose === true, onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `checked` режима.\n   */\n  iconChecked?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nconst ActionSheetItem = ({\n  children,\n  autoClose,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked: iconCheckedProp,\n  className,\n  ...restProps\n}: ActionSheetItemProps) => {\n  const platform = usePlatform();\n  const { onItemClick = () => noop, isDesktop } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n  const iconChecked =\n    iconCheckedProp ||\n    (sizeY === SizeType.COMPACT ? <Icon20CheckCircleOn /> : <Icon24CheckCircleOn />);\n\n  let Component: React.ElementType = restProps.href ? 'a' : 'div';\n\n  if (selectable) {\n    Component = 'label';\n  }\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === Platform.IOS;\n\n  return (\n    <Tappable\n      Component={Component}\n      {...restProps}\n      onClick={selectable ? onClick : onItemClick(onClick, onImmediateClick, Boolean(autoClose))}\n      activeMode={platform === Platform.IOS ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === Platform.IOS && styles['ActionSheetItem--ios'],\n        styles[`ActionSheetItem--mode-${mode}`],\n        sizeY === SizeType.COMPACT && styles['ActionSheetItem--sizeY-compact'],\n        isRich && styles['ActionSheetItem--rich'],\n        isDesktop && styles['ActionSheetItem--desktop'],\n        className,\n      )}\n    >\n      {before && <div className={styles['ActionSheetItem__before']}>{before}</div>}\n      <div\n        className={classNames(\n          styles['ActionSheetItem__container'],\n          !multiline && styles['ActionSheetItem--ellipsis'],\n        )}\n      >\n        <div\n          className={classNames(\n            styles['ActionSheetItem__content'],\n            isCentered && styles['ActionSheetItem--centered'],\n          )}\n        >\n          <Text\n            weight={mode === 'cancel' ? '2' : undefined}\n            className={styles['ActionSheetItem__children']}\n          >\n            {children}\n          </Text>\n          {meta && <Text className={styles['ActionSheetItem__meta']}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles['ActionSheetItem__subtitle']}>{subtitle}</Subhead>}\n      </div>\n      {selectable && (\n        <div className={styles['ActionSheetItem__after']}>\n          <input\n            type=\"radio\"\n            className={styles['ActionSheetItem__radio']}\n            name={name}\n            value={value}\n            onChange={onChange}\n            onClick={onItemClick(noop, noop, Boolean(autoClose))}\n            defaultChecked={defaultChecked}\n            checked={checked}\n            disabled={restProps.disabled}\n          />\n          <div className={styles['ActionSheetItem__marker']}>{iconChecked}</div>\n        </div>\n      )}\n    </Tappable>\n  );\n};\n\nexport { ActionSheetItem };\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAA+C;AA+B/C;AACA;AACA;AACA,IAAMA,eAAe,GAAG,SAAlBA,eAAe,OAmBO;EAAA,IAlB1BC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IAAA,iBACTC,IAAI;IAAJA,IAAI,0BAAG,SAAS;IAChBC,IAAI,QAAJA,IAAI;IACJC,QAAQ,QAARA,QAAQ;IACRC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,KAAK,QAALA,KAAK;IACLC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACPC,cAAc,QAAdA,cAAc;IACdC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,gBAAgB,QAAhBA,gBAAgB;IAAA,sBAChBC,SAAS;IAATA,SAAS,+BAAG,KAAK;IACJC,eAAe,QAA5BC,WAAW;IACXC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,wBACEC,KAAK,CAACC,UAAU,CAAsCC,sCAAkB,CAAC;IAAA,0CADnEC,WAAW;IAAXA,WAAW,sCAAG;MAAA,OAAMC,UAAI;IAAA;IAAEC,SAAS,qBAATA,SAAS;EAE3C,4BAAkB,IAAAC,gEAA+B,GAAE;IAA3CC,KAAK,yBAALA,KAAK;EAEb,IAAMZ,WAAW,GACfD,eAAe,KACda,KAAK,KAAKC,oBAAQ,CAACC,OAAO,gBAAG,oBAAC,0BAAmB,OAAG,gBAAG,oBAAC,0BAAmB,OAAG,CAAC;EAElF,IAAIC,SAA4B,GAAGb,SAAS,CAACc,IAAI,GAAG,GAAG,GAAG,KAAK;EAE/D,IAAI1B,UAAU,EAAE;IACdyB,SAAS,GAAG,OAAO;EACrB;EAEA,IAAME,MAAM,GAAG7B,QAAQ,IAAID,IAAI,IAAIG,UAAU;EAC7C,IAAM4B,UAAU,GAAG,CAACD,MAAM,IAAI,CAAC5B,MAAM,IAAIc,QAAQ,KAAKgB,kBAAQ,CAACC,GAAG;EAElE,oBACE,oBAAC,kBAAQ;IACP,SAAS,EAAEL;EAAU,GACjBb,SAAS;IACb,OAAO,EAAEZ,UAAU,GAAGM,OAAO,GAAGY,WAAW,CAACZ,OAAO,EAAEC,gBAAgB,EAAEwB,OAAO,CAACpC,SAAS,CAAC,CAAE;IAC3F,UAAU,EAAEkB,QAAQ,KAAKgB,kBAAQ,CAACC,GAAG,mCAAuCE,SAAU;IACtF,SAAS,EAAE,IAAAC,gBAAU,yBAEnBpB,QAAQ,KAAKgB,kBAAQ,CAACC,GAAG,8BAAkC,EAC3DI,MAAM,iCAA0BtC,IAAI,EAAG,EACvC0B,KAAK,KAAKC,oBAAQ,CAACC,OAAO,wCAA4C,EACtEG,MAAM,+BAAmC,EACzCP,SAAS,kCAAsC,EAC/CT,SAAS;EACT,IAEDZ,MAAM,iBAAI;IAAK,SAAS;EAAoC,GAAEA,MAAM,CAAO,eAC5E;IACE,SAAS,EAAE,IAAAkC,gBAAU,oCAEnB,CAACzB,SAAS,mCAAuC;EACjD,gBAEF;IACE,SAAS,EAAE,IAAAyB,gBAAU,kCAEnBL,UAAU,mCAAuC;EACjD,gBAEF,oBAAC,UAAI;IACH,MAAM,EAAEhC,IAAI,KAAK,QAAQ,GAAG,GAAG,GAAGoC,SAAU;IAC5C,SAAS;EAAsC,GAE9CtC,QAAQ,CACJ,EACNG,IAAI,iBAAI,oBAAC,UAAI;IAAC,SAAS;EAAkC,GAAEA,IAAI,CAAQ,CACpE,EACLC,QAAQ,iBAAI,oBAAC,gBAAO;IAAC,SAAS;EAAsC,GAAEA,QAAQ,CAAW,CACtF,EACLE,UAAU,iBACT;IAAK,SAAS;EAAmC,gBAC/C;IACE,IAAI,EAAC,OAAO;IACZ,SAAS,8BAAmC;IAC5C,IAAI,EAAEE,IAAK;IACX,KAAK,EAAED,KAAM;IACb,QAAQ,EAAEI,QAAS;IACnB,OAAO,EAAEa,WAAW,CAACC,UAAI,EAAEA,UAAI,EAAEY,OAAO,CAACpC,SAAS,CAAC,CAAE;IACrD,cAAc,EAAES,cAAe;IAC/B,OAAO,EAAED,OAAQ;IACjB,QAAQ,EAAES,SAAS,CAACuB;EAAS,EAC7B,eACF;IAAK,SAAS;EAAoC,GAAEzB,WAAW,CAAO,CAEzE,CACQ;AAEf,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"sources":["../../../../src/components/ActionSheetItem/ActionSheetItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon20CheckCircleOn, Icon24CheckCircleOn } from '@vkontakte/icons';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { SizeType } from '../../lib/adaptivity';\nimport { Platform } from '../../lib/platform';\nimport { ActionSheetContext, type ActionSheetContextType } from '../ActionSheet/ActionSheetContext';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './ActionSheetItem.module.css';\n\nexport interface ActionSheetItemProps\n  extends React.HTMLAttributes<HTMLElement>,\n    React.AnchorHTMLAttributes<HTMLElement>,\n    Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'checked' | 'value'> {\n  mode?: 'default' | 'destructive' | 'cancel';\n  before?: React.ReactNode;\n  meta?: React.ReactNode;\n  subtitle?: React.ReactNode;\n  autoClose?: boolean;\n  selectable?: boolean;\n  disabled?: boolean;\n  /**\n   * Все текстовые элементы при необходимости занимают несколько строк\n   */\n  multiline?: boolean;\n  /**\n   * Если autoClose === true, onClick будет вызван после завершения анимации скрытия и после вызова onClose.\n   * Из этого следует, что в объекте события значения полей типа `currentTarget` будут не определены.\n   * Если вам нужен объект события именно на момент клика, используйте `onImmediateClick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  onImmediateClick?: React.MouseEventHandler<HTMLElement>;\n  /**\n   * Иконка для `checked` режима.\n   */\n  iconChecked?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ActionSheetItem\n */\nconst ActionSheetItem = ({\n  children,\n  autoClose,\n  mode = 'default',\n  meta,\n  subtitle,\n  before,\n  selectable,\n  value,\n  name,\n  checked,\n  defaultChecked,\n  onChange,\n  onClick,\n  onImmediateClick,\n  multiline = false,\n  iconChecked: iconCheckedProp,\n  className,\n  ...restProps\n}: ActionSheetItemProps) => {\n  const platform = usePlatform();\n  const { onItemClick = () => noop, isDesktop } =\n    React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);\n  const { sizeY } = useAdaptivityWithJSMediaQueries();\n\n  const iconChecked =\n    iconCheckedProp ||\n    (sizeY === SizeType.COMPACT ? <Icon20CheckCircleOn /> : <Icon24CheckCircleOn />);\n\n  let Component: React.ElementType = restProps.href ? 'a' : 'div';\n\n  if (selectable) {\n    Component = 'label';\n  }\n\n  const isRich = subtitle || meta || selectable;\n  const isCentered = !isRich && !before && platform === Platform.IOS;\n\n  return (\n    <Tappable\n      Component={Component}\n      {...restProps}\n      onClick={selectable ? onClick : onItemClick(onClick, onImmediateClick, Boolean(autoClose))}\n      activeMode={platform === Platform.IOS ? styles['ActionSheetItem--active'] : undefined}\n      className={classNames(\n        styles['ActionSheetItem'],\n        platform === Platform.IOS && styles['ActionSheetItem--ios'],\n        mode === 'cancel' && styles['ActionSheetItem--mode-cancel'],\n        mode === 'destructive' && styles['ActionSheetItem--mode-destructive'],\n        sizeY === SizeType.COMPACT && styles['ActionSheetItem--sizeY-compact'],\n        isRich && styles['ActionSheetItem--rich'],\n        isDesktop && styles['ActionSheetItem--desktop'],\n        className,\n      )}\n    >\n      {before && <div className={styles['ActionSheetItem__before']}>{before}</div>}\n      <div\n        className={classNames(\n          styles['ActionSheetItem__container'],\n          !multiline && styles['ActionSheetItem--ellipsis'],\n        )}\n      >\n        <div\n          className={classNames(\n            styles['ActionSheetItem__content'],\n            isCentered && styles['ActionSheetItem--centered'],\n          )}\n        >\n          <Text\n            weight={mode === 'cancel' ? '2' : undefined}\n            className={styles['ActionSheetItem__children']}\n          >\n            {children}\n          </Text>\n          {meta && <Text className={styles['ActionSheetItem__meta']}>{meta}</Text>}\n        </div>\n        {subtitle && <Subhead className={styles['ActionSheetItem__subtitle']}>{subtitle}</Subhead>}\n      </div>\n      {selectable && (\n        <div className={styles['ActionSheetItem__after']}>\n          <input\n            type=\"radio\"\n            className={styles['ActionSheetItem__radio']}\n            name={name}\n            value={value}\n            onChange={onChange}\n            onClick={onItemClick(noop, noop, Boolean(autoClose))}\n            defaultChecked={defaultChecked}\n            checked={checked}\n            disabled={restProps.disabled}\n          />\n          <div className={styles['ActionSheetItem__marker']}>{iconChecked}</div>\n        </div>\n      )}\n    </Tappable>\n  );\n};\n\nexport { ActionSheetItem };\n"],"names":["ActionSheetItem","children","autoClose","mode","meta","subtitle","before","selectable","value","name","checked","defaultChecked","onChange","onClick","onImmediateClick","multiline","iconChecked","iconCheckedProp","className","restProps","platform","usePlatform","React","useContext","ActionSheetContext","onItemClick","noop","isDesktop","sizeY","useAdaptivityWithJSMediaQueries","SizeType","COMPACT","Icon20CheckCircleOn","Icon24CheckCircleOn","Component","href","isRich","isCentered","Platform","IOS","Tappable","Boolean","activeMode","undefined","classNames","div","Text","weight","Subhead","input","type","disabled"],"mappings":";;;;+BA8ISA;;;eAAAA;;;;;;;2DA9Ic;qBACkC;oBACxB;+CACe;2BACpB;0BACH;wBACA;kCACuC;wBACvC;uBACD;oBACH;AA+BrB;;CAEC,GACD,IAAMA,kBAAkB,iBAmBI;QAlB1BC,kBAAAA,UACAC,mBAAAA,gCACAC,MAAAA,gCAAO,yBACPC,cAAAA,MACAC,kBAAAA,UACAC,gBAAAA,QACAC,oBAAAA,YACAC,eAAAA,OACAC,cAAAA,MACAC,iBAAAA,SACAC,wBAAAA,gBACAC,kBAAAA,UACAC,iBAAAA,SACAC,0BAAAA,4CACAC,WAAAA,0CAAY,KAAK,qBACjBC,AAAaC,yBAAbD,aACAE,mBAAAA,WACGC;QAjBHlB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;;IAGA,IAAME,WAAWC,IAAAA,wBAAW;IAC5B,IACEC,oBAAAA,OAAMC,UAAU,CAAsCC,sCAAkB,mCAAxEF,kBADMG,aAAAA,yDAAc;eAAMC,UAAI;uCAAEC,YAChCL,kBADgCK;IAElC,IAAM,AAAEC,QAAUC,IAAAA,gEAA+B,IAAzCD;IAER,IAAMZ,cACJC,mBACCW,CAAAA,UAAUE,oBAAQ,CAACC,OAAO,iBAAG,qBAACC,0BAAmB,wBAAM,qBAACC,0BAAmB,OAAG,AAAD;IAEhF,IAAIC,YAA+Bf,UAAUgB,IAAI,GAAG,MAAM,KAAK;IAE/D,IAAI5B,YAAY;QACd2B,YAAY;IACd,CAAC;IAED,IAAME,SAAS/B,YAAYD,QAAQG;IACnC,IAAM8B,aAAa,CAACD,UAAU,CAAC9B,UAAUc,aAAakB,kBAAQ,CAACC,GAAG;IAElE,qBACE,qBAACC,kBAAQ;QACPN,WAAWA;OACPf;QACJN,SAASN,aAAaM,UAAUY,YAAYZ,SAASC,kBAAkB2B,QAAQvC,WAAW;QAC1FwC,YAAYtB,aAAakB,kBAAQ,CAACC,GAAG,mCAAuCI,SAAS;QACrFzB,WAAW0B,IAAAA,gBAAU,yBAEnBxB,aAAakB,kBAAQ,CAACC,GAAG,gCACzBpC,SAAS,gDACTA,SAAS,0DACTyB,UAAUE,oBAAQ,CAACC,OAAO,0CAC1BK,uCACAT,6CACAT;QAGDZ,wBAAU,qBAACuC;QAAI3B,SAAS;OAAsCZ,uBAC/D,qBAACuC;QACC3B,WAAW0B,IAAAA,gBAAU,oCAEnB,CAAC7B;qBAGH,qBAAC8B;QACC3B,WAAW0B,IAAAA,gBAAU,kCAEnBP;qBAGF,qBAACS,UAAI;QACHC,QAAQ5C,SAAS,WAAW,MAAMwC,SAAS;QAC3CzB,SAAS;OAERjB,WAEFG,sBAAQ,qBAAC0C,UAAI;QAAC5B,SAAS;OAAoCd,QAE7DC,0BAAY,qBAAC2C,gBAAO;QAAC9B,SAAS;OAAwCb,YAExEE,4BACC,qBAACsC;QAAI3B,SAAS;qBACZ,qBAAC+B;QACCC,MAAK;QACLhC,SAAS;QACTT,MAAMA;QACND,OAAOA;QACPI,UAAUA;QACVC,SAASY,YAAYC,UAAI,EAAEA,UAAI,EAAEe,QAAQvC;QACzCS,gBAAgBA;QAChBD,SAASA;QACTyC,UAAUhC,UAAUgC,QAAQ;sBAE9B,qBAACN;QAAI3B,SAAS;OAAsCF;AAK9D"}

package/dist/cjs/components/AdaptivityProvider/AdaptivityContext.js

@@ -1,11 +1,15 @@
 "use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "AdaptivityContext", {
+    enumerable: true,
+    get: function() {
+        return AdaptivityContext;
+    }
 });
-exports.AdaptivityContext = void 0;
-var React = _interopRequireWildcard(require("react"));
-var AdaptivityContext = /*#__PURE__*/React.createContext({});
-exports.AdaptivityContext = AdaptivityContext;
+var _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+var AdaptivityContext = /*#__PURE__*/ _react.createContext({});
+
 //# sourceMappingURL=AdaptivityContext.js.map

package/dist/cjs/components/AdaptivityProvider/AdaptivityContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdaptivityContext.js","names":["AdaptivityContext","React","createContext"],"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeType, ViewHeight, ViewWidth } from '../../lib/adaptivity';\n\nexport interface SizeProps {\n  sizeX?: SizeType;\n  sizeY?: SizeType;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidth;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeight;\n  /**\n   * @ignore\n   */\n  hasPointer?: boolean;\n  /**\n   * @ignore\n   */\n  hasHover?: boolean;\n}\n\nexport const AdaptivityContext = React.createContext<AdaptivityProps>({});\n"],"mappings":";;;;;;;AAAA;AA2BO,IAAMA,iBAAiB,gBAAGC,KAAK,CAACC,aAAa,CAAkB,CAAC,CAAC,CAAC;AAAC"}
+{"version":3,"sources":["../../../../src/components/AdaptivityProvider/AdaptivityContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SizeType, ViewHeight, ViewWidth } from '../../lib/adaptivity';\n\nexport interface SizeProps {\n  sizeX?: SizeType;\n  sizeY?: SizeType;\n}\n\nexport interface AdaptivityProps extends SizeProps {\n  /**\n   * @ignore\n   */\n  viewWidth?: ViewWidth;\n  /**\n   * @ignore\n   */\n  viewHeight?: ViewHeight;\n  /**\n   * @ignore\n   */\n  hasPointer?: boolean;\n  /**\n   * @ignore\n   */\n  hasHover?: boolean;\n}\n\nexport const AdaptivityContext = React.createContext<AdaptivityProps>({});\n"],"names":["AdaptivityContext","React","createContext"],"mappings":";;;;+BA2BaA;;;eAAAA;;;;2DA3BU;AA2BhB,IAAMA,kCAAoBC,OAAMC,aAAa,CAAkB,CAAC"}