Docs · @astro-dx/core

@astro-dx/core

Reactive primitives — signal, computed, effect — and lifecycle hooks for ViewTransitions.

signal()

typescript

import { signal } from '@astro-dx/core';

const count = signal(0);

count();           // read → 0
count.set(5);      // write
count.update(v => v + 1);  // update with function
count.subscribe(v => console.log(v)); // subscribe

computed()

typescript

import { signal, computed } from '@astro-dx/core';

const count = signal(0);
const double = computed(() => count() * 2);

double();  // → 0
count.set(3);
double();  // → 6

effect()

typescript

import { signal, effect } from '@astro-dx/core';

const count = signal(0);
const stop = effect(() => {
  console.log('count changed:', count());
});

// stop() to clean up

onPageLoad() / onBeforeSwap()

Lifecycle hooks for Astro ViewTransitions. Fall back gracefully without ViewTransitions.

typescript

import { onPageLoad, onBeforeSwap } from '@astro-dx/core';
import { getElement, destroyAll } from '@astro-dx/dom';

onPageLoad(() => {
  // runs on every navigation AND on first load
  const btn = getElement('#btn');
  btn.on('click', () => { /* ... */ });
});

onBeforeSwap(() => {
  // runs before DOM is replaced
  destroyAll(); // clean up all getElement refs
});