x4js 2.2.66 → 2.2.69

package/package.json

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

package/src/components/gridview/gridview.ts

@@ -989,7 +989,7 @@ export class Gridview<P extends GridviewProps = GridviewProps, E extends Gridvie
 
 		this._viewport = new Viewport({ content: this._body });
 
-		if (!this._has_footer) {
+		if (!this.props.footer) {
 			this.setStyleVariable("--footer-height", "0");
 		}
 

package/src/components/header/header.module.scss

@@ -17,7 +17,7 @@
 	.cell {
 		border-bottom: 1px solid transparent;
 		overflow: hidden;
-		min-width: 3rem;
+		//min-width: 3rem;
 
 		transition: border-color 0.5s ease;
 		padding: 4px;

package/src/components/header/header.ts

@@ -18,6 +18,8 @@ interface HeaderProps extends Omit<ComponentProps,"content"> {
 	target?: Component;	// target element to set header col variable width var( --{name}-width ) parent element if not set
 }
 
+const CELL_MW = 8;
+
 /**
  * by default when a header item is resized, the 'target' style '--{name}-width' is updated
  * 
@@ -63,10 +65,19 @@ export class Header extends HBox<HeaderProps> {
 				this._calc_sizes( );
 			})
 
+			sizer.on( "start", ( ) => {
+				//todo: remove flex on all cols
+			} );
+
+			sizer.on( "stop", ( ) => {
+				//todo: restore flex
+			} );
+
 			sizer.on( "resize", ( ev ) => {
 				//cell.setStyleValue( "flexGrow", "0" );
+				const sze = ev.size<CELL_MW ? CELL_MW : ev.size;
 				cell.setInternalData("flex",0);
-				cell.setInternalData("width",ev.size);
+				cell.setInternalData("width",sze);
 				this._calc_sizes( );
 			});
 
@@ -129,6 +140,10 @@ export class Header extends HBox<HeaderProps> {
 				width = c.getInternalData( "width" );
 			}
 
+			if( width<CELL_MW ) {
+				width = CELL_MW;
+			}
+
 			c.setWidth( width );
 
 			const item = c.getInternalData<HeaderItem>( 'data' );
@@ -137,7 +152,7 @@ export class Header extends HBox<HeaderProps> {
 				this.parentElement().setStyleVariable( `--${item.name}-width`, width + "px");
 			}
 			else {
-			this.props.target?.setStyleVariable( `--${item.name}-width`, width + "px");
+				this.props.target?.setStyleVariable( `--${item.name}-width`, width + "px");
 			}
 			
 			fullw += width;

package/src/components/textarea/textarea.module.scss

@@ -56,7 +56,7 @@
 		}
 	}
 
-	.x4label:has(.empty) {
+	.x4label#text:has(.empty) {
 		display: none;
 	}
 

package/src/components/textarea/textarea.ts

@@ -49,7 +49,9 @@ export class SimpleTextArea extends Component<TextAreaProps> {
 		super( { ...props, tag: "textarea" } );
 
 		this.setAttribute( "name", props.name );
-		this.setAttribute( "value", props.value+'' );
+		if( props.value ) {
+			this.setAttribute( "value", props.value+'' );
+		}
 
 		if( props.resize!==undefined ) {
 			this.setStyleValue( "resize", props.resize===false ? "none" : props.resize as string );
@@ -112,9 +114,12 @@ export class TextArea extends VBox {
 	constructor( props: TextAreaProps ) {
 		super( props );
 
+
+		const { label, value, resize, readonly, trim, name } = props;
+
 		this.setContent( [
 			new Label( { text: props.label }),
-			this._input = new SimpleTextArea( props )
+			this._input = new SimpleTextArea( { label,value,resize,readonly,trim } )
 		])
 	}
 

package/src/core/core_data.ts

@@ -270,6 +270,12 @@ export namespace data {
 
 export class DataModel<T = any> {
 
+	constructor( fields?: FieldInfo[] ) {
+		if( fields ) {
+			this.addField( ...fields );
+		}
+	}
+
     /**
      * dynamic DataModel
      */
@@ -1077,7 +1083,7 @@ export class DataStore<T = any> extends EventSource<DataStoreEventMap> {
 			} );
 		}
 
-		return result>=0 ? this.getByIndex(result) : null;
+		return result>=0 ? this.m_records[result] : null;
 	}
 
 	export( ) {