@gravity-ui/page-constructor 5.5.0 → 5.6.1

package/build/cjs/sub-blocks/LayoutItem/LayoutItem.js

@@ -4,6 +4,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const components_1 = require("../../components");
+const theme_1 = require("../../context/theme");
 const utils_1 = require("../../utils");
 const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
 const utils_2 = require("./utils");
@@ -12,16 +13,18 @@ const LayoutItem = (_a) => {
     var _b = _a.content, { links, buttons } = _b, content = tslib_1.__rest(_b, ["links", "buttons"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
     const normalizedLinks = (0, react_1.useMemo)(() => (0, utils_2.getLayoutItemLinks)(links), [links]);
     const areControlsInFooter = controlPosition === 'footer';
+    const theme = (0, theme_1.useTheme)();
     const contentProps = Object.assign(Object.assign(Object.assign({}, content), (areControlsInFooter ? {} : { links: normalizedLinks, buttons })), { size: 's', colSizes: { all: 12, md: 12 } });
     const titleId = (0, uikit_1.useUniqId)();
     const renderMedia = () => {
         if (!media) {
             return null;
         }
-        return fullscreen && (0, utils_2.hasFullscreen)(media) ? (react_1.default.createElement(components_1.FullscreenMedia, { showFullscreenIcon: (0, utils_2.showFullscreenIcon)(media) }, (_a = {}) => {
+        const themedMedia = (0, utils_1.getThemedValue)(media, theme);
+        return fullscreen && (0, utils_2.hasFullscreen)(themedMedia) ? (react_1.default.createElement(components_1.FullscreenMedia, { showFullscreenIcon: (0, utils_2.showFullscreenIcon)(themedMedia) }, (_a = {}) => {
             var { className: mediaClassName, fullscreen: _fullscreen } = _a, fullscreenMediaProps = tslib_1.__rest(_a, ["className", "fullscreen"]);
-            return (react_1.default.createElement(components_1.Media, Object.assign({}, media, fullscreenMediaProps, { className: b('media', { border }, mediaClassName), analyticsEvents: analyticsEvents })));
-        })) : (react_1.default.createElement(components_1.Media, Object.assign({}, media, { className: b('media', { border }), analyticsEvents: analyticsEvents })));
+            return (react_1.default.createElement(components_1.Media, Object.assign({}, themedMedia, fullscreenMediaProps, { className: b('media', { border }, mediaClassName), analyticsEvents: analyticsEvents })));
+        })) : (react_1.default.createElement(components_1.Media, Object.assign({}, themedMedia, { className: b('media', { border }), analyticsEvents: analyticsEvents })));
     };
     return (react_1.default.createElement("div", { className: b(null, className) },
         renderMedia(),

package/build/cjs/text-transform/common.d.ts

@@ -1,18 +1,18 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
+import { Lang } from './types';
 export type ComplexItem = {
     [key: string]: string;
 };
 export type Item = string | null | ComplexItem;
 export type Transformer = (text: string) => string;
-export type TransformerRaw = (lang: `${Lang}`, content: string, options: {
+export type TransformerRaw = (lang: Lang, content: string, options: {
     plugins: MarkdownItPluginCb[];
 }) => string;
 export type Parser<T = any> = (transformer: Transformer, block: T) => T;
 export declare const createItemsParser: (fields: string[]) => (transformer: Transformer, items: Item[]) => (string | {
     [x: string]: string;
 } | null)[];
-export declare function yfmTransformer(lang: `${Lang}`, content: string, options?: {
+export declare function yfmTransformer(lang: Lang, content: string, options?: {
     plugins?: MarkdownItPluginCb[];
 }): string;
-export declare function typografTransformer(lang: `${Lang}`, content: string): string;
+export declare function typografTransformer(lang: Lang, content: string): string;

package/build/cjs/text-transform/transformers.d.ts

@@ -1,13 +1,13 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
 import { ConstructorBlock } from '../models/constructor';
+import { Lang } from './types';
 export type ContentVariables = Record<string, string>;
 export type ContentTransformerProps = {
     content: {
         blocks?: ConstructorBlock[];
     };
     options: {
-        lang: `${Lang}`;
+        lang: Lang;
         customConfig?: {};
         vars?: ContentVariables;
         plugins?: MarkdownItPluginCb[];

package/build/cjs/text-transform/types.d.ts

@@ -0,0 +1,3 @@
+import type { Lang } from '@gravity-ui/uikit';
+type LANG = `${Lang}`;
+export { LANG as Lang };

package/build/cjs/text-transform/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/build/cjs/text-transform/utils.d.ts

@@ -1,13 +1,13 @@
 import { Options, Output } from '@diplodoc/transform';
-import { Lang } from '@gravity-ui/uikit';
 import sanitize from 'sanitize-html';
+import { Lang } from './types';
 import AddRuleOptions = typograf.AddRuleOptions;
 export declare enum TransformType {
     Text = "text",
     Html = "html"
 }
 interface TransformOptions extends Options {
-    lang: `${Lang}`;
+    lang: Lang;
 }
 export declare const DEFAULT_ALLOWED_TAGS: string[];
 export declare const typografConfig: {
@@ -16,16 +16,16 @@ export declare const typografConfig: {
 };
 export declare const sanitizeStripOptions: sanitize.IOptions;
 export declare function addTypografRules(options: AddRuleOptions[]): void;
-export declare function typograf(text: string, lang?: `${Lang}`): string;
+export declare function typograf(text: string, lang?: Lang): string;
 export declare function sanitizeHtml(html: string, options?: sanitize.IOptions): string;
-export declare function typografToHTML(text: string, lang: `${Lang}`, allowedTags?: string[]): string;
-export declare function typografToText(text: string, lang: `${Lang}`): string;
+export declare function typografToHTML(text: string, lang: Lang, allowedTags?: string[]): string;
+export declare function typografToText(text: string, lang: Lang): string;
 export declare const transformMarkdown: (input: string, options: TransformOptions) => Output['result'];
 export declare function fullTransform(input: string, { lang, ...options }: TransformOptions): Output['result'];
 export interface TypografEntityParams {
     entity: Record<string, string>;
     fields: string[];
-    lang: `${Lang}`;
+    lang: Lang;
     transformType: TransformType;
 }
 export declare function typografEntity({ entity, fields, lang, transformType, }: TypografEntityParams): Record<string, string>;

package/build/cjs/text-transform/utils.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.typografEntity = exports.fullTransform = exports.transformMarkdown = exports.typografToText = exports.typografToHTML = exports.sanitizeHtml = exports.typograf = exports.addTypografRules = exports.sanitizeStripOptions = exports.typografConfig = exports.DEFAULT_ALLOWED_TAGS = exports.TransformType = void 0;
 const tslib_1 = require("tslib");
 const transform_1 = tslib_1.__importDefault(require("@diplodoc/transform"));
-const uikit_1 = require("@gravity-ui/uikit");
 const sanitize_html_1 = tslib_1.__importDefault(require("sanitize-html"));
 const typograf_1 = tslib_1.__importDefault(require("typograf"));
 var TransformType;
@@ -48,10 +47,10 @@ function enableRules(tp) {
     enabled.forEach((rule) => tp.enableRule(rule));
     disabled.forEach((rule) => tp.disableRule(rule));
 }
-function typograf(text, lang = uikit_1.Lang.Ru) {
+function typograf(text, lang = 'ru') {
     const localeByLang = {
-        [uikit_1.Lang.Ru]: ['ru', 'en-US'],
-        [uikit_1.Lang.En]: ['en-US', 'ru'],
+        ru: ['ru', 'en-US'],
+        en: ['en-US', 'ru'],
     };
     const tp = new typograf_1.default({
         locale: localeByLang[lang],
@@ -85,7 +84,7 @@ function fullTransform(input, _a) {
     return Object.assign(Object.assign({}, result), { html: typograf(html, lang), title: title && typograf(title, lang) });
 }
 exports.fullTransform = fullTransform;
-function typografEntity({ entity, fields, lang = uikit_1.Lang.Ru, transformType = TransformType.Text, }) {
+function typografEntity({ entity, fields, lang = 'ru', transformType = TransformType.Text, }) {
     const transformTypeMap = {
         text: typografToText,
         html: typografToHTML,

package/build/esm/sub-blocks/LayoutItem/LayoutItem.js

@@ -2,7 +2,8 @@ import { __rest } from "tslib";
 import React, { useMemo } from 'react';
 import { useUniqId } from '@gravity-ui/uikit';
 import { Buttons, FullscreenMedia, IconWrapper, Links, Media, MetaInfo } from '../../components';
-import { block } from '../../utils';
+import { useTheme } from '../../context/theme';
+import { block, getThemedValue } from '../../utils';
 import Content from '../Content/Content';
 import { getLayoutItemLinks, hasFullscreen, showFullscreenIcon } from './utils';
 import './LayoutItem.css';
@@ -11,16 +12,18 @@ const LayoutItem = (_a) => {
     var _b = _a.content, { links, buttons } = _b, content = __rest(_b, ["links", "buttons"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
     const normalizedLinks = useMemo(() => getLayoutItemLinks(links), [links]);
     const areControlsInFooter = controlPosition === 'footer';
+    const theme = useTheme();
     const contentProps = Object.assign(Object.assign(Object.assign({}, content), (areControlsInFooter ? {} : { links: normalizedLinks, buttons })), { size: 's', colSizes: { all: 12, md: 12 } });
     const titleId = useUniqId();
     const renderMedia = () => {
         if (!media) {
             return null;
         }
-        return fullscreen && hasFullscreen(media) ? (React.createElement(FullscreenMedia, { showFullscreenIcon: showFullscreenIcon(media) }, (_a = {}) => {
+        const themedMedia = getThemedValue(media, theme);
+        return fullscreen && hasFullscreen(themedMedia) ? (React.createElement(FullscreenMedia, { showFullscreenIcon: showFullscreenIcon(themedMedia) }, (_a = {}) => {
             var { className: mediaClassName, fullscreen: _fullscreen } = _a, fullscreenMediaProps = __rest(_a, ["className", "fullscreen"]);
-            return (React.createElement(Media, Object.assign({}, media, fullscreenMediaProps, { className: b('media', { border }, mediaClassName), analyticsEvents: analyticsEvents })));
-        })) : (React.createElement(Media, Object.assign({}, media, { className: b('media', { border }), analyticsEvents: analyticsEvents })));
+            return (React.createElement(Media, Object.assign({}, themedMedia, fullscreenMediaProps, { className: b('media', { border }, mediaClassName), analyticsEvents: analyticsEvents })));
+        })) : (React.createElement(Media, Object.assign({}, themedMedia, { className: b('media', { border }), analyticsEvents: analyticsEvents })));
     };
     return (React.createElement("div", { className: b(null, className) },
         renderMedia(),

package/build/esm/text-transform/common.d.ts

@@ -1,18 +1,18 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
+import { Lang } from './types';
 export type ComplexItem = {
     [key: string]: string;
 };
 export type Item = string | null | ComplexItem;
 export type Transformer = (text: string) => string;
-export type TransformerRaw = (lang: `${Lang}`, content: string, options: {
+export type TransformerRaw = (lang: Lang, content: string, options: {
     plugins: MarkdownItPluginCb[];
 }) => string;
 export type Parser<T = any> = (transformer: Transformer, block: T) => T;
 export declare const createItemsParser: (fields: string[]) => (transformer: Transformer, items: Item[]) => (string | {
     [x: string]: string;
 } | null)[];
-export declare function yfmTransformer(lang: `${Lang}`, content: string, options?: {
+export declare function yfmTransformer(lang: Lang, content: string, options?: {
     plugins?: MarkdownItPluginCb[];
 }): string;
-export declare function typografTransformer(lang: `${Lang}`, content: string): string;
+export declare function typografTransformer(lang: Lang, content: string): string;

package/build/esm/text-transform/transformers.d.ts

@@ -1,13 +1,13 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
 import { ConstructorBlock } from '../models/constructor';
+import { Lang } from './types';
 export type ContentVariables = Record<string, string>;
 export type ContentTransformerProps = {
     content: {
         blocks?: ConstructorBlock[];
     };
     options: {
-        lang: `${Lang}`;
+        lang: Lang;
         customConfig?: {};
         vars?: ContentVariables;
         plugins?: MarkdownItPluginCb[];

package/build/esm/text-transform/types.d.ts

@@ -0,0 +1,3 @@
+import type { Lang } from '@gravity-ui/uikit';
+type LANG = `${Lang}`;
+export { LANG as Lang };

package/build/esm/text-transform/types.js

@@ -0,0 +1 @@
+export {};

package/build/esm/text-transform/utils.d.ts

@@ -1,13 +1,13 @@
 import { Options, Output } from '@diplodoc/transform';
-import { Lang } from '@gravity-ui/uikit';
 import sanitize from 'sanitize-html';
+import { Lang } from './types';
 import AddRuleOptions = typograf.AddRuleOptions;
 export declare enum TransformType {
     Text = "text",
     Html = "html"
 }
 interface TransformOptions extends Options {
-    lang: `${Lang}`;
+    lang: Lang;
 }
 export declare const DEFAULT_ALLOWED_TAGS: string[];
 export declare const typografConfig: {
@@ -16,16 +16,16 @@ export declare const typografConfig: {
 };
 export declare const sanitizeStripOptions: sanitize.IOptions;
 export declare function addTypografRules(options: AddRuleOptions[]): void;
-export declare function typograf(text: string, lang?: `${Lang}`): string;
+export declare function typograf(text: string, lang?: Lang): string;
 export declare function sanitizeHtml(html: string, options?: sanitize.IOptions): string;
-export declare function typografToHTML(text: string, lang: `${Lang}`, allowedTags?: string[]): string;
-export declare function typografToText(text: string, lang: `${Lang}`): string;
+export declare function typografToHTML(text: string, lang: Lang, allowedTags?: string[]): string;
+export declare function typografToText(text: string, lang: Lang): string;
 export declare const transformMarkdown: (input: string, options: TransformOptions) => Output['result'];
 export declare function fullTransform(input: string, { lang, ...options }: TransformOptions): Output['result'];
 export interface TypografEntityParams {
     entity: Record<string, string>;
     fields: string[];
-    lang: `${Lang}`;
+    lang: Lang;
     transformType: TransformType;
 }
 export declare function typografEntity({ entity, fields, lang, transformType, }: TypografEntityParams): Record<string, string>;

package/build/esm/text-transform/utils.js

@@ -1,6 +1,5 @@
 import { __rest } from "tslib";
 import transformYFM from '@diplodoc/transform';
-import { Lang } from '@gravity-ui/uikit';
 import sanitize from 'sanitize-html';
 import Typograf from 'typograf';
 export var TransformType;
@@ -44,10 +43,10 @@ function enableRules(tp) {
     enabled.forEach((rule) => tp.enableRule(rule));
     disabled.forEach((rule) => tp.disableRule(rule));
 }
-export function typograf(text, lang = Lang.Ru) {
+export function typograf(text, lang = 'ru') {
     const localeByLang = {
-        [Lang.Ru]: ['ru', 'en-US'],
-        [Lang.En]: ['en-US', 'ru'],
+        ru: ['ru', 'en-US'],
+        en: ['en-US', 'ru'],
     };
     const tp = new Typograf({
         locale: localeByLang[lang],
@@ -75,7 +74,7 @@ export function fullTransform(input, _a) {
     const { html, title } = result;
     return Object.assign(Object.assign({}, result), { html: typograf(html, lang), title: title && typograf(title, lang) });
 }
-export function typografEntity({ entity, fields, lang = Lang.Ru, transformType = TransformType.Text, }) {
+export function typografEntity({ entity, fields, lang = 'ru', transformType = TransformType.Text, }) {
     const transformTypeMap = {
         text: typografToText,
         html: typografToHTML,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "5.5.0",
+  "version": "5.6.1",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {

package/server/text-transform/common.d.ts

@@ -1,18 +1,18 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
+import { Lang } from './types';
 export type ComplexItem = {
     [key: string]: string;
 };
 export type Item = string | null | ComplexItem;
 export type Transformer = (text: string) => string;
-export type TransformerRaw = (lang: `${Lang}`, content: string, options: {
+export type TransformerRaw = (lang: Lang, content: string, options: {
     plugins: MarkdownItPluginCb[];
 }) => string;
 export type Parser<T = any> = (transformer: Transformer, block: T) => T;
 export declare const createItemsParser: (fields: string[]) => (transformer: Transformer, items: Item[]) => (string | {
     [x: string]: string;
 } | null)[];
-export declare function yfmTransformer(lang: `${Lang}`, content: string, options?: {
+export declare function yfmTransformer(lang: Lang, content: string, options?: {
     plugins?: MarkdownItPluginCb[];
 }): string;
-export declare function typografTransformer(lang: `${Lang}`, content: string): string;
+export declare function typografTransformer(lang: Lang, content: string): string;

package/server/text-transform/transformers.d.ts

@@ -1,13 +1,13 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
-import { Lang } from '@gravity-ui/uikit';
 import { ConstructorBlock } from '../models/constructor';
+import { Lang } from './types';
 export type ContentVariables = Record<string, string>;
 export type ContentTransformerProps = {
     content: {
         blocks?: ConstructorBlock[];
     };
     options: {
-        lang: `${Lang}`;
+        lang: Lang;
         customConfig?: {};
         vars?: ContentVariables;
         plugins?: MarkdownItPluginCb[];

package/server/text-transform/types.d.ts

@@ -0,0 +1,3 @@
+import type { Lang } from '@gravity-ui/uikit';
+type LANG = `${Lang}`;
+export { LANG as Lang };

package/server/text-transform/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/server/text-transform/utils.d.ts

@@ -1,13 +1,13 @@
 import { Options, Output } from '@diplodoc/transform';
-import { Lang } from '@gravity-ui/uikit';
 import sanitize from 'sanitize-html';
+import { Lang } from './types';
 import AddRuleOptions = typograf.AddRuleOptions;
 export declare enum TransformType {
     Text = "text",
     Html = "html"
 }
 interface TransformOptions extends Options {
-    lang: `${Lang}`;
+    lang: Lang;
 }
 export declare const DEFAULT_ALLOWED_TAGS: string[];
 export declare const typografConfig: {
@@ -16,16 +16,16 @@ export declare const typografConfig: {
 };
 export declare const sanitizeStripOptions: sanitize.IOptions;
 export declare function addTypografRules(options: AddRuleOptions[]): void;
-export declare function typograf(text: string, lang?: `${Lang}`): string;
+export declare function typograf(text: string, lang?: Lang): string;
 export declare function sanitizeHtml(html: string, options?: sanitize.IOptions): string;
-export declare function typografToHTML(text: string, lang: `${Lang}`, allowedTags?: string[]): string;
-export declare function typografToText(text: string, lang: `${Lang}`): string;
+export declare function typografToHTML(text: string, lang: Lang, allowedTags?: string[]): string;
+export declare function typografToText(text: string, lang: Lang): string;
 export declare const transformMarkdown: (input: string, options: TransformOptions) => Output['result'];
 export declare function fullTransform(input: string, { lang, ...options }: TransformOptions): Output['result'];
 export interface TypografEntityParams {
     entity: Record<string, string>;
     fields: string[];
-    lang: `${Lang}`;
+    lang: Lang;
     transformType: TransformType;
 }
 export declare function typografEntity({ entity, fields, lang, transformType, }: TypografEntityParams): Record<string, string>;

package/server/text-transform/utils.js

@@ -16,7 +16,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.typografEntity = exports.fullTransform = exports.transformMarkdown = exports.typografToText = exports.typografToHTML = exports.sanitizeHtml = exports.typograf = exports.addTypografRules = exports.sanitizeStripOptions = exports.typografConfig = exports.DEFAULT_ALLOWED_TAGS = exports.TransformType = void 0;
 const transform_1 = __importDefault(require("@diplodoc/transform"));
-const uikit_1 = require("@gravity-ui/uikit");
 const sanitize_html_1 = __importDefault(require("sanitize-html"));
 const typograf_1 = __importDefault(require("typograf"));
 var TransformType;
@@ -61,10 +60,10 @@ function enableRules(tp) {
     enabled.forEach((rule) => tp.enableRule(rule));
     disabled.forEach((rule) => tp.disableRule(rule));
 }
-function typograf(text, lang = uikit_1.Lang.Ru) {
+function typograf(text, lang = 'ru') {
     const localeByLang = {
-        [uikit_1.Lang.Ru]: ['ru', 'en-US'],
-        [uikit_1.Lang.En]: ['en-US', 'ru'],
+        ru: ['ru', 'en-US'],
+        en: ['en-US', 'ru'],
     };
     const tp = new typograf_1.default({
         locale: localeByLang[lang],
@@ -98,7 +97,7 @@ function fullTransform(input, _a) {
     return Object.assign(Object.assign({}, result), { html: typograf(html, lang), title: title && typograf(title, lang) });
 }
 exports.fullTransform = fullTransform;
-function typografEntity({ entity, fields, lang = uikit_1.Lang.Ru, transformType = TransformType.Text, }) {
+function typografEntity({ entity, fields, lang = 'ru', transformType = TransformType.Text, }) {
     const transformTypeMap = {
         text: typografToText,
         html: typografToHTML,