@stone-js/starters 0.8.3 → 0.8.5

package/basic-service-declarative/app/Application.ts

@@ -38,13 +38,22 @@ export class Application implements IEventHandler<IncomingEvent> {
   */
   handle (event: IncomingEvent): ResponseData {
     // Get the name from the event
-    const message = `Hello ${String(event.get<string>('name', 'World'))}!`
+    const name = String(event.get<string>('name', 'World'))
+    const message = `Hello ${name}! Welcome to Stone.js.`
 
     // Log a message
     this.logger.info(message)
 
-    // Return a JSON response
-    return { message }
+    // Return a branded JSON response
+    return {
+      message,
+      framework: {
+        name: 'Stone.js',
+        tagline: 'The continuum framework',
+        docs: 'https://stonejs.dev',
+        github: 'https://github.com/stone-foundation/stone-js-framework'
+      }
+    }
   }
 }
 
@@ -53,4 +62,10 @@ export class Application implements IEventHandler<IncomingEvent> {
  */
 export interface ResponseData {
   message: string
+  framework: {
+    name: string
+    tagline: string
+    docs: string
+    github: string
+  }
 }

package/basic-service-declarative/package.json

@@ -18,17 +18,20 @@
     "test:cvg": "npm run test -- --coverage"
   },
   "dependencies": {
-    "@stone-js/core": "^0.8.3",
-    "@stone-js/node-cli-adapter": "^0.8.3",
-    "@stone-js/node-http-adapter": "^0.8.3"
+    "@stone-js/core": "^0.8.5",
+    "@stone-js/node-cli-adapter": "^0.8.5",
+    "@stone-js/node-http-adapter": "^0.8.5"
   },
   "devDependencies": {
     "@babel/plugin-proposal-decorators": "^7.25.9",
     "@babel/preset-env": "^7.26.9",
     "@babel/preset-typescript": "^7.27.0",
-    "@stone-js/cli": "^0.8.3",
+    "@stone-js/cli": "^0.8.5",
     "@types/node": "^24.0.7",
     "@vitest/coverage-v8": "^3.0.9",
     "vitest": "^3.0.9"
+  },
+  "overrides": {
+    "glob": "^11.0.0"
   }
 }

package/basic-service-declarative/tests/Application.spec.ts

@@ -47,14 +47,15 @@ describe('Application', () => {
 
   it('should handle incoming events', () => {
     // Arrange
-    const expectedMessage = 'Hello World!'
+    const expectedMessage = 'Hello World! Welcome to Stone.js.'
     const event = { get: () => 'World' } as unknown as IncomingEvent
 
     // Act
-    const response = app.handle(event) as { message: string }
+    const response = app.handle(event)
 
     // Assert
     expect(response.message).toBe(expectedMessage)
+    expect(response.framework.name).toBe('Stone.js')
     expect(mockedLogger.info).toHaveBeenCalledWith(expectedMessage)
   })
 })

package/basic-service-imperative/app/Application.ts

@@ -8,13 +8,22 @@ import { defineStoneApp, defineConfig, IBlueprint, ILogger, IncomingEvent, Funct
 export const FactoryHandler = ({ logger }: AppOptions): FunctionalEventHandler<IncomingEvent, ResponseData> => {
   return (event: IncomingEvent): ResponseData => {
     // Get the name from the event
-    const message = `Hello ${String(event.get<string>('name', 'World'))}!`
+    const name = String(event.get<string>('name', 'World'))
+    const message = `Hello ${name}! Welcome to Stone.js.`
 
     // Log a message
     logger.info(message)
 
-    // Return a JSON response
-    return { message }
+    // Return a branded JSON response
+    return {
+      message,
+      framework: {
+        name: 'Stone.js',
+        tagline: 'The continuum framework',
+        docs: 'https://stonejs.dev',
+        github: 'https://github.com/stone-foundation/stone-js-framework'
+      }
+    }
   }
 }
 
@@ -57,4 +66,10 @@ interface AppOptions {
  */
 export interface ResponseData {
   message: string
+  framework: {
+    name: string
+    tagline: string
+    docs: string
+    github: string
+  }
 }

package/basic-service-imperative/package.json

@@ -18,17 +18,20 @@
     "test:cvg": "npm run test -- --coverage"
   },
   "dependencies": {
-    "@stone-js/core": "^0.8.3",
-    "@stone-js/node-cli-adapter": "^0.8.3",
-    "@stone-js/node-http-adapter": "^0.8.3"
+    "@stone-js/core": "^0.8.5",
+    "@stone-js/node-cli-adapter": "^0.8.5",
+    "@stone-js/node-http-adapter": "^0.8.5"
   },
   "devDependencies": {
     "@babel/plugin-proposal-decorators": "^7.25.9",
     "@babel/preset-env": "^7.26.9",
     "@babel/preset-typescript": "^7.27.0",
-    "@stone-js/cli": "^0.8.3",
+    "@stone-js/cli": "^0.8.5",
     "@types/node": "^24.0.7",
     "@vitest/coverage-v8": "^3.0.9",
     "vitest": "^3.0.9"
+  },
+  "overrides": {
+    "glob": "^11.0.0"
   }
 }

package/basic-service-imperative/tests/Application.spec.ts

@@ -34,8 +34,9 @@ describe('Application', () => {
     // Act
     const response = await app(event)
     // Assert
-    expect(response.message).toBe('Hello World!')
-    expect(mockedLogger.info).toHaveBeenCalledWith('Hello World!')
+    expect(response.message).toBe('Hello World! Welcome to Stone.js.')
+    expect(response.framework.name).toBe('Stone.js')
+    expect(mockedLogger.info).toHaveBeenCalledWith('Hello World! Welcome to Stone.js.')
   })
 
   it('should get config', () => {

package/continuum-showcase/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright © 2026 Stone Foundation
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/continuum-showcase/app/Application.ts

@@ -0,0 +1,45 @@
+import { Routing } from '@stone-js/router'
+import { UseReact } from '@stone-js/use-react'
+import { Browser } from '@stone-js/browser-adapter'
+import { NodeHttp } from '@stone-js/node-http-adapter'
+import { StoneApp, AdapterHookListenerContext, Hook, LogLevel, Logger } from '@stone-js/core'
+
+/**
+ * Application — the single entry point of the showcase.
+ *
+ * The whole point of the Continuum Architecture is here: you declare the CONTEXT once
+ * (the adapters + features below) and the same domain (the `@Page` handlers) runs under it,
+ * server-side and in the browser, unchanged.
+ *
+ * @NodeHttp() serves the pages over HTTP with server-side rendering.
+ * @Browser() re-hydrates and runs the very same pages client-side.
+ * @UseReact() plugs React in as the view engine.
+ * @Routing() enables the universal router the `@Page` classes register on.
+ * @StoneApp() bootstraps the application (required).
+ */
+@Routing()
+@Browser()
+@UseReact()
+@NodeHttp({ default: true })
+@StoneApp({ name: 'Stone.js Showcase', logger: { level: LogLevel.INFO } })
+export class Application {
+  /**
+   * Run before the application starts.
+   *
+   * @param blueprint - The blueprint.
+   */
+  @Hook('onStart')
+  onStart ({ blueprint }: AdapterHookListenerContext): void {
+    Logger.log(`${String(blueprint.get('stone.name', 'Stone App'))} is starting...`)
+  }
+
+  /**
+   * Run just before the application stops.
+   *
+   * @param blueprint - The blueprint.
+   */
+  @Hook('onStop')
+  onStop ({ blueprint }: AdapterHookListenerContext): void {
+    Logger.log(`${String(blueprint.get('stone.name', 'Stone App'))} is stopping...`)
+  }
+}

package/continuum-showcase/app/layouts/MainLayout.tsx

@@ -1,19 +1,24 @@
 import React from 'react'
-import { PageLayout } from '@stone-js/router'
-import { IPageLayout, PageLayoutRenderContext } from '@stone-js/use-react'
+import { PageLayout, StoneOutlet, IPageLayout, PageLayoutRenderContext } from '@stone-js/use-react'
 
 /**
- * The default layout. In a future iteration (hierarchical heads), a layout may also
- * contribute a base head via `createHead().merge(...)`.
+ * The default layout: a thin branded chrome (top bar + footer) around the page outlet.
+ * The page content is placed via <StoneOutlet>, never a bare {children}.
  */
 @PageLayout({ name: 'default' })
 export class MainLayout implements IPageLayout {
   render ({ children }: PageLayoutRenderContext) {
     return (
-      <div className="app">
-        <header><nav><a href="/">Home</a> · <a href="/blog/hello-world">Blog</a></nav></header>
-        {children}
-        <footer>◆ Stone.js — the continuum framework</footer>
+      <div className='cx-shell'>
+        <header className='cx-nav'>
+          <a className='cx-wordmark' href='/'><span className='dot'>●</span> Stone.js</a>
+          <nav>
+            <a href='/'>Home</a>
+            <a href='/blog/hello-world'>Blog</a>
+          </nav>
+        </header>
+        <StoneOutlet>{children}</StoneOutlet>
+        <footer className='cx-foot'>Built with Stone.js — the continuum framework</footer>
       </div>
     )
   }

package/continuum-showcase/app/pages/BlogPostPage.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
-import { Page } from '@stone-js/router'
 import {
+  Page,
   createHead,
   IPage,
   PageRenderContext,
@@ -20,7 +20,7 @@ interface Post {
  * Blog post page — demonstrates a fully dynamic, data-driven head built from the
  * loader (`handle`) output, including an `article` Open Graph type and per-post JSON-LD.
  */
-@Page({ path: '/blog/:slug' })
+@Page('/blog/:slug')
 export class BlogPostPage implements IPage<ReactIncomingEvent> {
   handle (event: ReactIncomingEvent): Post {
     const slug = event.get<string>('slug', 'hello-world')
@@ -53,8 +53,11 @@ export class BlogPostPage implements IPage<ReactIncomingEvent> {
 
   render ({ data }: PageRenderContext<Post>) {
     return (
-      <article>
+      <article className='cx-article'>
+        <a className='cx-back' href='/'>← Back</a>
+        <p className='cx-kicker'>Stone.js Blog</p>
         <h1>{data?.title}</h1>
+        <p className='cx-excerpt'>{data?.excerpt}</p>
         <p>{data?.body}</p>
       </article>
     )

package/continuum-showcase/app/pages/HomePage.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
-import { Page } from '@stone-js/router'
-import logo from '@img/logo.png'
+import logo from '@img/logo.svg'
 import {
+  Page,
   createHead,
   IPage,
   PageRenderContext,
@@ -18,7 +18,7 @@ interface HomeData {
  *    Twitter card and JSON-LD structured data), all from `head()`;
  *  - importing a static asset via the `@img` alias (resolved by the CLI's Vite config).
  */
-@Page({ path: '/' })
+@Page('/')
 export class HomePage implements IPage<ReactIncomingEvent> {
   handle (): HomeData {
     return { message: 'Write your domain once. Stone.js applies the context.' }
@@ -48,11 +48,24 @@ export class HomePage implements IPage<ReactIncomingEvent> {
 
   render ({ data }: PageRenderContext<HomeData>) {
     return (
-      <main>
-        <img src={logo} alt="Stone.js" width={96} height={96} />
-        <h1>Stone.js Showcase</h1>
-        <p>{data?.message}</p>
-      </main>
+      <section className='stone-welcome'>
+        <div className='glow' aria-hidden='true' />
+        <div className='hero'>
+          <img className='mark' src={logo} alt='Stone.js' width={104} height={104} />
+          <p className='eyebrow'>The continuum showcase</p>
+          <h1 className='title'>Stone.js</h1>
+          <p className='lead'>{data?.message}</p>
+          <p className='tagline'>
+            One domain, rendered on the server and hydrated in the browser, with a fluent
+            head / OpenGraph API and static-asset aliases.
+          </p>
+          <nav className='links'>
+            <a href='/blog/hello-world'>Read the blog demo</a>
+            <a href='https://stonejs.dev/docs' target='_blank' rel='noreferrer noopener'>Documentation</a>
+            <span className='edit'>Edit <b>app/pages/HomePage.tsx</b></span>
+          </nav>
+        </div>
+      </section>
     )
   }
 }

package/continuum-showcase/assets/css/index.css

@@ -0,0 +1,198 @@
+/**
+ * Stone.js starter — brand welcome screen.
+ * Identity: "Obsidienne & Braise" — obsidian ground, ember (braise) accent, the Portal mark.
+ * Theme-aware: dark by default, light under prefers-color-scheme: light.
+ */
+:root {
+  --ink: #14100E;
+  --ink-2: #1E1815;
+  --cream: #F4EFE6;
+  --cream-dim: #B8AE9E;
+  --ember-1: #FFC46B;
+  --ember-2: #FF5A1F;
+  --line: rgba(244, 239, 230, 0.10);
+  --card: rgba(244, 239, 230, 0.04);
+  --bg: radial-gradient(1200px 600px at 50% -10%, #241C17 0%, var(--ink) 55%);
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --ink: #F4EFE6;
+    --ink-2: #ffffff;
+    --cream: #1B1613;
+    --cream-dim: #6B6154;
+    --line: rgba(27, 22, 19, 0.10);
+    --card: rgba(27, 22, 19, 0.03);
+    --bg: radial-gradient(1200px 600px at 50% -10%, #FFFFFF 0%, #F1E9DC 60%);
+  }
+}
+
+* { box-sizing: border-box; }
+
+body {
+  margin: 0;
+  min-height: 100vh;
+  color: var(--cream);
+  background: var(--ink);
+  font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+}
+
+.stone-welcome {
+  position: relative;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 48px 24px;
+  background: var(--bg);
+  overflow: hidden;
+}
+
+/* Ember glow behind the mark. */
+.stone-welcome .glow {
+  position: absolute;
+  top: 8%;
+  left: 50%;
+  width: 520px;
+  height: 520px;
+  transform: translateX(-50%);
+  background: radial-gradient(circle, rgba(255, 90, 31, 0.22) 0%, rgba(255, 90, 31, 0) 68%);
+  filter: blur(8px);
+  pointer-events: none;
+  z-index: 0;
+}
+
+.stone-welcome .hero {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  max-width: 680px;
+  text-align: center;
+  animation: rise 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both;
+}
+
+.stone-welcome .mark {
+  width: 104px;
+  height: 104px;
+  filter: drop-shadow(0 8px 28px rgba(255, 90, 31, 0.35));
+}
+
+.stone-welcome .eyebrow {
+  margin: 22px 0 0;
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.28em;
+  text-transform: uppercase;
+  color: var(--cream-dim);
+}
+
+.stone-welcome .title {
+  margin: 8px 0 0;
+  font-size: clamp(44px, 8vw, 76px);
+  font-weight: 800;
+  letter-spacing: -0.03em;
+  line-height: 1.02;
+  background: linear-gradient(92deg, var(--ember-1), var(--ember-2));
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+
+.stone-welcome .lead {
+  margin: 18px auto 0;
+  font-size: 20px;
+  font-weight: 600;
+  color: var(--cream);
+}
+
+.stone-welcome .tagline {
+  margin: 10px auto 0;
+  max-width: 46ch;
+  font-size: 16px;
+  line-height: 1.6;
+  color: var(--cream-dim);
+}
+
+.stone-welcome .links {
+  margin-top: 34px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  justify-content: center;
+}
+
+.stone-welcome .links a,
+.stone-welcome .links .edit {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 11px 18px;
+  border: 1px solid var(--line);
+  border-radius: 12px;
+  background: var(--card);
+  color: var(--cream);
+  font-size: 14px;
+  font-weight: 600;
+  text-decoration: none;
+  transition: border-color 0.2s, transform 0.2s, background 0.2s;
+}
+
+.stone-welcome .links a:hover {
+  transform: translateY(-2px);
+  border-color: rgba(255, 90, 31, 0.6);
+  background: rgba(255, 90, 31, 0.08);
+}
+
+.stone-welcome .links .edit {
+  font-family: ui-monospace, 'SF Mono', Menlo, Monaco, Consolas, monospace;
+  color: var(--cream-dim);
+}
+.stone-welcome .links .edit b { color: var(--ember-1); font-weight: 700; }
+
+.stone-welcome .brand {
+  position: relative;
+  z-index: 1;
+  margin-top: 56px;
+  font-size: 13px;
+  letter-spacing: 0.02em;
+  color: var(--cream-dim);
+}
+.stone-welcome .brand .dot { color: var(--ember-2); }
+
+@keyframes rise {
+  from { opacity: 0; transform: translateY(14px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .stone-welcome .hero { animation: none; }
+}
+
+/* --- Showcase chrome (MainLayout) --- */
+.cx-shell { min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); }
+.cx-nav {
+  position: sticky; top: 0; z-index: 5;
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 16px 24px; border-bottom: 1px solid var(--line);
+  backdrop-filter: blur(8px);
+}
+.cx-wordmark { font-weight: 800; letter-spacing: -0.02em; color: var(--cream); text-decoration: none; }
+.cx-wordmark .dot { color: var(--ember-2); }
+.cx-nav nav { display: flex; gap: 18px; }
+.cx-nav nav a { color: var(--cream-dim); text-decoration: none; font-size: 14px; font-weight: 600; }
+.cx-nav nav a:hover { color: var(--ember-1); }
+.cx-foot { padding: 22px; text-align: center; color: var(--cream-dim); font-size: 13px; border-top: 1px solid var(--line); }
+
+/* The hero fills the space between nav and footer rather than a full extra viewport. */
+.cx-shell .stone-welcome { min-height: calc(100vh - 140px); }
+
+/* --- Article (BlogPostPage) --- */
+.cx-article { max-width: 720px; margin: 0 auto; padding: 64px 24px; color: var(--cream); }
+.cx-back { color: var(--cream-dim); text-decoration: none; font-size: 14px; font-weight: 600; }
+.cx-back:hover { color: var(--ember-1); }
+.cx-kicker { margin: 28px 0 0; font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--ember-2); font-weight: 700; }
+.cx-article h1 { margin: 8px 0 0; font-size: clamp(32px, 5vw, 48px); letter-spacing: -0.02em; }
+.cx-excerpt { margin-top: 12px; font-size: 19px; color: var(--cream-dim); line-height: 1.6; }
+.cx-article > p:last-child { margin-top: 20px; font-size: 16px; line-height: 1.75; }

package/continuum-showcase/assets/images/logo.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 96" width="96" height="96" role="img" aria-label="Stone.js">
+  <title>Stone.js</title>
+  <style>
+    .ink { stroke: #1B1613; }
+    @media (prefers-color-scheme: dark) { .ink { stroke: #EFE8DC; } }
+  </style>
+  <defs>
+    <linearGradient id="braise" gradientUnits="userSpaceOnUse" x1="22" y1="14" x2="74" y2="26.1">
+      <stop offset="0" stop-color="#FFC46B" />
+      <stop offset="1" stop-color="#FF5A1F" />
+    </linearGradient>
+  </defs>
+  <path class="ink" d="M 79.96 36.4 A 34 34 0 0 1 53.9 81.5" fill="none" stroke-width="11" stroke-linecap="round" opacity=".85" />
+  <path class="ink" d="M 42.1 81.5 A 34 34 0 0 1 16.05 36.4" fill="none" stroke-width="11" stroke-linecap="round" opacity=".85" />
+  <path d="M 22 26.1 A 34 34 0 0 1 74 26.1" fill="none" stroke="url(#braise)" stroke-width="11" stroke-linecap="round" />
+</svg>

package/continuum-showcase/package.json

@@ -3,23 +3,41 @@
   "version": "0.0.0",
   "private": true,
   "type": "module",
-  "description": "Showcase app exercising the new head/OG API and static-asset aliases (2026-07 continuum pass).",
+  "description": "Continuum showcase: one domain rendered server-side and in the browser, with the fluent head/OpenGraph API and static-asset aliases.",
   "scripts": {
     "dev": "stone dev",
     "build": "stone build",
-    "preview": "stone preview"
+    "build:ssr": "stone build --ssr",
+    "preview": "stone preview",
+    "test": "vitest run",
+    "test:cvg": "npm run test -- --coverage"
   },
   "dependencies": {
-    "@stone-js/browser-adapter": "^0.8.3",
-    "@stone-js/core": "^0.8.3",
-    "@stone-js/node-http-adapter": "^0.8.3",
-    "@stone-js/router": "^0.8.3",
-    "@stone-js/use-react": "^0.8.3",
-    "@stone-js/use-view": "^0.8.3",
     "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "react-dom": "^19.0.0",
+    "@stone-js/core": "^0.8.5",
+    "@stone-js/router": "^0.8.5",
+    "@stone-js/use-react": "^0.8.5",
+    "@stone-js/http-core": "^0.8.5",
+    "@stone-js/pipeline": "^0.8.5",
+    "@stone-js/browser-adapter": "^0.8.5",
+    "@stone-js/node-http-adapter": "^0.8.5"
   },
   "devDependencies": {
-    "@stone-js/cli": "^0.8.3"
+    "@babel/plugin-proposal-decorators": "^7.25.9",
+    "@babel/preset-env": "^7.26.9",
+    "@babel/preset-typescript": "^7.27.0",
+    "@stone-js/cli": "^0.8.5",
+    "@types/node": "^24.0.7",
+    "@types/react": "^19.0.7",
+    "@types/react-dom": "^19.0.3",
+    "@vitest/coverage-v8": "^3.0.9",
+    "vitest": "^3.0.9"
+  },
+  "overrides": {
+    "glob": "^11.0.0"
+  },
+  "engines": {
+    "node": ">=20.0.0"
   }
 }

package/continuum-showcase/tests/HomePage.spec.tsx

@@ -0,0 +1,41 @@
+import { renderToString } from 'react-dom/server'
+import { HomePage } from '../app/pages/HomePage'
+
+// Mock the page decorator so the class can be instantiated without a running app context.
+vi.mock('@stone-js/use-react', async (importOriginal) => {
+  const actual: any = await importOriginal()
+  return {
+    ...actual,
+    Page: vi.fn(() => vi.fn())
+  }
+})
+
+describe('HomePage', () => {
+  it('returns the domain message from handle', () => {
+    // Arrange
+    const page = new HomePage()
+
+    // Act
+    const data = page.handle()
+
+    // Assert
+    expect(data.message).toBe('Write your domain once. Stone.js applies the context.')
+  })
+
+  it('renders the Stone.js logo and the message', () => {
+    // Arrange
+    const page = new HomePage()
+
+    // Act
+    const html = renderToString(page.render({ data: page.handle() } as any))
+
+    // Assert: the premium welcome hero renders the Stone.js logo (Vite inlines the small SVG
+    // as a data URI), the brand title and the domain message.
+    expect(html).toContain('stone-welcome')
+    expect(html).toContain('<img')
+    expect(html).toContain('image/svg+xml')
+    expect(html).toContain('alt="Stone.js"')
+    expect(html).toContain('Stone.js')
+    expect(html).toContain('Write your domain once')
+  })
+})