compostjs 0.0.4 → 0.0.8

package/dist/core.js

@@ -1,1686 +1,1530 @@
-import { List, Record, declare, Union } from "./fable-library.2.10.1/Types";
-import { bool_type, unit_type, record_type, option_type, lambda_type, array_type, class_type, tuple_type, float64_type, union_type, string_type, int32_type } from "./fable-library.2.10.1/Reflection";
-import { max as max$$1, min as min$$1, ofArray, ofSeq, reverse } from "./fable-library.2.10.1/List";
-import { insert, substring, toFail, newGuid, replace, toText, printf, join } from "./fable-library.2.10.1/String";
-import { ofList, fold, distinct, append as append$$1, ofSeq as ofSeq$$1, map } from "./fable-library.2.10.1/Array";
-import { forAll, exists, head, max as max$$2, min as min$$2, skip, rangeNumber, tryHead, filter, isEmpty, map as map$$1, empty, collect, append, delay, singleton, iterate } from "./fable-library.2.10.1/Seq";
-import { op_EqualsBangGreater, h as h$$13, text, s as s$$19, El$$$op_Dynamic$$Z451691CD as El$0024$0024$0024op_Dynamic$0024$0024Z451691CD, op_EqualsGreater, DomNode$reflection as DomNode$0024reflection } from "./html";
-import { uncurry, partialApply, curry, structuralHash, equals, max, round, int32ToString, min, comparePrimitives } from "./fable-library.2.10.1/Util";
-import { Choice, defaultArg } from "./fable-library.2.10.1/Option";
-export const Color = declare(function Compost_Color(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Color$reflection() {
-  return union_type("Compost.Color", [], Color, () => [["RGB", [["Item1", int32_type], ["Item2", int32_type], ["Item3", int32_type]]], ["HTML", [["Item", string_type]]]]);
-}
-export const Width = declare(function Compost_Width(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Width$reflection() {
-  return union_type("Compost.Width", [], Width, () => [["Pixels", [["Item", int32_type]]]]);
-}
-export const FillStyle = declare(function Compost_FillStyle(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function FillStyle$reflection() {
-  return union_type("Compost.FillStyle", [], FillStyle, () => [["Solid", [["Item", tuple_type(float64_type, Color$reflection())]]], ["LinearGradient", [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(float64_type, tuple_type(float64_type, Color$reflection()))])]]]]);
-}
-export const Number$ = declare(function Compost_Number(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Number$$reflection() {
-  return union_type("Compost.Number", [], Number$, () => [["Integer", [["Item", int32_type]]], ["Percentage", [["Item", float64_type]]]]);
-}
-export const HorizontalAlign = declare(function Compost_HorizontalAlign(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function HorizontalAlign$reflection() {
-  return union_type("Compost.HorizontalAlign", [], HorizontalAlign, () => ["Start", "Center", "End"]);
-}
-export const VerticalAlign = declare(function Compost_VerticalAlign(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function VerticalAlign$reflection() {
-  return union_type("Compost.VerticalAlign", [], VerticalAlign, () => ["Baseline", "Middle", "Hanging"]);
-}
-export const continuous = declare(function Compost_continuous(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function continuous$reflection($gen$$44) {
-  return union_type("Compost.continuous", [$gen$$44], continuous, () => [["CO", [["Item", float64_type]]]]);
-}
-export const categorical = declare(function Compost_categorical(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function categorical$reflection($gen$$45) {
-  return union_type("Compost.categorical", [$gen$$45], categorical, () => [["CA", [["Item", string_type]]]]);
-}
-export const Value = declare(function Compost_Value(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Value$reflection($gen$$46) {
-  return union_type("Compost.Value", [$gen$$46], Value, () => [["CAR", [["Item1", categorical$reflection($gen$$46)], ["Item2", float64_type]]], ["COV", [["Item", continuous$reflection($gen$$46)]]]]);
-}
-export const Scale = declare(function Compost_Scale(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Scale$reflection($gen$$47) {
-  return union_type("Compost.Scale", [$gen$$47], Scale, () => [["Continuous", [["Item1", continuous$reflection($gen$$47)], ["Item2", continuous$reflection($gen$$47)]]], ["Categorical", [["Item", array_type(categorical$reflection($gen$$47))]]]]);
-}
-export const Style = declare(function Compost_Style(StrokeColor, StrokeWidth, StrokeDashArray, Fill, Animation, Font, Cursor, FormatAxisXLabel, FormatAxisYLabel) {
-  this.StrokeColor = StrokeColor;
-  this.StrokeWidth = StrokeWidth;
-  this.StrokeDashArray = StrokeDashArray;
-  this.Fill = Fill;
-  this.Animation = Animation;
-  this.Font = Font;
-  this.Cursor = Cursor;
-  this.FormatAxisXLabel = FormatAxisXLabel;
-  this.FormatAxisYLabel = FormatAxisYLabel;
-}, Record);
-export function Style$reflection() {
-  return record_type("Compost.Style", [], Style, () => [["StrokeColor", tuple_type(float64_type, Color$reflection())], ["StrokeWidth", Width$reflection()], ["StrokeDashArray", class_type("System.Collections.Generic.IEnumerable`1", [Number$$reflection()])], ["Fill", FillStyle$reflection()], ["Animation", option_type(tuple_type(int32_type, string_type, lambda_type(Style$reflection(), Style$reflection())))], ["Font", string_type], ["Cursor", string_type], ["FormatAxisXLabel", lambda_type(Scale$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), lambda_type(Value$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), string_type))], ["FormatAxisYLabel", lambda_type(Scale$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), lambda_type(Value$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), string_type))]]);
-}
-export const EventHandler = declare(function Compost_EventHandler(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function EventHandler$reflection($gen$$48, $gen$$49) {
-  return union_type("Compost.EventHandler", [$gen$$48, $gen$$49], EventHandler, () => [["MouseMove", [["Item", lambda_type(class_type("Browser.Types.MouseEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["MouseUp", [["Item", lambda_type(class_type("Browser.Types.MouseEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["MouseDown", [["Item", lambda_type(class_type("Browser.Types.MouseEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["Click", [["Item", lambda_type(class_type("Browser.Types.MouseEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["TouchStart", [["Item", lambda_type(class_type("Browser.Types.TouchEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["TouchMove", [["Item", lambda_type(class_type("Browser.Types.TouchEvent"), lambda_type(tuple_type(Value$reflection($gen$$48), Value$reflection($gen$$49)), unit_type))]]], ["TouchEnd", [["Item", lambda_type(class_type("Browser.Types.TouchEvent"), unit_type)]]], ["MouseLeave", [["Item", lambda_type(class_type("Browser.Types.MouseEvent"), unit_type)]]]]);
-}
-export const Orientation = declare(function Compost_Orientation(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Orientation$reflection() {
-  return union_type("Compost.Orientation", [], Orientation, () => ["Vertical", "Horizontal"]);
-}
-export const Shape = declare(function Compost_Shape(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Shape$reflection($gen$$50, $gen$$51) {
-  return union_type("Compost.Shape", [$gen$$50, $gen$$51], Shape, () => [["Style", [["Item1", lambda_type(Style$reflection(), Style$reflection())], ["Item2", Shape$reflection($gen$$50, $gen$$51)]]], ["Text", [["Item1", Value$reflection($gen$$50)], ["Item2", Value$reflection($gen$$51)], ["Item3", VerticalAlign$reflection()], ["Item4", HorizontalAlign$reflection()], ["Item5", float64_type], ["Item6", string_type]]], ["AutoScale", [["Item1", bool_type], ["Item2", bool_type], ["Item3", Shape$reflection($gen$$50, $gen$$51)]]], ["InnerScale", [["Item1", option_type(Scale$reflection($gen$$50))], ["Item2", option_type(Scale$reflection($gen$$51))], ["Item3", Shape$reflection($gen$$50, $gen$$51)]]], ["NestX", [["Item1", Value$reflection($gen$$50)], ["Item2", Value$reflection($gen$$50)], ["Item3", Shape$reflection($gen$$50, $gen$$51)]]], ["NestY", [["Item1", Value$reflection($gen$$51)], ["Item2", Value$reflection($gen$$51)], ["Item3", Shape$reflection($gen$$50, $gen$$51)]]], ["Line", [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(Value$reflection($gen$$50), Value$reflection($gen$$51))])]]], ["Bubble", [["Item1", Value$reflection($gen$$50)], ["Item2", Value$reflection($gen$$51)], ["Item3", float64_type], ["Item4", float64_type]]], ["Shape", [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(Value$reflection($gen$$50), Value$reflection($gen$$51))])]]], ["Layered", [["Item", class_type("System.Collections.Generic.IEnumerable`1", [Shape$reflection($gen$$50, $gen$$51)])]]], ["Axes", [["Item1", bool_type], ["Item2", bool_type], ["Item3", bool_type], ["Item4", bool_type], ["Item5", Shape$reflection($gen$$50, $gen$$51)]]], ["Interactive", [["Item1", class_type("System.Collections.Generic.IEnumerable`1", [EventHandler$reflection($gen$$50, $gen$$51)])], ["Item2", Shape$reflection($gen$$50, $gen$$51)]]], ["Padding", [["Item1", tuple_type(float64_type, float64_type, float64_type, float64_type)], ["Item2", Shape$reflection($gen$$50, $gen$$51)]]], ["Offset", [["Item1", tuple_type(float64_type, float64_type)], ["Item2", Shape$reflection($gen$$50, $gen$$51)]]]]);
-}
-export const Svg$002EStringBuilder = declare(function Compost_Svg_StringBuilder() {
-  const $this$$1 = this;
-  $this$$1.strs = new List();
-  void null;
-});
-export function Svg$002EStringBuilder$reflection() {
-  return class_type("Compost.Svg.StringBuilder", undefined, Svg$002EStringBuilder);
-}
-export function Svg$002EStringBuilder$$$$002Ector() {
-  return this instanceof Svg$002EStringBuilder ? Svg$002EStringBuilder.call(this) : new Svg$002EStringBuilder();
-}
-export function Svg$002EStringBuilder$$Append$$Z721C83C5(x, s) {
-  x.strs = new List(s, x.strs);
-}
-
-Svg$002EStringBuilder.prototype.toString = function () {
-  const x$$1 = this;
-  return join("", reverse(x$$1.strs));
-};
-
-export const Svg$002EPathSegment = declare(function Compost_Svg_PathSegment(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Svg$002EPathSegment$reflection() {
-  return union_type("Compost.Svg.PathSegment", [], Svg$002EPathSegment, () => [["MoveTo", [["Item", tuple_type(float64_type, float64_type)]]], ["LineTo", [["Item", tuple_type(float64_type, float64_type)]]]]);
-}
-export const Svg$002ESvg = declare(function Compost_Svg_Svg(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Svg$002ESvg$reflection() {
-  return union_type("Compost.Svg.Svg", [], Svg$002ESvg, () => [["Path", [["Item1", array_type(Svg$002EPathSegment$reflection())], ["Item2", string_type]]], ["Ellipse", [["Item1", tuple_type(float64_type, float64_type)], ["Item2", tuple_type(float64_type, float64_type)], ["Item3", string_type]]], ["Rect", [["Item1", tuple_type(float64_type, float64_type)], ["Item2", tuple_type(float64_type, float64_type)], ["Item3", string_type]]], ["Text", [["Item1", tuple_type(float64_type, float64_type)], ["Item2", string_type], ["Item3", float64_type], ["Item4", string_type]]], ["Combine", [["Item", array_type(Svg$002ESvg$reflection())]]], "Empty"]);
-}
-export function Svg$$$mapSvg(f, _arg1) {
-  if (_arg1.tag === 4) {
-    return new Svg$002ESvg(4, "Combine", map(function (_arg1$$1) {
-      return Svg$$$mapSvg(f, _arg1$$1);
-    }, _arg1.fields[0], Array));
-  } else {
-    return f(_arg1);
-  }
-}
-export function Svg$$$formatPath(path) {
-  const sb = Svg$002EStringBuilder$$$$002Ector();
-  iterate(function (ps) {
-    if (ps.tag === 1) {
-      Svg$002EStringBuilder$$Append$$Z721C83C5(sb, "L" + ps.fields[0][0].toString() + " " + ps.fields[0][1].toString() + " ");
-    } else {
-      Svg$002EStringBuilder$$Append$$Z721C83C5(sb, "M" + ps.fields[0][0].toString() + " " + ps.fields[0][1].toString() + " ");
-    }
-  }, path);
-  return String(sb);
-}
-export const Svg$002ERenderingContext = declare(function Compost_Svg_RenderingContext(Definitions) {
-  this.Definitions = Definitions;
-}, Record);
-export function Svg$002ERenderingContext$reflection() {
-  return record_type("Compost.Svg.RenderingContext", [], Svg$002ERenderingContext, () => [["Definitions", array_type(DomNode$0024reflection())]]);
-}
-export function Svg$$$renderSvg(ctx, svg$$1) {
-  return delay(function () {
-    switch (svg$$1.tag) {
-      case 3:
-        {
-          const attrs = ofSeq(delay(function () {
-            return append(singleton(op_EqualsGreater("style", svg$$1.fields[3])), delay(function () {
-              return svg$$1.fields[2] === 0 ? append(singleton(op_EqualsGreater("x", svg$$1.fields[0][0].toString())), delay(function () {
-                return singleton(op_EqualsGreater("y", svg$$1.fields[0][1].toString()));
-              })) : append(singleton(op_EqualsGreater("x", "0")), delay(function () {
-                return append(singleton(op_EqualsGreater("y", "0")), delay(function () {
-                  var clo1, clo2, clo3;
-                  return singleton(op_EqualsGreater("transform", (clo1 = toText(printf("translate(%f,%f) rotate(%f)")), clo2 = clo1(svg$$1.fields[0][0]), clo3 = clo2(svg$$1.fields[0][1]), clo3(svg$$1.fields[2]))));
-                }));
-              }));
-            }));
-          }));
-          return singleton(function (arg0) {
-            return function (arg1) {
-              return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0, arg1);
-            };
-          }(s$$19)("text")(attrs)(new List(text(svg$$1.fields[1]), new List())));
-        }
-
-      case 4:
-        {
-          return collect(function (s$$1) {
-            return Svg$$$renderSvg(ctx, s$$1);
-          }, svg$$1.fields[0]);
-        }
-
-      case 1:
-        {
-          const attrs$$1 = ofArray([op_EqualsGreater("cx", svg$$1.fields[0][0].toString()), op_EqualsGreater("cy", svg$$1.fields[0][1].toString()), op_EqualsGreater("rx", svg$$1.fields[1][0].toString()), op_EqualsGreater("ry", svg$$1.fields[1][1].toString()), op_EqualsGreater("style", svg$$1.fields[2])]);
-          return singleton(function (arg0$$1) {
-            return function (arg1$$1) {
-              return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0$$1, arg1$$1);
-            };
-          }(s$$19)("ellipse")(attrs$$1)(new List()));
-        }
-
-      case 2:
-        {
-          const patternInput = [min(comparePrimitives, svg$$1.fields[0][0], svg$$1.fields[1][0]), min(comparePrimitives, svg$$1.fields[0][1], svg$$1.fields[1][1])];
-          const patternInput$$1 = [Math.abs(svg$$1.fields[0][0] - svg$$1.fields[1][0]), Math.abs(svg$$1.fields[0][1] - svg$$1.fields[1][1])];
-          const attrs$$2 = ofArray([op_EqualsGreater("x", patternInput[0].toString()), op_EqualsGreater("y", patternInput[1].toString()), op_EqualsGreater("width", patternInput$$1[0].toString()), op_EqualsGreater("height", patternInput$$1[1].toString()), op_EqualsGreater("style", svg$$1.fields[2])]);
-          return singleton(function (arg0$$2) {
-            return function (arg1$$2) {
-              return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0$$2, arg1$$2);
-            };
-          }(s$$19)("rect")(attrs$$2)(new List()));
-        }
-
-      case 0:
-        {
-          const attrs$$3 = ofArray([op_EqualsGreater("d", Svg$$$formatPath(svg$$1.fields[0])), op_EqualsGreater("style", svg$$1.fields[1])]);
-          return singleton(function (arg0$$3) {
-            return function (arg1$$3) {
-              return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0$$3, arg1$$3);
-            };
-          }(s$$19)("path")(attrs$$3)(new List()));
-        }
-
-      default:
-        {
-          void null;
-          return empty();
-        }
-    }
-  });
-}
-export function Svg$$$formatColor(_arg1$$2) {
-  if (_arg1$$2.tag === 1) {
-    return _arg1$$2.fields[0];
-  } else {
-    const clo1$$1 = toText(printf("rgb(%d, %d, %d)"));
-    const clo2$$1 = clo1$$1(_arg1$$2.fields[0]);
-    const clo3$$1 = clo2$$1(_arg1$$2.fields[1]);
-    return clo3$$1(_arg1$$2.fields[2]);
-  }
-}
-export function Svg$$$formatNumber(_arg1$$3) {
-  if (_arg1$$3.tag === 1) {
-    return _arg1$$3.fields[0].toString() + "%";
-  } else {
-    return int32ToString(_arg1$$3.fields[0]);
-  }
-}
-export function Svg$$$formatStyle(defs, style$$4) {
-  var copyOfStruct, Animation, inputRecord, Animation$$1, clo1$$2, clo2$$2, clo3$$2, clo1$$3, clo2$$3, clo3$$3, arg30$$4, clo1$$4, clo2$$4, clo3$$4, arg20$$5, clo1$$6, clo2$$5, id$$1, copyOfStruct$$1, arg00$$1, clo1$$5;
-  let patternInput$$2;
-
-  if (style$$4.Animation == null) {
-    patternInput$$2 = [style$$4, ""];
-  } else {
-    const ms = style$$4.Animation[0] | 0;
-    const ease = style$$4.Animation[1];
-    const anim = style$$4.Animation[2];
-    const id = "anim_" + replace((copyOfStruct = newGuid(), copyOfStruct), "-", "");
-    const fromstyle = Svg$$$formatStyle(defs, (Animation = undefined, new Style(style$$4.StrokeColor, style$$4.StrokeWidth, style$$4.StrokeDashArray, style$$4.Fill, Animation, style$$4.Font, style$$4.Cursor, style$$4.FormatAxisXLabel, style$$4.FormatAxisYLabel)));
-    const tostyle = Svg$$$formatStyle(defs, (inputRecord = anim(style$$4), (Animation$$1 = undefined, new Style(inputRecord.StrokeColor, inputRecord.StrokeWidth, inputRecord.StrokeDashArray, inputRecord.Fill, Animation$$1, inputRecord.Font, inputRecord.Cursor, inputRecord.FormatAxisXLabel, inputRecord.FormatAxisYLabel))));
-
-    const arg00 = function (arg0$$4) {
-      return function (arg1$$4) {
-        return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0$$4, arg1$$4);
-      };
-    }(h$$13)("style")(new List())(new List(text((clo1$$2 = toText(printf("@keyframes %s { from { %s } to { %s } }")), clo2$$2 = clo1$$2(id), clo3$$2 = clo2$$2(fromstyle), clo3$$2(tostyle))), new List()));
-
-    void defs.push(arg00);
-    patternInput$$2 = [anim(style$$4), (clo1$$3 = toText(printf("animation: %s %dms %s; ")), clo2$$3 = clo1$$3(id), clo3$$3 = clo2$$3(ms), clo3$$3(ease))];
-  }
-
-  return patternInput$$2[1] + join("", ofSeq(delay(function () {
-    return map$$1(function (c) {
-      return "cursor:" + c + ";";
-    }, patternInput$$2[0].Cursor.split(","));
-  }))) + ("font:" + patternInput$$2[0].Font + ";") + (arg30$$4 = Svg$$$formatColor(patternInput$$2[0].StrokeColor[1]), (clo1$$4 = toText(printf("stroke-opacity:%f; stroke-width:%dpx; stroke:%s; ")), clo2$$4 = clo1$$4(patternInput$$2[0].StrokeColor[0]), clo3$$4 = clo2$$4(patternInput$$2[0].StrokeWidth.fields[0]), clo3$$4(arg30$$4))) + (isEmpty(patternInput$$2[0].StrokeDashArray) ? "" : "stroke-dasharray:" + join(",", map$$1(Svg$$$formatNumber, patternInput$$2[0].StrokeDashArray)) + ";") + (patternInput$$2[0].Fill.tag === 0 ? (arg20$$5 = Svg$$$formatColor(patternInput$$2[0].Fill.fields[0][1]), (clo1$$6 = toText(printf("fill-opacity:%f; fill:%s; ")), clo2$$5 = clo1$$6(patternInput$$2[0].Fill.fields[0][0]), clo2$$5(arg20$$5))) : (id$$1 = "gradient_" + replace((copyOfStruct$$1 = newGuid(), copyOfStruct$$1), "-", ""), ((arg00$$1 = (El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(s$$19, "linearGradient"))(new List(op_EqualsGreater("id", id$$1), new List()))(ofSeq(delay(function () {
-    return collect(function (matchValue$$2) {
-      return singleton((El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(s$$19, "stop"))(ofArray([op_EqualsGreater("offset", matchValue$$2[0].toString() + "%"), op_EqualsGreater("stop-color", Svg$$$formatColor(matchValue$$2[1][1])), op_EqualsGreater("stop-opacity", matchValue$$2[1][0].toString())]))(new List()));
-    }, patternInput$$2[0].Fill.fields[0]);
-  }))), (void defs.push(arg00$$1))), (clo1$$5 = toText(printf("fill:url(#%s)")), clo1$$5(id$$1)))));
-}
-export const Scales$002EScaledShape = declare(function Compost_Scales_ScaledShape(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Scales$002EScaledShape$reflection($gen$$63, $gen$$64) {
-  return union_type("Compost.Scales.ScaledShape", [$gen$$63, $gen$$64], Scales$002EScaledShape, () => [["ScaledStyle", [["Item1", lambda_type(Style$reflection(), Style$reflection())], ["Item2", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]], ["ScaledText", [["Item1", Value$reflection($gen$$63)], ["Item2", Value$reflection($gen$$64)], ["Item3", VerticalAlign$reflection()], ["Item4", HorizontalAlign$reflection()], ["Item5", float64_type], ["Item6", string_type]]], ["ScaledLine", [["Item", array_type(tuple_type(Value$reflection($gen$$63), Value$reflection($gen$$64)))]]], ["ScaledBubble", [["Item1", Value$reflection($gen$$63)], ["Item2", Value$reflection($gen$$64)], ["Item3", float64_type], ["Item4", float64_type]]], ["ScaledShape", [["Item", array_type(tuple_type(Value$reflection($gen$$63), Value$reflection($gen$$64)))]]], ["ScaledLayered", [["Item", array_type(Scales$002EScaledShape$reflection($gen$$63, $gen$$64))]]], ["ScaledInteractive", [["Item1", class_type("System.Collections.Generic.IEnumerable`1", [EventHandler$reflection($gen$$63, $gen$$64)])], ["Item2", Scale$reflection($gen$$63)], ["Item3", Scale$reflection($gen$$64)], ["Item4", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]], ["ScaledPadding", [["Item1", tuple_type(float64_type, float64_type, float64_type, float64_type)], ["Item2", Scale$reflection($gen$$63)], ["Item3", Scale$reflection($gen$$64)], ["Item4", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]], ["ScaledOffset", [["Item1", tuple_type(float64_type, float64_type)], ["Item2", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]], ["ScaledNestX", [["Item1", Value$reflection($gen$$63)], ["Item2", Value$reflection($gen$$63)], ["Item3", Scale$reflection($gen$$63)], ["Item4", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]], ["ScaledNestY", [["Item1", Value$reflection($gen$$64)], ["Item2", Value$reflection($gen$$64)], ["Item3", Scale$reflection($gen$$64)], ["Item4", Scales$002EScaledShape$reflection($gen$$63, $gen$$64)]]]]);
-}
-export function Scales$$$getExtremes(_arg1$$5) {
-  if (_arg1$$5.tag === 1) {
-    return [new Value(0, "CAR", _arg1$$5.fields[0][0], 0), new Value(0, "CAR", _arg1$$5.fields[0][_arg1$$5.fields[0].length - 1], 1)];
-  } else {
-    return [new Value(1, "COV", _arg1$$5.fields[0]), new Value(1, "COV", _arg1$$5.fields[1])];
-  }
-}
-export function Scales$$$calculateMagnitudeAndRange(lo, hi) {
-  const magnitude = Math.pow(10, round(Math.log10(hi - lo)));
-  const magnitude$$1 = magnitude / 2;
-  return [magnitude$$1, [Math.floor(lo / magnitude$$1) * magnitude$$1, Math.ceil(hi / magnitude$$1) * magnitude$$1]];
-}
-export function Scales$$$decimalPoints(range_0, range_1) {
-  const patternInput$$5 = Scales$$$calculateMagnitudeAndRange(range_0, range_1);
-  return max(comparePrimitives, 0, Math.ceil(-Math.log10(patternInput$$5[0])));
-}
-export function Scales$$$adjustRange(range_0$$1, range_1$$1) {
-  return Scales$$$calculateMagnitudeAndRange(range_0$$1, range_1$$1)[1];
-}
-export function Scales$$$adjustRangeUnits(l$$2, h$$2) {
-  const patternInput$$6 = Scales$$$adjustRange(l$$2, h$$2);
-  return [patternInput$$6[0], patternInput$$6[1]];
-}
-export function Scales$$$toArray(s$$2) {
-  return ofSeq$$1(s$$2, Array);
-}
-export function Scales$$$generateSteps(count, k, lo$$3, hi$$3) {
-  const patternInput$$7 = Scales$$$calculateMagnitudeAndRange(lo$$3, hi$$3);
-  const dividers = ofArray([0.2, 0.5, 1, 2, 5, 10, 20, 40, 50, 60, 80, 100]);
-  let magnitudes;
-  magnitudes = map$$1(function mapping(d) {
-    return patternInput$$7[0] / d;
-  }, dividers);
-  let step;
-  let source$$2;
-  source$$2 = filter(function predicate(m) {
-    return (hi$$3 - lo$$3) / m >= count;
-  }, magnitudes);
-  step = tryHead(source$$2);
-  const step$$1 = defaultArg(step, patternInput$$7[0] / 100);
-  const s$$3 = delay(function () {
-    return collect(function (v) {
-      return (v >= lo$$3 ? v <= hi$$3 : false) ? singleton(v) : empty();
-    }, rangeNumber(patternInput$$7[1][0], step$$1 * k, patternInput$$7[1][1]));
-  });
-  return Scales$$$toArray(s$$3);
-}
-export function Scales$$$generateAxisSteps(s$$4) {
-  if (s$$4.tag === 1) {
-    return ofSeq$$1(delay(function () {
-      return collect(function (matchValue$$3) {
-        return singleton(new Value(0, "CAR", new categorical(0, "CA", matchValue$$3.fields[0]), 0.5));
-      }, s$$4.fields[0]);
-    }), Array);
-  } else {
-    const array = Scales$$$generateSteps(6, 1, s$$4.fields[0].fields[0], s$$4.fields[1].fields[0]);
-    return map(function mapping$$1(f$$1) {
-      return new Value(1, "COV", new continuous(0, "CO", f$$1));
-    }, array, Array);
-  }
-}
-export function Scales$$$generateAxisLabels(fmt, s$$6) {
-  const sunit = s$$6;
-
-  if (s$$6.tag === 1) {
-    return ofSeq$$1(delay(function () {
-      return collect(function (matchValue$$4) {
-        return singleton([new Value(0, "CAR", new categorical(0, "CA", matchValue$$4.fields[0]), 0.5), fmt(sunit, new Value(0, "CAR", new categorical(0, "CA", matchValue$$4.fields[0]), 0.5))]);
-      }, s$$6.fields[0]);
-    }), Array);
-  } else {
-    const array$$1 = Scales$$$generateSteps(6, 2, s$$6.fields[0].fields[0], s$$6.fields[1].fields[0]);
-    return map(function mapping$$2(f$$2) {
-      return [new Value(1, "COV", new continuous(0, "CO", f$$2)), fmt(sunit, new Value(1, "COV", new continuous(0, "CO", f$$2)))];
-    }, array$$1, Array);
-  }
-}
-export function Scales$$$unionScales(s1, s2) {
-  var $target$$88, h1, h2, l1, l2, v1, v2;
-
-  if (s1.tag === 1) {
-    if (s2.tag === 1) {
-      $target$$88 = 1;
-      v1 = s1.fields[0];
-      v2 = s2.fields[0];
-    } else {
-      $target$$88 = 2;
-    }
-  } else if (s2.tag === 0) {
-    $target$$88 = 0;
-    h1 = s1.fields[1];
-    h2 = s2.fields[1];
-    l1 = s1.fields[0];
-    l2 = s2.fields[0];
-  } else {
-    $target$$88 = 2;
-  }
-
-  switch ($target$$88) {
-    case 0:
-      {
-        return new Scale(0, "Continuous", min(function ($x$$8, $y$$9) {
-          return $x$$8.CompareTo($y$$9);
-        }, l1, l2), max(function ($x$$10, $y$$11) {
-          return $x$$10.CompareTo($y$$11);
-        }, h1, h2));
-      }
-
-    case 1:
-      {
-        return new Scale(1, "Categorical", distinct(append$$1(v1, v2, Array), {
-          Equals: equals,
-          GetHashCode: structuralHash
-        }));
-      }
-
-    case 2:
-      {
-        throw new Error("Cannot union continuous with categorical");
-      }
-  }
-}
-export function Scales$$$calculateShapeScale(vals$$1) {
-  let scales;
-  const state$$1 = new Choice(0, "Choice1Of3", void null);
-  scales = fold(function folder(state, value) {
-    var $target$$92, v$$2, v$$3, vs$$2, x$$5, x$$6, xs;
-
-    if (state.tag === 1) {
-      if (value.tag === 1) {
-        $target$$92 = 1;
-        v$$3 = value.fields[0].fields[0];
-        vs$$2 = state.fields[0];
-      } else {
-        $target$$92 = 4;
-      }
-    } else if (state.tag === 2) {
-      if (value.tag === 0) {
-        $target$$92 = 3;
-        x$$6 = value.fields[0].fields[0];
-        xs = state.fields[0];
-      } else {
-        $target$$92 = 4;
-      }
-    } else if (value.tag === 0) {
-      $target$$92 = 2;
-      x$$5 = value.fields[0].fields[0];
-    } else {
-      $target$$92 = 0;
-      v$$2 = value.fields[0].fields[0];
-    }
-
-    switch ($target$$92) {
-      case 0:
-        {
-          return new Choice(1, "Choice2Of3", new List(v$$2, new List()));
-        }
-
-      case 1:
-        {
-          return new Choice(1, "Choice2Of3", new List(v$$3, vs$$2));
-        }
-
-      case 2:
-        {
-          return new Choice(2, "Choice3Of3", new List(x$$5, new List()));
-        }
-
-      case 3:
-        {
-          return new Choice(2, "Choice3Of3", new List(x$$6, xs));
-        }
-
-      case 4:
-        {
-          throw new Error("Values with mismatching scales");
-        }
-    }
-  }, state$$1, vals$$1);
-
-  switch (scales.tag) {
-    case 1:
-      {
-        return new Scale(0, "Continuous", new continuous(0, "CO", min$$1(scales.fields[0], {
-          Compare: comparePrimitives
-        })), new continuous(0, "CO", max$$1(scales.fields[0], {
-          Compare: comparePrimitives
-        })));
-      }
-
-    case 2:
-      {
-        return new Scale(1, "Categorical", distinct(ofSeq$$1(delay(function () {
-          return map$$1(function (x$$7) {
-            return new categorical(0, "CA", x$$7);
-          }, reverse(scales.fields[0]));
-        }), Array), {
-          Equals: equals,
-          GetHashCode: structuralHash
-        }));
-      }
-
-    default:
-      {
-        throw new Error("No values for calculating a scale");
-      }
-  }
-}
-export function Scales$$$calculateShapeScales(points$$1) {
-  let xs$$2;
-  xs$$2 = map(function mapping$$3(tuple) {
-    return tuple[0];
-  }, points$$1, Array);
-  let ys;
-  ys = map(function mapping$$4(tuple$$1) {
-    return tuple$$1[1];
-  }, points$$1, Array);
-  return [Scales$$$calculateShapeScale(xs$$2), Scales$$$calculateShapeScale(ys)];
-}
-export function Scales$$$calculateScales(style$$6, shape) {
-  const calculateScales = function calculateScales(shape$$2) {
-    return Scales$$$calculateScales(style$$6, shape$$2);
-  };
-
-  switch (shape.tag) {
-    case 4:
-      {
-        const patternInput$$9 = calculateScales(shape.fields[2]);
-        return [[Scales$$$calculateShapeScale([shape.fields[0], shape.fields[1]]), patternInput$$9[0][1]], new Scales$002EScaledShape(9, "ScaledNestX", shape.fields[0], shape.fields[1], patternInput$$9[0][0], patternInput$$9[1])];
-      }
-
-    case 5:
-      {
-        const patternInput$$10 = calculateScales(shape.fields[2]);
-        return [[patternInput$$10[0][0], Scales$$$calculateShapeScale([shape.fields[0], shape.fields[1]])], new Scales$002EScaledShape(10, "ScaledNestY", shape.fields[0], shape.fields[1], patternInput$$10[0][1], patternInput$$10[1])];
-      }
-
-    case 3:
-      {
-        const patternInput$$11 = calculateScales(shape.fields[2]);
-        let sx$$2;
-
-        if (shape.fields[0] != null) {
-          const sx$$1 = shape.fields[0];
-          sx$$2 = sx$$1;
-        } else {
-          sx$$2 = patternInput$$11[0][0];
-        }
-
-        let sy$$2;
-
-        if (shape.fields[1] != null) {
-          const sy$$1 = shape.fields[1];
-          sy$$2 = sy$$1;
-        } else {
-          sy$$2 = patternInput$$11[0][1];
-        }
-
-        return [[sx$$2, sy$$2], patternInput$$11[1]];
-      }
-
-    case 2:
-      {
-        const patternInput$$12 = calculateScales(shape.fields[2]);
-
-        const autoScale = function autoScale(_arg1$$6) {
-          if (_arg1$$6.tag === 0) {
-            const patternInput$$13 = Scales$$$adjustRangeUnits(_arg1$$6.fields[0].fields[0], _arg1$$6.fields[1].fields[0]);
-            return new Scale(0, "Continuous", new continuous(0, "CO", patternInput$$13[0]), new continuous(0, "CO", patternInput$$13[1]));
-          } else {
-            return _arg1$$6;
-          }
-        };
-
-        const scales$$2 = [shape.fields[0] ? autoScale(patternInput$$12[0][0]) : patternInput$$12[0][0], shape.fields[1] ? autoScale(patternInput$$12[0][1]) : patternInput$$12[0][1]];
-        return [scales$$2, patternInput$$12[1]];
-      }
-
-    case 13:
-      {
-        const patternInput$$14 = calculateScales(shape.fields[1]);
-        return [patternInput$$14[0], new Scales$002EScaledShape(8, "ScaledOffset", shape.fields[0], patternInput$$14[1])];
-      }
-
-    case 12:
-      {
-        const patternInput$$15 = calculateScales(shape.fields[1]);
-        return [[patternInput$$15[0][0], patternInput$$15[0][1]], new Scales$002EScaledShape(7, "ScaledPadding", shape.fields[0], patternInput$$15[0][0], patternInput$$15[0][1], patternInput$$15[1])];
-      }
-
-    case 7:
-      {
-        const makeSingletonScale = function makeSingletonScale(_arg2) {
-          if (_arg2.tag === 0) {
-            return new Scale(1, "Categorical", [_arg2.fields[0]]);
-          } else {
-            return new Scale(0, "Continuous", _arg2.fields[0], _arg2.fields[0]);
-          }
-        };
-
-        const scales$$4 = [makeSingletonScale(shape.fields[0]), makeSingletonScale(shape.fields[1])];
-        return [scales$$4, new Scales$002EScaledShape(3, "ScaledBubble", shape.fields[0], shape.fields[1], shape.fields[2], shape.fields[3])];
-      }
-
-    case 1:
-      {
-        const makeSingletonScale$$1 = function makeSingletonScale$$1(_arg3) {
-          if (_arg3.tag === 0) {
-            return new Scale(1, "Categorical", [_arg3.fields[0]]);
-          } else {
-            return new Scale(0, "Continuous", _arg3.fields[0], _arg3.fields[0]);
-          }
-        };
-
-        const scales$$5 = [makeSingletonScale$$1(shape.fields[0]), makeSingletonScale$$1(shape.fields[1])];
-        return [scales$$5, new Scales$002EScaledShape(1, "ScaledText", shape.fields[0], shape.fields[1], shape.fields[2], shape.fields[3], shape.fields[4], shape.fields[5])];
-      }
-
-    case 6:
-      {
-        const line$$1 = ofSeq$$1(shape.fields[0], Array);
-        const scales$$6 = Scales$$$calculateShapeScales(line$$1);
-        return [scales$$6, new Scales$002EScaledShape(2, "ScaledLine", line$$1)];
-      }
-
-    case 8:
-      {
-        const points$$3 = ofSeq$$1(shape.fields[0], Array);
-        const scales$$7 = Scales$$$calculateShapeScales(points$$3);
-        return [scales$$7, new Scales$002EScaledShape(4, "ScaledShape", points$$3)];
-      }
-
-    case 10:
-      {
-        const patternInput$$16 = calculateScales(shape.fields[4]);
-        const patternInput$$17 = [Scales$$$getExtremes(patternInput$$16[0][0]), Scales$$$getExtremes(patternInput$$16[0][1])];
-
-        const LineStyle = function LineStyle(clr$$4, alpha, width, shape$$18) {
-          return new Shape(0, "Style", function (s$$8) {
-            const Fill = new FillStyle(0, "Solid", [1, new Color(1, "HTML", "transparent")]);
-            const StrokeWidth = new Width(0, "Pixels", width);
-            return new Style([alpha, new Color(1, "HTML", clr$$4)], StrokeWidth, s$$8.StrokeDashArray, Fill, s$$8.Animation, s$$8.Font, s$$8.Cursor, s$$8.FormatAxisXLabel, s$$8.FormatAxisYLabel);
-          }, shape$$18);
-        };
-
-        const FontStyle = function FontStyle(style$$8, shape$$19) {
-          return new Shape(0, "Style", function (s$$9) {
-            const Fill$$1 = new FillStyle(0, "Solid", [1, new Color(1, "HTML", "black")]);
-            return new Style([0, new Color(1, "HTML", "transparent")], s$$9.StrokeWidth, s$$9.StrokeDashArray, Fill$$1, s$$9.Animation, style$$8, s$$9.Cursor, s$$9.FormatAxisXLabel, s$$9.FormatAxisYLabel);
-          }, shape$$19);
-        };
-
-        const shape$$20 = new Shape(9, "Layered", ofSeq(delay(function () {
-          return append(map$$1(function (x$$10) {
-            return LineStyle("#e4e4e4", 1, 1, new Shape(6, "Line", [[x$$10, patternInput$$17[1][0]], [x$$10, patternInput$$17[1][1]]]));
-          }, Scales$$$generateAxisSteps(patternInput$$16[0][0])), delay(function () {
-            return append(map$$1(function (y$$5) {
-              return LineStyle("#e4e4e4", 1, 1, new Shape(6, "Line", [[patternInput$$17[0][0], y$$5], [patternInput$$17[0][1], y$$5]]));
-            }, Scales$$$generateAxisSteps(patternInput$$16[0][1])), delay(function () {
-              return append(shape.fields[0] ? append(singleton(LineStyle("black", 1, 2, new Shape(6, "Line", [[patternInput$$17[0][0], patternInput$$17[1][1]], [patternInput$$17[0][1], patternInput$$17[1][1]]]))), delay(function () {
-                return collect(function (matchValue$$7) {
-                  return singleton(FontStyle("9pt sans-serif", new Shape(13, "Offset", [0, -10], new Shape(1, "Text", matchValue$$7[0], patternInput$$17[1][1], new VerticalAlign(0, "Baseline"), new HorizontalAlign(1, "Center"), 0, matchValue$$7[1]))));
-                }, Scales$$$generateAxisLabels(style$$6.FormatAxisXLabel, patternInput$$16[0][0]));
-              })) : empty(), delay(function () {
-                return append(shape.fields[1] ? append(singleton(LineStyle("black", 1, 2, new Shape(6, "Line", [[patternInput$$17[0][1], patternInput$$17[1][1]], [patternInput$$17[0][1], patternInput$$17[1][0]]]))), delay(function () {
-                  return collect(function (matchValue$$8) {
-                    return singleton(FontStyle("9pt sans-serif", new Shape(13, "Offset", [10, 0], new Shape(1, "Text", patternInput$$17[0][1], matchValue$$8[0], new VerticalAlign(1, "Middle"), new HorizontalAlign(0, "Start"), 0, matchValue$$8[1]))));
-                  }, Scales$$$generateAxisLabels(style$$6.FormatAxisYLabel, patternInput$$16[0][1]));
-                })) : empty(), delay(function () {
-                  return append(shape.fields[2] ? append(singleton(LineStyle("black", 1, 2, new Shape(6, "Line", [[patternInput$$17[0][0], patternInput$$17[1][0]], [patternInput$$17[0][1], patternInput$$17[1][0]]]))), delay(function () {
-                    return collect(function (matchValue$$9) {
-                      return singleton(FontStyle("9pt sans-serif", new Shape(13, "Offset", [0, 10], new Shape(1, "Text", matchValue$$9[0], patternInput$$17[1][0], new VerticalAlign(2, "Hanging"), new HorizontalAlign(1, "Center"), 0, matchValue$$9[1]))));
-                    }, Scales$$$generateAxisLabels(style$$6.FormatAxisXLabel, patternInput$$16[0][0]));
-                  })) : empty(), delay(function () {
-                    return append(shape.fields[3] ? append(singleton(LineStyle("black", 1, 2, new Shape(6, "Line", [[patternInput$$17[0][0], patternInput$$17[1][1]], [patternInput$$17[0][0], patternInput$$17[1][0]]]))), delay(function () {
-                      return collect(function (matchValue$$10) {
-                        return singleton(FontStyle("9pt sans-serif", new Shape(13, "Offset", [-10, 0], new Shape(1, "Text", patternInput$$17[0][0], matchValue$$10[0], new VerticalAlign(1, "Middle"), new HorizontalAlign(2, "End"), 0, matchValue$$10[1]))));
-                      }, Scales$$$generateAxisLabels(style$$6.FormatAxisYLabel, patternInput$$16[0][1]));
-                    })) : empty(), delay(function () {
-                      return singleton(shape.fields[4]);
-                    }));
-                  }));
-                }));
-              }));
-            }));
-          }));
-        })));
-        const padding = [shape.fields[0] ? 30 : 0, shape.fields[1] ? 50 : 0, shape.fields[2] ? 30 : 0, shape.fields[3] ? 50 : 0];
-        return calculateScales(new Shape(12, "Padding", padding, shape$$20));
-      }
-
-    case 9:
-      {
-        let shapes$$1;
-        shapes$$1 = ofSeq$$1(shape.fields[0], Array);
-        let scaled;
-        scaled = map(calculateScales, shapes$$1, Array);
-        let sxs;
-        sxs = map(function mapping$$5(tupledArg) {
-          return tupledArg[0][0];
-        }, scaled, Array);
-        let sys;
-        sys = map(function mapping$$6(tupledArg$$1) {
-          return tupledArg$$1[0][1];
-        }, scaled, Array);
-        const scales$$8 = [sxs.reduce(Scales$$$unionScales), sys.reduce(Scales$$$unionScales)];
-        return [scales$$8, new Scales$002EScaledShape(5, "ScaledLayered", map(function (tuple$$2) {
-          return tuple$$2[1];
-        }, scaled, Array))];
-      }
-
-    case 11:
-      {
-        const patternInput$$18 = calculateScales(shape.fields[1]);
-        return [patternInput$$18[0], new Scales$002EScaledShape(6, "ScaledInteractive", shape.fields[0], patternInput$$18[0][0], patternInput$$18[0][1], patternInput$$18[1])];
-      }
-
-    default:
-      {
-        let patternInput$$8;
-        const style$$7 = shape.fields[0](style$$6);
-        patternInput$$8 = Scales$$$calculateScales(style$$7, shape.fields[1]);
-        return [patternInput$$8[0], new Scales$002EScaledShape(0, "ScaledStyle", shape.fields[0], patternInput$$8[1])];
-      }
-  }
-}
-export function Projections$$$projectOne(reversed, tlv, thv, scale$$1, coord) {
-  if (scale$$1.tag === 0) {
-    if (coord.tag === 0) {
-      const clo1$$8 = toFail(printf("Cannot project categorical value (%A) on a continuous scale (%A)."));
-      const clo2$$7 = clo1$$8(coord);
-      return clo2$$7(scale$$1);
-    } else {
-      if (reversed) {
-        return thv - (coord.fields[0].fields[0] - scale$$1.fields[0].fields[0]) / (scale$$1.fields[1].fields[0] - scale$$1.fields[0].fields[0]) * (thv - tlv);
-      } else {
-        return tlv + (coord.fields[0].fields[0] - scale$$1.fields[0].fields[0]) / (scale$$1.fields[1].fields[0] - scale$$1.fields[0].fields[0]) * (thv - tlv);
-      }
-    }
-  } else if (coord.tag === 1) {
-    const clo1$$7 = toFail(printf("Cannot project continuous value (%A) on a categorical scale (%A)."));
-    const clo2$$6 = clo1$$7(coord);
-    return clo2$$6(scale$$1);
-  } else {
-    const size = (thv - tlv) / scale$$1.fields[0].length;
-    let i;
-    i = scale$$1.fields[0].findIndex(function predicate$$1(_arg1$$8) {
-      return coord.fields[0].fields[0] === _arg1$$8.fields[0];
-    });
-    const i$$1 = i + coord.fields[1];
-
-    if (reversed) {
-      return thv - i$$1 * size;
-    } else {
-      return tlv + i$$1 * size;
-    }
-  }
-}
-export function Projections$$$projectOneX(a_0, a_1) {
-  return function (scale$$2) {
-    return function (coord$$1) {
-      return Projections$$$projectOne(false, a_0, a_1, scale$$2, coord$$1);
-    };
-  };
-}
-export function Projections$$$projectOneY(a_0$$1, a_1$$1) {
-  return function (scale$$3) {
-    return function (coord$$2) {
-      return Projections$$$projectOne(true, a_0$$1, a_1$$1, scale$$3, coord$$2);
-    };
-  };
-}
-export function Projections$$$projectInvOne(reversed$$3, l$$12, h$$8, s$$10, v$$10) {
-  if (s$$10.tag === 1) {
-    const size$$1 = (h$$8 - l$$12) / s$$10.fields[0].length;
-    const i$$2 = reversed$$3 ? Math.floor((h$$8 - v$$10) / size$$1) : Math.floor((v$$10 - l$$12) / size$$1);
-    const f$$6 = reversed$$3 ? (h$$8 - v$$10) / size$$1 - i$$2 : (v$$10 - l$$12) / size$$1 - i$$2;
-    const i$$3 = size$$1 < 0 ? s$$10.fields[0].length + i$$2 : i$$2;
-
-    if (~~i$$3 < 0 ? true : ~~i$$3 >= s$$10.fields[0].length) {
-      return new Value(0, "CAR", new categorical(0, "CA", "<outside-of-range>"), f$$6);
-    } else {
-      return new Value(0, "CAR", s$$10.fields[0][~~i$$3], f$$6);
-    }
-  } else {
-    if (reversed$$3) {
-      return new Value(1, "COV", new continuous(0, "CO", s$$10.fields[1].fields[0] - (v$$10 - l$$12) / (h$$8 - l$$12) * (s$$10.fields[1].fields[0] - s$$10.fields[0].fields[0])));
-    } else {
-      return new Value(1, "COV", new continuous(0, "CO", s$$10.fields[0].fields[0] + (v$$10 - l$$12) / (h$$8 - l$$12) * (s$$10.fields[1].fields[0] - s$$10.fields[0].fields[0])));
-    }
-  }
-}
-export function Projections$$$projectInv(x1$$1, y1$$1, x2$$1, y2$$1, sx$$6, sy$$6, x$$13, y$$8) {
-  return [Projections$$$projectInvOne(false, x1$$1, x2$$1, sx$$6, x$$13), Projections$$$projectInvOne(true, y1$$1, y2$$1, sy$$6, y$$8)];
-}
-export const Drawing$002EDrawingContext = declare(function Compost_Drawing_DrawingContext(Style, Definitions) {
-  this.Style = Style;
-  this.Definitions = Definitions;
-}, Record);
-export function Drawing$002EDrawingContext$reflection() {
-  return record_type("Compost.Drawing.DrawingContext", [], Drawing$002EDrawingContext, () => [["Style", Style$reflection()], ["Definitions", array_type(DomNode$0024reflection())]]);
-}
-export function Drawing$$$hideFill(style$$9) {
-  const Fill$$2 = new FillStyle(0, "Solid", [0, new Color(0, "RGB", 0, 0, 0)]);
-  let Animation$$2;
-
-  if (style$$9.Animation != null) {
-    const n$$1 = style$$9.Animation[0] | 0;
-    const f$$7 = style$$9.Animation[2];
-    const e = style$$9.Animation[1];
-    Animation$$2 = [n$$1, e, function ($arg$$20) {
-      const style$$10 = f$$7($arg$$20);
-      return Drawing$$$hideFill(style$$10);
-    }];
-  } else {
-    Animation$$2 = undefined;
-  }
-
-  return new Style(style$$9.StrokeColor, style$$9.StrokeWidth, style$$9.StrokeDashArray, Fill$$2, Animation$$2, style$$9.Font, style$$9.Cursor, style$$9.FormatAxisXLabel, style$$9.FormatAxisYLabel);
-}
-export function Drawing$$$hideStroke(style$$11) {
-  let Animation$$3;
-
-  if (style$$11.Animation != null) {
-    const n$$2 = style$$11.Animation[0] | 0;
-    const f$$8 = style$$11.Animation[2];
-    const e$$1 = style$$11.Animation[1];
-    Animation$$3 = [n$$2, e$$1, function ($arg$$21) {
-      const style$$12 = f$$8($arg$$21);
-      return Drawing$$$hideStroke(style$$12);
-    }];
-  } else {
-    Animation$$3 = undefined;
-  }
-
-  return new Style([0, style$$11.StrokeColor[1]], style$$11.StrokeWidth, style$$11.StrokeDashArray, style$$11.Fill, Animation$$3, style$$11.Font, style$$11.Cursor, style$$11.FormatAxisXLabel, style$$11.FormatAxisYLabel);
-}
-export function Drawing$$$drawShape($ctx$$1$$135, $_arg2_0$$136, $_arg2_1$$137, $_arg2_2$$138, $_arg2_3$$139, $_arg1_0$$140, $_arg1_1$$141, $shape$$23$$142) {
-  var clo1$$9, clo2$$8;
-
-  Drawing$$$drawShape: while (true) {
-    const ctx$$1 = $ctx$$1$$135,
-          _arg2_0 = $_arg2_0$$136,
-          _arg2_1 = $_arg2_1$$137,
-          _arg2_2 = $_arg2_2$$138,
-          _arg2_3 = $_arg2_3$$139,
-          _arg1_0 = $_arg1_0$$140,
-          _arg1_1 = $_arg1_1$$141,
-          shape$$23 = $shape$$23$$142;
-
-    const project = function project(tupledArg$$2) {
-      return [Projections$$$projectOneX(_arg2_0, _arg2_2)(_arg1_0)(tupledArg$$2[0]), Projections$$$projectOneY(_arg2_1, _arg2_3)(_arg1_1)(tupledArg$$2[1])];
-    };
-
-    switch (shape$$23.tag) {
-      case 10:
-        {
-          const y1$0027 = Projections$$$projectOneY(_arg2_1, _arg2_3)(_arg1_1)(shape$$23.fields[0]);
-          const y2$0027 = Projections$$$projectOneY(_arg2_1, _arg2_3)(_arg1_1)(shape$$23.fields[1]);
-          $ctx$$1$$135 = ctx$$1;
-          $_arg2_0$$136 = _arg2_0;
-          $_arg2_1$$137 = y1$0027;
-          $_arg2_2$$138 = _arg2_2;
-          $_arg2_3$$139 = y2$0027;
-          $_arg1_0$$140 = _arg1_0;
-          $_arg1_1$$141 = shape$$23.fields[2];
-          $shape$$23$$142 = shape$$23.fields[3];
-          continue Drawing$$$drawShape;
-        }
-
-      case 8:
-        {
-          const arg10$0040 = _arg2_0 + shape$$23.fields[0][0];
-          const arg11$0040 = _arg2_1 + shape$$23.fields[0][1];
-          const arg12$0040 = _arg2_2 + shape$$23.fields[0][0];
-          const arg13$0040 = _arg2_3 + shape$$23.fields[0][1];
-          $ctx$$1$$135 = ctx$$1;
-          $_arg2_0$$136 = arg10$0040;
-          $_arg2_1$$137 = arg11$0040;
-          $_arg2_2$$138 = arg12$0040;
-          $_arg2_3$$139 = arg13$0040;
-          $_arg1_0$$140 = _arg1_0;
-          $_arg1_1$$141 = _arg1_1;
-          $shape$$23$$142 = shape$$23.fields[1];
-          continue Drawing$$$drawShape;
-        }
-
-      case 5:
-        {
-          return new Svg$002ESvg(4, "Combine", map(function (shape$$27) {
-            return Drawing$$$drawShape(ctx$$1, _arg2_0, _arg2_1, _arg2_2, _arg2_3, _arg1_0, _arg1_1, shape$$27);
-          }, shape$$23.fields[0], Array));
-        }
-
-      case 0:
-        {
-          const ctx$$2 = new Drawing$002EDrawingContext(shape$$23.fields[0](ctx$$1.Style), ctx$$1.Definitions);
-          $ctx$$1$$135 = ctx$$2;
-          $_arg2_0$$136 = _arg2_0;
-          $_arg2_1$$137 = _arg2_1;
-          $_arg2_2$$138 = _arg2_2;
-          $_arg2_3$$139 = _arg2_3;
-          $_arg1_0$$140 = _arg1_0;
-          $_arg1_1$$141 = _arg1_1;
-          $shape$$23$$142 = shape$$23.fields[1];
-          continue Drawing$$$drawShape;
-        }
-
-      case 4:
-        {
-          const path$$1 = ofSeq$$1(delay(function () {
-            return append(singleton(new Svg$002EPathSegment(0, "MoveTo", project(shape$$23.fields[0][0]))), delay(function () {
-              return append(map$$1(function (pt$$1) {
-                return new Svg$002EPathSegment(1, "LineTo", project(pt$$1));
-              }, skip(1, shape$$23.fields[0])), delay(function () {
-                return singleton(new Svg$002EPathSegment(1, "LineTo", project(shape$$23.fields[0][0])));
-              }));
-            }));
-          }), Array);
-          return new Svg$002ESvg(0, "Path", path$$1, Svg$$$formatStyle(ctx$$1.Definitions, Drawing$$$hideStroke(ctx$$1.Style)));
-        }
-
-      case 7:
-        {
-          const calculateNestedRange = function calculateNestedRange(rev, tupledArg$$3, ins, outs) {
-            if (ins.tag === 1) {
-              let pos$$1;
-              pos$$1 = collect(function mapping$$7(v$$11) {
-                return ofArray([Projections$$$projectOne(rev, tupledArg$$3[0], tupledArg$$3[1], outs, new Value(0, "CAR", v$$11, 0)), Projections$$$projectOne(rev, tupledArg$$3[0], tupledArg$$3[1], outs, new Value(0, "CAR", v$$11, 1))]);
-              }, ins.fields[0]);
-              return [min$$2(pos$$1, {
-                Compare: comparePrimitives
-              }), max$$2(pos$$1, {
-                Compare: comparePrimitives
-              })];
-            } else {
-              const pos = ofArray([Projections$$$projectOne(rev, tupledArg$$3[0], tupledArg$$3[1], outs, new Value(1, "COV", new continuous(0, "CO", ins.fields[0].fields[0]))), Projections$$$projectOne(rev, tupledArg$$3[0], tupledArg$$3[1], outs, new Value(1, "COV", new continuous(0, "CO", ins.fields[1].fields[0])))]);
-              return [min$$2(pos, {
-                Compare: comparePrimitives
-              }), max$$2(pos, {
-                Compare: comparePrimitives
-              })];
-            }
-          };
-
-          const patternInput$$19 = calculateNestedRange(false, [_arg2_0, _arg2_2], shape$$23.fields[1], _arg1_0);
-          const patternInput$$20 = calculateNestedRange(true, [_arg2_1, _arg2_3], shape$$23.fields[2], _arg1_1);
-          $ctx$$1$$135 = ctx$$1;
-          $_arg2_0$$136 = patternInput$$19[0] + shape$$23.fields[0][3];
-          $_arg2_1$$137 = patternInput$$20[0] + shape$$23.fields[0][0];
-          $_arg2_2$$138 = patternInput$$19[1] - shape$$23.fields[0][1];
-          $_arg2_3$$139 = patternInput$$20[1] - shape$$23.fields[0][2];
-          $_arg1_0$$140 = shape$$23.fields[1];
-          $_arg1_1$$141 = shape$$23.fields[2];
-          $shape$$23$$142 = shape$$23.fields[3];
-          continue Drawing$$$drawShape;
-        }
-
-      case 2:
-        {
-          let path$$2;
-          const list = ofSeq(delay(function () {
-            return append(singleton(new Svg$002EPathSegment(0, "MoveTo", project(head(shape$$23.fields[0])))), delay(function () {
-              return map$$1(function (pt$$2) {
-                return new Svg$002EPathSegment(1, "LineTo", project(pt$$2));
-              }, skip(1, shape$$23.fields[0]));
-            }));
-          }));
-          path$$2 = ofList(list, Array);
-          return new Svg$002ESvg(0, "Path", path$$2, Svg$$$formatStyle(ctx$$1.Definitions, Drawing$$$hideFill(ctx$$1.Style)));
-        }
-
-      case 1:
-        {
-          const va$$2 = shape$$23.fields[2].tag === 2 ? "hanging" : shape$$23.fields[2].tag === 1 ? "middle" : "baseline";
-          const ha$$2 = shape$$23.fields[3].tag === 1 ? "middle" : shape$$23.fields[3].tag === 2 ? "end" : "start";
-          const xy = project([shape$$23.fields[0], shape$$23.fields[1]]);
-          return new Svg$002ESvg(3, "Text", xy, shape$$23.fields[5], shape$$23.fields[4], (clo1$$9 = toText(printf("alignment-baseline:%s; text-anchor:%s;")), clo2$$8 = clo1$$9(va$$2), clo2$$8(ha$$2)) + Svg$$$formatStyle(ctx$$1.Definitions, ctx$$1.Style));
-        }
-
-      case 3:
-        {
-          return new Svg$002ESvg(1, "Ellipse", project([shape$$23.fields[0], shape$$23.fields[1]]), [shape$$23.fields[2], shape$$23.fields[3]], Svg$$$formatStyle(ctx$$1.Definitions, ctx$$1.Style));
-        }
-
-      case 6:
-        {
-          $ctx$$1$$135 = ctx$$1;
-          $_arg2_0$$136 = _arg2_0;
-          $_arg2_1$$137 = _arg2_1;
-          $_arg2_2$$138 = _arg2_2;
-          $_arg2_3$$139 = _arg2_3;
-          $_arg1_0$$140 = _arg1_0;
-          $_arg1_1$$141 = _arg1_1;
-          $shape$$23$$142 = shape$$23.fields[3];
-          continue Drawing$$$drawShape;
-        }
-
-      default:
-        {
-          const x1$0027 = Projections$$$projectOneX(_arg2_0, _arg2_2)(_arg1_0)(shape$$23.fields[0]);
-          const x2$0027 = Projections$$$projectOneX(_arg2_0, _arg2_2)(_arg1_0)(shape$$23.fields[1]);
-          $ctx$$1$$135 = ctx$$1;
-          $_arg2_0$$136 = x1$0027;
-          $_arg2_1$$137 = _arg2_1;
-          $_arg2_2$$138 = x2$0027;
-          $_arg2_3$$139 = _arg2_3;
-          $_arg1_0$$140 = shape$$23.fields[2];
-          $_arg1_1$$141 = _arg1_1;
-          $shape$$23$$142 = shape$$23.fields[3];
-          continue Drawing$$$drawShape;
-        }
-    }
-
-    break;
-  }
-}
-export const Events$002EMouseEventKind = declare(function Compost_Events_MouseEventKind(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Events$002EMouseEventKind$reflection() {
-  return union_type("Compost.Events.MouseEventKind", [], Events$002EMouseEventKind, () => ["Click", "Move", "Up", "Down"]);
-}
-export const Events$002ETouchEventKind = declare(function Compost_Events_TouchEventKind(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Events$002ETouchEventKind$reflection() {
-  return union_type("Compost.Events.TouchEventKind", [], Events$002ETouchEventKind, () => ["Move", "Start"]);
-}
-export const Events$002EInteractiveEvent = declare(function Compost_Events_InteractiveEvent(tag, name, ...fields) {
-  this.tag = tag | 0;
-  this.name = name;
-  this.fields = fields;
-}, Union);
-export function Events$002EInteractiveEvent$reflection($gen$$149, $gen$$150) {
-  return union_type("Compost.Events.InteractiveEvent", [$gen$$149, $gen$$150], Events$002EInteractiveEvent, () => [["MouseEvent", [["Item1", Events$002EMouseEventKind$reflection()], ["Item2", tuple_type(Value$reflection($gen$$149), Value$reflection($gen$$150))]]], ["TouchEvent", [["Item1", Events$002ETouchEventKind$reflection()], ["Item2", tuple_type(Value$reflection($gen$$149), Value$reflection($gen$$150))]]], "TouchEnd", "MouseLeave"]);
-}
-export function Events$$$projectEvent(area_0, area_1, area_2, area_3, scales_0, scales_1, event) {
-  var $target$$158, kind, x$$16, y$$11, kind$$1, x$$17, y$$12;
-
-  if (event.tag === 1) {
-    if (event.fields[1][0].tag === 1) {
-      if (event.fields[1][1].tag === 1) {
-        $target$$158 = 1;
-        kind$$1 = event.fields[0];
-        x$$17 = event.fields[1][0].fields[0].fields[0];
-        y$$12 = event.fields[1][1].fields[0].fields[0];
-      } else {
-        $target$$158 = 2;
-      }
-    } else {
-      $target$$158 = 2;
-    }
-  } else if (event.tag === 2) {
-    $target$$158 = 3;
-  } else if (event.tag === 3) {
-    $target$$158 = 4;
-  } else if (event.fields[1][0].tag === 1) {
-    if (event.fields[1][1].tag === 1) {
-      $target$$158 = 0;
-      kind = event.fields[0];
-      x$$16 = event.fields[1][0].fields[0].fields[0];
-      y$$11 = event.fields[1][1].fields[0].fields[0];
-    } else {
-      $target$$158 = 2;
-    }
-  } else {
-    $target$$158 = 2;
-  }
-
-  switch ($target$$158) {
-    case 0:
-      {
-        return new Events$002EInteractiveEvent(0, "MouseEvent", kind, Projections$$$projectInv(area_0, area_1, area_2, area_3, scales_0, scales_1, x$$16, y$$11));
-      }
-
-    case 1:
-      {
-        return new Events$002EInteractiveEvent(1, "TouchEvent", kind$$1, Projections$$$projectInv(area_0, area_1, area_2, area_3, scales_0, scales_1, x$$17, y$$12));
-      }
-
-    case 2:
-      {
-        throw new Error("TODO: projectEvent - not continuous");
-      }
-
-    case 3:
-      {
-        return new Events$002EInteractiveEvent(2, "TouchEnd");
-      }
-
-    case 4:
-      {
-        return new Events$002EInteractiveEvent(3, "MouseLeave");
-      }
-  }
-}
-export function Events$$$inScale(s$$11, v$$12) {
-  if (s$$11.tag === 1) {
-    if (v$$12.tag === 1) {
-      throw new Error("inScale: Cannot test if continuous value is in categorical scale");
-    } else {
-      return exists(function predicate$$2(y$$13) {
-        return equals(v$$12.fields[0], y$$13);
-      }, s$$11.fields[0]);
-    }
-  } else if (v$$12.tag === 0) {
-    throw new Error("inScale: Cannot test if categorical value is in continuous scale");
-  } else {
-    if (v$$12.fields[0].fields[0] >= min(comparePrimitives, s$$11.fields[0].fields[0], s$$11.fields[1].fields[0])) {
-      return v$$12.fields[0].fields[0] <= max(comparePrimitives, s$$11.fields[0].fields[0], s$$11.fields[1].fields[0]);
-    } else {
-      return false;
-    }
-  }
-}
-export function Events$$$inScales(sx$$10, sy$$10, event$$1) {
-  var $target$$165, x$$18, y$$14;
-
-  switch (event$$1.tag) {
-    case 2:
-      $target$$165 = 1;
-      break;
-
-    case 0:
-      $target$$165 = 2;
-      x$$18 = event$$1.fields[1][0];
-      y$$14 = event$$1.fields[1][1];
-      break;
-
-    case 1:
-      $target$$165 = 2;
-      x$$18 = event$$1.fields[1][0];
-      y$$14 = event$$1.fields[1][1];
-      break;
-
-    default:
-      $target$$165 = 0;
-  }
-
-  switch ($target$$165) {
-    case 0:
-      {
-        return true;
-      }
-
-    case 1:
-      {
-        return true;
-      }
-
-    case 2:
-      {
-        if (Events$$$inScale(sx$$10, x$$18)) {
-          return Events$$$inScale(sy$$10, y$$14);
-        } else {
-          return false;
-        }
-      }
-  }
-}
-export function Events$$$triggerEvent($_arg2_0$$1$$166, $_arg2_1$$1$$167, $_arg2_2$$1$$168, $_arg2_3$$1$$169, $_arg1_0$$1$$170, $_arg1_1$$1$$171, $shape$$31$$172, $jse$$173, $event$$2$$174) {
-  Events$$$triggerEvent: while (true) {
-    const _arg2_0$$1 = $_arg2_0$$1$$166,
-          _arg2_1$$1 = $_arg2_1$$1$$167,
-          _arg2_2$$1 = $_arg2_2$$1$$168,
-          _arg2_3$$1 = $_arg2_3$$1$$169,
-          _arg1_0$$1 = $_arg1_0$$1$$170,
-          _arg1_1$$1 = $_arg1_1$$1$$171,
-          shape$$31 = $shape$$31$$172,
-          jse = $jse$$173,
-          event$$2 = $event$$2$$174;
-
-    switch (shape$$31.tag) {
-      case 1:
-      case 3:
-      case 4:
-        {
-          void null;
-          break;
-        }
-
-      case 0:
-        {
-          $_arg2_0$$1$$166 = _arg2_0$$1;
-          $_arg2_1$$1$$167 = _arg2_1$$1;
-          $_arg2_2$$1$$168 = _arg2_2$$1;
-          $_arg2_3$$1$$169 = _arg2_3$$1;
-          $_arg1_0$$1$$170 = _arg1_0$$1;
-          $_arg1_1$$1$$171 = _arg1_1$$1;
-          $shape$$31$$172 = shape$$31.fields[1];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      case 8:
-        {
-          const arg00$0040$$1 = _arg2_0$$1 + shape$$31.fields[0][0];
-          const arg01$0040$$1 = _arg2_1$$1 + shape$$31.fields[0][1];
-          const arg02$0040$$1 = _arg2_2$$1 + shape$$31.fields[0][0];
-          const arg03$0040$$1 = _arg2_3$$1 + shape$$31.fields[0][1];
-          $_arg2_0$$1$$166 = arg00$0040$$1;
-          $_arg2_1$$1$$167 = arg01$0040$$1;
-          $_arg2_2$$1$$168 = arg02$0040$$1;
-          $_arg2_3$$1$$169 = arg03$0040$$1;
-          $_arg1_0$$1$$170 = _arg1_0$$1;
-          $_arg1_1$$1$$171 = _arg1_1$$1;
-          $shape$$31$$172 = shape$$31.fields[1];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      case 9:
-        {
-          const x1$0027$$2 = Projections$$$projectOneX(_arg2_0$$1, _arg2_2$$1)(_arg1_0$$1)(shape$$31.fields[0]);
-          const x2$0027$$2 = Projections$$$projectOneX(_arg2_0$$1, _arg2_2$$1)(_arg1_0$$1)(shape$$31.fields[1]);
-          $_arg2_0$$1$$166 = x1$0027$$2;
-          $_arg2_1$$1$$167 = _arg2_1$$1;
-          $_arg2_2$$1$$168 = x2$0027$$2;
-          $_arg2_3$$1$$169 = _arg2_3$$1;
-          $_arg1_0$$1$$170 = shape$$31.fields[2];
-          $_arg1_1$$1$$171 = _arg1_1$$1;
-          $shape$$31$$172 = shape$$31.fields[3];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      case 10:
-        {
-          const y1$0027$$2 = Projections$$$projectOneY(_arg2_1$$1, _arg2_3$$1)(_arg1_1$$1)(shape$$31.fields[0]);
-          const y2$0027$$2 = Projections$$$projectOneY(_arg2_1$$1, _arg2_3$$1)(_arg1_1$$1)(shape$$31.fields[1]);
-          $_arg2_0$$1$$166 = _arg2_0$$1;
-          $_arg2_1$$1$$167 = y1$0027$$2;
-          $_arg2_2$$1$$168 = _arg2_2$$1;
-          $_arg2_3$$1$$169 = y2$0027$$2;
-          $_arg1_0$$1$$170 = _arg1_0$$1;
-          $_arg1_1$$1$$171 = shape$$31.fields[2];
-          $shape$$31$$172 = shape$$31.fields[3];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      case 7:
-        {
-          const calculateNestedRange$$1 = function calculateNestedRange$$1(rev$$1, tupledArg$$4, ins$$1, outs$$1) {
-            if (ins$$1.tag === 1) {
-              let pos$$3;
-              pos$$3 = collect(function mapping$$8(v$$15) {
-                return ofArray([Projections$$$projectOne(rev$$1, tupledArg$$4[0], tupledArg$$4[1], outs$$1, new Value(0, "CAR", v$$15, 0)), Projections$$$projectOne(rev$$1, tupledArg$$4[0], tupledArg$$4[1], outs$$1, new Value(0, "CAR", v$$15, 1))]);
-              }, ins$$1.fields[0]);
-              return [min$$2(pos$$3, {
-                Compare: comparePrimitives
-              }), max$$2(pos$$3, {
-                Compare: comparePrimitives
-              })];
-            } else {
-              const pos$$2 = ofArray([Projections$$$projectOne(rev$$1, tupledArg$$4[0], tupledArg$$4[1], outs$$1, new Value(1, "COV", new continuous(0, "CO", ins$$1.fields[0].fields[0]))), Projections$$$projectOne(rev$$1, tupledArg$$4[0], tupledArg$$4[1], outs$$1, new Value(1, "COV", new continuous(0, "CO", ins$$1.fields[1].fields[0])))]);
-              return [min$$2(pos$$2, {
-                Compare: comparePrimitives
-              }), max$$2(pos$$2, {
-                Compare: comparePrimitives
-              })];
-            }
-          };
-
-          const patternInput$$21 = calculateNestedRange$$1(false, [_arg2_0$$1, _arg2_2$$1], shape$$31.fields[1], _arg1_0$$1);
-          const patternInput$$22 = calculateNestedRange$$1(true, [_arg2_1$$1, _arg2_3$$1], shape$$31.fields[2], _arg1_1$$1);
-          $_arg2_0$$1$$166 = patternInput$$21[0] + shape$$31.fields[0][3];
-          $_arg2_1$$1$$167 = patternInput$$22[0] + shape$$31.fields[0][0];
-          $_arg2_2$$1$$168 = patternInput$$21[1] - shape$$31.fields[0][1];
-          $_arg2_3$$1$$169 = patternInput$$22[1] - shape$$31.fields[0][2];
-          $_arg1_0$$1$$170 = shape$$31.fields[1];
-          $_arg1_1$$1$$171 = shape$$31.fields[2];
-          $shape$$31$$172 = shape$$31.fields[3];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      case 5:
-        {
-          for (let idx = 0; idx <= shape$$31.fields[0].length - 1; idx++) {
-            const shape$$37 = shape$$31.fields[0][idx];
-            Events$$$triggerEvent(_arg2_0$$1, _arg2_1$$1, _arg2_2$$1, _arg2_3$$1, _arg1_0$$1, _arg1_1$$1, shape$$37, jse, event$$2);
-          }
-
-          break;
-        }
-
-      case 6:
-        {
-          const localEvent = Events$$$projectEvent(_arg2_0$$1, _arg2_1$$1, _arg2_2$$1, _arg2_3$$1, _arg1_0$$1, _arg1_1$$1, event$$2);
-
-          if (Events$$$inScales(_arg1_0$$1, _arg1_1$$1, localEvent)) {
-            iterate(function (handler) {
-              var $target$$180, f$$11, pt$$3, f$$12, pt$$4, f$$13, f$$14;
-
-              if (localEvent.tag === 1) {
-                if (localEvent.fields[0].tag === 1) {
-                  if (handler.tag === 4) {
-                    $target$$180 = 1;
-                    f$$12 = curry(2, handler.fields[0]);
-                    pt$$4 = localEvent.fields[1];
-                  } else {
-                    $target$$180 = 4;
-                  }
-                } else if (handler.tag === 5) {
-                  $target$$180 = 1;
-                  f$$12 = curry(2, handler.fields[0]);
-                  pt$$4 = localEvent.fields[1];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (localEvent.tag === 2) {
-                if (handler.tag === 6) {
-                  $target$$180 = 2;
-                  f$$13 = handler.fields[0];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (localEvent.tag === 3) {
-                if (handler.tag === 7) {
-                  $target$$180 = 3;
-                  f$$14 = handler.fields[0];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (localEvent.fields[0].tag === 1) {
-                if (handler.tag === 0) {
-                  $target$$180 = 0;
-                  f$$11 = curry(2, handler.fields[0]);
-                  pt$$3 = localEvent.fields[1];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (localEvent.fields[0].tag === 2) {
-                if (handler.tag === 1) {
-                  $target$$180 = 0;
-                  f$$11 = curry(2, handler.fields[0]);
-                  pt$$3 = localEvent.fields[1];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (localEvent.fields[0].tag === 3) {
-                if (handler.tag === 2) {
-                  $target$$180 = 0;
-                  f$$11 = curry(2, handler.fields[0]);
-                  pt$$3 = localEvent.fields[1];
-                } else {
-                  $target$$180 = 4;
-                }
-              } else if (handler.tag === 3) {
-                $target$$180 = 0;
-                f$$11 = curry(2, handler.fields[0]);
-                pt$$3 = localEvent.fields[1];
-              } else {
-                $target$$180 = 4;
-              }
-
-              switch ($target$$180) {
-                case 0:
-                  {
-                    if (!equals(jse, null)) {
-                      jse.preventDefault();
-                    } else {
-                      void null;
-                    }
-
-                    f$$11(jse)(pt$$3);
-                    break;
-                  }
-
-                case 1:
-                  {
-                    if (!equals(jse, null)) {
-                      jse.preventDefault();
-                    } else {
-                      void null;
-                    }
-
-                    f$$12(jse)(pt$$4);
-                    break;
-                  }
-
-                case 2:
-                  {
-                    f$$13(jse);
-                    break;
-                  }
-
-                case 3:
-                  {
-                    f$$14(jse);
-                    break;
-                  }
-
-                case 4:
-                  {
-                    void null;
-                    break;
-                  }
-              }
-            }, shape$$31.fields[0]);
-          } else {
-            void null;
-          }
-
-          $_arg2_0$$1$$166 = _arg2_0$$1;
-          $_arg2_1$$1$$167 = _arg2_1$$1;
-          $_arg2_2$$1$$168 = _arg2_2$$1;
-          $_arg2_3$$1$$169 = _arg2_3$$1;
-          $_arg1_0$$1$$170 = _arg1_0$$1;
-          $_arg1_1$$1$$171 = _arg1_1$$1;
-          $shape$$31$$172 = shape$$31.fields[3];
-          $jse$$173 = jse;
-          $event$$2$$174 = event$$2;
-          continue Events$$$triggerEvent;
-          break;
-        }
-
-      default:
-        {
-          void null;
-        }
-    }
-
-    break;
-  }
-}
-export function Derived$$$StrokeColor(clr$$5, s$$12) {
-  return new Shape(0, "Style", function (s$$13) {
-    return new Style([1, new Color(1, "HTML", clr$$5)], s$$13.StrokeWidth, s$$13.StrokeDashArray, s$$13.Fill, s$$13.Animation, s$$13.Font, s$$13.Cursor, s$$13.FormatAxisXLabel, s$$13.FormatAxisYLabel);
-  }, s$$12);
-}
-export function Derived$$$FillColor(clr$$6, s$$14) {
-  return new Shape(0, "Style", function (s$$15) {
-    const Fill$$3 = new FillStyle(0, "Solid", [1, new Color(1, "HTML", clr$$6)]);
-    return new Style(s$$15.StrokeColor, s$$15.StrokeWidth, s$$15.StrokeDashArray, Fill$$3, s$$15.Animation, s$$15.Font, s$$15.Cursor, s$$15.FormatAxisXLabel, s$$15.FormatAxisYLabel);
-  }, s$$14);
-}
-export function Derived$$$Font(font, clr$$7, s$$16) {
-  return new Shape(0, "Style", function (s$$17) {
-    const Fill$$4 = new FillStyle(0, "Solid", [1, new Color(1, "HTML", clr$$7)]);
-    const StrokeColor$$1 = [0, new Color(1, "HTML", clr$$7)];
-    return new Style(StrokeColor$$1, s$$17.StrokeWidth, s$$17.StrokeDashArray, Fill$$4, s$$17.Animation, font, s$$17.Cursor, s$$17.FormatAxisXLabel, s$$17.FormatAxisYLabel);
-  }, s$$16);
-}
-export function Derived$$$Area(line$$3) {
-  const arg0$$7 = delay(function () {
-    const line$$4 = ofSeq$$1(line$$3, Array);
-    const patternInput$$23 = [line$$4[0][0], line$$4[line$$4.length - 1][0]];
-    return append(singleton([patternInput$$23[0], new Value(1, "COV", new continuous(0, "CO", 0))]), delay(function () {
-      return append(line$$4, delay(function () {
-        return append(singleton([patternInput$$23[1], new Value(1, "COV", new continuous(0, "CO", 0))]), delay(function () {
-          return singleton([patternInput$$23[0], new Value(1, "COV", new continuous(0, "CO", 0))]);
-        }));
-      }));
-    }));
-  });
-  return new Shape(8, "Shape", arg0$$7);
-}
-export function Derived$$$VArea(line$$5) {
-  const arg0$$8 = delay(function () {
-    const line$$6 = ofSeq$$1(line$$5, Array);
-    const patternInput$$24 = [line$$6[0][1], line$$6[line$$6.length - 1][1]];
-    return append(singleton([new Value(1, "COV", new continuous(0, "CO", 0)), patternInput$$24[0]]), delay(function () {
-      return append(line$$6, delay(function () {
-        return append(singleton([new Value(1, "COV", new continuous(0, "CO", 0)), patternInput$$24[1]]), delay(function () {
-          return singleton([new Value(1, "COV", new continuous(0, "CO", 0)), patternInput$$24[0]]);
-        }));
-      }));
-    }));
-  });
-  return new Shape(8, "Shape", arg0$$8);
-}
-export function Derived$$$VShiftedArea(offs$$1, line$$7) {
-  const arg0$$9 = delay(function () {
-    const line$$8 = ofSeq$$1(line$$7, Array);
-    const patternInput$$25 = [line$$8[0][1], line$$8[line$$8.length - 1][1]];
-    return append(singleton([new Value(1, "COV", new continuous(0, "CO", offs$$1)), patternInput$$25[0]]), delay(function () {
-      return append(line$$8, delay(function () {
-        return append(singleton([new Value(1, "COV", new continuous(0, "CO", offs$$1)), patternInput$$25[1]]), delay(function () {
-          return singleton([new Value(1, "COV", new continuous(0, "CO", offs$$1)), patternInput$$25[0]]);
-        }));
-      }));
-    }));
-  });
-  return new Shape(8, "Shape", arg0$$9);
-}
-export function Derived$$$Bar(x$$19, y$$15) {
-  const arg0$$10 = delay(function () {
-    return append(singleton([new Value(1, "COV", x$$19), new Value(0, "CAR", y$$15, 0)]), delay(function () {
-      return append(singleton([new Value(1, "COV", x$$19), new Value(0, "CAR", y$$15, 1)]), delay(function () {
-        return append(singleton([new Value(1, "COV", new continuous(0, "CO", 0)), new Value(0, "CAR", y$$15, 1)]), delay(function () {
-          return singleton([new Value(1, "COV", new continuous(0, "CO", 0)), new Value(0, "CAR", y$$15, 0)]);
-        }));
-      }));
-    }));
-  });
-  return new Shape(8, "Shape", arg0$$10);
-}
-export function Derived$$$Column(x$$20, y$$16) {
-  const arg0$$11 = delay(function () {
-    return append(singleton([new Value(0, "CAR", x$$20, 0), new Value(1, "COV", y$$16)]), delay(function () {
-      return append(singleton([new Value(0, "CAR", x$$20, 1), new Value(1, "COV", y$$16)]), delay(function () {
-        return append(singleton([new Value(0, "CAR", x$$20, 1), new Value(1, "COV", new continuous(0, "CO", 0))]), delay(function () {
-          return singleton([new Value(0, "CAR", x$$20, 0), new Value(1, "COV", new continuous(0, "CO", 0))]);
-        }));
-      }));
-    }));
-  });
-  return new Shape(8, "Shape", arg0$$11);
-}
-export function Compost$$$niceNumber(num, decs) {
-  var x$$21;
-  const str = num.toString();
-  const dot = str.indexOf(".") | 0;
-  const patternInput$$26 = dot === -1 ? [str, ""] : [substring(str, 0, dot), substring(str, dot + 1, min(comparePrimitives, decs, str.length - dot - 1))];
-  const after$$1 = patternInput$$26[1].length < decs ? patternInput$$26[1] + ofSeq$$1(delay(function () {
-    return map$$1(function (i$$4) {
-      return "0";
-    }, rangeNumber(1, 1, decs - patternInput$$26[1].length));
-  }), Array).join("") : patternInput$$26[1];
-  let res = patternInput$$26[0];
-
-  if (patternInput$$26[0].length > 5) {
-    const inputSequence = rangeNumber(patternInput$$26[0].length - 1, -1, 0);
-    iterate(function (i$$5) {
-      const j = patternInput$$26[0].length - i$$5 | 0;
-
-      if (i$$5 !== 0 ? j % 3 === 0 : false) {
-        res = insert(res, i$$5, ",");
-      } else {
-        void null;
-      }
-    }, inputSequence);
-  } else {
-    void null;
-  }
-
-  if (forAll((x$$21 = "0", function (y$$17) {
-    return x$$21 === y$$17;
-  }), after$$1.split(""))) {
-    return res;
-  } else {
-    return res + "." + after$$1;
-  }
-}
-export function Compost$$$defaultFormat(scale$$4, value$$1) {
-  if (value$$1.tag === 1) {
-    const dec = scale$$4.tag === 0 ? Scales$$$decimalPoints(scale$$4.fields[0].fields[0], scale$$4.fields[1].fields[0]) : 0;
-    return Compost$$$niceNumber(round(value$$1.fields[0].fields[0], ~~dec), ~~dec);
-  } else {
-    return value$$1.fields[0].fields[0];
-  }
-}
-export const Compost$$$defstyle = (() => {
-  const Fill$$5 = new FillStyle(0, "Solid", [1, new Color(0, "RGB", 196, 196, 196)]);
-  const StrokeColor$$2 = [1, new Color(0, "RGB", 256, 0, 0)];
-  const StrokeDashArray = [];
-  const StrokeWidth$$1 = new Width(0, "Pixels", 2);
-  const Animation$$4 = undefined;
-  return new Style(StrokeColor$$2, StrokeWidth$$1, StrokeDashArray, Fill$$5, Animation$$4, "10pt sans-serif", "default", Compost$$$defaultFormat, Compost$$$defaultFormat);
-})();
-export function Compost$$$getRelativeLocation(el, x$$22, y$$18) {
-  const getOffset = function getOffset($parent$$203, $tupledArg$$5$$204) {
-    getOffset: while (true) {
-      const parent = $parent$$203,
-            tupledArg$$5 = $tupledArg$$5$$204;
-
-      if (equals(parent, null)) {
-        return [tupledArg$$5[0], tupledArg$$5[1]];
-      } else {
-        $parent$$203 = parent.offsetParent;
-        $tupledArg$$5$$204 = [tupledArg$$5[0] - parent.offsetLeft, tupledArg$$5[1] - parent.offsetTop];
-        continue getOffset;
-      }
-
-      break;
-    }
-  };
-
-  const getParent = function getParent($parent$$1$$205) {
-    getParent: while (true) {
-      const parent$$1 = $parent$$1$$205;
-
-      if (parent$$1.namespaceURI === "http://www.w3.org/2000/svg" ? parent$$1.tagName !== "svg" : false) {
-        if (!equals(parent$$1.parentElement, null)) {
-          $parent$$1$$205 = parent$$1.parentElement;
-          continue getParent;
-        } else {
-          $parent$$1$$205 = parent$$1.parentNode;
-          continue getParent;
-        }
-      } else if (!equals(parent$$1.offsetParent, null)) {
-        return parent$$1;
-      } else if (!equals(parent$$1.parentElement, null)) {
-        $parent$$1$$205 = parent$$1.parentElement;
-        continue getParent;
-      } else {
-        $parent$$1$$205 = parent$$1.parentNode;
-        continue getParent;
-      }
-
-      break;
-    }
-  };
-
-  return getOffset(getParent(el), [x$$22, y$$18]);
-}
-export function Compost$$$createSvg(revX, revY, width$$1, height, viz) {
-  const patternInput$$27 = Scales$$$calculateScales(Compost$$$defstyle, viz);
-  const defs$$1 = [];
-  let svg$$2;
-  const ctx$$3 = new Drawing$002EDrawingContext(Compost$$$defstyle, defs$$1);
-  svg$$2 = Drawing$$$drawShape(ctx$$3, 0, 0, width$$1, height, patternInput$$27[0][0], patternInput$$27[0][1], patternInput$$27[1]);
-
-  const triggerEvent = function triggerEvent(e$$2, event$$3) {
-    Events$$$triggerEvent(0, 0, width$$1, height, patternInput$$27[0][0], patternInput$$27[0][1], patternInput$$27[1], e$$2, event$$3);
-  };
-
-  const mouseHandler = function mouseHandler(kind$$2, el$$1, evt) {
-    const patternInput$$28 = Compost$$$getRelativeLocation(el$$1, evt.pageX, evt.pageY);
-    const arg10$$10 = new Events$002EInteractiveEvent(0, "MouseEvent", kind$$2, [new Value(1, "COV", new continuous(0, "CO", patternInput$$28[0])), new Value(1, "COV", new continuous(0, "CO", patternInput$$28[1]))]);
-    const clo1$$10 = partialApply(1, triggerEvent, [evt]);
-    clo1$$10(arg10$$10);
-  };
-
-  const touchHandler = function touchHandler(kind$$3, el$$2, evt$$2) {
-    const touch = evt$$2.touches[0];
-    const patternInput$$29 = Compost$$$getRelativeLocation(el$$2, touch.pageX, touch.pageY);
-    const arg10$$11 = new Events$002EInteractiveEvent(1, "TouchEvent", kind$$3, [new Value(1, "COV", new continuous(0, "CO", patternInput$$29[0])), new Value(1, "COV", new continuous(0, "CO", patternInput$$29[1]))]);
-    const clo1$$11 = partialApply(1, triggerEvent, [evt$$2]);
-    clo1$$11(arg10$$11);
-  };
-
-  return function (arg0$$12) {
-    return function (arg1$$7) {
-      return El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(arg0$$12, arg1$$7);
-    };
-  }(h$$13)("div")(new List())(new List((El$0024$0024$0024op_Dynamic$0024$0024Z451691CD(s$$19, "svg"))(ofArray([op_EqualsGreater("style", "overflow:visible"), op_EqualsGreater("width", int32ToString(~~width$$1)), op_EqualsGreater("height", int32ToString(~~height)), op_EqualsBangGreater("click", uncurry(2, partialApply(2, mouseHandler, [new Events$002EMouseEventKind(0, "Click")]))), op_EqualsBangGreater("mousemove", uncurry(2, partialApply(2, mouseHandler, [new Events$002EMouseEventKind(1, "Move")]))), op_EqualsBangGreater("mousedown", uncurry(2, partialApply(2, mouseHandler, [new Events$002EMouseEventKind(3, "Down")]))), op_EqualsBangGreater("mouseup", uncurry(2, partialApply(2, mouseHandler, [new Events$002EMouseEventKind(2, "Up")]))), op_EqualsBangGreater("mouseleave", function (_arg1$$11, evt$$4) {
-    triggerEvent(evt$$4, new Events$002EInteractiveEvent(3, "MouseLeave"));
-  }), op_EqualsBangGreater("touchmove", uncurry(2, partialApply(2, touchHandler, [new Events$002ETouchEventKind(0, "Move")]))), op_EqualsBangGreater("touchstart", uncurry(2, partialApply(2, touchHandler, [new Events$002ETouchEventKind(1, "Start")]))), op_EqualsBangGreater("touchend", function (_arg2$$4, evt$$5) {
-    triggerEvent(evt$$5, new Events$002EInteractiveEvent(2, "TouchEnd"));
-  })]))(ofSeq(delay(function () {
-    const renderCtx = new Svg$002ERenderingContext(defs$$1);
-    let body;
-    const source$$7 = Svg$$$renderSvg(renderCtx, svg$$2);
-    body = ofSeq$$1(source$$7, Array);
-    return append(defs$$1, delay(function () {
-      return body;
-    }));
-  }))), new List()));
-}
+import { toString, Record, Union } from "./fable_modules/fable-library-js.4.28.0/Types.js";
+import { bool_type, unit_type, record_type, option_type, lambda_type, array_type, class_type, tuple_type, float64_type, union_type, string_type, int32_type } from "./fable_modules/fable-library-js.4.28.0/Reflection.js";
+import { insert, substring, toFail, split, replace, printf, toText, join } from "./fable_modules/fable-library-js.4.28.0/String.js";
+import { max as max_2, min as min_2, ofArray, singleton as singleton_1, cons, empty, reverse } from "./fable_modules/fable-library-js.4.28.0/List.js";
+import { findIndex, fold, append as append_1, item as item_2, map } from "./fable_modules/fable-library-js.4.28.0/Array.js";
+import { curry3, uncurry2, curry2, defaultOf, comparePrimitives, safeHash, equals, max as max_1, compare, min as min_1, round, int32ToString, disposeSafe, getEnumerator } from "./fable_modules/fable-library-js.4.28.0/Util.js";
+import { op_EqualsBangGreater, h as h_2, text, op_EqualsGreater, s as s_6, El_op_Dynamic_Z451691CD, DomNode_$reflection } from "./html.js";
+import { forAll, exists, head, max as max_3, min as min_3, skip, toArray, filter, tryHead, isEmpty, map as map_1, empty as empty_1, collect, append, toList, singleton, delay } from "./fable_modules/fable-library-js.4.28.0/Seq.js";
+import { max, min } from "./fable_modules/fable-library-js.4.28.0/Double.js";
+import { newGuid } from "./fable_modules/fable-library-js.4.28.0/Guid.js";
+import { defaultArg } from "./fable_modules/fable-library-js.4.28.0/Option.js";
+import { rangeDouble } from "./fable_modules/fable-library-js.4.28.0/Range.js";
+import { Array_distinct } from "./fable_modules/fable-library-js.4.28.0/Seq2.js";
+import { FSharpChoice$3 } from "./fable_modules/fable-library-js.4.28.0/Choice.js";
+
+export class Color extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["RGB", "HTML"];
+    }
+}
+
+export function Color_$reflection() {
+    return union_type("Compost.Color", [], Color, () => [[["Item1", int32_type], ["Item2", int32_type], ["Item3", int32_type]], [["Item", string_type]]]);
+}
+
+export class Width extends Union {
+    constructor(Item) {
+        super();
+        this.tag = 0;
+        this.fields = [Item];
+    }
+    cases() {
+        return ["Pixels"];
+    }
+}
+
+export function Width_$reflection() {
+    return union_type("Compost.Width", [], Width, () => [[["Item", int32_type]]]);
+}
+
+export class FillStyle extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Solid", "LinearGradient"];
+    }
+}
+
+export function FillStyle_$reflection() {
+    return union_type("Compost.FillStyle", [], FillStyle, () => [[["Item", tuple_type(float64_type, Color_$reflection())]], [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(float64_type, tuple_type(float64_type, Color_$reflection()))])]]]);
+}
+
+export class Number$ extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Integer", "Percentage"];
+    }
+}
+
+export function Number$_$reflection() {
+    return union_type("Compost.Number", [], Number$, () => [[["Item", int32_type]], [["Item", float64_type]]]);
+}
+
+export class HorizontalAlign extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Start", "Center", "End"];
+    }
+}
+
+export function HorizontalAlign_$reflection() {
+    return union_type("Compost.HorizontalAlign", [], HorizontalAlign, () => [[], [], []]);
+}
+
+export class VerticalAlign extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Baseline", "Middle", "Hanging"];
+    }
+}
+
+export function VerticalAlign_$reflection() {
+    return union_type("Compost.VerticalAlign", [], VerticalAlign, () => [[], [], []]);
+}
+
+export class continuous extends Union {
+    constructor(Item) {
+        super();
+        this.tag = 0;
+        this.fields = [Item];
+    }
+    cases() {
+        return ["CO"];
+    }
+}
+
+export function continuous_$reflection(gen0) {
+    return union_type("Compost.continuous", [gen0], continuous, () => [[["Item", float64_type]]]);
+}
+
+export class categorical extends Union {
+    constructor(Item) {
+        super();
+        this.tag = 0;
+        this.fields = [Item];
+    }
+    cases() {
+        return ["CA"];
+    }
+}
+
+export function categorical_$reflection(gen0) {
+    return union_type("Compost.categorical", [gen0], categorical, () => [[["Item", string_type]]]);
+}
+
+export class Value extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["CAR", "COV"];
+    }
+}
+
+export function Value_$reflection(gen0) {
+    return union_type("Compost.Value", [gen0], Value, () => [[["Item1", categorical_$reflection(gen0)], ["Item2", float64_type]], [["Item", continuous_$reflection(gen0)]]]);
+}
+
+export class Scale extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Continuous", "Categorical"];
+    }
+}
+
+export function Scale_$reflection(gen0) {
+    return union_type("Compost.Scale", [gen0], Scale, () => [[["Item1", continuous_$reflection(gen0)], ["Item2", continuous_$reflection(gen0)]], [["Item", array_type(categorical_$reflection(gen0))]]]);
+}
+
+export class Style extends Record {
+    constructor(StrokeColor, StrokeWidth, StrokeDashArray, Fill, Animation, Font, Cursor, FormatAxisXLabel, FormatAxisYLabel) {
+        super();
+        this.StrokeColor = StrokeColor;
+        this.StrokeWidth = StrokeWidth;
+        this.StrokeDashArray = StrokeDashArray;
+        this.Fill = Fill;
+        this.Animation = Animation;
+        this.Font = Font;
+        this.Cursor = Cursor;
+        this.FormatAxisXLabel = FormatAxisXLabel;
+        this.FormatAxisYLabel = FormatAxisYLabel;
+    }
+}
+
+export function Style_$reflection() {
+    return record_type("Compost.Style", [], Style, () => [["StrokeColor", tuple_type(float64_type, Color_$reflection())], ["StrokeWidth", Width_$reflection()], ["StrokeDashArray", class_type("System.Collections.Generic.IEnumerable`1", [Number$_$reflection()])], ["Fill", FillStyle_$reflection()], ["Animation", option_type(tuple_type(int32_type, string_type, lambda_type(Style_$reflection(), Style_$reflection())))], ["Font", string_type], ["Cursor", string_type], ["FormatAxisXLabel", lambda_type(Scale_$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), lambda_type(Value_$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), string_type))], ["FormatAxisYLabel", lambda_type(Scale_$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), lambda_type(Value_$reflection(class_type("Microsoft.FSharp.Core.CompilerServices.MeasureOne")), string_type))]]);
+}
+
+export class EventHandler extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["MouseMove", "MouseUp", "MouseDown", "Click", "TouchStart", "TouchMove", "TouchEnd", "MouseLeave"];
+    }
+}
+
+export function EventHandler_$reflection(gen0, gen1) {
+    return union_type("Compost.EventHandler", [gen0, gen1], EventHandler, () => [[["Item", lambda_type(class_type("Browser.Types.MouseEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.MouseEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.MouseEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.MouseEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.TouchEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.TouchEvent", undefined), lambda_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)), unit_type))]], [["Item", lambda_type(class_type("Browser.Types.TouchEvent", undefined), unit_type)]], [["Item", lambda_type(class_type("Browser.Types.MouseEvent", undefined), unit_type)]]]);
+}
+
+export class Orientation extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Vertical", "Horizontal"];
+    }
+}
+
+export function Orientation_$reflection() {
+    return union_type("Compost.Orientation", [], Orientation, () => [[], []]);
+}
+
+export class Shape extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Style", "Text", "AutoScale", "InnerScale", "NestX", "NestY", "Line", "Bubble", "Shape", "Layered", "Axes", "Interactive", "Padding", "Offset"];
+    }
+}
+
+export function Shape_$reflection(gen0, gen1) {
+    return union_type("Compost.Shape", [gen0, gen1], Shape, () => [[["Item1", lambda_type(Style_$reflection(), Style_$reflection())], ["Item2", Shape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen1)], ["Item3", VerticalAlign_$reflection()], ["Item4", HorizontalAlign_$reflection()], ["Item5", float64_type], ["Item6", string_type]], [["Item1", bool_type], ["Item2", bool_type], ["Item3", Shape_$reflection(gen0, gen1)]], [["Item1", option_type(Scale_$reflection(gen0))], ["Item2", option_type(Scale_$reflection(gen1))], ["Item3", Shape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen0)], ["Item3", Shape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen1)], ["Item2", Value_$reflection(gen1)], ["Item3", Shape_$reflection(gen0, gen1)]], [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(Value_$reflection(gen0), Value_$reflection(gen1))])]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen1)], ["Item3", float64_type], ["Item4", float64_type]], [["Item", class_type("System.Collections.Generic.IEnumerable`1", [tuple_type(Value_$reflection(gen0), Value_$reflection(gen1))])]], [["Item", class_type("System.Collections.Generic.IEnumerable`1", [Shape_$reflection(gen0, gen1)])]], [["Item1", bool_type], ["Item2", bool_type], ["Item3", bool_type], ["Item4", bool_type], ["Item5", Shape_$reflection(gen0, gen1)]], [["Item1", class_type("System.Collections.Generic.IEnumerable`1", [EventHandler_$reflection(gen0, gen1)])], ["Item2", Shape_$reflection(gen0, gen1)]], [["Item1", tuple_type(float64_type, float64_type, float64_type, float64_type)], ["Item2", Shape_$reflection(gen0, gen1)]], [["Item1", tuple_type(float64_type, float64_type)], ["Item2", Shape_$reflection(gen0, gen1)]]]);
+}
+
+export class Svg_StringBuilder {
+    constructor() {
+        this.strs = empty();
+    }
+    toString() {
+        const x = this;
+        return join("", reverse(x.strs));
+    }
+}
+
+export function Svg_StringBuilder_$reflection() {
+    return class_type("Compost.Svg.StringBuilder", undefined, Svg_StringBuilder);
+}
+
+export function Svg_StringBuilder_$ctor() {
+    return new Svg_StringBuilder();
+}
+
+export function Svg_StringBuilder__Append_Z721C83C5(x, s) {
+    x.strs = cons(s, x.strs);
+}
+
+export class Svg_PathSegment extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["MoveTo", "LineTo"];
+    }
+}
+
+export function Svg_PathSegment_$reflection() {
+    return union_type("Compost.Svg.PathSegment", [], Svg_PathSegment, () => [[["Item", tuple_type(float64_type, float64_type)]], [["Item", tuple_type(float64_type, float64_type)]]]);
+}
+
+export class Svg_Svg extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Path", "Ellipse", "Rect", "Text", "Combine", "Empty"];
+    }
+}
+
+export function Svg_Svg_$reflection() {
+    return union_type("Compost.Svg.Svg", [], Svg_Svg, () => [[["Item1", array_type(Svg_PathSegment_$reflection())], ["Item2", string_type]], [["Item1", tuple_type(float64_type, float64_type)], ["Item2", tuple_type(float64_type, float64_type)], ["Item3", string_type]], [["Item1", tuple_type(float64_type, float64_type)], ["Item2", tuple_type(float64_type, float64_type)], ["Item3", string_type]], [["Item1", tuple_type(float64_type, float64_type)], ["Item2", string_type], ["Item3", float64_type], ["Item4", string_type]], [["Item", array_type(Svg_Svg_$reflection())]], []]);
+}
+
+export function Svg_mapSvg(f, _arg) {
+    if (_arg.tag === 4) {
+        return new Svg_Svg(4, [map((_arg_1) => Svg_mapSvg(f, _arg_1), _arg.fields[0])]);
+    }
+    else {
+        return f(_arg);
+    }
+}
+
+export function Svg_formatPath(path) {
+    const sb = Svg_StringBuilder_$ctor();
+    const enumerator = getEnumerator(path);
+    try {
+        while (enumerator["System.Collections.IEnumerator.MoveNext"]()) {
+            const ps = enumerator["System.Collections.Generic.IEnumerator`1.get_Current"]();
+            if (ps.tag === 1) {
+                Svg_StringBuilder__Append_Z721C83C5(sb, ((("L" + ps.fields[0][0].toString()) + " ") + ps.fields[0][1].toString()) + " ");
+            }
+            else {
+                Svg_StringBuilder__Append_Z721C83C5(sb, ((("M" + ps.fields[0][0].toString()) + " ") + ps.fields[0][1].toString()) + " ");
+            }
+        }
+    }
+    finally {
+        disposeSafe(enumerator);
+    }
+    return toString(sb);
+}
+
+export class Svg_RenderingContext extends Record {
+    constructor(Definitions) {
+        super();
+        this.Definitions = Definitions;
+    }
+}
+
+export function Svg_RenderingContext_$reflection() {
+    return record_type("Compost.Svg.RenderingContext", [], Svg_RenderingContext, () => [["Definitions", array_type(DomNode_$reflection())]]);
+}
+
+export function Svg_renderSvg(ctx, svg) {
+    return delay(() => {
+        switch (svg.tag) {
+            case 3: {
+                const y = svg.fields[0][1];
+                const x = svg.fields[0][0];
+                const rotation = svg.fields[2];
+                return singleton(El_op_Dynamic_Z451691CD(s_6, "text")(toList(delay(() => append(singleton(op_EqualsGreater("style", svg.fields[3])), delay(() => ((rotation === 0) ? append(singleton(op_EqualsGreater("x", x.toString())), delay(() => singleton(op_EqualsGreater("y", y.toString())))) : append(singleton(op_EqualsGreater("x", "0")), delay(() => append(singleton(op_EqualsGreater("y", "0")), delay(() => singleton(op_EqualsGreater("transform", toText(printf("translate(%f,%f) rotate(%f)"))(x)(y)(rotation)))))))))))))(singleton_1(text(svg.fields[1]))));
+            }
+            case 4:
+                return collect((s) => Svg_renderSvg(ctx, s), svg.fields[0]);
+            case 1:
+                return singleton(El_op_Dynamic_Z451691CD(s_6, "ellipse")(ofArray([op_EqualsGreater("cx", svg.fields[0][0].toString()), op_EqualsGreater("cy", svg.fields[0][1].toString()), op_EqualsGreater("rx", svg.fields[1][0].toString()), op_EqualsGreater("ry", svg.fields[1][1].toString()), op_EqualsGreater("style", svg.fields[2])]))(empty()));
+            case 2: {
+                const y2 = svg.fields[1][1];
+                const y1 = svg.fields[0][1];
+                const x2 = svg.fields[1][0];
+                const x1 = svg.fields[0][0];
+                const matchValue = min(x1, x2);
+                const matchValue_1 = min(y1, y2);
+                const matchValue_2 = Math.abs(x1 - x2);
+                const matchValue_3 = Math.abs(y1 - y2);
+                return singleton(El_op_Dynamic_Z451691CD(s_6, "rect")(ofArray([op_EqualsGreater("x", matchValue.toString()), op_EqualsGreater("y", matchValue_1.toString()), op_EqualsGreater("width", matchValue_2.toString()), op_EqualsGreater("height", matchValue_3.toString()), op_EqualsGreater("style", svg.fields[2])]))(empty()));
+            }
+            case 0:
+                return singleton(El_op_Dynamic_Z451691CD(s_6, "path")(ofArray([op_EqualsGreater("d", Svg_formatPath(svg.fields[0])), op_EqualsGreater("style", svg.fields[1])]))(empty()));
+            default: {
+                return empty_1();
+            }
+        }
+    });
+}
+
+export function Svg_formatColor(_arg) {
+    if (_arg.tag === 1) {
+        return _arg.fields[0];
+    }
+    else {
+        return toText(printf("rgb(%d, %d, %d)"))(_arg.fields[0])(_arg.fields[1])(_arg.fields[2]);
+    }
+}
+
+export function Svg_formatNumber(_arg) {
+    if (_arg.tag === 1) {
+        return _arg.fields[0].toString() + "%";
+    }
+    else {
+        return int32ToString(_arg.fields[0]);
+    }
+}
+
+export function Svg_formatStyle(defs, style) {
+    let copyOfStruct, bind$0040, patternInput_1, arg_10, matchValue_1, arg_17, id_1, copyOfStruct_1, item_1;
+    let patternInput;
+    const matchValue = style.Animation;
+    if (matchValue == null) {
+        patternInput = [style, ""];
+    }
+    else {
+        const ms = matchValue[0] | 0;
+        const ease = matchValue[1];
+        const anim = matchValue[2];
+        const id = "anim_" + replace((copyOfStruct = newGuid(), copyOfStruct), "-", "");
+        const fromstyle = Svg_formatStyle(defs, new Style(style.StrokeColor, style.StrokeWidth, style.StrokeDashArray, style.Fill, undefined, style.Font, style.Cursor, style.FormatAxisXLabel, style.FormatAxisYLabel));
+        const tostyle = Svg_formatStyle(defs, (bind$0040 = anim(style), new Style(bind$0040.StrokeColor, bind$0040.StrokeWidth, bind$0040.StrokeDashArray, bind$0040.Fill, undefined, bind$0040.Font, bind$0040.Cursor, bind$0040.FormatAxisXLabel, bind$0040.FormatAxisYLabel)));
+        const item = El_op_Dynamic_Z451691CD(h_2, "style")(empty())(singleton_1(text(toText(printf("@keyframes %s { from { %s } to { %s } }"))(id)(fromstyle)(tostyle))));
+        void (defs.push(item));
+        patternInput = [anim(style), toText(printf("animation: %s %dms %s; "))(id)(ms)(ease)];
+    }
+    const style_1 = patternInput[0];
+    return ((((patternInput[1] + join("", toList(delay(() => map_1((c) => (("cursor:" + c) + ";"), split(style_1.Cursor, [","], undefined, 0)))))) + (("font:" + style_1.Font) + ";")) + ((patternInput_1 = style_1.StrokeColor, (arg_10 = Svg_formatColor(patternInput_1[1]), toText(printf("stroke-opacity:%f; stroke-width:%dpx; stroke:%s; "))(patternInput_1[0])(style_1.StrokeWidth.fields[0])(arg_10))))) + (isEmpty(style_1.StrokeDashArray) ? "" : (("stroke-dasharray:" + join(",", map_1(Svg_formatNumber, style_1.StrokeDashArray))) + ";"))) + ((matchValue_1 = style_1.Fill, (matchValue_1.tag === 0) ? ((arg_17 = Svg_formatColor(matchValue_1.fields[0][1]), toText(printf("fill-opacity:%f; fill:%s; "))(matchValue_1.fields[0][0])(arg_17))) : ((id_1 = ("gradient_" + replace((copyOfStruct_1 = newGuid(), copyOfStruct_1), "-", "")), ((item_1 = El_op_Dynamic_Z451691CD(s_6, "linearGradient")(singleton_1(op_EqualsGreater("id", id_1)))(toList(delay(() => collect((matchValue_2) => singleton(El_op_Dynamic_Z451691CD(s_6, "stop")(ofArray([op_EqualsGreater("offset", matchValue_2[0].toString() + "%"), op_EqualsGreater("stop-color", Svg_formatColor(matchValue_2[1][1])), op_EqualsGreater("stop-opacity", matchValue_2[1][0].toString())]))(empty())), matchValue_1.fields[0])))), void (defs.push(item_1))), toText(printf("fill:url(#%s)"))(id_1))))));
+}
+
+export class Scales_ScaledShape extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["ScaledStyle", "ScaledText", "ScaledLine", "ScaledBubble", "ScaledShape", "ScaledLayered", "ScaledInteractive", "ScaledPadding", "ScaledOffset", "ScaledNestX", "ScaledNestY"];
+    }
+}
+
+export function Scales_ScaledShape_$reflection(gen0, gen1) {
+    return union_type("Compost.Scales.ScaledShape", [gen0, gen1], Scales_ScaledShape, () => [[["Item1", lambda_type(Style_$reflection(), Style_$reflection())], ["Item2", Scales_ScaledShape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen1)], ["Item3", VerticalAlign_$reflection()], ["Item4", HorizontalAlign_$reflection()], ["Item5", float64_type], ["Item6", string_type]], [["Item", array_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)))]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen1)], ["Item3", float64_type], ["Item4", float64_type]], [["Item", array_type(tuple_type(Value_$reflection(gen0), Value_$reflection(gen1)))]], [["Item", array_type(Scales_ScaledShape_$reflection(gen0, gen1))]], [["Item1", class_type("System.Collections.Generic.IEnumerable`1", [EventHandler_$reflection(gen0, gen1)])], ["Item2", Scale_$reflection(gen0)], ["Item3", Scale_$reflection(gen1)], ["Item4", Scales_ScaledShape_$reflection(gen0, gen1)]], [["Item1", tuple_type(float64_type, float64_type, float64_type, float64_type)], ["Item2", Scale_$reflection(gen0)], ["Item3", Scale_$reflection(gen1)], ["Item4", Scales_ScaledShape_$reflection(gen0, gen1)]], [["Item1", tuple_type(float64_type, float64_type)], ["Item2", Scales_ScaledShape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen0)], ["Item2", Value_$reflection(gen0)], ["Item3", Scale_$reflection(gen0)], ["Item4", Scales_ScaledShape_$reflection(gen0, gen1)]], [["Item1", Value_$reflection(gen1)], ["Item2", Value_$reflection(gen1)], ["Item3", Scale_$reflection(gen1)], ["Item4", Scales_ScaledShape_$reflection(gen0, gen1)]]]);
+}
+
+export function Scales_getExtremes(_arg) {
+    if (_arg.tag === 1) {
+        const vals = _arg.fields[0];
+        return [new Value(0, [item_2(0, vals), 0]), new Value(0, [item_2(vals.length - 1, vals), 1])];
+    }
+    else {
+        return [new Value(1, [_arg.fields[0]]), new Value(1, [_arg.fields[1]])];
+    }
+}
+
+/**
+ * Given a range, return a new aligned range together with the magnitude
+ */
+export function Scales_calculateMagnitudeAndRange(lo, hi) {
+    let arg1__1;
+    const magnitude_1 = ((arg1__1 = round(Math.log10(hi - lo)), Math.pow(10, arg1__1))) / 2;
+    return [magnitude_1, [Math.floor(lo / magnitude_1) * magnitude_1, Math.ceil(hi / magnitude_1) * magnitude_1]];
+}
+
+/**
+ * Get number of decimal points to show for the given range
+ */
+export function Scales_decimalPoints(range_, range__1) {
+    const range = [range_, range__1];
+    const patternInput = Scales_calculateMagnitudeAndRange(range[0], range[1]);
+    return max(0, Math.ceil(-Math.log10(patternInput[0])));
+}
+
+/**
+ * Extend the given range to a nicely adjusted size
+ */
+export function Scales_adjustRange(range_, range__1) {
+    const range = [range_, range__1];
+    return Scales_calculateMagnitudeAndRange(range[0], range[1])[1];
+}
+
+export function Scales_adjustRangeUnits(l, h) {
+    const patternInput = Scales_adjustRange(l, h);
+    return [patternInput[0], patternInput[1]];
+}
+
+export function Scales_toArray(s) {
+    return Array.from(s);
+}
+
+/**
+ * Generate points for a grid. Count specifies how many points to generate
+ * (this is minimm - the result will be up to 5x more).
+ */
+export function Scales_generateSteps(count, k, lo, hi) {
+    const patternInput = Scales_calculateMagnitudeAndRange(lo, hi);
+    const magnitude = patternInput[0];
+    const step_1 = defaultArg(tryHead(filter((m) => (((hi - lo) / m) >= count), map_1((d) => (magnitude / d), [0.2, 0.5, 1, 2, 5, 10, 20, 40, 50, 60, 80, 100]))), magnitude / 100);
+    return Scales_toArray(delay(() => collect((v) => (((v >= lo) && (v <= hi)) ? singleton(v) : empty_1()), rangeDouble(patternInput[1][0], step_1 * k, patternInput[1][1]))));
+}
+
+export function Scales_generateAxisSteps(s) {
+    if (s.tag === 1) {
+        return toArray(delay(() => collect((matchValue) => singleton(new Value(0, [new categorical(matchValue.fields[0]), 0.5])), s.fields[0])));
+    }
+    else {
+        return map((f) => (new Value(1, [new continuous(f)])), Scales_generateSteps(6, 1, s.fields[0].fields[0], s.fields[1].fields[0]));
+    }
+}
+
+export function Scales_generateAxisLabels(fmt, s) {
+    const sunit = s;
+    if (s.tag === 1) {
+        return toArray(delay(() => collect((matchValue) => {
+            const s_1 = matchValue.fields[0];
+            return singleton([new Value(0, [new categorical(s_1), 0.5]), fmt(sunit, new Value(0, [new categorical(s_1), 0.5]))]);
+        }, s.fields[0])));
+    }
+    else {
+        return map((f) => [new Value(1, [new continuous(f)]), fmt(sunit, new Value(1, [new continuous(f)]))], Scales_generateSteps(6, 2, s.fields[0].fields[0], s.fields[1].fields[0]));
+    }
+}
+
+export function Scales_unionScales(s1, s2) {
+    let matchResult, h1, h2, l1, l2, v1, v2;
+    if (s1.tag === 1) {
+        if (s2.tag === 1) {
+            matchResult = 1;
+            v1 = s1.fields[0];
+            v2 = s2.fields[0];
+        }
+        else {
+            matchResult = 2;
+        }
+    }
+    else if (s2.tag === 0) {
+        matchResult = 0;
+        h1 = s1.fields[1];
+        h2 = s2.fields[1];
+        l1 = s1.fields[0];
+        l2 = s2.fields[0];
+    }
+    else {
+        matchResult = 2;
+    }
+    switch (matchResult) {
+        case 0:
+            return new Scale(0, [min_1(compare, l1, l2), max_1(compare, h1, h2)]);
+        case 1:
+            return new Scale(1, [Array_distinct(append_1(v1, v2), {
+                Equals: equals,
+                GetHashCode: safeHash,
+            })]);
+        default:
+            throw new Error("Cannot union continuous with categorical");
+    }
+}
+
+export function Scales_calculateShapeScale(vals) {
+    const scales = fold((state, value) => {
+        let matchResult, v, v_1, vs, x, x_1, xs;
+        switch (state.tag) {
+            case 1: {
+                if (value.tag === 1) {
+                    matchResult = 1;
+                    v_1 = value.fields[0].fields[0];
+                    vs = state.fields[0];
+                }
+                else {
+                    matchResult = 4;
+                }
+                break;
+            }
+            case 2: {
+                if (value.tag === 0) {
+                    matchResult = 3;
+                    x_1 = value.fields[0].fields[0];
+                    xs = state.fields[0];
+                }
+                else {
+                    matchResult = 4;
+                }
+                break;
+            }
+            default:
+                if (value.tag === 0) {
+                    matchResult = 2;
+                    x = value.fields[0].fields[0];
+                }
+                else {
+                    matchResult = 0;
+                    v = value.fields[0].fields[0];
+                }
+        }
+        switch (matchResult) {
+            case 0:
+                return new FSharpChoice$3(1, [singleton_1(v)]);
+            case 1:
+                return new FSharpChoice$3(1, [cons(v_1, vs)]);
+            case 2:
+                return new FSharpChoice$3(2, [singleton_1(x)]);
+            case 3:
+                return new FSharpChoice$3(2, [cons(x_1, xs)]);
+            default:
+                throw new Error("Values with mismatching scales");
+        }
+    }, new FSharpChoice$3(0, [undefined]), vals);
+    switch (scales.tag) {
+        case 1: {
+            const vs_1 = scales.fields[0];
+            return new Scale(0, [new continuous(min_2(vs_1, {
+                Compare: comparePrimitives,
+            })), new continuous(max_2(vs_1, {
+                Compare: comparePrimitives,
+            }))]);
+        }
+        case 2:
+            return new Scale(1, [Array_distinct(toArray(delay(() => map_1((x_4) => (new categorical(x_4)), reverse(scales.fields[0])))), {
+                Equals: equals,
+                GetHashCode: safeHash,
+            })]);
+        default:
+            throw new Error("No values for calculating a scale");
+    }
+}
+
+export function Scales_calculateShapeScales(points) {
+    const xs = map((tuple) => tuple[0], points);
+    const ys = map((tuple_1) => tuple_1[1], points);
+    return [Scales_calculateShapeScale(xs), Scales_calculateShapeScale(ys)];
+}
+
+export function Scales_calculateScales(style, shape) {
+    const calculateScales = (shape_2) => Scales_calculateScales(style, shape_2);
+    switch (shape.tag) {
+        case 4: {
+            const nx2 = shape.fields[1];
+            const nx1 = shape.fields[0];
+            const patternInput_1 = calculateScales(shape.fields[2]);
+            return [[Scales_calculateShapeScale([nx1, nx2]), patternInput_1[0][1]], new Scales_ScaledShape(9, [nx1, nx2, patternInput_1[0][0], patternInput_1[1]])];
+        }
+        case 5: {
+            const ny2 = shape.fields[1];
+            const ny1 = shape.fields[0];
+            const patternInput_2 = calculateScales(shape.fields[2]);
+            return [[patternInput_2[0][0], Scales_calculateShapeScale([ny1, ny2])], new Scales_ScaledShape(10, [ny1, ny2, patternInput_2[0][1], patternInput_2[1]])];
+        }
+        case 3: {
+            const sy = shape.fields[1];
+            const sx = shape.fields[0];
+            const patternInput_3 = calculateScales(shape.fields[2]);
+            return [[(sx != null) ? sx : patternInput_3[0][0], (sy != null) ? sy : patternInput_3[0][1]], patternInput_3[1]];
+        }
+        case 2: {
+            const patternInput_4 = calculateScales(shape.fields[2]);
+            const isy_3 = patternInput_4[0][1];
+            const isx_3 = patternInput_4[0][0];
+            const autoScale = (_arg) => {
+                if (_arg.tag === 0) {
+                    const patternInput_5 = Scales_adjustRangeUnits(_arg.fields[0].fields[0], _arg.fields[1].fields[0]);
+                    return new Scale(0, [new continuous(patternInput_5[0]), new continuous(patternInput_5[1])]);
+                }
+                else {
+                    return _arg;
+                }
+            };
+            return [[shape.fields[0] ? autoScale(isx_3) : isx_3, shape.fields[1] ? autoScale(isy_3) : isy_3], patternInput_4[1]];
+        }
+        case 13: {
+            const patternInput_6 = calculateScales(shape.fields[1]);
+            return [patternInput_6[0], new Scales_ScaledShape(8, [shape.fields[0], patternInput_6[1]])];
+        }
+        case 12: {
+            const patternInput_7 = calculateScales(shape.fields[1]);
+            const sy_3 = patternInput_7[0][1];
+            const sx_3 = patternInput_7[0][0];
+            return [[sx_3, sy_3], new Scales_ScaledShape(7, [shape.fields[0], sx_3, sy_3, patternInput_7[1]])];
+        }
+        case 7: {
+            const y = shape.fields[1];
+            const x = shape.fields[0];
+            const makeSingletonScale = (_arg_1) => {
+                if (_arg_1.tag === 0) {
+                    return new Scale(1, [[_arg_1.fields[0]]]);
+                }
+                else {
+                    const v = _arg_1.fields[0];
+                    return new Scale(0, [v, v]);
+                }
+            };
+            return [[makeSingletonScale(x), makeSingletonScale(y)], new Scales_ScaledShape(3, [x, y, shape.fields[2], shape.fields[3]])];
+        }
+        case 1: {
+            const y_1 = shape.fields[1];
+            const x_1 = shape.fields[0];
+            const makeSingletonScale_1 = (_arg_2) => {
+                if (_arg_2.tag === 0) {
+                    return new Scale(1, [[_arg_2.fields[0]]]);
+                }
+                else {
+                    const v_2 = _arg_2.fields[0];
+                    return new Scale(0, [v_2, v_2]);
+                }
+            };
+            return [[makeSingletonScale_1(x_1), makeSingletonScale_1(y_1)], new Scales_ScaledShape(1, [x_1, y_1, shape.fields[2], shape.fields[3], shape.fields[4], shape.fields[5]])];
+        }
+        case 6: {
+            const line_1 = toArray(shape.fields[0]);
+            return [Scales_calculateShapeScales(line_1), new Scales_ScaledShape(2, [line_1])];
+        }
+        case 8: {
+            const points_1 = toArray(shape.fields[0]);
+            return [Scales_calculateShapeScales(points_1), new Scales_ScaledShape(4, [points_1])];
+        }
+        case 10: {
+            const showTop = shape.fields[0];
+            const showRight = shape.fields[1];
+            const showLeft = shape.fields[3];
+            const showBottom = shape.fields[2];
+            const shape_17 = shape.fields[4];
+            const patternInput_8 = calculateScales(shape_17);
+            const sy_4 = patternInput_8[0][1];
+            const sx_4 = patternInput_8[0][0];
+            const matchValue = Scales_getExtremes(sx_4);
+            const matchValue_1 = Scales_getExtremes(sy_4);
+            const ly = matchValue_1[0];
+            const lx = matchValue[0];
+            const hy = matchValue_1[1];
+            const hx = matchValue[1];
+            const LineStyle = (clr, alpha, width, shape_18) => (new Shape(0, [(s) => (new Style([alpha, new Color(1, [clr])], new Width(width), s.StrokeDashArray, new FillStyle(0, [[1, new Color(1, ["transparent"])]]), s.Animation, s.Font, s.Cursor, s.FormatAxisXLabel, s.FormatAxisYLabel)), shape_18]));
+            const FontStyle = (style_2, shape_19) => (new Shape(0, [(s_1) => (new Style([0, new Color(1, ["transparent"])], s_1.StrokeWidth, s_1.StrokeDashArray, new FillStyle(0, [[1, new Color(1, ["black"])]]), s_1.Animation, style_2, s_1.Cursor, s_1.FormatAxisXLabel, s_1.FormatAxisYLabel)), shape_19]));
+            return calculateScales(new Shape(12, [[showTop ? 30 : 0, showRight ? 50 : 0, showBottom ? 30 : 0, showLeft ? 50 : 0], new Shape(9, [toList(delay(() => append(singleton(new Shape(3, [sx_4, sy_4, new Shape(9, [toList(delay(() => append(map_1((x_2) => LineStyle("#e4e4e4", 1, 1, new Shape(6, [[[x_2, ly], [x_2, hy]]])), Scales_generateAxisSteps(sx_4)), delay(() => map_1((y_2) => LineStyle("#e4e4e4", 1, 1, new Shape(6, [[[lx, y_2], [hx, y_2]]])), Scales_generateAxisSteps(sy_4))))))])])), delay(() => append(showTop ? append(singleton(LineStyle("black", 1, 2, new Shape(6, [[[lx, hy], [hx, hy]]]))), delay(() => collect((matchValue_2) => singleton(FontStyle("9pt sans-serif", new Shape(13, [[0, -10], new Shape(1, [matchValue_2[0], hy, new VerticalAlign(0, []), new HorizontalAlign(1, []), 0, matchValue_2[1]])]))), Scales_generateAxisLabels(style.FormatAxisXLabel, sx_4)))) : empty_1(), delay(() => append(showRight ? append(singleton(LineStyle("black", 1, 2, new Shape(6, [[[hx, hy], [hx, ly]]]))), delay(() => collect((matchValue_3) => singleton(FontStyle("9pt sans-serif", new Shape(13, [[10, 0], new Shape(1, [hx, matchValue_3[0], new VerticalAlign(1, []), new HorizontalAlign(0, []), 0, matchValue_3[1]])]))), Scales_generateAxisLabels(style.FormatAxisYLabel, sy_4)))) : empty_1(), delay(() => append(showBottom ? append(singleton(LineStyle("black", 1, 2, new Shape(6, [[[lx, ly], [hx, ly]]]))), delay(() => collect((matchValue_4) => singleton(FontStyle("9pt sans-serif", new Shape(13, [[0, 10], new Shape(1, [matchValue_4[0], ly, new VerticalAlign(2, []), new HorizontalAlign(1, []), 0, matchValue_4[1]])]))), Scales_generateAxisLabels(style.FormatAxisXLabel, sx_4)))) : empty_1(), delay(() => append(showLeft ? append(singleton(LineStyle("black", 1, 2, new Shape(6, [[[lx, hy], [lx, ly]]]))), delay(() => collect((matchValue_5) => singleton(FontStyle("9pt sans-serif", new Shape(13, [[-10, 0], new Shape(1, [lx, matchValue_5[0], new VerticalAlign(1, []), new HorizontalAlign(2, []), 0, matchValue_5[1]])]))), Scales_generateAxisLabels(style.FormatAxisYLabel, sy_4)))) : empty_1(), delay(() => singleton(shape_17)))))))))))))])]));
+        }
+        case 9: {
+            const scaled = map(calculateScales, Array.from(shape.fields[0]));
+            const sxs = map((tupledArg) => tupledArg[0][0], scaled);
+            const sys = map((tupledArg_1) => tupledArg_1[0][1], scaled);
+            return [[sxs.reduce(Scales_unionScales), sys.reduce(Scales_unionScales)], new Scales_ScaledShape(5, [map((tuple) => tuple[1], scaled)])];
+        }
+        case 11: {
+            const patternInput_10 = calculateScales(shape.fields[1]);
+            const scales_8 = patternInput_10[0];
+            return [scales_8, new Scales_ScaledShape(6, [shape.fields[0], scales_8[0], scales_8[1], patternInput_10[1]])];
+        }
+        default: {
+            const f = shape.fields[0];
+            const patternInput = Scales_calculateScales(f(style), shape.fields[1]);
+            return [patternInput[0], new Scales_ScaledShape(0, [f, patternInput[1]])];
+        }
+    }
+}
+
+export function Projections_projectOne(reversed, tlv, thv, scale, coord) {
+    if (scale.tag === 0) {
+        if (coord.tag === 0) {
+            return toFail(printf("Cannot project categorical value (%A) on a continuous scale (%A)."))(coord)(scale);
+        }
+        else if (reversed) {
+            return thv - (((coord.fields[0].fields[0] - scale.fields[0].fields[0]) / (scale.fields[1].fields[0] - scale.fields[0].fields[0])) * (thv - tlv));
+        }
+        else {
+            return tlv + (((coord.fields[0].fields[0] - scale.fields[0].fields[0]) / (scale.fields[1].fields[0] - scale.fields[0].fields[0])) * (thv - tlv));
+        }
+    }
+    else if (coord.tag === 1) {
+        return toFail(printf("Cannot project continuous value (%A) on a categorical scale (%A)."))(coord)(scale);
+    }
+    else {
+        const size = (thv - tlv) / scale.fields[0].length;
+        const i_1 = findIndex((_arg) => (coord.fields[0].fields[0] === _arg.fields[0]), scale.fields[0]) + coord.fields[1];
+        if (reversed) {
+            return thv - (i_1 * size);
+        }
+        else {
+            return tlv + (i_1 * size);
+        }
+    }
+}
+
+export function Projections_projectOneX(a_, a__1) {
+    const a = [a_, a__1];
+    return (scale) => ((coord) => Projections_projectOne(false, a[0], a[1], scale, coord));
+}
+
+export function Projections_projectOneY(a_, a__1) {
+    const a = [a_, a__1];
+    return (scale) => ((coord) => Projections_projectOne(true, a[0], a[1], scale, coord));
+}
+
+export function Projections_projectInvOne(reversed, l, h, s, v) {
+    if (s.tag === 1) {
+        const cats = s.fields[0];
+        const size = (h - l) / cats.length;
+        const i = reversed ? Math.floor((h - v) / size) : Math.floor((v - l) / size);
+        const f = reversed ? (((h - v) / size) - i) : (((v - l) / size) - i);
+        const i_1 = (size < 0) ? (cats.length + i) : i;
+        if ((~~i_1 < 0) ? true : (~~i_1 >= cats.length)) {
+            return new Value(0, [new categorical("<outside-of-range>"), f]);
+        }
+        else {
+            return new Value(0, [item_2(~~i_1, cats), f]);
+        }
+    }
+    else {
+        const slv = s.fields[0].fields[0];
+        const shv = s.fields[1].fields[0];
+        if (reversed) {
+            return new Value(1, [new continuous(shv - (((v - l) / (h - l)) * (shv - slv)))]);
+        }
+        else {
+            return new Value(1, [new continuous(slv + (((v - l) / (h - l)) * (shv - slv)))]);
+        }
+    }
+}
+
+export function Projections_projectInv(x1, y1, x2, y2, sx, sy, x, y) {
+    return [Projections_projectInvOne(false, x1, x2, sx, x), Projections_projectInvOne(true, y1, y2, sy, y)];
+}
+
+export class Drawing_DrawingContext extends Record {
+    constructor(Style, Definitions) {
+        super();
+        this.Style = Style;
+        this.Definitions = Definitions;
+    }
+}
+
+export function Drawing_DrawingContext_$reflection() {
+    return record_type("Compost.Drawing.DrawingContext", [], Drawing_DrawingContext, () => [["Style", Style_$reflection()], ["Definitions", array_type(DomNode_$reflection())]]);
+}
+
+export function Drawing_hideFill(style) {
+    let matchValue, f;
+    return new Style(style.StrokeColor, style.StrokeWidth, style.StrokeDashArray, new FillStyle(0, [[0, new Color(0, [0, 0, 0])]]), (matchValue = style.Animation, (matchValue != null) ? ((f = matchValue[2], [matchValue[0], matchValue[1], (arg) => Drawing_hideFill(f(arg))])) : undefined), style.Font, style.Cursor, style.FormatAxisXLabel, style.FormatAxisYLabel);
+}
+
+export function Drawing_hideStroke(style) {
+    let matchValue, f;
+    return new Style([0, style.StrokeColor[1]], style.StrokeWidth, style.StrokeDashArray, style.Fill, (matchValue = style.Animation, (matchValue != null) ? ((f = matchValue[2], [matchValue[0], matchValue[1], (arg) => Drawing_hideStroke(f(arg))])) : undefined), style.Font, style.Cursor, style.FormatAxisXLabel, style.FormatAxisYLabel);
+}
+
+export function Drawing_drawShape(ctx_mut, area__mut, area__1_mut, area__2_mut, area__3_mut, scales__mut, scales__1_mut, shape_mut) {
+    Drawing_drawShape:
+    while (true) {
+        const ctx = ctx_mut, area_ = area__mut, area__1 = area__1_mut, area__2 = area__2_mut, area__3 = area__3_mut, scales_ = scales__mut, scales__1 = scales__1_mut, shape = shape_mut;
+        const area_1 = [area_, area__1, area__2, area__3];
+        const y2 = area_1[3];
+        const y1 = area_1[1];
+        const x2 = area_1[2];
+        const x1 = area_1[0];
+        const scales_1 = [scales_, scales__1];
+        const sy = scales_1[1];
+        const sx = scales_1[0];
+        const project = (tupledArg) => [Projections_projectOneX(x1, x2)(sx)(tupledArg[0]), Projections_projectOneY(y1, y2)(sy)(tupledArg[1])];
+        switch (shape.tag) {
+            case 10: {
+                ctx_mut = ctx;
+                area__mut = x1;
+                area__1_mut = Projections_projectOneY(y1, y2)(sy)(shape.fields[0]);
+                area__2_mut = x2;
+                area__3_mut = Projections_projectOneY(y1, y2)(sy)(shape.fields[1]);
+                scales__mut = sx;
+                scales__1_mut = shape.fields[2];
+                shape_mut = shape.fields[3];
+                continue Drawing_drawShape;
+            }
+            case 8: {
+                const dy = shape.fields[0][1];
+                const dx = shape.fields[0][0];
+                ctx_mut = ctx;
+                area__mut = (x1 + dx);
+                area__1_mut = (y1 + dy);
+                area__2_mut = (x2 + dx);
+                area__3_mut = (y2 + dy);
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[1];
+                continue Drawing_drawShape;
+            }
+            case 5:
+                return new Svg_Svg(4, [map((shape_4) => Drawing_drawShape(ctx, area_1[0], area_1[1], area_1[2], area_1[3], scales_1[0], scales_1[1], shape_4), shape.fields[0])]);
+            case 0: {
+                ctx_mut = (new Drawing_DrawingContext(shape.fields[0](ctx.Style), ctx.Definitions));
+                area__mut = area_1[0];
+                area__1_mut = area_1[1];
+                area__2_mut = area_1[2];
+                area__3_mut = area_1[3];
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[1];
+                continue Drawing_drawShape;
+            }
+            case 4: {
+                const points = shape.fields[0];
+                return new Svg_Svg(0, [toArray(delay(() => append(singleton(new Svg_PathSegment(0, [project(item_2(0, points))])), delay(() => append(map_1((pt) => (new Svg_PathSegment(1, [project(pt)])), skip(1, points)), delay(() => singleton(new Svg_PathSegment(1, [project(item_2(0, points))])))))))), Svg_formatStyle(ctx.Definitions, Drawing_hideStroke(ctx.Style))]);
+            }
+            case 7: {
+                const isy_1 = shape.fields[2];
+                const isx_1 = shape.fields[1];
+                const calculateNestedRange = (rev) => ((tupledArg_1) => ((ins) => {
+                    const v1 = tupledArg_1[0];
+                    const v2 = tupledArg_1[1];
+                    return (outs) => {
+                        if (ins.tag === 1) {
+                            const pos_1 = collect((v) => ofArray([Projections_projectOne(rev, v1, v2, outs, new Value(0, [v, 0])), Projections_projectOne(rev, v1, v2, outs, new Value(0, [v, 1]))]), ins.fields[0]);
+                            return [min_3(pos_1, {
+                                Compare: comparePrimitives,
+                            }), max_3(pos_1, {
+                                Compare: comparePrimitives,
+                            })];
+                        }
+                        else {
+                            const pos = ofArray([Projections_projectOne(rev, v1, v2, outs, new Value(1, [new continuous(ins.fields[0].fields[0])])), Projections_projectOne(rev, v1, v2, outs, new Value(1, [new continuous(ins.fields[1].fields[0])]))]);
+                            return [min_3(pos, {
+                                Compare: comparePrimitives,
+                            }), max_3(pos, {
+                                Compare: comparePrimitives,
+                            })];
+                        }
+                    };
+                }));
+                const patternInput = calculateNestedRange(false)([x1, x2])(isx_1)(sx);
+                const patternInput_1 = calculateNestedRange(true)([y1, y2])(isy_1)(sy);
+                ctx_mut = ctx;
+                area__mut = (patternInput[0] + shape.fields[0][3]);
+                area__1_mut = (patternInput_1[0] + shape.fields[0][0]);
+                area__2_mut = (patternInput[1] - shape.fields[0][1]);
+                area__3_mut = (patternInput_1[1] - shape.fields[0][2]);
+                scales__mut = isx_1;
+                scales__1_mut = isy_1;
+                shape_mut = shape.fields[3];
+                continue Drawing_drawShape;
+            }
+            case 2: {
+                const line = shape.fields[0];
+                return new Svg_Svg(0, [Array.from(delay(() => append(singleton(new Svg_PathSegment(0, [project(head(line))])), delay(() => map_1((pt_1) => (new Svg_PathSegment(1, [project(pt_1)])), skip(1, line)))))), Svg_formatStyle(ctx.Definitions, Drawing_hideFill(ctx.Style))]);
+            }
+            case 1: {
+                const va = shape.fields[2];
+                const ha = shape.fields[3];
+                const va_1 = (va.tag === 2) ? "hanging" : ((va.tag === 1) ? "middle" : "baseline");
+                const ha_1 = (ha.tag === 1) ? "middle" : ((ha.tag === 2) ? "end" : "start");
+                return new Svg_Svg(3, [project([shape.fields[0], shape.fields[1]]), shape.fields[5], shape.fields[4], toText(printf("alignment-baseline:%s; text-anchor:%s;"))(va_1)(ha_1) + Svg_formatStyle(ctx.Definitions, ctx.Style)]);
+            }
+            case 3:
+                return new Svg_Svg(1, [project([shape.fields[0], shape.fields[1]]), [shape.fields[2], shape.fields[3]], Svg_formatStyle(ctx.Definitions, ctx.Style)]);
+            case 6: {
+                ctx_mut = ctx;
+                area__mut = area_1[0];
+                area__1_mut = area_1[1];
+                area__2_mut = area_1[2];
+                area__3_mut = area_1[3];
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[3];
+                continue Drawing_drawShape;
+            }
+            default: {
+                ctx_mut = ctx;
+                area__mut = Projections_projectOneX(x1, x2)(sx)(shape.fields[0]);
+                area__1_mut = y1;
+                area__2_mut = Projections_projectOneX(x1, x2)(sx)(shape.fields[1]);
+                area__3_mut = y2;
+                scales__mut = shape.fields[2];
+                scales__1_mut = sy;
+                shape_mut = shape.fields[3];
+                continue Drawing_drawShape;
+            }
+        }
+        break;
+    }
+}
+
+export class Events_MouseEventKind extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Click", "Move", "Up", "Down"];
+    }
+}
+
+export function Events_MouseEventKind_$reflection() {
+    return union_type("Compost.Events.MouseEventKind", [], Events_MouseEventKind, () => [[], [], [], []]);
+}
+
+export class Events_TouchEventKind extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["Move", "Start"];
+    }
+}
+
+export function Events_TouchEventKind_$reflection() {
+    return union_type("Compost.Events.TouchEventKind", [], Events_TouchEventKind, () => [[], []]);
+}
+
+export class Events_InteractiveEvent extends Union {
+    constructor(tag, fields) {
+        super();
+        this.tag = tag;
+        this.fields = fields;
+    }
+    cases() {
+        return ["MouseEvent", "TouchEvent", "TouchEnd", "MouseLeave"];
+    }
+}
+
+export function Events_InteractiveEvent_$reflection(gen0, gen1) {
+    return union_type("Compost.Events.InteractiveEvent", [gen0, gen1], Events_InteractiveEvent, () => [[["Item1", Events_MouseEventKind_$reflection()], ["Item2", tuple_type(Value_$reflection(gen0), Value_$reflection(gen1))]], [["Item1", Events_TouchEventKind_$reflection()], ["Item2", tuple_type(Value_$reflection(gen0), Value_$reflection(gen1))]], [], []]);
+}
+
+export function Events_projectEvent(area_, area__1, area__2, area__3, scales_, scales__1, event) {
+    const area = [area_, area__1, area__2, area__3];
+    const scales = [scales_, scales__1];
+    let matchResult, kind, x, y, kind_1, x_3, y_3;
+    switch (event.tag) {
+        case 1: {
+            if (event.fields[1][0].tag === 1) {
+                if (event.fields[1][1].tag === 1) {
+                    matchResult = 1;
+                    kind_1 = event.fields[0];
+                    x_3 = event.fields[1][0].fields[0].fields[0];
+                    y_3 = event.fields[1][1].fields[0].fields[0];
+                }
+                else {
+                    matchResult = 2;
+                }
+            }
+            else {
+                matchResult = 2;
+            }
+            break;
+        }
+        case 2: {
+            matchResult = 3;
+            break;
+        }
+        case 3: {
+            matchResult = 4;
+            break;
+        }
+        default:
+            if (event.fields[1][0].tag === 1) {
+                if (event.fields[1][1].tag === 1) {
+                    matchResult = 0;
+                    kind = event.fields[0];
+                    x = event.fields[1][0].fields[0].fields[0];
+                    y = event.fields[1][1].fields[0].fields[0];
+                }
+                else {
+                    matchResult = 2;
+                }
+            }
+            else {
+                matchResult = 2;
+            }
+    }
+    switch (matchResult) {
+        case 0:
+            return new Events_InteractiveEvent(0, [kind, Projections_projectInv(area[0], area[1], area[2], area[3], scales[0], scales[1], x, y)]);
+        case 1:
+            return new Events_InteractiveEvent(1, [kind_1, Projections_projectInv(area[0], area[1], area[2], area[3], scales[0], scales[1], x_3, y_3)]);
+        case 2:
+            throw new Error("TODO: projectEvent - not continuous");
+        case 3:
+            return new Events_InteractiveEvent(2, []);
+        default:
+            return new Events_InteractiveEvent(3, []);
+    }
+}
+
+export function Events_inScale(s, v) {
+    if (s.tag === 1) {
+        if (v.tag === 1) {
+            throw new Error("inScale: Cannot test if continuous value is in categorical scale");
+        }
+        else {
+            return exists((y) => equals(v.fields[0], y), s.fields[0]);
+        }
+    }
+    else if (v.tag === 0) {
+        throw new Error("inScale: Cannot test if categorical value is in continuous scale");
+    }
+    else if (v.fields[0].fields[0] >= min(s.fields[0].fields[0], s.fields[1].fields[0])) {
+        return v.fields[0].fields[0] <= max(s.fields[0].fields[0], s.fields[1].fields[0]);
+    }
+    else {
+        return false;
+    }
+}
+
+export function Events_inScales(sx, sy, event) {
+    let matchResult, x, y;
+    switch (event.tag) {
+        case 2: {
+            matchResult = 1;
+            break;
+        }
+        case 0: {
+            matchResult = 2;
+            x = event.fields[1][0];
+            y = event.fields[1][1];
+            break;
+        }
+        case 1: {
+            matchResult = 2;
+            x = event.fields[1][0];
+            y = event.fields[1][1];
+            break;
+        }
+        default:
+            matchResult = 0;
+    }
+    switch (matchResult) {
+        case 0:
+            return true;
+        case 1:
+            return true;
+        default:
+            if (Events_inScale(sx, x)) {
+                return Events_inScale(sy, y);
+            }
+            else {
+                return false;
+            }
+    }
+}
+
+export function Events_triggerEvent(area__mut, area__1_mut, area__2_mut, area__3_mut, scales__mut, scales__1_mut, shape_mut, jse_mut, event_mut) {
+    Events_triggerEvent:
+    while (true) {
+        const area_ = area__mut, area__1 = area__1_mut, area__2 = area__2_mut, area__3 = area__3_mut, scales_ = scales__mut, scales__1 = scales__1_mut, shape = shape_mut, jse = jse_mut, event = event_mut;
+        const area_1 = [area_, area__1, area__2, area__3];
+        const y2 = area_1[3];
+        const y1 = area_1[1];
+        const x2 = area_1[2];
+        const x1 = area_1[0];
+        const scales_1 = [scales_, scales__1];
+        const sy = scales_1[1];
+        const sx = scales_1[0];
+        switch (shape.tag) {
+            case 0: {
+                area__mut = area_1[0];
+                area__1_mut = area_1[1];
+                area__2_mut = area_1[2];
+                area__3_mut = area_1[3];
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[1];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            case 8: {
+                const dy = shape.fields[0][1];
+                const dx = shape.fields[0][0];
+                area__mut = (x1 + dx);
+                area__1_mut = (y1 + dy);
+                area__2_mut = (x2 + dx);
+                area__3_mut = (y2 + dy);
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[1];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            case 9: {
+                area__mut = Projections_projectOneX(x1, x2)(sx)(shape.fields[0]);
+                area__1_mut = y1;
+                area__2_mut = Projections_projectOneX(x1, x2)(sx)(shape.fields[1]);
+                area__3_mut = y2;
+                scales__mut = shape.fields[2];
+                scales__1_mut = sy;
+                shape_mut = shape.fields[3];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            case 10: {
+                area__mut = x1;
+                area__1_mut = Projections_projectOneY(y1, y2)(sy)(shape.fields[0]);
+                area__2_mut = x2;
+                area__3_mut = Projections_projectOneY(y1, y2)(sy)(shape.fields[1]);
+                scales__mut = sx;
+                scales__1_mut = shape.fields[2];
+                shape_mut = shape.fields[3];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            case 7: {
+                const isy_1 = shape.fields[2];
+                const isx_1 = shape.fields[1];
+                const calculateNestedRange = (rev) => ((tupledArg) => ((ins) => {
+                    const v1 = tupledArg[0];
+                    const v2 = tupledArg[1];
+                    return (outs) => {
+                        if (ins.tag === 1) {
+                            const pos_1 = collect((v) => ofArray([Projections_projectOne(rev, v1, v2, outs, new Value(0, [v, 0])), Projections_projectOne(rev, v1, v2, outs, new Value(0, [v, 1]))]), ins.fields[0]);
+                            return [min_3(pos_1, {
+                                Compare: comparePrimitives,
+                            }), max_3(pos_1, {
+                                Compare: comparePrimitives,
+                            })];
+                        }
+                        else {
+                            const pos = ofArray([Projections_projectOne(rev, v1, v2, outs, new Value(1, [new continuous(ins.fields[0].fields[0])])), Projections_projectOne(rev, v1, v2, outs, new Value(1, [new continuous(ins.fields[1].fields[0])]))]);
+                            return [min_3(pos, {
+                                Compare: comparePrimitives,
+                            }), max_3(pos, {
+                                Compare: comparePrimitives,
+                            })];
+                        }
+                    };
+                }));
+                const patternInput = calculateNestedRange(false)([x1, x2])(isx_1)(sx);
+                const patternInput_1 = calculateNestedRange(true)([y1, y2])(isy_1)(sy);
+                area__mut = (patternInput[0] + shape.fields[0][3]);
+                area__1_mut = (patternInput_1[0] + shape.fields[0][0]);
+                area__2_mut = (patternInput[1] - shape.fields[0][1]);
+                area__3_mut = (patternInput_1[1] - shape.fields[0][2]);
+                scales__mut = isx_1;
+                scales__1_mut = isy_1;
+                shape_mut = shape.fields[3];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            case 5: {
+                const shapes = shape.fields[0];
+                for (let idx = 0; idx <= (shapes.length - 1); idx++) {
+                    Events_triggerEvent(area_1[0], area_1[1], area_1[2], area_1[3], scales_1[0], scales_1[1], item_2(idx, shapes), jse, event);
+                }
+                break;
+            }
+            case 6: {
+                const localEvent = Events_projectEvent(area_1[0], area_1[1], area_1[2], area_1[3], scales_1[0], scales_1[1], event);
+                if (Events_inScales(scales_1[0], scales_1[1], localEvent)) {
+                    const enumerator = getEnumerator(shape.fields[0]);
+                    try {
+                        while (enumerator["System.Collections.IEnumerator.MoveNext"]()) {
+                            const handler = enumerator["System.Collections.Generic.IEnumerator`1.get_Current"]();
+                            let matchResult, f, pt, f_1, pt_1, f_2, f_3;
+                            switch (localEvent.tag) {
+                                case 1: {
+                                    if (localEvent.fields[0].tag === 1) {
+                                        if (handler.tag === 4) {
+                                            matchResult = 1;
+                                            f_1 = curry2(handler.fields[0]);
+                                            pt_1 = localEvent.fields[1];
+                                        }
+                                        else {
+                                            matchResult = 4;
+                                        }
+                                    }
+                                    else if (handler.tag === 5) {
+                                        matchResult = 1;
+                                        f_1 = curry2(handler.fields[0]);
+                                        pt_1 = localEvent.fields[1];
+                                    }
+                                    else {
+                                        matchResult = 4;
+                                    }
+                                    break;
+                                }
+                                case 2: {
+                                    if (handler.tag === 6) {
+                                        matchResult = 2;
+                                        f_2 = handler.fields[0];
+                                    }
+                                    else {
+                                        matchResult = 4;
+                                    }
+                                    break;
+                                }
+                                case 3: {
+                                    if (handler.tag === 7) {
+                                        matchResult = 3;
+                                        f_3 = handler.fields[0];
+                                    }
+                                    else {
+                                        matchResult = 4;
+                                    }
+                                    break;
+                                }
+                                default:
+                                    switch (localEvent.fields[0].tag) {
+                                        case 1: {
+                                            if (handler.tag === 0) {
+                                                matchResult = 0;
+                                                f = curry2(handler.fields[0]);
+                                                pt = localEvent.fields[1];
+                                            }
+                                            else {
+                                                matchResult = 4;
+                                            }
+                                            break;
+                                        }
+                                        case 2: {
+                                            if (handler.tag === 1) {
+                                                matchResult = 0;
+                                                f = curry2(handler.fields[0]);
+                                                pt = localEvent.fields[1];
+                                            }
+                                            else {
+                                                matchResult = 4;
+                                            }
+                                            break;
+                                        }
+                                        case 3: {
+                                            if (handler.tag === 2) {
+                                                matchResult = 0;
+                                                f = curry2(handler.fields[0]);
+                                                pt = localEvent.fields[1];
+                                            }
+                                            else {
+                                                matchResult = 4;
+                                            }
+                                            break;
+                                        }
+                                        default:
+                                            if (handler.tag === 3) {
+                                                matchResult = 0;
+                                                f = curry2(handler.fields[0]);
+                                                pt = localEvent.fields[1];
+                                            }
+                                            else {
+                                                matchResult = 4;
+                                            }
+                                    }
+                            }
+                            switch (matchResult) {
+                                case 0: {
+                                    if (!equals(jse, defaultOf())) {
+                                        jse.preventDefault();
+                                    }
+                                    f(jse)(pt);
+                                    break;
+                                }
+                                case 1: {
+                                    if (!equals(jse, defaultOf())) {
+                                        jse.preventDefault();
+                                    }
+                                    f_1(jse)(pt_1);
+                                    break;
+                                }
+                                case 2: {
+                                    f_2(jse);
+                                    break;
+                                }
+                                case 3: {
+                                    f_3(jse);
+                                    break;
+                                }
+                            }
+                        }
+                    }
+                    finally {
+                        disposeSafe(enumerator);
+                    }
+                }
+                area__mut = area_1[0];
+                area__1_mut = area_1[1];
+                area__2_mut = area_1[2];
+                area__3_mut = area_1[3];
+                scales__mut = scales_1[0];
+                scales__1_mut = scales_1[1];
+                shape_mut = shape.fields[3];
+                jse_mut = jse;
+                event_mut = event;
+                continue Events_triggerEvent;
+                break;
+            }
+            default:
+                undefined;
+        }
+        break;
+    }
+}
+
+export function Derived_StrokeColor(clr, s) {
+    return new Shape(0, [(s_1) => (new Style([1, new Color(1, [clr])], s_1.StrokeWidth, s_1.StrokeDashArray, s_1.Fill, s_1.Animation, s_1.Font, s_1.Cursor, s_1.FormatAxisXLabel, s_1.FormatAxisYLabel)), s]);
+}
+
+export function Derived_FillColor(clr, s) {
+    return new Shape(0, [(s_1) => (new Style(s_1.StrokeColor, s_1.StrokeWidth, s_1.StrokeDashArray, new FillStyle(0, [[1, new Color(1, [clr])]]), s_1.Animation, s_1.Font, s_1.Cursor, s_1.FormatAxisXLabel, s_1.FormatAxisYLabel)), s]);
+}
+
+export function Derived_Font(font, clr, s) {
+    return new Shape(0, [(s_1) => (new Style([0, new Color(1, [clr])], s_1.StrokeWidth, s_1.StrokeDashArray, new FillStyle(0, [[1, new Color(1, [clr])]]), s_1.Animation, font, s_1.Cursor, s_1.FormatAxisXLabel, s_1.FormatAxisYLabel)), s]);
+}
+
+export function Derived_Area(line) {
+    return new Shape(8, [delay(() => {
+        const line_1 = Array.from(line);
+        const matchValue = item_2(0, line_1)[0];
+        const matchValue_1 = item_2(line_1.length - 1, line_1)[0];
+        const firstX = matchValue;
+        return append(singleton([firstX, new Value(1, [new continuous(0)])]), delay(() => append(line_1, delay(() => append(singleton([matchValue_1, new Value(1, [new continuous(0)])]), delay(() => singleton([firstX, new Value(1, [new continuous(0)])])))))));
+    })]);
+}
+
+export function Derived_VArea(line) {
+    return new Shape(8, [delay(() => {
+        const line_1 = Array.from(line);
+        const matchValue = item_2(0, line_1)[1];
+        const matchValue_1 = item_2(line_1.length - 1, line_1)[1];
+        const firstY = matchValue;
+        return append(singleton([new Value(1, [new continuous(0)]), firstY]), delay(() => append(line_1, delay(() => append(singleton([new Value(1, [new continuous(0)]), matchValue_1]), delay(() => singleton([new Value(1, [new continuous(0)]), firstY])))))));
+    })]);
+}
+
+export function Derived_VShiftedArea(offs, line) {
+    return new Shape(8, [delay(() => {
+        const line_1 = Array.from(line);
+        const matchValue = item_2(0, line_1)[1];
+        const matchValue_1 = item_2(line_1.length - 1, line_1)[1];
+        const firstY = matchValue;
+        return append(singleton([new Value(1, [new continuous(offs)]), firstY]), delay(() => append(line_1, delay(() => append(singleton([new Value(1, [new continuous(offs)]), matchValue_1]), delay(() => singleton([new Value(1, [new continuous(offs)]), firstY])))))));
+    })]);
+}
+
+export function Derived_Bar(x, y) {
+    return new Shape(8, [delay(() => append(singleton([new Value(1, [x]), new Value(0, [y, 0])]), delay(() => append(singleton([new Value(1, [x]), new Value(0, [y, 1])]), delay(() => append(singleton([new Value(1, [new continuous(0)]), new Value(0, [y, 1])]), delay(() => singleton([new Value(1, [new continuous(0)]), new Value(0, [y, 0])]))))))))]);
+}
+
+export function Derived_Column(x, y) {
+    return new Shape(8, [delay(() => append(singleton([new Value(0, [x, 0]), new Value(1, [y])]), delay(() => append(singleton([new Value(0, [x, 1]), new Value(1, [y])]), delay(() => append(singleton([new Value(0, [x, 1]), new Value(1, [new continuous(0)])]), delay(() => singleton([new Value(0, [x, 0]), new Value(1, [new continuous(0)])]))))))))]);
+}
+
+export function Compost_niceNumber(num, decs) {
+    const str = toString(num);
+    const dot = str.indexOf(".") | 0;
+    const patternInput = (dot === -1) ? [str, ""] : [substring(str, 0, dot), substring(str, dot + 1, min(decs, (str.length - dot) - 1))];
+    const before = patternInput[0];
+    const after = patternInput[1];
+    const after_1 = (after.length < decs) ? (after + (toArray(delay(() => map_1((i) => "0", rangeDouble(1, 1, decs - after.length)))).join(''))) : after;
+    let res = before;
+    if (before.length > 5) {
+        const enumerator = getEnumerator(rangeDouble(before.length - 1, -1, 0));
+        try {
+            while (enumerator["System.Collections.IEnumerator.MoveNext"]()) {
+                const i_1 = enumerator["System.Collections.Generic.IEnumerator`1.get_Current"]() | 0;
+                if ((i_1 !== 0) && (((before.length - i_1) % 3) === 0)) {
+                    res = insert(res, i_1, ",");
+                }
+            }
+        }
+        finally {
+            disposeSafe(enumerator);
+        }
+    }
+    if (forAll((y) => ("0" === y), after_1.split(""))) {
+        return res;
+    }
+    else {
+        return (res + ".") + after_1;
+    }
+}
+
+export function Compost_defaultFormat(scale, value) {
+    if (value.tag === 1) {
+        const dec = (scale.tag === 0) ? Scales_decimalPoints(scale.fields[0].fields[0], scale.fields[1].fields[0]) : 0;
+        return Compost_niceNumber(round(value.fields[0].fields[0], ~~dec), ~~dec);
+    }
+    else {
+        return value.fields[0].fields[0];
+    }
+}
+
+export const Compost_defstyle = new Style([1, new Color(0, [256, 0, 0])], new Width(2), [], new FillStyle(0, [[1, new Color(0, [196, 196, 196])]]), undefined, "10pt sans-serif", "default", Compost_defaultFormat, Compost_defaultFormat);
+
+export function Compost_getRelativeLocation(el, x, y) {
+    const getOffset = (parent_mut, tupledArg_mut) => {
+        getOffset:
+        while (true) {
+            const parent = parent_mut, tupledArg = tupledArg_mut;
+            const x_1 = tupledArg[0];
+            const y_1 = tupledArg[1];
+            if (equals(parent, defaultOf())) {
+                return [x_1, y_1];
+            }
+            else {
+                parent_mut = parent.offsetParent;
+                tupledArg_mut = [x_1 - parent.offsetLeft, y_1 - parent.offsetTop];
+                continue getOffset;
+            }
+            break;
+        }
+    };
+    const getParent = (parent_1_mut) => {
+        getParent:
+        while (true) {
+            const parent_1 = parent_1_mut;
+            if ((parent_1.namespaceURI === "http://www.w3.org/2000/svg") && (parent_1.tagName !== "svg")) {
+                if (!equals(parent_1.parentElement, defaultOf())) {
+                    parent_1_mut = parent_1.parentElement;
+                    continue getParent;
+                }
+                else {
+                    parent_1_mut = parent_1.parentNode;
+                    continue getParent;
+                }
+            }
+            else if (!equals(parent_1.offsetParent, defaultOf())) {
+                return parent_1;
+            }
+            else if (!equals(parent_1.parentElement, defaultOf())) {
+                parent_1_mut = parent_1.parentElement;
+                continue getParent;
+            }
+            else {
+                parent_1_mut = parent_1.parentNode;
+                continue getParent;
+            }
+            break;
+        }
+    };
+    return getOffset(getParent(el), [x, y]);
+}
+
+export function Compost_createSvg(revX, revY, width, height, viz) {
+    const patternInput = Scales_calculateScales(Compost_defstyle, viz);
+    const sy = patternInput[0][1];
+    const sx = patternInput[0][0];
+    const shape = patternInput[1];
+    const defs = [];
+    const area = [0, 0, width, height];
+    const svg = Drawing_drawShape(new Drawing_DrawingContext(Compost_defstyle, defs), area[0], area[1], area[2], area[3], sx, sy, shape);
+    const triggerEvent = (e, event) => {
+        Events_triggerEvent(area[0], area[1], area[2], area[3], sx, sy, shape, e, event);
+    };
+    const mouseHandler = (kind, el, evt) => {
+        const evt_1 = evt;
+        const patternInput_1 = Compost_getRelativeLocation(el, evt_1.pageX, evt_1.pageY);
+        triggerEvent(evt_1, new Events_InteractiveEvent(0, [kind, [new Value(1, [new continuous(patternInput_1[0])]), new Value(1, [new continuous(patternInput_1[1])])]]));
+    };
+    const touchHandler = (kind_1, el_1, evt_2) => {
+        const evt_3 = evt_2;
+        const touch = item_2(0, evt_3.touches);
+        const patternInput_2 = Compost_getRelativeLocation(el_1, touch.pageX, touch.pageY);
+        triggerEvent(evt_3, new Events_InteractiveEvent(1, [kind_1, [new Value(1, [new continuous(patternInput_2[0])]), new Value(1, [new continuous(patternInput_2[1])])]]));
+    };
+    return El_op_Dynamic_Z451691CD(h_2, "div")(empty())(singleton_1(El_op_Dynamic_Z451691CD(s_6, "svg")(ofArray([op_EqualsGreater("style", "overflow:visible"), op_EqualsGreater("width", int32ToString(~~width)), op_EqualsGreater("height", int32ToString(~~height)), op_EqualsBangGreater("click", uncurry2(curry3(mouseHandler)(new Events_MouseEventKind(0, [])))), op_EqualsBangGreater("mousemove", uncurry2(curry3(mouseHandler)(new Events_MouseEventKind(1, [])))), op_EqualsBangGreater("mousedown", uncurry2(curry3(mouseHandler)(new Events_MouseEventKind(3, [])))), op_EqualsBangGreater("mouseup", uncurry2(curry3(mouseHandler)(new Events_MouseEventKind(2, [])))), op_EqualsBangGreater("mouseleave", (_arg, evt_4) => {
+        triggerEvent(evt_4, new Events_InteractiveEvent(3, []));
+    }), op_EqualsBangGreater("touchmove", uncurry2(curry3(touchHandler)(new Events_TouchEventKind(0, [])))), op_EqualsBangGreater("touchstart", uncurry2(curry3(touchHandler)(new Events_TouchEventKind(1, [])))), op_EqualsBangGreater("touchend", (_arg_1, evt_5) => {
+        triggerEvent(evt_5, new Events_InteractiveEvent(2, []));
+    })]))(toList(delay(() => {
+        const body = Array.from(Svg_renderSvg(new Svg_RenderingContext(defs), svg));
+        return append(defs, delay(() => body));
+    })))));
+}
+