react-hooks/

1import * as React from "react";
2
3interface <%= _.upperFirst(_.camelCase(name)) %> {
4  counter: number;
5}
6const <%= _.upperFirst(_.camelCase(name)) %>Context = React.createContext<<%= _.upperFirst(_.camelCase(name)) %> | undefined>(undefined);
7
8interface <%= _.upperFirst(_.camelCase(name)) %>ProviderProps {
9  value: <%= _.upperFirst(_.camelCase(name)) %>;
10}
11
12/**
13 * @param {<%= _.upperFirst(_.camelCase(name)) %>ProviderProps} props Props to pass to provider
14 * @param {<%= _.upperFirst(_.camelCase(name)) %>} props.value Initial state for context
15 * @returns {React.ReactElement} Context Provider
16 */
17export function <%= _.upperFirst(_.camelCase(name)) %>Provider({ value, ...props }: <%= _.upperFirst(_.camelCase(name)) %>ProviderProps) {
18  return <<%= _.upperFirst(_.camelCase(name)) %>Context.Provider value={value} {...props} />;
19}
20
21/**
22 * Hook to access state
23 *
24 * @returns {<%= _.upperFirst(_.camelCase(name)) %>} hook to access state and dispatch
25 */
26export function use<%= _.upperFirst(_.camelCase(name)) %>(): <%= _.upperFirst(_.camelCase(name)) %> {
27  const context = React.useContext(<%= _.upperFirst(_.camelCase(name)) %>Context);
28
29  if (!context) {
30    throw new Error(`use<%= _.upperFirst(_.camelCase(name)) %> must be rendered within the <%= _.upperFirst(_.camelCase(name)) %>Provider`);
31  }
32
33  return context;
34}