x4js 1.5.17 → 1.5.20

package/lib/esm/menu.js

@@ -1,300 +0,0 @@
-/**
-*  ___   ___ __
-*  \  \_/  /  / _
-*   \     /  /_| |_
-*   /  _  \____   _|
-*  /__/ \__\   |_|
-*
-* @file menu.ts
-* @author Etienne Cochard
-*
-* Copyright (c) 2019-2022 R-libre ingenierie
-*
-* 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.
-**/
-import { x4document } from './x4dom';
-import { Component } from './component';
-import { EvClick } from './x4events';
-import { Action } from './action';
-import { Popup } from './popup';
-import { Icon } from './icon';
-import { Label } from './label';
-import { HLayout } from './layout';
-import { isString, getMousePos } from './tools';
-// ============================================================================
-// [MENU]
-// ============================================================================
-export class MenuSeparator extends Component {
-}
-export class MenuTitle extends Label {
-}
-export class Menu extends Popup {
-    static watchCount = 0;
-    static rootMenu = null;
-    m_subMenu;
-    m_opener;
-    m_virtual;
-    m_lock;
-    constructor(props, opener) {
-        super(props);
-        this.addClass('@shadow');
-        this.m_opener = opener;
-        this.m_virtual = false;
-        this.m_lock = 0;
-        this.enableMask(false);
-    }
-    lock(yes) {
-        this.m_lock += yes ? 1 : -1;
-    }
-    setVirtual() {
-        this.m_virtual = true;
-    }
-    setSubMenu(menu) {
-        this.m_subMenu = menu;
-    }
-    hideSubMenu() {
-        if (this.m_subMenu) {
-            this.m_subMenu.m_opener._close();
-            this.m_subMenu.hide();
-            this.m_subMenu = null;
-        }
-    }
-    /** @ignore */
-    render(props) {
-        this.setContent(props.items);
-    }
-    /**
-    *
-    */
-    show() {
-        if (!this.m_virtual) {
-            Menu._addMenu(this);
-        }
-        super.show();
-    }
-    /**
-     *
-    */
-    close() {
-        if (!this.dom && !this.m_virtual) {
-            return;
-        }
-        if (this.m_opener) {
-            this.m_opener._close();
-        }
-        if (this.m_subMenu) {
-            this.m_subMenu.close();
-            this.m_subMenu = null;
-        }
-        super.close();
-        Menu._removeMenu();
-    }
-    /**
-     *
-     */
-    clear() {
-        this.m_props.items = [];
-    }
-    /**
-    * @internal
-    */
-    static _addMenu(menu) {
-        //console.log( 'addmenu' );
-        if (Menu.watchCount == 0) {
-            Menu.rootMenu = menu;
-            x4document.addEventListener('mousedown', Menu._mouseWatcher);
-        }
-        Menu.watchCount++;
-    }
-    static _removeMenu() {
-        //console.log( 'removemenu' );
-        console.assert(Menu.watchCount > 0);
-        Menu.watchCount--;
-        if (Menu.watchCount == 0) {
-            x4document.removeEventListener('mousedown', Menu._mouseWatcher);
-        }
-    }
-    static _mouseWatcher(ev) {
-        if (ev.defaultPrevented) {
-            return;
-        }
-        let elOn = ev.target;
-        while (elOn) {
-            // is mouse on a menu
-            let mouseon = Component.getElement(elOn);
-            if (mouseon && (mouseon instanceof Menu /*|| elOn.$el instanceof Menubar*/)) {
-                return;
-            }
-            elOn = elOn.parentElement;
-        }
-        Menu._discardAll();
-    }
-    /**
-    * hide all the visible menus
-    */
-    static _discardAll() {
-        if (Menu.rootMenu) {
-            Menu.rootMenu.close();
-            Menu.rootMenu = null;
-        }
-    }
-    displayAt(...args) {
-        if (!this.m_lock) {
-            Menu._discardAll();
-        }
-        let x, y, align, offset;
-        if (args.length == 1) {
-            ({ x, y } = getMousePos(args[0], true));
-        }
-        else {
-            [x, y, align, offset] = args;
-        }
-        if (!align) {
-            align = 'top left';
-        }
-        super.displayAt(x, y, align, offset);
-    }
-}
-export class MenuItem extends Component {
-    m_menu;
-    m_isOpen;
-    m_action;
-    constructor(a, b) {
-        if (a instanceof Action) {
-            super({
-                click: () => { a.fire(); }
-            });
-            this.m_action = a;
-        }
-        else if (isString(a)) {
-            super({
-                text: a,
-                click: b
-            });
-        }
-        else {
-            super(a);
-        }
-        this.mapPropEvents(this.m_props, 'click');
-        this.m_menu = null;
-        this.m_isOpen = false;
-        this.setDomEvent('mousedown', (e) => this._mousedown(e));
-        this.setDomEvent('click', (e) => this._click(e));
-    }
-    /** @ignore */
-    render(props) {
-        let icon = props.icon ?? 0;
-        let text = props.text;
-        if (props.checked !== undefined) {
-            icon = props.checked ? 'var( --x4-icon-check )' : 0;
-        }
-        if (this.m_action) {
-            if (!icon) {
-                icon = this.m_action.props.icon;
-            }
-            if (text === undefined) {
-                text = this.m_action.props.text;
-            }
-        }
-        let popIco = null;
-        if (this.isPopup) {
-            this.addClass('@popup-menu-item');
-            popIco = new Icon({ icon: "var( --x4-icon-chevron-right )", cls: "pop-mark" });
-        }
-        if (!text && !icon) {
-            this.addClass('@separator');
-        }
-        if (props.cls) {
-            this.addClass(props.cls);
-        }
-        this.setTag('a');
-        //@bug: do not kill focus on click 
-        //	this.setAttribute( 'tabindex', '0' );
-        this.setContent([
-            icon < 0 ? null : new Icon({ icon }),
-            new Label({ flex: 1, text }),
-            popIco
-        ]);
-    }
-    get id() {
-        return this.m_props.itemId;
-    }
-    get text() {
-        return this.m_props.text;
-    }
-    get isPopup() {
-        return !!this.m_props.items;
-    }
-    _close() {
-        this.removeClass('@opened');
-        this.m_isOpen = false;
-    }
-    _click(ev) {
-        if (!this.isPopup) {
-            this.emit('click', EvClick());
-            Menu._discardAll();
-        }
-    }
-    _mousedown(ev) {
-        if (this.isPopup) {
-            if (!this.m_menu) {
-                this.m_menu = new Menu({ items: this.m_props.items }, this);
-            }
-            let doClose = this.m_isOpen;
-            // if parent menu has an opened sub menu, close it
-            let parent_menu = Component.getElement(this.dom, Menu);
-            if (parent_menu) {
-                parent_menu.hideSubMenu();
-            }
-            if (!doClose) {
-                if (parent_menu) {
-                    parent_menu.setSubMenu(this.m_menu);
-                }
-                this.m_isOpen = true;
-                let rc = this.getBoundingRect();
-                this.m_menu.lock(true);
-                if (parent_menu) {
-                    // standard menu
-                    this.m_menu.displayAt(rc.right, rc.top);
-                }
-                else {
-                    // menubar / menubutton
-                    this.m_menu.displayAt(rc.left, rc.bottom);
-                }
-                this.m_menu.lock(false);
-                this.addClass('@opened');
-            }
-            ev.preventDefault();
-        }
-    }
-}
-/**
- *
- */
-export class MenuBar extends HLayout {
-    m_items;
-    constructor(props, opener) {
-        super(props);
-        console.assert(false, 'not imp');
-        this.addClass('@shadow');
-        this.m_items = props.items;
-    }
-    /** @ignore */
-    render() {
-        this.setContent(this.m_items);
-    }
-}

package/lib/esm/messagebox.js

@@ -1,161 +0,0 @@
-/**
-*  ___   ___ __
-*  \  \_/  /  / _
-*   \     /  /_| |_
-*   /  _  \____   _|
-*  /__/ \__\   |_|
-*
-* @file messagebox.ts
-* @author Etienne Cochard
-*
-* Copyright (c) 2019-2022 R-libre ingenierie
-*
-* 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.
-**/
-import { Dialog } from './dialog';
-import { asap, isHtmlString, isString } from './tools';
-import { HLayout } from './layout';
-import { Icon } from './icon';
-import { Label } from './label';
-import { TextEdit } from './textedit';
-export class MessageBox extends Dialog {
-    m_label;
-    constructor(props) {
-        // remove overloaded elements from DialogBoxProps
-        let icon = props.icon ?? 'var( --x4-icon-exclamation )'; // todo: resolve that
-        props.icon = undefined;
-        let buttons = props.buttons === undefined ? ['ok'] : props.buttons;
-        props.buttons = undefined;
-        super(props);
-        let msg = props.message;
-        this.form.updateContent(new HLayout({
-            style: { padding: 8 },
-            content: [
-                icon ? new Icon({ cls: 'icon', icon }) : null,
-                this.m_label = new Label({ cls: 'text', text: msg, multiline: true })
-            ]
-        }), buttons);
-        this.on('btnClick', (ev) => {
-            // no prevent default -> always close the messagebox
-            if (!this.m_props.click) {
-                return;
-            }
-            asap(() => {
-                this.m_props.click(ev.button);
-            });
-        });
-    }
-    set text(txt) {
-        this.m_label.text = txt;
-    }
-    /**
-     * display a messagebox
-     */
-    static show(props) {
-        let msg;
-        if (isString(props) || isHtmlString(props)) {
-            msg = new MessageBox({ message: props, click: () => { } });
-        }
-        else {
-            msg = new MessageBox(props);
-        }
-        msg.show();
-        return msg;
-    }
-    static async showAsync(props) {
-        return new Promise((resolve, reject) => {
-            let _props;
-            const cb = (btn) => {
-                resolve(btn);
-            };
-            if (isString(props) || isHtmlString(props)) {
-                _props = { message: props, click: cb };
-            }
-            else {
-                _props = { ...props, click: cb };
-            }
-            const msg = new MessageBox(_props);
-            msg.show();
-        });
-    }
-    /**
-     * display an alert message
-     */
-    static alert(text, title = null) {
-        new MessageBox({
-            cls: 'warning',
-            title,
-            message: text,
-            buttons: ['ok'],
-            click: () => { },
-        }).show();
-    }
-}
-export class PromptDialogBox extends Dialog {
-    m_edit;
-    constructor(props) {
-        // remove overloaded elements from DialogBoxProps
-        //let icon = props.icon;	// ?? 'cls(far fa-comment-check)';	// todo: resolve that
-        //props.icon = undefined;
-        props.buttons = undefined;
-        props.width = props.width ?? 500;
-        super(props);
-        this.form.updateContent(new HLayout({
-            cls: 'panel',
-            content: [
-                //icon ? new Icon({
-                //	cls: 'icon',
-                //	icon: icon
-                //}) : null,
-                this.m_edit = new TextEdit({
-                    flex: 1,
-                    autoFocus: true,
-                    label: props.message,
-                    value: props.value
-                }),
-            ]
-        }), ['ok', 'cancel']);
-        if (props.click) {
-            this.on('btnClick', (ev) => {
-                if (ev.button === 'ok') {
-                    // no prevent default -> always close the messagebox
-                    // asap to allow
-                    asap(() => {
-                        this.m_props.click(this.m_edit.value);
-                    });
-                }
-            });
-        }
-    }
-    set text(txt) {
-        this.m_edit.label = txt;
-    }
-    /**
-     * display a messagebox
-     */
-    static show(props, inputCallback) {
-        let msg;
-        if (isString(props) || isHtmlString(props)) {
-            msg = new PromptDialogBox({ message: props, click: inputCallback });
-        }
-        else {
-            msg = new PromptDialogBox(props);
-        }
-        msg.show();
-        return msg;
-    }
-}

package/lib/esm/panel.js

@@ -1,65 +0,0 @@
-/**
-*  ___   ___ __
-*  \  \_/  /  / _
-*   \     /  /_| |_
-*   /  _  \____   _|
-*  /__/ \__\   |_|
-*
-* @file panel.ts
-* @author Etienne Cochard
-*
-* Copyright (c) 2019-2022 R-libre ingenierie
-*
-* 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.
-**/
-import { Component } from './component';
-import { VLayout, HLayout } from './layout';
-import { Label } from './label';
-import { Icon } from './icon';
-export class Panel extends VLayout {
-    m_ui_title;
-    m_ui_body;
-    constructor(props) {
-        super(props);
-        const sens = props?.sens == 'horizontal' ? '@hlayout' : '@vlayout';
-        //todo: cannot be called twice do to content overload
-        this.m_ui_title = new Label({ cls: 'title', text: this.m_props.title });
-        this.m_ui_body = new Component({ cls: 'body ' + sens, content: this.m_props.content, style: props.bodyStyle });
-    }
-    /** @ignore */
-    render() {
-        const gadgets = this.m_props.gadgets ?? [];
-        const icon = this.m_props.icon ? new Icon({ icon: this.m_props.icon }) : null;
-        super.setContent([
-            new HLayout({
-                cls: 'title',
-                content: [
-                    icon,
-                    this.m_ui_title,
-                    ...gadgets
-                ]
-            }),
-            this.m_ui_body
-        ]);
-    }
-    setContent(els) {
-        this.m_ui_body.setContent(els);
-    }
-    set title(text) {
-        this.m_ui_title.text = text;
-    }
-}