@gravity-ui/blog-constructor 5.7.3 → 5.8.0

package/build/cjs/components/PostCard/PostCard.js

@@ -4,10 +4,12 @@ exports.PostCard = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const page_constructor_1 = require("@gravity-ui/page-constructor");
+const uikit_1 = require("@gravity-ui/uikit");
 const LikesContext_1 = require("../../contexts/LikesContext");
 const common_1 = require("../../models/common");
 const cn_1 = require("../../utils/cn");
 const SuggestPostInfo_1 = require("../PostInfo/SuggestPostInfo");
+const useAriaAttributes_1 = require("../../hooks/useAriaAttributes");
 const b = (0, cn_1.block)('post-card');
 const PostCard = ({ post, metrikaGoals, fullWidth = false, size = common_1.PostCardSize.SMALL, showTag = false, titleHeadingLevel = common_1.PostCardTitleHeadingLevel.H3, }) => {
     var _a;
@@ -21,19 +23,33 @@ const PostCard = ({ post, metrikaGoals, fullWidth = false, size = common_1.PostC
             toggleLike,
         }
         : undefined, [hasUserLike, likes, toggleLike, hasLikes]);
-    return (react_1.default.createElement(page_constructor_1.CardBase, { url: url, metrikaGoals: metrikaGoals, className: b('card', { fullWidth }) },
+    const titleId = (0, uikit_1.useUniqId)();
+    const descriptionId = (0, uikit_1.useUniqId)();
+    const dateId = (0, uikit_1.useUniqId)();
+    const tagId = (0, uikit_1.useUniqId)();
+    const readingTimeId = (0, uikit_1.useUniqId)();
+    const isTagVisible = showTag && ((_a = tags === null || tags === void 0 ? void 0 : tags[0]) === null || _a === void 0 ? void 0 : _a.name);
+    const ariaAttributes = (0, useAriaAttributes_1.useAriaAttributes)({
+        labelIds: [isTagVisible && tagId, title && titleId],
+        descriptionIds: [
+            description && descriptionId,
+            date && dateId,
+            readingTime && readingTimeId,
+        ],
+    });
+    return (react_1.default.createElement(page_constructor_1.CardBase, { url: url, metrikaGoals: metrikaGoals, className: b('card', { fullWidth }), extraProps: ariaAttributes },
         react_1.default.createElement(page_constructor_1.CardBase.Header, { image: image, className: b('header', { fullWidth }) },
             react_1.default.createElement("div", { className: b('image-container'), "data-qa": "blog-suggest-header" })),
         react_1.default.createElement(page_constructor_1.CardBase.Content, null,
-            showTag && ((_a = tags === null || tags === void 0 ? void 0 : tags[0]) === null || _a === void 0 ? void 0 : _a.name) && (react_1.default.createElement("div", { className: b('tag', { size }) }, tags[0].name)),
+            isTagVisible && (react_1.default.createElement("div", { id: tagId, className: b('tag', { size }) }, tags[0].name)),
             title &&
                 react_1.default.createElement(titleHeadingLevel, { className: b('title', { size }) }, react_1.default.createElement("span", null,
-                    react_1.default.createElement(page_constructor_1.HTML, null, title))),
+                    react_1.default.createElement(page_constructor_1.HTML, { id: titleId }, title))),
             description && (react_1.default.createElement(page_constructor_1.YFMWrapper, { className: b('description'), content: description, modifiers: {
                     blog: size === 'm',
                     blogCard: true,
-                } }))),
+                }, id: descriptionId }))),
         react_1.default.createElement(page_constructor_1.CardBase.Footer, null,
-            react_1.default.createElement(SuggestPostInfo_1.SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block" }))));
+            react_1.default.createElement(SuggestPostInfo_1.SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block", dateId: dateId, readingTimeId: readingTimeId }))));
 };
 exports.PostCard = PostCard;

package/build/cjs/components/PostInfo/SuggestPostInfo.d.ts

@@ -8,6 +8,8 @@ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTi
         hasUserLike?: boolean;
         toggleLike?: ToggleLikeCallbackType;
     };
+    dateId?: string;
+    readingTimeId?: string;
 }
 /**
  * Suggest blog card info component
@@ -20,7 +22,9 @@ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTi
  * @param qa - test-attr
  * @param size - text size
  * @param isModernIcon - flag what we need render 'bookmark' icon
+ * @param dateId - id value for element with post date. Useful when providing accessible description
+ * @param readingTimeId - id value for element with reading time. Useful when providing accessible description
  *
  * @returns jsx
  */
-export declare const SuggestPostInfo: ({ postId, date, readingTime, likes, size, qa, }: SuggestPostInfoProps) => React.JSX.Element;
+export declare const SuggestPostInfo: ({ postId, date, readingTime, likes, size, qa, dateId, readingTimeId, }: SuggestPostInfoProps) => React.JSX.Element;

package/build/cjs/components/PostInfo/SuggestPostInfo.js

@@ -21,10 +21,12 @@ const b = (0, cn_1.block)('post-info');
  * @param qa - test-attr
  * @param size - text size
  * @param isModernIcon - flag what we need render 'bookmark' icon
+ * @param dateId - id value for element with post date. Useful when providing accessible description
+ * @param readingTimeId - id value for element with reading time. Useful when providing accessible description
  *
  * @returns jsx
  */
-const SuggestPostInfo = ({ postId, date, readingTime, likes, size = common_1.PostCardSize.SMALL, qa, }) => {
+const SuggestPostInfo = ({ postId, date, readingTime, likes, size = common_1.PostCardSize.SMALL, qa, dateId, readingTimeId, }) => {
     const { hasUserLike, likesCount, handleLike } = (0, useLikes_1.useLikes)({
         hasLike: likes === null || likes === void 0 ? void 0 : likes.hasUserLike,
         count: likes === null || likes === void 0 ? void 0 : likes.likesCount,
@@ -33,8 +35,8 @@ const SuggestPostInfo = ({ postId, date, readingTime, likes, size = common_1.Pos
     });
     return (react_1.default.createElement("div", { className: b('container') },
         react_1.default.createElement("div", { className: b('suggest-container') },
-            date && react_1.default.createElement(Date_1.Date, { date: date, size: size }),
-            readingTime && react_1.default.createElement(ReadingTime_1.ReadingTime, { readingTime: readingTime, size: size })),
+            date && react_1.default.createElement(Date_1.Date, { date: date, size: size, id: dateId }),
+            readingTime && (react_1.default.createElement(ReadingTime_1.ReadingTime, { readingTime: readingTime, size: size, id: readingTimeId }))),
         likes && postId && (react_1.default.createElement(Save_1.Save, { postId: postId, title: likesCount, hasUserLike: hasUserLike, handleUserLike: handleLike, size: size, qa: qa }))));
 };
 exports.SuggestPostInfo = SuggestPostInfo;

package/build/cjs/components/PostInfo/components/Date.d.ts

@@ -3,6 +3,7 @@ import { PostCardSize } from '../../../models/common';
 type DateProps = {
     date: string | number;
     size?: PostCardSize;
+    id?: string;
 };
-export declare const Date: ({ date, size }: DateProps) => React.JSX.Element;
+export declare const Date: ({ date, size, id }: DateProps) => React.JSX.Element;
 export {};

package/build/cjs/components/PostInfo/components/Date.js

@@ -8,8 +8,8 @@ const common_1 = require("../../../models/common");
 const cn_1 = require("../../../utils/cn");
 const date_1 = require("../../../utils/date");
 const b = (0, cn_1.block)('post-info');
-const Date = ({ date, size = common_1.PostCardSize.SMALL }) => {
+const Date = ({ date, size = common_1.PostCardSize.SMALL, id }) => {
     const { locale } = (0, react_1.useContext)(LocaleContext_1.LocaleContext);
-    return react_1.default.createElement("div", { className: b('item', { size }) }, (0, date_1.format)(date, 'longDate', locale === null || locale === void 0 ? void 0 : locale.code));
+    return (react_1.default.createElement("div", { className: b('item', { size }), id: id }, (0, date_1.format)(date, 'longDate', locale === null || locale === void 0 ? void 0 : locale.code)));
 };
 exports.Date = Date;

package/build/cjs/components/PostInfo/components/ReadingTime.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 type ReadingTimeProps = {
     readingTime: number;
     size?: 's' | 'm';
+    id?: string;
 };
-export declare const ReadingTime: ({ readingTime, size }: ReadingTimeProps) => React.JSX.Element;
+export declare const ReadingTime: ({ readingTime, size, id }: ReadingTimeProps) => React.JSX.Element;
 export {};

package/build/cjs/components/PostInfo/components/ReadingTime.js

@@ -9,7 +9,7 @@ const Time_1 = require("../../../icons/Time");
 const cn_1 = require("../../../utils/cn");
 const b = (0, cn_1.block)('post-info');
 const ICON_SIZE = 16;
-const ReadingTime = ({ readingTime, size = 's' }) => (react_1.default.createElement("div", { className: b('item', { size }) },
+const ReadingTime = ({ readingTime, size = 's', id }) => (react_1.default.createElement("div", { className: b('item', { size }), id: id },
     react_1.default.createElement("span", { className: b('icon') },
         react_1.default.createElement(uikit_1.Icon, { data: Time_1.Time, size: ICON_SIZE, className: b('icon-color') })),
     (0, i18n_1.i18)(i18n_1.Keyset.ContextReadingTime, { count: readingTime })));

package/build/cjs/hooks/useAriaAttributes.d.ts

@@ -0,0 +1,17 @@
+type Labels = string | number | boolean | undefined;
+type Description = string | number | boolean | undefined;
+interface UseAriaAttributesProps {
+    labelIds?: Labels[];
+    descriptionIds: Description[];
+}
+/**
+ * Returns aria-attributes
+ * @param labelIds - labels ids. Falsy values will be ignored
+ * @param descriptionIds - descriptions ids. Falsy values will be ignored
+ * @returns aria attributes for the element to be labelled
+ */
+export declare const useAriaAttributes: ({ labelIds, descriptionIds }: UseAriaAttributesProps) => {
+    'aria-labelledby': string;
+    'aria-describedby': string;
+};
+export {};

package/build/cjs/hooks/useAriaAttributes.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAriaAttributes = void 0;
+const react_1 = require("react");
+/**
+ * Returns aria-attributes
+ * @param labelIds - labels ids. Falsy values will be ignored
+ * @param descriptionIds - descriptions ids. Falsy values will be ignored
+ * @returns aria attributes for the element to be labelled
+ */
+const useAriaAttributes = ({ labelIds = [], descriptionIds = [] }) => {
+    const labelledBy = (0, react_1.useMemo)(() => labelIds.filter(Boolean).join(' '), [labelIds]);
+    const describedBy = (0, react_1.useMemo)(() => descriptionIds.filter(Boolean).join(' '), [descriptionIds]);
+    return {
+        'aria-labelledby': labelledBy,
+        'aria-describedby': describedBy,
+    };
+};
+exports.useAriaAttributes = useAriaAttributes;

package/build/cjs/models/common.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+import { MarkdownItPluginCb } from '@doc-tools/transform/lib/plugins/typings';
 import { HeaderBlockProps as PageConstructorHeaderBlockProps } from '@gravity-ui/page-constructor';
 import { IBrowser, IDevice } from 'ua-parser-js';
 import { Locale } from '../models/locale';
@@ -176,3 +177,6 @@ export declare enum PostCardTitleHeadingLevel {
     H2 = "h2",
     H3 = "h3"
 }
+export interface TransformPostOptions {
+    plugins?: MarkdownItPluginCb[];
+}

package/build/esm/components/PostCard/PostCard.js

@@ -1,9 +1,11 @@
 import React, { useContext, useMemo } from 'react';
 import { CardBase, HTML, YFMWrapper } from '@gravity-ui/page-constructor';
+import { useUniqId } from '@gravity-ui/uikit';
 import { LikesContext } from '../../contexts/LikesContext';
 import { PostCardSize, PostCardTitleHeadingLevel } from '../../models/common';
 import { block } from '../../utils/cn';
 import { SuggestPostInfo } from '../PostInfo/SuggestPostInfo';
+import { useAriaAttributes } from '../../hooks/useAriaAttributes';
 import './PostCard.css';
 const b = block('post-card');
 export const PostCard = ({ post, metrikaGoals, fullWidth = false, size = PostCardSize.SMALL, showTag = false, titleHeadingLevel = PostCardTitleHeadingLevel.H3, }) => {
@@ -18,18 +20,32 @@ export const PostCard = ({ post, metrikaGoals, fullWidth = false, size = PostCar
             toggleLike,
         }
         : undefined, [hasUserLike, likes, toggleLike, hasLikes]);
-    return (React.createElement(CardBase, { url: url, metrikaGoals: metrikaGoals, className: b('card', { fullWidth }) },
+    const titleId = useUniqId();
+    const descriptionId = useUniqId();
+    const dateId = useUniqId();
+    const tagId = useUniqId();
+    const readingTimeId = useUniqId();
+    const isTagVisible = showTag && ((_a = tags === null || tags === void 0 ? void 0 : tags[0]) === null || _a === void 0 ? void 0 : _a.name);
+    const ariaAttributes = useAriaAttributes({
+        labelIds: [isTagVisible && tagId, title && titleId],
+        descriptionIds: [
+            description && descriptionId,
+            date && dateId,
+            readingTime && readingTimeId,
+        ],
+    });
+    return (React.createElement(CardBase, { url: url, metrikaGoals: metrikaGoals, className: b('card', { fullWidth }), extraProps: ariaAttributes },
         React.createElement(CardBase.Header, { image: image, className: b('header', { fullWidth }) },
             React.createElement("div", { className: b('image-container'), "data-qa": "blog-suggest-header" })),
         React.createElement(CardBase.Content, null,
-            showTag && ((_a = tags === null || tags === void 0 ? void 0 : tags[0]) === null || _a === void 0 ? void 0 : _a.name) && (React.createElement("div", { className: b('tag', { size }) }, tags[0].name)),
+            isTagVisible && (React.createElement("div", { id: tagId, className: b('tag', { size }) }, tags[0].name)),
             title &&
                 React.createElement(titleHeadingLevel, { className: b('title', { size }) }, React.createElement("span", null,
-                    React.createElement(HTML, null, title))),
+                    React.createElement(HTML, { id: titleId }, title))),
             description && (React.createElement(YFMWrapper, { className: b('description'), content: description, modifiers: {
                     blog: size === 'm',
                     blogCard: true,
-                } }))),
+                }, id: descriptionId }))),
         React.createElement(CardBase.Footer, null,
-            React.createElement(SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block" }))));
+            React.createElement(SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block", dateId: dateId, readingTimeId: readingTimeId }))));
 };

package/build/esm/components/PostInfo/SuggestPostInfo.d.ts

@@ -9,6 +9,8 @@ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTi
         hasUserLike?: boolean;
         toggleLike?: ToggleLikeCallbackType;
     };
+    dateId?: string;
+    readingTimeId?: string;
 }
 /**
  * Suggest blog card info component
@@ -21,7 +23,9 @@ export interface SuggestPostInfoProps extends Pick<PostData, 'date' | 'readingTi
  * @param qa - test-attr
  * @param size - text size
  * @param isModernIcon - flag what we need render 'bookmark' icon
+ * @param dateId - id value for element with post date. Useful when providing accessible description
+ * @param readingTimeId - id value for element with reading time. Useful when providing accessible description
  *
  * @returns jsx
  */
-export declare const SuggestPostInfo: ({ postId, date, readingTime, likes, size, qa, }: SuggestPostInfoProps) => React.JSX.Element;
+export declare const SuggestPostInfo: ({ postId, date, readingTime, likes, size, qa, dateId, readingTimeId, }: SuggestPostInfoProps) => React.JSX.Element;

package/build/esm/components/PostInfo/SuggestPostInfo.js

@@ -18,10 +18,12 @@ const b = block('post-info');
  * @param qa - test-attr
  * @param size - text size
  * @param isModernIcon - flag what we need render 'bookmark' icon
+ * @param dateId - id value for element with post date. Useful when providing accessible description
+ * @param readingTimeId - id value for element with reading time. Useful when providing accessible description
  *
  * @returns jsx
  */
-export const SuggestPostInfo = ({ postId, date, readingTime, likes, size = PostCardSize.SMALL, qa, }) => {
+export const SuggestPostInfo = ({ postId, date, readingTime, likes, size = PostCardSize.SMALL, qa, dateId, readingTimeId, }) => {
     const { hasUserLike, likesCount, handleLike } = useLikes({
         hasLike: likes === null || likes === void 0 ? void 0 : likes.hasUserLike,
         count: likes === null || likes === void 0 ? void 0 : likes.likesCount,
@@ -30,7 +32,7 @@ export const SuggestPostInfo = ({ postId, date, readingTime, likes, size = PostC
     });
     return (React.createElement("div", { className: b('container') },
         React.createElement("div", { className: b('suggest-container') },
-            date && React.createElement(Date, { date: date, size: size }),
-            readingTime && React.createElement(ReadingTime, { readingTime: readingTime, size: size })),
+            date && React.createElement(Date, { date: date, size: size, id: dateId }),
+            readingTime && (React.createElement(ReadingTime, { readingTime: readingTime, size: size, id: readingTimeId }))),
         likes && postId && (React.createElement(Save, { postId: postId, title: likesCount, hasUserLike: hasUserLike, handleUserLike: handleLike, size: size, qa: qa }))));
 };

package/build/esm/components/PostInfo/components/Date.d.ts

@@ -4,6 +4,7 @@ import '../PostInfo.css';
 type DateProps = {
     date: string | number;
     size?: PostCardSize;
+    id?: string;
 };
-export declare const Date: ({ date, size }: DateProps) => React.JSX.Element;
+export declare const Date: ({ date, size, id }: DateProps) => React.JSX.Element;
 export {};

package/build/esm/components/PostInfo/components/Date.js

@@ -5,7 +5,7 @@ import { block } from '../../../utils/cn';
 import { format } from '../../../utils/date';
 import '../PostInfo.css';
 const b = block('post-info');
-export const Date = ({ date, size = PostCardSize.SMALL }) => {
+export const Date = ({ date, size = PostCardSize.SMALL, id }) => {
     const { locale } = useContext(LocaleContext);
-    return React.createElement("div", { className: b('item', { size }) }, format(date, 'longDate', locale === null || locale === void 0 ? void 0 : locale.code));
+    return (React.createElement("div", { className: b('item', { size }), id: id }, format(date, 'longDate', locale === null || locale === void 0 ? void 0 : locale.code)));
 };

package/build/esm/components/PostInfo/components/ReadingTime.d.ts

@@ -3,6 +3,7 @@ import '../PostInfo.css';
 type ReadingTimeProps = {
     readingTime: number;
     size?: 's' | 'm';
+    id?: string;
 };
-export declare const ReadingTime: ({ readingTime, size }: ReadingTimeProps) => React.JSX.Element;
+export declare const ReadingTime: ({ readingTime, size, id }: ReadingTimeProps) => React.JSX.Element;
 export {};

package/build/esm/components/PostInfo/components/ReadingTime.js

@@ -6,7 +6,7 @@ import { block } from '../../../utils/cn';
 import '../PostInfo.css';
 const b = block('post-info');
 const ICON_SIZE = 16;
-export const ReadingTime = ({ readingTime, size = 's' }) => (React.createElement("div", { className: b('item', { size }) },
+export const ReadingTime = ({ readingTime, size = 's', id }) => (React.createElement("div", { className: b('item', { size }), id: id },
     React.createElement("span", { className: b('icon') },
         React.createElement(Icon, { data: Time, size: ICON_SIZE, className: b('icon-color') })),
     i18(Keyset.ContextReadingTime, { count: readingTime })));

package/build/esm/hooks/useAriaAttributes.d.ts

@@ -0,0 +1,17 @@
+type Labels = string | number | boolean | undefined;
+type Description = string | number | boolean | undefined;
+interface UseAriaAttributesProps {
+    labelIds?: Labels[];
+    descriptionIds: Description[];
+}
+/**
+ * Returns aria-attributes
+ * @param labelIds - labels ids. Falsy values will be ignored
+ * @param descriptionIds - descriptions ids. Falsy values will be ignored
+ * @returns aria attributes for the element to be labelled
+ */
+export declare const useAriaAttributes: ({ labelIds, descriptionIds }: UseAriaAttributesProps) => {
+    'aria-labelledby': string;
+    'aria-describedby': string;
+};
+export {};

package/build/esm/hooks/useAriaAttributes.js

@@ -0,0 +1,15 @@
+import { useMemo } from 'react';
+/**
+ * Returns aria-attributes
+ * @param labelIds - labels ids. Falsy values will be ignored
+ * @param descriptionIds - descriptions ids. Falsy values will be ignored
+ * @returns aria attributes for the element to be labelled
+ */
+export const useAriaAttributes = ({ labelIds = [], descriptionIds = [] }) => {
+    const labelledBy = useMemo(() => labelIds.filter(Boolean).join(' '), [labelIds]);
+    const describedBy = useMemo(() => descriptionIds.filter(Boolean).join(' '), [descriptionIds]);
+    return {
+        'aria-labelledby': labelledBy,
+        'aria-describedby': describedBy,
+    };
+};

package/build/esm/models/common.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+import { MarkdownItPluginCb } from '@doc-tools/transform/lib/plugins/typings';
 import { HeaderBlockProps as PageConstructorHeaderBlockProps } from '@gravity-ui/page-constructor';
 import { IBrowser, IDevice } from 'ua-parser-js';
 import { Locale } from '../models/locale';
@@ -176,3 +177,6 @@ export declare enum PostCardTitleHeadingLevel {
     H2 = "h2",
     H3 = "h3"
 }
+export interface TransformPostOptions {
+    plugins?: MarkdownItPluginCb[];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/blog-constructor",
-  "version": "5.7.3",
+  "version": "5.8.0",
   "description": "Gravity UI Blog Constructor",
   "license": "MIT",
   "repository": {
@@ -78,7 +78,7 @@
   },
   "peerDependencies": {
     "@doc-tools/transform": "^3.3.2",
-    "@gravity-ui/page-constructor": "^4.26.0",
+    "@gravity-ui/page-constructor": "^4.31.0",
     "@gravity-ui/uikit": "^5.12.0",
     "react": "^16.0.0 || ^17.0.0 || ^18.0.0"
   },

package/server/data/transformPageContent.d.ts

@@ -1,3 +1,4 @@
+import { MarkdownItPluginCb } from '@doc-tools/transform/lib/plugins/typings';
 import { Lang } from '../models/locale';
 type TypographyConfigType = {
     [x: string]: Record<string, unknown>;
@@ -7,6 +8,7 @@ type TransformPageContentPropsType = {
     lang: Lang;
     region?: string;
     typographyConfig?: TypographyConfigType;
+    plugins?: MarkdownItPluginCb[];
 };
 /**
  * Func for transform blog page content
@@ -15,7 +17,8 @@ type TransformPageContentPropsType = {
  * @param lang - runtime app lang
  * @param region - runtime app region
  * @param typographyConfig - page-constructor extend typography config
+ * @param plugins - YFM plugins
  * @returns transformed content
  */
-export declare const transformPageContent: ({ content, lang, region, typographyConfig, }: TransformPageContentPropsType) => any;
+export declare const transformPageContent: ({ content, lang, region, typographyConfig, plugins, }: TransformPageContentPropsType) => any;
 export {};

package/server/data/transformPageContent.js

@@ -6,13 +6,14 @@ const server_1 = require("@gravity-ui/page-constructor/server");
 const js_yaml_1 = tslib_1.__importDefault(require("js-yaml"));
 const config_1 = require("./config");
 const contentFilter_1 = require("./contentFilter");
-const transformer = ({ blocks, lang, typographyConfig }) => (0, server_1.contentTransformer)({
+const transformer = ({ blocks, lang, typographyConfig, plugins }) => (0, server_1.contentTransformer)({
     content: {
         blocks: blocks || [],
     },
     options: {
         lang,
         customConfig: Object.assign(Object.assign({}, typographyConfig), (0, config_1.getExtendTypographyConfig)()),
+        plugins,
     },
 });
 /**
@@ -22,9 +23,10 @@ const transformer = ({ blocks, lang, typographyConfig }) => (0, server_1.content
  * @param lang - runtime app lang
  * @param region - runtime app region
  * @param typographyConfig - page-constructor extend typography config
+ * @param plugins - YFM plugins
  * @returns transformed content
  */
-const transformPageContent = ({ content, lang, region, typographyConfig = {}, }) => {
+const transformPageContent = ({ content, lang, region, typographyConfig = {}, plugins, }) => {
     try {
         const transformedContent = (0, contentFilter_1.filterContent)(js_yaml_1.default.load(content), { lang, region });
         if (transformedContent.blocks) {
@@ -32,6 +34,7 @@ const transformPageContent = ({ content, lang, region, typographyConfig = {}, })
                 blocks: transformedContent.blocks,
                 lang,
                 typographyConfig,
+                plugins,
             });
             transformedContent.blocks = transformedBlocks;
         }

package/server/data/transformPost.d.ts

@@ -1,4 +1,4 @@
-import { PostData } from '../models/common';
+import { PostData, TransformPostOptions } from '../models/common';
 import { Lang } from '../models/locale';
 /**
  * Func for transform post data
@@ -6,6 +6,7 @@ import { Lang } from '../models/locale';
  * @param postData - post data
  * @param lang - runtime language
  *
+ * @param plugins - YFM plugins list
  * @returns -prepared post
  */
-export declare const transformPost: (postData: PostData, lang: Lang) => PostData;
+export declare const transformPost: (postData: PostData, lang: Lang, { plugins }?: TransformPostOptions) => PostData;

package/server/data/transformPost.js

@@ -9,9 +9,10 @@ const server_1 = require("@gravity-ui/page-constructor/server");
  * @param postData - post data
  * @param lang - runtime language
  *
+ * @param plugins - YFM plugins list
  * @returns -prepared post
  */
-const transformPost = (postData, lang) => {
+const transformPost = (postData, lang, { plugins } = {}) => {
     if (!postData) {
         // eslint-disable-next-line no-console
         console.error('Post not found');
@@ -19,6 +20,6 @@ const transformPost = (postData, lang) => {
     }
     const { tags, title, metaTitle, description } = postData, post = tslib_1.__rest(postData, ["tags", "title", "metaTitle", "description"]);
     return Object.assign(Object.assign({}, post), { title,
-        tags, textTitle: (0, server_1.typografToText)(title, lang), htmlTitle: (0, server_1.typografToHTML)(title, lang), metaTitle: metaTitle || title, description: (0, server_1.yfmTransformer)(lang, description) });
+        tags, textTitle: (0, server_1.typografToText)(title, lang), htmlTitle: (0, server_1.typografToHTML)(title, lang), metaTitle: metaTitle || title, description: (0, server_1.yfmTransformer)(lang, description, { plugins }) });
 };
 exports.transformPost = transformPost;

package/server/models/common.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+import { MarkdownItPluginCb } from '@doc-tools/transform/lib/plugins/typings';
 import { HeaderBlockProps as PageConstructorHeaderBlockProps } from '@gravity-ui/page-constructor';
 import { IBrowser, IDevice } from 'ua-parser-js';
 import { Locale } from '../models/locale';
@@ -176,3 +177,6 @@ export declare enum PostCardTitleHeadingLevel {
     H2 = "h2",
     H3 = "h3"
 }
+export interface TransformPostOptions {
+    plugins?: MarkdownItPluginCb[];
+}