@gravity-ui/blog-constructor 5.14.0-beta.1 → 5.15.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.
- package/README.md +2 -2
- package/build/cjs/blocks/Header/schema.d.ts +1 -11
- package/build/cjs/blocks/Media/schema.d.ts +1 -11
- package/build/cjs/components/FeedHeader/components/Controls/Controls.css +4 -0
- package/build/cjs/components/FeedHeader/components/Controls/Controls.js +4 -2
- package/build/cjs/components/FeedHeader/components/Controls/customRenders.js +1 -1
- package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.css +9 -0
- package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts +1 -1
- package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js +7 -1
- package/build/cjs/components/PostCard/PostCard.css +4 -5
- package/build/cjs/models/blocks.d.ts +1 -1
- package/build/cjs/schema/index.d.ts +2 -22
- package/build/esm/blocks/Header/schema.d.ts +1 -11
- package/build/esm/blocks/Media/schema.d.ts +1 -11
- package/build/esm/components/FeedHeader/components/Controls/Controls.css +4 -0
- package/build/esm/components/FeedHeader/components/Controls/Controls.js +4 -2
- package/build/esm/components/FeedHeader/components/Controls/customRenders.js +1 -1
- package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.css +9 -0
- package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts +1 -1
- package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js +7 -1
- package/build/esm/components/PostCard/PostCard.css +4 -5
- package/build/esm/models/blocks.d.ts +1 -1
- package/build/esm/schema/index.d.ts +2 -22
- package/package.json +4 -7
- package/server/models/blocks.d.ts +1 -1
package/README.md
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
# @gravity-ui/blog-constructor · [](https://www.npmjs.com/package/@gravity-ui/blog-constructor) [](https://github.com/gravity-ui/blog-constructor/actions/workflows/ci.yml?query=branch:main) [](https://github.com/gravity-ui/blog-constructor/actions/workflows/release.yml?query=branch:main) [](https://preview.
|
1
|
+
# @gravity-ui/blog-constructor · [](https://www.npmjs.com/package/@gravity-ui/blog-constructor) [](https://github.com/gravity-ui/blog-constructor/actions/workflows/ci.yml?query=branch:main) [](https://github.com/gravity-ui/blog-constructor/actions/workflows/release.yml?query=branch:main) [](https://preview.gravity-ui.com/blog-constructor/)
|
2
2
|
|
3
3
|
## Install
|
4
4
|
|
@@ -10,7 +10,7 @@ npm install @gravity-ui/blog-constructor
|
|
10
10
|
|
11
11
|
`Blog-constructor` is a library based on the [Page-constructor](https://github.com/gravity-ui/page-constructor) library for creating blog format web pages. Blog-constructor uses the [`custom`](https://github.com/gravity-ui/page-constructor#custom-blocks) prop from page-constructor to add the components needed for the blog.
|
12
12
|
|
13
|
-
### Documentation - [storybook](https://preview.
|
13
|
+
### Documentation - [storybook](https://preview.gravity-ui.com/blog-constructor/)
|
14
14
|
|
15
15
|
### Getting started
|
16
16
|
|
@@ -450,20 +450,10 @@ export declare const Header: {
|
|
450
450
|
type: string;
|
451
451
|
};
|
452
452
|
height: {
|
453
|
-
oneOf: ({
|
454
|
-
type: string;
|
455
|
-
enum?: undefined;
|
456
|
-
} | {
|
457
|
-
type: string;
|
458
|
-
enum: string[];
|
459
|
-
})[];
|
460
|
-
};
|
461
|
-
width: {
|
462
453
|
type: string;
|
463
454
|
};
|
464
|
-
|
455
|
+
width: {
|
465
456
|
type: string;
|
466
|
-
enum: string[];
|
467
457
|
};
|
468
458
|
};
|
469
459
|
};
|
@@ -264,20 +264,10 @@ export declare const Media: {
|
|
264
264
|
type: string;
|
265
265
|
};
|
266
266
|
height: {
|
267
|
-
oneOf: ({
|
268
|
-
type: string;
|
269
|
-
enum?: undefined;
|
270
|
-
} | {
|
271
|
-
type: string;
|
272
|
-
enum: string[];
|
273
|
-
})[];
|
274
|
-
};
|
275
|
-
width: {
|
276
267
|
type: string;
|
277
268
|
};
|
278
|
-
|
269
|
+
width: {
|
279
270
|
type: string;
|
280
|
-
enum: string[];
|
281
271
|
};
|
282
272
|
};
|
283
273
|
};
|
@@ -44,6 +44,10 @@ unpredictable css rules order in build */
|
|
44
44
|
border-radius: 8px;
|
45
45
|
}
|
46
46
|
|
47
|
+
.bc-feed-controls__popup_isMobile.bc-feed-controls__popup_isMobile {
|
48
|
+
max-height: inherit;
|
49
|
+
}
|
50
|
+
|
47
51
|
.bc-feed-controls__popup-filter {
|
48
52
|
font-size: var(--g-text-body-2-font-size);
|
49
53
|
line-height: var(--g-text-body-2-line-height);
|
@@ -10,6 +10,7 @@ const uikit_1 = require("@gravity-ui/uikit");
|
|
10
10
|
*/
|
11
11
|
const constants_1 = require("../../../../constants");
|
12
12
|
const LikesContext_1 = require("../../../../contexts/LikesContext");
|
13
|
+
const MobileContext_1 = require("../../../../contexts/MobileContext");
|
13
14
|
const metrika_1 = tslib_1.__importDefault(require("../../../../counters/metrika"));
|
14
15
|
const utils_1 = require("../../../../counters/utils");
|
15
16
|
const i18n_1 = require("../../../../i18n");
|
@@ -30,6 +31,7 @@ const Controls = ({ handleLoadData, tags = [], services = [], queryParams, }) =>
|
|
30
31
|
const { savedOnly: savedOnlyInitial, search: searchInitial, tags: tagInitial, services: servicesInitial, } = queryParams || {};
|
31
32
|
const [savedOnly, setSavedOnly] = (0, react_1.useState)(savedOnlyInitial === 'true');
|
32
33
|
const [search, setSearch] = (0, react_1.useState)(searchInitial);
|
34
|
+
const isMobile = (0, react_1.useContext)(MobileContext_1.MobileContext);
|
33
35
|
const handleSavedOnly = () => {
|
34
36
|
handleAnalyticsSaveOnly();
|
35
37
|
setSavedOnly(!savedOnly);
|
@@ -98,13 +100,13 @@ const Controls = ({ handleLoadData, tags = [], services = [], queryParams, }) =>
|
|
98
100
|
react_1.default.createElement("div", { className: b('filter-item') },
|
99
101
|
react_1.default.createElement(Search_1.Search, { className: b('search'), placeholder: (0, i18n_1.i18)(i18n_1.Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
|
100
102
|
react_1.default.createElement("div", { className: b('filter-item') },
|
101
|
-
react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: (0, i18n_1.i18)(i18n_1.Keyset.AllTags), popupClassName: b('popup'), renderControl: (0, customRenders_1.renderSwitcher)({
|
103
|
+
react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: (0, i18n_1.i18)(i18n_1.Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: (0, customRenders_1.renderSwitcher)({
|
102
104
|
initial: [tagInitial],
|
103
105
|
list: tagsItems,
|
104
106
|
defaultLabel: (0, i18n_1.i18)(i18n_1.Keyset.AllTags),
|
105
107
|
}), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption })),
|
106
108
|
services.length > 0 ? (react_1.default.createElement("div", { className: b('filter-item') },
|
107
|
-
react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup'), onUpdate: handleServicesSelect, placeholder: (0, i18n_1.i18)(i18n_1.Keyset.AllServices), renderControl: (0, customRenders_1.renderSwitcher)({
|
109
|
+
react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: (0, i18n_1.i18)(i18n_1.Keyset.AllServices), renderControl: (0, customRenders_1.renderSwitcher)({
|
108
110
|
initial: servicesItems,
|
109
111
|
list: services,
|
110
112
|
defaultLabel: (0, i18n_1.i18)(i18n_1.Keyset.AllServices),
|
@@ -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 }) => (react_1.default.createElement(CustomSwitcher_1.CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, open: open }));
|
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 }));
|
15
15
|
exports.renderSwitcher = renderSwitcher;
|
16
16
|
const renderFilter = ({ value, ref, onChange, onKeyDown }) => (react_1.default.createElement(uikit_1.TextInput, { controlRef: ref, controlProps: { size: 1 }, value: value, view: "clear", placeholder: (0, i18n_1.i18)(i18n_1.Keyset.Search), onUpdate: onChange, onKeyDown: onKeyDown, className: b('popup-filter') }));
|
17
17
|
exports.renderFilter = renderFilter;
|
@@ -29,6 +29,11 @@ unpredictable css rules order in build */
|
|
29
29
|
inset: auto !important;
|
30
30
|
transform: translate3d(0, 4px, 0) !important;
|
31
31
|
}
|
32
|
+
.bc-feed-custom-switcher__custom-switcher .g-select-clear {
|
33
|
+
width: 11px;
|
34
|
+
height: 11px;
|
35
|
+
margin-right: 9px;
|
36
|
+
}
|
32
37
|
.bc-feed-custom-switcher__custom-switcher:hover {
|
33
38
|
border-color: var(--g-color-base-generic-hover);
|
34
39
|
cursor: pointer;
|
@@ -61,4 +66,8 @@ unpredictable css rules order in build */
|
|
61
66
|
.bc-feed-custom-switcher__switcher-arrow {
|
62
67
|
width: 16px;
|
63
68
|
height: 16px;
|
69
|
+
}
|
70
|
+
.bc-feed-custom-switcher__clear {
|
71
|
+
width: 11px;
|
72
|
+
height: 11px;
|
64
73
|
}
|
@@ -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, }: CustomSwitcherProps) => React.JSX.Element;
|
11
|
+
export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }: CustomSwitcherProps) => React.JSX.Element;
|
12
12
|
export {};
|
@@ -5,10 +5,12 @@ const tslib_1 = require("tslib");
|
|
5
5
|
const react_1 = tslib_1.__importStar(require("react"));
|
6
6
|
const uikit_1 = require("@gravity-ui/uikit");
|
7
7
|
const DropdownArrow_1 = require("../../../../icons/DropdownArrow");
|
8
|
+
const Close_1 = require("../../../../icons/Close");
|
8
9
|
const cn_1 = require("../../../../utils/cn");
|
9
10
|
const b = (0, cn_1.block)('feed-custom-switcher');
|
10
11
|
const ICON_SIZE = 12;
|
11
|
-
const
|
12
|
+
const CLEAR_ICON_SIZE = 11;
|
13
|
+
const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }) => {
|
12
14
|
const itemsNames = (0, react_1.useMemo)(() => {
|
13
15
|
const items = list
|
14
16
|
.filter((item) => initial.includes(item.value))
|
@@ -18,6 +20,10 @@ const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKe
|
|
18
20
|
const hasCounter = itemsNames.length > 1;
|
19
21
|
return (react_1.default.createElement("button", { className: b('custom-switcher'), onClick: onClick, ref: controlRef, onKeyDown: onKeyDown, "aria-expanded": open },
|
20
22
|
react_1.default.createElement("div", { className: b('custom-switcher-element', { content: true }) }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
|
23
|
+
renderClear &&
|
24
|
+
renderClear({
|
25
|
+
renderIcon: () => (react_1.default.createElement(uikit_1.Icon, { data: Close_1.Close, size: CLEAR_ICON_SIZE, className: b('clear') })),
|
26
|
+
}),
|
21
27
|
hasCounter && (react_1.default.createElement("div", { className: b('custom-switcher-element', { counter: true }) }, itemsNames.length)),
|
22
28
|
react_1.default.createElement("div", { className: b('custom-switcher-element', { arrow: true }) },
|
23
29
|
react_1.default.createElement(uikit_1.Icon, { data: DropdownArrow_1.DropdownArrow, size: ICON_SIZE, className: b('switcher-arrow') }))));
|
@@ -18,14 +18,13 @@ unpredictable css rules order in build */
|
|
18
18
|
}
|
19
19
|
}
|
20
20
|
.bc-post-card__header_fullWidth {
|
21
|
-
|
22
|
-
min-height: 480px;
|
21
|
+
min-height: auto;
|
23
22
|
height: 100%;
|
24
23
|
}
|
25
|
-
@media (
|
24
|
+
@media (min-width: 1081px) {
|
26
25
|
.bc-post-card__header_fullWidth {
|
27
|
-
width:
|
28
|
-
min-height:
|
26
|
+
width: 66%;
|
27
|
+
min-height: 480px;
|
29
28
|
}
|
30
29
|
}
|
31
30
|
.bc-post-card__title {
|
@@ -27,7 +27,7 @@ export type LayoutProps = {
|
|
27
27
|
mobileOrder?: string;
|
28
28
|
children: ReactElement[];
|
29
29
|
} & PaddingsYFMProps;
|
30
|
-
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'
|
30
|
+
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'>> & {
|
31
31
|
text?: string;
|
32
32
|
};
|
33
33
|
export type MetaProps = QAProps & {
|
@@ -458,20 +458,10 @@ export declare const schemasForCustom: {
|
|
458
458
|
type: string;
|
459
459
|
};
|
460
460
|
height: {
|
461
|
-
oneOf: ({
|
462
|
-
type: string;
|
463
|
-
enum?: undefined;
|
464
|
-
} | {
|
465
|
-
type: string;
|
466
|
-
enum: string[];
|
467
|
-
})[];
|
468
|
-
};
|
469
|
-
width: {
|
470
461
|
type: string;
|
471
462
|
};
|
472
|
-
|
463
|
+
width: {
|
473
464
|
type: string;
|
474
|
-
enum: string[];
|
475
465
|
};
|
476
466
|
};
|
477
467
|
};
|
@@ -1598,20 +1588,10 @@ export declare const schemasForCustom: {
|
|
1598
1588
|
type: string;
|
1599
1589
|
};
|
1600
1590
|
height: {
|
1601
|
-
oneOf: ({
|
1602
|
-
type: string;
|
1603
|
-
enum?: undefined;
|
1604
|
-
} | {
|
1605
|
-
type: string;
|
1606
|
-
enum: string[];
|
1607
|
-
})[];
|
1608
|
-
};
|
1609
|
-
width: {
|
1610
1591
|
type: string;
|
1611
1592
|
};
|
1612
|
-
|
1593
|
+
width: {
|
1613
1594
|
type: string;
|
1614
|
-
enum: string[];
|
1615
1595
|
};
|
1616
1596
|
};
|
1617
1597
|
};
|
@@ -450,20 +450,10 @@ export declare const Header: {
|
|
450
450
|
type: string;
|
451
451
|
};
|
452
452
|
height: {
|
453
|
-
oneOf: ({
|
454
|
-
type: string;
|
455
|
-
enum?: undefined;
|
456
|
-
} | {
|
457
|
-
type: string;
|
458
|
-
enum: string[];
|
459
|
-
})[];
|
460
|
-
};
|
461
|
-
width: {
|
462
453
|
type: string;
|
463
454
|
};
|
464
|
-
|
455
|
+
width: {
|
465
456
|
type: string;
|
466
|
-
enum: string[];
|
467
457
|
};
|
468
458
|
};
|
469
459
|
};
|
@@ -264,20 +264,10 @@ export declare const Media: {
|
|
264
264
|
type: string;
|
265
265
|
};
|
266
266
|
height: {
|
267
|
-
oneOf: ({
|
268
|
-
type: string;
|
269
|
-
enum?: undefined;
|
270
|
-
} | {
|
271
|
-
type: string;
|
272
|
-
enum: string[];
|
273
|
-
})[];
|
274
|
-
};
|
275
|
-
width: {
|
276
267
|
type: string;
|
277
268
|
};
|
278
|
-
|
269
|
+
width: {
|
279
270
|
type: string;
|
280
|
-
enum: string[];
|
281
271
|
};
|
282
272
|
};
|
283
273
|
};
|
@@ -44,6 +44,10 @@ unpredictable css rules order in build */
|
|
44
44
|
border-radius: 8px;
|
45
45
|
}
|
46
46
|
|
47
|
+
.bc-feed-controls__popup_isMobile.bc-feed-controls__popup_isMobile {
|
48
|
+
max-height: inherit;
|
49
|
+
}
|
50
|
+
|
47
51
|
.bc-feed-controls__popup-filter {
|
48
52
|
font-size: var(--g-text-body-2-font-size);
|
49
53
|
line-height: var(--g-text-body-2-line-height);
|
@@ -6,6 +6,7 @@ import { Button, Icon, Select } from '@gravity-ui/uikit';
|
|
6
6
|
*/
|
7
7
|
import { BlogMetrikaGoalIds } from '../../../../constants';
|
8
8
|
import { LikesContext } from '../../../../contexts/LikesContext';
|
9
|
+
import { MobileContext } from '../../../../contexts/MobileContext';
|
9
10
|
import metrika from '../../../../counters/metrika';
|
10
11
|
import { MetrikaCounter } from '../../../../counters/utils';
|
11
12
|
import { Keyset, i18 } from '../../../../i18n';
|
@@ -27,6 +28,7 @@ export const Controls = ({ handleLoadData, tags = [], services = [], queryParams
|
|
27
28
|
const { savedOnly: savedOnlyInitial, search: searchInitial, tags: tagInitial, services: servicesInitial, } = queryParams || {};
|
28
29
|
const [savedOnly, setSavedOnly] = useState(savedOnlyInitial === 'true');
|
29
30
|
const [search, setSearch] = useState(searchInitial);
|
31
|
+
const isMobile = useContext(MobileContext);
|
30
32
|
const handleSavedOnly = () => {
|
31
33
|
handleAnalyticsSaveOnly();
|
32
34
|
setSavedOnly(!savedOnly);
|
@@ -95,13 +97,13 @@ export const Controls = ({ handleLoadData, tags = [], services = [], queryParams
|
|
95
97
|
React.createElement("div", { className: b('filter-item') },
|
96
98
|
React.createElement(Search, { className: b('search'), placeholder: i18(Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
|
97
99
|
React.createElement("div", { className: b('filter-item') },
|
98
|
-
React.createElement(Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: i18(Keyset.AllTags), popupClassName: b('popup'), renderControl: renderSwitcher({
|
100
|
+
React.createElement(Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: i18(Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: renderSwitcher({
|
99
101
|
initial: [tagInitial],
|
100
102
|
list: tagsItems,
|
101
103
|
defaultLabel: i18(Keyset.AllTags),
|
102
104
|
}), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: renderOption })),
|
103
105
|
services.length > 0 ? (React.createElement("div", { className: b('filter-item') },
|
104
|
-
React.createElement(Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup'), onUpdate: handleServicesSelect, placeholder: i18(Keyset.AllServices), renderControl: renderSwitcher({
|
106
|
+
React.createElement(Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: i18(Keyset.AllServices), renderControl: renderSwitcher({
|
105
107
|
initial: servicesItems,
|
106
108
|
list: services,
|
107
109
|
defaultLabel: i18(Keyset.AllServices),
|
@@ -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 }) => (React.createElement(CustomSwitcher, { initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, open: open }));
|
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 }));
|
12
12
|
export const renderFilter = ({ value, ref, onChange, onKeyDown }) => (React.createElement(TextInput, { controlRef: ref, controlProps: { size: 1 }, value: value, view: "clear", placeholder: i18(Keyset.Search), onUpdate: onChange, onKeyDown: onKeyDown, className: b('popup-filter') }));
|
13
13
|
export const renderOption = (option) => (React.createElement(CustomSelectOption, { data: option }));
|
@@ -29,6 +29,11 @@ unpredictable css rules order in build */
|
|
29
29
|
inset: auto !important;
|
30
30
|
transform: translate3d(0, 4px, 0) !important;
|
31
31
|
}
|
32
|
+
.bc-feed-custom-switcher__custom-switcher .g-select-clear {
|
33
|
+
width: 11px;
|
34
|
+
height: 11px;
|
35
|
+
margin-right: 9px;
|
36
|
+
}
|
32
37
|
.bc-feed-custom-switcher__custom-switcher:hover {
|
33
38
|
border-color: var(--g-color-base-generic-hover);
|
34
39
|
cursor: pointer;
|
@@ -61,4 +66,8 @@ unpredictable css rules order in build */
|
|
61
66
|
.bc-feed-custom-switcher__switcher-arrow {
|
62
67
|
width: 16px;
|
63
68
|
height: 16px;
|
69
|
+
}
|
70
|
+
.bc-feed-custom-switcher__clear {
|
71
|
+
width: 11px;
|
72
|
+
height: 11px;
|
64
73
|
}
|
@@ -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, }: CustomSwitcherProps) => React.JSX.Element;
|
12
|
+
export declare const CustomSwitcher: ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }: CustomSwitcherProps) => React.JSX.Element;
|
13
13
|
export {};
|
@@ -1,11 +1,13 @@
|
|
1
1
|
import React, { useMemo } from 'react';
|
2
2
|
import { Icon } from '@gravity-ui/uikit';
|
3
3
|
import { DropdownArrow } from '../../../../icons/DropdownArrow';
|
4
|
+
import { Close } from '../../../../icons/Close';
|
4
5
|
import { block } from '../../../../utils/cn';
|
5
6
|
import './CustomSwitcher.css';
|
6
7
|
const b = block('feed-custom-switcher');
|
7
8
|
const ICON_SIZE = 12;
|
8
|
-
|
9
|
+
const CLEAR_ICON_SIZE = 11;
|
10
|
+
export const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRef, onKeyDown, open, renderClear, }) => {
|
9
11
|
const itemsNames = useMemo(() => {
|
10
12
|
const items = list
|
11
13
|
.filter((item) => initial.includes(item.value))
|
@@ -15,6 +17,10 @@ export const CustomSwitcher = ({ initial, defaultLabel, list, onClick, controlRe
|
|
15
17
|
const hasCounter = itemsNames.length > 1;
|
16
18
|
return (React.createElement("button", { className: b('custom-switcher'), onClick: onClick, ref: controlRef, onKeyDown: onKeyDown, "aria-expanded": open },
|
17
19
|
React.createElement("div", { className: b('custom-switcher-element', { content: true }) }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
|
20
|
+
renderClear &&
|
21
|
+
renderClear({
|
22
|
+
renderIcon: () => (React.createElement(Icon, { data: Close, size: CLEAR_ICON_SIZE, className: b('clear') })),
|
23
|
+
}),
|
18
24
|
hasCounter && (React.createElement("div", { className: b('custom-switcher-element', { counter: true }) }, itemsNames.length)),
|
19
25
|
React.createElement("div", { className: b('custom-switcher-element', { arrow: true }) },
|
20
26
|
React.createElement(Icon, { data: DropdownArrow, size: ICON_SIZE, className: b('switcher-arrow') }))));
|
@@ -18,14 +18,13 @@ unpredictable css rules order in build */
|
|
18
18
|
}
|
19
19
|
}
|
20
20
|
.bc-post-card__header_fullWidth {
|
21
|
-
|
22
|
-
min-height: 480px;
|
21
|
+
min-height: auto;
|
23
22
|
height: 100%;
|
24
23
|
}
|
25
|
-
@media (
|
24
|
+
@media (min-width: 1081px) {
|
26
25
|
.bc-post-card__header_fullWidth {
|
27
|
-
width:
|
28
|
-
min-height:
|
26
|
+
width: 66%;
|
27
|
+
min-height: 480px;
|
29
28
|
}
|
30
29
|
}
|
31
30
|
.bc-post-card__title {
|
@@ -27,7 +27,7 @@ export type LayoutProps = {
|
|
27
27
|
mobileOrder?: string;
|
28
28
|
children: ReactElement[];
|
29
29
|
} & PaddingsYFMProps;
|
30
|
-
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'
|
30
|
+
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'>> & {
|
31
31
|
text?: string;
|
32
32
|
};
|
33
33
|
export type MetaProps = QAProps & {
|
@@ -458,20 +458,10 @@ export declare const schemasForCustom: {
|
|
458
458
|
type: string;
|
459
459
|
};
|
460
460
|
height: {
|
461
|
-
oneOf: ({
|
462
|
-
type: string;
|
463
|
-
enum?: undefined;
|
464
|
-
} | {
|
465
|
-
type: string;
|
466
|
-
enum: string[];
|
467
|
-
})[];
|
468
|
-
};
|
469
|
-
width: {
|
470
461
|
type: string;
|
471
462
|
};
|
472
|
-
|
463
|
+
width: {
|
473
464
|
type: string;
|
474
|
-
enum: string[];
|
475
465
|
};
|
476
466
|
};
|
477
467
|
};
|
@@ -1598,20 +1588,10 @@ export declare const schemasForCustom: {
|
|
1598
1588
|
type: string;
|
1599
1589
|
};
|
1600
1590
|
height: {
|
1601
|
-
oneOf: ({
|
1602
|
-
type: string;
|
1603
|
-
enum?: undefined;
|
1604
|
-
} | {
|
1605
|
-
type: string;
|
1606
|
-
enum: string[];
|
1607
|
-
})[];
|
1608
|
-
};
|
1609
|
-
width: {
|
1610
1591
|
type: string;
|
1611
1592
|
};
|
1612
|
-
|
1593
|
+
width: {
|
1613
1594
|
type: string;
|
1614
|
-
enum: string[];
|
1615
1595
|
};
|
1616
1596
|
};
|
1617
1597
|
};
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@gravity-ui/blog-constructor",
|
3
|
-
"version": "5.
|
3
|
+
"version": "5.15.0",
|
4
4
|
"description": "Gravity UI Blog Constructor",
|
5
5
|
"license": "MIT",
|
6
6
|
"repository": {
|
@@ -71,7 +71,7 @@
|
|
71
71
|
},
|
72
72
|
"peerDependencies": {
|
73
73
|
"@doc-tools/transform": "^3.3.2",
|
74
|
-
"@gravity-ui/page-constructor": "^4.
|
74
|
+
"@gravity-ui/page-constructor": "^4.45.0",
|
75
75
|
"@gravity-ui/uikit": "^5.12.0",
|
76
76
|
"react": "^16.0.0 || ^17.0.0 || ^18.0.0"
|
77
77
|
},
|
@@ -82,11 +82,11 @@
|
|
82
82
|
"@commitlint/config-conventional": "^17.4.3",
|
83
83
|
"@doc-tools/transform": "^3.11.0",
|
84
84
|
"@gravity-ui/eslint-config": "^3.1.1",
|
85
|
-
"@gravity-ui/page-constructor": "^4.
|
85
|
+
"@gravity-ui/page-constructor": "^4.46.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": "^5.
|
89
|
+
"@gravity-ui/uikit": "^5.25.0",
|
90
90
|
"@jest/environment": "^29.7.0",
|
91
91
|
"@storybook/addon-essentials": "^7.0.27",
|
92
92
|
"@storybook/cli": "^7.0.27",
|
@@ -144,8 +144,5 @@
|
|
144
144
|
"*.{json,yaml,yml,md}": [
|
145
145
|
"prettier --write"
|
146
146
|
]
|
147
|
-
},
|
148
|
-
"publishConfig": {
|
149
|
-
"tag": "beta"
|
150
147
|
}
|
151
148
|
}
|
@@ -27,7 +27,7 @@ export type LayoutProps = {
|
|
27
27
|
mobileOrder?: string;
|
28
28
|
children: ReactElement[];
|
29
29
|
} & PaddingsYFMProps;
|
30
|
-
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'
|
30
|
+
export type MediaProps = ClassNameProps & PaddingsYFMProps & Partial<Pick<PCMediaProps, 'youtube' | 'previewImg' | 'image' | 'video' | 'dataLens'>> & {
|
31
31
|
text?: string;
|
32
32
|
};
|
33
33
|
export type MetaProps = QAProps & {
|