neo.mjs 4.0.63 → 4.0.66

package/README.md

@@ -236,12 +236,12 @@ More infos: <a href="./BACKERS.md">Sponsors & Backers</a>
 </br></br>
 <h2 id="jobs">14. Jobs</h2>
 Accenture is hiring multiple neo.mjs developers for the new Cloud Technology Studio in Kaiserslauern (Germany):</br>
-<a href="https://www.accenture.com/de-de/careers/jobdetails?id=R00057924_de">Senior neo.mjs Frontend Developer /Architect (all genders)</a></br></br>
-
+</br>
 These full-time roles are based on German contracts, so they require living in (or relocating to) Germany.
+Ping us on LinkedIn or Slack for details.
 
 </br></br>
-Logo contributed by <a href="https://www.linkedin.com/in/dinkheller/">Torsten Dinkheller</a>.
+Logo contributed by <a href="https://www.linkedin.com/in/torsten-dinkheller-614516231/">Torsten Dinkheller</a>.
 
 </br></br>
 Build with :heart: in Germany.

package/buildScripts/createClass.mjs

@@ -14,7 +14,7 @@ const
       cwd         = process.cwd(),
       requireJson = path => JSON.parse(fs.readFileSync((path))),
       packageJson = requireJson(path.join(__dirname, 'package.json')),
-      insideNeo   = packageJson.name === 'neo.mjs',
+      insideNeo   = process.env.npm_package_name === 'neo.mjs',
       program     = new Command(),
       programName = `${packageJson.name} create-class`,
       questions   = [],
@@ -36,6 +36,7 @@ program
     .version(packageJson.version)
     .option('-i, --info',              'print environment debug info')
     .option('-d, --drop',              'drops class in the currently selected folder')
+    .option('-n, --singleton <value>', 'Create a singleton? Pick "yes" or "no"')
     .option('-s, --source <value>',    `name of the folder containing the project. Defaults to any of ${sourceRootDirs.join(',')}`)
     .option('-b, --baseClass <value>')
     .option('-c, --className <value>')
@@ -94,7 +95,7 @@ if (programOpts.info) {
             type   : 'input',
             name   : 'className',
             message: 'Please choose the namespace for your class:',
-            default: 'Covid.view.HeaderContainerController'
+            default: 'Covid.view.MyContainer'
         });
     }
 
@@ -103,17 +104,38 @@ if (programOpts.info) {
             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'
+            default: 'container.Base',
+
+            choices: [
+                'component.Base',
+                'container.Base',
+                'controller.Component',
+                'core.Base',
+                'data.Model',
+                'data.Store',
+                'model.Component'
+            ]
+        });
+    }
+
+    if (!programOpts.singleton) {
+        questions.push({
+            type   : 'list',
+            name   : 'singleton',
+            message: 'Singleton?',
+            default: 'no',
+            choices: ['yes', 'no']
         });
     }
 
     inquirer.prompt(questions).then(answers => {
-        let baseClass = programOpts.baseClass || answers.baseClass,
-            className = programOpts.className || answers.className,
-            isDrop    = programOpts.drop,
-            startDate = new Date(),
-            classFolder, file, folderDelta, index, ns, root, rootLowerCase, viewFile;
+        let baseClass   = programOpts.baseClass || answers.baseClass,
+            className   = programOpts.className || answers.className,
+            singleton   = programOpts.singleton || answers.singleton || 'no',
+            isDrop      = programOpts.drop,
+            isSingleton = singleton === 'yes',
+            startDate   = new Date(),
+            baseFileName, baseType, classFolder, configName, file, folderDelta, importName, importPath, index, ns, root, rootLowerCase, viewFile;
 
         if (className.endsWith('.mjs')) {
             className = className.slice(0, -4);
@@ -184,8 +206,8 @@ if (programOpts.info) {
             }
 
             if (isDrop !== true) {
-                if (fs.existsSync(path.resolve(__dirname, 'apps', rootLowerCase))) {
-                    classFolder = path.resolve(__dirname, 'apps', rootLowerCase, ns.join('/'));
+                if (fs.existsSync(path.resolve(cwd, 'apps', rootLowerCase))) {
+                    classFolder = path.resolve(cwd, 'apps', rootLowerCase, ns.join('/'));
                 } else {
                     console.log('\nNon existing neo app name:', chalk.red(root));
                     process.exit(1);
@@ -198,17 +220,86 @@ if (programOpts.info) {
 
             fs.mkdirpSync(classFolder);
 
-            fs.writeFileSync(path.join(classFolder, file + '.mjs'), createContent({baseClass, className, file, folderDelta, ns, root}));
+            baseFileName = baseClass.split('.').pop();
+
+            if (baseFileName === file) {
+                baseFileName = baseClass.split('.');
+                baseFileName = baseFileName.map(e => capitalize(e)).join('');
+            }
+
+            fs.writeFileSync(path.join(classFolder, file + '.mjs'), createContent({
+                baseClass,
+                baseFileName,
+                className,
+                isSingleton,
+                file,
+                folderDelta,
+                ns,
+                root
+            }));
+
+            switch(baseClass) {
+                case 'controller.Component': {
+                    baseType   = 'Neo.controller.Component';
+                    configName = 'controller';
+                    importName = file;
+                    importPath = `./${importName}.mjs`;
+                    index      = file.indexOf('Controller');
+
+                    if (index > 0) {
+                        viewFile = path.join(classFolder, file.substr(0, index) + '.mjs');
+
+                        if (fs.existsSync(viewFile)) {
+                            adjustView({baseType, configName, importName, importPath, viewFile});
+                        }
+                    }
+                    break;
+                }
 
-            if (baseClass === 'controller.Component') {
-                index = file.indexOf('Controller');
+                case 'data.Store': {
+                    baseType   = 'Neo.data.Model';
+                    configName = 'model';
+                    importName = className.replace('.store.', '.model.');
 
-                if (index > 0) {
-                    viewFile = path.join(classFolder, file.substr(0, index) + '.mjs');
+                    if (importName.endsWith('ies')) {
+                        importName.replace(new RegExp('ies$'), 'y')
+                    } else {
+                        importName = importName.slice(0, -1);
+                    }
+
+                    viewFile = importName.split('.');
+                    viewFile.shift();
 
+                    importPath = `../${viewFile.join('/')}.mjs`;
+                    viewFile   = path.join(classFolder, importPath);
+
+                    // checking for the data.Model file
                     if (fs.existsSync(viewFile)) {
-                        adjustView({file, viewFile});
+                        // adjusting the data.Store file
+                        viewFile   = path.join(classFolder, file + '.mjs');
+                        importName = importName.split('.');
+                        importName = importName.pop();
+
+                        adjustView({baseType, configName, importName, importPath, viewFile});
                     }
+                    break;
+                }
+
+                case 'model.Component': {
+                    baseType   = 'Neo.model.Component';
+                    configName = 'model';
+                    importName = file;
+                    importPath = `./${importName}.mjs`;
+                    index      = file.indexOf('Model');
+
+                    if (index > 0) {
+                        viewFile = path.join(classFolder, file.substr(0, index) + '.mjs');
+
+                        if (fs.existsSync(viewFile)) {
+                            adjustView({baseType, configName, importName, importPath, viewFile});
+                        }
+                    }
+                    break;
                 }
             }
         }
@@ -222,41 +313,58 @@ if (programOpts.info) {
     /**
      * Adds a comma to the last element of the contentArray
      * @param {String[]} contentArray
+     * @param {Number} index=contentArray.length - 1
      * @returns {String[]}
      */
-    function addComma(contentArray) {
-        contentArray[contentArray.length - 1] += ',';
+    function addComma(contentArray, index=contentArray.length - 1) {
+        contentArray[index] += ',';
         return contentArray;
     }
 
-    function addConfig(contentArray, index, className, isLastConfig) {
+    /**
+     * Adds a config to the given index of the contentArray
+     * @param {Object} opts
+     * @param {String} opts.baseType
+     * @param {String} opts.className
+     * @param {String} opts.configName
+     * @param {String[]} opts.contentArray
+     * @param {Boolean} opts.isLastConfig
+     * @param {Number} opts.index
+     * @returns {String[]}
+     */
+    function addConfig(opts) {
         const config = [
             '        /**',
-            `         * @member {Neo.controller.Component} controller=${className}`,
+            `         * @member {${opts.baseType}} ${opts.configName}=${opts.className}`,
             '         */',
-            `        controller: ${className}`
+            `        ${opts.configName}: ${opts.className}`
         ];
 
-        !isLastConfig && addComma(config);
+        !opts.isLastConfig && addComma(config);
 
-        contentArray.splice(index, 0, config.join(os.EOL));
-        return contentArray;
+        opts.contentArray.splice(opts.index, 0, config.join(os.EOL));
+        return opts.contentArray;
     }
 
     /**
      * Adjusts the views related to controller.Component or model.Component
      * @param {Object} opts
-     * @param {String} opts.file
+     * @param {String} opts.baseType
+     * @param {String} opts.configName
+     * @param {String} opts.importName
+     * @param {String} opts.importPath
      * @param {String} opts.viewFile
      */
     function adjustView(opts) {
-        let file            = opts.file,
+        let baseType        = opts.baseType,
+            configName      = opts.configName,
+            importName      = opts.importName,
             viewFile        = opts.viewFile,
             content         = fs.readFileSync(viewFile).toString().split(os.EOL),
             fromMaxPosition = 0,
             i               = 0,
             len             = content.length,
-            adjustSpaces, className, codeLine, fromPosition, importLength, importName, j, nextLine, spaces;
+            adjustSpaces, className, codeLine, existingImportName, fromPosition, importLength, j, nextLine, spaces;
 
         // find the index where we want to insert our import statement
         for (; i < len; i++) {
@@ -266,16 +374,16 @@ if (programOpts.info) {
                 break;
             }
 
-            importName   = codeLine.substr(7);
-            importName   = importName.substr(0, importName.indexOf(' '));
-            importLength = importName.length;
+            existingImportName = codeLine.substr(7);
+            existingImportName = existingImportName.substr(0, existingImportName.indexOf(' '));
+            importLength       = existingImportName.length;
 
-            if (importName > file) {
+            if (existingImportName > importName) {
                 break;
             }
         }
 
-        content.splice(i, 0, `import ${file} from './${file}.mjs';`);
+        content.splice(i, 0, `import ${importName} from '${opts.importPath}';`);
 
         // find the longest import module name
         for (i=0; i < len; i++) {
@@ -324,7 +432,15 @@ if (programOpts.info) {
             codeLine = content[i];
 
             if (codeLine.includes('}}')) {
-                addConfig(content, i, file, true);
+                addComma(content, i - 1);
+                addConfig({
+                    baseType,
+                    className   : importName,
+                    configName,
+                    contentArray: content,
+                    index       : i,
+                    isLastConfig: true
+                });
                 break;
             }
 
@@ -336,10 +452,17 @@ if (programOpts.info) {
                     continue;
                 }
 
-                if (className > 'controller') {
+                if (className > configName) {
                     for (j=i; j > 0; j--) {
                         if (content[j].includes('/**')) {
-                            addConfig(content, j, file, false);
+                            addConfig({
+                                baseType,
+                                className   : importName,
+                                configName,
+                                contentArray: content,
+                                index       : j,
+                                isLastConfig: false
+                            });
                             break;
                         }
                     }
@@ -351,11 +474,22 @@ if (programOpts.info) {
         fs.writeFileSync(viewFile, content.join(os.EOL));
     }
 
+    /**
+     * Makes the first character of a string uppercase
+     * @param {String} value
+     * @returns {Boolean|String} Returns false for non string inputs
+     */
+    function capitalize(value) {
+        return typeof value === 'string' && value[0].toUpperCase() + value.slice(1);
+    }
+
     /**
      * Creates the content of the neo-class .mjs file
      * @param {Object} opts
      * @param {String} opts.baseClass
+     * @param {String} opts.baseFileName
      * @param {String} opts.className
+     * @param {Boolean} opts.isSingleton
      * @param {String} opts.file
      * @param {String} opts.folderDelta
      * @param {String} opts.ns
@@ -363,24 +497,32 @@ if (programOpts.info) {
      * @returns {String}
      */
     function createContent(opts) {
-        let baseClass    = opts.baseClass,
-            baseClassNs  = baseClass.split('.'),
-            baseFileName = baseClassNs.pop(),
-            className    = opts.className,
-            file         = opts.file,
-            i            = 0,
-            importDelta  = '';
+        let baseClass     = opts.baseClass,
+            baseFileName  = opts.baseFileName,
+            baseClassPath = baseClass.split('.').join('/'),
+            className     = opts.className,
+            isSingleton   = opts.isSingleton,
+            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';`,
+            `import ${baseFileName} from '${importDelta}${(insideNeo ? '' : 'node_modules/neo.mjs/')}src/${baseClassPath}.mjs';`,
             "",
             "/**",
             ` * @class ${className}`,
-            ` * @extends Neo.${baseClass}`,
+            ` * @extends Neo.${baseClass}`
+        ];
+
+        isSingleton && classContent.push(
+            " * @singleton"
+        );
+
+        classContent.push(
             " */",
             `class ${file} extends ${baseFileName} {`,
             "    static getConfig() {return {",
@@ -389,7 +531,17 @@ if (programOpts.info) {
             "         * @protected",
             "         */",
             `        className: '${className}'`
-        ];
+        );
+
+        baseClass === 'data.Model' && addComma(classContent).push(
+            "        /*",
+            "         * @member {Object[]} fields",
+            "         */",
+            "        fields: [{",
+            "            name: 'id',",
+            "            type: 'String'",
+            "        }]"
+        );
 
         baseClass === 'container.Base' && addComma(classContent).push(
             "        /*",
@@ -398,6 +550,14 @@ if (programOpts.info) {
             "        items: []"
         );
 
+        isSingleton && addComma(classContent).push(
+            "        /*",
+            "         * @member {Boolean} singleton=true",
+            "         * @protected",
+            "         */",
+            "        singleton: true"
+        );
+
         baseClass === 'component.Base' && addComma(classContent).push(
             "        /*",
             "         * @member {Object} _vdom",
@@ -411,8 +571,22 @@ if (programOpts.info) {
             "}",
             "",
             `Neo.applyClassConfig(${file});`,
+            ""
+        );
+
+        isSingleton && classContent.push(
+            `let instance = Neo.create(${file});`,
+            "",
+            "Neo.applyToGlobalNs(instance);",
             "",
-            `export default ${file};`,
+            "export default instance;"
+        );
+
+        !isSingleton && classContent.push(
+            `export default ${file};`
+        );
+
+        classContent.push(
             ""
         );
 

package/package.json

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

package/src/core/Util.mjs

@@ -40,11 +40,11 @@ class Util extends Base {
 
     /**
      * Makes the first character of a string uppercase
-     * @param {String} string
+     * @param {String} value
      * @returns {Boolean|String} Returns false for non string inputs
      */
-    static capitalize(string) {
-        return Util.isString(string) && string[0].toUpperCase() + string.slice(1);
+    static capitalize(value) {
+        return Util.isString(value) && value[0].toUpperCase() + value.slice(1);
     }
 
     /**
@@ -100,7 +100,7 @@ class Util extends Base {
     }
 
     /**
-     * Transforms all uppercase characters of a string into lowercase.
+     * Transforms all uppercase characters of a string into -lowercase.
      * Does not touch special characters.
      * @param {String} value The input containing uppercase characters
      * @returns {String} The lowercase output

package/src/form/field/Select.mjs

@@ -463,24 +463,8 @@ class Select extends Picker {
      * @protected
      */
     onListItemClick(record) {
-        let me           = this,
-            displayField = me.displayField,
-            oldValue     = me.value,
-            value        = record[displayField];
-
-        if (me.value !== value) {
-            me.hintRecordId = null;
-            me.record       = record;
-            me._value       = value;
-            me.getInputHintEl().value = null;
-
-            me.afterSetValue(value, oldValue, true); // prevent the list from getting filtered
-
-            me.fire('select', {
-                record,
-                value: record[displayField]
-            });
-        }
+        this.onListItemChange(record);
+        this.hidePicker();
     }
 
     /**
@@ -518,12 +502,38 @@ class Select extends Picker {
         this.focusInputEl();
     }
 
+
+    /**
+     * @param {Object} record
+     * @protected
+     */
+    onListItemChange(record) {
+        let me           = this,
+            displayField = me.displayField,
+            oldValue     = me.value,
+            value        = record[displayField];
+
+        if (me.value !== value) {
+            me.hintRecordId = null;
+            me.record       = record;
+            me._value       = value;
+            me.getInputHintEl().value = null;
+
+            me.afterSetValue(value, oldValue, true); // prevent the list from getting filtered
+
+            me.fire('select', {
+                record,
+                value: record[displayField]
+            });
+        }
+    }
+
     /**
      * @param {Object} record
      * @protected
      */
     onListItemNavigate(record) {
-        this.onListItemClick(record);
+        this.onListItemChange(record);
     }
 
     /**