@gravity-ui/blog-constructor 1.0.0-aplha.0

package/build/cjs/blocks/Feed/Feed.js

@@ -0,0 +1,183 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Feed = void 0;
+const react_1 = __importStar(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const FeedContext_1 = require("../../contexts/FeedContext");
+const RouterContext_1 = require("../../contexts/RouterContext");
+const LocaleContext_1 = require("../../contexts/LocaleContext");
+const constants_1 = require("../constants");
+const constants_2 = require("../../constants");
+const common_1 = require("../../utils/common");
+const FeedHeader_1 = require("../../components/FeedHeader/FeedHeader");
+const PostsError_1 = require("../../components/PostsError/PostsError");
+const Posts_1 = require("../../components/Posts/Posts");
+const metrika_js_1 = __importDefault(require("../../counters/metrika.js"));
+const utils_1 = require("../../counters/utils");
+const reducer_1 = require("./reducer");
+const CONTAINER_ID = 'blog-cards';
+const PAGE_QUERY = 'page';
+const FIRST_PAGE = 1;
+const Feed = ({ image }) => {
+    var _a;
+    const { posts, totalCount, tags, services, pinnedPost, getPosts, pageCountForShowSupportButtons, } = (0, react_1.useContext)(FeedContext_1.FeedContext);
+    const router = (0, react_1.useContext)(RouterContext_1.RouterContext);
+    const { locale } = (0, react_1.useContext)(LocaleContext_1.LocaleContext);
+    const [{ errorLoad, errorShowMore, isFetching, isShowMoreFetching, isShowMoreVisible, lastLoadedCount, postCountOnPage, postsOnPage, pinnedPostOnPage, currentPage, queryParams, }, dispatch,] = (0, react_1.useReducer)(reducer_1.reducer, {
+        errorLoad: false,
+        errorShowMore: false,
+        isFetching: false,
+        isShowMoreFetching: false,
+        isShowMoreVisible: true,
+        lastLoadedCount: (posts === null || posts === void 0 ? void 0 : posts.length) || 0,
+        postCountOnPage: totalCount || 0,
+        postsOnPage: posts,
+        pinnedPostOnPage: pinnedPost,
+        currentPage: ((_a = router === null || router === void 0 ? void 0 : router.query) === null || _a === void 0 ? void 0 : _a.page) ? Number(router.query.page) : constants_1.DEFAULT_PAGE,
+        queryParams: router.query || {},
+    });
+    const perPageInQuery = (queryParams === null || queryParams === void 0 ? void 0 : queryParams.perPage)
+        ? Number(queryParams.perPage)
+        : constants_1.DEFAULT_ROWS_PER_PAGE;
+    const pageChange = (value) => {
+        dispatch({ type: reducer_1.ActionTypes.PageChange, payload: value });
+    };
+    const handleChangeQueryParams = (value) => {
+        dispatch({ type: reducer_1.ActionTypes.QueryParamsChange, payload: value });
+    };
+    const handlePageChange = async (value) => {
+        pageChange(value);
+        handleChangeQueryParams({ page: value });
+    };
+    const fetchData = (0, react_1.useCallback)(async (pageNumber) => {
+        if (queryParams && getPosts) {
+            const query = (0, common_1.getFeedQueryParams)(queryParams, pageNumber);
+            const data = await getPosts(query);
+            return data;
+        }
+        else {
+            throw new Error('cant get request');
+        }
+    }, [getPosts, queryParams]);
+    const setIsFetching = (value) => {
+        dispatch({ type: reducer_1.ActionTypes.SetIsFetching, payload: value });
+    };
+    const fetchAndReplaceData = (0, react_1.useCallback)(async (pageNumber) => {
+        try {
+            dispatch({ type: reducer_1.ActionTypes.SetErrorLoad, payload: false });
+            const fetchedData = await fetchData(pageNumber);
+            if (fetchedData) {
+                dispatch({
+                    type: reducer_1.ActionTypes.SetPosts,
+                    payload: {
+                        posts: fetchedData.posts,
+                        pinnedPost: fetchedData.pinnedPost,
+                        count: fetchedData.count,
+                        page: pageNumber,
+                    },
+                });
+            }
+        }
+        catch (err) {
+            dispatch({ type: reducer_1.ActionTypes.SetErrorLoad, payload: true });
+        }
+        (0, common_1.scrollOnPageChange)(CONTAINER_ID);
+        setIsFetching(false);
+    }, [fetchData]);
+    const handleShowMore = async () => {
+        dispatch({ type: reducer_1.ActionTypes.SetIsShowMoreFetching, payload: true });
+        metrika_js_1.default.reachGoal(utils_1.MetrikaCounter.CrossSite, constants_2.BlogMetrikaGoalIds.showMore);
+        try {
+            const fetchedData = await fetchData(currentPage + 1);
+            handleChangeQueryParams({
+                page: currentPage + 1,
+            });
+            if (fetchedData) {
+                dispatch({
+                    type: reducer_1.ActionTypes.SetShowMore,
+                    payload: {
+                        posts: (postsOnPage !== null && postsOnPage !== void 0 ? postsOnPage : []).concat(fetchedData.posts),
+                        count: fetchedData.count,
+                        currentPage: currentPage + 1,
+                        lastLoadedCount: fetchedData.posts.length,
+                    },
+                });
+            }
+        }
+        catch (err) {
+            dispatch({ type: reducer_1.ActionTypes.SetErrorShowMore, payload: true });
+        }
+        dispatch({ type: reducer_1.ActionTypes.SetIsShowMoreFetching, payload: false });
+    };
+    (0, react_1.useEffect)(() => {
+        if (isFetching) {
+            fetchAndReplaceData(Number(queryParams.page || constants_1.DEFAULT_PAGE));
+        }
+    }, [fetchAndReplaceData, isFetching, queryParams.page]);
+    (0, react_1.useEffect)(() => {
+        const loadedPostsCount = currentPage * perPageInQuery;
+        dispatch({
+            type: reducer_1.ActionTypes.SetIsShowMoreVisible,
+            payload: loadedPostsCount < postCountOnPage,
+        });
+    }, [currentPage, lastLoadedCount, perPageInQuery, postCountOnPage]);
+    const serviceItems = (0, react_1.useMemo)(() => services === null || services === void 0 ? void 0 : services.map((service) => ({
+        content: service.name,
+        value: `${service.id}`,
+    })), [services]);
+    const tagItems = (0, react_1.useMemo)(() => tags === null || tags === void 0 ? void 0 : tags.map((tag) => ({
+        content: tag.name,
+        value: tag.slug,
+        icon: tag.icon && react_1.default.createElement(uikit_1.Icon, { data: tag.icon }),
+    })), [tags]);
+    (0, react_1.useEffect)(() => {
+        const queryString = Object.keys(queryParams)
+            .reduce((acc, curr) => {
+            if (curr === PAGE_QUERY && queryParams[curr] === FIRST_PAGE) {
+                return acc;
+            }
+            if (queryParams[curr]) {
+                acc.push(`${curr}=${queryParams[curr]}`);
+            }
+            return acc;
+        }, [])
+            .join('&');
+        const pathPrefix = (locale === null || locale === void 0 ? void 0 : locale.pathPrefix) ? `/${locale === null || locale === void 0 ? void 0 : locale.pathPrefix}/` : '/';
+        const newUrl = `${pathPrefix}blog${queryString ? `?${queryString}` : ''}`;
+        window.history.replaceState(Object.assign(Object.assign({}, window.history.state), { as: newUrl, url: newUrl }), '', newUrl);
+    }, [locale === null || locale === void 0 ? void 0 : locale.pathPrefix, queryParams]);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(FeedHeader_1.FeedHeader, { verticalOffset: "s", tags: tagItems, services: serviceItems, setIsFetching: setIsFetching, handleChangeQuery: handleChangeQueryParams, queryParams: queryParams, background: {
+                fullWidth: true,
+                url: image,
+                disableCompress: true,
+            } }),
+        errorLoad ? (react_1.default.createElement(PostsError_1.PostsError, { onButtonClick: () => fetchAndReplaceData(Number(queryParams.page || constants_1.DEFAULT_PAGE)) })) : (react_1.default.createElement(Posts_1.Posts, { containerId: CONTAINER_ID, currentPage: currentPage, isShowMoreVisible: isShowMoreVisible, errorShowMore: errorShowMore, postCountOnPage: postCountOnPage, perPageInQuery: perPageInQuery, handleShowMore: handleShowMore, handlePageChange: handlePageChange, postsOnPage: postsOnPage, pinnedPostOnPage: pinnedPostOnPage, isFetching: isFetching, isShowMoreFetching: isShowMoreFetching, pageCountForShowSupportButtons: pageCountForShowSupportButtons }))));
+};
+exports.Feed = Feed;

package/build/cjs/blocks/Feed/reducer.d.ts

@@ -0,0 +1,65 @@
+import { Query, PostData } from '../../models/common';
+export declare enum ActionTypes {
+    SetErrorLoad = "setErrorLoad",
+    SetErrorShowMore = "setErrorShowMore",
+    SetIsShowMoreVisible = "setIsShowMoreVisible",
+    SetPosts = "setPosts",
+    SetShowMore = "setShowMore",
+    SetIsFetching = "setIsFetching",
+    SetIsShowMoreFetching = "setIsShowMoreFetching",
+    PageChange = "pageChange",
+    QueryParamsChange = "queryParamsChange"
+}
+export type State = {
+    currentPage: number;
+    errorLoad: boolean;
+    errorShowMore: boolean;
+    isFetching: boolean;
+    isShowMoreFetching: boolean;
+    isShowMoreVisible: boolean;
+    lastLoadedCount: number;
+    pinnedPostOnPage?: PostData;
+    postCountOnPage: number;
+    postsOnPage?: PostData[];
+    queryParams: Query;
+};
+type Action = {
+    type: ActionTypes.PageChange;
+    payload: number;
+} | {
+    type: ActionTypes.SetIsFetching;
+    payload: boolean;
+} | {
+    type: ActionTypes.SetIsShowMoreFetching;
+    payload: boolean;
+} | {
+    type: ActionTypes.SetPosts;
+    payload: {
+        posts: PostData[];
+        pinnedPost?: PostData;
+        count: number;
+        page: number;
+    };
+} | {
+    type: ActionTypes.SetShowMore;
+    payload: {
+        posts: PostData[];
+        count: number;
+        currentPage: number;
+        lastLoadedCount: number;
+    };
+} | {
+    type: ActionTypes.SetErrorLoad;
+    payload: boolean;
+} | {
+    type: ActionTypes.SetErrorShowMore;
+    payload: boolean;
+} | {
+    type: ActionTypes.SetIsShowMoreVisible;
+    payload: boolean;
+} | {
+    type: ActionTypes.QueryParamsChange;
+    payload: Query;
+};
+export declare const reducer: (state: State, { type, payload }: Action) => State;
+export {};

package/build/cjs/blocks/Feed/reducer.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reducer = exports.ActionTypes = void 0;
+var ActionTypes;
+(function (ActionTypes) {
+    ActionTypes["SetErrorLoad"] = "setErrorLoad";
+    ActionTypes["SetErrorShowMore"] = "setErrorShowMore";
+    ActionTypes["SetIsShowMoreVisible"] = "setIsShowMoreVisible";
+    ActionTypes["SetPosts"] = "setPosts";
+    ActionTypes["SetShowMore"] = "setShowMore";
+    ActionTypes["SetIsFetching"] = "setIsFetching";
+    ActionTypes["SetIsShowMoreFetching"] = "setIsShowMoreFetching";
+    ActionTypes["PageChange"] = "pageChange";
+    ActionTypes["QueryParamsChange"] = "queryParamsChange";
+})(ActionTypes = exports.ActionTypes || (exports.ActionTypes = {}));
+const reducer = (state, { type, payload }) => {
+    switch (type) {
+        case ActionTypes.SetIsShowMoreVisible:
+            return Object.assign(Object.assign({}, state), { isShowMoreVisible: payload });
+        case ActionTypes.SetPosts:
+            return Object.assign(Object.assign({}, state), { lastLoadedCount: payload.count, postCountOnPage: payload.count, pinnedPostOnPage: payload.pinnedPost, postsOnPage: payload.posts, currentPage: payload.page });
+        case ActionTypes.SetShowMore:
+            return Object.assign(Object.assign({}, state), { lastLoadedCount: payload.lastLoadedCount, postCountOnPage: payload.count, currentPage: payload.currentPage, postsOnPage: payload.posts, errorShowMore: false, isShowMoreFetching: true });
+        case ActionTypes.SetIsFetching:
+            return Object.assign(Object.assign({}, state), { isFetching: payload });
+        case ActionTypes.SetIsShowMoreFetching:
+            return Object.assign(Object.assign({}, state), { isShowMoreFetching: payload });
+        case ActionTypes.PageChange:
+            return Object.assign(Object.assign({}, state), { currentPage: payload, isFetching: true });
+        case ActionTypes.SetErrorLoad:
+            return Object.assign(Object.assign({}, state), { errorLoad: payload });
+        case ActionTypes.SetErrorShowMore:
+            return Object.assign(Object.assign({}, state), { errorShowMore: payload });
+        case ActionTypes.QueryParamsChange:
+            return Object.assign(Object.assign({}, state), { queryParams: Object.assign(Object.assign({}, state.queryParams), payload) });
+        default:
+            return state;
+    }
+};
+exports.reducer = reducer;

package/build/cjs/blocks/Header/Header.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { HeaderProps } from '../../models/blocks';
+export declare const Header: React.FC<HeaderProps>;

package/build/cjs/blocks/Header/Header.js

@@ -0,0 +1,63 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = void 0;
+const react_1 = __importStar(require("react"));
+const page_constructor_1 = require("@gravity-ui/page-constructor");
+const PostPageContext_1 = require("../../contexts/PostPageContext");
+const LocaleContext_1 = require("../../contexts/LocaleContext");
+const PostInfo_1 = require("../../components/PostInfo/PostInfo");
+const Wrapper_1 = require("../../components/Wrapper/Wrapper");
+const paddings_1 = require("../../models/paddings");
+const common_1 = require("../../utils/common");
+const constants_1 = require("../../constants");
+const metrikaGoals = {
+    sharing: constants_1.BlogMetrikaGoalIds.shareTop,
+    save: constants_1.BlogMetrikaGoalIds.saveTop,
+};
+const breadcrumbsGoals = [
+    {
+        name: constants_1.BlogMetrikaGoalIds.breadcrumbsTop,
+        isCrossSite: true,
+    },
+];
+const Header = (props) => {
+    const { theme, paddingTop, paddingBottom } = props;
+    const { post } = (0, react_1.useContext)(PostPageContext_1.PostPageContext);
+    const { locale } = (0, react_1.useContext)(LocaleContext_1.LocaleContext);
+    const { description, title, id, date, readingTime, tags } = post;
+    const breadcrumbs = (0, common_1.getBreadcrumbs)({ tags, pathPrefix: (locale === null || locale === void 0 ? void 0 : locale.pathPrefix) || '' });
+    if (theme === 'dark' && breadcrumbs) {
+        breadcrumbs.theme = 'dark';
+    }
+    breadcrumbs.metrikaGoals = breadcrumbsGoals;
+    return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
+            [paddings_1.PaddingsDirections.top]: paddingTop,
+            [paddings_1.PaddingsDirections.bottom]: paddingBottom,
+        } },
+        react_1.default.createElement(page_constructor_1.HeaderBlock, Object.assign({}, props, { title: title, description: description, breadcrumbs: breadcrumbs }),
+            react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, theme: theme, dataQa: "blog-header-meta-container" }))));
+};
+exports.Header = Header;

package/build/cjs/blocks/Layout/Layout.css

@@ -0,0 +1,22 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.bc-layout {
+  margin: 0;
+  padding: 0;
+}
+.bc-layout__left-col.bc-layout__left-col {
+  padding: 0;
+}
+
+.bc-layout__right-col.bc-layout__right-col {
+  padding: 0;
+}
+
+.bc-layout__row {
+  padding: 0;
+  margin: 0;
+}
+.bc-layout__item {
+  margin: 0;
+  padding: 0 8px;
+}

package/build/cjs/blocks/Layout/Layout.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { LayoutProps } from '../../models/blocks';
+export declare const Layout: React.FC<LayoutProps>;

package/build/cjs/blocks/Layout/Layout.js

@@ -0,0 +1,78 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Layout = void 0;
+const react_1 = __importStar(require("react"));
+const page_constructor_1 = require("@gravity-ui/page-constructor");
+const Wrapper_1 = require("../../components/Wrapper/Wrapper");
+const paddings_1 = require("../../models/paddings");
+const cn_1 = require("../../utils/cn");
+const b = (0, cn_1.block)('layout');
+const Layout = ({ fullWidth, mobileOrder, children, paddingTop = 'xs', paddingBottom = 'xs', }) => {
+    const layout = (0, react_1.useMemo)(() => {
+        const layoutConfig = {
+            leftCol: {
+                sizes: { all: 12, lg: 8 },
+                orders: { all: 1, lg: 1 },
+            },
+            rightCol: {
+                sizes: { all: 12, lg: 3 },
+                offsets: {
+                    all: 0,
+                    lg: 1,
+                },
+                orders: { all: 2, lg: 2 },
+            },
+        };
+        if (fullWidth) {
+            layoutConfig.leftCol.sizes = { all: 12 };
+            layoutConfig.rightCol.sizes = { all: 12 };
+            layoutConfig.rightCol.offsets = { all: 0 };
+        }
+        if (mobileOrder === 'reverse') {
+            layoutConfig.leftCol.orders = { all: 3, lg: 1 };
+        }
+        return layoutConfig;
+    }, [fullWidth, mobileOrder]);
+    const renderChildren = (blockChildren) => react_1.default.Children.map(blockChildren, (child, i) => (react_1.default.createElement("div", { key: i, className: b('item') }, child)));
+    const { left, right } = (0, react_1.useMemo)(() => children === null || children === void 0 ? void 0 : children.reduce((sortedChildren, child) => {
+        var _a, _b;
+        if (((_b = (_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.column) === 'left') {
+            sortedChildren.left.push(child);
+        }
+        else {
+            sortedChildren.right.push(child);
+        }
+        return sortedChildren;
+    }, { left: [], right: [] }), [children]);
+    return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
+            [paddings_1.PaddingsDirections.top]: paddingTop,
+            [paddings_1.PaddingsDirections.bottom]: paddingBottom,
+        } },
+        react_1.default.createElement(page_constructor_1.Row, { className: b('row'), noGutter: true },
+            react_1.default.createElement(page_constructor_1.Col, Object.assign({ className: b('left-col') }, layout.leftCol), left && renderChildren(left)),
+            react_1.default.createElement(page_constructor_1.Col, Object.assign({ className: b('right-col') }, layout.rightCol), right && renderChildren(right)))));
+};
+exports.Layout = Layout;

package/build/cjs/blocks/Media/Media.css

@@ -0,0 +1,41 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.bc-media__text-content {
+  padding-top: 16px;
+}
+.bc-media__container {
+  position: relative;
+  height: 100%;
+}
+.bc-media__border {
+  position: relative;
+  height: 100%;
+  width: 100%;
+  border-radius: calc(var(--bc-border-radius) + 1px);
+  border: 1px solid var(--yc-color-line-generic);
+  overflow: hidden;
+}
+.bc-media__content {
+  position: relative;
+  top: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  object-fit: cover;
+  border-radius: var(--bc-border-radius);
+}
+.bc-media__video {
+  height: 100%;
+}
+.bc-media__video > video {
+  width: 100%;
+  height: auto;
+  border-radius: var(--bc-border-radius);
+}
+.bc-media__image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  border-radius: var(--bc-border-radius);
+}

package/build/cjs/blocks/Media/Media.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { MediaProps } from '../../models/blocks';
+export declare const Media: React.FC<MediaProps>;

package/build/cjs/blocks/Media/Media.js

@@ -0,0 +1,38 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Media = void 0;
+const react_1 = __importDefault(require("react"));
+const page_constructor_1 = require("@gravity-ui/page-constructor");
+const Wrapper_1 = require("../../components/Wrapper/Wrapper");
+const paddings_1 = require("../../models/paddings");
+const cn_1 = require("../../utils/cn");
+const b = (0, cn_1.block)('media');
+const Media = (_a) => {
+    var { text, paddingTop, paddingBottom } = _a, mediaProps = __rest(_a, ["text", "paddingTop", "paddingBottom"]);
+    return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
+            [paddings_1.PaddingsDirections.top]: paddingTop,
+            [paddings_1.PaddingsDirections.bottom]: paddingBottom,
+        }, className: b('container') },
+        react_1.default.createElement("div", { className: b('border'), "data-qa": "blog-media-content" },
+            react_1.default.createElement(page_constructor_1.Media, Object.assign({ className: b('content'), videoClassName: b('video'), imageClassName: b('image') }, mediaProps))),
+        text && (react_1.default.createElement("div", { className: b('text-content') },
+            react_1.default.createElement(page_constructor_1.YFMWrapper, { content: text, modifiers: {
+                    blogMedia: true,
+                    resetPaddings: true,
+                } })))));
+};
+exports.Media = Media;

package/build/cjs/blocks/Meta/Meta.css

@@ -0,0 +1,7 @@
+.bc-meta {
+  padding: 0;
+  margin: 0;
+}
+.bc-meta__breadcrumbs {
+  display: inline-block;
+}

package/build/cjs/blocks/Meta/Meta.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { MetaProps } from '../../models/blocks';
+export declare const Meta: React.FC<MetaProps>;

package/build/cjs/blocks/Meta/Meta.js

@@ -0,0 +1,66 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Meta = void 0;
+const react_1 = __importStar(require("react"));
+const page_constructor_1 = require("@gravity-ui/page-constructor");
+const PostPageContext_1 = require("../../contexts/PostPageContext");
+const LocaleContext_1 = require("../../contexts/LocaleContext");
+const Wrapper_1 = require("../../components/Wrapper/Wrapper");
+const PostInfo_1 = require("../../components/PostInfo/PostInfo");
+const paddings_1 = require("../../models/paddings");
+const common_1 = require("../../utils/common");
+const constants_1 = require("../../constants");
+const cn_1 = require("../../utils/cn");
+const b = (0, cn_1.block)('meta');
+const metrikaGoals = {
+    sharing: constants_1.BlogMetrikaGoalIds.shareBottom,
+    save: constants_1.BlogMetrikaGoalIds.saveBottom,
+};
+const breadcrumbsGoals = [
+    {
+        name: constants_1.BlogMetrikaGoalIds.breadcrumbsBottom,
+        isCrossSite: true,
+    },
+];
+const Meta = (props) => {
+    const { paddingTop = 'l', paddingBottom = 'l', theme = 'light' } = props;
+    const { post } = (0, react_1.useContext)(PostPageContext_1.PostPageContext);
+    const { locale } = (0, react_1.useContext)(LocaleContext_1.LocaleContext);
+    const { title, id, date, readingTime, tags } = post;
+    const breadcrumbs = (0, common_1.getBreadcrumbs)({ tags, pathPrefix: (locale === null || locale === void 0 ? void 0 : locale.pathPrefix) || '' });
+    breadcrumbs.metrikaGoals = breadcrumbsGoals;
+    return (react_1.default.createElement(Wrapper_1.Wrapper, { paddings: {
+            [paddings_1.PaddingsDirections.top]: paddingTop,
+            [paddings_1.PaddingsDirections.bottom]: paddingBottom,
+        }, dataQa: "blog-meta-content" },
+        breadcrumbs && (react_1.default.createElement(page_constructor_1.HeaderBreadcrumbs, { items: breadcrumbs.items, className: b('breadcrumbs'), theme: theme, metrikaGoals: breadcrumbs.metrikaGoals })),
+        title && (react_1.default.createElement(page_constructor_1.YFMWrapper, { content: title, modifiers: {
+                blogBreadcrumbs: true,
+                resetPaddings: true,
+            } })),
+        post && (react_1.default.createElement(PostInfo_1.PostInfo, { postId: id, date: date, readingTime: readingTime, metrikaGoals: metrikaGoals, dataQa: "blog-meta-block" }))));
+};
+exports.Meta = Meta;

package/build/cjs/blocks/Suggest/Suggest.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { SuggestProps } from '../../models/blocks';
+/**
+ * Suggested posts block
+ *
+ * @param posts - suggested posts list
+ * @param paddingTop - padding top code
+ * @param paddingBottom - padding bottom code
+ *
+ * @returns -jsx
+ */
+export declare const Suggest: React.FC<SuggestProps>;