Inline style shorthand notation for a JSX-based framework in TypeScript
I'd like to have JSX attributes in TypeScript like s:background="red" as a shorthand to style={background: "red"}.
The AI gave me this:
type StyleSheetProperties = {
background: string,
};
type StyleSheetPropertyKeys = keyof StyleSheetProperties;
declare global {
namespace JSX {
interface IntrinsicAttributes {
[K in `s:${StyleSheetPropertyKeys}`]?: string | number;
}
}
}
However the line content:
[K in `s:${StyleSheetPropertyKeys}`]
emits the error:
A mapped type may not declare properties or methods. (7061)