gravity-ui · zamkovskaya · Apr 7, 2026 · Mar 23, 2026 · Apr 3, 2026
diff --git a/README-ru.md b/README-ru.md
@@ -43,6 +43,8 @@ interface RenderParams<Data, Plugins> {
   icon?: Icon;
   // nonce to be set on the appropriate tags
   nonce?: string;
+  // base tag attributes
+  base?: Base;
 
   // common options
   // Page title
@@ -85,6 +87,32 @@ interface RenderParams<Data, Plugins> {
 }
 ```
 
+### `Base`
+
+Описывает тег `base`:
+
+```typescript
+interface Base {
+  href?: string;
+  target?: HTMLBaseElement['target'];
+}
+```
+
+Например:
+
+```js
+renderLayout({
+  title: 'Home page',
+  base: {target: '_top'},
+});
+```
+
+Будет выглядеть следующим образом:
+
+```html
+<base target="_top" />
+```
+
 ### `Meta`
 
 Описывает тег `meta`:
@@ -252,6 +280,7 @@ interface CommonOptions {
 }
 
 export interface HeadContent {
+  base?: Base;
   scripts: Script[];
   helpers: RenderHelpers;
   links: Link[];

diff --git a/README.md b/README.md
@@ -43,6 +43,8 @@ interface RenderParams<Data, Plugins> {
   icon?: Icon;
   // nonce to be set on the appropriate tags
   nonce?: string;
+  // base tag attributes
+  base?: Base;
 
   // common options
   // Page title
@@ -85,6 +87,32 @@ interface RenderParams<Data, Plugins> {
 }
 ```
 
+### Base
+
+Describes `base` tag:
+
+```typescript
+interface Base {
+  href?: string;
+  target?: HTMLBaseElement['target'];
+}
+```
+
+Example:
+
+```js
+renderLayout({
+  title: 'Home page',
+  base: {target: '_top'},
+});
+```
+
+Will be rendered as:
+
+```html
+<base target="_top" />
+```
+
 ### Meta
 
 Describes `meta` tag:
@@ -252,6 +280,7 @@ interface CommonOptions {
 }
 
 export interface HeadContent {
+  base?: Base;
   scripts: Script[];
   helpers: RenderHelpers;
   links: Link[];

diff --git a/src/index.ts b/src/index.ts
@@ -12,6 +12,7 @@ export {
 } from './plugins/index.js';
 
 export type {
+    Base,
     Plugin,
     Icon,
     Link,

diff --git a/src/render.test.ts b/src/render.test.ts
@@ -6,7 +6,7 @@
    return {
        name: 'dirPlugin',
        apply({renderContent: {htmlAttributes}}) {
            htmlAttributes.dir = 'ltr';
        },
    };
 }
@@ -16,6 +16,24 @@
     expect(createRenderFunction([dirPlugin()])({title: 'Foobar'})).toMatch('<html dir="ltr">');
 });
 
+test('should render `<base>` tag with target', () => {
+    const html = createRenderFunction()({title: 'Foobar', base: {target: '_top'}});
+    expect(html).toMatch('<base target="_top">');
+});
+
+test('should render `<base>` tag with href and target', () => {
+    const html = createRenderFunction()({
+        title: 'Foobar',
+        base: {href: 'https://example.com/', target: '_top'},
+    });
+    expect(html).toMatch('<base href="https://example.com/" target="_top">');
+});
+
+test('should not render `<base>` tag when base is not provided', () => {
+    const html = createRenderFunction()({title: 'Foobar'});
+    expect(html).not.toMatch('<base');
+});
+
 test('should render root content', () => {
     expect(createRenderFunction()({title: 'Foobar'})).toMatch(/<div id="root">\s*<\/div>/);
     expect(createRenderFunction()({title: 'Foobar', bodyContent: {root: 'content'}})).toMatch(

diff --git a/src/types.ts b/src/types.ts
@@ -32,13 +32,19 @@
 
 export type Meta = {name: string; content: string};
 
+export interface Base {
+    href?: string;
+    target?: HTMLBaseElement['target'];
+}
+
 export interface CommonOptions {
     title: string;
     lang?: string;
     isMobile?: boolean;
 }
 
 export interface HeadContent {
+    base?: Base;
     scripts: Script[];
     helpers: RenderHelpers;
     links: Link[];
@@ -56,7 +62,7 @@
     afterRoot: string[];
 }
 
-export interface RenderContent extends HeadContent {
+export interface RenderContent extends Required<HeadContent> {
     htmlAttributes: Attributes;
     bodyContent: BodyContent;
 }
@@ -70,7 +76,7 @@
    renderLink(link: Link): string;
    attrs(obj: Attributes): string;
 }
 export interface Plugin<Options = any, Name extends string = string> {
    name: Name;
    apply: (params: {
        options: Options | undefined;
@@ -84,6 +90,7 @@
     data?: Data;
     icon?: Icon;
     nonce?: string;
+    base?: Base;
     // content
     htmlAttributes?: Attributes;
     meta?: Meta[];
@@ -110,7 +117,7 @@
    ? {[K in Name & string]: Options}
    : {};

 type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void
    ? I
    : never;


diff --git a/src/utils/generateRenderContent.ts b/src/utils/generateRenderContent.ts
@@ -71,13 +71,14 @@ export function generateRenderContent<Plugins extends Plugin[], Data>(
         links.unshift({rel: 'icon', type: icon.type, sizes: icon.sizes, href: icon.href});
     }
 
-    const {lang, isMobile, title, pluginsOptions = {}} = params;
+    const {lang, isMobile, title, base = {}, pluginsOptions = {}} = params;
     for (const plugin of plugins ?? []) {
         plugin.apply({
             options: hasProperty(pluginsOptions, plugin.name)
                 ? pluginsOptions[plugin.name]
                 : undefined,
             renderContent: {
+                base,
                 htmlAttributes,
                 meta,
                 links,
@@ -99,6 +100,7 @@ export function generateRenderContent<Plugins extends Plugin[], Data>(
     }
 
     return {
+        base,
         htmlAttributes,
         meta,
         links,

diff --git a/src/utils/renderHeadContent.ts b/src/utils/renderHeadContent.ts
@@ -1,11 +1,23 @@
 import type {HeadContent} from '../types.js';
 
 export function renderHeadContent(content: HeadContent): string {
-    const {scripts, helpers, links, meta, styleSheets, inlineStyleSheets, inlineScripts, title} =
-        content;
+    const {
+        base,
+        scripts,
+        helpers,
+        links,
+        meta,
+        styleSheets,
+        inlineStyleSheets,
+        inlineScripts,
+        title,
+    } = content;
+
+    const baseAttrs = base ? helpers.attrs({...base}) : '';
 
     return `
         <meta charset="utf-8">
+        ${baseAttrs ? `<base ${baseAttrs}>` : ''}
         <title>${title}</title>
         ${[
             ...scripts.map(({src, crossOrigin}) =>
-Original file line number
+Diff line change
@@ Expand Up / @@ -12,6 +12,7 @@ export { @@
     } from './plugins/index.js';
     export type {
+        Base,
         Plugin,
         Icon,
         Link,
@@ Expand Down @@