neo.mjs 6.39.0 → 6.41.0

package/apps/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='6.39.0'
+         * @member {String} version='6.41.0'
          */
-        version: '6.39.0'
+        version: '6.41.0'
     }
 
     /**

package/apps/portal/view/learn/ContentView.mjs

@@ -34,7 +34,11 @@ class ContentView extends Component {
         /**
          * @member {Object} record_=null
          */
-        record_: null
+        record_: null,
+        /**
+         * @member {String} tag='article'
+         */
+        tag: 'article'
     }
 
     /**

package/examples/ServiceWorker.mjs

@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
          */
         singleton: true,
         /**
-         * @member {String} version='6.39.0'
+         * @member {String} version='6.41.0'
          */
-        version: '6.39.0'
+        version: '6.41.0'
     }
 
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "neo.mjs",
-    "version": "6.39.0",
+    "version": "6.41.0",
     "description": "The webworkers driven UI framework",
     "type": "module",
     "repository": {

package/resources/data/deck/learnneo/pages/benefits/FormsEngine.md

@@ -202,34 +202,24 @@ class MainView extends FormContainer {
         }]
     }
 
-    async getMainFormValues(data) {
-        const formValues = await this.getValues();
+    async getFormValues(form) {
+        const formValues = await form.getValues();
         Neo.Main.log({value: formValues});
 
-        const isValid = await this.validate();
-        Neo.Main.log({value: `isValid: ${isValid}`});
+        const isValid = await form.validate();
+        Neo.Main.log({value: `isValid: ${isValid}`})
     }
 
-    async getProductFormValues(data) {
-        const
-            form       = this.getReference('product-form'),
-            formValues = await form.getValues();
-
-        Neo.Main.log({value: formValues});
+    async getMainFormValues(data) {
+        await this.getFormValues(this)
+    }
 
-        const isValid = await form.validate();
-        Neo.Main.log({value: `isValid: ${isValid}`});
+    async getProductFormValues(data) {
+        await this.getFormValues(this.getReference('product-form'))
     }
 
     async getUserFormValues(data) {
-        const
-            form       = this.getReference('user-form'),
-            formValues = await form.getValues();
-
-        Neo.Main.log({value: formValues});
-
-        const isValid = await form.validate();
-        Neo.Main.log({value: `isValid: ${isValid}`});
+        await this.getFormValues(this.getReference('user-form'))
     }
 }
 Neo.setupClass(MainView);

package/resources/data/deck/learnneo/tree.json

@@ -2,7 +2,7 @@
     {"name":  "Welcome!",                                   "parentId": null,                "isLeaf":  true, "id": "Welcome" },
     {"name": "Benefits",                                    "parentId": null,                "isLeaf": false, "id": "WhyNeo"},
         {"name": "Introduction ",                           "parentId": "WhyNeo",            "isLeaf": true,  "id": "WhyNeo-Intro"},
-        {"name": "Multi-Threading",                         "parentId": "WhyNeo",            "isLeaf": true,  "id": "benefits.MultiThreading"},
+        {"name": "Off the Main Thread",                     "parentId": "WhyNeo",            "isLeaf": true,  "id": "benefits.Multi-Threading"},
         {"name": "Extreme Speed",                           "parentId": "WhyNeo",            "isLeaf": true,  "id": "WhyNeo-Speed"},
         {"name": "Multi-Window Applications",               "parentId": "WhyNeo",            "isLeaf": true,  "id": "WhyNeo-Multi-Window"},
         {"name": "Quick Application Development",           "parentId": "WhyNeo",            "isLeaf": true,  "id": "WhyNeo-Quick"},

package/resources/scss/src/button/Base.scss

@@ -95,6 +95,10 @@
         pointer-events: none;
         text-transform: var(--button-text-transform);
         z-index       : 2;
+
+        @media (max-width: 600px) {
+            font-size: 13px;
+        }
     }
 
     &:active {

package/src/DefaultConfig.mjs

@@ -260,12 +260,12 @@ const DefaultConfig = {
     useVdomWorker: true,
     /**
      * buildScripts/injectPackageVersion.mjs will update this value
-     * @default '6.39.0'
+     * @default '6.41.0'
      * @memberOf! module:Neo
      * @name config.version
      * @type String
      */
-    version: '6.39.0'
+    version: '6.41.0'
 };
 
 Object.assign(DefaultConfig, {

package/src/main/DomEvents.mjs

@@ -542,17 +542,19 @@ class DomEvents extends Base {
     onKeyDown(event) {
         let {target}  = event,
             {tagName} = target,
-            isInput = tagName === 'INPUT' || tagName === 'TEXTAREA';
+            isInput   = tagName === 'INPUT' || tagName === 'TEXTAREA';
 
         if (isInput && disabledInputKeys[target.id]?.includes(event.key)) {
             event.preventDefault()
         } else {
             this.sendMessageToApp(this.getKeyboardEventData(event));
 
-            if (!isInput) { // see: https://github.com/neomjs/neo/issues/1729
-                if (['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp'].includes(event.key)) {
-                    event.preventDefault()
-                }
+            if (
+                !isInput &&
+                ['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp'].includes(event.key) &&
+                this.testPathInclusion(event, ['neo-selection'], true)
+            ) {
+                event.preventDefault()
             }
         }
     }
@@ -832,9 +834,10 @@ event.preventDefault();
     /**
      * @param {Object} event
      * @param {Object} targetArray
+     * @param {Object} testSubstring=false
      * @returns {Object|Boolean} target cls & node if found, false otherwise
      */
-    testPathInclusion(event, targetArray) {
+    testPathInclusion(event, targetArray, testSubstring=false) {
         let countTargets = targetArray.length,
             path         = event.path || event.composedPath(),
             i            = 0,
@@ -845,7 +848,10 @@ event.preventDefault();
             node = path[i];
 
             for (j = 0; j < countTargets; j++) {
-                if (node.classList?.contains(targetArray[j])) {
+                if (
+                    testSubstring && node.classList?.value?.includes(targetArray[j]) ||
+                    node.classList?.contains(targetArray[j])
+                ) {
                     return {cls: targetArray[j], node}
                 }
             }

package/src/main/addon/HighlightJS.mjs

@@ -23,6 +23,11 @@ class HighlightJS extends Base {
          * @protected
          */
         highlightJsLineNumbersPath: Neo.config.basePath + 'node_modules/highlightjs-line-numbers.js/dist/highlightjs-line-numbers.min.js',
+        /**
+         * @member {Boolean} libraryLoaded_=true
+         * @protected
+         */
+        libraryLoaded_: false,
         /**
          * Remote method access for other workers
          * @member {Object} remote
@@ -46,6 +51,43 @@ class HighlightJS extends Base {
         themePath: './resources/highlightjs-custom-github-theme.css'
     }
 
+    /**
+     * @member {Object[]} cache=[]
+     * @protected
+     */
+    cache = []
+
+    /**
+     * Triggered after the libraryLoaded config got changed
+     * @param {Boolean} value
+     * @param {Boolean} oldValue
+     * @protected
+     */
+    afterSetLibraryLoaded(value, oldValue) {
+        if (value) {
+            let me = this,
+                returnValue;
+
+            me.cache.forEach(item => {
+                returnValue = me[item.fn](item.data);
+                item.resolve(returnValue)
+            });
+
+            me.cache = []
+        }
+    }
+
+    /**
+     * Internally caches call when the hljs namespace does not exist yet
+     * @param item
+     * @returns {Promise<unknown>}
+     */
+    cacheMethodCall(item) {
+        return new Promise((resolve, reject) => {
+            this.cache.push({...item, resolve})
+        })
+    }
+
     /**
      * See: https://highlightjs.readthedocs.io/en/latest/api.html#highlightauto
      * @param {Object} data
@@ -53,10 +95,10 @@ class HighlightJS extends Base {
      * @returns {Object} of the form {language, relevance, value, secondBest}
      */
     highlightAuto(data) {
-        if (hljs) {
+        if (window.hljs) {
             return hljs.highlightAuto(data.html)
         } else {
-            console.error('highlight.js is not included inside the main thread.')
+            return this.cacheMethodCall({fn: 'highlightAuto', data})
         }
     }
 
@@ -77,6 +119,8 @@ class HighlightJS extends Base {
 
         Neo.main.addon.Stylesheet.createStyleSheet(null, 'hljs-theme', me.themePath);
 
+        this.libraryLoaded = true;
+
         return true
     }
 
@@ -118,13 +162,15 @@ class HighlightJS extends Base {
      * @param {String} data.vnodeId
      */
     syntaxHighlight(data) {
-        if (hljs) {
+        if (window.hljs) {
             let node = document.getElementById(data.vnodeId);
 
-            hljs.highlightBlock(node);
-            hljs.lineNumbersBlock(node)
+            if (node) {
+                hljs.highlightBlock(node);
+                hljs.lineNumbersBlock(node)
+            }
         } else {
-            console.error('highlight.js is not included inside the main thread.')
+            return this.cacheMethodCall({fn: 'syntaxHighlight', data})
         }
     }
 
@@ -132,11 +178,11 @@ class HighlightJS extends Base {
      * @param {Object} data
      */
     syntaxHighlightInit(data) {
-        if (hljs) {
+        if (window.hljs) {
             let blocks = document.querySelectorAll('pre code:not(.hljs)');
             Array.prototype.forEach.call(blocks, hljs.highlightBlock)
         } else {
-            console.error('highlight.js is not included inside the main thread.')
+            return this.cacheMethodCall({fn: 'syntaxHighlightInit', data})
         }
     }
 
@@ -147,6 +193,10 @@ class HighlightJS extends Base {
      * @param {Number} data.removeLine
      */
     syntaxHighlightLine(data) {
+        if (!window.hljs) {
+            return this.cacheMethodCall({fn: 'syntaxHighlightLine', data})
+        }
+
         let parentEl = document.getElementById(data.vnodeId),
             cls      = 'neo-highlighted-line',
             el;