createContext

Creates a typed context with additional utilities

helpers

test coverage

Last changed: 21 seconds ago

Installation

Library

CLI

Manual

import { createContext } from '@siberiacancode/reactuse';

Usage

const { useSelect, instance, Provider } = createContext<number>(0);

Demo

source

Api

Parameters

Name	Type	Default	Note
defaultValue?	Value | undefined	-	- Default value for the context
options?	CreateContextOptions<Value>	-	- Additional options for context creation

Returns

CreateContextReturn<Value>

Type declaration

import type { JSX, ReactNode } from 'react';

export interface CreateContextOptions {
  /** Display name for the context (useful for debugging) */
  name?: string;
  /** Whether to throw an error if context is used outside of Provider */
  strict?: boolean;
}

export interface ContextValue<Value> {
  /** The context value */
  value: Value | undefined;
  /** The context set function */
  set: (value: Value) => void;
}

export interface ProviderProps<Value> {
  /** The children */
  children?: ReactNode;
  /** The initial value */
  initialValue?: Value;
}

export interface CreateContextReturn<Value> {
  /** The context instance */
  instance: React.Context<ContextValue<Value>>;
  /** The provider component */
  Provider: (props: ProviderProps<Value>) => JSX.Element;
  /** The selector hook */
  useSelect: {
    <Selected>(selector: (value: Value) => Selected): Selected;
    (): ContextValue<Value>;
  };
}

Source

Source • Demo

Contributors