neo.mjs 4.1.1 → 4.2.1

package/apps/realworld/view/FooterComponent.mjs

@@ -15,12 +15,12 @@ class FooterComponent extends Component {
          * @member {Object} _vdom
          */
         _vdom:
-            {tag: 'footer', cn: [
-                {cls: ['container'], cn: [
-                    {tag: 'a', cls: ['logo-font'], href: '#/', html: 'conduit'},
-                    {tag: 'span', cls: 'attribution', html: 'An interactive learning project from <a href="https://thinkster.io">Thinkster</a>. Code &amp; design licensed under MIT.'}
-                ]}
+        {tag: 'footer', cn: [
+            {cls: ['container'], cn: [
+                {tag: 'a', cls: ['logo-font'], href: '#/', html: 'conduit'},
+                {tag: 'span', cls: 'attribution', html: 'An interactive learning project from <a href="https://thinkster.io">Thinkster</a>. Code &amp; design licensed under MIT.'}
             ]}
+        ]}
     }}
 }
 

package/apps/realworld/view/HeaderComponent.mjs

@@ -36,40 +36,40 @@ class HeaderComponent extends Component {
          * @member {Object} _vdom
          */
         _vdom:
-            {tag: 'nav', cls: ['navbar navbar-light'], cn: [
-                {cls: ['container'], cn: [
-                    {tag: 'a',  cls: ['navbar-brand'], href: '#/', html: 'conduit'},
-                    {tag: 'ul', cls: ['nav navbar-nav', 'pull-xs-right'], cn: [
-                        {tag: 'li', cls: ['nav-item'], cn: [
-                            {tag: 'a', cls: ['nav-link'], href: '#/', html: 'Home'}
-                        ]},
-                        {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
-                            {tag: 'a', cls: ['nav-link'], href: '#/editor', cn: [
-                                {tag: 'i', cls: 'ion-compose'},
-                                {vtype: 'text', html: ' New Article'}
-                            ]}
-                        ]},
-                        {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
-                            {tag: 'a', cls: ['nav-link'], href: '#/settings', cn: [
-                                {tag: 'i', cls: 'ion-gear-a'},
-                                {vtype: 'text', html: ' Settings'}
-                            ]}
-                        ]},
-                        {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
-                            {tag: 'a', cls : ['nav-link'], href: '#/profile', cn: [
-                                {tag: 'img', cls: ['user-pic']},
-                                {vtype: 'text', html: ' Profile'}
-                            ]}
-                        ]},
-                        {tag: 'li', cls: ['nav-item'], cn: [
-                            {tag : 'a', cls : ['nav-link'], href: '#/login', html: 'Sign in'}
-                        ]},
-                        {tag: 'li', cls: ['nav-item'], cn: [
-                            {tag: 'a', cls : ['nav-link'], href: '#/register', html: 'Sign up'}
+        {tag: 'nav', cls: ['navbar navbar-light'], cn: [
+            {cls: ['container'], cn: [
+                {tag: 'a',  cls: ['navbar-brand'], href: '#/', html: 'conduit'},
+                {tag: 'ul', cls: ['nav navbar-nav', 'pull-xs-right'], cn: [
+                    {tag: 'li', cls: ['nav-item'], cn: [
+                        {tag: 'a', cls: ['nav-link'], href: '#/', html: 'Home'}
+                    ]},
+                    {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
+                        {tag: 'a', cls: ['nav-link'], href: '#/editor', cn: [
+                            {tag: 'i', cls: 'ion-compose'},
+                            {vtype: 'text', html: ' New Article'}
                         ]}
+                    ]},
+                    {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
+                        {tag: 'a', cls: ['nav-link'], href: '#/settings', cn: [
+                            {tag: 'i', cls: 'ion-gear-a'},
+                            {vtype: 'text', html: ' Settings'}
+                        ]}
+                    ]},
+                    {tag: 'li', cls: ['nav-item'], removeDom: true, cn: [
+                        {tag: 'a', cls : ['nav-link'], href: '#/profile', cn: [
+                            {tag: 'img', cls: ['user-pic']},
+                            {vtype: 'text', html: ' Profile'}
+                        ]}
+                    ]},
+                    {tag: 'li', cls: ['nav-item'], cn: [
+                        {tag : 'a', cls : ['nav-link'], href: '#/login', html: 'Sign in'}
+                    ]},
+                    {tag: 'li', cls: ['nav-item'], cn: [
+                        {tag: 'a', cls : ['nav-link'], href: '#/register', html: 'Sign up'}
                     ]}
                 ]}
             ]}
+        ]}
     }}
 
     /**

package/apps/realworld/view/HomeComponent.mjs

@@ -280,8 +280,8 @@ class HomeComponent extends Component {
                 cls: ['nav-item'],
                 id : me.id + '__nav-item_' + index,
                 cn : [{
-                    tag: 'a',
-                    cls: cls,
+                    tag : 'a',
+                    cls : cls,
                     href: '',
                     html: item.name,
                     id  : me.id + '__nav-item-link_' + index,
@@ -447,12 +447,12 @@ class HomeComponent extends Component {
         if (feeds.length < 3) {
             feeds.push({
                 active: true,
-                name  : name
+                name
             });
         } else {
             Object.assign(feeds[2], {
                 active: true,
-                name  : name
+                name
             });
         }
 

package/apps/realworld/view/MainContainerController.mjs

@@ -144,7 +144,7 @@ class MainContainerController extends ComponentController {
      */
     getArticle(slug) {
         return ArticleApi.get({
-            slug: slug
+            slug
         });
     }
 
@@ -406,9 +406,9 @@ class MainContainerController extends ComponentController {
             module = await module();
 
             me[key] = Neo.create({
-                module   : module.default,
-                parentId : me.component.id,
-                reference: reference
+                module  : module.default,
+                parentId: me.component.id,
+                reference
             });
         }
 

package/apps/realworld/view/article/Component.mjs

@@ -233,8 +233,8 @@ class Component extends BaseComponent {
 
                 VDomUtil.getByFlag(vdom, 'body').cn[0] = {
                     cn: [{
-                        tag : 'p',
-                        html: html
+                        tag: 'p',
+                        html
                     }]
                 };
 

package/apps/realworld/view/article/PreviewComponent.mjs

@@ -267,7 +267,7 @@ class PreviewComponent extends Component {
             favorited = !me.favorited;
 
         me.set({
-            favorited     : favorited,
+            favorited,
             favoritesCount: favorited ? (me.favoritesCount + 1) : (me.favoritesCount - 1)
         });
     }

package/apps/realworld/view/article/TagListComponent.mjs

@@ -78,8 +78,8 @@ class TagListComponent extends Component {
     afterSetActiveTag(value, oldValue) {
         if (oldValue !== undefined) {
             this.fire('tagChange', {
-                oldValue: oldValue,
-                value   : value
+                oldValue,
+                value
             });
         }
     }

package/apps/realworld2/view/MainContainer.mjs

@@ -46,7 +46,7 @@ class MainContainer extends Viewport {
             ntype    : 'container',
             flex     : 1,
             items    : [],
-            layout   : {ntype: 'card'},
+            layout   : {ntype: 'card', activeIndex: null},
             reference: 'cards'
         }, {
             module: FooterComponent

package/apps/realworld2/view/MainContainerController.mjs

@@ -209,8 +209,8 @@ class MainContainerController extends ComponentController {
 
         if (!card) {
             card = me.getReference('cards').add({
-                module   : module,
-                reference: reference
+                module,
+                reference
             });
         }
 

package/buildScripts/addConfig.mjs

@@ -0,0 +1,400 @@
+#!/usr/bin/env node
+
+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')),
+    program     = new Command(),
+    programName = `${packageJson.name} add-config`;
+
+/**
+ * Adds a comma to the last element of the contentArray
+ * @param {String[]} contentArray
+ * @param {Number} index=contentArray.length - 1
+ * @returns {String[]}
+ */
+function addComma(contentArray, index=contentArray.length - 1) {
+    contentArray[index] += ',';
+    return contentArray;
+}
+
+/**
+ * Adds a config to the given index of the contentArray
+ * @param {Object} opts
+ * @param {String} opts.configName
+ * @param {String} opts.defaultValue
+ * @param {String[]} opts.contentArray
+ * @param {Boolean} opts.isLastConfig
+ * @param {Number} opts.index
+ * @param {String} opts.type
+ * @returns {String[]}
+ */
+function addConfig(opts) {
+    if (opts.type === 'String' && opts.defaultValue !== 'null') {
+        opts.defaultValue = `'${opts.defaultValue}'`;
+    }
+
+    const config = [
+        '        /**',
+        `         * @member {${opts.type}} ${opts.configName}_=${opts.defaultValue}`,
+        '         */',
+        `        ${opts.configName}_: ${opts.defaultValue}`
+    ];
+
+    !opts.isLastConfig && addComma(config);
+
+    opts.contentArray.splice(opts.index, 0, config.join(os.EOL));
+    return opts.contentArray;
+}
+
+/**
+ * Adds a config hook at the matching index
+ * @param {Object} opts
+ * @param {String} opts.comment
+ * @param {String[]} opts.contentArray
+ * @param {String} opts.name
+ * @param {Boolean} opts.oldValueParam
+ * @param {Boolean} opts.returnValue
+ * @param {String} opts.type
+ * @returns {String[]}
+ */
+function addHook(opts) {
+    let contentArray = opts.contentArray,
+        i            = 0,
+        inserted     = false,
+        name         = opts.name,
+        len          = contentArray.length,
+        type         = opts.type,
+        j, methodName, nextLine,
+
+    method = [
+        '',
+        '    /**',
+        `     * ${opts.comment}`,
+        `     * @param {${type}} value`
+    ];
+
+    if (opts.oldValueParam) {
+        method.push(
+        `     * @param {${type}} oldValue`
+        );
+    }
+
+    if (opts.returnValue) {
+        method.push(
+        `     * @returns {${type}}`
+        );
+    }
+
+    method.push(
+        '     * @protected',
+        '     */'
+    );
+
+    if (opts.oldValueParam) {
+        method.push(
+        `    ${name}(value, oldValue) {`
+        );
+    } else {
+        method.push(
+        `    ${name}(value) {`
+        );
+    }
+
+    if (opts.returnValue) {
+        method.push(
+        '        return value;'
+        );
+    } else {
+        method.push(
+        '        '
+        );
+    }
+
+    method.push(
+        '    }'
+    );
+
+    for (; i < len; i++) {
+        if (contentArray[i].includes('}}')) {
+            break;
+        }
+    }
+
+    for (; i < len; i++) {
+        if (contentArray[i].includes('*/')) {
+            nextLine   = contentArray[i + 1]
+            methodName = nextLine.substring(0, nextLine.indexOf('(')).trim();
+
+            if (methodName === 'construct') {
+                continue;
+            }
+
+            if (methodName > name) {
+                for (j=i; j > 0; j--) {
+                    if (contentArray[j].includes('/**')) {
+                        contentArray.splice(j - 1, 0, method.join(os.EOL));
+                        inserted = true;
+                        break;
+                    }
+                }
+                break;
+            }
+        }
+    }
+
+    if (!inserted) {
+        for (i=contentArray.length - 1; i > 0; i--) {
+            if (contentArray[i].includes('}')) {
+                contentArray.splice(i, 0, method.join(os.EOL));
+                break;
+            }
+        }
+    }
+
+    return contentArray;
+}
+
+
+/**
+ * Makes the first character of a string uppercase
+ * @param {String} value
+ * @returns {Boolean|String} Returns false for non string inputs
+ */
+function capitalize(value) {
+    return value[0].toUpperCase() + value.slice(1);
+}
+
+program
+    .name(programName)
+    .version(packageJson.version)
+    .option('-i, --info', 'print environment debug info')
+    .option('-c, --className <value>')
+    .option('-d, --defaultValue <value>')
+    .option('-h, --hooks <value>')
+    .option('-n, --configName <value>')
+    .option('-t, --type <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 ${cwd}`);
+
+    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));
+
+    let answers = {},
+        answer;
+
+    if (!programOpts.className) {
+        answer = await inquirer.prompt({
+            type   : 'input',
+            name   : 'className',
+            message: 'Please choose the namespace of your class:',
+            default: 'Covid.view.MainContainer'
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    let className = programOpts.className || answers.className,
+        ns        = className.split('.'),
+        root      = ns.shift().toLowerCase(),
+        classPath = path.resolve(cwd, root === 'neo' ? 'src' : `apps/${root}`, `${ns.join('/')}.mjs`);
+
+    if (!fs.existsSync(path.resolve(classPath))) {
+        console.log(chalk.red(`File not found for ${className} => ${classPath}`));
+        process.exit(1);
+    }
+
+    if (!programOpts.configName) {
+        answer = await inquirer.prompt({
+            type   : 'input',
+            name   : 'configName',
+            message: 'Please enter a name for your class config:'
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    let configName = programOpts.configName || answers.configName;
+
+    if (configName.endsWith('_')) {
+        configName = configName.slice(0, -1);
+    }
+
+    let uConfigName = capitalize(configName);
+
+    if (!programOpts.type) {
+        answer = await inquirer.prompt({
+            type   : 'list',
+            name   : 'type',
+            message: 'Please choose a type for your class config:',
+            default: 'Custom',
+            choices: [
+                'Custom',
+                'Object',
+                'Object[]',
+                'Number',
+                'Number[]',
+                'String',
+                'String[]'
+            ]
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    if (answers.type === 'Custom') {
+        answer = await inquirer.prompt({
+            type   : 'input',
+            name   : 'type',
+            message: 'Please enter the type for your class config:'
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    if (!programOpts.defaultValue) {
+        answer = await inquirer.prompt({
+            type   : 'input',
+            name   : 'defaultValue',
+            message: 'Please enter a defaultValue:',
+            default: 'null'
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    if (!programOpts.hooks) {
+        answer = await inquirer.prompt({
+            type   : 'checkbox',
+            name   : 'hooks',
+            message: 'Please choose the hooks for your class config:',
+            choices: [`afterSet${uConfigName}()`, `beforeGet${uConfigName}()`, `beforeSet${uConfigName}()`],
+            default: [`afterSet${uConfigName}()`]
+        });
+
+        Object.assign(answers, answer);
+    }
+
+    let defaultValue = programOpts.defaultValue || answers.defaultValue,
+        hooks        = programOpts.hooks        || answers.hooks,
+        type         = programOpts.type         || answers.type,
+        contentArray = fs.readFileSync(classPath).toString().split(os.EOL),
+        i            = 0,
+        len          = contentArray.length,
+        codeLine, existingConfigName, j, nextLine;
+
+    for (; i < len; i++) {
+        if (contentArray[i].includes('static getConfig')) {
+            break;
+        }
+    }
+
+    for (; i < len; i++) {
+        codeLine = contentArray[i];
+
+        if (codeLine.includes('}}')) {
+            addComma(contentArray, i - 1);
+            addConfig({
+                configName,
+                defaultValue,
+                contentArray,
+                index       : i,
+                isLastConfig: true,
+                type
+            });
+            break;
+        }
+
+        if (codeLine.includes('*/')) {
+            nextLine           = contentArray[i + 1]
+            existingConfigName = nextLine.substring(0, nextLine.indexOf(':')).trim();
+
+            if (existingConfigName === 'className' || existingConfigName === 'ntype') {
+                continue;
+            }
+
+            if (existingConfigName > configName) {
+                for (j=i; j > 0; j--) {
+                    if (contentArray[j].includes('/**')) {
+                        addConfig({
+                            configName,
+                            contentArray,
+                            defaultValue,
+                            index       : j,
+                            isLastConfig: false,
+                            type
+                        });
+                        break;
+                    }
+                }
+                break;
+            }
+        }
+    }
+
+    if (hooks.includes(`afterSet${uConfigName}()`)) {
+        addHook({
+            comment      : `Triggered after the ${configName} config got changed`,
+            contentArray,
+            name         : `afterSet${uConfigName}`,
+            oldValueParam: true,
+            returnValue  : false,
+            type
+        });
+    }
+
+    if (hooks.includes(`beforeGet${uConfigName}()`)) {
+        addHook({
+            comment      : `Gets triggered when accessing the value of the ${configName} config`,
+            contentArray,
+            name         : `beforeGet${uConfigName}`,
+            oldValueParam: false,
+            returnValue  : true,
+            type
+        });
+    }
+
+    if (hooks.includes(`beforeSet${uConfigName}()`)) {
+        addHook({
+            comment      : `Triggered before the ${configName} config gets changed`,
+            contentArray,
+            name         : `beforeSet${uConfigName}`,
+            oldValueParam: true,
+            returnValue  : true,
+            type
+        });
+    }
+
+    fs.writeFileSync(classPath, contentArray.join(os.EOL));
+}

package/buildScripts/createApp.mjs

@@ -221,16 +221,16 @@ if (programOpts.info) {
                 " */",
                 "class MainContainer extends Viewport {",
                 "    static getConfig() {return {",
-                "        /*",
+                "        /**",
                 "         * @member {String} className='" + appName + ".view.MainContainer'",
                 "         * @protected",
                 "         */",
                 "        className: '" + appName + ".view.MainContainer',",
-                "        /*",
+                "        /**",
                 "         * @member {Boolean} autoMount=true",
                 "         */",
                 "        autoMount: true,",
-                "        /*",
+                "        /**",
                 "         * @member {Object[]} items",
                 "         */",
                 "        items: [{",