@gravity-ui/blog-constructor 3.2.1 → 3.3.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (6) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/build/cjs/blocks/CTA/CTA.css +14 -36
  3. package/build/cjs/blocks/CTA/CTA.js +3 -14
  4. package/build/esm/blocks/CTA/CTA.css +14 -36
  5. package/build/esm/blocks/CTA/CTA.js +3 -14
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [3.3.0](https://github.com/gravity-ui/blog-constructor/compare/v3.2.1...v3.3.0) (2023-05-16)
4
+
5
+
6
+ ### Features
7
+
8
+ * add md breackpoint to cta-block ([#45](https://github.com/gravity-ui/blog-constructor/issues/45)) ([e859b0b](https://github.com/gravity-ui/blog-constructor/commit/e859b0b02e80b20eb0b4496e2c4834fb2de74922))
9
+
3
10
  ## [3.2.1](https://github.com/gravity-ui/blog-constructor/compare/v3.2.0...v3.2.1) (2023-05-16)
4
11
 
5
12
 
package/build/cjs/blocks/CTA/CTA.css CHANGED
@@ -8,49 +8,27 @@
8
8
  flex-direction: column;
9
9
  flex-grow: 1;
10
10
  padding: 32px;
11
- }
12
- .bc-cta__button {
13
- display: flex;
14
- padding-bottom: 16px;
11
+ width: calc(33.3333333333% - (32px / 2));
15
12
  }
16
13
  .bc-cta__content {
17
14
  display: flex;
18
- flex-direction: column;
15
+ flex-flow: row wrap;
16
+ gap: 16px;
19
17
  }
20
- @media (min-width: 577px) {
18
+ @media (max-width: 769px) {
21
19
  .bc-cta__content {
22
- display: flex;
23
- flex-direction: row;
24
- }
25
- .bc-cta__button {
26
- padding-bottom: 0px;
27
- }
28
- .bc-cta__button_layout {
29
- width: 100%;
30
- max-width: 100%;
31
- margin-right: 0px;
20
+ flex-wrap: wrap;
32
21
  }
33
- .bc-cta__button_layout_2 {
34
- width: calc(50% - (16px / 2));
35
- max-width: 50%;
36
- margin-right: 16px;
22
+ .bc-cta__card {
23
+ width: calc((100% / 2) - 16px);
24
+ flex-grow: 1;
37
25
  }
38
- .bc-cta__button_layout_2:nth-child(2n) {
39
- margin-right: 0px;
40
- }
41
- .bc-cta__button_layout_3 {
42
- width: calc(33.3333333333% - (32px / 3));
43
- margin-right: 16px;
44
- }
45
- .bc-cta__button_layout_3:nth-child(3n) {
46
- margin-right: 0px;
47
- }
48
- .bc-cta__button_layout_4 {
49
- width: calc(25% - (48px / 4));
50
- max-width: 50%;
51
- margin-right: 16px;
26
+ }
27
+ @media (max-width: 577px) {
28
+ .bc-cta__content {
29
+ flex-direction: column;
52
30
  }
53
- .bc-cta__button_layout_4:nth-child(4n) {
54
- margin-right: 0px;
31
+ .bc-cta__card {
32
+ width: 100%;
55
33
  }
56
34
  }
package/build/cjs/blocks/CTA/CTA.js CHANGED
@@ -12,15 +12,7 @@ const paddings_1 = require("../../models/paddings");
12
12
  const cn_1 = require("../../utils/cn");
13
13
  const common_1 = require("../../utils/common");
14
14
  const b = (0, cn_1.block)('cta');
15
- const MAX_COLUMN_COUNT = 4, MIN_COLUMN_COUNT = 2, DEFAULT_COLUMN_COUNT = 3;
16
15
  const CTA = ({ items, paddingTop, paddingBottom }) => {
17
- let count = items ? items.length : DEFAULT_COLUMN_COUNT;
18
- if (count < MIN_COLUMN_COUNT) {
19
- count = MIN_COLUMN_COUNT;
20
- }
21
- else if (count > MAX_COLUMN_COUNT) {
22
- count = MAX_COLUMN_COUNT;
23
- }
24
16
  /**
25
17
  * @deprecated Metrika will be deleted after launch of analyticsEvents
26
18
  */
@@ -31,18 +23,15 @@ const CTA = ({ items, paddingTop, paddingBottom }) => {
31
23
  return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
32
24
  [paddings_1.PaddingsDirections.top]: paddingTop,
33
25
  [paddings_1.PaddingsDirections.bottom]: paddingBottom,
34
- }, className: b('content'), dataQa: "blog-cta-content" }, items.slice(0, count).map((content, index) => {
26
+ }, className: b('content'), dataQa: "blog-cta-content" }, items.map((content, index) => {
35
27
  var _a;
36
28
  const contentData = (0, common_1.updateContentSizes)(content);
37
29
  (_a = contentData.links) === null || _a === void 0 ? void 0 : _a.forEach((link) => {
38
30
  // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign
39
31
  link.metrikaGoals = (0, common_1.getBlogElementMetrika)(metrikaGoal, link.metrikaGoals);
40
32
  });
41
- return (react_1.default.createElement("div", { key: index, className: b('button', {
42
- ['layout']: count,
43
- }), "data-qa": "blog-cta-card" },
44
- react_1.default.createElement("div", { className: b('card') },
45
- react_1.default.createElement(page_constructor_1.Content, Object.assign({}, contentData)))));
33
+ return (react_1.default.createElement("div", { key: index, className: b('card'), "data-qa": "blog-cta-card" },
34
+ react_1.default.createElement(page_constructor_1.Content, Object.assign({}, contentData))));
46
35
  })));
47
36
  };
48
37
  exports.CTA = CTA;
package/build/esm/blocks/CTA/CTA.css CHANGED
@@ -8,49 +8,27 @@
8
8
  flex-direction: column;
9
9
  flex-grow: 1;
10
10
  padding: 32px;
11
- }
12
- .bc-cta__button {
13
- display: flex;
14
- padding-bottom: 16px;
11
+ width: calc(33.3333333333% - (32px / 2));
15
12
  }
16
13
  .bc-cta__content {
17
14
  display: flex;
18
- flex-direction: column;
15
+ flex-flow: row wrap;
16
+ gap: 16px;
19
17
  }
20
- @media (min-width: 577px) {
18
+ @media (max-width: 769px) {
21
19
  .bc-cta__content {
22
- display: flex;
23
- flex-direction: row;
24
- }
25
- .bc-cta__button {
26
- padding-bottom: 0px;
27
- }
28
- .bc-cta__button_layout {
29
- width: 100%;
30
- max-width: 100%;
31
- margin-right: 0px;
20
+ flex-wrap: wrap;
32
21
  }
33
- .bc-cta__button_layout_2 {
34
- width: calc(50% - (16px / 2));
35
- max-width: 50%;
36
- margin-right: 16px;
22
+ .bc-cta__card {
23
+ width: calc((100% / 2) - 16px);
24
+ flex-grow: 1;
37
25
  }
38
- .bc-cta__button_layout_2:nth-child(2n) {
39
- margin-right: 0px;
40
- }
41
- .bc-cta__button_layout_3 {
42
- width: calc(33.3333333333% - (32px / 3));
43
- margin-right: 16px;
44
- }
45
- .bc-cta__button_layout_3:nth-child(3n) {
46
- margin-right: 0px;
47
- }
48
- .bc-cta__button_layout_4 {
49
- width: calc(25% - (48px / 4));
50
- max-width: 50%;
51
- margin-right: 16px;
26
+ }
27
+ @media (max-width: 577px) {
28
+ .bc-cta__content {
29
+ flex-direction: column;
52
30
  }
53
- .bc-cta__button_layout_4:nth-child(4n) {
54
- margin-right: 0px;
31
+ .bc-cta__card {
32
+ width: 100%;
55
33
  }
56
34
  }
package/build/esm/blocks/CTA/CTA.js CHANGED
@@ -7,15 +7,7 @@ import { block } from '../../utils/cn';
7
7
  import { getBlogElementMetrika, updateContentSizes } from '../../utils/common';
8
8
  import './CTA.css';
9
9
  const b = block('cta');
10
- const MAX_COLUMN_COUNT = 4, MIN_COLUMN_COUNT = 2, DEFAULT_COLUMN_COUNT = 3;
11
10
  export const CTA = ({ items, paddingTop, paddingBottom }) => {
12
- let count = items ? items.length : DEFAULT_COLUMN_COUNT;
13
- if (count < MIN_COLUMN_COUNT) {
14
- count = MIN_COLUMN_COUNT;
15
- }
16
- else if (count > MAX_COLUMN_COUNT) {
17
- count = MAX_COLUMN_COUNT;
18
- }
19
11
  /**
20
12
  * @deprecated Metrika will be deleted after launch of analyticsEvents
21
13
  */
@@ -26,17 +18,14 @@ export const CTA = ({ items, paddingTop, paddingBottom }) => {
26
18
  return (React.createElement(Wrapper, { paddings: {
27
19
  [PaddingsDirections.top]: paddingTop,
28
20
  [PaddingsDirections.bottom]: paddingBottom,
29
- }, className: b('content'), dataQa: "blog-cta-content" }, items.slice(0, count).map((content, index) => {
21
+ }, className: b('content'), dataQa: "blog-cta-content" }, items.map((content, index) => {
30
22
  var _a;
31
23
  const contentData = updateContentSizes(content);
32
24
  (_a = contentData.links) === null || _a === void 0 ? void 0 : _a.forEach((link) => {
33
25
  // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign
34
26
  link.metrikaGoals = getBlogElementMetrika(metrikaGoal, link.metrikaGoals);
35
27
  });
36
- return (React.createElement("div", { key: index, className: b('button', {
37
- ['layout']: count,
38
- }), "data-qa": "blog-cta-card" },
39
- React.createElement("div", { className: b('card') },
40
- React.createElement(Content, Object.assign({}, contentData)))));
28
+ return (React.createElement("div", { key: index, className: b('card'), "data-qa": "blog-cta-card" },
29
+ React.createElement(Content, Object.assign({}, contentData))));
41
30
  })));
42
31
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/blog-constructor",
3
- "version": "3.2.1",
3
+ "version": "3.3.0",
4
4
  "description": "Gravity UI Blog Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {