cavalion-vcl 1.1.72 → 1.1.74

package/.md

@@ -1,38 +1,40 @@
 * [CHANGELOG.md]() - [README.md]() - [package.json]()
-* [.workspace](`(devtools/Workspace<${ws.getSpecializer()}>)`) - [.js]()
+* [SNIPPETS.md]()
+* [.workspace](`(devtools/Workspace<${ws.getSpecializer()}>)`) - [.js]() - [src](:/)
 
-# cavalion-entities // va-objects
+# `2023/05/12` Gelijk trekken textRenders en rendering
 
-* Interpret, modify, kvp via a model
+* Control vs ListColumn?
+
+# `2023/05/11` up() does not find closeable nodes
+
+Sigh! The infamous vcl/ui/Node.closeable seems to bite me in the ass.
 
-# cavalion-vcl
+* **Solution**: Use [Node-closeable](src/vcl/ui/:.js) instead
 
-* [src](:/)
-	* [Factory](src/:.js) [.parse](src/Factory:.js) - [Reader](src/:.js) - [Writer](src/:.js)
-	* [CssRules](src/:.js) - [Listeners](src/:.js) 
-	* **[Component](src/:.js)** [.query](src/Component:.js)
-		* **[Application](src/:.js)** - **[Action](src/:.js)**
-		* [data](src/:/) / [Array](src/data/:.js)
-			* [entities](src/:/) / [Query](src/entities/:.js) - [Instance](src/entities/:.js)
-		* **[Control](src/:.js)** < [ui](src/:/) /
-			* [Element](src/ui/:.js) < [LargeIcon](src/ui/:.js) << _smdl - alert_
-				* [Button](src/ui/:.js) < [PopupButton](src/ui/:.js)
-				* [Select](src/ui/:.js)
-				* [Input](src/ui/:.js) < [Checkbox](src/ui/:.js) - [Combobox](src/ui/:.js) - [DatePicker](src/ui/:.js) 
-			* [Container](src/ui/:.js)
-				* [Group](src/ui/:.js)
-					* [Bar](src/ui/:.js)
-					* [CheckGroup](src/ui/:.js)
-				* [Panel](src/ui/:.js) 
-					* [Popup](src/ui/:.js) - [Ace](src/ui/:.js) - [Console](src/ui/:.js)
-					* [Form](src/ui/:.js) - [FormContainer](src/ui/:.js)
-					* [List](src/ui/:.js) | [ListColumn](src/ui/:.js) - [ListBody](src/ui/:.js) - [ListFooter](src/ui/:.js) - [ListHeader](src/ui/:.js) - [ListRow](src/ui/:.js)
-			* [Sizer](src/ui/:.js)
-			* [Tabs](src/ui/:.js) 
-				* [Tab](src/ui/:.js)
-			* [Tree](src/ui/:.js)
-				* [Node](src/ui/:.js)
-					* [.closeable](src/ui/Node:.js)
+# cavalion-vcl / classes
+
+* [Factory](src/:.js) [.parse](src/Factory:.js) - [Reader](src/:.js) - [Writer](src/:.js)
+* [CssRules](src/:.js) - [Listeners](src/:.js) 
+* **[Component](src/:.js)** [.query](src/Component:.js)
+	* **[Application](src/:.js)** - **[Action](src/:.js)**
+	* [data](src/:/) / [Array](src/data/:.js)
+		* [entities](src/:/) / [Query](src/entities/:.js) - [Instance](src/entities/:.js)
+	* **[Control](src/:.js)** < [ui](src/:/) / [Sizer](src/ui/:.js)
+		* [Element](src/ui/:.js) < [LargeIcon](src/ui/:.js) << _smdl - alert_
+			* [Input](src/ui/:.js) < [Checkbox](src/ui/:.js) - [Combobox](src/ui/:.js) - [DatePicker](src/ui/:.js) 
+			* [Button](src/ui/:.js) < [PopupButton](src/ui/:.js)
+			* [Select](src/ui/:.js)
+		* [Container](src/ui/:.js)
+			* [Group](src/ui/:.js)
+				* [CheckGroup](src/ui/:.js)
+				* [Bar](src/ui/:.js)
+					* [Tabs](src/ui/:.js) - [Tab](src/ui/:.js)
+			* [Panel](src/ui/:.js) 
+				* [Popup](src/ui/:.js) - [Ace](src/ui/:.js) - [Console](src/ui/:.js)
+				* ( [Form](src/ui/:.js) - [FormContainer](src/ui/:.js) ) _where does onActive/Deactive go?_
+				* [List](src/ui/:.js) | [ListColumn](src/ui/:.js) - [ListBody](src/ui/:.js) - [ListFooter](src/ui/:.js) - [ListHeader](src/ui/:.js) - [ListRow](src/ui/:.js)
+				* [Tree](src/ui/:.js) - [Node](src/ui/:.js) [.closeable](src/ui/Node:.js)
 
 # prototypes `2022/04/17` 
 
@@ -61,4 +63,7 @@
 		* [Query](src/prototypes/ui/entities/:.js) - [.scaffold](src/prototypes/ui/entities/Query:.js) - [scaffold.future](src/prototypes/ui/entities/Query:.js)
 		* [QueryFilters](src/prototypes/ui/entities/:.js)
 
+# cavalion-entities // va-objects
+
+* Interpret, modify, kvp via a model
 

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+### 2023/05/29 - 1.1.74
+
+* Node.closeable deprecated
+
+	* `af4757a` - refactors Node.closeable => Node-closeable updates loading style for Nodes adds SNIPPETS.md
+
+* Adding debugging tools 
+
+	* `3d7b43e` - adds Control.tree() - useful for debugging nested structure of controls
+	* `9421731` - adds dumpControls snippet removes comments fixes deps global
+
+* Working on vcl/prototype
+
+	* `1720907` - fixes message params situation
+	* `fc159df` - fixes ms situation with toasts fixes toast styles
+
+* Minor changes
+
+	* `6e3222b` - updates toast style
+
+### 2023/03/26 - 1.1.73
+
+* Fixes issues with Component.getImplicitBasesByUri
+
 ### 2022/12/11 - 1.1.72
 
 * ListHeader: Fixes the rendering bug which appeared in Chrome 107+
@@ -9,7 +33,6 @@
 * Query: fixes some bug in error handling 
 * List: improves rendering while loading
 
-
 ### 2022/10/30 - 1.1.70
 
 `#VA-20221028-1`, `-2` & `-3`

package/SNIPPETS.md

@@ -0,0 +1,10 @@
+# `2023/05/06` Snippet
+
+	const dumpControls = (parent) => parent.getControls().reduce((r, c) => {
+		r[js.nameOf(c)] = dumpControls(c);
+		return r;	
+	}, Object.create(parent, { hashCode: { value: () => ";-)" } }));
+
+
+* [Control.js](src/Control.js) - require("vcl/Control").dump
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cavalion-vcl",
-  "version": "1.1.72",
+  "version": "1.1.74",
   "description": "Visual Component Library for vcl-comps",
   "main": "index.js",
   "scripts": {

package/src/Component.js

@@ -1232,7 +1232,11 @@ define(function (require) {
                 if (base !== null) {
                     var keys = Component.getKeysByUri(uri);
                     var classes = keys.classes;
-                    var spec_classes = keys.specializer_classes;
+                    var spec_classes = [].concat(keys.specializer_classes);
+
+                    // Always inherit the implicit base first
+                    r.push(base);
+                    
                     if (classes.length > 1) {
                         // [A] Each class expands
                         classes.forEach(function (cls) {
@@ -1240,10 +1244,11 @@ define(function (require) {
                             r.push(Component.getUriByKeys(keys));
                         });
                     } else if (classes.length === 1) {
-                        if (spec_classes.length > 1) {
+                        if (spec_classes.length/* > 1*/) {
                             // [B] Each specializer_class expands
                             spec_classes.forEach(function (cls) {
-                                keys.specializer_classes = [cls];
+                                keys.specializer_classes = [];
+                                keys.specializer = cls;
                                 r.push(Component.getUriByKeys(keys));
                             });
                         } else if (spec_classes.length === 1) {
@@ -1261,10 +1266,12 @@ define(function (require) {
                         } else {
                             // [J] equals [G], continue on prototypes/ prefix
                         }
-                    } else if (spec_classes.length > 1) {
+                    } else if (spec_classes.length/* > 1*/) {
                         // [E] Each specializer_class expands
                         spec_classes.forEach(function (cls) {
-                            keys.specializer_classes = [cls];
+                            // keys.specializer_classes = [cls];
+                            keys.specializer_classes = [];
+                            keys.specializer = cls;
                             r.push(Component.getUriByKeys(keys));
                         });
                     } else if (spec_classes.length === 1) {
@@ -1279,8 +1286,6 @@ define(function (require) {
                         // empty specifier due to: ComponentClass<>
                     }
 
-                    // Always inherit the implicit base
-                    r.push(base);
 
                 } else if (uri.indexOf(Factory.PREFIX_PROTOTYPES) !== 0) {
                     r.push(String.format("%s%s", Factory.PREFIX_PROTOTYPES, uri));
@@ -1517,7 +1522,7 @@ define(function (require) {
                 type: Type.EVENT
             },
             "onDispatchChildEvent": {
-                type: Type.EVENT
+                type: Type.EVENT // component, name, evt, f, args) {
             },
             "onMessage": {
                 type: Type.EVENT

package/src/Control.js

@@ -1852,6 +1852,12 @@ this._updateCalls = this._updateCalls || 0; this._updateCalls++;
 			updateCallCount: 0,
 
 			focused: null,
+			
+			tree: (root) => root.getControls().reduce((r, c) => {
+					r[js.nameOf(c)] = Control.tree(c);
+					return r;	
+				}, Object.create(root, { hashCode: { value: () => ";-)" } })),
+			
 
 			findByNode: function(node) {
 				while(node !== null && node[EventDispatcher.elementKey] === undefined) {

package/src/Factory.js

@@ -141,21 +141,17 @@ define(function(require) {
 			},
 			load: function(source, success, failure) {
                 if(source.charAt(0) === "\"" && source.indexOf("\"use strict\";") !== 0) {
+    				/*- Parse require section */
                 	if(source.indexOf("\"use ") === 0) {
-                		// TODO this should be the default
-                		source = "\"" + source.substring(5);
+                		source = "\"" + source.substring(5); // TODO this should be the default
                 	}
-    				/*- Parse require section */
                     var i = source.indexOf("\";");
                     if(i !== -1) {
-                        deps = source.substring(1, i).replace(/\s/g, "");
-                        deps = deps.split(",");
-                        
+                        var deps = source.substring(1, i).replace(/\s/g, "");
                         /*- require all dependecies */
-                        var me = this;
-                        return this._parentRequire(deps, function() {
-                            me.doLoad(source, success, failure);
-                        }, failure);
+                        return this._parentRequire(deps.split(","), 
+                        	() => this.doLoad(source, success, failure), 
+                        	failure);
                     }
                 }
                 return this.doLoad(source, success, failure);
@@ -515,6 +511,12 @@ define(function(require) {
 			DEFAULT_NAMESPACES: {
 			},
 			
+			overrides: function(reg, req) {
+				for(var k in reg) {
+					define(js.sf("vcl/Factory!%s", k), reg[k], new Factory(req || window.require, k))
+				}	
+			},
+
 			implicit_sources: {},
 
 			load: function(name, parentRequire, load, config) {
@@ -530,13 +532,10 @@ define(function(require) {
 					var p = "";//local ? ".skip-fetch.local" : "";
 					var factory = new Factory(parentRequire, name + p, sourceUri + p);
 // console.log("instantiate", name + p);
-					factory.load(source, function() {
-						load(factory, source);
-					});
+					factory.load(source, () => load(factory, source));
 				}
 
 				function fallback() {
-// console.log("fallback");
 					parentRequire([sourceUri], instantiate, function(err) {
 						// Source not found, assume it...
 						var source = Component.getImplicitSourceByUri(name);
@@ -545,12 +544,13 @@ define(function(require) {
 						}
 						//console.log("304", name, "-->", source);
 						Factory.implicit_sources[sourceUri] = source;
+// console.log(name, "implicit source generated", source);
 						instantiate(source);
 					});
 				}
 				
 				if(name.endsWith(".skip-fetch")) {
-console.log("skip-fetch", name);
+// console.log("skip-fetch", name);
 					name = name.split("."); 
 					name.pop();
 					name = name.join(".");
@@ -660,6 +660,5 @@ console.log("skip-fetch", name);
 			},
 			getFactoryUri: getFactoryUri
 		}
-
 	}));
 });

package/src/Reader.js

@@ -26,9 +26,6 @@ define(function(require) {
 			_uri: null,
 			_references: null,
 
-			/**
-			 *
-			 */
 			constructor: function(factory, root) {
 				this._factory = factory;
 				if(root !== undefined) {
@@ -36,17 +33,17 @@ define(function(require) {
 				}
 			},
 
-			/**
-			 * Read the source of a component. Basically instantiates a
-			 * component
-			 *
-			 * @param source
-			 *            The actual source
-			 * @param uri
-			 *            The uri of the source and thus the resulting root
-			 *            component
-			 */
 			read: function(source, uri) {
+				/**
+				 * Read the source of a component. Basically instantiates a
+				 * component
+				 *
+				 * @param source
+				 *            The actual source
+				 * @param uri
+				 *            The uri of the source and thus the resulting root
+				 *            component
+				 */
 				var deferred = new Deferred();
 				var thisObj = this;
 
@@ -81,22 +78,21 @@ define(function(require) {
 
 				return deferred;
 			},
-
-			/**
-			 * Instantiates a component based upon a definition hold by a node
-			 * which was delivered/parsed by Reader.evaluate. It figures out
-			 * whether the node references a inherited ComponentClass or
-			 * inherited component.
-			 *
-			 * @param node
-			 *            The actual node holding information to it's inherited
-			 *            prototypes, name, properties, children
-			 * @param success
-			 *            To receive the component
-			 * @param failure
-			 *            To receive errors
-			 */
 			instantiateComponent: function(node, success, failure) {
+				/**
+				 * Instantiates a component based upon a definition hold by a node
+				 * which was delivered/parsed by Reader.evaluate. It figures out
+				 * whether the node references a inherited ComponentClass or
+				 * inherited component.
+				 *
+				 * @param node
+				 *            The actual node holding information to it's inherited
+				 *            prototypes, name, properties, children
+				 * @param success
+				 *            To receive the component
+				 * @param failure
+				 *            To receive errors
+				 */
 				var component, me = this;
 				if(node.inherits instanceof Array) {
 					// inherits (a) ComponentClass-instance(s), require all the
@@ -133,10 +129,6 @@ define(function(require) {
 					success(component);
 				}
 			},
-
-			/**
-			 *
-			 */
 			createRootComponent: function(rootNode, success, failure) {
 				var me = this;
 
@@ -185,10 +177,6 @@ define(function(require) {
 					f(this._root);
 				}
 			},
-
-			/**
-			 *
-			 */
 			initializeComponent: function(component, node, success, failure) {
 				if(component !== this._root) {
 					// This is an owned/nested component
@@ -220,10 +208,6 @@ define(function(require) {
 					success(component);
 				}
 			},
-
-			/**
-			 *
-			 */
 			createComponents: function(nodes, success, failure) {
 				var count = nodes.length;
 				var result;
@@ -245,16 +229,12 @@ define(function(require) {
 					});
 				}
 			},
-
-			/**
-			 *
-			 */
 			setProperties: function(component, node) {
 				// extend properties
 				component['@properties'] = js.extend(component['@properties'] || {}, node.properties);
 
 				var properties = component.defineProperties();
-				for( var k in node.properties) {
+				for(var k in node.properties) {
 					var property;
 					if((property = properties[k]) === undefined) {
 //						console.warn(String.format("Property %n.%s does not exist - %n", component.constructor, k,
@@ -265,14 +245,13 @@ define(function(require) {
 					}
 				}
 			},
-
-			/**
-			 *
-			 * @param property
-			 * @param component
-			 * @param value
-			 */
 			setPropertyValue: function(property, component, value) {
+				/**
+				 *
+				 * @param property
+				 * @param component
+				 * @param value
+				 */
 				if(property.isReference()) {
 					this._references.push({
 						property: property,

package/src/data/Array.js

@@ -353,4 +353,4 @@ define(function(require) {
 		}
 	});
 
-});
+});

package/src/prototypes/App.desktop.js

@@ -4,7 +4,7 @@ var HE = require("util/HtmlElement");
 HE.addClass(document.body, window.navigator.platform);
 
 ["", {}, [
-    ["#client", {
-        formUri: "ui/forms/Portal<>"
-    }]
+    // ["#client", {
+    //     formUri: "ui/forms/Portal<>"
+    // }]
 ]];

package/src/prototypes/App.toast.js

@@ -15,7 +15,7 @@
 		var scope = this.getScope();
 		var elem = new Element(this);
 
-		var timeout = options.hasOwnProperty("timeout") ? options.timeout : 1500;
+		var timeout = options.ms || (options.hasOwnProperty("timeout") ? options.timeout : 1500);
 		var content = options.content || "No toast content";
 		var classes = options.classes || "fade";
 
@@ -64,9 +64,10 @@
 			},
 			right: "0",
     		left: "0",
-    		bottom: "40px",
+    		bottom: "20px",
     		"z-index": "20000",
     		"pointer-events": "none",
+    		
     		".{./Element}": {
     			"pointer-events": "all",
     			"a": {
@@ -117,7 +118,21 @@
         		"&.padding-right-20px": {
         			"padding-right": "20px"
         		},
-    		}
+	    		"&.centered": {
+	    			"text-align": "center",
+		    		// ".{./Element}": {
+		    			"margin-left": "auto",
+		    			"margin-right": "auto",
+		    			"text-align": "left",
+		    			"float": "none"
+		    		// },
+		    	},
+		    	"&.paragraph": {
+	    			'max-width': "35%"
+		    	}
+    		},
+    		
+    		
     	}
     }]
 ]];

package/src/prototypes/ui/forms/Home.tree.js

@@ -1,4 +1,4 @@
-"vcl/ui/LargeIcon, vcl/ui/Node, vcl/ui/FormContainer, vcl/ui/Node.closeable";
+"vcl/ui/LargeIcon, vcl/ui/Node, vcl/ui/FormContainer, vcl/ui/Node-closeable";
 
 var Node = require("vcl/ui/Node");
 var FormContainer = require("vcl/ui/FormContainer");
@@ -219,7 +219,7 @@ var Handlers = {
 	}
 };
 
-["", {
+[(""), {
 	vars: {
     	"App": {
     		getState: function() {
@@ -297,22 +297,16 @@ var Handlers = {
 			}
 		}
 	},
-	onMessage: function(name, params, sender) {
+	onMessage: function(name, message, sender) {
 		var scope = this.getScope();
 
 		if(name === "openform") {
-			var Node = require("vcl/ui/Node.closeable");
+			var Node = require("vcl/ui/Node-closeable");
 			var FormContainer = require("vcl/ui/FormContainer");
 
 			// TODO Merge with Portal
 
-			var parent = params.parent || scope.tree.getSelection()[0];
-
-			// TODO find the correct parent based upon the sender
-//			while(parent && parent.getVar("control")._form !== sender._owner) {
-//				parent = parent._parent;
-//			}
-
+			var parent = message.parent || scope.tree.getSelection()[0];
 			var node = new Node(this);
 			node.override({
 				onclick: function(evt) {
@@ -326,21 +320,22 @@ var Handlers = {
 			node.addClass("closeable");
 			
 			var container = new FormContainer(node);
-			container.setFormUri(params.uri);
-			if(params.params) {
-				container.setFormParams(params.params);
-				node.setVars(params.params);
+			container.setFormUri(message.uri);
+			if(message.params) {
+				container.setFormParams(message.params);
+				node.setVars(message.params);
 			}
 
-			if(params.path) {
-				node.print("varring path", params.path);
-				node.vars("path", params.path);
+			if(message.path) {
+				node.print("varring path", message.path);
+				node.vars("path", message.path);
 			}
 
 			// @overrides ui/forms/Home<>
 			container.setVisible(false);
 			container.setParent(scope.client);
-			node.setText(params.text || params.title || "&nbsp;");
+			
+			node.setText(message.text || message.title || "&nbsp;");
 			node.setVar("control", container);
 			node.setParent(parent || scope.tree);
 			node.update(function() {
@@ -354,12 +349,12 @@ var Handlers = {
 				},
 				"formloadstart": function() {
 					node.addClass("loading");
-					node.setText(params.title || "&nbsp;");
+					node.setText(message.title || "&nbsp;");
 				},
 				"formloadend": function() {
 					node.removeClass("loading");
-					if(params.callback) {
-						params.callback(this._form);
+					if(message.callback) {
+						message.callback(this._form);
 					}
 				},
 				"formload": function() {
@@ -370,7 +365,7 @@ var Handlers = {
                         if (text instanceof Array) {
                             node.setText(text.join(""));
                         } else {
-                            node.setText(String.format("%H", text || params.title));
+                            node.setText(String.format("%H", text || message.title));
                         }
 					}
 					form.on("captionchanged", f);
@@ -382,17 +377,17 @@ var Handlers = {
 				parent.setExpanded(true);
 			}
 
-			if(params.activate !== false) {
+			if(message.activate !== false) {
 				scope.tree.setSelection([node]);
-			} else if(params.lazyLoad !== true) {
+			} else if(message.lazyLoad !== true) {
 				container.forceLoad();
 			}
 			
-			parent && parent.setTimeout("update", () => {
-				// Hmprf, what is going on here?
-				parent._parent.updateChildren(true, true);
-				parent._parent.updateChildren(true, true);
-			}, 500);
+			// parent && parent.setTimeout("update", () => {
+			// 	// Hmprf, what is going on here?
+			// 	parent._parent.updateChildren(true, true);
+			// 	parent._parent.updateChildren(true, true);
+			// }, 500);
 
 			return true;
 		}
@@ -407,11 +402,11 @@ var Handlers = {
     		"padding-left": "16px",
     		".{./Node}": {
 		        "&.loading": {
-		        	"background-image": "url(/shared/vcl/images/loading.gif)",
-		        	"background-repeat": "no-repeat",
-		        	"background-position": "-8px 4px",
 		        	">.selection": {
-		        		"opacity": "0.5"
+			        	"background-image": "url(/shared/vcl/images/loading.gif)",
+			        	"background-repeat": "no-repeat",
+			        	"background-position": "10px 5px",
+		        		// "opacity": "0.5"
 		        	},
 		        	"&.selected >.text": {
 		        		"font-weight": "normal"

package/src/ui/List.js

@@ -191,7 +191,7 @@ define(function(require) {
 					s.left = String.format("%dpx", bw);
 					s.top = String.format("%dpx", bh + rect.top);
 
-					thisObj._body.setBounds(rect.left, rect.top, undefined, undefined, bw, bh);
+					thisObj._body.setBounds(rect.left, rect.top - 3, undefined, undefined, bw, bh);
 				}];
 
 				args.callee = arguments.callee;

package/src/ui/Popup.js

@@ -15,25 +15,20 @@ define(function(require) {
 
 				this._hook = new DocumentHook(undefined, true);
 				js.mixIn(this._hook, {
-
-					/**
-					 *
-					 */
-					keydown: function(evt) {
+					keydown: (evt) => {
 						if(evt.keyCode === 27) {
 							popup.close();
 							evt.preventDefault();
 						}
 					},
-
-					/**
-					 *
-					 */
-					click: function(evt) {
-						if(!HtmlElement.hasParent(evt.target, popup._node)) {
+					click: (evt) => {
+						var hasParent = HtmlElement.hasParent(evt.target, popup._node);
+						if(popup._autoClose || !hasParent) {
 							popup.close();
-							evt.bubbleUp = false;
-							evt.preventDefault(); // for A's
+							if(!hasParent) {
+								evt.bubbleUp = false;
+								evt.preventDefault(); // for A's
+							}
 						}
 					}
 				});
@@ -45,6 +40,7 @@ define(function(require) {
 			},
 
 			_visible: false,
+			_autoClose: true,
 			_autoSize: "both",
 			_hook: null,
 
@@ -58,25 +54,29 @@ define(function(require) {
 				 * @param relativeTo
 				 * @param onClose
 				 */
-				if(!this._hook.isActive()) {
-					var p = relativeTo.clientToDocument(0, 0);
-					var cs = relativeTo.getComputedStyle();
-					var cs_ = this.getComputedStyle();
-
-					if(this._parent) {
-						p = this._parent.documentToClient(p);
-					}
+				const align = () => {
+	
+						var p = relativeTo.clientToDocument(0, 0);
+						var cs = relativeTo.getComputedStyle();
+						var cs_ = this.getComputedStyle();
+
+						if(this._parent) {
+							p = this._parent.documentToClient(p);
+						}
+						
+						if(position.origin === "bottom-left") {
+							this.setLeft(p.x + (position.dx || 0));
+							this.setTop(p.y + parseInt(cs.height, 10) + (position.dy || 0));
+						} else if(position.origin === "bottom-right") {
+							this.setLeft(p.x + parseInt(cs.width, 10) + (position.dx || 0) - parseInt(cs_.width, 10));
+							this.setTop(p.y + parseInt(cs.height, 10) + (position.dy || 0));
+						}
+					};
 
-					if(position.origin === "bottom-left") {
-						this.setLeft(p.x + (position.dx || 0));
-						this.setTop(p.y + parseInt(cs.height, 10) + (position.dy || 0));
-					} else if(position.origin === "bottom-right") {
-						this.setLeft(p.x + parseInt(cs.width, 10) + (position.dx || 0) - parseInt(cs_.width, 10));
-						this.setTop(p.y + parseInt(cs.height, 10) + (position.dy || 0));
-					}
+				var n = 2;
+				if(!this._hook.isActive()) {
 					
 					this.setVisible(true);
-
 					this._hook.activate();
 
 					this._hook.release = function() {
@@ -86,8 +86,11 @@ define(function(require) {
 						onClose();
 					};
 
+					this.update(align);
 					this.onpopup();
 				}
+				
+				align();
 			},
 			close: function() {
 				if(this._hook.isActive()) {
@@ -134,6 +137,9 @@ define(function(require) {
 			}
 		},
 		properties: {
+			"autoClose": {
+				type: Class.Type.BOOLEAN
+			},
 			"onPopup": {
 				type: Class.Type.EVENT
 			},

package/src/ui/Select.js

@@ -79,7 +79,8 @@ define(function(require) {
 				type: Type.EVENT
 			},
 			"options": {
-				type: Type.ARRAY
+				type: Type.ARRAY,
+				set: Function
 			},
 			"value": {
 				type: Type.STRING,

package/src/ui/Tree.js

@@ -28,13 +28,14 @@ define(function (require) {
 				},
                 ".{./Node}": {
     		        display: "block",
+                	cursor: "pointer",
                     "list-style-type": "none",
                     "white-space": "nowrap",
                     ">.close": {
                     	position: "absolute",
                     	right: "4px",
                     	"padding-top": "2px",
-                    	cursor: "pointer",
+                    	// cursor: "pointer",
                     	display: "none"
                     },
                     ">ol": {
@@ -75,8 +76,8 @@ define(function (require) {
                     },
                     ">.text": {
                         'input[type=checkbox]': `position:relative;top:${checkbox_top}px;`,
-                    	cursor: "pointer",
                         position: "relative",
+                        // cursor: "pointer",//"default",
 //        				width: "100%",
                         display: 'inline-block',
                         'margin-left': "2px",