Typescript with custom react hook

Question

Trying to write a custom react hook in TypeScript that accepts an object with all optional React.CSSProperties as keys like so...

 const something = useSomthing({ color: { initial: 'red', new: 'blue' } })

Can I write it in a way that i'll get all the css properties in the IDE autocomplete?

Answer 1

You can use keyof and read more here

type Config = {
  [key in keyof React.CSSProperties]?: {
    initial: React.CSSProperties[key];
    new: React.CSSProperties[key];
  }
};

const useSomething = (config:Config)=>{
   ...
}