feat(pugins)!: allow to set body attributes

removed className from bodyContent
gravity-ui · Mar 20, 2024 · 5c91730 · 5c91730
1 parent d0719d2
commit 5c91730
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 23 deletions.
diff --git 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
@@ -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
@@ -7,12 +7,12 @@ export type {MetrikaCounter, MetrikaPluginOptions, UserParams} from './types.js'
 export function createYandexMetrikaPlugin(): Plugin<MetrikaPluginOptions, 'yandexMetrika'> {
     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
@@ -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<BodyContent, 'attributes'>;
-
 export interface RenderContent extends HeadContent {
     htmlAttributes: Attributes;
     bodyContent: BodyContent;
@@ -77,7 +73,7 @@ export interface Plugin<Options = any, Name extends string = string> {
     name: Name;
     apply: (params: {
         options: Options | undefined;
-        renderContent: Omit<RenderContent, 'bodyContent'> & {bodyContent: OldBodyContent};
+        renderContent: RenderContent;
         commonOptions: CommonOptions;
         /** @deprecated use `renderContent.helpers` instead */
         utils: RenderHelpers;

diff --git a/src/utils/generateRenderContent.ts b/src/utils/generateRenderContent.ts
@@ -55,18 +55,24 @@ export function generateRenderContent<Plugins extends Plugin[], Data>(
     inlineScripts.unshift(`window.__DATA__ = ${htmlescape(params.data || {})};`);
 
     const content = params.bodyContent ?? {};
-    const {theme, className} = content;
-    const bodyClasses = Array.from(
-        new Set([...getRootClassName(theme), ...(className ? className.split(' ') : [])]),
-    );
+
     const bodyContent: BodyContent = {
         attributes: {},
-        className: bodyClasses,
         root: content.root,
         beforeRoot: content.beforeRoot ? [content.beforeRoot] : [],
         afterRoot: content.afterRoot ? [content.afterRoot] : [],
     };
 
+    const {theme, className} = content;
+    if (theme || className) {
+        const bodyClasses = Array.from(
+            new Set([...getRootClassName(theme), ...(className ? className.split(' ') : [])]),
+        )
+            .filter(Boolean)
+            .join(' ');
+        bodyContent.attributes.class = bodyClasses;
+    }
+
     const icon: Icon = {
         ...defaultIcon,
         ...params.icon,
@@ -99,11 +105,6 @@ export function generateRenderContent<Plugins extends Plugin[], Data>(
         });
     }
 
-    bodyContent.attributes = {
-        ...bodyContent.attributes,
-        class: bodyContent.className.filter(Boolean).join(' '),
-    };
-
     if (lang) {
         htmlAttributes.lang = lang;
     }