x4js 1.5.0 → 1.5.2

package/lib/README.md

@@ -0,0 +1,19 @@
+# x4js framework
+
+This is the x4 framework repository.
+
+X4 is a full typescript framework to develop Web or Desktop applications.
+Included more than 50 controls like grids, charts, etc. Everything needed to push the limits of your creativity.
+If these components are not enough, you can create your in few lines.
+
+## Home page
+see [home](https://x4js.org)
+
+
+## Documentation
+see [documentation](https://x4js.org/doc/)
+
+## API
+see [API](https://x4js.org/api/)
+
+

package/lib/changelog.txt

@@ -0,0 +1,5 @@
+2022/12/05 : 1.5.1 --------------------------------------------------------
+	icon.ts - now accepts direct <svg>..</svg> in argument (var or other)
+
+2022/11/24 : 1.5.0 --------------------------------------------------------
+	tools.js - crc32 optimization

package/lib/cjs/application.js

@@ -54,6 +54,12 @@ const _x4_touch_time = Symbol();
  * }
  */
 class Application extends base_component_1.BaseComponent {
+    /**
+     * the application singleton
+     */
+    static instance() {
+        return Application.self;
+    }
     constructor(props) {
         var _a, _b, _c;
         console.assert(Application.self === null, 'application is a singleton');
@@ -76,12 +82,6 @@ class Application extends base_component_1.BaseComponent {
             this.ApplicationCreated();
         }
     }
-    /**
-     * the application singleton
-     */
-    static instance() {
-        return Application.self;
-    }
     ApplicationCreated() {
         this.setTitle('');
     }

package/lib/cjs/icon.js

@@ -154,6 +154,11 @@ class Icon extends component_1.Component {
                 }
                 match_var = reVar.exec(icon);
             }
+            // <svg ...>
+            if (icon.startsWith('<svg')) {
+                this._setSVG('data:image/svg+xml;utf8,' + icon);
+                return;
+            }
             //	svg( <svg-filename> )	-> 	svg( "mysvgfile.svg" )	
             //	<svg-filename>.svg 		->  "mysvgfile.svg"
             const reSvg = /\s*svg\s*\(\s*(.+)\s*\)\s*/gi;

package/lib/cjs/md5.js

@@ -57,13 +57,6 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 THE SOFTWARE.
 */
 class Md5 {
-    constructor() {
-        this._state = new Int32Array(4);
-        this._buffer = new ArrayBuffer(68);
-        this._buffer8 = new Uint8Array(this._buffer, 0, 68);
-        this._buffer32 = new Uint32Array(this._buffer, 0, 17);
-        this.start();
-    }
     static hashStr(str, raw = false) {
         return this.onePassHasher
             .start()
@@ -237,6 +230,13 @@ class Md5 {
         x[2] = c + x[2] | 0;
         x[3] = d + x[3] | 0;
     }
+    constructor() {
+        this._state = new Int32Array(4);
+        this._buffer = new ArrayBuffer(68);
+        this._buffer8 = new Uint8Array(this._buffer, 0, 68);
+        this._buffer32 = new Uint32Array(this._buffer, 0, 17);
+        this.start();
+    }
     start() {
         this._dataLength = 0;
         this._bufferLength = 0;

package/lib/cjs/tools.js

@@ -980,13 +980,16 @@ exports.Clipboard = Clipboard;
  */
 function crc32(str) {
     let crc = ~0;
-    for (let i = 0, l = str.length; i < l; i++) {
-        crc = (crc >>> 8) ^ crc32tab[(crc ^ str.charCodeAt(i)) & 0xff];
+    let buf = Buffer.from(str);
+    let i = 0, l = buf.length;
+    while (i < l) {
+        crc = (crc >>> 8) ^ crc32tab[(crc ^ buf[i]) & 0xff];
+        i++;
     }
-    return Math.abs(crc ^ -1);
+    return (crc ^ -1) >>> 0;
 }
 exports.crc32 = crc32;
-var crc32tab = [
+var crc32tab = new Int32Array([
     0x00000000, 0x77073096, 0xee0e612c, 0x990951ba,
     0x076dc419, 0x706af48f, 0xe963a535, 0x9e6495a3,
     0x0edb8832, 0x79dcb8a4, 0xe0d5e91e, 0x97d2d988,
@@ -1051,7 +1054,7 @@ var crc32tab = [
     0xbad03605, 0xcdd70693, 0x54de5729, 0x23d967bf,
     0xb3667a2e, 0xc4614ab8, 0x5d681b02, 0x2a6f2b94,
     0xb40bbe37, 0xc30c8ea1, 0x5a05df1b, 0x2d02ef8d
-];
+]);
 // :: MIXINS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
 /**
  * taken from this excellent article:

package/lib/cjs/version.js

@@ -29,4 +29,4 @@
 **/
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.x4js_version = void 0;
-exports.x4js_version = "1.4";
+exports.x4js_version = "1.5.2";

package/lib/esm/icon.js

@@ -144,6 +144,11 @@ export class Icon extends Component {
                 }
                 match_var = reVar.exec(icon);
             }
+            // <svg ...>
+            if (icon.startsWith('<svg')) {
+                this._setSVG('data:image/svg+xml;utf8,' + icon);
+                return;
+            }
             //	svg( <svg-filename> )	-> 	svg( "mysvgfile.svg" )	
             //	<svg-filename>.svg 		->  "mysvgfile.svg"
             const reSvg = /\s*svg\s*\(\s*(.+)\s*\)\s*/gi;

package/lib/esm/tools.js

@@ -945,12 +945,15 @@ export class Clipboard {
  */
 export function crc32(str) {
     let crc = ~0;
-    for (let i = 0, l = str.length; i < l; i++) {
-        crc = (crc >>> 8) ^ crc32tab[(crc ^ str.charCodeAt(i)) & 0xff];
+    let buf = Buffer.from(str);
+    let i = 0, l = buf.length;
+    while (i < l) {
+        crc = (crc >>> 8) ^ crc32tab[(crc ^ buf[i]) & 0xff];
+        i++;
     }
-    return Math.abs(crc ^ -1);
+    return (crc ^ -1) >>> 0;
 }
-var crc32tab = [
+var crc32tab = new Int32Array([
     0x00000000, 0x77073096, 0xee0e612c, 0x990951ba,
     0x076dc419, 0x706af48f, 0xe963a535, 0x9e6495a3,
     0x0edb8832, 0x79dcb8a4, 0xe0d5e91e, 0x97d2d988,
@@ -1015,7 +1018,7 @@ var crc32tab = [
     0xbad03605, 0xcdd70693, 0x54de5729, 0x23d967bf,
     0xb3667a2e, 0xc4614ab8, 0x5d681b02, 0x2a6f2b94,
     0xb40bbe37, 0xc30c8ea1, 0x5a05df1b, 0x2d02ef8d
-];
+]);
 // :: MIXINS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
 /**
  * taken from this excellent article:

package/lib/esm/version.js

@@ -26,4 +26,4 @@
 * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 **/
-export const x4js_version = "1.4";
+export const x4js_version = "1.5.2";

package/lib/license.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2022 R-Libre ingénierie
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/lib/{ts_src → src}/icon.ts

@@ -186,6 +186,12 @@ export class Icon extends Component<IconProps>
 
 				match_var = reVar.exec( icon );
 			}
+
+			// <svg ...>
+			if( icon.startsWith('<svg') ) {
+				this._setSVG( 'data:image/svg+xml;utf8,'+icon);
+				return;
+			}
 			
 			//	svg( <svg-filename> )	-> 	svg( "mysvgfile.svg" )	
 			//	<svg-filename>.svg 		->  "mysvgfile.svg"

package/lib/{ts_src → src}/tools.ts

@@ -1208,15 +1208,20 @@ export class Clipboard {
  */
 
 export function crc32(str) {
-
 	let crc = ~0;
-	for (let i = 0, l = str.length; i < l; i++) {
-		crc = (crc >>> 8) ^ crc32tab[(crc ^ str.charCodeAt(i)) & 0xff];
-	}
-	return Math.abs(crc ^ -1);
+	let buf = Buffer.from( str );
+
+	let i = 0,
+		l = buf.length;
+	while( i<l ) {
+        crc = (crc >>> 8) ^ crc32tab[(crc ^ buf[i]) & 0xff];
+		i++;
+    }
+
+    return (crc ^ -1)>>>0;
 }
 
-var crc32tab = [
+var crc32tab = new Int32Array([
 	0x00000000, 0x77073096, 0xee0e612c, 0x990951ba,
 	0x076dc419, 0x706af48f, 0xe963a535, 0x9e6495a3,
 	0x0edb8832, 0x79dcb8a4, 0xe0d5e91e, 0x97d2d988,
@@ -1281,7 +1286,7 @@ var crc32tab = [
 	0xbad03605, 0xcdd70693, 0x54de5729, 0x23d967bf,
 	0xb3667a2e, 0xc4614ab8, 0x5d681b02, 0x2a6f2b94,
 	0xb40bbe37, 0xc30c8ea1, 0x5a05df1b, 0x2d02ef8d
-];
+]);
 
 
 // :: MIXINS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

package/lib/{ts_src → src}/version.ts

@@ -27,4 +27,4 @@
 * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 **/
 
-export const x4js_version = "1.4";
+export const x4js_version = "1.5.2";

package/lib/{ts_src → src}/x4.less

@@ -407,6 +407,7 @@ textarea {
 	display: flex;
 	flex-direction: row;
 	align-items: center;
+	gap: 4px;
 	outline: none;
 	cursor: pointer;
 	font-family: var( --x4-font );
@@ -426,8 +427,8 @@ textarea {
 	}
 
 	.x-svg-icon {
-		width: 100%;
-		height: 100%;
+		width: 1rem;
+		height: 1rem;
 		margin: 0;
 	}
 
@@ -585,6 +586,7 @@ textarea {
 		border-bottom: 1px solid transparent;
 		margin-top: 1px; // hack alignement label / edit
 		line-height: 1.3em;
+		width: 24px; // fix min-content
 
 		&::placeholder {
 			color: var( --gray-800 );
@@ -613,7 +615,7 @@ textarea {
 		border: none;
 
 		margin: 0;
-		padding: 0;
+		padding: 4px;
 		height: 2em;
 		margin-top: 1px;
 

package/lib/styles/x4.css

@@ -320,6 +320,7 @@ textarea::selection {
   display: flex;
   flex-direction: row;
   align-items: center;
+  gap: 4px;
   outline: none;
   cursor: pointer;
   font-family: var(--x4-font);
@@ -336,8 +337,8 @@ textarea::selection {
   color: inherit;
 }
 .x-base-button .x-svg-icon {
-  width: 100%;
-  height: 100%;
+  width: 1rem;
+  height: 1rem;
   margin: 0;
 }
 .x-base-button:focus {
@@ -471,6 +472,7 @@ textarea::selection {
   border-bottom: 1px solid transparent;
   margin-top: 1px;
   line-height: 1.3em;
+  width: 24px;
 }
 .x-text-edit input::placeholder,
 .x-combo-box input::placeholder,
@@ -502,7 +504,7 @@ textarea::selection {
   color: var(--gray-900);
   border: none;
   margin: 0;
-  padding: 0;
+  padding: 4px;
   height: 2em;
   margin-top: 1px;
 }

package/lib/styles/x4.less

@@ -407,6 +407,7 @@ textarea {
 	display: flex;
 	flex-direction: row;
 	align-items: center;
+	gap: 4px;
 	outline: none;
 	cursor: pointer;
 	font-family: var( --x4-font );
@@ -426,8 +427,8 @@ textarea {
 	}
 
 	.x-svg-icon {
-		width: 100%;
-		height: 100%;
+		width: 1rem;
+		height: 1rem;
 		margin: 0;
 	}
 
@@ -585,6 +586,7 @@ textarea {
 		border-bottom: 1px solid transparent;
 		margin-top: 1px; // hack alignement label / edit
 		line-height: 1.3em;
+		width: 24px; // fix min-content
 
 		&::placeholder {
 			color: var( --gray-800 );
@@ -613,7 +615,7 @@ textarea {
 		border: none;
 
 		margin: 0;
-		padding: 0;
+		padding: 4px;
 		height: 2em;
 		margin-top: 1px;
 

package/lib/{cjs/types → types}/button.d.ts

@@ -37,7 +37,7 @@ import { MenuItem, MenuOrSep } from './menu';
 interface ButtonEventMap extends CEventMap {
     click: EvClick;
 }
-declare type MenuCallBack = () => MenuOrSep[];
+type MenuCallBack = () => MenuOrSep[];
 /**
  * Button properties
  */

package/lib/{cjs → types}/canvas.d.ts

@@ -54,7 +54,7 @@ export interface CanvasPainter extends CanvasRenderingContext2D {
     setFontSize(fs: number): void;
     circle(x: number, y: number, radius: number): void;
 }
-declare type PaintHandler = (ctx: CanvasPainter) => any;
+type PaintHandler = (ctx: CanvasPainter) => any;
 /**
  *
  */

package/lib/{cjs/types → types}/cardview.d.ts

@@ -29,7 +29,7 @@
 import { Component, CProps, CEventMap } from './component';
 import { EvChange } from './x4events';
 import { IconID } from './icon';
-export declare type PageOrCallback = Component | (() => Component);
+export type PageOrCallback = Component | (() => Component);
 export interface ICardViewItem {
     icon?: IconID;
     name: string;

package/lib/{cjs → types}/component.d.ts

@@ -84,9 +84,9 @@ export declare const _x4_unitless: {
 /**
  *
  */
-export declare type VoidCallback = () => void;
-export declare type ComponentOrString = Component | string | HtmlString;
-export declare type ComponentContent = ComponentOrString | ComponentOrString[];
+export type VoidCallback = () => void;
+export type ComponentOrString = Component | string | HtmlString;
+export type ComponentContent = ComponentOrString | ComponentOrString[];
 interface IMap<T> {
     [key: string]: T;
 }
@@ -501,7 +501,7 @@ export declare class Space extends Component {
 /**
  * sizable separator
  */
-declare type SizeMode = null | 'minimize' | 'maximize' | 'restore';
+type SizeMode = null | 'minimize' | 'maximize' | 'restore';
 export interface EvSize extends BasicEvent {
     readonly size: Size;
     readonly mode: SizeMode;
@@ -530,7 +530,7 @@ export declare class Separator extends Component<SeparatorProps, SeparatorEventM
 /**
  * properties
  */
-declare type SizerOverlaySens = 'left' | 'top' | 'right' | 'bottom' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';
+type SizerOverlaySens = 'left' | 'top' | 'right' | 'bottom' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';
 export interface EvOverlayResize extends BasicEvent {
     ui_event: UIEvent;
     sens: SizerOverlaySens;
@@ -598,4 +598,4 @@ export declare class Container<P extends ContainerProps = ContainerProps, E exte
     /** @ignore this function is binded */
     private _handleKeydown;
 }
-export declare type ComponentConstructor<T> = new (props: CProps) => T;
+export type ComponentConstructor<T> = new (props: CProps) => T;

package/lib/{cjs/types → types}/datastore.d.ts

@@ -28,10 +28,10 @@
 **/
 import { BasicEvent, EvChange, EventSource, EventMap } from './x4events';
 import { BaseComponent, BaseComponentEventMap, BaseComponentProps } from './base_component';
-export declare type ChangeCallback = (type: string, id?: any) => void;
-export declare type CalcCallback = () => string;
-export declare type FieldType = 'string' | 'int' | 'float' | 'date' | 'bool' | 'array' | 'object' | 'any' | 'calc';
-export declare type DataIndex = Uint32Array;
+export type ChangeCallback = (type: string, id?: any) => void;
+export type CalcCallback = () => string;
+export type FieldType = 'string' | 'int' | 'float' | 'date' | 'bool' | 'array' | 'object' | 'any' | 'calc';
+export type DataIndex = Uint32Array;
 interface EvDataChange extends BasicEvent {
     type: string;
     id: any;
@@ -328,7 +328,7 @@ interface DataViewProps extends BaseComponentProps<DataViewEventMap> {
     filter?: FilterInfo;
     order?: string | SortProp[] | SortProp;
 }
-export declare type FilterFunc = (rec: Record) => boolean;
+export type FilterFunc = (rec: Record) => boolean;
 export interface FilterInfo {
     op: '<' | '<=' | '=' | '>=' | '>' | '<>' | 'empty-result' | FilterFunc;
     field?: string;

package/lib/{cjs/types → types}/dialog.d.ts

@@ -51,7 +51,7 @@ export interface DialogBoxEventMap extends PopupEventMap {
     close: EvClose;
     btnClick: EvBtnClick;
 }
-export declare type InitFormCallback = () => Form;
+export type InitFormCallback = () => Form;
 export interface DialogProps<E extends DialogBoxEventMap = DialogBoxEventMap> extends PopupProps<E> {
     title?: string;
     icon?: IconID;