added ListElement

src/lib/ui/reactive/ListElement.hx

@@ -0,0 +1,42 @@
+package lib.ui.reactive;
+
+import util.ObservableArray;
+import util.Vec.Vec2;
+
+class ListElement extends UIElement {
+
+	private final content:ObservableArray<UIElement>;
+
+	public function new(content: ObservableArray<UIElement>) {
+		super();
+
+		this.content = content;
+		this.content.subscribe(value -> {
+			this.changedTrigger.trigger(null);
+			// TODO: subscribe to elements and forward onChange event
+		});
+	}
+
+	public function render(bounds:Vec2<Int>):Canvas {
+		var canvas: Canvas = new Canvas();
+		var writePoint:Vec2<Int> = {x: 0, y: 0};
+
+		for(element in this.content.get()){
+			if (bounds.y - writePoint.y <= 0) {
+				// No more space to render children
+				break;
+			}
+
+			var childRender = element.render({
+				x: bounds.x,
+				y: bounds.y - writePoint.y
+			});
+
+			canvas.combine(childRender, writePoint);
+
+			writePoint = {x: 0, y: writePoint.y + childRender.hight()};
+		}
+
+		return canvas;
+	}
+}

src/util/Observable.hx

@@ -4,7 +4,7 @@ using tink.CoreApi;
 
 class Observable<T> {
 	private var value:T;
-	private var callbacks:CallbackList<T> = new CallbackList(true);
+	private var callbacks:CallbackList<T> = new CallbackList();
 
 	public function new(value:T) {
 		this.value = value;

src/util/ObservableArray.hx

@@ -0,0 +1,56 @@
+package util;
+
+class ObservableArray<T> extends Observable<Array<T>> {
+	public function new(value: Array<T>) {
+		super(value);
+	}
+
+	public function insert(pos: Int, x: T):Void {
+		this.value.insert(pos,x);
+		this.callbacks.invoke(this.value);
+	}
+
+	public function pop(): Null<T> {
+		var poped = this.pop();
+		this.callbacks.invoke(this.value);
+		return poped;
+	}
+
+	public function push(x: T):Int {
+		var i = this.value.push(x);
+		this.callbacks.invoke(this.value);
+		return i;
+	}
+
+	public function remove(x: T): Bool {
+		var b = this.value.remove(x);
+		this.callbacks.invoke(this.value);
+		return b;
+	}
+
+	public function resize(len: Int) {
+		this.value.resize(len);
+		this.callbacks.invoke(this.value);
+	}
+
+	public function reverse() {
+		this.value.reverse();
+		this.callbacks.invoke(this.value);
+	}
+
+	public function shift(): Null<T> {
+		var e = this.value.shift();
+		this.callbacks.invoke(this.value);
+		return e;
+	}
+
+	public function sort(f:(T, T) -> Int):Void {
+		this.value.sort(f);
+		this.callbacks.invoke(this.value);
+	}
+
+	public function unshift(x: T):Void {
+		this.value.unshift(x);
+		this.callbacks.invoke(this.value);
+	}
+}