Extract shared UI and theme packages

This commit is contained in:
Gregory Schier
2026-03-06 10:30:31 -08:00
parent 6915778c06
commit fd100330a6
33 changed files with 1388 additions and 1021 deletions

View File

@@ -1,12 +1,15 @@
import { listen } from '@tauri-apps/api/event';
import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow';
import { setWindowTheme } from '@yaakapp-internal/mac-window';
import type { ModelPayload } from '@yaakapp-internal/models';
import { getSettings } from './lib/settings';
import type { Appearance } from './lib/theme/appearance';
import { getCSSAppearance, subscribeToPreferredAppearance } from './lib/theme/appearance';
import { getResolvedTheme } from './lib/theme/themes';
import { addThemeStylesToDocument, setThemeOnDocument } from './lib/theme/window';
import { listen } from "@tauri-apps/api/event";
import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
import { setWindowTheme } from "@yaakapp-internal/mac-window";
import type { ModelPayload } from "@yaakapp-internal/models";
import { getSettings } from "./lib/settings";
import type { Appearance } from "./lib/theme/appearance";
import {
getCSSAppearance,
subscribeToPreferredAppearance,
} from "./lib/theme/appearance";
import { getResolvedTheme } from "./lib/theme/themes";
import { applyThemeToDocument } from "@yaakapp-internal/theme";
// NOTE: CSS appearance isn't as accurate as getting it async from the window (next step), but we want
// a good appearance guess so we're not waiting too long
@@ -22,15 +25,15 @@ configureTheme().then(
// need to show it here, after configuring the theme for the first time.
await getCurrentWebviewWindow().show();
},
(err) => console.log('Failed to configure theme', err),
(err) => console.log("Failed to configure theme", err),
);
// Listen for settings changes, the re-compute theme
listen<ModelPayload>('model_write', async (event) => {
if (event.payload.change.type !== 'upsert') return;
listen<ModelPayload>("model_write", async (event) => {
if (event.payload.change.type !== "upsert") return;
const model = event.payload.model.model;
if (model !== 'settings' && model !== 'plugin') return;
if (model !== "settings" && model !== "plugin") return;
await configureTheme();
}).catch(console.error);
@@ -42,8 +45,7 @@ async function configureTheme() {
settings.themeLight,
settings.themeDark,
);
addThemeStylesToDocument(theme.active);
setThemeOnDocument(theme.active);
applyThemeToDocument(theme.active);
if (theme.active.base.surface != null) {
setWindowTheme(theme.active.base.surface);
}