x4js 1.4.3 → 1.4.6

package/lib/treeview.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
 *  ___   ___ __
 *  \  \_/  /  / _
@@ -22,18 +23,20 @@
 *
 * You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
 **/
-import { Component, Container, EvDblClick } from './component';
-import { Icon } from './icon';
-import { Label } from './label';
-import { HLayout, VLayout } from './layout';
-import { EvClick, BasicEvent, EvDrag, EvSelectionChange, EvContextMenu } from './x4_events';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TreeView = void 0;
+const component_1 = require("./component");
+const icon_1 = require("./icon");
+const label_1 = require("./label");
+const layout_1 = require("./layout");
+const x4_events_1 = require("./x4_events");
 function EvExpand(node) {
-    return BasicEvent({ node });
+    return (0, x4_events_1.BasicEvent)({ node });
 }
 /**
  *
  */
-export class TreeView extends VLayout {
+class TreeView extends layout_1.VLayout {
     m_view;
     m_container;
     m_selection;
@@ -44,15 +47,15 @@ export class TreeView extends VLayout {
         props.gadgets = props.gadgets;
         props.sort = props.sort ?? false;
         this.m_selection = null;
-        this.m_container = new Container({ cls: '@scroll-container' });
-        this.m_view = new Container({
+        this.m_container = new component_1.Container({ cls: '@scroll-container' });
+        this.m_view = new component_1.Container({
             cls: '@scroll-view',
             flex: 1,
             content: this.m_container
         });
         this.setContent([
             this.m_view,
-            props.gadgets ? new HLayout({
+            props.gadgets ? new layout_1.HLayout({
                 cls: 'gadgets',
                 content: props.gadgets
             }) : null,
@@ -62,7 +65,7 @@ export class TreeView extends VLayout {
         this.setDomEvent('contextmenu', (e) => this._handleCtxMenu(e));
         if (props.canDragItems) {
             this.setDomEvent('dragstart', (ev) => {
-                let hit = Component.getElement(ev.target, Component);
+                let hit = component_1.Component.getElement(ev.target, component_1.Component);
                 let node = hit?.getData("node");
                 if (node) {
                     ev.dataTransfer.effectAllowed = 'move';
@@ -87,7 +90,7 @@ export class TreeView extends VLayout {
     }
     _dragEnter(ev) {
         ev.preventDefault();
-        let hit = Component.getElement(ev.target, Component);
+        let hit = component_1.Component.getElement(ev.target, component_1.Component);
         let node = hit?.getData("node");
         if (node) {
             hit.addClass('@drag-over');
@@ -95,14 +98,14 @@ export class TreeView extends VLayout {
         }
     }
     _dragLeave(ev) {
-        let hit = Component.getElement(ev.target, Component);
+        let hit = component_1.Component.getElement(ev.target, component_1.Component);
         let node = hit?.getData("node");
         if (node) {
             hit.removeClass('@drag-over');
         }
     }
     _drop(ev) {
-        let hit = Component.getElement(ev.target, Component);
+        let hit = component_1.Component.getElement(ev.target, component_1.Component);
         let node = hit?.getData("node");
         if (!node) {
             node = this.m_props.root;
@@ -120,7 +123,7 @@ export class TreeView extends VLayout {
             for (let i = 0; i < ev.dataTransfer.items.length; i++) {
                 ev.dataTransfer.items[0].getAsString((value) => {
                     let data = JSON.parse(value);
-                    this.emit('drag', EvDrag(node, data, parent));
+                    this.emit('drag', (0, x4_events_1.EvDrag)(node, data, parent));
                 });
             }
         }
@@ -222,13 +225,13 @@ export class TreeView extends VLayout {
         }
     }
     _renderDef(node) {
-        return new Label({ cls: 'tree-label', flex: 1, text: node.text });
+        return new label_1.Label({ cls: 'tree-label', flex: 1, text: node.text });
     }
     _makeNode(node, cls, icon, level) {
-        const item = new HLayout({
+        const item = new layout_1.HLayout({
             cls,
             content: [
-                new Icon({ cls: 'tree-icon', icon }),
+                new icon_1.Icon({ cls: 'tree-icon', icon }),
                 this.m_props.renderItem ? this.m_props.renderItem(node) : this._renderDef(node),
             ],
             data: {
@@ -319,7 +322,7 @@ export class TreeView extends VLayout {
             onsub = true;
         }
         while (dom != this.dom) {
-            let el = Component.getElement(dom);
+            let el = component_1.Component.getElement(dom);
             let nd = el?.getData('node');
             if (nd) {
                 if (nd.children && !onsub) {
@@ -339,14 +342,14 @@ export class TreeView extends VLayout {
                     this.selection = nd.id;
                     if (!onsub) {
                         if (ev.type == 'click') {
-                            this.emit('click', EvClick(nd));
+                            this.emit('click', (0, x4_events_1.EvClick)(nd));
                         }
                         else {
-                            this.emit('dblclick', EvDblClick(nd));
+                            this.emit('dblclick', (0, component_1.EvDblClick)(nd));
                         }
                     }
                 }
-                this.emit('selectionchange', EvSelectionChange(nd));
+                this.emit('selectionchange', (0, x4_events_1.EvSelectionChange)(nd));
                 return;
             }
             dom = dom.parentElement;
@@ -354,7 +357,7 @@ export class TreeView extends VLayout {
         if (ev.type == 'click') {
             this.m_selection = null;
             this.update();
-            this.emit('selectionchange', EvSelectionChange(null));
+            this.emit('selectionchange', (0, x4_events_1.EvSelectionChange)(null));
         }
     }
     _handleCtxMenu(ev) {
@@ -362,7 +365,7 @@ export class TreeView extends VLayout {
         let dom = ev.target;
         let idom = dom;
         while (dom != this.dom) {
-            let el = Component.getElement(dom);
+            let el = component_1.Component.getElement(dom);
             let nd = el?.getData('node');
             if (nd) {
                 if (nd.children) {
@@ -373,14 +376,14 @@ export class TreeView extends VLayout {
                 }
                 this.m_selection = { id: nd.id, el: null };
                 this.update();
-                this.emit('contextMenu', EvContextMenu(ev, nd));
+                this.emit('contextMenu', (0, x4_events_1.EvContextMenu)(ev, nd));
                 return;
             }
             dom = dom.parentElement;
         }
         this.m_selection = null;
         this.update();
-        this.emit('contextMenu', EvContextMenu(ev, null));
+        this.emit('contextMenu', (0, x4_events_1.EvContextMenu)(ev, null));
     }
     /**
      * constructs a tree node from an array of strings
@@ -488,3 +491,4 @@ export class TreeView extends VLayout {
         return root;
     }
 }
+exports.TreeView = TreeView;

package/lib/x4_events.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
 *  ___   ___ __
 *  \  \_/  /  / _
@@ -22,6 +23,8 @@
 *
 * You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
 **/
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EventSource = exports.EvDrag = exports.EvMessage = exports.EvTimer = exports.EvContextMenu = exports.EvSelectionChange = exports.EvChange = exports.EvClick = exports.BasicEvent = void 0;
 // default stopPropagation implementation for Events
 const stopPropagation = function () {
     this.propagationStopped = true;
@@ -38,34 +41,42 @@ const preventDefault = function () {
  * @param params
  * @returns BasicEvent
  */
-export function BasicEvent(params) {
+function BasicEvent(params) {
     return {
         stopPropagation,
         preventDefault,
         ...params,
     };
 }
-export function EvClick(context = null) {
+exports.BasicEvent = BasicEvent;
+function EvClick(context = null) {
     return BasicEvent({ context });
 }
-export function EvChange(value, context = null) {
+exports.EvClick = EvClick;
+function EvChange(value, context = null) {
     return BasicEvent({ value, context });
 }
-export function EvSelectionChange(selection, context = null) {
+exports.EvChange = EvChange;
+function EvSelectionChange(selection, context = null) {
     return BasicEvent({ selection, context });
 }
-export function EvContextMenu(uievent, context = null) {
+exports.EvSelectionChange = EvSelectionChange;
+function EvContextMenu(uievent, context = null) {
     return BasicEvent({ uievent, context });
 }
-export function EvTimer(timer, time = 0, context = null) {
+exports.EvContextMenu = EvContextMenu;
+function EvTimer(timer, time = 0, context = null) {
     return BasicEvent({ timer, time, context });
 }
-export function EvMessage(msg, params, source) {
+exports.EvTimer = EvTimer;
+function EvMessage(msg, params, source) {
     return BasicEvent({ msg, params, source });
 }
-export function EvDrag(element, data, ctx) {
+exports.EvMessage = EvMessage;
+function EvDrag(element, data, ctx) {
     return BasicEvent({ element, data, context: ctx });
 }
+exports.EvDrag = EvDrag;
 /**
  * Event emitter class
  * this class allow you to emit and handle events
@@ -110,7 +121,7 @@ export function EvDrag(element, data, ctx) {
  * }
  * ```
  */
-export class EventSource {
+class EventSource {
     m_source;
     m_eventRegistry;
     m_defaultHandlers;
@@ -361,3 +372,4 @@ export class EventSource {
         }
     }
 }
+exports.EventSource = EventSource;

package/package.json

@@ -1,8 +1,9 @@
 {
 	"name": "x4js",
-	"version": "1.4.3",
+	"version": "1.4.6",
 	"description": "X4js core files",
 	"main": "lib/index.js",
+	"types": "lib/index.d.ts",
 	"repository": {
 	  "type": "git",
 	  "url": "git+https://github.com/rlibre/x4js.git"

package/src/application.ts

@@ -43,8 +43,9 @@ interface ApplicationEventMap extends BaseComponentEventMap {
 export interface ApplicationProps extends BaseComponentProps<ApplicationEventMap> {
 	app_name: string;		// 
 	app_version: string;	//
-	app_uid: string;
-	locale: string;			// fr-FR
+	app_uid?: string;
+	locale?: string;		// fr-FR
+	renderTo?: HTMLElement;
 }
 
 /**
@@ -113,7 +114,6 @@ export class Application<P extends ApplicationProps = ApplicationProps, E extend
 	}
 
 	ApplicationCreated( ) {
-
 	}
 
 	public get app_name( ) {
@@ -160,7 +160,11 @@ export class Application<P extends ApplicationProps = ApplicationProps, E extend
 		this.m_mainView = root;
 
 		deferCall( ( ) => {
-			document.body.appendChild(root._build());
+			const dest = this.m_props.renderTo ?? document.body;
+			while (dest.firstChild) {
+				dest.removeChild(dest.firstChild);
+			}
+			dest.appendChild(root._build());
 		} );
 	}
 

package/src/index.ts

@@ -0,0 +1,55 @@
+export * from "./application"
+export * from "./base_component"
+export * from "./base64"
+export * from "./button"
+export * from "./calendar"
+export * from "./canvas"
+export * from "./cardview"
+export * from "./checkbox"
+export * from "./color"
+export * from "./colorpicker"
+export * from "./combobox"
+export * from "./component"
+export * from "./datastore"
+export * from "./dialog"
+export * from "./dom_events"
+export * from "./drag_manager"
+export * from "./drawtext"
+export * from "./fileupload"
+export * from "./form"
+export * from "./formatters"
+export * from "./gridview"
+export * from "./i18n"
+export * from "./icon"
+export * from "./image"
+export * from "./input"
+export * from "./label"
+export * from "./layout"
+export * from "./link"
+export * from "./listview"
+export * from "./md5"
+export * from "./menu"
+export * from "./messagebox"
+export * from "./panel"
+export * from "./popup"
+export * from "./property_editor"
+export * from "./radiobtn"
+export * from "./rating"
+export * from "./request"
+export * from "./router"
+export * from "./settings"
+export * from "./sidebarview"
+export * from "./smartedit"
+export * from "./spreadsheet"
+export * from "./styles"
+export * from "./svgcomponent"
+export * from "./tabbar"
+export * from "./tabview"
+export * from "./textarea"
+export * from "./textedit"
+export * from "./texthiliter"
+export * from "./toaster"
+export * from "./tools"
+export * from "./tooltips"
+export * from "./treeview"
+export * from "./x4_events"

package/src/router.ts

@@ -6,7 +6,7 @@ interface Route {
 	callback: Callback;
 }
 
-class Router {
+export class Router {
 
 	private routes: Route[];
 

package/tsconfig.json

@@ -6,7 +6,8 @@
     	"strictNullChecks": false,
     	"outDir": "./lib",
 		"declaration": true,
-		"strict": false
+		"module": "commonjs",
+		"strict": false,
   	},
 	"include": [
 		"./src/*",

package/lib/list.txt

@@ -1,56 +0,0 @@
-application.js
-base_component.js
-base64.js
-button.js
-calendar.js
-canvas.js
-cardview.js
-checkbox.js
-color.js
-colorpicker.js
-combobox.js
-component.js
-datastore.js
-dialog.js
-dom_events.js
-drag_manager.js
-drawtext.js
-fileupload.js
-form.js
-formatters.js
-gridview.js
-i18n.js
-icon.js
-image.js
-index.js
-input.js
-label.js
-layout.js
-link.js
-listview.js
-md5.js
-menu.js
-messagebox.js
-panel.js
-popup.js
-property_editor.js
-radiobtn.js
-rating.js
-request.js
-router.js
-settings.js
-sidebarview.js
-smartedit.js
-spreadsheet.js
-styles.js
-svgcomponent.js
-tabbar.js
-tabview.js
-textarea.js
-textedit.js
-texthiliter.js
-toaster.js
-tools.js
-tooltips.js
-treeview.js
-x4_events.js