chore: initialize from frontend template 4dc033c
This commit is contained in:
@@ -0,0 +1,36 @@
|
||||
import {
|
||||
normalizeColorSchemePreference,
|
||||
resolveColorScheme,
|
||||
} from "../application/policies/color-scheme.ts";
|
||||
import type { ApplicationApi } from "../application/ports/in/application-api.ts";
|
||||
|
||||
type ColorSchemeBrowser = Readonly<{
|
||||
documentElement?: HTMLElement;
|
||||
matchMedia?: (query: string) => Pick<MediaQueryList, "matches">;
|
||||
}>;
|
||||
|
||||
/** Applies the persisted public preference before React paints. */
|
||||
export function initializeColorScheme(
|
||||
preferences: Pick<ApplicationApi["preferences"], "getColorScheme">,
|
||||
browser: ColorSchemeBrowser = {},
|
||||
) {
|
||||
const documentElement = browser.documentElement ?? document.documentElement;
|
||||
const matchMedia =
|
||||
browser.matchMedia ??
|
||||
(typeof window.matchMedia === "function"
|
||||
? window.matchMedia.bind(window)
|
||||
: () => ({ matches: false }));
|
||||
const preference = normalizeColorSchemePreference(
|
||||
preferences.getColorScheme(),
|
||||
);
|
||||
const resolved = resolveColorScheme(
|
||||
preference,
|
||||
matchMedia("(prefers-color-scheme: dark)").matches,
|
||||
);
|
||||
|
||||
documentElement.dataset.theme = resolved;
|
||||
documentElement.dataset.themePreference = preference;
|
||||
documentElement.style.colorScheme = resolved;
|
||||
|
||||
return Object.freeze({ preference, resolved });
|
||||
}
|
||||
Reference in New Issue
Block a user