svelte-plots-basic 1.0.0

package/dist/index.mjs

@@ -0,0 +1,4047 @@
+function noop() { }
+function assign(tar, src) {
+    // @ts-ignore
+    for (const k in src)
+        tar[k] = src[k];
+    return tar;
+}
+function run(fn) {
+    return fn();
+}
+function blank_object() {
+    return Object.create(null);
+}
+function run_all(fns) {
+    fns.forEach(run);
+}
+function is_function(thing) {
+    return typeof thing === 'function';
+}
+function safe_not_equal(a, b) {
+    return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function');
+}
+function is_empty(obj) {
+    return Object.keys(obj).length === 0;
+}
+function subscribe(store, ...callbacks) {
+    if (store == null) {
+        return noop;
+    }
+    const unsub = store.subscribe(...callbacks);
+    return unsub.unsubscribe ? () => unsub.unsubscribe() : unsub;
+}
+function component_subscribe(component, store, callback) {
+    component.$$.on_destroy.push(subscribe(store, callback));
+}
+function create_slot(definition, ctx, $$scope, fn) {
+    if (definition) {
+        const slot_ctx = get_slot_context(definition, ctx, $$scope, fn);
+        return definition[0](slot_ctx);
+    }
+}
+function get_slot_context(definition, ctx, $$scope, fn) {
+    return definition[1] && fn
+        ? assign($$scope.ctx.slice(), definition[1](fn(ctx)))
+        : $$scope.ctx;
+}
+function get_slot_changes(definition, $$scope, dirty, fn) {
+    if (definition[2] && fn) {
+        const lets = definition[2](fn(dirty));
+        if ($$scope.dirty === undefined) {
+            return lets;
+        }
+        if (typeof lets === 'object') {
+            const merged = [];
+            const len = Math.max($$scope.dirty.length, lets.length);
+            for (let i = 0; i < len; i += 1) {
+                merged[i] = $$scope.dirty[i] | lets[i];
+            }
+            return merged;
+        }
+        return $$scope.dirty | lets;
+    }
+    return $$scope.dirty;
+}
+function update_slot_base(slot, slot_definition, ctx, $$scope, slot_changes, get_slot_context_fn) {
+    if (slot_changes) {
+        const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
+        slot.p(slot_context, slot_changes);
+    }
+}
+function get_all_dirty_from_scope($$scope) {
+    if ($$scope.ctx.length > 32) {
+        const dirty = [];
+        const length = $$scope.ctx.length / 32;
+        for (let i = 0; i < length; i++) {
+            dirty[i] = -1;
+        }
+        return dirty;
+    }
+    return -1;
+}
+function append(target, node) {
+    target.appendChild(node);
+}
+function append_styles(target, style_sheet_id, styles) {
+    const append_styles_to = get_root_for_style(target);
+    if (!append_styles_to.getElementById(style_sheet_id)) {
+        const style = element('style');
+        style.id = style_sheet_id;
+        style.textContent = styles;
+        append_stylesheet(append_styles_to, style);
+    }
+}
+function get_root_for_style(node) {
+    if (!node)
+        return document;
+    const root = node.getRootNode ? node.getRootNode() : node.ownerDocument;
+    if (root && root.host) {
+        return root;
+    }
+    return node.ownerDocument;
+}
+function append_stylesheet(node, style) {
+    append(node.head || node, style);
+}
+function insert(target, node, anchor) {
+    target.insertBefore(node, anchor || null);
+}
+function detach(node) {
+    node.parentNode.removeChild(node);
+}
+function destroy_each(iterations, detaching) {
+    for (let i = 0; i < iterations.length; i += 1) {
+        if (iterations[i])
+            iterations[i].d(detaching);
+    }
+}
+function element(name) {
+    return document.createElement(name);
+}
+function svg_element(name) {
+    return document.createElementNS('http://www.w3.org/2000/svg', name);
+}
+function text(data) {
+    return document.createTextNode(data);
+}
+function space() {
+    return text(' ');
+}
+function empty() {
+    return text('');
+}
+function attr(node, attribute, value) {
+    if (value == null)
+        node.removeAttribute(attribute);
+    else if (node.getAttribute(attribute) !== value)
+        node.setAttribute(attribute, value);
+}
+function children(element) {
+    return Array.from(element.childNodes);
+}
+function set_data(text, data) {
+    data = '' + data;
+    if (text.wholeText !== data)
+        text.data = data;
+}
+function set_style(node, key, value, important) {
+    if (value === null) {
+        node.style.removeProperty(key);
+    }
+    else {
+        node.style.setProperty(key, value, important ? 'important' : '');
+    }
+}
+function toggle_class(element, name, toggle) {
+    element.classList[toggle ? 'add' : 'remove'](name);
+}
+
+let current_component;
+function set_current_component(component) {
+    current_component = component;
+}
+function get_current_component() {
+    if (!current_component)
+        throw new Error('Function called outside component initialization');
+    return current_component;
+}
+function onMount(fn) {
+    get_current_component().$$.on_mount.push(fn);
+}
+function setContext(key, context) {
+    get_current_component().$$.context.set(key, context);
+}
+function getContext(key) {
+    return get_current_component().$$.context.get(key);
+}
+
+const dirty_components = [];
+const binding_callbacks = [];
+const render_callbacks = [];
+const flush_callbacks = [];
+const resolved_promise = Promise.resolve();
+let update_scheduled = false;
+function schedule_update() {
+    if (!update_scheduled) {
+        update_scheduled = true;
+        resolved_promise.then(flush);
+    }
+}
+function add_render_callback(fn) {
+    render_callbacks.push(fn);
+}
+// flush() calls callbacks in this order:
+// 1. All beforeUpdate callbacks, in order: parents before children
+// 2. All bind:this callbacks, in reverse order: children before parents.
+// 3. All afterUpdate callbacks, in order: parents before children. EXCEPT
+//    for afterUpdates called during the initial onMount, which are called in
+//    reverse order: children before parents.
+// Since callbacks might update component values, which could trigger another
+// call to flush(), the following steps guard against this:
+// 1. During beforeUpdate, any updated components will be added to the
+//    dirty_components array and will cause a reentrant call to flush(). Because
+//    the flush index is kept outside the function, the reentrant call will pick
+//    up where the earlier call left off and go through all dirty components. The
+//    current_component value is saved and restored so that the reentrant call will
+//    not interfere with the "parent" flush() call.
+// 2. bind:this callbacks cannot trigger new flush() calls.
+// 3. During afterUpdate, any updated components will NOT have their afterUpdate
+//    callback called a second time; the seen_callbacks set, outside the flush()
+//    function, guarantees this behavior.
+const seen_callbacks = new Set();
+let flushidx = 0; // Do *not* move this inside the flush() function
+function flush() {
+    const saved_component = current_component;
+    do {
+        // first, call beforeUpdate functions
+        // and update components
+        while (flushidx < dirty_components.length) {
+            const component = dirty_components[flushidx];
+            flushidx++;
+            set_current_component(component);
+            update(component.$$);
+        }
+        set_current_component(null);
+        dirty_components.length = 0;
+        flushidx = 0;
+        while (binding_callbacks.length)
+            binding_callbacks.pop()();
+        // then, once components are updated, call
+        // afterUpdate functions. This may cause
+        // subsequent updates...
+        for (let i = 0; i < render_callbacks.length; i += 1) {
+            const callback = render_callbacks[i];
+            if (!seen_callbacks.has(callback)) {
+                // ...so guard against infinite loops
+                seen_callbacks.add(callback);
+                callback();
+            }
+        }
+        render_callbacks.length = 0;
+    } while (dirty_components.length);
+    while (flush_callbacks.length) {
+        flush_callbacks.pop()();
+    }
+    update_scheduled = false;
+    seen_callbacks.clear();
+    set_current_component(saved_component);
+}
+function update($$) {
+    if ($$.fragment !== null) {
+        $$.update();
+        run_all($$.before_update);
+        const dirty = $$.dirty;
+        $$.dirty = [-1];
+        $$.fragment && $$.fragment.p($$.ctx, dirty);
+        $$.after_update.forEach(add_render_callback);
+    }
+}
+const outroing = new Set();
+let outros;
+function group_outros() {
+    outros = {
+        r: 0,
+        c: [],
+        p: outros // parent group
+    };
+}
+function check_outros() {
+    if (!outros.r) {
+        run_all(outros.c);
+    }
+    outros = outros.p;
+}
+function transition_in(block, local) {
+    if (block && block.i) {
+        outroing.delete(block);
+        block.i(local);
+    }
+}
+function transition_out(block, local, detach, callback) {
+    if (block && block.o) {
+        if (outroing.has(block))
+            return;
+        outroing.add(block);
+        outros.c.push(() => {
+            outroing.delete(block);
+            if (callback) {
+                if (detach)
+                    block.d(1);
+                callback();
+            }
+        });
+        block.o(local);
+    }
+}
+function create_component(block) {
+    block && block.c();
+}
+function mount_component(component, target, anchor, customElement) {
+    const { fragment, on_mount, on_destroy, after_update } = component.$$;
+    fragment && fragment.m(target, anchor);
+    if (!customElement) {
+        // onMount happens before the initial afterUpdate
+        add_render_callback(() => {
+            const new_on_destroy = on_mount.map(run).filter(is_function);
+            if (on_destroy) {
+                on_destroy.push(...new_on_destroy);
+            }
+            else {
+                // Edge case - component was destroyed immediately,
+                // most likely as a result of a binding initialising
+                run_all(new_on_destroy);
+            }
+            component.$$.on_mount = [];
+        });
+    }
+    after_update.forEach(add_render_callback);
+}
+function destroy_component(component, detaching) {
+    const $$ = component.$$;
+    if ($$.fragment !== null) {
+        run_all($$.on_destroy);
+        $$.fragment && $$.fragment.d(detaching);
+        // TODO null out other refs, including component.$$ (but need to
+        // preserve final state?)
+        $$.on_destroy = $$.fragment = null;
+        $$.ctx = [];
+    }
+}
+function make_dirty(component, i) {
+    if (component.$$.dirty[0] === -1) {
+        dirty_components.push(component);
+        schedule_update();
+        component.$$.dirty.fill(0);
+    }
+    component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
+}
+function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
+    const parent_component = current_component;
+    set_current_component(component);
+    const $$ = component.$$ = {
+        fragment: null,
+        ctx: null,
+        // state
+        props,
+        update: noop,
+        not_equal,
+        bound: blank_object(),
+        // lifecycle
+        on_mount: [],
+        on_destroy: [],
+        on_disconnect: [],
+        before_update: [],
+        after_update: [],
+        context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
+        // everything else
+        callbacks: blank_object(),
+        dirty,
+        skip_bound: false,
+        root: options.target || parent_component.$$.root
+    };
+    append_styles && append_styles($$.root);
+    let ready = false;
+    $$.ctx = instance
+        ? instance(component, options.props || {}, (i, ret, ...rest) => {
+            const value = rest.length ? rest[0] : ret;
+            if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) {
+                if (!$$.skip_bound && $$.bound[i])
+                    $$.bound[i](value);
+                if (ready)
+                    make_dirty(component, i);
+            }
+            return ret;
+        })
+        : [];
+    $$.update();
+    ready = true;
+    run_all($$.before_update);
+    // `false` as a special case of no DOM component
+    $$.fragment = create_fragment ? create_fragment($$.ctx) : false;
+    if (options.target) {
+        if (options.hydrate) {
+            const nodes = children(options.target);
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            $$.fragment && $$.fragment.l(nodes);
+            nodes.forEach(detach);
+        }
+        else {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            $$.fragment && $$.fragment.c();
+        }
+        if (options.intro)
+            transition_in(component.$$.fragment);
+        mount_component(component, options.target, options.anchor, options.customElement);
+        flush();
+    }
+    set_current_component(parent_component);
+}
+/**
+ * Base class for Svelte components. Used when dev=false.
+ */
+class SvelteComponent {
+    $destroy() {
+        destroy_component(this, 1);
+        this.$destroy = noop;
+    }
+    $on(type, callback) {
+        const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
+        callbacks.push(callback);
+        return () => {
+            const index = callbacks.indexOf(callback);
+            if (index !== -1)
+                callbacks.splice(index, 1);
+        };
+    }
+    $set($$props) {
+        if (this.$$set && !is_empty($$props)) {
+            this.$$.skip_bound = true;
+            this.$$set($$props);
+            this.$$.skip_bound = false;
+        }
+    }
+}
+
+const subscriber_queue = [];
+/**
+ * Create a `Writable` store that allows both updating and reading by subscription.
+ * @param {*=}value initial value
+ * @param {StartStopNotifier=}start start and stop notifications for subscriptions
+ */
+function writable(value, start = noop) {
+    let stop;
+    const subscribers = new Set();
+    function set(new_value) {
+        if (safe_not_equal(value, new_value)) {
+            value = new_value;
+            if (stop) { // store is ready
+                const run_queue = !subscriber_queue.length;
+                for (const subscriber of subscribers) {
+                    subscriber[1]();
+                    subscriber_queue.push(subscriber, value);
+                }
+                if (run_queue) {
+                    for (let i = 0; i < subscriber_queue.length; i += 2) {
+                        subscriber_queue[i][0](subscriber_queue[i + 1]);
+                    }
+                    subscriber_queue.length = 0;
+                }
+            }
+        }
+    }
+    function update(fn) {
+        set(fn(value));
+    }
+    function subscribe(run, invalidate = noop) {
+        const subscriber = [run, invalidate];
+        subscribers.add(subscriber);
+        if (subscribers.size === 1) {
+            stop = start(set) || noop;
+        }
+        run(value);
+        return () => {
+            subscribers.delete(subscriber);
+            if (subscribers.size === 0) {
+                stop();
+                stop = null;
+            }
+        };
+    }
+    return { set, update, subscribe };
+}
+
+/* src/Axes.svelte generated by Svelte v3.46.3 */
+
+function add_css$2(target) {
+	append_styles(target, "svelte-vuzab", ".plot{font-family:Arial, Helvetica, sans-serif;display:grid;grid-template-columns:min-content 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:\". title\"\n         \"ylab axes\"\n         \". xlab\";box-sizing:border-box;background:#fefefe;min-width:100px;min-height:50px;width:100%;height:100%;padding:0;margin:0}.plot_small{font-size:11px}.plot_medium{font-size:13px}.plot_large{font-size:16px}.plot_error{display:flex}.plot_error > .axes-wrapper{display:none}.message_error{font-size:1.2em;color:crimson;padding:20px;text-align:center}.axes-wrapper{grid-area:axes;position:relative;box-sizing:border-box;display:flex;padding:0;margin:0}.axes{display:block;box-sizing:border-box;position:absolute;padding:0;margin:0;height:100%;width:100%;max-height:100%;max-width:100%;min-height:100%;min-width:100%}.axes__xlabel{grid-area:xlab;font-size:1.0em;font-weight:600;padding:0.25em;text-align:center}.axes__ylabel{grid-area:ylab;font-size:1.0em;font-weight:600;padding:0.25em;text-align:center;vertical-align:middle;display:flex}.axes__ylabel > span{width:1.5em;line-height:1.5em;display:inline-block;writing-mode:vertical-rl;transform:rotate(180deg)}.axes__title{background:transparent;grid-area:title;font-size:1.3em;font-weight:bold;line-height:1.2em;padding:0.5em 0;text-align:center}.axis-labels{fill:#303030;font-size:0.95em}.labels{fill:#606060;font-size:0.90em}.labels{visibility:hidden;transition:visibility 0.25s linear, opacity 0.25s linear;opacity:0}");
+}
+
+const get_box_slot_changes = dirty => ({});
+const get_box_slot_context = ctx => ({});
+const get_yaxis_slot_changes = dirty => ({});
+const get_yaxis_slot_context = ctx => ({});
+const get_xaxis_slot_changes = dirty => ({});
+const get_xaxis_slot_context = ctx => ({});
+
+// (311:3) {#if title !== ""}
+function create_if_block_3(ctx) {
+	let div;
+
+	return {
+		c() {
+			div = element("div");
+			attr(div, "class", "axes__title");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			div.innerHTML = /*title*/ ctx[0];
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*title*/ 1) div.innerHTML = /*title*/ ctx[0];		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (312:3) {#if yLabel !== ""}
+function create_if_block_2(ctx) {
+	let div;
+	let span;
+
+	return {
+		c() {
+			div = element("div");
+			span = element("span");
+			attr(div, "class", "axes__ylabel");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, span);
+			span.innerHTML = /*yLabel*/ ctx[2];
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*yLabel*/ 4) span.innerHTML = /*yLabel*/ ctx[2];		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (313:3) {#if xLabel !== ""}
+function create_if_block_1(ctx) {
+	let div;
+	let span;
+
+	return {
+		c() {
+			div = element("div");
+			span = element("span");
+			attr(div, "class", "axes__xlabel");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, span);
+			span.innerHTML = /*xLabel*/ ctx[1];
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*xLabel*/ 2) span.innerHTML = /*xLabel*/ ctx[1];		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (341:3) {#if !$isOk}
+function create_if_block$9(ctx) {
+	let p;
+
+	return {
+		c() {
+			p = element("p");
+
+			p.innerHTML = `Axes component was not properly initialized. <br/>
+      Add plot series (check that coordinates are numeric) or define axes limits manually.`;
+
+			attr(p, "class", "message_error");
+		},
+		m(target, anchor) {
+			insert(target, p, anchor);
+		},
+		d(detaching) {
+			if (detaching) detach(p);
+		}
+	};
+}
+
+function create_fragment$b(ctx) {
+	let div1;
+	let t0;
+	let t1;
+	let t2;
+	let div0;
+	let svg;
+	let defs;
+	let clipPath;
+	let rect;
+	let rect_x_value;
+	let rect_y_value;
+	let rect_width_value;
+	let rect_height_value;
+	let g;
+	let t3;
+	let div1_class_value;
+	let current;
+	let if_block0 = /*title*/ ctx[0] !== "" && create_if_block_3(ctx);
+	let if_block1 = /*yLabel*/ ctx[2] !== "" && create_if_block_2(ctx);
+	let if_block2 = /*xLabel*/ ctx[1] !== "" && create_if_block_1(ctx);
+	const xaxis_slot_template = /*#slots*/ ctx[24].xaxis;
+	const xaxis_slot = create_slot(xaxis_slot_template, ctx, /*$$scope*/ ctx[23], get_xaxis_slot_context);
+	const yaxis_slot_template = /*#slots*/ ctx[24].yaxis;
+	const yaxis_slot = create_slot(yaxis_slot_template, ctx, /*$$scope*/ ctx[23], get_yaxis_slot_context);
+	const default_slot_template = /*#slots*/ ctx[24].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[23], null);
+	const box_slot_template = /*#slots*/ ctx[24].box;
+	const box_slot = create_slot(box_slot_template, ctx, /*$$scope*/ ctx[23], get_box_slot_context);
+	let if_block3 = !/*$isOk*/ ctx[3] && create_if_block$9();
+
+	return {
+		c() {
+			div1 = element("div");
+			if (if_block0) if_block0.c();
+			t0 = space();
+			if (if_block1) if_block1.c();
+			t1 = space();
+			if (if_block2) if_block2.c();
+			t2 = space();
+			div0 = element("div");
+			svg = svg_element("svg");
+			defs = svg_element("defs");
+			clipPath = svg_element("clipPath");
+			rect = svg_element("rect");
+			if (xaxis_slot) xaxis_slot.c();
+			if (yaxis_slot) yaxis_slot.c();
+			g = svg_element("g");
+			if (default_slot) default_slot.c();
+			if (box_slot) box_slot.c();
+			t3 = space();
+			if (if_block3) if_block3.c();
+			attr(rect, "x", rect_x_value = /*cpx*/ ctx[7][0]);
+			attr(rect, "y", rect_y_value = /*cpy*/ ctx[6][1]);
+			attr(rect, "width", rect_width_value = /*cpx*/ ctx[7][1] - /*cpx*/ ctx[7][0]);
+			attr(rect, "height", rect_height_value = /*cpy*/ ctx[6][0] - /*cpy*/ ctx[6][1]);
+			attr(clipPath, "id", /*clipPathID*/ ctx[8]);
+			attr(g, "clip-path", "url(#" + /*clipPathID*/ ctx[8] + ")");
+			attr(svg, "preserveAspectRatio", "none");
+			attr(svg, "class", "axes");
+			attr(div0, "class", "axes-wrapper");
+			attr(div1, "class", div1_class_value = "plot " + ('plot_' + /*$scale*/ ctx[4]));
+			toggle_class(div1, "plot_error", !/*$isOk*/ ctx[3]);
+		},
+		m(target, anchor) {
+			insert(target, div1, anchor);
+			if (if_block0) if_block0.m(div1, null);
+			append(div1, t0);
+			if (if_block1) if_block1.m(div1, null);
+			append(div1, t1);
+			if (if_block2) if_block2.m(div1, null);
+			append(div1, t2);
+			append(div1, div0);
+			append(div0, svg);
+			append(svg, defs);
+			append(defs, clipPath);
+			append(clipPath, rect);
+
+			if (xaxis_slot) {
+				xaxis_slot.m(svg, null);
+			}
+
+			if (yaxis_slot) {
+				yaxis_slot.m(svg, null);
+			}
+
+			append(svg, g);
+
+			if (default_slot) {
+				default_slot.m(g, null);
+			}
+
+			if (box_slot) {
+				box_slot.m(svg, null);
+			}
+
+			/*div0_binding*/ ctx[25](div0);
+			append(div1, t3);
+			if (if_block3) if_block3.m(div1, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			if (/*title*/ ctx[0] !== "") {
+				if (if_block0) {
+					if_block0.p(ctx, dirty);
+				} else {
+					if_block0 = create_if_block_3(ctx);
+					if_block0.c();
+					if_block0.m(div1, t0);
+				}
+			} else if (if_block0) {
+				if_block0.d(1);
+				if_block0 = null;
+			}
+
+			if (/*yLabel*/ ctx[2] !== "") {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_2(ctx);
+					if_block1.c();
+					if_block1.m(div1, t1);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+
+			if (/*xLabel*/ ctx[1] !== "") {
+				if (if_block2) {
+					if_block2.p(ctx, dirty);
+				} else {
+					if_block2 = create_if_block_1(ctx);
+					if_block2.c();
+					if_block2.m(div1, t2);
+				}
+			} else if (if_block2) {
+				if_block2.d(1);
+				if_block2 = null;
+			}
+
+			if (!current || dirty[0] & /*cpx*/ 128 && rect_x_value !== (rect_x_value = /*cpx*/ ctx[7][0])) {
+				attr(rect, "x", rect_x_value);
+			}
+
+			if (!current || dirty[0] & /*cpy*/ 64 && rect_y_value !== (rect_y_value = /*cpy*/ ctx[6][1])) {
+				attr(rect, "y", rect_y_value);
+			}
+
+			if (!current || dirty[0] & /*cpx*/ 128 && rect_width_value !== (rect_width_value = /*cpx*/ ctx[7][1] - /*cpx*/ ctx[7][0])) {
+				attr(rect, "width", rect_width_value);
+			}
+
+			if (!current || dirty[0] & /*cpy*/ 64 && rect_height_value !== (rect_height_value = /*cpy*/ ctx[6][0] - /*cpy*/ ctx[6][1])) {
+				attr(rect, "height", rect_height_value);
+			}
+
+			if (xaxis_slot) {
+				if (xaxis_slot.p && (!current || dirty[0] & /*$$scope*/ 8388608)) {
+					update_slot_base(
+						xaxis_slot,
+						xaxis_slot_template,
+						ctx,
+						/*$$scope*/ ctx[23],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(xaxis_slot_template, /*$$scope*/ ctx[23], dirty, get_xaxis_slot_changes),
+						get_xaxis_slot_context
+					);
+				}
+			}
+
+			if (yaxis_slot) {
+				if (yaxis_slot.p && (!current || dirty[0] & /*$$scope*/ 8388608)) {
+					update_slot_base(
+						yaxis_slot,
+						yaxis_slot_template,
+						ctx,
+						/*$$scope*/ ctx[23],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(yaxis_slot_template, /*$$scope*/ ctx[23], dirty, get_yaxis_slot_changes),
+						get_yaxis_slot_context
+					);
+				}
+			}
+
+			if (default_slot) {
+				if (default_slot.p && (!current || dirty[0] & /*$$scope*/ 8388608)) {
+					update_slot_base(
+						default_slot,
+						default_slot_template,
+						ctx,
+						/*$$scope*/ ctx[23],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[23], dirty, null),
+						null
+					);
+				}
+			}
+
+			if (box_slot) {
+				if (box_slot.p && (!current || dirty[0] & /*$$scope*/ 8388608)) {
+					update_slot_base(
+						box_slot,
+						box_slot_template,
+						ctx,
+						/*$$scope*/ ctx[23],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(box_slot_template, /*$$scope*/ ctx[23], dirty, get_box_slot_changes),
+						get_box_slot_context
+					);
+				}
+			}
+
+			if (!/*$isOk*/ ctx[3]) {
+				if (if_block3) ; else {
+					if_block3 = create_if_block$9();
+					if_block3.c();
+					if_block3.m(div1, null);
+				}
+			} else if (if_block3) {
+				if_block3.d(1);
+				if_block3 = null;
+			}
+
+			if (!current || dirty[0] & /*$scale*/ 16 && div1_class_value !== (div1_class_value = "plot " + ('plot_' + /*$scale*/ ctx[4]))) {
+				attr(div1, "class", div1_class_value);
+			}
+
+			if (dirty[0] & /*$scale, $isOk*/ 24) {
+				toggle_class(div1, "plot_error", !/*$isOk*/ ctx[3]);
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(xaxis_slot, local);
+			transition_in(yaxis_slot, local);
+			transition_in(default_slot, local);
+			transition_in(box_slot, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(xaxis_slot, local);
+			transition_out(yaxis_slot, local);
+			transition_out(default_slot, local);
+			transition_out(box_slot, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div1);
+			if (if_block0) if_block0.d();
+			if (if_block1) if_block1.d();
+			if (if_block2) if_block2.d();
+			if (xaxis_slot) xaxis_slot.d(detaching);
+			if (yaxis_slot) yaxis_slot.d(detaching);
+			if (default_slot) default_slot.d(detaching);
+			if (box_slot) box_slot.d(detaching);
+			/*div0_binding*/ ctx[25](null);
+			if (if_block3) if_block3.d();
+		}
+	};
+}
+
+function niceNum(localRange, round) {
+	const exponent = Math.floor(Math.log10(localRange));
+	const fraction = localRange / Math.pow(10, exponent);
+	let niceFraction;
+
+	if (round) {
+		if (fraction < 1.5) niceFraction = 1; else if (fraction < 3) niceFraction = 2; else if (fraction < 7) niceFraction = 5; else niceFraction = 10;
+	} else {
+		if (fraction <= 1) niceFraction = 1; else if (fraction <= 2) niceFraction = 2; else if (fraction <= 5) niceFraction = 5; else niceFraction = 10;
+	}
+
+	return niceFraction * Math.pow(10, exponent);
+}
+
+/** Computes a scale level
+ * @param {numeric} width - width of plotting area in pixels
+ * @param {numeric} height - height of plotting area in pixels
+ * @returns {text} the scale level ("small", "medium" or "large")
+ */
+function getScale(width, height) {
+	if (height < 300.2 || width < 300.2) return "small";
+	if (height < 600.2 || width < 600.2) return "medium";
+	return "large";
+}
+
+function instance$b($$self, $$props, $$invalidate) {
+	let margins;
+	let cpx;
+	let cpy;
+	let $height;
+	let $yLim;
+	let $isOk;
+	let $width;
+	let $xLim;
+	let $scale;
+	let { $$slots: slots = {}, $$scope } = $$props;
+	let { limX = [undefined, undefined] } = $$props;
+	let { limY = [undefined, undefined] } = $$props;
+	let { title = "" } = $$props;
+	let { xLabel = "" } = $$props;
+	let { yLabel = "" } = $$props;
+	let { multiSeries = true } = $$props;
+
+	/* constants for internal use */
+	// how big are margins (number of pixels in unit margin value) between axis and plot area if axis are shown
+	const AXES_MARGIN_FACTORS = { "small": 30, "medium": 40, "large": 50 };
+
+	// number of ticks along each axis
+	const TICK_NUM = { "small": 5, "medium": 8, "large": 12 };
+
+	// margin between plot series elements and data labels
+	const LABELS_MARGIN = { "small": 10, "medium": 15, "large": 20 };
+
+	// line styles for different scales and types
+	const LINE_STYLES = {
+		small: ["0", "3,3", "1,1", "3,1"],
+		medium: ["0", "5,5", "2,2", "5,2"],
+		large: ["0", "7,7", "3,3", "7,3"]
+	};
+
+	// constant to make clip path ID unique
+	const clipPathID = "plottingArea" + Math.round(Math.random() * 10000);
+
+	/* parameters for internal use inside the component */
+	let axesWrapper; // pointer to axes wrapper DOM element
+
+	let axesMargins = [0.034, 0.034, 0.034, 0.034]; // initial margins (will be multiplied to FACTORS)
+
+	/* reactive parameters to be shared with children via context */
+	const width = writable(100); // actual width of plotting area in pixels
+
+	component_subscribe($$self, width, value => $$invalidate(21, $width = value));
+	const height = writable(100); // actual height of plotting area in pixels
+	component_subscribe($$self, height, value => $$invalidate(19, $height = value));
+	const xLim = writable([undefined, undefined]); // actual limits for x-axis in plot units
+	component_subscribe($$self, xLim, value => $$invalidate(22, $xLim = value));
+	const yLim = writable([undefined, undefined]); // actual limits for y-axis in plot units
+	component_subscribe($$self, yLim, value => $$invalidate(20, $yLim = value));
+	const scale = writable("medium"); // scale factor (how big the shown plot is)
+	component_subscribe($$self, scale, value => $$invalidate(4, $scale = value));
+	const isOk = writable(false); // are axes ready for drawing
+	component_subscribe($$self, isOk, value => $$invalidate(3, $isOk = value));
+
+	/** Adds margins for x-axis (e.g. when x-axis must be shown) */
+	const addXAxisMargins = function () {
+		$$invalidate(18, axesMargins[0] = 1, axesMargins);
+		$$invalidate(18, axesMargins[2] = 0.5, axesMargins);
+		$$invalidate(18, axesMargins[1] = axesMargins[1] > 0.5 ? axesMargins[1] : 0.5, axesMargins);
+		$$invalidate(18, axesMargins[3] = axesMargins[3] > 0.5 ? axesMargins[3] : 0.5, axesMargins);
+	};
+
+	/** Adds margins for y-axis (e.g. when y-axis must be shown) */
+	const addYAxisMargins = function () {
+		$$invalidate(18, axesMargins[1] = 1, axesMargins);
+		$$invalidate(18, axesMargins[3] = 0.5, axesMargins);
+		$$invalidate(18, axesMargins[0] = axesMargins[0] > 0.5 ? axesMargins[0] : 0.5, axesMargins);
+		$$invalidate(18, axesMargins[2] = axesMargins[2] > 0.5 ? axesMargins[2] : 0.5, axesMargins);
+	};
+
+	/** Adjusts limits for x-axis (e.g. when new series is added)
+ *  @param {Array} newLim - vector with new limits  (two values)
+ */
+	const adjustXAxisLimits = function (newLim) {
+		if (!limX.some(v => v === undefined)) return;
+		xLim.update(lim => adjustAxisLimits(lim, newLim));
+	};
+
+	/** Adjusts limits for y-axis (e.g. when new series is added)
+ *  @param {Array} newLim - vector with new limits  (two values)
+ */
+	const adjustYAxisLimits = function (newLim) {
+		if (!limY.some(v => v === undefined)) return;
+		yLim.update(lim => adjustAxisLimits(lim, newLim));
+	};
+
+	/** Adjusts x- or y- axis limits (e.g. when new elements are added)
+ *  @param {Array} lim - vector with limits for current axis (two values)
+ *  @param {Array} newLim - vector with new limits  (two values)
+ *  @returns {Array} vector with rescaled values
+ *
+ *  The new limits are set separately for min and max. Either if current value is undefined or
+ *  if new value is outside the current limits (smaller than min or larger than max).
+ */
+	const adjustAxisLimits = function (lim, newLim) {
+		let adjustedLim = [
+			lim[0] !== undefined && multiSeries === true && lim[0] < newLim[0]
+			? lim[0]
+			: newLim[0],
+			lim[1] !== undefined && multiSeries === true && lim[1] > newLim[1]
+			? lim[1]
+			: newLim[1]
+		];
+
+		// special case when both limits are zero
+		if (adjustedLim[0] === 0 && adjustedLim[1] === 0) {
+			adjustedLim = [-0.1, 0.1];
+		}
+
+		// special case when limits are equal (add ±5%)
+		if (adjustedLim[0] === adjustedLim[1]) {
+			adjustedLim = [adjustedLim[0] * 0.95, adjustedLim[0] * 1.05];
+		}
+
+		return adjustedLim;
+	};
+
+	/** Rescales x-values from plot coordinates to screen (SVG) coordinates
+ *  @param {Array} x - vector with coordinates (or objects size) in original plot coordinates
+ *  @param {Array} xLim - vector with current limits for x-axis in original plot coordinates
+ *  @param {number} width - width of coordinate system in pixels
+ *  @param {boolean} doSizeScreen - scale size of objects (true) or coordinates
+ *  @returns {Array} vector with rescaled values
+ */
+	const scaleX = function (x, xLim, width, doSizeScale = false) {
+		if (!$isOk || x === undefined || !Array.isArray(x)) return undefined;
+
+		if (doSizeScale) {
+			// scale size of objects instead of coordinates
+			return x.map(v => v / (xLim[1] - xLim[0]) * (width - margins[1] - margins[3]));
+		}
+
+		return x.map(v => (v - xLim[0]) / (xLim[1] - xLim[0]) * (width - margins[1] - margins[3]) + margins[1]);
+	};
+
+	/** Rescales x-values from plot coordinates to screen (SVG) coordinates
+ *  @param {Array} x - vector with coordinates (or objects size) in original plot coordinates
+ *  @param {Array} xLim - vector with current limits for x-axis in original plot coordinates
+ *  @param {number} width - width of coordinate system in pixels
+ *  @param {boolean} doSizeScreen - scale size of objects (true) or coordinates
+ *  @returns {Array} vector with rescaled values
+ */
+	const scaleY = function (y, yLim, height, doSizeScale = false) {
+		if (!$isOk || y === undefined || !Array.isArray(y)) return undefined;
+
+		if (doSizeScale) {
+			// scale size of objects instead of coordinates
+			return y.map(v => v / (yLim[1] - yLim[0]) * (height - margins[0] - margins[2]));
+		}
+
+		// for coordinates we also need to invert (flip) the y-axis
+		return y.map(v => (yLim[1] - v) / (yLim[1] - yLim[0]) * (height - margins[0] - margins[2]) + margins[2]);
+	};
+
+	/** Computes nice tick values for axis
+ * @param {Array} ticks - vector with ticks if alredy available (if not, new will be computed)
+ * @param {Array} lim - vector with axis limits tickets must be computed for
+ * @param {number} maxTickNum - maximum number of ticks to compute
+ * @param {boolean} round - round or not the fractions when computing nice numbers for the ticks
+ * @returns {Array} a vector with computed tick positions
+ */
+	const getAxisTicks = function (ticks, lim, maxTickNum, round = true) {
+		// if ticks are already provided do not recompute them
+		if (ticks !== undefined) return ticks;
+
+		// check if limits are ok
+		if (!Array.isArray(lim) || lim[0] === undefined || lim[1] === undefined) return undefined;
+
+		// get range as a nice number and compute min, max and steps for the tick sequence
+		const range = niceNum(lim[1] - lim[0], round);
+
+		const tickSpacing = niceNum(range / (maxTickNum - 1), round);
+		const tickMin = Math.ceil(lim[0] / tickSpacing) * tickSpacing;
+		const tickMax = Math.floor(lim[1] / tickSpacing) * tickSpacing;
+
+		// recompute maxTickNum
+		maxTickNum = Math.round((tickMax - tickMin + 1) / tickSpacing) + 1;
+
+		// create a sequence and return
+		ticks = [...Array(maxTickNum)].map((x, i) => tickMin + i * tickSpacing);
+
+		// if step is smaller than 1 round values to remove small decimals accidentiall added by JS
+		if (Math.abs(tickSpacing) < 1) {
+			const r = Math.pow(10, 1 + Math.round(-Math.log10(tickSpacing)));
+			ticks = ticks.map(v => Math.round((v + Number.EPSILON) * r) / r);
+		}
+
+		// make sure the ticks are not aligned with axes limits
+		return ticks.filter(x => x >= lim[0] & x <= lim[1]);
+	};
+
+	/* context with Axes constants, properties and methods to share with children */
+	let context = {
+		// methods
+		addXAxisMargins,
+		addYAxisMargins,
+		adjustXAxisLimits,
+		adjustYAxisLimits,
+		getAxisTicks,
+		scaleX,
+		scaleY,
+		// variables
+		isOk,
+		scale,
+		width,
+		height,
+		xLim,
+		yLim,
+		// constants
+		LINE_STYLES,
+		LABELS_MARGIN,
+		TICK_NUM
+	};
+
+	setContext('axes', context);
+
+	/* observer for the plotting area size */
+	var ro = new ResizeObserver(entries => {
+			for (let entry of entries) {
+				const cr = entry.contentRect;
+				width.update(x => cr.width);
+				height.update(x => cr.height);
+				scale.update(x => getScale(cr.width, cr.height));
+			}
+		});
+
+	onMount(() => {
+		ro.observe(axesWrapper);
+	});
+
+	function div0_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			axesWrapper = $$value;
+			$$invalidate(5, axesWrapper);
+		});
+	}
+
+	$$self.$$set = $$props => {
+		if ('limX' in $$props) $$invalidate(15, limX = $$props.limX);
+		if ('limY' in $$props) $$invalidate(16, limY = $$props.limY);
+		if ('title' in $$props) $$invalidate(0, title = $$props.title);
+		if ('xLabel' in $$props) $$invalidate(1, xLabel = $$props.xLabel);
+		if ('yLabel' in $$props) $$invalidate(2, yLabel = $$props.yLabel);
+		if ('multiSeries' in $$props) $$invalidate(17, multiSeries = $$props.multiSeries);
+		if ('$$scope' in $$props) $$invalidate(23, $$scope = $$props.$$scope);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty[0] & /*limX*/ 32768) {
+			// this is reactive in case if limX and limY are interactively changed by parent script
+			if (!limX.some(v => v === undefined)) xLim.update(v => limX);
+		}
+
+		if ($$self.$$.dirty[0] & /*limY*/ 65536) {
+			if (!limY.some(v => v === undefined)) yLim.update(v => limY);
+		}
+
+		if ($$self.$$.dirty[0] & /*axesMargins, $scale*/ 262160) {
+			// computes real margins in pixels based on current scale
+			margins = axesMargins.map(v => v * AXES_MARGIN_FACTORS[$scale]);
+		}
+
+		if ($$self.$$.dirty[0] & /*$yLim, $xLim*/ 5242880) {
+			// computes status which tells that axes limits look fine and it is safe to draw
+			// the status is based on the axis limits validity
+			isOk.update(v => Array.isArray($yLim) && Array.isArray($xLim) && $xLim.length === 2 && $yLim.length === 2 && !$yLim.some(v => v === undefined) && !$xLim.some(v => v === undefined) && !$yLim.some(v => isNaN(v)) && !$xLim.some(v => isNaN(v)) && $xLim[1] !== $xLim[0] && $yLim[1] !== $yLim[0]);
+		}
+
+		if ($$self.$$.dirty[0] & /*$isOk, $xLim, $width*/ 6291464) {
+			// computes coordinates for clip path box
+			$$invalidate(7, cpx = $isOk ? scaleX($xLim, $xLim, $width) : [0, 1]);
+		}
+
+		if ($$self.$$.dirty[0] & /*$isOk, $yLim, $height*/ 1572872) {
+			$$invalidate(6, cpy = $isOk ? scaleY($yLim, $yLim, $height) : [1, 0]);
+		}
+	};
+
+	return [
+		title,
+		xLabel,
+		yLabel,
+		$isOk,
+		$scale,
+		axesWrapper,
+		cpy,
+		cpx,
+		clipPathID,
+		width,
+		height,
+		xLim,
+		yLim,
+		scale,
+		isOk,
+		limX,
+		limY,
+		multiSeries,
+		axesMargins,
+		$height,
+		$yLim,
+		$width,
+		$xLim,
+		$$scope,
+		slots,
+		div0_binding
+	];
+}
+
+class Axes extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance$b,
+			create_fragment$b,
+			safe_not_equal,
+			{
+				limX: 15,
+				limY: 16,
+				title: 0,
+				xLabel: 1,
+				yLabel: 2,
+				multiSeries: 17
+			},
+			add_css$2,
+			[-1, -1]
+		);
+	}
+}
+
+const Colors = {
+   "AXIS_LINE": "#303030",
+   "AXIS_TICK": "#606060",
+   "WHITE":     "#fff",
+   "BLACK":     "#000",
+   "GRAY":      "#909090",
+   "MIDDLEGRAY": "#dadada",
+   "LIGHTGRAY": "#f0f0f0",
+   "DARKGRAY":  "#606060",
+
+   "PRIMARY": "#2266ff",
+   "PRIMARY_TEXT": "#333",
+};
+
+/* src/XAxis.svelte generated by Svelte v3.46.3 */
+
+function get_each_context$5(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[26] = list[i];
+	child_ctx[28] = i;
+	return child_ctx;
+}
+
+// (57:0) {#if $isOk && x !== undefined && y !== undefined }
+function create_if_block$8(ctx) {
+	let g;
+	let line;
+	let line_x__value;
+	let line_x__value_1;
+	let line_y__value;
+	let line_y__value_1;
+	let each_value = /*ticksX*/ ctx[4];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			g = svg_element("g");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			line = svg_element("line");
+			attr(line, "x1", line_x__value = /*x*/ ctx[5][0]);
+			attr(line, "x2", line_x__value_1 = /*x*/ ctx[5][1]);
+			attr(line, "y1", line_y__value = /*y*/ ctx[2][0]);
+			attr(line, "y2", line_y__value_1 = /*y*/ ctx[2][0]);
+			attr(line, "style", /*axisLineStyleStr*/ ctx[7]);
+			attr(g, "class", "mdaplot__axis mdaplot__xaxis");
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(g, null);
+			}
+
+			append(g, line);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*ticksX, ticksY, dy, tickLabels, axisLineStyleStr, y, gridLineStyleStr*/ 415) {
+				each_value = /*ticksX*/ ctx[4];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$5(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block$5(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(g, line);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+
+			if (dirty & /*x*/ 32 && line_x__value !== (line_x__value = /*x*/ ctx[5][0])) {
+				attr(line, "x1", line_x__value);
+			}
+
+			if (dirty & /*x*/ 32 && line_x__value_1 !== (line_x__value_1 = /*x*/ ctx[5][1])) {
+				attr(line, "x2", line_x__value_1);
+			}
+
+			if (dirty & /*y*/ 4 && line_y__value !== (line_y__value = /*y*/ ctx[2][0])) {
+				attr(line, "y1", line_y__value);
+			}
+
+			if (dirty & /*y*/ 4 && line_y__value_1 !== (line_y__value_1 = /*y*/ ctx[2][0])) {
+				attr(line, "y2", line_y__value_1);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+}
+
+// (59:3) {#each ticksX as tx, i}
+function create_each_block$5(ctx) {
+	let line0;
+	let line0_x__value;
+	let line0_x__value_1;
+	let line0_y__value;
+	let line0_y__value_1;
+	let line1;
+	let line1_x__value;
+	let line1_x__value_1;
+	let line1_y__value;
+	let line1_y__value_1;
+	let text_1;
+	let t_value = /*tickLabels*/ ctx[0][/*i*/ ctx[28]] + "";
+	let t;
+	let text_1_x_value;
+	let text_1_y_value;
+
+	return {
+		c() {
+			line0 = svg_element("line");
+			line1 = svg_element("line");
+			text_1 = svg_element("text");
+			t = text(t_value);
+			attr(line0, "x1", line0_x__value = /*tx*/ ctx[26]);
+			attr(line0, "x2", line0_x__value_1 = /*tx*/ ctx[26]);
+			attr(line0, "y1", line0_y__value = /*y*/ ctx[2][0]);
+			attr(line0, "y2", line0_y__value_1 = /*y*/ ctx[2][1]);
+			attr(line0, "style", /*gridLineStyleStr*/ ctx[8]);
+			attr(line1, "x1", line1_x__value = /*tx*/ ctx[26]);
+			attr(line1, "x2", line1_x__value_1 = /*tx*/ ctx[26]);
+			attr(line1, "y1", line1_y__value = /*ticksY*/ ctx[3][0]);
+			attr(line1, "y2", line1_y__value_1 = /*ticksY*/ ctx[3][1]);
+			attr(line1, "style", /*axisLineStyleStr*/ ctx[7]);
+			attr(text_1, "x", text_1_x_value = /*tx*/ ctx[26]);
+			attr(text_1, "y", text_1_y_value = /*ticksY*/ ctx[3][1]);
+			attr(text_1, "dx", "0");
+			attr(text_1, "dy", /*dy*/ ctx[1]);
+			attr(text_1, "class", "mdaplot__axis-labels");
+			attr(text_1, "dominant-baseline", "middle");
+			attr(text_1, "text-anchor", "middle");
+		},
+		m(target, anchor) {
+			insert(target, line0, anchor);
+			insert(target, line1, anchor);
+			insert(target, text_1, anchor);
+			append(text_1, t);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*ticksX*/ 16 && line0_x__value !== (line0_x__value = /*tx*/ ctx[26])) {
+				attr(line0, "x1", line0_x__value);
+			}
+
+			if (dirty & /*ticksX*/ 16 && line0_x__value_1 !== (line0_x__value_1 = /*tx*/ ctx[26])) {
+				attr(line0, "x2", line0_x__value_1);
+			}
+
+			if (dirty & /*y*/ 4 && line0_y__value !== (line0_y__value = /*y*/ ctx[2][0])) {
+				attr(line0, "y1", line0_y__value);
+			}
+
+			if (dirty & /*y*/ 4 && line0_y__value_1 !== (line0_y__value_1 = /*y*/ ctx[2][1])) {
+				attr(line0, "y2", line0_y__value_1);
+			}
+
+			if (dirty & /*ticksX*/ 16 && line1_x__value !== (line1_x__value = /*tx*/ ctx[26])) {
+				attr(line1, "x1", line1_x__value);
+			}
+
+			if (dirty & /*ticksX*/ 16 && line1_x__value_1 !== (line1_x__value_1 = /*tx*/ ctx[26])) {
+				attr(line1, "x2", line1_x__value_1);
+			}
+
+			if (dirty & /*ticksY*/ 8 && line1_y__value !== (line1_y__value = /*ticksY*/ ctx[3][0])) {
+				attr(line1, "y1", line1_y__value);
+			}
+
+			if (dirty & /*ticksY*/ 8 && line1_y__value_1 !== (line1_y__value_1 = /*ticksY*/ ctx[3][1])) {
+				attr(line1, "y2", line1_y__value_1);
+			}
+
+			if (dirty & /*tickLabels*/ 1 && t_value !== (t_value = /*tickLabels*/ ctx[0][/*i*/ ctx[28]] + "")) set_data(t, t_value);
+
+			if (dirty & /*ticksX*/ 16 && text_1_x_value !== (text_1_x_value = /*tx*/ ctx[26])) {
+				attr(text_1, "x", text_1_x_value);
+			}
+
+			if (dirty & /*ticksY*/ 8 && text_1_y_value !== (text_1_y_value = /*ticksY*/ ctx[3][1])) {
+				attr(text_1, "y", text_1_y_value);
+			}
+
+			if (dirty & /*dy*/ 2) {
+				attr(text_1, "dy", /*dy*/ ctx[1]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(line0);
+			if (detaching) detach(line1);
+			if (detaching) detach(text_1);
+		}
+	};
+}
+
+function create_fragment$a(ctx) {
+	let if_block_anchor;
+	let if_block = /*$isOk*/ ctx[6] && /*x*/ ctx[5] !== undefined && /*y*/ ctx[2] !== undefined && create_if_block$8(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*$isOk*/ ctx[6] && /*x*/ ctx[5] !== undefined && /*y*/ ctx[2] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$8(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$a($$self, $$props, $$invalidate) {
+	let x;
+	let y;
+	let dy;
+	let tickNum;
+	let ticksX;
+	let ticksY;
+	let $axesWidth;
+	let $xLim;
+	let $scale;
+	let $axesHeight;
+	let $yLim;
+	let $isOk;
+	let { slot = "xaxis" } = $$props;
+	let { ticks = undefined } = $$props;
+	let { tickLabels = ticks } = $$props;
+	let { showGrid = false } = $$props;
+
+	// set up tick mode
+	const tickMode = ticks === undefined ? "auto" : "manual";
+
+	/* sanity checks of input parameters */
+	if (slot !== "xaxis") {
+		throw "Component XAxis must have \"slot='xaxis'\" attribute.";
+	}
+
+	if (ticks !== undefined && !Array.isArray(ticks)) {
+		throw "XAxis: 'ticks' must be a vector of numbers.";
+	}
+
+	if (ticks !== undefined && !(Array.isArray(tickLabels) && tickLabels.length == ticks.length)) {
+		throw "XAxis: 'tickLabels' must be a vector of the same size as ticks.";
+	}
+
+	/* styles for axis and grid lines */
+	const axisLineStyleStr = `stroke:${Colors.DARKGRAY};line-width:1px;`;
+
+	const gridLineStyleStr = `stroke:${Colors.MIDDLEGRAY};stroke-opacity:${showGrid ? 1 : 0};stroke-dasharray:2px;`;
+
+	// get axes context and adjust x margins
+	const axes = getContext('axes');
+
+	axes.addXAxisMargins();
+
+	// get reactive variables needed to compute coordinates
+	const xLim = axes.xLim;
+
+	component_subscribe($$self, xLim, value => $$invalidate(20, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(23, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(19, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(22, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(21, $scale = value));
+	const isOk = axes.isOk;
+	component_subscribe($$self, isOk, value => $$invalidate(6, $isOk = value));
+
+	$$self.$$set = $$props => {
+		if ('slot' in $$props) $$invalidate(16, slot = $$props.slot);
+		if ('ticks' in $$props) $$invalidate(15, ticks = $$props.ticks);
+		if ('tickLabels' in $$props) $$invalidate(0, tickLabels = $$props.tickLabels);
+		if ('showGrid' in $$props) $$invalidate(17, showGrid = $$props.showGrid);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*$xLim, $axesWidth*/ 1572864) {
+			// reactive variables for coordinates of axis lines
+			$$invalidate(5, x = axes.scaleX($xLim, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*$yLim, $axesHeight*/ 12582912) {
+			$$invalidate(2, y = axes.scaleY($yLim, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*$scale*/ 2097152) {
+			// reactive variables for ticks and their coordinates
+			$$invalidate(1, dy = $scale === "small" ? 7 : 10);
+		}
+
+		if ($$self.$$.dirty & /*$scale*/ 2097152) {
+			$$invalidate(18, tickNum = axes.TICK_NUM[$scale]);
+		}
+
+		if ($$self.$$.dirty & /*$xLim, tickNum, ticks*/ 1343488) {
+			$$invalidate(15, ticks = tickMode === "auto"
+			? axes.getAxisTicks(undefined, $xLim, tickNum, true)
+			: ticks);
+		}
+
+		if ($$self.$$.dirty & /*ticks, tickLabels*/ 32769) {
+			$$invalidate(0, tickLabels = tickMode === "auto" ? ticks : tickLabels);
+		}
+
+		if ($$self.$$.dirty & /*ticks, $xLim, $axesWidth*/ 1605632) {
+			$$invalidate(4, ticksX = axes.scaleX(ticks, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*y, dy*/ 6) {
+			$$invalidate(3, ticksY = y === undefined ? undefined : [y[0], y[0] + dy]);
+		}
+	};
+
+	return [
+		tickLabels,
+		dy,
+		y,
+		ticksY,
+		ticksX,
+		x,
+		$isOk,
+		axisLineStyleStr,
+		gridLineStyleStr,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		isOk,
+		ticks,
+		slot,
+		showGrid,
+		tickNum,
+		$axesWidth,
+		$xLim,
+		$scale,
+		$axesHeight,
+		$yLim
+	];
+}
+
+class XAxis extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$a, create_fragment$a, safe_not_equal, {
+			slot: 16,
+			ticks: 15,
+			tickLabels: 0,
+			showGrid: 17
+		});
+	}
+}
+
+/* src/YAxis.svelte generated by Svelte v3.46.3 */
+
+function get_each_context$4(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[26] = list[i];
+	child_ctx[28] = i;
+	return child_ctx;
+}
+
+// (60:0) {#if x !== undefined && y !== undefined }
+function create_if_block$7(ctx) {
+	let g;
+	let line;
+	let line_x__value;
+	let line_x__value_1;
+	let line_y__value;
+	let line_y__value_1;
+	let each_value = /*ticksY*/ ctx[4];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			g = svg_element("g");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			line = svg_element("line");
+			attr(line, "x1", line_x__value = /*x*/ ctx[1][0]);
+			attr(line, "x2", line_x__value_1 = /*x*/ ctx[1][0]);
+			attr(line, "y1", line_y__value = /*y*/ ctx[5][0]);
+			attr(line, "y2", line_y__value_1 = /*y*/ ctx[5][1]);
+			attr(line, "style", /*axisLineStyleStr*/ ctx[7]);
+			attr(g, "class", "mdaplot__axis mdaplot__yaxis");
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(g, null);
+			}
+
+			append(g, line);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*ticksX, ticksY, dx, transform, tickLabels, axisLineStyleStr, x, gridLineStyleStr*/ 479) {
+				each_value = /*ticksY*/ ctx[4];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$4(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block$4(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(g, line);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+
+			if (dirty & /*x*/ 2 && line_x__value !== (line_x__value = /*x*/ ctx[1][0])) {
+				attr(line, "x1", line_x__value);
+			}
+
+			if (dirty & /*x*/ 2 && line_x__value_1 !== (line_x__value_1 = /*x*/ ctx[1][0])) {
+				attr(line, "x2", line_x__value_1);
+			}
+
+			if (dirty & /*y*/ 32 && line_y__value !== (line_y__value = /*y*/ ctx[5][0])) {
+				attr(line, "y1", line_y__value);
+			}
+
+			if (dirty & /*y*/ 32 && line_y__value_1 !== (line_y__value_1 = /*y*/ ctx[5][1])) {
+				attr(line, "y2", line_y__value_1);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+}
+
+// (62:3) {#each ticksY as ty, i}
+function create_each_block$4(ctx) {
+	let line0;
+	let line0_x__value;
+	let line0_x__value_1;
+	let line0_y__value;
+	let line0_y__value_1;
+	let line1;
+	let line1_x__value;
+	let line1_x__value_1;
+	let line1_y__value;
+	let line1_y__value_1;
+	let text_1;
+	let t_value = /*tickLabels*/ ctx[0][/*i*/ ctx[28]] + "";
+	let t;
+	let text_1_x_value;
+	let text_1_y_value;
+	let text_1_dy_value;
+
+	return {
+		c() {
+			line0 = svg_element("line");
+			line1 = svg_element("line");
+			text_1 = svg_element("text");
+			t = text(t_value);
+			attr(line0, "x1", line0_x__value = /*x*/ ctx[1][0]);
+			attr(line0, "x2", line0_x__value_1 = /*x*/ ctx[1][1]);
+			attr(line0, "y1", line0_y__value = /*ty*/ ctx[26]);
+			attr(line0, "y2", line0_y__value_1 = /*ty*/ ctx[26]);
+			attr(line0, "style", /*gridLineStyleStr*/ ctx[8]);
+			attr(line1, "x1", line1_x__value = /*ticksX*/ ctx[3][0]);
+			attr(line1, "x2", line1_x__value_1 = /*ticksX*/ ctx[3][1]);
+			attr(line1, "y1", line1_y__value = /*ty*/ ctx[26]);
+			attr(line1, "y2", line1_y__value_1 = /*ty*/ ctx[26]);
+			attr(line1, "style", /*axisLineStyleStr*/ ctx[7]);
+			attr(text_1, "x", text_1_x_value = /*ticksX*/ ctx[3][0]);
+			attr(text_1, "y", text_1_y_value = /*ty*/ ctx[26]);
+			attr(text_1, "dx", /*dx*/ ctx[2]);
+			attr(text_1, "dy", text_1_dy_value = 0);
+			attr(text_1, "transform", /*transform*/ ctx[6]);
+			set_style(text_1, "background", "red");
+			attr(text_1, "class", "mdaplot__axis-labels");
+			attr(text_1, "dominant-baseline", "middle");
+			attr(text_1, "text-anchor", "end");
+		},
+		m(target, anchor) {
+			insert(target, line0, anchor);
+			insert(target, line1, anchor);
+			insert(target, text_1, anchor);
+			append(text_1, t);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*x*/ 2 && line0_x__value !== (line0_x__value = /*x*/ ctx[1][0])) {
+				attr(line0, "x1", line0_x__value);
+			}
+
+			if (dirty & /*x*/ 2 && line0_x__value_1 !== (line0_x__value_1 = /*x*/ ctx[1][1])) {
+				attr(line0, "x2", line0_x__value_1);
+			}
+
+			if (dirty & /*ticksY*/ 16 && line0_y__value !== (line0_y__value = /*ty*/ ctx[26])) {
+				attr(line0, "y1", line0_y__value);
+			}
+
+			if (dirty & /*ticksY*/ 16 && line0_y__value_1 !== (line0_y__value_1 = /*ty*/ ctx[26])) {
+				attr(line0, "y2", line0_y__value_1);
+			}
+
+			if (dirty & /*ticksX*/ 8 && line1_x__value !== (line1_x__value = /*ticksX*/ ctx[3][0])) {
+				attr(line1, "x1", line1_x__value);
+			}
+
+			if (dirty & /*ticksX*/ 8 && line1_x__value_1 !== (line1_x__value_1 = /*ticksX*/ ctx[3][1])) {
+				attr(line1, "x2", line1_x__value_1);
+			}
+
+			if (dirty & /*ticksY*/ 16 && line1_y__value !== (line1_y__value = /*ty*/ ctx[26])) {
+				attr(line1, "y1", line1_y__value);
+			}
+
+			if (dirty & /*ticksY*/ 16 && line1_y__value_1 !== (line1_y__value_1 = /*ty*/ ctx[26])) {
+				attr(line1, "y2", line1_y__value_1);
+			}
+
+			if (dirty & /*tickLabels*/ 1 && t_value !== (t_value = /*tickLabels*/ ctx[0][/*i*/ ctx[28]] + "")) set_data(t, t_value);
+
+			if (dirty & /*ticksX*/ 8 && text_1_x_value !== (text_1_x_value = /*ticksX*/ ctx[3][0])) {
+				attr(text_1, "x", text_1_x_value);
+			}
+
+			if (dirty & /*ticksY*/ 16 && text_1_y_value !== (text_1_y_value = /*ty*/ ctx[26])) {
+				attr(text_1, "y", text_1_y_value);
+			}
+
+			if (dirty & /*dx*/ 4) {
+				attr(text_1, "dx", /*dx*/ ctx[2]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(line0);
+			if (detaching) detach(line1);
+			if (detaching) detach(text_1);
+		}
+	};
+}
+
+function create_fragment$9(ctx) {
+	let if_block_anchor;
+	let if_block = /*x*/ ctx[1] !== undefined && /*y*/ ctx[5] !== undefined && create_if_block$7(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*x*/ ctx[1] !== undefined && /*y*/ ctx[5] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$7(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$9($$self, $$props, $$invalidate) {
+	let x;
+	let y;
+	let dx;
+	let tickNum;
+	let ticksY;
+	let ticksX;
+	let $axesHeight;
+	let $yLim;
+	let $scale;
+	let $axesWidth;
+	let $xLim;
+	let { slot = "yaxis" } = $$props;
+	let { ticks = undefined } = $$props;
+	let { tickLabels = ticks } = $$props;
+	let { showGrid = false } = $$props;
+	let { las = 1 } = $$props;
+
+	// set up tick mode
+	const tickMode = ticks === undefined ? "auto" : "manual";
+
+	// TODO: set up tick text translation
+	const transform = las > 1 ? "" : "";
+
+	/* sanity checks of input parameters */
+	if (slot !== "yaxis") {
+		throw "Component YAxis must have \"slot='yaxis'\" attribute.";
+	}
+
+	if (ticks !== undefined && !Array.isArray(ticks)) {
+		throw "YAxis: 'ticks' must be a vector of numbers.";
+	}
+
+	if (ticks !== undefined && !(Array.isArray(tickLabels) && tickLabels.length == ticks.length)) {
+		throw "YAxis: 'tickLabels' must be a vector of the same size as ticks.";
+	}
+
+	/* styles for axis and grid lines */
+	const axisLineStyleStr = `stroke:${Colors.DARKGRAY};line-width:1px;`;
+
+	const gridLineStyleStr = `stroke:${Colors.MIDDLEGRAY};stroke-opacity:${showGrid ? 1 : 0};stroke-dasharray:2px;`;
+
+	// get axes context and adjust x margins
+	const axes = getContext('axes');
+
+	axes.addYAxisMargins();
+
+	// get reactive variables needed to compute coordinates
+	const xLim = axes.xLim;
+
+	component_subscribe($$self, xLim, value => $$invalidate(23, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(20, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(22, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(19, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(21, $scale = value));
+
+	$$self.$$set = $$props => {
+		if ('slot' in $$props) $$invalidate(15, slot = $$props.slot);
+		if ('ticks' in $$props) $$invalidate(14, ticks = $$props.ticks);
+		if ('tickLabels' in $$props) $$invalidate(0, tickLabels = $$props.tickLabels);
+		if ('showGrid' in $$props) $$invalidate(16, showGrid = $$props.showGrid);
+		if ('las' in $$props) $$invalidate(17, las = $$props.las);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*$xLim, $axesWidth*/ 12582912) {
+			// reactive variables for coordinates of axis lines
+			$$invalidate(1, x = axes.scaleX($xLim, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*$yLim, $axesHeight*/ 1572864) {
+			$$invalidate(5, y = axes.scaleY($yLim, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*$scale*/ 2097152) {
+			// reactive variables for ticks and their coordinates
+			$$invalidate(2, dx = $scale === "small" ? -4 : -6);
+		}
+
+		if ($$self.$$.dirty & /*$scale*/ 2097152) {
+			$$invalidate(18, tickNum = axes.TICK_NUM[$scale]);
+		}
+
+		if ($$self.$$.dirty & /*$yLim, tickNum, ticks*/ 1327104) {
+			$$invalidate(14, ticks = tickMode === "auto"
+			? axes.getAxisTicks(undefined, $yLim, tickNum, true)
+			: ticks);
+		}
+
+		if ($$self.$$.dirty & /*ticks, tickLabels*/ 16385) {
+			$$invalidate(0, tickLabels = tickMode === "auto" ? ticks : tickLabels);
+		}
+
+		if ($$self.$$.dirty & /*ticks, $yLim, $axesHeight*/ 1589248) {
+			$$invalidate(4, ticksY = axes.scaleY(ticks, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*x, dx*/ 6) {
+			$$invalidate(3, ticksX = x === undefined ? undefined : [x[0] + dx, x[0]]);
+		}
+	};
+
+	return [
+		tickLabels,
+		x,
+		dx,
+		ticksX,
+		ticksY,
+		y,
+		transform,
+		axisLineStyleStr,
+		gridLineStyleStr,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		ticks,
+		slot,
+		showGrid,
+		las,
+		tickNum,
+		$axesHeight,
+		$yLim,
+		$scale,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class YAxis extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$9, create_fragment$9, safe_not_equal, {
+			slot: 15,
+			ticks: 14,
+			tickLabels: 0,
+			showGrid: 16,
+			las: 17
+		});
+	}
+}
+
+/* src/Rectangles.svelte generated by Svelte v3.46.3 */
+
+function get_each_context$3(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[23] = list[i];
+	child_ctx[25] = i;
+	return child_ctx;
+}
+
+// (51:0) {#if rx !== undefined && ry !== undefined}
+function create_if_block$6(ctx) {
+	let each_1_anchor;
+	let each_value = /*left*/ ctx[0];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			each_1_anchor = empty();
+		},
+		m(target, anchor) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(target, anchor);
+			}
+
+			insert(target, each_1_anchor, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*rx, ry, rw, rh, barsStyleStr, left*/ 63) {
+				each_value = /*left*/ ctx[0];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$3(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block$3(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+		},
+		d(detaching) {
+			destroy_each(each_blocks, detaching);
+			if (detaching) detach(each_1_anchor);
+		}
+	};
+}
+
+// (52:3) {#each left as v, i}
+function create_each_block$3(ctx) {
+	let rect;
+	let rect_x_value;
+	let rect_y_value;
+	let rect_width_value;
+	let rect_height_value;
+
+	return {
+		c() {
+			rect = svg_element("rect");
+			attr(rect, "x", rect_x_value = /*rx*/ ctx[4][/*i*/ ctx[25]]);
+			attr(rect, "y", rect_y_value = /*ry*/ ctx[3][/*i*/ ctx[25]]);
+			attr(rect, "width", rect_width_value = /*rw*/ ctx[2][/*i*/ ctx[25]]);
+			attr(rect, "height", rect_height_value = /*rh*/ ctx[1][/*i*/ ctx[25]]);
+			attr(rect, "style", /*barsStyleStr*/ ctx[5]);
+		},
+		m(target, anchor) {
+			insert(target, rect, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*rx*/ 16 && rect_x_value !== (rect_x_value = /*rx*/ ctx[4][/*i*/ ctx[25]])) {
+				attr(rect, "x", rect_x_value);
+			}
+
+			if (dirty & /*ry*/ 8 && rect_y_value !== (rect_y_value = /*ry*/ ctx[3][/*i*/ ctx[25]])) {
+				attr(rect, "y", rect_y_value);
+			}
+
+			if (dirty & /*rw*/ 4 && rect_width_value !== (rect_width_value = /*rw*/ ctx[2][/*i*/ ctx[25]])) {
+				attr(rect, "width", rect_width_value);
+			}
+
+			if (dirty & /*rh*/ 2 && rect_height_value !== (rect_height_value = /*rh*/ ctx[1][/*i*/ ctx[25]])) {
+				attr(rect, "height", rect_height_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(rect);
+		}
+	};
+}
+
+function create_fragment$8(ctx) {
+	let if_block_anchor;
+	let if_block = /*rx*/ ctx[4] !== undefined && /*ry*/ ctx[3] !== undefined && create_if_block$6(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*rx*/ ctx[4] !== undefined && /*ry*/ ctx[3] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$6(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$8($$self, $$props, $$invalidate) {
+	let rx;
+	let ry;
+	let rw;
+	let rh;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { left } = $$props;
+	let { top } = $$props;
+	let { width } = $$props;
+	let { height } = $$props;
+	let { labels = undefined } = $$props;
+	let { faceColor = Colors.PRIMARY } = $$props;
+	let { borderColor = faceColor } = $$props;
+	let { lineWidth = 1 } = $$props;
+
+	// styles for bars and labels
+	const barsStyleStr = `fill:${faceColor};stroke:${borderColor};stroke-width: ${lineWidth}px;`;
+
+	// multiply width and height values if needed
+	if (!Array.isArray(left) || !Array.isArray(top) || left.length < 1 || left.length != top.length) {
+		throw "Rectangles: parameters 'left' and 'top' must be vectors of the same size.";
+	}
+
+	// we make this reactive in case if left and right has been changed but not width
+	const n = left.length;
+
+	if (!Array.isArray(height)) height = Array(n).fill(height);
+	if (!Array.isArray(width)) width = Array(n).fill(width);
+
+	/* sanity check for input parameters */
+	if (top.length !== n || width.length !== n || height.length !== n) {
+		throw "Rectangles: x, y, w and h should have the same length (w and h can be single values).";
+	}
+
+	if (labels !== undefined && (!Array.isArray(labels) || labels.length !== n)) {
+		throw "Rectangles: vector with labels should have the same length as vectors with x and y coordinates.";
+	}
+
+	// get axes context and reactive variables needed to compute coordinates
+	const axes = getContext('axes');
+
+	const xLim = axes.xLim;
+	component_subscribe($$self, xLim, value => $$invalidate(20, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(18, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(19, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(17, $axesHeight = value));
+
+	$$self.$$set = $$props => {
+		if ('left' in $$props) $$invalidate(0, left = $$props.left);
+		if ('top' in $$props) $$invalidate(12, top = $$props.top);
+		if ('width' in $$props) $$invalidate(10, width = $$props.width);
+		if ('height' in $$props) $$invalidate(11, height = $$props.height);
+		if ('labels' in $$props) $$invalidate(13, labels = $$props.labels);
+		if ('faceColor' in $$props) $$invalidate(14, faceColor = $$props.faceColor);
+		if ('borderColor' in $$props) $$invalidate(15, borderColor = $$props.borderColor);
+		if ('lineWidth' in $$props) $$invalidate(16, lineWidth = $$props.lineWidth);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*left, $xLim, $axesWidth*/ 1572865) {
+			// reactive variables for coordinates of data points in pixels
+			$$invalidate(4, rx = axes.scaleX(left, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*top, $yLim, $axesHeight*/ 397312) {
+			$$invalidate(3, ry = axes.scaleY(top, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*width, $xLim, $axesWidth*/ 1573888) {
+			$$invalidate(2, rw = axes.scaleX(width, $xLim, $axesWidth, true));
+		}
+
+		if ($$self.$$.dirty & /*height, $yLim, $axesHeight*/ 395264) {
+			$$invalidate(1, rh = axes.scaleY(height, $yLim, $axesHeight, true));
+		}
+	};
+
+	return [
+		left,
+		rh,
+		rw,
+		ry,
+		rx,
+		barsStyleStr,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		width,
+		height,
+		top,
+		labels,
+		faceColor,
+		borderColor,
+		lineWidth,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class Rectangles extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$8, create_fragment$8, safe_not_equal, {
+			left: 0,
+			top: 12,
+			width: 10,
+			height: 11,
+			labels: 13,
+			faceColor: 14,
+			borderColor: 15,
+			lineWidth: 16
+		});
+	}
+}
+
+/* src/Box.svelte generated by Svelte v3.46.3 */
+
+function create_if_block$5(ctx) {
+	let g;
+	let rectangles;
+	let current;
+
+	rectangles = new Rectangles({
+			props: {
+				left: /*left*/ ctx[3],
+				top: /*top*/ ctx[2],
+				width: /*width*/ ctx[1],
+				height: /*height*/ ctx[0],
+				borderColor: Colors.DARKGRAY,
+				faceColor: "transparent"
+			}
+		});
+
+	return {
+		c() {
+			g = svg_element("g");
+			create_component(rectangles.$$.fragment);
+			attr(g, "class", "mdaplot__axes-box");
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+			mount_component(rectangles, g, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const rectangles_changes = {};
+			if (dirty & /*left*/ 8) rectangles_changes.left = /*left*/ ctx[3];
+			if (dirty & /*top*/ 4) rectangles_changes.top = /*top*/ ctx[2];
+			if (dirty & /*width*/ 2) rectangles_changes.width = /*width*/ ctx[1];
+			if (dirty & /*height*/ 1) rectangles_changes.height = /*height*/ ctx[0];
+			rectangles.$set(rectangles_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(rectangles.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(rectangles.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+			destroy_component(rectangles);
+		}
+	};
+}
+
+function create_fragment$7(ctx) {
+	let if_block_anchor;
+	let current;
+	let if_block = /*$isOk*/ ctx[4] && create_if_block$5(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			if (/*$isOk*/ ctx[4]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*$isOk*/ 16) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block$5(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(if_block);
+			current = true;
+		},
+		o(local) {
+			transition_out(if_block);
+			current = false;
+		},
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$7($$self, $$props, $$invalidate) {
+	let left;
+	let top;
+	let width;
+	let height;
+	let $yLim;
+	let $xLim;
+	let $isOk;
+	let { slot } = $$props;
+
+	// check that the box is located in a correct slot
+	if (slot !== "box") {
+		throw "Component Box must have \"slot='box'\" attribute.";
+	}
+
+	// get axes context and reactive variables needed to compute coordinates
+	const axes = getContext('axes');
+
+	const xLim = axes.xLim;
+	component_subscribe($$self, xLim, value => $$invalidate(10, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(9, $yLim = value));
+	const isOk = axes.isOk;
+	component_subscribe($$self, isOk, value => $$invalidate(4, $isOk = value));
+
+	$$self.$$set = $$props => {
+		if ('slot' in $$props) $$invalidate(8, slot = $$props.slot);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*$xLim*/ 1024) {
+			// reactive variables for coordinates of box points in pixels
+			$$invalidate(3, left = [$xLim[0]]);
+		}
+
+		if ($$self.$$.dirty & /*$yLim*/ 512) {
+			$$invalidate(2, top = [$yLim[1]]);
+		}
+
+		if ($$self.$$.dirty & /*$xLim*/ 1024) {
+			$$invalidate(1, width = [$xLim[1] - $xLim[0]]);
+		}
+
+		if ($$self.$$.dirty & /*$yLim*/ 512) {
+			$$invalidate(0, height = [$yLim[1] - $yLim[0]]);
+		}
+	};
+
+	return [height, width, top, left, $isOk, xLim, yLim, isOk, slot, $yLim, $xLim];
+}
+
+class Box extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance$7, create_fragment$7, safe_not_equal, { slot: 8 });
+	}
+}
+
+/* src/Segments.svelte generated by Svelte v3.46.3 */
+
+function get_each_context$2(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[24] = list[i];
+	child_ctx[26] = i;
+	return child_ctx;
+}
+
+// (41:0) {#if x1 !== undefined && y1 !== undefined}
+function create_if_block$4(ctx) {
+	let each_1_anchor;
+	let each_value = /*x1*/ ctx[4];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			each_1_anchor = empty();
+		},
+		m(target, anchor) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(target, anchor);
+			}
+
+			insert(target, each_1_anchor, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*x1, x2, y1, y2, lineStyleStr*/ 31) {
+				each_value = /*x1*/ ctx[4];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$2(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block$2(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+		},
+		d(detaching) {
+			destroy_each(each_blocks, detaching);
+			if (detaching) detach(each_1_anchor);
+		}
+	};
+}
+
+// (42:3) {#each x1 as v, i}
+function create_each_block$2(ctx) {
+	let line;
+	let line_x__value;
+	let line_x__value_1;
+	let line_y__value;
+	let line_y__value_1;
+
+	return {
+		c() {
+			line = svg_element("line");
+			attr(line, "x1", line_x__value = /*x1*/ ctx[4][/*i*/ ctx[26]]);
+			attr(line, "x2", line_x__value_1 = /*x2*/ ctx[3][/*i*/ ctx[26]]);
+			attr(line, "y1", line_y__value = /*y1*/ ctx[2][/*i*/ ctx[26]]);
+			attr(line, "y2", line_y__value_1 = /*y2*/ ctx[1][/*i*/ ctx[26]]);
+			attr(line, "style", /*lineStyleStr*/ ctx[0]);
+		},
+		m(target, anchor) {
+			insert(target, line, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*x1*/ 16 && line_x__value !== (line_x__value = /*x1*/ ctx[4][/*i*/ ctx[26]])) {
+				attr(line, "x1", line_x__value);
+			}
+
+			if (dirty & /*x2*/ 8 && line_x__value_1 !== (line_x__value_1 = /*x2*/ ctx[3][/*i*/ ctx[26]])) {
+				attr(line, "x2", line_x__value_1);
+			}
+
+			if (dirty & /*y1*/ 4 && line_y__value !== (line_y__value = /*y1*/ ctx[2][/*i*/ ctx[26]])) {
+				attr(line, "y1", line_y__value);
+			}
+
+			if (dirty & /*y2*/ 2 && line_y__value_1 !== (line_y__value_1 = /*y2*/ ctx[1][/*i*/ ctx[26]])) {
+				attr(line, "y2", line_y__value_1);
+			}
+
+			if (dirty & /*lineStyleStr*/ 1) {
+				attr(line, "style", /*lineStyleStr*/ ctx[0]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(line);
+		}
+	};
+}
+
+function create_fragment$6(ctx) {
+	let if_block_anchor;
+	let if_block = /*x1*/ ctx[4] !== undefined && /*y1*/ ctx[2] !== undefined && create_if_block$4(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*x1*/ ctx[4] !== undefined && /*y1*/ ctx[2] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$4(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$6($$self, $$props, $$invalidate) {
+	let x1;
+	let x2;
+	let y1;
+	let y2;
+	let lineStyleStr;
+	let $scale;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { xStart } = $$props;
+	let { xEnd } = $$props;
+	let { yStart } = $$props;
+	let { yEnd } = $$props;
+	let { lineColor = Colors.PRIMARY } = $$props;
+	let { lineType = 1 } = $$props;
+	let { lineWidth = 1 } = $$props;
+
+	/* sanity check for input parameters */
+	if (!Array.isArray(xStart) || !Array.isArray(xEnd) || !Array.isArray(yStart) || !Array.isArray(yEnd)) {
+		throw "Segments: parameters 'xStart', 'yStart', 'xEnd' and 'yEnd' must be vectors.";
+	}
+
+	const n = xStart.length;
+
+	if (xEnd.length !== n || yStart.length !== n || yEnd.length !== n) {
+		throw "Segments: parameters 'xStart', 'yStart', 'xEnd' and 'yEnd' should have the same length.";
+	}
+
+	// get axes context and reactive variables needed to compute coordinates
+	const axes = getContext('axes');
+
+	const xLim = axes.xLim;
+	component_subscribe($$self, xLim, value => $$invalidate(21, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(19, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(20, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(18, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(17, $scale = value));
+
+	$$self.$$set = $$props => {
+		if ('xStart' in $$props) $$invalidate(10, xStart = $$props.xStart);
+		if ('xEnd' in $$props) $$invalidate(11, xEnd = $$props.xEnd);
+		if ('yStart' in $$props) $$invalidate(12, yStart = $$props.yStart);
+		if ('yEnd' in $$props) $$invalidate(13, yEnd = $$props.yEnd);
+		if ('lineColor' in $$props) $$invalidate(14, lineColor = $$props.lineColor);
+		if ('lineType' in $$props) $$invalidate(15, lineType = $$props.lineType);
+		if ('lineWidth' in $$props) $$invalidate(16, lineWidth = $$props.lineWidth);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*xStart, $xLim, $axesWidth*/ 3146752) {
+			// reactive variables for coordinates of data points in pixels (and line style)
+			$$invalidate(4, x1 = axes.scaleX(xStart, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*xEnd, $xLim, $axesWidth*/ 3147776) {
+			$$invalidate(3, x2 = axes.scaleX(xEnd, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*yStart, $yLim, $axesHeight*/ 790528) {
+			$$invalidate(2, y1 = axes.scaleY(yStart, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*yEnd, $yLim, $axesHeight*/ 794624) {
+			$$invalidate(1, y2 = axes.scaleY(yEnd, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*lineColor, lineWidth, $scale, lineType*/ 245760) {
+			$$invalidate(0, lineStyleStr = `stroke:${lineColor};stroke-width: ${lineWidth}px;stroke-dasharray:${axes.LINE_STYLES[$scale][lineType - 1]}`);
+		}
+	};
+
+	return [
+		lineStyleStr,
+		y2,
+		y1,
+		x2,
+		x1,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		xStart,
+		xEnd,
+		yStart,
+		yEnd,
+		lineColor,
+		lineType,
+		lineWidth,
+		$scale,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class Segments extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$6, create_fragment$6, safe_not_equal, {
+			xStart: 10,
+			xEnd: 11,
+			yStart: 12,
+			yEnd: 13,
+			lineColor: 14,
+			lineType: 15,
+			lineWidth: 16
+		});
+	}
+}
+
+/* src/TextLabels.svelte generated by Svelte v3.46.3 */
+
+function get_each_context$1(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[25] = list[i];
+	child_ctx[27] = i;
+	return child_ctx;
+}
+
+// (56:0) {#if x !== undefined && y !== undefined}
+function create_if_block$3(ctx) {
+	let each_1_anchor;
+	let each_value = /*x*/ ctx[6];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block$1(get_each_context$1(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			each_1_anchor = empty();
+		},
+		m(target, anchor) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(target, anchor);
+			}
+
+			insert(target, each_1_anchor, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*textStyleStr, x, y, dx, dy, textAnchors, pos, labels*/ 255) {
+				each_value = /*x*/ ctx[6];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$1(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block$1(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+		},
+		d(detaching) {
+			destroy_each(each_blocks, detaching);
+			if (detaching) detach(each_1_anchor);
+		}
+	};
+}
+
+// (57:3) {#each x as v, i}
+function create_each_block$1(ctx) {
+	let text_1;
+	let raw_value = /*labels*/ ctx[0][/*i*/ ctx[27]] + "";
+	let text_1_x_value;
+	let text_1_y_value;
+	let text_1_text_anchor_value;
+
+	return {
+		c() {
+			text_1 = svg_element("text");
+			attr(text_1, "style", /*textStyleStr*/ ctx[2]);
+			attr(text_1, "x", text_1_x_value = /*x*/ ctx[6][/*i*/ ctx[27]]);
+			attr(text_1, "y", text_1_y_value = /*y*/ ctx[5][/*i*/ ctx[27]]);
+			attr(text_1, "dx", /*dx*/ ctx[4]);
+			attr(text_1, "dy", /*dy*/ ctx[3]);
+			attr(text_1, "dominant-baseline", "middle");
+			attr(text_1, "text-anchor", text_1_text_anchor_value = /*textAnchors*/ ctx[7][/*pos*/ ctx[1]]);
+		},
+		m(target, anchor) {
+			insert(target, text_1, anchor);
+			text_1.innerHTML = raw_value;
+		},
+		p(ctx, dirty) {
+			if (dirty & /*labels*/ 1 && raw_value !== (raw_value = /*labels*/ ctx[0][/*i*/ ctx[27]] + "")) text_1.innerHTML = raw_value;
+			if (dirty & /*textStyleStr*/ 4) {
+				attr(text_1, "style", /*textStyleStr*/ ctx[2]);
+			}
+
+			if (dirty & /*x*/ 64 && text_1_x_value !== (text_1_x_value = /*x*/ ctx[6][/*i*/ ctx[27]])) {
+				attr(text_1, "x", text_1_x_value);
+			}
+
+			if (dirty & /*y*/ 32 && text_1_y_value !== (text_1_y_value = /*y*/ ctx[5][/*i*/ ctx[27]])) {
+				attr(text_1, "y", text_1_y_value);
+			}
+
+			if (dirty & /*dx*/ 16) {
+				attr(text_1, "dx", /*dx*/ ctx[4]);
+			}
+
+			if (dirty & /*dy*/ 8) {
+				attr(text_1, "dy", /*dy*/ ctx[3]);
+			}
+
+			if (dirty & /*pos*/ 2 && text_1_text_anchor_value !== (text_1_text_anchor_value = /*textAnchors*/ ctx[7][/*pos*/ ctx[1]])) {
+				attr(text_1, "text-anchor", text_1_text_anchor_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(text_1);
+		}
+	};
+}
+
+function create_fragment$5(ctx) {
+	let if_block_anchor;
+	let if_block = /*x*/ ctx[6] !== undefined && /*y*/ ctx[5] !== undefined && create_if_block$3(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*x*/ ctx[6] !== undefined && /*y*/ ctx[5] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$3(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$5($$self, $$props, $$invalidate) {
+	let x;
+	let y;
+	let dx;
+	let dy;
+	let textStyleStr;
+	let $scale;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { xValues } = $$props;
+	let { yValues } = $$props;
+	let { labels } = $$props;
+	let { pos = 0 } = $$props;
+	let { faceColor = Colors.PRIMARY_TEXT } = $$props;
+	let { borderColor = "transparent" } = $$props;
+	let { borderWidth = 0 } = $$props;
+	let { textSize = 1 } = $$props;
+
+	// text-anchor values depending on position
+	const textAnchors = ["middle", "middle", "start", "middle", "end"];
+
+	/* sanity check for input parameters */
+	if (!Array.isArray(xValues) || !Array.isArray(yValues) || xValues.length !== yValues.length) {
+		throw "TextLabels: parameters 'xValues' and 'yValues' must be vectors of the same length.";
+	}
+
+	// get axes context and reactive variables needed to compute coordinates
+	const axes = getContext('axes');
+
+	const xLim = axes.xLim;
+	component_subscribe($$self, xLim, value => $$invalidate(23, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(21, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(22, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(20, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(19, $scale = value));
+
+	$$self.$$set = $$props => {
+		if ('xValues' in $$props) $$invalidate(13, xValues = $$props.xValues);
+		if ('yValues' in $$props) $$invalidate(14, yValues = $$props.yValues);
+		if ('labels' in $$props) $$invalidate(0, labels = $$props.labels);
+		if ('pos' in $$props) $$invalidate(1, pos = $$props.pos);
+		if ('faceColor' in $$props) $$invalidate(15, faceColor = $$props.faceColor);
+		if ('borderColor' in $$props) $$invalidate(16, borderColor = $$props.borderColor);
+		if ('borderWidth' in $$props) $$invalidate(17, borderWidth = $$props.borderWidth);
+		if ('textSize' in $$props) $$invalidate(18, textSize = $$props.textSize);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*xValues, labels*/ 8193) {
+			// multiply labels values if needed
+			{
+				const n = xValues.length;
+				if (!Array.isArray(labels)) $$invalidate(0, labels = Array(n).fill(labels));
+
+				// workaround for an issue when xValues and yValues are changed in parent app
+				// but array of labels is still the same as in the
+				if (labels.length != n) $$invalidate(0, labels = Array(n).fill(labels[0]));
+
+				// check that the length of labels vector is correct
+				if (labels.length !== n) {
+					throw "TextLabels: parameter 'labels' must be a single text value or a vector of the same size as 'x' and 'y'.";
+				}
+			}
+		}
+
+		if ($$self.$$.dirty & /*xValues, $xLim, $axesWidth*/ 12591104) {
+			// reactive variables for coordinates of data points in pixels
+			$$invalidate(6, x = axes.scaleX(xValues, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*yValues, $yLim, $axesHeight*/ 3162112) {
+			$$invalidate(5, y = axes.scaleY(yValues, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*pos, $scale*/ 524290) {
+			$$invalidate(4, dx = [0, 0, 1, 0, -1][pos] * axes.LABELS_MARGIN[$scale]);
+		}
+
+		if ($$self.$$.dirty & /*pos, $scale*/ 524290) {
+			$$invalidate(3, dy = [0, 1, 0, -1, 0][pos] * axes.LABELS_MARGIN[$scale]);
+		}
+
+		if ($$self.$$.dirty & /*faceColor, borderWidth, borderColor, textSize*/ 491520) {
+			// styles for bars and labels
+			$$invalidate(2, textStyleStr = `fill:${faceColor};stroke-width:${borderWidth}px;stroke:${borderColor};font-size:${textSize}em;`);
+		}
+	};
+
+	return [
+		labels,
+		pos,
+		textStyleStr,
+		dy,
+		dx,
+		y,
+		x,
+		textAnchors,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		xValues,
+		yValues,
+		faceColor,
+		borderColor,
+		borderWidth,
+		textSize,
+		$scale,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class TextLabels extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$5, create_fragment$5, safe_not_equal, {
+			xValues: 13,
+			yValues: 14,
+			labels: 0,
+			pos: 1,
+			faceColor: 15,
+			borderColor: 16,
+			borderWidth: 17,
+			textSize: 18
+		});
+	}
+}
+
+/* src/TextLegend.svelte generated by Svelte v3.46.3 */
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[22] = list[i];
+	child_ctx[24] = i;
+	return child_ctx;
+}
+
+// (32:0) {#if x !== undefined && y !== undefined && elements.length > 0}
+function create_if_block$2(ctx) {
+	let text_1;
+	let each_value = /*elements*/ ctx[2];
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
+	}
+
+	return {
+		c() {
+			text_1 = svg_element("text");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			attr(text_1, "style", /*textStyleStr*/ ctx[3]);
+			attr(text_1, "x", /*x*/ ctx[5]);
+			attr(text_1, "y", /*y*/ ctx[4]);
+			attr(text_1, "dx", /*dx*/ ctx[0]);
+			attr(text_1, "dy", /*dy*/ ctx[1]);
+			attr(text_1, "dominant-baseline", "middle");
+			attr(text_1, "text-anchor", "start");
+		},
+		m(target, anchor) {
+			insert(target, text_1, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(text_1, null);
+			}
+		},
+		p(ctx, dirty) {
+			if (dirty & /*x, dx, dy, elements*/ 39) {
+				each_value = /*elements*/ ctx[2];
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(text_1, null);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+
+			if (dirty & /*textStyleStr*/ 8) {
+				attr(text_1, "style", /*textStyleStr*/ ctx[3]);
+			}
+
+			if (dirty & /*x*/ 32) {
+				attr(text_1, "x", /*x*/ ctx[5]);
+			}
+
+			if (dirty & /*y*/ 16) {
+				attr(text_1, "y", /*y*/ ctx[4]);
+			}
+
+			if (dirty & /*dx*/ 1) {
+				attr(text_1, "dx", /*dx*/ ctx[0]);
+			}
+
+			if (dirty & /*dy*/ 2) {
+				attr(text_1, "dy", /*dy*/ ctx[1]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(text_1);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+}
+
+// (34:6) {#each elements as el, i}
+function create_each_block(ctx) {
+	let tspan;
+	let raw_value = /*el*/ ctx[22] + "";
+	let tspan_dy_value;
+
+	return {
+		c() {
+			tspan = svg_element("tspan");
+			attr(tspan, "x", /*x*/ ctx[5]);
+			attr(tspan, "dx", /*dx*/ ctx[0]);
+			attr(tspan, "dy", tspan_dy_value = /*i*/ ctx[24] === 0 ? 0 : /*dy*/ ctx[1]);
+		},
+		m(target, anchor) {
+			insert(target, tspan, anchor);
+			tspan.innerHTML = raw_value;
+		},
+		p(ctx, dirty) {
+			if (dirty & /*elements*/ 4 && raw_value !== (raw_value = /*el*/ ctx[22] + "")) tspan.innerHTML = raw_value;
+			if (dirty & /*x*/ 32) {
+				attr(tspan, "x", /*x*/ ctx[5]);
+			}
+
+			if (dirty & /*dx*/ 1) {
+				attr(tspan, "dx", /*dx*/ ctx[0]);
+			}
+
+			if (dirty & /*dy*/ 2 && tspan_dy_value !== (tspan_dy_value = /*i*/ ctx[24] === 0 ? 0 : /*dy*/ ctx[1])) {
+				attr(tspan, "dy", tspan_dy_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(tspan);
+		}
+	};
+}
+
+function create_fragment$4(ctx) {
+	let if_block_anchor;
+	let if_block = /*x*/ ctx[5] !== undefined && /*y*/ ctx[4] !== undefined && /*elements*/ ctx[2].length > 0 && create_if_block$2(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*x*/ ctx[5] !== undefined && /*y*/ ctx[4] !== undefined && /*elements*/ ctx[2].length > 0) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$2(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$4($$self, $$props, $$invalidate) {
+	let x;
+	let y;
+	let textStyleStr;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { left } = $$props;
+	let { top } = $$props;
+	let { dx = "0" } = $$props;
+	let { dy = "1.25em" } = $$props;
+	let { elements } = $$props;
+	let { faceColor = Colors.PRIMARY_TEXT } = $$props;
+	let { borderColor = "transparent" } = $$props;
+	let { borderWidth = 0 } = $$props;
+	let { textSize = 1 } = $$props;
+
+	// get axes context and reactive variables needed to compute coordinates
+	const axes = getContext('axes');
+
+	const xLim = axes.xLim;
+	component_subscribe($$self, xLim, value => $$invalidate(19, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(17, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(18, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(16, $axesHeight = value));
+	axes.scale;
+
+	$$self.$$set = $$props => {
+		if ('left' in $$props) $$invalidate(10, left = $$props.left);
+		if ('top' in $$props) $$invalidate(11, top = $$props.top);
+		if ('dx' in $$props) $$invalidate(0, dx = $$props.dx);
+		if ('dy' in $$props) $$invalidate(1, dy = $$props.dy);
+		if ('elements' in $$props) $$invalidate(2, elements = $$props.elements);
+		if ('faceColor' in $$props) $$invalidate(12, faceColor = $$props.faceColor);
+		if ('borderColor' in $$props) $$invalidate(13, borderColor = $$props.borderColor);
+		if ('borderWidth' in $$props) $$invalidate(14, borderWidth = $$props.borderWidth);
+		if ('textSize' in $$props) $$invalidate(15, textSize = $$props.textSize);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*left, $xLim, $axesWidth*/ 787456) {
+			// reactive variables for coordinates of data points in pixels
+			$$invalidate(5, x = axes.scaleX([left], $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*top, $yLim, $axesHeight*/ 198656) {
+			$$invalidate(4, y = axes.scaleY([top], $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*faceColor, borderWidth, borderColor, textSize*/ 61440) {
+			// styles for bars and labels
+			$$invalidate(3, textStyleStr = `fill:${faceColor};stroke-width:${borderWidth}px;stroke:${borderColor};font-size:${textSize}em;`);
+		}
+	};
+
+	return [
+		dx,
+		dy,
+		elements,
+		textStyleStr,
+		y,
+		x,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		left,
+		top,
+		faceColor,
+		borderColor,
+		borderWidth,
+		textSize,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class TextLegend extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$4, create_fragment$4, safe_not_equal, {
+			left: 10,
+			top: 11,
+			dx: 0,
+			dy: 1,
+			elements: 2,
+			faceColor: 12,
+			borderColor: 13,
+			borderWidth: 14,
+			textSize: 15
+		});
+	}
+}
+
+/**********************************************
+ * Functions for statistical tests            *
+ **********************************************/
+
+
+/**
+ * Finds smallest value in a vector
+ * @param {number[]} x - vector with values
+ * @returns {number}
+ */
+function min(x) {
+   let n = x.length;
+   let min = Number.POSITIVE_INFINITY;
+
+   while (n--) min = x[n] < min ? x[n] : min;
+   return min;
+}
+
+
+/**
+ * Finds largest value in a vector
+ * @param {number[]} x - vector with values
+ * @returns {number}
+ */
+function max(x) {
+   let n = x.length;
+   let max = Number.NEGATIVE_INFINITY;
+
+   while (n--) max = x[n] > max ? x[n] : max;
+   return max;
+}
+
+
+/**
+ * Computes a range of values in a vector with a margin
+ * @param {number[]} x - vector with values
+ * @param {number} margin - margin in parts of one (e.g. 0.1 for 10% or 2 for 200%)
+ * @returns{number[]} array with marginal range boundaries
+ */
+function mrange(x, margin = 0.05) {
+   const mn = min(x);
+   const mx = max(x);
+   const d = mx - mn;
+
+   return [mn - d * margin, max(x) + d * margin];
+}
+
+
+/**
+ * Computes difference between all adjacent values in a vector
+ * @param {number[]} x - vector with values
+ * @returns {number[]} vector with the differences
+ */
+function diff(x) {
+   return x.slice(1).map( (y, i) => (y - x[i]));
+}
+
+/* src/BarSeries.svelte generated by Svelte v3.46.3 */
+
+function add_css$1(target) {
+	append_styles(target, "svelte-kw726w", ".series_bar > rect{stroke-width:1px}.series_bar > rect:hover{opacity:90%}");
+}
+
+function create_fragment$3(ctx) {
+	let g;
+	let rectangles;
+	let current;
+
+	rectangles = new Rectangles({
+			props: {
+				left: /*left*/ ctx[4],
+				top: /*top*/ ctx[5],
+				width: /*width*/ ctx[3],
+				height: /*height*/ ctx[6],
+				borderColor: /*borderColor*/ ctx[2],
+				faceColor: /*faceColor*/ ctx[1]
+			}
+		});
+
+	return {
+		c() {
+			g = svg_element("g");
+			create_component(rectangles.$$.fragment);
+			attr(g, "class", "series series_bar");
+			attr(g, "title", /*title*/ ctx[0]);
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+			mount_component(rectangles, g, null);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			const rectangles_changes = {};
+			if (dirty & /*left*/ 16) rectangles_changes.left = /*left*/ ctx[4];
+			if (dirty & /*top*/ 32) rectangles_changes.top = /*top*/ ctx[5];
+			if (dirty & /*width*/ 8) rectangles_changes.width = /*width*/ ctx[3];
+			if (dirty & /*height*/ 64) rectangles_changes.height = /*height*/ ctx[6];
+			if (dirty & /*borderColor*/ 4) rectangles_changes.borderColor = /*borderColor*/ ctx[2];
+			if (dirty & /*faceColor*/ 2) rectangles_changes.faceColor = /*faceColor*/ ctx[1];
+			rectangles.$set(rectangles_changes);
+
+			if (!current || dirty & /*title*/ 1) {
+				attr(g, "title", /*title*/ ctx[0]);
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(rectangles.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(rectangles.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+			destroy_component(rectangles);
+		}
+	};
+}
+
+function instance$3($$self, $$props, $$invalidate) {
+	let { xValues } = $$props;
+	let { yValues } = $$props;
+	let { barWidth = 0.8 } = $$props;
+	let { title = "" } = $$props;
+	let { faceColor = Colors.PRIMARY } = $$props;
+	let { borderColor = Colors.PRIMARY } = $$props;
+	let { showLabels = "no" } = $$props;
+
+	// TODO: implemented later
+	//export let labels = yValues;
+	/* internal parameters */
+	let width;
+
+	let left;
+	let top;
+	let height;
+
+	// to access shared parameters and methods from Axes
+	const axes = getContext('axes');
+
+	$$self.$$set = $$props => {
+		if ('xValues' in $$props) $$invalidate(7, xValues = $$props.xValues);
+		if ('yValues' in $$props) $$invalidate(8, yValues = $$props.yValues);
+		if ('barWidth' in $$props) $$invalidate(9, barWidth = $$props.barWidth);
+		if ('title' in $$props) $$invalidate(0, title = $$props.title);
+		if ('faceColor' in $$props) $$invalidate(1, faceColor = $$props.faceColor);
+		if ('borderColor' in $$props) $$invalidate(2, borderColor = $$props.borderColor);
+		if ('showLabels' in $$props) $$invalidate(10, showLabels = $$props.showLabels);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*xValues, barWidth, width*/ 648) {
+			/* reactive actions related to x-values, fires when there are changes in:
+ * - xValues
+ * - barWidth
+ */
+			{
+				if (!Array.isArray(xValues)) {
+					throw "BarSeries: parameter 'xValues' must be a numeric vector.";
+				}
+
+				if (barWidth <= 0 || barWidth > 1) {
+					throw "BarSeries: parameters 'barWidth' should be between 0 and 1.";
+				}
+
+				const xValuesRange = mrange(xValues, 0.1);
+				xValuesRange[0] = xValuesRange[0] - barWidth * diff(xValuesRange) / xValues.length * 0.5;
+				xValuesRange[1] = xValuesRange[1] + barWidth * diff(xValuesRange) / xValues.length * 0.5;
+				axes.adjustXAxisLimits(xValuesRange);
+				$$invalidate(3, width = Array(xValues.length).fill(max(diff(xValues)) * barWidth));
+				$$invalidate(4, left = xValues.map((v, i) => v - width[i] / 2));
+			}
+		}
+
+		if ($$self.$$.dirty & /*yValues, xValues, showLabels*/ 1408) {
+			/* reactive actions related to y-values, fires when there are changes in:
+ * - yValues
+ */
+			{
+				if (!Array.isArray(yValues) || xValues.length != yValues.length) {
+					throw "BarSeries: parameter 'yValues' must be a numeric vector of the same length as 'xValues'.";
+				}
+
+				const yValuesRange = mrange(yValues, showLabels === "no" ? 0.05 : 0.20);
+				axes.adjustYAxisLimits(yValuesRange);
+				$$invalidate(5, top = yValues.map(v => v > 0 ? v : 0));
+				$$invalidate(6, height = yValues.map(v => Math.abs(v)));
+			}
+		}
+	};
+
+	return [
+		title,
+		faceColor,
+		borderColor,
+		width,
+		left,
+		top,
+		height,
+		xValues,
+		yValues,
+		barWidth,
+		showLabels
+	];
+}
+
+class BarSeries extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance$3,
+			create_fragment$3,
+			safe_not_equal,
+			{
+				xValues: 7,
+				yValues: 8,
+				barWidth: 9,
+				title: 0,
+				faceColor: 1,
+				borderColor: 2,
+				showLabels: 10
+			},
+			add_css$1
+		);
+	}
+}
+
+/* src/ScatterSeries.svelte generated by Svelte v3.46.3 */
+
+function add_css(target) {
+	append_styles(target, "svelte-11a4d2d", ".marker{font-size:1em;cursor:default}.marker:hover{opacity:90%}.series_scatter > *:hover + .labels_hover{visibility:visible;opacity:1}");
+}
+
+function create_fragment$2(ctx) {
+	let g;
+	let textlabels;
+	let current;
+
+	textlabels = new TextLabels({
+			props: {
+				xValues: /*xValues*/ ctx[0],
+				yValues: /*yValues*/ ctx[1],
+				labels: /*markerSymbol*/ ctx[7],
+				textSize: /*markerSize*/ ctx[6],
+				faceColor: /*faceColor*/ ctx[3],
+				borderColor: /*borderColor*/ ctx[4],
+				borderWidth: /*borderWidth*/ ctx[5]
+			}
+		});
+
+	return {
+		c() {
+			g = svg_element("g");
+			create_component(textlabels.$$.fragment);
+			attr(g, "class", "series series_scatter");
+			attr(g, "title", /*title*/ ctx[2]);
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+			mount_component(textlabels, g, null);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			const textlabels_changes = {};
+			if (dirty & /*xValues*/ 1) textlabels_changes.xValues = /*xValues*/ ctx[0];
+			if (dirty & /*yValues*/ 2) textlabels_changes.yValues = /*yValues*/ ctx[1];
+			if (dirty & /*markerSymbol*/ 128) textlabels_changes.labels = /*markerSymbol*/ ctx[7];
+			if (dirty & /*markerSize*/ 64) textlabels_changes.textSize = /*markerSize*/ ctx[6];
+			if (dirty & /*faceColor*/ 8) textlabels_changes.faceColor = /*faceColor*/ ctx[3];
+			if (dirty & /*borderColor*/ 16) textlabels_changes.borderColor = /*borderColor*/ ctx[4];
+			if (dirty & /*borderWidth*/ 32) textlabels_changes.borderWidth = /*borderWidth*/ ctx[5];
+			textlabels.$set(textlabels_changes);
+
+			if (!current || dirty & /*title*/ 4) {
+				attr(g, "title", /*title*/ ctx[2]);
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(textlabels.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(textlabels.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+			destroy_component(textlabels);
+		}
+	};
+}
+
+function instance$2($$self, $$props, $$invalidate) {
+	let { xValues } = $$props;
+	let { yValues } = $$props;
+	let { marker = 1 } = $$props;
+	let { title = "" } = $$props;
+	let { faceColor = "transparent" } = $$props;
+	let { borderColor = Colors.PRIMARY } = $$props;
+	let { borderWidth = 1 } = $$props;
+	let { markerSize = 1 } = $$props;
+
+	// TODO: implement later
+	//export let labels = yValues;
+	//export let showLabels = "no"; // can be "no", "hover", "always"
+	const markers = ["●", "◼", "▲", "▼", "⬥", "+", "*", "⨯"];
+
+	let markerSymbol;
+
+	/* sanity check of input parameters */
+	if (typeof marker !== "number" || marker < 1 || marker > markers.length) {
+		throw `ScatterSeries: parameter 'marker' must be a number from 1 to ${markers.length}."`;
+	}
+
+	// to access shared parameters and methods from Axes
+	const axes = getContext('axes');
+
+	$$self.$$set = $$props => {
+		if ('xValues' in $$props) $$invalidate(0, xValues = $$props.xValues);
+		if ('yValues' in $$props) $$invalidate(1, yValues = $$props.yValues);
+		if ('marker' in $$props) $$invalidate(8, marker = $$props.marker);
+		if ('title' in $$props) $$invalidate(2, title = $$props.title);
+		if ('faceColor' in $$props) $$invalidate(3, faceColor = $$props.faceColor);
+		if ('borderColor' in $$props) $$invalidate(4, borderColor = $$props.borderColor);
+		if ('borderWidth' in $$props) $$invalidate(5, borderWidth = $$props.borderWidth);
+		if ('markerSize' in $$props) $$invalidate(6, markerSize = $$props.markerSize);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*xValues, marker*/ 257) {
+			/* reactive actions related to x-values, fires when there are changes in:
+ * - xValues
+ * - marker
+ */
+			{
+				if (!Array.isArray(xValues)) {
+					throw "ScatterSeries: parameter 'xValues' must be a numeric vector.";
+				}
+
+				const xValuesRange = mrange(xValues, 0.05);
+				axes.adjustXAxisLimits(xValuesRange);
+				$$invalidate(7, markerSymbol = "");
+				$$invalidate(7, markerSymbol = markers[marker - 1]);
+			}
+		}
+
+		if ($$self.$$.dirty & /*yValues, xValues*/ 3) {
+			/* reactive actions related to y-values, fires when there are changes in:
+ * - yValues
+ */
+			{
+				if (!Array.isArray(yValues) || xValues.length != yValues.length) {
+					throw "BarSeries: parameter 'yValues' must be a numeric vector of the same length as 'xValues'.";
+				}
+
+				const yValuesRange = mrange(yValues, 0.05);
+				axes.adjustYAxisLimits(yValuesRange);
+			}
+		}
+	};
+
+	return [
+		xValues,
+		yValues,
+		title,
+		faceColor,
+		borderColor,
+		borderWidth,
+		markerSize,
+		markerSymbol,
+		marker
+	];
+}
+
+class ScatterSeries extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance$2,
+			create_fragment$2,
+			safe_not_equal,
+			{
+				xValues: 0,
+				yValues: 1,
+				marker: 8,
+				title: 2,
+				faceColor: 3,
+				borderColor: 4,
+				borderWidth: 5,
+				markerSize: 6
+			},
+			add_css
+		);
+	}
+}
+
+/* src/LineSeries.svelte generated by Svelte v3.46.3 */
+
+function create_if_block$1(ctx) {
+	let g;
+	let polyline;
+
+	return {
+		c() {
+			g = svg_element("g");
+			polyline = svg_element("polyline");
+			attr(polyline, "class", "line");
+			attr(polyline, "points", /*p*/ ctx[2]);
+			attr(g, "class", "series lineseries");
+			attr(g, "style", /*lineStyleStr*/ ctx[1]);
+			attr(g, "title", /*title*/ ctx[0]);
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+			append(g, polyline);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*p*/ 4) {
+				attr(polyline, "points", /*p*/ ctx[2]);
+			}
+
+			if (dirty & /*lineStyleStr*/ 2) {
+				attr(g, "style", /*lineStyleStr*/ ctx[1]);
+			}
+
+			if (dirty & /*title*/ 1) {
+				attr(g, "title", /*title*/ ctx[0]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+		}
+	};
+}
+
+function create_fragment$1(ctx) {
+	let if_block_anchor;
+	let if_block = /*p*/ ctx[2] !== undefined && create_if_block$1(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*p*/ ctx[2] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$1(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$1($$self, $$props, $$invalidate) {
+	let x;
+	let y;
+	let p;
+	let lineStyleStr;
+	let $scale;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { xValues } = $$props;
+	let { yValues } = $$props;
+	let { title = "" } = $$props;
+	let { lineWidth = 1 } = $$props;
+	let { lineColor = Colors.PRIMARY } = $$props;
+	let { lineType = 1 } = $$props;
+
+	/* sanity check of input parameters */
+	if (!Array.isArray(xValues) || !Array.isArray(yValues) || xValues.length != yValues.length) {
+		throw "LineSeries: parameters 'xValues' and 'yValues' must be numeric vectors of the same length.";
+	}
+
+	// compute ranges for x and y values
+	const xValuesRange = mrange(xValues, 0.05);
+
+	const yValuesRange = mrange(yValues, 0.05);
+
+	// get axes context and adjust axes limits
+	const axes = getContext('axes');
+
+	axes.adjustXAxisLimits(xValuesRange);
+	axes.adjustYAxisLimits(yValuesRange);
+
+	// get reactive variables needed to compute coordinates
+	const xLim = axes.xLim;
+
+	component_subscribe($$self, xLim, value => $$invalidate(19, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(17, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(18, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(16, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(15, $scale = value));
+
+	$$self.$$set = $$props => {
+		if ('xValues' in $$props) $$invalidate(8, xValues = $$props.xValues);
+		if ('yValues' in $$props) $$invalidate(9, yValues = $$props.yValues);
+		if ('title' in $$props) $$invalidate(0, title = $$props.title);
+		if ('lineWidth' in $$props) $$invalidate(10, lineWidth = $$props.lineWidth);
+		if ('lineColor' in $$props) $$invalidate(11, lineColor = $$props.lineColor);
+		if ('lineType' in $$props) $$invalidate(12, lineType = $$props.lineType);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*xValues, $xLim, $axesWidth*/ 786688) {
+			// reactive variables for coordinates of data points in pixels
+			$$invalidate(14, x = axes.scaleX(xValues, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*yValues, $yLim, $axesHeight*/ 197120) {
+			$$invalidate(13, y = axes.scaleY(yValues, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*x, y*/ 24576) {
+			$$invalidate(2, p = x !== undefined && y !== undefined
+			? x.map((v, i) => `${v},${y[i]}`).join(' ')
+			: undefined);
+		}
+
+		if ($$self.$$.dirty & /*lineColor, lineWidth, $scale, lineType*/ 39936) {
+			$$invalidate(1, lineStyleStr = `fill:transparent;stroke:${lineColor};stroke-width: ${lineWidth}px;stroke-dasharray:${axes.LINE_STYLES[$scale][lineType - 1]}`);
+		}
+	};
+
+	return [
+		title,
+		lineStyleStr,
+		p,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		xValues,
+		yValues,
+		lineWidth,
+		lineColor,
+		lineType,
+		y,
+		x,
+		$scale,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class LineSeries extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance$1, create_fragment$1, safe_not_equal, {
+			xValues: 8,
+			yValues: 9,
+			title: 0,
+			lineWidth: 10,
+			lineColor: 11,
+			lineType: 12
+		});
+	}
+}
+
+/* src/AreaSeries.svelte generated by Svelte v3.46.3 */
+
+function create_if_block(ctx) {
+	let g;
+	let polygon;
+	let polygon_points_value;
+
+	return {
+		c() {
+			g = svg_element("g");
+			polygon = svg_element("polygon");
+			attr(polygon, "points", polygon_points_value = /*x*/ ctx[1][0] + "," + /*y0*/ ctx[4] + " " + /*p*/ ctx[3] + " " + /*x*/ ctx[1][/*x*/ ctx[1].length - 1] + "," + /*y0*/ ctx[4][0]);
+			attr(g, "class", "series lineseries");
+			attr(g, "style", /*areaStyleStr*/ ctx[2]);
+			attr(g, "title", /*title*/ ctx[0]);
+		},
+		m(target, anchor) {
+			insert(target, g, anchor);
+			append(g, polygon);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*x, y0, p*/ 26 && polygon_points_value !== (polygon_points_value = /*x*/ ctx[1][0] + "," + /*y0*/ ctx[4] + " " + /*p*/ ctx[3] + " " + /*x*/ ctx[1][/*x*/ ctx[1].length - 1] + "," + /*y0*/ ctx[4][0])) {
+				attr(polygon, "points", polygon_points_value);
+			}
+
+			if (dirty & /*areaStyleStr*/ 4) {
+				attr(g, "style", /*areaStyleStr*/ ctx[2]);
+			}
+
+			if (dirty & /*title*/ 1) {
+				attr(g, "title", /*title*/ ctx[0]);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(g);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let if_block_anchor;
+	let if_block = /*p*/ ctx[3] !== undefined && create_if_block(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*p*/ ctx[3] !== undefined) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let y0;
+	let x;
+	let y;
+	let p;
+	let areaStyleStr;
+	let $scale;
+	let $axesHeight;
+	let $yLim;
+	let $axesWidth;
+	let $xLim;
+	let { xValues } = $$props;
+	let { yValues } = $$props;
+	let { title = "" } = $$props;
+	let { lineWidth = 1 } = $$props;
+	let { lineColor = Colors.PRIMARY } = $$props;
+	let { fillColor = Colors.PRIMARY } = $$props;
+	let { opacity = 1 } = $$props;
+	let { lineType = 1 } = $$props;
+
+	/* sanity check of input parameters */
+	if (!Array.isArray(xValues) || !Array.isArray(yValues) || xValues.length != yValues.length) {
+		throw "AreaSeries: parameters 'xValues' and 'yValues' must be numeric vectors of the same length.";
+	}
+
+	// compute ranges for x and y values
+	const xValuesRange = mrange(xValues, 0.05);
+
+	const yValuesRange = mrange(yValues, 0.05);
+
+	// get axes context and adjust axes limits
+	const axes = getContext('axes');
+
+	axes.adjustXAxisLimits(xValuesRange);
+	axes.adjustYAxisLimits(yValuesRange);
+
+	// get reactive variables needed to compute coordinates
+	const xLim = axes.xLim;
+
+	component_subscribe($$self, xLim, value => $$invalidate(22, $xLim = value));
+	const yLim = axes.yLim;
+	component_subscribe($$self, yLim, value => $$invalidate(20, $yLim = value));
+	const axesWidth = axes.width;
+	component_subscribe($$self, axesWidth, value => $$invalidate(21, $axesWidth = value));
+	const axesHeight = axes.height;
+	component_subscribe($$self, axesHeight, value => $$invalidate(19, $axesHeight = value));
+	const scale = axes.scale;
+	component_subscribe($$self, scale, value => $$invalidate(18, $scale = value));
+
+	$$self.$$set = $$props => {
+		if ('xValues' in $$props) $$invalidate(10, xValues = $$props.xValues);
+		if ('yValues' in $$props) $$invalidate(11, yValues = $$props.yValues);
+		if ('title' in $$props) $$invalidate(0, title = $$props.title);
+		if ('lineWidth' in $$props) $$invalidate(12, lineWidth = $$props.lineWidth);
+		if ('lineColor' in $$props) $$invalidate(13, lineColor = $$props.lineColor);
+		if ('fillColor' in $$props) $$invalidate(14, fillColor = $$props.fillColor);
+		if ('opacity' in $$props) $$invalidate(15, opacity = $$props.opacity);
+		if ('lineType' in $$props) $$invalidate(16, lineType = $$props.lineType);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*$yLim, $axesHeight*/ 1572864) {
+			// reactive variables for coordinates of data points in pixels
+			$$invalidate(4, y0 = axes.scaleY([0], $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*xValues, $xLim, $axesWidth*/ 6292480) {
+			$$invalidate(1, x = axes.scaleX(xValues, $xLim, $axesWidth));
+		}
+
+		if ($$self.$$.dirty & /*yValues, $yLim, $axesHeight*/ 1574912) {
+			$$invalidate(17, y = axes.scaleY(yValues, $yLim, $axesHeight));
+		}
+
+		if ($$self.$$.dirty & /*x, y*/ 131074) {
+			$$invalidate(3, p = x !== undefined && y !== undefined
+			? x.map((v, i) => `${v},${y[i]}`).join(' ')
+			: undefined);
+		}
+
+		if ($$self.$$.dirty & /*opacity, fillColor, lineColor, lineWidth, $scale, lineType*/ 389120) {
+			$$invalidate(2, areaStyleStr = `opacity:${opacity};fill:${fillColor};stroke:${lineColor};stroke-width: ${lineWidth}px;stroke-dasharray:${axes.LINE_STYLES[$scale][lineType - 1]}`);
+		}
+	};
+
+	return [
+		title,
+		x,
+		areaStyleStr,
+		p,
+		y0,
+		xLim,
+		yLim,
+		axesWidth,
+		axesHeight,
+		scale,
+		xValues,
+		yValues,
+		lineWidth,
+		lineColor,
+		fillColor,
+		opacity,
+		lineType,
+		y,
+		$scale,
+		$axesHeight,
+		$yLim,
+		$axesWidth,
+		$xLim
+	];
+}
+
+class AreaSeries extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance, create_fragment, safe_not_equal, {
+			xValues: 10,
+			yValues: 11,
+			title: 0,
+			lineWidth: 12,
+			lineColor: 13,
+			fillColor: 14,
+			opacity: 15,
+			lineType: 16
+		});
+	}
+}
+
+export { AreaSeries, Axes, BarSeries, Box, Colors, LineSeries, Rectangles, ScatterSeries, Segments, TextLabels, TextLegend, XAxis, YAxis };