diff --git a/demos/form2/js/form.js b/demos/form2/js/form.js
index 93bbcb7f..943badad 100644
--- a/demos/form2/js/form.js
+++ b/demos/form2/js/form.js
@@ -1,4 +1,4 @@
-Ox.load({UI: {}, Geo:{}}, function() {
+Ox.load({UI: {}, Geo:{}, Unicode: {}}, function() {
 
     var $body = $("body"),
         $panel = $("<div>")
@@ -334,10 +334,18 @@ Ox.load({UI: {}, Geo:{}}, function() {
             "ColorInput": [
                 {
                     options: {
-                        id: "colorInput",
-                        value: "255, 0, 0"
+                        id: "colorInputRGB",
+                        value: [255, 0, 0]
                     },
-                    title: "ColorInput"
+                    title: "RGB ColorInput"
+                },
+                {
+                    options: {
+                        id: "colorInputHSL",
+                        mode: "HSL",
+                        value: [0, 1, 0.5]
+                    },
+                    title: "HSL ColorInput"
                 }
             ],
             "DateInput": [
@@ -625,9 +633,9 @@ Ox.load({UI: {}, Geo:{}}, function() {
                 },
                 {
                     options: {
-                        autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
+                        autocomplete: Ox.sortASCII(Ox.COUNTRIES.map(function(v, i) {
                             return v.name;
-                        }),
+                        })),
                         autocompleteReplace: true,
                         id: "autocompleteReplace"
                     },
@@ -635,9 +643,9 @@ Ox.load({UI: {}, Geo:{}}, function() {
                 },
                 {
                     options: {
-                        autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
+                        autocomplete: Ox.sortASCII(Ox.COUNTRIES.map(function(v, i) {
                             return v.name;
-                        }),
+                        })),
                         autocompleteReplace: true,
                         autocompleteReplaceCorrect: true,
                         id: "autocompleteReplaceCorrect"
@@ -646,9 +654,9 @@ Ox.load({UI: {}, Geo:{}}, function() {
                 },
                 {
                     options: {
-                        autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
+                        autocomplete: Ox.sortASCII(Ox.COUNTRIES.map(function(v, i) {
                             return v.name;
-                        }),
+                        })),
                         autocompleteSelect: true,
                         autocompleteSelectHighlight: true,
                         id: "autocompleteSelect"
@@ -657,9 +665,9 @@ Ox.load({UI: {}, Geo:{}}, function() {
                 },
                 {
                     options: {
-                        autocomplete: $.map(Ox.COUNTRIES, function(v, i) {
+                        autocomplete: Ox.sortASCII(Ox.COUNTRIES.map(function(v, i) {
                             return v.name;
-                        }),
+                        })),
                         autocompleteReplace: true,
                         autocompleteSelect: true,
                         autocompleteSelectHighlight: true,
@@ -1087,6 +1095,19 @@ Ox.load({UI: {}, Geo:{}}, function() {
                         width: 128
                     },
                     title: "Text Select with Width"
+                },
+                {
+                    options: {
+                        id: "textSelectMaxWidth",
+                        items: [
+                            {id: "one", title: "Item One"},
+                            {id: "two", title: "Item Two"},
+                            {id: "three", title: "Item Three Has a Long Title"}
+                        ],
+                        maxWidth: 128,
+                        width: 128
+                    },
+                    title: "Text Select with Max Width"
                 }
             ],
             "TimeInput": [
@@ -1181,7 +1202,7 @@ Ox.load({UI: {}, Geo:{}}, function() {
                                         click: function() { $dialog.close(); }
                                     })
                                 ],
-                                content: $('<div>').html(Ox.isUndefined(value) ? "undefined" : value),
+                                content: $('<div>').css({margin: '16px'}).html(Ox.isUndefined(value) ? "undefined" : value),
                                 height: 128,
                                 id: "value",
                                 title: "Value",