cx 23.4.3 → 23.4.4

package/dist/svg.js

@@ -0,0 +1,807 @@
+import { isNumber, isArray, innerTextTrim, addEventListenerWithOptions } from "cx/util";
+import { PureContainer, Widget, ResizeManager, VDOM } from "cx/ui";
+import { jsxs, jsx } from "react/jsx-runtime";
+
+var Rect = /*#__PURE__*/ (function () {
+	function Rect(config) {
+		Object.assign(this, config);
+	}
+	var _proto = Rect.prototype;
+	_proto.width = function width() {
+		return this.r - this.l;
+	};
+	_proto.height = function height() {
+		return this.b - this.t;
+	};
+	_proto.valid = function valid() {
+		return this.r > this.l && this.b > this.t;
+	};
+	_proto.makeValid = function makeValid() {
+		return new Rect({
+			l: Math.min(this.l, this.r),
+			r: Math.max(this.l, this.r),
+			t: Math.min(this.t, this.b),
+			b: Math.max(this.t, this.b),
+		});
+	};
+	_proto.isEqual = function isEqual(r) {
+		if (!r || !r.isRect) return false;
+		return r.l == this.l && r.r == this.r && r.t == this.t && r.b == this.b;
+	};
+	Rect.add = function add(a, b) {
+		return new Rect({
+			l: a.l + b.l,
+			t: a.t + b.t,
+			r: a.r + b.r,
+			b: a.b + b.b,
+		});
+	};
+	Rect.multiply = function multiply(a, b) {
+		return new Rect({
+			l: a.l + (a.r - a.l) * b.l,
+			r: a.l + (a.r - a.l) * b.r,
+			t: a.t + (a.b - a.t) * b.t,
+			b: a.t + (a.b - a.t) * b.b,
+		});
+	};
+	Rect.margin = function margin(r, m) {
+		var mr = Rect.convertMargin(m);
+		return Rect.add(r, mr);
+	};
+	Rect.convertMargin = function convertMargin(m) {
+		if (!m) return new Rect();
+		if (m.isRect) return m;
+		if (isNumber(m))
+			return new Rect({
+				l: m,
+				t: m,
+				r: -m,
+				b: -m,
+			});
+		var m = Rect.convert(m);
+		m.b = -m.b;
+		m.r = -m.r;
+		return m;
+	};
+	Rect.convert = function convert(r) {
+		if (!r)
+			return new Rect({
+				l: 0,
+				r: 0,
+				t: 0,
+				b: 0,
+			});
+		if (r.isRect) return r;
+		if (typeof r === "string") r = r.split(" ");
+		if (isArray(r)) {
+			return new Rect({
+				t: parseFloat(r[0]),
+				r: parseFloat(r[1]),
+				b: parseFloat(r[2]),
+				l: parseFloat(r[3]),
+			});
+		}
+		return new Rect(r);
+	};
+	return Rect;
+})();
+Rect.prototype.isRect = true;
+Rect.prototype.l = 0; //left;
+Rect.prototype.r = 0; //right
+Rect.prototype.t = 0; //top
+Rect.prototype.b = 0; //bottom
+
+function ownKeys(object, enumerableOnly) {
+	var keys = Object.keys(object);
+	if (Object.getOwnPropertySymbols) {
+		var symbols = Object.getOwnPropertySymbols(object);
+		enumerableOnly &&
+			(symbols = symbols.filter(function (sym) {
+				return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+			})),
+			keys.push.apply(keys, symbols);
+	}
+	return keys;
+}
+function _objectSpread2(target) {
+	for (var i = 1; i < arguments.length; i++) {
+		var source = null != arguments[i] ? arguments[i] : {};
+		i % 2
+			? ownKeys(Object(source), !0).forEach(function (key) {
+					_defineProperty(target, key, source[key]);
+			  })
+			: Object.getOwnPropertyDescriptors
+			? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source))
+			: ownKeys(Object(source)).forEach(function (key) {
+					Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+			  });
+	}
+	return target;
+}
+function _defineProperty(obj, key, value) {
+	key = _toPropertyKey(key);
+	if (key in obj) {
+		Object.defineProperty(obj, key, {
+			value: value,
+			enumerable: true,
+			configurable: true,
+			writable: true,
+		});
+	} else {
+		obj[key] = value;
+	}
+	return obj;
+}
+function _inheritsLoose(subClass, superClass) {
+	subClass.prototype = Object.create(superClass.prototype);
+	subClass.prototype.constructor = subClass;
+	_setPrototypeOf(subClass, superClass);
+}
+function _setPrototypeOf(o, p) {
+	_setPrototypeOf = Object.setPrototypeOf
+		? Object.setPrototypeOf.bind()
+		: function _setPrototypeOf(o, p) {
+				o.__proto__ = p;
+				return o;
+		  };
+	return _setPrototypeOf(o, p);
+}
+function _unsupportedIterableToArray(o, minLen) {
+	if (!o) return;
+	if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+	var n = Object.prototype.toString.call(o).slice(8, -1);
+	if (n === "Object" && o.constructor) n = o.constructor.name;
+	if (n === "Map" || n === "Set") return Array.from(o);
+	if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+	if (len == null || len > arr.length) len = arr.length;
+	for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+	return arr2;
+}
+function _createForOfIteratorHelperLoose(o, allowArrayLike) {
+	var it = (typeof Symbol !== "undefined" && o[Symbol.iterator]) || o["@@iterator"];
+	if (it) return (it = it.call(o)).next.bind(it);
+	if (
+		Array.isArray(o) ||
+		(it = _unsupportedIterableToArray(o)) ||
+		(allowArrayLike && o && typeof o.length === "number")
+	) {
+		if (it) o = it;
+		var i = 0;
+		return function () {
+			if (i >= o.length)
+				return {
+					done: true,
+				};
+			return {
+				done: false,
+				value: o[i++],
+			};
+		};
+	}
+	throw new TypeError(
+		"Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
+	);
+}
+function _toPrimitive(input, hint) {
+	if (typeof input !== "object" || input === null) return input;
+	var prim = input[Symbol.toPrimitive];
+	if (prim !== undefined) {
+		var res = prim.call(input, hint || "default");
+		if (typeof res !== "object") return res;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return (hint === "string" ? String : Number)(input);
+}
+function _toPropertyKey(arg) {
+	var key = _toPrimitive(arg, "string");
+	return typeof key === "symbol" ? key : String(key);
+}
+
+var BoundedObject = /*#__PURE__*/ (function (_PureContainer) {
+	_inheritsLoose(BoundedObject, _PureContainer);
+	function BoundedObject() {
+		return _PureContainer.apply(this, arguments) || this;
+	}
+	var _proto = BoundedObject.prototype;
+	_proto.declareData = function declareData() {
+		var _PureContainer$protot;
+		return (_PureContainer$protot = _PureContainer.prototype.declareData).call.apply(
+			_PureContainer$protot,
+			[
+				this,
+				{
+					anchors: undefined,
+					offset: undefined,
+					margin: undefined,
+					padding: undefined,
+				},
+			].concat(Array.prototype.slice.call(arguments))
+		);
+	};
+	_proto.prepareData = function prepareData(context, instance) {
+		_PureContainer.prototype.prepareData.call(this, context, instance);
+		var data = instance.data;
+		data.anchors = Rect.convert(data.anchors);
+		data.offset = Rect.convert(data.offset);
+		data.margin = Rect.convertMargin(data.margin);
+		data.padding = Rect.convertMargin(data.padding);
+	};
+	_proto.calculateBounds = function calculateBounds(context, instance) {
+		var data = instance.data;
+		return Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
+	};
+	_proto.prepareBounds = function prepareBounds(context, instance) {
+		var data = instance.data;
+		if (
+			instance.shouldUpdate ||
+			!instance.cached.parentRect ||
+			!instance.cached.parentRect.isEqual(context.parentRect) ||
+			!data.bounds
+		) {
+			if (!context.parentRect) throw new Error("Parent bounds were not provided through the context.");
+			instance.parentRect = context.parentRect;
+			instance.cache("parentRect", context.parentRect);
+			instance.markShouldUpdate(context);
+			data.bounds = this.calculateBounds(context, instance);
+			data.childrenBounds = Rect.add(data.bounds, data.padding);
+		}
+	};
+	_proto.prepare = function prepare(context, instance) {
+		this.prepareBounds(context, instance);
+		context.push("parentRect", instance.data.childrenBounds);
+	};
+	_proto.prepareCleanup = function prepareCleanup(context, instance) {
+		context.pop("parentRect");
+	};
+	return BoundedObject;
+})(PureContainer);
+BoundedObject.prototype.anchors = 0;
+BoundedObject.prototype.margin = 0;
+BoundedObject.prototype.offset = 0;
+BoundedObject.prototype.padding = 0;
+BoundedObject.prototype.isPureContainer = false;
+BoundedObject.prototype.styled = true;
+
+var Text = /*#__PURE__*/ (function (_BoundedObject) {
+	_inheritsLoose(Text, _BoundedObject);
+	function Text() {
+		return _BoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = Text.prototype;
+	_proto.declareData = function declareData() {
+		var _BoundedObject$protot;
+		return (_BoundedObject$protot = _BoundedObject.prototype.declareData).call.apply(
+			_BoundedObject$protot,
+			[this].concat(Array.prototype.slice.call(arguments), [
+				{
+					value: undefined,
+					dx: undefined,
+					dy: undefined,
+					textAnchor: undefined,
+					fill: undefined,
+					stroke: undefined,
+				},
+			])
+		);
+	};
+	_proto.init = function init() {
+		if (this.ta) this.textAnchor = this.ta;
+		if (this.bind) {
+			this.value = {
+				bind: this.bind,
+			};
+		} else if (this.tpl) {
+			this.value = {
+				tpl: this.tpl,
+			};
+		} else if (this.expr) {
+			this.value = {
+				expr: this.expr,
+			};
+		}
+		_BoundedObject.prototype.init.call(this);
+	};
+	_proto.render = function render(context, instance, key) {
+		var data = instance.data;
+		var bounds = data.bounds;
+		return /*#__PURE__*/ jsxs(
+			"text",
+			{
+				className: data.classNames,
+				x: bounds.l,
+				y: bounds.t,
+				dx: data.dx,
+				dy: data.dy,
+				textAnchor: data.textAnchor,
+				style: data.style,
+				fill: data.fill,
+				stroke: data.stroke,
+				children: [data.value, this.renderChildren(context, instance)],
+			},
+			key
+		);
+	};
+	return Text;
+})(BoundedObject);
+Text.prototype.anchors = "0.5 0.5 0.5 0.5";
+Text.prototype.baseClass = "text";
+Widget.alias("svg.text", Text);
+
+var TextualBoundedObject = /*#__PURE__*/ (function (_BoundedObject) {
+	_inheritsLoose(TextualBoundedObject, _BoundedObject);
+	function TextualBoundedObject() {
+		return _BoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = TextualBoundedObject.prototype;
+	_proto.add = function add(widget) {
+		if (typeof widget != "string") return _BoundedObject.prototype.add.apply(this, arguments);
+		if (this.trimWhitespace) widget = innerTextTrim(widget);
+		if (!widget) return;
+		return this.add({
+			type: Text,
+			value: widget,
+			textAnchor: "middle",
+			dy: "0.4em",
+		});
+	};
+	return TextualBoundedObject;
+})(BoundedObject);
+
+var Svg = /*#__PURE__*/ (function (_BoundedObject) {
+	_inheritsLoose(Svg, _BoundedObject);
+	function Svg() {
+		return _BoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = Svg.prototype;
+	_proto.initState = function initState(context, instance) {
+		var size = {
+			width: 0,
+			height: 0,
+		};
+		instance.state = {
+			size: size,
+		};
+	};
+	_proto.explore = function explore(context, instance) {
+		context.push("inSvg", true);
+		_BoundedObject.prototype.explore.call(this, context, instance);
+	};
+	_proto.exploreCleanup = function exploreCleanup(context, instance) {
+		context.pop("inSvg");
+	};
+	_proto.prepare = function prepare(context, instance) {
+		var size = instance.state.size;
+		context.parentRect = new Rect({
+			l: 0,
+			t: 0,
+			r: size.width,
+			b: size.height,
+		});
+		instance.clipRects = {};
+		instance.clipRectId = 0;
+		context.push("addClipRect", function (rect) {
+			var id = "clip-" + instance.id + "-" + ++instance.clipRectId;
+			instance.clipRects[id] = rect;
+			return id;
+		});
+		context.push("inSvg", true);
+		_BoundedObject.prototype.prepare.call(this, context, instance);
+	};
+	_proto.prepareCleanup = function prepareCleanup(context, instance) {
+		_BoundedObject.prototype.prepareCleanup.call(this, context, instance);
+		context.pop("addClipRect");
+		context.pop("inSvg");
+	};
+	_proto.render = function render(context, instance, key) {
+		var eventHandlers = instance.getJsxEventProps();
+		if (eventHandlers) {
+			delete eventHandlers["onWheelActive"];
+		}
+		return /*#__PURE__*/ jsx(
+			SvgComponent,
+			{
+				instance: instance,
+				data: instance.data,
+				options: context.options,
+				size: instance.state.size,
+				eventHandlers: eventHandlers,
+				children: this.renderChildren(context, instance),
+			},
+			key
+		);
+	};
+	return Svg;
+})(BoundedObject);
+Svg.prototype.anchors = "0 1 1 0";
+Svg.prototype.baseClass = "svg";
+Svg.prototype.autoWidth = false;
+Svg.prototype.autoHeight = false;
+Svg.prototype.aspectRatio = 1.618;
+function sameSize(a, b) {
+	if (!a || !b) return false;
+	return a.width == b.width && a.height == b.height;
+}
+var SvgComponent = /*#__PURE__*/ (function (_VDOM$Component) {
+	_inheritsLoose(SvgComponent, _VDOM$Component);
+	function SvgComponent() {
+		return _VDOM$Component.apply(this, arguments) || this;
+	}
+	var _proto2 = SvgComponent.prototype;
+	_proto2.render = function render() {
+		var _this = this;
+		var _this$props = this.props,
+			instance = _this$props.instance,
+			data = _this$props.data,
+			size = _this$props.size,
+			children = _this$props.children,
+			eventHandlers = _this$props.eventHandlers;
+		var widget = instance.widget;
+		var defs = [];
+		for (var k in instance.clipRects) {
+			var cr = instance.clipRects[k];
+			defs.push(
+				/*#__PURE__*/ jsx(
+					"clipPath",
+					{
+						id: k,
+						children: /*#__PURE__*/ jsx("rect", {
+							x: cr.l,
+							y: cr.t,
+							width: Math.max(0, cr.width()),
+							height: Math.max(0, cr.height()),
+						}),
+					},
+					k
+				)
+			);
+		}
+		var style = data.style;
+		if (widget.autoHeight)
+			style = _objectSpread2(
+				_objectSpread2({}, style),
+				{},
+				{
+					height: size.height + "px",
+				}
+			);
+		if (widget.autoWidth)
+			style = _objectSpread2(
+				_objectSpread2({}, style),
+				{},
+				{
+					width: size.width + "px",
+				}
+			);
+
+		//parent div is needed because clientWidth doesn't work on the svg element in FF
+
+		return /*#__PURE__*/ jsx(
+			"div",
+			_objectSpread2(
+				_objectSpread2(
+					{
+						ref: function ref(el) {
+							_this.el = el;
+						},
+						className: data.classNames,
+						style: style,
+					},
+					eventHandlers
+				),
+				{},
+				{
+					children:
+						size.width > 0 &&
+						size.height > 0 &&
+						/*#__PURE__*/ jsxs("svg", {
+							children: [
+								/*#__PURE__*/ jsx("defs", {
+									children: defs,
+								}),
+								children,
+							],
+						}),
+				}
+			)
+		);
+	};
+	_proto2.onResize = function onResize() {
+		var instance = this.props.instance;
+		var widget = this.props.instance.widget;
+		var size = {
+			width: this.el.clientWidth,
+			height: this.el.clientHeight,
+		};
+		if (widget.autoHeight) size.height = size.width / widget.aspectRatio;
+		if (widget.autoWidth) size.width = size.height * widget.aspectRatio;
+		if (!sameSize(instance.state.size, size))
+			instance.setState({
+				size: size,
+			});
+	};
+	_proto2.componentDidMount = function componentDidMount() {
+		var _this2 = this;
+		this.offResize = ResizeManager.trackElement(this.el, this.onResize.bind(this));
+		this.onResize();
+		if (this.props.instance.widget.onWheelActive) {
+			this.offWheelActive = addEventListenerWithOptions(
+				this.el,
+				"wheel",
+				function (event) {
+					var instance = _this2.props.instance;
+					instance.invoke("onWheelActive", event, instance);
+				},
+				{
+					passive: false,
+				}
+			);
+		}
+	};
+	_proto2.componentDidUpdate = function componentDidUpdate() {
+		this.onResize();
+	};
+	_proto2.componentWillUnmount = function componentWillUnmount() {
+		this.offResize && this.offResize();
+		this.offWheelActive && this.offWheelActive();
+	};
+	return SvgComponent;
+})(VDOM.Component);
+Widget.alias("svg", Svg);
+
+var Rectangle = /*#__PURE__*/ (function (_TextualBoundedObject) {
+	_inheritsLoose(Rectangle, _TextualBoundedObject);
+	function Rectangle() {
+		return _TextualBoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = Rectangle.prototype;
+	_proto.declareData = function declareData() {
+		var _TextualBoundedObject2;
+		(_TextualBoundedObject2 = _TextualBoundedObject.prototype.declareData).call.apply(
+			_TextualBoundedObject2,
+			[this].concat(Array.prototype.slice.call(arguments), [
+				{
+					colorIndex: undefined,
+					fill: undefined,
+					stroke: undefined,
+				},
+			])
+		);
+	};
+	_proto.render = function render(context, instance, key) {
+		var data = instance.data;
+		var bounds = data.bounds,
+			colorIndex = data.colorIndex;
+		if (!bounds.valid()) return false;
+		return /*#__PURE__*/ jsxs(
+			"g",
+			{
+				className: data.classNames,
+				children: [
+					/*#__PURE__*/ jsx("rect", {
+						className: this.CSS.element(this.baseClass, "rect", colorIndex != null && "color-" + colorIndex),
+						x: bounds.l,
+						y: bounds.t,
+						width: bounds.width(),
+						height: bounds.height(),
+						style: data.style,
+						fill: data.fill,
+						stroke: data.stroke,
+					}),
+					this.renderChildren(context, instance),
+				],
+			},
+			key
+		);
+	};
+	return Rectangle;
+})(TextualBoundedObject);
+Rectangle.prototype.baseClass = "rectangle";
+Rectangle.prototype.anchors = "0 1 1 0";
+Widget.alias("rectangle", Rectangle);
+
+var ClipRect = /*#__PURE__*/ (function (_BoundedObject) {
+	_inheritsLoose(ClipRect, _BoundedObject);
+	function ClipRect() {
+		return _BoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = ClipRect.prototype;
+	_proto.prepareBounds = function prepareBounds(context, instance) {
+		_BoundedObject.prototype.prepareBounds.call(this, context, instance);
+		var data = instance.data;
+		data.clipId = context.addClipRect(data.bounds);
+	};
+	_proto.render = function render(context, instance, key) {
+		var data = instance.data;
+		return /*#__PURE__*/ jsx(
+			"g",
+			{
+				clipPath: "url(#" + data.clipId + ")",
+				children: this.renderChildren(context, instance),
+			},
+			key
+		);
+	};
+	return ClipRect;
+})(BoundedObject);
+ClipRect.prototype.anchors = "0 1 1 0";
+
+var Ellipse = /*#__PURE__*/ (function (_TextualBoundedObject) {
+	_inheritsLoose(Ellipse, _TextualBoundedObject);
+	function Ellipse() {
+		return _TextualBoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = Ellipse.prototype;
+	_proto.declareData = function declareData() {
+		var _TextualBoundedObject2;
+		(_TextualBoundedObject2 = _TextualBoundedObject.prototype.declareData).call.apply(
+			_TextualBoundedObject2,
+			[this].concat(Array.prototype.slice.call(arguments), [
+				{
+					colorIndex: undefined,
+					fill: undefined,
+					stroke: undefined,
+				},
+			])
+		);
+	};
+	_proto.render = function render(context, instance, key) {
+		var data = instance.data;
+		var bounds = data.bounds,
+			colorIndex = data.colorIndex;
+		if (!bounds.valid()) return false;
+		return /*#__PURE__*/ jsxs(
+			"g",
+			{
+				className: data.classNames,
+				children: [
+					/*#__PURE__*/ jsx("ellipse", {
+						className: this.CSS.element(this.baseClass, "rect", colorIndex != null && "color-" + colorIndex),
+						cx: (bounds.l + bounds.r) / 2,
+						cy: (bounds.t + bounds.b) / 2,
+						rx: bounds.width() / 2,
+						ry: bounds.height() / 2,
+						style: data.style,
+						fill: data.fill,
+						stroke: data.stroke,
+					}),
+					this.renderChildren(context, instance),
+				],
+			},
+			key
+		);
+	};
+	return Ellipse;
+})(TextualBoundedObject);
+Ellipse.prototype.baseClass = "ellipse";
+Ellipse.prototype.anchors = "0 1 1 0";
+Widget.alias("ellipse", Ellipse);
+
+var Line = /*#__PURE__*/ (function (_TextualBoundedObject) {
+	_inheritsLoose(Line, _TextualBoundedObject);
+	function Line() {
+		return _TextualBoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = Line.prototype;
+	_proto.declareData = function declareData() {
+		var _TextualBoundedObject2;
+		(_TextualBoundedObject2 = _TextualBoundedObject.prototype.declareData).call.apply(
+			_TextualBoundedObject2,
+			[this].concat(Array.prototype.slice.call(arguments), [
+				{
+					colorIndex: undefined,
+					stroke: undefined,
+				},
+			])
+		);
+	};
+	_proto.render = function render(context, instance, key) {
+		var data = instance.data,
+			colorIndex = instance.colorIndex;
+		var bounds = data.bounds;
+		return /*#__PURE__*/ jsxs(
+			"g",
+			{
+				className: data.classNames,
+				children: [
+					/*#__PURE__*/ jsx("line", {
+						className: this.CSS.element(this.baseClass, "line", colorIndex != null && "color-" + colorIndex),
+						x1: bounds.l,
+						y1: bounds.t,
+						x2: bounds.r,
+						y2: bounds.b,
+						style: data.style,
+						stroke: data.stroke,
+					}),
+					this.renderChildren(context, instance),
+				],
+			},
+			key
+		);
+	};
+	return Line;
+})(TextualBoundedObject);
+Line.prototype.anchors = "0 1 1 0";
+Line.prototype.baseClass = "line";
+Widget.alias("line", Line);
+
+var NonOverlappingRect = /*#__PURE__*/ (function (_BoundedObject) {
+	_inheritsLoose(NonOverlappingRect, _BoundedObject);
+	function NonOverlappingRect() {
+		return _BoundedObject.apply(this, arguments) || this;
+	}
+	var _proto = NonOverlappingRect.prototype;
+	_proto.prepare = function prepare(context, instance) {
+		_BoundedObject.prototype.prepare.call(this, context, instance); //calculate bounds
+		if (!context.addNonOverlappingBoundingObject)
+			throw new Error("Components of type NonOverlappingRect can appaear only within a NonOverlappingRectGroup.");
+		context.addNonOverlappingBoundingObject(instance);
+	};
+	_proto.render = function render(context, instance, key) {
+		if (instance.overlapping) return null;
+		return _BoundedObject.prototype.render.call(this, context, instance, key);
+	};
+	return NonOverlappingRect;
+})(BoundedObject);
+
+var NonOverlappingRectGroup = /*#__PURE__*/ (function (_PureContainer) {
+	_inheritsLoose(NonOverlappingRectGroup, _PureContainer);
+	function NonOverlappingRectGroup() {
+		return _PureContainer.apply(this, arguments) || this;
+	}
+	var _proto = NonOverlappingRectGroup.prototype;
+	_proto.prepare = function prepare(context, instance) {
+		instance.nonOverlappingObjects = [];
+		context.push("addNonOverlappingBoundingObject", function (objectInstance) {
+			instance.nonOverlappingObjects.push(objectInstance);
+		});
+	};
+	_proto.prepareCleanup = function prepareCleanup(context, instance) {
+		context.pop("addNonOverlappingBoundingObject");
+		instance.nonOverlappingObjects.sort(function (a, b) {
+			return a.data.bounds.r - b.data.bounds.r;
+		});
+		var visibleObjects = [];
+		for (
+			var _iterator = _createForOfIteratorHelperLoose(instance.nonOverlappingObjects), _step;
+			!(_step = _iterator()).done;
+
+		) {
+			var item = _step.value;
+			var overlapping = false;
+			var at = visibleObjects.length - 1;
+			while (at >= 0 && visibleObjects[at].data.bounds.r > item.data.bounds.l) {
+				var r1 = visibleObjects[at].data.bounds;
+				var r2 = item.data.bounds;
+				var width = Math.min(r1.r, r2.r) - Math.max(r1.l, r2.l);
+				var height = Math.min(r1.b, r2.b) - Math.max(r1.t, r2.t);
+				if (width > 0 && height > 0) {
+					overlapping = true;
+					break;
+				}
+				at--;
+			}
+			if (item.overlapping !== overlapping) {
+				item.overlapping = overlapping;
+				item.markShouldUpdate(context);
+			}
+			if (!overlapping) visibleObjects.push(item);
+		}
+	};
+	return NonOverlappingRectGroup;
+})(PureContainer);
+
+export {
+	BoundedObject,
+	ClipRect,
+	Ellipse,
+	Line,
+	NonOverlappingRect,
+	NonOverlappingRectGroup,
+	Rect,
+	Rectangle,
+	Svg,
+	Text,
+	TextualBoundedObject,
+};