fix(ts): fixs the use of @ts-ignore when passing custom hooks

package.json

@@ -1,6 +1,6 @@
 {
   "name": "render-hooks",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Inline render-block-stable React hooks",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

src/index.tsx

@@ -47,16 +47,44 @@ type CoreHelpers = typeof coreHelpers;
 /* ----------------------------------------------------------- *
  * 4 ▸ default component                                       *
  * ----------------------------------------------------------- */
-export default function RenderHooks<
-  TValue extends Record<string, Fn> = {},
->(props: {
-  hooks?: TValue;
+type HooksMap = Record<string, any>
+
+type RenderHooksProps<TValue extends HooksMap> = {
+  /**
+   * Optionally pass in a map of hooks to use.
+   * 
+   * @example
+   * 
+   * ```tsx
+   * <RenderHooks hooks={{
+   *   useSomething: () => 'something',
+   * }}>
+   *   {({ useSomething }) => {
+   *     const something = useSomething();
+   *     return (
+   *       <>
+   *         <div>{something}</div>
+   *       </>
+   *     );
+   *   }}
+   * </RenderHooks>
+   * ```
+   */
+  hooks?: {
+    [K in keyof TValue]: TValue[K] extends Fn ? TValue[K] : `Please provide a valid function`
+  }
   children: (helpers: CoreHelpers & TValue) => React.ReactNode;
-}): React.ReactElement {
-  const { hooks, children } = props;
+}
+
+export default function RenderHooks<TValue extends HooksMap>({
+  children,
+  hooks = {} as TValue,
+}: RenderHooksProps<TValue>): React.ReactElement {
   const helpers = React.useMemo(
     () => ({ ...coreHelpers, ...(hooks ?? {}) }),
     [hooks],
   ) as CoreHelpers & TValue;
+
   return <>{children(helpers)}</>;
 }
+

src/stories/02-CustomHooks.stories.tsx

@@ -28,7 +28,6 @@ const useDebounce = <T,>(value: T, delay: number): T => {
 export function CustomHooksExample() {
   return (
     <$ hooks={{ useToggle, useDebounce }}>
-      {/* @ts-ignore */}
       {({ useToggle, useDebounce, useState }) => { // Added useState for completeness
         const [open, toggle] = useToggle(false);
         const dOpen = useDebounce(open, 250);