@alfalab/core-components 47.20.0-beta.3 → 47.21.0

package/themes/compiled/mobile-dark-bluetint.css

@@ -1,4 +1,21 @@
-.card-image__cardImage_9a9ku {
+.backdrop__backdrop_ut5yk {
+    -webkit-tap-highlight-color: transparent;
+} .backdrop__appear_ut5yk,
+.backdrop__enter_ut5yk {
+    background-color: transparent;
+} .backdrop__appearActive_ut5yk,
+.backdrop__enterActive_ut5yk,
+.backdrop__appearDone_ut5yk,
+.backdrop__enterDone_ut5yk {
+    background-color: rgba(0, 0, 0, 0.7);
+} .backdrop__exit_ut5yk {
+    background-color: rgba(0, 0, 0, 0.7);
+} .backdrop__exitActive_ut5yk,
+.backdrop__exitDone_ut5yk {
+    background-color: transparent;
+} .backdrop__transparent_ut5yk {
+    background-color: transparent;
+}.card-image__cardImage_9a9ku {
     background: #e7e8ea;
 } .card-image__loaded_9a9ku {
     background: transparent
@@ -62,23 +79,6 @@
         background-color: rgba(255, 255, 255, 0.94);
     } .badge__dot_1wmp2.badge__outlineCount_1wmp2 {
     border: 1px solid rgba(3, 3, 6, 0.88);
-}.backdrop__backdrop_ut5yk {
-    -webkit-tap-highlight-color: transparent;
-} .backdrop__appear_ut5yk,
-.backdrop__enter_ut5yk {
-    background-color: transparent;
-} .backdrop__appearActive_ut5yk,
-.backdrop__enterActive_ut5yk,
-.backdrop__appearDone_ut5yk,
-.backdrop__enterDone_ut5yk {
-    background-color: rgba(0, 0, 0, 0.7);
-} .backdrop__exit_ut5yk {
-    background-color: rgba(0, 0, 0, 0.7);
-} .backdrop__exitActive_ut5yk,
-.backdrop__exitDone_ut5yk {
-    background-color: transparent;
-} .backdrop__transparent_ut5yk {
-    background-color: transparent;
 }.divider__component_16a5r {
     border-bottom: 1px solid #353539;
 }.dropzone__component_19uvn {
@@ -459,143 +459,4 @@
 .status-badge__neutral-operation_prv19,
 .status-badge__neutral-cross_prv19 {
     background-color: #898991;
-}.underlay__background-accent_16959 {
-            background-color: #ef3124;
-        } .underlay__background-info_16959 {
-            background-color: #001c3c;
-        } .underlay__background-attention-muted_16959 {
-            background-color: #36291f;
-        } .underlay__background-positive-muted_16959 {
-            background-color: #232d25;
-        } .underlay__background-negative-muted_16959 {
-            background-color: #392523;
-        } .underlay__background-primary_16959 {
-            background-color: #0e0e0e;
-        } .underlay__background-primary-inverted_16959 {
-            background-color: #fff;
-        } .underlay__background-secondary_16959 {
-            background-color: #1c1c1e;
-        } .underlay__background-secondary-inverted_16959 {
-            background-color: #f2f3f5;
-        } .underlay__background-tertiary_16959 {
-            background-color: #27272a;
-        } .underlay__background-tertiary-inverted_16959 {
-            background-color: #e7e8ea;
-        } .underlay__background-quaternary_16959 {
-            background-color: #36363a;
-        } .underlay__background-quaternary-inverted_16959 {
-            background-color: #dcdee2;
-        } .underlay__background-specialbg-component_16959 {
-            background-color: rgba(255, 255, 255, 0.1);
-        } .underlay__background-specialbg-component-inverted_16959 {
-            background-color: rgba(11, 31, 53, 0.07);
-        } .underlay__background-specialbg-primary-grouped_16959 {
-            background-color: #1c1c1e;
-        } .underlay__background-specialbg-secondary-grouped_16959 {
-            background-color: #27272a;
-        } .underlay__background-specialbg-tertiary-grouped_16959 {
-            background-color: #36363a;
-        } .underlay__background-specialbg-secondary-transparent_16959 {
-            background-color: rgba(214, 214, 229, 0.07);
-        } .underlay__background-specialbg-secondary-transparent-inverted_16959 {
-            background-color: rgba(38, 55, 88, 0.06);
-        } .underlay__background-specialbg-tertiary-transparent_16959 {
-            background-color: rgba(222, 222, 240, 0.12);
-        } .underlay__background-specialbg-tertiary-transparent-inverted_16959 {
-            background-color: rgba(30, 43, 68, 0.08);
-        } .underlay__shadow-xs_16959 {
-        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.04), 0 0 1px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-s_16959 {
-        box-shadow: 0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
-        0 0 1px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-m_16959 {
-        box-shadow: 0 20px 24px rgba(0, 0, 0, 0.08), 0 12px 16px rgba(0, 0, 0, 0.04),
-        0 4px 8px rgba(0, 0, 0, 0.04), 0 0 1px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-l_16959 {
-        box-shadow: 0 24px 32px rgba(0, 0, 0, 0.08), 0 20px 24px rgba(0, 0, 0, 0.08),
-        0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04), 0 0 1px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-xl_16959 {
-        box-shadow: 0 32px 40px rgba(0, 0, 0, 0.08), 0 24px 32px rgba(0, 0, 0, 0.08),
-        0 20px 24px rgba(0, 0, 0, 0.08), 0 12px 16px rgba(0, 0, 0, 0.04),
-        0 4px 8px rgba(0, 0, 0, 0.04), 0 0 1px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-xs-hard_16959 {
-        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-s-hard_16959 {
-        box-shadow: 0 12px 16px rgba(0, 0, 0, 0.16), 0 4px 8px rgba(0, 0, 0, 0.16),
-        0 0 1px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-m-hard_16959 {
-        box-shadow: 0 20px 24px rgba(0, 0, 0, 0.2), 0 12px 16px rgba(0, 0, 0, 0.16),
-        0 4px 8px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-l-hard_16959 {
-        box-shadow: 0 24px 32px rgba(0, 0, 0, 0.2), 0 20px 24px rgba(0, 0, 0, 0.2),
-        0 12px 16px rgba(0, 0, 0, 0.16), 0 4px 8px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-xl-hard_16959 {
-        box-shadow: 0 32px 40px rgba(0, 0, 0, 0.2), 0 24px 32px rgba(0, 0, 0, 0.2),
-        0 20px 24px rgba(0, 0, 0, 0.2), 0 12px 16px rgba(0, 0, 0, 0.16),
-        0 4px 8px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-xs-up_16959 {
-        box-shadow: 0 0 4px rgba(0, 0, 0, 0.02), 0 -2px 4px rgba(0, 0, 0, 0.04);
-    } .underlay__shadow-s-up_16959 {
-        box-shadow: 0 0 8px rgba(0, 0, 0, 0.04), 0 -4px 8px rgba(0, 0, 0, 0.08);
-    } .underlay__shadow-m-up_16959 {
-        box-shadow: 0 0 16px rgba(0, 0, 0, 0.08), 0 -8px 16px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-l-up_16959 {
-        box-shadow: 0 0 24px rgba(0, 0, 0, 0.12), 0 -12px 24px rgba(0, 0, 0, 0.24);
-    } .underlay__shadow-xl-up_16959 {
-        box-shadow: 0 0 32px rgba(0, 0, 0, 0.16), 0 -16px 32px rgba(0, 0, 0, 0.32);
-    } .underlay__shadow-xs-hard-up_16959 {
-        box-shadow: 0 0 4px rgba(0, 0, 0, 0.02), 0 -2px 4px rgba(0, 0, 0, 0.04),
-        0 -2px 4px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-s-hard-up_16959 {
-        box-shadow: 0 0 8px rgba(0, 0, 0, 0.04), 0 -4px 8px rgba(0, 0, 0, 0.08),
-        0 -4px 8px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-m-hard-up_16959 {
-        box-shadow: 0 0 16px rgba(0, 0, 0, 0.08), 0 -8px 16px rgba(0, 0, 0, 0.16),
-        0 -8px 16px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-l-hard-up_16959 {
-        box-shadow: 0 0 24px rgba(0, 0, 0, 0.12), 0 -12px 24px rgba(0, 0, 0, 0.24),
-        0 -12px 24px rgba(0, 0, 0, 0.16);
-    } .underlay__shadow-xl-hard-up_16959 {
-        box-shadow: 0 0 32px rgba(0, 0, 0, 0.16), 0 -16px 32px rgba(0, 0, 0, 0.32),
-        0 -16px 32px rgba(0, 0, 0, 0.16);
-    } .underlay__border-color-accent_16959 {
-        border-color: #f83a2a;
-    } .underlay__border-color-key_16959 {
-        border-color: rgba(255, 255, 255, 0.94);
-    } .underlay__border-color-key-inverted_16959 {
-        border-color: rgba(3, 3, 6, 0.88);
-    } .underlay__border-color-link_16959 {
-        border-color: #3193fc;
-    } .underlay__border-color-primary_16959 {
-        border-color: #353539;
-    } .underlay__border-color-primary-inverted_16959 {
-        border-color: #d2d3d9;
-    } .underlay__border-color-secondary_16959 {
-        border-color: #29292c;
-    } .underlay__border-color-secondary-inverted_16959 {
-        border-color: #e7e8eb;
-    } .underlay__border-color-tertiary_16959 {
-        border-color: #212124;
-    } .underlay__border-color-tertiary-inverted_16959 {
-        border-color: #edeef0;
-    } .underlay__border-color-underline_16959 {
-        border-color: #4a4a51;
-    } .underlay__border-color-underline-inverted_16959 {
-        border-color: #babbc2;
-    } .underlay__border-color-graphic-attention_16959 {
-        border-color: #fda136;
-    } .underlay__border-color-graphic-link_16959 {
-        border-color: #3193fc;
-    } .underlay__border-color-graphic-negative_16959 {
-        border-color: #ff4837;
-    } .underlay__border-color-graphic-positive_16959 {
-        border-color: #17d055;
-    } .underlay__border-color-specialbg-secondary-transparent_16959 {
-        border-color: rgba(225, 225, 248, 0.09);
-    } .underlay__border-color-specialbg-secondary-transparent-inverted_16959 {
-        border-color: rgba(30, 43, 68, 0.08);
-    } .underlay__border-color-specialbg-tertiary-transparent_16959 {
-        border-color: rgba(222, 222, 238, 0.13);
-    } .underlay__border-color-specialbg-tertiary-transparent-inverted_16959 {
-        border-color: rgba(15, 25, 55, 0.1);
-    }
+}

package/time-input/utils/format.js

@@ -15,12 +15,16 @@ var isValidTimeFormat = function (value) {
     }
     return true;
 };
-var isValidInputValue = function (inputValue) { return !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue)); };
-var format = function (value) { return value
-    .replace(/^(\d\d)(\d)$/, '$1:$2') // 123 => 12:3
-    .replace(/^(\d\d)(\d\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)
-    .replace(/^(\d):(\d\d)(\d)/, '$1:$2') // 1:234 => 1:23
-    .replace(/\:$/, ''); }; // 12: => 12 || : => void
+var isValidInputValue = function (inputValue) {
+    return !inputValue || (isCompleteTimeInput(inputValue) && isValidTimeFormat(inputValue));
+};
+var format = function (value) {
+    return value
+        .replace(/^(\d\d)(\d)$/, '$1:$2') // 123 => 12:3
+        .replace(/^(\d\d)(\d\d)/, '$1:$2') // 12345 => 12:45 (если вместо двоеточия введена цифра, она обратно заменяется на двоеточие)
+        .replace(/^(\d):(\d\d)(\d)/, '$1:$2') // 1:234 => 1:23
+        .replace(/\:$/, '');
+}; // 12: => 12 || : => void
 
 exports.DATE_MASK = DATE_MASK;
 exports.format = format;

package/typography/cssm/common.module.css

@@ -0,0 +1,3 @@
+.transparent {
+    opacity: 0;
+}

package/typography/cssm/text/component.js

@@ -50,6 +50,7 @@ var Text = React.forwardRef(function (_a, ref) {
             _c[styles__default.default.paragraphWithMargins] = Component === 'p' && defaultMargins,
             _c[styles__default.default.monospace] = monospaceNumbers,
             _c[styles__default.default["rowLimit".concat(rowLimit)]] = rowLimit,
+            _c[styles__default.default.transparent] = showSkeleton,
             _c), className, color && colors__default.default[color], styles__default.default[view], weight && styles__default.default[weight]), "data-test-id": dataTestId, ref: mergeRefs__default.default([ref, textRef]) }, restProps), children));
 });
 

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

@@ -20,7 +20,9 @@
     --gap-12: var(--gap-s);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ :root {
+} /* сбрасывает синюю подсветку при нажатии */ .transparent {
+    opacity: 0;
+} :root {
     --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);
 } .paragraph {
     margin: var(--gap-0);

package/typography/cssm/title/component.js

@@ -26,7 +26,10 @@ var TitleBase = React.forwardRef(function (_a, ref) {
     if (skeleton) {
         return skeleton;
     }
-    return (React__default.default.createElement(Component, tslib.__assign({ className: cn__default.default(styles.component, className, styles["".concat(font, "-").concat(view)], defaultMargins && styles["margins-".concat(view)], styles[weight], color && colors__default.default[color], (_b = {}, _b[styles["rowLimit".concat(rowLimit)]] = rowLimit, _b)), "data-test-id": dataTestId, ref: mergeRefs__default.default([ref, textRef]) }, restProps), children));
+    return (React__default.default.createElement(Component, tslib.__assign({ className: cn__default.default(styles.component, className, styles["".concat(font, "-").concat(view)], defaultMargins && styles["margins-".concat(view)], styles[weight], color && colors__default.default[color], (_b = {},
+            _b[styles["rowLimit".concat(rowLimit)]] = rowLimit,
+            _b[styles.transparent] = showSkeleton,
+            _b)), "data-test-id": dataTestId, ref: mergeRefs__default.default([ref, textRef]) }, restProps), children));
 });
 
 exports.TitleBase = TitleBase;

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

@@ -28,7 +28,9 @@
     --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .styrene-xlarge {
+} /* сбрасывает синюю подсветку при нажатии */ .transparent {
+    opacity: 0;
+} .styrene-xlarge {
     font-size: 48px;
     line-height: 64px;
     font-weight: 500;

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-ecac5cf6.js';
+import './colors.module-8ee7777c.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-247badde.js';
+import './common.module-918e04b1.js';
 import '../../mq/esm';
 
 var Typography = {

package/typography/esm/index.js

@@ -8,11 +8,11 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/esm';
 import '@alfalab/hooks';
-import './colors.module-ecac5cf6.js';
+import './colors.module-8ee7777c.js';
 import './title/index.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-247badde.js';
+import './common.module-918e04b1.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';
 import '../../mq/esm';

package/typography/esm/text/component.js

@@ -3,11 +3,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-ecac5cf6.js';
+import { c as colors } from '../colors.module-8ee7777c.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 
-var styles = {"paragraph":"typography__paragraph_6j1xz","paragraphWithMargins":"typography__paragraphWithMargins_6j1xz","primary-large":"typography__primary-large_6j1xz","primary-medium":"typography__primary-medium_6j1xz","primary-small":"typography__primary-small_6j1xz","secondary-large":"typography__secondary-large_6j1xz","secondary-medium":"typography__secondary-medium_6j1xz","secondary-small":"typography__secondary-small_6j1xz","component":"typography__component_6j1xz","component-primary":"typography__component-primary_6j1xz","component-secondary":"typography__component-secondary_6j1xz","caps":"typography__caps_6j1xz","tagline":"typography__tagline_6j1xz","bold":"typography__bold_6j1xz","medium":"typography__medium_6j1xz","regular":"typography__regular_6j1xz","monospace":"typography__monospace_6j1xz","rowLimit1":"typography__rowLimit1_6j1xz","rowLimit2":"typography__rowLimit2_6j1xz","rowLimit3":"typography__rowLimit3_6j1xz"};
+var styles = {"transparent":"typography__transparent_6j1xz","paragraph":"typography__paragraph_6j1xz","paragraphWithMargins":"typography__paragraphWithMargins_6j1xz","primary-large":"typography__primary-large_6j1xz","primary-medium":"typography__primary-medium_6j1xz","primary-small":"typography__primary-small_6j1xz","secondary-large":"typography__secondary-large_6j1xz","secondary-medium":"typography__secondary-medium_6j1xz","secondary-small":"typography__secondary-small_6j1xz","component":"typography__component_6j1xz","component-primary":"typography__component-primary_6j1xz","component-secondary":"typography__component-secondary_6j1xz","caps":"typography__caps_6j1xz","tagline":"typography__tagline_6j1xz","bold":"typography__bold_6j1xz","medium":"typography__medium_6j1xz","regular":"typography__regular_6j1xz","monospace":"typography__monospace_6j1xz","rowLimit1":"typography__rowLimit1_6j1xz","rowLimit2":"typography__rowLimit2_6j1xz","rowLimit3":"typography__rowLimit3_6j1xz"};
 require('./index.css');
 
 var logWarning = function (view) {
@@ -44,6 +44,7 @@ var Text = forwardRef(function (_a, ref) {
             _c[styles.paragraphWithMargins] = Component === 'p' && defaultMargins,
             _c[styles.monospace] = monospaceNumbers,
             _c[styles["rowLimit".concat(rowLimit)]] = rowLimit,
+            _c[styles.transparent] = showSkeleton,
             _c), className, color && colors[color], styles[view], weight && styles[weight]), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]) }, restProps), children));
 });
 

package/typography/esm/text/index.css

@@ -21,7 +21,9 @@
     --gap-12: var(--gap-s);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ :root {
+} /* сбрасывает синюю подсветку при нажатии */ .typography__transparent_6j1xz {
+    opacity: 0;
+} :root {
     --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);
 } .typography__paragraph_6j1xz {
     margin: var(--gap-0);

package/typography/esm/text/index.js

@@ -6,4 +6,4 @@ import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
-import '../colors.module-ecac5cf6.js';
+import '../colors.module-8ee7777c.js';

package/typography/esm/title/component.js

@@ -4,7 +4,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
 import { getDefaultWeight } from './utils.js';
-import { c as colors } from '../colors.module-ecac5cf6.js';
+import { c as colors } from '../colors.module-8ee7777c.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 
@@ -19,7 +19,10 @@ var TitleBase = forwardRef(function (_a, ref) {
     if (skeleton) {
         return skeleton;
     }
-    return (React.createElement(Component, __assign({ className: cn(styles.component, className, styles["".concat(font, "-").concat(view)], defaultMargins && styles["margins-".concat(view)], styles[weight], color && colors[color], (_b = {}, _b[styles["rowLimit".concat(rowLimit)]] = rowLimit, _b)), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]) }, restProps), children));
+    return (React.createElement(Component, __assign({ className: cn(styles.component, className, styles["".concat(font, "-").concat(view)], defaultMargins && styles["margins-".concat(view)], styles[weight], color && colors[color], (_b = {},
+            _b[styles["rowLimit".concat(rowLimit)]] = rowLimit,
+            _b[styles.transparent] = showSkeleton,
+            _b)), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]) }, restProps), children));
 });
 
 export { TitleBase };

package/typography/esm/title/index.css

@@ -29,7 +29,9 @@
     --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .typography__styrene-xlarge_1ynbc {
+} /* сбрасывает синюю подсветку при нажатии */ .typography__transparent_1ynbc {
+    opacity: 0;
+} .typography__styrene-xlarge_1ynbc {
     font-size: 48px;
     line-height: 64px;
     font-weight: 500;

package/typography/esm/title/index.js

@@ -1,16 +1,16 @@
 import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { TitleBase } from './component.js';
-import { c as commonStyles } from '../common.module-247badde.js';
+import { c as commonStyles } from '../common.module-918e04b1.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import './utils.js';
-import '../colors.module-ecac5cf6.js';
+import '../colors.module-8ee7777c.js';
 
-var styles = {"styrene-xlarge":"typography__styrene-xlarge_1ynbc","styrene-large":"typography__styrene-large_1ynbc","styrene-medium":"typography__styrene-medium_1ynbc","styrene-small":"typography__styrene-small_1ynbc","styrene-xsmall":"typography__styrene-xsmall_1ynbc","system-xlarge":"typography__system-xlarge_1ynbc","system-large":"typography__system-large_1ynbc","system-medium":"typography__system-medium_1ynbc","system-small":"typography__system-small_1ynbc","system-xsmall":"typography__system-xsmall_1ynbc","margins-xlarge":"typography__margins-xlarge_1ynbc","margins-large":"typography__margins-large_1ynbc","margins-medium":"typography__margins-medium_1ynbc","margins-small":"typography__margins-small_1ynbc","margins-xsmall":"typography__margins-xsmall_1ynbc"};
+var styles = {"transparent":"typography__transparent_1ynbc","styrene-xlarge":"typography__styrene-xlarge_1ynbc","styrene-large":"typography__styrene-large_1ynbc","styrene-medium":"typography__styrene-medium_1ynbc","styrene-small":"typography__styrene-small_1ynbc","styrene-xsmall":"typography__styrene-xsmall_1ynbc","system-xlarge":"typography__system-xlarge_1ynbc","system-large":"typography__system-large_1ynbc","system-medium":"typography__system-medium_1ynbc","system-small":"typography__system-small_1ynbc","system-xsmall":"typography__system-xsmall_1ynbc","margins-xlarge":"typography__margins-xlarge_1ynbc","margins-large":"typography__margins-large_1ynbc","margins-medium":"typography__margins-medium_1ynbc","margins-small":"typography__margins-small_1ynbc","margins-xsmall":"typography__margins-xsmall_1ynbc"};
 require('./index.css');
 
 var Title = forwardRef(function (props, ref) { return (React.createElement(TitleBase, __assign({}, props, { styles: Object.assign(commonStyles, styles), ref: ref, platform: 'desktop' }))); });

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

@@ -1,14 +1,14 @@
 import { __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { TitleBase } from '../title/component.js';
-import { c as commonStyles } from '../common.module-247badde.js';
+import { c as commonStyles } from '../common.module-918e04b1.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-ecac5cf6.js';
+import '../colors.module-8ee7777c.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_1nie0","styrene-large":"typography__styrene-large_1nie0","styrene-medium":"typography__styrene-medium_1nie0","styrene-small":"typography__styrene-small_1nie0","styrene-xsmall":"typography__styrene-xsmall_1nie0","system-xlarge":"typography__system-xlarge_1nie0","system-large":"typography__system-large_1nie0","system-medium":"typography__system-medium_1nie0","system-small":"typography__system-small_1nie0","system-xsmall":"typography__system-xsmall_1nie0","margins-xlarge":"typography__margins-xlarge_1nie0","margins-large":"typography__margins-large_1nie0","margins-medium":"typography__margins-medium_1nie0","margins-small":"typography__margins-small_1nie0","margins-xsmall":"typography__margins-xsmall_1nie0"};
 require('./index.css');

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

@@ -8,5 +8,5 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-ecac5cf6.js';
-import '../common.module-247badde.js';
+import '../colors.module-8ee7777c.js';
+import '../common.module-918e04b1.js';

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

@@ -10,8 +10,8 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-ecac5cf6.js';
-import '../common.module-247badde.js';
+import '../colors.module-8ee7777c.js';
+import '../common.module-918e04b1.js';
 
 var TitleResponsive = forwardRef(function (_a, ref) {
     var defaultMatchMediaValue = _a.defaultMatchMediaValue, _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = __rest(_a, ["defaultMatchMediaValue", "breakpoint"]);

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

@@ -10,6 +10,6 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/esm';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-ecac5cf6.js';
-import '../common.module-247badde.js';
+import '../colors.module-8ee7777c.js';
+import '../common.module-918e04b1.js';
 import '../title-mobile/component.js';

package/typography/modern/component.js

@@ -8,10 +8,10 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-07a8f050.js';
+import './colors.module-74da56c2.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-ef8742a0.js';
+import './common.module-95d0a71b.js';
 import '../../mq/modern';
 
 const Typography = {

package/typography/modern/index.js

@@ -7,11 +7,11 @@ import 'classnames';
 import './hooks/use-skeleton.js';
 import '../../skeleton/modern';
 import '@alfalab/hooks';
-import './colors.module-07a8f050.js';
+import './colors.module-74da56c2.js';
 import './title/index.js';
 import './title/component.js';
 import './title/utils.js';
-import './common.module-ef8742a0.js';
+import './common.module-95d0a71b.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';
 import '../../mq/modern';

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-07a8f050.js';
+import { c as colors } from '../colors.module-74da56c2.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 
-const styles = {"paragraph":"typography__paragraph_6j1xz","paragraphWithMargins":"typography__paragraphWithMargins_6j1xz","primary-large":"typography__primary-large_6j1xz","primary-medium":"typography__primary-medium_6j1xz","primary-small":"typography__primary-small_6j1xz","secondary-large":"typography__secondary-large_6j1xz","secondary-medium":"typography__secondary-medium_6j1xz","secondary-small":"typography__secondary-small_6j1xz","component":"typography__component_6j1xz","component-primary":"typography__component-primary_6j1xz","component-secondary":"typography__component-secondary_6j1xz","caps":"typography__caps_6j1xz","tagline":"typography__tagline_6j1xz","bold":"typography__bold_6j1xz","medium":"typography__medium_6j1xz","regular":"typography__regular_6j1xz","monospace":"typography__monospace_6j1xz","rowLimit1":"typography__rowLimit1_6j1xz","rowLimit2":"typography__rowLimit2_6j1xz","rowLimit3":"typography__rowLimit3_6j1xz"};
+const styles = {"transparent":"typography__transparent_6j1xz","paragraph":"typography__paragraph_6j1xz","paragraphWithMargins":"typography__paragraphWithMargins_6j1xz","primary-large":"typography__primary-large_6j1xz","primary-medium":"typography__primary-medium_6j1xz","primary-small":"typography__primary-small_6j1xz","secondary-large":"typography__secondary-large_6j1xz","secondary-medium":"typography__secondary-medium_6j1xz","secondary-small":"typography__secondary-small_6j1xz","component":"typography__component_6j1xz","component-primary":"typography__component-primary_6j1xz","component-secondary":"typography__component-secondary_6j1xz","caps":"typography__caps_6j1xz","tagline":"typography__tagline_6j1xz","bold":"typography__bold_6j1xz","medium":"typography__medium_6j1xz","regular":"typography__regular_6j1xz","monospace":"typography__monospace_6j1xz","rowLimit1":"typography__rowLimit1_6j1xz","rowLimit2":"typography__rowLimit2_6j1xz","rowLimit3":"typography__rowLimit3_6j1xz"};
 require('./index.css');
 
 const logWarning = (view) => {
@@ -41,6 +41,7 @@ const Text = forwardRef(({ view = 'primary-medium', tag: Component = 'span', wei
             [styles.paragraphWithMargins]: Component === 'p' && defaultMargins,
             [styles.monospace]: monospaceNumbers,
             [styles[`rowLimit${rowLimit}`]]: rowLimit,
+            [styles.transparent]: showSkeleton,
         }, className, color && colors[color], styles[view], weight && styles[weight]), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]), ...restProps }, children));
 });
 

package/typography/modern/text/index.css

@@ -21,7 +21,9 @@
     --gap-12: var(--gap-s);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ :root {
+} /* сбрасывает синюю подсветку при нажатии */ .typography__transparent_6j1xz {
+    opacity: 0;
+} :root {
     --text-paragraph-margin-bottom: var(--gap-0) var(--gap-0) var(--gap-12);
 } .typography__paragraph_6j1xz {
     margin: var(--gap-0);

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-07a8f050.js';
+import '../colors.module-74da56c2.js';

package/typography/modern/title/component.js

@@ -3,7 +3,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useSkeleton } from '../hooks/use-skeleton.js';
 import { getDefaultWeight } from './utils.js';
-import { c as colors } from '../colors.module-07a8f050.js';
+import { c as colors } from '../colors.module-74da56c2.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 
@@ -16,7 +16,10 @@ const TitleBase = forwardRef(({ tag: Component = 'div', view = 'medium', font =
     if (skeleton) {
         return skeleton;
     }
-    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 }), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]), ...restProps }, children));
+    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,
+        }), "data-test-id": dataTestId, ref: mergeRefs([ref, textRef]), ...restProps }, children));
 });
 
 export { TitleBase };

package/typography/modern/title/index.css

@@ -29,7 +29,9 @@
     --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
         'Helvetica Neue', Helvetica, sans-serif;
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .typography__styrene-xlarge_1ynbc {
+} /* сбрасывает синюю подсветку при нажатии */ .typography__transparent_1ynbc {
+    opacity: 0;
+} .typography__styrene-xlarge_1ynbc {
     font-size: 48px;
     line-height: 64px;
     font-weight: 500;

package/typography/modern/title/index.js

@@ -1,15 +1,15 @@
 import React, { forwardRef } from 'react';
 import { TitleBase } from './component.js';
-import { c as commonStyles } from '../common.module-ef8742a0.js';
+import { c as commonStyles } from '../common.module-95d0a71b.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 import './utils.js';
-import '../colors.module-07a8f050.js';
+import '../colors.module-74da56c2.js';
 
-const styles = {"styrene-xlarge":"typography__styrene-xlarge_1ynbc","styrene-large":"typography__styrene-large_1ynbc","styrene-medium":"typography__styrene-medium_1ynbc","styrene-small":"typography__styrene-small_1ynbc","styrene-xsmall":"typography__styrene-xsmall_1ynbc","system-xlarge":"typography__system-xlarge_1ynbc","system-large":"typography__system-large_1ynbc","system-medium":"typography__system-medium_1ynbc","system-small":"typography__system-small_1ynbc","system-xsmall":"typography__system-xsmall_1ynbc","margins-xlarge":"typography__margins-xlarge_1ynbc","margins-large":"typography__margins-large_1ynbc","margins-medium":"typography__margins-medium_1ynbc","margins-small":"typography__margins-small_1ynbc","margins-xsmall":"typography__margins-xsmall_1ynbc"};
+const styles = {"transparent":"typography__transparent_1ynbc","styrene-xlarge":"typography__styrene-xlarge_1ynbc","styrene-large":"typography__styrene-large_1ynbc","styrene-medium":"typography__styrene-medium_1ynbc","styrene-small":"typography__styrene-small_1ynbc","styrene-xsmall":"typography__styrene-xsmall_1ynbc","system-xlarge":"typography__system-xlarge_1ynbc","system-large":"typography__system-large_1ynbc","system-medium":"typography__system-medium_1ynbc","system-small":"typography__system-small_1ynbc","system-xsmall":"typography__system-xsmall_1ynbc","margins-xlarge":"typography__margins-xlarge_1ynbc","margins-large":"typography__margins-large_1ynbc","margins-medium":"typography__margins-medium_1ynbc","margins-small":"typography__margins-small_1ynbc","margins-xsmall":"typography__margins-xsmall_1ynbc"};
 require('./index.css');
 
 const Title = forwardRef((props, ref) => (React.createElement(TitleBase, { ...props, styles: Object.assign(commonStyles, styles), ref: ref, platform: 'desktop' })));

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

@@ -1,13 +1,13 @@
 import React, { forwardRef } from 'react';
 import { TitleBase } from '../title/component.js';
-import { c as commonStyles } from '../common.module-ef8742a0.js';
+import { c as commonStyles } from '../common.module-95d0a71b.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-07a8f050.js';
+import '../colors.module-74da56c2.js';
 
 const styles = {"styrene-xlarge":"typography__styrene-xlarge_1nie0","styrene-large":"typography__styrene-large_1nie0","styrene-medium":"typography__styrene-medium_1nie0","styrene-small":"typography__styrene-small_1nie0","styrene-xsmall":"typography__styrene-xsmall_1nie0","system-xlarge":"typography__system-xlarge_1nie0","system-large":"typography__system-large_1nie0","system-medium":"typography__system-medium_1nie0","system-small":"typography__system-small_1nie0","system-xsmall":"typography__system-xsmall_1nie0","margins-xlarge":"typography__margins-xlarge_1nie0","margins-large":"typography__margins-large_1nie0","margins-medium":"typography__margins-medium_1nie0","margins-small":"typography__margins-small_1nie0","margins-xsmall":"typography__margins-xsmall_1nie0"};
 require('./index.css');

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

@@ -7,5 +7,5 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-07a8f050.js';
-import '../common.module-ef8742a0.js';
+import '../colors.module-74da56c2.js';
+import '../common.module-95d0a71b.js';

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

@@ -9,8 +9,8 @@ import '../hooks/use-skeleton.js';
 import '../../../skeleton/modern';
 import '@alfalab/hooks';
 import '../title/utils.js';
-import '../colors.module-07a8f050.js';
-import '../common.module-ef8742a0.js';
+import '../colors.module-74da56c2.js';
+import '../common.module-95d0a71b.js';
 
 const TitleResponsive = forwardRef(({ defaultMatchMediaValue, breakpoint = 1024, ...restProps }, ref) => {
     const query = `(min-width: ${breakpoint}px)`;