Require exactly two of three properties with TypeScript

I have a few React components that need exactly two of three props to represent a time range: from, to, or duration. Any combination of two is enough to derive the third one correctly. So I want TypeScript to enforce that exactly two of these props is required.

I tried defining props like this:

type RangeProps =
  | {
      from: Date
      to: Date
    }
  | {
      from: Date
      duration: number
    }
  | {
      duration: number
      to: Date
    }

But when I supply all three props (<Range from={startDate} duration={duration} to={endDate} />, TypeScript doesn't complain. How can I get it to complain?

You can use the type never, this type means that the property cannot be passed:

type RangeProps =
  | {
      from: Date;
      to: Date;
      duration?: never;
    }
  | {
      from: Date;
      duration: number;
      to?: never;
    }
  | {
      duration: number;
      to: Date;
      from?: never;
    };

playground

use this generic trick T extends never? T : some type check logic

T extends any? some type check logic : never also work