My goal is to call the function getSvgPresentationAttribute using any valid CSS property name as cssStyleAttribute. However, I am encountering an issue with my current code where I receive the error message
Type 'CSSStyleDeclaration' cannot be used as an index type.
.
export function getSvgPresentationAttribute(
element: SVGElement,
cssStyleAttribute: CSSStyleDeclaration,
svgElementAttribute: string
): string | undefined {
const cssStyleValue = element.style[cssStyleAttribute];
if (cssStyleValue !== "") {
return cssStyleValue;
}
return getSvgAttribute(element, svgElementAttribute);
}
I'm seeking guidance on how to resolve this issue. Below is the interface I am currently working with.
interface CSSStyleDeclaration {
alignContent: string;
alignItems: string;
alignSelf: string;
alignmentBaseline: string;
...
}
To make the code functional, I believe I may need a different type or solution. Here's what I have in mind:
type CSSStyleDeclaration =
"alignContent" |
"alignItems" |
"alignSelf" |
"alignmentBaseline";
...
}
I welcome any suggestions or solutions to address this challenge.