Menú
Gate Lit element UI on Persist hydration with HydrationController. Use when wiring HydrationSignal into a ReactiveControllerHost; not a hook.
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Basado en la clasificación ocupacional SOC
| name | lit-persist |
| description | Gate Lit element UI on Persist hydration with HydrationController. Use when wiring HydrationSignal into a ReactiveControllerHost; not a hook. |
| license | MIT |
| metadata | {"type":"framework","library":"@stainless-code/persist","library_version":"0.4.1","framework":"lit"} |
| requires | ["persist"] |
| sources | ["stainless-code/persist:src/adapters/frameworks/lit.ts"] |
@stainless-code/persist/frameworks/lit exports HydrationController — a ReactiveController, not a hook. Constructor calls host.addController(this); subscribes on hostConnected, tears down on hostDisconnected.
bun add @stainless-code/persist lit
Peer: lit >=3.0.0.
import { LitElement, html } from "lit";
import { HydrationController } from "@stainless-code/persist/frameworks/lit";
class PrefsEl extends LitElement {
#hydration = new HydrationController(this, prefsHydration);
render() {
return this.#hydration.hydrated
? html`<prefs-panel></prefs-panel>`
: html`<skeleton-el></skeleton-el>`;
}
}
useHydrated for Lit. Use the controller.hydrated outside render — the controller already requestUpdates on connect/change; read the getter in render().hydrated true, no subscribe.new HydrationController(host, signal) — getter hydrated: booleanGate Alpine.js UI on Persist hydration (Alpine.plugin + useHydrated / $hydrated). Use when wiring HydrationSignal into Alpine data components.
Gate Angular UI on Persist hydration with useHydrated (readonly Signal). Call inside an injection context; use when avoiding flash of default state on async backends.
Persist with React Native AsyncStorage via @stainless-code/persist/backends/async-storage. Use for RN string-wire JSON state; always gate with useHydrated.
Compress a string-wire StateStorage with @stainless-code/persist/backends/compressed (gzip/deflate). Backend wrapper — compose with createStorage; stack compress-then-encrypt.
Cross-tab sync for backends without storage events via @stainless-code/persist/transport/crosstab (createBroadcastCrossTab). Wrap storage + pass crossTabEventTarget; call close() on teardown.
AES-GCM encrypt a string-wire StateStorage with @stainless-code/persist/backends/encrypted (createEncryptedStorage). Backend wrapper — compose with createStorage + codec; wrong key rejects hydrate (not clearCorrupt).