@vkontakte/vkui 5.2.4 → 5.3.0

package/dist/cjs/components/ImageBase/validators.js

@@ -1,12 +1,27 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    validateFallbackIcon: function() {
+        return validateFallbackIcon;
+    },
+    validateSize: function() {
+        return validateSize;
+    },
+    validateBadgeIcon: function() {
+        return validateBadgeIcon;
+    },
+    validateOverlayIcon: function() {
+        return validateOverlayIcon;
+    }
 });
-exports.validateBadgeIcon = validateBadgeIcon;
-exports.validateFallbackIcon = validateFallbackIcon;
-exports.validateOverlayIcon = validateOverlayIcon;
-exports.validateSize = validateSize;
 var _warnOnce = require("../../lib/warnOnce");
 var _helpers = require("./helpers");
 var _types = require("./types");
@@ -16,75 +31,75 @@ var _types = require("./types");
  * Icon28User -> 28
  * Icon12Circle1 -> 12
  * Icon12Circle2 -> 12
- */
-function parseIconSizeByDisplayName(displayName) {
-  if (typeof displayName !== 'string') {
-    return null;
-  }
-  var rawSize = displayName.replace(/\d+$/g, '') // удаляем цифры в конце
-  .replace(/\D/g, ''); // удаляем всё, что не является числом
-  var size = Number(rawSize);
-  return size > 0 ? size : null;
+ */ function parseIconSizeByDisplayName(displayName) {
+    if (typeof displayName !== "string") {
+        return null;
+    }
+    var rawSize = displayName.replace(/\d+$/g, "") // удаляем цифры в конце
+    .replace(/\D/g, ""); // удаляем всё, что не является числом
+    var size = Number(rawSize);
+    return size > 0 ? size : null;
 }
 function parseIconSizeByWidthProp(width) {
-  if (typeof width !== 'string' && typeof width !== 'number') {
-    return null;
-  }
-  var size = Number(width);
-  return size > 0 ? size : null;
+    if (typeof width !== "string" && typeof width !== "number") {
+        return null;
+    }
+    var size = Number(width);
+    return size > 0 ? size : null;
 }
 function getElementDisplayName(element) {
-  var _element$type$display;
-  return (_element$type$display = element.type.displayName) !== null && _element$type$display !== void 0 ? _element$type$display : null;
+    var _element_type_displayName;
+    return (_element_type_displayName = element.type.displayName) !== null && _element_type_displayName !== void 0 ? _element_type_displayName : null;
 }
 function getElementWidthProp(element) {
-  var _element$props$width;
-  return (_element$props$width = element.props.width) !== null && _element$props$width !== void 0 ? _element$props$width : null;
+    var _element_props_width;
+    return (_element_props_width = element.props.width) !== null && _element_props_width !== void 0 ? _element_props_width : null;
 }
 function getIconSizeByElement(element) {
-  var sizeByDisplayName = parseIconSizeByDisplayName(getElementDisplayName(element));
-  var sizeByWidth = parseIconSizeByWidthProp(getElementWidthProp(element));
-  return sizeByWidth ? sizeByWidth : sizeByDisplayName;
+    var sizeByDisplayName = parseIconSizeByDisplayName(getElementDisplayName(element));
+    var sizeByWidth = parseIconSizeByWidthProp(getElementWidthProp(element));
+    return sizeByWidth ? sizeByWidth : sizeByDisplayName;
 }
 function validateIconComponentSizeByImageSize(imageSize, iconProp, selectorFn, logger) {
-  var iconSize = getIconSizeByElement(iconProp.value);
-  if (iconSize === null) {
-    return;
-  }
-  var result = selectorFn(imageSize);
-  if (result === iconSize || result === selectorFn.MAX_SIZE && iconSize >= result) {
-    return;
-  }
-  var iconName = getElementDisplayName(iconProp.value);
-  var propMessage = iconName ? "".concat(iconProp.name, "={<").concat(iconName, " />}") : iconProp.name;
-  logger("\u0420\u0430\u0437\u043C\u0435\u0440 `".concat(propMessage, "` \u043D\u0435 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0438\u0437\u0430\u0439\u043D-\u0441\u0438\u0441\u0442\u0435\u043C\u0435. \u0414\u043B\u044F `size={").concat(imageSize, "}` \u0440\u0430\u0437\u043C\u0435\u0440 \u0438\u043A\u043E\u043D\u043A\u0438 \u0434\u043B\u044F `").concat(iconProp.name, "` \u0434\u043E\u043B\u0436\u0435\u043D \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043E\u0432\u0430\u0442\u044C <Icon").concat(result, "<name> />. \u0415\u0441\u043B\u0438 \u0442\u0430\u043A\u043E\u0433\u043E \u0440\u0430\u0437\u043C\u0435\u0440\u0430 \u043D\u0435\u0442, \u0442\u043E \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 <").concat(iconName, " width={").concat(result, "} height={").concat(result, "} />"), 'log');
+    var iconSize = getIconSizeByElement(iconProp.value);
+    if (iconSize === null) {
+        return;
+    }
+    var result = selectorFn(imageSize);
+    if (result === iconSize || result === selectorFn.MAX_SIZE && iconSize >= result) {
+        return;
+    }
+    var iconName = getElementDisplayName(iconProp.value);
+    var propMessage = iconName ? "".concat(iconProp.name, "={<").concat(iconName, " />}") : iconProp.name;
+    logger("Размер `".concat(propMessage, "` не соответствует дизайн-системе. Для `size={").concat(imageSize, "}` размер иконки для `").concat(iconProp.name, "` должен соответствовать <Icon").concat(result, "<name> />. Если такого размера нет, то используйте <").concat(iconName, " width={").concat(result, "} height={").concat(result, "} />"), "log");
 }
-var warnImageBase = (0, _warnOnce.warnOnce)('ImageBase');
+var warnImageBase = (0, _warnOnce.warnOnce)("ImageBase");
 function validateFallbackIcon(imageSize, iconProp) {
-  return validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getFallbackIconSizeByImageBaseSize, warnImageBase);
+    return validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getFallbackIconSizeByImageBaseSize, warnImageBase);
 }
 var mapOfExpectedSize = new Set(_types.imageBaseSizes);
-var arrayOfSizes = Object.keys(mapOfExpectedSize).map(function (str) {
-  return Number(str);
+var arrayOfSizes = Object.keys(mapOfExpectedSize).map(function(str) {
+    return Number(str);
 });
-var maxSize = arrayOfSizes.reduce(function (maxSize, size) {
-  return size > maxSize ? size : maxSize;
+var maxSize = arrayOfSizes.reduce(function(maxSize, size) {
+    return size > maxSize ? size : maxSize;
 }, 0);
 function validateSize(imageSize) {
-  if (imageSize > maxSize || mapOfExpectedSize.has(imageSize)) {
-    return;
-  }
-  warnImageBase("`size={".concat(imageSize, "}` \u043D\u0435 \u0441\u043E\u043E\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0438\u0437\u0430\u0439\u043D-\u0441\u0438\u0441\u0442\u0435\u043C\u0435. \u041F\u043E\u0436\u0430\u043B\u0443\u0439\u0441\u0442\u0430, \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 \u043E\u0434\u0438\u043D \u0438\u0437 \u0441\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043D\u0442\u043E\u0432: ").concat(arrayOfSizes.join(' | ')), 'log');
+    if (imageSize > maxSize || mapOfExpectedSize.has(imageSize)) {
+        return;
+    }
+    warnImageBase("`size={".concat(imageSize, "}` не соответствует дизайн-системе. Пожалуйста, используйте один из следующих вариантов: ").concat(arrayOfSizes.join(" | ")), "log");
 }
-var warnImageBaseBadge = (0, _warnOnce.warnOnce)('ImageBase.Badge');
+var warnImageBaseBadge = (0, _warnOnce.warnOnce)("ImageBase.Badge");
 function validateBadgeIcon(imageSize, iconProp) {
-  if (imageSize < 24 && iconProp) {
-    return warnImageBaseBadge('Не используйте бейдж при `size < 24`.', 'log');
-  }
-  validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getBadgeIconSizeByImageBaseSize, warnImageBaseBadge);
+    if (imageSize < 24 && iconProp) {
+        return warnImageBaseBadge("Не используйте бейдж при `size < 24`.", "log");
+    }
+    validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getBadgeIconSizeByImageBaseSize, warnImageBaseBadge);
 }
-var warnImageBaseOverlay = (0, _warnOnce.warnOnce)('ImageBase.Overlay');
+var warnImageBaseOverlay = (0, _warnOnce.warnOnce)("ImageBase.Overlay");
 function validateOverlayIcon(imageSize, iconProp) {
-  validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getOverlayIconSizeByImageBaseSize, warnImageBaseOverlay);
+    validateIconComponentSizeByImageSize(imageSize, iconProp, _helpers.getOverlayIconSizeByImageBaseSize, warnImageBaseOverlay);
 }
+
 //# sourceMappingURL=validators.js.map

package/dist/cjs/components/ImageBase/validators.js.map

@@ -1 +1 @@
-{"version":3,"file":"validators.js","names":["parseIconSizeByDisplayName","displayName","rawSize","replace","size","Number","parseIconSizeByWidthProp","width","getElementDisplayName","element","type","getElementWidthProp","props","getIconSizeByElement","sizeByDisplayName","sizeByWidth","validateIconComponentSizeByImageSize","imageSize","iconProp","selectorFn","logger","iconSize","value","result","MAX_SIZE","iconName","propMessage","name","warnImageBase","warnOnce","validateFallbackIcon","getFallbackIconSizeByImageBaseSize","mapOfExpectedSize","Set","imageBaseSizes","arrayOfSizes","Object","keys","map","str","maxSize","reduce","validateSize","has","join","warnImageBaseBadge","validateBadgeIcon","getBadgeIconSizeByImageBaseSize","warnImageBaseOverlay","validateOverlayIcon","getOverlayIconSizeByImageBaseSize"],"sources":["../../../../src/components/ImageBase/validators.ts"],"sourcesContent":["import { warnOnce } from '../../lib/warnOnce';\nimport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\nimport { imageBaseSizes } from './types';\n\n/**\n * Пример,\n *\n * Icon28User -> 28\n * Icon12Circle1 -> 12\n * Icon12Circle2 -> 12\n */\nfunction parseIconSizeByDisplayName(displayName: unknown): number | null {\n  if (typeof displayName !== 'string') {\n    return null;\n  }\n  const rawSize = displayName\n    .replace(/\\d+$/g, '') // удаляем цифры в конце\n    .replace(/\\D/g, ''); // удаляем всё, что не является числом\n  const size = Number(rawSize);\n  return size > 0 ? size : null;\n}\n\nfunction parseIconSizeByWidthProp(width: unknown): number | null {\n  if (typeof width !== 'string' && typeof width !== 'number') {\n    return null;\n  }\n  const size = Number(width);\n  return size > 0 ? size : null;\n}\n\nfunction getElementDisplayName(element: JSX.Element): string | null {\n  return element.type.displayName ?? null;\n}\n\nfunction getElementWidthProp(element: JSX.Element): number | string | null {\n  return element.props.width ?? null;\n}\n\nfunction getIconSizeByElement(element: JSX.Element): number | null {\n  const sizeByDisplayName = parseIconSizeByDisplayName(getElementDisplayName(element));\n  const sizeByWidth = parseIconSizeByWidthProp(getElementWidthProp(element));\n  return sizeByWidth ? sizeByWidth : sizeByDisplayName;\n}\n\ninterface IconProp {\n  name: string;\n  value: JSX.Element;\n}\n\ninterface SelectorFn {\n  (imageSize: number): number;\n  MAX_SIZE: number;\n}\n\nfunction validateIconComponentSizeByImageSize(\n  imageSize: number,\n  iconProp: IconProp,\n  selectorFn: SelectorFn,\n  logger: ReturnType<typeof warnOnce>,\n) {\n  const iconSize = getIconSizeByElement(iconProp.value);\n\n  if (iconSize === null) {\n    return;\n  }\n\n  const result = selectorFn(imageSize);\n\n  if (result === iconSize || (result === selectorFn.MAX_SIZE && iconSize >= result)) {\n    return;\n  }\n\n  const iconName = getElementDisplayName(iconProp.value);\n  const propMessage = iconName ? `${iconProp.name}={<${iconName} />}` : iconProp.name;\n\n  logger(\n    `Размер \\`${propMessage}\\` не соответствует дизайн-системе. Для \\`size={${imageSize}}\\` размер иконки для \\`${iconProp.name}\\` должен соответствовать <Icon${result}<name> />. Если такого размера нет, то используйте <${iconName} width={${result}} height={${result}} />`,\n    'log',\n  );\n}\n\nconst warnImageBase = warnOnce('ImageBase');\n\nexport function validateFallbackIcon(imageSize: number, iconProp: IconProp) {\n  return validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getFallbackIconSizeByImageBaseSize,\n    warnImageBase,\n  );\n}\n\nconst mapOfExpectedSize = new Set<number>(imageBaseSizes);\n\nconst arrayOfSizes = Object.keys(mapOfExpectedSize).map((str) => Number(str));\nconst maxSize = arrayOfSizes.reduce((maxSize, size) => (size > maxSize ? size : maxSize), 0);\n\nexport function validateSize(imageSize: number): void {\n  if (imageSize > maxSize || mapOfExpectedSize.has(imageSize)) {\n    return;\n  }\n  warnImageBase(\n    `\\`size={${imageSize}}\\` не соответствует дизайн-системе. Пожалуйста, используйте один из следующих вариантов: ${arrayOfSizes.join(\n      ' | ',\n    )}`,\n    'log',\n  );\n}\n\nconst warnImageBaseBadge = warnOnce('ImageBase.Badge');\n\nexport function validateBadgeIcon(imageSize: number, iconProp: IconProp): void {\n  if (imageSize < 24 && iconProp) {\n    return warnImageBaseBadge('Не используйте бейдж при `size < 24`.', 'log');\n  }\n  validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getBadgeIconSizeByImageBaseSize,\n    warnImageBaseBadge,\n  );\n}\n\nconst warnImageBaseOverlay = warnOnce('ImageBase.Overlay');\n\nexport function validateOverlayIcon(imageSize: number, iconProp: IconProp): void {\n  validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getOverlayIconSizeByImageBaseSize,\n    warnImageBaseOverlay,\n  );\n}\n"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ImageBase/validators.ts"],"sourcesContent":["import { warnOnce } from '../../lib/warnOnce';\nimport {\n  getBadgeIconSizeByImageBaseSize,\n  getFallbackIconSizeByImageBaseSize,\n  getOverlayIconSizeByImageBaseSize,\n} from './helpers';\nimport { imageBaseSizes } from './types';\n\n/**\n * Пример,\n *\n * Icon28User -> 28\n * Icon12Circle1 -> 12\n * Icon12Circle2 -> 12\n */\nfunction parseIconSizeByDisplayName(displayName: unknown): number | null {\n  if (typeof displayName !== 'string') {\n    return null;\n  }\n  const rawSize = displayName\n    .replace(/\\d+$/g, '') // удаляем цифры в конце\n    .replace(/\\D/g, ''); // удаляем всё, что не является числом\n  const size = Number(rawSize);\n  return size > 0 ? size : null;\n}\n\nfunction parseIconSizeByWidthProp(width: unknown): number | null {\n  if (typeof width !== 'string' && typeof width !== 'number') {\n    return null;\n  }\n  const size = Number(width);\n  return size > 0 ? size : null;\n}\n\nfunction getElementDisplayName(element: JSX.Element): string | null {\n  return element.type.displayName ?? null;\n}\n\nfunction getElementWidthProp(element: JSX.Element): number | string | null {\n  return element.props.width ?? null;\n}\n\nfunction getIconSizeByElement(element: JSX.Element): number | null {\n  const sizeByDisplayName = parseIconSizeByDisplayName(getElementDisplayName(element));\n  const sizeByWidth = parseIconSizeByWidthProp(getElementWidthProp(element));\n  return sizeByWidth ? sizeByWidth : sizeByDisplayName;\n}\n\ninterface IconProp {\n  name: string;\n  value: JSX.Element;\n}\n\ninterface SelectorFn {\n  (imageSize: number): number;\n  MAX_SIZE: number;\n}\n\nfunction validateIconComponentSizeByImageSize(\n  imageSize: number,\n  iconProp: IconProp,\n  selectorFn: SelectorFn,\n  logger: ReturnType<typeof warnOnce>,\n) {\n  const iconSize = getIconSizeByElement(iconProp.value);\n\n  if (iconSize === null) {\n    return;\n  }\n\n  const result = selectorFn(imageSize);\n\n  if (result === iconSize || (result === selectorFn.MAX_SIZE && iconSize >= result)) {\n    return;\n  }\n\n  const iconName = getElementDisplayName(iconProp.value);\n  const propMessage = iconName ? `${iconProp.name}={<${iconName} />}` : iconProp.name;\n\n  logger(\n    `Размер \\`${propMessage}\\` не соответствует дизайн-системе. Для \\`size={${imageSize}}\\` размер иконки для \\`${iconProp.name}\\` должен соответствовать <Icon${result}<name> />. Если такого размера нет, то используйте <${iconName} width={${result}} height={${result}} />`,\n    'log',\n  );\n}\n\nconst warnImageBase = warnOnce('ImageBase');\n\nexport function validateFallbackIcon(imageSize: number, iconProp: IconProp) {\n  return validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getFallbackIconSizeByImageBaseSize,\n    warnImageBase,\n  );\n}\n\nconst mapOfExpectedSize = new Set<number>(imageBaseSizes);\n\nconst arrayOfSizes = Object.keys(mapOfExpectedSize).map((str) => Number(str));\nconst maxSize = arrayOfSizes.reduce((maxSize, size) => (size > maxSize ? size : maxSize), 0);\n\nexport function validateSize(imageSize: number): void {\n  if (imageSize > maxSize || mapOfExpectedSize.has(imageSize)) {\n    return;\n  }\n  warnImageBase(\n    `\\`size={${imageSize}}\\` не соответствует дизайн-системе. Пожалуйста, используйте один из следующих вариантов: ${arrayOfSizes.join(\n      ' | ',\n    )}`,\n    'log',\n  );\n}\n\nconst warnImageBaseBadge = warnOnce('ImageBase.Badge');\n\nexport function validateBadgeIcon(imageSize: number, iconProp: IconProp): void {\n  if (imageSize < 24 && iconProp) {\n    return warnImageBaseBadge('Не используйте бейдж при `size < 24`.', 'log');\n  }\n  validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getBadgeIconSizeByImageBaseSize,\n    warnImageBaseBadge,\n  );\n}\n\nconst warnImageBaseOverlay = warnOnce('ImageBase.Overlay');\n\nexport function validateOverlayIcon(imageSize: number, iconProp: IconProp): void {\n  validateIconComponentSizeByImageSize(\n    imageSize,\n    iconProp,\n    getOverlayIconSizeByImageBaseSize,\n    warnImageBaseOverlay,\n  );\n}\n"],"names":["validateFallbackIcon","validateSize","validateBadgeIcon","validateOverlayIcon","parseIconSizeByDisplayName","displayName","rawSize","replace","size","Number","parseIconSizeByWidthProp","width","getElementDisplayName","element","type","getElementWidthProp","props","getIconSizeByElement","sizeByDisplayName","sizeByWidth","validateIconComponentSizeByImageSize","imageSize","iconProp","selectorFn","logger","iconSize","value","result","MAX_SIZE","iconName","propMessage","name","warnImageBase","warnOnce","getFallbackIconSizeByImageBaseSize","mapOfExpectedSize","Set","imageBaseSizes","arrayOfSizes","Object","keys","map","str","maxSize","reduce","has","join","warnImageBaseBadge","getBadgeIconSizeByImageBaseSize","warnImageBaseOverlay","getOverlayIconSizeByImageBaseSize"],"mappings":"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"}

package/dist/cjs/components/InfoRow/InfoRow.js

@@ -1,34 +1,35 @@
 "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, "InfoRow", {
+    enumerable: true,
+    get: function() {
+        return InfoRow;
+    }
 });
-exports.InfoRow = 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 _Headline = require("../Typography/Headline/Headline");
-var _Subhead = require("../Typography/Subhead/Subhead");
-var _excluded = ["header", "children", "className"];
-/**
- * @see https://vkcom.github.io/VKUI/#/InfoRow
- */
-var InfoRow = function InfoRow(_ref) {
-  var header = _ref.header,
-    children = _ref.children,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(_Headline.Headline, (0, _extends2.default)({}, restProps, {
-    Component: "span",
-    className: (0, _vkjs.classNames)("vkuiInfoRow", className),
-    weight: "3"
-  }), (0, _vkjs.hasReactNode)(header) && /*#__PURE__*/React.createElement(_Subhead.Subhead, {
-    Component: "span",
-    className: "vkuiInfoRow__header"
-  }, header), children);
+var _headline = require("../Typography/Headline/Headline");
+var _subhead = require("../Typography/Subhead/Subhead");
+var InfoRow = function(_param) /*#__PURE__*/ {
+    var header = _param.header, children = _param.children, className = _param.className, restProps = _objectWithoutProperties(_param, [
+        "header",
+        "children",
+        "className"
+    ]);
+    return _react.createElement(_headline.Headline, _objectSpreadProps(_objectSpread({}, restProps), {
+        Component: "span",
+        className: (0, _vkjs.classNames)("vkuiInfoRow", className),
+        weight: "3"
+    }), (0, _vkjs.hasReactNode)(header) && /*#__PURE__*/ _react.createElement(_subhead.Subhead, {
+        Component: "span",
+        className: "vkuiInfoRow__header"
+    }, header), children);
 };
-exports.InfoRow = InfoRow;
+
 //# sourceMappingURL=InfoRow.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"InfoRow.js","names":["InfoRow","header","children","className","restProps","classNames","hasReactNode"],"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './InfoRow.module.css';\n\nexport interface InfoRowProps extends React.HTMLAttributes<HTMLDivElement> {\n  header: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/InfoRow\n */\nexport const InfoRow = ({ header, children, className, ...restProps }: InfoRowProps) => (\n  <Headline\n    {...restProps}\n    Component=\"span\"\n    className={classNames(styles['InfoRow'], className)}\n    weight=\"3\"\n  >\n    {hasReactNode(header) && (\n      <Subhead Component=\"span\" className={styles['InfoRow__header']}>\n        {header}\n      </Subhead>\n    )}\n    {children}\n  </Headline>\n);\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AAAwD;AAOxD;AACA;AACA;AACO,IAAMA,OAAO,GAAG,SAAVA,OAAO;EAAA,IAAMC,MAAM,QAANA,MAAM;IAAEC,QAAQ,QAARA,QAAQ;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EAAA,oBACjE,oBAAC,kBAAQ,6BACHA,SAAS;IACb,SAAS,EAAC,MAAM;IAChB,SAAS,EAAE,IAAAC,gBAAU,iBAAoBF,SAAS,CAAE;IACpD,MAAM,EAAC;EAAG,IAET,IAAAG,kBAAY,EAACL,MAAM,CAAC,iBACnB,oBAAC,gBAAO;IAAC,SAAS,EAAC,MAAM;IAAC,SAAS;EAA4B,GAC5DA,MAAM,CAEV,EACAC,QAAQ,CACA;AAAA,CACZ;AAAC"}
+{"version":3,"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './InfoRow.module.css';\n\nexport interface InfoRowProps extends React.HTMLAttributes<HTMLDivElement> {\n  header: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/InfoRow\n */\nexport const InfoRow = ({ header, children, className, ...restProps }: InfoRowProps) => (\n  <Headline\n    {...restProps}\n    Component=\"span\"\n    className={classNames(styles['InfoRow'], className)}\n    weight=\"3\"\n  >\n    {hasReactNode(header) && (\n      <Subhead Component=\"span\" className={styles['InfoRow__header']}>\n        {header}\n      </Subhead>\n    )}\n    {children}\n  </Headline>\n);\n"],"names":["InfoRow","header","children","className","restProps","Headline","Component","classNames","weight","hasReactNode","Subhead"],"mappings":";;;;+BAaaA;;;eAAAA;;;;;;;2DAbU;oBACkB;wBAChB;uBACD;AAUjB,IAAMA,UAAU,+BACrB;QADwBC,gBAAAA,QAAQC,kBAAAA,UAAUC,mBAAAA,WAAcC;QAAhCH;QAAQC;QAAUC;;WAC1C,qBAACE,kBAAQ,uCACHD;QACJE,WAAU;QACVH,WAAWI,IAAAA,gBAAU,iBAAoBJ;QACzCK,QAAO;QAENC,IAAAA,kBAAY,EAACR,yBACZ,qBAACS,gBAAO;QAACJ,WAAU;QAAOH,SAAS;OAChCF,SAGJC;AACO"}

package/dist/cjs/components/Input/Input.js

@@ -1,57 +1,54 @@
 "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, "Input", {
+    enumerable: true,
+    get: function() {
+        return Input;
+    }
 });
-exports.Input = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var React = _interopRequireWildcard(require("react"));
+var _defineProperty = require("@swc/helpers/lib/_define_property.js").default;
+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 _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _useAdaptivity = require("../../hooks/useAdaptivity");
 var _adaptivity = require("../../lib/adaptivity");
-var _FormField = require("../FormField/FormField");
-var _excluded = ["type", "align", "getRef", "className", "getRootRef", "style", "before", "after", "status", "mode"];
-var sizeYClassNames = (0, _defineProperty2.default)({
-  none: "vkuiInput--sizeY-none"
+var _formField = require("../FormField/FormField");
+var sizeYClassNames = _defineProperty({
+    none: "vkuiInput--sizeY-none"
 }, _adaptivity.SizeType.COMPACT, "vkuiInput--sizeY-compact");
-/**
- * @see https://vkcom.github.io/VKUI/#/Input
- */
-var Input = function Input(_ref) {
-  var _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'text' : _ref$type,
-    _ref$align = _ref.align,
-    align = _ref$align === void 0 ? 'left' : _ref$align,
-    getRef = _ref.getRef,
-    className = _ref.className,
-    getRootRef = _ref.getRootRef,
-    style = _ref.style,
-    before = _ref.before,
-    after = _ref.after,
-    status = _ref.status,
-    mode = _ref.mode,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
-    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
-  return /*#__PURE__*/React.createElement(_FormField.FormField, {
-    style: style,
-    className: (0, _vkjs.classNames)("vkuiInput", align === 'right' && "vkuiInput--align-right", align === 'center' && "vkuiInput--align-center", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], before && "vkuiInput--hasBefore", after && "vkuiInput--hasAfter", className),
-    getRootRef: getRootRef,
-    before: before,
-    after: after,
-    disabled: restProps.disabled,
-    mode: mode,
-    status: status
-  }, /*#__PURE__*/React.createElement("input", (0, _extends2.default)({}, restProps, {
-    type: type,
-    className: "vkuiInput__el",
-    ref: getRef
-  })));
+var Input = function(_param) {
+    var _param_type = _param.type, type = _param_type === void 0 ? "text" : _param_type, _param_align = _param.align, align = _param_align === void 0 ? "left" : _param_align, getRef = _param.getRef, className = _param.className, getRootRef = _param.getRootRef, style = _param.style, before = _param.before, after = _param.after, status = _param.status, mode = _param.mode, restProps = _objectWithoutProperties(_param, [
+        "type",
+        "align",
+        "getRef",
+        "className",
+        "getRootRef",
+        "style",
+        "before",
+        "after",
+        "status",
+        "mode"
+    ]);
+    var _useAdaptivity1 = (0, _useAdaptivity.useAdaptivity)(), _useAdaptivity_sizeY = _useAdaptivity1.sizeY, sizeY = _useAdaptivity_sizeY === void 0 ? "none" : _useAdaptivity_sizeY;
+    return /*#__PURE__*/ _react.createElement(_formField.FormField, {
+        style: style,
+        className: (0, _vkjs.classNames)("vkuiInput", align === "right" && "vkuiInput--align-right", align === "center" && "vkuiInput--align-center", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], before && "vkuiInput--hasBefore", after && "vkuiInput--hasAfter", className),
+        getRootRef: getRootRef,
+        before: before,
+        after: after,
+        disabled: restProps.disabled,
+        mode: mode,
+        status: status
+    }, /*#__PURE__*/ _react.createElement("input", _objectSpreadProps(_objectSpread({}, restProps), {
+        type: type,
+        className: "vkuiInput__el",
+        ref: getRef
+    })));
 };
-exports.Input = Input;
+
 //# sourceMappingURL=Input.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":["sizeYClassNames","none","SizeType","COMPACT","Input","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","useAdaptivity","sizeY","classNames","REGULAR","disabled"],"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  [SizeType.COMPACT]: styles['Input--sizeY-compact'],\n};\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Input\n */\nexport const Input = ({\n  type = 'text',\n  align = 'left',\n  getRef,\n  className,\n  getRootRef,\n  style,\n  before,\n  after,\n  status,\n  mode,\n  ...restProps\n}: InputProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(\n        styles['Input'],\n        align === 'right' && styles['Input--align-right'],\n        align === 'center' && styles['Input--align-center'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        before && styles['Input--hasBefore'],\n        after && styles['Input--hasAfter'],\n        className,\n      )}\n      getRootRef={getRootRef}\n      before={before}\n      after={after}\n      disabled={restProps.disabled}\n      mode={mode}\n      status={status}\n    >\n      <input {...restProps} type={type} className={styles['Input__el']} ref={getRef} />\n    </FormField>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AAAmE;AAGnE,IAAMA,eAAe;EACnBC,IAAI;AAA6B,GAChCC,oBAAQ,CAACC,OAAO,6BAClB;AASD;AACA;AACA;AACO,IAAMC,KAAK,GAAG,SAARA,KAAK,OAYA;EAAA,qBAXhBC,IAAI;IAAJA,IAAI,0BAAG,MAAM;IAAA,kBACbC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACVC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACDC,SAAS;EAEZ,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE,oBAAC,oBAAS;IACR,KAAK,EAAEP,KAAM;IACb,SAAS,EAAE,IAAAQ,gBAAU,eAEnBZ,KAAK,KAAK,OAAO,4BAAgC,EACjDA,KAAK,KAAK,QAAQ,6BAAiC,EACnDW,KAAK,KAAKf,oBAAQ,CAACiB,OAAO,IAAInB,eAAe,CAACiB,KAAK,CAAC,EACpDN,MAAM,0BAA8B,EACpCC,KAAK,yBAA6B,EAClCJ,SAAS,CACT;IACF,UAAU,EAAEC,UAAW;IACvB,MAAM,EAAEE,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,QAAQ,EAAEG,SAAS,CAACK,QAAS;IAC7B,IAAI,EAAEN,IAAK;IACX,MAAM,EAAED;EAAO,gBAEf,wDAAWE,SAAS;IAAE,IAAI,EAAEV,IAAK;IAAC,SAAS,iBAAsB;IAAC,GAAG,EAAEE;EAAO,GAAG,CACvE;AAEhB,CAAC;AAAC"}
+{"version":3,"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { SizeType } from '../../lib/adaptivity';\nimport { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  [SizeType.COMPACT]: styles['Input--sizeY-compact'],\n};\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLDivElement>,\n    HasAlign,\n    FormFieldProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Input\n */\nexport const Input = ({\n  type = 'text',\n  align = 'left',\n  getRef,\n  className,\n  getRootRef,\n  style,\n  before,\n  after,\n  status,\n  mode,\n  ...restProps\n}: InputProps) => {\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(\n        styles['Input'],\n        align === 'right' && styles['Input--align-right'],\n        align === 'center' && styles['Input--align-center'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        before && styles['Input--hasBefore'],\n        after && styles['Input--hasAfter'],\n        className,\n      )}\n      getRootRef={getRootRef}\n      before={before}\n      after={after}\n      disabled={restProps.disabled}\n      mode={mode}\n      status={status}\n    >\n      <input {...restProps} type={type} className={styles['Input__el']} ref={getRef} />\n    </FormField>\n  );\n};\n"],"names":["Input","sizeYClassNames","none","SizeType","COMPACT","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","useAdaptivity","sizeY","FormField","classNames","REGULAR","disabled","input","ref"],"mappings":";;;;+BAuBaA;;;eAAAA;;;;;;;;2DAvBU;oBACI;6BACG;0BACL;yBAEiB;AAG1C,IAAMC;IACJC,IAAI;GACHC,oBAAQ,CAACC,OAAO;AAaZ,IAAMJ,QAAQ,iBAYH;6BAXhBK,MAAAA,gCAAO,4CACPC,OAAAA,kCAAQ,uBACRC,gBAAAA,QACAC,mBAAAA,WACAC,oBAAAA,YACAC,eAAAA,OACAC,gBAAAA,QACAC,eAAAA,OACAC,gBAAAA,QACAC,cAAAA,MACGC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,IAA2BE,kBAAAA,IAAAA,4BAAa,4BAAbA,gBAAnBC,OAAAA,0CAAQ;IAEhB,qBACE,qBAACC,oBAAS;QACRR,OAAOA;QACPF,WAAWW,IAAAA,gBAAU,eAEnBb,UAAU,qCACVA,UAAU,uCACVW,UAAUd,oBAAQ,CAACiB,OAAO,IAAInB,eAAe,CAACgB,MAAM,EACpDN,kCACAC,gCACAJ;QAEFC,YAAYA;QACZE,QAAQA;QACRC,OAAOA;QACPS,UAAUN,UAAUM,QAAQ;QAC5BP,MAAMA;QACND,QAAQA;qBAER,qBAACS,8CAAUP;QAAWV,MAAMA;QAAMG,SAAS;QAAuBe,KAAKhB;;AAG7E"}

package/dist/cjs/components/InputLike/InputLike.js

@@ -1,55 +1,61 @@
 "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, "InputLike", {
+    enumerable: true,
+    get: function() {
+        return InputLike;
+    }
 });
-exports.InputLike = 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 _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
 var _callMultiple = require("../../lib/callMultiple");
 var _utils = require("../../lib/utils");
-var _excluded = ["value", "length", "index", "onElementSelect", "onClick", "onFocus", "getRootRef", "className"];
 var MASK_SYMBOL = String.fromCharCode(0x2007);
 function getMaskElements(length) {
-  var result = [];
-  for (var _index = 0; _index < length; _index += 1) {
-    result.push( /*#__PURE__*/React.createElement("span", {
-      key: _index,
-      className: "vkuiInputLike__mask"
-    }, MASK_SYMBOL));
-  }
-  return result;
+    var result = [];
+    for(var index = 0; index < length; index += 1){
+        result.push(/*#__PURE__*/ _react.createElement("span", {
+            key: index,
+            className: "vkuiInputLike__mask"
+        }, MASK_SYMBOL));
+    }
+    return result;
 }
-var InputLike = function InputLike(_ref) {
-  var _value$length;
-  var value = _ref.value,
-    length = _ref.length,
-    index = _ref.index,
-    onElementSelect = _ref.onElementSelect,
-    onClick = _ref.onClick,
-    onFocus = _ref.onFocus,
-    getRootRef = _ref.getRootRef,
-    className = _ref.className,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var handleElementSelect = React.useCallback(function (event) {
-    (0, _utils.stopPropagation)(event);
-    onElementSelect === null || onElementSelect === void 0 ? void 0 : onElementSelect(index);
-  }, [index, onElementSelect]);
-  return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({
-    className: (0, _vkjs.classNames)("vkuiInputLike", (value === null || value === void 0 ? void 0 : value.length) === length && "vkuiInputLike--full", className),
-    tabIndex: 0,
-    ref: getRootRef,
-    onClick: (0, _callMultiple.callMultiple)(onClick, handleElementSelect),
-    onFocus: (0, _callMultiple.callMultiple)(_utils.stopPropagation, onFocus)
-  }, props), value === null || value === void 0 ? void 0 : value.slice(0, length - 1), (value === null || value === void 0 ? void 0 : value.slice(length - 1)) && /*#__PURE__*/React.createElement("span", {
-    key: index,
-    className: "vkuiInputLike__last_character"
-  }, value.slice(length - 1)), getMaskElements(length - ((_value$length = value === null || value === void 0 ? void 0 : value.length) !== null && _value$length !== void 0 ? _value$length : 0)));
+var InputLike = function(_param) {
+    var value = _param.value, length = _param.length, index = _param.index, onElementSelect = _param.onElementSelect, onClick = _param.onClick, onFocus = _param.onFocus, getRootRef = _param.getRootRef, className = _param.className, props = _objectWithoutProperties(_param, [
+        "value",
+        "length",
+        "index",
+        "onElementSelect",
+        "onClick",
+        "onFocus",
+        "getRootRef",
+        "className"
+    ]);
+    var handleElementSelect = _react.useCallback(function(event) {
+        (0, _utils.stopPropagation)(event);
+        onElementSelect === null || onElementSelect === void 0 ? void 0 : onElementSelect(index);
+    }, [
+        index,
+        onElementSelect
+    ]);
+    var _value_length;
+    return /*#__PURE__*/ _react.createElement("span", _objectSpread({
+        className: (0, _vkjs.classNames)("vkuiInputLike", (value === null || value === void 0 ? void 0 : value.length) === length && "vkuiInputLike--full", className),
+        tabIndex: 0,
+        ref: getRootRef,
+        onClick: (0, _callMultiple.callMultiple)(onClick, handleElementSelect),
+        onFocus: (0, _callMultiple.callMultiple)(_utils.stopPropagation, onFocus)
+    }, props), value === null || value === void 0 ? void 0 : value.slice(0, length - 1), (value === null || value === void 0 ? void 0 : value.slice(length - 1)) && /*#__PURE__*/ _react.createElement("span", {
+        key: index,
+        className: "vkuiInputLike__last_character"
+    }, value.slice(length - 1)), getMaskElements(length - ((_value_length = value === null || value === void 0 ? void 0 : value.length) !== null && _value_length !== void 0 ? _value_length : 0)));
 };
-exports.InputLike = InputLike;
-InputLike.displayName = 'InputLike';
+InputLike.displayName = "InputLike";
+
 //# sourceMappingURL=InputLike.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"InputLike.js","names":["MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","InputLike","value","onElementSelect","onClick","onFocus","getRootRef","className","props","handleElementSelect","React","useCallback","event","stopPropagation","classNames","callMultiple","slice","displayName"],"sources":["../../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { HasRootRef } from '../../types';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps\n  extends React.HTMLAttributes<HTMLSpanElement>,\n    HasRootRef<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  onElementSelect?(index: number): void;\n}\n\nconst MASK_SYMBOL = String.fromCharCode(0x2007);\n\nfunction getMaskElements(length: number) {\n  const result = [];\n  for (let index = 0; index < length; index += 1) {\n    result.push(\n      <span key={index} className={styles['InputLike__mask']}>\n        {MASK_SYMBOL}\n      </span>,\n    );\n  }\n  return result;\n}\n\nexport const InputLike = ({\n  value,\n  length,\n  index,\n  onElementSelect,\n  onClick,\n  onFocus,\n  getRootRef,\n  className,\n  ...props\n}: InputLikeProps) => {\n  const handleElementSelect = React.useCallback(\n    (event: React.MouseEvent<HTMLSpanElement>) => {\n      stopPropagation(event);\n      onElementSelect?.(index);\n    },\n    [index, onElementSelect],\n  );\n\n  return (\n    <span\n      className={classNames(\n        styles['InputLike'],\n        value?.length === length && styles[`InputLike--full`],\n        className,\n      )}\n      tabIndex={0}\n      ref={getRootRef}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\n      {...props}\n    >\n      {value?.slice(0, length - 1)}\n      {value?.slice(length - 1) && (\n        <span key={index} className={styles['InputLike__last_character']}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </span>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AAAkD;AAalD,IAAMA,WAAW,GAAGC,MAAM,CAACC,YAAY,CAAC,MAAM,CAAC;AAE/C,SAASC,eAAe,CAACC,MAAc,EAAE;EACvC,IAAMC,MAAM,GAAG,EAAE;EACjB,KAAK,IAAIC,MAAK,GAAG,CAAC,EAAEA,MAAK,GAAGF,MAAM,EAAEE,MAAK,IAAI,CAAC,EAAE;IAC9CD,MAAM,CAACE,IAAI,eACT;MAAM,GAAG,EAAED,MAAM;MAAC,SAAS;IAA4B,GACpDN,WAAW,CACP,CACR;EACH;EACA,OAAOK,MAAM;AACf;AAEO,IAAMG,SAAS,GAAG,SAAZA,SAAS,OAUA;EAAA;EAAA,IATpBC,KAAK,QAALA,KAAK;IACLL,MAAM,QAANA,MAAM;IACNE,KAAK,QAALA,KAAK;IACLI,eAAe,QAAfA,eAAe;IACfC,OAAO,QAAPA,OAAO;IACPC,OAAO,QAAPA,OAAO;IACPC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACNC,KAAK;EAER,IAAMC,mBAAmB,GAAGC,KAAK,CAACC,WAAW,CAC3C,UAACC,KAAwC,EAAK;IAC5C,IAAAC,sBAAe,EAACD,KAAK,CAAC;IACtBT,eAAe,aAAfA,eAAe,uBAAfA,eAAe,CAAGJ,KAAK,CAAC;EAC1B,CAAC,EACD,CAACA,KAAK,EAAEI,eAAe,CAAC,CACzB;EAED,oBACE;IACE,SAAS,EAAE,IAAAW,gBAAU,mBAEnB,CAAAZ,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEL,MAAM,MAAKA,MAAM,yBAA6B,EACrDU,SAAS,CACT;IACF,QAAQ,EAAE,CAAE;IACZ,GAAG,EAAED,UAAW;IAChB,OAAO,EAAE,IAAAS,0BAAY,EAACX,OAAO,EAAEK,mBAAmB,CAAE;IACpD,OAAO,EAAE,IAAAM,0BAAY,EAACF,sBAAe,EAAER,OAAO;EAAE,GAC5CG,KAAK,GAERN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEc,KAAK,CAAC,CAAC,EAAEnB,MAAM,GAAG,CAAC,CAAC,EAC3B,CAAAK,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEc,KAAK,CAACnB,MAAM,GAAG,CAAC,CAAC,kBACvB;IAAM,GAAG,EAAEE,KAAM;IAAC,SAAS;EAAsC,GAC9DG,KAAK,CAACc,KAAK,CAACnB,MAAM,GAAG,CAAC,CAAC,CAE3B,EACAD,eAAe,CAACC,MAAM,qBAAIK,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEL,MAAM,yDAAI,CAAC,CAAC,CAAC,CAC1C;AAEX,CAAC;AAAC;AAEFI,SAAS,CAACgB,WAAW,GAAG,WAAW"}
+{"version":3,"sources":["../../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { HasRootRef } from '../../types';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps\n  extends React.HTMLAttributes<HTMLSpanElement>,\n    HasRootRef<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  onElementSelect?(index: number): void;\n}\n\nconst MASK_SYMBOL = String.fromCharCode(0x2007);\n\nfunction getMaskElements(length: number) {\n  const result = [];\n  for (let index = 0; index < length; index += 1) {\n    result.push(\n      <span key={index} className={styles['InputLike__mask']}>\n        {MASK_SYMBOL}\n      </span>,\n    );\n  }\n  return result;\n}\n\nexport const InputLike = ({\n  value,\n  length,\n  index,\n  onElementSelect,\n  onClick,\n  onFocus,\n  getRootRef,\n  className,\n  ...props\n}: InputLikeProps) => {\n  const handleElementSelect = React.useCallback(\n    (event: React.MouseEvent<HTMLSpanElement>) => {\n      stopPropagation(event);\n      onElementSelect?.(index);\n    },\n    [index, onElementSelect],\n  );\n\n  return (\n    <span\n      className={classNames(\n        styles['InputLike'],\n        value?.length === length && styles['InputLike--full'],\n        className,\n      )}\n      tabIndex={0}\n      ref={getRootRef}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\n      {...props}\n    >\n      {value?.slice(0, length - 1)}\n      {value?.slice(length - 1) && (\n        <span key={index} className={styles['InputLike__last_character']}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </span>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"names":["InputLike","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","key","className","value","onElementSelect","onClick","onFocus","getRootRef","props","handleElementSelect","React","useCallback","event","stopPropagation","classNames","tabIndex","ref","callMultiple","slice","displayName"],"mappings":";;;;+BA8BaA;;;eAAAA;;;;;;2DA9BU;oBACI;4BACE;qBACG;AAahC,IAAMC,cAAcC,OAAOC,YAAY,CAAC;AAExC,SAASC,gBAAgBC,MAAc,EAAE;IACvC,IAAMC,SAAS,EAAE;IACjB,IAAK,IAAIC,QAAQ,GAAGA,QAAQF,QAAQE,SAAS,EAAG;QAC9CD,OAAOE,IAAI,eACT,qBAACC;YAAKC,KAAKH;YAAOI,SAAS;WACxBV;IAGP;IACA,OAAOK;AACT;AAEO,IAAMN,YAAY,iBAUH;QATpBY,eAAAA,OACAP,gBAAAA,QACAE,eAAAA,OACAM,yBAAAA,iBACAC,iBAAAA,SACAC,iBAAAA,SACAC,oBAAAA,YACAL,mBAAAA,WACGM;QARHL;QACAP;QACAE;QACAM;QACAC;QACAC;QACAC;QACAL;;IAGA,IAAMO,sBAAsBC,OAAMC,WAAW,CAC3C,SAACC,OAA6C;QAC5CC,IAAAA,sBAAe,EAACD;QAChBR,4BAAAA,6BAAAA,KAAAA,IAAAA,gBAAkBN;IACpB,GACA;QAACA;QAAOM;KAAgB;QAsBKD;IAnB/B,qBACE,qBAACH;QACCE,WAAWY,IAAAA,gBAAU,mBAEnBX,CAAAA,kBAAAA,mBAAAA,KAAAA,IAAAA,MAAOP,MAAM,AAAD,MAAMA,iCAClBM;QAEFa,UAAU;QACVC,KAAKT;QACLF,SAASY,IAAAA,0BAAY,EAACZ,SAASI;QAC/BH,SAASW,IAAAA,0BAAY,EAACJ,sBAAe,EAAEP;OACnCE,QAEHL,kBAAAA,mBAAAA,KAAAA,IAAAA,MAAOe,KAAK,CAAC,GAAGtB,SAAS,IACzBO,CAAAA,kBAAAA,mBAAAA,KAAAA,IAAAA,MAAOe,KAAK,CAACtB,SAAS,qBACrB,qBAACI;QAAKC,KAAKH;QAAOI,SAAS;OACxBC,MAAMe,KAAK,CAACtB,SAAS,KAGzBD,gBAAgBC,SAAUO,CAAAA,CAAAA,gBAAAA,kBAAAA,mBAAAA,KAAAA,IAAAA,MAAOP,MAAM,cAAbO,2BAAAA,gBAAiB,CAAC,AAAD;AAGlD;AAEAZ,UAAU4B,WAAW,GAAG"}

package/dist/cjs/components/InputLike/InputLikeDivider.js

@@ -1,23 +1,26 @@
 "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, "InputLikeDivider", {
+    enumerable: true,
+    get: function() {
+        return InputLikeDivider;
+    }
 });
-exports.InputLikeDivider = 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 _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _excluded = ["children", "className"];
-var InputLikeDivider = function InputLikeDivider(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({
-    className: (0, _vkjs.classNames)("vkuiInputLikeDivider", className)
-  }, props), children);
+var InputLikeDivider = function(_param) {
+    var children = _param.children, className = _param.className, props = _objectWithoutProperties(_param, [
+        "children",
+        "className"
+    ]);
+    return /*#__PURE__*/ _react.createElement("span", _objectSpread({
+        className: (0, _vkjs.classNames)("vkuiInputLike__divider", className)
+    }, props), children);
 };
-exports.InputLikeDivider = InputLikeDivider;
+
 //# sourceMappingURL=InputLikeDivider.js.map