re-state
API Reference

createReStateSelect

createReStateSelect creates a hook that reads one key without exposing a setter. It is a good fit for display components that should observe state but not update it directly.

import { createReState, createReStateSelect } from '@raulpesilva/re-state';

type Theme = 'light' | 'dark';

export const useTheme = createReState<Theme>('theme', 'light');
export const useThemeSelect = createReStateSelect<Theme>('theme');
import { useThemeSelect } from '../states/theme';

export function ThemeLabel() {
  const theme = useThemeSelect();
  return <p>Current theme: {theme}</p>;
}

This factory does not initialize the key. In the example, createReState does that first. If nothing initializes the key before the hook renders, the runtime value is undefined.

The hook subscribes only to its key. React compares snapshots with Object.is; it does not use the shallow comparison from useReStateSelector.

API

function createReStateSelect<S>(key: string): () => S;

key identifies the value the hook reads.

Use createReState when the component also needs a setter, or createGetReState to read the value outside React without subscribing.

On this page