browser-screen
Wraps window.screen as one global atom, synced on resize, orientationchange, and DPR changes.
Install
bun add @valdres/browser-screen
Live example
Loading demo…
Usage
<script>
import { watch } from "valdres-svelte"
import { screenAtom } from "@valdres/browser-screen"
const screen = watch(screenAtom)
</script>
{screen.value.width} × {screen.value.height}
Exports
| Export | Kind | Type |
|---|---|---|
screenAtom | atom (read-only) | ScreenInfo |
ScreenInfo | type | { width, height, availWidth, availHeight, colorDepth, pixelDepth, devicePixelRatio, orientationType, orientationAngle } |
All fields are number except orientationType: OrientationType. Outside the browser the atom returns a fallback (zeros for dimensions; colorDepth/pixelDepth 24, devicePixelRatio 1, orientationType: "landscape-primary").
The browser subscription starts on the first subscriber across all stores and stops when the last one leaves.