+ return picker;
+ },
+
+<span id='Ext-form-field-Time-method-onExpand'> /**
+</span> * @private
+ * Enables the key nav for the Time picker when it is expanded.
+ * TODO this is largely the same logic as ComboBox, should factor out.
+ */
+ onExpand: function() {
+ var me = this,
+ keyNav = me.pickerKeyNav,
+ selectOnTab = me.selectOnTab,
+ picker = me.getPicker(),
+ lastSelected = picker.getSelectionModel().lastSelected,
+ itemNode;
+
+ if (!keyNav) {
+ keyNav = me.pickerKeyNav = Ext.create('Ext.view.BoundListKeyNav', this.inputEl, {
+ boundList: picker,
+ forceKeyDown: true,
+ tab: function(e) {
+ if (selectOnTab) {
+ if(me.picker.highlightedItem) {
+ this.selectHighlighted(e);
+ } else {
+ me.collapse();
+ }
+ me.triggerBlur();
+ }
+ // Tab key event is allowed to propagate to field
+ return true;
+ }
+ });
+ // stop tab monitoring from Ext.form.field.Trigger so it doesn't short-circuit selectOnTab
+ if (selectOnTab) {
+ me.ignoreMonitorTab = true;
+ }
+ }
+ Ext.defer(keyNav.enable, 1, keyNav); //wait a bit so it doesn't react to the down arrow opening the picker
+
+ // Highlight the last selected item and scroll it into view
+ if (lastSelected) {
+ itemNode = picker.getNode(lastSelected);
+ if (itemNode) {
+ picker.highlightItem(itemNode);
+ picker.el.scrollChildIntoView(itemNode, false);
+ }
+ }
+ },
+
+<span id='Ext-form-field-Time-method-onCollapse'> /**
+</span> * @private
+ * Disables the key nav for the Time picker when it is collapsed.
+ */
+ onCollapse: function() {
+ var me = this,
+ keyNav = me.pickerKeyNav;
+ if (keyNav) {
+ keyNav.disable();
+ me.ignoreMonitorTab = false;
+ }
+ },
+
+<span id='Ext-form-field-Time-method-onChange'> /**
+</span> * @private
+ * Clears the highlighted item in the picker on change.
+ * This prevents the highlighted item from being selected instead of the custom typed in value when the tab key is pressed.
+ */
+ onChange: function() {
+ var me = this,
+ picker = me.picker;
+
+ me.callParent(arguments);
+ if(picker) {
+ picker.clearHighlight();
+ }
+ },
+
+<span id='Ext-form-field-Time-method-onListSelect'> /**
+</span> * @private
+ * Handles a time being selected from the Time picker.
+ */
+ onListSelect: function(list, recordArray) {
+ var me = this,
+ record = recordArray[0],
+ val = record ? record.get('date') : null;
+ me.setValue(val);
+ me.fireEvent('select', me, val);
+ me.picker.clearHighlight();
+ me.collapse();
+ me.inputEl.focus();
+ }