x4js 2.0.26 → 2.0.30

package/src/components/tabs/tabs.module.scss

@@ -40,6 +40,7 @@
 	&> .body {
 		padding: 8px;
 		border: 1px solid var( --border );
+		min-height: 0;
 	}
 }
 

package/src/components/textarea/textarea.ts

@@ -32,6 +32,7 @@ interface TextAreaProps extends BaseProps {
 	value?: string;
 	resize?: boolean;
 	readonly?: boolean;
+	trim?: boolean;
 }
 
 
@@ -39,7 +40,7 @@ interface TextAreaProps extends BaseProps {
  * 
  */
 
-class SimpleTextArea extends Component {
+class SimpleTextArea extends Component<TextAreaProps> {
 
 	constructor( props: TextAreaProps ) {
 		super( { ...props, tag: "textarea" } );
@@ -61,7 +62,12 @@ class SimpleTextArea extends Component {
 	}
 
 	getText( ) {
-		return (this.dom as HTMLTextAreaElement).value;
+		let text = (this.dom as HTMLTextAreaElement).value;
+		if( this.props.trim!==false ) {
+			text = text.trim();
+		}
+
+		return text;
 	}
 
 	queryInterface<T>(name: string): T {

package/src/components/textedit/textedit.ts

@@ -88,7 +88,14 @@ export class TextEdit extends HBox {
 		}
 
 		const gadgets = props.inputGadgets ?? [];
+		gadgets.forEach( g => {
+			g.addClass( "gadget" );
+		})
+
+
 		const iprops: InputProps = { ...props, id: props.inputId, attrs: props.inputAttrs, width: props.inputWidth };
+		// no propagation...
+		delete iprops.cls;
 
 		this.setContent( [
 			props.label ? new HBox( { id: "label", width: props.labelWidth, content: [

package/src/components/themes.scss

@@ -33,6 +33,7 @@ $color--interval: 8.4%;
 	--color-primary-a90: #{darken($color--base, $color--interval * 4)};
 	--color-primary-a100: #000000;
 
+	--color-danger-a30: #{lighten(#c01010,30%)};
 	--color-danger-a50: #c01010;
 	--color-danger-a60: #{darken(#c01010,10%)};
 
@@ -46,6 +47,7 @@ $color--interval: 8.4%;
 	// Backgrounds
 	--background-primary: var(--color-primary-a0); // Fond principal
 	--background-secondary: var(--color-primary-a10); // Fond secondaire
+	--background-ternary: #f4f4f4; // Fond secondaire
 
 	// Texts
 	--text-primary: var(--color-primary-a100); // Texte principal

package/src/components/tooltips/tooltips.ts

@@ -28,6 +28,7 @@ import icon from "./comments-question.svg"
 
 let last_hit: HTMLElement = null;
 let tooltip: Tooltip = null;
+let mouse_pos: Point = {x:0, y:0 };
 
 const timer = new Timer( );
 
@@ -53,15 +54,20 @@ export function initTooltips( ) {
 
 	}, true );
 
-	document.addEventListener( "mouseleave", ( ev: Event ) => {
+	document.addEventListener( "mouseleave", ( ev: MouseEvent ) => {
 		//console.log( "leave", ev.target );
-
 		if( last_hit && ev.target==last_hit ) {
 			last_hit = null;
 			closeTT( );
 		}
 
 	}, true );
+
+	document.addEventListener( "mousemove", ( ev: MouseEvent ) => {
+		if( last_hit ) {
+			mouse_pos = { x:ev.pageX, y:ev.pageY }
+		}
+	});
 }
 
 function showTT( text: string, rc: Rect, pt: Point ) {
@@ -71,8 +77,14 @@ function showTT( text: string, rc: Rect, pt: Point ) {
 
 	timer.setTimeout( null, 300, ( ) => {
 		tooltip.setText( unsafeHtml(text) );
+
+		let y = mouse_pos.y;
+		if( rc.contains(mouse_pos) ) {
+			y = rc.bottom;
+		}
+
 		//tooltip.displayNear( rc, "top left", "bottom left", {x:0,y:4} );
-		tooltip.displayAt( pt.x+17, pt.y+17 );
+		tooltip.displayAt( mouse_pos.x+17, y+5 );
 	} );
 }