@alfalab/core-components 47.14.0-beta.0 → 47.14.0

package/toast-plate/esm/desktop/index.js

@@ -4,9 +4,9 @@ import 'react';
 import '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../getDataTestId-c689804d.js';
+import '../getDataTestId-1aefc32c.js';
 import '@alfalab/hooks';
-import '../PortalContext-78e963c0.js';
+import '../PortalContext-bcc1ee97.js';
 import '../../../status-badge/esm';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/esm/index-2f466837.d.ts

@@ -71,7 +71,7 @@ declare const dom: {
     preventDefault: typeof preventDefault;
 };
 export { isClient, os, createPaddingStyle, easingFns, fnUtils, maskUtils, hooks, dom };
-export { PortalContext } from "./PortalContext-78e963c0";
-export * from "./getDataTestId-c689804d";
+export { PortalContext } from "./PortalContext-bcc1ee97";
+export * from "./getDataTestId-1aefc32c";
 export * from "./browser-a216f694";
 export * from "./components/base-toast-plate/hooks/useDeprecatedBadge";

package/toast-plate/esm/index.js

@@ -6,9 +6,9 @@ import './desktop/Component.desktop.js';
 import './components/base-toast-plate/component.js';
 import 'classnames';
 import '../../icon-button/esm';
-import './getDataTestId-c689804d.js';
+import './getDataTestId-1aefc32c.js';
 import '@alfalab/hooks';
-import './PortalContext-78e963c0.js';
+import './PortalContext-bcc1ee97.js';
 import '../../status-badge/esm';
 import '@alfalab/icons-glyph/CrossMIcon';
 import './components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/esm/mobile/Component.mobile.js

@@ -3,9 +3,9 @@ import React, { forwardRef } from 'react';
 import { BaseToastPlate } from '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../getDataTestId-c689804d.js';
+import '../getDataTestId-1aefc32c.js';
 import '@alfalab/hooks';
-import '../PortalContext-78e963c0.js';
+import '../PortalContext-bcc1ee97.js';
 import '../../../status-badge/esm';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/esm/mobile/index.js

@@ -4,9 +4,9 @@ import 'react';
 import '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../getDataTestId-c689804d.js';
+import '../getDataTestId-1aefc32c.js';
 import '@alfalab/hooks';
-import '../PortalContext-78e963c0.js';
+import '../PortalContext-bcc1ee97.js';
 import '../../../status-badge/esm';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/index-2f466837.d.ts

@@ -71,7 +71,7 @@ declare const dom: {
     preventDefault: typeof preventDefault;
 };
 export { isClient, os, createPaddingStyle, easingFns, fnUtils, maskUtils, hooks, dom };
-export { PortalContext } from "./PortalContext-cd37d2fe";
-export * from "./getDataTestId-3b9a11f6";
+export { PortalContext } from "./PortalContext-f0c7d04d";
+export * from "./getDataTestId-ea3763ab";
 export * from "./browser-a216f694";
 export * from "./components/base-toast-plate/hooks/useDeprecatedBadge";

package/toast-plate/modern/Component.responsive.js

@@ -5,9 +5,9 @@ import { ToastPlateMobile } from './mobile/Component.mobile.js';
 import './components/base-toast-plate/component.js';
 import 'classnames';
 import '../../icon-button/modern';
-import './getDataTestId-f391587f.js';
+import './getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import './PortalContext-ca09eba8.js';
+import './PortalContext-b5a71e31.js';
 import '../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import './components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/modern/components/base-toast-plate/component.js

@@ -1,9 +1,9 @@
 import React, { forwardRef, useCallback } from 'react';
 import cn from 'classnames';
 import { IconButton } from '../../../../icon-button/modern';
-import { g as getDataTestId } from '../../getDataTestId-f391587f.js';
+import { g as getDataTestId } from '../../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../../PortalContext-ca09eba8.js';
+import '../../PortalContext-b5a71e31.js';
 import { StatusBadge } from '../../../../status-badge/modern';
 import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { useCustomIcons } from './hooks/useCustomIcons.js';

package/toast-plate/modern/components/base-toast-plate/hooks/useDeprecatedBadge.js

@@ -1,6 +1,6 @@
 import 'react';
 import '@alfalab/hooks';
-import '../../../PortalContext-ca09eba8.js';
+import '../../../PortalContext-b5a71e31.js';
 
 const exhaustiveCheck = (value) => value;
 

package/toast-plate/modern/components/base-toast-plate/index.css

@@ -22,15 +22,20 @@
     --gap-2xl: 32px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-2: var(--gap-3xs);
+    --gap-4: var(--gap-2xs);
+    --gap-12: var(--gap-s);
+    --gap-16: var(--gap-m);
+    --gap-32: var(--gap-2xl);
 } :root {
 } :root {
 } :root {
     /* default */
     --toast-plate-border-radius: var(--border-radius-l);
-    --toast-plate-action-padding: 0 var(--gap-2xl);
-    --toast-plate-action-bottom-padding: var(--gap-2xs) 0 0;
+    --toast-plate-action-padding: 0 var(--gap-32);
+    --toast-plate-action-bottom-padding: var(--gap-4) 0 0;
     --toast-plate-action-divider-display: block;
-    --toast-plate-content-with-closer-right-padding: var(--gap-m);
+    --toast-plate-content-with-closer-right-padding: var(--gap-16);
 
     /* inverted */
 } .toast-plate__component_dlj52 {
@@ -40,7 +45,7 @@
     box-sizing: border-box;
     border-radius: var(--toast-plate-border-radius);
     min-height: 56px;
-    padding: var(--gap-m)
+    padding: var(--gap-16)
 } .toast-plate__component_dlj52.toast-plate__hasCloser_dlj52 {
         /* 2×16 + 24 */
         padding-right: 56px;
@@ -72,9 +77,9 @@
     display: flex;
     align-items: flex-start;
     flex-shrink: 0;
-    padding-right: var(--gap-s);
+    padding-right: var(--gap-12);
 } .toast-plate__contentTitle_dlj52 {
-    padding: var(--gap-3xs) 0;
+    padding: var(--gap-2) 0;
 } .toast-plate__children_dlj52 {
     font-size: 14px;
     line-height: 20px;
@@ -82,18 +87,18 @@
 
     word-break: break-word;
 } .toast-plate__title_dlj52 + .toast-plate__children_dlj52 {
-    margin-top: var(--gap-2xs);
+    margin-top: var(--gap-4);
 } .toast-plate__closeButtonWrapper_dlj52 {
     position: absolute;
-    top: var(--gap-2xs);
-    bottom: var(--gap-2xs);
-    right: var(--gap-2xs)
+    top: var(--gap-4);
+    bottom: var(--gap-4);
+    right: var(--gap-4)
 } .toast-plate__closeButtonWrapper_dlj52:before {
         display: var(--toast-plate-action-divider-display);
         position: absolute;
         right: 51px;
-        top: var(--gap-s);
-        bottom: var(--gap-s);
+        top: var(--gap-12);
+        bottom: var(--gap-12);
         width: 1px;
         content: '';
     } .toast-plate__closeButton_dlj52 {

package/toast-plate/modern/components/base-toast-plate/index.js

@@ -2,9 +2,9 @@ export { BaseToastPlate } from './component.js';
 import 'react';
 import 'classnames';
 import '../../../../icon-button/modern';
-import '../../getDataTestId-f391587f.js';
+import '../../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../../PortalContext-ca09eba8.js';
+import '../../PortalContext-b5a71e31.js';
 import '../../../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import './hooks/useCustomIcons.js';

package/toast-plate/modern/components/base-toast-plate/utils/getBaseToastPlateTestIds.js

@@ -1,7 +1,7 @@
-import { g as getDataTestId } from '../../../getDataTestId-f391587f.js';
+import { g as getDataTestId } from '../../../getDataTestId-106dec17.js';
 import 'react';
 import '@alfalab/hooks';
-import '../../../PortalContext-ca09eba8.js';
+import '../../../PortalContext-b5a71e31.js';
 
 function getBaseToastPlateTestIds(dataTestId) {
     return {

package/toast-plate/modern/desktop/Component.desktop.js

@@ -2,9 +2,9 @@ import React, { forwardRef } from 'react';
 import { BaseToastPlate } from '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../getDataTestId-f391587f.js';
+import '../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../PortalContext-ca09eba8.js';
+import '../PortalContext-b5a71e31.js';
 import '../../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/modern/desktop/desktop.css

@@ -17,6 +17,7 @@
     --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-12: var(--gap-s);
 } :root {
 } :root {
 } :root {
@@ -43,8 +44,8 @@
         display: var(--toast-plate-action-divider-display);
         position: absolute;
         right: 51px;
-        top: var(--gap-s);
-        bottom: var(--gap-s);
+        top: var(--gap-12);
+        bottom: var(--gap-12);
         width: 1px;
         content: '';
     } .toast-plate__closeButton_1p729 {

package/toast-plate/modern/desktop/index.js

@@ -3,9 +3,9 @@ import 'react';
 import '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../getDataTestId-f391587f.js';
+import '../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../PortalContext-ca09eba8.js';
+import '../PortalContext-b5a71e31.js';
 import '../../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/modern/index-2f466837.d.ts

@@ -71,7 +71,7 @@ declare const dom: {
     preventDefault: typeof preventDefault;
 };
 export { isClient, os, createPaddingStyle, easingFns, fnUtils, maskUtils, hooks, dom };
-export { PortalContext } from "./PortalContext-ca09eba8";
-export * from "./getDataTestId-f391587f";
+export { PortalContext } from "./PortalContext-b5a71e31";
+export * from "./getDataTestId-106dec17";
 export * from "./browser-a216f694";
 export * from "./components/base-toast-plate/hooks/useDeprecatedBadge";

package/toast-plate/modern/index.js

@@ -5,9 +5,9 @@ import './desktop/Component.desktop.js';
 import './components/base-toast-plate/component.js';
 import 'classnames';
 import '../../icon-button/modern';
-import './getDataTestId-f391587f.js';
+import './getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import './PortalContext-ca09eba8.js';
+import './PortalContext-b5a71e31.js';
 import '../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import './components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/modern/mobile/Component.mobile.js

@@ -2,9 +2,9 @@ import React, { forwardRef } from 'react';
 import { BaseToastPlate } from '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../getDataTestId-f391587f.js';
+import '../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../PortalContext-ca09eba8.js';
+import '../PortalContext-b5a71e31.js';
 import '../../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/toast-plate/modern/mobile/index.js

@@ -3,9 +3,9 @@ import 'react';
 import '../components/base-toast-plate/component.js';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../getDataTestId-f391587f.js';
+import '../getDataTestId-106dec17.js';
 import '@alfalab/hooks';
-import '../PortalContext-ca09eba8.js';
+import '../PortalContext-b5a71e31.js';
 import '../../../status-badge/modern';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '../components/base-toast-plate/hooks/useCustomIcons.js';

package/tooltip/cssm/index.module.css

@@ -19,6 +19,8 @@
     --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-8: var(--gap-xs);
+    --gap-16: var(--gap-m);
 } :root {
 } :root {
     --disabled-cursor: not-allowed;
@@ -28,7 +30,7 @@
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
-    padding: var(--gap-m);
+    padding: var(--gap-16);
     max-width: var(--tooltip-max-width);
 } .popper {
     border-radius: var(--border-radius-m);
@@ -37,7 +39,7 @@
     font-size: 13px;
     line-height: 16px;
     font-weight: 400;
-    padding: var(--gap-xs);
+    padding: var(--gap-8);
 } .hint {
     border-radius: var(--border-radius-s);
 } .target {

package/tooltip/esm/index.css

@@ -20,6 +20,8 @@
     --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-8: var(--gap-xs);
+    --gap-16: var(--gap-m);
 } :root {
 } :root {
     --disabled-cursor: not-allowed;
@@ -29,7 +31,7 @@
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
-    padding: var(--gap-m);
+    padding: var(--gap-16);
     max-width: var(--tooltip-max-width);
 } .tooltip__popper_1wpq2 {
     border-radius: var(--border-radius-m);
@@ -38,7 +40,7 @@
     font-size: 13px;
     line-height: 16px;
     font-weight: 400;
-    padding: var(--gap-xs);
+    padding: var(--gap-8);
 } .tooltip__hint_1wpq2 {
     border-radius: var(--border-radius-s);
 } .tooltip__target_1wpq2 {

package/tooltip/index.css

@@ -20,6 +20,8 @@
     --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-8: var(--gap-xs);
+    --gap-16: var(--gap-m);
 } :root {
 } :root {
     --disabled-cursor: not-allowed;
@@ -29,7 +31,7 @@
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
-    padding: var(--gap-m);
+    padding: var(--gap-16);
     max-width: var(--tooltip-max-width);
 } .tooltip__popper_1wpq2 {
     border-radius: var(--border-radius-m);
@@ -38,7 +40,7 @@
     font-size: 13px;
     line-height: 16px;
     font-weight: 400;
-    padding: var(--gap-xs);
+    padding: var(--gap-8);
 } .tooltip__hint_1wpq2 {
     border-radius: var(--border-radius-s);
 } .tooltip__target_1wpq2 {

package/tooltip/modern/index.css

@@ -20,6 +20,8 @@
     --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-8: var(--gap-xs);
+    --gap-16: var(--gap-m);
 } :root {
 } :root {
     --disabled-cursor: not-allowed;
@@ -29,7 +31,7 @@
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
-    padding: var(--gap-m);
+    padding: var(--gap-16);
     max-width: var(--tooltip-max-width);
 } .tooltip__popper_1wpq2 {
     border-radius: var(--border-radius-m);
@@ -38,7 +40,7 @@
     font-size: 13px;
     line-height: 16px;
     font-weight: 400;
-    padding: var(--gap-xs);
+    padding: var(--gap-8);
 } .tooltip__hint_1wpq2 {
     border-radius: var(--border-radius-s);
 } .tooltip__target_1wpq2 {

package/typography/component.d.ts

@@ -2,11 +2,12 @@ import { FC, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { TextProps } from "./text/index";
 import { TitleProps } from "./title/index";
 import { TitleMobileProps } from "./title-mobile/index";
+import { TitleResponsiveProps } from "./title-responsive/index";
 import { TextElementType } from "./types";
 declare const Typography: {
     Title: FC<TitleProps>;
     Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
-    TitleResponsive: FC<TitleProps>;
+    TitleResponsive: FC<TitleResponsiveProps>;
     TitleMobile: FC<TitleMobileProps>;
 };
 export { Typography };

package/typography/cssm/component.d.ts

@@ -2,11 +2,12 @@ import { FC, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { TextProps } from "./text/index";
 import { TitleProps } from "./title/index";
 import { TitleMobileProps } from "./title-mobile/index";
+import { TitleResponsiveProps } from "./title-responsive/index";
 import { TextElementType } from "./types";
 declare const Typography: {
     Title: FC<TitleProps>;
     Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
-    TitleResponsive: FC<TitleProps>;
+    TitleResponsive: FC<TitleResponsiveProps>;
     TitleMobile: FC<TitleMobileProps>;
 };
 export { Typography };

package/typography/cssm/text/index.module.css

@@ -16,10 +16,11 @@
     --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-12: var(--gap-s);
 } :root {
 } :root {
 } :root {
-    --text-paragraph-margin-bottom: 0 0 var(--gap-s);
+    --text-paragraph-margin-bottom: 0 0 var(--gap-12);
 } .paragraph {
     margin: 0;
     padding: 0;

package/typography/cssm/title/index.module.css

@@ -19,6 +19,10 @@
     --gap-4xl: 48px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-16: var(--gap-m);
+    --gap-24: var(--gap-xl);
+    --gap-40: var(--gap-3xl);
+    --gap-48: var(--gap-4xl);
 } :root {
     --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
@@ -74,13 +78,13 @@
     line-height: 22px;
     font-weight: 700;
 } .margins-xlarge {
-    margin: 0 0 var(--gap-xl);
+    margin: 0 0 var(--gap-24);
 } .margins-large {
-    margin: var(--gap-4xl) 0 var(--gap-xl);
+    margin: var(--gap-48) 0 var(--gap-24);
 } .margins-medium {
-    margin: var(--gap-4xl) 0 var(--gap-xl);
+    margin: var(--gap-48) 0 var(--gap-24);
 } .margins-small {
-    margin: var(--gap-3xl) 0 var(--gap-m);
+    margin: var(--gap-40) 0 var(--gap-16);
 } .margins-xsmall {
-    margin: var(--gap-3xl) 0 var(--gap-m);
+    margin: var(--gap-40) 0 var(--gap-16);
 }

package/typography/cssm/title-mobile/component.d.ts

@@ -1,7 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
-import { TitleProps } from "../title/component";
-type TitleMobileProps = Omit<TitleProps, 'defaultMargins'>;
 declare const TitleMobile: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLHeadingElement>, "color"> & {
     tag: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
     view?: "small" | "medium" | "xlarge" | "large" | "xsmall" | undefined;
@@ -17,4 +15,4 @@ declare const TitleMobile: React.ForwardRefExoticComponent<Omit<React.HTMLAttrib
     skeletonProps?: import("../types").TextSkeletonProps | undefined;
     defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
 } & React.RefAttributes<HTMLDivElement | HTMLHeadingElement>>;
-export { TitleMobileProps, TitleMobile };
+export { TitleMobile };

package/typography/cssm/title-mobile/index.d.ts

@@ -1 +1,2 @@
-export * from "./component";
+export { TitleMobile } from "./component";
+export type { TitleProps as TitleMobileProps } from "../title/component";

package/typography/cssm/title-mobile/index.module.css

@@ -12,9 +12,15 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-m: 16px; /* deprecated */ /* deprecated */
+    --gap-xl: 24px; /* deprecated */ /* deprecated */
+    --gap-3xl: 40px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
+    --gap-16: var(--gap-m);
+    --gap-24: var(--gap-xl);
+    --gap-40: var(--gap-3xl);
 } :root {
     --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
@@ -69,4 +75,14 @@
     font-size: 16px;
     line-height: 20px;
     font-weight: 600;
+} .margins-xlarge {
+    margin: 0 0 var(--gap-24);
+} .margins-large {
+    margin: var(--gap-40) 0 var(--gap-16);
+} .margins-medium {
+    margin: var(--gap-40) 0 var(--gap-16);
+} .margins-small {
+    margin: var(--gap-40) 0 var(--gap-16);
+} .margins-xsmall {
+    margin: var(--gap-40) 0 var(--gap-16);
 }

package/typography/cssm/title-responsive/component.d.ts

@@ -1,5 +1,13 @@
 /// <reference types="react" />
 import React from 'react';
+import { TitleProps } from "../title/index";
+type TitleResponsiveProps = TitleProps & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
 declare const TitleResponsive: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLHeadingElement>, "color"> & {
     tag: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
     view?: "small" | "medium" | "xlarge" | "large" | "xsmall" | undefined;
@@ -14,5 +22,11 @@ declare const TitleResponsive: React.ForwardRefExoticComponent<Omit<React.HTMLAt
     showSkeleton?: boolean | undefined;
     skeletonProps?: import("../types").TextSkeletonProps | undefined;
     defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
+} & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number | undefined;
 } & React.RefAttributes<HTMLDivElement | HTMLHeadingElement>>;
-export { TitleResponsive };
+export { TitleResponsiveProps, TitleResponsive };

package/typography/cssm/title-responsive/component.js

@@ -3,20 +3,19 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var coreComponentsMq = require('../../../mq/cssm');
-var title_component = require('../title/component.js');
-var commonStyles = require('../title/common.module.css');
-var styles = require('./index.module.css');
+var title_index = require('../title/index.js');
+var titleMobile_component = require('../title-mobile/component.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var commonStyles__default = /*#__PURE__*/_interopDefaultCompat(commonStyles);
-var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 
-var TitleResponsive = React.forwardRef(function (props, ref) {
-    var defaultMatchMediaValue = props.defaultMatchMediaValue;
-    var isDesktop = coreComponentsMq.useMatchMedia('(min-width: 1024px)', defaultMatchMediaValue)[0];
-    return (React__default.default.createElement(title_component.TitleBase, tslib.__assign({}, props, { styles: Object.assign(commonStyles__default.default, styles__default.default), ref: ref, platform: isDesktop ? 'desktop' : 'mobile' })));
+var TitleResponsive = React.forwardRef(function (_a, ref) {
+    var defaultMatchMediaValue = _a.defaultMatchMediaValue, _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = tslib.__rest(_a, ["defaultMatchMediaValue", "breakpoint"]);
+    var query = "(min-width: ".concat(breakpoint, "px)");
+    var isDesktop = coreComponentsMq.useMatchMedia(query, defaultMatchMediaValue)[0];
+    var Component = isDesktop ? title_index.Title : titleMobile_component.TitleMobile;
+    return React__default.default.createElement(Component, tslib.__assign({}, restProps, { ref: ref }));
 });
 
 exports.TitleResponsive = TitleResponsive;

package/typography/esm/component.d.ts

@@ -2,11 +2,12 @@ import { FC, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { TextProps } from "./text/index";
 import { TitleProps } from "./title/index";
 import { TitleMobileProps } from "./title-mobile/index";
+import { TitleResponsiveProps } from "./title-responsive/index";
 import { TextElementType } from "./types";
 declare const Typography: {
     Title: FC<TitleProps>;
     Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
-    TitleResponsive: FC<TitleProps>;
+    TitleResponsive: FC<TitleResponsiveProps>;
     TitleMobile: FC<TitleMobileProps>;
 };
 export { Typography };

package/typography/esm/component.js

@@ -9,10 +9,10 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/esm';
 import '@alfalab/hooks';
-import './colors.module-1525a6cf.js';
+import './colors.module-4b94173a.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-1cba9ba8.js';
+import './common.module-db571a36.js';
 import '../../mq/esm';
 
 var Typography = {