diff --git a/README.md b/README.md index d54aa17..7ec3b6c 100644 --- a/README.md +++ b/README.md @@ -262,8 +262,6 @@ export interface HeadContent { export interface BodyContent { attributes: Attributes; - /** @deprecated use attributes.class instead */ - className: string[]; beforeRoot: string[]; root?: string; afterRoot: string[]; @@ -335,7 +333,7 @@ Adds Yandex metrics counters on the page. Usage: ```js -import {createMiddleware, createYandexMetrikaPlugin} from '@gravity-ui/app-layout'; +import {createRenderFunction, createYandexMetrikaPlugin} from '@gravity-ui/app-layout'; const renderLayout = createRenderFunction([createYandexMetrikaPlugin()]); @@ -395,7 +393,7 @@ Adds script and styles from webpack assets manifest file. Usage: ```js -import {createMiddleware, createLayoutPlugin} from '@gravity-ui/app-layout'; +import {createRenderFunction, createLayoutPlugin} from '@gravity-ui/app-layout'; const renderLayout = createRenderFunction([ createLayoutPlugin({manifest: 'path/to/assets-manifest.json', publicPath: '/build/'}), diff --git a/src/plugins/google-analytics/index.ts b/src/plugins/google-analytics/index.ts index d1cecbb..7b518d7 100644 --- a/src/plugins/google-analytics/index.ts +++ b/src/plugins/google-analytics/index.ts @@ -10,12 +10,14 @@ export function createGoogleAnalyticsPlugin(): Plugin< > { return { name: 'googleAnalytics', - apply({options, renderContent, utils}) { + apply({options, renderContent}) { if (!options || !options.counter) { return; } - renderContent.bodyContent.afterRoot.push(renderGoogleAnalyticsCounter(options, utils)); + renderContent.bodyContent.afterRoot.push( + renderGoogleAnalyticsCounter(options, renderContent.helpers), + ); }, }; } diff --git a/src/plugins/yandex-metrika/index.ts b/src/plugins/yandex-metrika/index.ts index f91ab4b..5f0230c 100644 --- a/src/plugins/yandex-metrika/index.ts +++ b/src/plugins/yandex-metrika/index.ts @@ -7,12 +7,12 @@ export type {MetrikaCounter, MetrikaPluginOptions, UserParams} from './types.js' export function createYandexMetrikaPlugin(): Plugin { return { name: 'yandexMetrika', - apply({options, renderContent, utils}) { + apply({options, renderContent}) { if (!options || !options.counter) { return; } - renderContent.bodyContent.afterRoot.push(renderMetrika(options, utils)); + renderContent.bodyContent.afterRoot.push(renderMetrika(options, renderContent.helpers)); }, }; } diff --git a/src/types.ts b/src/types.ts index 56f9d92..81489c3 100644 --- a/src/types.ts +++ b/src/types.ts @@ -50,15 +50,11 @@ export interface HeadContent { export interface BodyContent { attributes: Attributes; - /** @deprecated use attributes.class instead */ - className: string[]; beforeRoot: string[]; root?: string; afterRoot: string[]; } -export type OldBodyContent = Omit; - export interface RenderContent extends HeadContent { htmlAttributes: Attributes; bodyContent: BodyContent; @@ -77,7 +73,7 @@ export interface Plugin { name: Name; apply: (params: { options: Options | undefined; - renderContent: Omit & {bodyContent: OldBodyContent}; + renderContent: RenderContent; commonOptions: CommonOptions; /** @deprecated use `renderContent.helpers` instead */ utils: RenderHelpers; @@ -88,6 +84,7 @@ export interface RenderParams extends Commo icon?: Icon; nonce?: string; // content + htmlAttributes?: Attributes; meta?: Meta[]; links?: Link[]; scripts?: Script[]; @@ -97,6 +94,7 @@ export interface RenderParams extends Commo bodyContent?: { theme?: string; className?: string; + attributes?: Attributes; beforeRoot?: string; root?: string; afterRoot?: string; diff --git a/src/utils/generateRenderContent.ts b/src/utils/generateRenderContent.ts index 39f326d..97df9bf 100644 --- a/src/utils/generateRenderContent.ts +++ b/src/utils/generateRenderContent.ts @@ -1,6 +1,14 @@ import htmlescape from 'htmlescape'; -import type {BodyContent, Icon, Meta, Plugin, RenderContent, RenderParams} from '../types.js'; +import type { + Attributes, + BodyContent, + Icon, + Meta, + Plugin, + RenderContent, + RenderParams, +} from '../types.js'; import {getRenderHelpers, hasProperty} from '../utils.js'; function getRootClassName(theme?: string) { @@ -38,7 +46,7 @@ export function generateRenderContent( params: RenderParams, ): RenderContent { const helpers = getRenderHelpers(params); - const htmlAttributes: Record = {}; + const htmlAttributes: Attributes = {...params.htmlAttributes}; const meta = params.meta ?? []; // in terms of sets: meta = params.meta ∪ (defaultMeta ∖ params.meta) defaultMeta.forEach((defaultMetaItem) => { @@ -55,13 +63,19 @@ export function generateRenderContent( inlineScripts.unshift(`window.__DATA__ = ${htmlescape(params.data || {})};`); const content = params.bodyContent ?? {}; + const {theme, className} = content; - const bodyClasses = Array.from( + const bodyClassName = Array.from( new Set([...getRootClassName(theme), ...(className ? className.split(' ') : [])]), - ); + ) + .filter(Boolean) + .join(' '); + const bodyContent: BodyContent = { - attributes: {}, - className: bodyClasses, + attributes: { + class: bodyClassName, + ...content.attributes, + }, root: content.root, beforeRoot: content.beforeRoot ? [content.beforeRoot] : [], afterRoot: content.afterRoot ? [content.afterRoot] : [], @@ -99,11 +113,6 @@ export function generateRenderContent( }); } - bodyContent.attributes = { - ...bodyContent.attributes, - class: bodyContent.className.filter(Boolean).join(' '), - }; - if (lang) { htmlAttributes.lang = lang; }