babbcb1dc5
- New 'custom' ThemeId with dedicated ThemeCard + pencil edit button - CustomStyleModal: two-column editor for all node types (excl. groupRect/group) and edge types - Per node: border, background, icon color + opacity, default size (w/h) - Per edge: color + opacity, path style, animation - 'Apply to existing [Type]' per type, 'Apply All to Canvas' footer action - canvasStore: applyTypeNodeStyle, applyTypeEdgeStyle, applyAllCustomStyles actions - themeStore: customStyle state + setCustomStyle action - Backend: custom_style JSON column on canvas_state (ALTER TABLE migration), saved/loaded with canvas - App.tsx: custom_style included in save payload, restored on load (API + standalone) - Tests: +8 frontend (themeStore + canvasStore), +3 backend (canvas API)
18 lines
518 B
TypeScript
18 lines
518 B
TypeScript
import { create } from 'zustand'
|
|
import type { ThemeId } from '@/utils/themes'
|
|
import type { CustomStyleDef } from '@/types'
|
|
|
|
interface ThemeState {
|
|
activeTheme: ThemeId
|
|
setTheme: (id: ThemeId) => void
|
|
customStyle: CustomStyleDef
|
|
setCustomStyle: (def: CustomStyleDef) => void
|
|
}
|
|
|
|
export const useThemeStore = create<ThemeState>((set) => ({
|
|
activeTheme: 'default',
|
|
setTheme: (id) => set({ activeTheme: id }),
|
|
customStyle: { nodes: {}, edges: {} },
|
|
setCustomStyle: (def) => set({ customStyle: def }),
|
|
}))
|