@vkontakte/vkui 6.0.2 → 6.1.0

package/dist/cssm/components/InfoRow/InfoRow.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames, hasReactNode } from '@vkontakte/vkjs';
 import { Headline } from '../Typography/Headline/Headline';
@@ -6,14 +7,24 @@ import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';
 import styles from './InfoRow.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/InfoRow
- */ export const InfoRow = ({ header, children, className, ...restProps })=>/*#__PURE__*/ React.createElement(Headline, {
+ */ export const InfoRow = ({ header, children, className, ...restProps })=>/*#__PURE__*/ _jsxs(Headline, {
         ...restProps,
         Component: "span",
         className: classNames(styles['InfoRow'], className),
-        weight: "3"
-    }, hasReactNode(header) && /*#__PURE__*/ React.createElement(Subhead, {
-        Component: "strong",
-        className: styles['InfoRow__header']
-    }, header, /*#__PURE__*/ React.createElement(VisuallyHidden, null, " ")), children);
+        weight: "3",
+        children: [
+            hasReactNode(header) && /*#__PURE__*/ _jsxs(Subhead, {
+                Component: "strong",
+                className: styles['InfoRow__header'],
+                children: [
+                    header,
+                    /*#__PURE__*/ _jsx(VisuallyHidden, {
+                        children: " "
+                    })
+                ]
+            }),
+            children
+        ]
+    });
 
 //# sourceMappingURL=InfoRow.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InfoRow.module.css';\n\nexport interface InfoRowProps extends HTMLAttributesWithRootRef<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=\"strong\" className={styles['InfoRow__header']}>\n        {header}\n        <VisuallyHidden>&nbsp;</VisuallyHidden>\n      </Subhead>\n    )}\n    {children}\n  </Headline>\n);\n"],"names":["React","classNames","hasReactNode","Headline","Subhead","VisuallyHidden","styles","InfoRow","header","children","className","restProps","Component","weight"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,uBAAuB;AAM1C;;CAEC,GACD,OAAO,MAAMC,UAAU,CAAC,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAyB,iBACjF,oBAACR;QACE,GAAGQ,SAAS;QACbC,WAAU;QACVF,WAAWT,WAAWK,MAAM,CAAC,UAAU,EAAEI;QACzCG,QAAO;OAENX,aAAaM,yBACZ,oBAACJ;QAAQQ,WAAU;QAASF,WAAWJ,MAAM,CAAC,kBAAkB;OAC7DE,sBACD,oBAACH,sBAAe,OAGnBI,UAEH"}
+{"version":3,"sources":["../../../../src/components/InfoRow/InfoRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InfoRow.module.css';\n\nexport interface InfoRowProps extends HTMLAttributesWithRootRef<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=\"strong\" className={styles['InfoRow__header']}>\n        {header}\n        <VisuallyHidden>&nbsp;</VisuallyHidden>\n      </Subhead>\n    )}\n    {children}\n  </Headline>\n);\n"],"names":["React","classNames","hasReactNode","Headline","Subhead","VisuallyHidden","styles","InfoRow","header","children","className","restProps","Component","weight"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,uBAAuB;AAM1C;;CAEC,GACD,OAAO,MAAMC,UAAU,CAAC,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAyB,iBACjF,MAACR;QACE,GAAGQ,SAAS;QACbC,WAAU;QACVF,WAAWT,WAAWK,MAAM,CAAC,UAAU,EAAEI;QACzCG,QAAO;;YAENX,aAAaM,yBACZ,MAACJ;gBAAQQ,WAAU;gBAASF,WAAWJ,MAAM,CAAC,kBAAkB;;oBAC7DE;kCACD,KAACH;kCAAe;;;;YAGnBI;;OAEH"}

package/dist/cssm/components/Input/Input.d.ts

@@ -6,5 +6,5 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>,
 /**
  * @see https://vkcom.github.io/VKUI/#/Input
  */
-export declare const Input: ({ type, align, getRef, className, getRootRef, style, before, after, status, mode, ...restProps }: InputProps) => React.JSX.Element;
+export declare const Input: ({ type, align, getRef, className, getRootRef, style, before, after, status, mode, ...restProps }: InputProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Input.d.ts.map

package/dist/cssm/components/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAa,cAAc,EAAE,MAAM,wBAAwB,CAAC;AASnE,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,MAAM,CAAC,gBAAgB,CAAC,EACxB,UAAU,CAAC,cAAc,CAAC,EAC1B,QAAQ,EACR,cAAc;CAAG;AAErB;;GAEG;AACH,eAAO,MAAM,KAAK,qGAYf,UAAU,sBAgCZ,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,EAAa,cAAc,EAAE,MAAM,wBAAwB,CAAC;AASnE,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,MAAM,CAAC,gBAAgB,CAAC,EACxB,UAAU,CAAC,cAAc,CAAC,EAC1B,QAAQ,EACR,cAAc;CAAG;AAErB;;GAEG;AACH,eAAO,MAAM,KAAK,qGAYf,UAAU,4CA+BZ,CAAC"}

package/dist/cssm/components/Input/Input.js

@@ -1,8 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import { useAdaptivity } from '../../hooks/useAdaptivity';
 import { FormField } from '../FormField/FormField';
-import { Text } from '../Typography/Text/Text';
+import { UnstyledTextField } from '../UnstyledTextField/UnstyledTextField';
 import styles from './Input.module.css';
 const sizeYClassNames = {
     none: styles['Input--sizeY-none'],
@@ -12,7 +13,7 @@ const sizeYClassNames = {
  * @see https://vkcom.github.io/VKUI/#/Input
  */ export const Input = ({ type = 'text', align = 'left', getRef, className, getRootRef, style, before, after, status, mode, ...restProps })=>{
     const { sizeY = 'none' } = useAdaptivity();
-    return /*#__PURE__*/ React.createElement(FormField, {
+    return /*#__PURE__*/ _jsx(FormField, {
         style: style,
         className: classNames(styles['Input'], align === 'right' && styles['Input--align-right'], align === 'center' && styles['Input--align-center'], sizeY !== 'regular' && sizeYClassNames[sizeY], before && styles['Input--hasBefore'], after && styles['Input--hasAfter'], className),
         getRootRef: getRootRef,
@@ -20,15 +21,15 @@ const sizeYClassNames = {
         after: after,
         disabled: restProps.disabled,
         mode: mode,
-        status: status
-    }, /*#__PURE__*/ React.createElement(Text, {
-        ...restProps,
-        Component: "input",
-        normalize: false,
-        type: type,
-        className: styles['Input__el'],
-        getRootRef: getRef
-    }));
+        status: status,
+        children: /*#__PURE__*/ _jsx(UnstyledTextField, {
+            ...restProps,
+            as: "input",
+            type: type,
+            className: styles['Input__el'],
+            getRootRef: getRef
+        })
+    });
 };
 
 //# sourceMappingURL=Input.js.map

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

@@ -1 +1 @@
-{"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 { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  ['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 !== '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      <Text\n        {...restProps}\n        Component=\"input\"\n        normalize={false}\n        type={type}\n        className={styles['Input__el']}\n        getRootRef={getRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","FormField","Text","styles","sizeYClassNames","none","Input","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","sizeY","disabled","Component","normalize"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,oBAAoB;IACjC,CAAC,UAAU,EAAEA,MAAM,CAAC,uBAAuB;AAC7C;AASA;;CAEC,GACD,OAAO,MAAMG,QAAQ,CAAC,EACpBC,OAAO,MAAM,EACbC,QAAQ,MAAM,EACdC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,KAAK,EACLC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,IAAI,EACJ,GAAGC,WACQ;IACX,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGlB;IAE3B,qBACE,oBAACC;QACCW,OAAOA;QACPF,WAAWX,WACTI,MAAM,CAAC,QAAQ,EACfK,UAAU,WAAWL,MAAM,CAAC,qBAAqB,EACjDK,UAAU,YAAYL,MAAM,CAAC,sBAAsB,EACnDe,UAAU,aAAad,eAAe,CAACc,MAAM,EAC7CL,UAAUV,MAAM,CAAC,mBAAmB,EACpCW,SAASX,MAAM,CAAC,kBAAkB,EAClCO;QAEFC,YAAYA;QACZE,QAAQA;QACRC,OAAOA;QACPK,UAAUF,UAAUE,QAAQ;QAC5BH,MAAMA;QACND,QAAQA;qBAER,oBAACb;QACE,GAAGe,SAAS;QACbG,WAAU;QACVC,WAAW;QACXd,MAAMA;QACNG,WAAWP,MAAM,CAAC,YAAY;QAC9BQ,YAAYF;;AAIpB,EAAE"}
+{"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 { HasAlign, HasRef, HasRootRef } from '../../types';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { UnstyledTextField } from '../UnstyledTextField/UnstyledTextField';\nimport styles from './Input.module.css';\n\nconst sizeYClassNames = {\n  none: styles['Input--sizeY-none'],\n  ['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 !== '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      <UnstyledTextField\n        {...restProps}\n        as=\"input\"\n        type={type}\n        className={styles['Input__el']}\n        getRootRef={getRef}\n      />\n    </FormField>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","FormField","UnstyledTextField","styles","sizeYClassNames","none","Input","type","align","getRef","className","getRootRef","style","before","after","status","mode","restProps","sizeY","disabled","as"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,4BAA4B;AAE1D,SAASC,SAAS,QAAwB,yBAAyB;AACnE,SAASC,iBAAiB,QAAQ,yCAAyC;AAC3E,OAAOC,YAAY,qBAAqB;AAExC,MAAMC,kBAAkB;IACtBC,MAAMF,MAAM,CAAC,oBAAoB;IACjC,CAAC,UAAU,EAAEA,MAAM,CAAC,uBAAuB;AAC7C;AASA;;CAEC,GACD,OAAO,MAAMG,QAAQ,CAAC,EACpBC,OAAO,MAAM,EACbC,QAAQ,MAAM,EACdC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,KAAK,EACLC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,IAAI,EACJ,GAAGC,WACQ;IACX,MAAM,EAAEC,QAAQ,MAAM,EAAE,GAAGlB;IAE3B,qBACE,KAACC;QACCW,OAAOA;QACPF,WAAWX,WACTI,MAAM,CAAC,QAAQ,EACfK,UAAU,WAAWL,MAAM,CAAC,qBAAqB,EACjDK,UAAU,YAAYL,MAAM,CAAC,sBAAsB,EACnDe,UAAU,aAAad,eAAe,CAACc,MAAM,EAC7CL,UAAUV,MAAM,CAAC,mBAAmB,EACpCW,SAASX,MAAM,CAAC,kBAAkB,EAClCO;QAEFC,YAAYA;QACZE,QAAQA;QACRC,OAAOA;QACPK,UAAUF,UAAUE,QAAQ;QAC5BH,MAAMA;QACND,QAAQA;kBAER,cAAA,KAACb;YACE,GAAGe,SAAS;YACbG,IAAG;YACHb,MAAMA;YACNG,WAAWP,MAAM,CAAC,YAAY;YAC9BQ,YAAYF;;;AAIpB,EAAE"}

package/dist/cssm/components/Input/Input.module.css

@@ -13,37 +13,15 @@
 }
 
 .Input__el {
-  block-size: var(--vkui--size_field_height--regular);
-  margin: 0;
+  position: relative;
+  z-index: var(--vkui_internal--z_index_form_field_element);
+  padding-block: 0;
+  padding-inline: 12px;
   inline-size: 100%;
+  block-size: var(--vkui--size_field_height--regular);
   box-sizing: border-box;
-  box-shadow: none;
-  border: 0;
   border-radius: inherit;
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
   color: var(--vkui--color_text_primary);
-  padding-block: 0;
-  padding-inline: 12px;
-  position: relative;
-  z-index: var(--vkui_internal--z_index_form_field_element);
-  background: transparent;
-}
-
-/*
- * Отключаем нативные элементы для <input type="number" />
- *
- * см. https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp
- */
-
-.Input__el::-webkit-outer-spin-button,
-.Input__el::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-}
-
-.Input__el[type='number'] {
-  -moz-appearance: textfield;
 }
 
 .Input--sizeY-compact .Input__el {

package/dist/cssm/components/InputLike/InputLike.d.ts

@@ -1,14 +1,13 @@
-import * as React from 'react';
 import { type RootComponentProps } from '../RootComponent/RootComponent';
 export interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {
     length: number;
     index: number;
     value?: string;
     label?: string;
-    onElementSelect?(index: number): void;
+    onElementSelect?: (index: number) => void;
 }
 export declare const InputLike: {
-    ({ value, length, index, onElementSelect, onClick, onFocus, label, ...restProps }: InputLikeProps): React.JSX.Element;
+    ({ value, length, index, onElementSelect, onClick, onFocus, label, ...restProps }: InputLikeProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 //# sourceMappingURL=InputLike.d.ts.map

package/dist/cssm/components/InputLike/InputLike.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputLike.d.ts","sourceRoot":"","sources":["../../../../src/components/InputLike/InputLike.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAIxF,MAAM,WAAW,cAAe,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IACzE,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACvC;AAgBD,eAAO,MAAM,SAAS;uFASnB,cAAc;;CA4BhB,CAAC"}
+{"version":3,"file":"InputLike.d.ts","sourceRoot":"","sources":["../../../../src/components/InputLike/InputLike.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAIxF,MAAM,WAAW,cAAe,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IACzE,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAgBD,eAAO,MAAM,SAAS;uFASnB,cAAc;;CA4BhB,CAAC"}

package/dist/cssm/components/InputLike/InputLike.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { callMultiple } from '../../lib/callMultiple';
 import { stopPropagation } from '../../lib/utils';
@@ -8,10 +9,10 @@ const MASK_SYMBOL = String.fromCharCode(0x2007);
 function getMaskElements(length) {
     const result = [];
     for(let index = 0; index < length; index += 1){
-        result.push(/*#__PURE__*/ React.createElement("span", {
-            key: index,
-            className: styles['InputLike__mask']
-        }, MASK_SYMBOL));
+        result.push(/*#__PURE__*/ _jsx("span", {
+            className: styles['InputLike__mask'],
+            children: MASK_SYMBOL
+        }, index));
     }
     return result;
 }
@@ -23,17 +24,25 @@ export const InputLike = ({ value, length, index, onElementSelect, onClick, onFo
         index,
         onElementSelect
     ]);
-    return /*#__PURE__*/ React.createElement(RootComponent, {
+    return /*#__PURE__*/ _jsxs(RootComponent, {
         Component: "span",
         baseClassName: value?.length === length ? styles['InputLike--full'] : undefined,
         tabIndex: 0,
         onClick: callMultiple(onClick, handleElementSelect),
         onFocus: callMultiple(stopPropagation, onFocus),
-        ...restProps
-    }, label && /*#__PURE__*/ React.createElement(VisuallyHidden, null, label), value?.slice(0, length - 1), value?.slice(length - 1) && /*#__PURE__*/ React.createElement("span", {
-        key: index,
-        className: styles['InputLike__last_character']
-    }, value.slice(length - 1)), getMaskElements(length - (value?.length ?? 0)));
+        ...restProps,
+        children: [
+            label && /*#__PURE__*/ _jsx(VisuallyHidden, {
+                children: label
+            }),
+            value?.slice(0, length - 1),
+            value?.slice(length - 1) && /*#__PURE__*/ _jsx("span", {
+                className: styles['InputLike__last_character'],
+                children: value.slice(length - 1)
+            }, index),
+            getMaskElements(length - (value?.length ?? 0))
+        ]
+    });
 };
 InputLike.displayName = 'InputLike';
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * as React from 'react';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { RootComponent, type RootComponentProps } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  label?: 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  label,\n  ...restProps\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    <RootComponent\n      Component=\"span\"\n      baseClassName={value?.length === length ? styles['InputLike--full'] : undefined}\n      tabIndex={0}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\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    </RootComponent>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","styles","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","key","className","InputLike","value","onElementSelect","onClick","onFocus","label","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,eAAe,QAAQ,kBAAkB;AAClD,SAASC,aAAa,QAAiC,iCAAiC;AACxF,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,yBAAyB;AAU5C,MAAMC,cAAcC,OAAOC,YAAY,CAAC;AAExC,SAASC,gBAAgBC,MAAc;IACrC,MAAMC,SAAS,EAAE;IACjB,IAAK,IAAIC,QAAQ,GAAGA,QAAQF,QAAQE,SAAS,EAAG;QAC9CD,OAAOE,IAAI,eACT,oBAACC;YAAKC,KAAKH;YAAOI,WAAWX,MAAM,CAAC,kBAAkB;WACnDC;IAGP;IACA,OAAOK;AACT;AAEA,OAAO,MAAMM,YAAY,CAAC,EACxBC,KAAK,EACLR,MAAM,EACNE,KAAK,EACLO,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,KAAK,EACL,GAAGC,WACY;IACf,MAAMC,sBAAsBxB,MAAMyB,WAAW,CAC3C,CAACC;QACCxB,gBAAgBwB;QAChBP,kBAAkBP;IACpB,GACA;QAACA;QAAOO;KAAgB;IAG1B,qBACE,oBAAChB;QACCwB,WAAU;QACVC,eAAeV,OAAOR,WAAWA,SAASL,MAAM,CAAC,kBAAkB,GAAGwB;QACtEC,UAAU;QACVV,SAASnB,aAAamB,SAASI;QAC/BH,SAASpB,aAAaC,iBAAiBmB;QACtC,GAAGE,SAAS;OAEZD,uBAAS,oBAAClB,sBAAgBkB,QAC1BJ,OAAOa,MAAM,GAAGrB,SAAS,IACzBQ,OAAOa,MAAMrB,SAAS,oBACrB,oBAACI;QAAKC,KAAKH;QAAOI,WAAWX,MAAM,CAAC,4BAA4B;OAC7Da,MAAMa,KAAK,CAACrB,SAAS,KAGzBD,gBAAgBC,SAAUQ,CAAAA,OAAOR,UAAU,CAAA;AAGlD,EAAE;AAEFO,UAAUe,WAAW,GAAG"}
+{"version":3,"sources":["../../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * as React from 'react';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { RootComponent, type RootComponentProps } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  label?: 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  label,\n  ...restProps\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    <RootComponent\n      Component=\"span\"\n      baseClassName={value?.length === length ? styles['InputLike--full'] : undefined}\n      tabIndex={0}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\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    </RootComponent>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","styles","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","className","InputLike","value","onElementSelect","onClick","onFocus","label","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,eAAe,QAAQ,kBAAkB;AAClD,SAASC,aAAa,QAAiC,iCAAiC;AACxF,SAASC,cAAc,QAAQ,mCAAmC;AAClE,OAAOC,YAAY,yBAAyB;AAU5C,MAAMC,cAAcC,OAAOC,YAAY,CAAC;AAExC,SAASC,gBAAgBC,MAAc;IACrC,MAAMC,SAAS,EAAE;IACjB,IAAK,IAAIC,QAAQ,GAAGA,QAAQF,QAAQE,SAAS,EAAG;QAC9CD,OAAOE,IAAI,eACT,KAACC;YAAiBC,WAAWV,MAAM,CAAC,kBAAkB;sBACnDC;WADQM;IAIf;IACA,OAAOD;AACT;AAEA,OAAO,MAAMK,YAAY,CAAC,EACxBC,KAAK,EACLP,MAAM,EACNE,KAAK,EACLM,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,KAAK,EACL,GAAGC,WACY;IACf,MAAMC,sBAAsBvB,MAAMwB,WAAW,CAC3C,CAACC;QACCvB,gBAAgBuB;QAChBP,kBAAkBN;IACpB,GACA;QAACA;QAAOM;KAAgB;IAG1B,qBACE,MAACf;QACCuB,WAAU;QACVC,eAAeV,OAAOP,WAAWA,SAASL,MAAM,CAAC,kBAAkB,GAAGuB;QACtEC,UAAU;QACVV,SAASlB,aAAakB,SAASI;QAC/BH,SAASnB,aAAaC,iBAAiBkB;QACtC,GAAGE,SAAS;;YAEZD,uBAAS,KAACjB;0BAAgBiB;;YAC1BJ,OAAOa,MAAM,GAAGpB,SAAS;YACzBO,OAAOa,MAAMpB,SAAS,oBACrB,KAACI;gBAAiBC,WAAWV,MAAM,CAAC,4BAA4B;0BAC7DY,MAAMa,KAAK,CAACpB,SAAS;eADbE;YAIZH,gBAAgBC,SAAUO,CAAAA,OAAOP,UAAU,CAAA;;;AAGlD,EAAE;AAEFM,UAAUe,WAAW,GAAG"}

package/dist/cssm/components/InputLike/InputLikeDivider.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-export declare const InputLikeDivider: ({ children, className, ...props }: React.InputHTMLAttributes<HTMLSpanElement>) => React.JSX.Element;
+export declare const InputLikeDivider: ({ children, className, ...props }: React.InputHTMLAttributes<HTMLSpanElement>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=InputLikeDivider.d.ts.map

package/dist/cssm/components/InputLike/InputLikeDivider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputLikeDivider.d.ts","sourceRoot":"","sources":["../../../../src/components/InputLike/InputLikeDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,gBAAgB,sCAI1B,MAAM,mBAAmB,CAAC,eAAe,CAAC,sBAM5C,CAAC"}
+{"version":3,"file":"InputLikeDivider.d.ts","sourceRoot":"","sources":["../../../../src/components/InputLike/InputLikeDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,eAAO,MAAM,gBAAgB,sCAI1B,MAAM,mBAAmB,CAAC,eAAe,CAAC,4CAM5C,CAAC"}

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

@@ -1,11 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { classNames } from '@vkontakte/vkjs';
 import styles from './InputLike.module.css';
 export const InputLikeDivider = ({ children, className, ...props })=>{
-    return /*#__PURE__*/ React.createElement("span", {
+    return /*#__PURE__*/ _jsx("span", {
         className: classNames(styles['InputLike__divider'], className),
-        ...props
-    }, children);
+        ...props,
+        children: children
+    });
 };
 
 //# sourceMappingURL=InputLikeDivider.js.map

package/dist/cssm/components/InputLike/InputLikeDivider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/InputLike/InputLikeDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './InputLike.module.css';\n\nexport const InputLikeDivider = ({\n  children,\n  className,\n  ...props\n}: React.InputHTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span className={classNames(styles['InputLike__divider'], className)} {...props}>\n      {children}\n    </span>\n  );\n};\n"],"names":["React","classNames","styles","InputLikeDivider","children","className","props","span"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,OAAOC,YAAY,yBAAyB;AAE5C,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACwC;IAC3C,qBACE,oBAACC;QAAKF,WAAWJ,WAAWC,MAAM,CAAC,qBAAqB,EAAEG;QAAa,GAAGC,KAAK;OAC5EF;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/InputLike/InputLikeDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './InputLike.module.css';\n\nexport const InputLikeDivider = ({\n  children,\n  className,\n  ...props\n}: React.InputHTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span className={classNames(styles['InputLike__divider'], className)} {...props}>\n      {children}\n    </span>\n  );\n};\n"],"names":["React","classNames","styles","InputLikeDivider","children","className","props","span"],"rangeMappings":";;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,OAAOC,YAAY,yBAAyB;AAE5C,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACwC;IAC3C,qBACE,KAACC;QAAKF,WAAWJ,WAAWC,MAAM,CAAC,qBAAqB,EAAEG;QAAa,GAAGC,KAAK;kBAC5EF;;AAGP,EAAE"}

package/dist/cssm/components/Link/Link.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { TappableProps } from '../Tappable/Tappable';
 export interface LinkProps extends TappableProps {
     /**
@@ -9,5 +8,5 @@ export interface LinkProps extends TappableProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/Link
  */
-export declare const Link: ({ hasVisited, children, className, onClick, ...restProps }: LinkProps) => React.JSX.Element;
+export declare const Link: ({ hasVisited, children, className, onClick, ...restProps }: LinkProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Link.d.ts.map

package/dist/cssm/components/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAG/D,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,+DAMd,SAAS,sBAcX,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAG/D,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,+DAMd,SAAS,4CAcX,CAAC"}

package/dist/cssm/components/Link/Link.js

@@ -1,19 +1,20 @@
-import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { classNames, noop } from '@vkontakte/vkjs';
 import { Tappable } from '../Tappable/Tappable';
 import styles from './Link.module.css';
 /**
  * @see https://vkcom.github.io/VKUI/#/Link
  */ export const Link = ({ hasVisited, children, className, onClick = noop, ...restProps })=>{
-    return /*#__PURE__*/ React.createElement(Tappable, {
+    return /*#__PURE__*/ _jsx(Tappable, {
         Component: restProps.href ? 'a' : 'button',
         onClick: onClick,
         ...restProps,
         className: classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className),
         hasHover: false,
         activeMode: "opacity",
-        focusVisibleMode: "outside"
-    }, children);
+        focusVisibleMode: "outside",
+        children: children
+    });
 };
 
 //# sourceMappingURL=Link.js.map

package/dist/cssm/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableProps {\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({\n  hasVisited,\n  children,\n  className,\n  onClick = noop,\n  ...restProps\n}: LinkProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      onClick={onClick}\n      {...restProps}\n      className={classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className)}\n      hasHover={false}\n      activeMode=\"opacity\"\n      focusVisibleMode=\"outside\"\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","classNames","noop","Tappable","styles","Link","hasVisited","children","className","onClick","restProps","Component","href","hasHover","activeMode","focusVisibleMode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,OAAOC,YAAY,oBAAoB;AASvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EACnBC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACTC,UAAUP,IAAI,EACd,GAAGQ,WACO;IACV,qBACE,oBAACP;QACCQ,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCH,SAASA;QACR,GAAGC,SAAS;QACbF,WAAWP,WAAWG,MAAM,CAAC,OAAO,EAAEE,cAAcF,MAAM,CAAC,oBAAoB,EAAEI;QACjFK,UAAU;QACVC,YAAW;QACXC,kBAAiB;OAEhBR;AAGP,EAAE"}
+{"version":3,"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { classNames, noop } from '@vkontakte/vkjs';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableProps {\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({\n  hasVisited,\n  children,\n  className,\n  onClick = noop,\n  ...restProps\n}: LinkProps) => {\n  return (\n    <Tappable\n      Component={restProps.href ? 'a' : 'button'}\n      onClick={onClick}\n      {...restProps}\n      className={classNames(styles['Link'], hasVisited && styles['Link--has-visited'], className)}\n      hasHover={false}\n      activeMode=\"opacity\"\n      focusVisibleMode=\"outside\"\n    >\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["classNames","noop","Tappable","styles","Link","hasVisited","children","className","onClick","restProps","Component","href","hasHover","activeMode","focusVisibleMode"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,OAAOC,YAAY,oBAAoB;AASvC;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EACnBC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACTC,UAAUP,IAAI,EACd,GAAGQ,WACO;IACV,qBACE,KAACP;QACCQ,WAAWD,UAAUE,IAAI,GAAG,MAAM;QAClCH,SAASA;QACR,GAAGC,SAAS;QACbF,WAAWP,WAAWG,MAAM,CAAC,OAAO,EAAEE,cAAcF,MAAM,CAAC,oBAAoB,EAAEI;QACjFK,UAAU;QACVC,YAAW;QACXC,kBAAiB;kBAEhBR;;AAGP,EAAE"}

package/dist/cssm/components/Link/Link.module.css

@@ -1,15 +1,14 @@
 .Link {
   color: var(--vkui_internal--link-color, var(--vkui--color_text_link));
-  text-decoration: none;
   border: 0;
   background: none;
   margin: 0;
   padding: 0;
-  cursor: pointer;
   font-size: inherit;
   font-weight: inherit;
   font-family: inherit;
   line-height: inherit;
+  text-align: inherit;
   display: inline;
   border-radius: 0;
 }

package/dist/cssm/components/List/List.d.ts

@@ -1,8 +1,7 @@
-import * as React from 'react';
 import { HTMLAttributesWithRootRef } from '../../types';
 export type ListProps = HTMLAttributesWithRootRef<HTMLDivElement>;
 /**
  * @see https://vkcom.github.io/VKUI/#/List
  */
-export declare const List: ({ children, ...restProps }: ListProps) => React.JSX.Element;
+export declare const List: ({ children, ...restProps }: ListProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=List.d.ts.map

package/dist/cssm/components/List/List.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../src/components/List/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGxD,MAAM,MAAM,SAAS,GAAG,yBAAyB,CAAC,cAAc,CAAC,CAAC;AAElE;;GAEG;AACH,eAAO,MAAM,IAAI,+BAAgC,SAAS,sBAOzD,CAAC"}
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../src/components/List/List.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGxD,MAAM,MAAM,SAAS,GAAG,yBAAyB,CAAC,cAAc,CAAC,CAAC;AAElE;;GAEG;AACH,eAAO,MAAM,IAAI,+BAAgC,SAAS,4CAOzD,CAAC"}

package/dist/cssm/components/List/List.js

@@ -1,16 +1,20 @@
-import * as React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP } from '../../hooks/useDraggableWithDomApi';
 import { RootComponent } from '../RootComponent/RootComponent';
 /**
  * @see https://vkcom.github.io/VKUI/#/List
  */ export const List = ({ children, ...restProps })=>{
-    return /*#__PURE__*/ React.createElement(RootComponent, {
+    return /*#__PURE__*/ _jsxs(RootComponent, {
         role: "list",
-        ...restProps
-    }, children, /*#__PURE__*/ React.createElement("div", {
-        "aria-hidden": true,
-        ...DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP
-    }));
+        ...restProps,
+        children: [
+            children,
+            /*#__PURE__*/ _jsx("div", {
+                "aria-hidden": true,
+                ...DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=List.js.map

package/dist/cssm/components/List/List.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import * as React from 'react';\nimport { DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP } from '../../hooks/useDraggableWithDomApi';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\n\nexport type ListProps = HTMLAttributesWithRootRef<HTMLDivElement>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/List\n */\nexport const List = ({ children, ...restProps }: ListProps) => {\n  return (\n    <RootComponent role=\"list\" {...restProps}>\n      {children}\n      <div aria-hidden {...DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP}></div>\n    </RootComponent>\n  );\n};\n"],"names":["React","DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP","RootComponent","List","children","restProps","role","div","aria-hidden"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qCAAqC,QAAQ,qCAAqC;AAE3F,SAASC,aAAa,QAAQ,iCAAiC;AAI/D;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,QAAQ,EAAE,GAAGC,WAAsB;IACxD,qBACE,oBAACH;QAAcI,MAAK;QAAQ,GAAGD,SAAS;OACrCD,wBACD,oBAACG;QAAIC,eAAAA;QAAa,GAAGP,qCAAqC;;AAGhE,EAAE"}
+{"version":3,"sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import { DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP } from '../../hooks/useDraggableWithDomApi';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\n\nexport type ListProps = HTMLAttributesWithRootRef<HTMLDivElement>;\n\n/**\n * @see https://vkcom.github.io/VKUI/#/List\n */\nexport const List = ({ children, ...restProps }: ListProps) => {\n  return (\n    <RootComponent role=\"list\" {...restProps}>\n      {children}\n      <div aria-hidden {...DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP}></div>\n    </RootComponent>\n  );\n};\n"],"names":["DATA_DRAGGABLE_PLACEHOLDER_REACT_PROP","RootComponent","List","children","restProps","role","div","aria-hidden"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,qCAAqC,QAAQ,qCAAqC;AAE3F,SAASC,aAAa,QAAQ,iCAAiC;AAI/D;;CAEC,GACD,OAAO,MAAMC,OAAO,CAAC,EAAEC,QAAQ,EAAE,GAAGC,WAAsB;IACxD,qBACE,MAACH;QAAcI,MAAK;QAAQ,GAAGD,SAAS;;YACrCD;0BACD,KAACG;gBAAIC,aAAW;gBAAE,GAAGP,qCAAqC;;;;AAGhE,EAAE"}

package/dist/cssm/components/LocaleProvider/LocaleProvider.d.ts

@@ -14,5 +14,5 @@ export interface LocaleProviderProps {
  * @since 5.0.0
  * @see https://vkcom.github.io/VKUI/#/LocaleProvider
  */
-export declare function LocaleProvider({ value, children }: LocaleProviderProps): React.JSX.Element;
+export declare function LocaleProvider({ value, children }: LocaleProviderProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=LocaleProvider.d.ts.map

package/dist/cssm/components/LocaleProvider/LocaleProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LocaleProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,8BAA8B,EAAE,MAAM,yCAAyC,CAAC;AAGzF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,KAAK,EAAE,8BAA8B,CAAC,QAAQ,CAAC,CAAC;IAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,mBAAmB,qBAEtE"}
+{"version":3,"file":"LocaleProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,8BAA8B,EAAE,MAAM,yCAAyC,CAAC;AAGzF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,KAAK,EAAE,8BAA8B,CAAC,QAAQ,CAAC,CAAC;IAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,mBAAmB,2CAEtE"}

package/dist/cssm/components/LocaleProvider/LocaleProvider.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';
 /**
@@ -7,9 +8,10 @@ import { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride
  * @since 5.0.0
  * @see https://vkcom.github.io/VKUI/#/LocaleProvider
  */ export function LocaleProvider({ value, children }) {
-    return /*#__PURE__*/ React.createElement(ConfigProviderOverride, {
-        locale: value
-    }, children);
+    return /*#__PURE__*/ _jsx(ConfigProviderOverride, {
+        locale: value,
+        children: children
+    });
 }
 
 //# sourceMappingURL=LocaleProvider.js.map

package/dist/cssm/components/LocaleProvider/LocaleProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подметок IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @since 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"names":["React","ConfigProviderOverride","LocaleProvider","value","children","locale"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;;CAMC,GACD,OAAO,SAASC,eAAe,EAAEC,KAAK,EAAEC,QAAQ,EAAuB;IACrE,qBAAO,oBAACH;QAAuBI,QAAQF;OAAQC;AACjD"}
+{"version":3,"sources":["../../../../src/components/LocaleProvider/LocaleProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ConfigProviderContextInterface } from '../ConfigProvider/ConfigProviderContext';\nimport { ConfigProviderOverride } from '../ConfigProvider/ConfigProviderOverride';\n\nexport interface LocaleProviderProps {\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  value: ConfigProviderContextInterface['locale'];\n  children: React.ReactNode;\n}\n\n/**\n * Компонент, прокидывающий локаль. Список можно найти в\n * [реестре языковых подметок IANA](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)\n *\n * @since 5.0.0\n * @see https://vkcom.github.io/VKUI/#/LocaleProvider\n */\nexport function LocaleProvider({ value, children }: LocaleProviderProps) {\n  return <ConfigProviderOverride locale={value}>{children}</ConfigProviderOverride>;\n}\n"],"names":["React","ConfigProviderOverride","LocaleProvider","value","children","locale"],"rangeMappings":";;;;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,sBAAsB,QAAQ,2CAA2C;AAUlF;;;;;;CAMC,GACD,OAAO,SAASC,eAAe,EAAEC,KAAK,EAAEC,QAAQ,EAAuB;IACrE,qBAAO,KAACH;QAAuBI,QAAQF;kBAAQC;;AACjD"}

package/dist/cssm/components/Mark/Mark.d.ts

@@ -0,0 +1,11 @@
+import { HTMLAttributesWithRootRef } from '../../types';
+export type MarkProps = HTMLAttributesWithRootRef<HTMLDivElement>;
+/**
+ * Компонент используется для выделения фрагментов текста,
+ * например при поиске определенных слов или выделения текста в цитате.
+ *
+ * @since 6.1.0
+ * @see https://vkcom.github.io/VKUI/#/Mark
+ */
+export declare const Mark: (props: MarkProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Mark.d.ts.map

package/dist/cssm/components/Mark/Mark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mark.d.ts","sourceRoot":"","sources":["../../../../src/components/Mark/Mark.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAIxD,MAAM,MAAM,SAAS,GAAG,yBAAyB,CAAC,cAAc,CAAC,CAAC;AAElE;;;;;;GAMG;AACH,eAAO,MAAM,IAAI,UAAW,SAAS,4CAEpC,CAAC"}

package/dist/cssm/components/Mark/Mark.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RootComponent } from '../RootComponent/RootComponent';
+import styles from './Mark.module.css';
+/**
+ * Компонент используется для выделения фрагментов текста,
+ * например при поиске определенных слов или выделения текста в цитате.
+ *
+ * @since 6.1.0
+ * @see https://vkcom.github.io/VKUI/#/Mark
+ */ export const Mark = (props)=>/*#__PURE__*/ _jsx(RootComponent, {
+        baseClassName: styles['Mark'],
+        Component: "mark",
+        ...props
+    });
+
+//# sourceMappingURL=Mark.js.map

package/dist/cssm/components/Mark/Mark.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport styles from './Mark.module.css';\n\nexport type MarkProps = HTMLAttributesWithRootRef<HTMLDivElement>;\n\n/**\n * Компонент используется для выделения фрагментов текста,\n * например при поиске определенных слов или выделения текста в цитате.\n *\n * @since 6.1.0\n * @see https://vkcom.github.io/VKUI/#/Mark\n */\nexport const Mark = (props: MarkProps) => (\n  <RootComponent baseClassName={styles['Mark']} Component=\"mark\" {...props} />\n);\n"],"names":["RootComponent","styles","Mark","props","baseClassName","Component"],"rangeMappings":";;;;;;;;;;;;;","mappings":";AACA,SAASA,aAAa,QAAQ,iCAAiC;AAC/D,OAAOC,YAAY,oBAAoB;AAIvC;;;;;;CAMC,GACD,OAAO,MAAMC,OAAO,CAACC,sBACnB,KAACH;QAAcI,eAAeH,MAAM,CAAC,OAAO;QAAEI,WAAU;QAAQ,GAAGF,KAAK;OACxE"}

package/dist/cssm/components/Mark/Mark.module.css

@@ -0,0 +1,8 @@
+.Mark {
+  border-radius: 4px;
+  padding: 2px;
+  margin: -2px;
+  /* Перебиваем значения браузера */
+  background-color: var(--vkui--color_background_accent_themed_alpha);
+  color: inherit;
+}

package/dist/cssm/components/MiniInfoCell/MiniInfoCell.d.ts

@@ -36,5 +36,5 @@ export interface MiniInfoCellProps extends HTMLAttributesWithRootRef<HTMLDivElem
 /**
  * @see https://vkcom.github.io/VKUI/#/MiniInfoCell
  */
-export declare const MiniInfoCell: ({ before, after, children, mode, textWrap, expandable, className, ...restProps }: MiniInfoCellProps) => React.JSX.Element;
+export declare const MiniInfoCell: ({ before, after, children, mode, textWrap, expandable, className, ...restProps }: MiniInfoCellProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=MiniInfoCell.d.ts.map

package/dist/cssm/components/MiniInfoCell/MiniInfoCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MiniInfoCell.d.ts","sourceRoot":"","sources":["../../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAkBxD,MAAM,WAAW,iBAAkB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAClF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE1C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEvC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,qFAStB,iBAAiB,sBAiCnB,CAAC"}
+{"version":3,"file":"MiniInfoCell.d.ts","sourceRoot":"","sources":["../../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAkBxD,MAAM,WAAW,iBAAkB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAClF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE1C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEvC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,qFAStB,iBAAiB,4CAiCnB,CAAC"}