title: typescript type mismatch issue
body: <p>I was going through <a href="https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/context/" rel="nofollow noreferrer">react typescript cheatsheet</a> and one code snippet caught my attention:</p>
  <pre><code>export function createCtx&lt;A&gt;(defaultValue: A) {
   type UpdateType = Dispatch&lt;SetStateAction&lt;typeof defaultValue&gt;&gt;;
   const defaultUpdate: UpdateType = () =&gt; defaultValue;
   const ctx = createContext({
     state: defaultValue,
     update: defaultUpdate,
   });
  
   function Provider(props: PropsWithChildren&lt;{}&gt;) {
     const [state, update] = useState(defaultValue);
     return &lt;ctx.Provider value={{ state, update }} {...props} /&gt;;
   }
   return [ctx, Provider] as const; // alternatively, [typeof ctx, typeof Provider]
  }
  </code></pre>
  <p>the purpose of this function function is to create a context and provider based on the <code>defaultValue</code> passed to the function.
  I have difficulty understanding the first two lines of the function:</p>
  <pre><code> type UpdateType = Dispatch&lt;SetStateAction&lt;typeof defaultValue&gt;&gt;;
   const defaultUpdate: UpdateType = () =&gt; defaultValue;
  </code></pre>
  <p><code>Dispatch</code> is defined as:</p>
  <pre><code>type Dispatch&lt;A&gt; = (value: A) =&gt; void;
  </code></pre>
  <p>and <code>SetStateAction</code> as:</p>
  <pre><code>type SetStateAction&lt;S&gt; = S | ((prevState: S) =&gt; S);
  </code></pre>
  <p>this make <code>() =&gt; defaultValue</code> not assignable to type <code>UpdateType</code>, How this can possible.</p>