browser-online

Reactive online/offline status. Wraps navigator.onLine and the online / offline events as a single global atom that any framework can read.

Install

bun add @valdres/browser-online

Live example

Usage

<script setup>
import { useValue } from "valdres-vue"
import { onlineAtom } from "@valdres/browser-online"

const online = useValue(onlineAtom) // Ref<boolean>
</script>

<template>{{ online ? "Online" : "Offline" }}</template>

The hook reads from the store provided by your app (see createValdres); the atom's value is kept in sync across every store automatically.

Exports

Cross-framework

onlineAtom is a global atom, so it works identically in every framework — only the read primitive's name changes (useValue, createValue, injectValue, watch, or store.get / store.sub in plain JavaScript). The browser subscription starts on the first subscriber across all stores and stops when the last one leaves.