modern-canvas 0.27.4 → 0.27.6

package/dist/scene/2d/element/Element2D.d.ts

@@ -159,6 +159,13 @@ export declare class Element2D extends Node2D implements Rectangulable {
     protected _endBatch(): void;
     onUpdateStyleProperty(key: string, value: any, oldValue: any): void;
     protected _updateStyleProperty(key: string, value: any, oldValue: any): void;
+    /** 语义色 token → 实际色（经所属 tree 的当前主题）；无 tree / 非 token 时原样返回。 */
+    protected _resolveThemeColor(value: any): any;
+    /**
+     * 主题变更后重解析本元素的 token 色。仅当 style 里存的是 `@token` 才重设，
+     * 普通字面色不动（用户显式提供的色不受主题影响）。文字色走惰性解析，这里触发重排重栅格。
+     */
+    applyThemeColors(): void;
     requestLayout(): void;
     protected _process(delta: number): void;
     protected _updateConnection(): void;

package/dist/scene/2d/element/Element2DText.d.ts

@@ -46,6 +46,8 @@ export declare class Element2DText extends CoreObject implements NormalizedText
     protected _updateProperty(key: string, value: any, oldValue: any): void;
     load(): Promise<void>;
     update(): void;
+    /** fragment 颜色的语义色 token（`@token`）→ 当前主题实际色；非 token 原样返回。 */
+    protected _resolveThemeColor<T = any>(value: T): T | string;
     protected _rasterTexture(): void;
     protected _renderTiles(width: number, height: number, pixelRatio: number, maxTile: number): void;
     protected _releaseTiles(): void;

package/dist/scene/effects/DrawboardEffect.d.ts

@@ -1,19 +1,20 @@
 import type { WebGLRenderer } from '../../core';
 import type { EffectProperties, Node, Viewport } from '../main';
 import type { Texture2D } from '../resources';
+import { Color } from '../../core';
 import { Effect } from '../main/Effect';
 import { Material } from '../resources';
-export type CheckerboardStyle = 'grid' | 'gridDark' | 'dot' | 'dotDark';
+export type CheckerboardStyle = 'grid' | 'dot';
 export interface DrawboardEffectProperties extends EffectProperties {
     checkerboard?: boolean;
     checkerboardStyle?: CheckerboardStyle;
     pixelGrid?: boolean;
-    /** Override dot grid surface colour (0..1). Defaults to the dot/dotDark preset. */
-    dotBaseColor?: number;
-    /** Override dot fill colour at the zoomed-out limit (0..1). */
-    dotColor?: number;
-    /** Extra brightening of the dot when zooming in (0..1). */
-    dotZoomDiff?: number;
+    /** 底纹底色（网格底格 / 点阵底）。颜色字符串，可为主题 token；缺省浅色。 */
+    checkerboardColor?: string;
+    /** 点阵圆点色。缺省浅灰。 */
+    checkerboardDotColor?: string;
+    /** 放大时圆点的额外提亮量（0..1）。 */
+    dotColorDiff?: number;
     watermark?: string;
     watermarkWidth?: number;
     watermarkAlpha?: number;
@@ -23,23 +24,20 @@ export declare class DrawboardEffect extends Effect {
     checkerboard: boolean;
     checkerboardStyle: CheckerboardStyle;
     pixelGrid: boolean;
-    dotBaseColor?: number;
-    dotColor?: number;
-    dotZoomDiff?: number;
+    checkerboardColor: string;
+    checkerboardDotColor: string;
+    dotColorDiff: number;
     watermark?: string;
     watermarkWidth: number;
     watermarkAlpha: number;
     watermarkRotation: number;
     protected _watermark?: Texture2D;
+    protected _color: Color;
+    protected _dotColor: Color;
     static material: Material;
     constructor(properties?: Partial<DrawboardEffectProperties>, children?: Node[]);
     protected _updateProperty(key: string, value: any, oldValue: any): void;
     protected _loadWatermark(value?: string): Promise<void>;
     protected _checkerboardStyleMap: Record<CheckerboardStyle, number>;
-    protected _dotColors: Record<'light' | 'dark', {
-        base: number;
-        zoomedOut: number;
-        diff: number;
-    }>;
     apply(renderer: WebGLRenderer, source: Viewport): void;
 }

package/dist/scene/main/SceneTree.d.ts

@@ -24,12 +24,18 @@ export interface SceneTree {
     off: <K extends keyof SceneTreeEvents & string>(event: K, listener: (...args: SceneTreeEvents[K]) => void) => this;
     emit: <K extends keyof SceneTreeEvents & string>(event: K, ...args: SceneTreeEvents[K]) => this;
 }
+/** 语义色 token 调色板：token 名 → 各主题实际色（如 { surface: { light: '#fff', dark: '#1e1e1e' } }）。 */
+export type ThemeTokens = Record<string, Record<string, string>>;
 export interface SceneTreeProperties extends MainLoopProperties {
     msaa: boolean;
     fxaa: boolean;
     pixelate: boolean;
     roundPixels: boolean;
     backgroundColor: Hex8Color;
+    /** 当前主题名（默认 'light'）。元素颜色为 `@token` 时按此主题查 themeTokens 解析。 */
+    theme: string;
+    /** token 调色板；由宿主注入，引擎自身不含具体颜色。 */
+    themeTokens: ThemeTokens;
     debug: boolean;
     processPaused: boolean;
     fonts: Fonts;
@@ -46,6 +52,9 @@ export declare class SceneTree extends MainLoop {
     pixelate: boolean;
     roundPixels: boolean;
     backgroundColor?: Hex8Color;
+    /** 语义色主题；变更时重解析全树 token 色。见 resolveThemeColor。 */
+    theme: string;
+    themeTokens?: ThemeTokens;
     debug: boolean;
     processPaused: boolean;
     fonts: Fonts | undefined;
@@ -73,6 +82,13 @@ export declare class SceneTree extends MainLoop {
     getCurrentViewport(): Viewport | undefined;
     setCurrentViewport(viewport: Viewport | undefined): void;
     getNodeById<T extends Node = Node>(id: string): T | undefined;
+    /**
+     * 语义色 token 解析：`@token` → 当前主题下的实际色。
+     * 非 token（普通颜色字符串/数值）原样返回；token 未在调色板命中时也原样返回（安全回退）。
+     */
+    resolveThemeColor<T = any>(value: T): T | string;
+    /** 主题 / 调色板变更后，重解析全树元素的 token 色（bg/border 即时重设，文字重排重栅格）。 */
+    protected _applyThemeToTree(): void;
     constructor(properties?: Partial<SceneTreeProperties>);
     /** 订阅 fonts 的 load 事件，并在切换 fonts / 销毁时解绑，避免重复订阅与泄漏。 */
     protected _bindFonts(next?: Fonts): void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "modern-canvas",
   "type": "module",
-  "version": "0.27.4",
+  "version": "0.27.6",
   "packageManager": "pnpm@10.19.0",
   "description": "A JavaScript WebGL rendering engine. only the ESM.",
   "author": "wxm",