x4js 2.2.50 → 2.2.51

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "x4js",
-  "version": "2.2.50",
+  "version": "2.2.51",
   "type": "module",
   "main": "src/x4.ts",
   "module": "src/x4.ts",

package/src/components/combobox/combobox.ts

@@ -14,7 +14,7 @@
  * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
  **/
 
-import { Component, ComponentEvents, ComponentProps, EvSelectionChange, makeUniqueComponentId } from '../../core/component';
+import { Component, ComponentEvents, ComponentProps, EvClick, EvSelectionChange, makeUniqueComponentId } from '../../core/component';
 import { class_ns, IComponentInterface, IFormElement, kbNav, safeText, sanitizeHtml, UnsafeHtml } from '../../core/core_tools';
 import { EventCallback } from '../../core/core_events';
 
@@ -31,7 +31,8 @@ import icon from "./updown.svg";
 
 
 interface DropdownEvents extends PopupEvents {
-	selectionChange: EvSelectionChange;
+	//selectionChange: EvSelectionChange;
+	click: EvClick;
 }
 
 
@@ -57,8 +58,9 @@ export class DropdownList extends Popup<DropdownProps,DropdownEvents> {
 			ev.preventDefault( );
 		}, true );
 
-		this._list.on( "selectionChange", ( ev ) => {
-			this.fire( "selectionChange", ev );
+		this._list.on( "click", ( ev ) => {
+			//this.fire( "selectionChange", ev );
+			this.fire( "click", ev );
 		})
 	}
 
@@ -152,11 +154,11 @@ export class Combobox extends Component<ComboboxProps,ComboboxEvents> {
 			}
 		}
 
-		this._popup.on( "selectionChange", ( ev ) => {
-			const [sel] = ev.selection as ListboxID[];
+		this._popup.on( "click", ( ev ) => {
+			const sel = ev.context as ListboxID;
 			if( sel!==undefined ) {	// no empty sel
 				_select( sel );			
-				this.fire( "selectionChange", ev );
+				this.fire( "selectionChange", { selection: [sel], empty: false }  );
 			}
 		});
 
@@ -178,8 +180,11 @@ export class Combobox extends Component<ComboboxProps,ComboboxEvents> {
 		switch( ev.key ) {
 			case "Enter":
 			case "Escape": {
-				this._popup.show( false );
-				break;
+				if( this._popup.isOpen( ) ) {
+					this._popup.show( false );
+					break;
+				}
+				return;
 			}
 
 			case "ArrowUp":

package/src/components/dialog/dialog.ts

@@ -89,7 +89,8 @@ export class Dialog<P extends DialogProps = DialogProps, E extends DialogEvents
 								this.fire("btnclick", { button: props.closable } );
 							}
 							else {
-								this.fire("btnclick", { button: props.buttons[0] } );
+								//<no it's ok 99% ! this.fire("btnclick", { button: props.buttons[0] } );
+								this.close( );
 							}
 						}
 					}) : null,
@@ -113,6 +114,14 @@ export class Dialog<P extends DialogProps = DialogProps, E extends DialogEvents
 				// todo cancel
 				ev.preventDefault();
 				ev.stopPropagation();
+
+				if( isString(props.closable) ) {
+					this.fire("btnclick", { button: props.closable } );
+				}
+				else {
+					//<no it's ok 99% ! this.fire("btnclick", { button: props.buttons[0] } );
+					this.close( );
+				}
 			}
 			else if (ev.key == 'Enter') {
 				const def = this.query<Button>('button.default');
@@ -124,6 +133,10 @@ export class Dialog<P extends DialogProps = DialogProps, E extends DialogEvents
 				}
 			}
 		})
+
+		asap( ( ) => {
+			this.focusNext( true );
+		} );
 	}
 
 	private focusNext( next: boolean) : boolean {

package/src/components/listbox/listbox.ts

@@ -251,14 +251,14 @@ export class Listbox extends Component<ListboxProps,ListboxEvents> {
 		while( target && target!=this.dom ) {
 			const c = componentFromDOM( target );
 
-			// avoid trapping child ckick
-			if( c.dom.tagName==='INPUT' ) {
+			// avoid trapping child click
+			if( c && c.dom.tagName==='INPUT' ) {
 				return;
 			}
 
 			if( c && c.hasClass("x4item") ) {
 				const id = c.getInternalData( "id" );
-				const fev: ComponentEvent = { context:id };
+				const fev: EvClick = { context:id };
 				if (ev.type == 'click') {
 					this.fire('click', fev );
 				}
@@ -276,6 +276,10 @@ export class Listbox extends Component<ListboxProps,ListboxEvents> {
 			target = target.parentElement;
 		}
 
+		if (ev.type == 'click') {
+			this.fire('click', {} );
+		}
+		
 		this.clearSelection( );
 
 		ev.stopImmediatePropagation();