@weaverse/hydrogen 6.0.0-beta.0 → 6.1.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@weaverse/hydrogen",
   "author": "Weaverse Team",
   "description": "Components, hooks, and utilities for building Shopify Hydrogen websites with Weaverse",
-  "version": "6.0.0-beta.0",
+  "version": "6.1.0",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/types/index.d.ts",
@@ -69,9 +69,9 @@
     "@shopify/hydrogen": "^2026.10.2"
   },
   "dependencies": {
-    "@weaverse/next": "1.1.0-beta.0",
-    "@weaverse/react": "5.24.0",
-    "@weaverse/schema": "0.19.0",
+    "@weaverse/next": "1.1.1",
+    "@weaverse/react": "6.1.0",
+    "@weaverse/schema": "0.20.0",
     "react": ">=19",
     "react-dom": ">=19",
     "react-error-boundary": "^6",

package/readme.md

@@ -140,6 +140,17 @@ export const middleware: Route.MiddlewareFunction[] = [
 ```
 
 `storefront.i18n` selects the content locale, including its `pathPrefix`.
+When a market's Shopify `LanguageCode` differs from the locale Weaverse keys
+its translations by (for example `ZH_TW` for a Traditional Chinese Hong Kong
+market), pass the market as `locale` instead of relabeling the storefront
+client. It sets the Translation Manager locale, the locale sent with page
+requests and the `requestInfo.i18n` Studio reads, while the Storefront API keeps
+its own `i18n`:
+
+```typescript
+new WeaverseClient({ ...args, locale: { language: 'ZH', country: 'HK', pathPrefix: '/zh-hk' } })
+```
+
 Section loaders receive the same client as `weaverse`, so they query the
 Storefront API with `weaverse.storefront.graphql(QUERY, { variables, cache })`.
 

package/src/types.ts

@@ -29,6 +29,7 @@ import type {
   SchemaType,
   SchemaValidationIssue,
   SchemaValidationResult,
+  ThemeOutline,
   ThemeRoutes,
 } from '@weaverse/schema'
 import { isValidSchema } from '@weaverse/schema'
@@ -419,6 +420,11 @@ export type WeaverseThemeSchema = {
    * `{ COLLECTION: '/shop/:handle' }`. See `ThemeRoutes`.
    */
   routes?: ThemeRoutes
+  /**
+   * Settings groups listed in the Studio Page Outline, keyed by area. See
+   * `ThemeOutline`.
+   */
+  outline?: ThemeOutline
   /** Theme localization configuration. */
   i18n?: {
     /** Strategy used to encode the locale in storefront URLs. */
@@ -550,10 +556,23 @@ export function isProjectIdFunction(
 export type WeaverseClientArgs = {
   /**
    * Request-scoped Hydrogen Storefront API client. Section loaders reach it
-   * as `weaverse.storefront`; its `i18n` selects the content locale.
+   * as `weaverse.storefront`; its `i18n` selects the content locale unless
+   * {@link WeaverseClientArgs.locale} is given.
    */
   storefront: WeaverseStorefront
 
+  /**
+   * The market this request serves, as Weaverse identifies it. It selects the
+   * Translation Manager overrides (`${language}-${country}`, lowercased), the
+   * locale sent with page requests and the `requestInfo.i18n` Studio reads,
+   * so include `pathPrefix`. Pass it when the storefront's `i18n.language` is
+   * a Shopify `LanguageCode` that differs from the market's public language,
+   * such as `ZH_TW` for a Traditional Chinese Hong Kong market.
+   *
+   * @defaultValue `storefront.i18n`
+   */
+  locale?: WeaverseI18n
+
   /** Runtime environment variables, such as the Oxygen worker `env`. */
   env: WeaverseEnv
 

package/src/weaverse-client.ts

@@ -316,6 +316,7 @@ export class WeaverseClient {
   private readonly componentsByType: Map<string, WeaverseComponent>
 
   // Configuration
+  private readonly locale: WeaverseI18n
   private readonly fetchTimeoutMs: number
   private readonly throwPageLoadFailures: boolean
 
@@ -336,6 +337,7 @@ export class WeaverseClient {
     this.componentsByType = this.buildComponentLookupMap(args.components)
 
     // Configuration
+    this.locale = args.locale ?? args.storefront.i18n
     this.fetchTimeoutMs = args.fetchTimeoutMs || DEFAULT_FETCH_TIMEOUT_MS
     this.throwPageLoadFailures = args.throwPageLoadFailures === true
 
@@ -406,7 +408,7 @@ export class WeaverseClient {
 
     this.basePageRequestBody = {
       isDesignMode: this.configs.isDesignMode,
-      i18n: args.storefront.i18n,
+      i18n: this.locale,
       projectId: this.configs.projectId,
     }
 
@@ -1038,7 +1040,7 @@ export class WeaverseClient {
   ): Promise<Record<string, unknown> | undefined> => {
     try {
       const { projectId, weaverseHost } = this.configs
-      const i18n = this.storefront.i18n
+      const i18n = this.locale
 
       // Skip entirely when the theme hasn't opted into i18n. Merchant overrides
       // are locale-specific translations; a theme with no `i18n` schema has no
@@ -1053,7 +1055,7 @@ export class WeaverseClient {
         return
       }
 
-      // Build locale code from storefront i18n (e.g. "en-us")
+      // Build locale code from the market's locale (e.g. "en-us")
       const language = (i18n?.language || 'en').toLowerCase()
       const country = (i18n?.country || 'us').toLowerCase()
       const locale = `${language}-${country}`
@@ -1225,7 +1227,7 @@ export class WeaverseClient {
     }
 
     try {
-      const { request, storefront, basePageRequestBody, basePageConfigs } = this
+      const { request, basePageRequestBody, basePageConfigs } = this
       const {
         projectId: clientProjectId,
         weaverseHost,
@@ -1352,7 +1354,7 @@ export class WeaverseClient {
         configs: {
           ...basePageConfigs,
           requestInfo: {
-            i18n: storefront.i18n,
+            i18n: this.locale,
             queries: getRequestQueries<WeaverseStudioQueries>(request),
             pathname: this.parsedUrl.pathname,
             search: this.parsedUrl.search,