@nutin/cli 2.0.0 → 2.1.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 2.1.0
+
+### Breaking Changes
+
+- `View`'s `viewName` is now a required constructor option. Every `View` subclass must now pass `viewName` explicitly.
+- Removed the `generator` object from `nutin.config.js`. The generator now always scaffolds a stylesheet, and gates locale/test file generation on the existing `i18n` and `testinNutin.includeApp` flags.
+
+### Fixes
+
+- Restored `document.title` updates on route change, regressed silently in 2.0.0's rewrite, default to the view's `viewName`.
+- Fixed leaked-listener/subscription bug that affected every re-rendering component. Previously-mounted child components (single or catalog) are now properly destroyed before a re-render mounts their replacements.
+- `HttpClient`'s constructor `defaultHeaders` are now actually merged into outgoing requests (previously silently dropped — only per-call `config.headers` were sent).
+- `data-optional` elements with literal `"null"` text content (e.g. `<span data-optional>null</span>`) are now correctly removed, matching the existing `"undefined"` handling.
+- `revealGlobals` now restores the element's original `display` value by default (captured automatically by `hideGlobals`), instead of always forcing `block`; an optional second argument still allows an explicit override.
+- A `data-pipe` chain segment with an empty name (e.g. `data-pipe=":arg"`) now logs a warning and is skipped, instead of silently aborting the entire chain with no write-back.
+- Removed a redundant duplicate translation-file fetch on startup when i18n is enabled.
+
 ## 2.0.0
 
 Version 2.0.0 focuses on simplicity and clear APIs over feature accumulation: fewer abstractions, clearer responsibilities, and a more focused API. 

package/README.md

@@ -32,15 +32,12 @@ npx @nutin/cli
 nutin-update
 ```
 
-## Add Docker
+## Add Feature
 
 ```bash
-# ready-to-use Dockerfile for Nutin apps
-nutin-add docker
+nutin-add <feature>
 ```
 
-## Useful links
+## Documentation
 
-- [Nutin website](https://www.nutin.org)
-- [First app tutorial](https://www.nutin.org/tutorial)
-- [Repository documentation](https://github.com/LoisKOUNINEF/nutin/tree/main/docs)
+- [Repository documentation](https://github.com/LoisKOUNINEF/nutin/tree/main/docs/API.md)

package/lib/src/create-app/success-message.mjs

@@ -3,12 +3,11 @@ import { PACKAGE_HOMEPAGE } from '../common/package-data.mjs';
 
 export function displaySuccessMessage(answers) {
   const { projectName, packageManager, deployHelper } = answers;
+  print.info(`Visit https://${PACKAGE_HOMEPAGE}`);
+
   print.boldSuccess('\n🎉 Your project is ready!\n');
 
   print.boldInfo('Next steps:');
   print.info(`cd ${projectName}`);
   print.info(`${packageManager} run serve\n`);
-
-  print.boldInfo('Documentation:');
-  print.info(`https://${PACKAGE_HOMEPAGE}\n`);
 }

package/lib/src/update-app/project-updater.mjs

@@ -98,6 +98,12 @@ export class ProjectUpdater {
     }
 
     if (!yes && (toUpdate.length > 0 || toAdd.length > 0)) {
+      if (!process.stdin.isTTY) {
+        print.warn('\n⚠️ Non-interactive shell detected — skipping the confirmation prompt.');
+        print.boldInfo('Re-run with --yes to apply these updates automatically. No files were changed.');
+        return;
+      }
+
       const { proceed } = await inquirer.prompt([
         {
           type: 'confirm',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutin/cli",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "The structure of a framework. The freedom of vanilla.",
   "preferGlobal": true,
   "main": "lib/index.mjs",

package/templates/base/AGENTS.md.hbs

@@ -119,7 +119,6 @@ AppPipeRegistry.register('json');
 
 Central options/tools config (see the inline comments for details):
 - `i18n`, `tailwind`, `generateSEO`, `dockerPorts` — top-level feature toggles (`dockerPorts` only applies once the docker feature is added).
-- `generator.{generateStylesheet, generateLocales, generateTest}` — what the generator scaffolds alongside new elements.
 - `builder.{sass.paths, esbuild}` — build pipeline behavior.
 - `testinNutin.{includeFramework, includeTools, includeApp, jsdomOptions}` — test discovery/environment.
 

package/templates/base/GETTING_STARTED.md.hbs

@@ -3,20 +3,17 @@
 ## Table of contents
 
 - [Project structure](#project-structure)
-- [Running your app](#running-your-app)
-- [Generate components, views and services](#generate-components-views-and-services)
-- [A typical component](#a-typical-component)
-- [Features and configuration](#features-and-configuration)
+- [How do I run my app?](#running-your-app)
+- [How do I generate components, views and services?](#generate-components-views-and-services)
+- [What does a typical component look like?](#a-typical-component)
+- [Options and configuration](#options-and-configuration)
 - [Styling](#styling)
-- [Global layout components](#global-layout-components)
 - [Testing](#testing)
-- [Useful links](#useful-links)
+- [Go further](#go-further)
 
 ## Project structure
 
 ```
-config/   -- configure i18n and SEO files
-
 src/
   app/
     components/
@@ -33,7 +30,15 @@ tools/    -- build, development, generator and testing
 nutin.config.js   -- features and configuration
 ```
 
-## Running your app
+### Imports
+
+Imports use **relative paths** and end with `.js` extension.
+
+```js
+import { Foo } from 'relative/path/to/foo.js';
+```
+
+## How do I run my app?
 
 ```bash
 # Development
@@ -45,15 +50,7 @@ nutin.config.js   -- features and configuration
 {{packageManager}} run build:prod # build the application for production
 ```
 
-### Imports
-
-Imports must use **relative paths** and end with `.js` extension.
-
-```js
-import { Foo } from 'relative/path/to/foo.js';
-```
-
-## Generate components, views and services
+## How do I generate components, views and services?
 
 Generated elements are automatically exported from the corresponding barrel file:
 `src/app/<components|views|services>/index.ts`.
@@ -67,7 +64,7 @@ Generated elements are automatically exported from the corresponding barrel file
 {{packageManager}} run generate component path/to/my-component/ # Target dir: src/app/components/path/to/my-component/
 ```
 
-## A typical component
+## What does a typical component look like?
 
 ```bash
 components/
@@ -146,29 +143,21 @@ A template can also be written directly inline (skip the `.html` file and the pl
 
 Defining both an inline template and an external `.html` file, or neither, fails the build.
 
-## Features and configuration
-
-Nutin features are enabled in `nutin.config.js`.
+## Options and configuration
 
-### `nutin.config.js`
+### Main file
 
-Main Nutin configuration and tool options. See the inline comments for details.
+`nutin.config.js` - Main Nutin configuration and tool options. See the inline comments for details.
 
-- `tailwind`, `i18n`, `generateSEOFiles` — top-level features, `false` by default.
-- `generator.*` — controls what the generator scaffolds.
+- `tailwind`, `i18n`, `generateSEOFiles` — top-level features, `false` by default. 
+See [Options and features](https://github.com/LoisKOUNINEF/nutin/tree/main/docs/OPTIONS_AND_FEATURES.md).
 - `builder.*` — controls build behavior.
-- `testinNutin.*` — controls TestinNutin.
-
-### `config/seo.json`
-
-- Register your routes' description, title and ogImage here.
-- Data is used to generate static `index.html` per route, `robots.txt`, and `sitemap.xml`.
-- Unused if `nutin.config.js -> generateSEOFiles` is disabled.
+- `testinNutin.*` — controls Nutin's built-in testing toolkit.
 
-### `config/languages.json`
+### Specialized files
 
-- Register supported languages for i18n here.
-- Unused if `nutin.config.js -> i18n` is disabled.
+- `config/seo.json` - with `generateSEOFiles` enabled. Register your routes' description, title and ogImage here.
+- `config/languages.json` - with `i18n` enabled. Register supported languages here.
 
 ## Styling
 
@@ -178,26 +167,11 @@ Main Nutin configuration and tool options. See the inline comments for details.
 
 **Note:** Installing Tailwind CSS dependencies may print `npm warn install-scripts`. This is expected with npm 12's default install-script allowlisting and is safe to ignore.
 
-## Global layout components
-
-If you need components to render outside `<main>` (such as a header or footer), register them with `registerGlobals()` in `main.ts` constructor.
-
-Global components are mounted directly in `<body>` and remain present across route changes. Use `before` for components that should appear before `<main>` and `after` for components that should appear after it.
-
-```ts
-registerGlobals({
-  before: [{ component: HeaderComponent, id: 'header' }],
-  after: [{ component: FooterComponent, id: 'footer' }],
-});
-```
-
-**Note**: `hideGlobals(globalIds: string[])` / `revealGlobals(globalIds: string[])` are exported alongside `registerGlobals` and can be called to toggle visibility of the ids you registered.
-
 ## Testing
 
 You can use any testing tool you prefer for application code.
 
-This project includes TestinNutin, Nutin's lightweight testing toolkit. Nutin itself is tested exclusively with it, and the tests are included in the generated project so you can:
+This project includes [testin-nutin](https://github.com/LoisKOUNINEF/nutin/tree/main/docs/TESTING.md), Nutin's lightweight testing toolkit. Nutin itself is tested exclusively with it, and the tests are included in the generated project so you can:
 - use them as executable documentation;
 - run and modify Nutin's tests when modifying its code.
 
@@ -205,7 +179,7 @@ Run the tests with:
 
 `{{packageManager}} run testin-nutin`
 
-To use TestinNutin for application tests, enable:
+To use testin-nutin for application tests, enable:
 
 ```js
 // nutin.config.js
@@ -218,10 +192,8 @@ testinNutin: {
 import { MyModule } from '#root/dist/src/path/to/my-module.js';
 ```
 
-See **[TestinNutin docs](https://nutin.org/docs/testin-nutin)**.
+## Go further
 
-## Useful links
-
-- [Nutin website](https://www.nutin.org)
+- [Repository documentation](https://github.com/LoisKOUNINEF/nutin/tree/main/docs/API.md)
 - [First app tutorial](https://www.nutin.org/tutorial)
-- [Repository documentation](https://github.com/LoisKOUNINEF/nutin/tree/main/docs)
+- [Nutin website](https://www.nutin.org)

package/templates/base/nutin.config.js.hbs

@@ -3,13 +3,6 @@ export default {
   tailwind: false,         // Enable Tailwind CSS v4
   i18n: false,             // Enable i18n; configure languages in config/languages.json
   generateSEOFiles: false, // Generate per-route HTML, robots.txt and sitemap.xml; configure SEO data in config/seo.json
-  
-  // Components / Views scaffolding
-  generator: {
-    generateStylesheet: false, // Generate a .scss file alongside each component or view
-    generateLocales: false,    // Generate locale files alongside components and views (requires i18n)
-    generateTest: false,       // Generate test files alongside components, views and services (requires testinNutin.includeApp)
-  },
 
   // Build pipeline
   builder: {

package/templates/base/src/app/main.ts.hbs

@@ -12,7 +12,6 @@ class App {
 document.addEventListener('DOMContentLoaded', async () => {
   if (nutinConfig.i18n) {
     await I18nService.initTranslations();
-    await I18nService.loadTranslations(I18nService.currentLanguage);
   }
   new App();
 });

package/templates/base/src/app/views/home/home.view.ts.hbs

@@ -4,6 +4,6 @@ const template = `__TEMPLATE_PLACEHOLDER__`;
 
 export class HomeView extends View {
   constructor() {
-    super({template});
+    super({ template, viewName: 'home' });
   }
 }

package/templates/base/src/app/views/not-found/not-found.view.ts.hbs

@@ -4,7 +4,7 @@ const template = `__TEMPLATE_PLACEHOLDER__`;
 
 export class NotFoundView extends View {
   constructor() {
-    super({template});
+    super({ template, viewName: 'not-found' });
   }
 
   private _handleHome(): void {

package/templates/base/src/core/base-classes/base-component/helpers/children.helper.test.js.hbs

@@ -62,6 +62,28 @@ describe('ChildrenHelper', () => {
     expect(children.length).toBe(0);
   });
 
+  it('destroys previously-tracked children and resets the array before mounting new ones on a second call', () => {
+    let destroyCount = 0;
+    element.innerHTML = '<div data-component="widget"></div>';
+    const component = {
+      registerChildren: () => [{
+        selector: 'widget',
+        factory: () => ({ render: () => {}, destroy: () => destroyCount++ }),
+      }],
+    };
+
+    const children = [];
+    ChildrenHelper.addChildren(component, element, children);
+    expect(children.length).toBe(1);
+    expect(destroyCount).toBe(0);
+
+    element.innerHTML = '<div data-component="widget"></div>';
+    ChildrenHelper.addChildren(component, element, children);
+
+    expect(destroyCount).toBe(1);
+    expect(children.length).toBe(1);
+  });
+
   it('destroyChildren calls destroy on every child', () => {
     let destroyCount = 0;
     const children = [

package/templates/base/src/core/base-classes/base-component/helpers/children.helper.ts.hbs

@@ -2,10 +2,13 @@ import { BaseComponent, ComponentConfig } from '../base-component.js';
 
 export class ChildrenHelper {
   public static addChildren(
-    component: BaseComponent, 
-    element: HTMLElement, 
+    component: BaseComponent,
+    element: HTMLElement,
     children: BaseComponent[]
   ): void {
+    this.destroyChildren(children);
+    children.length = 0;
+
     const configs: ComponentConfig[] = component.registerChildren();
     configs.forEach(config => {
       element.querySelectorAll(`[data-component="${config.selector}"]`).forEach(el => {

package/templates/base/src/core/base-classes/base-component/helpers/dom.helper.test.js.hbs

@@ -109,6 +109,12 @@ describe('DomHelper', () => {
     expect(container.querySelector('span')).toBe(null);
   });
 
+  it('cleanupOptionalContent removes an optional element whose textContent is the literal string "null"', () => {
+    container.innerHTML = '<span data-optional>null</span>';
+    DomHelper.cleanupOptionalContent();
+    expect(container.querySelector('span')).toBe(null);
+  });
+
   it('cleanupOptionalContent keeps an optional element with real textContent', () => {
     container.innerHTML = '<span data-optional>hello</span>';
     DomHelper.cleanupOptionalContent();

package/templates/base/src/core/base-classes/base-component/helpers/dom.helper.ts.hbs

@@ -40,7 +40,7 @@ export class DomHelper {
       }
 
       const content = el.textContent?.trim();
-      return !content || content === "undefined";
+      return !content || content === "undefined" || content === "null";
     };
 
     const isValueUndefined = (el: HTMLElement): boolean => {

package/templates/base/src/core/base-classes/base-component/helpers/pipe.helper.test.js.hbs

@@ -74,9 +74,16 @@ describe('PipeHelper', () => {
     expect(container.querySelector('input').value).toBe('FROM SOURCE');
   });
 
-  it('stops processing pipes when a pipe segment resolves to an empty name', () => {
-    container.innerHTML = '<span data-pipe=":arg">hi</span>';
+  it('warns and skips a pipe segment that resolves to an empty name, continuing the rest of the chain', () => {
+    const warnSpy = spyOn(console, 'warn');
+    warnSpy.andCallFake(() => {});
+
+    container.innerHTML = '<span data-pipe=":arg|upper">hi</span>';
     PipeHelper.parsePipeAttributes(container);
-    expect(container.querySelector('span').textContent).toBe('hi');
+
+    expect(container.querySelector('span').textContent).toBe('HI');
+    expect(warnSpy.callCount).toBe(1);
+
+    warnSpy.restore();
   });
 });

package/templates/base/src/core/base-classes/base-component/helpers/pipe.helper.ts.hbs

@@ -29,7 +29,10 @@ export class PipeHelper {
     for (const pipe of pipes) {
       const [pipeName, ...argParts] = pipe.split(':');
 
-      if(!pipeName) return;
+      if (!pipeName) {
+        console.warn(`Empty pipe name in segment "${pipe}" - skipping.`);
+        continue;
+      }
 
       const args = argParts.length ? argParts.join(':').split(',') : [];
       value = AppPipeRegistry.apply(pipeName.trim(), value, args.map(a => a.trim()));

package/templates/base/src/core/base-classes/view/view.test.js.hbs

@@ -1,7 +1,6 @@
 import { View } from '#root/dist/src/core/index.js';
 
 class HomeView extends View {}
-class MyFancyView extends View {}
 class NamedView extends View {}
 
 describe('View', () => {
@@ -16,38 +15,36 @@ describe('View', () => {
     app = null;
   });
 
-  it('derives a kebab-case viewName from the class name, stripping a trailing "View"', () => {
-    const view = new HomeView({});
-    expect(view.viewName).toBe('home');
+  it('throws when viewName is omitted', () => {
+    expect(() => new HomeView({})).toThrow();
   });
 
-  it('derives a kebab-case viewName for a multi-word class name', () => {
-    const view = new MyFancyView({});
-    expect(view.viewName).toBe('my-fancy');
+  it('throws when viewName is an empty string', () => {
+    expect(() => new HomeView({ viewName: '' })).toThrow();
   });
 
-  it('uses an explicit viewName option instead of deriving one', () => {
+  it('uses the explicit viewName option', () => {
     const view = new NamedView({ viewName: 'custom-name' });
     expect(view.viewName).toBe('custom-name');
   });
 
   it('generateTemplate() returns the constructor template', () => {
-    const view = new HomeView({ template: '<p>hi</p>' });
+    const view = new HomeView({ viewName: 'home', template: '<p>hi</p>' });
     expect(view.render().innerHTML).toBe('<p>hi</p>');
   });
 
   it('defaults the template to an empty string', () => {
-    const view = new HomeView({});
+    const view = new HomeView({ viewName: 'home' });
     expect(view.render().innerHTML).toBe('');
   });
 
   it('defaults the tagName to "section"', () => {
-    const view = new HomeView({});
+    const view = new HomeView({ viewName: 'home' });
     expect(view.getElement().tagName).toBe('SECTION');
   });
 
   it('setRouteParams/getRouteParams/getRouteParam/hasRouteParam manage route params', () => {
-    const view = new HomeView({});
+    const view = new HomeView({ viewName: 'home' });
     expect(view.hasRouteParam('id')).toBe(false);
     expect(view.getRouteParam('id')).toBeUndefined();
 
@@ -59,7 +56,7 @@ describe('View', () => {
   });
 
   it('getRouteParams() returns a copy, not a live reference', () => {
-    const view = new HomeView({});
+    const view = new HomeView({ viewName: 'home' });
     view.setRouteParams({ id: '1' });
     const params = view.getRouteParams();
     params.id = 'mutated';
@@ -67,7 +64,7 @@ describe('View', () => {
   });
 
   it('onEnter and onExit are present as no-op hooks', () => {
-    const view = new HomeView({});
+    const view = new HomeView({ viewName: 'home' });
     expect(() => view.onEnter()).not.toThrow();
     expect(() => view.onExit()).not.toThrow();
   });

package/templates/base/src/core/base-classes/view/view.ts.hbs

@@ -1,11 +1,11 @@
 import { BaseComponent, BaseComponentOptions } from '../../index.js';
 
 export interface ViewOptions extends BaseComponentOptions {
-  viewName?: string;
+  viewName: string;
 }
 
 export abstract class View<T extends HTMLElement = HTMLElement> extends BaseComponent<T> {
-  public viewName: string;
+  private _viewName: string;
   protected routeParams: Record<string, string> = {};
   private _template: string;
 
@@ -17,8 +17,13 @@ export abstract class View<T extends HTMLElement = HTMLElement> extends BaseComp
     trustLevel,
   }: ViewOptions) {
     super({ mountTarget, tagName, trustLevel });
+    if (!viewName) throw new Error('View requires a viewName.');
     this._template = template ?? '';
-    this.viewName = viewName || this.getKebabCaseViewName();
+    this._viewName = viewName;
+  }
+
+  public get viewName(): string {
+    return this._viewName;
   }
 
   protected override generateTemplate(): string {
@@ -41,12 +46,6 @@ export abstract class View<T extends HTMLElement = HTMLElement> extends BaseComp
     return key in this.routeParams && this.routeParams[key] !== undefined;
   }
 
-  private getKebabCaseViewName(): string {
-    const className = this.constructor.name;
-    const baseName = className.replace(/View$/, '');
-    return baseName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
-  }
-
   // Navigation hooks — called by router only, never by render lifecycle
   public onEnter(): void {}
   public onExit(): void {}

package/templates/base/src/core/config.ts.hbs

@@ -1,7 +1,10 @@
 import langs from '../../config/languages.json' with { type: 'json' };
+import seo from '../../config/seo.json' with { type: 'json' };
 import nutinConfig from '../../nutin.config.js';
 
 export const CONFIG = {
   langs,
+  seo,
   i18n: nutinConfig.i18n,
+  generateSEOFiles: nutinConfig.generateSEOFiles,
 } as const;

package/templates/base/src/core/services/globals/globals.test.js.hbs

@@ -106,6 +106,9 @@ describe('globals (hideGlobals/revealGlobals)', () => {
     [...document.body.children].forEach((el) => {
       if (el.id !== 'app') el.remove();
     });
+    // Globals is a process-wide singleton - drop its captured-display state so
+    // a later test's ids can't inherit an earlier test's original display value.
+    Globals.testingResetAll();
   });
 
   it('toggle display for every given id that is present', () => {
@@ -146,4 +149,39 @@ describe('globals (hideGlobals/revealGlobals)', () => {
     expect(() => hideGlobals(['missing'])).not.toThrow();
     expect(() => revealGlobals(['missing'])).not.toThrow();
   });
+
+  it('revealGlobals restores the display value captured when hideGlobals was called', () => {
+    const header = document.createElement('div');
+    header.id = 'header';
+    header.style.display = 'flex';
+    document.body.appendChild(header);
+
+    hideGlobals(['header']);
+    expect(header.style.display).toBe('none');
+
+    revealGlobals(['header']);
+    expect(header.style.display).toBe('flex');
+  });
+
+  it('revealGlobals accepts an explicit display override that wins over the captured value', () => {
+    const header = document.createElement('div');
+    header.id = 'header';
+    header.style.display = 'flex';
+    document.body.appendChild(header);
+
+    hideGlobals(['header']);
+    revealGlobals(['header'], 'inline-block');
+
+    expect(header.style.display).toBe('inline-block');
+  });
+
+  it('revealGlobals falls back to "block" when there is no prior hideGlobals call for that id', () => {
+    const header = document.createElement('div');
+    header.id = 'header';
+    document.body.appendChild(header);
+
+    revealGlobals(['header']);
+
+    expect(header.style.display).toBe('block');
+  });
 });

package/templates/base/src/core/services/globals/globals.ts.hbs

@@ -21,6 +21,7 @@ export interface RegisterGlobalsOptions {
 
 export class Globals extends Service<Globals> {
   private _mounted: Record<string, GlobalMountable> = {};
+  private _originalDisplay: Record<string, string> = {};
 
   constructor() { super(); }
 
@@ -51,23 +52,28 @@ export class Globals extends Service<Globals> {
   }
 
   public hide(globalIds: string[]): void {
-    this.setDisplay(globalIds, 'none');
-  }
-
-  public reveal(globalIds: string[]): void {
-    this.setDisplay(globalIds, 'block');
+    globalIds.forEach((id) => {
+      const el = document.getElementById(id) as HTMLElement | null;
+      if (!el) return;
+      if (!(id in this._originalDisplay)) {
+        this._originalDisplay[id] = el.style.display || getComputedStyle(el).display;
+      }
+      el.style.display = 'none';
+    });
   }
 
-  private setDisplay(globalIds: string[], display: 'none' | 'block'): void {
+  public reveal(globalIds: string[], display?: string): void {
     globalIds.forEach((id) => {
       const el = document.getElementById(id) as HTMLElement | null;
-      if (el) el.style.display = display;
+      if (!el) return;
+      el.style.display = display ?? this._originalDisplay[id] ?? 'block';
     });
   }
 
   protected onDestroy(): void {
     Object.values(this._mounted).forEach((instance) => instance.destroy?.());
     this._mounted = {};
+    this._originalDisplay = {};
   }
 }
 
@@ -89,7 +95,10 @@ export const hideGlobals = (globalIds: string[]): void => {
   Globals.getInstance().hide(globalIds);
 };
 
-/** Reveal the elements with the given ids (as registered via `registerGlobals`). */
-export const revealGlobals = (globalIds: string[]): void => {
-  Globals.getInstance().reveal(globalIds);
+/**
+ * Reveal the elements with the given ids (as registered via `registerGlobals`), restoring
+ * each element's display value as captured by `hideGlobals` — pass `display` to override.
+ */
+export const revealGlobals = (globalIds: string[], display?: string): void => {
+  Globals.getInstance().reveal(globalIds, display);
 };

package/templates/base/src/core/services/http-client/http-client.test.js.hbs

@@ -197,13 +197,41 @@ describe('HttpClient', () => {
 
   it('should handle custom headers', async () => {
     fetchMock.mockJsonResponse('https://api.example.com/users', []);
-    
+
     await httpClient.get('https://api.example.com/users', { headers: { 'Authorization': 'Bearer custom-token' } });
-    
+
     const lastCall = fetchMock.getLastCall();
     expect(lastCall.options.headers['Authorization']).toBe('Bearer custom-token');
   });
 
+  it('should send the constructor default headers on a request with no custom headers', async () => {
+    fetchMock.mockJsonResponse('https://api.example.com/users', []);
+
+    await httpClient.get('https://api.example.com/users');
+
+    const lastCall = fetchMock.getLastCall();
+    expect(lastCall.options.headers['Content-Type']).toBe('application/json');
+  });
+
+  it('should merge default headers with per-call headers on different keys', async () => {
+    fetchMock.mockJsonResponse('https://api.example.com/users', []);
+
+    await httpClient.get('https://api.example.com/users', { headers: { 'Authorization': 'Bearer custom-token' } });
+
+    const lastCall = fetchMock.getLastCall();
+    expect(lastCall.options.headers['Content-Type']).toBe('application/json');
+    expect(lastCall.options.headers['Authorization']).toBe('Bearer custom-token');
+  });
+
+  it('should let a per-call header override a default header on the same key', async () => {
+    fetchMock.mockJsonResponse('https://api.example.com/users', []);
+
+    await httpClient.get('https://api.example.com/users', { headers: { 'Content-Type': 'text/plain' } });
+
+    const lastCall = fetchMock.getLastCall();
+    expect(lastCall.options.headers['Content-Type']).toBe('text/plain');
+  });
+
   it('should invoke request interceptors with the final url and options before sending', async () => {
     fetchMock.mockJsonResponse('https://api.example.com/users', []);
     const calls = [];

package/templates/base/src/core/services/http-client/http-client.ts.hbs

@@ -56,7 +56,10 @@ export class HttpClient extends Service<HttpClient> {
   ): Promise<T> {
     const { controller, timeoutId } = HttpManager.createAbortController(config?.timeout);
     const fullUrl = `${this._baseUrl}${endpoint}`;
-    const mergedConfig = { ...this._defaultHeaders, ...config };
+    const mergedConfig: IRequestConfig = {
+      ...config,
+      headers: { ...this._defaultHeaders, ...config?.headers },
+    };
 
     try {
       const url = HttpBuilder.buildRequestUrl(fullUrl, config?.queryParams);

package/templates/base/src/core/services/router/helpers/navigation-manager.helper.test.js.hbs

@@ -191,4 +191,112 @@ describe('NavigationManager', () => {
   it('matchPattern returns null when the path does not match the pattern at all', () => {
     expect(NavigationManager.matchPattern('/posts/:id', '/other/123')).toBe(null);
   });
+
+  it('updateDocumentTitle falls back to the view\'s viewName when generateSEOFiles is disabled', () => {
+    CONFIG.generateSEOFiles = false;
+    CONFIG.seo = { routes: [{ path: '/', title: 'Should not be used' }] };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('home');
+    } finally {
+      CONFIG.generateSEOFiles = false;
+    }
+  });
+
+  it('updateDocumentTitle falls back to the view\'s viewName when no seo.json route matches the pattern', () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/other', title: 'Other' }] };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('home');
+    } finally {
+      CONFIG.generateSEOFiles = false;
+    }
+  });
+
+  it('updateDocumentTitle uses a flat seo.json title when generateSEOFiles is enabled and the pattern matches', () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/', title: 'My App — Home' }] };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('My App — Home');
+    } finally {
+      CONFIG.generateSEOFiles = false;
+    }
+  });
+
+  it('updateDocumentTitle resolves a per-language seo.json title to the current language', () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/', title: { en: 'Home', fr: 'Accueil' } }] };
+    I18nService['_LANGUAGES'] = ['en', 'fr'];
+    I18nService['_currentLanguage'] = 'fr';
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('Accueil');
+    } finally {
+      CONFIG.generateSEOFiles = false;
+      I18nService['_currentLanguage'] = 'en';
+    }
+  });
+
+  it('updateDocumentTitle falls back to the default language, then any available language, then viewName', () => {
+    CONFIG.generateSEOFiles = true;
+    I18nService['_LANGUAGES'] = ['en', 'fr'];
+
+    CONFIG.seo = { routes: [{ path: '/', title: { fr: 'Accueil' } }] };
+    I18nService['_currentLanguage'] = 'en';
+    try {
+      // current lang ('en') missing -> falls back to default lang's value, present here as 'fr' only,
+      // so it falls further to the first available value
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('Accueil');
+
+      CONFIG.seo = { routes: [{ path: '/', title: {} }] };
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('home');
+    } finally {
+      CONFIG.generateSEOFiles = false;
+      I18nService['_currentLanguage'] = 'en';
+    }
+  });
+
+  it('updateDocumentTitle uses the view\'s locale title when i18n is enabled and no seo.json route matches', () => {
+    CONFIG.i18n = true;
+    CONFIG.generateSEOFiles = false;
+    I18nService['_translations'] = { home: { title: 'Accueil' } };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('Accueil');
+    } finally {
+      CONFIG.i18n = false;
+      I18nService['_translations'] = {};
+    }
+  });
+
+  it('updateDocumentTitle prefers seo.json title over the locale title when both are present', () => {
+    CONFIG.i18n = true;
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/', title: 'From seo.json' }] };
+    I18nService['_translations'] = { home: { title: 'From locale' } };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('From seo.json');
+    } finally {
+      CONFIG.i18n = false;
+      CONFIG.generateSEOFiles = false;
+      I18nService['_translations'] = {};
+    }
+  });
+
+  it('updateDocumentTitle ignores the locale title when i18n is disabled, falling back to viewName', () => {
+    CONFIG.i18n = false;
+    CONFIG.generateSEOFiles = false;
+    I18nService['_translations'] = { home: { title: 'Should not be used' } };
+    try {
+      NavigationManager.updateDocumentTitle({ viewName: 'home' }, '/');
+      expect(document.title).toBe('home');
+    } finally {
+      I18nService['_translations'] = {};
+    }
+  });
 });

package/templates/base/src/core/services/router/helpers/navigation-manager.helper.ts.hbs

@@ -1,4 +1,4 @@
-import { I18nService } from "../../../index.js";
+import { I18nService, View } from "../../../index.js";
 import { Language } from "../../i18n/languages.js";
 import { CONFIG } from "../../../config.js";
 
@@ -60,6 +60,22 @@ export class NavigationManager {
     return this.normalizePath(window.location.pathname);
   }
 
+  public static updateDocumentTitle(view: View, pattern: string): void {
+    const route = CONFIG.generateSEOFiles
+      ? CONFIG.seo?.routes?.find((r) => r.path === pattern)
+      : undefined;
+    const seoTitle = route?.title ? this.resolveSeoTitle(route.title) : undefined;
+    const localeTitle = CONFIG.i18n ? I18nService.getTranslationObject<string>(`${view.viewName}.title`) : null;
+    document.title = seoTitle || localeTitle || view.viewName;
+  }
+
+  private static resolveSeoTitle(title: string | Record<string, string>): string | undefined {
+    if (typeof title !== 'object') return title;
+    const lang = I18nService.currentLanguage;
+    const defaultLang = I18nService.defaultLanguage;
+    return title[lang] ?? title[defaultLang] ?? Object.values(title)[0];
+  }
+
   public static matchPattern(pattern: string, path: string): Record<string, string> | null {
     const paramNames: string[] = [];
 

package/templates/base/src/core/services/router/router.test.js.hbs

@@ -21,6 +21,7 @@ describe('Router', () => {
 
   beforeEach(() => {
     CONFIG.i18n = false;
+    CONFIG.generateSEOFiles = false;
     window.history.pushState({}, '', '/');
   });
 
@@ -30,6 +31,7 @@ describe('Router', () => {
       router = null;
     }
     CONFIG.i18n = false;
+    CONFIG.generateSEOFiles = false;
     window.history.pushState({}, '', '/');
   });
 
@@ -211,6 +213,82 @@ describe('Router', () => {
     expect(home.calls.some(c => c[0] === 'render')).toBe(true);
   });
 
+  it('sets document.title to the view\'s viewName when generateSEOFiles is disabled', async () => {
+    CONFIG.generateSEOFiles = false;
+    CONFIG.seo = { routes: [{ path: '/', title: 'Should not be used' }] };
+
+    const home = makeView('home');
+    router = AppRouter({ '/': () => home });
+    await flushPromises();
+
+    expect(document.title).toBe('home');
+  });
+
+  it('falls back to the view\'s viewName when generateSEOFiles is enabled but no seo.json route matches', async () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [] };
+
+    const home = makeView('home');
+    router = AppRouter({ '/': () => home });
+    await flushPromises();
+
+    expect(document.title).toBe('home');
+  });
+
+  it('sets document.title from config/seo.json when generateSEOFiles is enabled and a route matches', async () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/', title: 'My App — Home' }] };
+
+    const home = makeView('home');
+    router = AppRouter({ '/': () => home });
+    await flushPromises();
+
+    expect(document.title).toBe('My App — Home');
+  });
+
+  it('sets document.title for the /404 route', async () => {
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/404', title: 'Not Found' }] };
+
+    const home = makeView('home');
+    const notFound = makeView('not-found');
+    router = AppRouter({ '/': () => home, '/404': () => notFound });
+    await flushPromises();
+
+    await router.navigate('/nope');
+
+    expect(document.title).toBe('Not Found');
+  });
+
+  it('resolves a per-language title when i18n is enabled', async () => {
+    CONFIG.i18n = true;
+    CONFIG.generateSEOFiles = true;
+    CONFIG.seo = { routes: [{ path: '/', title: { en: 'Home', fr: 'Accueil' } }] };
+    I18nService['_LANGUAGES'] = ['en', 'fr'];
+    I18nService['_currentLanguage'] = 'fr';
+
+    const home = makeView('home');
+    router = AppRouter({ '/': () => home });
+    await flushPromises();
+
+    expect(document.title).toBe('Accueil');
+
+    I18nService['_currentLanguage'] = 'en';
+  });
+
+  it('falls back to the view\'s locale title when i18n is enabled and no seo.json route matches', async () => {
+    CONFIG.i18n = true;
+    I18nService['_translations'] = { home: { title: 'Accueil' } };
+
+    const home = makeView('home');
+    router = AppRouter({ '/': () => home });
+    await flushPromises();
+
+    expect(document.title).toBe('Accueil');
+
+    I18nService['_translations'] = {};
+  });
+
   it('removeEventListeners() stops the router from responding to further navigate/popstate events', async () => {
     const home = makeView('home');
     const about = makeView('about');

package/templates/base/src/core/services/router/router.ts.hbs

@@ -15,6 +15,7 @@ export type IRouter = InstanceType<typeof Router>;
 export interface RouteMatch {
   route: RouteConfig;
   params: Record<string, string>;
+  pattern: string;
 }
 
 class Router extends Service<Router> {
@@ -69,10 +70,11 @@ class Router extends Service<Router> {
     this._currentView = await ViewRenderManager.transitionOutCurrentView(this._currentView);
     this._currentParams = routeMatch.params;
     this._currentView = ViewRenderManager.renderNewView(
-      guardResult.viewConstructor!, 
+      guardResult.viewConstructor!,
       routeMatch.params
     );
-    
+
+    NavigationManager.updateDocumentTitle(this._currentView, routeMatch.pattern);
     NavigationManager.updateHistory(normalizedPath, currentPath, pushState);
     window.scrollTo({ top: 0 });
   }
@@ -122,7 +124,7 @@ class Router extends Service<Router> {
     for (const [pattern, routeConfig] of Object.entries(this.routes)) {
       const match = NavigationManager.matchPattern(pattern, path);
       if (match) {
-        return { route: routeConfig, params: match };
+        return { route: routeConfig, params: match, pattern };
       }
     }
     return null;
@@ -145,7 +147,8 @@ class Router extends Service<Router> {
     this._currentView = await ViewRenderManager.transitionOutCurrentView(this._currentView);
     this._currentParams = {};
     this._currentView = ViewRenderManager.renderNewView(notFoundConstructor, {});
-    
+
+    NavigationManager.updateDocumentTitle(this._currentView, '/404');
     NavigationManager.updateHistory(normalizedPath, currentPath, pushState);
   }
 

package/templates/base/tools/generator/generator.js.hbs

@@ -27,7 +27,7 @@ const creators = {
     try {
       generateFile({ name, targetPath, templateFn: serviceTemplate, suffix: suffix });
       appendToIndex({ name, targetPath, suffix: suffix });
-      if (nutinConfig.generator.generateTest) await generateTest({ name, targetPath, suffix: suffix });
+      await generateTest({ name, targetPath, suffix: suffix });
     } catch (err) {
       handleError("Failed to generate service", err);
     }
@@ -39,10 +39,10 @@ const creators = {
     try {
       generateFile({ name, targetPath, templateFn: componentTemplate, suffix: suffix });
       generateFile({ name, targetPath, templateFn: htmlTemplate, suffix: suffix, extension: 'html' });
-      if (nutinConfig.generator.generateStylesheet) generateFile({ name, targetPath, templateFn: scssTemplate, suffix: suffix, extension: 'scss' });
-      if (nutinConfig.generator.generateLocales) await generateLocales({ targetPath, name });
+      generateFile({ name, targetPath, templateFn: scssTemplate, suffix: suffix, extension: 'scss' });
+      await generateLocales({ targetPath, name, isView: false });
       appendToIndex({ name, targetPath, suffix: suffix });
-      if (nutinConfig.generator.generateTest) await generateTest({ name, targetPath, suffix });
+      await generateTest({ name, targetPath, suffix });
     } catch (err) {
       handleError("Failed to generate component", err);
     }
@@ -54,10 +54,10 @@ const creators = {
     try {
       generateFile({ name, targetPath, templateFn: viewTemplate, suffix: suffix });
       generateFile({ name, targetPath, templateFn: htmlTemplate, suffix: suffix, extension: 'html' });
-      if (nutinConfig.generator.generateStylesheet) generateFile({ name, targetPath, templateFn: scssTemplate, suffix: suffix, extension: 'scss' });
-      if (nutinConfig.generator.generateLocales) await generateLocales({ targetPath, name });
+      generateFile({ name, targetPath, templateFn: scssTemplate, suffix: suffix, extension: 'scss' });
+      await generateLocales({ targetPath, name, isView: true });
       appendToIndex({ name, targetPath, suffix: suffix });
-      if (nutinConfig.generator.generateTest) await generateTest({ name, targetPath, suffix });
+      await generateTest({ name, targetPath, suffix });
     } catch (err) {
       handleError("Failed to generate view", err);
     }
@@ -77,31 +77,11 @@ if (create) {
 
 // Helper Functions
 async function generateTest({ targetPath, name, suffix }) {
-  let isGenerate = true;
-  if (!nutinConfig.testinNutin.includeApp) {
-    print.warn('⚠️ Enable includeApp in nutin.config.js testinNutin object to use test files.');
-    if (!process.stdin.isTTY) {
-      print.warn('Non-interactive shell detected — skipping test file generation.');
-      isGenerate = false;
-    } else {
-      isGenerate = await promptBoolean('Do you want to generate the test file anyway ?');
-    }
-  }
-  if (isGenerate) generateFile({ targetPath, name, templateFn: testTemplate, extension: 'test.js', suffix: suffix });
+  if (nutinConfig.testinNutin.includeApp) generateFile({ targetPath, name, templateFn: testTemplate, extension: 'test.js', suffix: suffix });
 }
 
-async function generateLocales({ targetPath, name }) {
-  let isGenerate = true;
-  if (!nutinConfig.i18n) {
-    print.warn('⚠️ Enable i18n in nutin.config.js to use json-based content per language.');
-    if (!process.stdin.isTTY) {
-      print.warn('Non-interactive shell detected — skipping locales file generation.');
-      isGenerate = false;
-    } else {
-      isGenerate = await promptBoolean('Do you want to generate the locales file(s) anyway ?');
-    }
-  }
-  if (isGenerate) generateLocalesJson({ targetPath, name });
+async function generateLocales({ targetPath, name, isView }) {
+  if (nutinConfig.i18n) generateLocalesJson({ targetPath, name, isView });
 }
 
 function showUsageAndExit(message) {

package/templates/base/tools/generator/handle-file.js.hbs

@@ -43,11 +43,11 @@ export function appendToIndex({ name, targetPath, suffix }) {
   }
 }
 
-export function generateLocalesJson({ targetPath, name }) {
+export function generateLocalesJson({ targetPath, name, isView }) {
   const localesDir = `${targetPath}/locales`;
   fs.mkdirSync(localesDir, { recursive: true });
 
-  const template = localeTemplate(name);
+  const template = localeTemplate(name, isView);
 
   const failedLangs = [];
   for (const lang of LANGUAGES) {

package/templates/base/tools/generator/templates/locale/locale.template.js.hbs

@@ -1,4 +1,8 @@
-export const localeTemplate = (name) => `{
+export const localeTemplate = (name, isView) => isView ? `{
+  "title": "${name.capitalized}",
+  "default": "${name.pascal} works !"
+}
+` : `{
   "default": "${name.pascal} works !"
 }
 `;

package/templates/base/tools/generator/templates/locale/locale.template.test.js.hbs

@@ -2,6 +2,16 @@ import { localeTemplate } from './locale.template.js';
 
 describe('localeTemplate', () => {
   it('renders a locale JSON stub with a "default" key', () => {
-    expect(localeTemplate({ pascal: 'Widget' })).toBe('{\n  "default": "Widget works !"\n}\n');
+    expect(localeTemplate({ pascal: 'Widget', capitalized: 'Widget' })).toBe('{\n  "default": "Widget works !"\n}\n');
+  });
+
+  it('does not include a "title" key when isView is false', () => {
+    expect(localeTemplate({ pascal: 'Widget', capitalized: 'Widget' }, false)).toBe('{\n  "default": "Widget works !"\n}\n');
+  });
+
+  it('includes a top-level "title" key seeded from the capitalized name when isView is true', () => {
+    expect(localeTemplate({ pascal: 'Widget', capitalized: 'Widget' }, true)).toBe(
+      '{\n  "title": "Widget",\n  "default": "Widget works !"\n}\n'
+    );
   });
 });

package/templates/base/tools/generator/templates/view/view.template.js.hbs

@@ -10,7 +10,7 @@ const template = \`${htmlTemplate}\`;
 
 export class ${name.pascal}View extends View {
   constructor() {
-    super({template});
+    super({ template, viewName: '${name.kebab}' });
   }
 
 }

package/templates/base/tools/generator/templates/view/view.template.test.js.hbs

@@ -2,7 +2,7 @@ import { viewTemplate } from './view.template.js';
 
 describe('viewTemplate', () => {
   it('renders a view class importing View via the relative core path', () => {
-    const name = { pascal: 'Widget' };
+    const name = { kebab: 'widget', pascal: 'Widget' };
     const targetPath = 'src/app/components/widget';
 
     // The generator always leaves the html body as a placeholder — the builder
@@ -14,7 +14,7 @@ const template = \`__TEMPLATE_PLACEHOLDER__\`;
 
 export class WidgetView extends View {
   constructor() {
-    super({template});
+    super({ template, viewName: 'widget' });
   }
 
 }