Type a style object that allows width, height, color, and any custom property starting with --.
width and height are optional numbers, and color is an optional string. Any property whose name starts with --, like --brand-color, is allowed with a string value. Everything else, including a misspelled colr, must be a type error, and so must a custom property with a number value. The attempt below compiles, but it's too loose.
type Style = { width?: number; height?: number; color?: string; [property: string]: string | number | undefined;}; // const button: Style = { width: 120, "--brand-color": "rebeccapurple" }; // OK// const typo: Style = { colr: "red" }; // should be a type errorThe answer
Write it yourself first. Then compare it with a reference solution and the checks it passes.
Checking your sign-in…