Skip to content

Latest commit

 

History

History

README.md

@nano_kit/platform-web

ESM-only package NPM version Dependencies status Install size Build status Coverage status

Web platform adapters and reactive helpers for @nano_kit/store.

  • Reactive Web APIs. Signals for storage, media queries, window properties, permissions, geolocation, cookies, and cross-tab messages.
  • SSR-friendly. Helpers use fallbacks or lazy browser access where possible.
  • Type-safe. Codec-aware storage helpers keep app values typed.
  • Tree-Shakeable. Import only the browser primitives you need.

Installation

pnpm add @nano_kit/store @nano_kit/platform-web
# or
npm install @nano_kit/store @nano_kit/platform-web
# or
yarn add @nano_kit/store @nano_kit/platform-web

Quick Start

import {
  BooleanCodec,
  effect
} from '@nano_kit/store'
import {
  $networkOnline,
  $pageVisible,
  broadcasted,
  localStored,
  mediaQuery
} from '@nano_kit/platform-web'

const $dark = localStored('dark', false, BooleanCodec)
const $wide = mediaQuery('(min-width: 768px)', false)
const $authEvent = broadcasted<'logout' | 'refresh'>('auth')

const stop = effect(() => {
  console.log({
    dark: $dark(),
    online: $networkOnline(),
    pageVisible: $pageVisible(),
    wide: $wide()
  })
})

$dark(true)
$authEvent('logout')

stop()

Documentation

For comprehensive guides, advanced patterns, and API reference, visit the documentation website.