neo.mjs 10.0.0-beta.1 → 10.0.0-beta.3

package/src/main/addon/MonacoEditor.mjs

@@ -16,6 +16,20 @@ class MonacoEditor extends Base {
          * @protected
          */
         className: 'Neo.main.addon.MonacoEditor',
+        /**
+         * List methods which must get cached until the addon reaches its `isReady` state
+         * @member {String[]} interceptRemotes
+         */
+        interceptRemotes: [
+            'createInstance',
+            'destroyInstance',
+            'getValue',
+            'layoutEditor',
+            'setLanguage',
+            'setTheme',
+            'setValue',
+            'updateOptions'
+        ],
         /**
          * @member {String} libraryBasePath='../../node_modules/monaco-editor/min/vs'
          */
@@ -53,23 +67,18 @@ class MonacoEditor extends Base {
     createInstance(data) {
         let me   = this,
             {id} = data,
-            editor, node;
+            node = DomAccess.getElement(id),
+            editor;
 
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'createInstance', data})
-        } else {
-            delete data.appName;
-            delete data.id;
+        delete data.appName;
+        delete data.id;
 
-            node = DomAccess.getElement(id);
+        if (node) {
+            editor = me.map[id] = monaco.editor.create(node, data);
 
-            if (node) {
-                editor = me.map[id] = monaco.editor.create(node, data);
-
-                editor.getModel().onDidChangeContent(me.onContentChange.bind(me, id))
-            } else if (Neo.config.environment === 'development') {
-                console.warn(`addon.MonacoEditor: node ${id} not found`)
-            }
+            editor.getModel().onDidChangeContent(me.onContentChange.bind(me, id))
+        } else if (Neo.config.environment === 'development') {
+            console.warn(`addon.MonacoEditor: node ${id} not found`)
         }
     }
 
@@ -78,14 +87,8 @@ class MonacoEditor extends Base {
      * @param {String} data.id
      */
     destroyInstance(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'destroyInstance', data})
-        } else {
-            // todo: destroy the editor instance if possible
-            delete this.map[data.id]
-        }
+        // todo: destroy the editor instance if possible
+        delete this.map[data.id]
     }
 
     /**
@@ -94,13 +97,7 @@ class MonacoEditor extends Base {
      * @returns {Object}
      */
     getValue(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'getValue', data})
-        } else {
-            return me.map[data.id].getModel().getValue()
-        }
+        return this.map[data.id].getModel().getValue()
     }
 
     /**
@@ -109,7 +106,7 @@ class MonacoEditor extends Base {
      * @param {String} data.id
      */
     layoutEditor(data) {
-        this.isReady && this.map[data.id].layout()
+        this.map[data.id].layout()
     }
 
     /**
@@ -154,13 +151,7 @@ class MonacoEditor extends Base {
      * @param {String} data.value
      */
     setLanguage(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'setLanguage', data})
-        } else {
-            me.map[data.id].getModel().setLanguage(data.value)
-        }
+        this.map[data.id].getModel().setLanguage(data.value)
     }
 
     /**
@@ -169,13 +160,7 @@ class MonacoEditor extends Base {
      * @param {String} data.value
      */
     setTheme(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'setTheme', data})
-        } else {
-            me.map[data.id]._themeService.setTheme(data.value)
-        }
+        this.map[data.id]._themeService.setTheme(data.value)
     }
 
     /**
@@ -184,13 +169,7 @@ class MonacoEditor extends Base {
      * @param {String} data.value
      */
     setValue(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'setValue', data})
-        } else {
-            me.map[data.id].getModel().setValue(data.value)
-        }
+        this.map[data.id].getModel().setValue(data.value)
     }
 
     /**
@@ -199,13 +178,7 @@ class MonacoEditor extends Base {
      * @param {Object} data.options
      */
     updateOptions(data) {
-        let me = this;
-
-        if (!me.isReady) {
-            return me.cacheMethodCall({fn: 'updateOptions', data})
-        } else {
-            me.map[data.id].updateOptions(data.options)
-        }
+        this.map[data.id].updateOptions(data.options)
     }
 }
 

package/src/manager/ClassHierarchy.mjs

@@ -0,0 +1,114 @@
+import BaseManager from './Base.mjs';
+
+/**
+ * @class Neo.manager.ClassHierarchy
+ * @extends Neo.manager.Base
+ * @singleton
+ *
+ * This manager maintains a registry of all classes defined within the Neo.mjs framework's current realm (main or worker),
+ * including their inheritance relationships and key metadata.
+ * Each registered item (value in the manager's store) has the following structure:
+ * @typedef {Object} ClassHierarchyInfo
+ * @property {String} className - The full Neo.mjs class name (e.g., 'Neo.component.Base').
+ * @property {Function|Object} module - The direct reference to the class constructor function itself (for non-singletons)
+ * or the instantiated singleton object (for singletons).
+ * @property {String|null} ntype - The ntype of the class if defined (e.g., 'button', 'container'), otherwise `null`.
+ * @property {String|null} parentClassName - The full class name of its direct parent class,
+ * or `null` if it's a top-level class (e.g., 'Neo.core.Base').
+ */
+class ClassHierarchy extends BaseManager {
+    static config = {
+        /**
+         * @member {String} className='Neo.manager.ClassHierarchy'
+         * @protected
+         */
+        className: 'Neo.manager.ClassHierarchy',
+        /**
+         * @member {String} keyProperty='className'
+         * @protected
+         */
+        keyProperty: 'className',
+        /**
+         * @member {Boolean} singleton=true
+         * @protected
+         */
+        singleton: true
+    }
+
+    /**
+     * Memoizes the return values of isA() calls
+     * @member {Map} isAQueryMap=new Map()
+     * @protected
+     */
+    isAQueryMap = new Map()
+
+    /**
+     * @param {Object} config
+     */
+    construct(config) {
+        super.construct(config);
+        this.consumeTempMap()
+    }
+
+    /**
+     * Register all classes that got applied to the Neo namespace before this instance got created
+     * @protected
+     */
+    consumeTempMap() {
+        if (Neo.classHierarchyMap) {
+            this.add(Object.values(Neo.classHierarchyMap));
+            delete Neo.classHierarchyMap
+        }
+    }
+
+    /**
+     * Both params represent classNames.
+     *
+     * Example use cases:
+     * - isA('Neo.button.Menu',    'Neo.button.Base')    => true
+     * - isA('Neo.button.Base',    'Neo.button.Menu')    => false
+     * - isA('Neo.button.Base',    'Neo.component.Base') => true
+     * - isA('Neo.component.Base', 'Neo.core.Base')      => true
+     * @param {String} descendant
+     * @param {String} ancestor
+     * @returns {Boolean}
+     */
+    isA(descendant, ancestor) {
+        if (descendant === ancestor) {
+            return true
+        }
+
+        let parent        = descendant,
+            {isAQueryMap} = this,
+            queryName     = `${descendant},${ancestor}`,
+            returnValue   = false;
+
+        if (isAQueryMap.has(queryName)) {
+            return isAQueryMap.get(queryName)
+        }
+
+        while (parent = this.get(parent)?.parentClassName) {
+            if (parent === ancestor) {
+                returnValue = true;
+                break
+            }
+
+            // Assumption: component.Base directly extends core.Base
+            if (parent === 'Neo.component.Base' && ancestor !== 'Neo.core.Base') {
+                returnValue = false;
+                break
+            }
+
+            if (parent === 'Neo.core.Base') {
+                returnValue = false;
+                break
+            }
+        }
+
+        isAQueryMap.set(queryName, returnValue);
+
+        return returnValue
+    }
+}
+
+export default Neo.setupClass(ClassHierarchy);

package/src/menu/List.mjs

@@ -182,7 +182,7 @@ class List extends BaseList {
         let me        = this,
             {iconCls} = record,
             id        = record[me.store.keyProperty],
-            vdomCn    = [{tag: 'span', cls: ['neo-content'], html: record[me.displayField]}];
+            vdomCn    = [{tag: 'span', cls: ['neo-content'], text: record[me.displayField]}];
 
         if (iconCls && iconCls !== '') {
             vdomCn.unshift({tag: 'i', cls: ['neo-menu-icon', 'neo-icon', iconCls], id: me.getIconId(id)})

package/src/plugin/Popover.mjs

@@ -18,10 +18,10 @@ import Plugin    from './Base.mjs';
  *             ntype  : 'panel',
  *             headers: [{
  *                 dock: 'top',
- *                 html: 'HEADER'
+ *                 text: 'HEADER'
  *             }],
  *             items  : [{
- *                 html: 'This is a comment about the button'
+ *                 text: 'This is a comment about the button'
  *             }]
  *         }]
  *     }]

package/src/sitemap/Component.mjs

@@ -130,7 +130,7 @@ class Component extends Base {
                 tag : 'a',
                 cls : ['neo-action', `neo-level-${record.level}`],
                 id  : me.getItemId(record.id),
-                html: record.name
+                text: record.name
             };
 
             if (action && action !== '') {

package/src/table/Body.mjs

@@ -177,7 +177,7 @@ class TableBody extends Component {
 
         switch (Neo.typeOf(rendererOutput)) {
             case 'Object': {
-                if (rendererOutput.html) {
+                if (rendererOutput.html || rendererOutput.text) {
                     rendererOutput.cls && cellCls.push(...rendererOutput.cls);
                 } else {
                     rendererOutput = [rendererOutput];
@@ -230,7 +230,11 @@ class TableBody extends Component {
         }
 
         if (Neo.typeOf(rendererOutput) === 'Object') {
-            cellConfig.html = rendererOutput.html  || ''
+            if (Object.hasOwn(rendererOutput, 'html')) {
+                cellConfig.html = rendererOutput.html  || ''
+            } else {
+                cellConfig.text = rendererOutput.text  || ''
+            }
         } else {
             cellConfig.cn = rendererOutput
         }

package/src/tooltip/Base.mjs

@@ -76,12 +76,7 @@ class Tooltip extends Container {
          * True prevents the tooltip from hiding while the mouse cursor is above it
          * @member {Boolean|null} stayOnHover_=true
          */
-        stayOnHover_: true,
-        /**
-         * Shortcut to add a label item
-         * @member {String} text_=null
-         */
-        text_: null
+        stayOnHover_: true
     }
 
     /**

package/src/tree/Accordion.mjs

@@ -277,13 +277,13 @@ class AccordionTree extends TreeList {
                             tag : 'span',
                             cls : [itemCls + '-content-header'],
                             id  : id + '__item-content-header',
-                            html: item[me.fields.header]
+                            text: item[me.fields.header]
                         }, {
                             flag: 'content',
                             tag : 'span',
                             cls : [itemCls + '-content-text'],
                             id  : id + '__item-content-text',
-                            html: item[me.fields.text]
+                            text: item[me.fields.text]
                         }]
                     }],
                     style: {
@@ -428,7 +428,7 @@ class AccordionTree extends TreeList {
                     NeoArray.add(cls, clsItems);
                     itemVdom.cls = cls
                 } else {
-                    itemVdom.html = field.value
+                    itemVdom.text = field.value
                 }
             }
         });

package/src/vdom/Helper.mjs

@@ -37,23 +37,6 @@ class Helper extends Base {
         singleton: true
     }
 
-    /**
-     * @returns {Promise<void>}
-     */
-    async initAsync() {
-        super.initAsync();
-
-        let me = this;
-
-        // Subscribe to global Neo.config changes for dynamic renderer switching.
-        Neo.currentWorker.on({
-            neoConfigChange: me.onNeoConfigChange,
-            scope          : me
-        });
-
-        await me.importUtil()
-    }
-
     /**
      * @param {Object}         config
      * @param {Object}         config.deltas
@@ -517,6 +500,25 @@ class Helper extends Base {
         }
     }
 
+    /**
+     * @returns {Promise<void>}
+     */
+    async initAsync() {
+        super.initAsync();
+
+        let me = this;
+
+        if (!NeoConfig.unitTestMode) {
+            // Subscribe to global Neo.config changes for dynamic renderer switching.
+            Neo.currentWorker.on({
+                neoConfigChange: me.onNeoConfigChange,
+                scope          : me
+            })
+        }
+
+        await me.importUtil()
+    }
+
     /**
      * @param {Object}         config
      * @param {Object}         config.deltas
@@ -629,12 +631,12 @@ class Helper extends Base {
 
     /**
      * Handler for global Neo.config changes.
-     * If 'useDomApiRenderer' property changes, this method dynamically loads/clears the renderer utilities.
+     * If the `Neo.config.useDomApiRenderer` value changes, this method dynamically loads the renderer utilities.
      * @param {Object} config
      * @return {Promise<void>}
      */
     async onNeoConfigChange(config) {
-        if(Object.hasOwn(config, 'useDomApiRenderer')) {
+        if (Object.hasOwn(config, 'useDomApiRenderer')) {
             await this.importUtil()
         }
     }

package/src/worker/App.mjs

@@ -1,8 +1,7 @@
 import Neo             from '../Neo.mjs';
 import Base            from './Base.mjs';
-import * as core       from '../core/_export.mjs';
 import Application     from '../controller/Application.mjs';
-import Instance        from '../manager/Instance.mjs';
+import InstanceManager from '../manager/Instance.mjs';
 import DomEventManager from '../manager/DomEvent.mjs';
 import HashHistory     from '../util/HashHistory.mjs';
 

package/src/worker/Base.mjs

@@ -1,7 +1,9 @@
-import Base               from '../core/Base.mjs';
-import Observable         from '../core/Observable.mjs';
-import Message            from './Message.mjs';
-import RemoteMethodAccess from './mixin/RemoteMethodAccess.mjs';
+import Base                  from '../core/Base.mjs';
+import * as core             from '../core/_export.mjs';
+import Observable            from '../core/Observable.mjs';
+import ClassHierarchyManager from '../manager/ClassHierarchy.mjs';
+import Message               from './Message.mjs';
+import RemoteMethodAccess    from './mixin/RemoteMethodAccess.mjs';
 
 /**
  * The abstract base class for e.g. the App, Data & VDom worker

package/src/worker/Canvas.mjs

@@ -1,6 +1,5 @@
-import Neo       from '../Neo.mjs';
-import Base      from './Base.mjs';
-import * as core from '../core/_export.mjs';
+import Neo  from '../Neo.mjs';
+import Base from './Base.mjs';
 
 /**
  * The Canvas worker is responsible for dynamically manipulating offscreen canvas.

package/src/worker/Data.mjs

@@ -1,12 +1,10 @@
-import Neo     from '../Neo.mjs';
-import Base    from './Base.mjs';
-import Compare from '../core/Compare.mjs';
-import Fetch   from '../Fetch.mjs';
-import Util    from '../core/Util.mjs';
-import Xhr     from '../Xhr.mjs';
+import Neo   from '../Neo.mjs';
+import Base  from './Base.mjs';
+import Fetch from '../Fetch.mjs';
+import Xhr   from '../Xhr.mjs';
 
 /**
- * The Data worker is responsible to handle all of the communication to the backend (e.g. Ajax-calls).
+ * The Data worker is responsible to handle all the communication to the backend (e.g. Ajax-calls).
  * See the tutorials for further infos.
  * @class Neo.worker.Data
  * @extends Neo.worker.Base

package/src/worker/Task.mjs

@@ -1,6 +1,5 @@
-import Neo       from '../Neo.mjs';
-import Base      from './Base.mjs';
-import * as core from '../core/_export.mjs';
+import Neo  from '../Neo.mjs';
+import Base from './Base.mjs';
 
 /**
  * The Task worker can get filled with custom remote methods as needed.

package/src/worker/VDom.mjs

@@ -1,7 +1,6 @@
-import Neo       from '../Neo.mjs';
-import Base      from './Base.mjs';
-import * as core from '../core/_export.mjs';
-import Helper    from '../vdom/Helper.mjs';
+import Neo    from '../Neo.mjs';
+import Base   from './Base.mjs';
+import Helper from '../vdom/Helper.mjs';
 
 /**
  * The Vdom worker converts vdom templates into vnodes, as well as creating delta-updates.

package/src/worker/mixin/RemoteMethodAccess.mjs

@@ -90,7 +90,10 @@ class RemoteMethodAccess extends Base {
             throw new Error('Invalid remote method name "' + msg.remoteMethod + '"')
         }
 
-        if (Array.isArray(msg.data)) {
+        // Check for interception
+        if (!pkg.isReady && pkg.interceptRemotes?.includes(msg.remoteMethod)) {
+            out = pkg.onInterceptRemotes(msg);
+        } else if (Array.isArray(msg.data)) {
             out = method.call(pkg, ...msg.data)
         } else {
             out = method.call(pkg, msg.data)

package/learn/guides/MainThreadAddonExample.md

@@ -1,15 +0,0 @@
-Let's go through the steps of creating a main thread addon.
-
-Let's say we needed to show a code editor. There are a lot of libraries
-for this, such as Ace (<a href="https://ace.c9.io/" target="_blank">ace.c9.io</a>).
-From a coding perspective, these editors have a simple API: a setter
-to specify the string being edited, a getter to read the string, and
-a change event fired as the user types.
-
-Here's what we need to do:
-- Define a main thread addon and its API
-- Define a component wrapper
-
-### Define the Main Thread Addon
-
-### Define the component wrapper

package/learn/guides/MainThreadAddonIntro.md

@@ -1,44 +0,0 @@
-Neo.mjs is multi-threaded. There are worker threads
-that handle data access, application logic,
-and keeping track of DOM updates. Practically all your
-application logic is run in parallel in these threads.
-However, anything that needs to actually reference or update
-the DOM (`window.document`), or just use the `window` object, must be done in the main 
-application thread. 
-
-That's the purpose of main thread addons. These are classes whose
-methods can be accessed from other web workers, but are
-actually executed in the main thread.
-
-For example, what if you needed to read the browser's
-URL? That information is in `window.location`.
-But `window` is a main thread variable! To access that
-from a web-worker our code has to say "hey main thread, 
-please return a specified `window` property." Neo.mjs
-lets you do that via `Neo.Main.getByPath()`. For
-example, the following statement logs the URL query string.
-
-```javascript readonly
-const search = await Neo.Main.getByPath({path: 'window.location.search'});
-console.log(search); // Logs the search string
-```
-
-`Neo.Main` & `Neo.main.DomAccess` provide some basic methods for accessing the 
-main thread, but in case you want to use a third party library which relies on directly
-working with the DOM, you'd use a _main thread addon_. 
-
-Google Maps is a good example of this. In Neo.mjs, most
-views are responsible for updating their own vdom, but
-the responsibility for rendering maps and markers is handled
-by Google Maps itself — we _ask_ Google Maps to do
-certain things via the Google Maps API. Therefore, in Neo.mjs,
-Google Maps is implemented as a main thread addon which
-loads the libraries and exposes whatever methods we'll need
-to run from the other Neo.mjs threads. In addition, in a
-Neo.mjs application we want to use Google Maps like any other
-component, so Neo.mjs also provides a component wrapper. In
-summary: 
-- The main-thread addon contains the code run in the main thread,
-and exposes what methods can be run by other web-workers (remote method access)
-- The component wrapper lets you use it like any other component,
-internally calling the main thread methods as needed.