Reactive Proxy StateStandalone Reactivity System

import { reactive, ref, computed, watchEffect } from '@yiin/reactive-proxy-state';

// Create reactive state
const count = ref(0);
const user = reactive({
  name: 'Alice',
  settings: { theme: 'dark' }
});

// Create a computed property
const greeting = computed(() => 
  `Hello, ${user.name}! Count is ${count.value}`
);

// Track changes with watchEffect
watchEffect(() => {
  console.log(greeting.value);
  console.log(`Theme: ${user.settings.theme}`);
});
// Output: Hello, Alice! Count is 0
// Output: Theme: dark

// Update state - effects automatically re-run
count.value++;
// Output: Hello, Alice! Count is 1
// Output: Theme: dark

user.name = 'Bob';
// Output: Hello, Bob! Count is 1
// Output: Theme: dark

user.settings.theme = 'light';
// Output: Hello, Bob! Count is 1
// Output: Theme: light