neo.mjs 4.0.48 → 4.0.51

package/buildScripts/createClass.mjs

@@ -0,0 +1,270 @@
+import chalk       from 'chalk';
+import { Command } from 'commander/esm.mjs';
+import envinfo     from 'envinfo';
+import fs          from 'fs-extra';
+import inquirer    from 'inquirer';
+import os          from 'os';
+import path        from 'path';
+
+const __dirname   = path.resolve(),
+      cwd         = process.cwd(),
+      requireJson = path => JSON.parse(fs.readFileSync((path))),
+      packageJson = requireJson(path.join(__dirname, 'package.json')),
+      insideNeo   = packageJson.name === 'neo.mjs',
+      program     = new Command(),
+      programName = `${packageJson.name} create-class`,
+      questions   = [];
+
+program
+    .name(programName)
+    .version(packageJson.version)
+    .option('-i, --info',              'print environment debug info')
+    .option('-b, --baseClass <value>')
+    .option('-c, --className <value>')
+    .allowUnknownOption()
+    .on('--help', () => {
+        console.log('\nIn case you have any issues, please create a ticket here:');
+        console.log(chalk.cyan(process.env.npm_package_bugs_url));
+    })
+    .parse(process.argv);
+
+const programOpts = program.opts();
+
+if (programOpts.info) {
+    console.log(chalk.bold('\nEnvironment Info:'));
+    console.log(`\n  current version of ${packageJson.name}: ${packageJson.version}`);
+    console.log(`  running from ${__dirname}`);
+
+    envinfo
+        .run({
+            System     : ['OS', 'CPU'],
+            Binaries   : ['Node', 'npm', 'Yarn'],
+            Browsers   : ['Chrome', 'Edge', 'Firefox', 'Safari'],
+            npmPackages: ['neo.mjs']
+        }, {
+            duplicates  : true,
+            showNotFound: true
+        })
+        .then(console.log);
+} else {
+    console.log(chalk.green(programName));
+
+    if (!programOpts.className) {
+        questions.push({
+            type   : 'input',
+            name   : 'className',
+            message: 'Please choose the namespace for your class:',
+            default: 'Covid.view.HeaderContainerController'
+        });
+    }
+
+    if (!programOpts.baseClass) {
+        questions.push({
+            type   : 'list',
+            name   : 'baseClass',
+            message: 'Please pick the base class, which you want to extend:',
+            choices: ['component.Base', 'container.Base', 'controller.Component', 'core.Base'],
+            default: 'container.Base'
+        });
+    }
+
+    inquirer.prompt(questions).then(answers => {
+        let baseClass = programOpts.baseClass || answers.baseClass,
+            className = programOpts.className || answers.className,
+            startDate = new Date(),
+            classFolder, file, folderDelta, index, ns, root, rootLowerCase, viewFile;
+
+        if (className.endsWith('.mjs')) {
+            className = className.slice(0, -4);
+        }
+
+        ns            = className.split('.');
+        file          = ns.pop();
+        root          = ns.shift();
+        rootLowerCase = root.toLowerCase();
+
+        if (root === 'Neo') {
+            console.log('todo: create the file inside the src folder');
+        } else {
+            if (fs.existsSync(path.resolve(cwd, 'apps', rootLowerCase))) {
+                classFolder = path.resolve(cwd, 'apps', rootLowerCase, ns.join('/'));
+                folderDelta = ns.length + 2;
+
+                fs.mkdirpSync(classFolder);
+
+                fs.writeFileSync(path.join(classFolder, file + '.mjs'), createContent({baseClass, className, file, folderDelta, ns, root}));
+
+                if (baseClass === 'controller.Component') {
+                    index = file.indexOf('Controller');
+
+                    if (index > 0) {
+                        viewFile = path.join(classFolder, file.substr(0, index) + '.mjs');
+
+                        if (fs.existsSync(viewFile)) {
+                            adjustView({file, viewFile});
+                        }
+                    }
+                }
+            } else {
+                console.log('\nNon existing neo app name:', chalk.red(root));
+                process.exit(1);
+            }
+        }
+
+        const processTime = (Math.round((new Date - startDate) * 100) / 100000).toFixed(2);
+        console.log(`\nTotal time for ${programName}: ${processTime}s`);
+
+        process.exit();
+    });
+
+    /**
+     * Adds a comma to the last element of the contentArray
+     * @param {String[]} contentArray
+     * @returns {String[]}
+     */
+    function addComma(contentArray) {
+        contentArray[contentArray.length - 1] += ',';
+        return contentArray;
+    }
+
+    /**
+     * Adjusts the views related to controller.Component or model.Component
+     * @param {Object} opts
+     * @param {String} opts.file
+     * @param {String} opts.viewFile
+     */
+    function adjustView(opts) {
+        let file            = opts.file,
+            viewFile        = opts.viewFile,
+            content         = fs.readFileSync(viewFile).toString().split(os.EOL),
+            fromMaxPosition = 0,
+            i               = 0,
+            len             = content.length,
+            adjustSpaces, codeLine, fromPosition, importLength, importName, j, spaces;
+
+        // find the index where we want to insert our import statement
+        for (; i < len; i++) {
+            codeLine = content[i];
+
+            if (codeLine === '') {
+                break;
+            }
+
+            importName   = codeLine.substr(7);
+            importName   = importName.substr(0, importName.indexOf(' '));
+            importLength = importName.length;
+
+            if (importName > file) {
+                break;
+            }
+        }
+
+        content.splice(i, 0, `import ${file} from './${file}.mjs';`);
+
+        // find the longest import module name
+        for (i=0; i < len; i++) {
+            codeLine = content[i];
+
+            if (codeLine === '') {
+                break;
+            }
+
+            fromMaxPosition = Math.max(fromMaxPosition, codeLine.indexOf('from'));
+        }
+
+        // adjust the block-formatting for imports
+        for (i=0; i < len; i++) {
+            codeLine = content[i];
+
+            if (codeLine === '') {
+                break;
+            }
+
+            fromPosition = codeLine.indexOf('from');
+            adjustSpaces = fromMaxPosition - fromPosition;
+
+            if (adjustSpaces > 0) {
+                spaces = '';
+
+                for (j=0; j < adjustSpaces; j++) {
+                    spaces += ' ';
+                }
+
+                content[i] = codeLine.substr(0, fromPosition) + spaces + codeLine.substr(fromPosition);
+            }
+        }
+
+        fs.writeFileSync(viewFile, content.join(os.EOL));
+
+        console.log(i, opts.file);
+        console.log(content);
+    }
+
+    /**
+     * Creates the content of the neo-class .mjs file
+     * @param {Object} opts
+     * @param {String} opts.baseClass
+     * @param {String} opts.className
+     * @param {String} opts.file
+     * @param {String} opts.folderDelta
+     * @param {String} opts.ns
+     * @param {String} opts.root
+     * @returns {String}
+     */
+    function createContent(opts) {
+        let baseClass    = opts.baseClass,
+            baseClassNs  = baseClass.split('.'),
+            baseFileName = baseClassNs.pop(),
+            className    = opts.className,
+            file         = opts.file,
+            i            = 0,
+            importDelta  = '';
+
+        for (; i < opts.folderDelta; i++) {
+            importDelta += '../';
+        }
+
+        let classContent = [
+            `import ${baseFileName} from '${importDelta}${(insideNeo ? '' : 'node_modules/neo.mjs/')}src/${baseClassNs.join('/')}/${baseFileName}.mjs';`,
+            "",
+            "/**",
+            ` * @class ${className}`,
+            ` * @extends Neo.${baseClass}`,
+            " */",
+            `class ${file} extends ${baseFileName} {`,
+            "    static getConfig() {return {",
+            "        /*",
+            `         * @member {String} className='${className}'`,
+            "         * @protected",
+            "         */",
+            `        className: '${className}'`
+        ];
+
+        baseClass === 'container.Base' && addComma(classContent).push(
+            "        /*",
+            "         * @member {Object[]} items",
+            "         */",
+            "        items: []"
+        );
+
+        baseClass === 'component.Base' && addComma(classContent).push(
+            "        /*",
+            "         * @member {Object} _vdom",
+            "         */",
+            "        _vdom:",
+            "        {}"
+        );
+
+        classContent.push(
+            "    }}",
+            "}",
+            "",
+            `Neo.applyClassConfig(${file});`,
+            "",
+            `export default ${file};`,
+            ""
+        );
+
+        return classContent.join(os.EOL);
+    }
+}

package/buildScripts/webpack/production/webpack.config.appworker.mjs

@@ -16,7 +16,8 @@ const cwd                   = process.cwd(),
       regexTrimEnd          = /\s+$/gm,
       regexTrimStart        = /^\s+/gm;
 
-let config, examplesPath;
+let contextAdjusted = false,
+    config, examplesPath;
 
 if (fs.existsSync(configPath)) {
     config = requireJson(configPath);
@@ -134,8 +135,11 @@ export default env => {
 
         plugins: [
             new webpack.ContextReplacementPlugin(/.*/, context => {
-                if (!insideNeo && context.context.includes('/src/worker')) {
-                    context.request = '../../' + context.request;
+                let con = context.context;
+
+                if (!insideNeo && !contextAdjusted && (con.includes('/src/worker') || con.includes('\\src\\worker'))) {
+                    context.request = path.join('../../', context.request);
+                    contextAdjusted = true;
                 }
             }),
             ...plugins

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "neo.mjs",
-    "version": "4.0.48",
+    "version": "4.0.51",
     "description": "The webworkers driven UI framework",
     "type": "module",
     "repository": {
@@ -14,6 +14,7 @@
         "build-themes": "node ./buildScripts/buildThemes.mjs -f",
         "build-threads": "node ./buildScripts/webpack/buildThreads.mjs -f",
         "create-app": "node ./buildScripts/createApp.mjs",
+        "create-class": "node ./buildScripts/createClass.mjs",
         "generate-docs-json": "node ./buildScripts/docs/jsdocx.mjs",
         "server-start": "webpack serve -c ./buildScripts/webpack/webpack.server.config.mjs --open",
         "test": "echo \"Error: no test specified\" && exit 1",
@@ -42,11 +43,11 @@
         "chalk": "^5.0.1",
         "clean-webpack-plugin": "^4.0.0",
         "commander": "^9.3.0",
-        "cssnano": "^5.1.11",
+        "cssnano": "^5.1.12",
         "envinfo": "^7.8.1",
         "fs-extra": "^10.1.0",
         "highlightjs-line-numbers.js": "^2.8.0",
-        "inquirer": "^8.2.4",
+        "inquirer": "^9.0.0",
         "neo-jsdoc": "^1.0.1",
         "neo-jsdoc-x": "^1.0.4",
         "postcss": "^8.4.14",

package/src/component/DateSelector.mjs

@@ -326,8 +326,9 @@ class DateSelector extends Component {
             me.currentDate = new Date(`${value}T00:00:00`);
 
             me.fire('change', {
-                oldValue: oldValue,
-                value   : value
+                component: me,
+                oldValue,
+                value
             });
         } else {
             me.cacheUpdate();

package/src/component/mwc/TextField.mjs

@@ -191,8 +191,8 @@ class TextField extends Component {
 
         me.fire('change', {
             component: me,
-            oldValue : oldValue,
-            value    : value
+            oldValue,
+            value
         });
     }
 

package/src/draggable/DragZone.mjs

@@ -325,8 +325,8 @@ class DragZone extends Base {
 
         Object.assign(me, {
             dragElementRect: rect,
-            offsetX        : offsetX,
-            offsetY        : offsetY
+            offsetX,
+            offsetY
         });
 
         me.createDragProxy(rect);
@@ -337,8 +337,8 @@ class DragZone extends Base {
             dragElementRect: rect,
             eventData      : data,
             id             : me.id,
-            offsetX        : offsetX,
-            offsetY        : offsetY
+            offsetX,
+            offsetY
         });
     }
 

package/src/filter/BooleanContainer.mjs

@@ -45,8 +45,8 @@ class BooleanContainer extends Container {
         if (oldValue !== undefined) {
             this.fire('change', {
                 component: this,
-                oldValue : oldValue,
-                value    : value
+                oldValue,
+                value
             });
         }
     }

package/src/filter/NumberContainer.mjs

@@ -59,8 +59,8 @@ class NumberContainer extends Container {
         if (oldValue !== undefined) {
             this.fire('operatorChange', {
                 component: this,
-                oldValue : oldValue,
-                value    : value
+                oldValue,
+                value
             });
         }
     }
@@ -74,8 +74,8 @@ class NumberContainer extends Container {
         if (oldValue !== undefined) {
             this.fire('change', {
                 component: this,
-                oldValue : oldValue,
-                value    : value
+                oldValue,
+                value
             });
         }
     }

package/src/filter/ToggleOperatorsButton.mjs

@@ -53,8 +53,8 @@ class ToggleOperatorsButton extends Button {
 
             me.fire('change', {
                 component: me,
-                oldValue : oldValue,
-                value    : value
+                oldValue,
+                value
             });
         }
     }

package/src/form/field/Base.mjs

@@ -42,8 +42,8 @@ class Base extends Component {
     fireChangeEvent(value, oldValue) {
         this.fire('change', {
             component: this,
-            oldValue : oldValue,
-            value    : value
+            oldValue,
+            value
         });
     }
 

package/src/form/field/Number.mjs

@@ -174,6 +174,28 @@ class Number extends Text {
         return this.beforeSetEnumValue(value, oldValue, 'triggerPosition');
     }
 
+    /**
+     * @returns {Boolean}
+     */
+    isValid() {
+        let me    = this,
+            value = me.value;
+
+        if (Neo.isNumber(me.maxValue) && value > me.maxValue) {
+            return false;
+        }
+
+        if (Neo.isNumber(me.minValue) && value < me.minValue) {
+            return false;
+        }
+
+        if (value % me.stepSize !== 0) {
+            return false;
+        }
+
+        return super.isValid();
+    }
+
     /**
      *
      */

package/src/form/field/Text.mjs

@@ -93,6 +93,16 @@ class Text extends Base {
          * @member {Number|String} labelWidth_=150
          */
         labelWidth_: 150,
+        /**
+         * The maximum amount of chars which you can enter into this field
+         * @member {Number|null} maxLength_=null
+         */
+        maxLength_: null,
+        /**
+         * The minimum amount of chars which you can enter into this field
+         * @member {Number|null} minLength_=null
+         */
+        minLength_: null,
         /**
          * @member {String|null} placeholderText_=null
          */
@@ -358,6 +368,26 @@ class Text extends Base {
         }
     }
 
+    /**
+     * Triggered after the maxLength config got changed
+     * @param {Number|null} value
+     * @param {Number|null} oldValue
+     * @protected
+     */
+    afterSetMaxLength(value, oldValue) {
+        this.changeInputElKey('maxlength', value);
+    }
+
+    /**
+     * Triggered after the minLength config got changed
+     * @param {Number|null} value
+     * @param {Number|null} oldValue
+     * @protected
+     */
+    afterSetMinLength(value, oldValue) {
+        this.changeInputElKey('minlength', value);
+    }
+
     /**
      * Triggered after the mounted config got changed
      * @param {Boolean} value
@@ -776,9 +806,19 @@ class Text extends Base {
      * @returns {Boolean}
      */
     isValid() {
-        let me = this;
+        let me          = this,
+            value       = me.value,
+            valueLength = value?.toString().length;
+
+        if (me.required && (!value || valueLength < 1)) {
+            return false;
+        }
+
+        if (Neo.isNumber(me.maxLength) && valueLength > me.maxLength) {
+            return false;
+        }
 
-        if (me.required && (!me.value || me.value?.length < 1)) {
+        if (Neo.isNumber(me.minLength) && valueLength < me.minLength) {
             return false;
         }
 

package/src/main/addon/AmCharts.mjs

@@ -230,7 +230,7 @@ class AmCharts extends Base {
             this.setProperty({
                 id   : data.id,
                 path : key,
-                value: value
+                value
             })
         });
     }

package/src/main/mixin/TouchDomEvents.mjs

@@ -54,7 +54,6 @@ class TouchDomEvents extends Base {
      * @param {Object} event
      */
     onTouchStart(event) {
-        console.log('onTouchStart', event);
         this.sendMessageToApp(this.getEventData(event));
     }
 }

package/src/selection/GalleryModel.mjs

@@ -140,7 +140,7 @@ class GalleryModel extends Model {
         me.select(record[store.keyProperty]);
 
         view.fire('select', {
-            record: record
+            record
         });
     }
 
@@ -190,7 +190,7 @@ class GalleryModel extends Model {
         me.select(record[store.keyProperty]);
 
         view.fire('select', {
-            record: record
+            record
         });
     }
 

package/src/selection/HelixModel.mjs

@@ -154,7 +154,7 @@ class HelixModel extends Model {
         me.select(record[store.keyProperty]);
 
         view.fire('select', {
-            record: record
+            record
         });
     }
 
@@ -186,7 +186,7 @@ class HelixModel extends Model {
         me.select(record[store.keyProperty]);
 
         view.fire('select', {
-            record: record
+            record
         });
     }
 
@@ -259,7 +259,7 @@ class HelixModel extends Model {
         view.mounted && Neo.currentWorker.promiseMessage('main', {
             action : 'updateDom',
             appName: view.appName,
-            deltas : deltas
+            deltas
         }).then(() => {
             view.onSelect?.(items);
             me.fire('selectionChange', items, oldItems);

package/src/table/View.mjs

@@ -80,7 +80,7 @@ class View extends Component {
                 trCls.push('neo-selected');
 
                 Neo.getComponent(me.containerId).fire('select', {
-                    record: record
+                    record
                 });
             }