@readium/navigator 2.5.0-beta.1 → 2.5.0-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readium/navigator",
-  "version": "2.5.0-beta.1",
+  "version": "2.5.0-beta.2",
   "type": "module",
   "description": "Next generation SDK for publications in Web Apps",
   "author": "readium",

package/src/epub/EpubNavigator.ts

@@ -115,9 +115,11 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
         const scriptMode = getScriptMode(pub.metadata);
         const isCJKHorizontal = scriptMode === 'cjk-horizontal';
         const isCJKVertical = scriptMode === 'cjk-vertical';
+        const isMongolianVertical = scriptMode === 'mongolian-vertical';
+        const isVertical = isCJKVertical || isMongolianVertical;
         const isCJK = isCJKHorizontal || isCJKVertical;
         this._css = new ReadiumCSS({
-            rsProperties: new RSProperties({ noVerticalPagination: isCJKVertical || undefined }),
+            rsProperties: new RSProperties({ noVerticalPagination: isVertical || undefined }),
             userProperties: new UserProperties({}),
             lineLengths: new LineLengths({
                 optimalChars: this._settings.optimalLineLength,
@@ -133,7 +135,8 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
             //    sample: this.pub.metadata.description
             }),
             container: container,
-            constraint: this._settings.constraint
+            constraint: this._settings.constraint,
+            isCJKVertical: isVertical
         });
 
         this._layout = EpubNavigator.determineLayout(pub, !!this._settings.scroll);
@@ -209,9 +212,10 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
         if (layout === Layout.scrolled)
             return Layout.scrolled;
 
-        // CJK vertical writing: force scroll mode so the ScrollSnapper is
-        // used and column-based pagination doesn't interfere.
-        if (getScriptMode(pub.metadata) === 'cjk-vertical')
+        // CJK/Mongolian vertical writing: force scroll mode so the
+        // CJKVerticalSnapper is used and column-based pagination doesn't interfere.
+        const sm = getScriptMode(pub.metadata);
+        if (sm === 'cjk-vertical' || sm === 'mongolian-vertical')
             return Layout.scrolled;
 
         if (layout === Layout.reflowable && scroll)
@@ -554,8 +558,9 @@ export class EpubNavigator extends VisualNavigator implements Configurable<Confi
             return modules.filter((m) => FXLModules.includes(m));
         } else modules = modules.filter((m) => ReflowableModules.includes(m));
         
-        // CJK vertical: uses its own X-axis snapper, never column or scroll snappers
-        if (getScriptMode(this.pub.metadata) === 'cjk-vertical') {
+        // CJK/Mongolian vertical: uses the X-axis snapper, never column or scroll snappers
+        const mode = getScriptMode(this.pub.metadata);
+        if (mode === 'cjk-vertical' || mode === 'mongolian-vertical') {
             return modules.filter((m) => m !== "column_snapper" && m !== "scroll_snapper");
         }
 

package/src/epub/css/ReadiumCSS.ts

@@ -9,6 +9,7 @@ export interface IReadiumCSS {
   lineLengths: LineLengths;
   container: HTMLElement;
   constraint: number;
+  isCJKVertical?: boolean;
 }
 
 export class ReadiumCSS {
@@ -18,6 +19,7 @@ export class ReadiumCSS {
   container: HTMLElement;
   containerParent: HTMLElement;
   constraint: number;
+  private readonly isCJKVertical: boolean;
   private cachedColCount: number | null | undefined;
   private effectiveContainerWidth: number;
 
@@ -28,6 +30,7 @@ export class ReadiumCSS {
     this.container = props.container;
     this.containerParent = props.container.parentElement || document.documentElement;
     this.constraint = props.constraint;
+    this.isCJKVertical = props.isCJKVertical ?? false;
     this.cachedColCount = props.userProperties.colCount;
     this.effectiveContainerWidth = getContentWidth(this.containerParent);
   }
@@ -131,6 +134,14 @@ export class ReadiumCSS {
   }
 
   private updateLayout(scale: number | null, ignoreCompensation: boolean | null, scroll: boolean | null, colCount?: number | null) {
+    // CJK vertical text flows along the block axis (height); the inline axis
+    // (width) must not be constrained by line-length at all — use the full
+    // parent width minus the known constraint.
+    if (this.isCJKVertical) {
+      const w = Math.round(getContentWidth(this.containerParent) - this.constraint);
+      return { colCount: undefined, effectiveContainerWidth: w, effectiveLineLength: w };
+    }
+
     const isScroll = scroll ?? this.userProperties.view === "scroll";
 
     if (isScroll) {

package/src/epub/helpers/scriptMode.ts

@@ -1,6 +1,6 @@
 import { Metadata, ReadingProgression } from "@readium/shared";
 
-export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical';
+export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical' | 'mongolian-vertical';
 
 /**
  * Derives the script mode from publication metadata.
@@ -14,6 +14,9 @@ export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical';
  * - For RTL (ar/fa/he): language wins. If the primary language is a RTL
  *   script, RTL mode is applied regardless of the explicit progression
  *   direction declared in the OPF.
+ * - For Mongolian (mn): Traditional Mongolian script (mn-Mong) uses
+ *   writing-mode: vertical-lr. Cyrillic Mongolian (mn-Cyrl) is standard LTR.
+ *   An explicit script subtag is required; bare `mn` defaults to LTR.
  */
 export function getScriptMode(metadata: Metadata): ScriptMode {
     const primaryLang = metadata.languages?.[0]?.toLowerCase();
@@ -33,6 +36,10 @@ export function getScriptMode(metadata: Metadata): ScriptMode {
                 : 'cjk-horizontal';
         }
 
+        // Traditional Mongolian script (mn-Mong): writing-mode vertical-lr.
+        // Requires an explicit Mong script subtag; mn-Cyrl and bare mn stay LTR.
+        if (primaryLang.startsWith('mn-mong')) return 'mongolian-vertical';
+
         // RTL: language is authoritative. ar/fa/he → rtl regardless of
         // what the OPF says about page-progression-direction.
         const isRTLScript = primaryLang.startsWith('ar') ||

package/src/injection/epubInjectables.ts

@@ -86,7 +86,11 @@ export async function createReadiumEpubRules(metadata: Metadata, readingOrderIte
                 cssAfterRaw = after.default;
                 break;
             }
-            case 'cjk-vertical': {
+            case 'cjk-vertical':
+            // Traditional Mongolian (vertical-lr) uses the same Readium CSS
+            // layout as CJK vertical-rl — it is an outlier handled by the
+            // same stylesheet set per the Readium CSS spec.
+            case 'mongolian-vertical': {
                 const [before, def, after] = await Promise.all([
                     import("@readium/css/css/dist/cjk-vertical/ReadiumCSS-before.css?raw"),
                     import("@readium/css/css/dist/cjk-vertical/ReadiumCSS-default.css?raw"),

package/src/webpub/WebPubNavigator.ts

@@ -2,11 +2,12 @@ import { Feature, Link, Locator, Publication, ReadingProgression, LocatorLocatio
 import { VisualNavigator, VisualNavigatorViewport, ProgressionRange } from "../Navigator.ts";
 import { Configurable } from "../preferences/Configurable.ts";
 import { WebPubFramePoolManager } from "./WebPubFramePoolManager.ts";
-import { BasicTextSelection, CommsEventKey, ContextMenuEvent, FrameClickEvent, KeyboardEventData, ModuleLibrary, ModuleName, SuspiciousActivityEvent, WebPubModules } from "@readium/navigator-html-injectables";
+import { BasicTextSelection, CommsEventKey, ContextMenuEvent, FrameClickEvent, KeyboardEventData, ModuleName, SuspiciousActivityEvent, WebPubModules } from "@readium/navigator-html-injectables";
 import * as path from "path-browserify";
 import { WebPubFrameManager } from "./WebPubFrameManager.ts";
 
 import { ManagerEventKey } from "../epub/EpubNavigator.ts";
+import { getScriptMode } from "../epub/helpers/scriptMode.ts";
 import { WebPubCSS } from "./css/WebPubCSS.ts";
 import { WebUserProperties, WebRSProperties } from "./css/Properties.ts";
 import { IWebPubPreferences, WebPubPreferences } from "./preferences/WebPubPreferences.ts";
@@ -367,10 +368,14 @@ export class WebPubNavigator extends VisualNavigator implements Configurable<Web
     }
 
     private determineModules(): ModuleName[] {
-        let modules = Array.from(ModuleLibrary.keys()) as ModuleName[];
+        const modules = WebPubModules.slice();
 
-        // For WebPub, use the predefined WebPubModules array and filter
-        return modules.filter((m) => WebPubModules.includes(m));
+        const mode = getScriptMode(this.pub.metadata);
+        if (mode === 'cjk-vertical' || mode === 'mongolian-vertical') {
+            return modules.map((m) => m === "webpub_snapper" ? "cjk_vertical_snapper" : m);
+        }
+
+        return modules;
     }
 
     private attachListener() {

package/types/src/epub/css/ReadiumCSS.d.ts

@@ -7,6 +7,7 @@ export interface IReadiumCSS {
     lineLengths: LineLengths;
     container: HTMLElement;
     constraint: number;
+    isCJKVertical?: boolean;
 }
 export declare class ReadiumCSS {
     rsProperties: RSProperties;
@@ -15,6 +16,7 @@ export declare class ReadiumCSS {
     container: HTMLElement;
     containerParent: HTMLElement;
     constraint: number;
+    private readonly isCJKVertical;
     private cachedColCount;
     private effectiveContainerWidth;
     constructor(props: IReadiumCSS);

package/types/src/epub/helpers/scriptMode.d.ts

@@ -1,5 +1,5 @@
 import { Metadata } from "@readium/shared";
-export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical';
+export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical' | 'mongolian-vertical';
 /**
  * Derives the script mode from publication metadata.
  *
@@ -12,5 +12,8 @@ export type ScriptMode = 'ltr' | 'rtl' | 'cjk-horizontal' | 'cjk-vertical';
  * - For RTL (ar/fa/he): language wins. If the primary language is a RTL
  *   script, RTL mode is applied regardless of the explicit progression
  *   direction declared in the OPF.
+ * - For Mongolian (mn): Traditional Mongolian script (mn-Mong) uses
+ *   writing-mode: vertical-lr. Cyrillic Mongolian (mn-Cyrl) is standard LTR.
+ *   An explicit script subtag is required; bare `mn` defaults to LTR.
  */
 export declare function getScriptMode(metadata: Metadata): ScriptMode;