SVGElementAttrsScope
Our own SVG-specific extensions on top of AttrsScope<SVGElement>
.
At the time of writing this, the SVG APIs for Compose HTML are still underbaked. They are missing a lot of type-safe APIs for various SVG attributes.
We originally thought we would fix this by a liberal use of extension methods (e.g. fun AttrsScope<SVGCircleElement>.cx(value: Number)
), but this approach was fairly inconvenient as doing even the most basic things with SVG elements required a bunch of imports and code completions were slow.
As a compromise, we create our own subclasses of AttrsScope<SVGElement>
and layer our own methods on top of them directly. This approach is basically invisible to users of our APIs while providing a much better developer experience. For example, this approaches uses our Circle extensions seamlessly:
Svg {
Circle {
cx(25)
cy(25)
}
}