var SVG = (function () {
  'use strict';

  function _typeof(obj) {
    if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
      _typeof = function (obj) {
        return typeof obj;
      };
    } else {
      _typeof = function (obj) {
        return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
      };
    }

    return _typeof(obj);
  }

  function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
      throw new TypeError("Cannot call a class as a function");
    }
  }

  function _defineProperties(target, props) {
    for (var i = 0; i < props.length; i++) {
      var descriptor = props[i];
      descriptor.enumerable = descriptor.enumerable || false;
      descriptor.configurable = true;
      if ("value" in descriptor) descriptor.writable = true;
      Object.defineProperty(target, descriptor.key, descriptor);
    }
  }

  function _createClass(Constructor, protoProps, staticProps) {
    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
    if (staticProps) _defineProperties(Constructor, staticProps);
    return Constructor;
  }

  function _defineProperty(obj, key, value) {
    if (key in obj) {
      Object.defineProperty(obj, key, {
        value: value,
        enumerable: true,
        configurable: true,
        writable: true
      });
    } else {
      obj[key] = value;
    }

    return obj;
  }

  function _objectSpread(target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i] != null ? arguments[i] : {};
      var ownKeys = Object.keys(source);

      if (typeof Object.getOwnPropertySymbols === 'function') {
        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
        }));
      }

      ownKeys.forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    }

    return target;
  }

  function _inherits(subClass, superClass) {
    if (typeof superClass !== "function" && superClass !== null) {
      throw new TypeError("Super expression must either be null or a function");
    }

    subClass.prototype = Object.create(superClass && superClass.prototype, {
      constructor: {
        value: subClass,
        writable: true,
        configurable: true
      }
    });
    if (superClass) _setPrototypeOf(subClass, superClass);
  }

  function _getPrototypeOf(o) {
    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
      return o.__proto__ || Object.getPrototypeOf(o);
    };
    return _getPrototypeOf(o);
  }

  function _setPrototypeOf(o, p) {
    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
      o.__proto__ = p;
      return o;
    };

    return _setPrototypeOf(o, p);
  }

  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  function _construct(Parent, args, Class) {
    if (isNativeReflectConstruct()) {
      _construct = Reflect.construct;
    } else {
      _construct = function _construct(Parent, args, Class) {
        var a = [null];
        a.push.apply(a, args);
        var Constructor = Function.bind.apply(Parent, a);
        var instance = new Constructor();
        if (Class) _setPrototypeOf(instance, Class.prototype);
        return instance;
      };
    }

    return _construct.apply(null, arguments);
  }

  function _isNativeFunction(fn) {
    return Function.toString.call(fn).indexOf("[native code]") !== -1;
  }

  function _wrapNativeSuper(Class) {
    var _cache = typeof Map === "function" ? new Map() : undefined;

    _wrapNativeSuper = function _wrapNativeSuper(Class) {
      if (Class === null || !_isNativeFunction(Class)) return Class;

      if (typeof Class !== "function") {
        throw new TypeError("Super expression must either be null or a function");
      }

      if (typeof _cache !== "undefined") {
        if (_cache.has(Class)) return _cache.get(Class);

        _cache.set(Class, Wrapper);
      }

      function Wrapper() {
        return _construct(Class, arguments, _getPrototypeOf(this).constructor);
      }

      Wrapper.prototype = Object.create(Class.prototype, {
        constructor: {
          value: Wrapper,
          enumerable: false,
          writable: true,
          configurable: true
        }
      });
      return _setPrototypeOf(Wrapper, Class);
    };

    return _wrapNativeSuper(Class);
  }

  function _assertThisInitialized(self) {
    if (self === void 0) {
      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
    }

    return self;
  }

  function _possibleConstructorReturn(self, call) {
    if (call && (typeof call === "object" || typeof call === "function")) {
      return call;
    }

    return _assertThisInitialized(self);
  }

  function _slicedToArray(arr, i) {
    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
  }

  function _toConsumableArray(arr) {
    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
  }

  function _arrayWithoutHoles(arr) {
    if (Array.isArray(arr)) {
      for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];

      return arr2;
    }
  }

  function _arrayWithHoles(arr) {
    if (Array.isArray(arr)) return arr;
  }

  function _iterableToArray(iter) {
    if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
  }

  function _iterableToArrayLimit(arr, i) {
    var _arr = [];
    var _n = true;
    var _d = false;
    var _e = undefined;

    try {
      for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
        _arr.push(_s.value);

        if (i && _arr.length === i) break;
      }
    } catch (err) {
      _d = true;
      _e = err;
    } finally {
      try {
        if (!_n && _i["return"] != null) _i["return"]();
      } finally {
        if (_d) throw _e;
      }
    }

    return _arr;
  }

  function _nonIterableSpread() {
    throw new TypeError("Invalid attempt to spread non-iterable instance");
  }

  function _nonIterableRest() {
    throw new TypeError("Invalid attempt to destructure non-iterable instance");
  }

  var Base$1 =
  /*#__PURE__*/
  function () {
    function Base(node, _ref) {
      var _ref$extensions = _ref.extensions,
          extensions = _ref$extensions === void 0 ? [] : _ref$extensions;

      _classCallCheck(this, Base);

      this.tags = [];
      var _iteratorNormalCompletion = true;
      var _didIteratorError = false;
      var _iteratorError = undefined;

      try {
        for (var _iterator = extensions[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
          var extension = _step.value;
          extension.setup.call(this, node);
          this.tags.push(extension.name);
        }
      } catch (err) {
        _didIteratorError = true;
        _iteratorError = err;
      } finally {
        try {
          if (!_iteratorNormalCompletion && _iterator.return != null) {
            _iterator.return();
          }
        } finally {
          if (_didIteratorError) {
            throw _iteratorError;
          }
        }
      }
    }

    _createClass(Base, [{
      key: "is",
      value: function is(ability) {
        return this.tags.includes(ability);
      }
    }]);

    return Base;
  }();

  // Parse unit value
  var numberAndUnit = /^([+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?)([a-z%]*)$/i; // Parse hex value

  var hex = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i; // Parse rgb value

  var rgb = /rgb\((\d+),(\d+),(\d+)\)/; // Parse reference id

  var transforms = /\)\s*,?\s*/; // Whitespace

  var whitespace = /\s/g; // Test hex value

  var isHex = /^#[a-f0-9]{3,6}$/i; // Test rgb value

  var isRgb = /^rgb\(/; // Test css declaration

  var isBlank = /^(\s+)?$/; // Test for numeric string

  var isNumber = /^[+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?$/i; // Test for percent value

  var isImage = /\.(jpg|jpeg|png|gif|svg)(\?[^=]+.*)?/i; // split at whitespace and comma

  var delimiter = /[\s,]+/; // The following regex are used to parse the d attribute of a path
  // Matches all hyphens which are not after an exponent

  var hyphen = /([^e])-/gi; // Replaces and tests for all path letters

  var pathLetters = /[MLHVCSQTAZ]/gi; // yes we need this one, too

  var isPathLetter = /[MLHVCSQTAZ]/i; // matches 0.154.23.45

  var numbersWithDots = /((\d?\.\d+(?:e[+-]?\d+)?)((?:\.\d+(?:e[+-]?\d+)?)+))+/gi; // matches .

  var dots = /\./g;

  function isNulledBox(box) {
    return !box.w && !box.h && !box.x && !box.y;
  }
  function domContains(node) {
    return (document.documentElement.contains || function (node) {
      // This is IE - it does not support contains() for top-level SVGs
      while (node.parentNode) {
        node = node.parentNode;
      }

      return node === document;
    }).call(document.documentElement, node);
  }
  function pathRegReplace(a, b, c, d) {
    return c + d.replace(dots, ' .');
  } // creates deep clone of array

  function camelCase(s) {
    return s.toLowerCase().replace(/-(.)/g, function (m, g) {
      return g.toUpperCase();
    });
  } // Capitalize first letter of a string

  function capitalize(s) {
    return s.charAt(0).toUpperCase() + s.slice(1);
  } // Ensure to six-based hex

  function fullHex(hex$$1) {
    return hex$$1.length === 4 ? ['#', hex$$1.substring(1, 2), hex$$1.substring(1, 2), hex$$1.substring(2, 3), hex$$1.substring(2, 3), hex$$1.substring(3, 4), hex$$1.substring(3, 4)].join('') : hex$$1;
  } // Component to hex value

  function compToHex(comp) {
    var hex$$1 = comp.toString(16);
    return hex$$1.length === 1 ? '0' + hex$$1 : hex$$1;
  } // Calculate proportional width and height values when necessary

  function proportionalSize$1(element, width, height) {
    if (width == null || height == null) {
      var box = element.bbox();

      if (width == null) {
        width = box.width / box.height * height;
      } else if (height == null) {
        height = box.height / box.width * width;
      }
    }

    return {
      width: width,
      height: height
    };
  } // Map matrix array to object

  function arrayToMatrix(a) {
    return {
      a: a[0],
      b: a[1],
      c: a[2],
      d: a[3],
      e: a[4],
      f: a[5]
    };
  } // Add centre point to transform object

  function arrayToString(a) {
    for (var i = 0, il = a.length, s = ''; i < il; i++) {
      s += a[i][0];

      if (a[i][1] != null) {
        s += a[i][1];

        if (a[i][2] != null) {
          s += ' ';
          s += a[i][2];

          if (a[i][3] != null) {
            s += ' ';
            s += a[i][3];
            s += ' ';
            s += a[i][4];

            if (a[i][5] != null) {
              s += ' ';
              s += a[i][5];
              s += ' ';
              s += a[i][6];

              if (a[i][7] != null) {
                s += ' ';
                s += a[i][7];
              }
            }
          }
        }
      }
    }

    return s + ' ';
  } // Add more bounding box properties

  function fullBox(b) {
    if (b.x == null) {
      b.x = 0;
      b.y = 0;
      b.width = 0;
      b.height = 0;
    }

    b.w = b.width;
    b.h = b.height;
    b.x2 = b.x + b.width;
    b.y2 = b.y + b.height;
    b.cx = b.x + b.width / 2;
    b.cy = b.y + b.height / 2;
    return b;
  } // Get id from reference string

  var abcdef = 'abcdef'.split('');
  function closeEnough(a, b, threshold) {
    return Math.abs(b - a) < (threshold || 1e-6);
  }
  function isMatrixLike(o) {
    return o.a != null || o.b != null || o.c != null || o.d != null || o.e != null || o.f != null;
  }
  function getOrigin(o, element) {
    // Allow origin or around as the names
    var origin = o.origin; // o.around == null ? o.origin : o.around

    var ox, oy; // Allow the user to pass a string to rotate around a given point

    if (typeof origin === 'string' || origin == null) {
      // Get the bounding box of the element with no transformations applied
      var string = (origin || 'center').toLowerCase().trim();

      var _element$bbox = element.bbox(),
          height = _element$bbox.height,
          width = _element$bbox.width,
          x = _element$bbox.x,
          y = _element$bbox.y; // Calculate the transformed x and y coordinates


      var bx = string.includes('left') ? x : string.includes('right') ? x + width : x + width / 2;
      var by = string.includes('top') ? y : string.includes('bottom') ? y + height : y + height / 2; // Set the bounds eg : "bottom-left", "Top right", "middle" etc...

      ox = o.ox != null ? o.ox : bx;
      oy = o.oy != null ? o.oy : by;
    } else {
      ox = origin[0];
      oy = origin[1];
    } // Return the origin as it is if it wasn't a string


    return [ox, oy];
  }

  // Default namespaces
  var ns$1 = 'http://www.w3.org/2000/svg';
  var xmlns = 'http://www.w3.org/2000/xmlns/';
  var xlink = 'http://www.w3.org/1999/xlink';
  var svgjs = 'http://svgjs.com/svgjs';

  function nodeOrNew$1(name, node) {
    return node || makeNode(name);
  } // Method for element creation

  function makeNode(name) {
    // create element
    return document.createElementNS(ns$1, name);
  } // Method for extending objects

  function extend$1(modules, methods) {
    var key, i;

    if (Array.isArray(methods)) {
      methods.forEach(function (method) {
        extend$1(modules, method);
      });
      return;
    }

    modules = Array.isArray(modules) ? modules : [modules];

    for (i = modules.length - 1; i >= 0; i--) {
      if (methods.name) {
        modules[i].extensions = (modules[i].extensions || []).concat(methods);
      }

      for (key in methods) {
        if (modules[i].prototype[key] || key == 'name' || key == 'setup') continue;
        modules[i].prototype[key] = methods[key];
      }
    }
  } // FIXME: enhanced constructors here

  function addFactory(modules, methods) {
    extend$1(modules, methods);
  } // Invent new element

  function invent(config) {
    // Create element initializer
    var initializer = typeof config.create === 'function' ? config.create : function (node) {
      config.inherit.call(this, node || makeNode(config.create));
    }; // Inherit prototype

    if (config.inherit) {
      initializer.prototype = new config.inherit();
      initializer.prototype.constructor = initializer;
    } // Extend with methods


    if (config.extend) {
      extend$1(initializer, config.extend);
    } // Attach construct method to parent


    if (config.construct) {
      extend$1(config.parent || Container, config.construct);
    }

    return initializer;
  }

  var tools = /*#__PURE__*/Object.freeze({
    nodeOrNew: nodeOrNew$1,
    makeNode: makeNode,
    extend: extend$1,
    addFactory: addFactory,
    invent: invent
  });

  var elements = {};
  var root = Symbol('root');
  function makeInstance(element) {
    if (element instanceof Base$1) return element;

    if (_typeof(element) === 'object') {
      return adopt$1(element);
    }

    if (element == null) {
      return new elements[root]();
    }

    if (typeof element === 'string' && element.charAt(0) !== '<') {
      return adopt$1(document.querySelector(element));
    }

    var node = makeNode('svg');
    node.innerHTML = element;
    element = adopt$1(node.firstElementChild);
    return element;
  } // Adopt existing svg elements

  function adopt$1(node) {
    // check for presence of node
    if (!node) return null; // make sure a node isn't already adopted

    if (node.instance instanceof Base$1) return node.instance;

    if (!(node instanceof window.SVGElement)) {
      return new elements.HtmlNode(node);
    } // initialize variables


    var element; // adopt with element-specific settings

    if (node.nodeName === 'svg') {
      element = new elements[root](node);
    } else if (node.nodeName === 'linearGradient' || node.nodeName === 'radialGradient') {
      element = new elements.Gradient(node);
    } else if (elements[capitalize(node.nodeName)]) {
      element = new elements[capitalize(node.nodeName)](node);
    } else {
      element = new elements.Bare(node);
    }

    return element;
  }
  function register(element) {
    var name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : element.name;
    var asRoot = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
    elements[name] = element;
    if (asRoot) elements[root] = element;
    return element;
  }
  function getClass(name) {
    return elements[name];
  } // Element id sequence

  var did = 1000; // Get next named element id

  function eid(name) {
    return 'Svgjs' + capitalize(name) + did++;
  } // Deep new id assignment

  function assignNewId(node) {
    // do the same for SVG child nodes as well
    for (var i = node.children.length - 1; i >= 0; i--) {
      assignNewId(node.children[i]);
    }

    if (node.id) {
      return adopt$1(node).id(eid(node.nodeName));
    }

    return adopt$1(node);
  }

  var adopter = /*#__PURE__*/Object.freeze({
    root: root,
    makeInstance: makeInstance,
    adopt: adopt$1,
    register: register,
    getClass: getClass,
    eid: eid,
    assignNewId: assignNewId
  });

  var HtmlNode =
  /*#__PURE__*/
  function (_Base) {
    _inherits(HtmlNode, _Base);

    function HtmlNode(element) {
      var _this;

      _classCallCheck(this, HtmlNode);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(HtmlNode).call(this, element, HtmlNode));
      _this.node = element;
      return _this;
    }

    _createClass(HtmlNode, [{
      key: "add",
      value: function add(element, i) {
        element = makeInstance(element);

        if (element.node !== this.node.children[i]) {
          this.node.insertBefore(element.node, this.node.children[i] || null);
        }

        return this;
      }
    }, {
      key: "put",
      value: function put(element, i) {
        this.add(element, i);
        return element;
      }
    }, {
      key: "getEventTarget",
      value: function getEventTarget() {
        return this.node;
      }
    }]);

    return HtmlNode;
  }(Base$1);
  register(HtmlNode);

  var Defs =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Defs, _Base);

    function Defs(node) {
      _classCallCheck(this, Defs);

      return _possibleConstructorReturn(this, _getPrototypeOf(Defs).call(this, nodeOrNew$1('defs', node), Defs));
    }

    _createClass(Defs, [{
      key: "flatten",
      value: function flatten() {
        return this;
      }
    }, {
      key: "ungroup",
      value: function ungroup() {
        return this;
      }
    }]);

    return Defs;
  }(Base$1);
  register(Defs);

  var methods = {};
  var constructors = {};
  function registerMethods(name, m) {
    if (Array.isArray(name)) {
      var _iteratorNormalCompletion = true;
      var _didIteratorError = false;
      var _iteratorError = undefined;

      try {
        for (var _iterator = name[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
          var _name = _step.value;
          registerMethods(_name, m);
        }
      } catch (err) {
        _didIteratorError = true;
        _iteratorError = err;
      } finally {
        try {
          if (!_iteratorNormalCompletion && _iterator.return != null) {
            _iterator.return();
          }
        } finally {
          if (_didIteratorError) {
            throw _iteratorError;
          }
        }
      }

      return;
    }

    if (_typeof(name) == 'object') {
      var _arr = Object.entries(name);

      for (var _i = 0; _i < _arr.length; _i++) {
        var _arr$_i = _slicedToArray(_arr[_i], 2),
            _name2 = _arr$_i[0],
            _m = _arr$_i[1];

        registerMethods(_name2, _m);
      }

      return;
    }

    methods[name] = Object.assign(methods[name] || {}, m);
  }
  function getMethodsFor(name) {
    return methods[name] || {};
  } // FIXME: save memory?
  function registerConstructor(name, setup) {
    constructors[name] = setup;
  }
  function getConstructor(name) {
    return constructors[name] ? {
      setup: constructors[name],
      name: name
    } : {};
  }

  var Doc$1 =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Doc, _Base);

    function Doc(node) {
      var _this;

      _classCallCheck(this, Doc);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(Doc).call(this, nodeOrNew$1('svg', node), Doc));

      _this.namespace();

      return _this;
    }

    _createClass(Doc, [{
      key: "isRoot",
      value: function isRoot() {
        return !this.node.parentNode || !(this.node.parentNode instanceof window.SVGElement) || this.node.parentNode.nodeName === '#document';
      } // Check if this is a root svg
      // If not, call docs from this element

    }, {
      key: "doc",
      value: function doc() {
        if (this.isRoot()) return this;
        return Element.doc.call(this);
      } // Add namespaces

    }, {
      key: "namespace",
      value: function namespace() {
        if (!this.isRoot()) return this.doc().namespace();
        return this.attr({
          xmlns: ns$1,
          version: '1.1'
        }).attr('xmlns:xlink', xlink, xmlns).attr('xmlns:svgjs', svgjs, xmlns);
      } // Creates and returns defs element

    }, {
      key: "defs",
      value: function defs() {
        if (!this.isRoot()) return this.doc().defs();
        return adopt$1(this.node.getElementsByTagName('defs')[0]) || this.put(new Defs());
      } // custom parent method

    }, {
      key: "parent",
      value: function parent(type) {
        if (this.isRoot()) {
          return this.node.parentNode.nodeName === '#document' ? null : this.node.parentNode;
        }

        return Element.parent.call(this, type);
      } // Removes the doc from the DOM

    }, {
      key: "remove",
      value: function remove() {
        if (!this.isRoot()) {
          return Element.remove.call(this);
        }

        if (this.parent()) {
          this.parent().removeChild(this.node);
        }

        return this;
      }
    }, {
      key: "clear",
      value: function clear() {
        // remove children
        while (this.node.hasChildNodes()) {
          this.node.removeChild(this.node.lastChild);
        }

        return this;
      }
    }]);

    return Doc;
  }(Base$1);
  registerMethods({
    Container: {
      // Create nested svg document
      nested: function nested() {
        return this.put(new Doc$1());
      }
    }
  });
  register(Doc$1, 'Doc', true);

  var G =
  /*#__PURE__*/
  function (_Base) {
    _inherits(G, _Base);

    function G(node) {
      _classCallCheck(this, G);

      return _possibleConstructorReturn(this, _getPrototypeOf(G).call(this, nodeorNew('g', node), G));
    }

    return G;
  }(Base$1);
  registerMethods({
    Element: {
      // Create a group element
      group: function group() {
        return this.put(new G());
      }
    }
  });
  register(G);

  var Queue =
  /*#__PURE__*/
  function () {
    function Queue() {
      _classCallCheck(this, Queue);

      this._first = null;
      this._last = null;
    }

    _createClass(Queue, [{
      key: "push",
      value: function push(value) {
        // An item stores an id and the provided value
        var item = value.next ? value : {
          value: value,
          next: null,
          prev: null // Deal with the queue being empty or populated

        };

        if (this._last) {
          item.prev = this._last;
          this._last.next = item;
          this._last = item;
        } else {
          this._last = item;
          this._first = item;
        } // Update the length and return the current item


        return item;
      }
    }, {
      key: "shift",
      value: function shift() {
        // Check if we have a value
        var remove = this._first;
        if (!remove) return null; // If we do, remove it and relink things

        this._first = remove.next;
        if (this._first) this._first.prev = null;
        this._last = this._first ? this._last : null;
        return remove.value;
      } // Shows us the first item in the list

    }, {
      key: "first",
      value: function first() {
        return this._first && this._first.value;
      } // Shows us the last item in the list

    }, {
      key: "last",
      value: function last() {
        return this._last && this._last.value;
      } // Removes the item that was returned from the push

    }, {
      key: "remove",
      value: function remove(item) {
        // Relink the previous item
        if (item.prev) item.prev.next = item.next;
        if (item.next) item.next.prev = item.prev;
        if (item === this._last) this._last = item.prev;
        if (item === this._first) this._first = item.next; // Invalidate item

        item.prev = null;
        item.next = null;
      }
    }]);

    return Queue;
  }();

  var Animator = {
    nextDraw: null,
    frames: new Queue(),
    timeouts: new Queue(),
    timer: window.performance || window.Date,
    transforms: [],
    frame: function frame(fn) {
      // Store the node
      var node = Animator.frames.push({
        run: fn
      }); // Request an animation frame if we don't have one

      if (Animator.nextDraw === null) {
        Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
      } // Return the node so we can remove it easily


      return node;
    },
    transform_frame: function transform_frame(fn, id) {
      Animator.transforms[id] = fn;
    },
    timeout: function timeout(fn, delay) {
      delay = delay || 0; // Work out when the event should fire

      var time = Animator.timer.now() + delay; // Add the timeout to the end of the queue

      var node = Animator.timeouts.push({
        run: fn,
        time: time
      }); // Request another animation frame if we need one

      if (Animator.nextDraw === null) {
        Animator.nextDraw = window.requestAnimationFrame(Animator._draw);
      }

      return node;
    },
    cancelFrame: function cancelFrame(node) {
      Animator.frames.remove(node);
    },
    clearTimeout: function clearTimeout(node) {
      Animator.timeouts.remove(node);
    },
    _draw: function _draw(now) {
      // Run all the timeouts we can run, if they are not ready yet, add them
      // to the end of the queue immediately! (bad timeouts!!! [sarcasm])
      var nextTimeout = null;
      var lastTimeout = Animator.timeouts.last();

      while (nextTimeout = Animator.timeouts.shift()) {
        // Run the timeout if its time, or push it to the end
        if (now >= nextTimeout.time) {
          nextTimeout.run();
        } else {
          Animator.timeouts.push(nextTimeout);
        } // If we hit the last item, we should stop shifting out more items


        if (nextTimeout === lastTimeout) break;
      } // Run all of the animation frames


      var nextFrame = null;
      var lastFrame = Animator.frames.last();

      while (nextFrame !== lastFrame && (nextFrame = Animator.frames.shift())) {
        nextFrame.run();
      }

      Animator.transforms.forEach(function (el) {
        el();
      }); // If we have remaining timeouts or frames, draw until we don't anymore

      Animator.nextDraw = Animator.timeouts.first() || Animator.frames.first() ? window.requestAnimationFrame(Animator._draw) : null;
    }
  };

  var Bare =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Bare, _Base);

    function Bare(node, inherit) {
      var _this;

      _classCallCheck(this, Bare);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(Bare).call(this, nodeOrNew$1(null, node), Bare));
      extend(_assertThisInitialized(_assertThisInitialized(_this)), inherit);
      return _this;
    }

    _createClass(Bare, [{
      key: "words",
      value: function words(text) {
        // remove contents
        while (this.node.hasChildNodes()) {
          this.node.removeChild(this.node.lastChild);
        } // create text node


        this.node.appendChild(document.createTextNode(text));
        return this;
      }
    }]);

    return Bare;
  }(Base$1);
  register(Bare);
  registerMethods('Bare', {
    // Create an element that is not described by SVG.js
    element: function element(_element, inherit) {
      var custom = createCustom(_element, inherit);
      return this.put(new custom());
    }
  });

  var SVGNumber$1 =
  /*#__PURE__*/
  function () {
    // Initialize
    function SVGNumber() {
      _classCallCheck(this, SVGNumber);

      this.init.apply(this, arguments);
    }

    _createClass(SVGNumber, [{
      key: "init",
      value: function init(value, unit) {
        unit = Array.isArray(value) ? value[1] : unit;
        value = Array.isArray(value) ? value[0] : value; // initialize defaults

        this.value = 0;
        this.unit = unit || ''; // parse value

        if (typeof value === 'number') {
          // ensure a valid numeric value
          this.value = isNaN(value) ? 0 : !isFinite(value) ? value < 0 ? -3.4e+38 : +3.4e+38 : value;
        } else if (typeof value === 'string') {
          unit = value.match(numberAndUnit);

          if (unit) {
            // make value numeric
            this.value = parseFloat(unit[1]); // normalize

            if (unit[5] === '%') {
              this.value /= 100;
            } else if (unit[5] === 's') {
              this.value *= 1000;
            } // store unit


            this.unit = unit[5];
          }
        } else {
          if (value instanceof SVGNumber) {
            this.value = value.valueOf();
            this.unit = value.unit;
          }
        }
      }
    }, {
      key: "toString",
      value: function toString() {
        return (this.unit === '%' ? ~~(this.value * 1e8) / 1e6 : this.unit === 's' ? this.value / 1e3 : this.value) + this.unit;
      }
    }, {
      key: "toJSON",
      value: function toJSON() {
        return this.toString();
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return [this.value, this.unit];
      }
    }, {
      key: "valueOf",
      value: function valueOf() {
        return this.value;
      } // Add number

    }, {
      key: "plus",
      value: function plus(number) {
        number = new SVGNumber(number);
        return new SVGNumber(this + number, this.unit || number.unit);
      } // Subtract number

    }, {
      key: "minus",
      value: function minus(number) {
        number = new SVGNumber(number);
        return new SVGNumber(this - number, this.unit || number.unit);
      } // Multiply number

    }, {
      key: "times",
      value: function times(number) {
        number = new SVGNumber(number);
        return new SVGNumber(this * number, this.unit || number.unit);
      } // Divide number

    }, {
      key: "divide",
      value: function divide(number) {
        number = new SVGNumber(number);
        return new SVGNumber(this / number, this.unit || number.unit);
      }
    }]);

    return SVGNumber;
  }();

  // FIXME: import this to runner

  function rx(rx) {
    return this.attr('rx', rx);
  } // Radius y value

  function ry(ry) {
    return this.attr('ry', ry);
  } // Move over x-axis

  function x(x) {
    return x == null ? this.cx() - this.rx() : this.cx(x + this.rx());
  } // Move over y-axis

  function y(y) {
    return y == null ? this.cy() - this.ry() : this.cy(y + this.ry());
  } // Move by center over x-axis

  function cx(x) {
    return x == null ? this.attr('cx') : this.attr('cx', x);
  } // Move by center over y-axis

  function cy(y) {
    return y == null ? this.attr('cy') : this.attr('cy', y);
  } // Set width of element

  function width(width) {
    return width == null ? this.rx() * 2 : this.rx(new SVGNumber$1(width).divide(2));
  } // Set height of element

  function height(height) {
    return height == null ? this.ry() * 2 : this.ry(new SVGNumber$1(height).divide(2));
  } // Custom size function

  function size(width, height) {
    var p = proportionalSize$1(this, width, height);
    return this.rx(new SVGNumber$1(p.width).divide(2)).ry(new SVGNumber$1(p.height).divide(2));
  }

  var circled = /*#__PURE__*/Object.freeze({
    rx: rx,
    ry: ry,
    x: x,
    y: y,
    cx: cx,
    cy: cy,
    width: width,
    height: height,
    size: size
  });

  var Circle =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Circle, _Base);

    function Circle(node) {
      _classCallCheck(this, Circle);

      return _possibleConstructorReturn(this, _getPrototypeOf(Circle).call(this, nodeOrNew$1('circle', node), Circle));
    }

    _createClass(Circle, [{
      key: "radius",
      value: function radius(r) {
        return this.attr('r', r);
      } // Radius x value

    }, {
      key: "rx",
      value: function rx$$1(_rx) {
        return this.attr('r', _rx);
      } // Alias radius x value

    }, {
      key: "ry",
      value: function ry$$1(_ry) {
        return this.rx(_ry);
      }
    }]);

    return Circle;
  }(Base$1);
  extend$1(Circle, {
    x: x,
    y: y,
    cx: cx,
    cy: cy,
    width: width,
    height: height,
    size: size
  });
  registerMethods({
    Element: {
      // Create circle element
      circle: function circle(size$$1) {
        return this.put(new Circle()).radius(new SVGNumber$1(size$$1).divide(2)).move(0, 0);
      }
    }
  });
  register(Circle);

  // Map function
  function map(array, block) {
    var i;
    var il = array.length;
    var result = [];

    for (i = 0; i < il; i++) {
      result.push(block(array[i]));
    }

    return result;
  } // Filter function

  function radians(d) {
    return d % 360 * Math.PI / 180;
  } // Radians to degrees

  // SVG.get = function (id) {
  //   var node = document.getElementById(idFromReference(id) || id)
  //   return SVG.adopt(node)
  // }
  //
  // // Select elements by query string
  // SVG.select = function (query, parent) {
  //   return SVG.utils.map((parent || document).querySelectorAll(query), function (node) {
  //     return SVG.adopt(node)
  //   })
  // }
  //
  // SVG.$$ = function (query, parent) {
  //   return SVG.utils.map((parent || document).querySelectorAll(query), function (node) {
  //     return SVG.adopt(node)
  //   })
  // }
  //
  // SVG.$ = function (query, parent) {
  //   return SVG.adopt((parent || document).querySelector(query))
  // }

  function baseFind(query, parent) {
    return utils.map((parent || document).querySelectorAll(query), function (node) {
      return adopt$1(node);
    });
  } // Scoped find method

  function find$1(query) {
    return baseFind(query, this.node);
  }
  registerMethods('Container', {
    find: find$1
  });

  var Doc$2 = getClass(root);
  function setup(node) {
    // initialize data object
    this.dom = {}; // create circular reference

    this.node = node;
    this.type = node.nodeName;
    this.node.instance = this;

    if (node.hasAttribute('svgjs:data')) {
      // pull svgjs data from the dom (getAttributeNS doesn't work in html5)
      this.setData(JSON.parse(node.getAttribute('svgjs:data')) || {});
    }
  } // Move over x-axis

  function x$1(x) {
    return this.attr('x', x);
  } // Move over y-axis

  function y$1(y) {
    return this.attr('y', y);
  } // Move by center over x-axis

  function cx$1(x) {
    return x == null ? this.x() + this.width() / 2 : this.x(x - this.width() / 2);
  } // Move by center over y-axis

  function cy$1(y) {
    return y == null ? this.y() + this.height() / 2 : this.y(y - this.height() / 2);
  } // Move element to given x and y values

  function move(x, y) {
    return this.x(x).y(y);
  } // Move element by its center

  function center(x, y) {
    return this.cx(x).cy(y);
  } // Set width of element

  function width$1(width) {
    return this.attr('width', width);
  } // Set height of element

  function height$1(height) {
    return this.attr('height', height);
  } // Set element size to given width and height

  function size$1(width, height) {
    var p = proportionalSize$1(this, width, height);
    return this.width(new SVGNumber$1(p.width)).height(new SVGNumber$1(p.height));
  } // Clone element

  function clone(parent) {
    // write dom data to the dom so the clone can pickup the data
    this.writeDataToDom(); // clone element and assign new id

    var clone = assignNewId(this.node.cloneNode(true)); // insert the clone in the given parent or after myself

    if (parent) parent.add(clone);else this.after(clone);
    return clone;
  } // Remove element

  function remove() {
    if (this.parent()) {
      this.parent().removeElement(this);
    }

    return this;
  } // Replace element

  function replace(element) {
    this.after(element).remove();
    return element;
  } // Add element to given container and return self

  function addTo(parent) {
    return makeInstance(parent).put(this);
  } // Add element to given container and return container

  function putIn(parent) {
    return makeInstance(parent).add(this);
  } // Get / set id

  function id$1(id) {
    // generate new id if no id set
    if (typeof id === 'undefined' && !this.node.id) {
      this.node.id = eid(this.type);
    } // dont't set directly width this.node.id to make `null` work correctly


    return this.attr('id', id);
  } // Checks whether the given point inside the bounding box of the element

  function inside(x, y) {
    var box = this.bbox();
    return x > box.x && y > box.y && x < box.x + box.width && y < box.y + box.height;
  } // Return id on string conversion

  function toString() {
    return this.id();
  } // Return array of classes on the node

  function classes() {
    var attr = this.attr('class');
    return attr == null ? [] : attr.trim().split(delimiter);
  } // Return true if class exists on the node, false otherwise

  function hasClass(name) {
    return this.classes().indexOf(name) !== -1;
  } // Add class to the node

  function addClass(name) {
    if (!this.hasClass(name)) {
      var array = this.classes();
      array.push(name);
      this.attr('class', array.join(' '));
    }

    return this;
  } // Remove class from the node

  function removeClass(name) {
    if (this.hasClass(name)) {
      this.attr('class', this.classes().filter(function (c) {
        return c !== name;
      }).join(' '));
    }

    return this;
  } // Toggle the presence of a class on the node

  function toggleClass(name) {
    return this.hasClass(name) ? this.removeClass(name) : this.addClass(name);
  } // FIXME: getIdFromReference
  // Get referenced element form attribute value

  function reference$1(attr) {
    return get(this.attr(attr));
  } // Returns the parent element instance

  function doc() {
    var p = this.parent(Doc$2);
    return p && p.doc();
  } // Get defs

  function defs() {
    return this.doc().defs();
  } // return array of all ancestors of given type up to the root svg

  function parents(type) {
    var parents = [];
    var parent = this;

    do {
      parent = parent.parent(type);
      if (!parent || !parent.node) break;
      parents.push(parent);
    } while (parent.parent);

    return parents;
  } // matches the element vs a css selector

  function matches(selector) {
    return matches(this.node, selector);
  } // Returns the svg node to call native svg methods on it

  function native() {
    return this.node;
  } // Import raw svg

  function svg() {
    // write svgjs data to the dom
    this.writeDataToDom();
    return this.node.outerHTML;
  } // write svgjs data to the dom

  function writeDataToDom() {
    // remove previously set data
    this.node.removeAttribute('svgjs:data');

    if (Object.keys(this.dom).length) {
      this.node.setAttribute('svgjs:data', JSON.stringify(this.dom)); // see #428
    }

    return this;
  } // set given data to the elements data property

  function setData(o) {
    this.dom = o;
    return this;
  }
  function getEventTarget() {
    return this.node;
  }
  registerMethods('Element', {
    x: x$1,
    y: y$1,
    cx: cx$1,
    cy: cy$1,
    move: move,
    center: center,
    width: width$1,
    height: height$1,
    size: size$1,
    clone: clone,
    remove: remove,
    replace: replace,
    addTo: addTo,
    putIn: putIn,
    id: id$1,
    inside: inside,
    toString: toString,
    classes: classes,
    hasClass: hasClass,
    addClass: addClass,
    removeClass: removeClass,
    toggleClass: toggleClass,
    reference: reference$1,
    doc: doc,
    defs: defs,
    parents: parents,
    matches: matches,
    native: native,
    svg: svg,
    writeDataToDom: writeDataToDom,
    setData: setData,
    getEventTarget: getEventTarget
  });
  registerConstructor('Element', setup);

  var ClipPath =
  /*#__PURE__*/
  function (_Base) {
    _inherits(ClipPath, _Base);

    function ClipPath(node) {
      _classCallCheck(this, ClipPath);

      return _possibleConstructorReturn(this, _getPrototypeOf(ClipPath).call(this, nodeOrNew$1('clipPath', node), ClipPath));
    } // Unclip all clipped elements and remove itself


    _createClass(ClipPath, [{
      key: "remove",
      value: function remove$$1() {
        // unclip all targets
        this.targets().forEach(function (el) {
          el.unclip();
        }); // remove clipPath from parent

        return remove.call(this);
      }
    }, {
      key: "targets",
      value: function targets() {
        return baseFind('svg [clip-path*="' + this.id() + '"]');
      }
    }]);

    return ClipPath;
  }(Base$1);
  registerMethods({
    Container: {
      // Create clipping element
      clip: function clip() {
        return this.defs().put(new ClipPath());
      }
    },
    Element: {
      // Distribute clipPath to svg element
      clipWith: function clipWith(element) {
        // use given clip or create a new one
        var clipper = element instanceof ClipPath ? element : this.parent().clip().add(element); // apply mask

        return this.attr('clip-path', 'url("#' + clipper.id() + '")');
      },
      // Unclip element
      unclip: function unclip() {
        return this.attr('clip-path', null);
      },
      clipper: function clipper() {
        return this.reference('clip-path');
      }
    }
  });
  register(ClipPath);

  var A =
  /*#__PURE__*/
  function (_Base) {
    _inherits(A, _Base);

    function A(node) {
      _classCallCheck(this, A);

      return _possibleConstructorReturn(this, _getPrototypeOf(A).call(this, nodeOrNew$1('a', node), A));
    } // Link url


    _createClass(A, [{
      key: "to",
      value: function to(url) {
        return this.attr('href', url, xlink);
      } // Link target attribute

    }, {
      key: "target",
      value: function target(_target) {
        return this.attr('target', _target);
      }
    }]);

    return A;
  }(Base$1);
  registerMethods({
    Container: {
      // Create a hyperlink element
      link: function link(url) {
        return this.put(new A()).to(url);
      }
    },
    Element: {
      // Create a hyperlink element
      linkTo: function linkTo(url) {
        var link = new A();

        if (typeof url === 'function') {
          url.call(link, link);
        } else {
          link.to(url);
        }

        return this.parent().put(link).put(this);
      }
    }
  });
  register(A);

  var Ellipse =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Ellipse, _Base);

    function Ellipse(node) {
      _classCallCheck(this, Ellipse);

      return _possibleConstructorReturn(this, _getPrototypeOf(Ellipse).call(this, nodeOrNew('ellipse', node), Ellipse));
    }

    return Ellipse;
  }(Base$1);
  extend$1(Ellipse, circled);
  registerMethods('Container', {
    // Create an ellipse
    ellipse: function ellipse(width$$1, height$$1) {
      return this.put(new Ellipse()).size(width$$1, height$$1).move(0, 0);
    }
  });
  register(Ellipse);

  var Stop =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Stop, _Base);

    function Stop(node) {
      _classCallCheck(this, Stop);

      return _possibleConstructorReturn(this, _getPrototypeOf(Stop).call(this, nodeOrNew$1('stop', node), Stop));
    } // add color stops


    _createClass(Stop, [{
      key: "update",
      value: function update(o) {
        if (typeof o === 'number' || o instanceof SVGNumber$1) {
          o = {
            offset: arguments[0],
            color: arguments[1],
            opacity: arguments[2]
          };
        } // set attributes


        if (o.opacity != null) this.attr('stop-opacity', o.opacity);
        if (o.color != null) this.attr('stop-color', o.color);
        if (o.offset != null) this.attr('offset', new SVGNumber$1(o.offset));
        return this;
      }
    }]);

    return Stop;
  }(Base$1);
  register(Stop);

  // FIXME: add to runner
  function from(x, y) {
    return (this._element || this).type === 'radialGradient' ? this.attr({
      fx: new SVGNumber$1(x),
      fy: new SVGNumber$1(y)
    }) : this.attr({
      x1: new SVGNumber$1(x),
      y1: new SVGNumber$1(y)
    });
  }
  function to(x, y) {
    return (this._element || this).type === 'radialGradient' ? this.attr({
      cx: new SVGNumber$1(x),
      cy: new SVGNumber$1(y)
    }) : this.attr({
      x2: new SVGNumber$1(x),
      y2: new SVGNumber$1(y)
    });
  }

  var gradiented = /*#__PURE__*/Object.freeze({
    from: from,
    to: to
  });

  function noop() {} // Default animation values

  var timeline = {
    duration: 400,
    ease: '>',
    delay: 0 // Default attribute values

  };
  var attrs = {
    // fill and stroke
    'fill-opacity': 1,
    'stroke-opacity': 1,
    'stroke-width': 0,
    'stroke-linejoin': 'miter',
    'stroke-linecap': 'butt',
    fill: '#000000',
    stroke: '#000000',
    opacity: 1,
    // position
    x: 0,
    y: 0,
    cx: 0,
    cy: 0,
    // size
    width: 0,
    height: 0,
    // radius
    r: 0,
    rx: 0,
    ry: 0,
    // gradient
    offset: 0,
    'stop-opacity': 1,
    'stop-color': '#000000',
    // text
    'font-size': 16,
    'font-family': 'Helvetica, Arial, sans-serif',
    'text-anchor': 'start'
  };

  var Color =
  /*#__PURE__*/
  function () {
    function Color() {
      _classCallCheck(this, Color);

      this.init.apply(this, arguments);
    }

    _createClass(Color, [{
      key: "init",
      value: function init(color, g, b) {
        var match; // initialize defaults

        this.r = 0;
        this.g = 0;
        this.b = 0;
        if (!color) return; // parse color

        if (typeof color === 'string') {
          if (isRgb.test(color)) {
            // get rgb values
            match = rgb.exec(color.replace(whitespace, '')); // parse numeric values

            this.r = parseInt(match[1]);
            this.g = parseInt(match[2]);
            this.b = parseInt(match[3]);
          } else if (isHex.test(color)) {
            // get hex values
            match = hex.exec(fullHex(color)); // parse numeric values

            this.r = parseInt(match[1], 16);
            this.g = parseInt(match[2], 16);
            this.b = parseInt(match[3], 16);
          }
        } else if (Array.isArray(color)) {
          this.r = color[0];
          this.g = color[1];
          this.b = color[2];
        } else if (_typeof(color) === 'object') {
          this.r = color.r;
          this.g = color.g;
          this.b = color.b;
        } else if (arguments.length === 3) {
          this.r = color;
          this.g = g;
          this.b = b;
        }
      } // Default to hex conversion

    }, {
      key: "toString",
      value: function toString() {
        return this.toHex();
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return [this.r, this.g, this.b];
      } // Build hex value

    }, {
      key: "toHex",
      value: function toHex() {
        return '#' + compToHex(Math.round(this.r)) + compToHex(Math.round(this.g)) + compToHex(Math.round(this.b));
      } // Build rgb value

    }, {
      key: "toRgb",
      value: function toRgb() {
        return 'rgb(' + [this.r, this.g, this.b].join() + ')';
      } // Calculate true brightness

    }, {
      key: "brightness",
      value: function brightness() {
        return this.r / 255 * 0.30 + this.g / 255 * 0.59 + this.b / 255 * 0.11;
      } // Testers
      // Test if given value is a color string

    }], [{
      key: "test",
      value: function test(color) {
        color += '';
        return isHex.test(color) || isRgb.test(color);
      } // Test if given value is a rgb object

    }, {
      key: "isRgb",
      value: function isRgb$$1(color) {
        return color && typeof color.r === 'number' && typeof color.g === 'number' && typeof color.b === 'number';
      } // Test if given value is a color

    }, {
      key: "isColor",
      value: function isColor(color) {
        return this.isRgb(color) || this.test(color);
      }
    }]);

    return Color;
  }();

  var BaseArray = function () {
    try {
      var b =
      /*#__PURE__*/
      function (_Array) {
        _inherits(b, _Array);

        function b() {
          _classCallCheck(this, b);

          return _possibleConstructorReturn(this, _getPrototypeOf(b).apply(this, arguments));
        }

        return b;
      }(_wrapNativeSuper(Array));

      return Array;
    } catch (e) {
      return Array;
    }
  }();

  var SVGArray =
  /*#__PURE__*/
  function (_BaseArray) {
    _inherits(SVGArray, _BaseArray);

    function SVGArray() {
      var _this2;

      var _this;

      _classCallCheck(this, SVGArray);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(SVGArray).call(this));

      (_this2 = _this).init.apply(_this2, arguments);

      return _this;
    }

    _createClass(SVGArray, [{
      key: "init",
      value: function init(array, fallback) {
        //this.splice(0, this.length)
        this.length = 0;
        this.push.apply(this, _toConsumableArray(this.parse(array || fallback)));
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return Array.prototype.slice(this);
      }
    }, {
      key: "toString",
      value: function toString() {
        this.join(' ');
      }
    }, {
      key: "valueOf",
      value: function valueOf() {
        return this.toArray();
      } // Parse whitespace separated string

    }, {
      key: "parse",
      value: function parse(array) {
        array = array.valueOf(); // if already is an array, no need to parse it

        if (Array.isArray(array)) return array;
        return array.trim().split(delimiter).map(parseFloat);
      }
    }, {
      key: "clone",
      value: function clone() {
        return new this.constructor(this);
      }
    }, {
      key: "toSet",
      value: function toSet() {
        return new Set(this);
      }
    }]);

    return SVGArray;
  }(BaseArray);

  function attr(attr, val, ns) {
    // act as full getter
    if (attr == null) {
      // get an object of attributes
      attr = {};
      val = this.node.attributes;
      var _iteratorNormalCompletion = true;
      var _didIteratorError = false;
      var _iteratorError = undefined;

      try {
        for (var _iterator = val[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
          var node = _step.value;
          attr[node.nodeName] = isNumer.test(node.nodeValue) ? parseFloat(node.nodeValue) : node.nodeValue;
        }
      } catch (err) {
        _didIteratorError = true;
        _iteratorError = err;
      } finally {
        try {
          if (!_iteratorNormalCompletion && _iterator.return != null) {
            _iterator.return();
          }
        } finally {
          if (_didIteratorError) {
            throw _iteratorError;
          }
        }
      }

      return attr;
    } else if (Array.isArray(attr)) ; else if (_typeof(attr) === 'object') {
      // apply every attribute individually if an object is passed
      for (val in attr) {
        this.attr(val, attr[val]);
      }
    } else if (val === null) {
      // remove value
      this.node.removeAttribute(attr);
    } else if (val == null) {
      // act as a getter if the first and only argument is not an object
      val = this.node.getAttribute(attr);
      return val == null ? attrs[attr] // FIXME: do we need to return defaults?
      : isNumber.test(val) ? parseFloat(val) : val;
    } else {
      // convert image fill and stroke to patterns
      if (attr === 'fill' || attr === 'stroke') {
        if (isImage.test(val)) {
          val = this.doc().defs().image(val);
        }
      } // FIXME: This is fine, but what about the lines above?
      // How does attr know about image()?


      while (typeof val.attrHook == 'function') {
        val = val.attrHook(this, attr);
      } // ensure correct numeric values (also accepts NaN and Infinity)


      if (typeof val === 'number') {
        val = new SVGNumber$1(val);
      } else if (Color.isColor(val)) {
        // ensure full hex color
        val = new Color(val);
      } else if (Array.isArray(val)) {
        // parse array values
        val = new SVGArray(val);
      } // if the passed attribute is leading...


      if (attr === 'leading') {
        // ... call the leading method instead
        if (this.leading) {
          this.leading(val);
        }
      } else {
        // set given attribute on node
        typeof ns === 'string' ? this.node.setAttributeNS(ns, attr, val.toString()) : this.node.setAttribute(attr, val.toString());
      } // rebuild if required


      if (this.rebuild && (attr === 'font-size' || attr === 'x')) {
        this.rebuild();
      }
    }

    return this;
  }
  registerMethods('Element', {
    attr: attr
  });

  var Gradient =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Gradient, _Base);

    function Gradient(type) {
      _classCallCheck(this, Gradient);

      return _possibleConstructorReturn(this, _getPrototypeOf(Gradient).call(this, nodeOrNew$1(type + 'Gradient', typeof type === 'string' ? null : type), Gradient));
    } // Add a color stop


    _createClass(Gradient, [{
      key: "stop",
      value: function stop(offset, color, opacity) {
        return this.put(new Stop()).update(offset, color, opacity);
      } // Update gradient

    }, {
      key: "update",
      value: function update(block) {
        // remove all stops
        this.clear(); // invoke passed block

        if (typeof block === 'function') {
          block.call(this, this);
        }

        return this;
      } // Return the fill id

    }, {
      key: "url",
      value: function url() {
        return 'url(#' + this.id() + ')';
      } // Alias string convertion to fill

    }, {
      key: "toString",
      value: function toString() {
        return this.url();
      } // custom attr to handle transform

    }, {
      key: "attr",
      value: function attr$$1(a, b, c) {
        if (a === 'transform') a = 'gradientTransform';
        return attr.call(this, a, b, c);
      }
    }, {
      key: "targets",
      value: function targets() {
        return find('svg [fill*="' + this.id() + '"]');
      }
    }]);

    return Gradient;
  }(Base$1);
  extend$1(Gradient, gradiented);
  registerMethods({
    Container: {
      // Create gradient element in defs
      gradient: function gradient(type, block) {
        return this.defs().gradient(type, block);
      }
    },
    // define gradient
    Defs: {
      gradient: function gradient(type, block) {
        return this.put(new Gradient(type)).update(block);
      }
    }
  });
  register(Gradient);

  var Pattern =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Pattern, _Base);

    // Initialize node
    function Pattern(node) {
      _classCallCheck(this, Pattern);

      return _possibleConstructorReturn(this, _getPrototypeOf(Pattern).call(this, nodeOrNew$1('pattern', node)));
    } // Return the fill id


    _createClass(Pattern, [{
      key: "url",
      value: function url() {
        return 'url(#' + this.id() + ')';
      } // Update pattern by rebuilding

    }, {
      key: "update",
      value: function update(block) {
        // remove content
        this.clear(); // invoke passed block

        if (typeof block === 'function') {
          block.call(this, this);
        }

        return this;
      } // Alias string convertion to fill

    }, {
      key: "toString",
      value: function toString() {
        return this.url();
      } // custom attr to handle transform

    }, {
      key: "attr",
      value: function attr$$1(a, b, c) {
        if (a === 'transform') a = 'patternTransform';
        return attr.call(this, a, b, c);
      }
    }, {
      key: "targets",
      value: function targets() {
        return find('svg [fill*="' + this.id() + '"]');
      }
    }]);

    return Pattern;
  }(Base$1);
  registerMethods({
    Container: {
      // Create pattern element in defs
      pattern: function pattern(width, height, block) {
        return this.defs().pattern(width, height, block);
      }
    },
    Defs: {
      pattern: function pattern(width, height, block) {
        return this.put(new Pattern()).update(block).attr({
          x: 0,
          y: 0,
          width: width,
          height: height,
          patternUnits: 'userSpaceOnUse'
        });
      }
    }
  });
  register(Pattern);

  // ;[ 'click',
  //   'dblclick',
  //   'mousedown',
  //   'mouseup',
  //   'mouseover',
  //   'mouseout',
  //   'mousemove',
  //   'mouseenter',
  //   'mouseleave',
  //   'touchstart',
  //   'touchmove',
  //   'touchleave',
  //   'touchend',
  //   'touchcancel' ].forEach(function (event) {
  //     // add event to Element
  //     Element.prototype[event] = function (f) {
  //       if (f === null) {
  //         off(this, event)
  //       } else {
  //         on(this, event, f)
  //       }
  //       return this
  //     }
  //   })

  var listenerId = 0;

  function getEventTarget$1(node) {
    return node instanceof Base && node.is('EventTarget') ? node.getEventTarget() : node;
  } // Add event binder in the SVG namespace


  function on(node, events, listener, binding, options) {
    var l = listener.bind(binding || node);
    var n = getEventTarget$1(node); // events can be an array of events or a string of events

    events = Array.isArray(events) ? events : events.split(delimiter); // ensure instance object for nodes which are not adopted

    n.instance = n.instance || {
      events: {} // pull event handlers from the element

    };
    var bag = n.instance.events; // add id to listener

    if (!listener._svgjsListenerId) {
      listener._svgjsListenerId = ++listenerId;
    }

    events.forEach(function (event) {
      var ev = event.split('.')[0];
      var ns = event.split('.')[1] || '*'; // ensure valid object

      bag[ev] = bag[ev] || {};
      bag[ev][ns] = bag[ev][ns] || {}; // reference listener

      bag[ev][ns][listener._svgjsListenerId] = l; // add listener

      n.addEventListener(ev, l, options || false);
    });
  } // Add event unbinder in the SVG namespace

  function off(node, events, listener, options) {
    var n = getEventTarget$1(node); // we cannot remove an event if its not an svg.js instance

    if (!n.instance) return; // listener can be a function or a number

    if (typeof listener === 'function') {
      listener = listener._svgjsListenerId;
      if (!listener) return;
    } // pull event handlers from the element


    var bag = n.instance.events; // events can be an array of events or a string or undefined

    events = Array.isArray(events) ? events : (events || '').split(delimiter);
    events.forEach(function (event) {
      var ev = event && event.split('.')[0];
      var ns = event && event.split('.')[1];
      var namespace, l;

      if (listener) {
        // remove listener reference
        if (bag[ev] && bag[ev][ns || '*']) {
          // removeListener
          n.removeEventListener(ev, bag[ev][ns || '*'][listener], options || false);
          delete bag[ev][ns || '*'][listener];
        }
      } else if (ev && ns) {
        // remove all listeners for a namespaced event
        if (bag[ev] && bag[ev][ns]) {
          for (l in bag[ev][ns]) {
            off(n, [ev, ns].join('.'), l);
          }

          delete bag[ev][ns];
        }
      } else if (ns) {
        // remove all listeners for a specific namespace
        for (event in bag) {
          for (namespace in bag[event]) {
            if (ns === namespace) {
              off(n, [event, ns].join('.'));
            }
          }
        }
      } else if (ev) {
        // remove all listeners for the event
        if (bag[ev]) {
          for (namespace in bag[ev]) {
            off(n, [ev, namespace].join('.'));
          }

          delete bag[ev];
        }
      } else {
        // remove all listeners on a given node
        for (event in bag) {
          off(n, event);
        }

        n.instance.events = {};
      }
    });
  }
  function dispatch(node, event, data) {
    var n = getEventTarget$1(node); // Dispatch event

    if (event instanceof window.Event) {
      n.dispatchEvent(event);
    } else {
      event = new window.CustomEvent(event, {
        detail: data,
        cancelable: true
      });
      n.dispatchEvent(event);
    }

    return event;
  }

  var Image =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Image, _Base);

    function Image(node) {
      _classCallCheck(this, Image);

      return _possibleConstructorReturn(this, _getPrototypeOf(Image).call(this, nodeOrNew$1('image', node), Image));
    } // (re)load image


    _createClass(Image, [{
      key: "load",
      value: function load(url, callback) {
        if (!url) return this;
        var img = new window.Image();
        on(img, 'load', function (e) {
          var p = this.parent(Pattern); // ensure image size

          if (this.width() === 0 && this.height() === 0) {
            this.size(img.width, img.height);
          }

          if (p instanceof Pattern) {
            // ensure pattern size if not set
            if (p.width() === 0 && p.height() === 0) {
              p.size(this.width(), this.height());
            }
          }

          if (typeof callback === 'function') {
            callback.call(this, {
              width: img.width,
              height: img.height,
              ratio: img.width / img.height,
              url: url
            });
          }
        }, this);
        on(img, 'load error', function () {
          // dont forget to unbind memory leaking events
          off(img);
        });
        return this.attr('href', img.src = url, xlink);
      }
    }, {
      key: "attrHook",
      value: function attrHook(obj) {
        var _this = this;

        return obj.doc().defs().pattern(0, 0, function (pattern) {
          pattern.add(_this);
        });
      }
    }]);

    return Image;
  }(Base$1);
  registerMethods({
    Container: {
      // create image element, load image and set its size
      image: function image(source, callback) {
        return this.put(new Image()).size(0, 0).load(source, callback);
      }
    }
  });
  register(Image);

  var PointArray$1 =
  /*#__PURE__*/
  function (_SVGArray) {
    _inherits(PointArray, _SVGArray);

    function PointArray(array) {
      var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [[0, 0]];

      _classCallCheck(this, PointArray);

      return _possibleConstructorReturn(this, _getPrototypeOf(PointArray).call(this, array, fallback));
    } // Convert array to string


    _createClass(PointArray, [{
      key: "toString",
      value: function toString() {
        // convert to a poly point string
        for (var i = 0, il = this.value.length, array = []; i < il; i++) {
          array.push(this.value[i].join(','));
        }

        return array.join(' ');
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return this.value.reduce(function (prev, curr) {
          return [].concat.call(prev, curr);
        }, []);
      } // Convert array to line object

    }, {
      key: "toLine",
      value: function toLine() {
        return {
          x1: this.value[0][0],
          y1: this.value[0][1],
          x2: this.value[1][0],
          y2: this.value[1][1]
        };
      } // Get morphed array at given position

    }, {
      key: "at",
      value: function at(pos) {
        // make sure a destination is defined
        if (!this.destination) return this; // generate morphed point string

        for (var i = 0, il = this.value.length, array = []; i < il; i++) {
          array.push([this.value[i][0] + (this.destination[i][0] - this.value[i][0]) * pos, this.value[i][1] + (this.destination[i][1] - this.value[i][1]) * pos]);
        }

        return new PointArray(array);
      } // Parse point string and flat array

    }, {
      key: "parse",
      value: function parse(array) {
        var points = [];
        array = array.valueOf(); // if it is an array

        if (Array.isArray(array)) {
          // and it is not flat, there is no need to parse it
          if (Array.isArray(array[0])) {
            return array;
          }
        } else {
          // Else, it is considered as a string
          // parse points
          array = array.trim().split(delimiter).map(parseFloat);
        } // validate points - https://svgwg.org/svg2-draft/shapes.html#DataTypePoints
        // Odd number of coordinates is an error. In such cases, drop the last odd coordinate.


        if (array.length % 2 !== 0) array.pop(); // wrap points in two-tuples and parse points as floats

        for (var i = 0, len = array.length; i < len; i = i + 2) {
          points.push([array[i], array[i + 1]]);
        }

        return points;
      } // Move point string

    }, {
      key: "move",
      value: function move(x, y) {
        var box = this.bbox(); // get relative offset

        x -= box.x;
        y -= box.y; // move every point

        if (!isNaN(x) && !isNaN(y)) {
          for (var i = this.value.length - 1; i >= 0; i--) {
            this.value[i] = [this.value[i][0] + x, this.value[i][1] + y];
          }
        }

        return this;
      } // Resize poly string

    }, {
      key: "size",
      value: function size(width, height) {
        var i;
        var box = this.bbox(); // recalculate position of all points according to new size

        for (i = this.value.length - 1; i >= 0; i--) {
          if (box.width) this.value[i][0] = (this.value[i][0] - box.x) * width / box.width + box.x;
          if (box.height) this.value[i][1] = (this.value[i][1] - box.y) * height / box.height + box.y;
        }

        return this;
      } // Get bounding box of points

    }, {
      key: "bbox",
      value: function bbox() {
        var maxX = -Infinity;
        var maxY = -Infinity;
        var minX = Infinity;
        var minY = Infinity;
        this.value.forEach(function (el) {
          maxX = Math.max(el[0], maxX);
          maxY = Math.max(el[1], maxY);
          minX = Math.min(el[0], minX);
          minY = Math.min(el[1], minY);
        });
        return {
          x: minX,
          y: minY,
          width: maxX - minX,
          height: maxY - minY
        };
      }
    }]);

    return PointArray;
  }(SVGArray);

  var Line =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Line, _Base);

    // Initialize node
    function Line(node) {
      _classCallCheck(this, Line);

      return _possibleConstructorReturn(this, _getPrototypeOf(Line).call(this, nodeOrNew$1('line', node), Line));
    } // Get array


    _createClass(Line, [{
      key: "array",
      value: function array() {
        return new PointArray$1([[this.attr('x1'), this.attr('y1')], [this.attr('x2'), this.attr('y2')]]);
      } // Overwrite native plot() method

    }, {
      key: "plot",
      value: function plot(x1, y1, x2, y2) {
        if (x1 == null) {
          return this.array();
        } else if (typeof y1 !== 'undefined') {
          x1 = {
            x1: x1,
            y1: y1,
            x2: x2,
            y2: y2
          };
        } else {
          x1 = new PointArray$1(x1).toLine();
        }

        return this.attr(x1);
      } // Move by left top corner

    }, {
      key: "move",
      value: function move(x, y) {
        return this.attr(this.array().move(x, y).toLine());
      } // Set element size to given width and height

    }, {
      key: "size",
      value: function size(width, height) {
        var p = proportionalSize$1(this, width, height);
        return this.attr(this.array().size(p.width, p.height).toLine());
      }
    }]);

    return Line;
  }(Base$1);
  registerMethods({
    Container: {
      // Create a line element
      line: function line() {
        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
          args[_key] = arguments[_key];
        }

        // make sure plot is called as a setter
        // x1 is not necessarily a number, it can also be an array, a string and a PointArray
        return Line.prototype.plot.apply(this.put(new Line()), args[0] != null ? args : [0, 0, 0, 0]);
      }
    }
  });
  register(Line);

  var Marker =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Marker, _Base);

    // Initialize node
    function Marker(node) {
      _classCallCheck(this, Marker);

      return _possibleConstructorReturn(this, _getPrototypeOf(Marker).call(this, nodeOrNew('marker', node), Marker));
    } // Set width of element


    _createClass(Marker, [{
      key: "width",
      value: function width(_width) {
        return this.attr('markerWidth', _width);
      } // Set height of element

    }, {
      key: "height",
      value: function height(_height) {
        return this.attr('markerHeight', _height);
      } // Set marker refX and refY

    }, {
      key: "ref",
      value: function ref(x, y) {
        return this.attr('refX', x).attr('refY', y);
      } // Update marker

    }, {
      key: "update",
      value: function update(block) {
        // remove all content
        this.clear(); // invoke passed block

        if (typeof block === 'function') {
          block.call(this, this);
        }

        return this;
      } // Return the fill id

    }, {
      key: "toString",
      value: function toString() {
        return 'url(#' + this.id() + ')';
      }
    }]);

    return Marker;
  }(Base$1);
  registerMethods({
    Container: {
      marker: function marker(width, height, block) {
        // Create marker element in defs
        return this.defs().marker(width, height, block);
      }
    },
    Defs: {
      // Create marker
      marker: function marker(width, height, block) {
        // Set default viewbox to match the width and height, set ref to cx and cy and set orient to auto
        return this.put(new Marker()).size(width, height).ref(width / 2, height / 2).viewbox(0, 0, width, height).attr('orient', 'auto').update(block);
      }
    },
    marker: {
      // Create and attach markers
      marker: function marker(_marker, width, height, block) {
        var attr = ['marker']; // Build attribute name

        if (_marker !== 'all') attr.push(_marker);
        attr = attr.join('-'); // Set marker attribute

        _marker = arguments[1] instanceof Marker ? arguments[1] : this.defs().marker(width, height, block);
        return this.attr(attr, _marker);
      }
    }
  });
  register(Marker);

  var Mask =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Mask, _Base);

    // Initialize node
    function Mask(node) {
      _classCallCheck(this, Mask);

      return _possibleConstructorReturn(this, _getPrototypeOf(Mask).call(this, nodeOrNew$1('mask', node)));
    } // Unmask all masked elements and remove itself


    _createClass(Mask, [{
      key: "remove",
      value: function remove$$1() {
        // unmask all targets
        this.targets().forEach(function (el) {
          el.unmask();
        }); // remove mask from parent

        return remove.call(this);
      }
    }, {
      key: "targets",
      value: function targets() {
        return baseFind('svg [mask*="' + this.id() + '"]');
      }
    }]);

    return Mask;
  }(Base$1);
  registerMethods({
    Container: {
      mask: function mask() {
        return this.defs().put(new Mask());
      }
    },
    Element: {
      // Distribute mask to svg element
      maskWith: function maskWith(element) {
        // use given mask or create a new one
        var masker = element instanceof Mask ? element : this.parent().mask().add(element); // apply mask

        return this.attr('mask', 'url("#' + masker.id() + '")');
      },
      // Unmask element
      unmask: function unmask() {
        return this.attr('mask', null);
      },
      masker: function masker() {
        return this.reference('mask');
      }
    }
  });
  register(Mask);

  function parser() {
    // Reuse cached element if possible
    if (!parser.nodes) {
      var svg = new Doc$1().size(2, 0).css({
        opacity: 0,
        position: 'absolute',
        left: '-100%',
        top: '-100%',
        overflow: 'hidden'
      });
      var path = svg.path().node;
      parser.nodes = {
        svg: svg,
        path: path
      };
    }

    if (!parser.nodes.svg.node.parentNode) {
      var b = document.body || document.documentElement;
      parser.nodes.svg.addTo(b);
    }

    return parser.nodes;
  }

  var Point$1 =
  /*#__PURE__*/
  function () {
    // Initialize
    function Point(x, y, base) {
      _classCallCheck(this, Point);

      var source;
      base = base || {
        x: 0,
        y: 0 // ensure source as object

      };
      source = Array.isArray(x) ? {
        x: x[0],
        y: x[1]
      } : _typeof(x) === 'object' ? {
        x: x.x,
        y: x.y
      } : {
        x: x,
        y: y // merge source

      };
      this.x = source.x == null ? base.x : source.x;
      this.y = source.y == null ? base.y : source.y;
    } // Clone point


    _createClass(Point, [{
      key: "clone",
      value: function clone() {
        return new Point(this);
      } // Convert to native SVGPoint

    }, {
      key: "native",
      value: function native() {
        // create new point
        var point = parser().svg.createSVGPoint(); // update with current values

        point.x = this.x;
        point.y = this.y;
        return point;
      } // transform point with matrix

    }, {
      key: "transform",
      value: function transform(m) {
        // Perform the matrix multiplication
        var x = m.a * this.x + m.c * this.y + m.e;
        var y = m.b * this.x + m.d * this.y + m.f; // Return the required point

        return new Point(x, y);
      }
    }]);

    return Point;
  }();
  registerMethods({
    Element: {
      // Get point
      point: function point(x, y) {
        return new Point$1(x, y).transform(this.screenCTM().inverse());
      }
    }
  });

  var pathHandlers = {
    M: function M(c, p, p0) {
      p.x = p0.x = c[0];
      p.y = p0.y = c[1];
      return ['M', p.x, p.y];
    },
    L: function L(c, p) {
      p.x = c[0];
      p.y = c[1];
      return ['L', c[0], c[1]];
    },
    H: function H(c, p) {
      p.x = c[0];
      return ['H', c[0]];
    },
    V: function V(c, p) {
      p.y = c[0];
      return ['V', c[0]];
    },
    C: function C(c, p) {
      p.x = c[4];
      p.y = c[5];
      return ['C', c[0], c[1], c[2], c[3], c[4], c[5]];
    },
    S: function S(c, p) {
      p.x = c[2];
      p.y = c[3];
      return ['S', c[0], c[1], c[2], c[3]];
    },
    Q: function Q(c, p) {
      p.x = c[2];
      p.y = c[3];
      return ['Q', c[0], c[1], c[2], c[3]];
    },
    T: function T(c, p) {
      p.x = c[0];
      p.y = c[1];
      return ['T', c[0], c[1]];
    },
    Z: function Z(c, p, p0) {
      p.x = p0.x;
      p.y = p0.y;
      return ['Z'];
    },
    A: function A(c, p) {
      p.x = c[5];
      p.y = c[6];
      return ['A', c[0], c[1], c[2], c[3], c[4], c[5], c[6]];
    }
  };
  var mlhvqtcsaz = 'mlhvqtcsaz'.split('');

  for (var i = 0, il = mlhvqtcsaz.length; i < il; ++i) {
    pathHandlers[mlhvqtcsaz[i]] = function (i) {
      return function (c, p, p0) {
        if (i === 'H') c[0] = c[0] + p.x;else if (i === 'V') c[0] = c[0] + p.y;else if (i === 'A') {
          c[5] = c[5] + p.x;
          c[6] = c[6] + p.y;
        } else {
          for (var j = 0, jl = c.length; j < jl; ++j) {
            c[j] = c[j] + (j % 2 ? p.y : p.x);
          }
        }
        return pathHandlers[i](c, p, p0);
      };
    }(mlhvqtcsaz[i].toUpperCase());
  }

  var PathArray =
  /*#__PURE__*/
  function (_SVGArray) {
    _inherits(PathArray, _SVGArray);

    function PathArray(array) {
      var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [['M', 0, 0]];

      _classCallCheck(this, PathArray);

      return _possibleConstructorReturn(this, _getPrototypeOf(PathArray).call(this, array, fallback));
    } // Convert array to string


    _createClass(PathArray, [{
      key: "toString",
      value: function toString() {
        return arrayToString(this);
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return this.reduce(function (prev, curr) {
          return [].concat.call(prev, curr);
        }, []);
      } // Move path string

    }, {
      key: "move",
      value: function move(x, y) {
        // get bounding box of current situation
        var box = this.bbox(); // get relative offset

        x -= box.x;
        y -= box.y;

        if (!isNaN(x) && !isNaN(y)) {
          // move every point
          for (var l, i = this.length - 1; i >= 0; i--) {
            l = this[i][0];

            if (l === 'M' || l === 'L' || l === 'T') {
              this[i][1] += x;
              this[i][2] += y;
            } else if (l === 'H') {
              this[i][1] += x;
            } else if (l === 'V') {
              this[i][1] += y;
            } else if (l === 'C' || l === 'S' || l === 'Q') {
              this[i][1] += x;
              this[i][2] += y;
              this[i][3] += x;
              this[i][4] += y;

              if (l === 'C') {
                this[i][5] += x;
                this[i][6] += y;
              }
            } else if (l === 'A') {
              this[i][6] += x;
              this[i][7] += y;
            }
          }
        }

        return this;
      } // Resize path string

    }, {
      key: "size",
      value: function size(width, height) {
        // get bounding box of current situation
        var box = this.bbox();
        var i, l; // recalculate position of all points according to new size

        for (i = this.length - 1; i >= 0; i--) {
          l = this[i][0];

          if (l === 'M' || l === 'L' || l === 'T') {
            this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
            this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
          } else if (l === 'H') {
            this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
          } else if (l === 'V') {
            this[i][1] = (this[i][1] - box.y) * height / box.height + box.y;
          } else if (l === 'C' || l === 'S' || l === 'Q') {
            this[i][1] = (this[i][1] - box.x) * width / box.width + box.x;
            this[i][2] = (this[i][2] - box.y) * height / box.height + box.y;
            this[i][3] = (this[i][3] - box.x) * width / box.width + box.x;
            this[i][4] = (this[i][4] - box.y) * height / box.height + box.y;

            if (l === 'C') {
              this[i][5] = (this[i][5] - box.x) * width / box.width + box.x;
              this[i][6] = (this[i][6] - box.y) * height / box.height + box.y;
            }
          } else if (l === 'A') {
            // resize radii
            this[i][1] = this[i][1] * width / box.width;
            this[i][2] = this[i][2] * height / box.height; // move position values

            this[i][6] = (this[i][6] - box.x) * width / box.width + box.x;
            this[i][7] = (this[i][7] - box.y) * height / box.height + box.y;
          }
        }

        return this;
      } // Test if the passed path array use the same path data commands as this path array

    }, {
      key: "equalCommands",
      value: function equalCommands(pathArray) {
        var i, il, equalCommands;
        pathArray = new PathArray(pathArray);
        equalCommands = this.length === pathArray.value.length;

        for (i = 0, il = this.length; equalCommands && i < il; i++) {
          equalCommands = this[i][0] === pathArray.value[i][0];
        }

        return equalCommands;
      } // Make path array morphable

    }, {
      key: "morph",
      value: function morph(pathArray) {
        pathArray = new PathArray(pathArray);

        if (this.equalCommands(pathArray)) {
          this.destination = pathArray;
        } else {
          this.destination = null;
        }

        return this;
      } // Get morphed path array at given position

    }, {
      key: "at",
      value: function at(pos) {
        // make sure a destination is defined
        if (!this.destination) return this;
        var sourceArray = this;
        var destinationArray = this.destination.value;
        var array = [];
        var pathArray = new PathArray();
        var i, il, j, jl; // Animate has specified in the SVG spec
        // See: https://www.w3.org/TR/SVG11/paths.html#PathElement

        for (i = 0, il = sourceArray.length; i < il; i++) {
          array[i] = [sourceArray[i][0]];

          for (j = 1, jl = sourceArray[i].length; j < jl; j++) {
            array[i][j] = sourceArray[i][j] + (destinationArray[i][j] - sourceArray[i][j]) * pos;
          } // For the two flags of the elliptical arc command, the SVG spec say:
          // Flags and booleans are interpolated as fractions between zero and one, with any non-zero value considered to be a value of one/true
          // Elliptical arc command as an array followed by corresponding indexes:
          // ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y]
          //   0    1   2        3                 4             5      6  7


          if (array[i][0] === 'A') {
            array[i][4] = +(array[i][4] !== 0);
            array[i][5] = +(array[i][5] !== 0);
          }
        } // Directly modify the value of a path array, this is done this way for performance


        pathArray.value = array;
        return pathArray;
      } // Absolutize and parse path to array

    }, {
      key: "parse",
      value: function parse(array) {
        // if it's already a patharray, no need to parse it
        if (array instanceof PathArray) return array.valueOf(); // prepare for parsing

        var s;
        var paramCnt = {
          'M': 2,
          'L': 2,
          'H': 1,
          'V': 1,
          'C': 6,
          'S': 4,
          'Q': 4,
          'T': 2,
          'A': 7,
          'Z': 0
        };

        if (typeof array === 'string') {
          array = array.replace(numbersWithDots, pathRegReplace) // convert 45.123.123 to 45.123 .123
          .replace(pathLetters, ' $& ') // put some room between letters and numbers
          .replace(hyphen, '$1 -') // add space before hyphen
          .trim() // trim
          .split(delimiter); // split into array
        } else {
          array = array.reduce(function (prev, curr) {
            return [].concat.call(prev, curr);
          }, []);
        } // array now is an array containing all parts of a path e.g. ['M', '0', '0', 'L', '30', '30' ...]


        var result = [];
        var p = new Point$1();
        var p0 = new Point$1();
        var index = 0;
        var len = array.length;

        do {
          // Test if we have a path letter
          if (isPathLetter.test(array[index])) {
            s = array[index];
            ++index; // If last letter was a move command and we got no new, it defaults to [L]ine
          } else if (s === 'M') {
            s = 'L';
          } else if (s === 'm') {
            s = 'l';
          }

          result.push(pathHandlers[s].call(null, array.slice(index, index = index + paramCnt[s.toUpperCase()]).map(parseFloat), p, p0));
        } while (len > index);

        return result;
      } // Get bounding box of path

    }, {
      key: "bbox",
      value: function bbox() {
        parser().path.setAttribute('d', this.toString());
        return parser.nodes.path.getBBox();
      }
    }]);

    return PathArray;
  }(SVGArray);

  var Path =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Path, _Base);

    // Initialize node
    function Path(node) {
      _classCallCheck(this, Path);

      return _possibleConstructorReturn(this, _getPrototypeOf(Path).call(this, nodeOrNew$1('path', node), Path));
    } // Get array


    _createClass(Path, [{
      key: "array",
      value: function array() {
        return this._array || (this._array = new PathArray(this.attr('d')));
      } // Plot new path

    }, {
      key: "plot",
      value: function plot(d) {
        return d == null ? this.array() : this.clear().attr('d', typeof d === 'string' ? d : this._array = new PathArray(d));
      } // Clear array cache

    }, {
      key: "clear",
      value: function clear() {
        delete this._array;
        return this;
      } // Move by left top corner

    }, {
      key: "move",
      value: function move(x, y) {
        return this.attr('d', this.array().move(x, y));
      } // Move by left top corner over x-axis

    }, {
      key: "x",
      value: function x(_x) {
        return _x == null ? this.bbox().x : this.move(_x, this.bbox().y);
      } // Move by left top corner over y-axis

    }, {
      key: "y",
      value: function y(_y) {
        return _y == null ? this.bbox().y : this.move(this.bbox().x, _y);
      } // Set element size to given width and height

    }, {
      key: "size",
      value: function size(width, height) {
        var p = proportionalSize$1(this, width, height);
        return this.attr('d', this.array().size(p.width, p.height));
      } // Set width of element

    }, {
      key: "width",
      value: function width(_width) {
        return _width == null ? this.bbox().width : this.size(_width, this.bbox().height);
      } // Set height of element

    }, {
      key: "height",
      value: function height(_height) {
        return _height == null ? this.bbox().height : this.size(this.bbox().width, _height);
      }
    }, {
      key: "targets",
      value: function targets() {
        return baseFind('svg textpath [href*="' + this.id() + '"]');
      }
    }]);

    return Path;
  }(Base$1); // Define morphable array
  Path.prototype.MorphArray = PathArray; // Add parent method

  registerMethods({
    Container: {
      // Create a wrapped path element
      path: function path(d) {
        // make sure plot is called as a setter
        return this.put(new Path()).plot(d || new PathArray());
      }
    }
  });
  register(Path);

  var MorphArray = PointArray$1; // Move by left top corner over x-axis

  function x$2(x) {
    return x == null ? this.bbox().x : this.move(x, this.bbox().y);
  } // Move by left top corner over y-axis

  function y$2(y) {
    return y == null ? this.bbox().y : this.move(this.bbox().x, y);
  } // Set width of element

  function width$2(width) {
    var b = this.bbox();
    return width == null ? b.width : this.size(width, b.height);
  } // Set height of element

  function height$2(height) {
    var b = this.bbox();
    return height == null ? b.height : this.size(b.width, height);
  }

  var pointed = /*#__PURE__*/Object.freeze({
    MorphArray: MorphArray,
    x: x$2,
    y: y$2,
    width: width$2,
    height: height$2
  });

  // Add polygon-specific functions
  // Get array
  function array() {
    return this._array || (this._array = new PointArray(this.attr('points')));
  } // Plot new path

  function plot(p) {
    return p == null ? this.array() : this.clear().attr('points', typeof p === 'string' ? p : this._array = new PointArray(p));
  } // Clear array cache

  function clear() {
    delete this._array;
    return this;
  } // Move by left top corner

  function move$1(x, y) {
    return this.attr('points', this.array().move(x, y));
  } // Set element size to given width and height

  function size$2(width, height) {
    var p = proportionalSize(this, width, height);
    return this.attr('points', this.array().size(p.width, p.height));
  }

  var poly = /*#__PURE__*/Object.freeze({
    array: array,
    plot: plot,
    clear: clear,
    move: move$1,
    size: size$2
  });

  var Polygon =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Polygon, _Base);

    // Initialize node
    function Polygon(node) {
      _classCallCheck(this, Polygon);

      return _possibleConstructorReturn(this, _getPrototypeOf(Polygon).call(this, nodeOrNew$1('polygon', node), Polygon));
    }

    return Polygon;
  }(Base$1);
  registerMethods({
    Parent: {
      // Create a wrapped polygon element
      polygon: function polygon(p) {
        // make sure plot is called as a setter
        return this.put(new Polygon()).plot(p || new PointArray$1());
      }
    }
  });
  extend$1(Polygon, pointed);
  extend$1(Polygon, poly);
  register(Polygon);

  var Polyline =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Polyline, _Base);

    // Initialize node
    function Polyline(node) {
      _classCallCheck(this, Polyline);

      return _possibleConstructorReturn(this, _getPrototypeOf(Polyline).call(this, nodeOrNew$1('polyline', node), Polyline));
    }

    return Polyline;
  }(Base$1);
  registerMethods({
    Parent: {
      // Create a wrapped polygon element
      polyline: function polyline(p) {
        // make sure plot is called as a setter
        return this.put(new Polyline()).plot(p || new PointArray$1());
      }
    }
  });
  extend$1(Polyline, pointed);
  extend$1(Polyline, poly);
  register(Polyline);

  var Rect =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Rect, _Base);

    // Initialize node
    function Rect(node) {
      _classCallCheck(this, Rect);

      return _possibleConstructorReturn(this, _getPrototypeOf(Rect).call(this, nodeOrNew$1('rect', node), Rect));
    }

    return Rect;
  }(Base$1);
  registerMethods({
    Container: {
      // Create a rect element
      rect: function rect(width, height) {
        return this.put(new Rect()).size(width, height);
      }
    }
  });
  register(Rect);

  var _Symbol =
  /*#__PURE__*/
  function (_Base) {
    _inherits(_Symbol, _Base);

    // Initialize node
    function _Symbol(node) {
      _classCallCheck(this, _Symbol);

      return _possibleConstructorReturn(this, _getPrototypeOf(_Symbol).call(this, nodeOrNew$1('symbol', node), _Symbol));
    }

    return _Symbol;
  }(Base$1);
  registerMethods({
    Container: {
      symbol: function symbol() {
        return this.put(new _Symbol());
      }
    }
  });
  register(_Symbol);

  // Create plain text node
  function plain(text) {
    // clear if build mode is disabled
    if (this._build === false) {
      this.clear();
    } // create text node


    this.node.appendChild(document.createTextNode(text));
    return this;
  } // FIXME: Does this also work for textpath?
  // Get length of text element

  function length() {
    return this.node.getComputedTextLength();
  }

  var textable = /*#__PURE__*/Object.freeze({
    plain: plain,
    length: length
  });

  var Text$1 =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Text, _Base);

    // Initialize node
    function Text(node) {
      var _this;

      _classCallCheck(this, Text);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(Text).call(this, nodeOrNew$1('text', node), Text));
      _this.dom.leading = new SVGNumber$1(1.3); // store leading value for rebuilding

      _this._rebuild = true; // enable automatic updating of dy values

      _this._build = false; // disable build mode for adding multiple lines
      // set default font

      _this.attr('font-family', attrs['font-family']);

      return _this;
    } // Move over x-axis


    _createClass(Text, [{
      key: "x",
      value: function x(_x) {
        // act as getter
        if (_x == null) {
          return this.attr('x');
        }

        return this.attr('x', _x);
      } // Move over y-axis

    }, {
      key: "y",
      value: function y(_y) {
        var oy = this.attr('y');
        var o = typeof oy === 'number' ? oy - this.bbox().y : 0; // act as getter

        if (_y == null) {
          return typeof oy === 'number' ? oy - o : oy;
        }

        return this.attr('y', typeof _y === 'number' ? _y + o : _y);
      } // Move center over x-axis

    }, {
      key: "cx",
      value: function cx(x) {
        return x == null ? this.bbox().cx : this.x(x - this.bbox().width / 2);
      } // Move center over y-axis

    }, {
      key: "cy",
      value: function cy(y) {
        return y == null ? this.bbox().cy : this.y(y - this.bbox().height / 2);
      } // Set the text content

    }, {
      key: "text",
      value: function text(_text) {
        // act as getter
        if (_text === undefined) {
          var children = this.node.childNodes;
          var firstLine = 0;
          _text = '';

          for (var i = 0, len = children.length; i < len; ++i) {
            // skip textPaths - they are no lines
            if (children[i].nodeName === 'textPath') {
              if (i === 0) firstLine = 1;
              continue;
            } // add newline if its not the first child and newLined is set to true


            if (i !== firstLine && children[i].nodeType !== 3 && adopt(children[i]).dom.newLined === true) {
              _text += '\n';
            } // add content of this node


            _text += children[i].textContent;
          }

          return _text;
        } // remove existing content


        this.clear().build(true);

        if (typeof _text === 'function') {
          // call block
          _text.call(this, this);
        } else {
          // store text and make sure text is not blank
          _text = _text.split('\n'); // build new lines

          for (var j = 0, jl = _text.length; j < jl; j++) {
            this.tspan(_text[j]).newLine();
          }
        } // disable build mode and rebuild lines


        return this.build(false).rebuild();
      } // Set / get leading

    }, {
      key: "leading",
      value: function leading(value) {
        // act as getter
        if (value == null) {
          return this.dom.leading;
        } // act as setter


        this.dom.leading = new SVGNumber$1(value);
        return this.rebuild();
      } // Rebuild appearance type

    }, {
      key: "rebuild",
      value: function rebuild(_rebuild) {
        // store new rebuild flag if given
        if (typeof _rebuild === 'boolean') {
          this._rebuild = _rebuild;
        } // define position of all lines


        if (this._rebuild) {
          var self = this;
          var blankLineOffset = 0;
          var dy = this.dom.leading * new SVGNumber$1(this.attr('font-size'));
          this.each(function () {
            if (this.dom.newLined) {
              this.attr('x', self.attr('x'));

              if (this.text() === '\n') {
                blankLineOffset += dy;
              } else {
                this.attr('dy', dy + blankLineOffset);
                blankLineOffset = 0;
              }
            }
          });
          this.fire('rebuild');
        }

        return this;
      } // Enable / disable build mode

    }, {
      key: "build",
      value: function build(_build) {
        this._build = !!_build;
        return this;
      } // overwrite method from parent to set data properly

    }, {
      key: "setData",
      value: function setData(o) {
        this.dom = o;
        this.dom.leading = new SVGNumber$1(o.leading || 1.3);
        return this;
      }
    }]);

    return Text;
  }(Base$1);
  extend$1(Text$1, textable);
  registerMethods({
    Container: {
      // Create text element
      text: function text(_text2) {
        return this.put(new Text$1()).text(_text2);
      },
      // Create plain text element
      plain: function plain$$1(text) {
        return this.put(new Text$1()).plain(text);
      }
    }
  });
  register(Text$1);

  var TextPath =
  /*#__PURE__*/
  function (_Text) {
    _inherits(TextPath, _Text);

    // Initialize node
    function TextPath(node) {
      _classCallCheck(this, TextPath);

      return _possibleConstructorReturn(this, _getPrototypeOf(TextPath).call(this, nodeOrNew$1('textPath', node)));
    } // return the array of the path track element


    _createClass(TextPath, [{
      key: "array",
      value: function array() {
        var track = this.track();
        return track ? track.array() : null;
      } // Plot path if any

    }, {
      key: "plot",
      value: function plot(d) {
        var track = this.track();
        var pathArray = null;

        if (track) {
          pathArray = track.plot(d);
        }

        return d == null ? pathArray : this;
      } // Get the path element

    }, {
      key: "track",
      value: function track() {
        return this.reference('href');
      }
    }]);

    return TextPath;
  }(Text$1);
  registerMethods({
    Container: {
      textPath: function textPath(text, path) {
        return this.defs().path(path).text(text).addTo(this);
      }
    },
    Text: {
      // Create path for text to run on
      path: function path(track) {
        var path = new TextPath(); // if d is a path, reuse it

        if (!(track instanceof Path)) {
          // create path element
          track = this.doc().defs().path(track);
        } // link textPath to path and add content


        path.attr('href', '#' + track, xlink); // add textPath element as child node and return textPath

        return this.put(path);
      },
      // FIXME: make this plural?
      // Get the textPath children
      textPath: function textPath() {
        return this.select('textPath');
      }
    },
    Path: {
      // creates a textPath from this path
      text: function text(_text) {
        if (_text instanceof Text$1) {
          var txt = _text.text();

          return _text.clear().path(this).text(txt);
        }

        return this.parent().put(new Text$1()).path(this).text(_text);
      } // FIXME: Maybe add `targets` to get all textPaths associated with this path

    }
  });
  TextPath.prototype.MorphArray = PathArray;
  register(TextPath);

  var Tspan =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Tspan, _Base);

    // Initialize node
    function Tspan(node) {
      _classCallCheck(this, Tspan);

      return _possibleConstructorReturn(this, _getPrototypeOf(Tspan).call(this, nodeOrNew$1('tspan', node), Tspan));
    } // Set text content


    _createClass(Tspan, [{
      key: "text",
      value: function text(_text) {
        if (_text == null) return this.node.textContent + (this.dom.newLined ? '\n' : '');
        typeof _text === 'function' ? _text.call(this, this) : this.plain(_text);
        return this;
      } // Shortcut dx

    }, {
      key: "dx",
      value: function dx(_dx) {
        return this.attr('dx', _dx);
      } // Shortcut dy

    }, {
      key: "dy",
      value: function dy(_dy) {
        return this.attr('dy', _dy);
      } // Create new line

    }, {
      key: "newLine",
      value: function newLine() {
        // fetch text parent
        var t = this.parent(Text); // mark new line

        this.dom.newLined = true; // apply new position

        return this.dy(t.dom.leading * t.attr('font-size')).attr('x', t.x());
      }
    }]);

    return Tspan;
  }(Base$1);
  extend$1(Tspan, textable);
  registerMethods({
    Tspan: {
      tspan: function tspan(text) {
        var tspan = new Tspan(); // clear if build mode is disabled

        if (!this._build) {
          this.clear();
        } // add new tspan


        this.node.appendChild(tspan.node);
        return tspan.text(text);
      }
    }
  });
  register(Tspan);

  var Use =
  /*#__PURE__*/
  function (_Base) {
    _inherits(Use, _Base);

    function Use(node) {
      _classCallCheck(this, Use);

      return _possibleConstructorReturn(this, _getPrototypeOf(Use).call(this, nodeOrNew('use', node), Use));
    } // Use element as a reference


    _createClass(Use, [{
      key: "element",
      value: function element(_element, file) {
        // Set lined element
        return this.attr('href', (file || '') + '#' + _element, xlink);
      }
    }]);

    return Use;
  }(Base$1);
  registerMethods({
    Container: {
      // Create a use element
      use: function use(element, file) {
        return this.put(new Use()).element(element, file);
      }
    }
  });
  register(Use);

  var Matrix$1 =
  /*#__PURE__*/
  function () {
    function Matrix() {
      _classCallCheck(this, Matrix);

      this.init.apply(this, arguments);
    } // Initialize


    _createClass(Matrix, [{
      key: "init",
      value: function init(source) {
        var base = arrayToMatrix([1, 0, 0, 1, 0, 0]); // ensure source as object

        source = source instanceof Base$1 && source.is('Element') ? source.matrixify() : typeof source === 'string' ? arrayToMatrix(source.split(delimiter).map(parseFloat)) : Array.isArray(source) ? arrayToMatrix(source) : _typeof(source) === 'object' && isMatrixLike(source) ? source : _typeof(source) === 'object' ? new Matrix().transform(source) : arguments.length === 6 ? arrayToMatrix([].slice.call(arguments)) : base; // Merge the source matrix with the base matrix

        this.a = source.a != null ? source.a : base.a;
        this.b = source.b != null ? source.b : base.b;
        this.c = source.c != null ? source.c : base.c;
        this.d = source.d != null ? source.d : base.d;
        this.e = source.e != null ? source.e : base.e;
        this.f = source.f != null ? source.f : base.f;
      } // Clones this matrix

    }, {
      key: "clone",
      value: function clone() {
        return new Matrix(this);
      } // Transform a matrix into another matrix by manipulating the space

    }, {
      key: "transform",
      value: function transform(o) {
        // Check if o is a matrix and then left multiply it directly
        if (isMatrixLike(o)) {
          var matrix = new Matrix(o);
          return matrix.multiplyO(this);
        } // Get the proposed transformations and the current transformations


        var t = Matrix.formatTransforms(o);
        var current = this;

        var _transform = new Point$1(t.ox, t.oy).transform(current),
            ox = _transform.x,
            oy = _transform.y; // Construct the resulting matrix


        var transformer = new Matrix().translateO(t.rx, t.ry).lmultiplyO(current).translateO(-ox, -oy).scaleO(t.scaleX, t.scaleY).skewO(t.skewX, t.skewY).shearO(t.shear).rotateO(t.theta).translateO(ox, oy); // If we want the origin at a particular place, we force it there

        if (isFinite(t.px) || isFinite(t.py)) {
          var origin = new Point$1(ox, oy).transform(transformer); // TODO: Replace t.px with isFinite(t.px)

          var dx = t.px ? t.px - origin.x : 0;
          var dy = t.py ? t.py - origin.y : 0;
          transformer.translateO(dx, dy);
        } // Translate now after positioning


        transformer.translateO(t.tx, t.ty);
        return transformer;
      } // Applies a matrix defined by its affine parameters

    }, {
      key: "compose",
      value: function compose(o) {
        if (o.origin) {
          o.originX = o.origin[0];
          o.originY = o.origin[1];
        } // Get the parameters


        var ox = o.originX || 0;
        var oy = o.originY || 0;
        var sx = o.scaleX || 1;
        var sy = o.scaleY || 1;
        var lam = o.shear || 0;
        var theta = o.rotate || 0;
        var tx = o.translateX || 0;
        var ty = o.translateY || 0; // Apply the standard matrix

        var result = new Matrix().translateO(-ox, -oy).scaleO(sx, sy).shearO(lam).rotateO(theta).translateO(tx, ty).lmultiplyO(this).translateO(ox, oy);
        return result;
      } // Decomposes this matrix into its affine parameters

    }, {
      key: "decompose",
      value: function decompose() {
        var cx = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
        var cy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
        // Get the parameters from the matrix
        var a = this.a;
        var b = this.b;
        var c = this.c;
        var d = this.d;
        var e = this.e;
        var f = this.f; // Figure out if the winding direction is clockwise or counterclockwise

        var determinant = a * d - b * c;
        var ccw = determinant > 0 ? 1 : -1; // Since we only shear in x, we can use the x basis to get the x scale
        // and the rotation of the resulting matrix

        var sx = ccw * Math.sqrt(a * a + b * b);
        var thetaRad = Math.atan2(ccw * b, ccw * a);
        var theta = 180 / Math.PI * thetaRad;
        var ct = Math.cos(thetaRad);
        var st = Math.sin(thetaRad); // We can then solve the y basis vector simultaneously to get the other
        // two affine parameters directly from these parameters

        var lam = (a * c + b * d) / determinant;
        var sy = c * sx / (lam * a - b) || d * sx / (lam * b + a); // Use the translations

        var tx = e - cx + cx * ct * sx + cy * (lam * ct * sx - st * sy);
        var ty = f - cy + cx * st * sx + cy * (lam * st * sx + ct * sy); // Construct the decomposition and return it

        return {
          // Return the affine parameters
          scaleX: sx,
          scaleY: sy,
          shear: lam,
          rotate: theta,
          translateX: tx,
          translateY: ty,
          originX: cx,
          originY: cy,
          // Return the matrix parameters
          a: this.a,
          b: this.b,
          c: this.c,
          d: this.d,
          e: this.e,
          f: this.f
        };
      } // Left multiplies by the given matrix

    }, {
      key: "multiply",
      value: function multiply(matrix) {
        return this.clone().multiplyO(matrix);
      }
    }, {
      key: "multiplyO",
      value: function multiplyO(matrix) {
        // Get the matrices
        var l = this;
        var r = matrix instanceof Matrix ? matrix : new Matrix(matrix);
        return Matrix.matrixMultiply(l, r, this);
      }
    }, {
      key: "lmultiply",
      value: function lmultiply(matrix) {
        return this.clone().lmultiplyO(matrix);
      }
    }, {
      key: "lmultiplyO",
      value: function lmultiplyO(matrix) {
        var r = this;
        var l = matrix instanceof Matrix ? matrix : new Matrix(matrix);
        return Matrix.matrixMultiply(l, r, this);
      } // Inverses matrix

    }, {
      key: "inverseO",
      value: function inverseO() {
        // Get the current parameters out of the matrix
        var a = this.a;
        var b = this.b;
        var c = this.c;
        var d = this.d;
        var e = this.e;
        var f = this.f; // Invert the 2x2 matrix in the top left

        var det = a * d - b * c;
        if (!det) throw new Error('Cannot invert ' + this); // Calculate the top 2x2 matrix

        var na = d / det;
        var nb = -b / det;
        var nc = -c / det;
        var nd = a / det; // Apply the inverted matrix to the top right

        var ne = -(na * e + nc * f);
        var nf = -(nb * e + nd * f); // Construct the inverted matrix

        this.a = na;
        this.b = nb;
        this.c = nc;
        this.d = nd;
        this.e = ne;
        this.f = nf;
        return this;
      }
    }, {
      key: "inverse",
      value: function inverse() {
        return this.clone().inverseO();
      } // Translate matrix

    }, {
      key: "translate",
      value: function translate(x, y) {
        return this.clone().translateO(x, y);
      }
    }, {
      key: "translateO",
      value: function translateO(x, y) {
        this.e += x || 0;
        this.f += y || 0;
        return this;
      } // Scale matrix

    }, {
      key: "scale",
      value: function scale(x, y, cx, cy) {
        var _this$clone;

        return (_this$clone = this.clone()).scaleO.apply(_this$clone, arguments);
      }
    }, {
      key: "scaleO",
      value: function scaleO(x) {
        var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
        var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
        var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;

        // Support uniform scaling
        if (arguments.length === 3) {
          cy = cx;
          cx = y;
          y = x;
        }

        var a = this.a,
            b = this.b,
            c = this.c,
            d = this.d,
            e = this.e,
            f = this.f;
        this.a = a * x;
        this.b = b * y;
        this.c = c * x;
        this.d = d * y;
        this.e = e * x - cx * x + cx;
        this.f = f * y - cy * y + cy;
        return this;
      } // Rotate matrix

    }, {
      key: "rotate",
      value: function rotate(r, cx, cy) {
        return this.clone().rotateO(r, cx, cy);
      }
    }, {
      key: "rotateO",
      value: function rotateO(r) {
        var cx = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
        var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
        // Convert degrees to radians
        r = radians(r);
        var cos = Math.cos(r);
        var sin = Math.sin(r);
        var a = this.a,
            b = this.b,
            c = this.c,
            d = this.d,
            e = this.e,
            f = this.f;
        this.a = a * cos - b * sin;
        this.b = b * cos + a * sin;
        this.c = c * cos - d * sin;
        this.d = d * cos + c * sin;
        this.e = e * cos - f * sin + cy * sin - cx * cos + cx;
        this.f = f * cos + e * sin - cx * sin - cy * cos + cy;
        return this;
      } // Flip matrix on x or y, at a given offset

    }, {
      key: "flip",
      value: function flip(axis, around) {
        return this.clone().flipO(axis, around);
      }
    }, {
      key: "flipO",
      value: function flipO(axis, around) {
        return axis === 'x' ? this.scaleO(-1, 1, around, 0) : axis === 'y' ? this.scaleO(1, -1, 0, around) : this.scaleO(-1, -1, axis, around || axis); // Define an x, y flip point
      } // Shear matrix

    }, {
      key: "shear",
      value: function shear(a, cx, cy) {
        return this.clone().shearO(a, cx, cy);
      }
    }, {
      key: "shearO",
      value: function shearO(lx) {
        var cy = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
        var a = this.a,
            b = this.b,
            c = this.c,
            d = this.d,
            e = this.e,
            f = this.f;
        this.a = a + b * lx;
        this.c = c + d * lx;
        this.e = e + f * lx - cy * lx;
        return this;
      } // Skew Matrix

    }, {
      key: "skew",
      value: function skew(x, y, cx, cy) {
        var _this$clone2;

        return (_this$clone2 = this.clone()).skewO.apply(_this$clone2, arguments);
      }
    }, {
      key: "skewO",
      value: function skewO(x) {
        var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : x;
        var cx = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
        var cy = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;

        // support uniformal skew
        if (arguments.length === 3) {
          cy = cx;
          cx = y;
          y = x;
        } // Convert degrees to radians


        x = radians(x);
        y = radians(y);
        var lx = Math.tan(x);
        var ly = Math.tan(y);
        var a = this.a,
            b = this.b,
            c = this.c,
            d = this.d,
            e = this.e,
            f = this.f;
        this.a = a + b * lx;
        this.b = b + a * ly;
        this.c = c + d * lx;
        this.d = d + c * ly;
        this.e = e + f * lx - cy * lx;
        this.f = f + e * ly - cx * ly;
        return this;
      } // SkewX

    }, {
      key: "skewX",
      value: function skewX(x, cx, cy) {
        return this.skew(x, 0, cx, cy);
      }
    }, {
      key: "skewXO",
      value: function skewXO(x, cx, cy) {
        return this.skewO(x, 0, cx, cy);
      } // SkewY

    }, {
      key: "skewY",
      value: function skewY(y, cx, cy) {
        return this.skew(0, y, cx, cy);
      }
    }, {
      key: "skewYO",
      value: function skewYO(y, cx, cy) {
        return this.skewO(0, y, cx, cy);
      } // Transform around a center point

    }, {
      key: "aroundO",
      value: function aroundO(cx, cy, matrix) {
        var dx = cx || 0;
        var dy = cy || 0;
        return this.translateO(-dx, -dy).lmultiplyO(matrix).translateO(dx, dy);
      }
    }, {
      key: "around",
      value: function around(cx, cy, matrix) {
        return this.clone().aroundO(cx, cy, matrix);
      } // Convert to native SVGMatrix

    }, {
      key: "native",
      value: function native() {
        // create new matrix
        var matrix = parser().node.createSVGMatrix(); // update with current values

        for (var i = abcdef.length - 1; i >= 0; i--) {
          matrix[abcdef[i]] = this[abcdef[i]];
        }

        return matrix;
      } // Check if two matrices are equal

    }, {
      key: "equals",
      value: function equals(other) {
        var comp = new Matrix(other);
        return closeEnough(this.a, comp.a) && closeEnough(this.b, comp.b) && closeEnough(this.c, comp.c) && closeEnough(this.d, comp.d) && closeEnough(this.e, comp.e) && closeEnough(this.f, comp.f);
      } // Convert matrix to string

    }, {
      key: "toString",
      value: function toString() {
        return 'matrix(' + this.a + ',' + this.b + ',' + this.c + ',' + this.d + ',' + this.e + ',' + this.f + ')';
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return [this.a, this.b, this.c, this.d, this.e, this.f];
      }
    }, {
      key: "valueOf",
      value: function valueOf() {
        return {
          a: this.a,
          b: this.b,
          c: this.c,
          d: this.d,
          e: this.e,
          f: this.f
        };
      } // TODO: Refactor this to a static function of matrix.js

    }], [{
      key: "formatTransforms",
      value: function formatTransforms(o) {
        // Get all of the parameters required to form the matrix
        var flipBoth = o.flip === 'both' || o.flip === true;
        var flipX = o.flip && (flipBoth || o.flip === 'x') ? -1 : 1;
        var flipY = o.flip && (flipBoth || o.flip === 'y') ? -1 : 1;
        var skewX = o.skew && o.skew.length ? o.skew[0] : isFinite(o.skew) ? o.skew : isFinite(o.skewX) ? o.skewX : 0;
        var skewY = o.skew && o.skew.length ? o.skew[1] : isFinite(o.skew) ? o.skew : isFinite(o.skewY) ? o.skewY : 0;
        var scaleX = o.scale && o.scale.length ? o.scale[0] * flipX : isFinite(o.scale) ? o.scale * flipX : isFinite(o.scaleX) ? o.scaleX * flipX : flipX;
        var scaleY = o.scale && o.scale.length ? o.scale[1] * flipY : isFinite(o.scale) ? o.scale * flipY : isFinite(o.scaleY) ? o.scaleY * flipY : flipY;
        var shear = o.shear || 0;
        var theta = o.rotate || o.theta || 0;
        var origin = new Point$1(o.origin || o.around || o.ox || o.originX, o.oy || o.originY);
        var ox = origin.x;
        var oy = origin.y;
        var position = new Point$1(o.position || o.px || o.positionX, o.py || o.positionY);
        var px = position.x;
        var py = position.y;
        var translate = new Point$1(o.translate || o.tx || o.translateX, o.ty || o.translateY);
        var tx = translate.x;
        var ty = translate.y;
        var relative = new Point$1(o.relative || o.rx || o.relativeX, o.ry || o.relativeY);
        var rx = relative.x;
        var ry = relative.y; // Populate all of the values

        return {
          scaleX: scaleX,
          scaleY: scaleY,
          skewX: skewX,
          skewY: skewY,
          shear: shear,
          theta: theta,
          rx: rx,
          ry: ry,
          tx: tx,
          ty: ty,
          ox: ox,
          oy: oy,
          px: px,
          py: py
        };
      } // left matrix, right matrix, target matrix which is overwritten

    }, {
      key: "matrixMultiply",
      value: function matrixMultiply(l, r, o) {
        // Work out the product directly
        var a = l.a * r.a + l.c * r.b;
        var b = l.b * r.a + l.d * r.b;
        var c = l.a * r.c + l.c * r.d;
        var d = l.b * r.c + l.d * r.d;
        var e = l.e + l.a * r.e + l.c * r.f;
        var f = l.f + l.b * r.e + l.d * r.f; // make sure to use local variables because l/r and o could be the same

        o.a = a;
        o.b = b;
        o.c = c;
        o.d = d;
        o.e = e;
        o.f = f;
        return o;
      }
    }]);

    return Matrix;
  }();
  registerMethods({
    Element: {
      // Get current matrix
      ctm: function ctm() {
        return new Matrix$1(this.node.getCTM());
      },
      // Get current screen matrix
      screenCTM: function screenCTM() {
        /* https://bugzilla.mozilla.org/show_bug.cgi?id=1344537
           This is needed because FF does not return the transformation matrix
           for the inner coordinate system when getScreenCTM() is called on nested svgs.
           However all other Browsers do that */
        if (this instanceof Doc && !this.isRoot()) {
          var rect = this.rect(1, 1);
          var m = rect.node.getScreenCTM();
          rect.remove();
          return new Matrix$1(m);
        }

        return new Matrix$1(this.node.getScreenCTM());
      }
    }
  });

  var Box$1 =
  /*#__PURE__*/
  function () {
    function Box() {
      _classCallCheck(this, Box);

      this.init.apply(this, arguments);
    }

    _createClass(Box, [{
      key: "init",
      value: function init(source) {
        var base = [0, 0, 0, 0];
        source = typeof source === 'string' ? source.split(delimiter).map(parseFloat) : Array.isArray(source) ? source : _typeof(source) === 'object' ? [source.left != null ? source.left : source.x, source.top != null ? source.top : source.y, source.width, source.height] : arguments.length === 4 ? [].slice.call(arguments) : base;
        this.x = source[0];
        this.y = source[1];
        this.width = source[2];
        this.height = source[3]; // add center, right, bottom...

        fullBox(this);
      } // Merge rect box with another, return a new instance

    }, {
      key: "merge",
      value: function merge(box) {
        var x = Math.min(this.x, box.x);
        var y = Math.min(this.y, box.y);
        var width = Math.max(this.x + this.width, box.x + box.width) - x;
        var height = Math.max(this.y + this.height, box.y + box.height) - y;
        return new Box(x, y, width, height);
      }
    }, {
      key: "transform",
      value: function transform(m) {
        var xMin = Infinity;
        var xMax = -Infinity;
        var yMin = Infinity;
        var yMax = -Infinity;
        var pts = [new Point$1(this.x, this.y), new Point$1(this.x2, this.y), new Point$1(this.x, this.y2), new Point$1(this.x2, this.y2)];
        pts.forEach(function (p) {
          p = p.transform(m);
          xMin = Math.min(xMin, p.x);
          xMax = Math.max(xMax, p.x);
          yMin = Math.min(yMin, p.y);
          yMax = Math.max(yMax, p.y);
        });
        return new Box(xMin, yMin, xMax - xMin, yMax - yMin);
      }
    }, {
      key: "addOffset",
      value: function addOffset() {
        // offset by window scroll position, because getBoundingClientRect changes when window is scrolled
        this.x += window.pageXOffset;
        this.y += window.pageYOffset;
        return this;
      }
    }, {
      key: "toString",
      value: function toString() {
        return this.x + ' ' + this.y + ' ' + this.width + ' ' + this.height;
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return [this.x, this.y, this.width, this.height];
      }
    }]);

    return Box;
  }();

  function getBox(cb) {
    var box;

    try {
      box = cb(this.node);

      if (isNulledBox(box) && !domContains(this.node)) {
        throw new Error('Element not in the dom');
      }
    } catch (e) {
      try {
        var clone = this.clone(parser().svg).show();
        box = cb(clone.node);
        clone.remove();
      } catch (e) {
        throw e;
        console.warn('Getting a bounding box of this element is not possible');
      }
    }

    return box;
  }

  registerMethods({
    Element: {
      // Get bounding box
      bbox: function bbox() {
        return new Box$1(getBox.call(this, function (node) {
          return node.getBBox();
        }));
      },
      rbox: function rbox(el) {
        var box = new Box$1(getBox.call(this, function (node) {
          return node.getBoundingClientRect();
        }));
        if (el) return box.transform(el.screenCTM().inverse());
        return box.addOffset();
      }
    },
    viewbox: function viewbox(x, y, width, height) {
      // act as getter
      if (x == null) return new Box$1(this.attr('viewBox')); // act as setter

      return this.attr('viewBox', new Box$1(x, y, width, height));
    }
  });

  /***
  Base Class
  ==========
  The base stepper class that will be
  ***/

  function makeSetterGetter(k, f) {
    return function (v) {
      if (v == null) return this[v];
      this[k] = v;
      if (f) f.call(this);
      return this;
    };
  }

  var easing = {
    '-': function _(pos) {
      return pos;
    },
    '<>': function _(pos) {
      return -Math.cos(pos * Math.PI) / 2 + 0.5;
    },
    '>': function _(pos) {
      return Math.sin(pos * Math.PI / 2);
    },
    '<': function _(pos) {
      return -Math.cos(pos * Math.PI / 2) + 1;
    },
    bezier: function bezier(t0, x0, t1, x1) {
      return function (t) {// TODO: FINISH
      };
    }
  };
  var Stepper =
  /*#__PURE__*/
  function () {
    function Stepper() {
      _classCallCheck(this, Stepper);
    }

    _createClass(Stepper, [{
      key: "done",
      value: function done() {
        return false;
      }
    }]);

    return Stepper;
  }();
  /***
  Easing Functions
  ================
  ***/

  var Ease =
  /*#__PURE__*/
  function (_Stepper) {
    _inherits(Ease, _Stepper);

    function Ease(fn) {
      var _this;

      _classCallCheck(this, Ease);

      _this = _possibleConstructorReturn(this, _getPrototypeOf(Ease).call(this));
      _this.ease = easing[fn || timeline.ease] || fn;
      return _this;
    }

    _createClass(Ease, [{
      key: "step",
      value: function step(from, to, pos) {
        if (typeof from !== 'number') {
          return pos < 1 ? from : to;
        }

        return from + (to - from) * this.ease(pos);
      }
    }]);

    return Ease;
  }(Stepper);
  /***
  Controller Types
  ================
  ***/

  var Controller =
  /*#__PURE__*/
  function (_Stepper2) {
    _inherits(Controller, _Stepper2);

    function Controller(fn) {
      var _this2;

      _classCallCheck(this, Controller);

      _this2 = _possibleConstructorReturn(this, _getPrototypeOf(Controller).call(this));
      _this2.stepper = fn;
      return _this2;
    }

    _createClass(Controller, [{
      key: "step",
      value: function step(current, target, dt, c) {
        return this.stepper(current, target, dt, c);
      }
    }, {
      key: "done",
      value: function done(c) {
        return c.done;
      }
    }]);

    return Controller;
  }(Stepper);

  function recalculate() {
    // Apply the default parameters
    var duration = (this._duration || 500) / 1000;
    var overshoot = this._overshoot || 0; // Calculate the PID natural response

    var eps = 1e-10;
    var pi = Math.PI;
    var os = Math.log(overshoot / 100 + eps);
    var zeta = -os / Math.sqrt(pi * pi + os * os);
    var wn = 3.9 / (zeta * duration); // Calculate the Spring values

    this.d = 2 * zeta * wn;
    this.k = wn * wn;
  }

  var Spring =
  /*#__PURE__*/
  function (_Controller) {
    _inherits(Spring, _Controller);

    function Spring(duration, overshoot) {
      var _this3;

      _classCallCheck(this, Spring);

      _this3 = _possibleConstructorReturn(this, _getPrototypeOf(Spring).call(this));

      _this3.duration(duration || 500).overshoot(overshoot || 0);

      return _this3;
    }

    _createClass(Spring, [{
      key: "step",
      value: function step(current, target, dt, c) {
        if (typeof current === 'string') return current;
        c.done = dt === Infinity;
        if (dt === Infinity) return target;
        if (dt === 0) return current;
        if (dt > 100) dt = 16;
        dt /= 1000; // Get the previous velocity

        var velocity = c.velocity || 0; // Apply the control to get the new position and store it

        var acceleration = -this.d * velocity - this.k * (current - target);
        var newPosition = current + velocity * dt + acceleration * dt * dt / 2; // Store the velocity

        c.velocity = velocity + acceleration * dt; // Figure out if we have converged, and if so, pass the value

        c.done = Math.abs(target - newPosition) + Math.abs(velocity) < 0.002;
        return c.done ? target : newPosition;
      }
    }]);

    return Spring;
  }(Controller);
  extend$1(Spring, {
    duration: makeSetterGetter('_duration', recalculate),
    overshoot: makeSetterGetter('_overshoot', recalculate)
  });
  var PID =
  /*#__PURE__*/
  function (_Controller2) {
    _inherits(PID, _Controller2);

    function PID(p, i, d, windup) {
      var _this4;

      _classCallCheck(this, PID);

      _this4 = _possibleConstructorReturn(this, _getPrototypeOf(PID).call(this));
      p = p == null ? 0.1 : p;
      i = i == null ? 0.01 : i;
      d = d == null ? 0 : d;
      windup = windup == null ? 1000 : windup;

      _this4.p(p).i(i).d(d).windup(windup);

      return _this4;
    }

    _createClass(PID, [{
      key: "step",
      value: function step(current, target, dt, c) {
        if (typeof current === 'string') return current;
        c.done = dt === Infinity;
        if (dt === Infinity) return target;
        if (dt === 0) return current;
        var p = target - current;
        var i = (c.integral || 0) + p * dt;
        var d = (p - (c.error || 0)) / dt;
        var windup = this.windup; // antiwindup

        if (windup !== false) {
          i = Math.max(-windup, Math.min(i, windup));
        }

        c.error = p;
        c.integral = i;
        c.done = Math.abs(p) < 0.001;
        return c.done ? target : current + (this.P * p + this.I * i + this.D * d);
      }
    }]);

    return PID;
  }(Controller);
  extend$1(PID, {
    windup: makeSetterGetter('windup'),
    p: makeSetterGetter('P'),
    i: makeSetterGetter('I'),
    d: makeSetterGetter('D')
  });

  var Morphable =
  /*#__PURE__*/
  function () {
    function Morphable(stepper) {
      _classCallCheck(this, Morphable);

      // FIXME: the default stepper does not know about easing
      this._stepper = stepper || new Ease('-');
      this._from = null;
      this._to = null;
      this._type = null;
      this._context = null;
      this._morphObj = null;
    }

    _createClass(Morphable, [{
      key: "from",
      value: function from(val) {
        if (val == null) {
          return this._from;
        }

        this._from = this._set(val);
        return this;
      }
    }, {
      key: "to",
      value: function to(val) {
        if (val == null) {
          return this._to;
        }

        this._to = this._set(val);
        return this;
      }
    }, {
      key: "type",
      value: function type(_type) {
        // getter
        if (_type == null) {
          return this._type;
        } // setter


        this._type = _type;
        return this;
      }
    }, {
      key: "_set",
      value: function _set$$1(value) {
        if (!this._type) {
          var type = _typeof(value);

          if (type === 'number') {
            this.type(SVGNumber$1);
          } else if (type === 'string') {
            if (Color.isColor(value)) {
              this.type(Color);
            } else if (regex.delimiter.test(value)) {
              this.type(regex.pathLetters.test(value) ? PathArray : SVGArray);
            } else if (regex.numberAndUnit.test(value)) {
              this.type(SVGNumber$1);
            } else {
              this.type(Morphable.NonMorphable);
            }
          } else if (MorphableTypes.indexOf(value.constructor) > -1) {
            this.type(value.constructor);
          } else if (Array.isArray(value)) {
            this.type(SVGArray);
          } else if (type === 'object') {
            this.type(Morphable.ObjectBag);
          } else {
            this.type(Morphable.NonMorphable);
          }
        }

        var result = new this._type(value).toArray();
        this._morphObj = this._morphObj || new this._type();
        this._context = this._context || Array.apply(null, Array(result.length)).map(Object);
        return result;
      }
    }, {
      key: "stepper",
      value: function stepper(_stepper) {
        if (_stepper == null) return this._stepper;
        this._stepper = _stepper;
        return this;
      }
    }, {
      key: "done",
      value: function done() {
        var complete = this._context.map(this._stepper.done).reduce(function (last, curr) {
          return last && curr;
        }, true);

        return complete;
      }
    }, {
      key: "at",
      value: function at(pos) {
        var _this = this;

        return this._morphObj.fromArray(this._from.map(function (i, index) {
          return _this._stepper.step(i, _this._to[index], pos, _this._context[index], _this._context);
        }));
      }
    }]);

    return Morphable;
  }();

  Morphable.NonMorphable =
  /*#__PURE__*/
  function () {
    function _class() {
      _classCallCheck(this, _class);

      this.init.apply(this, arguments);
    }

    _createClass(_class, [{
      key: "init",
      value: function init(val) {
        val = Array.isArray(val) ? val[0] : val;
        this.value = val;
      }
    }, {
      key: "valueOf",
      value: function valueOf() {
        return this.value;
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return [this.value];
      }
    }]);

    return _class;
  }();

  Morphable.TransformBag =
  /*#__PURE__*/
  function () {
    function _class2() {
      _classCallCheck(this, _class2);

      this.init.apply(this, arguments);
    }

    _createClass(_class2, [{
      key: "init",
      value: function init(obj) {
        if (Array.isArray(obj)) {
          obj = {
            scaleX: obj[0],
            scaleY: obj[1],
            shear: obj[2],
            rotate: obj[3],
            translateX: obj[4],
            translateY: obj[5],
            originX: obj[6],
            originY: obj[7]
          };
        }

        Object.assign(this, Morphable.TransformBag.defaults, obj);
      }
    }, {
      key: "toArray",
      value: function toArray() {
        var v = this;
        return [v.scaleX, v.scaleY, v.shear, v.rotate, v.translateX, v.translateY, v.originX, v.originY];
      }
    }]);

    return _class2;
  }();

  Morphable.TransformBag.defaults = {
    scaleX: 1,
    scaleY: 1,
    shear: 0,
    rotate: 0,
    translateX: 0,
    translateY: 0,
    originX: 0,
    originY: 0
  };

  Morphable.ObjectBag =
  /*#__PURE__*/
  function () {
    function _class3() {
      _classCallCheck(this, _class3);

      this.init.apply(this, arguments);
    }

    _createClass(_class3, [{
      key: "init",
      value: function init(objOrArr) {
        this.values = [];

        if (Array.isArray(objOrArr)) {
          this.values = objOrArr;
          return;
        }

        var entries = Object.entries(objOrArr || {}).sort(function (a, b) {
          return a[0] - b[0];
        });
        this.values = entries.reduce(function (last, curr) {
          return last.concat(curr);
        }, []);
      }
    }, {
      key: "valueOf",
      value: function valueOf() {
        var obj = {};
        var arr = this.values;

        for (var i = 0, len = arr.length; i < len; i += 2) {
          obj[arr[i]] = arr[i + 1];
        }

        return obj;
      }
    }, {
      key: "toArray",
      value: function toArray() {
        return this.values;
      }
    }]);

    return _class3;
  }();

  var morphableTypes = [SVGNumber$1, Color, Box$1, Matrix$1, SVGArray, PointArray$1, PathArray, Morphable.NonMorphable, Morphable.TransformBag, Morphable.ObjectBag];
  extend$1(morphableTypes, {
    to: function to(val, args) {
      return new Morphable().type(this.constructor).from(this.valueOf()).to(val, args);
    },
    fromArray: function fromArray(arr) {
      this.init(arr);
      return this;
    }
  });

  var time = window.performance || Date;

  var makeSchedule = function makeSchedule(runnerInfo) {
    var start = runnerInfo.start;
    var duration = runnerInfo.runner.duration();
    var end = start + duration;
    return {
      start: start,
      duration: duration,
      end: end,
      runner: runnerInfo.runner
    };
  };

  var Timeline =
  /*#__PURE__*/
  function () {
    // Construct a new timeline on the given element
    function Timeline() {
      _classCallCheck(this, Timeline);

      this._timeSource = function () {
        return time.now();
      };

      this._dispatcher = document.createElement('div'); // Store the timing variables

      this._startTime = 0;
      this._speed = 1.0; // Play control variables control how the animation proceeds

      this._reverse = false;
      this._persist = 0; // Keep track of the running animations and their starting parameters

      this._nextFrame = null;
      this._paused = false;
      this._runners = [];
      this._order = [];
      this._time = 0;
      this._lastSourceTime = 0;
      this._lastStepTime = 0;
    }

    _createClass(Timeline, [{
      key: "getEventTarget",
      value: function getEventTarget() {
        return this._dispatcher;
      }
      /**
       *
       */
      // schedules a runner on the timeline

    }, {
      key: "schedule",
      value: function schedule(runner, delay, when) {
        if (runner == null) {
          return this._runners.map(makeSchedule).sort(function (a, b) {
            return a.start - b.start || a.duration - b.duration;
          });
        }

        if (!this.active()) {
          this._step();

          if (when == null) {
            when = 'now';
          }
        } // The start time for the next animation can either be given explicitly,
        // derived from the current timeline time or it can be relative to the
        // last start time to chain animations direclty


        var absoluteStartTime = 0;
        delay = delay || 0; // Work out when to start the animation

        if (when == null || when === 'last' || when === 'after') {
          // Take the last time and increment
          absoluteStartTime = this._startTime;
        } else if (when === 'absolute' || when === 'start') {
          absoluteStartTime = delay;
          delay = 0;
        } else if (when === 'now') {
          absoluteStartTime = this._time;
        } else if (when === 'relative') {
          var runnerInfo = this._runners[runner.id];

          if (runnerInfo) {
            absoluteStartTime = runnerInfo.start + delay;
            delay = 0;
          }
        } else {
          throw new Error('Invalid value for the "when" parameter');
        } // Manage runner


        runner.unschedule();
        runner.timeline(this);
        runner.time(-delay); // Save startTime for next runner

        this._startTime = absoluteStartTime + runner.duration() + delay; // Save runnerInfo

        this._runners[runner.id] = {
          persist: this.persist(),
          runner: runner,
          start: absoluteStartTime // Save order and continue

        };

        this._order.push(runner.id);

        this._continue();

        return this;
      } // Remove the runner from this timeline

    }, {
      key: "unschedule",
      value: function unschedule(runner) {
        var index = this._order.indexOf(runner.id);

        if (index < 0) return this;
        delete this._runners[runner.id];

        this._order.splice(index, 1);

        runner.timeline(null);
        return this;
      }
    }, {
      key: "play",
      value: function play() {
        // Now make sure we are not paused and continue the animation
        this._paused = false;
        return this._continue();
      }
    }, {
      key: "pause",
      value: function pause() {
        // Cancel the next animation frame and pause
        this._nextFrame = null;
        this._paused = true;
        return this;
      }
    }, {
      key: "stop",
      value: function stop() {
        // Cancel the next animation frame and go to start
        this.seek(-this._time);
        return this.pause();
      }
    }, {
      key: "finish",
      value: function finish() {
        this.seek(Infinity);
        return this.pause();
      }
    }, {
      key: "speed",
      value: function speed(_speed) {
        if (_speed == null) return this._speed;
        this._speed = _speed;
        return this;
      }
    }, {
      key: "reverse",
      value: function reverse(yes) {
        var currentSpeed = this.speed();
        if (yes == null) return this.speed(-currentSpeed);
        var positive = Math.abs(currentSpeed);
        return this.speed(yes ? positive : -positive);
      }
    }, {
      key: "seek",
      value: function seek(dt) {
        this._time += dt;
        return this._continue();
      }
    }, {
      key: "time",
      value: function time(_time) {
        if (_time == null) return this._time;
        this._time = _time;
        return this;
      }
    }, {
      key: "persist",
      value: function persist(dtOrForever) {
        if (dtOrForever == null) return this._persist;
        this._persist = dtOrForever;
        return this;
      }
    }, {
      key: "source",
      value: function source(fn) {
        if (fn == null) return this._timeSource;
        this._timeSource = fn;
        return this;
      }
    }, {
      key: "_step",
      value: function _step() {
        // If the timeline is paused, just do nothing
        if (this._paused) return; // Get the time delta from the last time and update the time
        // TODO: Deal with window.blur window.focus to pause animations

        var time = this._timeSource();

        var dtSource = time - this._lastSourceTime;
        var dtTime = this._speed * dtSource + (this._time - this._lastStepTime);
        this._lastSourceTime = time; // Update the time

        this._time += dtTime;
        this._lastStepTime = this._time; // this.fire('time', this._time)
        // Run all of the runners directly

        var runnersLeft = false;

        for (var i = 0, len = this._order.length; i < len; i++) {
          // Get and run the current runner and ignore it if its inactive
          var runnerInfo = this._runners[this._order[i]];
          var runner = runnerInfo.runner;
          var dt = dtTime; // Make sure that we give the actual difference
          // between runner start time and now

          var dtToStart = this._time - runnerInfo.start; // Dont run runner if not started yet

          if (dtToStart < 0) {
            runnersLeft = true;
            continue;
          } else if (dtToStart < dt) {
            // Adjust dt to make sure that animation is on point
            dt = dtToStart;
          }

          if (!runner.active()) continue; // If this runner is still going, signal that we need another animation
          // frame, otherwise, remove the completed runner

          var finished = runner.step(dt).done;

          if (!finished) {
            runnersLeft = true; // continue
          } else if (runnerInfo.persist !== true) {
            // runner is finished. And runner might get removed
            // TODO: Figure out end time of runner
            var endTime = runner.duration() - runner.time() + this._time;

            if (endTime + this._persist < this._time) {
              // Delete runner and correct index
              delete this._runners[this._order[i]];
              this._order.splice(i--, 1) && --len;
              runner.timeline(null);
            }
          }
        } // Get the next animation frame to keep the simulation going


        if (runnersLeft) {
          this._nextFrame = Animator.frame(this._step.bind(this));
        } else {
          this._nextFrame = null;
        }

        return this;
      } // Checks if we are running and continues the animation

    }, {
      key: "_continue",
      value: function _continue() {
        if (this._paused) return this;

        if (!this._nextFrame) {
          this._nextFrame = Animator.frame(this._step.bind(this));
        }

        return this;
      }
    }, {
      key: "active",
      value: function active() {
        return !!this._nextFrame;
      }
    }]);

    return Timeline;
  }();
  registerMethods({
    Element: {
      timeline: function timeline() {
        this._timeline = this._timeline || new Timeline();
        return this._timeline;
      }
    }
  });

  // easing = {
  //   '-': function (pos) { return pos },
  //   '<>': function (pos) { return -Math.cos(pos * Math.PI) / 2 + 0.5 },
  //   '>': function (pos) { return Math.sin(pos * Math.PI / 2) },
  //   '<': function (pos) { return -Math.cos(pos * Math.PI / 2) + 1 }
  // }

  var Runner$1 =
  /*#__PURE__*/
  function () {
    function Runner(options) {
      _classCallCheck(this, Runner);

      // Store a unique id on the runner, so that we can identify it later
      this.id = Runner.id++; // Ensure a default value

      options = options == null ? timeline.duration : options; // Ensure that we get a controller

      options = typeof options === 'function' ? new Controller(options) : options; // Declare all of the variables

      this._element = null;
      this._timeline = null;
      this.done = false;
      this._queue = []; // Work out the stepper and the duration

      this._duration = typeof options === 'number' && options;
      this._isDeclarative = options instanceof Controller;
      this._stepper = this._isDeclarative ? options : new Ease(); // We copy the current values from the timeline because they can change

      this._history = {}; // Store the state of the runner

      this.enabled = true;
      this._time = 0;
      this._last = 0; // Save transforms applied to this runner

      this.transforms = new Matrix$1();
      this.transformId = 1; // Looping variables

      this._haveReversed = false;
      this._reverse = false;
      this._loopsDone = 0;
      this._swing = false;
      this._wait = 0;
      this._times = 1;
    }
    /*
    Runner Definitions
    ==================
    These methods help us define the runtime behaviour of the Runner or they
    help us make new runners from the current runner
    */


    _createClass(Runner, [{
      key: "element",
      value: function element(_element) {
        if (_element == null) return this._element;
        this._element = _element;

        _element._prepareRunner();

        return this;
      }
    }, {
      key: "timeline",
      value: function timeline$$1(_timeline) {
        // check explicitly for undefined so we can set the timeline to null
        if (typeof _timeline === 'undefined') return this._timeline;
        this._timeline = _timeline;
        return this;
      }
    }, {
      key: "animate",
      value: function animate(duration, delay, when) {
        var o = Runner.sanitise(duration, delay, when);
        var runner = new Runner(o.duration);
        if (this._timeline) runner.timeline(this._timeline);
        if (this._element) runner.element(this._element);
        return runner.loop(o).schedule(delay, when);
      }
    }, {
      key: "schedule",
      value: function schedule(timeline$$1, delay, when) {
        // The user doesn't need to pass a timeline if we already have one
        if (!(timeline$$1 instanceof Timeline)) {
          when = delay;
          delay = timeline$$1;
          timeline$$1 = this.timeline();
        } // If there is no timeline, yell at the user...


        if (!timeline$$1) {
          throw Error('Runner cannot be scheduled without timeline');
        } // Schedule the runner on the timeline provided


        timeline$$1.schedule(this, delay, when);
        return this;
      }
    }, {
      key: "unschedule",
      value: function unschedule() {
        var timeline$$1 = this.timeline();
        timeline$$1 && timeline$$1.unschedule(this);
        return this;
      }
    }, {
      key: "loop",
      value: function loop(times, swing, wait) {
        // Deal with the user passing in an object
        if (_typeof(times) === 'object') {
          swing = times.swing;
          wait = times.wait;
          times = times.times;
        } // Sanitise the values and store them


        this._times = times || Infinity;
        this._swing = swing || false;
        this._wait = wait || 0;
        return this;
      }
    }, {
      key: "delay",
      value: function delay(_delay) {
        return this.animate(0, _delay);
      }
      /*
      Basic Functionality
      ===================
      These methods allow us to attach basic functions to the runner directly
      */

    }, {
      key: "queue",
      value: function queue(initFn, runFn, isTransform) {
        this._queue.push({
          initialiser: initFn || noop,
          runner: runFn || noop,
          isTransform: isTransform,
          initialised: false,
          finished: false
        });

        var timeline$$1 = this.timeline();
        timeline$$1 && this.timeline()._continue();
        return this;
      }
    }, {
      key: "during",
      value: function during(fn) {
        return this.queue(null, fn);
      }
    }, {
      key: "after",
      value: function after(fn) {
        return this.on('finish', fn);
      }
      /*
      Runner animation methods
      ========================
      Control how the animation plays
      */

    }, {
      key: "time",
      value: function time(_time) {
        if (_time == null) {
          return this._time;
        }

        var dt = _time - this._time;
        this.step(dt);
        return this;
      }
    }, {
      key: "duration",
      value: function duration() {
        return this._times * (this._wait + this._duration) - this._wait;
      }
    }, {
      key: "loops",
      value: function loops(p) {
        var loopDuration = this._duration + this._wait;

        if (p == null) {
          var loopsDone = Math.floor(this._time / loopDuration);
          var relativeTime = this._time - loopsDone * loopDuration;
          var position = relativeTime / this._duration;
          return Math.min(loopsDone + position, this._times);
        }

        var whole = Math.floor(p);
        var partial = p % 1;
        var time = loopDuration * whole + this._duration * partial;
        return this.time(time);
      }
    }, {
      key: "position",
      value: function position(p) {
        // Get all of the variables we need
        var x = this._time;
        var d = this._duration;
        var w = this._wait;
        var t = this._times;
        var s = this._swing;
        var r = this._reverse;
        var position;

        if (p == null) {
          /*
          This function converts a time to a position in the range [0, 1]
          The full explanation can be found in this desmos demonstration
            https://www.desmos.com/calculator/u4fbavgche
          The logic is slightly simplified here because we can use booleans
          */
          // Figure out the value without thinking about the start or end time
          var f = function f(x) {
            var swinging = s * Math.floor(x % (2 * (w + d)) / (w + d));
            var backwards = swinging && !r || !swinging && r;
            var uncliped = Math.pow(-1, backwards) * (x % (w + d)) / d + backwards;
            var clipped = Math.max(Math.min(uncliped, 1), 0);
            return clipped;
          }; // Figure out the value by incorporating the start time


          var endTime = t * (w + d) - w;
          position = x <= 0 ? Math.round(f(1e-5)) : x < endTime ? f(x) : Math.round(f(endTime - 1e-5));
          return position;
        } // Work out the loops done and add the position to the loops done


        var loopsDone = Math.floor(this.loops());
        var swingForward = s && loopsDone % 2 === 0;
        var forwards = swingForward && !r || r && swingForward;
        position = loopsDone + (forwards ? p : 1 - p);
        return this.loops(position);
      }
    }, {
      key: "progress",
      value: function progress(p) {
        if (p == null) {
          return Math.min(1, this._time / this.duration());
        }

        return this.time(p * this.duration());
      }
    }, {
      key: "step",
      value: function step(dt) {
        // If we are inactive, this stepper just gets skipped
        if (!this.enabled) return this; // Update the time and get the new position

        dt = dt == null ? 16 : dt;
        this._time += dt;
        var position = this.position(); // Figure out if we need to run the stepper in this frame

        var running = this._lastPosition !== position && this._time >= 0;
        this._lastPosition = position; // Figure out if we just started

        var duration = this.duration();
        var justStarted = this._lastTime < 0 && this._time > 0;
        var justFinished = this._lastTime < this._time && this.time > duration;
        this._lastTime = this._time;
        // Work out if the runner is finished set the done flag here so animations
        // know, that they are running in the last step (this is good for
        // transformations which can be merged)


        var declarative = this._isDeclarative;
        this.done = !declarative && !justFinished && this._time >= duration; // Call initialise and the run function

        if (running || declarative) {
          this._initialise(running); // clear the transforms on this runner so they dont get added again and again


          this.transforms = new Matrix$1();

          var converged = this._run(declarative ? dt : position); // this.fire('step', this)

        } // correct the done flag here
        // declaritive animations itself know when they converged


        this.done = this.done || converged && declarative; // if (this.done) {
        //   this.fire('finish', this)
        // }

        return this;
      }
    }, {
      key: "finish",
      value: function finish() {
        return this.step(Infinity);
      }
    }, {
      key: "reverse",
      value: function reverse(_reverse) {
        this._reverse = _reverse == null ? !this._reverse : _reverse;
        return this;
      }
    }, {
      key: "ease",
      value: function ease(fn) {
        this._stepper = new Ease(fn);
        return this;
      }
    }, {
      key: "active",
      value: function active(enabled) {
        if (enabled == null) return this.enabled;
        this.enabled = enabled;
        return this;
      }
      /*
      Private Methods
      ===============
      Methods that shouldn't be used externally
      */
      // Save a morpher to the morpher list so that we can retarget it later

    }, {
      key: "_rememberMorpher",
      value: function _rememberMorpher(method, morpher) {
        this._history[method] = {
          morpher: morpher,
          caller: this._queue[this._queue.length - 1]
        };
      } // Try to set the target for a morpher if the morpher exists, otherwise
      // do nothing and return false

    }, {
      key: "_tryRetarget",
      value: function _tryRetarget(method, target) {
        if (this._history[method]) {
          // if the last method wasnt even initialised, throw it away
          if (!this._history[method].caller.initialised) {
            var index = this._queue.indexOf(this._history[method].caller);

            this._queue.splice(index, 1);

            return false;
          } // for the case of transformations, we use the special retarget function
          // which has access to the outer scope


          if (this._history[method].caller.isTransform) {
            this._history[method].caller.isTransform(target); // for everything else a simple morpher change is sufficient

          } else {
            this._history[method].morpher.to(target);
          }

          this._history[method].caller.finished = false;
          var timeline$$1 = this.timeline();
          timeline$$1 && timeline$$1._continue();
          return true;
        }

        return false;
      } // Run each initialise function in the runner if required

    }, {
      key: "_initialise",
      value: function _initialise(running) {
        // If we aren't running, we shouldn't initialise when not declarative
        if (!running && !this._isDeclarative) return; // Loop through all of the initialisers

        for (var i = 0, len = this._queue.length; i < len; ++i) {
          // Get the current initialiser
          var current = this._queue[i]; // Determine whether we need to initialise

          var needsIt = this._isDeclarative || !current.initialised && running;
          running = !current.finished; // Call the initialiser if we need to

          if (needsIt && running) {
            current.initialiser.call(this);
            current.initialised = true;
          }
        }
      } // Run each run function for the position or dt given

    }, {
      key: "_run",
      value: function _run(positionOrDt) {
        // Run all of the _queue directly
        var allfinished = true;

        for (var i = 0, len = this._queue.length; i < len; ++i) {
          // Get the current function to run
          var current = this._queue[i]; // Run the function if its not finished, we keep track of the finished
          // flag for the sake of declarative _queue

          var converged = current.runner.call(this, positionOrDt);
          current.finished = current.finished || converged === true;
          allfinished = allfinished && current.finished;
        } // We report when all of the constructors are finished


        return allfinished;
      }
    }, {
      key: "addTransform",
      value: function addTransform(transform, index) {
        this.transforms.lmultiplyO(transform);
        return this;
      }
    }, {
      key: "clearTransform",
      value: function clearTransform() {
        this.transforms = new Matrix$1();
        return this;
      }
    }], [{
      key: "sanitise",
      value: function sanitise(duration, delay, when) {
        // Initialise the default parameters
        var times = 1;
        var swing = false;
        var wait = 0;
        duration = duration || timeline.duration;
        delay = delay || timeline.delay;
        when = when || 'last'; // If we have an object, unpack the values

        if (_typeof(duration) === 'object' && !(duration instanceof Stepper)) {
          delay = duration.delay || delay;
          when = duration.when || when;
          swing = duration.swing || swing;
          times = duration.times || times;
          wait = duration.wait || wait;
          duration = duration.duration || timeline.duration;
        }

        return {
          duration: duration,
          delay: delay,
          swing: swing,
          times: times,
          wait: wait,
          when: when
        };
      }
    }]);

    return Runner;
  }();
  Runner$1.id = 0;

  var FakeRunner = function FakeRunner() {
    var transforms = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new Matrix$1();
    var id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
    var done = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;

    _classCallCheck(this, FakeRunner);

    this.transforms = transforms;
    this.id = id;
    this.done = done;
  };

  extend$1([Runner$1, FakeRunner], {
    mergeWith: function mergeWith(runner) {
      return new FakeRunner(runner.transforms.lmultiply(this.transforms), runner.id);
    }
  }); // FakeRunner.emptyRunner = new FakeRunner()

  var lmultiply = function lmultiply(last, curr) {
    return last.lmultiplyO(curr);
  };

  var getRunnerTransform = function getRunnerTransform(runner) {
    return runner.transforms;
  };

  function mergeTransforms() {
    // Find the matrix to apply to the element and apply it
    var runners = this._transformationRunners.runners;
    var netTransform = runners.map(getRunnerTransform).reduce(lmultiply, new Matrix$1());
    this.transform(netTransform);

    this._transformationRunners.merge();

    if (this._transformationRunners.length() === 1) {
      this._frameId = null;
    }
  }

  var RunnerArray =
  /*#__PURE__*/
  function () {
    function RunnerArray() {
      _classCallCheck(this, RunnerArray);

      this.runners = [];
      this.ids = [];
    }

    _createClass(RunnerArray, [{
      key: "add",
      value: function add(runner) {
        if (this.runners.includes(runner)) return;
        var id = runner.id + 1;
        var leftSibling = this.ids.reduce(function (last, curr) {
          if (curr > last && curr < id) return curr;
          return last;
        }, 0);
        var index = this.ids.indexOf(leftSibling) + 1;
        this.ids.splice(index, 0, id);
        this.runners.splice(index, 0, runner);
        return this;
      }
    }, {
      key: "getByID",
      value: function getByID(id) {
        return this.runners[this.ids.indexOf(id + 1)];
      }
    }, {
      key: "remove",
      value: function remove(id) {
        var index = this.ids.indexOf(id + 1);
        this.ids.splice(index, 1);
        this.runners.splice(index, 1);
        return this;
      }
    }, {
      key: "merge",
      value: function merge() {
        var _this = this;

        var lastRunner = null;
        this.runners.forEach(function (runner, i) {
          if (lastRunner && runner.done && lastRunner.done) {
            _this.remove(runner.id);

            _this.edit(lastRunner.id, runner.mergeWith(lastRunner));
          }

          lastRunner = runner;
        });
        return this;
      }
    }, {
      key: "edit",
      value: function edit(id, newRunner) {
        var index = this.ids.indexOf(id + 1);
        this.ids.splice(index, 1, id);
        this.runners.splice(index, 1, newRunner);
        return this;
      }
    }, {
      key: "length",
      value: function length() {
        return this.ids.length;
      }
    }, {
      key: "clearBefore",
      value: function clearBefore(id) {
        var deleteCnt = this.ids.indexOf(id + 1) || 1;
        this.ids.splice(0, deleteCnt, 0);
        this.runners.splice(0, deleteCnt, new FakeRunner());
        return this;
      }
    }]);

    return RunnerArray;
  }();

  var frameId = 0;
  registerMethods({
    Element: {
      animate: function animate(duration, delay, when) {
        var o = Runner$1.sanitise(duration, delay, when);
        var timeline$$1 = this.timeline();
        return new Runner$1(o.duration).loop(o).element(this).timeline(timeline$$1).schedule(delay, when);
      },
      delay: function delay(by, when) {
        return this.animate(0, by, when);
      },
      // this function searches for all runners on the element and deletes the ones
      // which run before the current one. This is because absolute transformations
      // overwfrite anything anyway so there is no need to waste time computing
      // other runners
      _clearTransformRunnersBefore: function _clearTransformRunnersBefore(currentRunner) {
        this._transformationRunners.clearBefore(currentRunner.id);
      },
      _currentTransform: function _currentTransform(current) {
        return this._transformationRunners.runners // we need the equal sign here to make sure, that also transformations
        // on the same runner which execute before the current transformation are
        // taken into account
        .filter(function (runner) {
          return runner.id <= current.id;
        }).map(getRunnerTransform).reduce(lmultiply, new Matrix$1());
      },
      addRunner: function addRunner(runner) {
        this._transformationRunners.add(runner);

        Animator.transform_frame(mergeTransforms.bind(this), this._frameId);
      },
      _prepareRunner: function _prepareRunner() {
        if (this._frameId == null) {
          this._transformationRunners = new RunnerArray().add(new FakeRunner(new Matrix$1(this)));
          this._frameId = frameId++;
        }
      }
    }
  });
  extend$1(Runner$1, {
    attr: function attr(a, v) {
      return this.styleAttr('attr', a, v);
    },
    // Add animatable styles
    css: function css(s, v) {
      return this.styleAttr('css', s, v);
    },
    styleAttr: function styleAttr(type, name, val) {
      // apply attributes individually
      if (_typeof(name) === 'object') {
        for (var key in val) {
          this.styleAttr(type, key, val[key]);
        }
      }

      var morpher = new Morphable(this._stepper).to(val);
      this.queue(function () {
        morpher = morpher.from(this.element()[type](name));
      }, function (pos) {
        this.element()[type](name, morpher.at(pos));
        return morpher.done();
      });
      return this;
    },
    zoom: function zoom(level, point) {
      var morpher = new Morphable(this._stepper).to(new SVGNumber$1(level));
      this.queue(function () {
        morpher = morpher.from(this.zoom());
      }, function (pos) {
        this.element().zoom(morpher.at(pos), point);
        return morpher.done();
      });
      return this;
    },

    /**
     ** absolute transformations
     **/
    //
    // M v -----|-----(D M v = F v)------|----->  T v
    //
    // 1. define the final state (T) and decompose it (once)
    //    t = [tx, ty, the, lam, sy, sx]
    // 2. on every frame: pull the current state of all previous transforms
    //    (M - m can change)
    //   and then write this as m = [tx0, ty0, the0, lam0, sy0, sx0]
    // 3. Find the interpolated matrix F(pos) = m + pos * (t - m)
    //   - Note F(0) = M
    //   - Note F(1) = T
    // 4. Now you get the delta matrix as a result: D = F * inv(M)
    transform: function transform(transforms, relative, affine) {
      // If we have a declarative function, we should retarget it if possible
      relative = transforms.relative || relative;

      if (this._isDeclarative && !relative && this._tryRetarget('transform', transforms)) {
        return this;
      } // Parse the parameters


      var isMatrix = isMatrixLike(transforms);
      affine = transforms.affine != null ? transforms.affine : affine != null ? affine : !isMatrix; // Create a morepher and set its type

      var morpher = new Morphable().type(affine ? Morphable.TransformBag : Matrix$1).stepper(this._stepper);
      var origin;
      var element;
      var current;
      var currentAngle;
      var startTransform;

      function setup() {
        // make sure element and origin is defined
        element = element || this.element();
        origin = origin || getOrigin(transforms, element);
        startTransform = new Matrix$1(relative ? undefined : element); // add the runner to the element so it can merge transformations

        element.addRunner(this); // Deactivate all transforms that have run so far if we are absolute

        if (!relative) {
          element._clearTransformRunnersBefore(this);
        }
      }

      function run(pos) {
        // clear all other transforms before this in case something is saved
        // on this runner. We are absolute. We dont need these!
        if (!relative) this.clearTransform();

        var _transform = new Point$1(origin).transform(element._currentTransform(this)),
            x = _transform.x,
            y = _transform.y;

        var target = new Matrix$1(_objectSpread({}, transforms, {
          origin: [x, y]
        }));
        var start = this._isDeclarative && current ? current : startTransform;

        if (affine) {
          target = target.decompose(x, y);
          start = start.decompose(x, y); // Get the current and target angle as it was set

          var rTarget = target.rotate;
          var rCurrent = start.rotate; // Figure out the shortest path to rotate directly

          var possibilities = [rTarget - 360, rTarget, rTarget + 360];
          var distances = possibilities.map(function (a) {
            return Math.abs(a - rCurrent);
          });
          var shortest = Math.min.apply(Math, _toConsumableArray(distances));
          var index = distances.indexOf(shortest);
          target.rotate = possibilities[index];
        }

        if (relative) {
          // we have to be careful here not to overwrite the rotation
          // with the rotate method of Matrix
          if (!isMatrix) {
            target.rotate = transforms.rotate || 0;
          }

          if (this._isDeclarative && currentAngle) {
            start.rotate = currentAngle;
          }
        }

        morpher.from(start);
        morpher.to(target);
        var affineParameters = morpher.at(pos);
        currentAngle = affineParameters.rotate;
        current = new Matrix$1(affineParameters);
        this.addTransform(current);
        return morpher.done();
      }

      function retarget(newTransforms) {
        // only get a new origin if it changed since the last call
        if ((newTransforms.origin || 'center').toString() !== (transforms.origin || 'center').toString()) {
          origin = getOrigin(transforms, element);
        } // overwrite the old transformations with the new ones


        transforms = _objectSpread({}, newTransforms, {
          origin: origin
        });
      }

      this.queue(setup, run, retarget);
      this._isDeclarative && this._rememberMorpher('transform', morpher);
      return this;
    },
    // Animatable x-axis
    x: function x(_x, relative) {
      return this._queueNumber('x', _x);
    },
    // Animatable y-axis
    y: function y(_y) {
      return this._queueNumber('y', _y);
    },
    dx: function dx(x) {
      return this._queueNumberDelta('dx', x);
    },
    dy: function dy(y) {
      return this._queueNumberDelta('dy', y);
    },
    _queueNumberDelta: function _queueNumberDelta(method, to) {
      to = new SVGNumber$1(to); // Try to change the target if we have this method already registerd

      if (this._tryRetargetDelta(method, to)) return this; // Make a morpher and queue the animation

      var morpher = new Morphable(this._stepper).to(to);
      this.queue(function () {
        var from = this.element()[method]();
        morpher.from(from);
        morpher.to(from + to);
      }, function (pos) {
        this.element()[method](morpher.at(pos));
        return morpher.done();
      }); // Register the morpher so that if it is changed again, we can retarget it

      this._rememberMorpher(method, morpher);

      return this;
    },
    _queueObject: function _queueObject(method, to) {
      // Try to change the target if we have this method already registerd
      if (this._tryRetarget(method, to)) return this; // Make a morpher and queue the animation

      var morpher = new Morphable(this._stepper).to(to);
      this.queue(function () {
        morpher.from(this.element()[method]());
      }, function (pos) {
        this.element()[method](morpher.at(pos));
        return morpher.done();
      }); // Register the morpher so that if it is changed again, we can retarget it

      this._rememberMorpher(method, morpher);

      return this;
    },
    _queueNumber: function _queueNumber(method, value) {
      return this._queueObject(method, new SVGNumber$1(value));
    },
    // Animatable center x-axis
    cx: function cx(x) {
      return this._queueNumber('cx', x);
    },
    // Animatable center y-axis
    cy: function cy(y) {
      return this._queueNumber('cy', y);
    },
    // Add animatable move
    move: function move(x, y) {
      return this.x(x).y(y);
    },
    // Add animatable center
    center: function center(x, y) {
      return this.cx(x).cy(y);
    },
    // Add animatable size
    size: function size(width, height) {
      // animate bbox based size for all other elements
      var box;

      if (!width || !height) {
        box = this._element.bbox();
      }

      if (!width) {
        width = box.width / box.height * height;
      }

      if (!height) {
        height = box.height / box.width * width;
      }

      return this.width(width).height(height);
    },
    // Add animatable width
    width: function width(_width) {
      return this._queueNumber('width', _width);
    },
    // Add animatable height
    height: function height(_height) {
      return this._queueNumber('height', _height);
    },
    // Add animatable plot
    plot: function plot(a, b, c, d) {
      // Lines can be plotted with 4 arguments
      if (arguments.length === 4) {
        return this.plot([a, b, c, d]);
      } // FIXME: this needs to be rewritten such that the element is only accesed
      // in the init function


      return this._queueObject('plot', new this._element.MorphArray(a));
      /*
      var morpher = this._element.morphArray().to(a)
        this.queue(function () {
        morpher.from(this._element.array())
      }, function (pos) {
        this._element.plot(morpher.at(pos))
      })
        return this
      */
    },
    // Add leading method
    leading: function leading(value) {
      return this._queueNumber('leading', value);
    },
    // Add animatable viewbox
    viewbox: function viewbox(x, y, width, height) {
      return this._queueObject('viewbox', new Box(x, y, width, height));
    },
    update: function update(o) {
      if (_typeof(o) !== 'object') {
        return this.update({
          offset: arguments[0],
          color: arguments[1],
          opacity: arguments[2]
        });
      }

      if (o.opacity != null) this.attr('stop-opacity', o.opacity);
      if (o.color != null) this.attr('stop-color', o.color);
      if (o.offset != null) this.attr('offset', o.offset);
      return this;
    }
  });

  // export {default as SVGArray} from './SVGArray.js'
  // export {default as Bare} from './Bare.js'
  // export {default as Box} from './Box.js'
  // export {default as Circle} from './Circle.js'
  // export {default as ClipPath} from './ClipPath.js'
  // export {default as Color} from './Color.js'
  // export {default as Container} from './Container.js'
  // export {Controller, Ease, PID, Spring} from './Controller.js'
  // export {default as Defs} from './Defs.js'
  // export {default as Doc} from './Doc.js'
  // export {default as Element} from './Element.js'
  // export {default as Ellipse} from './Ellipse.js'
  // export {default as EventTarget} from './EventTarget.js'
  // export {default as Gradient} from './Gradient.js'
  // export {default as G} from './G.js'
  // export {default as HtmlNode} from './HtmlNode.js'
  // export {default as A} from './A.js'
  // export {default as Image} from './Image.js'
  // export {default as Line} from './Line.js'
  // export {default as Marker} from './Marker.js'
  // export {default as Mask} from './Mask.js'
  // export {default as Matrix} from './Matrix.js'
  // export {default as Morphable} from './Morphable.js'
  // export {default as SVGNumber} from './SVGNumber.js'
  // export {default as Parent} from './Parent.js'
  // export {default as Path} from './Path.js'
  // export {default as PathArray} from './PathArray.js'
  // export {default as Pattern} from './Pattern.js'
  // export {default as Point} from './Point.js'
  // export {default as PointArray} from './PointArray.js'
  // export {default as Polygon} from './Polygon.js'
  // export {default as Polyline} from './Polyline.js'
  // export {default as Queue} from './Queue.js'
  // export {default as Rect} from './Rect.js'
  // export {default as Runner} from './Runner.js'
  // export {default as Shape} from './Shape.js'
  // export {default as Stop} from './Stop.js'
  // export {default as Symbol} from './Symbol.js'
  // export {default as Text} from './Text.js'
  // export {default as TextPath} from './TextPath.js'
  // export {default as Timeline} from './Timeline.js'
  // export {default as Use} from './Use.js'

  var Classes = /*#__PURE__*/Object.freeze({
    HtmlNode: HtmlNode,
    Doc: Doc$1,
    Defs: Defs,
    G: G,
    Animator: Animator,
    Bare: Bare,
    Circle: Circle,
    ClipPath: ClipPath,
    A: A,
    Ellipse: Ellipse,
    Stop: Stop,
    Gradient: Gradient,
    Image: Image,
    Line: Line,
    Marker: Marker,
    Mask: Mask,
    Path: Path,
    Pattern: Pattern,
    Polygon: Polygon,
    Polyline: Polyline,
    Rect: Rect,
    Symbol: _Symbol,
    Text: Text$1,
    TextPath: TextPath,
    Tspan: Tspan,
    Use: Use,
    SVGNumber: SVGNumber$1,
    SVGArray: SVGArray,
    PathArray: PathArray,
    PointArray: PointArray$1,
    Matrix: Matrix$1,
    Point: Point$1,
    Box: Box$1,
    Color: Color,
    Morphable: Morphable,
    Queue: Queue,
    Runner: Runner$1,
    Timeline: Timeline,
    Controller: Controller,
    Ease: Ease,
    PID: PID,
    Spring: Spring
  });



  var containers = /*#__PURE__*/Object.freeze({
    Bare: Bare,
    ClipPath: ClipPath,
    Defs: Defs,
    Doc: Doc$1,
    Gradient: Gradient,
    G: G,
    A: A,
    Marker: Marker,
    Mask: Mask,
    Pattern: Pattern,
    Symbol: _Symbol
  });



  var elements$1 = /*#__PURE__*/Object.freeze({
    Bare: Bare,
    Circle: Circle,
    ClipPath: ClipPath,
    Defs: Defs,
    Doc: Doc$1,
    Ellipse: Ellipse,
    Gradient: Gradient,
    G: G,
    HtmlNode: HtmlNode,
    A: A,
    Image: Image,
    Line: Line,
    Marker: Marker,
    Mask: Mask,
    Path: Path,
    Pattern: Pattern,
    Polygon: Polygon,
    Polyline: Polyline,
    Rect: Rect,
    Stop: Stop,
    Symbol: _Symbol,
    Text: Text$1,
    TextPath: TextPath,
    Use: Use
  });

  // ### This module adds backward / forward functionality to elements.

  // Dynamic style generator

  function css(style, val) {
    var ret = {};

    if (arguments.length === 0) {
      // get full style as object
      this.node.style.cssText.split(/\s*;\s*/).filter(function (el) {
        return !!el.length;
      }).forEach(function (el) {
        var t = el.split(/\s*:\s*/);
        ret[t[0]] = t[1];
      });
      return ret;
    }

    if (arguments.length < 2) {
      // get style properties in the array
      if (Array.isArray(style)) {
        var _iteratorNormalCompletion = true;
        var _didIteratorError = false;
        var _iteratorError = undefined;

        try {
          for (var _iterator = style[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
            var _name = _step.value;
            var cased = camelCase(_name);
            ret[cased] = this.node.style(cased);
          }
        } catch (err) {
          _didIteratorError = true;
          _iteratorError = err;
        } finally {
          try {
            if (!_iteratorNormalCompletion && _iterator.return != null) {
              _iterator.return();
            }
          } finally {
            if (_didIteratorError) {
              throw _iteratorError;
            }
          }
        }

        return ret;
      } // get style for property


      if (typeof style === 'string') {
        return this.node.style[camelCase(style)];
      } // set styles in object


      if (_typeof(style) === 'object') {
        for (name in style) {
          // set empty string if null/undefined/'' was given
          this.node.style[camelCase(name)] = style[name] == null || isBlank.test(style[name]) ? '' : style[name];
        }
      }
    } // set style for property


    if (arguments.length === 2) {
      this.node.style[camelCase(style)] = val == null || isBlank.test(val) ? '' : val;
    }

    return this;
  } // Show element

  function show() {
    return this.css('display', '');
  } // Hide element

  function hide() {
    return this.css('display', 'none');
  } // Is element visible?

  function visible() {
    return this.css('display') !== 'none';
  }
  registerMethods('Element', {
    css: css,
    show: show,
    hide: hide,
    visible: visible
  });

  function untransform() {
    return this.attr('transform', null);
  } // merge the whole transformation chain into one matrix and returns it

  function matrixify() {
    var matrix = (this.attr('transform') || ''). // split transformations
    split(transforms).slice(0, -1).map(function (str) {
      // generate key => value pairs
      var kv = str.trim().split('(');
      return [kv[0], kv[1].split(delimiter).map(function (str) {
        return parseFloat(str);
      })];
    }).reverse() // merge every transformation into one matrix
    .reduce(function (matrix, transform) {
      if (transform[0] === 'matrix') {
        return matrix.lmultiply(arrayToMatrix(transform[1]));
      }

      return matrix[transform[0]].apply(matrix, transform[1]);
    }, new Matrix$1());
    return matrix;
  } // add an element to another parent without changing the visual representation on the screen

  function toParent(parent) {
    if (this === parent) return this;
    var ctm = this.screenCTM();
    var pCtm = parent.screenCTM().inverse();
    this.addTo(parent).untransform().transform(pCtm.multiply(ctm));
    return this;
  } // same as above with parent equals root-svg

  function toDoc() {
    return this.toParent(this.doc());
  } // Add transformations

  function transform(o, relative) {
    // Act as a getter if no object was passed
    if (o == null || typeof o === 'string') {
      var decomposed = new Matrix$1(this).decompose();
      return decomposed[o] || decomposed;
    }

    if (!isMatrixLike(o)) {
      // Set the origin according to the defined transform
      o = _objectSpread({}, o, {
        origin: getOrigin(o, this)
      });
    } // The user can pass a boolean, an Element or an Matrix or nothing


    var cleanRelative = relative === true ? this : relative || false;
    var result = new Matrix$1(cleanRelative).transform(o);
    return this.attr('transform', result);
  }
  registerMethods('Element', {
    untransform: untransform,
    matrixify: matrixify,
    toParent: toParent,
    toDoc: toDoc,
    transform: transform
  });

  function setup$1(node) {
    this._memory = {};
  } // Remember arbitrary data

  function remember(k, v) {
    // remember every item in an object individually
    if (_typeof(arguments[0]) === 'object') {
      for (var key in k) {
        this.remember(key, k[key]);
      }
    } else if (arguments.length === 1) {
      // retrieve memory
      return this.memory()[k];
    } else {
      // store memory
      this.memory()[k] = v;
    }

    return this;
  } // Erase a given memory

  function forget() {
    if (arguments.length === 0) {
      this._memory = {};
    } else {
      for (var i = arguments.length - 1; i >= 0; i--) {
        delete this.memory()[arguments[i]];
      }
    }

    return this;
  } // Initialize or return local memory object

  function memory() {
    return this._memory;
  }
  registerMethods('Element', {
    remember: remember,
    forget: forget,
    memory: memory
  });
  registerConstructor('Memory', setup$1);

  var sugar = {
    stroke: ['color', 'width', 'opacity', 'linecap', 'linejoin', 'miterlimit', 'dasharray', 'dashoffset'],
    fill: ['color', 'opacity', 'rule'],
    prefix: function prefix(t, a) {
      return a === 'color' ? t : t + '-' + a;
    } // Add sugar for fill and stroke

  };
  ['fill', 'stroke'].forEach(function (m) {
    var extension = {};
    var i;

    extension[m] = function (o) {
      if (typeof o === 'undefined') {
        return this;
      }

      if (typeof o === 'string' || Color.isRgb(o) || o && typeof o.fill === 'function') {
        this.attr(m, o);
      } else {
        // set all attributes from sugar.fill and sugar.stroke list
        for (i = sugar[m].length - 1; i >= 0; i--) {
          if (o[sugar[m][i]] != null) {
            this.attr(sugar.prefix(m, sugar[m][i]), o[sugar[m][i]]);
          }
        }
      }

      return this;
    };

    registerMethods(['Element', 'Runner'], extension);
  });
  registerMethods(['Element', 'Runner'], {
    // Let the user set the matrix directly
    matrix: function matrix(mat, b, c, d, e, f) {
      // Act as a getter
      if (mat == null) {
        return new Matrix(this);
      } // Act as a setter, the user can pass a matrix or a set of numbers


      return this.attr('transform', new Matrix(mat, b, c, d, e, f));
    },
    // Map rotation to transform
    rotate: function rotate(angle, cx, cy) {
      return this.transform({
        rotate: angle,
        ox: cx,
        oy: cy
      }, true);
    },
    // Map skew to transform
    skew: function skew(x, y, cx, cy) {
      return arguments.length === 1 || arguments.length === 3 ? this.transform({
        skew: x,
        ox: y,
        oy: cx
      }, true) : this.transform({
        skew: [x, y],
        ox: cx,
        oy: cy
      }, true);
    },
    shear: function shear(lam, cx, cy) {
      return this.transform({
        shear: lam,
        ox: cx,
        oy: cy
      }, true);
    },
    // Map scale to transform
    scale: function scale(x, y, cx, cy) {
      return arguments.length === 1 || arguments.length === 3 ? this.transform({
        scale: x,
        ox: y,
        oy: cx
      }, true) : this.transform({
        scale: [x, y],
        ox: cx,
        oy: cy
      }, true);
    },
    // Map translate to transform
    translate: function translate(x, y) {
      return this.transform({
        translate: [x, y]
      }, true);
    },
    // Map relative translations to transform
    relative: function relative(x, y) {
      return this.transform({
        relative: [x, y]
      }, true);
    },
    // Map flip to transform
    flip: function flip(direction, around) {
      var directionString = typeof direction === 'string' ? direction : isFinite(direction) ? 'both' : 'both';
      var origin = direction === 'both' && isFinite(around) ? [around, around] : direction === 'x' ? [around, 0] : direction === 'y' ? [0, around] : isFinite(direction) ? [direction, direction] : [0, 0];
      this.transform({
        flip: directionString,
        origin: origin
      }, true);
    },
    // Opacity
    opacity: function opacity(value) {
      return this.attr('opacity', value);
    },
    // Relative move over x axis
    dx: function dx(x) {
      return this.x(new SVGNumber(x).plus(this instanceof Runner ? 0 : this.x()), true);
    },
    // Relative move over y axis
    dy: function dy(y) {
      return this.y(new SVGNumber(y).plus(this instanceof Runner ? 0 : this.y()), true);
    },
    // Relative move over x and y axes
    dmove: function dmove(x, y) {
      return this.dx(x).dy(y);
    }
  });
  registerMethods('radius', {
    // Add x and y radius
    radius: function radius(x, y) {
      var type = (this._target || this).type;
      return type === 'radialGradient' || type === 'radialGradient' ? this.attr('r', new SVGNumber(x)) : this.rx(x).ry(y == null ? x : y);
    }
  });
  registerMethods('Path', {
    // Get path length
    length: function length() {
      return this.node.getTotalLength();
    },
    // Get point at length
    pointAt: function pointAt(length) {
      return new Point(this.node.getPointAtLength(length));
    }
  });
  registerMethods(['Container', 'Runner'], {
    // Set font
    font: function font(a, v) {
      if (_typeof(a) === 'object') {
        for (v in a) {
          this.font(v, a[v]);
        }
      }

      return a === 'leading' ? this.leading(v) : a === 'anchor' ? this.attr('text-anchor', v) : a === 'size' || a === 'family' || a === 'weight' || a === 'stretch' || a === 'variant' || a === 'style' ? this.attr('font-' + a, v) : this.attr(a, v);
    }
  });

  function setup$2() {
    var node = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
    this.events = node.events || {};
  } // Bind given event to listener

  function on$1(event, listener, binding, options) {
    on(this, event, listener, binding, options);

    return this;
  } // Unbind event from listener

  function off$1(event, listener) {
    off(this, event, listener);

    return this;
  }
  function dispatch$1(event, data) {
    return dispatch(this, event, data);
  } // Fire given event

  function fire(event, data) {
    this.dispatch(event, data);
    return this;
  }
  registerMethods('EventTarget', {
    setup: setup$2,
    on: on$1,
    off: off$1,
    dispatch: dispatch$1,
    fire: fire
  });
  registerConstructor('EventTarget', setup$2);

  function children() {
    return map(this.node.children, function (node) {
      return adopt$1(node);
    });
  } // Add given element at a position

  function add(element, i) {
    element = makeInstance(element);

    if (i == null) {
      this.node.appendChild(element.node);
    } else if (element.node !== this.node.childNodes[i]) {
      this.node.insertBefore(element.node, this.node.childNodes[i]);
    }

    return this;
  } // Basically does the same as `add()` but returns the added element instead

  function put(element, i) {
    this.add(element, i);
    return element.instance || element;
  } // Checks if the given element is a child

  function has(element) {
    return this.index(element) >= 0;
  } // Gets index of given element

  function index(element) {
    return [].slice.call(this.node.children).indexOf(element.node);
  } // Get a element at the given index

  function get$1(i) {
    return adopt$1(this.node.children[i]);
  } // Get first child

  function first() {
    return this.get(0);
  } // Get the last child

  function last() {
    return this.get(this.node.children.length - 1);
  } // Iterates over all children and invokes a given block

  function each(block, deep) {
    var children = this.children();
    var i, il;

    for (i = 0, il = children.length; i < il; i++) {
      if (children[i] instanceof Base) {
        block.apply(children[i], [i, children]);
      }

      if (deep && children[i] instanceof Base && children[i].is('Parent')) {
        children[i].each(block, deep);
      }
    }

    return this;
  } // Remove a given child

  function removeElement(element) {
    this.node.removeChild(element.node);
    return this;
  } // Remove all elements in this container

  function clear$1() {
    // remove children
    while (this.node.hasChildNodes()) {
      this.node.removeChild(this.node.lastChild);
    } // remove defs reference


    delete this._defs;
    return this;
  } // Import raw svg

  function svg$1(svg) {
    var well, len; // act as a setter if svg is given

    if (svg) {
      // create temporary holder
      well = document.createElementNS(ns, 'svg'); // dump raw svg

      well.innerHTML = svg; // transplant nodes

      for (len = well.children.length; len--;) {
        this.node.appendChild(well.firstElementChild);
      } // otherwise act as a getter

    } else {
      // write svgjs data to the dom
      this.writeDataToDom();
      return this.node.outerHTML;
    }

    return this;
  } // write svgjs data to the dom

  function writeDataToDom$1() {
    // dump variables recursively
    this.each(function () {
      this.writeDataToDom();
    }); // remove previously set data

    this.node.removeAttribute('svgjs:data');

    if (Object.keys(this.dom).length) {
      this.node.setAttribute('svgjs:data', JSON.stringify(this.dom)); // see #428
    }

    return this;
  }
  function flatten(parent) {
    this.each(function () {
      if (this.is('Parent')) return this.flatten(parent).ungroup(parent);
      return this.toParent(parent);
    }); // we need this so that Doc does not get removed

    this.node.firstElementChild || this.remove();
    return this;
  }
  function ungroup(parent) {
    parent = parent || this.parent();
    this.each(function () {
      return this.toParent(parent);
    });
    this.remove();
    return this;
  }
  registerMethods('Container', {
    children: children,
    add: add,
    put: put,
    has: has,
    index: index,
    get: get$1,
    first: first,
    last: last,
    each: each,
    removeElement: removeElement,
    clear: clear$1,
    svg: svg$1,
    writeDataToDom: writeDataToDom$1,
    flatten: flatten,
    ungroup: ungroup
  });

  // import {extend} from './tools.js'
  var extend$2 = extend$1;
  extend$2([Doc$1, _Symbol, Image, Pattern, Marker], getMethodsFor('viewbox'));
  extend$2([Line, Polyline, Polygon, Path], getMethodsFor('marker'));
  extend$2(Text$1, getMethodsFor('Text'));
  extend$2(Path, getMethodsFor('Path'));
  extend$2(Defs, getMethodsFor('Defs'));
  extend$2([Text$1, Tspan], getMethodsFor('Tspan'));
  extend$2([Rect, Ellipse, Circle, Gradient], getMethodsFor('radius'));
  var containerMethods = getMethodsFor('Container'); // FIXME: We need a container array

  for (var i$1 in containers) {
    extend$2(containers[i$1], containerMethods);
  }

  var elementMethods = getMethodsFor('Element');

  for (var _i in elements$1) {
    extend$2(elements$1[_i], elementMethods);
    extend$2(elements$1[_i], getConstructor('EventTarget'));
    extend$2(elements$1[_i], getConstructor('Element'));
    extend$2(elements$1[_i], getConstructor('Memory'));
  } // The main wrapping element


  function SVG(element) {
    return makeInstance(element);
  }
  Object.assign(SVG, Classes);
  Object.assign(SVG, tools);
  Object.assign(SVG, adopter);

  return SVG;

}());