x4js 2.0.15 → 2.0.18

package/lib/types/x4js.d.ts

@@ -423,11 +423,6 @@ declare module 'x4js' {
 		uievent: UIEvent;
 	}
 
-	export interface EvMessage extends ComponentEvent {
-		msg: string;
-		params?: any;
-	}
-
 	export interface EvDrag extends ComponentEvent {
 		element: unknown;
 		data: any;
@@ -441,6 +436,43 @@ declare module 'x4js' {
 	export interface EvDblClick extends ComponentEvent {
 	}
 
+	// ---------------------------------------
+	// from /src/core/core_application.ts
+
+	export interface EvMessage extends CoreEvent {
+		msg: string;
+		params: any;
+	}
+
+	export interface ApplicationEvents extends EventMap {
+		global: EvMessage;
+		message: EvMessage;
+	}
+
+	 class Process  {
+		getMaxTouchPoints(  ): void;
+	}
+
+	export class Application<E extends ApplicationEvents = ApplicationEvents> extends CoreElement<E> {
+		env: any;
+		mainview: Component;
+		process: any;
+		constructor(  );
+		setMainView( view: Component ): void;
+		instance<P extends Application = Application>(  ): P;
+		getMainView(  ): void;
+		setEnv( name: string, value: any ): void;
+		getEnv( name: string, def_value: any ): void;
+		fireGlobal( msg: string, params: any ): void;
+		_setupKeyboard(  ): void;
+		focusNext( next: boolean ): void;
+		setupSocketMessaging( path: string, looseCallback: ( ) => void ): void;
+		getStorage( name: string ): string;
+		getStorageJSON( name: string ): any;
+		setStorage( name: string, value: string | number ): void;
+		setStorageJSON( name: string, value: any ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/core/core_colors.ts
 
@@ -476,6 +508,177 @@ declare module 'x4js' {
 		isInvalid(  ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/core/core_data.ts
+
+	type DataRecordID = any;
+
+	type DataFieldValue = string | Date | number | boolean;
+
+	type ChangeCallback = (type: string, id?: DataRecordID) => void;
+
+	type CalcCallback = () => string;
+
+	type FieldType = 'string' | 'int' | 'float' | 'date' | 'bool' | 'array' | 'object' | 'any' | 'calc';
+
+	type DataIndex = Uint32Array;
+
+	export interface EvDataChange extends CoreEvent {
+		change_type: 'create' | 'update' | 'delete' | 'data' | 'change';
+		id?: DataRecordID;
+	}
+
+	export interface MetaData  {
+		type?: FieldType;
+		prec?: number;
+		required?: boolean;
+		calc?: (rec: DataRecord) => any;
+		model?: DataModel;
+	}
+
+	export interface FieldInfo extends MetaData {
+		name: string;
+	}
+
+	 class MetaInfos  {
+		name: string;
+		id: string;
+		fields: FieldInfo[];
+		constructor( name: string );
+	}
+
+	interface ModelConstructor  {
+	}
+
+	export class DataModel  {
+		getFields(  ): FieldInfo[];
+		validate( record: DataRecord ): Error[];
+		getFieldIndex( name: string ): number;
+		serialize<T = any>( input: DataRecord ): T;
+		unSerialize( data: any, id: DataRecordID ): DataRecord;
+		_convertField( field: FieldInfo, input: any ): any;
+		getID( rec: DataRecord ): any;
+		getRaw( name: string | number, rec: DataRecord ): any;
+		getField( name: string, rec: DataRecord ): string;
+	}
+
+	export class DataRecord  {
+	}
+
+	interface DataEventMap extends EventMap {
+		change?: EvChange;
+	}
+
+	type DataSolver = ( data: any ) => DataRecord[];
+
+	export interface DataProxyProps  {
+		url: string;
+		params?: string[];
+		solver?: DataSolver;
+	}
+
+	export class DataProxy extends CoreElement<DataEventMap> {
+		m_props: DataProxyProps;
+		constructor( props: DataProxyProps );
+		load( url: string ): void;
+	}
+
+	interface DataStoreProps  {
+		model: DataModel;
+		data?: any[];
+		url?: string;
+		autoload?: false;
+		solver?: DataSolver;
+	}
+
+	interface DataStoreEventMap extends EventMap {
+		data_change: EvDataChange;
+	}
+
+	export class DataStore extends EventSource<DataStoreEventMap> {
+		m_model: DataModel;
+		m_fields: FieldInfo[];
+		m_records: DataRecord[];
+		m_proxy: DataProxy;
+		m_rec_index: DataIndex;
+		constructor( props: DataStoreProps );
+		load( url: string ): void;
+		reload(  ): void;
+		setData( records: any[] ): void;
+		setRawData( records: DataRecord[] ): void;
+		_rebuildIndex(  ): void;
+		update( rec: DataRecord ): void;
+		append( rec: DataRecord | any ): void;
+		getMaxId(  ): void;
+		delete( id: DataRecordID ): boolean;
+		indexOfId( id: DataRecordID ): number;
+		getById( id: DataRecordID ): DataRecord;
+		getByIndex( index: number ): DataRecord;
+		_getRecord( index: number ): DataRecord;
+		moveTo( other: DataStore ): void;
+		createView( opts: DataViewProps ): DataView;
+		createIndex( filter: FilterInfo ): DataIndex;
+		sortIndex( index: DataIndex, sort: SortProp[] ): void;
+		forEach( cb: ( rec: DataRecord, index: number ) => any ): void;
+		export(  ): void;
+		changed(  ): void;
+		getModel(  ): void;
+	}
+
+	export interface EvViewChange extends CoreEvent {
+		change_type: "change" | "filter" | "sort";
+	}
+
+	interface DataViewEventMap extends EventMap {
+		view_change: EvViewChange;
+	}
+
+	interface DataViewProps  {
+		store?: DataStore;
+		filter?: FilterInfo;
+		order?: string | SortProp[] | SortProp;
+	}
+
+	type FilterFunc = ( rec: DataRecord ) => boolean;
+
+	export interface FilterInfo  {
+		op: '<' | '<=' | '=' | '>=' | '>' | '<>' | 'empty-result' | FilterFunc;
+		field?: string;
+		value?: string | RegExp;
+		caseSensitive?: boolean;
+	}
+
+	export interface SortProp  {
+		field: string;
+		ascending: boolean;
+		numeric?: boolean;
+	}
+
+	export class DataView extends CoreElement<DataViewEventMap> {
+		m_index: DataIndex;
+		m_store: DataStore;
+		m_model: DataModel;
+		m_sort: SortProp[];
+		m_filter: FilterInfo;
+		m_props: DataViewProps;
+		constructor( props: DataViewProps );
+		_storeChange( ev: EvDataChange ): void;
+		filter( filter: FilterInfo ): number;
+		_filter( filter: FilterInfo, notify: boolean ): number;
+		sort( props: SortProp[] ): void;
+		_sort( props: SortProp[], notify: boolean ): void;
+		getStore(  ): void;
+		getCount(  ): void;
+		indexOfId( id: DataRecordID ): number;
+		getByIndex( index: number ): DataRecord;
+		getIdByIndex( index: number ): DataRecordID;
+		getRecId( rec: DataRecord ): DataRecordID;
+		getById( id: DataRecordID ): DataRecord;
+		getModel(  ): void;
+		changed(  ): void;
+		forEach( cb: ( rec: DataRecord, index: number ) => any ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/core/core_dragdrop.ts
 
@@ -500,6 +703,14 @@ declare module 'x4js' {
 		_check(  ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/core/core_react.ts
+
+	export class x4_react  {
+		create_element( tag: string, props: any, content: any[] ): Component;
+		create_element<X extends Component>( tag: string | Constructor<X>, props: X["props"], content: any[] ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/core/core_router.ts
 
@@ -532,6 +743,22 @@ declare module 'x4js' {
 		_find( url: string ): { params: Record<string,any>, handlers: RouteHandler[] };
 	}
 
+	// ---------------------------------------
+	// from /src/core/core_state.ts
+
+	type StateData = boolean | number | string | Date | any;
+
+	type State = Record<string,StateData>;
+
+	export class StateManager  {
+		_state: StateData;
+		_subscribers: Map<string,any>;
+		_currentTracking: Set<string>;
+		constructor( initialState: StateData );
+		getState( path: string, defaultValue: StateData ): void;
+		setState( path: string, value: StateData, context: any ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/core/core_svg.ts
 
@@ -1033,6 +1260,51 @@ declare module 'x4js' {
 		setDate( date: Date ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/components/canvas/canvas_ex.ts
+
+	export interface CanvasEx extends CanvasRenderingContext2D {
+		width: number;
+		height: number;
+		smoothLine( points: any[], path: CanvasPath, move: boolean ): void;
+		smoothLineEx( _points: any[], tension: number, numOfSeg: number, path: CanvasPath, move: boolean, close: boolean ): void;
+		line( x1: number, y1: number, x2: number, y2: number, color: string, lineWidth: number ): void;
+		roundRect( x: number, y: number, width: number, height: number, radius: number ): void;
+		calcTextSize( text: string, rounded: boolean ): { width: number, height: number };
+		setFontSize( fs: number ): void;
+		circle( x: number, y: number, radius: number ): void;
+	}
+
+	// ---------------------------------------
+	// from /src/components/canvas/canvas.ts
+
+	export interface EvPaint extends ComponentEvent {
+		ctx: CanvasEx;
+	}
+
+	interface CanvasEventMap extends ComponentEvents {
+		paint: EvPaint;
+	}
+
+	export interface CanvasProps extends ComponentProps {
+		paint: EventCallback<EvPaint>;
+		clear?: boolean;
+	}
+
+	@class_ns( "x4" ) export class Canvas extends Component<CanvasProps, CanvasEventMap> {
+		m_iwidth: number;
+		m_iheight: number;
+		m_scale: any;
+		m_canvas: Component;
+		constructor( props: CanvasProps );
+		scale( scale: number ): void;
+		getContext(  ): void;
+		$update_rep: any;
+		redraw( wait: number ): void;
+		_paint(  ): void;
+		paint( ctx: CanvasEx ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/components/input/input.ts
 
@@ -1416,177 +1688,6 @@ declare module 'x4js' {
 		constructor( props: FileDropProps );
 	}
 
-	// ---------------------------------------
-	// from /src/core/core_data.ts
-
-	type DataRecordID = any;
-
-	type DataFieldValue = string | Date | number | boolean;
-
-	type ChangeCallback = (type: string, id?: DataRecordID) => void;
-
-	type CalcCallback = () => string;
-
-	type FieldType = 'string' | 'int' | 'float' | 'date' | 'bool' | 'array' | 'object' | 'any' | 'calc';
-
-	type DataIndex = Uint32Array;
-
-	export interface EvDataChange extends CoreEvent {
-		change_type: 'create' | 'update' | 'delete' | 'data' | 'change';
-		id?: DataRecordID;
-	}
-
-	export interface MetaData  {
-		type?: FieldType;
-		prec?: number;
-		required?: boolean;
-		calc?: (rec: DataRecord) => any;
-		model?: DataModel;
-	}
-
-	export interface FieldInfo extends MetaData {
-		name: string;
-	}
-
-	 class MetaInfos  {
-		name: string;
-		id: string;
-		fields: FieldInfo[];
-		constructor( name: string );
-	}
-
-	interface ModelConstructor  {
-	}
-
-	export class DataModel  {
-		getFields(  ): FieldInfo[];
-		validate( record: DataRecord ): Error[];
-		getFieldIndex( name: string ): number;
-		serialize<T = any>( input: DataRecord ): T;
-		unSerialize( data: any, id: DataRecordID ): DataRecord;
-		_convertField( field: FieldInfo, input: any ): any;
-		getID( rec: DataRecord ): any;
-		getRaw( name: string | number, rec: DataRecord ): any;
-		getField( name: string, rec: DataRecord ): string;
-	}
-
-	export class DataRecord  {
-	}
-
-	interface DataEventMap extends EventMap {
-		change?: EvChange;
-	}
-
-	type DataSolver = ( data: any ) => DataRecord[];
-
-	export interface DataProxyProps  {
-		url: string;
-		params?: string[];
-		solver?: DataSolver;
-	}
-
-	export class DataProxy extends CoreElement<DataEventMap> {
-		m_props: DataProxyProps;
-		constructor( props: DataProxyProps );
-		load( url: string ): void;
-	}
-
-	interface DataStoreProps  {
-		model: DataModel;
-		data?: any[];
-		url?: string;
-		autoload?: false;
-		solver?: DataSolver;
-	}
-
-	interface DataStoreEventMap extends EventMap {
-		data_change: EvDataChange;
-	}
-
-	export class DataStore extends EventSource<DataStoreEventMap> {
-		m_model: DataModel;
-		m_fields: FieldInfo[];
-		m_records: DataRecord[];
-		m_proxy: DataProxy;
-		m_rec_index: DataIndex;
-		constructor( props: DataStoreProps );
-		load( url: string ): void;
-		reload(  ): void;
-		setData( records: any[] ): void;
-		setRawData( records: DataRecord[] ): void;
-		_rebuildIndex(  ): void;
-		update( rec: DataRecord ): void;
-		append( rec: DataRecord | any ): void;
-		getMaxId(  ): void;
-		delete( id: DataRecordID ): boolean;
-		indexOfId( id: DataRecordID ): number;
-		getById( id: DataRecordID ): DataRecord;
-		getByIndex( index: number ): DataRecord;
-		_getRecord( index: number ): DataRecord;
-		moveTo( other: DataStore ): void;
-		createView( opts: DataViewProps ): DataView;
-		createIndex( filter: FilterInfo ): DataIndex;
-		sortIndex( index: DataIndex, sort: SortProp[] ): void;
-		forEach( cb: ( rec: DataRecord, index: number ) => any ): void;
-		export(  ): void;
-		changed(  ): void;
-		getModel(  ): void;
-	}
-
-	export interface EvViewChange extends CoreEvent {
-		change_type: "change" | "filter" | "sort";
-	}
-
-	interface DataViewEventMap extends EventMap {
-		view_change: EvViewChange;
-	}
-
-	interface DataViewProps  {
-		store?: DataStore;
-		filter?: FilterInfo;
-		order?: string | SortProp[] | SortProp;
-	}
-
-	type FilterFunc = ( rec: DataRecord ) => boolean;
-
-	export interface FilterInfo  {
-		op: '<' | '<=' | '=' | '>=' | '>' | '<>' | 'empty-result' | FilterFunc;
-		field?: string;
-		value?: string | RegExp;
-		caseSensitive?: boolean;
-	}
-
-	export interface SortProp  {
-		field: string;
-		ascending: boolean;
-		numeric?: boolean;
-	}
-
-	export class DataView extends CoreElement<DataViewEventMap> {
-		m_index: DataIndex;
-		m_store: DataStore;
-		m_model: DataModel;
-		m_sort: SortProp[];
-		m_filter: FilterInfo;
-		m_props: DataViewProps;
-		constructor( props: DataViewProps );
-		_storeChange( ev: EvDataChange ): void;
-		filter( filter: FilterInfo ): number;
-		_filter( filter: FilterInfo, notify: boolean ): number;
-		sort( props: SortProp[] ): void;
-		_sort( props: SortProp[], notify: boolean ): void;
-		getStore(  ): void;
-		getCount(  ): void;
-		indexOfId( id: DataRecordID ): number;
-		getByIndex( index: number ): DataRecord;
-		getIdByIndex( index: number ): DataRecordID;
-		getRecId( rec: DataRecord ): DataRecordID;
-		getById( id: DataRecordID ): DataRecord;
-		getModel(  ): void;
-		changed(  ): void;
-		forEach( cb: ( rec: DataRecord, index: number ) => any ): void;
-	}
-
 	// ---------------------------------------
 	// from /src/components/image/image.ts
 
@@ -1989,23 +2090,6 @@ declare module 'x4js' {
 		_on_click( ev: MouseEvent ): void;
 	}
 
-	// ---------------------------------------
-	// from /src/components/tickline/tickline.ts
-
-	interface TickLineProps extends ComponentProps {
-		values: number[];
-		min?: number;
-		max?: number;
-		color?: Color;
-		background?: Color;
-		type: "bars" | "line";
-	}
-
-	export class TickLine extends Component<TickLineProps> {
-		constructor( props: TickLineProps );
-		update(  ): void;
-	}
-
 	// ---------------------------------------
 	// from /src/components/slider/slider.ts
 
@@ -2155,6 +2239,23 @@ declare module 'x4js' {
 		getInput(  ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/components/tickline/tickline.ts
+
+	interface TickLineProps extends ComponentProps {
+		values: number[];
+		min?: number;
+		max?: number;
+		color?: Color;
+		background?: Color;
+		type: "bars" | "line";
+	}
+
+	export class TickLine extends Component<TickLineProps> {
+		constructor( props: TickLineProps );
+		update(  ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/components/tooltips/tooltips.ts
 

package/package.json

@@ -1,13 +1,8 @@
 {
 	"name": "x4js",
-	"version": "2.0.15",
+	"version": "2.0.18",
 	"description": "X4 framework",
 	"author": "etienne cochard",
-	"main": "src/x4.ts",
-	"typess": "lib/types/x4js.d.ts",
-	"filess": [
-		"lib/**/*"
-	],
 	"license": "MIT",
 	"repository": {
 		"type": "git",
@@ -25,37 +20,32 @@
 		"application"
 	],
 	"scripts": {
-		"build": "node scripts/build.mjs --watch --hmr --serve",
-		"build-release": "node scripts/build.mjs --release",
+		"build": "x4build --watch --hmr --serve",
+		"build-release": "x4build --release",
 		"prepack": "node scripts/prepack.mjs"
 	},
 	"homepage": "https://x4js.org",
-	"module": "lib/esm/x4.mjs",
-	"exportss": {
+	"files": ["lib","src"],
+	"types": "./src/x4.ts",
+	"module": "./lib/esm/x4.mjs",
+	"main": "./lib/cjs/x4.js",
+	"exports": {
 		".": {
-			"import": {
-				"types": "./lib/types/x4.d.ts",
-				"default": "./lib/esm/x4.mjs"
-			},
-			"require": {
-				"types": "./lib/types/x4.d.ts",
-				"default": "./lib/cjs/x4.js"
-			}
+			"types": "./src/x4.ts",
+			"module": "./lib/esm/x4.mjs",
+			"require": "./lib/cjs/x4.js"
 		}
 	},
-	"devDependencies": {
-		"chalk": "^5.3",
-		"esbuild": "^0.24",
-		"esbuild-plugin-d.ts": "^1.3",
-		"esbuild-sass-plugin": "^3.3",
-		"typescript": "^5.6.3",
-		"watcher": "^2.3",
-		"ws": "^8.18"
-	},
 	"x4build": {
 		"entryPoints": [
 			"src/x4.ts"
 		],
-		"outdir": "build"
+		"outdir": "lib"
+	},
+	"devDependencies": {
+		"typescript": "^5.8.3",
+		"x4build": "^1.6.8",
+		"esbuild-plugin-d.ts": "^1.3",
+		"esbuild-sass-plugin": "^3.3"
 	}
 }

package/src/components/canvas/canvas.ts

@@ -29,7 +29,7 @@ interface CanvasEventMap extends ComponentEvents {
 	paint: EvPaint;
 }
 
-interface CanvasProps extends ComponentProps {
+export interface CanvasProps extends ComponentProps {
 	paint: EventCallback<EvPaint>
 	clear?: boolean;
 }

package/src/components/components.ts

@@ -3,6 +3,8 @@ export * from "./breadcrumb/breadcrumb"
 export * from "./btngroup/btngroup"
 export * from "./button/button"
 export * from "./calendar/calendar"
+export * from "./canvas/canvas"
+export * from "./canvas/canvas_ex"
 export * from "./checkbox/checkbox"
 export * from "./colorinput/colorinput"
 export * from "./colorpicker/colorpicker"
@@ -28,7 +30,6 @@ export * from "./progress/progress"
 export * from "./propgrid/propgrid"
 export * from "./radio/radio"
 export * from "./rating/rating"
-export * from "./tickline/tickline"
 export * from "./select/select"
 export * from "./sizers/sizer"
 export * from "./slider/slider"
@@ -36,6 +37,7 @@ export * from "./switch/switch"
 export * from "./tabs/tabs"
 export * from "./textarea/textarea"
 export * from "./textedit/textedit"
+export * from "./tickline/tickline"
 export * from "./tooltips/tooltips"
 export * from "./treeview/treeview"
 export * from "./viewport/viewport"

package/src/core/component.ts

@@ -1039,15 +1039,6 @@ export interface EvContextMenu extends ComponentEvent {
 	uievent: UIEvent;	// UI event that fire this event
 }
 
-/**
- * Simple message
- */
-
-export interface EvMessage extends ComponentEvent {
-	readonly msg: string;
-	readonly params?: any;
-}
-
 /**
  * Drag/Drop event
  */

package/src/x4.ts

@@ -15,13 +15,17 @@
  **/
 
 export * from "./core/component"
+export * from "./core/core_application"
 export * from "./core/core_colors"
+export * from "./core/core_data"
 export * from "./core/core_dom"
 export * from "./core/core_dragdrop"
 export * from "./core/core_element"
 export * from "./core/core_events"
 export * from "./core/core_i18n"
+export * from "./core/core_react"
 export * from "./core/core_router"
+export * from "./core/core_state"
 export * from "./core/core_styles"
 export * from "./core/core_svg"
 export * from "./core/core_tools"

package/.vscode/launch.json

@@ -1,14 +0,0 @@
-{
-	// Use IntelliSense to learn about possible attributes.
-	// Hover to view descriptions of existing attributes.
-	// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-	"version": "0.2.0",
-	"configurations": [
-		{
-			"type": "node",
-			"request": "launch",
-			"name": "debug prepack",
-			"program": "${workspaceFolder}/scripts/prepack.mjs",
-		}
-	]
-}

package/demo/assets/house-light.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" fill="currentColor"><!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path d="M298.6 4c-6-5.3-15.1-5.3-21.2 0L5.4 244c-6.6 5.8-7.3 16-1.4 22.6s16 7.3 22.6 1.4L64 235l0 197c0 44.2 35.8 80 80 80l288 0c44.2 0 80-35.8 80-80l0-197 37.4 33c6.6 5.8 16.7 5.2 22.6-1.4s5.2-16.7-1.4-22.6L298.6 4zM96 432l0-225.3L288 37.3 480 206.7 480 432c0 26.5-21.5 48-48 48l-64 0 0-160c0-17.7-14.3-32-32-32l-96 0c-17.7 0-32 14.3-32 32l0 160-64 0c-26.5 0-48-21.5-48-48zm144 48l0-160 96 0 0 160-96 0z"/></svg>