import { reactive, on } from '@jsheaven/reactive'

const state = reactive({ rand: 0 })
const otherState = reactive({ rand: 0 })

reactive(() => {
  // using state.rand makes this function re-run when setInterval changes it
  console.log('Next random value', on(state.rand))

  // but using a state like otherState.rand, that isn't maked for reactivity, will never trigger
  console.log('Prev random value (lags behind)', otherState.rand)
})

let i = 0
const interval = setInterval(() => {
  state.rand = otherState.rand // this mutation causes the reactive function to re-run
  otherState.rand = Math.random() // this however, is numb

  if (i === 9) {
    clearInterval(interval) // stops re-running the reactive function
  }
}, 1000)

const { reactive, on } = require('@jsheaven/reactive')

// same API like ESM variant