@gravity-ui/blog-constructor 6.2.0 → 6.3.0

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 (29) hide show
  1. package/build/cjs/blocks/Banner/schema.d.ts +4 -0
  2. package/build/cjs/blocks/CTA/schema.d.ts +4 -0
  3. package/build/cjs/blocks/ColoredText/schema.d.ts +17 -0
  4. package/build/cjs/blocks/Header/schema.d.ts +39 -0
  5. package/build/cjs/blocks/Media/schema.d.ts +26 -0
  6. package/build/cjs/components/FeedHeader/components/Controls/Controls.css +0 -3
  7. package/build/cjs/components/FeedHeader/components/Controls/customRenders.js +1 -1
  8. package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts +1 -1
  9. package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js +4 -3
  10. package/build/cjs/components/PostInfo/components/Save.js +5 -2
  11. package/build/cjs/i18n/index.d.ts +2 -1
  12. package/build/cjs/i18n/index.js +3 -0
  13. package/build/cjs/schema/index.d.ts +90 -0
  14. package/build/cjs/utils/common.d.ts +1 -0
  15. package/build/esm/blocks/Banner/schema.d.ts +4 -0
  16. package/build/esm/blocks/CTA/schema.d.ts +4 -0
  17. package/build/esm/blocks/ColoredText/schema.d.ts +17 -0
  18. package/build/esm/blocks/Header/schema.d.ts +39 -0
  19. package/build/esm/blocks/Media/schema.d.ts +26 -0
  20. package/build/esm/components/FeedHeader/components/Controls/Controls.css +0 -3
  21. package/build/esm/components/FeedHeader/components/Controls/customRenders.js +1 -1
  22. package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts +1 -1
  23. package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js +5 -4
  24. package/build/esm/components/PostInfo/components/Save.js +6 -3
  25. package/build/esm/i18n/index.d.ts +2 -1
  26. package/build/esm/i18n/index.js +3 -0
  27. package/build/esm/schema/index.d.ts +90 -0
  28. package/build/esm/utils/common.d.ts +1 -0
  29. package/package.json +3 -3
@@ -96,6 +96,10 @@ export declare const Banner: {
96
96
  };
97
97
  };
98
98
  };
99
+ controlPosition: {
100
+ type: string;
101
+ enum: string[];
102
+ };
99
103
  paddingTop: {
100
104
  type: string;
101
105
  enum: string[];
@@ -93,6 +93,10 @@ export declare const CTA: {
93
93
  };
94
94
  };
95
95
  };
96
+ controlPosition: {
97
+ type: string;
98
+ enum: string[];
99
+ };
96
100
  };
97
101
  };
98
102
  };
@@ -20,6 +20,19 @@ export declare const ColoredText: {
20
20
  type: string;
21
21
  pattern: string;
22
22
  optionName: string;
23
+ items?: undefined;
24
+ } | {
25
+ type: string;
26
+ items: {
27
+ type: string;
28
+ properties: {
29
+ when: {
30
+ type: string;
31
+ };
32
+ };
33
+ };
34
+ optionName: string;
35
+ pattern?: undefined;
23
36
  })[];
24
37
  };
25
38
  color: {
@@ -113,6 +126,10 @@ export declare const ColoredText: {
113
126
  };
114
127
  };
115
128
  };
129
+ controlPosition: {
130
+ type: string;
131
+ enum: string[];
132
+ };
116
133
  paddingTop: {
117
134
  type: string;
118
135
  enum: string[];
@@ -48,6 +48,19 @@ export declare const Header: {
48
48
  type: string;
49
49
  pattern: string;
50
50
  optionName: string;
51
+ items?: undefined;
52
+ } | {
53
+ type: string;
54
+ items: {
55
+ type: string;
56
+ properties: {
57
+ when: {
58
+ type: string;
59
+ };
60
+ };
61
+ };
62
+ optionName: string;
63
+ pattern?: undefined;
51
64
  })[];
52
65
  } & {
53
66
  optionName: string;
@@ -210,6 +223,19 @@ export declare const Header: {
210
223
  type: string;
211
224
  pattern: string;
212
225
  optionName: string;
226
+ items?: undefined;
227
+ } | {
228
+ type: string;
229
+ items: {
230
+ type: string;
231
+ properties: {
232
+ when: {
233
+ type: string;
234
+ };
235
+ };
236
+ };
237
+ optionName: string;
238
+ pattern?: undefined;
213
239
  })[];
214
240
  type?: undefined;
215
241
  items?: undefined;
@@ -227,6 +253,19 @@ export declare const Header: {
227
253
  type: string;
228
254
  pattern: string;
229
255
  optionName: string;
256
+ items?: undefined;
257
+ } | {
258
+ type: string;
259
+ items: {
260
+ type: string;
261
+ properties: {
262
+ when: {
263
+ type: string;
264
+ };
265
+ };
266
+ };
267
+ optionName: string;
268
+ pattern?: undefined;
230
269
  })[];
231
270
  };
232
271
  optionName: string;
@@ -24,6 +24,19 @@ export declare const Media: {
24
24
  type: string;
25
25
  pattern: string;
26
26
  optionName: string;
27
+ items?: undefined;
28
+ } | {
29
+ type: string;
30
+ items: {
31
+ type: string;
32
+ properties: {
33
+ when: {
34
+ type: string;
35
+ };
36
+ };
37
+ };
38
+ optionName: string;
39
+ pattern?: undefined;
27
40
  })[];
28
41
  type?: undefined;
29
42
  items?: undefined;
@@ -41,6 +54,19 @@ export declare const Media: {
41
54
  type: string;
42
55
  pattern: string;
43
56
  optionName: string;
57
+ items?: undefined;
58
+ } | {
59
+ type: string;
60
+ items: {
61
+ type: string;
62
+ properties: {
63
+ when: {
64
+ type: string;
65
+ };
66
+ };
67
+ };
68
+ optionName: string;
69
+ pattern?: undefined;
44
70
  })[];
45
71
  };
46
72
  optionName: string;
@@ -30,9 +30,6 @@ unpredictable css rules order in build */
30
30
  max-height: 500px;
31
31
  border-radius: 12px;
32
32
  }
33
- .bc-feed-controls__popup.bc-feed-controls__popup .g-select-list {
34
- overflow: scroll;
35
- }
36
33
  .bc-feed-controls__popup.bc-feed-controls__popup .g-select-list::-webkit-scrollbar {
37
34
  display: none;
38
35
  }
@@ -11,7 +11,7 @@ const CustomSwitcher_1 = require("../CustomSwitcher/CustomSwitcher");
11
11
  const b = (0, cn_1.block)('feed-controls');
12
12
  const renderSwitcher = ({ initial, list, defaultLabel }) =>
13
13
  // eslint-disable-next-line react/display-name
14
- ({ onClick, ref, onKeyDown, open, renderClear }) => (react_1.default.createElement(CustomSwitcher_1.CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, open: open }));
14
+ ({ onClick, ref, onKeyDown, open, renderClear, popupId, activeIndex }) => (react_1.default.createElement(CustomSwitcher_1.CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, open: open, popupId: popupId, activeIndex: activeIndex }));
15
15
  exports.renderSwitcher = renderSwitcher;
16
16
  const renderFilter = ({ value, onChange, onKeyDown }) => (react_1.default.createElement(uikit_1.TextInput, { controlProps: { size: 1 }, value: value, view: "clear", placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.Search), onUpdate: onChange, onKeyDown: onKeyDown, className: b('popup-filter') }));
17
17
  exports.renderFilter = renderFilter;
@@ -8,5 +8,5 @@ export type CustomSwitcherProps = {
8
8
  list: SelectItem[];
9
9
  controlRef: RenderControlParameters['ref'];
10
10
  } & Omit<RenderControlParameters, 'ref'>;
11
- export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }: CustomSwitcherProps) => React.JSX.Element;
11
+ export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, popupId, activeIndex, }: CustomSwitcherProps) => React.JSX.Element;
12
12
  export {};
@@ -10,7 +10,7 @@ const cn_1 = require("../../../../utils/cn");
10
10
  const b = (0, cn_1.block)('feed-custom-switcher');
11
11
  const ICON_SIZE = 12;
12
12
  const CLEAR_ICON_SIZE = 11;
13
- const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }) => {
13
+ const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, popupId, activeIndex, }) => {
14
14
  const itemsNames = (0, react_1.useMemo)(() => {
15
15
  const items = list
16
16
  .filter((item) => initial.includes(item.value))
@@ -18,9 +18,10 @@ const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKe
18
18
  return items.length ? items : [defaultLabel];
19
19
  }, [defaultLabel, initial, list]);
20
20
  const hasCounter = itemsNames.length > 1;
21
+ const contentElementId = (0, uikit_1.useUniqId)();
21
22
  return (react_1.default.createElement("div", { className: b('custom-switcher'), ref: controlRef },
22
- react_1.default.createElement("button", { onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown, "aria-expanded": open }),
23
- react_1.default.createElement("div", { className: b('custom-switcher-element', { content: true }) }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
23
+ react_1.default.createElement("button", { onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown, "aria-expanded": open, "aria-labelledby": contentElementId, "aria-activedescendant": activeIndex === undefined ? undefined : `${popupId}-item-${activeIndex}` }),
24
+ react_1.default.createElement("div", { id: contentElementId, className: b('custom-switcher-element', { content: true }), "aria-hidden": true }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
24
25
  renderClear &&
25
26
  renderClear({
26
27
  renderIcon: () => (react_1.default.createElement(uikit_1.Icon, { data: Close_1.Close, size: CLEAR_ICON_SIZE, className: b('clear') })),
@@ -11,6 +11,7 @@ const SaveFilled_1 = require("../../../icons/SaveFilled");
11
11
  const common_1 = require("../../../models/common");
12
12
  const cn_1 = require("../../../utils/cn");
13
13
  const common_2 = require("../../../utils/common");
14
+ const i18n_1 = require("../../../i18n");
14
15
  const ICON_SIZE = 16;
15
16
  const b = (0, cn_1.block)('post-info');
16
17
  /**
@@ -29,6 +30,8 @@ const Save = ({ title, postId, hasUserLike, handleUserLike, size, theme, qa, ana
29
30
  const { toggleLike, isSignedInUser, requireSignIn } = (0, react_1.useContext)(LikesContext_1.LikesContext);
30
31
  const handleAnalytics = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.SaveButton);
31
32
  const isLikeable = Boolean(toggleLike);
33
+ const titleElementId = (0, uikit_1.useUniqId)();
34
+ const isNumericTitle = typeof title === 'number';
32
35
  return (react_1.default.createElement("button", { className: b('item', { size, save: true }), onClick: (event) => {
33
36
  // both preventDefault and stopImmediatePropagation required to work properly
34
37
  // https://stackoverflow.com/questions/24415631/reactjs-syntheticevent-stoppropagation-only-works-with-react-events
@@ -45,10 +48,10 @@ const Save = ({ title, postId, hasUserLike, handleUserLike, size, theme, qa, ana
45
48
  (0, common_2.postLikeStatus)(postId, Boolean(hasUserLike));
46
49
  handleUserLike();
47
50
  handleAnalytics(analyticsEvents);
48
- }, "data-qa": qa },
51
+ }, "data-qa": qa, "aria-pressed": hasUserLike, "aria-label": isNumericTitle ? (0, i18n_1.i18n)(i18n_1.Keyset.Save) : undefined, "aria-describedby": isNumericTitle ? titleElementId : undefined },
49
52
  react_1.default.createElement("div", { className: b('content', { cursor: isLikeable, theme }) },
50
53
  react_1.default.createElement("span", { className: b('icon') },
51
54
  react_1.default.createElement(uikit_1.Icon, { data: hasUserLike ? SaveFilled_1.SaveFilled : Save_1.Save, size: ICON_SIZE, className: b({ filled: Boolean(hasUserLike) }) })),
52
- react_1.default.createElement("span", { className: b('title', { cursor: isLikeable }) }, title))));
55
+ react_1.default.createElement("span", { id: titleElementId, className: b('title', { cursor: isLikeable }) }, title))));
53
56
  };
54
57
  exports.Save = Save;
@@ -17,6 +17,7 @@ export declare enum Keyset {
17
17
  ActionSavedOnly = "action_saved_only",
18
18
  AllServices = "label_all_services",
19
19
  PromptSignInOnLike = "prompt_sign_in_on_like",
20
- SignIn = "Sign In"
20
+ SignIn = "Sign In",
21
+ Save = "save"
21
22
  }
22
23
  export declare const i18n: (key: Keyset, params?: import("@gravity-ui/i18n").Params | undefined) => string;
@@ -24,6 +24,7 @@ var Keyset;
24
24
  Keyset["AllServices"] = "label_all_services";
25
25
  Keyset["PromptSignInOnLike"] = "prompt_sign_in_on_like";
26
26
  Keyset["SignIn"] = "Sign In";
27
+ Keyset["Save"] = "save";
27
28
  })(Keyset = exports.Keyset || (exports.Keyset = {}));
28
29
  const en = {
29
30
  [Keyset.Title]: 'Blog',
@@ -49,6 +50,7 @@ const en = {
49
50
  '{{count}} mins to read',
50
51
  ],
51
52
  [Keyset.SignIn]: 'Sign In',
53
+ [Keyset.Save]: 'Save',
52
54
  };
53
55
  const ru = {
54
56
  [Keyset.Title]: 'Блог',
@@ -74,5 +76,6 @@ const ru = {
74
76
  '{{count}} минут чтения',
75
77
  ],
76
78
  [Keyset.SignIn]: 'Войти',
79
+ [Keyset.Save]: 'Сохранить',
77
80
  };
78
81
  exports.i18n = (0, i18n_1.addComponentKeysets)({ en, ru }, NAMESPACE);
@@ -56,6 +56,19 @@ export declare const schemasForCustom: {
56
56
  type: string;
57
57
  pattern: string;
58
58
  optionName: string;
59
+ items?: undefined;
60
+ } | {
61
+ type: string;
62
+ items: {
63
+ type: string;
64
+ properties: {
65
+ when: {
66
+ type: string;
67
+ };
68
+ };
69
+ };
70
+ optionName: string;
71
+ pattern?: undefined;
59
72
  })[];
60
73
  } & {
61
74
  optionName: string;
@@ -218,6 +231,19 @@ export declare const schemasForCustom: {
218
231
  type: string;
219
232
  pattern: string;
220
233
  optionName: string;
234
+ items?: undefined;
235
+ } | {
236
+ type: string;
237
+ items: {
238
+ type: string;
239
+ properties: {
240
+ when: {
241
+ type: string;
242
+ };
243
+ };
244
+ };
245
+ optionName: string;
246
+ pattern?: undefined;
221
247
  })[];
222
248
  type?: undefined;
223
249
  items?: undefined;
@@ -235,6 +261,19 @@ export declare const schemasForCustom: {
235
261
  type: string;
236
262
  pattern: string;
237
263
  optionName: string;
264
+ items?: undefined;
265
+ } | {
266
+ type: string;
267
+ items: {
268
+ type: string;
269
+ properties: {
270
+ when: {
271
+ type: string;
272
+ };
273
+ };
274
+ };
275
+ optionName: string;
276
+ pattern?: undefined;
238
277
  })[];
239
278
  };
240
279
  optionName: string;
@@ -754,6 +793,10 @@ export declare const schemasForCustom: {
754
793
  };
755
794
  };
756
795
  };
796
+ controlPosition: {
797
+ type: string;
798
+ enum: string[];
799
+ };
757
800
  paddingTop: {
758
801
  type: string;
759
802
  enum: string[];
@@ -840,6 +883,19 @@ export declare const schemasForCustom: {
840
883
  type: string;
841
884
  pattern: string;
842
885
  optionName: string;
886
+ items?: undefined;
887
+ } | {
888
+ type: string;
889
+ items: {
890
+ type: string;
891
+ properties: {
892
+ when: {
893
+ type: string;
894
+ };
895
+ };
896
+ };
897
+ optionName: string;
898
+ pattern?: undefined;
843
899
  })[];
844
900
  };
845
901
  color: {
@@ -933,6 +989,10 @@ export declare const schemasForCustom: {
933
989
  };
934
990
  };
935
991
  };
992
+ controlPosition: {
993
+ type: string;
994
+ enum: string[];
995
+ };
936
996
  paddingTop: {
937
997
  type: string;
938
998
  enum: string[];
@@ -1092,6 +1152,10 @@ export declare const schemasForCustom: {
1092
1152
  };
1093
1153
  };
1094
1154
  };
1155
+ controlPosition: {
1156
+ type: string;
1157
+ enum: string[];
1158
+ };
1095
1159
  };
1096
1160
  };
1097
1161
  };
@@ -1351,6 +1415,19 @@ export declare const schemasForCustom: {
1351
1415
  type: string;
1352
1416
  pattern: string;
1353
1417
  optionName: string;
1418
+ items?: undefined;
1419
+ } | {
1420
+ type: string;
1421
+ items: {
1422
+ type: string;
1423
+ properties: {
1424
+ when: {
1425
+ type: string;
1426
+ };
1427
+ };
1428
+ };
1429
+ optionName: string;
1430
+ pattern?: undefined;
1354
1431
  })[];
1355
1432
  type?: undefined;
1356
1433
  items?: undefined;
@@ -1368,6 +1445,19 @@ export declare const schemasForCustom: {
1368
1445
  type: string;
1369
1446
  pattern: string;
1370
1447
  optionName: string;
1448
+ items?: undefined;
1449
+ } | {
1450
+ type: string;
1451
+ items: {
1452
+ type: string;
1453
+ properties: {
1454
+ when: {
1455
+ type: string;
1456
+ };
1457
+ };
1458
+ };
1459
+ optionName: string;
1460
+ pattern?: undefined;
1371
1461
  })[];
1372
1462
  };
1373
1463
  optionName: string;
@@ -32,6 +32,7 @@ export declare const updateContentSizes: ({ size, colSizes, theme, ...contentDat
32
32
  buttons?: import("@gravity-ui/page-constructor").ButtonProps[] | undefined;
33
33
  centered?: boolean | undefined;
34
34
  list?: import("@gravity-ui/page-constructor").ContentItemProps[] | undefined;
35
+ controlPosition?: "default" | "bottom" | undefined;
35
36
  };
36
37
  type GetBreadcrumbsProps = {
37
38
  tags?: Tag[];
@@ -96,6 +96,10 @@ export declare const Banner: {
96
96
  };
97
97
  };
98
98
  };
99
+ controlPosition: {
100
+ type: string;
101
+ enum: string[];
102
+ };
99
103
  paddingTop: {
100
104
  type: string;
101
105
  enum: string[];
@@ -93,6 +93,10 @@ export declare const CTA: {
93
93
  };
94
94
  };
95
95
  };
96
+ controlPosition: {
97
+ type: string;
98
+ enum: string[];
99
+ };
96
100
  };
97
101
  };
98
102
  };
@@ -20,6 +20,19 @@ export declare const ColoredText: {
20
20
  type: string;
21
21
  pattern: string;
22
22
  optionName: string;
23
+ items?: undefined;
24
+ } | {
25
+ type: string;
26
+ items: {
27
+ type: string;
28
+ properties: {
29
+ when: {
30
+ type: string;
31
+ };
32
+ };
33
+ };
34
+ optionName: string;
35
+ pattern?: undefined;
23
36
  })[];
24
37
  };
25
38
  color: {
@@ -113,6 +126,10 @@ export declare const ColoredText: {
113
126
  };
114
127
  };
115
128
  };
129
+ controlPosition: {
130
+ type: string;
131
+ enum: string[];
132
+ };
116
133
  paddingTop: {
117
134
  type: string;
118
135
  enum: string[];
@@ -48,6 +48,19 @@ export declare const Header: {
48
48
  type: string;
49
49
  pattern: string;
50
50
  optionName: string;
51
+ items?: undefined;
52
+ } | {
53
+ type: string;
54
+ items: {
55
+ type: string;
56
+ properties: {
57
+ when: {
58
+ type: string;
59
+ };
60
+ };
61
+ };
62
+ optionName: string;
63
+ pattern?: undefined;
51
64
  })[];
52
65
  } & {
53
66
  optionName: string;
@@ -210,6 +223,19 @@ export declare const Header: {
210
223
  type: string;
211
224
  pattern: string;
212
225
  optionName: string;
226
+ items?: undefined;
227
+ } | {
228
+ type: string;
229
+ items: {
230
+ type: string;
231
+ properties: {
232
+ when: {
233
+ type: string;
234
+ };
235
+ };
236
+ };
237
+ optionName: string;
238
+ pattern?: undefined;
213
239
  })[];
214
240
  type?: undefined;
215
241
  items?: undefined;
@@ -227,6 +253,19 @@ export declare const Header: {
227
253
  type: string;
228
254
  pattern: string;
229
255
  optionName: string;
256
+ items?: undefined;
257
+ } | {
258
+ type: string;
259
+ items: {
260
+ type: string;
261
+ properties: {
262
+ when: {
263
+ type: string;
264
+ };
265
+ };
266
+ };
267
+ optionName: string;
268
+ pattern?: undefined;
230
269
  })[];
231
270
  };
232
271
  optionName: string;
@@ -24,6 +24,19 @@ export declare const Media: {
24
24
  type: string;
25
25
  pattern: string;
26
26
  optionName: string;
27
+ items?: undefined;
28
+ } | {
29
+ type: string;
30
+ items: {
31
+ type: string;
32
+ properties: {
33
+ when: {
34
+ type: string;
35
+ };
36
+ };
37
+ };
38
+ optionName: string;
39
+ pattern?: undefined;
27
40
  })[];
28
41
  type?: undefined;
29
42
  items?: undefined;
@@ -41,6 +54,19 @@ export declare const Media: {
41
54
  type: string;
42
55
  pattern: string;
43
56
  optionName: string;
57
+ items?: undefined;
58
+ } | {
59
+ type: string;
60
+ items: {
61
+ type: string;
62
+ properties: {
63
+ when: {
64
+ type: string;
65
+ };
66
+ };
67
+ };
68
+ optionName: string;
69
+ pattern?: undefined;
44
70
  })[];
45
71
  };
46
72
  optionName: string;
@@ -30,9 +30,6 @@ unpredictable css rules order in build */
30
30
  max-height: 500px;
31
31
  border-radius: 12px;
32
32
  }
33
- .bc-feed-controls__popup.bc-feed-controls__popup .g-select-list {
34
- overflow: scroll;
35
- }
36
33
  .bc-feed-controls__popup.bc-feed-controls__popup .g-select-list::-webkit-scrollbar {
37
34
  display: none;
38
35
  }
@@ -8,6 +8,6 @@ import './Controls.css';
8
8
  const b = block('feed-controls');
9
9
  export const renderSwitcher = ({ initial, list, defaultLabel }) =>
10
10
  // eslint-disable-next-line react/display-name
11
- ({ onClick, ref, onKeyDown, open, renderClear }) => (React.createElement(CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, open: open }));
11
+ ({ onClick, ref, onKeyDown, open, renderClear, popupId, activeIndex }) => (React.createElement(CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, open: open, popupId: popupId, activeIndex: activeIndex }));
12
12
  export const renderFilter = ({ value, onChange, onKeyDown }) => (React.createElement(TextInput, { controlProps: { size: 1 }, value: value, view: "clear", placeholder: i18n(Keyset.Search), onUpdate: onChange, onKeyDown: onKeyDown, className: b('popup-filter') }));
13
13
  export const renderOption = (option) => (React.createElement(CustomSelectOption, { data: option }));
@@ -9,5 +9,5 @@ export type CustomSwitcherProps = {
9
9
  list: SelectItem[];
10
10
  controlRef: RenderControlParameters['ref'];
11
11
  } & Omit<RenderControlParameters, 'ref'>;
12
- export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }: CustomSwitcherProps) => React.JSX.Element;
12
+ export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, popupId, activeIndex, }: CustomSwitcherProps) => React.JSX.Element;
13
13
  export {};
@@ -1,5 +1,5 @@
1
1
  import React, { useMemo } from 'react';
2
- import { Icon } from '@gravity-ui/uikit';
2
+ import { Icon, useUniqId } from '@gravity-ui/uikit';
3
3
  import { DropdownArrow } from '../../../../icons/DropdownArrow';
4
4
  import { Close } from '../../../../icons/Close';
5
5
  import { block } from '../../../../utils/cn';
@@ -7,7 +7,7 @@ import './CustomSwitcher.css';
7
7
  const b = block('feed-custom-switcher');
8
8
  const ICON_SIZE = 12;
9
9
  const CLEAR_ICON_SIZE = 11;
10
- export const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }) => {
10
+ export const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, popupId, activeIndex, }) => {
11
11
  const itemsNames = useMemo(() => {
12
12
  const items = list
13
13
  .filter((item) => initial.includes(item.value))
@@ -15,9 +15,10 @@ export const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRe
15
15
  return items.length ? items : [defaultLabel];
16
16
  }, [defaultLabel, initial, list]);
17
17
  const hasCounter = itemsNames.length > 1;
18
+ const contentElementId = useUniqId();
18
19
  return (React.createElement("div", { className: b('custom-switcher'), ref: controlRef },
19
- React.createElement("button", { onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown, "aria-expanded": open }),
20
- React.createElement("div", { className: b('custom-switcher-element', { content: true }) }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
20
+ React.createElement("button", { onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown, "aria-expanded": open, "aria-labelledby": contentElementId, "aria-activedescendant": activeIndex === undefined ? undefined : `${popupId}-item-${activeIndex}` }),
21
+ React.createElement("div", { id: contentElementId, className: b('custom-switcher-element', { content: true }), "aria-hidden": true }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
21
22
  renderClear &&
22
23
  renderClear({
23
24
  renderIcon: () => (React.createElement(Icon, { data: Close, size: CLEAR_ICON_SIZE, className: b('clear') })),
@@ -1,6 +1,6 @@
1
1
  import React, { useContext } from 'react';
2
2
  import { useAnalytics } from '@gravity-ui/page-constructor';
3
- import { Icon } from '@gravity-ui/uikit';
3
+ import { Icon, useUniqId } from '@gravity-ui/uikit';
4
4
  import { LikesContext } from '../../../contexts/LikesContext';
5
5
  import { Save as SaveIcon } from '../../../icons/Save';
6
6
  import { SaveFilled } from '../../../icons/SaveFilled';
@@ -8,6 +8,7 @@ import { DefaultEventNames } from '../../../models/common';
8
8
  import { block } from '../../../utils/cn';
9
9
  import { postLikeStatus } from '../../../utils/common';
10
10
  import '../PostInfo.css';
11
+ import { Keyset, i18n } from '../../../i18n';
11
12
  const ICON_SIZE = 16;
12
13
  const b = block('post-info');
13
14
  /**
@@ -26,6 +27,8 @@ export const Save = ({ title, postId, hasUserLike, handleUserLike, size, theme,
26
27
  const { toggleLike, isSignedInUser, requireSignIn } = useContext(LikesContext);
27
28
  const handleAnalytics = useAnalytics(DefaultEventNames.SaveButton);
28
29
  const isLikeable = Boolean(toggleLike);
30
+ const titleElementId = useUniqId();
31
+ const isNumericTitle = typeof title === 'number';
29
32
  return (React.createElement("button", { className: b('item', { size, save: true }), onClick: (event) => {
30
33
  // both preventDefault and stopImmediatePropagation required to work properly
31
34
  // https://stackoverflow.com/questions/24415631/reactjs-syntheticevent-stoppropagation-only-works-with-react-events
@@ -42,9 +45,9 @@ export const Save = ({ title, postId, hasUserLike, handleUserLike, size, theme,
42
45
  postLikeStatus(postId, Boolean(hasUserLike));
43
46
  handleUserLike();
44
47
  handleAnalytics(analyticsEvents);
45
- }, "data-qa": qa },
48
+ }, "data-qa": qa, "aria-pressed": hasUserLike, "aria-label": isNumericTitle ? i18n(Keyset.Save) : undefined, "aria-describedby": isNumericTitle ? titleElementId : undefined },
46
49
  React.createElement("div", { className: b('content', { cursor: isLikeable, theme }) },
47
50
  React.createElement("span", { className: b('icon') },
48
51
  React.createElement(Icon, { data: hasUserLike ? SaveFilled : SaveIcon, size: ICON_SIZE, className: b({ filled: Boolean(hasUserLike) }) })),
49
- React.createElement("span", { className: b('title', { cursor: isLikeable }) }, title))));
52
+ React.createElement("span", { id: titleElementId, className: b('title', { cursor: isLikeable }) }, title))));
50
53
  };
@@ -17,6 +17,7 @@ export declare enum Keyset {
17
17
  ActionSavedOnly = "action_saved_only",
18
18
  AllServices = "label_all_services",
19
19
  PromptSignInOnLike = "prompt_sign_in_on_like",
20
- SignIn = "Sign In"
20
+ SignIn = "Sign In",
21
+ Save = "save"
21
22
  }
22
23
  export declare const i18n: (key: Keyset, params?: import("@gravity-ui/i18n").Params | undefined) => string;
@@ -21,6 +21,7 @@ export var Keyset;
21
21
  Keyset["AllServices"] = "label_all_services";
22
22
  Keyset["PromptSignInOnLike"] = "prompt_sign_in_on_like";
23
23
  Keyset["SignIn"] = "Sign In";
24
+ Keyset["Save"] = "save";
24
25
  })(Keyset || (Keyset = {}));
25
26
  const en = {
26
27
  [Keyset.Title]: 'Blog',
@@ -46,6 +47,7 @@ const en = {
46
47
  '{{count}} mins to read',
47
48
  ],
48
49
  [Keyset.SignIn]: 'Sign In',
50
+ [Keyset.Save]: 'Save',
49
51
  };
50
52
  const ru = {
51
53
  [Keyset.Title]: 'Блог',
@@ -71,5 +73,6 @@ const ru = {
71
73
  '{{count}} минут чтения',
72
74
  ],
73
75
  [Keyset.SignIn]: 'Войти',
76
+ [Keyset.Save]: 'Сохранить',
74
77
  };
75
78
  export const i18n = addComponentKeysets({ en, ru }, NAMESPACE);
@@ -56,6 +56,19 @@ export declare const schemasForCustom: {
56
56
  type: string;
57
57
  pattern: string;
58
58
  optionName: string;
59
+ items?: undefined;
60
+ } | {
61
+ type: string;
62
+ items: {
63
+ type: string;
64
+ properties: {
65
+ when: {
66
+ type: string;
67
+ };
68
+ };
69
+ };
70
+ optionName: string;
71
+ pattern?: undefined;
59
72
  })[];
60
73
  } & {
61
74
  optionName: string;
@@ -218,6 +231,19 @@ export declare const schemasForCustom: {
218
231
  type: string;
219
232
  pattern: string;
220
233
  optionName: string;
234
+ items?: undefined;
235
+ } | {
236
+ type: string;
237
+ items: {
238
+ type: string;
239
+ properties: {
240
+ when: {
241
+ type: string;
242
+ };
243
+ };
244
+ };
245
+ optionName: string;
246
+ pattern?: undefined;
221
247
  })[];
222
248
  type?: undefined;
223
249
  items?: undefined;
@@ -235,6 +261,19 @@ export declare const schemasForCustom: {
235
261
  type: string;
236
262
  pattern: string;
237
263
  optionName: string;
264
+ items?: undefined;
265
+ } | {
266
+ type: string;
267
+ items: {
268
+ type: string;
269
+ properties: {
270
+ when: {
271
+ type: string;
272
+ };
273
+ };
274
+ };
275
+ optionName: string;
276
+ pattern?: undefined;
238
277
  })[];
239
278
  };
240
279
  optionName: string;
@@ -754,6 +793,10 @@ export declare const schemasForCustom: {
754
793
  };
755
794
  };
756
795
  };
796
+ controlPosition: {
797
+ type: string;
798
+ enum: string[];
799
+ };
757
800
  paddingTop: {
758
801
  type: string;
759
802
  enum: string[];
@@ -840,6 +883,19 @@ export declare const schemasForCustom: {
840
883
  type: string;
841
884
  pattern: string;
842
885
  optionName: string;
886
+ items?: undefined;
887
+ } | {
888
+ type: string;
889
+ items: {
890
+ type: string;
891
+ properties: {
892
+ when: {
893
+ type: string;
894
+ };
895
+ };
896
+ };
897
+ optionName: string;
898
+ pattern?: undefined;
843
899
  })[];
844
900
  };
845
901
  color: {
@@ -933,6 +989,10 @@ export declare const schemasForCustom: {
933
989
  };
934
990
  };
935
991
  };
992
+ controlPosition: {
993
+ type: string;
994
+ enum: string[];
995
+ };
936
996
  paddingTop: {
937
997
  type: string;
938
998
  enum: string[];
@@ -1092,6 +1152,10 @@ export declare const schemasForCustom: {
1092
1152
  };
1093
1153
  };
1094
1154
  };
1155
+ controlPosition: {
1156
+ type: string;
1157
+ enum: string[];
1158
+ };
1095
1159
  };
1096
1160
  };
1097
1161
  };
@@ -1351,6 +1415,19 @@ export declare const schemasForCustom: {
1351
1415
  type: string;
1352
1416
  pattern: string;
1353
1417
  optionName: string;
1418
+ items?: undefined;
1419
+ } | {
1420
+ type: string;
1421
+ items: {
1422
+ type: string;
1423
+ properties: {
1424
+ when: {
1425
+ type: string;
1426
+ };
1427
+ };
1428
+ };
1429
+ optionName: string;
1430
+ pattern?: undefined;
1354
1431
  })[];
1355
1432
  type?: undefined;
1356
1433
  items?: undefined;
@@ -1368,6 +1445,19 @@ export declare const schemasForCustom: {
1368
1445
  type: string;
1369
1446
  pattern: string;
1370
1447
  optionName: string;
1448
+ items?: undefined;
1449
+ } | {
1450
+ type: string;
1451
+ items: {
1452
+ type: string;
1453
+ properties: {
1454
+ when: {
1455
+ type: string;
1456
+ };
1457
+ };
1458
+ };
1459
+ optionName: string;
1460
+ pattern?: undefined;
1371
1461
  })[];
1372
1462
  };
1373
1463
  optionName: string;
@@ -32,6 +32,7 @@ export declare const updateContentSizes: ({ size, colSizes, theme, ...contentDat
32
32
  buttons?: import("@gravity-ui/page-constructor").ButtonProps[] | undefined;
33
33
  centered?: boolean | undefined;
34
34
  list?: import("@gravity-ui/page-constructor").ContentItemProps[] | undefined;
35
+ controlPosition?: "default" | "bottom" | undefined;
35
36
  };
36
37
  type GetBreadcrumbsProps = {
37
38
  tags?: Tag[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/blog-constructor",
3
- "version": "6.2.0",
3
+ "version": "6.3.0",
4
4
  "description": "Gravity UI Blog Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -82,11 +82,11 @@
82
82
  "@commitlint/config-conventional": "^17.4.3",
83
83
  "@diplodoc/transform": "^4.10.8",
84
84
  "@gravity-ui/eslint-config": "^3.1.1",
85
- "@gravity-ui/page-constructor": "^5.9.1",
85
+ "@gravity-ui/page-constructor": "^5.18.0",
86
86
  "@gravity-ui/prettier-config": "^1.1.0",
87
87
  "@gravity-ui/stylelint-config": "^4.0.1",
88
88
  "@gravity-ui/tsconfig": "^1.0.0",
89
- "@gravity-ui/uikit": "^6.9.0",
89
+ "@gravity-ui/uikit": "^6.22.0",
90
90
  "@jest/environment": "^29.7.0",
91
91
  "@storybook/addon-essentials": "^8.0.5",
92
92
  "@storybook/addon-mdx-gfm": "^8.0.5",