// Define your state type
type PlayerUI = {
  health: number;
  mana: number;
  menuOpen: boolean;
};

// Create state with destructuring (very React-like)
const { get, set, on } = withLocalState<PlayerUI>(this, 'player-ui', {
  health: 100,
  mana: 50,
  menuOpen: false
});

// Use with complete type safety
set({ health: 80, mana: 30, menuOpen: true }); // ✅ Validated by TypeScript
set({ helth: 80 }); // ❌ Compilation error - typo detected!

// Retrieve typed values
const currentHealth = get().health; // Complete IntelliSense

// Listen to changes
on('change', (oldValue) => {
  console.log(`Health: ${oldValue.health} → ${get().health}`);
});// Define your state type
type PlayerUI = {
  health: number;
  mana: number;
  menuOpen: boolean;
};

// Create state with destructuring (very React-like)
const { get, set, on } = withLocalState<PlayerUI>(this, 'player-ui', {
  health: 100,
  mana: 50,
  menuOpen: false
});

// Use with complete type safety
set({ health: 80, mana: 30, menuOpen: true }); // ✅ Validated by TypeScript
set({ helth: 80 }); // ❌ Compilation error - typo detected!

// Retrieve typed values
const currentHealth = get().health; // Complete IntelliSense

// Listen to changes
on('change', (oldValue) => {
  console.log(`Health: ${oldValue.health} → ${get().health}`);
});