@alfalab/core-components 48.21.0-beta.3 → 48.21.0-beta.5

package/typography/esm/title-mobile/alfasans-index.css

@@ -24,33 +24,38 @@
         'Helvetica Neue', Helvetica, sans-serif;
 } /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
 } /* сбрасывает синюю подсветку при нажатии */ .typography__alfasans-xlarge_1a23v {
-    font-size: 34px;
-    line-height: 40px;
-    font-weight: 500;
-    letter-spacing: -0.32px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-large_1a23v {
-    font-size: 30px;
-    line-height: 36px;
-    font-weight: 500;
-    letter-spacing: -0.25px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-medium_1a23v {
-    font-size: 26px;
-    line-height: 32px;
-    font-weight: 500;
-    letter-spacing: -0.25px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-small_1a23v {
-    font-size: 20px;
-    line-height: 28px;
-    font-weight: 500;
-    letter-spacing: -0.15px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-xsmall_1a23v {
-    font-size: 16px;
-    line-height: 20px;
-    font-weight: 500;
-    letter-spacing: -0.17px;
-    font-family: var(--font-family-alfasans);
-}
+        font-size: 34px;
+        line-height: 40px;
+        font-weight: 500;
+        letter-spacing: -0.32px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-xlarge_1a23v.typography__systemCompat_1a23v {
+        } .typography__alfasans-large_1a23v {
+        font-size: 30px;
+        line-height: 36px;
+        font-weight: 500;
+        letter-spacing: -0.25px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-large_1a23v.typography__systemCompat_1a23v {
+        } .typography__alfasans-medium_1a23v {
+        font-size: 26px;
+        line-height: 32px;
+        font-weight: 500;
+        letter-spacing: -0.25px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-medium_1a23v.typography__systemCompat_1a23v {
+        } .typography__alfasans-small_1a23v {
+        font-size: 20px;
+        line-height: 28px;
+        font-weight: 500;
+        letter-spacing: -0.15px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-small_1a23v.typography__systemCompat_1a23v {
+        } .typography__alfasans-xsmall_1a23v {
+        font-size: 16px;
+        line-height: 20px;
+        font-weight: 500;
+        letter-spacing: 0.17px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-xsmall_1a23v.typography__systemCompat_1a23v {
+        }

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

@@ -5,7 +5,10 @@ declare const TitleMobile: React.ForwardRefExoticComponent<Omit<React.HTMLAttrib
     view?: "small" | "medium" | "xlarge" | "large" | "xsmall" | undefined;
     color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | "static-accent" | "static-positive" | undefined;
     weight?: "bold" | "regular" | "medium" | "semibold" | undefined;
-    font?: "alfasans" | "styrene" | "system" | undefined;
+    font?: "alfasans" | "styrene" | "system" | {
+        font: "alfasans";
+        systemCompat: boolean;
+    } | undefined;
     defaultMargins?: boolean | undefined;
     className?: string | undefined;
     dataTestId?: string | undefined;

package/typography/esm/title-mobile/component.js

@@ -1,16 +1,17 @@
 import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { TitleBase } from '../title/component.js';
-import { c as commonStyles } from '../common.module-e407f621.js';
+import { c as commonStyles } from '../common.module-ac0b81f8.js';
 import 'react-merge-refs';
 import 'classnames';
+import '../../../shared/esm';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-2b98a9ac.js';
+import '../colors.module-a45cbf3e.js';
 
-var alfasansStyles = {"alfasans-xlarge":"typography__alfasans-xlarge_1a23v","alfasans-large":"typography__alfasans-large_1a23v","alfasans-medium":"typography__alfasans-medium_1a23v","alfasans-small":"typography__alfasans-small_1a23v","alfasans-xsmall":"typography__alfasans-xsmall_1a23v"};
+var alfasansStyles = {"alfasans-xlarge":"typography__alfasans-xlarge_1a23v","systemCompat":"typography__systemCompat_1a23v","alfasans-large":"typography__alfasans-large_1a23v","alfasans-medium":"typography__alfasans-medium_1a23v","alfasans-small":"typography__alfasans-small_1a23v","alfasans-xsmall":"typography__alfasans-xsmall_1a23v"};
 require('./alfasans-index.css');
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_mr7bc","styrene-large":"typography__styrene-large_mr7bc","styrene-medium":"typography__styrene-medium_mr7bc","styrene-small":"typography__styrene-small_mr7bc","styrene-xsmall":"typography__styrene-xsmall_mr7bc","system-xlarge":"typography__system-xlarge_mr7bc","system-large":"typography__system-large_mr7bc","system-medium":"typography__system-medium_mr7bc","system-small":"typography__system-small_mr7bc","system-xsmall":"typography__system-xsmall_mr7bc","margins-xlarge":"typography__margins-xlarge_mr7bc","margins-large":"typography__margins-large_mr7bc","margins-medium":"typography__margins-medium_mr7bc","margins-small":"typography__margins-small_mr7bc","margins-xsmall":"typography__margins-xsmall_mr7bc"};

package/typography/esm/title-mobile/index.js

@@ -4,9 +4,10 @@ import 'react';
 import '../title/component.js';
 import 'react-merge-refs';
 import 'classnames';
+import '../../../shared/esm';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-2b98a9ac.js';
-import '../common.module-e407f621.js';
+import '../colors.module-a45cbf3e.js';
+import '../common.module-ac0b81f8.js';

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

@@ -17,7 +17,10 @@ declare const TitleResponsive: React.ForwardRefExoticComponent<Omit<React.HTMLAt
     view?: "small" | "medium" | "xlarge" | "large" | "xsmall" | undefined;
     color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | "static-accent" | "static-positive" | undefined;
     weight?: "bold" | "regular" | "medium" | "semibold" | undefined;
-    font?: "alfasans" | "styrene" | "system" | undefined;
+    font?: "alfasans" | "styrene" | "system" | {
+        font: "alfasans";
+        systemCompat: boolean;
+    } | undefined;
     defaultMargins?: boolean | undefined;
     className?: string | undefined;
     dataTestId?: string | undefined;

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

@@ -6,12 +6,13 @@ import { TitleMobile } from '../title-mobile/component.js';
 import '../title/component.js';
 import 'react-merge-refs';
 import 'classnames';
+import '../../../shared/esm';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-2b98a9ac.js';
-import '../common.module-e407f621.js';
+import '../colors.module-a45cbf3e.js';
+import '../common.module-ac0b81f8.js';
 
 var TitleResponsive = forwardRef(function (_a, ref) {
     var breakpoint = _a.breakpoint, client = _a.client, restProps = __rest(_a, ["breakpoint", "client"]);

package/typography/esm/title-responsive/index.js

@@ -6,10 +6,11 @@ import '../title/index.js';
 import '../title/component.js';
 import 'react-merge-refs';
 import 'classnames';
+import '../../../shared/esm';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-2b98a9ac.js';
-import '../common.module-e407f621.js';
+import '../colors.module-a45cbf3e.js';
+import '../common.module-ac0b81f8.js';
 import '../title-mobile/component.js';

package/typography/modern/component.js

@@ -8,10 +8,11 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-d34104dd.js';
+import './colors.module-472088c5.js';
 import './title/component.js';
+import '../../shared/modern';
 import './title/utils.js';
-import './common.module-b8bef2ee.js';
+import './common.module-d9736c87.js';
 import '../../mq/modern';
 
 const Typography = {

package/typography/modern/index.js

@@ -10,8 +10,9 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-d34104dd.js';
+import './colors.module-472088c5.js';
 import './title/component.js';
+import '../../shared/modern';
 import './title/utils.js';
-import './common.module-b8bef2ee.js';
+import './common.module-d9736c87.js';
 import '../../mq/modern';

package/typography/modern/text/alfasans-index.css

@@ -23,112 +23,110 @@
     --font-family-alfasans: 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
 } /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
-} /* сбрасывает синюю подсветку при нажатии */ .typography__text_cu8s8.typography__primary-large_cu8s8 {
-        font-size: 18px;
-        line-height: 24px;
-        font-weight: 400;
-        letter-spacing: -0.36px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__primary-medium_cu8s8 {
-        font-size: 16px;
-        line-height: 24px;
-        font-weight: 400;
-        letter-spacing: -0.24px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__primary-small_cu8s8 {
-        font-size: 14px;
-        line-height: 20px;
-        font-weight: 400;
-        letter-spacing: -0.08px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__secondary-large_cu8s8 {
-        font-size: 13px;
-        line-height: 16px;
-        font-weight: 400;
-        letter-spacing: 0;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__secondary-medium_cu8s8 {
-        font-size: 12px;
-        line-height: 16px;
-        font-weight: 400;
-        letter-spacing: 0.06px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__secondary-small_cu8s8 {
-        font-size: 11px;
-        line-height: 16px;
-        font-weight: 400;
-        letter-spacing: 0.15px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__component_cu8s8 {
-        font-size: 16px;
-        line-height: 20px;
-        font-weight: 400;
-        letter-spacing: -0.24px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__component-primary_cu8s8 {
-        font-size: 16px;
-        line-height: 20px;
-        font-weight: 400;
-        letter-spacing: -0.24px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__component-secondary_cu8s8 {
-        font-size: 14px;
-        line-height: 18px;
-        font-weight: 400;
-        letter-spacing: -0.08px;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__caps_cu8s8 {
-        font-size: 12px;
-        line-height: 16px;
-        font-weight: 400;
-        letter-spacing: 1.25px;
-        text-transform: uppercase;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__tagline_cu8s8 {
-        font-size: 12px;
-        line-height: 16px;
-        font-weight: 400;
-        letter-spacing: 1.25px;
-        text-transform: uppercase;
-        font-family: var(--font-family-alfasans);
-    } .typography__text_cu8s8.typography__bold_cu8s8 {
-        font-weight: 700
-    } .typography__text_cu8s8.typography__bold_cu8s8.typography__primary-large_cu8s8 {
-            letter-spacing: 0.38px; /* @mixin accent_primary_large */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__primary-medium_cu8s8 {
-            letter-spacing: 0.43px; /* @mixin accent_primary_medium */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__primary-small_cu8s8 {
-            letter-spacing: 0.47px; /* @mixin accent_primary_small */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__secondary-large_cu8s8 {
-            letter-spacing: 0.54px; /* @mixin accent_secondary_large */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__secondary-medium_cu8s8 {
-            letter-spacing: 0.57px; /* @mixin accent_secondary_medium */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__secondary-small_cu8s8 {
-            letter-spacing: 0.54px; /* @mixin accent_secondary_small */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__component_cu8s8 {
-            letter-spacing: 0.43px; /* @mixin accent_component */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__component-primary_cu8s8 {
-            letter-spacing: 0.43px; /* @mixin accent_component_primary */
-        } .typography__text_cu8s8.typography__bold_cu8s8.typography__component-secondary_cu8s8 {
-            letter-spacing: 0.47px; /* @mixin accent_component_secondary */
+} /* сбрасывает синюю подсветку при нажатии */ .typography__text_cu8s8.typography__component_cu8s8 {
+            font-size: 16px;
+            line-height: 20px;
+            font-weight: 400;
+            letter-spacing: -0.24px;
+            font-family: var(--font-family-alfasans);
+        } .typography__text_cu8s8.typography__caps_cu8s8 {
+            font-size: 12px;
+            line-height: 16px;
+            font-weight: 400;
+            letter-spacing: 1.25px;
+            text-transform: uppercase;
+            font-family: var(--font-family-alfasans);
+        } .typography__text_cu8s8.typography__tagline_cu8s8 {
+            font-size: 12px;
+            line-height: 16px;
+            font-weight: 400;
+            letter-spacing: 1.25px;
+            text-transform: uppercase;
+            font-family: var(--font-family-alfasans);
+        } .typography__text_cu8s8.typography__primary-large_cu8s8 {
+                font-size: 18px;
+                line-height: 24px;
+                font-weight: 400;
+                letter-spacing: -0.36px;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__primary-large_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.38px;
+                } .typography__text_cu8s8.typography__primary-large_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.17px;
+                } .typography__text_cu8s8.typography__primary-medium_cu8s8 {
+                font-size: 16px;
+                line-height: 24px;
+                font-weight: 400;
+                letter-spacing: -0.24px;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__primary-medium_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.43px;
+                } .typography__text_cu8s8.typography__primary-medium_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.17px;
+                } .typography__text_cu8s8.typography__primary-small_cu8s8 {
+                font-size: 14px;
+                line-height: 20px;
+                font-weight: 400;
+                letter-spacing: -0.08px;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__primary-small_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.47px;
+                } .typography__text_cu8s8.typography__primary-small_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.27px;
+                } .typography__text_cu8s8.typography__component-primary_cu8s8 {
+            font-size: 16px;
+            line-height: 20px;
+            font-weight: 400;
+            letter-spacing: -0.24px;
+            font-family: var(--font-family-alfasans)
+        } .typography__text_cu8s8.typography__component-primary_cu8s8.typography__bold_cu8s8 {
+                letter-spacing: 0.43px;
+            } .typography__text_cu8s8.typography__component-primary_cu8s8.typography__medium_cu8s8 {
+                letter-spacing: 0.17px;
+
+            } .typography__text_cu8s8.typography__secondary-large_cu8s8 {
+                font-size: 13px;
+                line-height: 16px;
+                font-weight: 400;
+                letter-spacing: 0;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__secondary-large_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.54px;
+                } .typography__text_cu8s8.typography__secondary-large_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.33px;
+                } .typography__text_cu8s8.typography__secondary-medium_cu8s8 {
+                font-size: 12px;
+                line-height: 16px;
+                font-weight: 400;
+                letter-spacing: 0.06px;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__secondary-medium_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.57px;
+                } .typography__text_cu8s8.typography__secondary-medium_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.38px;
+                } .typography__text_cu8s8.typography__secondary-small_cu8s8 {
+                font-size: 11px;
+                line-height: 16px;
+                font-weight: 400;
+                letter-spacing: 0.15px;
+                font-family: var(--font-family-alfasans)
+            } .typography__text_cu8s8.typography__secondary-small_cu8s8.typography__bold_cu8s8 {
+                    letter-spacing: 0.54px;
+                } .typography__text_cu8s8.typography__secondary-small_cu8s8.typography__medium_cu8s8 {
+                    letter-spacing: 0.41px;
+                } .typography__text_cu8s8.typography__component-secondary_cu8s8 {
+            font-size: 14px;
+            line-height: 18px;
+            font-weight: 400;
+            letter-spacing: -0.08px;
+            font-family: var(--font-family-alfasans)
+        } .typography__text_cu8s8.typography__component-secondary_cu8s8.typography__bold_cu8s8 {
+                letter-spacing: 0.47px;
+            } .typography__text_cu8s8.typography__component-secondary_cu8s8.typography__medium_cu8s8 {
+                letter-spacing: 0.27px;
+
+            } .typography__text_cu8s8.typography__bold_cu8s8 {
+            font-weight: 700;
         } .typography__text_cu8s8.typography__medium_cu8s8 {
-        font-weight: 500
-    } .typography__text_cu8s8.typography__medium_cu8s8.typography__primary-large_cu8s8 {
-            letter-spacing: 0.17px; /* @mixin action_primary_large */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__primary-medium_cu8s8 {
-            letter-spacing: 0.17px; /* @mixin action_primary_medium */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__primary-small_cu8s8 {
-            letter-spacing: 0.27px; /* @mixin action_primary_small */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__secondary-large_cu8s8 {
-            letter-spacing: 0.33px; /* @mixin action_secondary_large */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__secondary-medium_cu8s8 {
-            letter-spacing: 0.38px; /* @mixin action_secondary_medium */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__secondary-small_cu8s8 {
-            letter-spacing: 0.41px; /* @mixin action_secondary_small */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__component_cu8s8 {
-            letter-spacing: 0.17px; /* @mixin action_component */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__component-primary_cu8s8 {
-            letter-spacing: 0.17px; /* @mixin action_component_primary */
-        } .typography__text_cu8s8.typography__medium_cu8s8.typography__component-secondary_cu8s8 {
-            letter-spacing: 0.27px; /* @mixin action_component_secondary */
+            font-weight: 500;
         }

package/typography/modern/text/component.js

@@ -2,11 +2,11 @@ import React, { forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
-import { c as colors } from '../colors.module-d34104dd.js';
+import { c as colors } from '../colors.module-472088c5.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 
-const alfasansStyles = {"text":"typography__text_cu8s8","primary-large":"typography__primary-large_cu8s8","primary-medium":"typography__primary-medium_cu8s8","primary-small":"typography__primary-small_cu8s8","secondary-large":"typography__secondary-large_cu8s8","secondary-medium":"typography__secondary-medium_cu8s8","secondary-small":"typography__secondary-small_cu8s8","component":"typography__component_cu8s8","component-primary":"typography__component-primary_cu8s8","component-secondary":"typography__component-secondary_cu8s8","caps":"typography__caps_cu8s8","tagline":"typography__tagline_cu8s8","bold":"typography__bold_cu8s8","medium":"typography__medium_cu8s8"};
+const alfasansStyles = {"text":"typography__text_cu8s8","component":"typography__component_cu8s8","caps":"typography__caps_cu8s8","tagline":"typography__tagline_cu8s8","primary-large":"typography__primary-large_cu8s8","bold":"typography__bold_cu8s8","medium":"typography__medium_cu8s8","primary-medium":"typography__primary-medium_cu8s8","primary-small":"typography__primary-small_cu8s8","component-primary":"typography__component-primary_cu8s8","secondary-large":"typography__secondary-large_cu8s8","secondary-medium":"typography__secondary-medium_cu8s8","secondary-small":"typography__secondary-small_cu8s8","component-secondary":"typography__component-secondary_cu8s8"};
 require('./alfasans-index.css');
 
 const styles = {"transparent":"typography__transparent_1vigz","paragraph":"typography__paragraph_1vigz","paragraphWithMargins":"typography__paragraphWithMargins_1vigz","primary-large":"typography__primary-large_1vigz","primary-medium":"typography__primary-medium_1vigz","primary-small":"typography__primary-small_1vigz","secondary-large":"typography__secondary-large_1vigz","secondary-medium":"typography__secondary-medium_1vigz","secondary-small":"typography__secondary-small_1vigz","component":"typography__component_1vigz","component-primary":"typography__component-primary_1vigz","component-secondary":"typography__component-secondary_1vigz","caps":"typography__caps_1vigz","tagline":"typography__tagline_1vigz","bold":"typography__bold_1vigz","medium":"typography__medium_1vigz","regular":"typography__regular_1vigz","monospace":"typography__monospace_1vigz","rowLimit1":"typography__rowLimit1_1vigz","rowLimit2":"typography__rowLimit2_1vigz","rowLimit3":"typography__rowLimit3_1vigz"};

package/typography/modern/text/index.js

@@ -5,4 +5,4 @@ import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
-import '../colors.module-d34104dd.js';
+import '../colors.module-472088c5.js';

package/typography/modern/title/alfasans-index.css

@@ -24,33 +24,48 @@
         'Helvetica Neue', Helvetica, sans-serif;
 } /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
 } /* сбрасывает синюю подсветку при нажатии */ .typography__alfasans-xlarge_1365o {
-    font-size: 48px;
-    line-height: 64px;
-    font-weight: 700;
-    letter-spacing: 0.1px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-large_1365o {
-    font-size: 40px;
-    line-height: 48px;
-    font-weight: 700;
-    letter-spacing: 0.1px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-medium_1365o {
-    font-size: 32px;
-    line-height: 40px;
-    font-weight: 700;
-    letter-spacing: 0.3px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-small_1365o {
-    font-size: 24px;
-    line-height: 32px;
-    font-weight: 700;
-    letter-spacing: 0.39px;
-    font-family: var(--font-family-alfasans);
-} .typography__alfasans-xsmall_1365o {
-    font-size: 20px;
-    line-height: 24px;
-    font-weight: 700;
-    letter-spacing: 0.39px;
-    font-family: var(--font-family-alfasans);
-}
+        font-size: 48px;
+        line-height: 64px;
+        font-weight: 700;
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-xlarge_1365o.typography__systemCompat_1365o {
+            line-height: 52px;
+        } .typography__alfasans-large_1365o {
+        font-size: 40px;
+        line-height: 48px;
+        font-weight: 700;
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-large_1365o.typography__systemCompat_1365o {
+        } .typography__alfasans-medium_1365o {
+        font-size: 32px;
+        line-height: 40px;
+        font-weight: 700;
+        letter-spacing: 0.3px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-medium_1365o.typography__systemCompat_1365o {
+            font-size: 30px;
+            line-height: 36px;
+            letter-spacing: 0.1px;
+        } .typography__alfasans-small_1365o {
+        font-size: 24px;
+        line-height: 32px;
+        font-weight: 700;
+        letter-spacing: 0.39px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-small_1365o.typography__systemCompat_1365o {
+            font-size: 22px;
+            line-height: 26px;
+            letter-spacing: 0.2px;
+        } .typography__alfasans-xsmall_1365o {
+        font-size: 20px;
+        line-height: 24px;
+        font-weight: 700;
+        letter-spacing: 0.39px;
+        font-family: var(--font-family-alfasans)
+    } .typography__alfasans-xsmall_1365o.typography__systemCompat_1365o {
+            font-size: 18px;
+            line-height: 22px;
+            letter-spacing: 0.38px;
+        }

package/typography/modern/title/component.d.ts

@@ -24,7 +24,10 @@ type TitleProps = Omit<NativeProps, 'color'> & {
     /**
      * Шрифт текста
      */
-    font?: 'styrene' | 'system' | 'alfasans';
+    font?: 'styrene' | 'system' | 'alfasans' | {
+        font: 'alfasans';
+        systemCompat: boolean;
+    };
     /**
      * Добавляет отступы
      */
@@ -85,7 +88,10 @@ declare const TitleBase: React.ForwardRefExoticComponent<Omit<NativeProps, "colo
     /**
      * Шрифт текста
      */
-    font?: "alfasans" | "styrene" | "system" | undefined;
+    font?: "alfasans" | "styrene" | "system" | {
+        font: 'alfasans';
+        systemCompat: boolean;
+    } | undefined;
     /**
      * Добавляет отступы
      */

package/typography/modern/title/component.js

@@ -1,13 +1,14 @@
 import React, { forwardRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
+import { isObject } from '../../../shared/modern';
 import { useSkeleton } from '../hooks/use-skeleton.js';
 import { getDefaultWeight } from './utils.js';
-import { c as colors } from '../colors.module-d34104dd.js';
+import { c as colors } from '../colors.module-472088c5.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 
-const TitleBase = forwardRef(({ tag: Component = 'div', view = 'medium', font = 'styrene', platform, weight = getDefaultWeight(font, platform), defaultMargins = false, color, className, dataTestId, children, rowLimit, styles, skeletonProps, showSkeleton, ...restProps }, ref) => {
+const TitleBase = forwardRef(({ tag: Component = 'div', view = 'medium', font: fontProp = 'styrene', platform, weight = getDefaultWeight(isObject(fontProp) ? fontProp.font : fontProp, platform), defaultMargins = false, color, className, dataTestId, children, rowLimit, styles, skeletonProps, showSkeleton, ...restProps }, ref) => {
     const { renderSkeleton, textRef } = useSkeleton(showSkeleton, skeletonProps);
     const skeleton = renderSkeleton({
         wrapperClassName: cn(defaultMargins && styles[`margins-${view}`]),
@@ -16,9 +17,19 @@ const TitleBase = forwardRef(({ tag: Component = 'div', view = 'medium', font =
     if (skeleton) {
         return skeleton;
     }
+    let font;
+    let systemCompat;
+    if (isObject(fontProp)) {
+        font = fontProp.font;
+        systemCompat = fontProp.systemCompat;
+    }
+    else {
+        font = fontProp;
+    }
     return (React.createElement(Component, { className: cn(styles.component, className, styles[`${font}-${view}`], defaultMargins && styles[`margins-${view}`], styles[weight], color && colors[color], {
             [styles[`rowLimit${rowLimit}`]]: rowLimit,
             [styles.transparent]: showSkeleton,
+            [styles.systemCompat]: systemCompat,
         }), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]), ...restProps }, children));
 });
 

package/typography/modern/title/index.d.ts

@@ -6,7 +6,10 @@ declare const Title: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<H
     view?: "small" | "medium" | "xlarge" | "large" | "xsmall" | undefined;
     color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | "static-primary-light" | "static-secondary-light" | "static-tertiary-light" | "static-primary-dark" | "static-secondary-dark" | "static-tertiary-dark" | "static-accent" | "static-positive" | undefined;
     weight?: "bold" | "regular" | "medium" | "semibold" | undefined;
-    font?: "alfasans" | "styrene" | "system" | undefined;
+    font?: "alfasans" | "styrene" | "system" | {
+        font: "alfasans";
+        systemCompat: boolean;
+    } | undefined;
     defaultMargins?: boolean | undefined;
     className?: string | undefined;
     dataTestId?: string | undefined;