The basic structure of my hook:

const useMyHook = () => {
  const func1 = (): boolean => { ... }
  const func2 = (type: "type1" | "type2"): boolean => { ... }
  const func3 = (): boolean => { ... }

  return {
    func1, func2, func3
  }
}

export default useMyHook

I'm currently using it like this, which works in dev, but breaks my build.

import useMyHook from "../hooks/useMyHook";

const { func1 } = useMyHook()

const handleSubmit = (e: React.FormEvent) => {
  e.preventDefault();
  const isValid = func1();

  if (isValid) {
  // do more things
  }
}

return (
  <form>...</form>
)

When running yarn build, I am faced with this error:

Objects are not valid as a React child (found: object with keys {func1, func2, func3}). If you meant to render a collection of children, use an array instead.

My attempt at solving this was to export my custom hook functions in an array, as the error seemed to suggest.

  return [
    func1, func2, func3
  ]

And using it like this:

  const [ func1 ] = useMyHook();
  const isValid = func1();

TypeScript is not happy with this:

An argument for 'type' was not provided.

But this is confusing, because func1 does not accept a type argument as func2 does.

Questions

1. Is there some way I work around this build-time error and export the { } of functions? This feels like the cleanest approach.

2. If there is no way to achieve 1, how can I properly use the exported array of functions without my types being misread?