Fill only takes Color, but should be able to take references to gradients and patterns.

[RalfNorthman]

The functions fill and stroke can only take Color (and FillNone in the case of fill) as an argument, but should be able to take references to gradients and patterns. I found this out when I tried to replicate this svg snippet:

<defs>
  <pattern id="pattern1"
           x="10" y="10" width="20" height="20"
           patternUnits="userSpaceOnUse" >

      <circle cx="10" cy="10" r="10" style="stroke: none; fill: #0000ff" />

  </pattern>
</defs>

<rect x="10" y="10" width="100" height="100"
    style="stroke: #000000; fill: url(#pattern1);" />    

(http://tutorials.jenkov.com/svg/fill-patterns.html)

(of course you could do the svg reference with TypedSvg.Attributes.style, but I view that function more like a helper and escape-hatch than something to use on a regular basis in the actual API.)

[RalfNorthman]

1. Should we have a Fill type along the lines of FillNone | Fill Color | Reference String?
2. ...where the string is "pattern1" from the above example and we add the "url(#...)" in the typeToString-function?
3. Should we call it Reference or is something else more suitable?

To reiterate I imagine the call would look like this: fill <| Reference "pattern1". Somewhere in raw svg-land it comes out something like style="fill: url(#pattern1)".

What do you think?

[francescortiz]

These are all the possible values that fill can take:

https://www.w3.org/TR/SVG/painting.html#SpecifyingPaint

Also, according to the MDN, those apply both for fill and stroke:

https://developer.mozilla.org/ca/docs/Web/SVG/Content_type#Paint

This means that stroke and fill should accept exactly the same arguments, and that there are 5 types of values.

[Anton-4]

Can someone close this issue?

[rupertlssmith]

Yes, closing it - will publish a new version with this PR too.

[rupertlssmith]

That's out as 6.0.0. :+1: