Released 0.6.6.

bower.json

@@ -2,7 +2,7 @@
 	"name": "selectize",
 	"keywords": ["select", "ui", "form", "input", "control", "autocomplete", "tagging", "tag"],
 	"description": "Selectize is a jQuery-based custom <select> UI control. Useful for tagging, contact lists, country selectors, etc.",
-	"version": "0.6.5",
+	"version": "0.6.6",
 	"license": "Apache License, Version 2.0",
 	"readmeFilename": "README.md",
 	"repository": {

selectize.css

@@ -1,4 +1,4 @@
-/*! selectize.css - v0.6.5 | https://github.com/brianreavis/selectize.js | Apache License (v2) */
+/*! selectize.css - v0.6.6 | https://github.com/brianreavis/selectize.js | Apache License (v2) */
 
 /* --- file: "src/selectize.css" --- */
 
@@ -101,9 +101,6 @@
 	border: 1px solid #d0d0d0;
 }
 .selectize-dropdown {
-	max-height: 200px;
-	overflow-y: auto;
-	overflow-x: hidden;
 	background: #fff;
 	margin-top: -1px;
 	border-top: 0 none;
@@ -114,6 +111,11 @@
 	-moz-border-radius: 0 0 3px 3px;
 	border-radius: 0 0 3px 3px;
 }
+.selectize-dropdown-content {
+	max-height: 200px;
+	overflow-y: auto !important;
+	overflow-x: hidden !important;
+}
 .selectize-dropdown [data-selectable],
 .selectize-dropdown .optgroup-header {
 	padding: 6px 9px;
@@ -249,7 +251,7 @@
 	position: absolute;
 	z-index: 2;
 }
-.selectize-dropdown > * {
+.selectize-dropdown [data-selectable] {
 	cursor: pointer;
 	overflow: hidden;
 }
@@ -280,6 +282,23 @@
 	box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
 }
 
+/* --- file: "src/plugins/dropdown_header/plugin.css" --- */
+
+.selectize-dropdown-header {
+	padding: 6px 9px;
+	-moz-border-radius: 3px 3px 0 0;
+	-webkit-border-radius: 3px 3px 0 0;
+	border-radius: 3px 3px 0 0;
+}
+.selectize-dropdown-header-close {
+	float: right;
+	color: #ddd;
+	font-size: 20px !important;
+}
+.selectize-dropdown-header-close:hover {
+	color: #aaa;
+}
+
 /* --- file: "src/plugins/optgroup_columns/plugin.css" --- */
 
 .selectize-control.plugin-optgroup_columns .optgroup {

selectize.jquery.json

@@ -1,6 +1,6 @@
 {
 	"name": "selectize",
-	"version": "0.6.5",
+	"version": "0.6.6",
 	"title": "Selectize.js",
 	"author": {
 		"name": "Brian Reavis",

selectize.js

@@ -1,4 +1,4 @@
-/*! selectize.js - v0.6.5 | https://github.com/brianreavis/selectize.js | Apache License (v2) */
+/*! selectize.js - v0.6.6 | https://github.com/brianreavis/selectize.js | Apache License (v2) */
 
 (function(factory) {
 	if (typeof exports === 'object') {
@@ -786,6 +786,8 @@
 				self.disable();
 			}
 
+			self.trigger('initialize');
+
 			// preload options
 			if (settings.preload) {
 				self.onSearchChange('');
@@ -798,6 +800,7 @@
 		 */
 		setupCallbacks: function() {
 			var key, fn, callbacks = {
+				'initialize'     : 'onInitialize',
 				'change'         : 'onChange',
 				'item_add'       : 'onItemAdd',
 				'item_remove'    : 'onItemRemove',
@@ -1209,17 +1212,17 @@
 
 			if (scroll || !isset(scroll)) {
 
-				height_menu   = self.$dropdown.height();
+				height_menu   = self.$dropdown_content.height();
 				height_item   = self.$activeOption.outerHeight(true);
-				scroll        = self.$dropdown.scrollTop() || 0;
-				y             = self.$activeOption.offset().top - self.$dropdown.offset().top + scroll;
+				scroll        = self.$dropdown_content.scrollTop() || 0;
+				y             = self.$activeOption.offset().top - self.$dropdown_content.offset().top + scroll;
 				scroll_top    = y;
 				scroll_bottom = y - height_menu + height_item;
 
 				if (y + height_item > height_menu - scroll) {
-					self.$dropdown.stop().animate({scrollTop: scroll_bottom}, animate ? self.settings.scrollDuration : 0);
+					self.$dropdown_content.stop().animate({scrollTop: scroll_bottom}, animate ? self.settings.scrollDuration : 0);
 				} else if (y < scroll) {
-					self.$dropdown.stop().animate({scrollTop: scroll_top}, animate ? self.settings.scrollDuration : 0);
+					self.$dropdown_content.stop().animate({scrollTop: scroll_top}, animate ? self.settings.scrollDuration : 0);
 				}
 
 			}
@@ -2310,7 +2313,7 @@
 						html = '<div class="item">' + escape_html(label) + '</div>';
 						break;
 					case 'option_create':
-						html = '<div class="create">Create <strong>' + escape_html(data.input) + '</strong>&hellip;</div>';
+						html = '<div class="create">Add <strong>' + escape_html(data.input) + '</strong>&hellip;</div>';
 						break;
 				}
 			}
@@ -2374,9 +2377,10 @@
 		dropdownParent: null,
 
 		/*
-		load            : null, // function(query, callback)
-		score           : null, // function(search)
-		onChange        : null, // function(value)
+		load            : null, // function(query, callback) { ... }
+		score           : null, // function(search) { ... }
+		onInitialize    : null, // function() { ... }
+		onChange        : null, // function(value) { ... }
 		onItemAdd       : null, // function(value, $item) { ... }
 		onItemRemove    : null, // function(value) { ... }
 		onClear         : null, // function() { ... }
@@ -2567,6 +2571,57 @@
 
 	});
 
+	/* --- file: "src/plugins/dropdown_header/plugin.js" --- */
+
+	/**
+	* Plugin: "dropdown_header" (selectize.js)
+	* Copyright (c) 2013 Brian Reavis & contributors
+	*
+	* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
+	* file except in compliance with the License. You may obtain a copy of the License at:
+	* http://www.apache.org/licenses/LICENSE-2.0
+	*
+	* Unless required by applicable law or agreed to in writing, software distributed under
+	* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
+	* ANY KIND, either express or implied. See the License for the specific language
+	* governing permissions and limitations under the License.
+	*
+	* @author Brian Reavis <brian@thirdroute.com>
+	*/
+
+	Selectize.registerPlugin('dropdown_header', function(options) {
+		var self = this;
+
+		options = $.extend({
+			title         : 'Untitled',
+			headerClass   : 'selectize-dropdown-header',
+			titleRowClass : 'selectize-dropdown-header-title',
+			labelClass    : 'selectize-dropdown-header-label',
+			closeClass    : 'selectize-dropdown-header-close',
+
+			html: function(data) {
+				return (
+					'<div class="' + data.headerClass + '">' +
+						'<div class="' + data.titleRowClass + '">' +
+							'<span class="' + data.labelClass + '">' + data.title + '</span>' +
+							'<a href="javascript:void(0)" class="' + data.closeClass + '">&times;</a>' +
+						'</div>' +
+					'</div>'
+				);
+			}
+		}, options);
+
+		self.setup = (function() {
+			var original = self.setup;
+			return function() {
+				original.apply(self, arguments);
+				self.$dropdown_header = $(options.html(options));
+				self.$dropdown.prepend(self.$dropdown_header);
+			};
+		})();
+
+	});
+
 	/* --- file: "src/plugins/optgroup_columns/plugin.js" --- */
 
 	/**