Let's say I have a component interface that should extend the interface of a standard <div> element. What's the difference in writing this:
interface ComponentProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> { ... }
versus this:
interface ComponentProps extends React.HTMLAttributes<HTMLDivElement> { ... }
lets create ComponentProps types:
interface ComponentProps1 extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {}
interface ComponentProps2 extends React.HTMLAttributes<HTMLDivElement> {}
then we can check the difference between them quite easily:
type Dif = Omit<ComponentProps1, keyof ComponentProps2>;
the Dif type is:
type Dif = {
ref?: LegacyRef<HTMLDivElement>;
key?: string | number;
}