Overview
Shared Light / Dark / System preferences. Apps own their CSS palette and controls.
Theme
@absolutejs/themev0.1.0betaFrontend & UXSSR-safe light, dark and system theme preferences for AbsoluteJS applications.
#Installation
BASH
bun add @absolutejs/theme#Capabilities
Overview
Shared Light / Dark / System preferences. Apps own their CSS palette and controls.
themeScript from @absolutejs/theme is a static inline bootstrap. Render it before visible content to restore the saved preference before paint; supply a CSP nonce/hash if your app requires one. It writes data-theme and color-scheme on the document root. Supply CSS media-query defaults for System when JavaScript is unavailable.
React: const { preference, resolved, setPreference } = useTheme() from @absolutejs/theme/react. Use preference for a three-option selector and resolved for canvas/material colors. Defaults to System, reacts to OS changes, syncs across tabs, tolerates unavailable storage, and cleans up listeners. No provider is required. The server snapshot is deterministic for hydration; browser resolution is available after hydration.
Show 2 more
Other frameworks: createThemeStore(window) exposes subscribe, getSnapshot, and setPreference. Create one store per document and unsubscribe on teardown. Call subscribe to activate system/storage listeners. SSR can use the exported immutable serverTheme snapshot.
The preference is stored under absolutejs.theme for the current origin. There is no account or cross-device synchronization. Browser storage failures keep the preference in memory for the current page. Changing to System resumes OS tracking.
Outcomes
What you can build
Hardening checklist
Production guidance
Make every external boundary explicitPin the deployed @absolutejs/theme version, replace example or memory-backed dependencies with durable implementations, bound external calls, protect credentials, and emit enough evidence to retry or recover safely.
Follow in order
Troubleshooting path
1
Trace from the first failed boundary
Reproduce the smallest canonical @absolutejs/theme example, confirm the supported entry point and version in the API explorer, then inspect the first boundary that did not produce its documented result.
#Public entry points
Supported entry points declared by this project’s package manifest. Internal dist paths are not part of the package contract.
Public package entry point declared in package.json.
@absolutejs/theme@absolutejs/theme/react
#Package commands
Scripts declared by this project’s package manifest.
bun run buildbun build src/index.ts src/react.ts --outdir dist --target browser --external react && tsc --emitDeclarationOnly
bun run testbun test
bun run typechecktsc --noEmit
#API reference
Search the declarations exported by the current package type files. Expand a symbol to inspect its source-backed signature.
9 symbols