tt/ttstd-infinite-canvas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(canvas): 画布外观 - 默认使用黑色点网格并保留自定义配置

Browse Source
This commit is contained in:
ddCat
2026-09-22 15:47:49 +08:00
parent 2cd30b9951
commit da24992afe
8 changed files with 56 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/stores/canvas/use-canvas-store.ts
View File

@@ -3,11 +3,11 @@ import { persist, type PersistStorage, type StorageValue } from "zustand/middlew
import { nanoid } from "nanoid";
import { sameCanvasContent } from "@/lib/canvas/canvas-content";
import { DEFAULT_CANVAS_BACKGROUND_MODE, normalizeCanvasAppearance, readCanvasAppearanceDefault, type CanvasAppearance } from "@/lib/canvas/canvas-appearance";
import { canvasAppearanceForTheme, DEFAULT_CANVAS_BACKGROUND_MODE, normalizeCanvasAppearance, readCanvasAppearanceDefault, type CanvasAppearance } from "@/lib/canvas/canvas-appearance";
import { parseCanvasStorageDocument, rebaseCanvasProjects, serializeCanvasStorageDocument, type CanvasStorageDocument } from "@/lib/canvas/canvas-storage-revision";
import { localForageStorageForScope } from "@/lib/localforage-storage";
import { getActiveUserScope } from "@/lib/user-scope";
import type { CanvasBackgroundMode } from "@/lib/canvas-theme";
import { DEFAULT_CANVAS_COLOR_THEME, type CanvasBackgroundMode } from "@/lib/canvas-theme";
import type { CanvasStarterMode } from "@/lib/canvas/canvas-starter";
import type { CanvasAssistantSession, CanvasConnection, CanvasNodeData, ViewportTransform } from "@/types/canvas";
import type { DirectorScene } from "@/types/director";
@@ -461,7 +461,7 @@ export const useCanvasStore = create<CanvasStore>()(
connections: [],
chatSessions: [],
activeChatId: null,
appearance: appearanceDefault?.appearance,
appearance: appearanceDefault?.appearance ?? canvasAppearanceForTheme(DEFAULT_CANVAS_COLOR_THEME),
backgroundMode: appearanceDefault?.backgroundMode || DEFAULT_CANVAS_BACKGROUND_MODE,
showImageInfo: false,
viewport: initialViewport,

8
web/src/stores/canvas/use-canvas-theme-store.ts
View File

@@ -3,17 +3,21 @@ import { persist } from "zustand/middleware";
import type { ThemeName } from "@/stores/use-theme-store";
import { useThemeStore } from "@/stores/use-theme-store";
import { useLayoutEffect } from "react";
import { DEFAULT_CANVAS_COLOR_THEME } from "@/lib/canvas-theme";
type CanvasThemeStore = { theme: ThemeName; active: boolean; setTheme: (theme: ThemeName) => void };
/** 画布外观是编辑器状态，不能写入用户工作台的全局主题。 */
export const useCanvasThemeStore = create<CanvasThemeStore>()(
persist(
(set) => ({ theme: "light", active: false, setTheme: (theme) => { if (theme === "light" || theme === "dark") set({ theme }); } }),
(set) => ({ theme: DEFAULT_CANVAS_COLOR_THEME, active: false, setTheme: (theme) => { if (theme === "light" || theme === "dark") set({ theme }); } }),
{
name: "infinite-canvas:canvas-theme",
partialize: ({ theme }) => ({ theme }),
merge: (persisted, current) => ({ ...current, theme: (persisted as Partial<CanvasThemeStore> | null)?.theme === "dark" ? "dark" : "light" }),
merge: (persisted, current) => {
const theme = (persisted as Partial<CanvasThemeStore> | null)?.theme;
return { ...current, theme: theme === "light" || theme === "dark" ? theme : DEFAULT_CANVAS_COLOR_THEME };
},
},
),
);