@vkontakte/vkui 5.0.3 → 5.1.2

package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js

@@ -12,7 +12,7 @@ var React = _interopRequireWildcard(require("react"));
 var _useAdaptivity2 = require("../../../hooks/useAdaptivity");
 var _useFocusVisible2 = require("../../../hooks/useFocusVisible");
 var _callMultiple = require("../../../lib/callMultiple");
-var _classNames = require("../../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _FocusVisible = require("../../FocusVisible/FocusVisible");
 var _VisuallyHiddenInput = require("../../VisuallyHiddenInput/VisuallyHiddenInput");
 var _getSizeYClassName = require("../../../helpers/getSizeYClassName");
@@ -32,14 +32,14 @@ var SegmentedControlOption = function SegmentedControlOption(_ref) {
   var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
     sizeY = _useAdaptivity.sizeY;
   return /*#__PURE__*/React.createElement("label", {
-    className: (0, _classNames.classNamesString)("vkuiSegmentedControlOption", restProps.checked && "vkuiSegmentedControlOption--checked", focusVisible && "vkuiSegmentedControlOption--focus-visible", className),
+    className: (0, _vkjs.classNames)("vkuiSegmentedControlOption", restProps.checked && "vkuiSegmentedControlOption--checked", focusVisible && "vkuiSegmentedControlOption--focus-visible", className),
     style: style
   }, /*#__PURE__*/React.createElement(_VisuallyHiddenInput.VisuallyHiddenInput, (0, _extends2.default)({}, restProps, {
     type: "radio",
     onBlur: (0, _callMultiple.callMultiple)(onBlur, restProps.onBlur),
     onFocus: (0, _callMultiple.callMultiple)(onFocus, restProps.onFocus)
   })), /*#__PURE__*/React.createElement("span", {
-    className: (0, _classNames.classNamesString)("vkuiSegmentedControlOption__content", (0, _getSizeYClassName.getSizeYClassName)("vkuiSegmentedControlOption__content", sizeY))
+    className: (0, _vkjs.classNames)("vkuiSegmentedControlOption__content", (0, _getSizeYClassName.getSizeYClassName)("vkuiSegmentedControlOption__content", sizeY))
   }, children), /*#__PURE__*/React.createElement(_FocusVisible.FocusVisible, {
     mode: "inside"
   }));

package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlOption.js","names":["SegmentedControlOption","className","style","children","restProps","useFocusVisible","focusVisible","onBlur","onFocus","useAdaptivity","sizeY","classNamesString","checked","callMultiple","getSizeYClassName"],"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { useAdaptivity } from \"../../../hooks/useAdaptivity\";\nimport { useFocusVisible } from \"../../../hooks/useFocusVisible\";\nimport { callMultiple } from \"../../../lib/callMultiple\";\nimport { classNamesString } from \"../../../lib/classNames\";\nimport { FocusVisible } from \"../../FocusVisible/FocusVisible\";\nimport {\n  VisuallyHiddenInput,\n  VisuallyHiddenInputProps,\n} from \"../../VisuallyHiddenInput/VisuallyHiddenInput\";\nimport { getSizeYClassName } from \"../../../helpers/getSizeYClassName\";\nimport styles from \"./SegmentedControlOption.module.css\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  className,\n  style,\n  children,\n  ...restProps\n}: VisuallyHiddenInputProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <label\n      className={classNamesString(\n        styles[\"SegmentedControlOption\"],\n        restProps.checked && styles[\"SegmentedControlOption--checked\"],\n        focusVisible && styles[\"SegmentedControlOption--focus-visible\"],\n        className\n      )}\n      style={style}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        type=\"radio\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <span\n        className={classNamesString(\n          styles[\"SegmentedControlOption__content\"],\n          getSizeYClassName(styles[\"SegmentedControlOption__content\"], sizeY)\n        )}\n      >\n        {children}\n      </span>\n      <FocusVisible mode=\"inside\" />\n    </label>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAuE;AAGvE;AACA;AACA;AACO,IAAMA,sBAAsB,GAAG,SAAzBA,sBAAsB,OAKH;EAAA,IAJ9BC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACLC,SAAS;EAEZ,uBAA0C,IAAAC,iCAAe,GAAE;IAAnDC,YAAY,oBAAZA,YAAY;IAAEC,MAAM,oBAANA,MAAM;IAAEC,OAAO,oBAAPA,OAAO;EACrC,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE;IACE,SAAS,EAAE,IAAAC,4BAAgB,gCAEzBP,SAAS,CAACQ,OAAO,yCAA6C,EAC9DN,YAAY,+CAAmD,EAC/DL,SAAS,CACT;IACF,KAAK,EAAEC;EAAM,gBAEb,oBAAC,wCAAmB,6BACdE,SAAS;IACb,IAAI,EAAC,OAAO;IACZ,MAAM,EAAE,IAAAS,0BAAY,EAACN,MAAM,EAAEH,SAAS,CAACG,MAAM,CAAE;IAC/C,OAAO,EAAE,IAAAM,0BAAY,EAACL,OAAO,EAAEJ,SAAS,CAACI,OAAO;EAAE,GAClD,eACF;IACE,SAAS,EAAE,IAAAG,4BAAgB,yCAEzB,IAAAG,oCAAiB,yCAA4CJ,KAAK,CAAC;EACnE,GAEDP,QAAQ,CACJ,eACP,oBAAC,0BAAY;IAAC,IAAI,EAAC;EAAQ,EAAG,CACxB;AAEZ,CAAC;AAAC"}
+{"version":3,"file":"SegmentedControlOption.js","names":["SegmentedControlOption","className","style","children","restProps","useFocusVisible","focusVisible","onBlur","onFocus","useAdaptivity","sizeY","classNames","checked","callMultiple","getSizeYClassName"],"sources":["../../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAdaptivity } from '../../../hooks/useAdaptivity';\nimport { useFocusVisible } from '../../../hooks/useFocusVisible';\nimport { callMultiple } from '../../../lib/callMultiple';\nimport { classNames } from '@vkontakte/vkjs';\nimport { FocusVisible } from '../../FocusVisible/FocusVisible';\nimport {\n  VisuallyHiddenInput,\n  VisuallyHiddenInputProps,\n} from '../../VisuallyHiddenInput/VisuallyHiddenInput';\nimport { getSizeYClassName } from '../../../helpers/getSizeYClassName';\nimport styles from './SegmentedControlOption.module.css';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SegmentedControl\n */\nexport const SegmentedControlOption = ({\n  className,\n  style,\n  children,\n  ...restProps\n}: VisuallyHiddenInputProps) => {\n  const { focusVisible, onBlur, onFocus } = useFocusVisible();\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <label\n      className={classNames(\n        styles['SegmentedControlOption'],\n        restProps.checked && styles['SegmentedControlOption--checked'],\n        focusVisible && styles['SegmentedControlOption--focus-visible'],\n        className,\n      )}\n      style={style}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        type=\"radio\"\n        onBlur={callMultiple(onBlur, restProps.onBlur)}\n        onFocus={callMultiple(onFocus, restProps.onFocus)}\n      />\n      <span\n        className={classNames(\n          styles['SegmentedControlOption__content'],\n          getSizeYClassName(styles['SegmentedControlOption__content'], sizeY),\n        )}\n      >\n        {children}\n      </span>\n      <FocusVisible mode=\"inside\" />\n    </label>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAuE;AAGvE;AACA;AACA;AACO,IAAMA,sBAAsB,GAAG,SAAzBA,sBAAsB,OAKH;EAAA,IAJ9BC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACLC,SAAS;EAEZ,uBAA0C,IAAAC,iCAAe,GAAE;IAAnDC,YAAY,oBAAZA,YAAY;IAAEC,MAAM,oBAANA,MAAM;IAAEC,OAAO,oBAAPA,OAAO;EACrC,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE;IACE,SAAS,EAAE,IAAAC,gBAAU,gCAEnBP,SAAS,CAACQ,OAAO,yCAA6C,EAC9DN,YAAY,+CAAmD,EAC/DL,SAAS,CACT;IACF,KAAK,EAAEC;EAAM,gBAEb,oBAAC,wCAAmB,6BACdE,SAAS;IACb,IAAI,EAAC,OAAO;IACZ,MAAM,EAAE,IAAAS,0BAAY,EAACN,MAAM,EAAEH,SAAS,CAACG,MAAM,CAAE;IAC/C,OAAO,EAAE,IAAAM,0BAAY,EAACL,OAAO,EAAEJ,SAAS,CAACI,OAAO;EAAE,GAClD,eACF;IACE,SAAS,EAAE,IAAAG,gBAAU,yCAEnB,IAAAG,oCAAiB,yCAA4CJ,KAAK,CAAC;EACnE,GAEDP,QAAQ,CACJ,eACP,oBAAC,0BAAY;IAAC,IAAI,EAAC;EAAQ,EAAG,CACxB;AAEZ,CAAC;AAAC"}

package/dist/cjs/components/Select/Select.d.ts

@@ -1,10 +1,6 @@
-import * as React from "react";
-import { SelectProps } from "../CustomSelect/CustomSelect";
-export declare type SelectType = "default" | "plain" | "accent";
-/**
- * @see https://vkcom.github.io/VKUI/#/SelectTypography
- */
-export declare const SelectTypography: ({ selectType, children, className, ...restProps }: React.PropsWithChildren<Pick<SelectProps, "selectType" | "className">>) => JSX.Element;
+/// <reference types="react" />
+import { SelectProps } from '../CustomSelect/CustomSelect';
+export declare type SelectType = 'default' | 'plain' | 'accent';
 /**
  * @see https://vkcom.github.io/VKUI/#/Select
  */

package/dist/cjs/components/Select/Select.js

@@ -5,60 +5,37 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SelectTypography = exports.Select = void 0;
+exports.Select = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _NativeSelect = require("../NativeSelect/NativeSelect");
 var _CustomSelect = require("../CustomSelect/CustomSelect");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _useAdaptivityHasPointer = require("../../hooks/useAdaptivityHasPointer");
-var _usePlatform = require("../../hooks/usePlatform");
-var _classNames = require("../../lib/classNames");
-var _getPlatformClassName = require("../../helpers/getPlatformClassName");
-var _getSizeYClassName = require("../../helpers/getSizeYClassName");
-var _excluded = ["selectType", "children", "className"],
-  _excluded2 = ["children", "options", "popupDirection", "renderOption", "className"];
-/**
- * @see https://vkcom.github.io/VKUI/#/SelectTypography
- */
-var SelectTypography = function SelectTypography(_ref) {
-  var _ref$selectType = _ref.selectType,
-    selectType = _ref$selectType === void 0 ? "default" : _ref$selectType,
-    children = _ref.children,
-    className = _ref.className,
-    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var platform = (0, _usePlatform.usePlatform)();
-  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    sizeY = _useAdaptivity.sizeY;
-  return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({
-    className: (0, _classNames.classNamesString)("vkuiSelectTypography", (0, _getPlatformClassName.getPlatformClassName)("vkuiSelectTypography", platform), (0, _getSizeYClassName.getSizeYClassName)("vkuiSelectTypography", sizeY), styles["SelectTypography--selectType-".concat(selectType)], className)
-  }, restProps), children);
-};
-
+var _vkjs = require("@vkontakte/vkjs");
+var _excluded = ["children", "options", "popupDirection", "renderOption", "className"];
 /**
  * @see https://vkcom.github.io/VKUI/#/Select
  */
-exports.SelectTypography = SelectTypography;
-var Select = function Select(_ref2) {
-  var children = _ref2.children,
-    _ref2$options = _ref2.options,
-    options = _ref2$options === void 0 ? [] : _ref2$options,
-    popupDirection = _ref2.popupDirection,
-    renderOption = _ref2.renderOption,
-    className = _ref2.className,
-    props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+var Select = function Select(_ref) {
+  var children = _ref.children,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    popupDirection = _ref.popupDirection,
+    renderOption = _ref.renderOption,
+    className = _ref.className,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var hasPointer = (0, _useAdaptivityHasPointer.useAdaptivityHasPointer)();
   return /*#__PURE__*/React.createElement(React.Fragment, null, (hasPointer === undefined || hasPointer) && /*#__PURE__*/React.createElement(_CustomSelect.CustomSelect, (0, _extends2.default)({
-    className: (0, _classNames.classNamesString)("vkuiSelect__custom", className),
+    className: (0, _vkjs.classNames)("vkuiSelect__custom", className),
     options: options,
     popupDirection: popupDirection,
     renderOption: renderOption
   }, props)), (hasPointer === undefined || !hasPointer) && /*#__PURE__*/React.createElement(_NativeSelect.NativeSelect, (0, _extends2.default)({
-    className: (0, _classNames.classNamesString)("vkuiSelect__native", className)
-  }, props), options.map(function (_ref3) {
-    var label = _ref3.label,
-      value = _ref3.value;
+    className: (0, _vkjs.classNames)("vkuiSelect__native", className)
+  }, props), options.map(function (_ref2) {
+    var label = _ref2.label,
+      value = _ref2.value;
     return /*#__PURE__*/React.createElement("option", {
       value: value,
       key: "".concat(value)
@@ -66,9 +43,4 @@ var Select = function Select(_ref2) {
   })));
 };
 exports.Select = Select;
-var styles = {
-  "SelectTypography--selectType-accent": "vkuiSelectTypography--selectType-accent",
-  "SelectTypography--selectType-default": "vkuiSelectTypography--selectType-default",
-  "SelectTypography--selectType-plain": "vkuiSelectTypography--selectType-plain"
-};
 //# sourceMappingURL=Select.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Select.js","names":["SelectTypography","selectType","children","className","restProps","platform","usePlatform","useAdaptivity","sizeY","classNamesString","getPlatformClassName","getSizeYClassName","styles","Select","options","popupDirection","renderOption","props","hasPointer","useAdaptivityHasPointer","undefined","map","label","value"],"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { NativeSelect } from \"../NativeSelect/NativeSelect\";\nimport { CustomSelect, SelectProps } from \"../CustomSelect/CustomSelect\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { useAdaptivityHasPointer } from \"../../hooks/useAdaptivityHasPointer\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"./Select.module.css\";\n\nexport type SelectType = \"default\" | \"plain\" | \"accent\";\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SelectTypography\n */\nexport const SelectTypography = ({\n  selectType = \"default\",\n  children,\n  className,\n  ...restProps\n}: React.PropsWithChildren<Pick<SelectProps, \"selectType\" | \"className\">>) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <span\n      className={classNamesString(\n        styles[\"SelectTypography\"],\n        getPlatformClassName(styles[\"SelectTypography\"], platform),\n        getSizeYClassName(styles[\"SelectTypography\"], sizeY),\n        styles[`SelectTypography--selectType-${selectType}`],\n        className\n      )}\n      {...restProps}\n    >\n      {children}\n    </span>\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Select\n */\nexport const Select = ({\n  children,\n  options = [],\n  popupDirection,\n  renderOption,\n  className,\n  ...props\n}: SelectProps) => {\n  const hasPointer = useAdaptivityHasPointer();\n\n  return (\n    <React.Fragment>\n      {(hasPointer === undefined || hasPointer) && (\n        <CustomSelect\n          className={classNamesString(styles[\"Select__custom\"], className)}\n          options={options}\n          popupDirection={popupDirection}\n          renderOption={renderOption}\n          {...props}\n        />\n      )}\n      {(hasPointer === undefined || !hasPointer) && (\n        <NativeSelect\n          className={classNamesString(styles[\"Select__native\"], className)}\n          {...props}\n        >\n          {options.map(({ label, value }) => (\n            <option value={value} key={`${value}`}>\n              {label}\n            </option>\n          ))}\n        </NativeSelect>\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;EAAA;AAKpE;AACA;AACA;AACO,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgB,OAKiD;EAAA,2BAJ5EC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE;IACE,SAAS,EAAE,IAAAC,4BAAgB,0BAEzB,IAAAC,0CAAoB,0BAA6BL,QAAQ,CAAC,EAC1D,IAAAM,oCAAiB,0BAA6BH,KAAK,CAAC,EACpDI,MAAM,wCAAiCX,UAAU,EAAG,EACpDE,SAAS;EACT,GACEC,SAAS,GAEZF,QAAQ,CACJ;AAEX,CAAC;;AAED;AACA;AACA;AAFA;AAGO,IAAMW,MAAM,GAAG,SAATA,MAAM,QAOA;EAAA,IANjBX,QAAQ,SAARA,QAAQ;IAAA,sBACRY,OAAO;IAAPA,OAAO,8BAAG,EAAE;IACZC,cAAc,SAAdA,cAAc;IACdC,YAAY,SAAZA,YAAY;IACZb,SAAS,SAATA,SAAS;IACNc,KAAK;EAER,IAAMC,UAAU,GAAG,IAAAC,gDAAuB,GAAE;EAE5C,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZ,CAACD,UAAU,KAAKE,SAAS,IAAIF,UAAU,kBACtC,oBAAC,0BAAY;IACX,SAAS,EAAE,IAAAT,4BAAgB,wBAA2BN,SAAS,CAAE;IACjE,OAAO,EAAEW,OAAQ;IACjB,cAAc,EAAEC,cAAe;IAC/B,YAAY,EAAEC;EAAa,GACvBC,KAAK,EAEZ,EACA,CAACC,UAAU,KAAKE,SAAS,IAAI,CAACF,UAAU,kBACvC,oBAAC,0BAAY;IACX,SAAS,EAAE,IAAAT,4BAAgB,wBAA2BN,SAAS;EAAE,GAC7Dc,KAAK,GAERH,OAAO,CAACO,GAAG,CAAC;IAAA,IAAGC,KAAK,SAALA,KAAK;MAAEC,KAAK,SAALA,KAAK;IAAA,oBAC1B;MAAQ,KAAK,EAAEA,KAAM;MAAC,GAAG,YAAKA,KAAK;IAAG,GACnCD,KAAK,CACC;EAAA,CACV,CAAC,CAEL,CACc;AAErB,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"Select.js","names":["Select","children","options","popupDirection","renderOption","className","props","hasPointer","useAdaptivityHasPointer","undefined","classNames","map","label","value"],"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NativeSelect } from '../NativeSelect/NativeSelect';\nimport { CustomSelect, SelectProps } from '../CustomSelect/CustomSelect';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Select.module.css';\n\nexport type SelectType = 'default' | 'plain' | 'accent';\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Select\n */\nexport const Select = ({\n  children,\n  options = [],\n  popupDirection,\n  renderOption,\n  className,\n  ...props\n}: SelectProps) => {\n  const hasPointer = useAdaptivityHasPointer();\n\n  return (\n    <React.Fragment>\n      {(hasPointer === undefined || hasPointer) && (\n        <CustomSelect\n          className={classNames(styles['Select__custom'], className)}\n          options={options}\n          popupDirection={popupDirection}\n          renderOption={renderOption}\n          {...props}\n        />\n      )}\n      {(hasPointer === undefined || !hasPointer) && (\n        <NativeSelect className={classNames(styles['Select__native'], className)} {...props}>\n          {options.map(({ label, value }) => (\n            <option value={value} key={`${value}`}>\n              {label}\n            </option>\n          ))}\n        </NativeSelect>\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAA6C;AAK7C;AACA;AACA;AACO,IAAMA,MAAM,GAAG,SAATA,MAAM,OAOA;EAAA,IANjBC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,EAAE;IACZC,cAAc,QAAdA,cAAc;IACdC,YAAY,QAAZA,YAAY;IACZC,SAAS,QAATA,SAAS;IACNC,KAAK;EAER,IAAMC,UAAU,GAAG,IAAAC,gDAAuB,GAAE;EAE5C,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZ,CAACD,UAAU,KAAKE,SAAS,IAAIF,UAAU,kBACtC,oBAAC,0BAAY;IACX,SAAS,EAAE,IAAAG,gBAAU,wBAA2BL,SAAS,CAAE;IAC3D,OAAO,EAAEH,OAAQ;IACjB,cAAc,EAAEC,cAAe;IAC/B,YAAY,EAAEC;EAAa,GACvBE,KAAK,EAEZ,EACA,CAACC,UAAU,KAAKE,SAAS,IAAI,CAACF,UAAU,kBACvC,oBAAC,0BAAY;IAAC,SAAS,EAAE,IAAAG,gBAAU,wBAA2BL,SAAS;EAAE,GAAKC,KAAK,GAChFJ,OAAO,CAACS,GAAG,CAAC;IAAA,IAAGC,KAAK,SAALA,KAAK;MAAEC,KAAK,SAALA,KAAK;IAAA,oBAC1B;MAAQ,KAAK,EAAEA,KAAM;MAAC,GAAG,YAAKA,KAAK;IAAG,GACnCD,KAAK,CACC;EAAA,CACV,CAAC,CAEL,CACc;AAErB,CAAC;AAAC"}

package/dist/cjs/components/SelectMimicry/SelectMimicry.d.ts

@@ -1,8 +1,8 @@
-import * as React from "react";
-import { FormFieldProps } from "../FormField/FormField";
-import { HasAlign, HasRootRef } from "../../types";
-import { SelectType } from "../Select/Select";
-export interface SelectMimicryProps extends React.HTMLAttributes<HTMLElement>, HasAlign, HasRootRef<HTMLElement>, Pick<FormFieldProps, "before" | "after" | "status"> {
+import * as React from 'react';
+import { FormFieldProps } from '../FormField/FormField';
+import { HasAlign, HasRootRef } from '../../types';
+import type { SelectType } from '../Select/Select';
+export interface SelectMimicryProps extends React.HTMLAttributes<HTMLElement>, HasAlign, HasRootRef<HTMLElement>, Pick<FormFieldProps, 'before' | 'after' | 'status'> {
     multiline?: boolean;
     disabled?: boolean;
     selectType?: SelectType;

package/dist/cjs/components/SelectMimicry/SelectMimicry.js

@@ -9,13 +9,13 @@ exports.SelectMimicry = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _DropdownIcon = require("../DropdownIcon/DropdownIcon");
 var _FormField = require("../FormField/FormField");
 var _usePlatform = require("../../hooks/usePlatform");
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
 var _select = require("../../lib/select");
-var _Select = require("../Select/Select");
+var _SelectTypography = require("../SelectTypography/SelectTypography");
 var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _getSizeXClassName = require("../../helpers/getSizeXClassName");
 var _getSizeYClassName = require("../../helpers/getSizeYClassName");
@@ -37,7 +37,7 @@ var SelectMimicry = function SelectMimicry(_ref) {
     _ref$after = _ref.after,
     after = _ref$after === void 0 ? /*#__PURE__*/React.createElement(_DropdownIcon.DropdownIcon, null) : _ref$after,
     _ref$selectType = _ref.selectType,
-    selectType = _ref$selectType === void 0 ? "default" : _ref$selectType,
+    selectType = _ref$selectType === void 0 ? 'default' : _ref$selectType,
     status = _ref.status,
     className = _ref.className,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
@@ -48,7 +48,7 @@ var SelectMimicry = function SelectMimicry(_ref) {
   var title = children || placeholder;
   return /*#__PURE__*/React.createElement(_FormField.FormField, (0, _extends2.default)({}, restProps, {
     tabIndex: disabled ? undefined : tabIndex,
-    className: (0, _classNames.classNamesString)("vkuiSelect", (0, _getPlatformClassName.getPlatformClassName)("vkuiSelect", platform), (0, _getSizeXClassName.getSizeXClassName)("vkuiSelect", sizeX), (0, _getSizeYClassName.getSizeYClassName)("vkuiSelect", sizeY), multiline && "vkuiSelect--multiline", align && styles["Select--align-".concat(align)], before && "vkuiSelect--hasBefore", after && "vkuiSelect--hasAfter", className),
+    className: (0, _vkjs.classNames)("vkuiSelect", (0, _getPlatformClassName.getPlatformClassName)("vkuiSelect", platform), (0, _getSizeXClassName.getSizeXClassName)("vkuiSelect", sizeX), (0, _getSizeYClassName.getSizeYClassName)("vkuiSelect", sizeY), multiline && "vkuiSelect--multiline", align && styles["Select--align-".concat(align)], before && "vkuiSelect--hasBefore", after && "vkuiSelect--hasAfter", className),
     getRootRef: getRootRef,
     onClick: disabled ? undefined : onClick,
     disabled: disabled,
@@ -58,7 +58,7 @@ var SelectMimicry = function SelectMimicry(_ref) {
     status: status
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiSelect__container"
-  }, /*#__PURE__*/React.createElement(_Select.SelectTypography, {
+  }, /*#__PURE__*/React.createElement(_SelectTypography.SelectTypography, {
     selectType: selectType,
     className: "vkuiSelect__title"
   }, title)));

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

@@ -1 +1 @@
-{"version":3,"file":"SelectMimicry.js","names":["SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","restProps","platform","usePlatform","useAdaptivity","sizeX","sizeY","title","undefined","classNamesString","getPlatformClassName","getSizeXClassName","getSizeYClassName","styles","getFormFieldModeFromSelectType"],"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { DropdownIcon } from \"../DropdownIcon/DropdownIcon\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { HasAlign, HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { getFormFieldModeFromSelectType } from \"../../lib/select\";\nimport { SelectType, SelectTypography } from \"../Select/Select\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { getSizeXClassName } from \"../../helpers/getSizeXClassName\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"../Select/Select.module.css\";\n\nexport interface SelectMimicryProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasAlign,\n    HasRootRef<HTMLElement>,\n    Pick<FormFieldProps, \"before\" | \"after\" | \"status\"> {\n  multiline?: boolean;\n  disabled?: boolean;\n  selectType?: SelectType;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SelectMimicry\n */\nexport const SelectMimicry = ({\n  tabIndex = 0,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  before,\n  after = <DropdownIcon />,\n  selectType = \"default\",\n  status,\n  className,\n  ...restProps\n}: SelectMimicryProps) => {\n  const platform = usePlatform();\n  const { sizeX, sizeY } = useAdaptivity();\n  const title = children || placeholder;\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? undefined : tabIndex}\n      className={classNamesString(\n        styles[\"Select\"],\n        getPlatformClassName(styles[\"Select\"], platform),\n        getSizeXClassName(styles[\"Select\"], sizeX),\n        getSizeYClassName(styles[\"Select\"], sizeY),\n        multiline && styles[\"Select--multiline\"],\n        align && styles[`Select--align-${align}`],\n        before && styles[\"Select--hasBefore\"],\n        after && styles[\"Select--hasAfter\"],\n        className\n      )}\n      getRootRef={getRootRef}\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      before={before}\n      after={after}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      status={status}\n    >\n      <div className={styles[\"Select__container\"]}>\n        <SelectTypography\n          selectType={selectType}\n          className={styles[\"Select__title\"]}\n        >\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;AAapE;AACA;AACA;AACO,IAAMA,aAAa,GAAG,SAAhBA,aAAa,OAeA;EAAA,yBAdxBC,QAAQ;IAARA,QAAQ,8BAAG,CAAC;IACZC,WAAW,QAAXA,WAAW;IACXC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IAAA,kBACNC,KAAK;IAALA,KAAK,wCAAG,oBAAC,0BAAY,OAAG;IAAA,uBACxBC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAyB,IAAAC,6BAAa,GAAE;IAAhCC,KAAK,kBAALA,KAAK;IAAEC,KAAK,kBAALA,KAAK;EACpB,IAAMC,KAAK,GAAGjB,QAAQ,IAAID,WAAW;EAErC,oBACE,oBAAC,oBAAS,6BACJY,SAAS;IACb,QAAQ,EAAEP,QAAQ,GAAGc,SAAS,GAAGpB,QAAS;IAC1C,SAAS,EAAE,IAAAqB,4BAAgB,gBAEzB,IAAAC,0CAAoB,gBAAmBR,QAAQ,CAAC,EAChD,IAAAS,oCAAiB,gBAAmBN,KAAK,CAAC,EAC1C,IAAAO,oCAAiB,gBAAmBN,KAAK,CAAC,EAC1Cb,SAAS,2BAA+B,EACxCF,KAAK,IAAIsB,MAAM,yBAAkBtB,KAAK,EAAG,EACzCK,MAAM,2BAA+B,EACrCC,KAAK,0BAA8B,EACnCG,SAAS,CACT;IACF,UAAU,EAAER,UAAW;IACvB,OAAO,EAAEE,QAAQ,GAAGc,SAAS,GAAGb,OAAQ;IACxC,QAAQ,EAAED,QAAS;IACnB,MAAM,EAAEE,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,IAAI,EAAE,IAAAiB,sCAA8B,EAAChB,UAAU,CAAE;IACjD,MAAM,EAAEC;EAAO,iBAEf;IAAK,SAAS;EAA8B,gBAC1C,oBAAC,wBAAgB;IACf,UAAU,EAAED,UAAW;IACvB,SAAS;EAA0B,GAElCS,KAAK,CACW,CACf,CACI;AAEhB,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"SelectMimicry.js","names":["SelectMimicry","tabIndex","placeholder","children","align","getRootRef","multiline","disabled","onClick","before","after","selectType","status","className","restProps","platform","usePlatform","useAdaptivity","sizeX","sizeY","title","undefined","classNames","getPlatformClassName","getSizeXClassName","getSizeYClassName","styles","getFormFieldModeFromSelectType"],"sources":["../../../../src/components/SelectMimicry/SelectMimicry.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { HasAlign, HasRootRef } from '../../types';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { getFormFieldModeFromSelectType } from '../../lib/select';\nimport type { SelectType } from '../Select/Select';\nimport { SelectTypography } from '../SelectTypography/SelectTypography';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { getSizeXClassName } from '../../helpers/getSizeXClassName';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from '../Select/Select.module.css';\n\nexport interface SelectMimicryProps\n  extends React.HTMLAttributes<HTMLElement>,\n    HasAlign,\n    HasRootRef<HTMLElement>,\n    Pick<FormFieldProps, 'before' | 'after' | 'status'> {\n  multiline?: boolean;\n  disabled?: boolean;\n  selectType?: SelectType;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SelectMimicry\n */\nexport const SelectMimicry = ({\n  tabIndex = 0,\n  placeholder,\n  children,\n  align,\n  getRootRef,\n  multiline,\n  disabled,\n  onClick,\n  before,\n  after = <DropdownIcon />,\n  selectType = 'default',\n  status,\n  className,\n  ...restProps\n}: SelectMimicryProps) => {\n  const platform = usePlatform();\n  const { sizeX, sizeY } = useAdaptivity();\n  const title = children || placeholder;\n\n  return (\n    <FormField\n      {...restProps}\n      tabIndex={disabled ? undefined : tabIndex}\n      className={classNames(\n        styles['Select'],\n        getPlatformClassName(styles['Select'], platform),\n        getSizeXClassName(styles['Select'], sizeX),\n        getSizeYClassName(styles['Select'], sizeY),\n        multiline && styles['Select--multiline'],\n        align && styles[`Select--align-${align}`],\n        before && styles['Select--hasBefore'],\n        after && styles['Select--hasAfter'],\n        className,\n      )}\n      getRootRef={getRootRef}\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      before={before}\n      after={after}\n      mode={getFormFieldModeFromSelectType(selectType)}\n      status={status}\n    >\n      <div className={styles['Select__container']}>\n        <SelectTypography selectType={selectType} className={styles['Select__title']}>\n          {title}\n        </SelectTypography>\n      </div>\n    </FormField>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAoE;AAapE;AACA;AACA;AACO,IAAMA,aAAa,GAAG,SAAhBA,aAAa,OAeA;EAAA,yBAdxBC,QAAQ;IAARA,QAAQ,8BAAG,CAAC;IACZC,WAAW,QAAXA,WAAW;IACXC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IAAA,kBACNC,KAAK;IAALA,KAAK,wCAAG,oBAAC,0BAAY,OAAG;IAAA,uBACxBC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAAyB,IAAAC,6BAAa,GAAE;IAAhCC,KAAK,kBAALA,KAAK;IAAEC,KAAK,kBAALA,KAAK;EACpB,IAAMC,KAAK,GAAGjB,QAAQ,IAAID,WAAW;EAErC,oBACE,oBAAC,oBAAS,6BACJY,SAAS;IACb,QAAQ,EAAEP,QAAQ,GAAGc,SAAS,GAAGpB,QAAS;IAC1C,SAAS,EAAE,IAAAqB,gBAAU,gBAEnB,IAAAC,0CAAoB,gBAAmBR,QAAQ,CAAC,EAChD,IAAAS,oCAAiB,gBAAmBN,KAAK,CAAC,EAC1C,IAAAO,oCAAiB,gBAAmBN,KAAK,CAAC,EAC1Cb,SAAS,2BAA+B,EACxCF,KAAK,IAAIsB,MAAM,yBAAkBtB,KAAK,EAAG,EACzCK,MAAM,2BAA+B,EACrCC,KAAK,0BAA8B,EACnCG,SAAS,CACT;IACF,UAAU,EAAER,UAAW;IACvB,OAAO,EAAEE,QAAQ,GAAGc,SAAS,GAAGb,OAAQ;IACxC,QAAQ,EAAED,QAAS;IACnB,MAAM,EAAEE,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,IAAI,EAAE,IAAAiB,sCAA8B,EAAChB,UAAU,CAAE;IACjD,MAAM,EAAEC;EAAO,iBAEf;IAAK,SAAS;EAA8B,gBAC1C,oBAAC,kCAAgB;IAAC,UAAU,EAAED,UAAW;IAAC,SAAS;EAA0B,GAC1ES,KAAK,CACW,CACf,CACI;AAEhB,CAAC;AAAC;AAAA;EAAA;EAAA;EAAA;AAAA"}

package/dist/cjs/components/SelectTypography/SelectTypography.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { SelectType } from '../Select/Select';
+export interface SelectTypographyProps {
+    selectType?: SelectType;
+    className?: string;
+    children?: React.ReactNode;
+}
+/**
+ * @private
+ */
+export declare const SelectTypography: ({ selectType, children, className, ...restProps }: SelectTypographyProps) => JSX.Element;

package/dist/cjs/components/SelectTypography/SelectTypography.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectTypography = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var React = _interopRequireWildcard(require("react"));
+var _vkjs = require("@vkontakte/vkjs");
+var _usePlatform = require("../../hooks/usePlatform");
+var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _excluded = ["selectType", "children", "className"];
+var sizeYClassNames = {
+  none: "vkuiSelectTypography--sizeY-none",
+  compact: "vkuiSelectTypography--sizeY-compact",
+  regular: ''
+};
+var platformClassNames = {
+  vkcom: "vkuiSelectTypography--vkcom",
+  android: "vkuiSelectTypography--android"
+};
+var selectTypeClassNames = {
+  default: "vkuiSelectTypography--selectType-default",
+  plain: "vkuiSelectTypography--selectType-plain",
+  accent: "vkuiSelectTypography--selectType-accent"
+};
+/**
+ * @private
+ */
+var SelectTypography = function SelectTypography(_ref) {
+  var _ref$selectType = _ref.selectType,
+    selectType = _ref$selectType === void 0 ? 'default' : _ref$selectType,
+    children = _ref.children,
+    className = _ref.className,
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var platform = (0, _usePlatform.usePlatform)();
+  var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
+  return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({
+    className: (0, _vkjs.classNames)("vkuiSelectTypography", platformClassNames[platform], sizeYClassNames[sizeY], selectTypeClassNames[selectType], className)
+  }, restProps), children);
+};
+exports.SelectTypography = SelectTypography;
+//# sourceMappingURL=SelectTypography.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SelectTypography.js","names":["sizeYClassNames","none","compact","regular","platformClassNames","vkcom","android","selectTypeClassNames","default","plain","accent","SelectTypography","selectType","children","className","restProps","platform","usePlatform","useAdaptivity","sizeY","classNames"],"sources":["../../../../src/components/SelectTypography/SelectTypography.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { SelectType } from '../Select/Select';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport styles from './SelectTypography.module.css';\n\nconst sizeYClassNames = {\n  none: styles['SelectTypography--sizeY-none'],\n  compact: styles['SelectTypography--sizeY-compact'],\n  regular: '',\n};\n\nconst platformClassNames: Record<string, string> = {\n  vkcom: styles['SelectTypography--vkcom'],\n  android: styles['SelectTypography--android'],\n};\n\nconst selectTypeClassNames = {\n  default: styles['SelectTypography--selectType-default'],\n  plain: styles['SelectTypography--selectType-plain'],\n  accent: styles['SelectTypography--selectType-accent'],\n};\n\nexport interface SelectTypographyProps {\n  selectType?: SelectType;\n  className?: string;\n  children?: React.ReactNode;\n}\n\n/**\n * @private\n */\nexport const SelectTypography = ({\n  selectType = 'default',\n  children,\n  className,\n  ...restProps\n}: SelectTypographyProps) => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  return (\n    <span\n      className={classNames(\n        styles['SelectTypography'],\n        platformClassNames[platform],\n        sizeYClassNames[sizeY],\n        selectTypeClassNames[selectType],\n        className,\n      )}\n      {...restProps}\n    >\n      {children}\n    </span>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAEA;AACA;AAA0D;AAG1D,IAAMA,eAAe,GAAG;EACtBC,IAAI,oCAAwC;EAC5CC,OAAO,uCAA2C;EAClDC,OAAO,EAAE;AACX,CAAC;AAED,IAAMC,kBAA0C,GAAG;EACjDC,KAAK,+BAAmC;EACxCC,OAAO;AACT,CAAC;AAED,IAAMC,oBAAoB,GAAG;EAC3BC,OAAO,4CAAgD;EACvDC,KAAK,0CAA8C;EACnDC,MAAM;AACR,CAAC;AAQD;AACA;AACA;AACO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgB,OAKA;EAAA,2BAJ3BC,UAAU;IAAVA,UAAU,gCAAG,SAAS;IACtBC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,qBAA2B,IAAAC,6BAAa,GAAE;IAAA,sCAAlCC,KAAK;IAALA,KAAK,qCAAG,MAAM;EAEtB,oBACE;IACE,SAAS,EAAE,IAAAC,gBAAU,0BAEnBhB,kBAAkB,CAACY,QAAQ,CAAC,EAC5BhB,eAAe,CAACmB,KAAK,CAAC,EACtBZ,oBAAoB,CAACK,UAAU,CAAC,EAChCE,SAAS;EACT,GACEC,SAAS,GAEZF,QAAQ,CACJ;AAEX,CAAC;AAAC"}

package/dist/cjs/components/Separator/Separator.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from 'react';
 export interface SeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * С этим свойством компонент не будет иметь отступы слева и справа

package/dist/cjs/components/Separator/Separator.js

@@ -9,7 +9,7 @@ exports.Separator = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _excluded = ["wide", "className"];
 /**
  * @see https://vkcom.github.io/VKUI/#/Separator
@@ -19,8 +19,8 @@ var Separator = function Separator(_ref) {
     className = _ref.className,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, restProps, {
-    "aria-hidden": "true",
-    className: (0, _classNames.classNamesString)("vkuiSeparator", !wide && "vkuiSeparator--padded", className),
+    "aria-hidden": true,
+    className: (0, _vkjs.classNames)("vkuiSeparator", !wide && "vkuiSeparator--padded", className),
     role: "separator"
   }), /*#__PURE__*/React.createElement("div", {
     className: "vkuiSeparator__in"

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

@@ -1 +1 @@
-{"version":3,"file":"Separator.js","names":["Separator","wide","className","restProps","classNamesString"],"sources":["../../../../src/components/Separator/Separator.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport styles from \"./Separator.module.css\";\n\nexport interface SeparatorProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * С этим свойством компонент не будет иметь отступы слева и справа\n   */\n  wide?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Separator\n */\nexport const Separator = ({\n  wide,\n  className,\n  ...restProps\n}: SeparatorProps) => (\n  <div\n    {...restProps}\n    aria-hidden=\"true\"\n    className={classNamesString(\n      styles[\"Separator\"],\n      !wide && styles[\"Separator--padded\"],\n      className\n    )}\n    role=\"separator\"\n  >\n    <div className={styles[\"Separator__in\"]} />\n  </div>\n);\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAAwD;AAUxD;AACA;AACA;AACO,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IACpBC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACNC,SAAS;EAAA,oBAEZ,sDACMA,SAAS;IACb,eAAY,MAAM;IAClB,SAAS,EAAE,IAAAC,4BAAgB,mBAEzB,CAACH,IAAI,2BAA+B,EACpCC,SAAS,CACT;IACF,IAAI,EAAC;EAAW,iBAEhB;IAAK,SAAS;EAA0B,EAAG,CACvC;AAAA,CACP;AAAC"}
+{"version":3,"file":"Separator.js","names":["Separator","wide","className","restProps","classNames"],"sources":["../../../../src/components/Separator/Separator.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './Separator.module.css';\n\nexport interface SeparatorProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * С этим свойством компонент не будет иметь отступы слева и справа\n   */\n  wide?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Separator\n */\nexport const Separator = ({ wide, className, ...restProps }: SeparatorProps) => (\n  <div\n    {...restProps}\n    aria-hidden\n    className={classNames(styles['Separator'], !wide && styles['Separator--padded'], className)}\n    role=\"separator\"\n  >\n    <div className={styles['Separator__in']} />\n  </div>\n);\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAA6C;AAU7C;AACA;AACA;AACO,IAAMA,SAAS,GAAG,SAAZA,SAAS;EAAA,IAAMC,IAAI,QAAJA,IAAI;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EAAA,oBACvD,sDACMA,SAAS;IACb,mBAAW;IACX,SAAS,EAAE,IAAAC,gBAAU,mBAAsB,CAACH,IAAI,2BAA+B,EAAEC,SAAS,CAAE;IAC5F,IAAI,EAAC;EAAW,iBAEhB;IAAK,SAAS;EAA0B,EAAG,CACvC;AAAA,CACP;AAAC"}

package/dist/cjs/components/SimpleCell/SimpleCell.d.ts

@@ -1,6 +1,6 @@
-import * as React from "react";
-import { HasComponent } from "../../types";
-import { TappableProps } from "../Tappable/Tappable";
+import * as React from 'react';
+import { HasComponent } from '../../types';
+import { TappableProps } from '../Tappable/Tappable';
 export interface SimpleCellOwnProps extends HasComponent {
     /**
      * Иконка 28 или `<Avatar size={28|32|40|48|72} />`

package/dist/cjs/components/SimpleCell/SimpleCell.js

@@ -9,13 +9,12 @@ exports.SimpleCell = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _classNames = require("../../lib/classNames");
+var _vkjs = require("@vkontakte/vkjs");
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
 var _Tappable = require("../Tappable/Tappable");
 var _icons = require("@vkontakte/icons");
 var _platform = require("../../lib/platform");
 var _usePlatform = require("../../hooks/usePlatform");
-var _utils = require("../../lib/utils");
 var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _Headline = require("../Typography/Headline/Headline");
 var _Subhead = require("../Typography/Subhead/Subhead");
@@ -41,16 +40,16 @@ var SimpleCell = function SimpleCell(_ref) {
     className = _ref.className,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var platform = (0, _usePlatform.usePlatform)();
-  var hasAfter = (0, _utils.hasReactNode)(after) || expandable && platform === _platform.Platform.IOS;
+  var hasAfter = (0, _vkjs.hasReactNode)(after) || expandable && platform === _platform.Platform.IOS;
   var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
     sizeY = _useAdaptivity.sizeY;
   return /*#__PURE__*/React.createElement(_Tappable.Tappable, (0, _extends2.default)({}, restProps, {
-    className: (0, _classNames.classNamesString)("vkuiSimpleCell", (0, _getPlatformClassName.getPlatformClassName)("vkuiSimpleCell", platform), (0, _getSizeYClassName.getSizeYClassName)("vkuiSimpleCell", sizeY), expandable && "vkuiSimpleCell--exp", multiline && "vkuiSimpleCell--mult", className)
+    className: (0, _vkjs.classNames)("vkuiSimpleCell", (0, _getPlatformClassName.getPlatformClassName)("vkuiSimpleCell", platform), (0, _getSizeYClassName.getSizeYClassName)("vkuiSimpleCell", sizeY), expandable && "vkuiSimpleCell--exp", multiline && "vkuiSimpleCell--mult", className)
   }), before, /*#__PURE__*/React.createElement("div", {
     className: "vkuiSimpleCell__main"
   }, subhead && /*#__PURE__*/React.createElement(_Subhead.Subhead, {
     Component: "span",
-    className: (0, _classNames.classNamesString)("vkuiSimpleCell__text", "vkuiSimpleCell__subhead")
+    className: (0, _vkjs.classNames)("vkuiSimpleCell__text", "vkuiSimpleCell__subhead")
   }, subhead), /*#__PURE__*/React.createElement("div", {
     className: "vkuiSimpleCell__content"
   }, badgeBeforeTitle && /*#__PURE__*/React.createElement("span", {
@@ -59,19 +58,19 @@ var SimpleCell = function SimpleCell(_ref) {
     Component: "span",
     className: "vkuiSimpleCell__children",
     weight: "3"
-  }, children), (0, _utils.hasReactNode)(badgeAfterTitle) && /*#__PURE__*/React.createElement("span", {
+  }, children), (0, _vkjs.hasReactNode)(badgeAfterTitle) && /*#__PURE__*/React.createElement("span", {
     className: "vkuiSimpleCell__badge"
   }, badgeAfterTitle)), subtitle && /*#__PURE__*/React.createElement("div", {
     className: "vkuiSimpleCell__content"
   }, badgeBeforeSubtitle && /*#__PURE__*/React.createElement("span", {
     className: "vkuiSimpleCell__badge"
   }, badgeBeforeSubtitle), /*#__PURE__*/React.createElement("span", {
-    className: (0, _classNames.classNamesString)("vkuiSimpleCell__typography", "vkuiSimpleCell__text", "vkuiSimpleCell__subtitle")
+    className: (0, _vkjs.classNames)("vkuiSimpleCell__typography", "vkuiSimpleCell__text", "vkuiSimpleCell__subtitle")
   }, subtitle), badgeAfterSubtitle && /*#__PURE__*/React.createElement("span", {
     className: "vkuiSimpleCell__badge"
   }, badgeAfterSubtitle)), extraSubtitle && /*#__PURE__*/React.createElement("span", {
-    className: (0, _classNames.classNamesString)("vkuiSimpleCell__typography", "vkuiSimpleCell__text", "vkuiSimpleCell__extraSubtitle")
-  }, extraSubtitle)), (0, _utils.hasReactNode)(indicator) && /*#__PURE__*/React.createElement(_Headline.Headline, {
+    className: (0, _vkjs.classNames)("vkuiSimpleCell__typography", "vkuiSimpleCell__text", "vkuiSimpleCell__extraSubtitle")
+  }, extraSubtitle)), (0, _vkjs.hasReactNode)(indicator) && /*#__PURE__*/React.createElement(_Headline.Headline, {
     Component: "span",
     weight: "3",
     className: "vkuiSimpleCell__indicator"

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

@@ -1 +1 @@
-{"version":3,"file":"SimpleCell.js","names":["SimpleCell","badgeBeforeTitle","badgeAfterTitle","badgeBeforeSubtitle","badgeAfterSubtitle","before","indicator","children","after","expandable","multiline","subhead","subtitle","extraSubtitle","className","restProps","platform","usePlatform","hasAfter","hasReactNode","Platform","IOS","useAdaptivity","sizeY","classNamesString","getPlatformClassName","getSizeYClassName"],"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { classNamesString } from \"../../lib/classNames\";\nimport { getPlatformClassName } from \"../../helpers/getPlatformClassName\";\nimport { TappableProps, Tappable } from \"../Tappable/Tappable\";\nimport { Icon24Chevron } from \"@vkontakte/icons\";\nimport { Platform } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { Headline } from \"../Typography/Headline/Headline\";\nimport { Subhead } from \"../Typography/Subhead/Subhead\";\nimport { getSizeYClassName } from \"../../helpers/getSizeYClassName\";\nimport styles from \"./SimpleCell.module.css\";\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится слева от текста `children`.\n   */\n  badgeBeforeTitle?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badgeAfterTitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится слева от текста `subtitle`.\n   */\n  badgeBeforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится справа от текста `subtitle`.\n   */\n  badgeAfterSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Дополнительная строка текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  /**\n   * Включает многострочный режим для отображения текста\n   */\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SimpleCell\n */\nexport const SimpleCell = ({\n  badgeBeforeTitle,\n  badgeAfterTitle,\n  badgeBeforeSubtitle,\n  badgeAfterSubtitle,\n  before,\n  indicator,\n  children,\n  after,\n  expandable,\n  multiline,\n  subhead,\n  subtitle,\n  extraSubtitle,\n  className,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter =\n    hasReactNode(after) || (expandable && platform === Platform.IOS);\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNamesString(\n        styles[\"SimpleCell\"],\n        getPlatformClassName(styles[\"SimpleCell\"], platform),\n        getSizeYClassName(styles[\"SimpleCell\"], sizeY),\n        expandable && styles[\"SimpleCell--exp\"],\n        multiline && styles[\"SimpleCell--mult\"],\n        className\n      )}\n    >\n      {before}\n      <div className={styles[\"SimpleCell__main\"]}>\n        {subhead && (\n          <Subhead\n            Component=\"span\"\n            className={classNamesString(\n              styles[\"SimpleCell__text\"],\n              styles[\"SimpleCell__subhead\"]\n            )}\n          >\n            {subhead}\n          </Subhead>\n        )}\n        <div className={styles[\"SimpleCell__content\"]}>\n          {badgeBeforeTitle && (\n            <span className={styles[\"SimpleCell__badge\"]}>\n              {badgeBeforeTitle}\n            </span>\n          )}\n          <Headline\n            Component=\"span\"\n            className={styles[\"SimpleCell__children\"]}\n            weight=\"3\"\n          >\n            {children}\n          </Headline>\n          {hasReactNode(badgeAfterTitle) && (\n            <span className={styles[\"SimpleCell__badge\"]}>\n              {badgeAfterTitle}\n            </span>\n          )}\n        </div>\n        {subtitle && (\n          <div className={styles[\"SimpleCell__content\"]}>\n            {badgeBeforeSubtitle && (\n              <span className={styles[\"SimpleCell__badge\"]}>\n                {badgeBeforeSubtitle}\n              </span>\n            )}\n            <span\n              className={classNamesString(\n                styles[\"SimpleCell__typography\"],\n                styles[\"SimpleCell__text\"],\n                styles[\"SimpleCell__subtitle\"]\n              )}\n            >\n              {subtitle}\n            </span>\n            {badgeAfterSubtitle && (\n              <span className={styles[\"SimpleCell__badge\"]}>\n                {badgeAfterSubtitle}\n              </span>\n            )}\n          </div>\n        )}\n        {extraSubtitle && (\n          <span\n            className={classNamesString(\n              styles[\"SimpleCell__typography\"],\n              styles[\"SimpleCell__text\"],\n              styles[\"SimpleCell__extraSubtitle\"]\n            )}\n          >\n            {extraSubtitle}\n          </span>\n        )}\n      </div>\n      {hasReactNode(indicator) && (\n        <Headline\n          Component=\"span\"\n          weight=\"3\"\n          className={styles[\"SimpleCell__indicator\"]}\n        >\n          {indicator}\n        </Headline>\n      )}\n      {hasAfter && (\n        <div className={styles[\"SimpleCell__after\"]}>\n          {after}\n          {expandable && platform === Platform.IOS && <Icon24Chevron />}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;AA4DpE;AACA;AACA;AACO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAgBA;EAAA,IAfrBC,gBAAgB,QAAhBA,gBAAgB;IAChBC,eAAe,QAAfA,eAAe;IACfC,mBAAmB,QAAnBA,mBAAmB;IACnBC,kBAAkB,QAAlBA,kBAAkB;IAClBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,aAAa,QAAbA,aAAa;IACbC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMC,QAAQ,GACZ,IAAAC,mBAAY,EAACX,KAAK,CAAC,IAAKC,UAAU,IAAIO,QAAQ,KAAKI,kBAAQ,CAACC,GAAI;EAClE,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,kBAAQ,6BACHR,SAAS;IACb,SAAS,EAAE,IAAAS,4BAAgB,oBAEzB,IAAAC,0CAAoB,oBAAuBT,QAAQ,CAAC,EACpD,IAAAU,oCAAiB,oBAAuBH,KAAK,CAAC,EAC9Cd,UAAU,yBAA6B,EACvCC,SAAS,0BAA8B,EACvCI,SAAS;EACT,IAEDT,MAAM,eACP;IAAK,SAAS;EAA6B,GACxCM,OAAO,iBACN,oBAAC,gBAAO;IACN,SAAS,EAAC,MAAM;IAChB,SAAS,EAAE,IAAAa,4BAAgB;EAGzB,GAEDb,OAAO,CAEX,eACD;IAAK,SAAS;EAAgC,GAC3CV,gBAAgB,iBACf;IAAM,SAAS;EAA8B,GAC1CA,gBAAgB,CAEpB,eACD,oBAAC,kBAAQ;IACP,SAAS,EAAC,MAAM;IAChB,SAAS,4BAAiC;IAC1C,MAAM,EAAC;EAAG,GAETM,QAAQ,CACA,EACV,IAAAY,mBAAY,EAACjB,eAAe,CAAC,iBAC5B;IAAM,SAAS;EAA8B,GAC1CA,eAAe,CAEnB,CACG,EACLU,QAAQ,iBACP;IAAK,SAAS;EAAgC,GAC3CT,mBAAmB,iBAClB;IAAM,SAAS;EAA8B,GAC1CA,mBAAmB,CAEvB,eACD;IACE,SAAS,EAAE,IAAAqB,4BAAgB;EAIzB,GAEDZ,QAAQ,CACJ,EACNR,kBAAkB,iBACjB;IAAM,SAAS;EAA8B,GAC1CA,kBAAkB,CAEtB,CAEJ,EACAS,aAAa,iBACZ;IACE,SAAS,EAAE,IAAAW,4BAAgB;EAIzB,GAEDX,aAAa,CAEjB,CACG,EACL,IAAAM,mBAAY,EAACb,SAAS,CAAC,iBACtB,oBAAC,kBAAQ;IACP,SAAS,EAAC,MAAM;IAChB,MAAM,EAAC,GAAG;IACV,SAAS;EAAkC,GAE1CA,SAAS,CAEb,EACAY,QAAQ,iBACP;IAAK,SAAS;EAA8B,GACzCV,KAAK,EACLC,UAAU,IAAIO,QAAQ,KAAKI,kBAAQ,CAACC,GAAG,iBAAI,oBAAC,oBAAa,OAAG,CAEhE,CACQ;AAEf,CAAC;AAAC"}
+{"version":3,"file":"SimpleCell.js","names":["SimpleCell","badgeBeforeTitle","badgeAfterTitle","badgeBeforeSubtitle","badgeAfterSubtitle","before","indicator","children","after","expandable","multiline","subhead","subtitle","extraSubtitle","className","restProps","platform","usePlatform","hasAfter","hasReactNode","Platform","IOS","useAdaptivity","sizeY","classNames","getPlatformClassName","getSizeYClassName"],"sources":["../../../../src/components/SimpleCell/SimpleCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HasComponent } from '../../types';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { TappableProps, Tappable } from '../Tappable/Tappable';\nimport { Icon24Chevron } from '@vkontakte/icons';\nimport { Platform } from '../../lib/platform';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './SimpleCell.module.css';\n\nexport interface SimpleCellOwnProps extends HasComponent {\n  /**\n   * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n   */\n  before?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится слева от текста `children`.\n   */\n  badgeBeforeTitle?: React.ReactNode;\n  /**\n   * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n   */\n  badgeAfterTitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится слева от текста `subtitle`.\n   */\n  badgeBeforeSubtitle?: React.ReactNode;\n  /**\n   * Иконка 12. Добавится справа от текста `subtitle`.\n   */\n  badgeAfterSubtitle?: React.ReactNode;\n  /**\n   * Контейнер для текста справа от `children`.\n   */\n  indicator?: React.ReactNode;\n  /**\n   * Дополнительная строка текста над `children`.\n   */\n  subhead?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n   */\n  after?: React.ReactNode;\n  /**\n   * Убирает анимацию нажатия\n   */\n  disabled?: boolean;\n  /**\n   * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n   */\n  expandable?: boolean;\n  /**\n   * Включает многострочный режим для отображения текста\n   */\n  multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/SimpleCell\n */\nexport const SimpleCell = ({\n  badgeBeforeTitle,\n  badgeAfterTitle,\n  badgeBeforeSubtitle,\n  badgeAfterSubtitle,\n  before,\n  indicator,\n  children,\n  after,\n  expandable,\n  multiline,\n  subhead,\n  subtitle,\n  extraSubtitle,\n  className,\n  ...restProps\n}: SimpleCellProps) => {\n  const platform = usePlatform();\n  const hasAfter = hasReactNode(after) || (expandable && platform === Platform.IOS);\n  const { sizeY } = useAdaptivity();\n\n  return (\n    <Tappable\n      {...restProps}\n      className={classNames(\n        styles['SimpleCell'],\n        getPlatformClassName(styles['SimpleCell'], platform),\n        getSizeYClassName(styles['SimpleCell'], sizeY),\n        expandable && styles['SimpleCell--exp'],\n        multiline && styles['SimpleCell--mult'],\n        className,\n      )}\n    >\n      {before}\n      <div className={styles['SimpleCell__main']}>\n        {subhead && (\n          <Subhead\n            Component=\"span\"\n            className={classNames(styles['SimpleCell__text'], styles['SimpleCell__subhead'])}\n          >\n            {subhead}\n          </Subhead>\n        )}\n        <div className={styles['SimpleCell__content']}>\n          {badgeBeforeTitle && (\n            <span className={styles['SimpleCell__badge']}>{badgeBeforeTitle}</span>\n          )}\n          <Headline Component=\"span\" className={styles['SimpleCell__children']} weight=\"3\">\n            {children}\n          </Headline>\n          {hasReactNode(badgeAfterTitle) && (\n            <span className={styles['SimpleCell__badge']}>{badgeAfterTitle}</span>\n          )}\n        </div>\n        {subtitle && (\n          <div className={styles['SimpleCell__content']}>\n            {badgeBeforeSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeBeforeSubtitle}</span>\n            )}\n            <span\n              className={classNames(\n                styles['SimpleCell__typography'],\n                styles['SimpleCell__text'],\n                styles['SimpleCell__subtitle'],\n              )}\n            >\n              {subtitle}\n            </span>\n            {badgeAfterSubtitle && (\n              <span className={styles['SimpleCell__badge']}>{badgeAfterSubtitle}</span>\n            )}\n          </div>\n        )}\n        {extraSubtitle && (\n          <span\n            className={classNames(\n              styles['SimpleCell__typography'],\n              styles['SimpleCell__text'],\n              styles['SimpleCell__extraSubtitle'],\n            )}\n          >\n            {extraSubtitle}\n          </span>\n        )}\n      </div>\n      {hasReactNode(indicator) && (\n        <Headline Component=\"span\" weight=\"3\" className={styles['SimpleCell__indicator']}>\n          {indicator}\n        </Headline>\n      )}\n      {hasAfter && (\n        <div className={styles['SimpleCell__after']}>\n          {after}\n          {expandable && platform === Platform.IOS && <Icon24Chevron />}\n        </div>\n      )}\n    </Tappable>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAoE;AA4DpE;AACA;AACA;AACO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAgBA;EAAA,IAfrBC,gBAAgB,QAAhBA,gBAAgB;IAChBC,eAAe,QAAfA,eAAe;IACfC,mBAAmB,QAAnBA,mBAAmB;IACnBC,kBAAkB,QAAlBA,kBAAkB;IAClBC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,OAAO,QAAPA,OAAO;IACPC,QAAQ,QAARA,QAAQ;IACRC,aAAa,QAAbA,aAAa;IACbC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMC,QAAQ,GAAG,IAAAC,kBAAY,EAACX,KAAK,CAAC,IAAKC,UAAU,IAAIO,QAAQ,KAAKI,kBAAQ,CAACC,GAAI;EACjF,qBAAkB,IAAAC,6BAAa,GAAE;IAAzBC,KAAK,kBAALA,KAAK;EAEb,oBACE,oBAAC,kBAAQ,6BACHR,SAAS;IACb,SAAS,EAAE,IAAAS,gBAAU,oBAEnB,IAAAC,0CAAoB,oBAAuBT,QAAQ,CAAC,EACpD,IAAAU,oCAAiB,oBAAuBH,KAAK,CAAC,EAC9Cd,UAAU,yBAA6B,EACvCC,SAAS,0BAA8B,EACvCI,SAAS;EACT,IAEDT,MAAM,eACP;IAAK,SAAS;EAA6B,GACxCM,OAAO,iBACN,oBAAC,gBAAO;IACN,SAAS,EAAC,MAAM;IAChB,SAAS,EAAE,IAAAa,gBAAU;EAA4D,GAEhFb,OAAO,CAEX,eACD;IAAK,SAAS;EAAgC,GAC3CV,gBAAgB,iBACf;IAAM,SAAS;EAA8B,GAAEA,gBAAgB,CAChE,eACD,oBAAC,kBAAQ;IAAC,SAAS,EAAC,MAAM;IAAC,SAAS,4BAAiC;IAAC,MAAM,EAAC;EAAG,GAC7EM,QAAQ,CACA,EACV,IAAAY,kBAAY,EAACjB,eAAe,CAAC,iBAC5B;IAAM,SAAS;EAA8B,GAAEA,eAAe,CAC/D,CACG,EACLU,QAAQ,iBACP;IAAK,SAAS;EAAgC,GAC3CT,mBAAmB,iBAClB;IAAM,SAAS;EAA8B,GAAEA,mBAAmB,CACnE,eACD;IACE,SAAS,EAAE,IAAAqB,gBAAU;EAInB,GAEDZ,QAAQ,CACJ,EACNR,kBAAkB,iBACjB;IAAM,SAAS;EAA8B,GAAEA,kBAAkB,CAClE,CAEJ,EACAS,aAAa,iBACZ;IACE,SAAS,EAAE,IAAAW,gBAAU;EAInB,GAEDX,aAAa,CAEjB,CACG,EACL,IAAAM,kBAAY,EAACb,SAAS,CAAC,iBACtB,oBAAC,kBAAQ;IAAC,SAAS,EAAC,MAAM;IAAC,MAAM,EAAC,GAAG;IAAC,SAAS;EAAkC,GAC9EA,SAAS,CAEb,EACAY,QAAQ,iBACP;IAAK,SAAS;EAA8B,GACzCV,KAAK,EACLC,UAAU,IAAIO,QAAQ,KAAKI,kBAAQ,CAACC,GAAG,iBAAI,oBAAC,oBAAa,OAAG,CAEhE,CACQ;AAEf,CAAC;AAAC"}

package/dist/cjs/components/Slider/Slider.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { UniversalSliderProps } from "../RangeSlider/UniversalSlider";
+import { UniversalSliderProps } from '../RangeSlider/UniversalSlider';
 export declare type SliderProps = UniversalSliderProps<number>;
 /**
  * @see https://vkcom.github.io/VKUI/#/Slider
  */
-export declare const Slider: ({ onChange, defaultValue, min, max, value, ...props }: SliderProps) => JSX.Element;
+export declare const Slider: ({ onChange, min, max, defaultValue, value, ...props }: SliderProps) => JSX.Element;

package/dist/cjs/components/Slider/Slider.js

@@ -12,22 +12,22 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var React = _interopRequireWildcard(require("react"));
 var _math = require("../../helpers/math");
 var _UniversalSlider = require("../RangeSlider/UniversalSlider");
-var _excluded = ["onChange", "defaultValue", "min", "max", "value"];
+var _excluded = ["onChange", "min", "max", "defaultValue", "value"];
 /**
  * @see https://vkcom.github.io/VKUI/#/Slider
  */
 var Slider = function Slider(_ref) {
   var onChange = _ref.onChange,
-    defaultValue = _ref.defaultValue,
     _ref$min = _ref.min,
     min = _ref$min === void 0 ? 0 : _ref$min,
     _ref$max = _ref.max,
     max = _ref$max === void 0 ? 100 : _ref$max,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? 0 : _ref$value,
+    _ref$defaultValue = _ref.defaultValue,
+    defaultValue = _ref$defaultValue === void 0 ? min : _ref$defaultValue,
+    value = _ref.value,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var isControlled = value != null;
-  var _React$useState = React.useState(defaultValue == null ? min : defaultValue),
+  var isControlled = value !== undefined;
+  var _React$useState = React.useState(defaultValue),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     localValue = _React$useState2[0],
     setValue = _React$useState2[1];

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

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","names":["Slider","onChange","defaultValue","min","max","value","props","isControlled","React","useState","localValue","setValue","_value","clamp","handleChange","useCallback","nextValue","event","disabled","rangeValue","useMemo"],"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { clamp } from \"../../helpers/math\";\nimport {\n  UniversalSlider,\n  UniversalSliderProps,\n  UniversalValue,\n} from \"../RangeSlider/UniversalSlider\";\nimport { TouchEvent } from \"../Touch/Touch\";\n\nexport type SliderProps = UniversalSliderProps<number>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  onChange,\n  defaultValue,\n  min = 0,\n  max = 100,\n  value = 0,\n  ...props\n}: SliderProps) => {\n  const isControlled = value != null;\n\n  const [localValue, setValue] = React.useState(\n    defaultValue == null ? min : defaultValue\n  );\n  const _value = clamp(isControlled ? value : localValue, min, max);\n\n  const handleChange: UniversalSliderProps<UniversalValue>[\"onChange\"] =\n    React.useCallback(\n      (nextValue: UniversalValue, event: TouchEvent) => {\n        if (props.disabled || _value === nextValue[1]) {\n          return;\n        }\n        !isControlled && setValue(nextValue[1]);\n        onChange && onChange(nextValue[1], event);\n      },\n      [props.disabled, _value, isControlled, onChange]\n    );\n\n  const rangeValue: [null, number] = React.useMemo(\n    () => [null, _value],\n    [_value]\n  );\n  return (\n    <UniversalSlider\n      {...props}\n      value={rangeValue}\n      onChange={handleChange}\n      min={min}\n      max={max}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAIwC;AAKxC;AACA;AACA;AACO,IAAMA,MAAM,GAAG,SAATA,MAAM,OAOA;EAAA,IANjBC,QAAQ,QAARA,QAAQ;IACRC,YAAY,QAAZA,YAAY;IAAA,gBACZC,GAAG;IAAHA,GAAG,yBAAG,CAAC;IAAA,gBACPC,GAAG;IAAHA,GAAG,yBAAG,GAAG;IAAA,kBACTC,KAAK;IAALA,KAAK,2BAAG,CAAC;IACNC,KAAK;EAER,IAAMC,YAAY,GAAGF,KAAK,IAAI,IAAI;EAElC,sBAA+BG,KAAK,CAACC,QAAQ,CAC3CP,YAAY,IAAI,IAAI,GAAGC,GAAG,GAAGD,YAAY,CAC1C;IAAA;IAFMQ,UAAU;IAAEC,QAAQ;EAG3B,IAAMC,MAAM,GAAG,IAAAC,WAAK,EAACN,YAAY,GAAGF,KAAK,GAAGK,UAAU,EAAEP,GAAG,EAAEC,GAAG,CAAC;EAEjE,IAAMU,YAA8D,GAClEN,KAAK,CAACO,WAAW,CACf,UAACC,SAAyB,EAAEC,KAAiB,EAAK;IAChD,IAAIX,KAAK,CAACY,QAAQ,IAAIN,MAAM,KAAKI,SAAS,CAAC,CAAC,CAAC,EAAE;MAC7C;IACF;IACA,CAACT,YAAY,IAAII,QAAQ,CAACK,SAAS,CAAC,CAAC,CAAC,CAAC;IACvCf,QAAQ,IAAIA,QAAQ,CAACe,SAAS,CAAC,CAAC,CAAC,EAAEC,KAAK,CAAC;EAC3C,CAAC,EACD,CAACX,KAAK,CAACY,QAAQ,EAAEN,MAAM,EAAEL,YAAY,EAAEN,QAAQ,CAAC,CACjD;EAEH,IAAMkB,UAA0B,GAAGX,KAAK,CAACY,OAAO,CAC9C;IAAA,OAAM,CAAC,IAAI,EAAER,MAAM,CAAC;EAAA,GACpB,CAACA,MAAM,CAAC,CACT;EACD,oBACE,oBAAC,gCAAe,6BACVN,KAAK;IACT,KAAK,EAAEa,UAAW;IAClB,QAAQ,EAAEL,YAAa;IACvB,GAAG,EAAEX,GAAI;IACT,GAAG,EAAEC;EAAI,GACT;AAEN,CAAC;AAAC"}
+{"version":3,"file":"Slider.js","names":["Slider","onChange","min","max","defaultValue","value","props","isControlled","undefined","React","useState","localValue","setValue","_value","clamp","handleChange","useCallback","nextValue","event","disabled","rangeValue","useMemo"],"sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport {\n  UniversalSlider,\n  UniversalSliderProps,\n  UniversalValue,\n} from '../RangeSlider/UniversalSlider';\nimport { TouchEvent } from '../Touch/Touch';\n\nexport type SliderProps = UniversalSliderProps<number>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Slider\n */\nexport const Slider = ({\n  onChange,\n  min = 0,\n  max = 100,\n  defaultValue = min,\n  value,\n  ...props\n}: SliderProps) => {\n  const isControlled = value !== undefined;\n\n  const [localValue, setValue] = React.useState(defaultValue);\n  const _value = clamp(isControlled ? value : localValue, min, max);\n\n  const handleChange: UniversalSliderProps<UniversalValue>['onChange'] = React.useCallback(\n    (nextValue: UniversalValue, event: TouchEvent) => {\n      if (props.disabled || _value === nextValue[1]) {\n        return;\n      }\n      !isControlled && setValue(nextValue[1]);\n      onChange && onChange(nextValue[1], event);\n    },\n    [props.disabled, _value, isControlled, onChange],\n  );\n\n  const rangeValue: [null, number] = React.useMemo(() => [null, _value], [_value]);\n  return (\n    <UniversalSlider {...props} value={rangeValue} onChange={handleChange} min={min} max={max} />\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAIwC;AAKxC;AACA;AACA;AACO,IAAMA,MAAM,GAAG,SAATA,MAAM,OAOA;EAAA,IANjBC,QAAQ,QAARA,QAAQ;IAAA,gBACRC,GAAG;IAAHA,GAAG,yBAAG,CAAC;IAAA,gBACPC,GAAG;IAAHA,GAAG,yBAAG,GAAG;IAAA,yBACTC,YAAY;IAAZA,YAAY,kCAAGF,GAAG;IAClBG,KAAK,QAALA,KAAK;IACFC,KAAK;EAER,IAAMC,YAAY,GAAGF,KAAK,KAAKG,SAAS;EAExC,sBAA+BC,KAAK,CAACC,QAAQ,CAACN,YAAY,CAAC;IAAA;IAApDO,UAAU;IAAEC,QAAQ;EAC3B,IAAMC,MAAM,GAAG,IAAAC,WAAK,EAACP,YAAY,GAAGF,KAAK,GAAGM,UAAU,EAAET,GAAG,EAAEC,GAAG,CAAC;EAEjE,IAAMY,YAA8D,GAAGN,KAAK,CAACO,WAAW,CACtF,UAACC,SAAyB,EAAEC,KAAiB,EAAK;IAChD,IAAIZ,KAAK,CAACa,QAAQ,IAAIN,MAAM,KAAKI,SAAS,CAAC,CAAC,CAAC,EAAE;MAC7C;IACF;IACA,CAACV,YAAY,IAAIK,QAAQ,CAACK,SAAS,CAAC,CAAC,CAAC,CAAC;IACvChB,QAAQ,IAAIA,QAAQ,CAACgB,SAAS,CAAC,CAAC,CAAC,EAAEC,KAAK,CAAC;EAC3C,CAAC,EACD,CAACZ,KAAK,CAACa,QAAQ,EAAEN,MAAM,EAAEN,YAAY,EAAEN,QAAQ,CAAC,CACjD;EAED,IAAMmB,UAA0B,GAAGX,KAAK,CAACY,OAAO,CAAC;IAAA,OAAM,CAAC,IAAI,EAAER,MAAM,CAAC;EAAA,GAAE,CAACA,MAAM,CAAC,CAAC;EAChF,oBACE,oBAAC,gCAAe,6BAAKP,KAAK;IAAE,KAAK,EAAEc,UAAW;IAAC,QAAQ,EAAEL,YAAa;IAAC,GAAG,EAAEb,GAAI;IAAC,GAAG,EAAEC;EAAI,GAAG;AAEjG,CAAC;AAAC"}

package/dist/cjs/components/Snackbar/Snackbar.d.ts

@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from 'react';
 export interface SnackbarProps extends React.HTMLAttributes<HTMLElement> {
     /**
      * Название кнопки действия в уведомлении
@@ -21,7 +21,7 @@ export interface SnackbarProps extends React.HTMLAttributes<HTMLElement> {
      * Варианты расположения кнопки действия
      * Игнорируется на десктопах и при наличии элементов `after` или `subtitle`
      */
-    layout?: "vertical" | "horizontal";
+    layout?: 'vertical' | 'horizontal';
     /**
      * Время в миллисекундах, через которое плашка скроется
      */
@@ -33,7 +33,7 @@ export interface SnackbarProps extends React.HTMLAttributes<HTMLElement> {
     /**
      * Задает стиль снекбара
      */
-    mode?: "default" | "dark";
+    mode?: 'default' | 'dark';
     /**
      * Дополнительная строка текста под `children`.
      * Не может использоваться одновременно с `action`