@gravity-ui/blog-constructor 4.4.2 → 5.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/build/cjs/blocks/Author/Author.css +2 -2
  2. package/build/cjs/blocks/Banner/schema.d.ts +11 -0
  3. package/build/cjs/blocks/CTA/CTA.css +1 -1
  4. package/build/cjs/blocks/CTA/CTA.js +1 -1
  5. package/build/cjs/blocks/CTA/schema.d.ts +11 -0
  6. package/build/cjs/blocks/ColoredText/schema.d.ts +11 -0
  7. package/build/cjs/blocks/Header/Header.js +1 -1
  8. package/build/cjs/blocks/Media/Media.css +1 -1
  9. package/build/cjs/blocks/Meta/Meta.js +2 -2
  10. package/build/cjs/components/ButtonWithIcon/ButtonWithIcon.css +6 -6
  11. package/build/cjs/components/FeedHeader/FeedHeader.css +3 -3
  12. package/build/cjs/components/FeedHeader/FeedHeader.js +1 -1
  13. package/build/cjs/components/FeedHeader/components/Controls/Controls.css +11 -9
  14. package/build/cjs/components/FeedHeader/components/CustomSelectOption/CustomSelectOption.css +2 -2
  15. package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.css +9 -9
  16. package/build/cjs/components/Paginator/Paginator.css +6 -6
  17. package/build/cjs/components/PostCard/PostCard.css +15 -15
  18. package/build/cjs/components/PostCard/PostCard.js +1 -1
  19. package/build/cjs/components/PostInfo/PostInfo.css +20 -20
  20. package/build/cjs/components/PostInfo/PostInfo.d.ts +3 -4
  21. package/build/cjs/components/PostInfo/PostInfo.js +3 -3
  22. package/build/cjs/components/PostInfo/SuggestPostInfo.d.ts +3 -4
  23. package/build/cjs/components/PostInfo/SuggestPostInfo.js +3 -3
  24. package/build/cjs/components/PostInfo/components/Save.d.ts +3 -3
  25. package/build/cjs/components/PostInfo/components/Save.js +3 -3
  26. package/build/cjs/components/PostInfo/components/Sharing.js +2 -2
  27. package/build/cjs/components/Posts/Posts.css +1 -1
  28. package/build/cjs/components/PostsEmpty/PostsEmpty.css +5 -5
  29. package/build/cjs/components/PostsError/PostError.css +5 -5
  30. package/build/cjs/components/Prompt/Prompt.css +2 -2
  31. package/build/cjs/components/Search/Search.css +8 -8
  32. package/build/cjs/components/Wrapper/Wrapper.d.ts +2 -3
  33. package/build/cjs/components/Wrapper/Wrapper.js +2 -2
  34. package/build/cjs/constants.d.ts +2 -0
  35. package/build/cjs/constants.js +3 -1
  36. package/build/cjs/containers/BlogPage/BlogPage.css +8 -8
  37. package/build/cjs/containers/BlogPostPage/BlogPostPage.css +49 -49
  38. package/build/cjs/containers/BlogPostPage/BlogPostPage.d.ts +1 -1
  39. package/build/cjs/contexts/PostPageContext.d.ts +1 -1
  40. package/build/cjs/contexts/theme/ThemeProvider.js +4 -4
  41. package/build/cjs/models/common.d.ts +3 -0
  42. package/build/cjs/schema/index.d.ts +33 -0
  43. package/build/cjs/utils/common.d.ts +1 -0
  44. package/build/esm/blocks/Author/Author.css +2 -2
  45. package/build/esm/blocks/Banner/schema.d.ts +11 -0
  46. package/build/esm/blocks/CTA/CTA.css +1 -1
  47. package/build/esm/blocks/CTA/CTA.js +1 -1
  48. package/build/esm/blocks/CTA/schema.d.ts +11 -0
  49. package/build/esm/blocks/ColoredText/schema.d.ts +11 -0
  50. package/build/esm/blocks/Header/Header.js +1 -1
  51. package/build/esm/blocks/Media/Media.css +1 -1
  52. package/build/esm/blocks/Meta/Meta.js +2 -2
  53. package/build/esm/components/ButtonWithIcon/ButtonWithIcon.css +6 -6
  54. package/build/esm/components/FeedHeader/FeedHeader.css +3 -3
  55. package/build/esm/components/FeedHeader/FeedHeader.js +1 -1
  56. package/build/esm/components/FeedHeader/components/Controls/Controls.css +11 -9
  57. package/build/esm/components/FeedHeader/components/CustomSelectOption/CustomSelectOption.css +2 -2
  58. package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.css +9 -9
  59. package/build/esm/components/Paginator/Paginator.css +6 -6
  60. package/build/esm/components/PostCard/PostCard.css +15 -15
  61. package/build/esm/components/PostCard/PostCard.js +1 -1
  62. package/build/esm/components/PostInfo/PostInfo.css +20 -20
  63. package/build/esm/components/PostInfo/PostInfo.d.ts +3 -4
  64. package/build/esm/components/PostInfo/PostInfo.js +3 -3
  65. package/build/esm/components/PostInfo/SuggestPostInfo.d.ts +3 -4
  66. package/build/esm/components/PostInfo/SuggestPostInfo.js +3 -3
  67. package/build/esm/components/PostInfo/components/Save.d.ts +3 -3
  68. package/build/esm/components/PostInfo/components/Save.js +3 -3
  69. package/build/esm/components/PostInfo/components/Sharing.js +2 -2
  70. package/build/esm/components/Posts/Posts.css +1 -1
  71. package/build/esm/components/PostsEmpty/PostsEmpty.css +5 -5
  72. package/build/esm/components/PostsError/PostError.css +5 -5
  73. package/build/esm/components/Prompt/Prompt.css +2 -2
  74. package/build/esm/components/Search/Search.css +8 -8
  75. package/build/esm/components/Wrapper/Wrapper.d.ts +2 -3
  76. package/build/esm/components/Wrapper/Wrapper.js +2 -2
  77. package/build/esm/constants.d.ts +2 -0
  78. package/build/esm/constants.js +2 -0
  79. package/build/esm/containers/BlogPage/BlogPage.css +8 -8
  80. package/build/esm/containers/BlogPostPage/BlogPostPage.css +49 -49
  81. package/build/esm/containers/BlogPostPage/BlogPostPage.d.ts +1 -1
  82. package/build/esm/contexts/PostPageContext.d.ts +1 -1
  83. package/build/esm/contexts/theme/ThemeProvider.js +5 -5
  84. package/build/esm/models/common.d.ts +3 -0
  85. package/build/esm/schema/index.d.ts +33 -0
  86. package/build/esm/utils/common.d.ts +1 -0
  87. package/package.json +8 -7
  88. package/server/models/common.d.ts +3 -0
  89. package/styles/root.css +8 -8
  90. package/styles/root.scss +8 -8
  91. package/styles/storybook/common.scss +12 -6
  92. package/styles/storybook/palette.scss +6 -6
  93. package/styles/storybook/typography.scss +46 -46
  94. package/styles/yfm.css +26 -26
  95. package/styles/yfm.scss +14 -14
@@ -17,7 +17,7 @@ unpredictable css rules order in build */
17
17
  }
18
18
  }
19
19
  .bc-author__description {
20
- color: var(--yc-color-text-primary);
20
+ color: var(--g-color-text-primary);
21
21
  }
22
22
  .bc-author__content {
23
23
  display: flex;
@@ -27,5 +27,5 @@ unpredictable css rules order in build */
27
27
  position: relative;
28
28
  }
29
29
  .bc-author__container {
30
- background-color: var(--yc-color-promo-base-silver);
30
+ background-color: var(--pc-color-base-silver);
31
31
  }
@@ -82,6 +82,17 @@ export declare const Banner: {
82
82
  type: string;
83
83
  enum: string[];
84
84
  };
85
+ list: {
86
+ type: string;
87
+ items: {
88
+ type: string;
89
+ properties: {
90
+ when: {
91
+ type: string;
92
+ };
93
+ };
94
+ };
95
+ };
85
96
  paddingTop: {
86
97
  type: string;
87
98
  enum: string[];
@@ -1,6 +1,6 @@
1
1
  .bc-cta__card {
2
2
  display: flex;
3
- background-color: var(--yc-color-base-float);
3
+ background-color: var(--g-color-base-float);
4
4
  border-radius: var(--bc-border-radius);
5
5
  min-height: 80px;
6
6
  align-content: center;
@@ -21,7 +21,7 @@ const CTA = ({ items, paddingTop, paddingBottom }) => {
21
21
  return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
22
22
  [paddings_1.PaddingsDirections.top]: paddingTop,
23
23
  [paddings_1.PaddingsDirections.bottom]: paddingBottom,
24
- }, className: b('content'), dataQa: "blog-cta-content" }, items.map((content, index) => {
24
+ }, className: b('content'), qa: "blog-cta-content" }, items.map((content, index) => {
25
25
  var _a;
26
26
  const contentData = (0, common_1.updateContentSizes)(content);
27
27
  (_a = contentData.links) === null || _a === void 0 ? void 0 : _a.forEach((link) => {
@@ -79,6 +79,17 @@ export declare const CTA: {
79
79
  type: string;
80
80
  enum: string[];
81
81
  };
82
+ list: {
83
+ type: string;
84
+ items: {
85
+ type: string;
86
+ properties: {
87
+ when: {
88
+ type: string;
89
+ };
90
+ };
91
+ };
92
+ };
82
93
  };
83
94
  };
84
95
  };
@@ -99,6 +99,17 @@ export declare const ColoredText: {
99
99
  type: string;
100
100
  enum: string[];
101
101
  };
102
+ list: {
103
+ type: string;
104
+ items: {
105
+ type: string;
106
+ properties: {
107
+ when: {
108
+ type: string;
109
+ };
110
+ };
111
+ };
112
+ };
102
113
  paddingTop: {
103
114
  type: string;
104
115
  enum: string[];
@@ -39,6 +39,6 @@ const Header = (props) => {
39
39
  [paddings_1.PaddingsDirections.bottom]: paddingBottom,
40
40
  } },
41
41
  react_1.default.createElement(page_constructor_1.HeaderBlock, Object.assign({}, props, { title: title, description: description, breadcrumbs: breadcrumbs }),
42
- react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, theme: theme, dataQa: "blog-header-meta-container" }))));
42
+ react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, theme: theme, qa: "blog-header-meta-container" }))));
43
43
  };
44
44
  exports.Header = Header;
@@ -12,7 +12,7 @@ unpredictable css rules order in build */
12
12
  height: 100%;
13
13
  width: 100%;
14
14
  border-radius: calc(var(--bc-border-radius) + 1px);
15
- border: 1px solid var(--yc-color-line-generic);
15
+ border: 1px solid var(--g-color-line-generic);
16
16
  overflow: hidden;
17
17
  }
18
18
  .bc-media__content {
@@ -36,12 +36,12 @@ const Meta = (props) => {
36
36
  return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
37
37
  [paddings_1.PaddingsDirections.top]: paddingTop,
38
38
  [paddings_1.PaddingsDirections.bottom]: paddingBottom,
39
- }, dataQa: "blog-meta-content" },
39
+ }, qa: "blog-meta-content" },
40
40
  breadcrumbs && (react_1.default.createElement(page_constructor_1.HeaderBreadcrumbs, { items: breadcrumbs.items, className: b('breadcrumbs'), theme: theme, metrikaGoals: breadcrumbs.metrikaGoals })),
41
41
  title && (react_1.default.createElement(page_constructor_1.YFMWrapper, { content: title, modifiers: {
42
42
  blogBreadcrumbs: true,
43
43
  resetPaddings: true,
44
44
  } })),
45
- post && (react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, dataQa: "blog-meta-block" }))));
45
+ post && (react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, qa: "blog-meta-block" }))));
46
46
  };
47
47
  exports.Meta = Meta;
@@ -40,10 +40,10 @@ unpredictable css rules order in build */
40
40
  transition: color 0.2s;
41
41
  }
42
42
  .bc-button-with-icon_theme_primary:hover {
43
- color: var(--yc-color-text-primary);
43
+ color: var(--g-color-text-primary);
44
44
  }
45
45
  .bc-button-with-icon_theme_secondary {
46
- color: var(--yc-color-text-secondary);
46
+ color: var(--g-color-text-secondary);
47
47
  transition: color 0.2s;
48
48
  }
49
49
  .bc-button-with-icon_theme_secondary:hover {
@@ -54,10 +54,10 @@ unpredictable css rules order in build */
54
54
  transition: color 0.2s;
55
55
  }
56
56
  .bc-button-with-icon_theme_link:hover {
57
- color: var(--yc-color-text-link-hover);
57
+ color: var(--g-color-text-link-hover);
58
58
  }
59
59
  .bc-button-with-icon_theme_accent {
60
- color: var(--yc-color-text-yandex-red);
60
+ color: var(--g-color-base-danger-heavy);
61
61
  transition: opacity 0.2s;
62
62
  opacity: 0.7;
63
63
  }
@@ -66,10 +66,10 @@ unpredictable css rules order in build */
66
66
  }
67
67
  .bc-button-with-icon_disabled {
68
68
  cursor: default;
69
- color: var(--yc-color-text-secondary);
69
+ color: var(--g-color-text-secondary);
70
70
  }
71
71
  .bc-button-with-icon_disabled:hover {
72
- color: var(--yc-color-text-secondary);
72
+ color: var(--g-color-text-secondary);
73
73
  }
74
74
  .mobile .bc-button-with-icon:hover {
75
75
  color: inherit;
@@ -17,7 +17,7 @@ unpredictable css rules order in build */
17
17
  }
18
18
  .bc-feed-header__content_theme_dark.bc-feed-header__content_theme_dark .bc-feed-header__title,
19
19
  .bc-feed-header__content_theme_dark.bc-feed-header__content_theme_dark .bc-feed-header__description * {
20
- color: var(--yc-color-text-light-primary);
20
+ color: var(--g-color-text-light-primary);
21
21
  }
22
22
 
23
23
  .bc-feed-header_has-background {
@@ -49,6 +49,6 @@ unpredictable css rules order in build */
49
49
  }
50
50
  }
51
51
  .mobile .bc-feed-header_has-background .bc-feed-header__title {
52
- font-size: var(--yc-text-display-2-font-size);
53
- line-height: var(--yc-text-display-2-line-height);
52
+ font-size: var(--g-text-display-2-font-size);
53
+ line-height: var(--g-text-display-2-line-height);
54
54
  }
@@ -7,7 +7,7 @@ const page_constructor_1 = require("@gravity-ui/page-constructor");
7
7
  const cn_1 = require("../../utils/cn");
8
8
  const Controls_1 = require("./components/Controls/Controls");
9
9
  const b = (0, cn_1.block)('feed-header');
10
- const FeedHeader = ({ tags, services, handleLoadData, offset = 'default', background, theme = 'default', verticalOffset = 'l', className, queryParams, }) => {
10
+ const FeedHeader = ({ tags, services, handleLoadData, offset = 'default', background, theme = 'light', verticalOffset = 'l', className, queryParams, }) => {
11
11
  const backgroundThemed = background && (0, page_constructor_1.getThemedValue)(background, theme);
12
12
  return (react_1.default.createElement("header", { className: b('header', { ['has-background']: Boolean(background) }, className) },
13
13
  (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color) ? (react_1.default.createElement(page_constructor_1.FullWidthBackground, { style: { backgroundColor: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color }, theme: "rounded" })) : null,
@@ -14,8 +14,8 @@ unpredictable css rules order in build */
14
14
  flex-wrap: wrap;
15
15
  }
16
16
  .bc-feed-controls__header-item_title {
17
- font-size: var(--yc-text-display-4-font-size);
18
- line-height: var(--yc-text-display-4-line-height);
17
+ font-size: var(--g-text-display-4-font-size);
18
+ line-height: var(--g-text-display-4-line-height);
19
19
  padding-top: 112px;
20
20
  padding-bottom: 96px;
21
21
  }
@@ -24,7 +24,7 @@ unpredictable css rules order in build */
24
24
  max-width: 100%;
25
25
  }
26
26
  .bc-feed-controls__search .yc-text-input_view_normal .yc-text-input__control {
27
- border-color: var(--yc-color-base-background);
27
+ border-color: var(--g-color-base-background);
28
28
  }
29
29
  .bc-feed-controls__select {
30
30
  width: 100%;
@@ -43,7 +43,7 @@ unpredictable css rules order in build */
43
43
  display: none;
44
44
  }
45
45
  .bc-feed-controls__popup.bc-feed-controls__popup .g-select-list .yc-list {
46
- max-height: calc(500px - var(--yc-text-body-3-line-height) - 12px);
46
+ max-height: calc(500px - var(--g-text-body-3-line-height) - 12px);
47
47
  }
48
48
  .bc-feed-controls__popup.bc-feed-controls__popup .yc-list__item {
49
49
  margin: 4px;
@@ -64,8 +64,8 @@ unpredictable css rules order in build */
64
64
  }
65
65
 
66
66
  .bc-feed-controls__popup-filter .yc-text-input__control {
67
- font-size: var(--yc-text-body-2-font-size);
68
- line-height: var(--yc-text-body-2-line-height);
67
+ font-size: var(--g-text-body-2-font-size);
68
+ line-height: var(--g-text-body-2-line-height);
69
69
  border: none;
70
70
  }
71
71
  .bc-feed-controls__popup-filter .yc-text-input__control:hover, .bc-feed-controls__popup-filter .yc-text-input__control:focus {
@@ -75,6 +75,8 @@ unpredictable css rules order in build */
75
75
  width: 100%;
76
76
  }
77
77
  .bc-feed-controls__saved-only-button_savedOnly {
78
+ --g-button-background-color: var(--pc-monochrome-button-background-color);
79
+ --g-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
78
80
  --yc-button-background-color: var(--pc-monochrome-button-background-color);
79
81
  --yc-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
80
82
  }
@@ -85,7 +87,7 @@ unpredictable css rules order in build */
85
87
  color: var(--pc-monochrome-button-color);
86
88
  }
87
89
  .bc-feed-controls__saved-only-button_savedOnly:focus {
88
- color: var(--yc-color-base-background);
90
+ color: var(--g-color-base-background);
89
91
  }
90
92
  .bc-feed-controls__filter-item {
91
93
  margin-right: 8px;
@@ -105,8 +107,8 @@ unpredictable css rules order in build */
105
107
  flex-grow: 0;
106
108
  }
107
109
  .bc-feed-controls__icon {
108
- color: var(--yc-my-color-brand-normal);
110
+ color: var(--g-color-base-brand);
109
111
  }
110
112
  .bc-feed-controls__icon_savedOnly {
111
- color: var(--yc-color-base-background);
113
+ color: var(--g-color-base-background);
112
114
  }
@@ -1,8 +1,8 @@
1
1
  /* use this for style redefinitions to awoid problems with
2
2
  unpredictable css rules order in build */
3
3
  .bc-feed-custom-select-option {
4
- font-size: var(--yc-text-body-2-font-size);
5
- line-height: var(--yc-text-body-2-line-height);
4
+ font-size: var(--g-text-body-2-font-size);
5
+ line-height: var(--g-text-body-2-line-height);
6
6
  display: flex;
7
7
  }
8
8
  .bc-feed-custom-select-option__icon {
@@ -1,25 +1,25 @@
1
1
  /* use this for style redefinitions to awoid problems with
2
2
  unpredictable css rules order in build */
3
3
  .bc-feed-custom-switcher__custom-switcher {
4
- font-size: var(--yc-text-body-2-font-size);
5
- line-height: var(--yc-text-body-2-line-height);
4
+ font-size: var(--g-text-body-2-font-size);
5
+ line-height: var(--g-text-body-2-line-height);
6
6
  position: relative;
7
7
  display: flex;
8
8
  flex-direction: row;
9
9
  align-items: center;
10
- background-color: var(--yc-color-base-background);
11
- border: 1px solid var(--yc-color-base-background);
10
+ background-color: var(--g-color-base-background);
11
+ border: 1px solid var(--g-color-base-background);
12
12
  border-radius: 10px;
13
13
  width: 100%;
14
14
  line-height: 42px;
15
15
  }
16
- .bc-feed-custom-switcher__custom-switcher + .yc-popup-wrapper.yc-popup-wrapper_open {
16
+ .bc-feed-custom-switcher__custom-switcher + .yc-popup.yc-popup_open {
17
17
  position: absolute !important;
18
18
  inset: auto !important;
19
19
  transform: translate3d(0, 4px, 0) !important;
20
20
  }
21
21
  .bc-feed-custom-switcher__custom-switcher:hover {
22
- border-color: var(--yc-color-base-generic-hover);
22
+ border-color: var(--g-color-base-generic-hover);
23
23
  cursor: pointer;
24
24
  }
25
25
  .bc-feed-custom-switcher__custom-switcher-element_content {
@@ -34,11 +34,11 @@ unpredictable css rules order in build */
34
34
  align-items: center;
35
35
  height: 20px;
36
36
  padding: 0 6px;
37
- background-color: var(--yc-color-base-selection);
37
+ background-color: var(--g-color-base-selection);
38
38
  border-radius: 4px;
39
39
  transition: backgound-color 0.1s linear;
40
- font-size: var(--yc-text-body-1-font-size);
41
- line-height: var(--yc-text-body-1-line-height);
40
+ font-size: var(--g-text-body-1-font-size);
41
+ line-height: var(--g-text-body-1-line-height);
42
42
  }
43
43
  .bc-feed-custom-switcher__custom-switcher-element_arrow {
44
44
  display: flex;
@@ -9,7 +9,7 @@ unpredictable css rules order in build */
9
9
  }
10
10
  .bc-paginator__link {
11
11
  text-decoration: none;
12
- color: var(--yc-color-text-primary);
12
+ color: var(--g-color-text-primary);
13
13
  }
14
14
  .bc-paginator__item {
15
15
  display: inline-flex;
@@ -19,9 +19,9 @@ unpredictable css rules order in build */
19
19
  min-height: 44px;
20
20
  margin-left: 4px;
21
21
  padding: 12px 0px;
22
- color: var(--yc-color-text-primary);
23
- font-size: var(--yc-text-body-2-font-size);
24
- line-height: var(--yc-text-body-2-line-height);
22
+ color: var(--g-color-text-primary);
23
+ font-size: var(--g-text-body-2-font-size);
24
+ line-height: var(--g-text-body-2-line-height);
25
25
  }
26
26
  .bc-paginator__item_type_page {
27
27
  --bc-border-radius: 10px;
@@ -31,10 +31,10 @@ unpredictable css rules order in build */
31
31
  border-radius: var(--bc-border-radius);
32
32
  }
33
33
  .bc-paginator__item_type_page:hover {
34
- background: var(--yc-color-base-simple-hover);
34
+ background: var(--g-color-base-simple-hover);
35
35
  }
36
36
  .bc-paginator__item_type_page.bc-paginator__item_active {
37
- background: var(--yc-color-base-simple-hover);
37
+ background: var(--g-color-base-simple-hover);
38
38
  cursor: default;
39
39
  }
40
40
  .bc-paginator__pagination {
@@ -32,38 +32,38 @@ unpredictable css rules order in build */
32
32
  margin-bottom: 8px;
33
33
  }
34
34
  .bc-post-card__title_size_s {
35
- font-size: var(--yc-text-header-1-font-size);
36
- line-height: var(--yc-text-header-1-line-height);
35
+ font-size: var(--g-text-header-1-font-size);
36
+ line-height: var(--g-text-header-1-line-height);
37
37
  color: var(--pc-text-header-color);
38
- font-weight: var(--yc-text-accent-font-weight);
38
+ font-weight: var(--g-text-accent-font-weight);
39
39
  }
40
40
  .bc-post-card__title_size_m {
41
- font-size: var(--yc-text-display-2-font-size);
42
- line-height: var(--yc-text-display-2-line-height);
41
+ font-size: var(--g-text-display-2-font-size);
42
+ line-height: var(--g-text-display-2-line-height);
43
43
  color: var(--pc-text-header-color);
44
- font-weight: var(--yc-text-accent-font-weight);
44
+ font-weight: var(--g-text-accent-font-weight);
45
45
  }
46
46
  @media (max-width: 576px) {
47
47
  .bc-post-card__title_size_m {
48
- font-size: var(--yc-text-display-1-font-size);
49
- line-height: var(--yc-text-display-1-line-height);
48
+ font-size: var(--g-text-display-1-font-size);
49
+ line-height: var(--g-text-display-1-line-height);
50
50
  }
51
51
  }
52
52
  .bc-post-card__image-container {
53
53
  height: 156px;
54
54
  }
55
55
  .bc-post-card__tag {
56
- color: var(--yc-color-text-secondary);
57
- font-weight: var(--yc-text-accent-font-weight);
56
+ color: var(--g-color-text-secondary);
57
+ font-weight: var(--g-text-accent-font-weight);
58
58
  }
59
59
  .bc-post-card__tag_size_s {
60
- font-size: var(--yc-text-body-2-font-size);
61
- line-height: var(--yc-text-body-2-line-height);
60
+ font-size: var(--g-text-body-2-font-size);
61
+ line-height: var(--g-text-body-2-line-height);
62
62
  padding-bottom: 4px;
63
63
  }
64
64
  .bc-post-card__tag_size_m {
65
- font-size: var(--yc-text-body-3-font-size);
66
- line-height: var(--yc-text-body-3-line-height);
65
+ font-size: var(--g-text-body-3-font-size);
66
+ line-height: var(--g-text-body-3-line-height);
67
67
  padding-bottom: 8px;
68
68
  }
69
69
  .bc-post-card__description {
@@ -72,7 +72,7 @@ unpredictable css rules order in build */
72
72
  text-overflow: ellipsis;
73
73
  max-height: 96px;
74
74
  white-space: initial;
75
- color: var(--yc-color-text-primary);
75
+ color: var(--g-color-text-primary);
76
76
  }
77
77
  @supports (-webkit-line-clamp: 5) {
78
78
  .bc-post-card__description {
@@ -33,6 +33,6 @@ const PostCard = ({ post, metrikaGoals, fullWidth = false, size = 's', showTag =
33
33
  blogCard: true,
34
34
  } }))),
35
35
  react_1.default.createElement(page_constructor_1.CardBase.Footer, null,
36
- react_1.default.createElement(SuggestPostInfo_1.SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, dataQa: "blog-suggest-block" }))));
36
+ react_1.default.createElement(SuggestPostInfo_1.SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block" }))));
37
37
  };
38
38
  exports.PostCard = PostCard;
@@ -1,8 +1,8 @@
1
1
  /* use this for style redefinitions to awoid problems with
2
2
  unpredictable css rules order in build */
3
3
  .bc-post-info__item {
4
- font-size: var(--yc-text-body-2-font-size);
5
- line-height: var(--yc-text-body-2-line-height);
4
+ font-size: var(--g-text-body-2-font-size);
5
+ line-height: var(--g-text-body-2-line-height);
6
6
  display: flex;
7
7
  padding-right: 24px;
8
8
  padding-top: 12px;
@@ -10,16 +10,16 @@ unpredictable css rules order in build */
10
10
  align-items: center;
11
11
  }
12
12
  .bc-post-info__item_size_s {
13
- font-size: var(--yc-text-body-2-font-size);
14
- line-height: var(--yc-text-body-2-line-height);
13
+ font-size: var(--g-text-body-2-font-size);
14
+ line-height: var(--g-text-body-2-line-height);
15
15
  }
16
16
  .bc-post-info__item_size_m {
17
- font-size: var(--yc-text-body-3-font-size);
18
- line-height: var(--yc-text-body-3-line-height);
17
+ font-size: var(--g-text-body-3-font-size);
18
+ line-height: var(--g-text-body-3-line-height);
19
19
  }
20
20
  .bc-post-info__item:last-child {
21
- font-size: var(--yc-text-body-2-font-size);
22
- line-height: var(--yc-text-body-2-line-height);
21
+ font-size: var(--g-text-body-2-font-size);
22
+ line-height: var(--g-text-body-2-line-height);
23
23
  display: flex;
24
24
  padding-right: 0px;
25
25
  padding-top: 12px;
@@ -27,32 +27,32 @@ unpredictable css rules order in build */
27
27
  align-items: center;
28
28
  }
29
29
  .bc-post-info__switcher {
30
- color: var(--yc-color-text-secondary);
30
+ color: var(--g-color-text-secondary);
31
31
  }
32
32
  .bc-post-info__switcher:hover {
33
- color: var(--yc-color-text-primary);
33
+ color: var(--g-color-text-primary);
34
34
  }
35
35
  .bc-post-info__switcher_theme_dark {
36
- color: var(--yc-color-text-light-secondary);
36
+ color: var(--g-color-text-light-secondary);
37
37
  }
38
- .bc-post-info__switcher_theme_dark.yc-share-tooltip__container, .bc-post-info__switcher_theme_dark.yc-share-popover__container {
39
- color: var(--yc-color-text-light-secondary);
38
+ .bc-post-info__switcher_theme_dark.gc-share-tooltip__container, .bc-post-info__switcher_theme_dark.gc-share-popover__container {
39
+ color: var(--g-color-text-light-secondary);
40
40
  }
41
41
  .bc-post-info__switcher_theme_dark:hover {
42
- color: var(--yc-color-text-light-primary);
42
+ color: var(--g-color-text-light-primary);
43
43
  }
44
- .bc-post-info__switcher_theme_dark:hover.yc-share-tooltip__container, .bc-post-info__switcher_theme_dark:hover.yc-share-popover__container {
45
- color: var(--yc-color-text-light-primary);
44
+ .bc-post-info__switcher_theme_dark:hover.gc-share-tooltip__container, .bc-post-info__switcher_theme_dark:hover.gc-share-popover__container {
45
+ color: var(--g-color-text-light-primary);
46
46
  }
47
47
  .bc-post-info__container {
48
48
  display: flex;
49
49
  align-items: flex-start;
50
50
  flex-wrap: wrap;
51
51
  padding-top: 12px;
52
- color: var(--yc-color-text-secondary);
52
+ color: var(--g-color-text-secondary);
53
53
  }
54
54
  .bc-post-info__container_theme_dark {
55
- color: var(--yc-color-text-light-secondary);
55
+ color: var(--g-color-text-light-secondary);
56
56
  }
57
57
  .bc-post-info__icon {
58
58
  margin-right: 6px;
@@ -73,10 +73,10 @@ unpredictable css rules order in build */
73
73
  cursor: pointer;
74
74
  }
75
75
  .bc-post-info__content_cursor:hover {
76
- color: var(--yc-color-text-primary);
76
+ color: var(--g-color-text-primary);
77
77
  }
78
78
  .bc-post-info__content_cursor.bc-post-info__content_theme_dark:hover {
79
- color: var(--yc-color-text-light-primary);
79
+ color: var(--g-color-text-light-primary);
80
80
  }
81
81
  .bc-post-info__likes {
82
82
  display: flex;
@@ -1,10 +1,10 @@
1
1
  import React from 'react';
2
- import { PostData } from '../../models/common';
2
+ import { PostData, QAProps } from '../../models/common';
3
3
  export type BlogMetrikaGoals = {
4
4
  sharing?: string;
5
5
  save?: string;
6
6
  };
7
- type PostInfoProps = {
7
+ type PostInfoProps = QAProps & {
8
8
  postId: PostData['id'];
9
9
  readingTime: PostData['readingTime'];
10
10
  date: PostData['date'];
@@ -13,7 +13,6 @@ type PostInfoProps = {
13
13
  * @deprecated Metrika will be deleted after launch of analyticsEvents
14
14
  */
15
15
  metrikaGoals?: BlogMetrikaGoals;
16
- dataQa?: string;
17
16
  };
18
17
  /**
19
18
  * Blog post info panel component
@@ -23,7 +22,7 @@ type PostInfoProps = {
23
22
  * @param date - post create date
24
23
  * @param theme - theme name
25
24
  * @param metrikaGoals - metrika goals name
26
- * @param dataQa - test-attr
25
+ * @param qa - test-attr
27
26
  *
28
27
  * @returns jsx
29
28
  */
@@ -18,16 +18,16 @@ const b = (0, cn_1.block)('post-info');
18
18
  * @param date - post create date
19
19
  * @param theme - theme name
20
20
  * @param metrikaGoals - metrika goals name
21
- * @param dataQa - test-attr
21
+ * @param qa - test-attr
22
22
  *
23
23
  * @returns jsx
24
24
  */
25
- const PostInfo = ({ date, readingTime, postId, theme = 'light', metrikaGoals, dataQa, }) => {
25
+ const PostInfo = ({ date, readingTime, postId, theme = 'light', metrikaGoals, qa, }) => {
26
26
  const { likes } = (0, react_1.useContext)(PostPageContext_1.PostPageContext);
27
27
  return (react_1.default.createElement("div", { className: b('container', { theme }) },
28
28
  date && react_1.default.createElement(Date_1.Date, { date: date }),
29
29
  readingTime && react_1.default.createElement(ReadingTime_1.ReadingTime, { readingTime: readingTime }),
30
30
  react_1.default.createElement(Sharing_1.Sharing, { metrikaGoal: metrikaGoals === null || metrikaGoals === void 0 ? void 0 : metrikaGoals.sharing, theme: theme }),
31
- likes && (react_1.default.createElement(Save_1.Save, { postId: postId, title: likes.likesCount, hasUserLike: likes.hasUserLike, handleUserLike: likes.handleUserLike, metrikaGoal: metrikaGoals === null || metrikaGoals === void 0 ? void 0 : metrikaGoals.save, theme: theme, dataQa: dataQa }))));
31
+ likes && (react_1.default.createElement(Save_1.Save, { postId: postId, title: likes.likesCount, hasUserLike: likes.hasUserLike, handleUserLike: likes.handleUserLike, metrikaGoal: metrikaGoals === null || metrikaGoals === void 0 ? void 0 : metrikaGoals.save, theme: theme, qa: qa }))));
32
32
  };
33
33
  exports.PostInfo = PostInfo;
@@ -1,9 +1,8 @@
1
1
  import React from 'react';
2
- import { PostData, ToggleLikeCallbackType } from '../../models/common';
3
- export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTime' | 'hasUserLike'> {
2
+ import { PostData, QAProps, ToggleLikeCallbackType } from '../../models/common';
3
+ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTime' | 'hasUserLike'>, QAProps {
4
4
  postId: PostData['blogPostId'];
5
5
  size?: 's' | 'm';
6
- dataQa?: string;
7
6
  likes?: {
8
7
  likesCount?: number;
9
8
  hasUserLike?: boolean;
@@ -18,7 +17,7 @@ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTi
18
17
  * @param readingTime - post reading time
19
18
  * @param hasUserLike - flag that the user liked the post
20
19
  * @param likes - likes count
21
- * @param dataQa - test-attr
20
+ * @param qa - test-attr
22
21
  * @param size - text size
23
22
  * @param isModernIcon - flag what we need render 'bookmark' icon
24
23
  *
@@ -17,13 +17,13 @@ const b = (0, cn_1.block)('post-info');
17
17
  * @param readingTime - post reading time
18
18
  * @param hasUserLike - flag that the user liked the post
19
19
  * @param likes - likes count
20
- * @param dataQa - test-attr
20
+ * @param qa - test-attr
21
21
  * @param size - text size
22
22
  * @param isModernIcon - flag what we need render 'bookmark' icon
23
23
  *
24
24
  * @returns jsx
25
25
  */
26
- const SuggestPostInfo = ({ postId, date, readingTime, likes, size = 's', dataQa, }) => {
26
+ const SuggestPostInfo = ({ postId, date, readingTime, likes, size = 's', qa, }) => {
27
27
  const { hasUserLike, likesCount, handleLike } = (0, useLikes_1.useLikes)({
28
28
  hasLike: likes === null || likes === void 0 ? void 0 : likes.hasUserLike,
29
29
  count: likes === null || likes === void 0 ? void 0 : likes.likesCount,
@@ -34,6 +34,6 @@ const SuggestPostInfo = ({ postId, date, readingTime, likes, size = 's', dataQa,
34
34
  react_1.default.createElement("div", { className: b('suggest-container') },
35
35
  date && react_1.default.createElement(Date_1.Date, { date: date, size: size }),
36
36
  readingTime && react_1.default.createElement(ReadingTime_1.ReadingTime, { readingTime: readingTime, size: size })),
37
- likes && postId && (react_1.default.createElement(Save_1.Save, { postId: postId, title: likesCount, hasUserLike: hasUserLike, handleUserLike: handleLike, size: size, dataQa: dataQa }))));
37
+ likes && postId && (react_1.default.createElement(Save_1.Save, { postId: postId, title: likesCount, hasUserLike: hasUserLike, handleUserLike: handleLike, size: size, qa: qa }))));
38
38
  };
39
39
  exports.SuggestPostInfo = SuggestPostInfo;
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
- type SaveProps = {
2
+ import { QAProps } from '../../../models/common';
3
+ type SaveProps = QAProps & {
3
4
  title: string | number;
4
5
  postId: number;
5
6
  hasUserLike: boolean;
@@ -9,7 +10,6 @@ type SaveProps = {
9
10
  * @deprecated Metrika will be deleted after launch of analyticsEvents
10
11
  */
11
12
  metrikaGoal?: string;
12
- dataQa?: string;
13
13
  size?: 's' | 'm';
14
14
  };
15
15
  /**
@@ -19,7 +19,7 @@ type SaveProps = {
19
19
  * @param postId - post id
20
20
  * @param hasUserLike - flag what blog has like from current user
21
21
  * @param metrikaGoal - metrika goal name
22
- * @param dataQa - test-attr
22
+ * @param qa - test-attr
23
23
  * @param size - text size
24
24
  *
25
25
  * @returns jsx