增加一个Hook供快速获取Color函数使用。

src/ColorFunctionContext.tsx

@@ -1,4 +1,4 @@
-import { createContext, ReactNode, useEffect, useMemo, useState, useTransition } from 'react';
+import { createContext, ReactNode, use, useEffect, useMemo, useState, useTransition } from 'react';
 import { ColorFunctionContext } from './ColorFunctionContext';
 import init, * as funcs from './pkg/color_module';
 
@@ -7,7 +7,7 @@ export type ColorFunctionContextType = {
   isLoading: boolean;
   error: Error | null;
 };
-export const ColorFunctionContext = createContext<ColorFunctionContextType>({
+const ColorFunctionContext = createContext<ColorFunctionContextType>({
   colorFn: null,
   isLoading: true,
   error: null,
@@ -17,6 +17,12 @@ type WasmProviderProps = {
   children?: ReactNode;
 };
 
+export function useColorFunction(): ColorFunctionContextType {
+  const context = use<ColorFunctionContextType>(ColorFunctionContext);
+
+  return context;
+}
+
 export function ColorFunctionProvider({ children }: WasmProviderProps) {
   const [wasmInstance, setWasmInstance] = useState<Wasm.InitOutput | null>(null);
   const [isPending, startTransition] = useTransition();