├── .gitignore ├── src ├── TypedSvg │ ├── Deprecated.elm │ ├── Extra │ │ └── InPx.elm │ ├── Core.elm │ ├── Attributes │ │ ├── InEm.elm │ │ └── InPx.elm │ ├── Events.elm │ ├── Filters.elm │ ├── Types.elm │ ├── Filters │ │ └── Attributes.elm │ ├── TypesToStrings.elm │ └── Attributes.elm ├── Examples │ ├── Basic.elm │ ├── RectangleInPx.elm │ ├── SumAnimateTransform.elm │ ├── Paints.elm │ └── GradientsPatterns.elm └── TypedSvg.elm ├── elm.json ├── LICENSE └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | # elm-package generated files 2 | elm-stuff/ 3 | # elm-repl generated files 4 | repl-temp-* 5 | 6 | .DS_Store 7 | -------------------------------------------------------------------------------- /src/TypedSvg/Deprecated.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Deprecated exposing (altGlyph, altGlyphDef, altGlyphItem) 2 | 3 | {-| Deprecated SVG Elements 4 | 5 | 6 | # Glyphs 7 | 8 | @docs altGlyph, altGlyphDef, altGlyphItem 9 | 10 | -} 11 | 12 | import TypedSvg.Core exposing (Attribute, Svg, node) 13 | 14 | 15 | {-| -} 16 | altGlyph : List (Attribute msg) -> List (Svg msg) -> Svg msg 17 | altGlyph = 18 | node "altGlyph" 19 | 20 | 21 | {-| -} 22 | altGlyphDef : List (Attribute msg) -> List (Svg msg) -> Svg msg 23 | altGlyphDef = 24 | node "altGlyphDef" 25 | 26 | 27 | {-| -} 28 | altGlyphItem : List (Attribute msg) -> List (Svg msg) -> Svg msg 29 | altGlyphItem = 30 | node "altGlyphItem" 31 | -------------------------------------------------------------------------------- /src/Examples/Basic.elm: -------------------------------------------------------------------------------- 1 | module Examples.Basic exposing (main) 2 | 3 | import Color 4 | import Html exposing (Html) 5 | import TypedSvg exposing (circle, svg) 6 | import TypedSvg.Attributes exposing (cx, cy, fill, r, stroke, strokeWidth, viewBox) 7 | import TypedSvg.Types exposing (Paint(..), px) 8 | import TypedSvg.Core exposing (Svg) 9 | 10 | 11 | myCircle : Svg msg 12 | myCircle = 13 | circle 14 | [ cx (px 100) 15 | , cy (px 100) 16 | , r (px 30) 17 | , fill <| Paint Color.blue 18 | , strokeWidth (px 2) 19 | , stroke <| Paint <| Color.rgba 0.8 0 0 0.5 20 | ] 21 | [] 22 | 23 | main : Html msg 24 | main = 25 | svg [ viewBox 0 0 800 600 ] [ myCircle ] -------------------------------------------------------------------------------- /elm.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "package", 3 | "name": "elm-community/typed-svg", 4 | "summary": "A Typed SVG (Scalable Vector Graphics) builder", 5 | "license": "BSD-3-Clause", 6 | "version": "7.0.0", 7 | "exposed-modules": [ 8 | "TypedSvg", 9 | "TypedSvg.Core", 10 | "TypedSvg.Types", 11 | "TypedSvg.Attributes", 12 | "TypedSvg.Attributes.InEm", 13 | "TypedSvg.Attributes.InPx", 14 | "TypedSvg.Extra.InPx", 15 | "TypedSvg.Filters", 16 | "TypedSvg.Filters.Attributes", 17 | "TypedSvg.Events" 18 | ], 19 | "elm-version": "0.19.0 <= v < 0.20.0", 20 | "dependencies": { 21 | "avh4/elm-color": "1.0.0 <= v < 2.0.0", 22 | "elm/core": "1.0.0 <= v < 2.0.0", 23 | "elm/html": "1.0.0 <= v < 2.0.0", 24 | "elm/json": "1.0.0 <= v < 2.0.0", 25 | "elm/virtual-dom": "1.0.0 <= v < 2.0.0" 26 | }, 27 | "test-dependencies": {} 28 | } 29 | -------------------------------------------------------------------------------- /src/Examples/RectangleInPx.elm: -------------------------------------------------------------------------------- 1 | module Examples.RectangleInPx exposing (main) 2 | 3 | {-| Using TypedSvg.Attributes.InPx makes it unnecessary to prefix 4 | each numeric length with the `px` function. 5 | -} 6 | 7 | import Color 8 | import Html exposing (Html) 9 | import TypedSvg exposing (rect, svg) 10 | import TypedSvg.Attributes exposing (fill, stroke, viewBox) 11 | import TypedSvg.Attributes.InPx exposing (height, strokeWidth, width, x, y) 12 | import TypedSvg.Types exposing (Paint(..)) 13 | import TypedSvg.Core exposing (Svg) 14 | 15 | 16 | myRectangle : Svg msg 17 | myRectangle = 18 | rect 19 | [ x 100 20 | , y 100 21 | , width 200 22 | , height 200 23 | , fill <| Paint Color.white 24 | , strokeWidth 2 25 | , stroke <| Paint Color.black 26 | ] 27 | [] 28 | 29 | 30 | 31 | main : Html msg 32 | main = 33 | svg [ viewBox 0 0 800 600 ] [ myRectangle ] 34 | -------------------------------------------------------------------------------- /src/TypedSvg/Extra/InPx.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Extra.InPx exposing (centeredImage) 2 | 3 | {-| Typed SVG elements that default to `px` units 4 | 5 | 6 | # Helpers 7 | 8 | @docs centeredImage 9 | 10 | -} 11 | 12 | import TypedSvg exposing (image) 13 | import TypedSvg.Attributes exposing (xlinkHref) 14 | import TypedSvg.Attributes.InPx exposing (height, width, x, y) 15 | import TypedSvg.Core exposing (Svg) 16 | 17 | 18 | {-| Centers an image (png, svg, etc.) referenced by an url string and with a given image width and height on the given x, y coordinate. Usage example: 19 | 20 | let 21 | width = 22 | 50.5 23 | 24 | height = 25 | 50.5 26 | 27 | x = 28 | 150 29 | 30 | y = 31 | 200 32 | in 33 | centeredImage "/images/example.png" width height x y 34 | 35 | -} 36 | centeredImage : String -> Float -> Float -> Float -> Float -> Svg msg 37 | centeredImage href w_ h_ x_ y_ = 38 | image 39 | [ x (x_ - w_ / 2) 40 | , y (y_ - h_ / 2) 41 | , width w_ 42 | , height h_ 43 | , xlinkHref href 44 | ] 45 | [] 46 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2018 Elm Community Members. 2 | 3 | Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: 4 | 5 | 1. Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. 6 | 7 | 2. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution. 8 | 9 | 3. Neither the name of the copyright holder nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. 10 | 11 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 12 | -------------------------------------------------------------------------------- /src/Examples/SumAnimateTransform.elm: -------------------------------------------------------------------------------- 1 | module Examples.SumAnimateTransform exposing (main) 2 | 3 | import Color 4 | import Html exposing (Html) 5 | import TypedSvg exposing (..) 6 | import TypedSvg.Attributes exposing (attributeName, attributeType, animateTransformType, from, from3, to, to3, begin, dur, repeatCount, additive, stroke, fill) 7 | import TypedSvg.Types exposing (..) 8 | import TypedSvg.Core exposing (Svg) 9 | import TypedSvg.Attributes.InPx exposing (x, y, width, height) 10 | 11 | 12 | myScale : Svg msg 13 | myScale = 14 | animateTransform 15 | [ attributeName "transform" 16 | , attributeType AttributeTypeXml 17 | , animateTransformType AnimateTransformTypeScale 18 | , from 1 19 | , to 3 20 | , begin [ TimingOffsetValue "0s" ] 21 | , dur <| Duration "10s" 22 | , repeatCount RepeatIndefinite 23 | , additive AdditiveSum 24 | ] 25 | [] 26 | 27 | 28 | myRotate : Svg msg 29 | myRotate = 30 | animateTransform 31 | [ attributeName "transform" 32 | , attributeType AttributeTypeXml 33 | , animateTransformType AnimateTransformTypeRotate 34 | , from3 0 30 20 35 | , to3 360 30 20 36 | , begin [ TimingOffsetValue "0s" ] 37 | , dur <| Duration "10s" 38 | , repeatCount RepeatIndefinite 39 | , additive AdditiveSum 40 | ] 41 | [] 42 | 43 | 44 | myRectangle : Svg msg 45 | myRectangle = 46 | rect 47 | [ x 10 48 | , y 10 49 | , width 40 50 | , height 20 51 | , stroke <| Paint Color.black 52 | , fill PaintNone 53 | ] 54 | [ myScale 55 | , myRotate 56 | ] 57 | 58 | 59 | main : Html msg 60 | main = 61 | svg [] [ myRectangle ] 62 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # TypedSvg 2 | 3 | TypedSvg is an Elm package that makes it more pleasant to work with SVG (Scalable Vector Graphics). It is based on [nphollon's](https://github.com/nphollon/typed-svg) original work. 4 | 5 | ## Status 6 | 7 | TypedSvg is a work-in-progress. It intends to replace `elm-lang/svg` with a fully typed and documented equivalent. However, as it stands now, there is still work to be done in covering documentation for the entire (very large) SVG spec, as well as potential re-organization work in how the public modules are presented as an API. 8 | 9 | TL;DR this package will change 10 | 11 | ## Modules 12 | 13 | - `TypedSvg` contains SVG elements like `circle` and `rect`. 14 | - `TypedSvg.Core` contains basic building blocks like `node` and `attribute`, as well as the `Svg` and `Attribute` types. 15 | - `TypedSvg.Types` contains all of the types, as well as some length type helpers like `px` and `em`. 16 | - `TypedSvg.Attributes` contains typed attributes like `fill`, `strokeWidth` and `svgBox` 17 | - `TypedSvg.Filters` contains filter elements. 18 | - `TypedSvg.Filters.Attributes` contains filter element attributes. 19 | - `TypedSvg.Events` contains SVG event attributes like `onLoad`, `onClick` and `onMouseOver`. 20 | 21 | ## Usage 22 | 23 | ```elm 24 | import Color 25 | import Html exposing (Html) 26 | import TypedSvg exposing (circle, svg) 27 | import TypedSvg.Attributes exposing (cx, cy, fill, r, stroke, strokeWidth, viewBox) 28 | import TypedSvg.Types exposing (Paint(..), px) 29 | import TypedSvg.Core exposing (Svg) 30 | 31 | 32 | myCircle : Svg msg 33 | myCircle = 34 | circle 35 | [ cx (px 100) 36 | , cy (px 100) 37 | , r (px 30) 38 | , fill <| Paint Color.blue 39 | , strokeWidth (px 2) 40 | , stroke <| Paint <| Color.rgba 0.8 0 0 0.5 41 | ] 42 | [] 43 | 44 | main : Html msg 45 | main = 46 | svg [ viewBox 0 0 800 600 ] [ myCircle ] 47 | ``` 48 | 49 | ## Sister Packages 50 | 51 | TypedSvg works well in conjunction with `folkertdev/svg-path-dsl` if you need a typed path domain-specific language. 52 | 53 | ## License 54 | 55 | Apache 2.0 56 | -------------------------------------------------------------------------------- /src/Examples/Paints.elm: -------------------------------------------------------------------------------- 1 | module Examples.Paints exposing (main) 2 | 3 | import Color 4 | import Html exposing (Html, div, node) 5 | import TypedSvg exposing (circle, g, pattern, rect, svg, text_) 6 | import TypedSvg.Attributes exposing (cx, cy, fill, id, patternUnits, r, stroke, strokeWidth, textAnchor, transform, viewBox) 7 | import TypedSvg.Attributes.InPx exposing (fontSize, height, width, x, y) 8 | import TypedSvg.Core exposing (Svg, text) 9 | import TypedSvg.Types exposing (AnchorAlignment(..), CoordinateSystem(..), Paint(..), Transform(..), px) 10 | 11 | 12 | drawCircle : Paint -> Float -> String -> Svg msg 13 | drawCircle paint left label = 14 | g 15 | [ transform [ Translate left 60 ] ] 16 | [ circle 17 | [ cx (px 30) 18 | , cy (px 0) 19 | , r (px 30) 20 | , fill paint 21 | , stroke <| Paint Color.grey 22 | ] 23 | [] 24 | , text_ [ x 30, y 40, textAnchor AnchorMiddle ] [ text label ] 25 | ] 26 | 27 | 28 | main : Html msg 29 | main = 30 | div [] 31 | [ node "style" [] [ text """ 32 | :root {--custom-pink: #f0bbd1;} 33 | svg {font-family: monospace; font-size: 5px;} 34 | """ ] 35 | , svg [ viewBox 0 0 800 600 ] 36 | [ pattern 37 | [ id "chessPattern" 38 | , width 50 39 | , height 50 40 | , patternUnits CoordinateSystemUserSpaceOnUse 41 | ] 42 | [ rect [ x 0, y 0, width 25, height 25, fill <| Paint <| Color.rgb255 184 0 0 ] [] 43 | , rect [ x 25, y 0, width 25, height 25, fill <| Paint <| Color.rgb255 25 25 25 ] [] 44 | , rect [ x 0, y 25, width 25, height 25, fill <| Paint <| Color.rgb255 25 25 25 ] [] 45 | , rect [ x 25, y 25, width 25, height 25, fill <| Paint <| Color.rgb255 184 0 0 ] [] 46 | ] 47 | , drawCircle (Paint Color.red) 10 "Paint Color.red" 48 | , drawCircle (CSSVariable "--custom-pink") 90 "CSSVariable \"--custom-pink\"" 49 | , drawCircle (Reference "chessPattern") 170 "Reference \"chessPattern\"" 50 | , drawCircle PaintNone 250 "PaintNone" 51 | ] 52 | ] 53 | -------------------------------------------------------------------------------- /src/Examples/GradientsPatterns.elm: -------------------------------------------------------------------------------- 1 | module Examples.GradientsPatterns exposing (main) 2 | 3 | import Color 4 | import Html exposing (Html) 5 | import TypedSvg exposing (rect, circle, polygon, svg, linearGradient, radialGradient, pattern, stop, defs) 6 | import TypedSvg.Attributes exposing (id, fill, stroke, viewBox, stopColor, offset, stopOpacity, x1, y1, x2, y2, cx, cy, fx, fy, r, patternUnits, points) 7 | import TypedSvg.Attributes.InPx as InPx 8 | import TypedSvg.Attributes.InPx exposing (height, strokeWidth, width, x, y) 9 | import TypedSvg.Types exposing (Paint(..), Opacity(..), Length(..), CoordinateSystem(..)) 10 | import TypedSvg.Core exposing (Svg) 11 | 12 | 13 | myDefs : List (Svg msg) 14 | myDefs = 15 | [ linearGradient 16 | [ id "linGradientTripHor" ] 17 | [ stop [ offset "0%", stopColor "rgb(255, 255, 255)" ] [] 18 | , stop [ offset "50%", stopColor "rgb(184, 0, 0)"] [] 19 | , stop [ offset "100%", stopColor "rgb(0,0,0)" ] [] 20 | ] 21 | , linearGradient 22 | [ id "linGradientDuoVert" 23 | , x1 <| Percent 0.0 24 | , y1 <| Percent 0.0 25 | , x2 <| Percent 0.0 26 | , y2 <| Percent 100.0 27 | ] 28 | [ stop [ offset "0%", stopColor "#434343" , stopOpacity <| Opacity 1.0 ] [] 29 | , stop [ offset "100%", stopColor "#000000" , stopOpacity <| Opacity 1.0 ] [] 30 | ] 31 | , radialGradient 32 | [ id "radGradient" 33 | , cx <| Percent 50.0 34 | , cy <| Percent 50.0 35 | , r <| Percent 80.0 36 | , fx <| Percent 50.0 37 | , fy <| Percent 50.0 38 | ] 39 | [ stop [ offset "0%", stopColor "rgb(184, 0, 0)" , stopOpacity <| Opacity 1.0 ] [] 40 | , stop [ offset "100%", stopColor "rgb(0, 0, 0)" , stopOpacity <| Opacity 1.0 ] [] 41 | ] 42 | , pattern 43 | [ id "chessPattern" 44 | , width 50 45 | , height 50 46 | , patternUnits CoordinateSystemUserSpaceOnUse] 47 | [ rect [ x 0, y 0, width 25, height 25, fill <| Paint <| Color.rgb255 184 0 0 ][] 48 | , rect [ x 25, y 0, width 25, height 25, fill <| Paint <| Color.rgb255 25 25 25 ][] 49 | , rect [ x 0, y 25, width 25, height 25, fill <| Paint <| Color.rgb255 25 25 25 ][] 50 | , rect [ x 25, y 25, width 25, height 25, fill <| Paint <| Color.rgb255 184 0 0 ][] 51 | ] 52 | ] 53 | 54 | myRectangle : Svg msg 55 | myRectangle = 56 | rect 57 | [ x 100 58 | , y 100 59 | , width 150 60 | , height 150 61 | , fill <| Reference "linGradientTripHor" 62 | , strokeWidth 8 63 | , stroke <| Reference "linGradientDuoVert" 64 | ] 65 | [] 66 | 67 | 68 | myCircle : Svg msg 69 | myCircle = 70 | circle 71 | [ InPx.cx 375 72 | , InPx.cy 175 73 | , InPx.r 70 74 | , fill <| Reference "radGradient" 75 | , strokeWidth 8 76 | , stroke <| Reference "linGradientDuoVert" 77 | ] 78 | [] 79 | 80 | 81 | myTriangle : Svg msg 82 | myTriangle = 83 | polygon 84 | [ points [(500,110), (650,110), (575, 240)] 85 | , fill <| Reference "chessPattern" 86 | , strokeWidth 8 87 | , stroke <| Reference "linGradientDuoVert" 88 | ] 89 | [] 90 | 91 | -- 92 | 93 | main : Html msg 94 | main = 95 | svg [ viewBox 0 0 800 600 ] [ defs [] myDefs, myRectangle, myCircle, myTriangle] -------------------------------------------------------------------------------- /src/TypedSvg/Core.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Core exposing 2 | ( Svg, text, node, map, foreignObject 3 | , Attribute, attribute, attributeNS, svgNamespace 4 | ) 5 | 6 | {-| 7 | 8 | 9 | # SVG Nodes 10 | 11 | @docs Svg, text, node, map, foreignObject 12 | 13 | 14 | # SVG Attributes 15 | 16 | @docs Attribute, attribute, attributeNS, svgNamespace 17 | 18 | -} 19 | 20 | import Html 21 | import Json.Encode as Json 22 | import VirtualDom 23 | 24 | 25 | {-| The core building block to create SVG. This library is filled with helper 26 | functions to create these `Svg` values. 27 | -} 28 | type alias Svg msg = 29 | VirtualDom.Node msg 30 | 31 | 32 | {-| Set attributes on your `Svg`. 33 | -} 34 | type alias Attribute msg = 35 | VirtualDom.Attribute msg 36 | 37 | 38 | {-| -} 39 | svgNamespace : Attribute msg 40 | svgNamespace = 41 | VirtualDom.property "namespace" (Json.string "http://www.w3.org/2000/svg") 42 | 43 | 44 | {-| Create any SVG node. To create a `` helper function, you would write: 45 | 46 | rect : List (Attribute msg) -> List (Svg msg) -> Svg msg 47 | rect attributes children = 48 | node "rect" attributes children 49 | 50 | You should always be able to use the helper functions already defined in this 51 | library though! 52 | 53 | -} 54 | node : String -> List (Attribute msg) -> List (Svg msg) -> Svg msg 55 | node = 56 | VirtualDom.nodeNS "http://www.w3.org/2000/svg" 57 | 58 | 59 | {-| Creates any untyped attribute 60 | -} 61 | attribute : String -> String -> Attribute msg 62 | attribute = 63 | VirtualDom.attribute 64 | 65 | 66 | {-| Creates any untyped, namespaced attribute 67 | -} 68 | attributeNS : String -> String -> String -> Attribute msg 69 | attributeNS = 70 | VirtualDom.attributeNS 71 | 72 | 73 | {-| A simple text node, no tags at all. 74 | Warning: not to be confused with `text_` which produces the SVG `` tag! 75 | -} 76 | text : String -> Svg msg 77 | text = 78 | VirtualDom.text 79 | 80 | 81 | {-| Transform the messages produced by some `Svg`. 82 | -} 83 | map : (a -> msg) -> Svg a -> Svg msg 84 | map = 85 | VirtualDom.map 86 | 87 | 88 | {-| The `foreignObject` SVG element allows for inclusion of a foreign XML namespace 89 | which has its graphical content drawn by a different user agent. The included 90 | foreign graphical content is subject to SVG transformations and compositing. 91 | 92 | The contents of foreignObject are assumed to be from a different namespace. Any 93 | SVG elements within a `foreignObject` will not be drawn, except in the situation 94 | where a properly defined SVG subdocument with a proper xmlns attribute 95 | specification is embedded recursively. One situation where this can occur is 96 | when an SVG document fragment is embedded within another non-SVG document 97 | fragment, which in turn is embedded within an SVG document fragment (e.g., an 98 | SVG document fragment contains an XHTML document fragment which in turn contains 99 | yet another SVG document fragment). 100 | 101 | Usually, a foreignObject will be used in conjunction with the `switch` element 102 | and the `requiredExtensions` attribute to provide proper checking for user agent 103 | support and provide an alternate rendering in case user agent support is not 104 | available. 105 | 106 | -} 107 | foreignObject : List (Attribute msg) -> List (Html.Html msg) -> Svg msg 108 | foreignObject = 109 | node "foreignObject" 110 | -------------------------------------------------------------------------------- /src/TypedSvg/Attributes/InEm.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Attributes.InEm exposing 2 | ( x, y, r, width, height, strokeWidth 3 | , fontSize, textLength 4 | , markerWidth, markerHeight 5 | , cx, cy, dx, dy, fx, fy, rx, ry, x1, y1, x2, y2 6 | ) 7 | 8 | {-| This module exposes all Length attributes (x, y, width, etc.) as `em`-based 9 | attributes. It's used as a shortcut so that it becomes unnecessary to prefix 10 | each numeric length with the `em` function. 11 | 12 | Example: 13 | 14 | import Color 15 | import Html exposing (Html) 16 | import TypedSvg exposing (rect, svg) 17 | import TypedSvg.Attributes exposing (fill, stroke, viewBox) 18 | import TypedSvg.Attributes.InEm exposing (height, strokeWidth, width, x, y) 19 | 20 | type Msg 21 | = NoOp 22 | 23 | type alias Model = 24 | Int 25 | 26 | view : Model -> Html Msg 27 | view model = 28 | svg 29 | [ viewBox 0 0 800 600 30 | ] 31 | [ rect 32 | [ x 15 33 | , y 15 34 | , width 20 35 | , height 20 36 | , fill Color.white 37 | , strokeWidth 0.5 38 | , stroke Color.black 39 | ] 40 | [] 41 | ] 42 | 43 | 44 | # Common Length Attributes 45 | 46 | @docs x, y, r, width, height, strokeWidth 47 | 48 | 49 | # Text 50 | 51 | @docs fontSize, textLength 52 | 53 | 54 | # Marker 55 | 56 | @docs markerWidth, markerHeight 57 | 58 | 59 | # Other 60 | 61 | @docs cx, cy, dx, dy, fx, fy, rx, ry, x1, y1, x2, y2 62 | 63 | -} 64 | 65 | import TypedSvg.Attributes as Attr 66 | import TypedSvg.Core exposing (Attribute) 67 | import TypedSvg.Types exposing (em) 68 | 69 | 70 | {-| -} 71 | cx : Float -> Attribute msg 72 | cx value = 73 | Attr.cx (em value) 74 | 75 | 76 | {-| -} 77 | cy : Float -> Attribute msg 78 | cy value = 79 | Attr.cy (em value) 80 | 81 | 82 | {-| -} 83 | dx : Float -> Attribute msg 84 | dx value = 85 | Attr.dx (em value) 86 | 87 | 88 | {-| -} 89 | dy : Float -> Attribute msg 90 | dy value = 91 | Attr.dy (em value) 92 | 93 | 94 | {-| -} 95 | fontSize : Float -> Attribute msg 96 | fontSize value = 97 | Attr.fontSize (em value) 98 | 99 | 100 | {-| -} 101 | fx : Float -> Attribute msg 102 | fx xAxisCoord = 103 | Attr.fx (em xAxisCoord) 104 | 105 | 106 | {-| -} 107 | fy : Float -> Attribute msg 108 | fy yAxisCoord = 109 | Attr.fx (em yAxisCoord) 110 | 111 | 112 | {-| -} 113 | height : Float -> Attribute msg 114 | height value = 115 | Attr.height (em value) 116 | 117 | 118 | {-| -} 119 | markerHeight : Float -> Attribute msg 120 | markerHeight value = 121 | Attr.markerHeight (em value) 122 | 123 | 124 | {-| -} 125 | markerWidth : Float -> Attribute msg 126 | markerWidth value = 127 | Attr.markerWidth (em value) 128 | 129 | 130 | {-| -} 131 | r : Float -> Attribute msg 132 | r value = 133 | Attr.r (em value) 134 | 135 | 136 | {-| -} 137 | rx : Float -> Attribute msg 138 | rx value = 139 | Attr.rx (em value) 140 | 141 | 142 | {-| -} 143 | ry : Float -> Attribute msg 144 | ry value = 145 | Attr.ry (em value) 146 | 147 | 148 | {-| -} 149 | textLength : Float -> Attribute msg 150 | textLength value = 151 | Attr.textLength (em value) 152 | 153 | 154 | {-| -} 155 | strokeWidth : Float -> Attribute msg 156 | strokeWidth value = 157 | Attr.strokeWidth (em value) 158 | 159 | 160 | {-| -} 161 | width : Float -> Attribute msg 162 | width value = 163 | Attr.width (em value) 164 | 165 | 166 | {-| -} 167 | x : Float -> Attribute msg 168 | x value = 169 | Attr.x (em value) 170 | 171 | 172 | {-| -} 173 | x1 : Float -> Attribute msg 174 | x1 value = 175 | Attr.x1 (em value) 176 | 177 | 178 | {-| -} 179 | x2 : Float -> Attribute msg 180 | x2 value = 181 | Attr.x2 (em value) 182 | 183 | 184 | {-| -} 185 | y : Float -> Attribute msg 186 | y value = 187 | Attr.y (em value) 188 | 189 | 190 | {-| -} 191 | y1 : Float -> Attribute msg 192 | y1 value = 193 | Attr.y1 (em value) 194 | 195 | 196 | {-| -} 197 | y2 : Float -> Attribute msg 198 | y2 value = 199 | Attr.y2 (em value) 200 | -------------------------------------------------------------------------------- /src/TypedSvg/Attributes/InPx.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Attributes.InPx exposing 2 | ( x, y, r, width, height, strokeWidth 3 | , fontSize, textLength 4 | , markerWidth, markerHeight 5 | , cx, cy, dx, dy, fx, fy, rx, ry, x1, y1, x2, y2 6 | ) 7 | 8 | {-| This module exposes all Length attributes (x, y, width, etc.) as px-based 9 | attributes. It's used as a shortcut so that it becomes unnecessary to prefix 10 | each numeric length with the `px` function. 11 | 12 | Example: 13 | 14 | import Color 15 | import Html exposing (Html) 16 | import TypedSvg exposing (rect, svg) 17 | import TypedSvg.Attributes exposing (fill, stroke, viewBox) 18 | import TypedSvg.Attributes.InPx exposing (height, strokeWidth, width, x, y) 19 | 20 | type Msg 21 | = NoOp 22 | 23 | type alias Model = 24 | Int 25 | 26 | view : Model -> Html Msg 27 | view model = 28 | svg 29 | [ viewBox 0 0 800 600 30 | ] 31 | [ rect 32 | [ x 150 33 | , y 150 34 | , width 200 35 | , height 200 36 | , fill Color.white 37 | , strokeWidth 2 38 | , stroke Color.black 39 | ] 40 | [] 41 | ] 42 | 43 | 44 | # Common Length Attributes 45 | 46 | @docs x, y, r, width, height, strokeWidth 47 | 48 | 49 | # Text 50 | 51 | @docs fontSize, textLength 52 | 53 | 54 | # Marker 55 | 56 | @docs markerWidth, markerHeight 57 | 58 | 59 | # Other 60 | 61 | @docs cx, cy, dx, dy, fx, fy, rx, ry, x1, y1, x2, y2 62 | 63 | -} 64 | 65 | import TypedSvg.Attributes as Attr 66 | import TypedSvg.Core exposing (Attribute) 67 | import TypedSvg.Types exposing (px) 68 | 69 | 70 | {-| -} 71 | cx : Float -> Attribute msg 72 | cx value = 73 | Attr.cx (px value) 74 | 75 | 76 | {-| -} 77 | cy : Float -> Attribute msg 78 | cy value = 79 | Attr.cy (px value) 80 | 81 | 82 | {-| -} 83 | dx : Float -> Attribute msg 84 | dx value = 85 | Attr.dx (px value) 86 | 87 | 88 | {-| -} 89 | dy : Float -> Attribute msg 90 | dy value = 91 | Attr.dy (px value) 92 | 93 | 94 | {-| -} 95 | fontSize : Float -> Attribute msg 96 | fontSize value = 97 | Attr.fontSize (px value) 98 | 99 | 100 | {-| -} 101 | fx : Float -> Attribute msg 102 | fx xAxisCoord = 103 | Attr.fx (px xAxisCoord) 104 | 105 | 106 | {-| -} 107 | fy : Float -> Attribute msg 108 | fy yAxisCoord = 109 | Attr.fx (px yAxisCoord) 110 | 111 | 112 | {-| -} 113 | height : Float -> Attribute msg 114 | height value = 115 | Attr.height (px value) 116 | 117 | 118 | {-| -} 119 | markerHeight : Float -> Attribute msg 120 | markerHeight value = 121 | Attr.markerHeight (px value) 122 | 123 | 124 | {-| -} 125 | markerWidth : Float -> Attribute msg 126 | markerWidth value = 127 | Attr.markerWidth (px value) 128 | 129 | 130 | {-| -} 131 | r : Float -> Attribute msg 132 | r value = 133 | Attr.r (px value) 134 | 135 | 136 | {-| -} 137 | rx : Float -> Attribute msg 138 | rx value = 139 | Attr.rx (px value) 140 | 141 | 142 | {-| -} 143 | ry : Float -> Attribute msg 144 | ry value = 145 | Attr.ry (px value) 146 | 147 | 148 | {-| -} 149 | textLength : Float -> Attribute msg 150 | textLength value = 151 | Attr.textLength (px value) 152 | 153 | 154 | {-| -} 155 | strokeWidth : Float -> Attribute msg 156 | strokeWidth value = 157 | Attr.strokeWidth (px value) 158 | 159 | 160 | {-| -} 161 | width : Float -> Attribute msg 162 | width value = 163 | Attr.width (px value) 164 | 165 | 166 | {-| -} 167 | x : Float -> Attribute msg 168 | x value = 169 | Attr.x (px value) 170 | 171 | 172 | {-| -} 173 | x1 : Float -> Attribute msg 174 | x1 value = 175 | Attr.x1 (px value) 176 | 177 | 178 | {-| -} 179 | x2 : Float -> Attribute msg 180 | x2 value = 181 | Attr.x2 (px value) 182 | 183 | 184 | {-| -} 185 | y : Float -> Attribute msg 186 | y value = 187 | Attr.y (px value) 188 | 189 | 190 | {-| -} 191 | y1 : Float -> Attribute msg 192 | y1 value = 193 | Attr.y1 (px value) 194 | 195 | 196 | {-| -} 197 | y2 : Float -> Attribute msg 198 | y2 value = 199 | Attr.y2 (px value) 200 | -------------------------------------------------------------------------------- /src/TypedSvg/Events.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Events exposing 2 | ( onBegin, onEnd, onRepeat 3 | , onAbort, onError, onResize, onScroll, onLoad, onUnload, onZoom 4 | , onActivate, onAuxClick, onClick, onContextMenu, onDblClick, onFocusIn, onFocusOut, onMouseDown, onMouseEnter, onMouseLeave, onMouseMove, onMouseOut, onMouseOver, onMouseUp 5 | , on 6 | ) 7 | 8 | {-| 9 | 10 | 11 | # Animation event attributes 12 | 13 | @docs onBegin, onEnd, onRepeat 14 | 15 | 16 | # Document event attributes 17 | 18 | @docs onAbort, onError, onResize, onScroll, onLoad, onUnload, onZoom 19 | 20 | 21 | # Graphical event attributes 22 | 23 | @docs onActivate, onAuxClick, onClick, onContextMenu, onDblClick, onFocusIn, onFocusOut, onMouseDown, onMouseEnter, onMouseLeave, onMouseMove, onMouseOut, onMouseOver, onMouseUp 24 | 25 | 26 | # Custom Events 27 | 28 | @docs on 29 | 30 | -} 31 | 32 | import Json.Decode as Json 33 | import TypedSvg.Core exposing (Attribute) 34 | import VirtualDom 35 | 36 | 37 | {-| Create a custom event listener. 38 | 39 | import Json.Decode as Json 40 | import VirtualDom 41 | 42 | onClick : msg -> Attribute msg 43 | onClick msg = 44 | on "click" (VirtualDom.Normal <| Json.succeed msg) 45 | 46 | You first specify the name of the event in the same format as with JavaScript’s 47 | `addEventListener`. Next you give a virtual DOM handler with a JSON decoder, 48 | which lets you pull information out of the event object. If the decoder succeeds, 49 | it will produce a message and route it to your `update` function. 50 | 51 | -} 52 | on : String -> VirtualDom.Handler msg -> VirtualDom.Attribute msg 53 | on = 54 | VirtualDom.on 55 | 56 | 57 | simpleOn : String -> msg -> Attribute msg 58 | simpleOn name = 59 | \msg -> on name (VirtualDom.Normal (Json.succeed msg)) 60 | 61 | 62 | 63 | -- ANIMATION 64 | 65 | 66 | {-| -} 67 | onBegin : msg -> Attribute msg 68 | onBegin = 69 | simpleOn "begin" 70 | 71 | 72 | {-| -} 73 | onEnd : msg -> Attribute msg 74 | onEnd = 75 | simpleOn "end" 76 | 77 | 78 | {-| -} 79 | onRepeat : msg -> Attribute msg 80 | onRepeat = 81 | simpleOn "repeat" 82 | 83 | 84 | 85 | -- DOCUMENT 86 | 87 | 88 | {-| -} 89 | onAbort : msg -> Attribute msg 90 | onAbort = 91 | simpleOn "abort" 92 | 93 | 94 | {-| -} 95 | onError : msg -> Attribute msg 96 | onError = 97 | simpleOn "error" 98 | 99 | 100 | {-| -} 101 | onResize : msg -> Attribute msg 102 | onResize = 103 | simpleOn "resize" 104 | 105 | 106 | {-| -} 107 | onScroll : msg -> Attribute msg 108 | onScroll = 109 | simpleOn "scroll" 110 | 111 | 112 | {-| -} 113 | onLoad : msg -> Attribute msg 114 | onLoad = 115 | simpleOn "load" 116 | 117 | 118 | {-| -} 119 | onUnload : msg -> Attribute msg 120 | onUnload = 121 | simpleOn "unload" 122 | 123 | 124 | {-| -} 125 | onZoom : msg -> Attribute msg 126 | onZoom = 127 | simpleOn "zoom" 128 | 129 | 130 | 131 | -- GRAPHICAL 132 | 133 | 134 | {-| -} 135 | onActivate : msg -> Attribute msg 136 | onActivate = 137 | simpleOn "activate" 138 | 139 | 140 | {-| -} 141 | onAuxClick : msg -> Attribute msg 142 | onAuxClick = 143 | simpleOn "auxclick" 144 | 145 | 146 | {-| -} 147 | onClick : msg -> Attribute msg 148 | onClick = 149 | simpleOn "click" 150 | 151 | 152 | {-| -} 153 | onContextMenu : msg -> Attribute msg 154 | onContextMenu = 155 | simpleOn "contextmenu" 156 | 157 | 158 | {-| -} 159 | onDblClick : msg -> Attribute msg 160 | onDblClick = 161 | simpleOn "dblclick" 162 | 163 | 164 | {-| -} 165 | onFocusIn : msg -> Attribute msg 166 | onFocusIn = 167 | simpleOn "focusin" 168 | 169 | 170 | {-| -} 171 | onFocusOut : msg -> Attribute msg 172 | onFocusOut = 173 | simpleOn "focusout" 174 | 175 | 176 | {-| -} 177 | onMouseDown : msg -> Attribute msg 178 | onMouseDown = 179 | simpleOn "mousedown" 180 | 181 | 182 | {-| -} 183 | onMouseEnter : msg -> Attribute msg 184 | onMouseEnter = 185 | simpleOn "mouseenter" 186 | 187 | 188 | {-| -} 189 | onMouseLeave : msg -> Attribute msg 190 | onMouseLeave = 191 | simpleOn "mouseleave" 192 | 193 | 194 | {-| -} 195 | onMouseMove : msg -> Attribute msg 196 | onMouseMove = 197 | simpleOn "mousemove" 198 | 199 | 200 | {-| -} 201 | onMouseOut : msg -> Attribute msg 202 | onMouseOut = 203 | simpleOn "mouseout" 204 | 205 | 206 | {-| -} 207 | onMouseOver : msg -> Attribute msg 208 | onMouseOver = 209 | simpleOn "mouseover" 210 | 211 | 212 | {-| -} 213 | onMouseUp : msg -> Attribute msg 214 | onMouseUp = 215 | simpleOn "mouseup" 216 | -------------------------------------------------------------------------------- /src/TypedSvg/Filters.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Filters exposing 2 | ( blend, colorMatrix, componentTransfer, composite, convolveMatrix, diffuseLighting, displacementMap, flood, funcA, funcB, funcG, funcR, gaussianBlur, image, merge, mergeNode, morphology, offset, specularLighting, tile, turbulence 3 | , distantLight, pointLight, spotLight 4 | ) 5 | 6 | {-| SVG Filter Elements 7 | 8 | Typical usage: 9 | 10 | import TypedSvg.Filters as Fe 11 | import TypedSvg.Filters.Attributes exposing (..) 12 | 13 | Fe.filter [] 14 | [ Fe.blend [in InSourceGraphic, in2 InFillPaint, mode ModeMultiply] [] 15 | ] 16 | 17 | @docs blend, colorMatrix, componentTransfer, composite, convolveMatrix, diffuseLighting, displacementMap, flood, funcA, funcB, funcG, funcR, gaussianBlur, image, merge, mergeNode, morphology, offset, specularLighting, tile, turbulence 18 | 19 | 20 | # Light source elements 21 | 22 | @docs distantLight, pointLight, spotLight 23 | 24 | -} 25 | 26 | import TypedSvg.Core exposing (Attribute, Svg, node) 27 | 28 | 29 | {-| 30 | 31 | The `Filters.blend` SVG filter primitive composes two objects together 32 | ruled by a certain blending mode. This is similar to what is known from 33 | image editing software when blending two layers. The mode is defined by the 34 | `mode` attribute. 35 | 36 | Attributes: in, in2, mode 37 | 38 | Global Attributes: id, class, height, result, style, tabindex, width, x, y 39 | 40 | Presentation Attributes 41 | 42 | See: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/feBlend 43 | 44 | -} 45 | blend : List (Attribute msg) -> List (Svg msg) -> Svg msg 46 | blend = 47 | node "feBlend" 48 | 49 | 50 | {-| 51 | 52 | The `colorMatrix` SVG filter element changes colors based on a 53 | transformation matrix. Every pixel's color value (represented by an 54 | [R,G,B,A] vector) is matrix multiplied to create a new color. 55 | 56 | Specific Attributes: in, colorMatrixType, colorMatrixValues 57 | 58 | Global Attributes: id, class, height, result, style, tabindex, width, x, y 59 | 60 | Presentation Attributes 61 | 62 | -} 63 | colorMatrix : List (Attribute msg) -> List (Svg msg) -> Svg msg 64 | colorMatrix = 65 | node "feColorMatrix" 66 | 67 | 68 | {-| 69 | 70 | The `componentTransfer` SVG filter primitive performs color-component-wise 71 | remapping of data for each pixel. It allows operations like brightness 72 | adjustment, contrast adjustment, color balance or thresholding. 73 | 74 | The calculations are performed on non-premultiplied color values. The colors 75 | are modified by changing each channel (R, G, B, and A) to the result of what 76 | the children `funcR`, `funcB`, `funcG`, and `funcA` return. 77 | 78 | Specific Attributes: in 79 | 80 | Global Attributes: id, class, height, result, style, tabindex, width, x, y 81 | 82 | Presentation Attributes 83 | 84 | -} 85 | componentTransfer : List (Attribute msg) -> List (Svg msg) -> Svg msg 86 | componentTransfer = 87 | node "feComponentTransfer" 88 | 89 | 90 | {-| 91 | 92 | This filter primitive performs the combination of two input images 93 | pixel-wise in image space using one of the Porter-Duff compositing 94 | operations: 95 | 96 | over, in, atop, out, xor, and lighter 97 | 98 | Additionally, a component-wise arithmetic operation (with the result clamped 99 | between [0..1]) can be applied. 100 | 101 | The arithmetic operation is useful for combining the output from the 102 | `diffuseLighting` and `specularLighting` filters with texture data. If the 103 | arithmetic operation is chosen, each result pixel is computed using the 104 | following formula: 105 | 106 | result = k1*i1*i2 + k2*i1 + k3*i2 + k4 107 | 108 | where: 109 | 110 | `i1` and `i2` indicate the corresponding pixel channel values of the input 111 | image, which map to `in` and `in2` respectively. 112 | 113 | `k1`, `k2`, `k3` and `k4` indicate the values of the attributes with the 114 | same name. 115 | 116 | Specific Attributes: in, in2, compositeOperator, k1, k2, k3, k4 117 | 118 | Global Attributes: id, class, height, result, style, tabindex, width, x, y 119 | 120 | Presentation Attributes 121 | 122 | -} 123 | composite : List (Attribute msg) -> List (Svg msg) -> Svg msg 124 | composite = 125 | node "feComposite" 126 | 127 | 128 | {-| 129 | 130 | The `convolveMatrix` SVG filter primitive applies a matrix convolution 131 | filter effect. A convolution combines pixels in the input image with 132 | neighboring pixels to produce a resulting image. A wide variety of imaging 133 | operations can be achieved through convolutions, including blurring, edge 134 | detection, sharpening, embossing and beveling. 135 | 136 | Specific Attributes: in, order, kernelMatrix, divisor, bias, targetX, 137 | targetY, edgeMode, kernelUnitLength, preserveAlpha 138 | 139 | Global Attributes: id, class, height, result, style, tabindex, width, x, y 140 | 141 | Presentation Attributes 142 | 143 | -} 144 | convolveMatrix : List (Attribute msg) -> List (Svg msg) -> Svg msg 145 | convolveMatrix = 146 | node "feConvolveMatrix" 147 | 148 | 149 | {-| -} 150 | diffuseLighting : List (Attribute msg) -> List (Svg msg) -> Svg msg 151 | diffuseLighting = 152 | node "feDiffuseLighting" 153 | 154 | 155 | {-| -} 156 | displacementMap : List (Attribute msg) -> List (Svg msg) -> Svg msg 157 | displacementMap = 158 | node "feDisplacementMap" 159 | 160 | 161 | {-| -} 162 | flood : List (Attribute msg) -> List (Svg msg) -> Svg msg 163 | flood = 164 | node "feFlood" 165 | 166 | 167 | {-| -} 168 | funcA : List (Attribute msg) -> List (Svg msg) -> Svg msg 169 | funcA = 170 | node "feFuncA" 171 | 172 | 173 | {-| -} 174 | funcB : List (Attribute msg) -> List (Svg msg) -> Svg msg 175 | funcB = 176 | node "feFuncB" 177 | 178 | 179 | {-| -} 180 | funcG : List (Attribute msg) -> List (Svg msg) -> Svg msg 181 | funcG = 182 | node "feFuncG" 183 | 184 | 185 | {-| -} 186 | funcR : List (Attribute msg) -> List (Svg msg) -> Svg msg 187 | funcR = 188 | node "feFuncR" 189 | 190 | 191 | {-| -} 192 | gaussianBlur : List (Attribute msg) -> List (Svg msg) -> Svg msg 193 | gaussianBlur = 194 | node "feGaussianBlur" 195 | 196 | 197 | {-| -} 198 | image : List (Attribute msg) -> List (Svg msg) -> Svg msg 199 | image = 200 | node "feImage" 201 | 202 | 203 | {-| -} 204 | merge : List (Attribute msg) -> List (Svg msg) -> Svg msg 205 | merge = 206 | node "feMerge" 207 | 208 | 209 | {-| -} 210 | mergeNode : List (Attribute msg) -> List (Svg msg) -> Svg msg 211 | mergeNode = 212 | node "feMergeNode" 213 | 214 | 215 | {-| -} 216 | morphology : List (Attribute msg) -> List (Svg msg) -> Svg msg 217 | morphology = 218 | node "feMorphology" 219 | 220 | 221 | {-| -} 222 | offset : List (Attribute msg) -> List (Svg msg) -> Svg msg 223 | offset = 224 | node "feOffset" 225 | 226 | 227 | {-| -} 228 | specularLighting : List (Attribute msg) -> List (Svg msg) -> Svg msg 229 | specularLighting = 230 | node "feSpecularLighting" 231 | 232 | 233 | {-| -} 234 | tile : List (Attribute msg) -> List (Svg msg) -> Svg msg 235 | tile = 236 | node "feTile" 237 | 238 | 239 | {-| -} 240 | turbulence : List (Attribute msg) -> List (Svg msg) -> Svg msg 241 | turbulence = 242 | node "feTurbulence" 243 | 244 | 245 | 246 | -- Light source elements 247 | 248 | 249 | {-| -} 250 | distantLight : List (Attribute msg) -> List (Svg msg) -> Svg msg 251 | distantLight = 252 | node "feDistantLight" 253 | 254 | 255 | {-| -} 256 | pointLight : List (Attribute msg) -> List (Svg msg) -> Svg msg 257 | pointLight = 258 | node "fePointLight" 259 | 260 | 261 | {-| -} 262 | spotLight : List (Attribute msg) -> List (Svg msg) -> Svg msg 263 | spotLight = 264 | node "feSpotLight" 265 | -------------------------------------------------------------------------------- /src/TypedSvg.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg exposing 2 | ( svg 3 | , circle, ellipse, image, line, path, polygon, polyline, rect, use 4 | , animate, animateColor, animateMotion, animateTransform, mpath, set 5 | , desc, metadata, title 6 | , a, defs, g, marker, mask, pattern, switch, symbol 7 | , glyph, glyphRef, textPath, text_, tref, tspan 8 | , font 9 | , linearGradient, radialGradient, stop 10 | , clipPath, colorProfile, cursor, filter, script, style, view 11 | ) 12 | 13 | {-| 14 | 15 | 16 | # HTML Embedding 17 | 18 | @docs svg 19 | 20 | 21 | # Graphics elements 22 | 23 | @docs circle, ellipse, image, line, path, polygon, polyline, rect, use 24 | 25 | 26 | # Animation elements 27 | 28 | @docs animate, animateColor, animateMotion, animateTransform, mpath, set 29 | 30 | 31 | # Descriptive elements 32 | 33 | @docs desc, metadata, title 34 | 35 | 36 | # Containers 37 | 38 | @docs a, defs, g, marker, mask, pattern, switch, symbol 39 | 40 | 41 | # Text 42 | 43 | @docs glyph, glyphRef, textPath, text_, tref, tspan 44 | 45 | 46 | # Fonts 47 | 48 | @docs font 49 | 50 | 51 | # Gradients 52 | 53 | @docs linearGradient, radialGradient, stop 54 | 55 | 56 | # Filters 57 | 58 | See TypedSvg.Filters 59 | 60 | 61 | # Miscellaneous 62 | 63 | @docs clipPath, colorProfile, cursor, filter, script, style, view 64 | 65 | 66 | # Deprecated 67 | 68 | See `TypedSvg.Deprecated` (e.g. `altGlyph` etc.) 69 | 70 | -} 71 | 72 | import Html 73 | import TypedSvg.Core exposing (Attribute, Svg, node) 74 | 75 | 76 | {-| The root `svg` node for any SVG scene. This example shows a scene 77 | containing a rounded rectangle: 78 | 79 | import Html 80 | import TypedSvg exposing (..) 81 | import TypedSvg.Attributes exposing (..) 82 | 83 | roundRect : Html.Html msg 84 | roundRect = 85 | svg 86 | [ width (px 120), height (px 120), viewBox 0 0 120 120 ] 87 | [ rect [ x (px 10), y (px 10), width (px 100), height (px 100), rx (px 15), ry (px 15) ] [] ] 88 | 89 | -} 90 | svg : List (Html.Attribute msg) -> List (Svg msg) -> Html.Html msg 91 | svg = 92 | node "svg" 93 | 94 | 95 | 96 | -- Animation elements 97 | 98 | 99 | {-| -} 100 | animate : List (Attribute msg) -> List (Svg msg) -> Svg msg 101 | animate = 102 | node "animate" 103 | 104 | 105 | {-| -} 106 | animateColor : List (Attribute msg) -> List (Svg msg) -> Svg msg 107 | animateColor = 108 | node "animateColor" 109 | 110 | 111 | {-| -} 112 | animateMotion : List (Attribute msg) -> List (Svg msg) -> Svg msg 113 | animateMotion = 114 | node "animateMotion" 115 | 116 | 117 | {-| -} 118 | animateTransform : List (Attribute msg) -> List (Svg msg) -> Svg msg 119 | animateTransform = 120 | node "animateTransform" 121 | 122 | 123 | {-| -} 124 | mpath : List (Attribute msg) -> List (Svg msg) -> Svg msg 125 | mpath = 126 | node "mpath" 127 | 128 | 129 | {-| -} 130 | set : List (Attribute msg) -> List (Svg msg) -> Svg msg 131 | set = 132 | node "set" 133 | 134 | 135 | 136 | -- Container elements 137 | 138 | 139 | {-| The SVG Anchor Element defines a hyperlink. 140 | -} 141 | a : List (Attribute msg) -> List (Svg msg) -> Svg msg 142 | a = 143 | node "a" 144 | 145 | 146 | {-| -} 147 | defs : List (Attribute msg) -> List (Svg msg) -> Svg msg 148 | defs = 149 | node "defs" 150 | 151 | 152 | {-| -} 153 | g : List (Attribute msg) -> List (Svg msg) -> Svg msg 154 | g = 155 | node "g" 156 | 157 | 158 | {-| -} 159 | marker : List (Attribute msg) -> List (Svg msg) -> Svg msg 160 | marker = 161 | node "marker" 162 | 163 | 164 | {-| -} 165 | mask : List (Attribute msg) -> List (Svg msg) -> Svg msg 166 | mask = 167 | node "mask" 168 | 169 | 170 | {-| -} 171 | pattern : List (Attribute msg) -> List (Svg msg) -> Svg msg 172 | pattern = 173 | node "pattern" 174 | 175 | 176 | {-| -} 177 | switch : List (Attribute msg) -> List (Svg msg) -> Svg msg 178 | switch = 179 | node "switch" 180 | 181 | 182 | {-| -} 183 | symbol : List (Attribute msg) -> List (Svg msg) -> Svg msg 184 | symbol = 185 | node "symbol" 186 | 187 | 188 | 189 | -- Descriptive elements 190 | 191 | 192 | {-| -} 193 | desc : List (Attribute msg) -> List (Svg msg) -> Svg msg 194 | desc = 195 | node "desc" 196 | 197 | 198 | {-| -} 199 | metadata : List (Attribute msg) -> List (Svg msg) -> Svg msg 200 | metadata = 201 | node "metadata" 202 | 203 | 204 | {-| -} 205 | title : List (Attribute msg) -> List (Svg msg) -> Svg msg 206 | title = 207 | node "title" 208 | 209 | 210 | 211 | -- Font elements 212 | 213 | 214 | {-| -} 215 | font : List (Attribute msg) -> List (Svg msg) -> Svg msg 216 | font = 217 | node "font" 218 | 219 | 220 | 221 | -- Gradient elements 222 | 223 | 224 | {-| -} 225 | linearGradient : List (Attribute msg) -> List (Svg msg) -> Svg msg 226 | linearGradient = 227 | node "linearGradient" 228 | 229 | 230 | {-| -} 231 | radialGradient : List (Attribute msg) -> List (Svg msg) -> Svg msg 232 | radialGradient = 233 | node "radialGradient" 234 | 235 | 236 | {-| -} 237 | stop : List (Attribute msg) -> List (Svg msg) -> Svg msg 238 | stop = 239 | node "stop" 240 | 241 | 242 | 243 | -- Graphics elements 244 | 245 | 246 | {-| The circle element is an SVG basic shape, used to create circles based on 247 | a center point and a radius. 248 | 249 | circle [ cx (px 60), cy (px 60), r (px 50) ] [] 250 | 251 | -} 252 | circle : List (Attribute msg) -> List (Svg msg) -> Svg msg 253 | circle = 254 | node "circle" 255 | 256 | 257 | {-| The ellipse element creates an ellipse based on a center coordinate 258 | and its x and y radius. 259 | 260 | ellipse 261 | [ cx (px 100), cy (px 60), rx (px 80), ry (px 50) ] 262 | [] 263 | 264 | -} 265 | ellipse : List (Attribute msg) -> List (Svg msg) -> Svg msg 266 | ellipse = 267 | node "ellipse" 268 | 269 | 270 | {-| The image element displays JPEG, PNG, and other SVG files. Animated GIF behavior is undefined. 271 | 272 | image 273 | [ attribute "href" "path_to_image.png" 274 | , width (px 200) 275 | , height (px 200) 276 | ] 277 | [] 278 | 279 | -} 280 | image : List (Attribute msg) -> List (Svg msg) -> Svg msg 281 | image = 282 | node "image" 283 | 284 | 285 | {-| The line element creates a line connecting two points. 286 | 287 | line 288 | [ x1 (px 0) 289 | , y1 (px 80) 290 | , x2 (px 100) 291 | , y2 (px 20) 292 | , stroke (Paint Color.black) 293 | ] 294 | [] 295 | 296 | -} 297 | line : List (Attribute msg) -> List (Svg msg) -> Svg msg 298 | line = 299 | node "line" 300 | 301 | 302 | {-| The path element is the generic element for defining a shape. 303 | All the basic shapes can be created with a path element. 304 | Here, we show a heart-shaped path: 305 | 306 | TypedSvg.path 307 | [ d """M 10,30 308 | A 20,20 0,0,1 50,30 309 | A 20,20 0,0,1 90,30 310 | Q 90,60 50,90 311 | Q 10,60 10,30 z""" 312 | ] 313 | [] 314 | 315 | -} 316 | path : List (Attribute msg) -> List (Svg msg) -> Svg msg 317 | path = 318 | node "path" 319 | 320 | 321 | {-| The polygon element defines a closed shape with a set of 322 | connected straight line segments. The last point is connected 323 | to the first point. For open shapes, see the `polyline` element. 324 | Here, we show a polygon with stroke and no fill: 325 | 326 | polygon 327 | [ points [(0,100), (50,25), (50,75), (100,0)] 328 | , fill PaintNone 329 | , stroke (Paint Color.black) 330 | ] 331 | [] 332 | 333 | -} 334 | polygon : List (Attribute msg) -> List (Svg msg) -> Svg msg 335 | polygon = 336 | node "polygon" 337 | 338 | 339 | {-| The polyline element is an SVG basic shape, used to create a series of 340 | straight lines connecting several points. Typically a polyline is used to 341 | create open shapes. 342 | 343 | polyline 344 | [ fill FillNone 345 | , stroke Color.black 346 | , points [(20, 100), (40, 60), (70, 80), (100, 20)] 347 | ] 348 | [] 349 | 350 | -} 351 | polyline : List (Attribute msg) -> List (Svg msg) -> Svg msg 352 | polyline = 353 | node "polyline" 354 | 355 | 356 | {-| The rect element draws a rectangle defined by its position, 357 | width, and height. The rectangle may have rounded corners. Here, 358 | we show a rounded corner rectangle: 359 | 360 | rect 361 | [ x (px 0) 362 | , y (px 0) 363 | , width (px 100) 364 | , height (px 100) 365 | , rx (px 15) 366 | ] 367 | [] 368 | 369 | -} 370 | rect : List (Attribute msg) -> List (Svg msg) -> Svg msg 371 | rect = 372 | node "rect" 373 | 374 | 375 | {-| -} 376 | use : List (Attribute msg) -> List (Svg msg) -> Svg msg 377 | use = 378 | node "use" 379 | 380 | 381 | 382 | -- Text content elements 383 | 384 | 385 | {-| -} 386 | glyph : List (Attribute msg) -> List (Svg msg) -> Svg msg 387 | glyph = 388 | node "glyph" 389 | 390 | 391 | {-| -} 392 | glyphRef : List (Attribute msg) -> List (Svg msg) -> Svg msg 393 | glyphRef = 394 | node "glyphRef" 395 | 396 | 397 | {-| The `textPath` element draws text along the shape of a path. 398 | It is usually embedded within a `text_` element. 399 | 400 | import TypedSvg exposing (..) 401 | import TypedSvg.Attributes exposing (..) 402 | import TypedSvg.Core exposing (text, attribute) 403 | import TypedSvg.Types exposing (px, Paint(..)) 404 | 405 | svg 406 | [ width (px 100), height (px 100), viewBox 0 0 100 100 ] 407 | [ TypedSvg.path 408 | [ id "MyPath" 409 | , fill PaintNone 410 | , stroke (Paint Color.red) 411 | , d "M10,90 Q90,90 90,45 Q90,10 50,10 Q10,10 10,40 Q10,70 45,70 Q70,70 75,50" 412 | ] 413 | [] 414 | , text_ 415 | [] 416 | [ textPath 417 | [ attribute "href" "#MyPath" ] 418 | [ text "Quick brown fox jumps over the lazy dog." ] 419 | ] 420 | ] 421 | 422 | -} 423 | textPath : List (Attribute msg) -> List (Svg msg) -> Svg msg 424 | textPath = 425 | node "textPath" 426 | 427 | 428 | {-| The `text_` element draws a graphics element consisting of text. 429 | It should not be confused with `text` in `TypedSvg.Core` which produces 430 | a simple text node without any tags. `text` is often embedded within `text_` 431 | to specify its content. 432 | 433 | import TypedSvg exposing (..) 434 | import TypedSvg.Core exposing (text) 435 | import TypedSvg.Attributes exposing (..) 436 | import TypedSvg.Types exposing (px, FontWeight(..)) 437 | 438 | text_ 439 | [ x (px 20) 440 | , y (px 35) 441 | , fontFamily [ "Helvetica", "sans-serif" ] 442 | , fontSize (px 30) 443 | , fontWeight FontWeightBold 444 | ] 445 | [ text "Hello World" ] 446 | 447 | -} 448 | text_ : List (Attribute msg) -> List (Svg msg) -> Svg msg 449 | text_ = 450 | node "text" 451 | 452 | 453 | {-| -} 454 | tref : List (Attribute msg) -> List (Svg msg) -> Svg msg 455 | tref = 456 | node "tref" 457 | 458 | 459 | {-| The `tspan` element defines a subtext within a `text_` element or 460 | another `tspan` element. It allows for adjustment of the style and/or 461 | position of that subtext. 462 | 463 | text_ 464 | [ x (px 0) 465 | , y (px 40) 466 | , fontFamily [ "Helvetica", "sans-serif" ] 467 | ] 468 | [ text "Hello " 469 | , tspan 470 | [ dy (px 10) 471 | , fontFamily [ "Georgia", "serif" ] 472 | , fontSize (px 30) 473 | , fontWeight FontWeightBold 474 | ] 475 | [ text "New" ] 476 | , text " World" 477 | ] 478 | 479 | -} 480 | tspan : List (Attribute msg) -> List (Svg msg) -> Svg msg 481 | tspan = 482 | node "tspan" 483 | 484 | 485 | 486 | -- Uncategorized elements 487 | 488 | 489 | {-| -} 490 | clipPath : List (Attribute msg) -> List (Svg msg) -> Svg msg 491 | clipPath = 492 | node "clipPath" 493 | 494 | 495 | {-| -} 496 | colorProfile : List (Attribute msg) -> List (Svg msg) -> Svg msg 497 | colorProfile = 498 | node "colorProfile" 499 | 500 | 501 | {-| -} 502 | cursor : List (Attribute msg) -> List (Svg msg) -> Svg msg 503 | cursor = 504 | node "cursor" 505 | 506 | 507 | {-| -} 508 | filter : List (Attribute msg) -> List (Svg msg) -> Svg msg 509 | filter = 510 | node "filter" 511 | 512 | 513 | {-| -} 514 | script : List (Attribute msg) -> List (Svg msg) -> Svg msg 515 | script = 516 | node "script" 517 | 518 | 519 | {-| -} 520 | style : List (Attribute msg) -> List (Svg msg) -> Svg msg 521 | style = 522 | node "style" 523 | 524 | 525 | {-| -} 526 | view : List (Attribute msg) -> List (Svg msg) -> Svg msg 527 | view = 528 | node "view" 529 | -------------------------------------------------------------------------------- /src/TypedSvg/Types.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Types exposing 2 | ( Accumulate(..), Additive(..), Align(..), AlignmentBaseline(..), AnchorAlignment(..), AnimateTransformType(..), AttributeType(..), BaselineShift(..), BezierAnchorPoint, CalcMode(..), Clip(..), ClipPath(..), ClipRule(..), ClockValue, ColorInterpolation(..), ColorMatrixType(..), ColorProfile(..), CompositeOperator(..), CoordinateSystem(..), Cursor(..), Direction(..), Display(..), DominantBaseline(..), Duration(..), EdgeMode(..), FillRule(..), Filter(..), FloodColor(..), FontSizeAdjust(..), FontStretch(..), FontStyle(..), FontVariant(..), FontWeight(..), FuncType(..), InValue(..), Kerning(..), Length(..), LengthAdjust(..), MarkerCoordinateSystem(..), MeetOrSlice(..), Mode(..), MorphologyOperator(..), Opacity(..), Paint(..), Rendering(..), RepeatCount(..), Restart(..), Scale(..), ShapeRendering(..), TimingValue(..), Transform(..), TurbulenceType(..), YesNo(..) 3 | , StrokeLinecap(..), StrokeLinejoin(..), TextRendering(..) 4 | , cm, em, ex, inch, mm, num, pc, percent, pt, px, rem 5 | -- Lengths 6 | ) 7 | 8 | {-| The Types module defines all of the types used by TypedSvg. 9 | 10 | 11 | # Types 12 | 13 | @docs Accumulate, Additive, Align, AlignmentBaseline, AnchorAlignment, AnimateTransformType, AttributeType, BaselineShift, BezierAnchorPoint, CalcMode, Clip, ClipPath, ClipRule, ClockValue, ColorInterpolation, ColorMatrixType, ColorProfile, CompositeOperator, CoordinateSystem, Cursor, Direction, Display, DominantBaseline, Duration, EdgeMode, FillRule, Filter, FloodColor, FontSizeAdjust, FontStretch, FontStyle, FontVariant, FontWeight, FuncType, InValue, Kerning, Length, LengthAdjust, MarkerCoordinateSystem, MeetOrSlice, Mode, MorphologyOperator, Opacity, Paint, Rendering, RepeatCount, Restart, Scale, ShapeRendering, TimingValue, Transform, TurbulenceType, YesNo 14 | @docs StrokeLinecap, StrokeLinejoin, TextRendering 15 | 16 | @docs cm, em, ex, inch, mm, num, pc, percent, pt, px, rem 17 | 18 | -} 19 | 20 | import Color exposing (Color) 21 | 22 | 23 | {-| -} 24 | type Accumulate 25 | = AccumulateNone 26 | | AccumulateSum 27 | 28 | 29 | {-| -} 30 | type Additive 31 | = AdditiveReplace 32 | | AdditiveSum 33 | 34 | 35 | {-| -} 36 | type Align 37 | = Align Scale Scale 38 | | AlignNone 39 | 40 | 41 | {-| -} 42 | type AlignmentBaseline 43 | = AlignmentAuto 44 | | AlignmentBaseline 45 | | AlignmentBeforeEdge 46 | | AlignmentTextBeforeEdge 47 | | AlignmentMiddle 48 | | AlignmentCentral 49 | | AlignmentAfterEdge 50 | | AlignmentTextAfterEdge 51 | | AlignmentIdeographic 52 | | AlignmentAlphabetic 53 | | AlignmentHanging 54 | | AlignmentMathematical 55 | | AlignmentInherit 56 | 57 | 58 | {-| -} 59 | type AnchorAlignment 60 | = AnchorInherit 61 | | AnchorStart 62 | | AnchorMiddle 63 | | AnchorEnd 64 | 65 | 66 | {-| -} 67 | type AnimateTransformType 68 | = AnimateTransformTypeTranslate 69 | | AnimateTransformTypeScale 70 | | AnimateTransformTypeRotate 71 | | AnimateTransformTypeSkewX 72 | | AnimateTransformTypeSkewY 73 | 74 | 75 | {-| -} 76 | type AttributeType 77 | = AttributeTypeAuto 78 | | AttributeTypeCss 79 | | AttributeTypeXml 80 | 81 | 82 | {-| -} 83 | type BaselineShift 84 | = ShiftAuto 85 | | ShiftBaseline 86 | | ShiftSuper 87 | | ShiftSub 88 | | ShiftPercentage Float 89 | | ShiftLength Length 90 | | ShiftInherit 91 | 92 | 93 | {-| -} 94 | type alias BezierAnchorPoint = 95 | { x1 : Float, y1 : Float, x2 : Float, y2 : Float } 96 | 97 | 98 | {-| -} 99 | type CalcMode 100 | = CalcModeDiscrete 101 | | CalcModeLinear 102 | | CalcModePaced 103 | | CalcModeSpline 104 | 105 | 106 | {-| -} 107 | type Clip 108 | = ClipAuto 109 | | ClipInherit 110 | | ClipShape Length Length Length Length 111 | 112 | 113 | {-| -} 114 | type ClipPath 115 | = ClipPathNone 116 | | ClipPathInherit 117 | | ClipPathFunc String 118 | 119 | 120 | {-| -} 121 | type ClipRule 122 | = ClipRuleNonZero 123 | | ClipRuleEvenOdd 124 | | ClipRuleInherit 125 | 126 | 127 | {-| In a future version of TypedSvg, this may be turned into a DSL 128 | -} 129 | type alias ClockValue = 130 | String 131 | 132 | 133 | {-| -} 134 | type ColorInterpolation 135 | = ColorInterpolationAuto 136 | | ColorInterpolationSRGB 137 | | ColorInterpolationLinearRGB 138 | | ColorInterpolationInherit 139 | 140 | 141 | {-| -} 142 | type ColorMatrixType 143 | = ColorMatrixTypeMatrix 144 | | ColorMatrixTypeSaturate 145 | | ColorMatrixTypeHueRotate 146 | | ColorMatrixTypeLuminanceToAlpha 147 | 148 | 149 | {-| -} 150 | type ColorProfile 151 | = ColorProfileAuto 152 | | ColorProfileSRGB 153 | | ColorProfile String 154 | | ColorProfileInherit 155 | 156 | 157 | {-| -} 158 | type CompositeOperator 159 | = CompositeOperatorOver 160 | | CompositeOperatorIn 161 | | CompositeOperatorOut 162 | | CompositeOperatorAtop 163 | | CompositeOperatorXor 164 | | CompositeOperatorArithmetic 165 | 166 | 167 | {-| -} 168 | type CoordinateSystem 169 | = CoordinateSystemUserSpaceOnUse 170 | | CoordinateSystemObjectBoundingBox 171 | 172 | 173 | {-| -} 174 | type Cursor 175 | = CursorAuto 176 | | CursorDefault 177 | | CursorCrosshair 178 | | CursorPointer 179 | | CursorMove 180 | | CursorEResize 181 | | CursorNEResize 182 | | CursorNWResize 183 | | CursorNResize 184 | | CursorSEResize 185 | | CursorSWResize 186 | | CursorWResize 187 | | CursorText 188 | | CursorWait 189 | | CursorHelp 190 | | CursorInherit 191 | | Cursor String 192 | 193 | 194 | {-| -} 195 | type Direction 196 | = DirectionLTR 197 | | DirectionRTL 198 | | DirectionInherit 199 | 200 | 201 | {-| -} 202 | type Display 203 | = DisplayInline 204 | | DisplayBlock 205 | | DisplayListItem 206 | | DisplayRunIn 207 | | DisplayCompact 208 | | DisplayMarker 209 | | DisplayTable 210 | | DisplayInlineTable 211 | | DisplayTableRowGroup 212 | | DisplayTableHeaderGroup 213 | | DisplayTableFooterGroup 214 | | DisplayTableRow 215 | | DisplayTableColumnGroup 216 | | DisplayTableColumn 217 | | DisplayTableCell 218 | | DisplayTableCaption 219 | | DisplayNone 220 | | DisplayInherit 221 | 222 | 223 | {-| -} 224 | type DominantBaseline 225 | = DominantBaselineAuto 226 | | DominantBaselineUseScript 227 | | DominantBaselineNoChange 228 | | DominantBaselineResetSize 229 | | DominantBaselineIdeographic 230 | | DominantBaselineAlphabetic 231 | | DominantBaselineHanging 232 | | DominantBaselineMathematical 233 | | DominantBaselineCentral 234 | | DominantBaselineMiddle 235 | | DominantBaselineTextAfterEdge 236 | | DominantBaselineTextBeforeEdge 237 | | DominantBaselineInherit 238 | 239 | 240 | {-| -} 241 | type Duration 242 | = Duration ClockValue 243 | | DurationIndefinite 244 | 245 | 246 | {-| -} 247 | type EdgeMode 248 | = EdgeModeDuplicate 249 | | EdgeModeWrap 250 | | EdgeModeNone 251 | 252 | 253 | {-| -} 254 | type FillRule 255 | = FillRuleNonZero 256 | | FillRuleEvenOdd 257 | 258 | 259 | {-| -} 260 | type Filter 261 | = FilterNone 262 | | FilterInherit 263 | | Filter String 264 | 265 | 266 | {-| -} 267 | type FloodColor 268 | = FloodInherit 269 | | FloodCurrentColor 270 | | Flood Color 271 | | FloodICC String 272 | 273 | 274 | {-| -} 275 | type FontSizeAdjust 276 | = FontSizeAdjustNone 277 | | FontSizeAdjustInherit 278 | | FontSizeAdjust Float 279 | 280 | 281 | {-| -} 282 | type FontStretch 283 | = FontStretchNormal 284 | | FontStretchWider 285 | | FontStretchNarrower 286 | | FontStretchUltraCondensed 287 | | FontStretchExtraCondensed 288 | | FontStretchCondensed 289 | | FontStretchSemiCondensed 290 | | FontStretchSemiExpanded 291 | | FontStretchExpanded 292 | | FontStretchExtraExpanded 293 | | FontStretchUltraExpanded 294 | | FontStretchInherit 295 | 296 | 297 | {-| -} 298 | type FontStyle 299 | = FontStyleNormal 300 | | FontStyleItalic 301 | | FontStyleOblique 302 | | FontStyleInherit 303 | 304 | 305 | {-| -} 306 | type FontVariant 307 | = FontVariantNormal 308 | | FontVariantSmallCaps 309 | | FontVariantInherit 310 | 311 | 312 | {-| -} 313 | type FontWeight 314 | = FontWeightNormal 315 | | FontWeightBold 316 | | FontWeightBolder 317 | | FontWeightLighter 318 | | FontWeightInherit 319 | | FontWeight Int 320 | 321 | 322 | {-| -} 323 | type FuncType 324 | = FuncTypeIdentity 325 | | FuncTypeTable 326 | | FuncTypeDiscrete 327 | | FuncTypeLinear 328 | | FuncTypeGamma 329 | 330 | 331 | {-| -} 332 | type InValue 333 | = InSourceGraphic 334 | | InSourceAlpha 335 | | InBackgroundAlpha 336 | | InFillPaint 337 | | InStrokePaint 338 | | InReference String 339 | 340 | 341 | {-| -} 342 | type Kerning 343 | = KerningAuto 344 | | KerningInherit 345 | | KerningLength Length 346 | 347 | 348 | {-| The Length type is an important type in the TypedSvg package--it is used 349 | wherever CSS needs to measure a length or distance in a certain unit (px, 350 | em, etc.) 351 | -} 352 | type Length 353 | = Cm Float 354 | | Em Float 355 | | Ex Float 356 | | In Float 357 | | Mm Float 358 | | Num Float 359 | | Pc Float 360 | | Percent Float 361 | | Pt Float 362 | | Px Float 363 | | Rem Float 364 | 365 | 366 | {-| Length expressed as a centimeter 367 | -} 368 | cm : Float -> Length 369 | cm = 370 | Cm 371 | 372 | 373 | {-| Length expressed as an `em` 374 | -} 375 | em : Float -> Length 376 | em = 377 | Em 378 | 379 | 380 | {-| Length expressed as a `ex` 381 | -} 382 | ex : Float -> Length 383 | ex = 384 | Ex 385 | 386 | 387 | {-| Length expressed as an inch 388 | -} 389 | inch : Float -> Length 390 | inch = 391 | In 392 | 393 | 394 | {-| Length expressed as a millimeter 395 | -} 396 | mm : Float -> Length 397 | mm = 398 | Mm 399 | 400 | 401 | {-| Length expressed as a raw number 402 | -} 403 | num : Float -> Length 404 | num = 405 | Num 406 | 407 | 408 | {-| Length expressed as a `pc` 409 | -} 410 | pc : Float -> Length 411 | pc = 412 | Pc 413 | 414 | 415 | {-| Length expressed as a percentage 416 | -} 417 | percent : Float -> Length 418 | percent = 419 | Percent 420 | 421 | 422 | {-| Length expressed in points 423 | -} 424 | pt : Float -> Length 425 | pt = 426 | Pt 427 | 428 | 429 | {-| Length expressed in pixels 430 | -} 431 | px : Float -> Length 432 | px = 433 | Px 434 | 435 | 436 | {-| Length expressed in rem. 437 | -} 438 | rem : Float -> Length 439 | rem = 440 | Rem 441 | 442 | 443 | {-| -} 444 | type LengthAdjust 445 | = LengthAdjustSpacing 446 | | LengthAdjustSpacingAndGlyphs 447 | 448 | 449 | {-| -} 450 | type MarkerCoordinateSystem 451 | = MarkerCoordinateSystemUserSpaceOnUse 452 | | MarkerCoordinateSystemStrokeWidth 453 | 454 | 455 | {-| -} 456 | type MeetOrSlice 457 | = Meet 458 | | Slice 459 | 460 | 461 | {-| -} 462 | type Mode 463 | = ModeNormal 464 | | ModeMultiply 465 | | ModeScreen 466 | | ModeDarken 467 | | ModeLighten 468 | 469 | 470 | {-| -} 471 | type MorphologyOperator 472 | = MorphologyOperatorErode 473 | | MorphologyOperatorDilate 474 | 475 | 476 | {-| -} 477 | type Opacity 478 | = Opacity Float 479 | | OpacityInherit 480 | 481 | 482 | {-| `fill` and `stroke` accepted values 483 | 484 | [ fill <| Paint Color.red -- fill="#FF0000" 485 | , fill <| CSSVariable "--text" -- fill="var(--text)" 486 | , fill <| Reference "some-id" -- fill="url(#some-id)" 487 | , fill <| ContextFill -- fill="context-fill" 488 | , fill <| ContextStroke -- fill="context-stroke" 489 | , fill <| PaintNone -- fill="none" 490 | ] 491 | 492 | -} 493 | type Paint 494 | = Paint Color 495 | | CSSVariable String 496 | | Reference String 497 | | ContextFill 498 | | ContextStroke 499 | | PaintNone 500 | 501 | 502 | {-| -} 503 | type Rendering 504 | = RenderingAuto 505 | | RenderingOptimizeSpeed 506 | | RenderingOptimizeQuality 507 | | RenderingInherit 508 | 509 | 510 | {-| -} 511 | type RepeatCount 512 | = RepeatCount Float 513 | | RepeatIndefinite 514 | 515 | 516 | {-| -} 517 | type Restart 518 | = RestartAlways 519 | | RestartWhenNotActive 520 | | RestartNever 521 | 522 | 523 | {-| -} 524 | type Scale 525 | = ScaleMin 526 | | ScaleMid 527 | | ScaleMax 528 | 529 | 530 | {-| -} 531 | type ShapeRendering 532 | = RenderAuto 533 | | RenderOptimizeSpeed 534 | | RenderCrispEdges 535 | | RenderGeometricPrecision 536 | | RenderInherit 537 | 538 | 539 | {-| The stroke-linecap attribute specifies the shape to be used at the end of open subpaths when they are 540 | stroked. 541 | -} 542 | type StrokeLinecap 543 | = StrokeLinecapButt 544 | | StrokeLinecapRound 545 | | StrokeLinecapSquare 546 | | StrokeLinecapInherit 547 | 548 | 549 | {-| The stroke-linejoin attribute specifies the shape to be used at the corners of paths or basic shapes 550 | when they are stroked. 551 | 552 | As a presentation attribute, it also can be used as a property directly inside a CSS stylesheet. 553 | 554 | Note: the final appearence of the miter option is also influenced by the stroke-miterlimit attribute. 555 | 556 | -} 557 | type StrokeLinejoin 558 | = StrokeLinejoinMiter 559 | | StrokeLinejoinRound 560 | | StrokeLinejoinBevel 561 | | StrokeLinejoinInherit 562 | 563 | 564 | {-| The Transform type is used by `transform` and `gradientTransform` 565 | -} 566 | type Transform 567 | = Matrix Float Float Float Float Float Float 568 | | Rotate Float Float Float 569 | | Scale Float Float 570 | | SkewX Float 571 | | SkewY Float 572 | | Translate Float Float 573 | 574 | 575 | {-| The creator of SVG content might want to provide a hint about what tradeoffs to make as the browser 576 | renders text. The text-rendering attribute provides these hints. 577 | 578 | As a presentation attribute, it also can be used as a property directly inside a CSS stylesheet, see css text-rendering for further information 579 | 580 | -} 581 | type TextRendering 582 | = TextRenderingAuto 583 | | TextRenderingOptimizeSpeed 584 | | TextRenderingOptimizeLegibility 585 | | TextRenderingGeometricPrecision 586 | | TextRenderingInherit 587 | 588 | 589 | {-| Used by `begin` and `end` in constraining animation times 590 | -} 591 | type TimingValue 592 | = TimingOffsetValue ClockValue 593 | | TimingSyncBaseValue String 594 | | TimingEventValue String 595 | | TimingRepeatValue String 596 | | TimingAccessKeyValue String 597 | | TimingWallclockSyncValue String 598 | | TimingIndefinite 599 | 600 | 601 | {-| -} 602 | type TurbulenceType 603 | = TurbulenceTypeFractalNoise 604 | | TurbulenceTypeTurbulence 605 | 606 | 607 | {-| Used by allowReorder 608 | -} 609 | type YesNo 610 | = Yes 611 | | No 612 | -------------------------------------------------------------------------------- /src/TypedSvg/Filters/Attributes.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Filters.Attributes exposing (azimuth, baseFrequency, bias, colorInterpolationFilters, colorMatrixType, colorMatrixValues, compositeOperator, diffuseConstant, divisor, edgeMode, elevation, filterRes, filterUnits, floodColor, floodOpacity, funcType, in2, in_, k1, k2, k3, k4, kernelMatrix, kernelUnitLength, limitingConeAngle, mode, morphologyOperator, numOctaves, order, pointsAtX, pointsAtY, pointsAtZ, preserveAlpha, radius, result, scale, seed, surfaceScale, targetX, targetY, turbulenceType, z) 2 | 3 | {-| Attributes of SVG filter elements 4 | 5 | 6 | # Attributes 7 | 8 | @docs azimuth, baseFrequency, bias, colorInterpolationFilters, colorMatrixType, colorMatrixValues, compositeOperator, diffuseConstant, divisor, edgeMode, elevation, filterRes, filterUnits, floodColor, floodOpacity, funcType, in2, in_, k1, k2, k3, k4, kernelMatrix, kernelUnitLength, limitingConeAngle, mode, morphologyOperator, numOctaves, order, pointsAtX, pointsAtY, pointsAtZ, preserveAlpha, radius, result, scale, seed, surfaceScale, targetX, targetY, turbulenceType, z 9 | 10 | -} 11 | 12 | import TypedSvg.Core exposing (..) 13 | import TypedSvg.Types exposing (..) 14 | import TypedSvg.TypesToStrings exposing (..) 15 | 16 | 17 | {-| The azimuth attribute represents the direction angle of the light source on 18 | the XY plane (clockwise), in degrees from the x axis. 19 | 20 | If the attribute is not specified, then the effect is as if a value of 0 21 | were specified. 22 | 23 | Used by Elements: Filters.distantLight 24 | 25 | See: 26 | 27 | -} 28 | azimuth : Float -> Attribute msg 29 | azimuth angle = 30 | attribute "azimuth" <| String.fromFloat angle 31 | 32 | 33 | {-| The baseFrequency attribute represents the frequency parameter for the noise 34 | function of the `Filters.turbulence` primitive. The first Float represents 35 | a base frequency in the X direction and the second value represents a base 36 | frequency in the Y direction. 37 | 38 | Negative values are forbidden. 39 | 40 | If the attribute is not specified, then the effect is as if a value of 0 41 | were specified. 42 | 43 | Used by Elements: Filters.turbulence 44 | 45 | See: 46 | 47 | -} 48 | baseFrequency : Float -> Float -> Attribute msg 49 | baseFrequency xFrequency yFrequency = 50 | attribute "baseFrequency" <| String.fromFloat xFrequency ++ " " ++ String.fromFloat yFrequency 51 | 52 | 53 | {-| The bias attribute shifts the range of a filter. After applying the 54 | kernelMatrix of the `Filters.convolveMatrix` element to the input image to 55 | yield a Float and applying the divisor attribute, the bias attribute is 56 | added to each component. This allows representation of values that would 57 | otherwise be clamped to 0 or 1. 58 | 59 | If bias is not specified, then the effect is as if a value of 0 were 60 | specified. 61 | 62 | Used by Elements: Filters.convolveMatrix 63 | 64 | See: 65 | 66 | -} 67 | bias : Float -> Attribute msg 68 | bias rangeShift = 69 | attribute "bias" <| String.fromFloat rangeShift 70 | 71 | 72 | {-| The `colorInterpolationFilters` attribute specifies the color space for 73 | imaging operations performed via filter effects. 74 | 75 | Note that `colorInterpolationFilters` has a different initial value than 76 | `colorInterpolation`. `colorInterpolationFilters` has an initial value of 77 | linearRGB, whereas color-interpolation has an initial value of sRGB. Thus, 78 | in the default case, filter effects operations occur in the linearRGB 79 | color space, whereas all other color interpolations occur by default in the 80 | sRGB color space. 81 | 82 | As a presentation attribute, it also can be used as a property directly 83 | inside a CSS stylesheet. 84 | 85 | Used by Elements: Filters.blend, Filters.colorMatrix, 86 | Filters.componentTransfer, Filters.composite, Filters.convolveMatrix, 87 | Filters.diffuseLighting, Filters.displacementMap, Filters.gaussianBlur, 88 | Filters.morphology, Filters.offset, Filters.specularLighting, 89 | Filters.tile 90 | 91 | See: 92 | 93 | -} 94 | colorInterpolationFilters : ColorInterpolation -> Attribute msg 95 | colorInterpolationFilters colorInterpolation = 96 | attribute "color-interpolation-filters" <| colorInterpolationToString colorInterpolation 97 | 98 | 99 | {-| Indicates the type of matrix operation. The keyword matrix indicates that a 100 | full 5x4 matrix of values will be provided. The other keywords represent 101 | convenience shortcuts to allow commonly used color operations to be 102 | performed without specifying a complete matrix. 103 | 104 | Used by Elements: Filters.colorMatrix 105 | 106 | See: 107 | 108 | -} 109 | colorMatrixType : ColorMatrixType -> Attribute msg 110 | colorMatrixType cmType = 111 | attribute "type" <| colorMatrixTypeToString cmType 112 | 113 | 114 | {-| Contents of `colorMatrixValues` depends on the value of the attribute 115 | `type`. 116 | 117 | Used by Elements: Filters.colorMatrix 118 | 119 | NOTE: this is called `values` in `elm-lang/svg` but is different here 120 | in order to differentiate from animationValues. 121 | 122 | See: 123 | 124 | -} 125 | colorMatrixValues : String -> Attribute msg 126 | colorMatrixValues string = 127 | attribute "values" string 128 | 129 | 130 | {-| `compositeOperator` defines the compositing operation that is to be performed 131 | in the `Filters.composite` element 132 | 133 | Used by Elements: Filters.composite 134 | 135 | See: 136 | 137 | -} 138 | compositeOperator : CompositeOperator -> Attribute msg 139 | compositeOperator operator = 140 | attribute "operator" <| compositeOperatorToString operator 141 | 142 | 143 | {-| The `diffuseConstant` attribute represant the kd value in the Phong lighting 144 | model. In SVG, this can be any non-negative number. 145 | 146 | If the attribute is not specified, then the effect is as if a value of 1 147 | were specified. 148 | 149 | Used by Elements: Filters.diffuseLighting 150 | 151 | See: 152 | 153 | -} 154 | diffuseConstant : Float -> Attribute msg 155 | diffuseConstant kdValue = 156 | attribute "diffuseConstant" <| String.fromFloat kdValue 157 | 158 | 159 | {-| After applying the `kernelMatrix` of the `Filters.convolveMatrix` element to 160 | the input image to yield a number, that Float is divided by the value given to 161 | the divisor attribute to yield the final destination color value. A divisor 162 | that is the sum of all the matrix values tends to have an evening effect on 163 | the overall color intensity of the result. 164 | 165 | The default value is the sum of all values in kernelMatrix, with the 166 | exception that if the sum is zero, then the divisor is set to 1. 167 | 168 | It is an error to specify a divisor of zero. 169 | 170 | Used by Elements: Filters.convolveMatrix 171 | 172 | See: 173 | 174 | -} 175 | divisor : Float -> Attribute msg 176 | divisor value = 177 | attribute "divisor" <| String.fromFloat value 178 | 179 | 180 | {-| The edgeMode attribute determines how to extend the input image as necessary 181 | with color values so that the matrix operations can be applied when the 182 | kernel is positioned at or near the edge of the input image. 183 | 184 | Used by Elements: Filters.convolveMatrix 185 | 186 | See: 187 | 188 | -} 189 | edgeMode : EdgeMode -> Attribute msg 190 | edgeMode eMode = 191 | attribute "edgeMode" <| edgeModeToString eMode 192 | 193 | 194 | {-| The elevation attribute represents the direction angle for a light source 195 | from the XY plane towards the Z axis, in degrees. Note the positive Z-axis 196 | points towards the viewer of the content. 197 | 198 | Used by Elements: Filters.distantLight 199 | 200 | See: 201 | 202 | -} 203 | elevation : Float -> Attribute msg 204 | elevation angle = 205 | attribute "elevation" <| String.fromFloat angle 206 | 207 | 208 | {-| A `filter` element can define a region to which a given filter effect 209 | applies and can provide a resolution for any intermediate continuous tone 210 | images used to process any raster-based filter primitives. 211 | 212 | NOTE: Obsolete. 213 | 214 | Used by Elements: Filters.filter 215 | 216 | See: 217 | 218 | -} 219 | filterRes : Float -> Float -> Attribute msg 220 | filterRes xPixels yPixels = 221 | attribute "filterRes" <| String.fromFloat xPixels ++ " " ++ String.fromFloat yPixels 222 | 223 | 224 | {-| The `filterUnits` attribute defines the coordinate system for attributes 225 | `x`, `y`, `width` and `height`. 226 | 227 | Used by Elements: Filters.filter 228 | 229 | See: 230 | 231 | -} 232 | filterUnits : CoordinateSystem -> Attribute msg 233 | filterUnits coordinateSystem = 234 | attribute "filterUnits" <| coordinateSystemToString coordinateSystem 235 | 236 | 237 | {-| The `floodColor` attribute indicates what color to use to flood the current 238 | filter primitive subregion defined through the `Filters.flood` element. The 239 | keyword currentColor and ICC colors can be specified in the same manner as 240 | within a `paint` specification for the fill and stroke attributes. 241 | 242 | As a presentation attribute, it also can be used as a property directly 243 | inside a CSS stylesheet. 244 | 245 | Used by Elements: Filters.flood 246 | 247 | See: 248 | 249 | -} 250 | floodColor : FloodColor -> Attribute msg 251 | floodColor col = 252 | attribute "floodColor" <| floodColorToString col 253 | 254 | 255 | {-| The `floodOpacity` attribute indicates the opacity value to use across the 256 | current filter primitive subregion defined through the `Filters.flood` element. 257 | 258 | Used by Elements: Filters.flood 259 | 260 | See: 261 | 262 | -} 263 | floodOpacity : Opacity -> Attribute msg 264 | floodOpacity opacity = 265 | attribute "floodOpacity" <| opacityToString opacity 266 | 267 | 268 | {-| The `in_` attribute identifies input for the given filter primitive. 269 | 270 | Takes type InValue, which can be one of 6 constants, or a reference 271 | 272 | If no value is provided and this is the first filter primitive, then this 273 | filter primitive will use `InSourceGraphic` as its input. 274 | 275 | If no value is provided and this is a subsequent filter primitive, then this 276 | filter primitive will use the result from the previous filter primitive as 277 | its input. 278 | 279 | Used by Elements: Filters.blend, Filters.colorMatrix, 280 | Filters.componentTransfer, Filters.composite, Filters.convolveMatrix, 281 | Filters.diffuseLighting, Filters.displacementMap, Filters.gaussianBlur, 282 | Filters.morphology, Filters.offset, Filters.specularLighting, 283 | Filters.tile 284 | 285 | See: 286 | 287 | -} 288 | in_ : InValue -> Attribute msg 289 | in_ value = 290 | attribute "in" <| inValueToString value 291 | 292 | 293 | {-| The `in2` attribute identifies the second input for the given filter 294 | primitive. It works exactly like the in attribute. 295 | 296 | Used by Elements: Filters.blend, Filters.colorMatrix, 297 | Filters.componentTransfer, Filters.composite, Filters.convolveMatrix, 298 | Filters.diffuseLighting, Filters.displacementMap, Filters.gaussianBlur, 299 | Filters.morphology, Filters.offset, Filters.specularLighting, 300 | Filters.tile 301 | 302 | See: 303 | 304 | -} 305 | in2 : InValue -> Attribute msg 306 | in2 value = 307 | attribute "in2" <| inValueToString value 308 | 309 | 310 | {-| The k1 attribute defines one of the values to be used within the arithmetic 311 | operation of the `Filters.composite` filter primitive. 312 | 313 | If this attribute is not set, its default value is 0. 314 | 315 | Used by Elements: Filters.composite 316 | 317 | See: 318 | 319 | -} 320 | k1 : Float -> Attribute msg 321 | k1 value = 322 | attribute "k1" <| String.fromFloat value 323 | 324 | 325 | {-| The k2 attribute defines one of the values to be used within the arithmetic 326 | operation of the `Filters.composite` filter primitive. 327 | 328 | If this attribute is not set, its default value is 0. 329 | 330 | Used by Elements: Filters.composite 331 | 332 | See: 333 | 334 | -} 335 | k2 : Float -> Attribute msg 336 | k2 value = 337 | attribute "k2" <| String.fromFloat value 338 | 339 | 340 | {-| The k3 attribute defines one of the values to be used within the arithmetic 341 | operation of the `Filters.composite` filter primitive. 342 | 343 | If this attribute is not set, its default value is 0. 344 | 345 | Used by Elements: Filters.composite 346 | 347 | See: 348 | 349 | -} 350 | k3 : Float -> Attribute msg 351 | k3 value = 352 | attribute "k3" <| String.fromFloat value 353 | 354 | 355 | {-| The k4 attribute defines one of the values to be used within the arithmetic 356 | operation of the `Filters.composite` filter primitive. 357 | 358 | If this attribute is not set, its default value is 0. 359 | 360 | Used by Elements: Filters.composite 361 | 362 | See: 363 | 364 | -} 365 | k4 : Float -> Attribute msg 366 | k4 value = 367 | attribute "k4" <| String.fromFloat value 368 | 369 | 370 | {-| The `order` attribute defines the list of numbers that makes up the kernel 371 | matrix for the `Filters.convolveMatrix` element. 372 | 373 | The Float of entries in the list must be equal to `orderX` x `orderY`, as 374 | defined in the `order` attribute. 375 | 376 | Used by Elements: Filters.convolveMatrix 377 | 378 | See: 379 | 380 | -} 381 | kernelMatrix : List Float -> Attribute msg 382 | kernelMatrix numberList = 383 | attribute "kernelMatrix" (String.join " " (List.map String.fromFloat numberList)) 384 | 385 | 386 | {-| The `kernelUnitLength` attribute has two meaning based on the context it's 387 | used: 388 | 389 | - For lighting filter primitives, it indicates the intended distance in 390 | current filter units (i.e., units as determined by the value of attribute 391 | primitiveUnits) for `dx` and `dy`, respectively, in the surface normal 392 | calculation formulas. 393 | 394 | - For the `feConvolveMatrix` primitive, it indicates the intended distance 395 | in current filter units (i.e., units as determined by the value of 396 | attribute primitiveUnits) between successive columns and rows, 397 | respectively, in the kernelMatrix. 398 | 399 | Used by Elements: Filters.convolveMatrix, Filters.diffuseLighting, 400 | Filters.specularLighting 401 | 402 | See: 403 | 404 | -} 405 | kernelUnitLength : Float -> Float -> Attribute msg 406 | kernelUnitLength dx dy = 407 | attribute "kernelUnitLength" <| String.fromFloat dx ++ " " ++ String.fromFloat dy 408 | 409 | 410 | {-| The limitingConeAngle attribute represents the angle in degrees between 411 | the spot light axis (i.e. the axis between the light source and the point 412 | to which it is pointing at) and the spot light cone. So it defines a 413 | limiting cone which restricts the region where the light is projected. 414 | No light is projected outside the cone. 415 | 416 | If no value is specified, then no limiting cone will be applied. 417 | 418 | Used by Elements: Filters.spotlight 419 | 420 | See: 421 | 422 | -} 423 | limitingConeAngle : Float -> Attribute msg 424 | limitingConeAngle num = 425 | attribute "limitingConeAngle" <| String.fromFloat num 426 | 427 | 428 | {-| The `mode` attribute defines the blending mode on the `Filters.blend` filter 429 | primitive. 430 | 431 | Used by Elements: Filters.blend 432 | 433 | See: 434 | 435 | -} 436 | mode : Mode -> Attribute msg 437 | mode md = 438 | attribute "mode" <| modeToString md 439 | 440 | 441 | {-| `morphologyOperator` defines the compositing operation that is to be performed 442 | in the `feMorphology` element 443 | 444 | Used by Elements: Filters.morphology 445 | 446 | See: 447 | 448 | -} 449 | morphologyOperator : MorphologyOperator -> Attribute msg 450 | morphologyOperator operator = 451 | attribute "operator" <| morphologyOperatorToString operator 452 | 453 | 454 | {-| The `numOctaves` parameter for the noise function of the 455 | `Filters.turbulence` primitive. 456 | 457 | If the attribute is not specified, then the effect is as if a value of 1 458 | were specified. 459 | 460 | Used by Elements: Filters.turbulence 461 | 462 | See: 463 | 464 | -} 465 | numOctaves : Int -> Attribute msg 466 | numOctaves int = 467 | attribute "numOctaves" <| String.fromInt int 468 | 469 | 470 | {-| The order attribute indicates the size of the matrix to be used by an 471 | `Filters.convolveMatrix` element. 472 | 473 | The values provided must be integers greater than zero. The first number, 474 | `orderX`, indicates the Float of columns in the matrix. The second number, 475 | `orderY`, indicates the Float of rows in the matrix. 476 | 477 | A typical value is order="3". It is recommended that only small values 478 | (e.g., 3) be used; higher values may result in very high CPU overhead and 479 | usually do not produce results that justify the impact on performance. 480 | 481 | If the attribute is not specified, the effect is as if a value of 3 were 482 | specified. 483 | 484 | Used by Elements: Filters.convolveMatrix 485 | 486 | See: 487 | 488 | -} 489 | order : Float -> Float -> Attribute msg 490 | order orderX orderY = 491 | attribute "order" <| String.fromFloat orderX ++ " " ++ String.fromFloat orderY 492 | 493 | 494 | {-| The `pointsAtX` attribute represent the X location in the coordinate system 495 | established by attribute primitiveUnits on the `filter` element of the point 496 | at which the light source is pointing. 497 | 498 | If the attribute is not specified, then the effect is as if a value of 0 499 | were specified. 500 | 501 | Used by Elements: Filters.spotlight 502 | 503 | See: 504 | 505 | -} 506 | pointsAtX : Float -> Attribute msg 507 | pointsAtX lightSourceX = 508 | attribute "pointsAtX" <| String.fromFloat lightSourceX 509 | 510 | 511 | {-| The `pointsAtY` attribute represent the Y location in the coordinate system 512 | established by attribute primitiveUnits on the `filter` element of the point 513 | at which the light source is pointing. 514 | 515 | If the attribute is not specified, then the effect is as if a value of 0 516 | were specified. 517 | 518 | Used by Elements: Filters.spotlight 519 | 520 | See: 521 | 522 | -} 523 | pointsAtY : Float -> Attribute msg 524 | pointsAtY lightSourceY = 525 | attribute "pointsAtY" <| String.fromFloat lightSourceY 526 | 527 | 528 | {-| The `pointsAtZ` attribute represents the Z location in the coordinate system 529 | established by attribute primitiveUnits on the `filter` element of the point 530 | at which the light source is pointing. 531 | 532 | If the attribute is not specified, then the effect is as if a value of 0 533 | were specified. 534 | 535 | Used by Elements: Filters.spotlight 536 | 537 | See: 538 | 539 | -} 540 | pointsAtZ : Float -> Attribute msg 541 | pointsAtZ lightSourceZ = 542 | attribute "pointsAtZ" <| String.fromFloat lightSourceZ 543 | 544 | 545 | {-| The `preserveAlpha` attribute indicates how an `feConvolveMatrix` element 546 | handles alpha transparency. 547 | 548 | A value of false indicates that the convolution matrix will apply to all 549 | channels, including the alpha channel. This is the default value. 550 | 551 | A value of true indicates that the convolution matrix will only apply to the 552 | color channels. 553 | 554 | Used by Elements: Filters.convolveMatrix 555 | 556 | See: 557 | 558 | -} 559 | preserveAlpha : Bool -> Attribute msg 560 | preserveAlpha applyOnlyToColorChannels = 561 | attribute "preserveAlpha" <| boolToString applyOnlyToColorChannels 562 | 563 | 564 | {-| The `radius` attribute represent the radius for the operation on a given 565 | `feMorphology` filter primitive. The values are in the coordinate system 566 | established by the `primitiveUnits` attribute on the `filter` element. 567 | 568 | If the attribute is not specified, then the effect is as if a value of 0 569 | were specified. 570 | 571 | Used by Elements: Filters.morphology 572 | 573 | See: 574 | 575 | -} 576 | radius : Float -> Float -> Attribute msg 577 | radius xRadius yRadius = 578 | attribute "radius" <| String.fromFloat xRadius ++ " " ++ String.fromFloat yRadius 579 | 580 | 581 | {-| The `result` attribute defines the assigned name for this filter primitive. 582 | If supplied, then graphics that result from processing this filter primitive 583 | can be referenced by an in attribute on a subsequent filter primitive within 584 | the same `filter` element. 585 | 586 | If no value is provided, the output will only be available for re-use as the 587 | implicit input into the next filter primitive if that filter primitive 588 | provides no value for its in attribute. 589 | 590 | Used by Elements: feBlend, feColorMatrix, feComponentTransfer, feComposite, 591 | feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feDropShadow, 592 | feFlood,feFuncA, feFuncB, feFuncG, feFuncR,feGaussianBlur, feImage, 593 | feMerge, feMergeNode, feMorphology, feOffset, feSpecularLighting, 594 | feTile, feTurbulence 595 | 596 | See: 597 | 598 | -} 599 | result : String -> Attribute msg 600 | result reference = 601 | attribute "result" <| reference 602 | 603 | 604 | {-| The `scale` attribute define the displacement scale factor to be used on a 605 | `Filters.displacementMap` filter primitive. The amount is expressed in the 606 | coordinate system established by the `primitiveUnits` attribute on the 607 | `filter` element. 608 | 609 | When the value of this attribute is 0, this operation has no effect on the 610 | source image. 611 | 612 | If the attribute is not specified, then the effect is as if a value of 0 613 | were specified. 614 | 615 | Used by Elements: Filters.displacementMap 616 | 617 | See: 618 | 619 | -} 620 | scale : Float -> Attribute msg 621 | scale value = 622 | attribute "scale" <| String.fromFloat value 623 | 624 | 625 | {-| The seed attribute represents the starting Float for the pseudo random 626 | number generator of the `Filters.turbulence` primitive. 627 | 628 | If the attribute is not specified, then the effect is as if a value of 0 629 | were specified. 630 | 631 | Used by Elements: Filters.turbulence 632 | 633 | See: 634 | 635 | -} 636 | seed : Float -> Attribute msg 637 | seed value = 638 | attribute "seed" <| String.fromFloat value 639 | 640 | 641 | {-| The `surfaceScale` attribute represents the height of the surface for a 642 | light filter primitive. 643 | 644 | If the attribute is not specified, then the effect is as if a value of 1 645 | were specified. 646 | 647 | Used by Elements: Filters.diffuseLighting, Filters.specularLighting 648 | 649 | See: 650 | 651 | -} 652 | surfaceScale : Float -> Attribute msg 653 | surfaceScale value = 654 | attribute "surfaceScale" <| String.fromFloat value 655 | 656 | 657 | {-| The `targetX` attribute determines the positioning in X of the convolution 658 | matrix relative to a given target pixel in the input image. The leftmost 659 | column of the matrix is column Float zero. The value must be such that: 660 | 661 | 0 <= targetX < orderX 662 | 663 | By default, the convolution matrix is centered in X over each pixel of the 664 | input image (i.e., targetX = floor ( orderX / 2 )). 665 | 666 | Used by Elements: convolveMatrix 667 | 668 | See: 669 | 670 | -} 671 | targetX : Float -> Attribute msg 672 | targetX xPosition = 673 | attribute "targetX" <| String.fromFloat xPosition 674 | 675 | 676 | {-| The targetY attribute determines the positioning in Y of the convolution 677 | matrix relative to a given target pixel in the input image. The topmost 678 | row of the matrix is row Float zero. The value must be such that: 679 | 680 | 0 <= targetY < orderY 681 | 682 | By default, the convolution matrix is centered in Y over each pixel of the 683 | input image (i.e., targetY = floor ( orderY / 2 )). 684 | 685 | Used by Elements: Filters.convolveMatrix 686 | 687 | See: 688 | 689 | -} 690 | targetY : Float -> Attribute msg 691 | targetY yPosition = 692 | attribute "targetY" <| String.fromFloat yPosition 693 | 694 | 695 | {-| Indicates the type of component transfer function. 696 | 697 | Used by Elements: Filters.funcR, Filters.funcG, Filters.funcA, Filters.funcB 698 | 699 | See: 700 | 701 | -} 702 | funcType : FuncType -> Attribute msg 703 | funcType fType = 704 | attribute "type" <| funcTypeToString fType 705 | 706 | 707 | {-| Indicates whether the filter primitive should perform a noise or turbulence 708 | function. 709 | 710 | Used by Elements: Filters.turbulence 711 | 712 | See: 713 | 714 | -} 715 | turbulenceType : TurbulenceType -> Attribute msg 716 | turbulenceType tType = 717 | attribute "type" <| turbulenceTypeToString tType 718 | 719 | 720 | {-| The `z` attribute difines the location along the Z-axis for a light source 721 | in the coordinate system established by the primitiveUnits attribute on the 722 | `filter` element, assuming that, in the initial coordinate system, the 723 | positive Z-axis comes out towards the person viewing the content and 724 | assuming that one unit along the Z-axis equals on unit in X and Z. 725 | 726 | If the attribute is not specified, then the effect is as if a value of 0 were specified. 727 | 728 | Used by Elements: Filters.pointlight, Filters.spotlight 729 | 730 | See: 731 | 732 | -} 733 | z : Float -> Attribute msg 734 | z value = 735 | attribute "z" <| String.fromFloat value 736 | -------------------------------------------------------------------------------- /src/TypedSvg/TypesToStrings.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.TypesToStrings exposing 2 | ( accumulateToString, additiveToString, alignToString 3 | , alignmentBaselineToString, anchorAlignmentToString 4 | , animateTransformTypeToString, attributeTypeToString 5 | , baselineShiftToString, bezierAnchorPointToString, boolToString 6 | , calcModeToString, clipPathToString, clipRuleToString, clipToString 7 | , colorInterpolationToString, colorMatrixTypeToString 8 | , colorProfileToString, compositeOperatorToString, coordinateSystemToString 9 | , cursorToString, directionToString, displayToString 10 | , dominantBaselineToString, durationToString, edgeModeToString 11 | , fillRuleToString, filterToString, floodColorToString 12 | , fontSizeAdjustToString, fontStretchToString, fontStyleToString 13 | , fontVariantToString, fontWeightToString, funcTypeToString, inValueToString 14 | , kerningToString, lengthAdjustToString, lengthToString 15 | , markerCoordinateSystemToString, meetOrSliceToString, modeToString 16 | , morphologyOperatorToString, opacityToString 17 | , renderingToString, repeatCountToString, restartToString, scaleToString 18 | , shapeRenderingToString, timingValueAsString, transformToString 19 | , turbulenceTypeToString, yesNoToString 20 | , paintToString, strokeLinecapToString, strokeLinejoinToString, textRenderingToString 21 | ) 22 | 23 | {-| 24 | 25 | 26 | # Converts each type from TypedSvg.Types to its corresponding string 27 | 28 | @docs accumulateToString, additiveToString, alignToString 29 | @docs alignmentBaselineToString, anchorAlignmentToString 30 | @docs animateTransformTypeToString, attributeTypeToString 31 | @docs baselineShiftToString, bezierAnchorPointToString, boolToString 32 | @docs calcModeToString, clipPathToString, clipRuleToString, clipToString 33 | @docs cm, colorInterpolationToString, colorMatrixTypeToString 34 | @docs colorProfileToString, compositeOperatorToString, coordinateSystemToString 35 | @docs cursorToString, directionToString, displayToString 36 | @docs dominantBaselineToString, durationToString, edgeModeToString, em, ex 37 | @docs fillRuleToString, filterToString, floodColorToString 38 | @docs fontSizeAdjustToString, fontStretchToString, fontStyleToString 39 | @docs fontVariantToString, fontWeightToString, funcTypeToString, inValueToString 40 | @docs inch, kerningToString, lengthAdjustToString, lengthToString 41 | @docs markerCoordinateSystemToString, meetOrSliceToString, mm, modeToString 42 | @docs morphologyOperatorToString, num, opacityToString, pc, percent, pt, px 43 | @docs renderingToString, repeatCountToString, restartToString, scaleToString 44 | @docs shapeRenderingToString, timingValueAsString, transformToString 45 | @docs turbulenceTypeToString, yesNoToString 46 | 47 | -} 48 | 49 | import Color exposing (Color, toCssString) 50 | import TypedSvg.Types exposing (..) 51 | 52 | 53 | boolToString : Bool -> String 54 | boolToString bool = 55 | case bool of 56 | True -> 57 | "true" 58 | 59 | False -> 60 | "false" 61 | 62 | 63 | accumulateToString : Accumulate -> String 64 | accumulateToString accumulate = 65 | case accumulate of 66 | AccumulateNone -> 67 | "none" 68 | 69 | AccumulateSum -> 70 | "sum" 71 | 72 | 73 | additiveToString : Additive -> String 74 | additiveToString additive = 75 | case additive of 76 | AdditiveReplace -> 77 | "replace" 78 | 79 | AdditiveSum -> 80 | "sum" 81 | 82 | 83 | alignToString : Align -> String 84 | alignToString align = 85 | case align of 86 | AlignNone -> 87 | "none" 88 | 89 | Align x y -> 90 | "x" ++ scaleToString x ++ "Y" ++ scaleToString y 91 | 92 | 93 | alignmentBaselineToString : AlignmentBaseline -> String 94 | alignmentBaselineToString alignmentBaseline = 95 | case alignmentBaseline of 96 | AlignmentAuto -> 97 | "auto" 98 | 99 | AlignmentBaseline -> 100 | "baseline" 101 | 102 | AlignmentBeforeEdge -> 103 | "before-edge" 104 | 105 | AlignmentTextBeforeEdge -> 106 | "text-before-edge" 107 | 108 | AlignmentMiddle -> 109 | "middle" 110 | 111 | AlignmentCentral -> 112 | "central" 113 | 114 | AlignmentAfterEdge -> 115 | "after-edge" 116 | 117 | AlignmentTextAfterEdge -> 118 | "text-after-edge" 119 | 120 | AlignmentIdeographic -> 121 | "ideographic" 122 | 123 | AlignmentAlphabetic -> 124 | "alphabetic" 125 | 126 | AlignmentHanging -> 127 | "hanging" 128 | 129 | AlignmentMathematical -> 130 | "mathematical" 131 | 132 | AlignmentInherit -> 133 | "inherit" 134 | 135 | 136 | anchorAlignmentToString : AnchorAlignment -> String 137 | anchorAlignmentToString anchorAlignment = 138 | case anchorAlignment of 139 | AnchorInherit -> 140 | "inherit" 141 | 142 | AnchorStart -> 143 | "start" 144 | 145 | AnchorMiddle -> 146 | "middle" 147 | 148 | AnchorEnd -> 149 | "end" 150 | 151 | 152 | animateTransformTypeToString : AnimateTransformType -> String 153 | animateTransformTypeToString animateTransformType = 154 | case animateTransformType of 155 | AnimateTransformTypeTranslate -> 156 | "translate" 157 | 158 | AnimateTransformTypeScale -> 159 | "scale" 160 | 161 | AnimateTransformTypeRotate -> 162 | "rotate" 163 | 164 | AnimateTransformTypeSkewX -> 165 | "skewX" 166 | 167 | AnimateTransformTypeSkewY -> 168 | "skewY" 169 | 170 | 171 | attributeTypeToString : AttributeType -> String 172 | attributeTypeToString attributeType = 173 | case attributeType of 174 | AttributeTypeAuto -> 175 | "auto" 176 | 177 | AttributeTypeCss -> 178 | "CSS" 179 | 180 | AttributeTypeXml -> 181 | "XML" 182 | 183 | 184 | baselineShiftToString : BaselineShift -> String 185 | baselineShiftToString baselineShift = 186 | case baselineShift of 187 | ShiftAuto -> 188 | "auto" 189 | 190 | ShiftBaseline -> 191 | "baseline" 192 | 193 | ShiftSuper -> 194 | "super" 195 | 196 | ShiftSub -> 197 | "sub" 198 | 199 | ShiftPercentage value -> 200 | String.fromFloat value ++ "%" 201 | 202 | ShiftLength length -> 203 | lengthToString length 204 | 205 | ShiftInherit -> 206 | "inherit" 207 | 208 | 209 | bezierAnchorPointToString : { x1 : Float, y1 : Float, x2 : Float, y2 : Float } -> String 210 | bezierAnchorPointToString { x1, y1, x2, y2 } = 211 | List.map String.fromFloat [ x1, y1, x2, y2 ] |> String.join " " 212 | 213 | 214 | calcModeToString : CalcMode -> String 215 | calcModeToString calcMode = 216 | case calcMode of 217 | CalcModeDiscrete -> 218 | "discrete" 219 | 220 | CalcModeLinear -> 221 | "linear" 222 | 223 | CalcModePaced -> 224 | "paced" 225 | 226 | CalcModeSpline -> 227 | "spline" 228 | 229 | 230 | clipToString : Clip -> String 231 | clipToString clip = 232 | case clip of 233 | ClipAuto -> 234 | "auto" 235 | 236 | ClipInherit -> 237 | "inherit" 238 | 239 | ClipShape top right bottom left -> 240 | "rect(" 241 | ++ lengthToString top 242 | ++ " " 243 | ++ lengthToString right 244 | ++ " " 245 | ++ lengthToString bottom 246 | ++ " " 247 | ++ lengthToString left 248 | ++ ")" 249 | 250 | 251 | clipPathToString : ClipPath -> String 252 | clipPathToString clipPath = 253 | case clipPath of 254 | ClipPathNone -> 255 | "none" 256 | 257 | ClipPathInherit -> 258 | "inherit" 259 | 260 | ClipPathFunc value -> 261 | value 262 | 263 | 264 | clipRuleToString : ClipRule -> String 265 | clipRuleToString clipRule = 266 | case clipRule of 267 | ClipRuleNonZero -> 268 | "nonzero" 269 | 270 | ClipRuleEvenOdd -> 271 | "evenodd" 272 | 273 | ClipRuleInherit -> 274 | "inherit" 275 | 276 | 277 | colorInterpolationToString : ColorInterpolation -> String 278 | colorInterpolationToString colorInterpolation = 279 | case colorInterpolation of 280 | ColorInterpolationAuto -> 281 | "auto" 282 | 283 | ColorInterpolationSRGB -> 284 | "sRGB" 285 | 286 | ColorInterpolationLinearRGB -> 287 | "linearRGB" 288 | 289 | ColorInterpolationInherit -> 290 | "inherit" 291 | 292 | 293 | colorMatrixTypeToString : ColorMatrixType -> String 294 | colorMatrixTypeToString colorMatrixType = 295 | case colorMatrixType of 296 | ColorMatrixTypeMatrix -> 297 | "matrix" 298 | 299 | ColorMatrixTypeSaturate -> 300 | "saturate" 301 | 302 | ColorMatrixTypeHueRotate -> 303 | "hueRotate" 304 | 305 | ColorMatrixTypeLuminanceToAlpha -> 306 | "luminanceToAlpha" 307 | 308 | 309 | colorProfileToString : ColorProfile -> String 310 | colorProfileToString colorProfile = 311 | case colorProfile of 312 | ColorProfileAuto -> 313 | "auto" 314 | 315 | ColorProfileSRGB -> 316 | "sRGB" 317 | 318 | ColorProfile name -> 319 | name 320 | 321 | ColorProfileInherit -> 322 | "inherit" 323 | 324 | 325 | compositeOperatorToString : CompositeOperator -> String 326 | compositeOperatorToString compositeOperator = 327 | case compositeOperator of 328 | CompositeOperatorOver -> 329 | "over" 330 | 331 | CompositeOperatorIn -> 332 | "in" 333 | 334 | CompositeOperatorOut -> 335 | "out" 336 | 337 | CompositeOperatorAtop -> 338 | "atop" 339 | 340 | CompositeOperatorXor -> 341 | "xor" 342 | 343 | CompositeOperatorArithmetic -> 344 | "arithmetic" 345 | 346 | 347 | {-| CoordinateSystem is used by filter and clip 348 | -} 349 | coordinateSystemToString : CoordinateSystem -> String 350 | coordinateSystemToString coordinateSystem = 351 | case coordinateSystem of 352 | CoordinateSystemUserSpaceOnUse -> 353 | "userSpaceOnUse" 354 | 355 | CoordinateSystemObjectBoundingBox -> 356 | "objectBoundingBox" 357 | 358 | 359 | cursorToString : Cursor -> String 360 | cursorToString cursor = 361 | case cursor of 362 | CursorAuto -> 363 | "auto" 364 | 365 | CursorDefault -> 366 | "default" 367 | 368 | CursorCrosshair -> 369 | "crosshair" 370 | 371 | CursorPointer -> 372 | "pointer" 373 | 374 | CursorMove -> 375 | "move" 376 | 377 | CursorEResize -> 378 | "e-resize" 379 | 380 | CursorNEResize -> 381 | "ne-resize" 382 | 383 | CursorNWResize -> 384 | "nw-resize" 385 | 386 | CursorNResize -> 387 | "n-resize" 388 | 389 | CursorSEResize -> 390 | "se-resize" 391 | 392 | CursorSWResize -> 393 | "sw-resize" 394 | 395 | CursorWResize -> 396 | "w-resize" 397 | 398 | CursorText -> 399 | "text" 400 | 401 | CursorWait -> 402 | "wait" 403 | 404 | CursorHelp -> 405 | "help" 406 | 407 | CursorInherit -> 408 | "inherit" 409 | 410 | Cursor funcIRI -> 411 | funcIRI 412 | 413 | 414 | directionToString : Direction -> String 415 | directionToString direction = 416 | case direction of 417 | DirectionLTR -> 418 | "ltr" 419 | 420 | DirectionRTL -> 421 | "rtl" 422 | 423 | DirectionInherit -> 424 | "inherit" 425 | 426 | 427 | displayToString : Display -> String 428 | displayToString display = 429 | case display of 430 | DisplayInline -> 431 | "inline" 432 | 433 | DisplayBlock -> 434 | "block" 435 | 436 | DisplayListItem -> 437 | "list-item" 438 | 439 | DisplayRunIn -> 440 | "run-in" 441 | 442 | DisplayCompact -> 443 | "compact" 444 | 445 | DisplayMarker -> 446 | "marker" 447 | 448 | DisplayTable -> 449 | "table" 450 | 451 | DisplayInlineTable -> 452 | "inline-table" 453 | 454 | DisplayTableRowGroup -> 455 | "table-row-group" 456 | 457 | DisplayTableHeaderGroup -> 458 | "table-header-group" 459 | 460 | DisplayTableFooterGroup -> 461 | "table-footer-group" 462 | 463 | DisplayTableRow -> 464 | "table-row" 465 | 466 | DisplayTableColumnGroup -> 467 | "table-column-group" 468 | 469 | DisplayTableColumn -> 470 | "table-column" 471 | 472 | DisplayTableCell -> 473 | "table-cell" 474 | 475 | DisplayTableCaption -> 476 | "table-caption" 477 | 478 | DisplayNone -> 479 | "none" 480 | 481 | DisplayInherit -> 482 | "inherit" 483 | 484 | 485 | dominantBaselineToString : DominantBaseline -> String 486 | dominantBaselineToString dominantBaseline = 487 | case dominantBaseline of 488 | DominantBaselineAuto -> 489 | "auto" 490 | 491 | DominantBaselineUseScript -> 492 | "use-script" 493 | 494 | DominantBaselineNoChange -> 495 | "no-change" 496 | 497 | DominantBaselineResetSize -> 498 | "reset-size" 499 | 500 | DominantBaselineIdeographic -> 501 | "ideographic" 502 | 503 | DominantBaselineAlphabetic -> 504 | "alphabetic" 505 | 506 | DominantBaselineHanging -> 507 | "hanging" 508 | 509 | DominantBaselineMathematical -> 510 | "mathematical" 511 | 512 | DominantBaselineCentral -> 513 | "central" 514 | 515 | DominantBaselineMiddle -> 516 | "middle" 517 | 518 | DominantBaselineTextAfterEdge -> 519 | "text-after-edge" 520 | 521 | DominantBaselineTextBeforeEdge -> 522 | "text-before-edge" 523 | 524 | DominantBaselineInherit -> 525 | "inherit" 526 | 527 | 528 | durationToString : Duration -> String 529 | durationToString duration = 530 | case duration of 531 | Duration clockValue -> 532 | clockValue 533 | 534 | DurationIndefinite -> 535 | "indefinite" 536 | 537 | 538 | edgeModeToString : EdgeMode -> String 539 | edgeModeToString edgeMode = 540 | case edgeMode of 541 | EdgeModeDuplicate -> 542 | "duplicate" 543 | 544 | EdgeModeWrap -> 545 | "wrap" 546 | 547 | EdgeModeNone -> 548 | "none" 549 | 550 | 551 | fillRuleToString : FillRule -> String 552 | fillRuleToString fillRule = 553 | case fillRule of 554 | FillRuleNonZero -> 555 | "nonzero" 556 | 557 | FillRuleEvenOdd -> 558 | "evenodd" 559 | 560 | 561 | filterToString : Filter -> String 562 | filterToString f = 563 | case f of 564 | FilterNone -> 565 | "none" 566 | 567 | FilterInherit -> 568 | "inherit" 569 | 570 | Filter funcIRI -> 571 | funcIRI 572 | 573 | 574 | floodColorToString : FloodColor -> String 575 | floodColorToString floodColor = 576 | case floodColor of 577 | FloodInherit -> 578 | "inherit" 579 | 580 | FloodCurrentColor -> 581 | "currentColor" 582 | 583 | Flood color -> 584 | toCssString color 585 | 586 | FloodICC iccColor -> 587 | iccColor 588 | 589 | 590 | fontSizeAdjustToString : FontSizeAdjust -> String 591 | fontSizeAdjustToString fontSizeAdjust = 592 | case fontSizeAdjust of 593 | FontSizeAdjustNone -> 594 | "none" 595 | 596 | FontSizeAdjustInherit -> 597 | "inherit" 598 | 599 | FontSizeAdjust aspect -> 600 | String.fromFloat aspect 601 | 602 | 603 | fontStretchToString : FontStretch -> String 604 | fontStretchToString fontStretch = 605 | case fontStretch of 606 | FontStretchNormal -> 607 | "normal" 608 | 609 | FontStretchWider -> 610 | "wider" 611 | 612 | FontStretchNarrower -> 613 | "narrower" 614 | 615 | FontStretchUltraCondensed -> 616 | "ultra-condensed" 617 | 618 | FontStretchExtraCondensed -> 619 | "extra-condensed" 620 | 621 | FontStretchCondensed -> 622 | "condensed" 623 | 624 | FontStretchSemiCondensed -> 625 | "semi-condensed" 626 | 627 | FontStretchSemiExpanded -> 628 | "semi-expanded" 629 | 630 | FontStretchExpanded -> 631 | "expanded" 632 | 633 | FontStretchExtraExpanded -> 634 | "extra-expanded" 635 | 636 | FontStretchUltraExpanded -> 637 | "ultra-expanded" 638 | 639 | FontStretchInherit -> 640 | "inherit" 641 | 642 | 643 | fontStyleToString : FontStyle -> String 644 | fontStyleToString fontStyle = 645 | case fontStyle of 646 | FontStyleNormal -> 647 | "normal" 648 | 649 | FontStyleItalic -> 650 | "italic" 651 | 652 | FontStyleOblique -> 653 | "oblique" 654 | 655 | FontStyleInherit -> 656 | "inherit" 657 | 658 | 659 | fontVariantToString : FontVariant -> String 660 | fontVariantToString fontVariant = 661 | case fontVariant of 662 | FontVariantNormal -> 663 | "normal" 664 | 665 | FontVariantSmallCaps -> 666 | "small-caps" 667 | 668 | FontVariantInherit -> 669 | "inherit" 670 | 671 | 672 | fontWeightToString : FontWeight -> String 673 | fontWeightToString fontWeight = 674 | let 675 | {- The weight will be rounded to the nearest allowed value. Allowed values are 676 | multiples of 100 between 100 to 900. 677 | -} 678 | fontWeightClamped : Int -> Int 679 | fontWeightClamped weight = 680 | (((weight + 50) // 100) * 100) 681 | |> clamp 100 900 682 | in 683 | case fontWeight of 684 | FontWeightNormal -> 685 | "normal" 686 | 687 | FontWeightBold -> 688 | "bold" 689 | 690 | FontWeightBolder -> 691 | "bolder" 692 | 693 | FontWeightLighter -> 694 | "lighter" 695 | 696 | FontWeightInherit -> 697 | "inherit" 698 | 699 | FontWeight weight -> 700 | fontWeightClamped weight |> String.fromInt 701 | 702 | 703 | funcTypeToString : FuncType -> String 704 | funcTypeToString funcType = 705 | case funcType of 706 | FuncTypeIdentity -> 707 | "identity" 708 | 709 | FuncTypeTable -> 710 | "table" 711 | 712 | FuncTypeDiscrete -> 713 | "discrete" 714 | 715 | FuncTypeLinear -> 716 | "linear" 717 | 718 | FuncTypeGamma -> 719 | "gamma" 720 | 721 | 722 | inValueToString : InValue -> String 723 | inValueToString inValue = 724 | case inValue of 725 | InSourceGraphic -> 726 | "SourceGraphic" 727 | 728 | InSourceAlpha -> 729 | "SourceAlpha" 730 | 731 | InBackgroundAlpha -> 732 | "BackgroundAlpha" 733 | 734 | InFillPaint -> 735 | "FillPaint" 736 | 737 | InStrokePaint -> 738 | "StrokePaint" 739 | 740 | InReference str -> 741 | str 742 | 743 | 744 | kerningToString : Kerning -> String 745 | kerningToString kerning = 746 | case kerning of 747 | KerningAuto -> 748 | "auto" 749 | 750 | KerningInherit -> 751 | "inherit" 752 | 753 | KerningLength length -> 754 | lengthToString length 755 | 756 | 757 | lengthToString : Length -> String 758 | lengthToString length = 759 | case length of 760 | Cm x -> 761 | String.fromFloat x ++ "cm" 762 | 763 | Em x -> 764 | String.fromFloat x ++ "em" 765 | 766 | Ex x -> 767 | String.fromFloat x ++ "ex" 768 | 769 | In x -> 770 | String.fromFloat x ++ "in" 771 | 772 | Mm x -> 773 | String.fromFloat x ++ "mm" 774 | 775 | Num x -> 776 | String.fromFloat x 777 | 778 | Pc x -> 779 | String.fromFloat x ++ "pc" 780 | 781 | Percent x -> 782 | String.fromFloat x ++ "%" 783 | 784 | Pt x -> 785 | String.fromFloat x ++ "pt" 786 | 787 | Px x -> 788 | String.fromFloat x ++ "px" 789 | 790 | Rem x -> 791 | String.fromFloat x ++ "rem" 792 | 793 | 794 | lengthAdjustToString : LengthAdjust -> String 795 | lengthAdjustToString lengthAdjust = 796 | case lengthAdjust of 797 | LengthAdjustSpacing -> 798 | "spacing" 799 | 800 | LengthAdjustSpacingAndGlyphs -> 801 | "spacingAndGlyphs" 802 | 803 | 804 | markerCoordinateSystemToString : MarkerCoordinateSystem -> String 805 | markerCoordinateSystemToString markerCoordinateSystem = 806 | case markerCoordinateSystem of 807 | MarkerCoordinateSystemUserSpaceOnUse -> 808 | "userSpaceOnUse" 809 | 810 | MarkerCoordinateSystemStrokeWidth -> 811 | "strokeWidth" 812 | 813 | 814 | meetOrSliceToString : MeetOrSlice -> String 815 | meetOrSliceToString meetOrSlice = 816 | case meetOrSlice of 817 | Meet -> 818 | "meet" 819 | 820 | Slice -> 821 | "slice" 822 | 823 | 824 | modeToString : Mode -> String 825 | modeToString mode = 826 | case mode of 827 | ModeNormal -> 828 | "normal" 829 | 830 | ModeMultiply -> 831 | "multiply" 832 | 833 | ModeScreen -> 834 | "screen" 835 | 836 | ModeDarken -> 837 | "darken" 838 | 839 | ModeLighten -> 840 | "lighten" 841 | 842 | 843 | morphologyOperatorToString : MorphologyOperator -> String 844 | morphologyOperatorToString morphologyOperator = 845 | case morphologyOperator of 846 | MorphologyOperatorErode -> 847 | "erode" 848 | 849 | MorphologyOperatorDilate -> 850 | "dilate" 851 | 852 | 853 | opacityToString : Opacity -> String 854 | opacityToString opacity = 855 | case opacity of 856 | Opacity n -> 857 | String.fromFloat n 858 | 859 | OpacityInherit -> 860 | "inherit" 861 | 862 | 863 | paintToString : Paint -> String 864 | paintToString paint = 865 | case paint of 866 | Paint color -> 867 | toCssString color 868 | 869 | CSSVariable string -> 870 | String.concat [ "var(" ++ string ++ ")" ] 871 | 872 | Reference string -> 873 | String.concat [ "url(#", string, ")" ] 874 | 875 | ContextFill -> 876 | "context-fill" 877 | 878 | ContextStroke -> 879 | "context-stroke" 880 | 881 | PaintNone -> 882 | "none" 883 | 884 | 885 | renderingToString : Rendering -> String 886 | renderingToString rendering = 887 | case rendering of 888 | RenderingAuto -> 889 | "auto" 890 | 891 | RenderingOptimizeSpeed -> 892 | "optimizeSpeed" 893 | 894 | RenderingOptimizeQuality -> 895 | "optimizeQuality" 896 | 897 | RenderingInherit -> 898 | "inherit" 899 | 900 | 901 | repeatCountToString : RepeatCount -> String 902 | repeatCountToString repeatCount = 903 | case repeatCount of 904 | RepeatCount count -> 905 | String.fromFloat count 906 | 907 | RepeatIndefinite -> 908 | "indefinite" 909 | 910 | 911 | restartToString : Restart -> String 912 | restartToString restart = 913 | case restart of 914 | RestartAlways -> 915 | "always" 916 | 917 | RestartWhenNotActive -> 918 | "whenNotActive" 919 | 920 | RestartNever -> 921 | "never" 922 | 923 | 924 | scaleToString : Scale -> String 925 | scaleToString scale = 926 | case scale of 927 | ScaleMin -> 928 | "Min" 929 | 930 | ScaleMid -> 931 | "Mid" 932 | 933 | ScaleMax -> 934 | "Max" 935 | 936 | 937 | shapeRenderingToString : ShapeRendering -> String 938 | shapeRenderingToString shapeRendering = 939 | case shapeRendering of 940 | RenderAuto -> 941 | "auto" 942 | 943 | RenderOptimizeSpeed -> 944 | "optimizeSpeed" 945 | 946 | RenderCrispEdges -> 947 | "crispEdges" 948 | 949 | RenderGeometricPrecision -> 950 | "geometricPrecision" 951 | 952 | RenderInherit -> 953 | "inherit" 954 | 955 | 956 | strokeLinecapToString : StrokeLinecap -> String 957 | strokeLinecapToString linecap = 958 | case linecap of 959 | StrokeLinecapButt -> 960 | "butt" 961 | 962 | StrokeLinecapRound -> 963 | "round" 964 | 965 | StrokeLinecapSquare -> 966 | "square" 967 | 968 | StrokeLinecapInherit -> 969 | "inherit" 970 | 971 | 972 | strokeLinejoinToString : StrokeLinejoin -> String 973 | strokeLinejoinToString linejoin = 974 | case linejoin of 975 | StrokeLinejoinMiter -> 976 | "miter" 977 | 978 | StrokeLinejoinRound -> 979 | "round" 980 | 981 | StrokeLinejoinBevel -> 982 | "bevel" 983 | 984 | StrokeLinejoinInherit -> 985 | "inherit" 986 | 987 | 988 | textRenderingToString : TextRendering -> String 989 | textRenderingToString rendering = 990 | case rendering of 991 | TextRenderingAuto -> 992 | "auto" 993 | 994 | TextRenderingOptimizeSpeed -> 995 | "optimizeSpeed" 996 | 997 | TextRenderingOptimizeLegibility -> 998 | "optimizeLegibility" 999 | 1000 | TextRenderingGeometricPrecision -> 1001 | "geometricPrecision" 1002 | 1003 | TextRenderingInherit -> 1004 | "inherit" 1005 | 1006 | 1007 | transformToString : Transform -> String 1008 | transformToString xform = 1009 | let 1010 | tr name args = 1011 | String.concat 1012 | [ name 1013 | , "(" 1014 | , String.join " " (List.map String.fromFloat args) 1015 | , ")" 1016 | ] 1017 | in 1018 | case xform of 1019 | Matrix a b c d e f -> 1020 | tr "matrix" [ a, b, c, d, e, f ] 1021 | 1022 | Rotate a x y -> 1023 | tr "rotate" [ a, x, y ] 1024 | 1025 | Scale x y -> 1026 | tr "scale" [ x, y ] 1027 | 1028 | SkewX x -> 1029 | tr "skewX" [ x ] 1030 | 1031 | SkewY y -> 1032 | tr "skewY" [ y ] 1033 | 1034 | Translate x y -> 1035 | tr "translate" [ x, y ] 1036 | 1037 | 1038 | timingValueAsString : TimingValue -> String 1039 | timingValueAsString timingValue = 1040 | case timingValue of 1041 | TimingOffsetValue clock -> 1042 | clock 1043 | 1044 | TimingSyncBaseValue str -> 1045 | str 1046 | 1047 | TimingEventValue str -> 1048 | str 1049 | 1050 | TimingRepeatValue str -> 1051 | str 1052 | 1053 | TimingAccessKeyValue str -> 1054 | str 1055 | 1056 | TimingWallclockSyncValue str -> 1057 | str 1058 | 1059 | TimingIndefinite -> 1060 | "indefinite" 1061 | 1062 | 1063 | turbulenceTypeToString : TurbulenceType -> String 1064 | turbulenceTypeToString turbulenceType = 1065 | case turbulenceType of 1066 | TurbulenceTypeFractalNoise -> 1067 | "fractalNoise" 1068 | 1069 | TurbulenceTypeTurbulence -> 1070 | "turbulence" 1071 | 1072 | 1073 | yesNoToString : YesNo -> String 1074 | yesNoToString question = 1075 | case question of 1076 | Yes -> 1077 | "yes" 1078 | 1079 | No -> 1080 | "no" 1081 | -------------------------------------------------------------------------------- /src/TypedSvg/Attributes.elm: -------------------------------------------------------------------------------- 1 | module TypedSvg.Attributes exposing 2 | ( accelerate, accentHeight, accumulate, additive, alignmentBaseline, allowReorder, alphabetic, amplitude, animateTransformType, animationValues, arabicForm, ascent, attributeName, attributeType, autoReverse, baseProfile, baselineShift, bbox, begin, by, calcMode, capHeight, class, clip, clipPath, clipPathUnits, clipRule, color, colorInterpolation, colorProfile, colorRendering, contentScriptType, contentStyleType, contentType, cursor, cx, cy, d, decelerate, descent, direction, display, dominantBaseline, dur, dx, dy, enableBackground, end, exponent, externalResourcesRequired, fill, fillOpacity, fillRule, filter, fontFamily, fontSize, fontSizeAdjust 3 | , fontStretch, fontStyle, fontVariant, fontWeight, format, from, from2, from3, fx, fy, g1, g2, glyphName, glyphOrientationHorizontal, glyphOrientationVertical, glyphRef, gradientTransform, gradientUnits, hanging, height, horizAdvX, horizOriginX, horizOriginY, href, id, ideographic, imageRendering, intercept, k, kerning, keySplines, keyTimes, lang, lengthAdjust, letterSpacing, lightingColor, local, markerEnd, markerHeight, markerMid, markerStart, markerUnits, markerWidth, mask, maskContentUnits, maskUnits, max, media 4 | , method, min, name, noFill, offset, opacity, orient, orientation, origin, overflow, overlinePosition, overlineThickness, panose1, path, pathLength, patternContentUnits, patternTransform, patternUnits, pointOrder, pointerEvents, points, preserveAspectRatio, primitiveUnits, r, refX, refY, renderingIntent, repeatCount, repeatDur, requiredExtensions, requiredFeatures, restart, rotate, rx, ry, shapeRendering, slope, spacing, specularConstant, specularExponent, speed, spreadMethod, startOffset 5 | , stdDeviation, stemh, stemv, stitchTiles, stopColor, stopOpacity, strikethroughPosition, strikethroughThickness, string, stroke, strokeDasharray, strokeDashoffset, strokeLinecap, strokeLinejoin, strokeMiterlimit, strokeOpacity, strokeWidth, style, systemLanguage, tableValues, target, textAnchor, textDecoration, textLength, textRendering, title, to, to2, to3, transform, u1, u2, underlinePosition, underlineThickness, unicode, unicodeBidi, unicodeRange, unitsPerEm, vAlphabetic, vHanging, vIdeographic 6 | , vMathematical, version, vertAdvY, vertOriginX, vertOriginY, viewBox, viewTarget, visibility, width, widths, wordSpacing, writingMode, x, x1, x2, xChannelSelector, xHeight, xlinkActuate, xlinkArcrole, xlinkHref, xlinkRole, xlinkShow, xlinkTitle, xlinkType, xmlBase, xmlLang, xmlSpace, y, y1, y2, yChannelSelector, zoomAndPan 7 | ) 8 | 9 | {-| Typed SVG Attributes 10 | 11 | NOTE: For attributes pertaining to SVG filters, see Filters.Attributes 12 | 13 | 14 | # Other attributes 15 | 16 | @docs accelerate, accentHeight, accumulate, additive, alignmentBaseline, allowReorder, alphabetic, amplitude, animateTransformType, animationValues, arabicForm, ascent, attributeName, attributeType, autoReverse, baseProfile, baselineShift, bbox, begin, by, calcMode, capHeight, class, clip, clipPath, clipPathUnits, clipRule, color, colorInterpolation, colorProfile, colorRendering, contentScriptType, contentStyleType, contentType, cursor, cx, cy, d, decelerate, descent, direction, display, dominantBaseline, dur, dx, dy, enableBackground, end, exponent, externalResourcesRequired, fill, fillOpacity, fillRule, filter, fontFamily, fontSize, fontSizeAdjust 17 | @docs fontStretch, fontStyle, fontVariant, fontWeight, format, from, from2, from3, fx, fy, g1, g2, glyphName, glyphOrientationHorizontal, glyphOrientationVertical, glyphRef, gradientTransform, gradientUnits, hanging, height, horizAdvX, horizOriginX, horizOriginY, href, id, ideographic, imageRendering, intercept, k, kerning, keySplines, keyTimes, lang, lengthAdjust, letterSpacing, lightingColor, local, markerEnd, markerHeight, markerMid, markerStart, markerUnits, markerWidth, mask, maskContentUnits, maskUnits, max, media 18 | @docs method, min, name, noFill, offset, opacity, orient, orientation, origin, overflow, overlinePosition, overlineThickness, panose1, path, pathLength, patternContentUnits, patternTransform, patternUnits, pointOrder, pointerEvents, points, preserveAspectRatio, primitiveUnits, r, refX, refY, renderingIntent, repeatCount, repeatDur, requiredExtensions, requiredFeatures, restart, rotate, rx, ry, shapeRendering, slope, spacing, specularConstant, specularExponent, speed, spreadMethod, startOffset 19 | @docs stdDeviation, stemh, stemv, stitchTiles, stopColor, stopOpacity, strikethroughPosition, strikethroughThickness, string, stroke, strokeDasharray, strokeDashoffset, strokeLinecap, strokeLinejoin, strokeMiterlimit, strokeOpacity, strokeWidth, style, systemLanguage, tableValues, target, textAnchor, textDecoration, textLength, textRendering, title, to, to2, to3, transform, u1, u2, underlinePosition, underlineThickness, unicode, unicodeBidi, unicodeRange, unitsPerEm, vAlphabetic, vHanging, vIdeographic 20 | @docs vMathematical, version, vertAdvY, vertOriginX, vertOriginY, viewBox, viewTarget, visibility, width, widths, wordSpacing, writingMode, x, x1, x2, xChannelSelector, xHeight, xlinkActuate, xlinkArcrole, xlinkHref, xlinkRole, xlinkShow, xlinkTitle, xlinkType, xmlBase, xmlLang, xmlSpace, y, y1, y2, yChannelSelector, zoomAndPan 21 | 22 | -} 23 | 24 | import Color exposing (Color, toCssString) 25 | import TypedSvg.Core exposing (..) 26 | import TypedSvg.Types exposing (..) 27 | import TypedSvg.TypesToStrings exposing (..) 28 | 29 | 30 | {-| Defines the distance from the origin to the top of accent characters, 31 | measured by a distance within the font coordinate system. 32 | 33 | Used by Elements: fontFace 34 | 35 | See: 36 | 37 | -} 38 | accentHeight : Float -> Attribute msg 39 | accentHeight h = 40 | attribute "accent-height" <| String.fromFloat h 41 | 42 | 43 | {-| Defines a simple acceleration of time for the element. Element time will 44 | accelerate from a rate of 0 at the beginning up to a run rate, over the course 45 | of the specified proportion of the simple duration. 46 | 47 | The default value is 0 (no acceleration). 48 | 49 | Legal values for `rate` are floating point values between 0 and 1 (inclusive). 50 | 51 | Used by Elements: animate, animateMotion 52 | 53 | See 54 | 55 | -} 56 | accelerate : Float -> Attribute msg 57 | accelerate rate = 58 | attribute "accelerate" <| String.fromFloat rate 59 | 60 | 61 | {-| This attribute controls whether or not the animation is cumulative. 62 | 63 | It is useful for repeated animations to build upon the previous results, 64 | accumulating with each iteration. 65 | 66 | Used by Elements: animate, animateColor, animateMotion, animateTransform 67 | 68 | See 69 | 70 | -} 71 | accumulate : Accumulate -> Attribute msg 72 | accumulate option = 73 | attribute "accumulate" <| accumulateToString option 74 | 75 | 76 | {-| This attribute controls whether or not the animation is additive. 77 | 78 | It is frequently useful to define animation as an offset or delta to an 79 | attribute's value, rather than as absolute values. 80 | 81 | Used by Elements: animate, animateColor, animateMotion, animateTransform 82 | 83 | See 84 | 85 | -} 86 | additive : Additive -> Attribute msg 87 | additive option = 88 | attribute "additive" <| additiveToString option 89 | 90 | 91 | {-| -} 92 | alphabetic : String -> Attribute msg 93 | alphabetic = 94 | attribute "alphabetic" 95 | 96 | 97 | {-| The `alignmentBaseline` attribute specifies how an object is aligned with 98 | respect to its parent. This property specifies which baseline of this element is 99 | to be aligned with the corresponding baseline of the parent. For example, this 100 | allows alphabetic baselines in Roman text to stay aligned across font size 101 | changes. 102 | 103 | It defaults to the baseline with the same name as the computed value of the 104 | `alignmentBaseline` property. 105 | 106 | As a presentation attribute, it also can be used as a property directly inside a 107 | CSS stylesheet. 108 | 109 | Used by Elements: altGlyph, tspan, tref, textPath 110 | 111 | See: 112 | 113 | -} 114 | alignmentBaseline : AlignmentBaseline -> Attribute msg 115 | alignmentBaseline baseline = 116 | attribute "alignment-baseline" <| alignmentBaselineToString baseline 117 | 118 | 119 | {-| The allowReorder attribute signals whether a user agent may reorder the direct 120 | descendents of the switch element, based on user preferences, if it thinks this 121 | could lead to a better user experience. 122 | 123 | The possible values are `no`, the default, disallowing reordering and `yes`, 124 | allowing reordering. 125 | 126 | See: 127 | 128 | -} 129 | allowReorder : YesNo -> Attribute msg 130 | allowReorder allow = 131 | attribute "allowReorder" <| yesNoToString allow 132 | 133 | 134 | {-| -} 135 | amplitude : String -> Attribute msg 136 | amplitude = 137 | attribute "amplitude" 138 | 139 | 140 | {-| Defines the type of transformation, whose values change over time. 141 | 142 | Used by Elements: animateTransform 143 | 144 | NOTE: this is called `type_` in `elm-lang/svg` but is different here in order to 145 | distinguish it from `contentType` 146 | 147 | See: 148 | 149 | -} 150 | animateTransformType : AnimateTransformType -> Attribute msg 151 | animateTransformType transformType = 152 | attribute "type" <| animateTransformTypeToString transformType 153 | 154 | 155 | {-| Values will be applied in order over the course of the animation. If a list 156 | of values is specified, any `from`, `to` and `by` attribute values are 157 | ignored. 158 | 159 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 160 | discard, mpath, set 161 | 162 | See: 163 | 164 | -} 165 | animationValues : List Float -> Attribute msg 166 | animationValues values = 167 | attribute "values" <| String.join ";" (List.map String.fromFloat values) 168 | 169 | 170 | {-| -} 171 | arabicForm : String -> Attribute msg 172 | arabicForm = 173 | attribute "arabic-form" 174 | 175 | 176 | {-| This attribute defines the maximum unaccented depth of the font within the 177 | font coordinate system. 178 | 179 | If the attribute is not specified, the effect is as if the attribute were set to 180 | the `vertOriginY` value for the corresponding font. 181 | 182 | Used by Elements: fontFace 183 | 184 | See 185 | 186 | -} 187 | ascent : Float -> Attribute msg 188 | ascent maxDepth = 189 | attribute "ascent" <| String.fromFloat maxDepth 190 | 191 | 192 | {-| This attribute indicates the name of the attribute in the parent element 193 | that is going to be changed during an animation. 194 | 195 | Used by Elements: animate, animateColor, animateTransform, set 196 | 197 | See: 198 | 199 | -} 200 | attributeName : String -> Attribute msg 201 | attributeName nm = 202 | attribute "attributeName" nm 203 | 204 | 205 | {-| This attribute specifies the namespace in which the target attribute and its 206 | associated values are defined. 207 | 208 | Used by Elements: animate, animateColor, animateTransform, set 209 | 210 | See: 211 | 212 | -} 213 | attributeType : AttributeType -> Attribute msg 214 | attributeType attType = 215 | attribute "attributeType" <| attributeTypeToString attType 216 | 217 | 218 | {-| -} 219 | autoReverse : String -> Attribute msg 220 | autoReverse = 221 | attribute "autoReverse" 222 | 223 | 224 | 225 | -- azimuth is in Filters.Attributes 226 | -- baseFrequency is in Filters.Attributes 227 | 228 | 229 | {-| The baselineShift attribute allows repositioning of the dominant-baseline 230 | relative to the dominant-baseline of the parent text content element. The 231 | shifted object might be a sub- or superscript. 232 | 233 | As a presentation attribute, it also can be used as a property directly inside a 234 | CSS stylesheet, see css baseline-shift for further information. 235 | 236 | Used by Elements: altGlyph, tref, tspan, textPath 237 | 238 | See: 239 | 240 | -} 241 | baselineShift : BaselineShift -> Attribute msg 242 | baselineShift shift = 243 | attribute "baseline-shift" <| baselineShiftToString shift 244 | 245 | 246 | {-| -} 247 | baseProfile : String -> Attribute msg 248 | baseProfile = 249 | attribute "baseProfile" 250 | 251 | 252 | {-| -} 253 | bbox : String -> Attribute msg 254 | bbox = 255 | attribute "bbox" 256 | 257 | 258 | {-| This attribute defines when an animation should begin. 259 | 260 | Each individual value can be one of the BeginValue types. 261 | 262 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 263 | discard, mpath, set 264 | 265 | See: 266 | See: 267 | 268 | -} 269 | begin : List TimingValue -> Attribute msg 270 | begin timingValues = 271 | attribute "begin" <| String.join ";" (List.map timingValueAsString timingValues) 272 | 273 | 274 | 275 | -- bias is in Filters.Attributes 276 | 277 | 278 | {-| -} 279 | by : String -> Attribute msg 280 | by = 281 | attribute "by" 282 | 283 | 284 | {-| This attribute specifies the interpolation mode for an animation. The 285 | default mode is linear, however if the attribute does not support linear 286 | interpolation (e.g. for strings), the calcMode attribute is ignored and 287 | discrete interpolation is used. 288 | 289 | Used by Elements: animate, animateColor, animateMotion, animateTransform 290 | 291 | See: 292 | 293 | -} 294 | calcMode : CalcMode -> Attribute msg 295 | calcMode mode = 296 | attribute "calcMode" <| calcModeToString mode 297 | 298 | 299 | {-| -} 300 | capHeight : String -> Attribute msg 301 | capHeight = 302 | attribute "cap-height" 303 | 304 | 305 | {-| Assigns a class name or set of class names to an element. You can use this 306 | to style SVG content using CSS. 307 | 308 | An element's class name serves two key roles: 309 | 310 | - As a style sheet selector, for when an author assigns style information 311 | to a set of elements. 312 | - For general use by the browser. 313 | 314 | Used by Elements: a, altGlyph, circle, clipPath, defs, desc, ellipse, 315 | feBlend, feColorMatrix, feComponentTransfer, feComposite, 316 | feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feFlood, 317 | feGaussianBlur, feImage, feMerge, feMorphology, feOffset, 318 | feSpecularLighting, feTile, feTurbulence, filter, font, foreignObject, 319 | g, glyph, glyphRef, image, line, linearGradient, marker, mask, 320 | missingGlyph, path, pattern, polygon, polyline, radialGradient, rect, 321 | stop, svg, switch, symbol, text, textPath, title, tref, tspan, use 322 | 323 | See: 324 | 325 | -} 326 | class : List String -> Attribute msg 327 | class names = 328 | attribute "class" (String.join " " names) 329 | 330 | 331 | {-| The clip attribute has the same parameter values as defined for the css clip 332 | property. Unitless values, which indicate current user coordinates, are 333 | permitted on the coordinate values on the . The value of auto defines 334 | a clipping path along the bounds of the viewport created by the given 335 | element. 336 | 337 | As a presentation attribute, it also can be used as a property directly 338 | inside a CSS stylesheet. 339 | 340 | Used by Elements: svg, symbol, image, foreignobject, pattern, marker 341 | 342 | See: 343 | 344 | -} 345 | clip : Clip -> Attribute msg 346 | clip clp = 347 | attribute "clip" <| clipToString clp 348 | 349 | 350 | {-| The `clipPath` attribute binds the element it is applied to with a given 351 | `clipPath` element. 352 | 353 | As a presentation attribute, it also can be used as a property directly inside a 354 | CSS stylesheet. 355 | 356 | Used by Elements: a, circle, defs, ellipse, g, image, line, marker, mask, 357 | mesh, missing-glyph, path, pattern, polygon, polyline, rect, svg, 358 | switch, symbol, text, use 359 | 360 | See: 361 | 362 | -} 363 | clipPath : ClipPath -> Attribute msg 364 | clipPath cPath = 365 | attribute "clip-path" <| clipPathToString cPath 366 | 367 | 368 | {-| The `clipPathUnits` attribute defines the coordinate system for the contents 369 | of the `clipPath` element. 370 | 371 | If the `clipPathUnits` attribute is not specified, then the effect is as if a 372 | value of `userSpaceOnUse` were specified. 373 | 374 | Note that values defined as a percentage inside the content of the `clipPath` 375 | are not affected by this attribute. It means that even if you set the value 376 | of `maskContentUnits` to `CoordinateSystemObjectBoundingBox`, percentage values 377 | will be calculated as if the value of the attribute were userSpaceOnUse. 378 | 379 | Used by Elements: clipPath 380 | 381 | See: 382 | 383 | -} 384 | clipPathUnits : CoordinateSystem -> Attribute msg 385 | clipPathUnits coordinateSystem = 386 | attribute "clipPathUnits" <| coordinateSystemToString coordinateSystem 387 | 388 | 389 | {-| The `clipRule` attribute only applies to graphics elements that are 390 | contained within a `clipPath` element. The `clipRule` attribute basically 391 | works as the `fillRule` attribute, except that it applies to `clipPath` 392 | definitions. 393 | 394 | Used by Elements: circle, ellipse, image, line, mesh, path, polygon, polyline, 395 | rect, text, use 396 | 397 | See: 398 | 399 | -} 400 | clipRule : ClipRule -> Attribute msg 401 | clipRule rule = 402 | attribute "clip-rule" <| clipRuleToString rule 403 | 404 | 405 | {-| The `colorInterpolation` attribute specifies the color space for gradient 406 | interpolations, color animations, and alpha compositing. 407 | 408 | When a child element is blended into a background, the value of the 409 | `colorInterpolation` attribute on the child determines the type of blending, 410 | not the value of the `colorInterpolation` on the parent. 411 | 412 | For gradients which make use of the `xlinkHref` attribute to reference another 413 | gradient, the gradient uses the `colorInterpolation` attribute value from the 414 | gradient element which is directly referenced by the fill or stroke attribute. 415 | 416 | When animating colors, color interpolation is performed according to the value 417 | of the `colorInterpolation` attribute on the element being animated. 418 | 419 | As a presentation attribute, it also can be used as a property directly inside a 420 | CSS stylesheet. 421 | 422 | Used by Elements: a, animage, animateColor, circle, defs, ellipse, g, image, 423 | line, marker, mask, mesh, missing-glyph, path, pattern, polygon, 424 | polyline, rect, svg, switch, symbol, text, use 425 | 426 | See: 427 | 428 | -} 429 | colorInterpolation : ColorInterpolation -> Attribute msg 430 | colorInterpolation interpolation = 431 | attribute "color-interpolation" <| colorInterpolationToString interpolation 432 | 433 | 434 | 435 | -- colorInterpolationFilters: see Filters.colorInterpolationFilters 436 | 437 | 438 | {-| The `colorProfile` attribute is used to define which color profile a raster 439 | image included through the `image` element should use. 440 | 441 | As a presentation attribute, it also can be used as a property directly inside a 442 | CSS stylesheet. 443 | 444 | Used by Elements: image 445 | 446 | See: 447 | 448 | -} 449 | colorProfile : ColorProfile -> Attribute msg 450 | colorProfile profile = 451 | attribute "color-profile" <| colorProfileToString profile 452 | 453 | 454 | {-| The colorRendering attribute provides a hint to the SVG user agent about 455 | how to optimize its color interpolation and compositing operations. 456 | 457 | `colorRendering` takes precedence over `colorInterpolationFilters`. For 458 | example, assume `colorRendering` is set to `optimizeSpeed`, and 459 | `ColorInterpolationFilters` is set to `linearRGB`. In this case, the SVG 460 | user agent should perform color operations in a way that optimizes 461 | performance, which might mean sacrificing the color interpolation precision 462 | as specified by `colorInterpolationFilters`. 463 | 464 | As a presentation attribute, it also can be used as a property directly inside a 465 | CSS stylesheet. 466 | 467 | Used by Elements: a, animate, animateColor, circle, defs, ellipse, g, image, 468 | line, marker, mask, mesh, missing-glyph, path, pattern, polygon, 469 | polyline, rect, svg, switch, symbol, text, use 470 | 471 | See: 472 | 473 | -} 474 | colorRendering : Rendering -> Attribute msg 475 | colorRendering rendering = 476 | attribute "color-rendering" <| renderingToString rendering 477 | 478 | 479 | {-| The `color` attribute is used to provide a potential indirect value 480 | (currentColor) for the `fill`, `stroke`, `stopColor`, `floodColor` and 481 | `lightingColor` attributes. 482 | 483 | As a presentation attribute, it can also be used as a property directly inside a 484 | CSS stylesheet. 485 | 486 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, circle, ellipse, 487 | feDiffuseLighting, feFlood, feSpecularLighting, glyph, glyphRef, line, 488 | mesh, path, polygon, polyline, rect, stop, text, textPath, tref, tspan 489 | 490 | See: 491 | 492 | -} 493 | color : Color -> Attribute msg 494 | color c = 495 | attribute "color" <| toCssString c 496 | 497 | 498 | {-| The contentScriptType attribute on the element specifies the default 499 | scripting language for the given document fragment. 500 | 501 | This attribute sets the default scripting language used to process the value 502 | strings in event attributes. This language must be used for all instances of 503 | scripts that do not specify their own scripting language. The value 504 | contentType specifies a media type, per MIME Part Two: Media Types 505 | [RFC2046]. The default value is application/ecmascript. 506 | 507 | See: 508 | 509 | -} 510 | contentScriptType : String -> Attribute msg 511 | contentScriptType mimeType = 512 | attribute "contentScriptType" mimeType 513 | 514 | 515 | {-| This attribute specifies the style sheet language for the given document 516 | fragment. The contentStyleType is specified on the `svg` element. By default, 517 | if it's not defined, the value is "text/css" 518 | 519 | See: 520 | 521 | -} 522 | contentStyleType : String -> Attribute msg 523 | contentStyleType styleSheetLanguage = 524 | attribute "contentStyleType" styleSheetLanguage 525 | 526 | 527 | {-| Defines the content type of the element. 528 | 529 | Used by Elements: script, style 530 | 531 | NOTE: this is called `type_` in `elm-lang/svg` but is different here in order to 532 | distinguish it from `animateTransformType` 533 | 534 | See: 535 | 536 | -} 537 | contentType : String -> Attribute msg 538 | contentType t = 539 | attribute "type" t 540 | 541 | 542 | {-| The `cursor` attribute specifies the mouse cursor displayed when the mouse 543 | pointer is over an element. 544 | 545 | This attribute behaves exactly like the css cursor property except that if the 546 | browser supports the `cursor` element, you should be able to use it with the 547 | `funcIRI` notation. 548 | 549 | As a presentation attribute, it also can be used as a property directly inside a 550 | CSS stylesheet. 551 | 552 | Used by Elements: a, circle, defs, ellipse, g, image, line, marker, mask, 553 | mesh, missing-glyph, path, pattern, polygon, polyline, rect, svg, 554 | switch, symbol, text, use 555 | 556 | See: 557 | 558 | -} 559 | cursor : Cursor -> Attribute msg 560 | cursor csor = 561 | attribute "cursor" <| cursorToString csor 562 | 563 | 564 | {-| -} 565 | cx : Length -> Attribute msg 566 | cx length = 567 | attribute "cx" <| lengthToString length 568 | 569 | 570 | {-| -} 571 | cy : Length -> Attribute msg 572 | cy length = 573 | attribute "cy" <| lengthToString length 574 | 575 | 576 | {-| This attribute defines a path to follow. 577 | 578 | NOTE: You probably want to import the `folkertdev/svg-path-dsl` package for 579 | access to a more Elm-like way of expressing paths. For instance: 580 | 581 | [ path 582 | [ d (pathToString [ 583 | subpath 584 | (startAt (10, 10)) 585 | open 586 | [ cubicTo 587 | (10, 50) 588 | (90, 50) 589 | (90, 90) 590 | ] 591 | ]) 592 | , stroke Color.black 593 | , strokeWidth 3.5 594 | , noFill 595 | ] 596 | [] 597 | 598 | Used by Elements: path 599 | 600 | See: 601 | 602 | -} 603 | d : String -> Attribute msg 604 | d = 605 | attribute "d" 606 | 607 | 608 | {-| -} 609 | decelerate : String -> Attribute msg 610 | decelerate = 611 | attribute "decelerate" 612 | 613 | 614 | {-| -} 615 | descent : String -> Attribute msg 616 | descent = 617 | attribute "descent" 618 | 619 | 620 | {-| The `direction` attribute specifies the base writing direction of text and 621 | the direction of embeddings and overrides for the Unicode bidirectional 622 | algorithm. 623 | 624 | For the direction attribute to have any effect on an element that does not 625 | by itself establish a new text chunk (such as a `tspan` element without 626 | absolute position adjustments due to `x` or `y` attributes), the 627 | unicode-bidi property's value must be `embed` or `bidiOverride`. 628 | 629 | The `direction` attribute applies only to glyphs oriented perpendicular to 630 | the `inlineProgressionDirection`, which includes the usual case of 631 | horizontally-oriented Latin or Arabic text and the case of narrow-cell 632 | Latin or Arabic characters rotated 90 degrees clockwise relative to a 633 | top-to-bottom inline-progression-direction. 634 | 635 | As a presentation attribute, it also can be used as a property directly 636 | inside a CSS stylesheet. 637 | 638 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 639 | text, textPath, tref, tspan 640 | 641 | See: 642 | 643 | -} 644 | direction : Direction -> Attribute msg 645 | direction dir = 646 | attribute "direction" <| directionToString dir 647 | 648 | 649 | {-| The `display` attribute lets you control the rendering of graphical or 650 | container elements. It is similar to the CSS "display" attribute (e.g. 651 | display: "none", "block", etc.) 652 | 653 | As a presentation attribute, it also can be used as a property directly 654 | inside a CSS stylesheet. 655 | 656 | Used by Elements: a, altGlyph, altGlyphDef, altGlyphItem, circle, ellipse, 657 | foreignobject, g, glyph, glyphRef, image, line, mesh, path, polygon, 658 | polyline, rect, svg, switch, text, text, textPath, tref, tspan, use 659 | 660 | See: 661 | 662 | -} 663 | display : Display -> Attribute msg 664 | display disp = 665 | attribute "display" <| displayToString disp 666 | 667 | 668 | {-| The `dominantBaseline` attribute is used to determine or re-determine a 669 | scaled-baseline-table. A scaled-baseline-table is a compound value with 670 | three components: a baseline-identifier for the `dominantBaseline`, a 671 | baseline-table and a baseline-table font-size. 672 | 673 | Some values of the property re-determine all three values; other only 674 | re-establish the baseline-table font-size. When the initial value, auto, 675 | would give an undesired result, this property can be used to explicitly 676 | set the desire scaled-baseline-table. 677 | 678 | If there is no baseline table in the nominal font or if the baseline table 679 | lacks an entry for the desired baseline, then the browser may use heuristics 680 | to determine the position of the desired baseline. 681 | 682 | As a presentation attribute, it also can be used as a property directly 683 | inside a CSS stylesheet. 684 | 685 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 686 | textPath, text, tref, tspan 687 | 688 | See: 689 | 690 | -} 691 | dominantBaseline : DominantBaseline -> Attribute msg 692 | dominantBaseline baseline = 693 | attribute "dominant-baseline" <| dominantBaselineToString baseline 694 | 695 | 696 | {-| This attribute indicates the simple duration of the animation. 697 | 698 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 699 | discard, mpath, set 700 | 701 | See: 702 | 703 | -} 704 | dur : Duration -> Attribute msg 705 | dur duration = 706 | attribute "dur" <| durationToString duration 707 | 708 | 709 | {-| -} 710 | dx : Length -> Attribute msg 711 | dx length = 712 | attribute "dx" <| lengthToString length 713 | 714 | 715 | {-| -} 716 | dy : Length -> Attribute msg 717 | dy length = 718 | attribute "dy" <| lengthToString length 719 | 720 | 721 | {-| -} 722 | enableBackground : String -> Attribute msg 723 | enableBackground = 724 | attribute "enable-background" 725 | 726 | 727 | {-| This attribute defines an end value for the animation that can constrain 728 | the active duration. 729 | 730 | Each value can be of the same type as the ones defined for the begin 731 | attribute. 732 | 733 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 734 | discard, mpath, set 735 | 736 | See: 737 | 738 | -} 739 | end : List TimingValue -> Attribute msg 740 | end timingValues = 741 | attribute "end" <| String.join ";" (List.map timingValueAsString timingValues) 742 | 743 | 744 | {-| -} 745 | exponent : String -> Attribute msg 746 | exponent = 747 | attribute "exponent" 748 | 749 | 750 | {-| The externalResourcesRequired attribute is available on all container 751 | elements and to all elements which potentially can reference external 752 | resources. It specifies whether referenced resources that are not part of 753 | the current document are required for proper rendering of the given 754 | container element or graphics element. 755 | 756 | Used by Elements: a, altGlyph, altGlyphDef, altGlyphItem, animate, 757 | animateColor, animateMotion, animateTransform, circle, clipPath, cursor, 758 | discard, defs, ellipse, feImage, filter, font, foreignObject, g, glyph, 759 | glyphRef, image, line, linearGradient, mesh, meshGradient, marker, mask, 760 | mpath, path, pattern, polygon, polyline, radialGradient, rect, script, 761 | set, stop, svg, switch, symbol, text, textPath, tref, tspan, use, view 762 | 763 | See: 764 | 765 | -} 766 | externalResourcesRequired : Bool -> Attribute msg 767 | externalResourcesRequired bool = 768 | attribute "externalResourcesRequired" <| boolToString bool 769 | 770 | 771 | {-| -} 772 | fill : Paint -> Attribute msg 773 | fill = 774 | attribute "fill" << paintToString 775 | 776 | 777 | {-| -} 778 | noFill : Attribute msg 779 | noFill = 780 | fill PaintNone 781 | 782 | 783 | {-| This attribute specifies the opacity of the color or the content the current 784 | object is filled with. 785 | 786 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, circle, ellipse, 787 | glyph, glyphRef, line, mesh, path, polygon, polyline, rect, text, 788 | textPath, tref, tspan 789 | 790 | See: 791 | 792 | -} 793 | fillOpacity : Opacity -> Attribute msg 794 | fillOpacity opa = 795 | attribute "fill-opacity" <| opacityToString opa 796 | 797 | 798 | {-| The fillRule attribute indicates how to determine what side of a path is 799 | inside a shape, to determine how the fill property paints the shape. For a 800 | simple, non-intersecting path, it is intuitively clear what region lies 801 | "inside"; however, for a more complex path, such as a path that intersects 802 | itself or where one subpath encloses another, the interpretation of 803 | "inside" is not so obvious. 804 | 805 | As a presentation attribute, it also can be used as a property directly 806 | inside a CSS stylesheet 807 | 808 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, circle, ellipse, 809 | glyph, glyphRef, line, mesh, path, polygon, polyline, rect, text, 810 | textPath, tref, tspan 811 | 812 | See: 813 | 814 | -} 815 | fillRule : FillRule -> Attribute msg 816 | fillRule rule = 817 | attribute "fill-rule" <| fillRuleToString rule 818 | 819 | 820 | {-| The filter attribute defines the filter effects define by the `filter` 821 | element that shall be applied to its element. 822 | 823 | NOTE: See Filters and Filters.Attributes modules. 824 | 825 | As a presentation attribute, it also can be used as a property directly 826 | inside a CSS stylesheet. 827 | 828 | Used by Elements: a, circle, defs, ellipse, g, glyph, image, line, marker, 829 | mesh, missing-glyph, path, pattern, polygon, polyline, rect, svg, 830 | switch, symbol, text, use 831 | 832 | See: 833 | 834 | -} 835 | filter : Filter -> Attribute msg 836 | filter f = 837 | attribute "filter" <| filterToString f 838 | 839 | 840 | 841 | -- floodColor: see Filters.floodColor 842 | -- floodOpacity: see Filters.floodOpacity 843 | 844 | 845 | {-| An empty list will set `font-family: inherit` 846 | -} 847 | fontFamily : List String -> Attribute msg 848 | fontFamily families = 849 | case families of 850 | [] -> 851 | attribute "font-family" "inherit" 852 | 853 | _ -> 854 | attribute "font-family" (String.join ", " families) 855 | 856 | 857 | {-| -} 858 | fontSize : Length -> Attribute msg 859 | fontSize length = 860 | attribute "font-size" <| lengthToString length 861 | 862 | 863 | {-| The `fontSizeAdjust` attribute allows authors to specify an aspect value 864 | for an element that will preserve the X height of the first choice font in 865 | a substitute font. 866 | 867 | As a presentation attribute, it also can be used as a property directly 868 | inside a CSS stylesheet. 869 | 870 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 871 | text, textPath, tref, tspan 872 | 873 | See: 874 | 875 | -} 876 | fontSizeAdjust : FontSizeAdjust -> Attribute msg 877 | fontSizeAdjust adjust = 878 | attribute "font-size-adjust" <| fontSizeAdjustToString adjust 879 | 880 | 881 | {-| The `fontStretch` attribute indicates the desired amount of condensing or 882 | expansion in the glyphs used to render the text. 883 | 884 | As a presentation attribute, it also can be used as a property directly 885 | inside a CSS stylesheet. 886 | 887 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 888 | text, textPath, tref, tspan 889 | 890 | See: 891 | 892 | -} 893 | fontStretch : FontStretch -> Attribute msg 894 | fontStretch stretch = 895 | attribute "font-stretch" <| fontStretchToString stretch 896 | 897 | 898 | {-| The `fontStyle` attribute specifies whether the text is to be rendered using 899 | a normal, italic or oblique face. 900 | 901 | As a presentation attribute, it also can be used as a property directly 902 | inside a CSS stylesheet. 903 | 904 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 905 | text, textPath, tref, tspan 906 | 907 | See: 908 | 909 | -} 910 | fontStyle : FontStyle -> Attribute msg 911 | fontStyle fStyle = 912 | attribute "font-style" <| fontStyleToString fStyle 913 | 914 | 915 | {-| The `fontVariant` attribute indicates whether the text is to be rendered 916 | using the normal glyphs for lowercase characters or using small-caps glyphs 917 | for lowercase characters. 918 | 919 | As a presentation attribute, it also can be used as a property directly 920 | inside a CSS stylesheet. 921 | 922 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 923 | text, textPath, tref, tspan 924 | 925 | See: 926 | 927 | -} 928 | fontVariant : FontVariant -> Attribute msg 929 | fontVariant variant = 930 | attribute "font-variant" <| fontVariantToString variant 931 | 932 | 933 | {-| The `fontWeight` attribute refers to the boldness or lightness of the glyphs 934 | used to render the text, relative to other fonts in the same font family. 935 | 936 | As a presentation attribute, it also can be used as a property directly 937 | inside a CSS stylesheet. 938 | 939 | Used by Elements: altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, 940 | text, textPath, tref, tspan 941 | 942 | See: 943 | 944 | -} 945 | fontWeight : FontWeight -> Attribute msg 946 | fontWeight fWeight = 947 | attribute "font-weight" <| fontWeightToString fWeight 948 | 949 | 950 | {-| -} 951 | format : String -> Attribute msg 952 | format = 953 | attribute "format" 954 | 955 | 956 | {-| This attribute indicates the initial value of the attribute that will be 957 | modified during the animation. When used with the `to` attribute, the 958 | animation will change the modified attribute from the from value to the to 959 | value. 960 | 961 | Used by Elements: animate, animateColor, animateMotion, animateTransform 962 | 963 | See: 964 | 965 | -} 966 | from : Float -> Attribute msg 967 | from value = 968 | attribute "from" <| String.fromFloat value 969 | 970 | 971 | {-| This attribute indicates the initial values of 2 attributes that will be 972 | modified during the animation. When used with the `to2` attribute, the 973 | animation will change the modified attribute sfrom the from values to the to 974 | value. 975 | 976 | Used by Elements: animate, animateColor, animateMotion, animateTransform 977 | 978 | See: 979 | 980 | -} 981 | from2 : Float -> Float -> Attribute msg 982 | from2 a b = 983 | attribute "from" <| floatsToString [ a, b ] 984 | 985 | 986 | {-| This attribute indicates the initial values of 3 attributes that will be 987 | modified during the animation. When used with the `to3` attribute, the 988 | animation will change the modified attributes from the from values to the to 989 | value. 990 | 991 | Used by Elements: animate, animateColor, animateMotion, animateTransform 992 | 993 | See: 994 | 995 | -} 996 | from3 : Float -> Float -> Float -> Attribute msg 997 | from3 a b c = 998 | attribute "from" <| floatsToString [ a, b, c ] 999 | 1000 | 1001 | {-| For the `radialGradient` element, this attribute defines the x-axis 1002 | coordinate of the focal point for the radial gradient. 1003 | 1004 | If the attribute is not specified, it's assumed to be at the same place as 1005 | the center point. 1006 | 1007 | Used by Elements: radialGradient 1008 | 1009 | See: 1010 | 1011 | -} 1012 | fx : Length -> Attribute msg 1013 | fx length = 1014 | attribute "fx" <| lengthToString length 1015 | 1016 | 1017 | {-| For the `radialGradient` element, this attribute defines the y-axis 1018 | coordinate of the focal point for the radial gradient. 1019 | 1020 | If the attribute is not specified, it's assumed to be at the same place as 1021 | the center point. 1022 | 1023 | Used by Elements: radialGradient 1024 | 1025 | See: 1026 | 1027 | -} 1028 | fy : Length -> Attribute msg 1029 | fy length = 1030 | attribute "fy" <| lengthToString length 1031 | 1032 | 1033 | {-| -} 1034 | g1 : String -> Attribute msg 1035 | g1 = 1036 | attribute "g1" 1037 | 1038 | 1039 | {-| -} 1040 | g2 : String -> Attribute msg 1041 | g2 = 1042 | attribute "g2" 1043 | 1044 | 1045 | {-| -} 1046 | glyphName : String -> Attribute msg 1047 | glyphName = 1048 | attribute "glyph-name" 1049 | 1050 | 1051 | {-| -} 1052 | glyphOrientationHorizontal : String -> Attribute msg 1053 | glyphOrientationHorizontal = 1054 | attribute "glyph-orientation-horizontal" 1055 | 1056 | 1057 | {-| -} 1058 | glyphOrientationVertical : String -> Attribute msg 1059 | glyphOrientationVertical = 1060 | attribute "glyph-orientation-vertical" 1061 | 1062 | 1063 | {-| -} 1064 | glyphRef : String -> Attribute msg 1065 | glyphRef = 1066 | attribute "glyphRef" 1067 | 1068 | 1069 | {-| The gradientTransform attribute contains the definition of an optional 1070 | additional transformation from the gradient coordinate system onto the 1071 | target coordinate system (i.e., userSpaceOnUse or objectBoundingBox). This 1072 | allows for things such as skewing the gradient. This additional 1073 | transformation matrix is post-multiplied to (i.e., inserted to the right of) 1074 | any previously defined transformations, including the implicit 1075 | transformation necessary to convert from object bounding box units to user 1076 | space. 1077 | 1078 | Used by Elements: linearGradient, radialGradient 1079 | 1080 | See: 1081 | 1082 | -} 1083 | gradientTransform : List Transform -> Attribute msg 1084 | gradientTransform transforms = 1085 | attribute "gradientTransform" <| String.join " " (List.map transformToString transforms) 1086 | 1087 | 1088 | {-| The gradientUnits attribute defines the coordinate system for attributes 1089 | x1, y1, x2 and y2 on the `linearGradient` element or for attributes cx, cy, 1090 | r, fx, and fy on the `radialGradient`. 1091 | 1092 | If the `gradientUnits` attribute isn't specified, then the effect is as if a 1093 | value of CoordinateSystemObjectBoundingBox were specified. 1094 | 1095 | Used by Elements: linearGradient, radialGradient 1096 | 1097 | See: 1098 | 1099 | -} 1100 | gradientUnits : CoordinateSystem -> Attribute msg 1101 | gradientUnits coordinateSystem = 1102 | attribute "gradientUnits" <| coordinateSystemToString coordinateSystem 1103 | 1104 | 1105 | {-| -} 1106 | hanging : String -> Attribute msg 1107 | hanging = 1108 | attribute "hanging" 1109 | 1110 | 1111 | {-| This attribute indicates a vertical length in the user coordinate system. 1112 | The exact effect of this coordinate depends on each element. Most of the 1113 | time, it represents the height of the rectangular region of the reference 1114 | element (see each individual element's documentation for exceptions). 1115 | 1116 | This attribute must be specified except for the `svg` element where the 1117 | default value is 100% and the `filter` and `mask` elements where the default 1118 | value is 120%. 1119 | 1120 | -} 1121 | height : Length -> Attribute msg 1122 | height length = 1123 | attribute "height" <| lengthToString length 1124 | 1125 | 1126 | {-| -} 1127 | horizAdvX : String -> Attribute msg 1128 | horizAdvX = 1129 | attribute "horiz-adv-x" 1130 | 1131 | 1132 | {-| -} 1133 | horizOriginX : String -> Attribute msg 1134 | horizOriginX = 1135 | attribute "horiz-origin-x" 1136 | 1137 | 1138 | {-| -} 1139 | horizOriginY : String -> Attribute msg 1140 | horizOriginY = 1141 | attribute "horiz-origin-y" 1142 | 1143 | 1144 | {-| The href attribute defines a link to a resource as a reference URL. 1145 | The exact meaning of that link depends on the context of each element using it. 1146 | The `xlinkHref` attribute is used before SVG 2 but is now rendered obsolete by `href`. 1147 | 1148 | Used by Elements: a, animate, animateMotion, animateTransform, discard, feImage, image, linearGradient, mpath, pattern, radialGradient, script, set, textPath, and use 1149 | 1150 | See: 1151 | 1152 | -} 1153 | href : String -> Attribute msg 1154 | href = 1155 | attribute "href" 1156 | 1157 | 1158 | {-| The id attribute assigns a unique name to an element. 1159 | 1160 | The ID must be unique within the node tree, must not be an empty string, 1161 | and must not contain any whitespace characters. 1162 | 1163 | Valid IDs should only include designated characters (letters, digits, 1164 | and a few punctuation marks), and do not start with a digit, a full stop (.) 1165 | character, or a hyphen-minus (-) character. 1166 | 1167 | Used by all Elements 1168 | 1169 | See: 1170 | 1171 | -} 1172 | id : String -> Attribute msg 1173 | id = 1174 | attribute "id" 1175 | 1176 | 1177 | {-| -} 1178 | ideographic : String -> Attribute msg 1179 | ideographic = 1180 | attribute "ideographic" 1181 | 1182 | 1183 | {-| The `imageRendering` attribute provides a hint to the browser about how to 1184 | make speed vs. quality tradeoffs as it performs image processing. 1185 | 1186 | As a presentation attribute, it also can be used as a property directly 1187 | inside a CSS stylesheet. 1188 | 1189 | Used by Elements: image 1190 | 1191 | See: 1192 | 1193 | -} 1194 | imageRendering : Rendering -> Attribute msg 1195 | imageRendering rendering = 1196 | attribute "image-rendering" <| renderingToString rendering 1197 | 1198 | 1199 | {-| -} 1200 | intercept : String -> Attribute msg 1201 | intercept = 1202 | attribute "intercept" 1203 | 1204 | 1205 | {-| -} 1206 | k : String -> Attribute msg 1207 | k = 1208 | attribute "k" 1209 | 1210 | 1211 | {-| The kerning attribute indicates whether the browser should adjust 1212 | inter-glyph spacing based on kerning tables that are included in the 1213 | relevant font (i.e., enable auto-kerning) or instead disable auto-kerning 1214 | and instead set inter-character spacing to a specific length (typically, 1215 | zero). 1216 | 1217 | The value of auto indicates that the user agent should adjust inter-glyph 1218 | spacing based on kerning tables that are included in the font that will be 1219 | used. 1220 | 1221 | If a `length` is provided, then auto-kerning is disabled. Instead, 1222 | inter-character spacing is set to the given . The most common 1223 | scenario, other than auto, is to set kerning to a value of 0 so that 1224 | auto-kerning is disabled. 1225 | 1226 | If a `length` is provided without a unit identifier (e.g., an unqualified 1227 | number such as 128), the browser processes the `length` as a width value in 1228 | the current user coordinate system. 1229 | 1230 | If a `length` is provided with a unit identifier (e.g., .25em or 1%), then 1231 | the browser converts the `length` into a corresponding value in the current 1232 | user coordinate system. 1233 | 1234 | When a `length` is provided, its value is added to the inter-character 1235 | spacing value specified by the letter-spacing attribute. 1236 | 1237 | As a presentation attribute, it also can be used as a property directly 1238 | inside a CSS stylesheet, see css kerning for further information. 1239 | 1240 | Used by Elements: altGlyph, altGlyphDef, glyph, glyphRef, textPath, 1241 | text, tref, tspan 1242 | 1243 | See: 1244 | 1245 | -} 1246 | kerning : Kerning -> Attribute msg 1247 | kerning kning = 1248 | attribute "kerning" <| kerningToString kning 1249 | 1250 | 1251 | {-| The keySplines attribute define a set of Bézier control points associated 1252 | with the keyTimes list, defining a cubic Bézier function that controls 1253 | interval pacing. 1254 | 1255 | Used by Elements: animate, animateColor, animateMotion, animateTransform 1256 | 1257 | See: 1258 | 1259 | -} 1260 | keySplines : List BezierAnchorPoint -> Attribute msg 1261 | keySplines bezierAnchorPointList = 1262 | attribute "keySplines" <| (List.map bezierAnchorPointToString bezierAnchorPointList |> String.join ";") 1263 | 1264 | 1265 | {-| The keyTimes attribute is a semicolon-separated list of time `values` used 1266 | to control the pacing of the animation. Each time in the list corresponds to 1267 | a value in the values attribute list, and defines when the value is used in 1268 | the animation. Each time value in the keyTimes list is specified as a 1269 | floating point value between 0 and 1 (inclusive), representing a 1270 | proportional offset into the duration of the animation element. 1271 | 1272 | If a list of keyTimes is specified, there must be exactly as many values in 1273 | the keyTimes list as in the values list. 1274 | 1275 | Each successive time value must be greater than or equal to the preceding 1276 | time value. 1277 | 1278 | Used by Elements: animate, animateColor, animateMotion, animateTransform 1279 | 1280 | See: 1281 | 1282 | -} 1283 | keyTimes : List Float -> Attribute msg 1284 | keyTimes floatList = 1285 | attribute "keyTimes" <| (List.map String.fromFloat floatList |> String.join ";") 1286 | 1287 | 1288 | {-| -} 1289 | lang : String -> Attribute msg 1290 | lang = 1291 | attribute "lang" 1292 | 1293 | 1294 | {-| When an SVG `text` or `tspan` element has a specific length set using the 1295 | textLength attribute, the lengthAdjust attribute controls how the text is 1296 | stretched or compressed into that length. 1297 | 1298 | The two possible values for the attribute are `LengthAdjustSpacing` and 1299 | `LengthAdjustSpacingAndGlyphs`. 1300 | 1301 | Using `LengthAdjustSpacing` (the default), the letter forms are preserved, 1302 | but the space between them grows or shrinks. 1303 | 1304 | Using `LengthAdjustSpacingAndGlyphs`, the entire text element is stretched in 1305 | the direction of the text. 1306 | 1307 | Used by Elements: text, tspan 1308 | 1309 | See: 1310 | 1311 | -} 1312 | lengthAdjust : LengthAdjust -> Attribute msg 1313 | lengthAdjust option = 1314 | attribute "lengthAdjust" <| lengthAdjustToString option 1315 | 1316 | 1317 | {-| -} 1318 | letterSpacing : String -> Attribute msg 1319 | letterSpacing = 1320 | attribute "letter-spacing" 1321 | 1322 | 1323 | {-| -} 1324 | lightingColor : String -> Attribute msg 1325 | lightingColor = 1326 | attribute "lighting-color" 1327 | 1328 | 1329 | {-| -} 1330 | local : String -> Attribute msg 1331 | local = 1332 | attribute "local" 1333 | 1334 | 1335 | {-| -} 1336 | markerEnd : String -> Attribute msg 1337 | markerEnd = 1338 | attribute "marker-end" 1339 | 1340 | 1341 | {-| The markerHeight represents the height of the viewport into which the 1342 | `marker` is to be fitted when it is rendered. 1343 | 1344 | A value of zero disables rendering of the element. 1345 | 1346 | If the attribute is not specified, the effect is as if a value of 3 were 1347 | specified. 1348 | 1349 | Used by Elements: marker 1350 | 1351 | See: 1352 | 1353 | -} 1354 | markerHeight : Length -> Attribute msg 1355 | markerHeight mHeight = 1356 | attribute "markerHeight" <| lengthToString mHeight 1357 | 1358 | 1359 | {-| -} 1360 | markerMid : String -> Attribute msg 1361 | markerMid = 1362 | attribute "marker-mid" 1363 | 1364 | 1365 | {-| -} 1366 | markerStart : String -> Attribute msg 1367 | markerStart = 1368 | attribute "marker-start" 1369 | 1370 | 1371 | {-| The `markerUnits` attribute defines the coordinate system for the attributes 1372 | `markerWidth`, `markerHeight` and the contents of the `marker`. 1373 | 1374 | If the `markerUnits` attribute is not specified, then the effect is as if a 1375 | value of `strokeWidth` were specified. 1376 | 1377 | Used by Elements: marker 1378 | 1379 | See: 1380 | 1381 | -} 1382 | markerUnits : MarkerCoordinateSystem -> Attribute msg 1383 | markerUnits markerCoordinateSystem = 1384 | attribute "markerUnits" <| markerCoordinateSystemToString markerCoordinateSystem 1385 | 1386 | 1387 | {-| The markerWidth represents the width of the viewport into which the 1388 | `marker` is to be fitted when it is rendered. 1389 | 1390 | A value of zero disables rendering of the element. 1391 | 1392 | If the attribute is not specified, the effect is as if a value of 3 were 1393 | specified. 1394 | 1395 | Used by Elements: marker 1396 | 1397 | See: 1398 | 1399 | -} 1400 | markerWidth : Length -> Attribute msg 1401 | markerWidth mWidth = 1402 | attribute "markerWidth" <| lengthToString mWidth 1403 | 1404 | 1405 | {-| -} 1406 | mask : String -> Attribute msg 1407 | mask = 1408 | attribute "mask" 1409 | 1410 | 1411 | {-| The maskContentUnits attribute defines the coordinate system for the 1412 | contents of the `mask`. 1413 | 1414 | If the `maskContentUnits` attribute isn't specified, then the effect is as 1415 | if a value of CoordinateSystemUserSpaceOnUse were specified. 1416 | 1417 | Note that values defined as a percentage inside the content of the `mask` 1418 | are not affected by this attribute. It means that even if you set the value 1419 | of `maskContentUnits` to CoordinateSystemObjectBoundingBox, percentage 1420 | values will be calculated as if the value of the attribute were 1421 | CoordinateSystemUserSpaceOnUse. 1422 | 1423 | Used by Elements: mask 1424 | 1425 | See: 1426 | 1427 | -} 1428 | maskContentUnits : CoordinateSystem -> Attribute msg 1429 | maskContentUnits coordinateSystem = 1430 | attribute "maskContentUnits" <| coordinateSystemToString coordinateSystem 1431 | 1432 | 1433 | {-| The `maskUnits` attribute defines the coordinate system for attributes x, y, 1434 | width and height. 1435 | 1436 | If the `maskUnits` attribute isn't specified, then the effect is as if a 1437 | value of CoordinateSystemObjectBoundingBox were specified. 1438 | 1439 | Used by Elements: mask 1440 | 1441 | See: 1442 | 1443 | -} 1444 | maskUnits : CoordinateSystem -> Attribute msg 1445 | maskUnits coordinateSystem = 1446 | attribute "maskUnits" <| coordinateSystemToString coordinateSystem 1447 | 1448 | 1449 | {-| This attribute specifies the maximum value of the active duration. 1450 | 1451 | The default value for max is 0. This does not constrain the active duration 1452 | at all. 1453 | 1454 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 1455 | discard, mpath, set 1456 | 1457 | See: 1458 | 1459 | -} 1460 | max : ClockValue -> Attribute msg 1461 | max clockValue = 1462 | attribute "max" <| clockValue 1463 | 1464 | 1465 | {-| -} 1466 | media : String -> Attribute msg 1467 | media = 1468 | attribute "media" 1469 | 1470 | 1471 | {-| -} 1472 | method : String -> Attribute msg 1473 | method = 1474 | attribute "method" 1475 | 1476 | 1477 | {-| This attribute specifies the minimum value of the active duration. 1478 | 1479 | The default value for max is 0. This does not constrain the active duration 1480 | at all. 1481 | 1482 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 1483 | discard, mpath, set 1484 | 1485 | See: 1486 | 1487 | -} 1488 | min : ClockValue -> Attribute msg 1489 | min clockValue = 1490 | attribute "min" <| clockValue 1491 | 1492 | 1493 | {-| -} 1494 | name : String -> Attribute msg 1495 | name = 1496 | attribute "name" 1497 | 1498 | 1499 | {-| -} 1500 | offset : String -> Attribute msg 1501 | offset = 1502 | attribute "offset" 1503 | 1504 | 1505 | {-| -} 1506 | opacity : Opacity -> Attribute msg 1507 | opacity = 1508 | attribute "opacity" << opacityToString 1509 | 1510 | 1511 | 1512 | -- operator: see compositeOperator and Filters.morphologyOperator 1513 | 1514 | 1515 | {-| -} 1516 | orient : String -> Attribute msg 1517 | orient = 1518 | attribute "orient" 1519 | 1520 | 1521 | {-| -} 1522 | orientation : String -> Attribute msg 1523 | orientation = 1524 | attribute "orientation" 1525 | 1526 | 1527 | {-| -} 1528 | origin : String -> Attribute msg 1529 | origin = 1530 | attribute "origin" 1531 | 1532 | 1533 | {-| -} 1534 | overflow : String -> Attribute msg 1535 | overflow = 1536 | attribute "overflow" 1537 | 1538 | 1539 | {-| The `overlinePosition` attribute represents the ideal vertical position of 1540 | the overline. The overline position is expressed in the font's coordinate 1541 | system. 1542 | 1543 | Used by Elements: fontFace 1544 | 1545 | See: 1546 | 1547 | -} 1548 | overlinePosition : Float -> Attribute msg 1549 | overlinePosition position = 1550 | attribute "overline-position" <| String.fromFloat position 1551 | 1552 | 1553 | {-| The `overlineThickness` attribute represents the ideal thickness of 1554 | the overline. The overline position is expressed in the font's coordinate 1555 | system. 1556 | 1557 | Used by Elements: fontFace 1558 | 1559 | See: 1560 | 1561 | -} 1562 | overlineThickness : Float -> Attribute msg 1563 | overlineThickness thickness = 1564 | attribute "overline-thickness" <| String.fromFloat thickness 1565 | 1566 | 1567 | {-| -} 1568 | panose1 : String -> Attribute msg 1569 | panose1 = 1570 | attribute "panose-1" 1571 | 1572 | 1573 | {-| NOTE: is this used as an attribute? `elm-lang/svg` seems to think so. 1574 | -} 1575 | path : String -> Attribute msg 1576 | path = 1577 | attribute "path" 1578 | 1579 | 1580 | {-| This attribute lets the author specify a total length for the path, in user 1581 | units. This value is then used to calibrate the browser's distance 1582 | calculations with those of the author, by scaling all distance computations 1583 | using the ratio pathLength / (computed value of path length). 1584 | 1585 | Used by Elements: path 1586 | 1587 | See: 1588 | 1589 | -} 1590 | pathLength : Float -> Attribute msg 1591 | pathLength length = 1592 | attribute "pathLength" <| String.fromFloat length 1593 | 1594 | 1595 | {-| The `patternContentUnits` attribute defines the coordinate system for the 1596 | contents of the `pattern`. Note that this attribute has no effect if 1597 | attribute viewBox is specified on the `pattern` element. 1598 | 1599 | If the `patternContentUnits` attribute isn't specified, then the effect is 1600 | as if a value of CoordinateSystemUserSpaceOnUse were specified. 1601 | 1602 | Used by Elements: pattern 1603 | 1604 | See: 1605 | 1606 | -} 1607 | patternContentUnits : CoordinateSystem -> Attribute msg 1608 | patternContentUnits coordinateSystem = 1609 | attribute "patternContentUnits" <| coordinateSystemToString coordinateSystem 1610 | 1611 | 1612 | {-| The `patternTransform` attribute contains the definition of an optional 1613 | additional transformation from the pattern coordinate system onto the target 1614 | coordinate system. This allows for things such as skewing the pattern tiles. 1615 | This additional transformation matrix is post-multiplied to (i.e., inserted 1616 | to the right of) any previously defined transformations, including the 1617 | implicit transformation necessary to convert from object bounding box units 1618 | to user space. 1619 | 1620 | If attribute `patternTransform` is not specified, then the effect is as if 1621 | an identity transform were specified. 1622 | 1623 | Used by Elements: pattern 1624 | 1625 | See: 1626 | 1627 | -} 1628 | patternTransform : List Transform -> Attribute msg 1629 | patternTransform transforms = 1630 | attribute "patternTransform" <| String.join " " (List.map transformToString transforms) 1631 | 1632 | 1633 | {-| The `patternUnits` attribute defines the coordinate system for attributes 1634 | x, y, width and height. 1635 | 1636 | If the `patternUnits` attribute isn't specified, then the effect is as if a 1637 | value of CoordinateSystemObjectBoundingBox were specified. 1638 | 1639 | Used by Elements: pattern 1640 | 1641 | See: 1642 | 1643 | -} 1644 | patternUnits : CoordinateSystem -> Attribute msg 1645 | patternUnits coordinateSystem = 1646 | attribute "patternUnits" <| coordinateSystemToString coordinateSystem 1647 | 1648 | 1649 | {-| -} 1650 | pointerEvents : String -> Attribute msg 1651 | pointerEvents = 1652 | attribute "pointer-events" 1653 | 1654 | 1655 | {-| -} 1656 | pointOrder : String -> Attribute msg 1657 | pointOrder = 1658 | attribute "point-order" 1659 | 1660 | 1661 | {-| The points attribute defines a list of points required to draw a `polyline` 1662 | or `polygon` element. 1663 | 1664 | Each point is defined by an X and a Y coordinate (pair) in the user coordinate 1665 | system. 1666 | 1667 | Used by Elements: polyline, polygon 1668 | 1669 | See: 1670 | 1671 | -} 1672 | points : List ( Float, Float ) -> Attribute msg 1673 | points pts = 1674 | let 1675 | pointToString ( xx, yy ) = 1676 | String.fromFloat xx ++ ", " ++ String.fromFloat yy 1677 | in 1678 | attribute "points" <| String.join " " (List.map pointToString pts) 1679 | 1680 | 1681 | {-| In some cases, typically when using the `viewBox` attribute, it is desirable 1682 | that the graphics stretch to fit non-uniformly to take up the entire 1683 | viewport. In other cases, it is desirable that uniform scaling be used for 1684 | the purposes of preserving the aspect ratio of the graphics. 1685 | 1686 | Used by Elements: svg, symbol, image, feImage, marker, pattern, view 1687 | 1688 | See: 1689 | 1690 | -} 1691 | preserveAspectRatio : Align -> MeetOrSlice -> Attribute msg 1692 | preserveAspectRatio align meetOrSlice = 1693 | attribute "preserveAspectRatio" <| 1694 | String.join " " 1695 | [ alignToString align 1696 | , meetOrSliceToString meetOrSlice 1697 | ] 1698 | 1699 | 1700 | {-| The `primitiveUnits` attribute specifies the coordinate system for the 1701 | various length values within the `filter` primitives and for the attributes 1702 | that define the filter primitive subregion. 1703 | 1704 | If the `primitiveUnits` attribute isn't specified, then the effect is as if 1705 | a value of CoordinateSystemUserSpaceOnUse were specified. 1706 | 1707 | Used by Elements: filter 1708 | 1709 | See: 1710 | 1711 | -} 1712 | primitiveUnits : CoordinateSystem -> Attribute msg 1713 | primitiveUnits coordinateSystem = 1714 | attribute "primitiveUnits" <| coordinateSystemToString coordinateSystem 1715 | 1716 | 1717 | {-| -} 1718 | r : Length -> Attribute msg 1719 | r length = 1720 | attribute "r" <| lengthToString length 1721 | 1722 | 1723 | 1724 | -- radius: see Filters.radius 1725 | 1726 | 1727 | {-| -} 1728 | refX : String -> Attribute msg 1729 | refX = 1730 | attribute "refX" 1731 | 1732 | 1733 | {-| -} 1734 | refY : String -> Attribute msg 1735 | refY = 1736 | attribute "refY" 1737 | 1738 | 1739 | {-| -} 1740 | renderingIntent : String -> Attribute msg 1741 | renderingIntent = 1742 | attribute "rendering-intent" 1743 | 1744 | 1745 | {-| This attribute indicates the Float of times the animation will take place. 1746 | 1747 | The Float can be a partial iteration, expressed as a fraction. Its value 1748 | must be greater than 0. 1749 | 1750 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 1751 | discard, mpath, set 1752 | 1753 | See: 1754 | 1755 | -} 1756 | repeatCount : RepeatCount -> Attribute msg 1757 | repeatCount count = 1758 | attribute "repeatCount" <| repeatCountToString count 1759 | 1760 | 1761 | {-| This attribute specifies the total duration for repeat. 1762 | 1763 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 1764 | discard, mpath, set 1765 | 1766 | See: 1767 | 1768 | -} 1769 | repeatDur : Duration -> Attribute msg 1770 | repeatDur duration = 1771 | attribute "repeatDur" <| durationToString duration 1772 | 1773 | 1774 | {-| -} 1775 | requiredExtensions : String -> Attribute msg 1776 | requiredExtensions = 1777 | attribute "requiredExtensions" 1778 | 1779 | 1780 | {-| This attribute takes a list of feature strings. It determines whether or not 1781 | all of the named features are supported by the browser; if all of them are 1782 | supported, the attribute evaluates to true end the element is rendered; 1783 | otherwise, the attribute evaluates to false and the current element and its 1784 | children are skipped and thus will not be rendered. This provides a way to 1785 | design SVG that gracefully falls back when features aren't available. 1786 | 1787 | If the attribute is not present, then its implicit evaluated value is true. 1788 | If a null string or empty string value is given to attribute 1789 | `requiredFeatures`, the attribute is evaluate to false. 1790 | 1791 | `requiredFeatures` is often used in conjunction with the `switch` element. 1792 | If `requiredFeatures` is used in other situations, it represents a simple 1793 | switch on the given element whether to render the element or not. 1794 | 1795 | Used by Elements: a, altGlyph, animate, animateColor, animateMotion, 1796 | animateTransform, circle, clipPath, cursor, defs, discard, ellipse, 1797 | foreignObject, g, image, line, mask, mesh, mpath, path, pattern, 1798 | polygon, polyline, rect, set, svg, switch, text, textPath, tref, 1799 | tspan, use 1800 | 1801 | See: 1802 | 1803 | -} 1804 | requiredFeatures : List String -> Attribute msg 1805 | requiredFeatures features = 1806 | attribute "requiredFeatures" <| String.join " " features 1807 | 1808 | 1809 | {-| This attribute indicates when animation can or can not restart. 1810 | 1811 | Used by Elements: animate, animateColor, animateMotion, animateTransform, 1812 | discard, mpath, set 1813 | 1814 | See: 1815 | 1816 | -} 1817 | restart : Restart -> Attribute msg 1818 | restart rstart = 1819 | attribute "restart" <| restartToString rstart 1820 | 1821 | 1822 | 1823 | -- result: see Filters.result 1824 | 1825 | 1826 | {-| -} 1827 | rotate : String -> Attribute msg 1828 | rotate = 1829 | attribute "rotate" 1830 | 1831 | 1832 | {-| -} 1833 | rx : Length -> Attribute msg 1834 | rx length = 1835 | attribute "rx" <| lengthToString length 1836 | 1837 | 1838 | {-| -} 1839 | ry : Length -> Attribute msg 1840 | ry length = 1841 | attribute "ry" <| lengthToString length 1842 | 1843 | 1844 | 1845 | -- scale: see Filters.scale 1846 | -- seed: see Filters.seed 1847 | 1848 | 1849 | {-| The creator of SVG content might want to provide a hint about what tradeoffs 1850 | to make as the browser renders `path` element or basic shapes. The 1851 | shape-rendering attribute provides these hints. 1852 | 1853 | Used by Elements: circle, ellipse, line, mesh, path, polygon, polyline, 1854 | rect, svg 1855 | 1856 | See: 1857 | 1858 | -} 1859 | shapeRendering : ShapeRendering -> Attribute msg 1860 | shapeRendering rendering = 1861 | attribute "shape-rendering" <| shapeRenderingToString rendering 1862 | 1863 | 1864 | {-| -} 1865 | slope : String -> Attribute msg 1866 | slope = 1867 | attribute "slope" 1868 | 1869 | 1870 | {-| -} 1871 | spacing : String -> Attribute msg 1872 | spacing = 1873 | attribute "spacing" 1874 | 1875 | 1876 | {-| -} 1877 | specularConstant : String -> Attribute msg 1878 | specularConstant = 1879 | attribute "specularConstant" 1880 | 1881 | 1882 | {-| -} 1883 | specularExponent : String -> Attribute msg 1884 | specularExponent = 1885 | attribute "specularExponent" 1886 | 1887 | 1888 | {-| -} 1889 | speed : String -> Attribute msg 1890 | speed = 1891 | attribute "speed" 1892 | 1893 | 1894 | {-| -} 1895 | spreadMethod : String -> Attribute msg 1896 | spreadMethod = 1897 | attribute "spreadMethod" 1898 | 1899 | 1900 | {-| -} 1901 | startOffset : String -> Attribute msg 1902 | startOffset = 1903 | attribute "startOffset" 1904 | 1905 | 1906 | {-| -} 1907 | stdDeviation : String -> Attribute msg 1908 | stdDeviation = 1909 | attribute "stdDeviation" 1910 | 1911 | 1912 | {-| -} 1913 | stemh : String -> Attribute msg 1914 | stemh = 1915 | attribute "stemh" 1916 | 1917 | 1918 | {-| -} 1919 | stemv : String -> Attribute msg 1920 | stemv = 1921 | attribute "stemv" 1922 | 1923 | 1924 | {-| -} 1925 | stitchTiles : String -> Attribute msg 1926 | stitchTiles = 1927 | attribute "stitchTiles" 1928 | 1929 | 1930 | {-| -} 1931 | stopColor : String -> Attribute msg 1932 | stopColor = 1933 | attribute "stop-color" 1934 | 1935 | 1936 | {-| -} 1937 | stopOpacity : Opacity -> Attribute msg 1938 | stopOpacity = 1939 | attribute "stop-opacity" << opacityToString 1940 | 1941 | 1942 | {-| -} 1943 | strikethroughPosition : String -> Attribute msg 1944 | strikethroughPosition = 1945 | attribute "strikethrough-position" 1946 | 1947 | 1948 | {-| -} 1949 | strikethroughThickness : String -> Attribute msg 1950 | strikethroughThickness = 1951 | attribute "strikethrough-thickness" 1952 | 1953 | 1954 | {-| -} 1955 | string : String -> Attribute msg 1956 | string = 1957 | attribute "string" 1958 | 1959 | 1960 | {-| -} 1961 | stroke : Paint -> Attribute msg 1962 | stroke = 1963 | attribute "stroke" << paintToString 1964 | 1965 | 1966 | {-| -} 1967 | strokeDasharray : String -> Attribute msg 1968 | strokeDasharray = 1969 | attribute "stroke-dasharray" 1970 | 1971 | 1972 | {-| -} 1973 | strokeDashoffset : String -> Attribute msg 1974 | strokeDashoffset = 1975 | attribute "stroke-dashoffset" 1976 | 1977 | 1978 | {-| -} 1979 | strokeLinecap : StrokeLinecap -> Attribute msg 1980 | strokeLinecap = 1981 | attribute "stroke-linecap" << strokeLinecapToString 1982 | 1983 | 1984 | {-| -} 1985 | strokeLinejoin : StrokeLinejoin -> Attribute msg 1986 | strokeLinejoin = 1987 | attribute "stroke-linejoin" << strokeLinejoinToString 1988 | 1989 | 1990 | {-| -} 1991 | strokeMiterlimit : String -> Attribute msg 1992 | strokeMiterlimit = 1993 | attribute "stroke-miterlimit" 1994 | 1995 | 1996 | {-| -} 1997 | strokeOpacity : Opacity -> Attribute msg 1998 | strokeOpacity = 1999 | attribute "stroke-opacity" << opacityToString 2000 | 2001 | 2002 | {-| -} 2003 | strokeWidth : Length -> Attribute msg 2004 | strokeWidth length = 2005 | attribute "stroke-width" <| lengthToString length 2006 | 2007 | 2008 | {-| The style attribute specifies style information for its element. It 2009 | functions identically to the style attribute in HTML. 2010 | 2011 | Used by Elements: a, altGlyph, altGlyphDef, altGlyphItem, circle, clipPath, 2012 | defs, defs, ellipse, feBlend, feColorMatrix, feComponentTransfer, 2013 | feComposite, feConvolveMatrix, feDiffuseLighting, feDisplacementMap, 2014 | feDropShadow, feFlood, feFuncA, feFuncB, feFuncG, feFuncR, 2015 | feGaussianBlur, feImage, feMerge, feMergeNode, feMorphology, feOffset, 2016 | feSpecularLighting, feTile, feTurbulence, filter, font, foreignObject, 2017 | g, glyph, glyph, glyphRef, glyphRef, image, line, linearGradient, 2018 | marker, mask, mesh, meshGradient, missingGlyph, path, pattern, polygon, 2019 | polyline, radialGradient, rect, stop, svg, svg, switch, symbol, 2020 | text, text, textPath, tref, tspan, use, use 2021 | 2022 | TODO: easy use of a typed CSS library? 2023 | 2024 | See: 2025 | 2026 | -} 2027 | style : String -> Attribute msg 2028 | style value = 2029 | attribute "style" <| value 2030 | 2031 | 2032 | {-| -} 2033 | systemLanguage : String -> Attribute msg 2034 | systemLanguage = 2035 | attribute "systemLanguage" 2036 | 2037 | 2038 | {-| -} 2039 | tableValues : String -> Attribute msg 2040 | tableValues = 2041 | attribute "tableValues" 2042 | 2043 | 2044 | {-| -} 2045 | target : String -> Attribute msg 2046 | target = 2047 | attribute "target" 2048 | 2049 | 2050 | {-| -} 2051 | textAnchor : AnchorAlignment -> Attribute msg 2052 | textAnchor anchorAlignment = 2053 | attribute "text-anchor" <| anchorAlignmentToString anchorAlignment 2054 | 2055 | 2056 | {-| -} 2057 | textDecoration : String -> Attribute msg 2058 | textDecoration = 2059 | attribute "text-decoration" 2060 | 2061 | 2062 | {-| The `textLength` attribute is intended to preserve a span of SVG text's 2063 | display width across a variety of conditions, such as webfonts not loading. 2064 | 2065 | Used by Elements: text, tspan 2066 | 2067 | See: 2068 | 2069 | -} 2070 | textLength : Length -> Attribute msg 2071 | textLength length = 2072 | attribute "textLength" <| lengthToString length 2073 | 2074 | 2075 | {-| -} 2076 | textRendering : TextRendering -> Attribute msg 2077 | textRendering = 2078 | attribute "text-rendering" << textRenderingToString 2079 | 2080 | 2081 | {-| -} 2082 | title : String -> Attribute msg 2083 | title = 2084 | attribute "title" 2085 | 2086 | 2087 | {-| This attribute indicates the final value of the attribute that will be 2088 | modified during the animation. The value of the attribute will change 2089 | between the from attribute value and this value. By default the change will 2090 | be linear. 2091 | 2092 | When this attribute is used with the `set` element, it specifies the value 2093 | for the attribute during the duration of the `set` element. 2094 | 2095 | Used by Elements: animate, animateColor, animateMotion, animateTransform 2096 | 2097 | See: 2098 | 2099 | -} 2100 | to : Float -> Attribute msg 2101 | to value = 2102 | attribute "to" <| String.fromFloat value 2103 | 2104 | 2105 | {-| This attribute indicates the final values of 2 attributes that will be 2106 | modified during the animation. The values of the attributes will change 2107 | between the from2 attribute values and these values. By default the change will 2108 | be linear. 2109 | 2110 | When this attribute is used with the `set` element, it specifies the value 2111 | for the attribute during the duration of the `set` element. 2112 | 2113 | Used by Elements: animate, animateColor, animateMotion, animateTransform 2114 | 2115 | See: 2116 | 2117 | -} 2118 | to2 : Float -> Float -> Attribute msg 2119 | to2 a b = 2120 | attribute "to" <| floatsToString [ a, b ] 2121 | 2122 | 2123 | {-| This attribute indicates the final values of 3 attributes that will be 2124 | modified during the animation. The values of the attributes will change 2125 | between the from3 attribute values and these value. By default the change will 2126 | be linear. 2127 | 2128 | When this attribute is used with the `set` element, it specifies the value 2129 | for the attribute during the duration of the `set` element. 2130 | 2131 | Used by Elements: animate, animateColor, animateMotion, animateTransform 2132 | 2133 | See: 2134 | 2135 | -} 2136 | to3 : Float -> Float -> Float -> Attribute msg 2137 | to3 a b c = 2138 | attribute "to" <| floatsToString [ a, b, c ] 2139 | 2140 | 2141 | {-| The transform attribute defines a list of transform definitions that are 2142 | applied to an element and the element's children. The items in the transform 2143 | list are applied from right to left. 2144 | 2145 | Used by Elements: a, circle, clipPath, defs, ellipse, foreignObject, g, 2146 | image, line, mesh, path, polygon, polyline, rect, switch, text, use, svg 2147 | 2148 | See: 2149 | 2150 | -} 2151 | transform : List Transform -> Attribute msg 2152 | transform transforms = 2153 | attribute "transform" <| String.join " " (List.map transformToString transforms) 2154 | 2155 | 2156 | 2157 | -- type: see animateTransformType and contentType 2158 | 2159 | 2160 | {-| -} 2161 | u1 : String -> Attribute msg 2162 | u1 = 2163 | attribute "u1" 2164 | 2165 | 2166 | {-| -} 2167 | u2 : String -> Attribute msg 2168 | u2 = 2169 | attribute "u2" 2170 | 2171 | 2172 | {-| The underlinePosition attribute represents the ideal vertical position of 2173 | the underline. The underline position is expressed in the font's 2174 | coordinate system. 2175 | 2176 | Used by Elements: fontFace 2177 | 2178 | See: 2179 | 2180 | -} 2181 | underlinePosition : Float -> Attribute msg 2182 | underlinePosition position = 2183 | attribute "underline-position" <| String.fromFloat position 2184 | 2185 | 2186 | {-| The underlineThickness attribute represents the ideal thickness of the 2187 | underline. The underline thickness is expressed in the font's coordinate 2188 | system. 2189 | 2190 | Used by Elements: fontFace 2191 | 2192 | See: 2193 | 2194 | -} 2195 | underlineThickness : Float -> Attribute msg 2196 | underlineThickness thickness = 2197 | attribute "underline-thickness" <| String.fromFloat thickness 2198 | 2199 | 2200 | {-| -} 2201 | unicode : String -> Attribute msg 2202 | unicode = 2203 | attribute "unicode" 2204 | 2205 | 2206 | {-| -} 2207 | unicodeBidi : String -> Attribute msg 2208 | unicodeBidi = 2209 | attribute "unicode-bidi" 2210 | 2211 | 2212 | {-| -} 2213 | unicodeRange : String -> Attribute msg 2214 | unicodeRange = 2215 | attribute "unicode-range" 2216 | 2217 | 2218 | {-| -} 2219 | unitsPerEm : String -> Attribute msg 2220 | unitsPerEm = 2221 | attribute "units-per-em" 2222 | 2223 | 2224 | {-| -} 2225 | vAlphabetic : String -> Attribute msg 2226 | vAlphabetic = 2227 | attribute "v-alphabetic" 2228 | 2229 | 2230 | {-| -} 2231 | vHanging : String -> Attribute msg 2232 | vHanging = 2233 | attribute "v-hanging" 2234 | 2235 | 2236 | {-| -} 2237 | vIdeographic : String -> Attribute msg 2238 | vIdeographic = 2239 | attribute "v-ideographic" 2240 | 2241 | 2242 | {-| -} 2243 | vMathematical : String -> Attribute msg 2244 | vMathematical = 2245 | attribute "v-mathematical" 2246 | 2247 | 2248 | 2249 | -- values: see animationValues and Filters.colorMatrixValues 2250 | 2251 | 2252 | {-| The version attribute is used to indicate what specification a SVG document 2253 | conforms to. It is only allowed on the root `svg` element. It is purely 2254 | advisory and has no influence on rendering or processing. 2255 | 2256 | While it is specified to accept any number, the only two valid choices are 2257 | currently 1.0 and 1.1. 2258 | 2259 | Used by Elements: svg 2260 | 2261 | See: 2262 | 2263 | -} 2264 | version : String -> Attribute msg 2265 | version versionNumber = 2266 | attribute "version" versionNumber 2267 | 2268 | 2269 | {-| -} 2270 | vertAdvY : String -> Attribute msg 2271 | vertAdvY = 2272 | attribute "vert-adv-y" 2273 | 2274 | 2275 | {-| -} 2276 | vertOriginX : String -> Attribute msg 2277 | vertOriginX = 2278 | attribute "vert-origin-x" 2279 | 2280 | 2281 | {-| -} 2282 | vertOriginY : String -> Attribute msg 2283 | vertOriginY = 2284 | attribute "vert-origin-y" 2285 | 2286 | 2287 | {-| The `viewBox` attribute allows you to specify that a given set of graphics 2288 | stretch to fit a particular container element. 2289 | 2290 | `minX`, `minY`, `width` and `height` specify a rectangle in user space 2291 | which should be mapped to the bounds of the viewport established by the 2292 | given element, taking into account attribute `preserveAspectRatio`. 2293 | 2294 | Negative values for `width` or `height` are not permitted, and a value of 2295 | zero disables rendering of the element. 2296 | 2297 | Used by Elements: svg, symbol, image, marker, pattern, view 2298 | 2299 | See: 2300 | 2301 | -} 2302 | viewBox : Float -> Float -> Float -> Float -> Attribute a 2303 | viewBox minX minY vWidth vHeight = 2304 | [ minX, minY, vWidth, vHeight ] 2305 | |> List.map String.fromFloat 2306 | |> String.join " " 2307 | |> attribute "viewBox" 2308 | 2309 | 2310 | {-| -} 2311 | viewTarget : String -> Attribute msg 2312 | viewTarget = 2313 | attribute "viewTarget" 2314 | 2315 | 2316 | {-| -} 2317 | visibility : String -> Attribute msg 2318 | visibility = 2319 | attribute "visibility" 2320 | 2321 | 2322 | {-| -} 2323 | width : Length -> Attribute msg 2324 | width length = 2325 | attribute "width" <| lengthToString length 2326 | 2327 | 2328 | {-| -} 2329 | widths : String -> Attribute msg 2330 | widths = 2331 | attribute "widths" 2332 | 2333 | 2334 | {-| -} 2335 | wordSpacing : String -> Attribute msg 2336 | wordSpacing = 2337 | attribute "word-spacing" 2338 | 2339 | 2340 | {-| -} 2341 | writingMode : String -> Attribute msg 2342 | writingMode = 2343 | attribute "writing-mode" 2344 | 2345 | 2346 | {-| -} 2347 | x : Length -> Attribute msg 2348 | x length = 2349 | attribute "x" <| lengthToString length 2350 | 2351 | 2352 | {-| -} 2353 | xHeight : String -> Attribute msg 2354 | xHeight = 2355 | attribute "x-height" 2356 | 2357 | 2358 | {-| This attribute defines the x-axis coordinate of the start of a line or 2359 | linearGradient. 2360 | 2361 | If the attribute is not specified, the effect is as if a value of 0 2362 | (or 0%, in the case of a linearGradient) were specified. 2363 | 2364 | Used by Elements: line, linearGradient 2365 | 2366 | See: 2367 | 2368 | -} 2369 | x1 : Length -> Attribute msg 2370 | x1 position = 2371 | attribute "x1" <| lengthToString position 2372 | 2373 | 2374 | {-| This attribute defines the x-axis coordinate of the end of a line or 2375 | linearGradient. 2376 | 2377 | If the attribute is not specified, the effect is as if a value of 0 2378 | (or 0%, in the case of a linearGradient) were specified. 2379 | 2380 | Used by Elements: line, linearGradient 2381 | 2382 | See: 2383 | 2384 | -} 2385 | x2 : Length -> Attribute msg 2386 | x2 position = 2387 | attribute "x2" <| lengthToString position 2388 | 2389 | 2390 | {-| -} 2391 | xChannelSelector : String -> Attribute msg 2392 | xChannelSelector = 2393 | attribute "xChannelSelector" 2394 | 2395 | 2396 | {-| -} 2397 | xlinkActuate : String -> Attribute msg 2398 | xlinkActuate = 2399 | attributeNS "http://www.w3.org/1999/xlink" "xlink:actuate" 2400 | 2401 | 2402 | {-| -} 2403 | xlinkArcrole : String -> Attribute msg 2404 | xlinkArcrole = 2405 | attributeNS "http://www.w3.org/1999/xlink" "xlink:arcrole" 2406 | 2407 | 2408 | {-| Deprecated since SVG 2. Use `href` instead. 2409 | -} 2410 | xlinkHref : String -> Attribute msg 2411 | xlinkHref = 2412 | attributeNS "http://www.w3.org/1999/xlink" "xlink:href" 2413 | 2414 | 2415 | {-| -} 2416 | xlinkRole : String -> Attribute msg 2417 | xlinkRole = 2418 | attributeNS "http://www.w3.org/1999/xlink" "xlink:role" 2419 | 2420 | 2421 | {-| This attribute is provided for backwards compatibility with SVG 1.1. It 2422 | provides documentation to XLink-aware processors. In case of a conflict, 2423 | the target attribute has priority, since it can express a wider range of 2424 | values. 2425 | 2426 | Used by Elements: a, altGlyph, animate, animateColor, animateMotion, 2427 | animateTransform, colorProfile, cursor, feImage, filter, fontFaceUri, glyphRef, 2428 | image, linearGradient, mpath, pattern, radialGradient, script, set, textPath, 2429 | tref, use 2430 | 2431 | See: 2432 | 2433 | -} 2434 | xlinkShow : String -> Attribute msg 2435 | xlinkShow str = 2436 | attribute "xlinkShow" str 2437 | 2438 | 2439 | {-| The xlinkTitle attribute is used to describe the meaning of a link or 2440 | resource in a human-readable fashion, along the same lines as the xlinkRole 2441 | or xlinkArcrole attribute. It is a string that describes the resource. 2442 | In general it is preferable to use a `title` child element rather than a 2443 | xlinkTitle attribute. 2444 | 2445 | Used by Elements: a, altGlyph, animate, animateColor, animateMotion, 2446 | animateTransform, colorProfile, cursor, feImage, filter, fontFaceUri, glyphRef, 2447 | image, linearGradient, mpath, pattern, radialGradient, script, set, textPath, 2448 | tref, use 2449 | 2450 | See: 2451 | 2452 | -} 2453 | xlinkTitle : String -> Attribute msg 2454 | xlinkTitle str = 2455 | attribute "xlinkTitle" str 2456 | 2457 | 2458 | {-| -} 2459 | xlinkType : String -> Attribute msg 2460 | xlinkType = 2461 | attributeNS "http://www.w3.org/1999/xlink" "xlink:type" 2462 | 2463 | 2464 | {-| -} 2465 | xmlBase : String -> Attribute msg 2466 | xmlBase = 2467 | attributeNS "http://www.w3.org/XML/1998/namespace" "xml:base" 2468 | 2469 | 2470 | {-| -} 2471 | xmlLang : String -> Attribute msg 2472 | xmlLang = 2473 | attributeNS "http://www.w3.org/XML/1998/namespace" "xml:lang" 2474 | 2475 | 2476 | {-| -} 2477 | xmlSpace : String -> Attribute msg 2478 | xmlSpace = 2479 | attributeNS "http://www.w3.org/XML/1998/namespace" "xml:space" 2480 | 2481 | 2482 | {-| -} 2483 | y : Length -> Attribute msg 2484 | y length = 2485 | attribute "y" <| lengthToString length 2486 | 2487 | 2488 | {-| This attribute defines the y-axis coordinate of the start of a line or 2489 | linearGradient. 2490 | 2491 | If the attribute is not specified, the effect is as if a value of 0 2492 | (or 0%, in the case of a linearGradient) were specified. 2493 | 2494 | Used by Elements: line, linearGradient 2495 | 2496 | See: 2497 | 2498 | -} 2499 | y1 : Length -> Attribute msg 2500 | y1 position = 2501 | attribute "y1" <| lengthToString position 2502 | 2503 | 2504 | {-| This attribute defines the y-axis coordinate of the end of a line or 2505 | linearGradient. 2506 | 2507 | If the attribute is not specified, the effect is as if a value of 0 2508 | (or 0%, in the case of a linearGradient) were specified. 2509 | 2510 | Used by Elements: line, linearGradient 2511 | 2512 | See: 2513 | 2514 | -} 2515 | y2 : Length -> Attribute msg 2516 | y2 position = 2517 | attribute "y2" <| lengthToString position 2518 | 2519 | 2520 | {-| -} 2521 | yChannelSelector : String -> Attribute msg 2522 | yChannelSelector = 2523 | attribute "yChannelSelector" 2524 | 2525 | 2526 | 2527 | -- z: see Filters.z 2528 | 2529 | 2530 | {-| -} 2531 | zoomAndPan : String -> Attribute msg 2532 | zoomAndPan = 2533 | attribute "zoomAndPan" 2534 | 2535 | 2536 | 2537 | -- Helpers - not exposed 2538 | 2539 | 2540 | floatsToString : List Float -> String 2541 | floatsToString floatsList = 2542 | floatsList 2543 | |> List.map String.fromFloat 2544 | |> String.join " " 2545 | 2546 | 2547 | 2548 | -- Misc Additions 2549 | -- svgBox : ( number, Float ) -> List (Svg msg) -> Html msg 2550 | -- svgBox ( width, height ) = 2551 | -- svg [ viewBox 0 0 800 600 ] 2552 | --------------------------------------------------------------------------------